/* =========================================================================
   ATELIER NORD — luxury architecture studio
   Design system: sand / deep black / single earthy accent.
   Display: Hanken Grotesk (huge, tight). Accent: Newsreader italic.
   Data/labels: IBM Plex Mono. Signature: the meridian (north axis) + catalogue index.
   ========================================================================= */

:root{
  /* palette */
  --sand:#F5F2ED; --sand-2:#ECE5DA; --paper:#FBFAF7;
  --ink:#0A0A0A; --ink-2:#16130F; --ink-soft:#3A332B;
  --earth:#8B6F47; --earth-2:#A98C61; --warm:#CDAE7E;
  --gray:#6B6157; --gray-2:#8A8077; --line:#DDD5C8; --line-2:#E7E1D6;

  /* type */
  --sans:'Hanken Grotesk',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --serif:'Newsreader',Georgia,serif;
  --mono:'IBM Plex Mono','SFMono-Regular',monospace;

  /* fluid scale — dramatic hierarchy */
  --fs-mega:clamp(3.2rem,11vw,10.5rem);
  --fs-h1:clamp(2.6rem,7vw,6rem);
  --fs-h2:clamp(2rem,4.6vw,3.7rem);
  --fs-h3:clamp(1.35rem,2.4vw,2rem);
  --fs-lead:clamp(1.15rem,1.8vw,1.5rem);
  --fs-body:clamp(1rem,1.15vw,1.12rem);
  --fs-small:.82rem;
  --label:.7rem;

  /* rhythm */
  --wrap:1440px; --gut:clamp(22px,5vw,80px);
  --sect:clamp(90px,13vw,200px);
  --r:2px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-2:cubic-bezier(.65,.05,.36,1);
  --merid:clamp(22px,5vw,80px); /* meridian x-offset = gutter */
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:var(--sans); font-size:var(--fs-body);
  line-height:1.65; color:var(--ink); background:var(--sand);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
::selection{background:var(--ink); color:var(--sand)}

/* custom cursor — hidden on touch & reduced motion */
.cursor,.cursor-ring{position:fixed; top:0; left:0; z-index:9999; pointer-events:none;
  border-radius:50%; mix-blend-mode:difference; opacity:0; transition:opacity .4s}
.cursor{width:7px; height:7px; background:#fff; transform:translate(-50%,-50%)}
.cursor-ring{width:38px; height:38px; border:1px solid rgba(255,255,255,.7);
  transform:translate(-50%,-50%); transition:width .3s var(--ease),height .3s var(--ease),opacity .4s,background .3s}
body.cursor-on .cursor,body.cursor-on .cursor-ring{opacity:1}
body.cursor-hover .cursor-ring{width:62px; height:62px; background:rgba(255,255,255,.06)}
@media (hover:none),(pointer:coarse){.cursor,.cursor-ring{display:none}}
@media (prefers-reduced-motion:reduce){.cursor,.cursor-ring{display:none}}

/* ---------- layout primitives ---------- */
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.wrap-w{max-width:1680px; margin-inline:auto; padding-inline:var(--gut)}
.section{padding-block:var(--sect); position:relative}
.section--tight{padding-block:clamp(56px,8vw,110px)}
.bleed{width:100%}

/* meridian: hairline north axis dropping from an index eyebrow */
.index{display:flex; align-items:baseline; gap:18px; margin-bottom:clamp(34px,5vw,64px); position:relative}
.index::before{content:""; position:absolute; left:0; top:-6px; width:1px; height:46px; background:var(--ink); opacity:.85}
.index__n{font-family:var(--mono); font-size:var(--label); letter-spacing:.28em; text-transform:uppercase;
  color:var(--ink); padding-left:22px}
.index__t{font-family:var(--mono); font-size:var(--label); letter-spacing:.28em; text-transform:uppercase; color:var(--gray)}
.north{font-family:var(--mono); font-size:var(--label); letter-spacing:.22em; color:var(--earth)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-weight:600; line-height:1.02; letter-spacing:-.025em; color:var(--ink)}
.mega{font-size:var(--fs-mega); font-weight:600; line-height:.92; letter-spacing:-.04em}
.h1{font-size:var(--fs-h1)} .h2{font-size:var(--fs-h2)} .h3{font-size:var(--fs-h3); letter-spacing:-.02em}
.lead{font-size:var(--fs-lead); line-height:1.5; color:var(--ink-soft); font-weight:400; letter-spacing:-.01em}
.serif-i{font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:0}
.muted{color:var(--gray)}
p{max-width:62ch}
.thin{font-weight:300}

/* eyebrow label */
.ey{font-family:var(--mono); font-size:var(--label); letter-spacing:.26em; text-transform:uppercase; color:var(--earth); display:inline-block}

/* links / buttons */
.link{display:inline-flex; align-items:center; gap:.7em; font-family:var(--mono); font-size:var(--fs-small);
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink); position:relative; padding-bottom:4px}
.link::after{content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease)}
.link:hover::after{transform:scaleX(1)}
.link .ar{transition:transform .4s var(--ease)}
.link:hover .ar{transform:translateX(6px)}
.link--light{color:var(--sand)}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:.8em;
  font-family:var(--mono); font-size:var(--fs-small); letter-spacing:.14em; text-transform:uppercase;
  padding:1.25em 2.2em; border-radius:100px; background:var(--ink); color:var(--sand);
  transition:background .4s var(--ease),color .4s var(--ease),transform .5s var(--ease)}
.btn:hover{background:var(--earth); transform:translateY(-2px)}
.btn--ghost{background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1px var(--line)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1px var(--ink); background:transparent; color:var(--ink)}
.btn--light{background:var(--sand); color:var(--ink)}
.btn--light:hover{background:var(--earth); color:var(--sand)}

/* ---------- header ---------- */
.hdr{position:fixed; top:0; left:0; right:0; z-index:200;
  padding:clamp(18px,2.4vw,30px) 0; transition:padding .5s var(--ease),background .5s var(--ease)}
.hdr::after{content:""; position:absolute; inset:0; background:var(--sand); opacity:0;
  transition:opacity .5s var(--ease); z-index:-1; border-bottom:1px solid transparent}
.hdr.solid{padding:14px 0}
.hdr.solid::after{opacity:.92; backdrop-filter:blur(14px); border-bottom:1px solid var(--line-2)}
.hdr.on-dark{color:var(--sand)}
.hdr.on-dark .wordmark,.hdr.on-dark .nav a,.hdr.on-dark .nav__meta{color:var(--sand)}
.hdr.on-dark .burger span{background:var(--sand)}
.hdr.solid.on-dark{color:var(--ink)}
.hdr.solid.on-dark .wordmark,.hdr.solid.on-dark .nav a,.hdr.solid.on-dark .nav__meta{color:var(--ink)}
.hdr.solid.on-dark .burger span{background:var(--ink)}
.hdr__row{display:flex; align-items:center; justify-content:space-between; gap:24px}
.wordmark{font-weight:700; font-size:1.02rem; letter-spacing:.34em; text-transform:uppercase; color:var(--ink); white-space:nowrap}
.wordmark b{font-weight:700}
.wordmark .dot{color:var(--earth)}
.nav{display:flex; align-items:center; gap:clamp(20px,2.4vw,44px)}
.nav a{font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft);
  position:relative; transition:color .3s}
.nav a:hover,.nav a.active{color:var(--ink)}
.nav a.active::before{content:""; position:absolute; left:-13px; top:50%; width:4px; height:4px; border-radius:50%;
  background:var(--earth); transform:translateY(-50%)}
.hdr.on-dark .nav a:hover,.hdr.on-dark .nav a.active{color:var(--sand)}
.nav__cta{margin-left:8px}
.burger{display:none; width:46px; height:46px; flex-direction:column; justify-content:center; align-items:flex-end; gap:6px; background:none}
.burger span{display:block; height:1.5px; width:26px; background:var(--ink); transition:transform .4s var(--ease),opacity .3s,width .4s}
.burger span:nth-child(2){width:18px}

/* mobile overlay menu */
.menu{position:fixed; inset:0; z-index:190; background:var(--ink); color:var(--sand);
  clip-path:circle(0% at 100% 0); transition:clip-path .7s var(--ease); display:flex; flex-direction:column;
  justify-content:center; padding:var(--gut); visibility:hidden}
.menu.open{clip-path:circle(150% at 100% 0); visibility:visible}
.menu a{font-size:clamp(2.2rem,9vw,4rem); font-weight:600; letter-spacing:-.03em; color:var(--sand);
  padding:.16em 0; display:flex; align-items:baseline; gap:18px; opacity:0; transform:translateY(20px);
  transition:opacity .5s var(--ease),transform .5s var(--ease)}
.menu.open a{opacity:1; transform:none}
.menu.open a:nth-child(1){transition-delay:.18s}.menu.open a:nth-child(2){transition-delay:.25s}
.menu.open a:nth-child(3){transition-delay:.32s}.menu.open a:nth-child(4){transition-delay:.39s}
.menu.open a:nth-child(5){transition-delay:.46s}.menu.open a:nth-child(6){transition-delay:.53s}
.menu a .mi{font-family:var(--mono); font-size:.8rem; letter-spacing:.2em; color:var(--earth-2); opacity:.8}
.menu__foot{margin-top:clamp(34px,6vw,70px); font-family:var(--mono); font-size:.74rem; letter-spacing:.12em;
  color:var(--gray-2); display:flex; flex-wrap:wrap; gap:8px 26px}
.menu__foot a{font-size:.74rem; font-weight:400; color:var(--gray-2); display:inline}

/* ---------- HERO ---------- */
.hero{position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end;
  overflow:hidden; background:var(--ink)}
.hero__media{position:absolute; inset:0; z-index:0}
.hero__media img{width:100%; height:115%; object-fit:cover; will-change:transform}
.hero__scrim{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(10,10,10,.32) 0%,rgba(10,10,10,0) 32%,rgba(10,10,10,.30) 78%,rgba(10,10,10,.62) 100%)}
.hero__inner{position:relative; z-index:2; padding-bottom:clamp(40px,7vw,96px); color:var(--sand); width:100%}
.hero .mega{color:var(--sand)}
.hero__lines{overflow:hidden}
.hero__line{display:block; transform:translateY(105%); opacity:0}
.loaded .hero__line{animation:rise 1.1s var(--ease) forwards}
.loaded .hero__line:nth-child(2){animation-delay:.12s}
.loaded .hero__line:nth-child(3){animation-delay:.24s}
@keyframes rise{to{transform:translateY(0); opacity:1}}
.hero__base{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px;
  margin-top:clamp(26px,4vw,52px); border-top:1px solid rgba(245,242,237,.22); padding-top:24px}
.hero__sub{max-width:42ch; color:rgba(245,242,237,.78); font-size:var(--fs-lead); font-weight:300}
.hero__meta{font-family:var(--mono); font-size:var(--label); letter-spacing:.2em; text-transform:uppercase;
  color:rgba(245,242,237,.7); text-align:right; line-height:2}
/* vertical meridian on hero */
.hero__axis{position:absolute; left:var(--merid); top:0; bottom:0; z-index:2; width:1px;
  background:linear-gradient(rgba(245,242,237,0),rgba(245,242,237,.3) 14%,rgba(245,242,237,.3) 86%,rgba(245,242,237,0));
  display:flex; flex-direction:column; justify-content:space-between; align-items:center; padding-block:120px}
.hero__axis span{font-family:var(--mono); font-size:.62rem; letter-spacing:.2em; color:rgba(245,242,237,.7);
  writing-mode:vertical-rl; transform:rotate(180deg)}
.hero__axis .n{writing-mode:horizontal-tb; transform:none; color:var(--earth-2)}
.scroll-cue{position:absolute; right:var(--gut); bottom:clamp(40px,7vw,96px); z-index:2;
  font-family:var(--mono); font-size:.62rem; letter-spacing:.22em; color:rgba(245,242,237,.7);
  writing-mode:vertical-rl; display:flex; align-items:center; gap:14px}
.scroll-cue::after{content:""; width:1px; height:54px; background:rgba(245,242,237,.5); animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%,100%{transform:scaleY(.3); transform-origin:top}50%{transform:scaleY(1); transform-origin:top}}
@media (max-width:760px){.hero__axis,.scroll-cue{display:none}}

/* ---------- reveal ---------- */
.rv{opacity:0; transform:translateY(30px); transition:opacity 1s var(--ease),transform 1s var(--ease)}
.rv.in{opacity:1; transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}.rv.d4{transition-delay:.4s}
.rv-img{position:relative; overflow:hidden}
.rv-img img{transform:scale(1.12); transition:transform 1.4s var(--ease)}
.rv-img::after{content:""; position:absolute; inset:0; background:var(--sand); transform-origin:right;
  transition:transform 1.1s var(--ease-2)}
.rv-img.in img{transform:scale(1)}
.rv-img.in::after{transform:scaleX(0)}
.rv-img.on-dark::after{background:var(--ink)}
@media (prefers-reduced-motion:reduce){
  .rv,.hero__line{opacity:1!important; transform:none!important; animation:none!important}
  .rv-img img{transform:none!important}.rv-img::after{display:none}
}

/* ---------- manifesto ---------- */
.manifesto{max-width:24ch}
.mq{font-size:clamp(1.8rem,4.4vw,3.4rem); line-height:1.12; letter-spacing:-.03em; font-weight:500}
.mq em{font-family:var(--serif); font-style:italic; font-weight:400; color:var(--earth)}
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,7vw,120px); align-items:end}
.split--top{align-items:start}

/* ---------- featured horizontal gallery ---------- */
.rail{display:flex; gap:clamp(18px,2.4vw,40px); overflow-x:auto; scroll-snap-type:x mandatory;
  padding-block:6px; padding-inline:var(--gut); margin-inline:calc(-1*var(--gut));
  scrollbar-width:none; cursor:grab}
.rail::-webkit-scrollbar{display:none}
.rail.drag{cursor:grabbing}
.rail__item{scroll-snap-align:start; flex:0 0 clamp(280px,40vw,560px)}
.rail__item:last-child{padding-right:var(--gut)}
.work{display:block; group:work}
.work__img{aspect-ratio:4/5; overflow:hidden; background:var(--sand-2); border-radius:var(--r)}
.work__img img{width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease)}
.work:hover .work__img img{transform:scale(1.04)}
.work__row{display:flex; align-items:baseline; justify-content:space-between; gap:18px; margin-top:18px}
.work__no{font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; color:var(--earth)}
.work__yr{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; color:var(--gray)}
.work h3{font-size:clamp(1.4rem,2.2vw,1.9rem); margin-top:6px; letter-spacing:-.02em}
.work__place{font-family:var(--mono); font-size:.74rem; letter-spacing:.08em; color:var(--gray); margin-top:6px}
.work__line{height:1px; background:var(--line); margin-top:16px; transform:scaleX(0); transform-origin:left; transition:transform .6s var(--ease)}
.work:hover .work__line{transform:scaleX(1)}

/* ---------- numbers / stat ledger ---------- */
.ledger{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--ink)}
.stat{padding:clamp(28px,3.5vw,48px) clamp(14px,2vw,30px) clamp(20px,2.4vw,32px) 0; border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat__n{font-size:clamp(2.6rem,5.5vw,4.6rem); font-weight:500; letter-spacing:-.04em; line-height:1}
.stat__n .u{color:var(--earth); font-size:.5em; vertical-align:super; margin-left:.05em}
.stat__l{font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gray); margin-top:14px}

/* ---------- dark section ---------- */
.dark{background:var(--ink); color:var(--sand)}
.dark h1,.dark h2,.dark h3,.dark h4{color:var(--sand)}
.dark .lead,.dark p{color:rgba(245,242,237,.72)}
.dark .ey{color:var(--earth-2)}
.dark .index::before{background:var(--sand)}
.dark .index__n{color:var(--sand)}
.dark .stat__l{color:var(--gray-2)}
.dark .ledger{border-color:var(--sand)}
.dark .stat{border-color:rgba(245,242,237,.18)}

/* ---------- philosophy list ---------- */
.tenets{border-top:1px solid var(--line)}
.tenet{display:grid; grid-template-columns:auto 1fr auto; gap:clamp(20px,4vw,70px); align-items:baseline;
  padding:clamp(26px,3.4vw,44px) 0; border-bottom:1px solid var(--line)}
.tenet__n{font-family:var(--mono); font-size:.78rem; letter-spacing:.1em; color:var(--earth)}
.tenet h3{font-size:clamp(1.5rem,3vw,2.4rem); font-weight:500; letter-spacing:-.025em}
.tenet p{font-size:var(--fs-body); color:var(--gray); max-width:42ch}
@media (max-width:820px){.tenet{grid-template-columns:1fr; gap:14px}}

/* ---------- CTA band ---------- */
.cta-band{text-align:center}
.cta-band .mega{margin:.2em 0 .5em}

/* ---------- projects index (grid) ---------- */
.pgrid{display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(18px,2.4vw,44px) clamp(18px,2.4vw,40px)}
.pcard{position:relative}
.pcard--lg{grid-column:span 7} .pcard--sm{grid-column:span 5}
.pcard--half{grid-column:span 6} .pcard--full{grid-column:span 12}
.pcard--off{margin-top:clamp(30px,7vw,120px)}
.pcard .work__img{aspect-ratio:3/2}
.pcard--portrait .work__img{aspect-ratio:4/5}
@media (max-width:860px){
  .pgrid{grid-template-columns:1fr; gap:46px}
  .pcard--lg,.pcard--sm,.pcard--half,.pcard--full{grid-column:auto}
  .pcard--off{margin-top:0}
}

/* filter */
.filters{display:flex; flex-wrap:wrap; gap:10px 26px; align-items:center; margin-top:6px}
.filters button{font-family:var(--mono); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gray); background:none; padding:8px 0; position:relative; transition:color .3s}
.filters button::after{content:""; position:absolute; left:0; bottom:2px; width:100%; height:1px; background:var(--ink);
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease)}
.filters button.active{color:var(--ink)} .filters button.active::after{transform:scaleX(1)}
.filters button:hover{color:var(--ink)}
.pcard{transition:opacity .5s var(--ease),transform .5s var(--ease)}
.pcard.hide{display:none}

/* ---------- case (projeto) ---------- */
.case-hero{position:relative; min-height:92svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--ink); color:var(--sand)}
.case-hero__media{position:absolute; inset:0}
.case-hero__media img{width:100%; height:112%; object-fit:cover}
.case-hero__scrim{position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,10,10,.4),rgba(10,10,10,0) 40%,rgba(10,10,10,.66))}
.case-hero__inner{position:relative; z-index:2; padding-bottom:clamp(36px,6vw,80px); width:100%}
.case-hero .mega{color:var(--sand); font-size:clamp(2.8rem,8vw,7rem)}
.case-meta{display:flex; flex-wrap:wrap; gap:10px 40px; margin-top:24px; border-top:1px solid rgba(245,242,237,.22); padding-top:22px;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(245,242,237,.78)}
.case-meta b{color:var(--sand); font-weight:400; display:block; margin-top:4px; letter-spacing:.06em}

.facts{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line)}
.fact{padding:30px 24px 26px 0; border-right:1px solid var(--line)}
.fact:last-child{border-right:0}
.fact__k{font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gray)}
.fact__v{font-size:clamp(1.2rem,2vw,1.6rem); margin-top:10px; font-weight:500; letter-spacing:-.01em}
@media (max-width:760px){.facts,.ledger{grid-template-columns:1fr 1fr}.stat,.fact{border-right:0}}

.gal-full{width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:var(--r)}
.gal-full img{width:100%; height:100%; object-fit:cover}
.gal-duo{display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,28px)}
.gal-duo .rv-img{aspect-ratio:4/5; border-radius:var(--r)}
.gal-duo img{width:100%; height:100%; object-fit:cover}
@media (max-width:680px){.gal-duo{grid-template-columns:1fr}}
.pull{font-size:clamp(1.6rem,3.6vw,2.8rem); line-height:1.2; letter-spacing:-.02em; font-weight:500; max-width:20ch}
.pull em{font-family:var(--serif); font-style:italic; color:var(--earth); font-weight:400}

.case-nav{display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--line); padding-top:30px}

/* ---------- process ---------- */
.phase{display:grid; grid-template-columns:clamp(90px,12vw,180px) 1fr; gap:clamp(24px,5vw,80px);
  padding:clamp(40px,6vw,90px) 0; border-top:1px solid var(--line); align-items:start}
.phase:last-child{border-bottom:1px solid var(--line)}
.phase__n{font-size:clamp(3rem,7vw,6.5rem); font-weight:300; letter-spacing:-.04em; color:var(--earth); line-height:.9}
.phase h3{font-size:clamp(1.8rem,3.4vw,2.8rem); font-weight:500; letter-spacing:-.025em; margin-bottom:18px}
.phase p{font-size:var(--fs-lead); color:var(--ink-soft); max-width:54ch; font-weight:300}
.phase__tags{display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:24px}
.phase__tags span{font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gray)}
@media (max-width:680px){.phase{grid-template-columns:1fr; gap:14px}.phase__n{font-size:clamp(2.6rem,12vw,4rem)}}

/* ---------- studio / team ---------- */
.team{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,2.4vw,40px)}
.member .rv-img{aspect-ratio:4/5; border-radius:var(--r); margin-bottom:18px}
.member img{width:100%; height:100%; object-fit:cover}
.member__role{font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--earth); margin-bottom:6px}
.member h4{font-size:1.15rem; font-weight:600; letter-spacing:-.01em}
.member__cr{font-family:var(--mono); font-size:.74rem; color:var(--gray); margin-top:3px}
@media (max-width:860px){.team{grid-template-columns:1fr 1fr; gap:34px}}

/* page hero (inner pages) */
.phero{padding-top:clamp(140px,18vw,240px)}
.crumbs{font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gray); margin-bottom:clamp(26px,4vw,48px)}
.crumbs a:hover{color:var(--ink)} .crumbs .s{margin:0 .7em; color:var(--earth)}

/* ---------- form ---------- */
.form{display:grid; gap:clamp(22px,3vw,38px)}
.f-row{display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,3vw,38px)}
.field{position:relative; display:grid; gap:0}
.field label{font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gray); margin-bottom:12px}
.field label .req{color:var(--earth)}
.field input,.field select,.field textarea{
  font-family:var(--sans); font-size:1.05rem; color:var(--ink); background:transparent;
  border:0; border-bottom:1px solid var(--line); padding:10px 0; transition:border-color .4s}
.field textarea{resize:vertical; min-height:90px; line-height:1.5}
.field input::placeholder,.field textarea::placeholder{color:var(--gray-2); opacity:.7}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--ink)}
.field select{appearance:none; cursor:pointer}
.f-note{font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; color:var(--gray)}
@media (max-width:680px){.f-row{grid-template-columns:1fr}}

.success{display:none}
.success.show{display:block; animation:fade .8s var(--ease)}
@keyframes fade{from{opacity:0; transform:translateY(16px)}to{opacity:1; transform:none}}
.success__mk{width:64px; height:64px; border-radius:50%; border:1px solid var(--earth); display:grid; place-items:center; color:var(--earth); margin-bottom:30px}

/* ---------- footer ---------- */
.foot{background:var(--ink); color:var(--sand); padding-top:clamp(70px,10vw,130px)}
.foot a{color:rgba(245,242,237,.66); transition:color .3s}
.foot a:hover{color:var(--sand)}
.foot__top{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:clamp(30px,4vw,60px); padding-bottom:clamp(50px,7vw,90px)}
.foot__bm{font-size:clamp(2.2rem,7vw,4.4rem); font-weight:600; letter-spacing:-.03em; color:var(--sand); line-height:1; margin-bottom:24px}
.foot__bm .dot{color:var(--earth)}
.foot__brand p{color:rgba(245,242,237,.6); max-width:34ch; font-weight:300}
.foot h5{font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--earth-2); margin-bottom:22px}
.foot ul{list-style:none; display:grid; gap:13px}
.foot ul a{font-size:.95rem}
.foot__addr{font-style:normal; color:rgba(245,242,237,.6); font-size:.95rem; line-height:1.9; font-weight:300}
.foot__bottom{border-top:1px solid rgba(245,242,237,.14); padding:28px 0; display:flex; flex-wrap:wrap;
  gap:14px 30px; justify-content:space-between; align-items:center}
.foot__bottom p{font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; color:var(--gray-2); max-width:none}
.foot__social{display:flex; gap:24px}
.foot__social a{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase}
@media (max-width:860px){.foot__top{grid-template-columns:1fr 1fr; gap:42px}}
@media (max-width:520px){.foot__top{grid-template-columns:1fr}}

/* page-transition veil */
.veil{position:fixed; inset:0; z-index:9000; background:var(--ink); transform:scaleY(0); transform-origin:bottom;
  pointer-events:none}
.veil.in{animation:veilIn .6s var(--ease) forwards}
.veil.out{transform:scaleY(1); transform-origin:top; animation:veilOut .7s var(--ease) forwards}
@keyframes veilIn{to{transform:scaleY(1); transform-origin:bottom}}
@keyframes veilOut{to{transform:scaleY(0); transform-origin:top}}
@media (prefers-reduced-motion:reduce){.veil{display:none}}

/* utilities */
.mt-s{margin-top:1rem}.mt-m{margin-top:2rem}.mt-l{margin-top:clamp(2.4rem,4vw,4rem)}
.mb-l{margin-bottom:clamp(2.4rem,4vw,4rem)}
.maxw-s{max-width:46ch}.maxw-m{max-width:60ch}.center{text-align:center}
.divider{height:1px; background:var(--line); border:0; margin:0}

/* ---------- responsive nav ---------- */
@media (max-width:960px){
  .nav{display:none}
  .burger{display:flex}
}
@media (max-width:680px){
  :root{--fs-mega:clamp(2.8rem,14vw,5rem)}
  .split{grid-template-columns:1fr; gap:38px}
  .ledger{grid-template-columns:1fr 1fr}
  .stat{border-right:1px solid var(--line); border-bottom:1px solid var(--line)}
  .stat:nth-child(2n){border-right:0}
  .case-meta{gap:10px 24px}
  .foot__bm{font-size:clamp(2rem,11vw,3rem)}
}