/* ================= Norial — camada de charme ================= */
:root{
  --surface:#fff; --on-surface:var(--ink); --surface-2:#edf2f5;
  --ink-text:var(--ink); --muted-text:var(--muted); --mineral-text:var(--mineral);
  --ring-w:34px; --dot-w:8px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --surface:#12181c; --on-surface:#eef1ee; --surface-2:#1f2a30;
    --ink-text:#eef1ee; --muted-text:#a7b3b6; --mineral-text:#a8c8db; }
}
:root[data-theme="dark"]{ --surface:#12181c; --on-surface:#eef1ee; --surface-2:#1f2a30;
  --ink-text:#eef1ee; --muted-text:#a7b3b6; --mineral-text:#a8c8db; }
body{ background:var(--surface); color:var(--on-surface); }
.content-art{ background:var(--surface-2) !important; }
.button-dark{ box-shadow:0 0 0 1px transparent inset; }

/* text that needs to stay legible when the page surface flips to ink */
.hero-baseline a, .disciplines, .about-copy .about-lead, .menu-toggle{ color:var(--ink-text); }
.hero-baseline, .section-heading > p, .project-caption p, .summary-note, .case-body p:not(.eyebrow),
figcaption, .about-copy p, .process-grid p, .footer-top p, .footer-bottom, .back-top{ color:var(--muted-text); }
.hero .eyebrow, .section-heading .eyebrow, .about > .eyebrow, .case-body .eyebrow, h1 em, .text-link:hover, .step{ color:var(--mineral-text); }
:focus-visible{ outline-color:var(--mineral-text); }
.hero-showcase figcaption{ color:var(--muted-text); }

/* logo swaps for legibility on a dark surface */
.logo-light-variant{ display:none; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .logo-ink-variant{ display:none; }
  :root:not([data-theme="light"]) .logo-light-variant{ display:block; }
}
:root[data-theme="dark"] .logo-ink-variant{ display:none; }
:root[data-theme="dark"] .logo-light-variant{ display:block; }

/* progress bar */
.scroll-progress{ position:fixed; top:0; left:0; height:3px; width:0%; background:var(--mineral); z-index:60; transition:width .1s linear; }

/* theme toggle */
.theme-toggle{ border:1px solid var(--line); border-radius:50%; width:40px; height:40px; display:grid; place-items:center; background:transparent; color:inherit; flex-shrink:0; transition:background .2s, transform .3s; font-size:.9rem; }
.theme-toggle:hover{ background:var(--accent); transform:rotate(20deg); }

/* custom cursor (fine pointers only, motion allowed) */
.cursor-dot,.cursor-ring{ position:fixed; top:0; left:0; border-radius:50%; pointer-events:none; z-index:70; transform:translate3d(-50%,-50%,0); mix-blend-mode:difference; }
.cursor-dot{ width:var(--dot-w); height:var(--dot-w); background:var(--accent); transition:width .2s,height .2s; }
.cursor-ring{ width:var(--ring-w); height:var(--ring-w); border:1px solid var(--mist); transition:width .25s,height .25s,border-color .25s,opacity .25s; }
.cursor-hover .cursor-ring{ width:56px; height:56px; border-color:var(--accent); }
.cursor-hover .cursor-dot{ width:4px; height:4px; }
body.has-fine-pointer{ cursor:none; }
body.has-fine-pointer a, body.has-fine-pointer button{ cursor:none; }

/* magnetic pull targets */
[data-magnet]{ transition:transform .25s cubic-bezier(.2,.7,.2,1); will-change:transform; }

/* tilt targets */
.project-art{ transform-style:preserve-3d; transition:transform .4s cubic-bezier(.2,.7,.2,1); }

/* paper-chip burst */
.chip-layer{ position:fixed; inset:0; pointer-events:none; z-index:65; overflow:hidden; }
.paper-chip{ position:absolute; width:10px; height:14px; opacity:.95; animation:chip-fly var(--dur,900ms) cubic-bezier(.15,.7,.25,1) forwards; }
@keyframes chip-fly{
  to{ transform:translate(var(--tx),var(--ty)) rotate(var(--rot)); opacity:0; }
}

/* back to top */
.back-to-top{ position:fixed; right:24px; bottom:24px; width:52px; height:52px; border-radius:50%; background:var(--ink); color:var(--paper); display:grid; place-items:center; z-index:55; border:0; opacity:0; transform:translateY(12px) scale(.85); transition:opacity .3s,transform .3s; }
.back-to-top.is-visible{ opacity:1; transform:none; }
.back-to-top:hover{ background:var(--mineral); }

@media (prefers-reduced-motion: reduce){
  .cursor-dot,.cursor-ring{ display:none; }
  body.has-fine-pointer{ cursor:auto; }
  .paper-chip{ display:none; }
  .project-art{ transition:none; }
}
@media (max-width:760px){
  .back-to-top{ right:16px; bottom:16px; width:46px; height:46px; }
}

/* ---- hero showcase: replaces the paper-sculpture photo with the actual work ---- */
.hero-showcase{ position:absolute; width:58%; right:0; top:6%; margin:0; z-index:1; }
.browser-mock{ position:relative; background:var(--paper); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  box-shadow:0 44px 90px -32px rgba(29,41,47,.4); transform:translate3d(var(--art-x,0px),var(--art-y,0px),0); transition:transform .65s cubic-bezier(.2,.65,.3,1); }
.browser-bar{ display:flex; align-items:center; gap:7px; padding:13px 16px; border-bottom:1px solid var(--line); }
.browser-bar i{ width:8px; height:8px; border-radius:50%; background:var(--line); display:block; }
.browser-url{ margin-left:10px; font-size:.6875rem; color:var(--muted-text); background:var(--surface-2); padding:4px 12px; border-radius:100px; }
.browser-slides{ position:relative; aspect-ratio:16/10.5; }
.b-slide{ position:absolute; inset:0; padding:26px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .4s, transform .4s, visibility 0s; }
.b-slide.is-active{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.b-slide--editorial{ display:grid; grid-template-columns:1.1fr 1fr; gap:22px; align-items:center; }
.b-slide--loja{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; align-content:center; height:100%; }
.b-slide--portfolio{ display:grid; grid-template-columns:1.3fr 1fr; grid-template-rows:1fr 1fr; gap:10px; height:100%; }
.b-slide--minimal{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; height:100%; text-align:center; }
.sk-lines i{ display:block; height:9px; border-radius:4px; background:var(--line); margin-bottom:10px; }
.sk-photo{ border-radius:9px; background:linear-gradient(135deg,var(--mist),var(--surface-2)); aspect-ratio:4/3; }
.sk-photo.tall{ aspect-ratio:auto; height:100%; grid-row:span 2; }
.sk-photo.small{ aspect-ratio:1; }
.sk-card i{ display:block; height:6px; border-radius:3px; background:var(--line); margin-top:8px; }
.sk-circle{ width:48px; height:48px; border-radius:50%; background:var(--mineral); }
.sk-pill{ width:120px; height:30px; border-radius:100px; background:var(--ink); }
.browser-dots{ display:flex; gap:9px; padding:14px 18px 18px; }
.browser-dots button{ width:8px; height:8px; padding:0; border:0; border-radius:50%; background:var(--line); transition:background .2s, transform .2s; }
.browser-dots button.is-active{ background:var(--mineral); transform:scale(1.35); }
.phone-mock{ position:absolute; width:26%; left:-2%; bottom:15%; z-index:2; pointer-events:none;
  transform:translate3d(calc(var(--art-x,0px) * -1.6),calc(var(--art-y,0px) * -1.6),0) rotate(-6deg); transition:transform .65s cubic-bezier(.2,.65,.3,1); }
.phone-post{ background:var(--paper); border:1px solid var(--line); border-radius:20px; box-shadow:0 30px 60px -22px rgba(29,41,47,.45); padding:16px; }
.phone-post-head{ display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.phone-post-head .lines{ flex:1; }
.phone-post-head .lines i{ display:block; height:6px; border-radius:3px; background:var(--line); margin-bottom:6px; }
.phone-post-head .lines i:last-child{ width:55%; margin-bottom:0; }
.phone-post-media{ aspect-ratio:4/3; border-radius:11px; background:linear-gradient(135deg,var(--mist),var(--surface-2)); margin-bottom:12px; }
.phone-post-actions{ display:flex; gap:16px; align-items:center; font-size:.75rem; color:var(--muted-text); }
.phone-post-actions .like{ color:var(--ink-text); font-weight:600; display:flex; gap:5px; align-items:center; }
.hero-showcase figcaption{ display:flex; justify-content:space-between; gap:24px; margin:0 9% 0 0; padding-top:14px; font-size:.6875rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted-text); }
@media (min-width:1601px){ .hero-showcase{ top:2%; } }
@media (max-width:1100px) and (min-width:761px){ .hero-showcase{ top:8%; width:56%; } }
@media (max-width:760px){
  .hero-showcase{ position:relative; top:auto; right:auto; width:100%; margin:8px 0 56px; }
  .phone-mock{ width:32%; left:-2%; bottom:10%; }
  .hero-showcase figcaption{ margin-right:0; }
}

/* skeleton widths: real classes instead of inline style="" so the strict
   Content-Security-Policy in _headers (style-src 'self') keeps applying */
.b-slide--editorial .sk-lines i:nth-child(1){ width:78%; }
.b-slide--editorial .sk-lines i:nth-child(2){ width:60%; }
.b-slide--editorial .sk-lines i:nth-child(3){ width:44%; }
.b-slide--loja .sk-card:nth-child(1) i:nth-of-type(1){ width:70%; }
.b-slide--loja .sk-card:nth-child(1) i:nth-of-type(2){ width:40%; }
.b-slide--loja .sk-card:nth-child(2) i:nth-of-type(1){ width:60%; }
.b-slide--loja .sk-card:nth-child(2) i:nth-of-type(2){ width:35%; }
.b-slide--loja .sk-card:nth-child(3) i:nth-of-type(1){ width:65%; }
.b-slide--loja .sk-card:nth-child(3) i:nth-of-type(2){ width:30%; }
.b-slide--minimal .sk-lines i:nth-child(1){ width:160px; }
.b-slide--minimal .sk-lines i:nth-child(2){ width:110px; }
.phone-post-head .avatar-chip{ width:26px; height:26px; background:var(--accent); }

/* ---- revision 04: more air, no collisions, and real-looking carousel models ---- */
.hero{
  display:grid;
  grid-template-columns:minmax(420px,.82fr) minmax(560px,1.18fr);
  column-gap:clamp(56px,7vw,120px);
  align-items:center;
  padding-top:clamp(80px,7.5vw,128px);
}
.hero-copy{ grid-column:1; grid-row:1; align-self:center; padding-bottom:0; }
.hero h1{ font-size:clamp(5.25rem,7.25vw,8.2rem); }
.hero-showcase{
  position:relative;
  grid-column:2;
  grid-row:1;
  align-self:center;
  width:auto;
  right:auto;
  top:auto;
  margin:0;
}
.hero-baseline{ grid-column:1 / -1; margin-top:clamp(88px,8vw,136px); }

.browser-slides{ min-height:390px; }
.b-slide{ padding:clamp(24px,3vw,46px); }
.mini-kicker{
  display:block;
  color:#466479;
  font-size:.6rem;
  font-weight:700;
  letter-spacing:.14em;
  line-height:1.4;
  text-transform:uppercase;
}
.mini-editorial-copy{
  align-self:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:72%;
  padding:clamp(22px,3vw,38px);
  color:#1d292f;
  background:#f3f7f8;
  border:1px solid #dfe7ea;
  border-radius:12px;
}
.mini-editorial-copy strong{
  display:block;
  max-width:10ch;
  margin-top:16px;
  font-family:Newsreader,Georgia,serif;
  font-size:clamp(1.6rem,2.55vw,2.85rem);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.045em;
  line-height:.96;
}
.mini-editorial-copy small{ color:#68767d; font-size:.62rem; letter-spacing:.04em; }
.mini-rule{ display:block; width:54px; height:2px; margin:22px 0 12px; background:#9fba54; }
.sk-photo{ position:relative; overflow:hidden; }
.editorial-cover{
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto 1fr auto;
  min-height:100%;
  padding:22px;
  color:#fff;
  background:
    radial-gradient(circle at 68% 28%,rgba(221,231,184,.95) 0 12%,transparent 12.5%),
    linear-gradient(145deg,#1d292f 0 44%,#466479 44% 72%,#d89068 72%);
}
.editorial-cover > img,
.portfolio-main > img,
.portfolio-tile > img,
.phone-post-media > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
}
.editorial-cover > img{ z-index:0; filter:saturate(.82) contrast(1.04); }
.editorial-cover::before{
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,rgba(29,41,47,.08),rgba(29,41,47,.18) 48%,rgba(29,41,47,.7));
}
.editorial-cover::after{
  content:'';
  position:absolute;
  width:58%;
  aspect-ratio:1;
  right:-14%;
  bottom:10%;
  border:1px solid rgba(255,255,255,.7);
  border-radius:50%;
}
.editorial-cover > *:not(img){ position:relative; z-index:2; }
.editorial-cover span{
  grid-column:1 / -1;
  justify-self:start;
  padding:6px 10px;
  background:rgba(29,41,47,.76);
  border:1px solid rgba(255,255,255,.22);
  border-radius:100px;
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.editorial-cover b{ grid-column:2; grid-row:3; align-self:end; font-family:Newsreader,Georgia,serif; font-size:clamp(2rem,3vw,3.2rem); font-style:italic; font-weight:400; line-height:.8; }
.editorial-cover small{ grid-column:1; grid-row:3; align-self:end; max-width:15ch; font-size:.58rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }

.b-slide--loja{ padding-inline:clamp(24px,3.5vw,54px); align-items:center; }
.sk-card{
  position:relative;
  min-width:0;
  aspect-ratio:4 / 5;
  overflow:hidden;
  color:#fff;
  border-radius:12px;
  box-shadow:0 12px 28px rgba(29,41,47,.14);
}
.sk-card .sk-photo{
  position:absolute;
  inset:0;
  display:block;
  aspect-ratio:auto;
  padding:14px;
  border-radius:inherit;
}
.sk-card .sk-photo::after{ display:none; }
.product-photo{
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  filter:saturate(.94) contrast(1.03);
  transform:scale(1.03);
}
.sk-card .sk-photo::before{
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,rgba(29,41,47,.15),transparent 44%,rgba(29,41,47,.82));
}
.sk-card .sk-photo > *:not(img){ position:relative; z-index:2; }
.sk-card .sk-photo span{
  display:inline-flex;
  padding:5px 8px;
  color:#fff;
  background:rgba(29,41,47,.68);
  border:1px solid rgba(255,255,255,.2);
  border-radius:100px;
  font-size:.54rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.sk-card > strong{ position:absolute; z-index:3; left:14px; right:12px; bottom:28px; overflow:hidden; color:#fff; font-size:.74rem; font-weight:600; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 1px 12px rgba(0,0,0,.35); }
.sk-card > small{ position:absolute; z-index:3; left:14px; right:12px; bottom:12px; color:rgba(255,255,255,.78); font-size:.54rem; line-height:1.2; }
.product-clay{ color:#573429; background:linear-gradient(145deg,#f2c7a8,#d89068); }
.product-blue{ color:#eef1ee; background:linear-gradient(145deg,#466479,#1d292f); }
.product-lime{ color:#1d292f; background:linear-gradient(145deg,#eef3d9,#c9db84); }

.portfolio-main{
  display:block;
  padding:22px;
  color:#fff;
  background:linear-gradient(160deg,#6b3b65,#3a244e 58%,#1d292f 58%);
}
.portfolio-main > img{ z-index:0; object-position:center 42%; filter:saturate(.78) contrast(1.05); }
.portfolio-main::before{ display:none; }
.portfolio-main::after{
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,rgba(29,41,47,.12),rgba(29,41,47,.08) 45%,rgba(29,41,47,.82));
}
.portfolio-main > *:not(img),.portfolio-tile > *:not(img){ position:absolute; z-index:2; left:18px; right:18px; }
.portfolio-main span,.portfolio-tile span{
  top:18px;
  right:auto;
  width:max-content;
  padding:5px 8px;
  background:rgba(29,41,47,.7);
  border:1px solid rgba(255,255,255,.2);
  border-radius:100px;
  font-size:.54rem;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.portfolio-main strong,.portfolio-tile strong{ bottom:38px; color:#fff; font-family:Manrope,Arial,sans-serif; font-size:clamp(.9rem,1.65vw,1.45rem); font-style:normal; font-weight:600; line-height:1.05; letter-spacing:-.045em; text-shadow:0 1px 14px rgba(0,0,0,.35); }
.portfolio-main small,.portfolio-tile small{ bottom:19px; color:rgba(255,255,255,.78); font-size:.56rem; line-height:1.2; }
.portfolio-tile{ display:block; padding:16px; color:#fff; }
.portfolio-tile > img{ z-index:0; filter:saturate(.75) contrast(1.05); }
.portfolio-tile::after{ content:''; position:absolute; z-index:1; inset:0; background:linear-gradient(180deg,rgba(29,41,47,.18),rgba(29,41,47,.68)); }
.portfolio-tile--blue{ background:linear-gradient(135deg,#3e7d92,#77b5c6); }
.portfolio-tile--lime{ color:#fff; background:linear-gradient(135deg,#dde7b8,#acc96d); }

.b-slide--minimal{
  color:#1d292f;
  background:linear-gradient(180deg,#fbfcfb,#f1f5f6);
}
.b-slide--minimal::before,.b-slide--minimal::after{
  content:'';
  position:absolute;
  width:34%;
  aspect-ratio:1;
  border:1px solid #d4dcdf;
  border-radius:50%;
}
.b-slide--minimal::before{ left:-11%; top:-20%; }
.b-slide--minimal::after{ right:-10%; bottom:-24%; }
.b-slide--minimal > *{ position:relative; z-index:1; }
.b-slide--minimal .sk-circle{ display:grid; place-items:center; width:58px; height:58px; color:#fff; }
.b-slide--minimal .sk-circle span{ font-family:Newsreader,Georgia,serif; font-size:1.65rem; font-style:italic; }
.b-slide--minimal > strong{ font-size:clamp(1.15rem,2.2vw,2rem); font-weight:500; line-height:1.08; letter-spacing:-.045em; }
.b-slide--minimal > strong em{ color:#466479; }
.b-slide--minimal .sk-pill{ display:flex; align-items:center; justify-content:space-between; width:154px; height:auto; padding:9px 10px 9px 16px; color:#fff; font-size:.58rem; }
.b-slide--minimal .sk-pill span{ font-size:.8rem; }

.phone-post-media{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:14px;
  color:#fff;
  background:linear-gradient(145deg,#466479 0 62%,#1d292f 62%);
}
.phone-post-media > img{ z-index:0; object-position:center 38%; filter:saturate(.72) contrast(1.06); }
.phone-post-media::before{
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(180deg,rgba(29,41,47,.08),rgba(29,41,47,.72));
}
.phone-post-media::after{
  display:none;
}
.phone-post-media > *:not(img){ position:relative; z-index:2; }
.phone-post-media span{ align-self:flex-start; padding:4px 7px; color:#1d292f; background:#dde7b8; border-radius:100px; font-size:.42rem; font-weight:700; letter-spacing:.12em; }
.phone-post-media strong{ align-self:flex-start; padding:5px 7px; color:#fff; background:rgba(29,41,47,.72); border-radius:6px; font-family:Newsreader,Georgia,serif; font-size:clamp(.8rem,1.4vw,1.1rem); font-style:italic; font-weight:400; line-height:.96; }
.phone-post-media i{ align-self:flex-end; color:#dde7b8; font-family:Newsreader,Georgia,serif; font-size:1.1rem; }

/* A calmer vertical rhythm keeps every section visually separate. */
.projects{ padding-top:clamp(144px,11vw,200px); }
.section-heading{ margin-bottom:clamp(64px,6vw,96px); }
.project-grid{ gap:clamp(40px,4vw,72px); }
.project-content{ padding-top:clamp(96px,9vw,156px); }
.case-study{ margin-top:clamp(80px,7vw,120px); }
.case-body{ padding-block:32px 64px; }
.services{ margin-top:clamp(104px,9vw,160px); padding-block:clamp(112px,9vw,160px) clamp(88px,7vw,128px); }
.services .section-heading{ margin-bottom:clamp(72px,6vw,104px); }
.service{ gap:clamp(24px,3vw,48px); padding-block:clamp(44px,4vw,60px); }
.service-panel{ margin-top:18px; padding-top:28px; }
.about{ padding-block:clamp(144px,11vw,200px) clamp(112px,9vw,160px); }
.about-content{ gap:clamp(64px,10vw,160px); }
.about-copy p{ margin-bottom:28px; }
.principles{ margin-top:clamp(72px,7vw,112px); padding-top:40px; }
.process{ padding-top:clamp(56px,5vw,88px); padding-bottom:clamp(136px,10vw,184px); }
.process-grid{ gap:clamp(48px,5vw,80px); }
.contact-inner{ padding-block:clamp(112px,9vw,156px); gap:clamp(56px,8vw,120px); }
.footer{ padding-top:56px; }

@media (max-width:1240px) and (min-width:761px){
  .hero{ grid-template-columns:minmax(0,1fr); padding-top:80px; }
  .hero-copy{ grid-column:1; grid-row:1; max-width:780px; }
  .hero h1{ font-size:clamp(5.5rem,10vw,8rem); }
  .hero-showcase{ grid-column:1; grid-row:2; width:min(88%,960px); margin:80px 0 0 auto; }
  .hero-baseline{ grid-column:1; grid-row:3; margin-top:96px; }
  .service{
    grid-template-columns:36px minmax(220px,.85fr) minmax(260px,1.15fr);
    row-gap:28px;
  }
  .service-number{ grid-column:1; grid-row:1; }
  .service-title{ grid-column:2; grid-row:1; }
  .service-copy{ grid-column:3; grid-row:1 / span 2; }
  .service-trigger{ grid-column:2; grid-row:2; justify-self:start; align-self:start; }
  .service-index{ display:none; }
  .service-panel{ grid-column:2 / 4; }
}

@media (max-width:760px){
  .hero{ display:grid; grid-template-columns:minmax(0,1fr); padding-top:56px; }
  .hero-copy{ grid-column:1; grid-row:1; }
  .hero h1{ font-size:clamp(3.7rem,15vw,5.5rem); }
  .hero-showcase{ grid-column:1; grid-row:2; width:100%; margin:64px 0 72px; }
  .hero-baseline{ grid-column:1; grid-row:3; margin-top:0; }
  .browser-slides{ min-height:0; aspect-ratio:1.18; }
  .b-slide{ padding:20px; }
  .b-slide--editorial{ gap:14px; }
  .mini-editorial-copy{ min-height:72%; padding:16px; border-radius:9px; }
  .mini-editorial-copy strong{ margin-top:10px; font-size:clamp(1.05rem,4.6vw,1.65rem); }
  .mini-editorial-copy small{ font-size:.48rem; }
  .mini-rule{ margin:12px 0 8px; }
  .editorial-cover{ padding:15px; }
  .editorial-cover span{ padding:4px 7px; font-size:.43rem; }
  .editorial-cover b{ font-size:clamp(1.7rem,8vw,2.65rem); }
  .editorial-cover small{ font-size:.43rem; }
  .b-slide--loja{ gap:8px; padding-inline:16px; }
  .sk-card .sk-photo{ padding:9px; }
  .sk-card .sk-photo span{ padding:3px 5px; font-size:.39rem; }
  .sk-card > strong{ left:9px; right:8px; bottom:24px; margin:0; font-size:.58rem; }
  .sk-card > small{ left:9px; right:8px; bottom:10px; font-size:.44rem; }
  .portfolio-main{ padding:15px; }
  .portfolio-tile{ padding:11px; }
  .portfolio-main > *:not(img),.portfolio-tile > *:not(img){ left:11px; right:11px; }
  .portfolio-main span,.portfolio-tile span{ top:11px; right:auto; padding:4px 6px; font-size:.39rem; }
  .portfolio-main strong,.portfolio-tile strong{ bottom:27px; font-size:clamp(.62rem,2.7vw,.82rem); letter-spacing:-.025em; }
  .portfolio-main small,.portfolio-tile small{ bottom:12px; font-size:.43rem; }
  .phone-mock{ width:35%; left:-1%; bottom:8%; }
  .phone-post{ padding:10px; border-radius:14px; }
  .phone-post-head{ margin-bottom:8px; }
  .phone-post-media{ padding:10px; margin-bottom:8px; }
  .phone-post-actions{ gap:8px; font-size:.6rem; }
  .hero-showcase figcaption{ padding-top:18px; padding-left:38%; gap:10px; line-height:1.45; }
  .projects{ padding-top:104px; }
  .section-heading{ margin-bottom:48px; }
  .project-grid{ gap:64px; }
  .project-content{ padding-top:0; }
  .case-study{ margin-top:64px; }
  .case-body{ padding-block:24px 48px; }
  .services{ margin-top:88px; padding-block:88px 64px; }
  .services .section-heading{ margin-bottom:56px; }
  .service{ grid-template-columns:24px minmax(0,1fr); row-gap:20px; padding-block:36px; }
  .service-number{ grid-column:1; grid-row:1; }
  .service-title{ grid-column:2; grid-row:1; }
  .service-copy{ grid-column:2; grid-row:2; }
  .service-trigger{ grid-column:2; grid-row:3; margin-top:4px; }
  .service-panel{ grid-column:2; grid-row:4; margin-top:4px; }
  .about{ padding-block:104px 88px; }
  .about-content{ gap:48px; }
  .principles{ margin-top:64px; }
  .process{ padding-top:48px; padding-bottom:112px; }
  .process-grid{ gap:48px; }
  .contact-inner{ padding-block:96px; gap:48px; }
}

@media (max-width:380px){
  .hero h1{ font-size:3.45rem; }
  .browser-bar{ padding-inline:12px; }
  .browser-url{ margin-left:4px; padding-inline:9px; }
  .mini-editorial-copy{ padding:12px; }
  .mini-editorial-copy strong{ font-size:1rem; }
  .portfolio-main strong,.portfolio-tile strong{ font-size:.58rem; }
  .phone-post-actions span:nth-child(3){ display:none; }
}

/* ---- revision 06: social-media portfolio, not website templates ---- */
.browser-mock{
  overflow:hidden;
  background:#fff;
  border-color:#dce3e6;
  border-radius:4px;
  box-shadow:0 42px 90px -36px rgba(29,41,47,.5);
}
.browser-bar{
  min-height:50px;
  justify-content:space-between;
  padding:14px 20px;
  color:#1d292f;
  background:#fff;
}
.browser-url{
  margin:0;
  padding:0;
  color:#1d292f;
  background:none;
  border-radius:0;
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.board-status{
  color:#7a878d;
  font-size:.52rem;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.browser-slides{ min-height:390px; background:#fff; }
.b-slide{ background:#fff; }

.b-slide--editorial{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  align-items:center;
  padding-inline:clamp(48px,6vw,84px);
}
.mini-editorial-copy,
.editorial-cover{
  min-height:0;
  aspect-ratio:4 / 5;
  border-radius:2px;
}
.mini-editorial-copy{
  position:relative;
  align-self:auto;
  justify-content:flex-end;
  overflow:hidden;
  padding:clamp(18px,2.5vw,30px);
  color:#fff;
  background:#466479;
  border:0;
}
.mini-editorial-copy::before{
  content:'A';
  position:absolute;
  top:-15%;
  right:-4%;
  color:rgba(255,255,255,.1);
  font-family:Newsreader,Georgia,serif;
  font-size:clamp(8rem,15vw,14rem);
  font-style:italic;
  line-height:1;
}
.mini-editorial-copy::after{
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:24%;
  height:8px;
  background:#dde7b8;
}
.mini-editorial-copy > *{ position:relative; z-index:1; }
.mini-editorial-copy .mini-kicker{ color:#dde7b8; }
.mini-editorial-copy strong{
  max-width:11ch;
  margin-top:auto;
  color:#fff;
  font-size:clamp(1.35rem,2.35vw,2.35rem);
  line-height:.92;
}
.mini-editorial-copy small{ color:rgba(255,255,255,.7); }
.mini-editorial-copy .mini-rule{ width:38px; margin:18px 0 10px; background:#dde7b8; }
.editorial-cover{ min-height:0; padding:18px; }
.editorial-cover::before{ background:linear-gradient(180deg,rgba(29,41,47,.08),rgba(29,41,47,.05) 44%,rgba(29,41,47,.82)); }
.editorial-cover::after{ right:-17%; bottom:6%; border-color:rgba(221,231,184,.75); }
.editorial-cover span{
  padding:0;
  background:none;
  border:0;
  border-radius:0;
  font-size:.5rem;
}
.editorial-cover b{ font-family:Manrope,Arial,sans-serif; font-size:clamp(2.5rem,4.4vw,4.5rem); font-style:normal; font-weight:300; letter-spacing:-.08em; }
.editorial-cover small{ color:#dde7b8; font-size:.5rem; }

.b-slide--loja,
.b-slide--portfolio{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:1fr;
  gap:14px;
  align-items:center;
  align-content:center;
  padding-inline:clamp(34px,4.8vw,66px);
}
.sk-card,
.portfolio-main,
.portfolio-tile,
.sk-photo.tall{
  width:100%;
  height:auto;
  min-width:0;
  aspect-ratio:4 / 5;
  grid-row:auto;
  overflow:hidden;
  border-radius:2px;
  box-shadow:0 14px 30px rgba(29,41,47,.12);
}
.sk-card .sk-photo{ padding:14px; }
.sk-card .sk-photo::before{ background:linear-gradient(180deg,rgba(20,25,28,.08),rgba(20,25,28,.02) 38%,rgba(20,25,28,.84)); }
.sk-card .sk-photo span,
.portfolio-main span,
.portfolio-tile span{
  top:14px;
  left:14px;
  right:auto;
  width:auto;
  padding:0 0 7px;
  color:#fff;
  background:none;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.75);
  border-radius:0;
  font-size:.47rem;
  font-weight:700;
  letter-spacing:.12em;
}
.sk-card > strong,
.portfolio-main strong,
.portfolio-tile strong{
  left:14px;
  right:12px;
  bottom:36px;
  overflow:visible;
  color:#fff;
  font-family:Newsreader,Georgia,serif;
  font-size:clamp(1.1rem,2vw,2rem);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.035em;
  line-height:.87;
  white-space:normal;
  text-overflow:clip;
}
.sk-card > small,
.portfolio-main small,
.portfolio-tile small{
  left:14px;
  right:12px;
  bottom:14px;
  color:rgba(255,255,255,.74);
  font-size:.48rem;
  font-weight:600;
  letter-spacing:.02em;
}
.portfolio-main,
.portfolio-tile{ padding:0; }
.portfolio-main > img,
.portfolio-tile > img{ filter:saturate(.92) contrast(1.06); }
.portfolio-main::after,
.portfolio-tile::after{ background:linear-gradient(180deg,rgba(20,25,28,.08),rgba(20,25,28,.04) 40%,rgba(20,25,28,.83)); }

.b-slide--minimal{
  padding:28px;
  background:#fff;
}
.b-slide--minimal::before,
.b-slide--minimal::after{ display:none; }
.social-poster{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  width:min(42%,250px);
  aspect-ratio:4 / 5;
  overflow:hidden;
  padding:24px;
  color:#1d292f;
  text-align:left;
  background:#dde7b8;
  box-shadow:0 16px 34px rgba(29,41,47,.14);
}
.social-poster::before{
  content:'';
  position:absolute;
  width:74%;
  aspect-ratio:1;
  top:-20%;
  right:-28%;
  border:1px solid rgba(29,41,47,.34);
  border-radius:50%;
}
.social-poster > *{ position:relative; z-index:1; }
.social-poster .mini-kicker{ position:absolute; top:22px; left:24px; color:#1d292f; }
.poster-index{ position:absolute; top:14px; right:18px; color:rgba(29,41,47,.18); font-size:3.5rem; font-weight:300; letter-spacing:-.08em; }
.social-poster > strong{ font-size:clamp(1.35rem,2.4vw,2.4rem); font-weight:500; letter-spacing:-.055em; line-height:.92; }
.social-poster > strong em{ color:#466479; font-family:Newsreader,Georgia,serif; font-weight:400; }
.social-poster .sk-pill{
  width:100%;
  margin-top:22px;
  padding:10px 0 0;
  color:#1d292f;
  background:transparent;
  border-top:1px solid rgba(29,41,47,.5);
  border-radius:0;
  font-size:.52rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.browser-dots{
  gap:0;
  padding:0 18px;
  border-top:1px solid #e2e7e9;
  background:#fff;
}
.browser-dots button{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  flex:1;
  width:auto;
  height:46px;
  padding:0 8px;
  color:#8a969b;
  background:transparent;
  border-radius:0;
  font-size:.52rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.browser-dots button span{ color:#b0b9bd; font-size:.45rem; }
.browser-dots button::after{
  content:'';
  position:absolute;
  left:18%;
  right:18%;
  bottom:0;
  height:2px;
  background:#466479;
  transform:scaleX(0);
  transition:transform .25s ease;
}
.browser-dots button.is-active{
  color:#1d292f;
  background:transparent;
  transform:none;
}
.browser-dots button.is-active::after{ transform:scaleX(1); }
.phone-account{ display:flex; flex-direction:column; color:#1d292f; font-size:.54rem; font-weight:700; line-height:1.25; }
.phone-account small{ color:#859197; font-size:.43rem; font-weight:500; }
.phone-post-media strong{ max-width:8ch; }
.phone-mock{ width:23%; left:-12%; bottom:13%; }
.hero-showcase figcaption{ margin-right:0; }

@media (max-width:760px){
  .browser-bar{ min-height:42px; padding:11px 13px; }
  .browser-url{ font-size:.5rem; }
  .board-status{ font-size:.4rem; }
  .browser-slides{ min-height:0; aspect-ratio:1.18; }
  .b-slide--editorial{ gap:8px; padding:18px 28px; }
  .mini-editorial-copy{ min-height:0; padding:14px; }
  .mini-editorial-copy::after{ height:5px; }
  .mini-editorial-copy strong{ margin-top:auto; font-size:clamp(.9rem,4vw,1.3rem); }
  .mini-editorial-copy small{ font-size:.4rem; }
  .mini-editorial-copy .mini-rule{ margin:10px 0 7px; }
  .editorial-cover{ padding:12px; }
  .editorial-cover span,.editorial-cover small{ font-size:.38rem; }
  .editorial-cover b{ font-size:clamp(1.7rem,8vw,2.5rem); }
  .b-slide--loja,.b-slide--portfolio{ gap:7px; padding:18px 17px; }
  .sk-card,.portfolio-main,.portfolio-tile,.sk-photo.tall{ border-radius:1px; }
  .sk-card .sk-photo{ padding:8px; }
  .sk-card .sk-photo span,.portfolio-main span,.portfolio-tile span{ top:8px; left:8px; padding-bottom:4px; font-size:.34rem; }
  .sk-card > strong,.portfolio-main strong,.portfolio-tile strong{ left:8px; right:6px; bottom:22px; font-size:clamp(.67rem,3vw,.9rem); }
  .sk-card > small,.portfolio-main small,.portfolio-tile small{ left:8px; right:5px; bottom:8px; font-size:.34rem; }
  .social-poster{ width:min(46%,180px); padding:16px; }
  .social-poster .mini-kicker{ top:14px; left:16px; font-size:.4rem; }
  .poster-index{ top:7px; right:11px; font-size:2.6rem; }
  .social-poster > strong{ font-size:clamp(1rem,5vw,1.45rem); }
  .social-poster .sk-pill{ margin-top:13px; padding-top:7px; font-size:.38rem; }
  .browser-dots{ padding:0 6px; }
  .browser-dots button{ gap:3px; height:40px; padding:0 3px; font-size:.39rem; }
  .browser-dots button span{ font-size:.34rem; }
  .phone-account{ font-size:.42rem; }
  .phone-account small{ font-size:.34rem; }
  .phone-mock{ width:28%; left:-12%; bottom:7%; }
}

@media (max-width:380px){
  .board-status{ display:none; }
  .browser-bar{ justify-content:center; }
  .b-slide--editorial{ padding-inline:20px; }
  .browser-dots button{ font-size:.36rem; letter-spacing:.04em; }
  .browser-dots button span{ display:none; }
}

/* ---- revision 07: quieter section rhythm and focused service cards ---- */
.services{
  margin-inline:var(--gutter);
  margin-top:clamp(104px,9vw,160px);
  padding-block:clamp(104px,8vw,144px);
  border-radius:8px;
}
.services .section-heading{
  align-items:end;
  margin-bottom:clamp(56px,5vw,80px);
}
.services .section-heading h2{
  max-width:12ch;
  font-size:clamp(3rem,5.2vw,5.35rem);
}
.services .section-heading > p{
  max-width:330px;
  padding-bottom:8px;
  font-size:1rem;
  line-height:1.65;
}
.service-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.service{
  display:flex;
  flex-direction:column;
  gap:0;
  min-width:0;
  min-height:430px;
  padding:clamp(26px,2.7vw,40px);
  color:#fff;
  background:#466479;
  border:0;
  border-radius:3px;
  transition:transform .3s ease,box-shadow .3s ease;
}
.service:hover{
  padding-left:clamp(26px,2.7vw,40px);
  transform:translateY(-6px);
  box-shadow:0 24px 44px rgba(0,0,0,.18);
}
.service:nth-child(1){ color:#1d292f; background:#dde7b8; }
.service:nth-child(2){ color:#fff; background:#466479; }
.service:nth-child(3){ color:#1d292f; background:#fff; }
.service-title h3,
.service h3{
  max-width:9ch;
  color:inherit;
  font-size:clamp(2.1rem,3.25vw,3.35rem);
  line-height:1;
  letter-spacing:-.055em;
}
.service-copy{
  display:flex;
  flex:1;
  flex-direction:column;
  min-width:0;
}
.service-copy p,
.service > div > p{
  max-width:30ch;
  margin-top:clamp(36px,4vw,60px);
  color:inherit;
  font-size:.95rem;
  line-height:1.65;
  opacity:.8;
}
.service ul{
  display:grid;
  gap:9px;
  margin:auto 0 0;
  padding:42px 0 0;
  color:inherit;
  font-size:.75rem;
  line-height:1.4;
  list-style:none;
}
.service ul li{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0;
  border:0;
}
.service ul li::before{
  content:'';
  width:18px;
  height:1px;
  flex:0 0 18px;
  background:currentColor;
  opacity:.5;
}
.service-trigger{
  align-self:flex-start;
  justify-self:auto;
  margin-top:32px;
  padding:8px 0;
  color:inherit;
  border-color:currentColor;
  opacity:.85;
}
.service-trigger > span:last-child{ border-color:currentColor; }
.service-trigger:hover,
.service-trigger[aria-expanded="true"]{
  color:inherit;
  border-color:currentColor;
  opacity:1;
}
.service-trigger:hover > span:last-child,
.service-trigger[aria-expanded="true"] > span:last-child{
  color:#fff;
  background:#1d292f;
  border-color:#1d292f;
}
.service-panel{
  display:block;
  margin-top:24px;
  padding-top:22px;
  color:inherit;
  border-color:currentColor;
}
.service-panel p{
  max-width:none;
  margin:0;
  color:inherit;
  font-size:.84rem;
  line-height:1.55;
  opacity:.8;
}
.service-panel a{
  display:flex;
  justify-content:space-between;
  margin-top:20px;
  color:inherit;
  font-size:.75rem;
  white-space:normal;
}

@media (max-width:1000px){
  .service-list{ grid-template-columns:1fr; }
  .service{
    display:grid;
    grid-template-columns:minmax(180px,.8fr) minmax(260px,1.2fr);
    gap:32px 56px;
    min-height:0;
    padding:36px;
  }
  .service:hover{ padding-left:36px; }
  .service-title{ grid-column:1; grid-row:1 / span 2; }
  .service-copy{ grid-column:2; grid-row:1; }
  .service-copy p,.service > div > p{ margin-top:0; }
  .service ul{ margin-top:34px; padding-top:0; }
  .service-trigger{ grid-column:2; grid-row:2; margin-top:0; }
  .service-panel{ grid-column:2; grid-row:3; }
}

@media (max-width:760px){
  .services{ margin-inline:12px; margin-top:88px; padding-block:80px 56px; }
  .services > .wrap{ padding-inline:calc(var(--gutter) - 12px); }
  .services .section-heading{ margin-bottom:44px; }
  .services .section-heading h2{ font-size:clamp(2.65rem,11vw,3.65rem); }
  .service-list{ gap:10px; }
  .service{
    display:flex;
    min-height:390px;
    padding:28px;
  }
  .service:hover{ padding-left:28px; transform:none; }
  .service-title,.service-copy,.service-trigger,.service-panel{ grid-column:auto; grid-row:auto; }
  .service-title h3,.service h3{ font-size:2.45rem; }
  .service-copy p,.service > div > p{ margin-top:36px; font-size:.94rem; }
  .service ul{ margin-top:auto; padding-top:38px; }
  .service-trigger{ margin-top:28px; }
  .service-panel{ margin-top:22px; }
}

/* A single sans-serif family; expression comes from scale, weight and composition. */
em,.identity-tagline,.visual-signature,.step-number,
.mini-editorial-copy strong,.editorial-cover b,
.sk-card > strong,.portfolio-main strong,.portfolio-tile strong,
.phone-post-media strong,.phone-post-media i,
.social-poster > strong em,.b-slide--minimal .sk-circle span,
.mini-editorial-copy::before{
  font-family:Manrope,Arial,sans-serif;
  font-style:normal;
}
h1,h2{ font-weight:600; letter-spacing:-.055em; }
h2 em{ font-weight:inherit; letter-spacing:inherit; }
.hero h1{ font-weight:650; line-height:1.04; letter-spacing:-.06em; }
.hero h1 em{ font-size:1em; font-weight:650; letter-spacing:inherit; }
.hero h1 em::after{
  content:''; display:block; width:48px; height:5px; margin-top:28px;
  background:var(--accent);
}
/* Keep directional glyphs as typography on mobile browsers. */
.button > span,
.nav-contact > span,
.project-arrow,
.service-trigger > span:last-child,
.service-panel a span,
.hero-baseline > a span,
.text-link > span,
.back-top > span,
.social-poster .sk-pill span{
  position:relative;
  font-size:0;
  font-family:inherit;
}
.button > span::before,
.nav-contact > span::before,
.project-arrow::before,
.service-trigger > span:last-child::before,
.service-panel a span::before,
.hero-baseline > a span::before,
.text-link > span::before,
.back-top > span::before,
.social-poster .sk-pill span::before{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:17px;
  height:11px;
  background:currentColor;
  clip-path:polygon(0 42%,61% 42%,61% 0,100% 50%,61% 100%,61% 58%,0 58%);
  transform:translate(-50%,-50%) rotate(-45deg);
}
.hero-baseline > a span::before,
.text-link > span::before{ transform:translate(-50%,-50%) rotate(90deg); }
.back-top > span::before{ transform:translate(-50%,-50%) rotate(-90deg); }
.social-poster .sk-pill span::before{ transform:translate(-50%,-50%); }
.phone-post-actions span:nth-child(3){ font-family:Manrope,Arial,sans-serif; }
.section-heading h2,.about-content h2{ font-size:clamp(2.5rem,4.6vw,4.5rem); line-height:1.12; letter-spacing:-.05em; }
.services .section-heading h2{ max-width:16ch; font-size:clamp(2.5rem,4.6vw,4.5rem); }
.identity-tagline{ font-size:clamp(1rem,1.5vw,1.5rem); font-weight:500; letter-spacing:-.03em; }
.step-number{ font-size:2.8rem; font-weight:400; letter-spacing:-.06em; }
.step{ gap:16px; }
.mini-editorial-copy strong{ font-size:clamp(1.1rem,1.9vw,1.9rem); font-weight:550; line-height:1.06; letter-spacing:-.05em; }
.mini-editorial-copy::before{ font-weight:700; }
.sk-card > strong,.portfolio-main strong,.portfolio-tile strong{
  font-size:clamp(.95rem,1.65vw,1.65rem); line-height:1.05; font-weight:650;
  letter-spacing:-.045em; bottom:39px;
}
.sk-card:nth-child(2) > strong{ font-weight:500; letter-spacing:-.06em; }
.sk-card:nth-child(3) > strong{ text-transform:uppercase; font-weight:800; letter-spacing:-.05em; }
.portfolio-main strong{ text-transform:uppercase; font-weight:800; }
.portfolio-tile--blue strong{ text-transform:uppercase; font-weight:800; color:#e5ff7d; }
.portfolio-tile--lime strong{ font-weight:500; }
.phone-post-media strong{ font-weight:700; font-size:clamp(.7rem,1.2vw,1rem); line-height:1.06; border-radius:0; }
.phone-post-media i{ font-weight:700; }
.social-poster > strong{ font-weight:650; line-height:1.04; }
.social-poster > strong em{ font-weight:650; }
.social-poster::before{ display:none; }
.poster-index{ font-size:2rem; }
.contact h2{ font-weight:600; line-height:1.08; }
@media(max-width:760px){
  .section-heading h2,.about-content h2,.services .section-heading h2{ font-size:clamp(2.25rem,9.5vw,3.4rem); }
  .hero h1{ font-size:clamp(3.4rem,14vw,5.5rem); }
  .mini-editorial-copy strong{ font-size:clamp(.8rem,3.4vw,1.2rem); }
  .sk-card > strong,.portfolio-main strong,.portfolio-tile strong{ font-size:clamp(.59rem,2.65vw,.9rem); bottom:25px; }
  .social-poster > strong{ font-size:clamp(.9rem,4.3vw,1.35rem); }
}

/* Scroll chapters: artwork, colour, a reading pause, then a clear next step. */
.projects .section-heading h2 em{
  display:inline-block; color:var(--mineral-text);
}
.services .section-heading h2 em{ display:inline-block; }
.about-content h2{ align-self:start; }
.about-copy .about-lead{ font-size:clamp(1.4rem,2.5vw,2.15rem); line-height:1.35; max-width:22ch; }
.principles{ border-top:0; padding-block:32px; border-bottom:1px solid var(--line); }
.principles span{ position:relative; padding-top:22px; }
.principles span::before{ content:''; position:absolute; top:0; left:0; width:32px; height:4px; background:var(--mineral-text); }
.principles span:nth-child(2)::before{ left:calc(50% - 16px); }
.principles span:nth-child(3)::before{ left:auto; right:0; }
.process-grid article{ position:relative; border-top:0; padding-top:28px; }
.process-grid article::before{ content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--mineral-text); transform-origin:left; }
.process-grid .step-number{ color:var(--mineral-text); font-weight:650; }
.contact h2 em{ display:inline-block; }
@media(min-width:1001px){
  .about-content h2{ position:sticky; top:96px; }
  .about-copy{ padding-block:16px 72px; }
  .service:nth-child(2){ margin-top:30px; }
  .service:nth-child(3){ margin-top:60px; }
  .service-list{ align-items:start; }
  .service{ min-height:510px; }
}
@media(prefers-reduced-motion:no-preference){
  .story-motion .project.reveal{ transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1); }
  .story-motion .project.reveal:not(.is-visible){ transform:translateY(56px); }
  .story-motion .project .identity-main{ transition:transform 1.15s cubic-bezier(.16,1,.3,1); }
  .story-motion .project:not(.is-visible) .identity-main{ transform:translateY(24px) rotate(-11deg) scale(.91); }
  .story-motion .project .post-asset{ transition:transform 1.2s cubic-bezier(.16,1,.3,1); }
  .story-motion .project:not(.is-visible) .post-asset:first-child{ transform:translate(18px,16px) rotate(0); }
  .story-motion .project:not(.is-visible) .post-asset:nth-child(2){ transform:translateY(20px) rotate(0); }
  .story-motion .project:not(.is-visible) .post-asset:nth-child(3){ transform:translate(-18px,16px) rotate(0); }
  .story-motion .story-entered .section-heading h2 em{ animation:chapter-accent .85s cubic-bezier(.16,1,.3,1) both; }
  .story-motion .service.reveal{ transition:opacity .7s ease,transform .85s cubic-bezier(.16,1,.3,1),box-shadow .3s; }
  .story-motion .service.reveal:not(.is-visible){ transform:translateY(48px) scale(.97); }
  .story-motion .process-grid article::before{ transition:transform .9s cubic-bezier(.16,1,.3,1); }
  .story-motion .process-grid article:not(.is-visible)::before{ transform:scaleX(0); }
  .story-motion .contact-inner.is-visible h2 em{ animation:chapter-accent .9s .12s cubic-bezier(.16,1,.3,1) both; }
  @keyframes chapter-accent{ from{clip-path:inset(0 100% 0 0);transform:translateY(12px);} to{clip-path:inset(0);transform:none;} }
}
@media(max-width:760px){
  .principles span:nth-child(n)::before{ left:0; right:auto; }
  .principles{ gap:26px; }
  .about-copy .about-lead{ font-size:1.5rem; }
}