/* ============================================================
   SECTIONS — per-section layout and typography
   ============================================================ */

/* ---------- MASTHEAD ---------- */
.masthead{position:absolute;top:0;left:0;right:0;z-index:20}
.masthead .wrap{padding-block:36px;align-items:center}
.wordmark{grid-column:1/7;width:235px;height:auto;display:block}

/* ---------- HERO ---------- */
.hero{min-height:100svh;display:flex;align-items:flex-end;
  padding-bottom:clamp(56px,9vh,120px);overflow:clip}
.hero .wrap{width:100%;align-items:end}

/* Ghost mark — tonal (not gold), holds the upper-right void.
   Drifts on scroll via --py set by JS parallax. */
.hero__ghost{
  position:absolute;top:-14%;right:-8%;
  width:clamp(360px,52vw,860px);height:auto;
  opacity:.05;pointer-events:none;z-index:1;
  transform:translate3d(0,var(--py,0),0);
}
.hero__ghost path,.hero__ghost polygon,.hero__ghost rect{fill:#FAF8F4}

.hero__block{grid-column:1/9;position:relative;z-index:2}
.hero__line{
  font-family:var(--serif);font-weight:300;color:var(--ivory);
  font-size:clamp(3.5rem,9.4vw,9.25rem);
  line-height:.96;letter-spacing:-.022em;text-wrap:balance;
  font-feature-settings:"liga" 1,"dlig" 1,"kern" 1;
}
.hero__line em{font-style:italic;color:var(--ivory)}
.hero__rule{
  height:1px;width:clamp(80px,9vw,150px);
  background:linear-gradient(90deg,var(--gold),var(--gold-muted) 72%,transparent);
  margin:clamp(30px,3.8vh,48px) 0 clamp(22px,2.6vh,30px);
}
.hero__sub{
  font-family:var(--sans);font-weight:300;color:var(--t-60);
  font-size:clamp(1rem,1.45vw,1.3rem);letter-spacing:.005em;
  line-height:1.55;max-width:30ch;
}

/* Scroll cue */
.cue{
  position:absolute;right:var(--gutter);bottom:28px;
  display:flex;align-items:center;gap:12px;
  color:var(--t-40);font-family:var(--mono);font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;
  transition:opacity .5s var(--ease);
}
.cue__bar{width:1px;height:40px;background:rgba(201,168,76,.15);
  position:relative;overflow:hidden}
.cue__bar::after{
  content:"";position:absolute;left:0;top:0;width:1px;height:50%;
  background:linear-gradient(var(--gold-bright),transparent);
  opacity:0;animation:cueRun 2s ease-in infinite;
}
@keyframes cueRun{
  0%{transform:translateY(-100%);opacity:1}
  100%{transform:translateY(300%);opacity:.2}
}
body.scrolled .cue{opacity:0;pointer-events:none}

/* ---------- THE FIRM ---------- */
.firm{padding-block:clamp(120px,20vh,230px)}
.firm__head{grid-column:3/8;margin-bottom:40px}
.firm__body{
  grid-column:3/10;font-family:var(--sans);font-weight:300;
  color:var(--t-80);font-size:clamp(1.25rem,1.9vw,1.6rem);
  line-height:1.68;letter-spacing:.002em;max-width:40ch;text-wrap:pretty;
}
/* Figures lifted by brightness + weight — never gold (preserves middle hairline) */
.firm__body .fig{color:var(--t-100);font-weight:400}

/* ---------- THE GEOGRAPHIES ---------- */
.geo{padding-block:clamp(120px,19vh,210px);overflow:clip}
.geo__head{grid-column:2/9;margin-bottom:clamp(28px,4vh,48px)}
.geo__title{
  font-family:var(--serif);font-weight:300;color:var(--ivory);
  font-size:clamp(2.5rem,5vw,4rem);line-height:1.02;
  letter-spacing:-.018em;margin-top:18px;
}
.geo__title em{font-style:italic}
.geo__field{grid-column:1/-1;position:relative;width:100%;margin-top:4px}

/* Desktop globe */
.geo__globe{
  display:block;width:100%;height:auto;
  -webkit-mask-image:radial-gradient(72% 80% at 50% 46%,#000 58%,transparent);
          mask-image:radial-gradient(72% 80% at 50% 46%,#000 58%,transparent);
}
.geo__grat{stroke:var(--t-06);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.geo__sphere{stroke:var(--t-12);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.geo__glow{
  fill:none;stroke:var(--gold);stroke-width:6;vector-effect:non-scaling-stroke;
  filter:blur(7px);opacity:.45;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.5s var(--ease-out);
}
.geo__arc{
  fill:none;stroke:var(--gold);stroke-width:1.6;vector-effect:non-scaling-stroke;
  stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.5s var(--ease-out);
}
.geo__glow.a2,.geo__arc.a2{transition-delay:.55s}
.geo.in .geo__glow,.geo.in .geo__arc{stroke-dashoffset:0}

.gnode{opacity:0;transition:opacity .55s var(--ease-out)}
.geo.in .gnode{opacity:1}
.geo.in .gnode--1{transition-delay:.5s}
.geo.in .gnode--2{transition-delay:.95s}
.geo.in .gnode--3{transition-delay:1.4s}
.gnode__halo{fill:var(--gold);opacity:.13}
.gnode__dot{fill:var(--gold)}

.glabel{opacity:0;transition:opacity .6s var(--ease-out)}
.geo.in .glabel{opacity:1}
.geo.in .glabel--1{transition-delay:.62s}
.geo.in .glabel--2{transition-delay:1.07s}
.geo.in .glabel--3{transition-delay:1.52s}
.glabel__name{fill:var(--ivory);font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:-.01em}
.glabel__coord{fill:var(--t-40);font-family:var(--mono);font-weight:400;font-size:13px;letter-spacing:.04em}

/* Mobile geography list — hidden on desktop */
.geo__list{display:none}

/* ---------- THE APPROACH ---------- */
.approach{padding-block:clamp(96px,16vh,180px)}
.approach__head{grid-column:5/10;margin-bottom:clamp(36px,6vh,64px)}
.approach__list{grid-column:5/11;display:flex;flex-direction:column}
.line{
  display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:baseline;
  padding:clamp(22px,3vh,30px) 0;border-top:1px solid var(--t-08);
}
.line:last-child{border-bottom:1px solid var(--t-08)}
.line__no{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--t-40);padding-top:.55em}
.line__txt{
  font-family:var(--serif);font-weight:300;color:var(--t-90);
  font-size:clamp(1.4rem,2.3vw,2rem);line-height:1.28;
  letter-spacing:-.005em;text-wrap:pretty;
}

/* ---------- CONTACT ---------- */
.contact{padding-block:clamp(96px,16vh,170px);text-align:center}
.contact__inner{grid-column:1/-1}
.contact__mark{width:34px;height:auto;display:block;margin:0 auto clamp(28px,4vh,44px)}
.contact__name{
  font-family:var(--serif);font-weight:400;color:var(--ivory);
  font-size:clamp(1.75rem,3vw,2.5rem);line-height:1.1;letter-spacing:-.01em;
}
.contact__loc{
  font-family:var(--sans);font-weight:500;font-size:12px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--t-60);margin-top:18px;
}
.contact__rule{height:1px;width:56px;background:var(--gold);opacity:.7;
  margin:clamp(30px,4.5vh,48px) auto clamp(26px,4vh,40px)}
.contact__email{
  font-family:var(--sans);font-weight:400;font-size:clamp(1.1rem,1.7vw,1.45rem);
  letter-spacing:.01em;color:var(--gold);display:inline-block;padding-bottom:4px;
  position:relative;transition:color .2s var(--ease);
}
.contact__email::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .35s var(--ease-out);
}
.contact__email:hover,.contact__email:focus-visible{color:var(--gold-bright)}
.contact__email:hover::after,.contact__email:focus-visible::after{transform:scaleX(1)}
.contact__email:focus-visible{outline:2px solid var(--gold);outline-offset:6px}

/* ---------- FOOTER ---------- */
/* --legal (rgba 255/.50) ≈ 4.6:1 on midnight — AA pass.
   Iron #3A4258 = 1.9:1 — hard fail. Never use Iron for text. */
.footer{padding-block:clamp(64px,10vh,110px) clamp(40px,7vh,72px)}
.footer__inner{grid-column:2/12;text-align:center}
.footer__rule{height:1px;background:var(--t-08);margin-bottom:36px}
.footer__legal{
  font-family:var(--mono);font-weight:400;font-size:12px;
  line-height:1.65;letter-spacing:.015em;
  color:var(--legal);
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1024px){
  .wrap{padding-inline:var(--gutter-t)}
  .wordmark{width:215px}
  .hero__block{grid-column:1/11}
  .firm__head{grid-column:2/9}
  .firm__body{grid-column:2/11}
  .geo__head{grid-column:1/9}
  .approach__head{grid-column:3/11}
  .approach__list{grid-column:3/12}
}

@media(max-width:600px){
  .wrap{padding-inline:var(--gutter-m);column-gap:16px}
  .masthead .wrap{padding-block:24px}
  .wordmark{width:150px}

  /* Hero — void moves upper; content anchors low-left */
  .hero{padding-bottom:64px}
  .hero__block{grid-column:1/-1}
  .hero__sub{max-width:26ch}

  /* Firm — small left inset preserves indent asymmetry */
  .firm{padding-block:96px}
  .firm__head{grid-column:1/-1;margin-left:14px}
  .firm__body{grid-column:1/-1;margin-left:14px;max-width:none;font-size:1.2rem}

  /* Geographies — globe hides; regions stack down a vertical gold thread */
  .geo{padding-block:92px}
  .geo__head{grid-column:1/-1}
  .geo__field{grid-column:1/-1;margin-top:20px}
  .geo__globe{display:none}
  .geo__list{
    display:flex;flex-direction:column;gap:46px;
    position:relative;padding-left:30px;
  }
  .geo__list::before{
    content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1px;
    background:linear-gradient(var(--gold),var(--gold-muted));
    transform:scaleY(0);transform-origin:top;
    transition:transform 1.3s var(--ease-out);
  }
  .geo.in .geo__list::before{transform:scaleY(1)}
  .gitem{
    position:relative;opacity:0;transform:translateY(12px);
    transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);
  }
  .geo.in .gitem{opacity:1;transform:none}
  .geo.in .gitem:nth-child(2){transition-delay:.25s}
  .geo.in .gitem:nth-child(3){transition-delay:.5s}
  .gitem__dot{
    position:absolute;left:-34px;top:10px;
    width:9px;height:9px;background:var(--gold);transform:rotate(45deg);
  }
  .gitem__name{font-family:var(--serif);font-weight:400;font-size:1.95rem;color:var(--ivory);line-height:1}
  .gitem__coord{font-family:var(--mono);font-size:12px;color:var(--t-40);letter-spacing:.04em;margin-top:8px}

  /* Approach */
  .approach{padding-block:80px}
  .approach__head{grid-column:1/-1}
  .approach__list{grid-column:1/-1}
  .line{grid-template-columns:auto 1fr;gap:18px}

  /* Contact — already centred */
  .contact{padding-block:84px}

  .footer__inner{grid-column:1/-1}
  .footer__legal{font-size:11.5px}
}

@media(max-width:380px){
  .hero__line{font-size:3rem}
}

@media(max-width:600px){
  .cue{right:var(--gutter-m)}
}