/* ============================================================
   The Leather Restorators / Delhi Hospitality Dossier
   Cartographic counterpiece to the hospitality index.
   Same paper/cream tokens. New ornament grammar.

   Tokens
     ink          #0E0E0E
     ink-soft     #4A4744
     ink-mute     #8A8580
     paper        #FFFFFF
     paper-2      #F6F4F0
     paper-3      #ECE7DF
     tan          #8B5A2B
     tan-deep     #5E3C18
     slate        #4B5564     (new - cooler accent for coordinate readouts)
     hair         rgba(14,14,14,.10)
     hair-strong  rgba(14,14,14,.22)

   Easing / duration
     --e1  cubic-bezier(.6,.01,0,1)
     --e2  cubic-bezier(.2,.7,.2,1)
     --d1 220ms  --d2 640ms  --d3 1400ms
   ============================================================ */

:root{
  --ink:#0E0E0E;
  --ink-soft:#4A4744;
  --ink-mute:#8A8580;
  --paper:#FFFFFF;
  --paper-2:#F6F4F0;
  --paper-3:#ECE7DF;
  --tan:#8B5A2B;
  --tan-deep:#5E3C18;
  --slate:#4B5564;
  --slate-soft:rgba(75,85,100,0.55);
  --hair:rgba(14,14,14,0.10);
  --hair-strong:rgba(14,14,14,0.22);
  --e1:cubic-bezier(.6,.01,0,1);
  --e2:cubic-bezier(.2,.7,.2,1);
  --d1:220ms;
  --d2:640ms;
  --d3:1400ms;
  --display:"Cormorant Garamond","Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --gutter:clamp(20px,4vw,56px);
  --max:1480px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:auto;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.5;
}
body{
  background:var(--paper);
  color:var(--ink);
  min-height:100dvh;
  /* clip (not hidden) - prevents horizontal scrollbars without creating a
     scroll container that would break position:sticky inside descendants */
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Hide native cursor when our custom one is active */
.is-custom-cursor,
.is-custom-cursor a,
.is-custom-cursor button,
.is-custom-cursor [data-hover]{cursor:none;}
.is-custom-cursor input,
.is-custom-cursor textarea,
.is-custom-cursor select{cursor:text;}

::selection{background:var(--ink);color:var(--paper);}

/* Typography spine */
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:500;
  color:var(--ink);
  letter-spacing:-0.012em;
  line-height:1.02;
}
em{font-style:italic;font-weight:400;color:var(--tan-deep);}
p{color:var(--ink-soft);font-size:clamp(15px,1.05vw,17px);line-height:1.6;}
button{font-family:inherit;color:inherit;background:none;border:0;cursor:pointer;}
a{color:inherit;text-decoration:none;}

/* In-content link visibility (per project rule) */
.climate__note a,
.compare__note a,
.feature__copy p a{
  color:var(--tan-deep);
  text-decoration:underline;
  text-decoration-color:rgba(139,90,43,0.45);
  text-underline-offset:4px;
  text-decoration-thickness:1px;
  transition:color var(--d1) var(--e1), text-decoration-color var(--d1) var(--e1);
}
.climate__note a:hover,
.compare__note a:hover,
.feature__copy p a:hover{
  color:var(--ink);
  text-decoration-color:var(--ink);
}

/* Shared section-tag (mono hairline) */
.section-tag{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.section-tag::before{
  content:"";
  display:inline-block;
  width:38px;height:1px;
  background:var(--ink);
}

/* ============================================================
   PROGRESS STRIP (top edge)
   ============================================================ */
.progstrip{
  position:fixed;
  top:0;left:0;right:0;
  height:2px;
  z-index:90;
  pointer-events:none;
  background:transparent;
}
.progstrip__bar{
  display:block;
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--tan-deep),var(--ink) 70%,var(--slate));
  transition:width 80ms linear;
}

/* ============================================================
   CUSTOM CURSOR (lag + states)
   ============================================================ */
.cursor{
  position:fixed;
  pointer-events:none;
  top:0;left:0;
  width:0;height:0;
  z-index:1200;
}
.cursor__dot,
.cursor__ring{
  position:fixed;
  pointer-events:none;
  top:0;left:0;
  border-radius:50%;
  transform:translate3d(-50%,-50%,0);
  will-change:transform,width,height;
}
.cursor__dot{
  width:6px;height:6px;
  background:var(--ink);
}
.cursor__ring{
  width:34px;height:34px;
  border:1px solid var(--ink);
  background:transparent;
  transition:width var(--d1) var(--e1), height var(--d1) var(--e1),
             border-color var(--d1) var(--e1), background var(--d1) var(--e1);
}
.cursor.is-hover .cursor__ring{
  width:78px;height:78px;
  background:rgba(14,14,14,0.06);
  border-color:var(--ink);
}
.cursor.is-text .cursor__dot{width:2px;height:16px;border-radius:0;}
.cursor.is-text .cursor__ring{opacity:0;}
.cursor__label{
  position:fixed;
  top:0;left:0;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink);
  opacity:0;
  transition:opacity var(--d1) var(--e1);
  white-space:nowrap;
}
.cursor.is-hover .cursor__label{opacity:1;}
@media (pointer:coarse){.cursor{display:none;}}

/* ============================================================
   PRELOADER - coordinate plotter
   ============================================================ */
.preload{
  position:fixed;inset:0;
  background:var(--paper);
  z-index:1100;
  display:grid;
  place-items:stretch;
  padding:var(--gutter);
}
.preload__grid{
  align-self:end;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:
    "north  coord"
    "north  display"
    "rule   rule";
  gap:18px 28px;
  width:100%;
}
.preload__north{
  grid-area:north;
  align-self:start;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--ink);
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  border-left:1px solid var(--hair);
  padding-left:8px;
}
.preload__coord{
  grid-area:coord;
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:18px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.preload__coord .preload__label{color:var(--ink);}
.preload__pair{
  display:inline-flex;gap:10px;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.preload__div{color:var(--ink-mute);}
.preload__pct{color:var(--ink);font-variant-numeric:tabular-nums;}
.preload__display{
  grid-area:display;
  position:relative;
  overflow:hidden;
  padding-bottom:0.16em;
}
.preload__word{
  display:block;
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(120px,22vw,360px);
  line-height:0.86;
  letter-spacing:-0.04em;
  color:var(--ink);
  transform:translateY(0);
}
.preload__rule{
  grid-area:rule;
  height:1px;
  background:var(--hair);
  position:relative;
  overflow:hidden;
}
.preload__fill{
  position:absolute;
  inset:0 100% 0 0;
  background:var(--ink);
  transition:right 80ms linear;
}
.is-preloaded .preload{
  pointer-events:none;
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1100ms var(--e1);
}

/* ============================================================
   TOPNAV
   ============================================================ */
.topnav{
  position:fixed;
  top:0;left:0;right:0;
  padding:20px var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:80;
  pointer-events:none;
  background:var(--paper);
  border-bottom:1px solid var(--hair);
  transition:border-color var(--d2) var(--e1), padding var(--d2) var(--e1);
}
.topnav.is-scrolled{
  border-bottom-color:var(--hair-strong);
  padding-top:14px;
  padding-bottom:14px;
}
.topnav > *{pointer-events:auto;}
.topnav__brand{display:inline-flex;align-items:center;line-height:1;color:var(--ink);}
.topnav__brand-mark{
  font-family:'Syne',system-ui,sans-serif;
  font-weight:700;
  font-size:17px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink);
  white-space:nowrap;
}
.topnav__nav{
  display:flex;
  align-items:center;
  gap:34px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}
.topnav__nav a{color:var(--ink);position:relative;padding:6px 0;}
.topnav__nav a::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-2px;
  height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;
  transition:transform var(--d2) var(--e1);
}
.topnav__nav a:hover::after{transform:scaleX(1);}
.topnav__cta{
  border:1px solid var(--ink);
  padding:10px 16px !important;
  border-radius:999px;
}
.topnav__cta::after{display:none;}
.topnav__cta:hover{background:var(--ink);color:var(--paper);}
@media (max-width:720px){
  .topnav{padding:14px var(--gutter);gap:12px;}
  .topnav.is-scrolled{padding-top:11px;padding-bottom:11px;}
  .topnav__brand{min-width:0;flex:1 1 auto;}
  .topnav__brand-mark{font-size:12px;letter-spacing:0.12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
  .topnav__nav{gap:14px;flex:0 0 auto;}
  .topnav__nav a:not(.topnav__cta){display:none;}
  .topnav__cta{padding:8px 14px !important;font-size:10px;white-space:nowrap;}
}
@media (max-width:380px){
  .topnav__brand-mark{font-size:11px;letter-spacing:0.08em;}
}

/* ============================================================
   GENERIC FADE + SPLIT
   ============================================================ */
[data-fade]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity var(--d3) var(--e1), transform var(--d3) var(--e1);
}
[data-fade].is-in{opacity:1;transform:none;}

.split-line{
  display:block;
  overflow:hidden;
  padding-bottom:0.18em;
  margin-bottom:-0.18em;
}
.split-mask{
  display:inline-block;
  overflow:hidden;
  vertical-align:top;
  padding-bottom:0.18em;
  margin-bottom:-0.18em;
  line-height:inherit;
}
.split-char,.split-word{
  display:inline-block;
  transform:translateY(110%);
  transition:transform 1200ms var(--e1);
  will-change:transform;
}
.is-in .split-char,
.is-in .split-word{transform:translateY(0);}

/* Plotted-line stroke draw (SVG paths inside [data-plot]) */
[data-plot] path,
[data-plot] line,
[data-plot] circle{
  stroke-dasharray:1000;
  stroke-dashoffset:1000;
  transition:stroke-dashoffset 1800ms var(--e1);
}
[data-plot].is-plot path,
[data-plot].is-plot line,
[data-plot].is-plot circle{
  stroke-dashoffset:0;
}
[data-plot] [fill="currentColor"]{
  opacity:0;
  transition:opacity 400ms var(--e1) 1400ms;
}
[data-plot].is-plot [fill="currentColor"]{opacity:1;}

/* Image clip reveal */
[data-reveal] img{
  clip-path:inset(102% 0 0 0);
  transition:clip-path 1400ms var(--e1);
}
[data-reveal].is-in img{clip-path:inset(0 0 0 0);}

/* ============================================================
   01 / HERO - dense editorial dossier
   ============================================================ */
.hero{
  position:relative;
  padding:110px var(--gutter) 40px;
  display:flex;
  flex-direction:column;
  gap:clamp(28px,3.5vw,56px);
}
.hero__rule{
  position:absolute;
  left:var(--gutter);
  right:var(--gutter);
  top:96px;
  height:1px;
  background:var(--hair);
  pointer-events:none;
}
.hero__rule-tick{
  position:absolute;
  left:0;top:-3px;
  width:1px;height:7px;
  background:var(--ink);
}
.hero__top{
  display:grid;
  grid-template-columns:1.05fr clamp(360px,38vw,580px);
  column-gap:clamp(28px,4vw,80px);
  row-gap:clamp(20px,3vw,40px);
  align-items:stretch;
}

/* LEFT column : dense editorial stack */
.hero__col{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.hero__eyebrow-date{
  margin-left:auto;
  color:var(--slate);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
}
.hero__big{
  margin-top:18px;
}
.hero__sub-head{margin-top:22px;}
.hero__lede{
  margin-top:24px;
  font-size:clamp(15px,1.05vw,17px);
  color:var(--ink-soft);
  max-width:54ch;
  line-height:1.6;
}

/* Precinct tag rail - inline marker pills */
.hero__precincts{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px 10px;
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--hair);
}
.hero__precincts li{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px 6px 8px;
  border:1px solid var(--hair-strong);
  border-radius:999px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink);
  background:var(--paper);
  transition:border-color var(--d1) var(--e1), background var(--d1) var(--e1);
}
.hero__precincts li span{
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.16em;
  color:var(--paper);
  background:var(--ink);
  padding:3px 6px;
  border-radius:999px;
}
.hero__precincts li:hover{
  border-color:var(--ink);
  background:var(--paper-2);
}

/* Compact stat strip */
.hero__stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  margin-top:24px;
  border-top:1px solid var(--ink);
}
.hero__stats > div{
  padding:14px clamp(8px,1vw,16px) 4px 0;
  display:flex;
  flex-direction:column;
  gap:4px;
  border-right:1px solid var(--hair);
}
.hero__stats > div:last-child{border-right:0;padding-right:0;}
.hero__stats dt{
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.hero__stats dd{
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(28px,2.8vw,44px);
  color:var(--ink);
  line-height:1;
  font-variant-numeric:tabular-nums;
  letter-spacing:-0.015em;
}
.hero__stats dd span{
  font-family:var(--mono);
  font-style:normal;
  font-size:10px;
  letter-spacing:0.18em;
  margin-left:5px;
  color:var(--ink-mute);
  text-transform:lowercase;
  vertical-align:baseline;
}

/* CTA row */
.hero__cta-row{
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
  margin-top:32px;
}
.hero__cta{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 22px;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  transition:background var(--d2) var(--e1), color var(--d2) var(--e1);
}
.hero__cta:hover{background:var(--paper);color:var(--ink);}
.hero__cta svg{display:block;}

/* RIGHT column : editorial plate */
.hero__plate{
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  border:1px solid var(--hair);
  align-self:stretch;
  min-height:580px;
  display:flex;
  flex-direction:column;
}
.hero__plate img{
  width:100%;
  flex:1;
  object-fit:cover;
  display:block;
  transform:scale(1.08);
  transition:transform 8s var(--e1);
}
.hero__plate.is-in img{transform:scale(1);}

.hero__plate-mark{
  position:absolute;
  top:14px;left:14px;right:14px;
  display:flex;
  align-items:center;
  gap:10px;
  z-index:3;
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--paper);
  text-shadow:0 1px 8px rgba(0,0,0,0.5);
}
.hero__plate-mark-line{
  flex:1;
  height:1px;
  background:rgba(255,255,255,0.55);
}
.hero__plate-cap{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:clamp(20px,2.4vw,32px);
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:
    "no    title"
    "no    meta";
  column-gap:14px;
  row-gap:4px;
  color:var(--paper);
  background:linear-gradient(to top, rgba(14,14,14,0.85) 0%, rgba(14,14,14,0.25) 60%, rgba(14,14,14,0) 100%);
}
.hero__plate-cap-no{
  grid-area:no;
  align-self:center;
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(34px,3vw,52px);
  line-height:1;
  letter-spacing:-0.015em;
}
.hero__plate-cap-title{
  grid-area:title;
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(16px,1.3vw,22px);
  line-height:1.1;
  letter-spacing:-0.005em;
  align-self:end;
}
.hero__plate-cap-meta{
  grid-area:meta;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.85);
}
.hero__eyebrow{
  display:flex;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.hero__eyebrow-num{
  border:1px solid var(--hair-strong);
  padding:5px 10px;border-radius:999px;
  color:var(--ink);
}
.hero__eyebrow-sep{
  display:inline-block;
  width:36px;height:1px;background:var(--ink);
}
.hero__big{
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(56px,8vw,148px);
  line-height:0.84;
  letter-spacing:-0.045em;
  color:var(--ink);
}
/* Megasplit per-letter mask */
.hero__big .ms{
  display:inline-block;
  overflow:hidden;
  vertical-align:top;
  padding-bottom:0.14em;
  margin-bottom:-0.14em;
  padding-left:0.1em;
  margin-left:-0.1em;
  padding-right:0.12em;
  margin-right:-0.12em;
  line-height:inherit;
}
.hero__big .ms-c{
  display:inline-block;
  transform:translateY(112%);
  transition:transform 1300ms var(--e1);
  will-change:transform;
}
.hero__big.is-in .ms-c{transform:translateY(0);}
.hero__sub-head{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(22px,2.4vw,38px);
  line-height:1.05;
  letter-spacing:-0.018em;
  color:var(--ink);
  max-width:46ch;
}
/* Full-bleed three-frame editorial film strip */
.hero__strip{
  display:grid;
  grid-template-columns:1.4fr 1fr 1.2fr;
  gap:clamp(4px,0.6vw,10px);
  margin:clamp(24px,3vw,48px) 0 0;
  /* bleed past gutter to page edges */
  margin-left:calc(var(--gutter) * -1);
  margin-right:calc(var(--gutter) * -1);
  padding:0 var(--gutter);
  border-top:1px solid var(--ink);
  padding-top:24px;
}
.hero__strip-frame{
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  aspect-ratio:4 / 3;
}
.hero__strip-frame:nth-child(2){aspect-ratio:3 / 4;align-self:end;}
.hero__strip-frame:nth-child(3){aspect-ratio:5 / 4;}
.hero__strip-frame img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.06);
  transition:transform 7s var(--e1);
}
.hero__strip-frame.is-in img{transform:scale(1);}
.hero__strip-frame figcaption{
  position:absolute;
  left:14px;right:auto;bottom:14px;
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
  background:rgba(10,8,6,0.38);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-radius:6px;
  padding:10px 14px 12px;
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--paper);
}
.strip-cap__top{
  display:flex;
  align-items:center;
  gap:8px;
}
.strip-cap__desc{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.06em;
  color:rgba(255,255,255,0.82);
  text-transform:none;
  line-height:1.55;
  margin:0;
  max-width:28ch;
}
.hero__strip-frame figcaption span:first-child{
  border:1px solid rgba(255,255,255,0.55);
  padding:3px 6px;
  border-radius:3px;
  letter-spacing:0.1em;
}

.hero__begin{
  align-self:center;
  display:inline-flex;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink);
}
.hero__begin-line{
  display:inline-block;
  width:60px;height:1px;background:var(--ink);
  transform-origin:left;
  animation:gScrollHint 2.6s var(--e1) infinite;
}
@keyframes gScrollHint{
  0%{transform:scaleX(0);transform-origin:left;}
  45%{transform:scaleX(1);transform-origin:left;}
  55%{transform:scaleX(1);transform-origin:right;}
  100%{transform:scaleX(0);transform-origin:right;}
}

@media (max-width:960px){
  .hero{padding-top:120px;}
  .hero__rule{top:108px;}
  .hero__top{
    grid-template-columns:1fr;
    row-gap:24px;
  }
  .hero__plate{min-height:auto;aspect-ratio:4 / 5;}
  .hero__stats{grid-template-columns:repeat(2,1fr);}
  .hero__stats > div:nth-child(2){border-right:0;}
  .hero__strip{
    grid-template-columns:1fr;
    gap:8px;
  }
  .hero__strip-frame,
  .hero__strip-frame:nth-child(2),
  .hero__strip-frame:nth-child(3){aspect-ratio:16 / 10;}
  .hero__eyebrow-date{margin-left:0;flex-basis:100%;}
}
@media (max-width:560px){
  .hero{padding:96px var(--gutter) 32px;gap:0;}
  .hero__rule{top:84px;}
  .hero__top{display:flex;flex-direction:column;gap:0;}
  .hero__col{display:contents;}
  .hero__big{order:2;}
  .hero__sub-head{order:3;}
  .hero__plate{order:4;}
  .hero__lede{order:5;}
  .hero__cta-row{order:6;}
  .hero__eyebrow{display:none;order:1;}
  .hero__big{font-size:clamp(46px,15vw,80px);line-height:0.86;margin-top:18px;}
  .hero__sub-head{
    position:relative;font-size:25px;font-weight:600;line-height:1.06;
    letter-spacing:-0.025em;margin-top:20px;padding-top:16px;
    max-width:none;color:var(--ink);text-align:justify;text-align-last:left;
  }
  .hero__sub-head::before{
    content:"";position:absolute;top:0;left:0;width:34px;height:2px;background:var(--ink);
  }
  .hero__sub-head em,.hero__sub-head br{display:none;}
  .hero__plate{
    min-height:0;aspect-ratio:4/5;
    margin:24px calc(var(--gutter)*-1) 0;
    border-left:0;border-right:0;border-radius:0;
  }
  .hero__plate-mark{font-size:8px;}
  .hero__plate-cap{padding:18px var(--gutter);}
  .hero__lede{font-size:14.5px;line-height:1.55;margin-top:22px;max-width:46ch;}
  .hero__lede + .hero__lede{display:none;}
  .hero__precincts,.hero__stats,.hero__begin,.hero__strip{display:none;}
  .hero__cta-row{margin-top:24px;gap:14px;}
  .hero__cta{padding:13px 20px;font-size:10px;width:100%;justify-content:center;}
}
@media (max-width:380px){
  .hero__big{font-size:clamp(40px,16vw,58px);}
  .hero__sub-head{font-size:22px;}
}
@media (max-width:520px){
  .hero__stats dd{font-size:28px;}
  .hero__big{font-size:clamp(48px,13vw,92px);}
  .hero__cta-row{gap:14px;}
  .hero__cta{padding:12px 18px;font-size:10px;}
}

/* ============================================================
   02 / CLIMATE - The Gurugram almanac
   - Season-coloured arcs on a calendrical ring
   - Four specimen chapters with monumental deltas
   - Light-themed; restraint over accumulation
   ============================================================ */
.climate{
  --season-i:  #c98a3a;   /* pre-monsoon / heated tan */
  --season-ii: #4b5564;   /* monsoon / slate */
  --season-iii:#8b5a2b;   /* wedding season / deep tan */
  --season-iv: #5e3c18;   /* year-round / ink-tan */
  position:relative;
  padding:clamp(84px,10vw,160px) var(--gutter) clamp(72px,8vw,128px);
  border-top:1px solid var(--hair);
  background:var(--paper);
  isolation:isolate;
}
.climate::before{
  /* faint cartographic grid lines, restrained, single-pass */
  content:"";
  position:absolute;inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(14,14,14,0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,14,14,0.035) 1px, transparent 1px);
  background-size:clamp(60px,8vw,120px) clamp(60px,8vw,120px);
  background-position:0 0;
  mask-image:linear-gradient(180deg, transparent 0, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 12%, #000 88%, transparent 100%);
  z-index:-1;
}

/* ---- HEAD ---- */
.climate__head .section-tag{
  font-size:10px;
  color:var(--ink);
  border:1px solid var(--hair-strong);
  padding:7px 14px;
  border-radius:999px;
  width:fit-content;
  gap:0;
}
.climate__head .section-tag::before{display:none;}
.precincts__head .section-tag,
.typology__head .section-tag,
.protocol__head .section-tag,
.compare__head .section-tag,
.feature__copy .section-tag,
.faq__top .section-tag,
.inquire__head .section-tag{
  font-size:10px; color:var(--ink); border:1px solid var(--hair-strong);
  padding:7px 14px; border-radius:999px; align-self:flex-start;
  width:fit-content; gap:0;
}
.precincts__head .section-tag::before,
.typology__head .section-tag::before,
.protocol__head .section-tag::before,
.compare__head .section-tag::before,
.feature__copy .section-tag::before,
.faq__top .section-tag::before,
.inquire__head .section-tag::before{display:none;}
.inquire__field input::placeholder,
.inquire__field textarea::placeholder{color:var(--ink-mute);opacity:0.5;}
.climate__head{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:clamp(16px,3vw,40px);
  padding-bottom:24px;
  border-bottom:1px solid var(--hair);
}
.climate__index{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  justify-self:center;
}
.climate__meridian{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.climate__meridian-dot{
  width:4px;height:4px;border-radius:50%;
  background:var(--ink);
  display:inline-block;
}

/* ---- ALMANAC : two-column / lede + ring ---- */
.climate__almanac{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(36px,5vw,96px);
  align-items:center;
  padding:clamp(24px,3vw,48px) 0 clamp(32px,4vw,64px);
}
.climate__lede-wrap{
  display:flex;
  flex-direction:column;
  gap:clamp(22px,2.6vw,36px);
  max-width:52ch;
}
.climate__chapter{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.28em;
  text-transform:uppercase;
  color:var(--ink-mute);
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.climate__chapter::before{
  content:"";
  display:inline-block;
  width:28px;height:1px;
  background:var(--ink);
}
.climate__lede{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(26px,3.2vw,58px);
  line-height:1.02;
  letter-spacing:-0.022em;
  color:var(--ink);
  max-width:none;
}
.climate__lede-note{
  font-family:var(--display);
  font-style:italic;
  font-size:clamp(15px,1.2vw,18px);
  line-height:1.5;
  color:var(--ink-soft);
  max-width:42ch;
  border-left:1px solid var(--hair-strong);
  padding-left:18px;
}

/* legend (paired with arcs) */
.climate__legend{
  display:flex;
  flex-direction:column;
  margin-top:clamp(8px,1.4vw,20px);
}
.climate__legend-row{
  display:grid;
  grid-template-columns:24px 1fr auto;
  align-items:center;
  gap:14px;
  padding:12px 0;
  border-top:1px solid var(--hair);
}
.climate__legend-row:last-child{border-bottom:1px solid var(--hair);}
.climate__legend-swatch{
  width:18px;height:6px;
  display:inline-block;
  transition:transform var(--d2) var(--e1), width var(--d2) var(--e1);
}
.climate__legend-swatch[data-season="i"]  {background:var(--season-i);}
.climate__legend-swatch[data-season="ii"] {background:var(--season-ii);}
.climate__legend-swatch[data-season="iii"]{background:var(--season-iii);}
.climate__legend-swatch[data-season="iv"] {background:var(--season-iv);}
.climate__legend-row:hover .climate__legend-swatch{width:30px;}
.climate__legend-name{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink);
}
.climate__legend-window{
  font-family:var(--display);
  font-style:italic;
  font-size:14px;
  color:var(--ink-soft);
}

/* ---- THE RING ---- */
.climate__ring{
  position:relative;
  width:100%;
  aspect-ratio:1 / 1;
  max-width:544px;
  justify-self:end;
  color:var(--ink);
}
.climate__ring-svg{
  width:100%;height:100%;display:block;
  overflow:visible;
}
.climate__arc{
  stroke-dasharray:var(--arc-len, 0);
  stroke-dashoffset:var(--arc-len, 0);
  transition:stroke-dashoffset var(--d3) var(--e1);
  opacity:0.92;
}
.climate__ring.is-in .climate__arc{stroke-dashoffset:0;}
.climate__arc--i  {stroke:var(--season-i);   transition-delay:0.10s;}
.climate__arc--ii {stroke:var(--season-ii);  transition-delay:0.32s;}
.climate__arc--iii{stroke:var(--season-iii); transition-delay:0.54s;}
.climate__arc--iv {stroke:var(--season-iv);  transition-delay:0.76s;}

.climate__ring-months text{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  fill:var(--ink-mute);
  opacity:0;
  transform-origin:center;
  transition:opacity var(--d2) var(--e1);
}
.climate__ring.is-in .climate__ring-months text{opacity:1;transition-delay:0.95s;}

.climate__ring-eyebrow{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.28em;
  text-transform:uppercase;
  fill:var(--ink-mute);
}
.climate__ring-title{
  font-family:var(--display);
  font-style:italic;
  font-size:30px;
  fill:var(--ink);
  letter-spacing:-0.01em;
}
.climate__ring-sub{
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  fill:var(--ink-mute);
}
.climate__ring-cap{
  position:absolute;
  left:0;right:0;bottom:-36px;text-align:center;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}

/* Left-gutter vertical scroll-progress for the pinned spec cards (phone only) */
.spec-progress{
  display:none;
  position:fixed;
  left:8px;top:50%;transform:translateY(-50%);
  width:3px;height:40vh;
  background:var(--hair-strong);border-radius:3px;
  z-index:70;opacity:0;transition:opacity .35s var(--e1);
  pointer-events:none;overflow:hidden;
}
.spec-progress.is-active{opacity:1;}
.spec-progress__fill{
  position:absolute;left:0;top:0;width:100%;height:0%;
  background:var(--ink);border-radius:3px;transition:height .12s linear;
}
.spec-progress__ticks{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(var(--paper),var(--paper)) left 0 top 25% / 100% 1px no-repeat,
    linear-gradient(var(--paper),var(--paper)) left 0 top 50% / 100% 1px no-repeat,
    linear-gradient(var(--paper),var(--paper)) left 0 top 75% / 100% 1px no-repeat;
  opacity:0.6;
}

/* ---- SPECIMENS : four editorial chapters, sticky-stacked ---- */
.climate__specimens{
  list-style:none;
  position:relative;
  border-top:1px solid var(--ink);
  padding-bottom:clamp(40px,5vw,80px);
}
.spec{
  position:sticky;
  /* Pins right below the actual topnav (~60px tall) with a small stagger
     so previous cards peek through. Keeps the "02" headline kissing the
     top edge instead of floating in dead paper. */
  top:calc(60px + var(--card-i, 0) * 10px);
  background:var(--paper);
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  grid-template-rows:auto auto auto;
  grid-template-areas:
    "rule  rule"
    "head  delta"
    "plate body";
  column-gap:clamp(36px,5vw,80px);
  row-gap:clamp(10px,1.2vw,18px);
  padding:clamp(10px,1.2vw,16px) 0 clamp(20px,2.4vw,32px);
  border-bottom:1px solid var(--hair);
  transition:transform var(--d2) var(--e1);
}
.spec__rule{
  grid-area:rule;
  display:flex;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--ink-mute);
  padding-bottom:2px;
}
.spec__rule span{
  display:block;
  height:2px;
  flex:1;
  background:currentColor;
  opacity:0.55;
}
.spec[data-season="i"]   .spec__rule{color:var(--season-i);}
.spec[data-season="ii"]  .spec__rule{color:var(--season-ii);}
.spec[data-season="iii"] .spec__rule{color:var(--season-iii);}
.spec[data-season="iv"]  .spec__rule{color:var(--season-iv);}

.spec__head{
  grid-area:head;
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:clamp(18px,2.4vw,40px);
  column-gap:clamp(24px,3vw,48px);
}
.spec__num{
  font-family:var(--display);
  font-style:italic;
  font-weight:500;
  font-size:clamp(64px,9vw,140px);
  line-height:0.82;
  letter-spacing:-0.04em;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
  display:inline-block;
  /* Pulls the visible glyph up against the row top - cancels the gap
     created by the italic font's intrinsic top-side bearing. */
  margin-top:-0.08em;
  transition:transform var(--d2) var(--e2);
  will-change:transform;
}
.spec__season{
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(22px,2vw,32px);
  color:var(--ink);
  letter-spacing:-0.008em;
}
.spec__window{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
  align-self:end;
  padding-bottom:6px;
}

/* The plate : image evidence (uses global [data-reveal] img curtain) */
.spec__plate{
  grid-area:plate;
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  /* Editorial plate ratio - same shape across all four cards so the stack reads as a set */
  aspect-ratio:16/10;
  border:1px solid var(--hair);
}
.spec__plate img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.08);
  filter:saturate(0.92) contrast(1.02);
  /* preserve clip-path from global [data-reveal] img + add our own */
  transition:clip-path 1400ms var(--e1),
             transform 1.8s var(--e1),
             filter var(--d2) var(--e1);
}
.spec__plate.is-in img{transform:scale(1.01);}
.spec__plate:hover img{transform:scale(1.05);filter:saturate(1) contrast(1.04);}
.spec__plate figcaption{
  position:absolute;
  left:14px;bottom:14px;
  padding:6px 10px;
  background:var(--paper);
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--ink);
  border:1px solid var(--hair);
}
.spec__plate::after{
  /* corner tick : cartographic mark */
  content:"";
  position:absolute;
  top:14px;right:14px;
  width:18px;height:18px;
  background:
    linear-gradient(to right, var(--ink) 8px, transparent 8px) 100% 0/100% 1px no-repeat,
    linear-gradient(to bottom, var(--ink) 8px, transparent 8px) 100% 0/1px 100% no-repeat;
  opacity:0.7;
}

/* The body copy block */
.spec__body{
  grid-area:body;
  display:flex;
  flex-direction:column;
  gap:18px;
  align-self:start;
  padding-top:clamp(8px,1.4vw,20px);
}
.spec__title{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(26px,2.4vw,40px);
  line-height:1.05;
  letter-spacing:-0.012em;
  color:var(--ink);
  max-width:18ch;
}
.spec__body p{
  font-size:clamp(15px,1.05vw,17px);
  color:var(--ink-soft);
  line-height:1.65;
  max-width:46ch;
}
.spec__body p a{
  color:var(--tan-deep);
  text-decoration:underline;
  text-decoration-color:rgba(139,90,43,0.45);
  text-underline-offset:3px;
  text-decoration-thickness:1px;
  transition:color var(--d1) var(--e1), text-decoration-color var(--d1) var(--e1);
}
.spec__body p a:hover{
  color:var(--ink);
  text-decoration-color:var(--ink);
}

/* The monumental delta value */
.spec__delta{
  grid-area:delta;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  text-align:right;
  padding-left:24px;
  border-left:1px solid var(--hair);
  align-self:start;
  padding-top:clamp(8px,1.4vw,20px);
  gap:10px;
}
.spec__delta-label{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.spec__delta-val{
  font-family:var(--display);
  font-style:italic;
  font-weight:500;
  font-size:clamp(58px,7.5vw,124px);
  line-height:0.88;
  letter-spacing:-0.04em;
  color:var(--tan-deep);
  font-variant-numeric:tabular-nums;
  display:inline-block;
}
.spec[data-season="i"]   .spec__delta-val{color:var(--season-i);}
.spec[data-season="ii"]  .spec__delta-val{color:var(--season-ii);}
.spec[data-season="iii"] .spec__delta-val{color:var(--season-iii);}
.spec[data-season="iv"]  .spec__delta-val{color:var(--season-iv);}
.spec__delta-note{
  font-family:var(--display);
  font-style:italic;
  font-size:13px;
  color:var(--ink-soft);
}

/* ---- FOOTER (filed-under stamp + inline links) ---- */
.climate__foot{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:start;
  gap:clamp(20px,3vw,48px);
  padding-top:clamp(36px,4vw,64px);
}
.climate__foot-stamp{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--ink);
  border:1px solid var(--ink);
  padding:10px 14px;
  align-self:start;
  white-space:nowrap;
}
.climate__note{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.04em;
  color:var(--ink-soft);
  max-width:74ch;
  line-height:1.75;
  text-transform:none;
}
.climate__note a{
  color:var(--tan-deep);
  text-decoration:underline;
  text-decoration-color:rgba(139,90,43,0.45);
  text-underline-offset:4px;
  text-decoration-thickness:1px;
  transition:color var(--d1) var(--e1), text-decoration-color var(--d1) var(--e1);
}
.climate__note a:hover{
  color:var(--ink);
  text-decoration-color:var(--ink);
}

/* ---- responsive ---- */
@media (max-width:1100px){
  .climate__almanac{
    grid-template-columns:1fr;
    gap:clamp(40px,6vw,72px);
  }
  .climate__ring{
    max-width:416px;
    margin:0 auto;
    justify-self:center;
  }
  .spec{
    /* Drop sticky pin on tablet/mobile - flow naturally */
    position:relative;
    top:auto;
    margin-bottom:0;
    min-height:0;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-rows:auto auto auto auto;
    grid-template-areas:
      "rule  rule"
      "head  head"
      "plate plate"
      "body  delta";
  }
  .spec__plate{aspect-ratio:16 / 10;min-height:0;}
  .spec__delta{
    align-items:flex-start;
    text-align:left;
    border-left:0;
    border-top:1px solid var(--hair);
    padding:18px 0 0;
  }
  .spec__num{font-size:clamp(80px,18vw,140px);}
}
@media (max-width:680px){
  .climate__head{
    grid-template-columns:1fr;
    text-align:left;
    gap:14px;
    padding-bottom:20px;
  }
  .climate__index,.climate__meridian{display:none;}
  .precincts .precinct__meta{display:none;}
  .climate__lede{max-width:none;text-align:justify;text-align-last:left;}
  .climate__lede br{display:none;}
  .climate__ring-cap{position:static;margin-top:22px;text-align:center;}
  .climate__almanac{padding-top:22px;}
  .spec__rule{display:none;}
  .spec-progress{display:block;}
  .spec{
    position:sticky;
    top:calc(18px + var(--card-i,0)*8px);
    min-height:100vh;min-height:100dvh;
    margin-bottom:0;padding:18px 0 20px;row-gap:12px;
    grid-template-areas:"rule" "head" "plate" "body" "delta";
    grid-template-columns:1fr;
  }
  .spec__head{flex-direction:column;align-items:flex-start;gap:4px;}
  .spec__num{font-size:clamp(52px,15vw,84px);line-height:0.85;}
  .spec__season{font-size:18px;}
  .spec__window{padding-bottom:0;}
  .spec__plate{min-height:26vh;}
  .spec__body p{font-size:13.5px;line-height:1.5;}
  .spec__delta-val{
    position:absolute;top:58%;right:0;transform:translateY(-50%);
    font-size:clamp(44px,12vw,72px);line-height:0.85;z-index:2;
  }
  .spec__delta{align-items:flex-start;text-align:left;padding-left:0;border-left:0;}
  .climate__foot{grid-template-columns:1fr;}
  .climate__foot-stamp{white-space:normal;justify-self:start;max-width:100%;line-height:1.6;}
  .climate__note{overflow-wrap:break-word;}
}

/* ============================================================
   03 / PRECINCTS (horizontal draggable rail)
   ============================================================ */
.precincts{
  padding:clamp(72px,9vw,140px) 0 clamp(56px,7vw,96px);
  border-top:1px solid var(--hair);
  background:var(--paper-2);
  overflow:hidden;
}
.precincts__head{
  padding:0 var(--gutter);
  display:flex;
  flex-direction:column;
  gap:24px;
  max-width:var(--max);
  margin:0 auto;
}
.precincts__h{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(40px,6vw,108px);
  line-height:0.96;
  letter-spacing:-0.026em;
  color:var(--ink);
  margin-top:8px;
}
.precincts__h em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}
.precincts__note{
  max-width:none;
  font-size:clamp(14px,1vw,16px);
  color:var(--ink-soft);
  line-height:1.65;
}

.precincts__rail-wrap{
  position:relative;
  margin-top:clamp(36px,5vw,72px);
}
.precincts__rail{
  list-style:none;
  display:flex;
  gap:clamp(16px,2.5vw,36px);
  padding:8px var(--gutter) 100px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  cursor:grab;
}
.precincts__rail::-webkit-scrollbar{display:none;}
.precincts__rail.is-dragging{cursor:grabbing;}
.precinct{
  flex:0 0 clamp(345px,39.1vw,529px);
  scroll-snap-align:start;
  background:var(--paper);
  border:1px solid var(--hair);
  padding:0 0 28px;
  display:flex;
  flex-direction:column;
  gap:14px;
  position:relative;
  min-height:385px;
  overflow:hidden;
  transition:transform var(--d2) var(--e1), border-color var(--d2) var(--e1), box-shadow var(--d2) var(--e1);
}
.precinct__plate{
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  aspect-ratio:5 / 2;
  margin-bottom:14px;
  border-bottom:1px solid var(--hair);
}
.precinct__plate img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.06);
  transition:transform 5s var(--e1);
}
.precinct__plate.is-in img{transform:scale(1);}
.precinct:hover .precinct__plate img{transform:scale(1.04);}
.precinct > :not(.precinct__plate){padding-left:28px;padding-right:28px;}
.precinct::after{
  content:"";
  position:absolute;
  top:14px;right:14px;
  width:10px;height:10px;
  border:1px solid rgba(255,255,255,0.85);
  border-radius:50%;
  z-index:2;
  mix-blend-mode:difference;
}
.precinct:hover{
  border-color:var(--ink);
  transform:translateY(-4px);
  box-shadow:0 24px 40px -28px rgba(14,14,14,0.18);
}
.precinct__no{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.precinct__coord{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.18em;
  color:var(--slate);
  font-variant-numeric:tabular-nums;
}
.precinct__name{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(28px,2.6vw,42px);
  color:var(--ink);
  letter-spacing:-0.012em;
  margin-top:6px;
}
.precinct__type{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.precinct__desc{
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.65;
}
.precinct__meta{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
  border-top:1px solid var(--hair);
  padding-top:14px;
}
.precinct__meta > div{
  display:flex;
  justify-content:space-between;
  gap:18px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}
.precinct__meta dt{color:var(--ink-mute);}
.precinct__meta dd{color:var(--ink);text-align:right;}

.precincts__hud{
  position:absolute;
  bottom:24px;
  left:var(--gutter);
  right:var(--gutter);
  display:flex;
  align-items:center;
  gap:18px;
  pointer-events:none;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.precincts__hud-label{color:var(--ink);}
.precincts__hud-line{
  flex:1;
  height:1px;
  background:var(--hair);
  position:relative;
  overflow:hidden;
}
.precincts__hud-line span{
  position:absolute;
  left:0;top:0;bottom:0;
  width:20%;
  background:var(--ink);
  transition:left var(--d1) var(--e1), width var(--d1) var(--e1);
}
.precincts__hud-count{
  color:var(--ink);
  font-variant-numeric:tabular-nums;
  letter-spacing:0.18em;
}
.precincts__hud-of{color:var(--ink-mute);margin:0 4px;}

@media (max-width:720px){
  .precinct{min-height:auto;flex:0 0 330px;gap:10px;padding-bottom:34px;}
  .precinct__plate{aspect-ratio:2/1;margin-bottom:10px;}
  .precinct::before{
    content:"Swipe \2192";
    position:absolute;left:50%;bottom:11px;transform:translateX(-50%);
    font-family:var(--mono);font-size:9px;letter-spacing:0.24em;
    text-transform:uppercase;color:var(--ink-mute);z-index:3;
    pointer-events:none;animation:precinctSwipe 1.8s var(--e1) infinite;
  }
  .precinct:last-child::before{display:none;}
}
@keyframes precinctSwipe{
  0%,100%{transform:translateX(-50%);opacity:0.55;}
  50%{transform:translateX(calc(-50% + 5px));opacity:1;}
}

/* ============================================================
   04 / TYPOLOGY (sticky-stacked cards)
   ============================================================ */
.typology{
  padding:clamp(72px,9vw,140px) var(--gutter) 0;
  border-top:1px solid var(--hair);
}
.typology__head{
  display:flex;
  flex-direction:column;
  gap:18px;
  margin-bottom:clamp(56px,7vw,96px);
}
.typology__h{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(40px,5.5vw,96px);
  line-height:0.98;
  letter-spacing:-0.024em;
  color:var(--ink);
  max-width:18ch;
}
.typology__h em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}
.typology__stack{
  position:relative;
  padding-bottom:80px;
}
.card{
  position:sticky;
  top:calc(86px + var(--card-i) * 16px);
  background:var(--paper);
  border:1px solid var(--hair);
  margin-bottom:clamp(24px,3vw,40px);
  transition:transform var(--d2) var(--e1), border-color var(--d2) var(--e1);
}
.card__inner{
  display:grid;
  grid-template-columns:80px 1fr 1fr;
  gap:clamp(20px,3vw,48px);
  padding:clamp(36px,5vw,72px) clamp(28px,4vw,64px);
  align-items:stretch;
}
.card__no{
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(40px,4vw,68px);
  color:var(--tan-deep);
  line-height:0.9;
}
.card__text{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.card__tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.card__title{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(26px,2.4vw,44px);
  color:var(--ink);
  letter-spacing:-0.018em;
  line-height:1.05;
  max-width:18ch;
}
.card__text p{
  font-size:clamp(14px,1vw,16px);
  color:var(--ink-soft);
  line-height:1.65;
  max-width:50ch;
}
.card__meta{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:18px;
  border-top:1px solid var(--hair);
}
.card__meta > div{
  display:flex;
  justify-content:space-between;
  gap:18px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}
.card__meta dt{color:var(--ink-mute);}
.card__meta dd{color:var(--ink);text-align:right;}
.card__plate{
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  min-height:340px;
}
.card__plate img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.04);
  transition:transform 4s var(--e1);
}
.card:hover .card__plate img{transform:scale(1);}

@media (max-width:960px){
  .card{position:relative;top:auto;}
  .card__inner{
    grid-template-columns:auto 1fr;
    grid-template-areas:"plate plate" "no text";
    column-gap:12px;align-items:baseline;
  }
  .card__plate{grid-area:plate;min-height:0;aspect-ratio:16/10;}
  .card__no{grid-area:no;font-size:22px;line-height:1;}
  .card__text{grid-area:text;}
}

/* ============================================================
   05 / PROTOCOL (scroll-scrubbed horizontal pin)
   ============================================================ */
.protocol{
  position:relative;
  border-top:1px solid var(--hair);
  background:var(--paper);
  /* total scroll length = 600vh, six phases of 100vh each */
  height:600vh;
}
.protocol__sticky{
  position:sticky;
  top:0;
  height:100vh;
  display:flex;
  flex-direction:column;
  padding:96px var(--gutter) 56px;
  overflow:hidden;
}
.protocol__head{
  display:flex;
  flex-direction:column;
  gap:14px;
  max-width:62ch;
}
.protocol__h{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(34px,4.4vw,72px);
  line-height:1;
  letter-spacing:-0.022em;
  color:var(--ink);
  margin-top:4px;
}
.protocol__h em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}
.protocol__note{
  max-width:54ch;
  font-size:clamp(14px,1vw,16px);
  color:var(--ink-soft);
  line-height:1.65;
}
.protocol__hud{
  position:absolute;
  top:var(--gutter);
  right:var(--gutter);
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  font-family:var(--mono);
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink);
  z-index:3;
}
.protocol__hud-time{
  font-size:clamp(36px,5vw,72px);
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  letter-spacing:-0.02em;
  line-height:1;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.protocol__hud-phase{font-size:10px;color:var(--ink-mute);}

.protocol__track-wrap{
  flex:1;
  position:relative;
  margin-top:auto;
  overflow:hidden;
}
.protocol__track{
  list-style:none;
  display:flex;
  gap:clamp(24px,4vw,72px);
  height:100%;
  align-items:stretch;
  will-change:transform;
}
.phase{
  flex:0 0 80vw;
  max-width:880px;
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:clamp(20px,3vw,48px);
  align-items:stretch;
  padding-top:24px;
}
.phase__no{
  grid-column:1;
  grid-row:1;
  font-family:var(--display);
  font-weight:500;
  font-style:italic;
  font-size:clamp(72px,8vw,140px);
  color:var(--tan-deep);
  line-height:0.9;
  align-self:start;
}
.phase__h{
  grid-column:1;
  grid-row:2;
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(22px,2vw,34px);
  color:var(--ink);
  line-height:1.1;
  letter-spacing:-0.012em;
  max-width:20ch;
  align-self:end;
}
.phase > p{
  grid-column:1;
  grid-row:3;
  font-size:clamp(14px,0.95vw,16px);
  color:var(--ink-soft);
  line-height:1.65;
  max-width:46ch;
  align-self:start;
  padding-top:14px;
  border-top:1px solid var(--hair);
}
.phase__plate{
  grid-column:2;
  grid-row:1 / span 3;
  overflow:hidden;
  background:var(--paper-2);
  position:relative;
  min-height:240px;
}
.phase__plate img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.04);
  transition:transform 6s var(--e1);
}
.phase.is-active .phase__plate img{transform:scale(1);}

/* scrub progress bar (bottom of the pinned panel) */
.protocol__progress{
  position:absolute;
  left:var(--gutter);right:var(--gutter);bottom:16px;
  height:2px;background:var(--hair-strong);border-radius:2px;
  overflow:hidden;z-index:4;
}
.protocol__progress-fill{
  position:absolute;left:0;top:0;height:100%;width:0;
  background:var(--ink);border-radius:2px;transition:width .1s linear;
}
/* scroll hint (phone) - fades out once scrubbing begins */
.protocol__hint{
  display:none;position:absolute;left:50%;bottom:30px;
  transform:translateX(-50%);align-items:center;gap:7px;
  padding:6px 12px;border:1px solid var(--hair);border-radius:999px;
  background:var(--paper);font-family:var(--mono);font-size:9px;
  letter-spacing:0.24em;text-transform:uppercase;color:var(--ink-mute);
  z-index:5;pointer-events:none;
  animation:protocolHintBob 1.5s var(--e1) infinite;
  transition:opacity .4s var(--e1);
}
.protocol__hint.is-hidden{opacity:0;}
.protocol__hint svg{display:block;color:var(--ink);}
@keyframes protocolHintBob{
  0%,100%{transform:translate(-50%,0);}
  50%{transform:translate(-50%,4px);}
}
/* 6-phase segment ticks */
.protocol__progress-ticks{
  position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(
    to right,
    transparent 0,
    transparent calc(100% / 6 - 1px),
    var(--paper) calc(100% / 6 - 1px),
    var(--paper) calc(100% / 6));
  opacity:0.65;
}

/* Phone/tablet: KEEP the scroll-scrubbed horizontal pin (JS drives translateX). */
@media (max-width:960px){
  .protocol__sticky{height:100vh;height:100dvh;padding:76px var(--gutter) 22px;}
  .protocol__head{max-width:none;gap:10px;}
  .protocol__note{display:none;}
  .protocol__hud{position:relative;top:0;right:0;flex-direction:row;align-items:baseline;gap:10px;margin:14px 0 0;}
  .protocol__hud-time{font-size:clamp(34px,10vw,52px);}
  .protocol__track-wrap{overflow:hidden;margin-top:14px;}
  .protocol__track{gap:0;}
  .phase{
    flex:0 0 84vw;max-width:520px;display:grid;grid-template-columns:1fr;
    grid-template-rows:auto 1fr;grid-template-areas:"media" "p";
    row-gap:8px;height:100%;margin-right:18px;padding-top:8px;
  }
  .phase__plate{grid-area:media;height:40vh;min-height:0;align-self:start;}
  .phase__no{grid-area:media;align-self:start;justify-self:start;z-index:3;margin:0;padding:8px 14px;font-size:34px;line-height:1;color:var(--paper);text-shadow:0 1px 10px rgba(0,0,0,0.55);}
  .phase__h{grid-area:media;align-self:end;z-index:2;margin:0;padding:16px 14px 14px;font-size:19px;line-height:1.15;max-width:none;color:var(--paper);background:linear-gradient(to top,rgba(14,14,14,0.82) 0%,rgba(14,14,14,0.25) 60%,rgba(14,14,14,0) 100%);}
  .phase__h em{color:#d8a86a;}
  .phase > p{grid-area:p;align-self:start;max-width:none;padding-top:12px;font-size:14px;line-height:1.6;}
}
/* Phone: heading lifts out of sticky panel, only HUD+track pin */
@media (max-width:720px){
  .protocol__head{padding:84px var(--gutter) 0;margin:0;}
  .protocol__note{display:block;}
  .protocol__sticky{padding-top:64px;}
  .protocol__hint{display:inline-flex;}
}

/* ============================================================
   06 / COMPARISON TABLE
   ============================================================ */
.compare{
  padding:clamp(72px,9vw,140px) var(--gutter);
  border-top:1px solid var(--hair);
  display:flex;
  flex-direction:column;
  gap:clamp(36px,4vw,64px);
  background:var(--paper-2);
}
.compare__head{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.compare__h{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(28px,3.6vw,58px);
  line-height:1.04;
  letter-spacing:-0.02em;
  color:var(--ink);
  margin-top:4px;
  max-width:30ch;
}
.compare__h em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}

/* Dual evidence plate : the two contexts at editorial scale */
.compare__plates{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(8px,1.5vw,18px);
  margin-top:clamp(8px,1.5vw,24px);
}
.compare__plate{
  position:relative;
  overflow:hidden;
  background:var(--paper);
  aspect-ratio:4 / 5;
  border:1px solid var(--hair);
}
.compare__plate img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.06);
  transition:transform 8s var(--e1);
}
.compare__plate.is-in img{transform:scale(1);}
.compare__plate--a img{filter:contrast(1.02) saturate(1.05);}
.compare__plate--b img{filter:contrast(1.0) saturate(0.85) sepia(0.06);}
.compare__plate figcaption{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:clamp(18px,2.5vw,36px);
  display:flex;
  flex-direction:column;
  gap:8px;
  color:var(--paper);
  background:linear-gradient(to top, rgba(14,14,14,0.78) 0%, rgba(14,14,14,0.25) 60%, rgba(14,14,14,0) 100%);
}
.compare__plate-tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.24em;
  text-transform:uppercase;
}
.compare__plate-cap{
  font-family:var(--display);
  font-style:italic;
  font-size:clamp(14px,1.1vw,18px);
  line-height:1.4;
  letter-spacing:-0.005em;
}
@media (max-width:720px){
  .compare__plates{grid-template-columns:1fr;}
  .compare__plate{aspect-ratio:5 / 4;}
}

.compare__grid{
  display:flex;
  flex-direction:column;
  border-top:1px solid var(--ink);
}
.compare__row{
  display:grid;
  grid-template-columns:1.1fr 1.2fr 1.2fr;
  gap:clamp(16px,2vw,40px);
  padding:22px 0;
  border-bottom:1px solid var(--hair);
  align-items:baseline;
}
.compare__row--head{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink);
  border-bottom-color:var(--ink);
  padding:14px 0;
}
.compare__sig{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink);
}
.compare__a,
.compare__b{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(18px,1.7vw,26px);
  letter-spacing:-0.008em;
  line-height:1.2;
}
.compare__a{color:var(--ink);}
.compare__a::before{
  content:"";
  display:inline-block;
  width:8px;height:8px;
  border-radius:50%;
  background:var(--tan-deep);
  margin-right:10px;
  vertical-align:middle;
}
.compare__b{color:var(--ink-soft);}
.compare__b::before{
  content:"";
  display:inline-block;
  width:8px;height:8px;
  border-radius:50%;
  border:1px solid var(--ink-mute);
  margin-right:10px;
  vertical-align:middle;
}
.compare__row--head .compare__sig::before,
.compare__row--head .compare__a::before,
.compare__row--head .compare__b::before{display:none;}
.compare__row--head .compare__a,
.compare__row--head .compare__b{
  font-family:var(--mono);
  font-size:10px;
  font-weight:400;
  letter-spacing:0.22em;
  color:var(--ink-mute);
  text-transform:uppercase;
}
.compare__note{
  font-family:var(--mono);
  font-size:12px;
  color:var(--ink-soft);
  line-height:1.7;
  max-width:none;
}
@media (max-width:780px){
  .compare__row{grid-template-columns:1fr;gap:6px;}
  .compare__sig{font-size:10px;}
  .compare__a,.compare__b{font-size:18px;}
  .compare__row--head{display:none;}
  .compare__a::after{
    content:" / Gurugram";
    color:var(--ink-mute);
    font-family:var(--mono);
    font-size:9px;
    letter-spacing:0.2em;
    text-transform:uppercase;
    margin-left:8px;
  }
  .compare__b::after{
    content:" / Lutyens";
    color:var(--ink-mute);
    font-family:var(--mono);
    font-size:9px;
    letter-spacing:0.2em;
    text-transform:uppercase;
    margin-left:8px;
  }
}

/* ============================================================
   07 / FEATURED
   ============================================================ */
.feature{
  padding:clamp(72px,9vw,140px) var(--gutter);
  border-top:1px solid var(--hair);
}
.feature__grid{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:clamp(36px,4vw,80px);
  align-items:stretch;
}
.feature__copy{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.feature__title{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(34px,4.4vw,72px);
  line-height:1;
  letter-spacing:-0.022em;
  color:var(--ink);
  margin-top:6px;
}
.feature__title em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}
.feature__copy p{
  font-size:clamp(15px,1.05vw,17px);
  color:var(--ink-soft);
  line-height:1.65;
  max-width:none;
  text-align:justify;
}
.feature__stats{
  margin-top:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px 24px;
  padding-top:24px;
  border-top:1px solid var(--ink);
}
.feature__stats > div{display:flex;flex-direction:column;gap:6px;}
.feature__stats dt{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.feature__stats dd{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(28px,3vw,46px);
  color:var(--ink);
  font-variant-numeric:tabular-nums;
  line-height:1;
}
.feature__media{
  position:relative;
  overflow:hidden;
  background:var(--paper-2);
  min-height:520px;
}
.feature__media img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.06);
  transition:transform 6s var(--e1);
}
.feature__media.is-in img{transform:scale(1);}
.feature__media figcaption{
  position:absolute;
  left:24px;bottom:24px;right:24px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--paper);
  text-shadow:0 1px 6px rgba(0,0,0,0.4);
}
@media (max-width:960px){
  .feature__grid{grid-template-columns:1fr;}
  .feature__media{min-height:320px;}
  .feature__stats{grid-template-columns:repeat(3,1fr);}
}

/* ============================================================
   08 / INQUIRE
   ============================================================ */
.inquire{
  padding:clamp(72px,9vw,140px) var(--gutter);
  border-top:1px solid var(--hair);
  background:var(--paper-2);
}
.inquire__head{
  display:flex;
  flex-direction:column;
  gap:18px;
  max-width:60ch;
  margin-bottom:48px;
}
.inquire__h{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(34px,4.4vw,72px);
  line-height:1;
  letter-spacing:-0.022em;
  color:var(--ink);
  margin-top:4px;
}
.inquire__h em{
  font-style:italic;
  font-weight:300;
  color:var(--tan-deep);
}
.inquire__lede{
  font-size:clamp(14px,1vw,16px);
  color:var(--ink-soft);
  line-height:1.65;
  max-width:none;
}
.inquire__form{
  display:flex;
  flex-direction:column;
  gap:18px;
  background:var(--paper);
  padding:clamp(28px,4vw,56px);
  border:1px solid var(--hair);
}
.inquire__row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.inquire__field{
  display:flex;
  flex-direction:column;
  gap:8px;
  border-bottom:1px solid var(--hair);
  padding-bottom:8px;
  transition:border-color var(--d1) var(--e1);
}
.inquire__field:focus-within{border-bottom-color:var(--ink);}
.inquire__field--full{grid-column:1 / -1;}
.inquire__label{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.inquire__field input,
.inquire__field select,
.inquire__field textarea{
  font-family:var(--sans);
  font-size:16px;
  color:var(--ink);
  background:transparent;
  border:0;
  outline:0;
  padding:8px 0;
  width:100%;
  resize:none;
  appearance:none;
  -webkit-appearance:none;
}
.inquire__field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-mute) 50%),
                   linear-gradient(135deg,var(--ink-mute) 50%,transparent 50%);
  background-position:calc(100% - 14px) center, calc(100% - 9px) center;
  background-size:5px 5px;
  background-repeat:no-repeat;
  padding-right:24px;
}
.inquire__actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
  margin-top:16px;
  padding-top:24px;
  border-top:1px solid var(--hair);
}
.inquire__submit{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:14px 22px;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  transition:background var(--d2) var(--e1), color var(--d2) var(--e1);
}
.inquire__submit:hover{background:var(--paper);color:var(--ink);}
.inquire__submit svg{display:block;}
.inquire__alt{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink);
  border-bottom:1px solid var(--ink);
  padding-bottom:3px;
}
@media (max-width:720px){
  .inquire__row{grid-template-columns:1fr;}
  .inquire__actions{flex-direction:column;align-items:flex-start;}
}

/* ============================================================
   FOOT
   ============================================================ */
.foot{
  padding:clamp(72px,8vw,120px) var(--gutter) 40px;
  background:var(--paper);
  border-top:1px solid var(--hair);
}
.foot__signoff{margin-bottom:64px;}
.foot__big{
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(72px,14vw,260px);
  line-height:0.86;
  letter-spacing:-0.035em;
  color:var(--ink);
  font-style:italic;
}
.boil-text{filter:url(#boil);will-change:filter;}
.foot__line-a{color:var(--ink);}
.foot__line-b{color:var(--tan-deep);}
/* Soft boil on the brown em clauses in the climate lede + protocol phase titles */
.climate__lede em,
.phase__h em{
  filter:url(#boil-soft);
  will-change:filter;
  display:inline-block;
}
.foot__flourish{
  display:block;
  width:100%;
  height:auto;
  margin-top:24px;
  color:var(--ink);
}
.foot__caption{
  display:block;
  margin-top:18px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--ink-mute);
  max-width:60ch;
}
.foot__cols{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  padding:32px 0;
  border-top:1px solid var(--hair);
  border-bottom:1px solid var(--hair);
}
.foot__col{display:flex;flex-direction:column;gap:10px;}
.foot__h{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:6px;
}
.foot__col a{
  font-family:var(--sans);
  font-size:14px;
  color:var(--ink);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:border-color var(--d1) var(--e1);
}
.foot__col a:hover{border-bottom-color:var(--ink);}
.foot__base{
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  margin-top:24px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
@media (max-width:720px){
  .foot__cols{grid-template-columns:1fr;}
  .foot__big{font-size:clamp(56px,18vw,120px);}
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
  }
  .boil-text{filter:none;}
  .hero__begin-line{animation:none;}
  /* reduced-motion: JS scrub is skipped, flatten the protocol pin to a plain vertical stack */
  .protocol{height:auto;}
  .protocol__sticky{position:relative;height:auto;padding-bottom:80px;}
  .protocol__track-wrap{overflow:visible;}
  .protocol__track{flex-direction:column;transform:none !important;gap:48px;}
  .phase{flex:0 0 auto;height:auto;}
  .phase__plate{min-height:240px;}
}

/* ===== FAQ block (appended) ===== */
.faq{padding:120px 8vw 100px;position:relative;background:var(--paper);}
.faq__top{display:flex;flex-direction:column;gap:18px;margin-bottom:64px;max-width:none;}
.faq__top .section-tag{align-self:flex-start;}
.faq__top h2,.faq h2{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(28px,4.2vw,52px);line-height:1.08;letter-spacing:-0.01em;color:var(--ink);margin:0;}
.faq__top h2 em,.faq h2 em{font-style:italic;color:var(--tan-deep);}
.faq__list{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--hair);max-width:1100px;}
.faq__item{padding:32px 0 28px;border-bottom:1px solid var(--hair);}
.faq__item h3{font-family:'Inter',sans-serif;font-weight:500;font-size:clamp(16px,1.6vw,20px);letter-spacing:-0.005em;color:var(--ink);margin:0 0 14px;line-height:1.35;}
.faq__item p{font-family:'Inter',sans-serif;font-weight:400;font-size:clamp(14px,1.15vw,16px);line-height:1.65;color:var(--ink-soft);margin:0;max-width:78ch;}
.faq__item a{color:var(--tan-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(94,60,24,0.35);transition:text-decoration-color var(--d1) var(--e1);}
.faq__item a:hover{text-decoration-color:var(--tan-deep);}
@media (min-width:900px){
  .faq__item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:48px;align-items:start;padding:36px 0 32px;}
  .faq__item h3{margin:0;}
}
@media (max-width:720px){
  .faq{padding:80px 6vw 72px;}
  .faq__top{margin-bottom:40px;}
  .faq__item{padding:24px 0 22px;}
}

/* ===== WhatsApp FAB ===== */
.wa-fab{position:fixed;right:24px;bottom:24px;z-index:900;
  width:52px;height:52px;border-radius:999px;background:#25D366;
  color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 20px rgba(0,0,0,0.18);
  transition:transform 0.2s ease,box-shadow 0.2s ease;}
.wa-fab:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,0.22);}
@media(max-width:560px){.wa-fab{right:16px;bottom:16px;width:46px;height:46px;}}
