:root{
  --leaf:#FBF4E4;
  --leaf2:#F4E9D2;
  --leaf3:#EBDCBE;
  --ink:#1F1712;
  --ink2:#4A372C;
  --ink3:#7A6558;
  --night:#15100C;
  --night2:#1F1813;
  --gold:#C9A227;
  --gold-hi:#F0DC9A;
  --gold-lo:#8A6A11;
}
[data-mood="devotional"]{
  --accent:#8B1E24; --accent-deep:#3A0C10; --accent-text:#8B1E24; --accent-onnight:#b46e71;
  --accent-04:#f7ebdc; --accent-10:#f0dfd1; --accent-18:#e7cdc1; --accent-rule:#cc9a93; --accent-halo:#381413;
  --duo-shadow:#3A0C10; --duo-mid:#8B1E24; --duo-high:#f1e4e5;
}
[data-mood="celebratory"]{
  --accent:#E0930A; --accent-deep:#4A2A02; --accent-text:#926008; --accent-onnight:#E0930A;
  --accent-04:#faf0db; --accent-10:#f8eace; --accent-18:#f6e3bd; --accent-rule:#f0cb88; --accent-halo:#52370b;
  --duo-shadow:#4A2A02; --duo-mid:#E0930A; --duo-high:#fbf2e2;
}
[data-mood="institutional"]{
  --accent:#D2691E; --accent-deep:#421D07; --accent-text:#ae5718; --accent-onnight:#D2691E;
  --accent-04:#f9eedc; --accent-10:#f7e6d0; --accent-18:#f4dbc0; --accent-rule:#eaba91; --accent-halo:#4e2b11;
  --duo-shadow:#421D07; --duo-mid:#D2691E; --duo-high:#faede4;
}
[data-mood="global"]{
  --accent:#0F6E74; --accent-deep:#03262A; --accent-text:#0F6E74; --accent-onnight:#38878b;
  --accent-04:#f2efe0; --accent-10:#e3e7d9; --accent-18:#d1dcd0; --accent-rule:#98bcb5; --accent-halo:#132c2b;
  --duo-shadow:#03262A; --duo-mid:#0F6E74; --duo-high:#e2eeee;
}
[data-mood="achievement"]{
  --accent:#2F7D4F; --accent-deep:#0A2A18; --accent-text:#2F7D4F; --accent-onnight:#478c64;
  --accent-04:#f3efde; --accent-10:#e7e8d5; --accent-18:#d6dfc9; --accent-rule:#a5c2a5; --accent-halo:#1d3120;
  --duo-shadow:#0A2A18; --duo-mid:#2F7D4F; --duo-high:#e6efea;
}
[data-mood="historical"]{
  --accent:#2B3A8A; --accent-deep:#0C1130; --accent-text:#2B3A8A; --accent-onnight:#767fb3;
  --accent-04:#f3ede0; --accent-10:#e6e1db; --accent-18:#d6d3d4; --accent-rule:#a4a6be; --accent-halo:#1c1d32;
  --duo-shadow:#0C1130; --duo-mid:#2B3A8A; --duo-high:#e6e7f1;
}
[data-mood="playful"]{
  --accent:#C13A6B; --accent-deep:#3D0C22; --accent-text:#C13A6B; --accent-onnight:#cb5b84;
  --accent-04:#f9eddf; --accent-10:#f5e1d8; --accent-18:#f1d3ce; --accent-rule:#e3a6b1; --accent-halo:#491d29;
  --duo-shadow:#3D0C22; --duo-mid:#C13A6B; --duo-high:#f8e7ed;
}
/* ═══════════════════════════════════════════════════════════════════════
   गीता मैत्री · THE GRANTH
   Devotional maximalism. Density with hierarchy.
   Three layers on every surface: photograph · type · ornament.
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────── fonts ───────── */
@font-face{font-family:"Tiro";src:url(/fonts/tiro-devanagari.woff2) format("woff2");font-weight:400;font-display:block;unicode-range:U+0900-097F,U+1CD0-1CFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
@font-face{font-family:"Tiro";src:url(/fonts/tiro-latin.woff2) format("woff2");font-weight:400;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"NotoSerifDev";src:url(/fonts/noto-serif-devanagari.woff2) format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Rozha";src:url(/fonts/rozha-one-devanagari.woff2) format("woff2");font-weight:400;font-display:block;unicode-range:U+0900-097F,U+1CD0-1CFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
@font-face{font-family:"Rozha";src:url(/fonts/rozha-one-latin.woff2) format("woff2");font-weight:400;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F}
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces-var-ext.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:block;unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces-var-italic-ext.woff2) format("woff2");font-weight:300 700;font-style:italic;font-display:block;unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces-var.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces-var-italic.woff2) format("woff2");font-weight:300 700;font-style:italic;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Mukta";src:url(/fonts/mukta-devanagari.woff2) format("woff2");font-weight:400 700;font-display:block;unicode-range:U+0900-097F,U+1CD0-1CFF,U+200C-200D,U+20B9,U+25CC}
@font-face{font-family:"Khand";src:url(/fonts/khand-400.woff2) format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Khand";src:url(/fonts/khand-600.woff2) format("woff2");font-weight:600;font-display:block}
@font-face{font-family:"GeneralSans";src:url(/fonts/general-sans-400.woff2) format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"GeneralSans";src:url(/fonts/general-sans-500.woff2) format("woff2");font-weight:500;font-display:block}

/* ───────── tokens ───────── */
:root{
  --f-body:"Tiro","Fraunces","NotoSerifDev",serif;
  --f-bold:"Mukta","Fraunces",serif;
  --f-shloka:"NotoSerifDev","Fraunces","Tiro",serif;
  --f-display:"Rozha","Fraunces","Tiro",serif;
  --f-latin:"Fraunces","Tiro",serif;
  --f-label:"Khand","Mukta","GeneralSans",sans-serif;
  --f-ext:"Fraunces",serif;
  --f-ui:"GeneralSans","Mukta","Tiro",system-ui,sans-serif;

  --col:minmax(0,1fr);
  --gutter:clamp(20px,4.5vw,88px);
  --gap:clamp(14px,1.6vw,26px);
  --measure:63ch;

  --e-out:cubic-bezier(.16,1,.3,1);
  --e-soft:cubic-bezier(.4,0,.2,1);
  --t1:.24s; --t2:.5s; --t3:1s; --t4:1.6s;

  --hair:1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  --hair-gold:1px solid color-mix(in srgb, var(--gold) 46%, transparent);
  --lift:0 1px 0 rgba(31,23,18,.05),0 18px 50px -22px rgba(31,23,18,.35);
  --lift-2:0 2px 0 rgba(31,23,18,.06),0 40px 90px -36px rgba(31,23,18,.5);
}
html:not([data-mood]){
  --accent:var(--gold); --accent-text:var(--gold-lo); --accent-deep:#3A0C10;
  --accent-04:var(--leaf2); --accent-10:var(--leaf3); --accent-18:var(--leaf3);
  --accent-rule:var(--gold); --accent-onnight:var(--gold-hi); --accent-halo:#2a2018;
}

/* ───────── base ───────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.fonts-loading body{visibility:hidden}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--f-body);font-size:18px;line-height:1.82;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"kern","liga","calt";overflow-x:hidden}
body.leaf{background:var(--leaf)}
img,svg,video,picture{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
::selection{background:var(--gold-hi);color:var(--ink)}
[lang="en"]{font-family:var(--f-latin);font-variation-settings:"opsz" 14}
[lang="sa"]{font-family:var(--f-shloka)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.grain{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.035;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
body.on-night .grain{mix-blend-mode:screen;opacity:.05}

/* Devanagari must never be tracked: letter-spacing breaks the shirorekha */
:lang(hi) .eyebrow,:lang(hi) .label,.eyebrow:lang(hi),[lang="hi"] .eyebrow,[lang="hi"] .label{letter-spacing:.02em}
.eyebrow,.label,.btn,.toc .sec,.leafp .folio,.leafp .runhead,.stats span,.rail .factbox dt,.rail .quote cite,
.rail .aside b,.more a small,.seclist .meta,.byline,.drawer .art small,.drawer .sec>a,.leafp--teaser .by,
.leafp--teaser .read,.open-report .facts dt,.book__cover .s,.shelf__nums span,.toc .art small,.toc .sec .rt,
.leafp--shlok .src,.leafp--opener .count,.open-darshan .portrait .cap,.colophon b,.spreads__nav button,
.spreads__nav .pcount,.act-out,.more h4,.table-wrap th,.topbar .counter,.ribbon .t{letter-spacing:.02em}
.eyebrow.--lat,.label.--lat{letter-spacing:.15em}

/* ───────── type roles ───────── */
.eyebrow{font-family:var(--f-label);font-weight:600;font-size:12.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--accent-text);line-height:1.1;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.eyebrow .n{font-family:var(--f-display);font-size:19px;letter-spacing:0;color:var(--accent);text-transform:none}
.eyebrow .dot{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.5;flex:none}
.display{font-family:var(--f-display);font-weight:400;line-height:1.02;letter-spacing:-.008em;text-wrap:balance}
.display.en{font-family:var(--f-latin);font-weight:500;font-variation-settings:"opsz" 144;letter-spacing:-.025em;line-height:1.05}
.standfirst{font-size:clamp(19px,1.55vw,23px);line-height:1.62;color:var(--ink2);text-wrap:pretty}
.standfirst.en{font-style:italic;font-variation-settings:"opsz" 34}
.ui{font-family:var(--f-ui);font-size:13.5px;letter-spacing:.01em}
.label{font-family:var(--f-label);font-weight:600;font-size:12px;letter-spacing:.15em;text-transform:uppercase}

/* ───────── ornament primitives ───────── */
.orn{width:1em;height:1em;fill:currentColor;display:inline-block;vertical-align:-.12em}
.orn-mark{display:block;margin:0 auto;width:38px;height:38px;fill:var(--accent);opacity:.9}
.rule-g{height:1px;background:linear-gradient(90deg,transparent,var(--accent-rule) 14%,var(--accent-rule) 86%,transparent);opacity:.8}
.vine{height:18px;color:var(--accent);opacity:.5}
.vine svg{width:100%;height:18px}

/* ═══════════ CHROME ═══════════ */
.topbar{position:fixed;inset:0 0 auto 0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:14px var(--gutter) 14px calc(var(--gutter) + 34px);pointer-events:none;
  background:linear-gradient(180deg,color-mix(in srgb,var(--leaf) 92%,transparent),transparent);backdrop-filter:blur(2px)}
.topbar>*{pointer-events:auto}
.topbar .brand{display:flex;align-items:center;gap:11px;font-family:var(--f-display);font-size:19px;color:var(--ink)}
.topbar .brand img{width:30px;height:30px;object-fit:contain}
.topbar .counter{font-family:var(--f-label);font-size:12px;letter-spacing:.16em;color:var(--ink3);text-transform:uppercase}
.topbar .counter b{color:var(--accent-text);font-weight:600}
body.on-night .topbar{background:linear-gradient(180deg,color-mix(in srgb,var(--night) 88%,transparent),transparent)}
body.on-night .topbar .brand{color:var(--gold-hi)}
body.on-night .topbar .counter{color:color-mix(in srgb,var(--gold-hi) 60%,transparent)}
body.on-night .topbar .counter b{color:var(--gold-hi)}

/* the ribbon: saffron silk, the index handle */
.ribbon{position:fixed;left:0;top:0;z-index:70;width:34px;height:168px;cursor:pointer;transform-origin:top center;
  transition:transform var(--t2) var(--e-out);display:grid;place-items:center;border:0}
.ribbon::before{content:"";position:absolute;inset:0;background:linear-gradient(175deg,#F0912E,#C4600E 62%,#A34D07);
  clip-path:polygon(0 0,100% 0,100% 100%,50% 84%,0 100%);box-shadow:5px 0 22px -8px rgba(0,0,0,.55)}
.ribbon::after{content:"";position:absolute;left:6px;top:0;bottom:26px;width:1px;background:rgba(255,255,255,.4)}
.ribbon i{position:relative;display:block;width:16px;height:16px;margin-bottom:34px;fill:#FFF0DC;opacity:.95}
.ribbon .t{position:absolute;left:100%;top:16px;margin-left:12px;white-space:nowrap;font-family:var(--f-label);font-weight:600;
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);opacity:0;transform:translateX(-6px);
  transition:opacity var(--t2),transform var(--t2) var(--e-out);pointer-events:none}
.ribbon:hover{transform:translateY(12px)}
.ribbon:hover .t,.ribbon:focus-visible .t{opacity:1;transform:none}
body.on-night .ribbon .t{color:var(--gold-hi)}
.ribbon.is-open{transform:translateY(22px)}

/* index drawer */
.drawer{position:fixed;inset:0;z-index:65;pointer-events:none}
.drawer__scrim{position:absolute;inset:0;background:rgba(21,16,12,.6);opacity:0;transition:opacity var(--t2);backdrop-filter:blur(3px)}
.drawer__panel{position:absolute;left:0;top:0;bottom:0;width:min(560px,94vw);background:var(--leaf);
  box-shadow:30px 0 80px -24px rgba(0,0,0,.7);transform:translateX(-102%);transition:transform var(--t3) var(--e-out);
  overflow:auto;padding:80px 40px 56px 62px;overscroll-behavior:contain}
.drawer.is-open{pointer-events:auto}
.drawer.is-open .drawer__scrim{opacity:1}
.drawer.is-open .drawer__panel{transform:none}
.drawer h2{font-family:var(--f-display);font-size:38px;margin:0;color:var(--ink);line-height:1}
.drawer .sub{font-family:var(--f-label);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin:8px 0 22px}
.drawer .sec{margin:22px 0 0;padding-top:12px;border-top:var(--hair-gold)}
.drawer .sec>a{display:grid;grid-template-columns:26px 1fr;gap:11px;align-items:baseline;padding:2px 0 8px;
  font-family:var(--f-label);font-weight:600;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--sec-accent,var(--gold-lo))}
.drawer .sec>a .n{font-family:var(--f-display);font-size:21px;color:var(--sec-accent,var(--gold));letter-spacing:0}
.drawer .sec>a .t{color:var(--ink);font-family:var(--f-body);text-transform:none;letter-spacing:0;font-size:16px;font-weight:400;line-height:1.3}
.drawer ul{margin:0;padding:0;list-style:none}
.drawer .art{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:baseline;padding:7px 0 7px 37px;
  color:var(--ink2);font-size:15.5px;line-height:1.36;border-left:2px solid transparent;
  transition:border-color var(--t1),padding-left var(--t1) var(--e-out),color var(--t1)}
.drawer .art:hover,.drawer .art.is-current{border-left-color:var(--sec-accent,var(--gold));padding-left:44px;color:var(--ink)}
.drawer .art small{font-family:var(--f-label);font-size:11.5px;letter-spacing:.1em;color:var(--ink3);white-space:nowrap}

/* progress */
.leafbar{position:fixed;left:0;right:0;bottom:0;z-index:58;height:3px;background:color-mix(in srgb,var(--gold) 16%,transparent)}
.leafbar i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--accent),var(--gold));transition:width .18s linear}
.leafbar b{position:absolute;top:-2px;width:1px;height:7px;background:var(--gold);opacity:.45}

/* ═══════════ SHELF ═══════════ */
.shelf{min-height:100vh;position:relative;padding:17vh var(--gutter) 10vh;color:var(--leaf);
  background:radial-gradient(130% 90% at 50% -10%,#33261C 0%,var(--night) 62%)}
.shelf__head{max-width:min(1100px,92vw);position:relative;z-index:2}
.shelf__head .eyebrow{color:var(--gold)}
.shelf__head h1{font-family:var(--f-display);font-size:clamp(56px,11vw,168px);line-height:.88;margin:.16em 0 0;
  color:var(--leaf);letter-spacing:-.01em}
.shelf__head h1 em{font-style:normal;color:inherit}
.shelf__head .sub{max-width:54ch;color:rgba(251,244,228,.74);font-size:19px;margin:28px 0 0;line-height:1.7}
.shelf__nums{display:flex;flex-wrap:wrap;gap:0;margin:56px 0 0;border-top:var(--hair-gold);border-bottom:var(--hair-gold)}
.shelf__nums div{flex:1 1 150px;padding:20px 22px 20px 0}
.shelf__nums b{display:block;font-family:var(--f-display);font-size:clamp(30px,3.4vw,46px);line-height:1;color:var(--gold-hi);font-variant-numeric:tabular-nums}
.shelf__nums span{display:block;margin-top:7px;font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(251,244,228,.5)}
.shelf__row{display:flex;gap:clamp(26px,5vw,72px);align-items:flex-end;margin-top:13vh;padding-bottom:96px;position:relative;perspective:1900px;flex-wrap:wrap;z-index:2}
.shelf__row::after{content:"";position:absolute;left:-10vw;right:-10vw;bottom:78px;height:16px;
  background:linear-gradient(180deg,#6A4523,#2E1C10);box-shadow:0 34px 70px -12px rgba(0,0,0,.85)}
.book{position:relative;width:clamp(190px,21vw,290px);aspect-ratio:1/1.46;transform-style:preserve-3d;
  transform:rotateY(-15deg) rotateX(2deg);transition:transform var(--t3) var(--e-out);cursor:pointer}
.book:hover,.book:focus-visible{transform:rotateY(-5deg) translateY(-16px)}
.book__cover{position:absolute;inset:0;border-radius:2px 9px 9px 2px;padding:13% 11%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  background:radial-gradient(130% 95% at 28% 16%,rgba(255,255,255,.12),transparent 56%),
    repeating-linear-gradient(0deg,rgba(0,0,0,.055) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(90deg,rgba(0,0,0,.055) 0 1px,transparent 1px 3px),
    linear-gradient(162deg,#9A3535,#7A1E1E 44%,#4A1010);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.3),-8px 10px 36px -8px rgba(0,0,0,.8)}
.book__cover::before{content:"";position:absolute;inset:7%;border:1px solid rgba(240,220,154,.7);border-radius:2px}
.book__cover::after{content:"";position:absolute;inset:9%;border:1px solid rgba(240,220,154,.3)}
.book__cover .emblem{width:31%;margin:0 auto 16px;filter:sepia(1) saturate(2.4) hue-rotate(2deg) brightness(1.12) contrast(1.05)}
.book__cover .t{font-family:var(--f-display);color:#F0DC9A;font-size:clamp(23px,2.5vw,34px);line-height:1.08;
  text-shadow:0 1px 0 rgba(0,0,0,.5),0 0 22px rgba(240,220,154,.2)}
.book__cover .s{font-family:var(--f-label);letter-spacing:.2em;font-size:11.5px;color:#C9A227;margin-top:13px;text-transform:uppercase}
.book__spine{position:absolute;left:0;top:0;bottom:0;width:24px;transform:rotateY(-90deg) translateX(-12px) translateZ(12px);
  transform-origin:left;background:linear-gradient(90deg,#3A0C10,#7A1E1E);border-radius:2px 0 0 2px}
.book__pages{position:absolute;right:-9px;top:5px;bottom:5px;width:11px;border-radius:0 3px 3px 0;
  background:repeating-linear-gradient(0deg,#F3E7CA 0 1px,#D6C49E 1px 2px);box-shadow:3px 0 6px rgba(0,0,0,.35)}
.book__ribbon{position:absolute;z-index:3;right:19%;top:0;width:7px;height:56%;
  background:linear-gradient(180deg,#F0912E,#B8550C);clip-path:polygon(0 0,100% 0,100% 100%,50% 86%,0 100%);
  box-shadow:2px 3px 8px rgba(0,0,0,.4)}
.book__meta{position:absolute;left:-10%;right:-10%;top:calc(100% + 22px);text-align:center;font-family:var(--f-ui);font-size:13px;color:rgba(251,244,228,.6)}
.book__meta b{display:block;font-family:var(--f-display);font-size:19px;color:var(--leaf);margin-bottom:3px;letter-spacing:.01em}

/* ═══════════ COVER STAGE ═══════════ */
.stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(95% 75% at 50% 58%,#41301F 0%,var(--night) 72%)}
.stage canvas{position:absolute;inset:0;width:100%;height:100%}
.stage__ui{position:absolute;inset:auto 0 0 0;padding:0 var(--gutter) 6vh;display:flex;flex-direction:column;align-items:center;gap:15px;text-align:center;pointer-events:none;z-index:3;background:linear-gradient(180deg,transparent,rgba(21,16,12,.55) 34%,rgba(21,16,12,.92))}
.stage__ui .eyebrow{color:var(--gold);justify-content:center}
.stage__ui .open{pointer-events:auto;font-family:var(--f-label);font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  font-size:12.5px;color:#241B10;background:linear-gradient(180deg,var(--gold-hi),var(--gold));padding:15px 32px;border-radius:2px;
  box-shadow:0 12px 34px -12px rgba(201,162,39,.8);transition:transform var(--t1) var(--e-out),box-shadow var(--t1)}
.stage__ui .open:hover{transform:translateY(-2px);box-shadow:0 20px 44px -12px rgba(201,162,39,.95)}
.stage__ui .hint{font-family:var(--f-ui);font-size:12.5px;color:rgba(251,244,228,.5)}
.stage.is-opening .stage__ui{opacity:0;transition:opacity .45s}
.cover-fallback{position:absolute;inset:0;display:grid;place-items:center}
.cover-fallback[hidden]{display:none}
.cover-fallback .book{width:min(44vh,320px);transform:rotateY(-11deg) rotateX(4deg)}

/* ═══════════ THE GRANTH (spreads) ═══════════ */
.spreads{background:radial-gradient(120% 80% at 50% 0%,#2A2018,var(--night) 70%);min-height:100vh;display:grid;place-items:center;padding:8vh 0 9vh}
.flipbook{width:min(1240px,95vw);position:relative;margin:0 auto}
.flipbook:not(.stf__parent){height:0;overflow:hidden}
.flipbook .page{background:var(--leaf);color:var(--ink);overflow:hidden}
.flipbook .page::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:6}
.flipbook .page.--left::after{background:linear-gradient(90deg,transparent 88%,rgba(31,23,18,.14) 99%,rgba(31,23,18,.26))}
.flipbook .page.--right::after{background:linear-gradient(270deg,transparent 88%,rgba(31,23,18,.14) 99%,rgba(31,23,18,.26))}
.flipbook .page.--madder{background:linear-gradient(162deg,#9A3535,#7A1E1E 44%,#3A0C10);color:var(--gold-hi)}
.flipbook .page.--night{background:var(--night);color:var(--leaf)}
.leafp{position:relative;height:100%;padding:clamp(18px,3.4vw,54px);display:flex;flex-direction:column;overflow:hidden}
.leafp .paper{position:absolute;inset:0;pointer-events:none;opacity:.05;
  background:repeating-linear-gradient(0deg,#000 0 1px,transparent 1px 8px)}
.leafp .folio{position:absolute;bottom:16px;font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;color:var(--ink3);z-index:5}
.leafp .folio.l{left:26px}.leafp .folio.r{right:26px}
.leafp .runhead{position:absolute;top:18px;left:26px;right:26px;display:flex;justify-content:space-between;
  font-family:var(--f-label);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);opacity:.8;z-index:5}

/* shlok leaf */
.leafp--shlok{justify-content:center;align-items:center;text-align:center}
.leafp--shlok .shloka{font-family:var(--f-shloka);font-size:clamp(19px,1.9vw,27px);line-height:1.95;color:var(--accent-text);margin:0 0 .15em}
.leafp--shlok .meaning{max-width:42ch;font-size:15.5px;line-height:1.8;color:var(--ink2);margin:30px auto 0}
.leafp--shlok .src{font-family:var(--f-label);font-size:12px;letter-spacing:.16em;color:var(--ink3);margin-top:18px;text-transform:uppercase}

/* index */
.leafp--index h1{font-family:var(--f-display);font-size:clamp(28px,3.1vw,44px);color:var(--ink);margin:6px 0 4px;line-height:1}
.toc{display:flex;flex-direction:column;overflow:hidden;flex:1 1 auto;min-height:0;padding-bottom:26px}
.toc .sec{display:grid;grid-template-columns:28px 1fr auto;align-items:baseline;gap:11px;padding:9px 0 4px;margin-top:5px;
  border-bottom:var(--hair-gold);font-family:var(--f-label);font-weight:600;letter-spacing:.12em;font-size:11.5px;
  text-transform:uppercase;color:var(--sec-accent,var(--gold-lo))}
.toc .sec .n{font-family:var(--f-display);font-size:19px;color:var(--sec-accent,var(--gold));letter-spacing:0}
.toc .sec .rt{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--ink3);letter-spacing:.06em;white-space:nowrap}
.toc .sec .rt i{display:block;height:3px;border-radius:2px;background:var(--sec-accent,var(--gold));opacity:.65}
.toc .art{display:grid;grid-template-columns:1fr auto;gap:12px;padding:4px 0 4px 39px;font-size:14.5px;line-height:1.32;color:var(--ink2);
  position:relative;transition:color var(--t1),padding-left var(--t1) var(--e-out)}
.toc .art::before{content:"";position:absolute;left:28px;top:.72em;width:5px;height:1px;background:var(--sec-accent,var(--gold));opacity:.6}
.toc .art:hover{color:var(--ink);padding-left:45px}
.toc .art small{font-family:var(--f-label);font-size:11.5px;letter-spacing:.09em;color:var(--ink3);white-space:nowrap}
.toc .art .pdf{margin-left:7px;color:var(--gold-lo)}

/* section opener — giant numeral with a photograph inside it */
.leafp--opener{padding:0;justify-content:flex-end;background:var(--accent-04)}
.leafp--opener .num{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-display);
  font-size:clamp(240px,42vw,620px);line-height:.82;color:transparent;-webkit-background-clip:text;background-clip:text;
  background-size:cover;background-position:center 32%;filter:contrast(1.06) saturate(1.04);user-select:none}
.leafp--opener .num::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,color-mix(in srgb,var(--accent-04) 82%,transparent) 76%,var(--accent-04) 96%)}
.leafp--opener .txt{position:relative;padding:clamp(18px,3.4vw,54px);z-index:2}
.leafp--opener .txt h2{font-family:var(--f-display);font-size:clamp(26px,3.2vw,48px);line-height:1.04;margin:12px 0 0;
  color:var(--accent-text);text-wrap:balance}
.leafp--opener .txt p{margin:12px 0 0;max-width:42ch;color:var(--ink2);font-size:15.5px;line-height:1.6}
.leafp--opener .txt .count{font-family:var(--f-label);letter-spacing:.16em;font-size:11px;color:var(--ink3);margin-top:14px;text-transform:uppercase}

/* teaser leaf */
.leafp--teaser{background:var(--leaf)}
.leafp--teaser .hero{position:relative;flex:0 0 auto;margin:calc(-1*clamp(18px,3.4vw,54px)) calc(-1*clamp(18px,3.4vw,54px)) 0;
  overflow:hidden;aspect-ratio:var(--ar,16/9);max-height:52%}
.leafp--teaser .hero img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 30%);
  transform:scale(1.05);transition:transform var(--t4) var(--e-out)}
.page:hover .leafp--teaser .hero img{transform:scale(1)}
.leafp--teaser .hero::after{content:"";position:absolute;inset:auto 0 0 0;height:34%;
  background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--leaf) 92%,transparent))}
.leafp--teaser .body{padding-top:18px;flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.leafp--teaser h3{font-family:var(--f-display);font-size:clamp(20px,2.1vw,31px);line-height:1.1;margin:7px 0 9px;color:var(--ink)}
.leafp--teaser h3.en{font-family:var(--f-latin);font-weight:500}
.leafp--teaser p{margin:0;font-size:14.5px;line-height:1.66;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.leafp--teaser .by{font-family:var(--f-label);font-size:11.5px;letter-spacing:.1em;color:var(--ink3);margin-top:12px;text-transform:uppercase}
.leafp--teaser .read{display:inline-flex;align-items:center;gap:10px;margin-top:auto;padding-top:16px;
  font-family:var(--f-label);font-weight:600;letter-spacing:.17em;font-size:11.5px;text-transform:uppercase;color:var(--accent-text)}
.leafp--teaser .read i{width:30px;height:1px;background:currentColor;transition:width var(--t1) var(--e-out)}
.page:hover .leafp--teaser .read i{width:52px}
/* photo leaf: one photograph, full leaf */
.leafp--photo{padding:0;position:relative}
.leafp--photo img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center)}
.leafp--photo figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 28px 18px;font-family:var(--f-ui);font-size:12px;
  color:#FBF4E4;background:linear-gradient(180deg,transparent,rgba(21,16,12,.82))}

.spreads__nav{position:fixed;left:0;right:0;bottom:20px;z-index:59;display:flex;justify-content:center;align-items:center;gap:16px;pointer-events:none}
.spreads__nav button{pointer-events:auto;font-family:var(--f-label);font-weight:600;letter-spacing:.16em;font-size:11.5px;
  text-transform:uppercase;color:var(--gold-hi);padding:11px 20px;border:1px solid rgba(201,162,39,.4);border-radius:2px;
  transition:background var(--t1),border-color var(--t1),transform var(--t1) var(--e-out)}
.spreads__nav button:hover{background:rgba(201,162,39,.14);border-color:var(--gold);transform:translateY(-1px)}
.spreads__nav .pcount{font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;color:rgba(251,244,228,.55)}

/* ═══════════════════════════════════════════════════════════════════════
   ARTICLE — 12 column grid, working rails, six forms
   ═══════════════════════════════════════════════════════════════════════ */
.reader{background:var(--leaf);min-height:100vh;position:relative}
.gridwrap{display:grid;grid-template-columns:repeat(12,var(--col));gap:0 var(--gap);
  max-width:1680px;margin:0 auto;padding:0 var(--gutter)}
.c-body{grid-column:4/10}
.c-rail-l{grid-column:1/4}
.c-rail-r{grid-column:10/13}
.c-wide{grid-column:2/12}
.c-full{grid-column:1/13}

/* ── opening: FEATURE — full-bleed hero, title inside on a slab ── */
.open-feature{position:relative;min-height:min(92vh,880px);display:flex;align-items:flex-end;overflow:hidden;background:var(--night)}
.open-feature .shot{position:absolute;inset:0}
.open-feature .shot img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 30%)}
.open-feature .shot::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(21,16,12,.5) 0%,rgba(21,16,12,.08) 34%,rgba(21,16,12,.55) 76%,var(--leaf) 100%)}
.open-feature .slab{position:relative;z-index:2;margin:0 var(--gutter) clamp(40px,7vh,96px);max-width:min(940px,88vw);
  background:color-mix(in srgb,var(--leaf) 94%,transparent);backdrop-filter:blur(7px) saturate(1.1);
  padding:clamp(24px,3vw,44px) clamp(26px,3.2vw,50px);box-shadow:var(--lift-2);border-top:3px solid var(--accent)}
.open-feature .slab h1{font-family:var(--f-display);font-size:clamp(34px,5.4vw,84px);line-height:1;margin:14px 0 0;color:var(--ink);letter-spacing:-.012em}
.open-feature .slab h1.en{font-family:var(--f-latin);font-weight:500;font-variation-settings:"opsz" 144}

/* ── opening: DARSHAN — portrait left, title stacked right ── */
.open-darshan{position:relative;background:var(--accent-04);padding:clamp(78px,11vh,150px) 0 clamp(30px,5vh,66px);overflow:hidden}
.open-darshan::before{content:"";position:absolute;inset:0;
  background:radial-gradient(70% 90% at 12% 40%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 62%)}
.open-darshan .g{position:relative;align-items:center}
.open-darshan .portrait{grid-column:1/6;position:relative}
.open-darshan .portrait img{width:100%;height:auto;box-shadow:var(--lift-2)}
.open-darshan .portrait .cap{font-family:var(--f-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin-top:12px}
.open-darshan .txt{grid-column:6/13;padding-left:clamp(0px,2vw,34px)}
.open-darshan .txt h1{font-family:var(--f-display);font-size:clamp(34px,5vw,78px);line-height:1.02;margin:16px 0 0;color:var(--accent-text);letter-spacing:-.01em}
.open-darshan .txt h1.en{font-family:var(--f-latin);font-weight:500;font-variation-settings:"opsz" 144}
.open-darshan .txt .standfirst{margin:22px 0 0;max-width:46ch}
.open-darshan.--noportrait .txt{grid-column:2/12;padding-left:0;text-align:center}
.open-darshan.--noportrait .txt .standfirst{margin-inline:auto}
.open-darshan.--noportrait .eyebrow{justify-content:center}

/* ── opening: REPORT — fact box, then title ── */
.open-report{position:relative;background:var(--leaf);padding:clamp(86px,12vh,160px) 0 0}
.open-report .g{align-items:end}
.open-report .facts{grid-column:1/4;border-top:2px solid var(--accent);padding-top:14px}
.open-report .facts dl{margin:0;display:grid;gap:11px}
.open-report .facts dt{font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.open-report .facts dd{margin:2px 0 0;font-family:var(--f-display);font-size:19px;line-height:1.2;color:var(--accent-text)}
.open-report .txt{grid-column:4/13}
.open-report .txt h1{font-family:var(--f-display);font-size:clamp(32px,4.6vw,72px);line-height:1.03;margin:14px 0 0;color:var(--ink)}
.open-report .txt h1.en{font-family:var(--f-latin);font-weight:500;font-variation-settings:"opsz" 144}
.open-report .shot{grid-column:1/13;margin-top:clamp(28px,4vh,54px);position:relative;overflow:hidden}
.open-report .shot img{width:100%;height:auto}
.open-report .shot.--mat{background:var(--accent-04);padding:clamp(16px,2.4vw,42px)}
.open-report .shot.--mat img{box-shadow:var(--lift);width:auto;max-width:100%;margin:0 auto}

/* ── opening: PHOTOSTORY — the picture is the page ── */
.open-photostory{position:relative;height:100vh;height:100svh;overflow:hidden;background:var(--night)}
.open-photostory .shot{position:absolute;inset:0}
.open-photostory .shot img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center)}
.open-photostory .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,16,12,.45),rgba(21,16,12,.1) 40%,rgba(21,16,12,.75))}
.open-photostory .txt{position:absolute;inset:auto 0 0 0;padding:0 var(--gutter) clamp(52px,9vh,110px);z-index:2;color:var(--leaf)}
.open-photostory .txt .eyebrow{color:var(--gold-hi)}
.open-photostory .txt h1{font-family:var(--f-display);font-size:clamp(40px,7.5vw,128px);line-height:.98;margin:14px 0 0;
  color:var(--leaf);letter-spacing:-.018em;max-width:20ch;text-shadow:0 2px 40px rgba(0,0,0,.5)}
.open-photostory .txt h1.en{font-family:var(--f-latin);font-weight:500;font-variation-settings:"opsz" 144}
.open-photostory .txt .standfirst{color:rgba(251,244,228,.8);max-width:52ch;margin-top:20px}
.open-photostory .scrollcue{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);width:1px;height:38px;
  background:linear-gradient(180deg,transparent,var(--gold-hi));z-index:3}

/* ── opening: RECORD — ruled, numeric ── */
.open-record{background:var(--accent-04);padding:clamp(86px,12vh,158px) 0 clamp(30px,5vh,58px);position:relative;overflow:hidden}
.open-record .big{position:absolute;right:-2vw;top:8vh;font-family:var(--f-display);font-size:clamp(190px,26vw,390px);
  line-height:.8;color:color-mix(in srgb,var(--accent) 13%,transparent);user-select:none;pointer-events:none}
.open-record .txt{grid-column:1/10;position:relative}
.open-record .txt h1{font-family:var(--f-display);font-size:clamp(32px,4.6vw,70px);line-height:1.02;margin:14px 0 0;color:var(--accent-text)}
.open-record .txt h1.en{font-family:var(--f-latin);font-weight:500}

/* ── opening: ACTIVITY — playful card ── */
.open-activity{background:var(--accent-04);padding:clamp(86px,12vh,152px) 0 clamp(26px,4vh,52px);position:relative;overflow:hidden}
.open-activity::before{content:"";position:absolute;inset:0;opacity:.12;
  background:radial-gradient(circle at 12% 18%,var(--accent) 0 3px,transparent 3px),
             radial-gradient(circle at 62% 74%,var(--accent) 0 3px,transparent 3px);background-size:62px 62px}
.open-activity .txt{grid-column:2/12;position:relative;text-align:center}
.open-activity .txt h1{font-family:var(--f-display);font-size:clamp(32px,5vw,74px);line-height:1.02;margin:14px 0 0;color:var(--accent-text)}
.open-activity .txt h1.en{font-family:var(--f-latin);font-weight:500}
.open-activity .eyebrow{justify-content:center}
.open-activity .txt .standfirst{margin:20px auto 0;max-width:48ch}

/* ── byline ── */
.byline{grid-column:4/13;display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;margin-top:26px;padding-top:15px;
  border-top:var(--hair-gold);font-family:var(--f-label);font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3)}
.byline .medallion{width:52px;height:52px;border-radius:50%;overflow:hidden;flex:none;margin-right:2px;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 40%,transparent),0 0 0 4px var(--leaf),var(--lift)}
.byline .medallion img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 26%)}
.byline .nm{font-family:var(--f-latin);font-style:italic;text-transform:none;letter-spacing:0;font-size:21px;
  color:var(--accent-text);font-variation-settings:"opsz" 34}
.byline .role{max-width:44ch;text-transform:none;letter-spacing:.02em;font-family:var(--f-ui);font-size:12.5px;color:var(--ink3)}
.byline a{color:var(--accent-text);border-bottom:1px solid color-mix(in srgb,var(--accent) 34%,transparent)}
.open-darshan .byline,.open-activity .byline,.open-record .byline{grid-column:1/13}
.open-feature .byline{border-top:0;padding-top:0;margin-top:20px}
.open-photostory .byline{color:rgba(251,244,228,.6);border-color:rgba(201,162,39,.35)}
.open-photostory .byline .nm{color:var(--gold-hi)}

/* ── body ── */
.article{padding:clamp(44px,7vh,86px) 0 0;position:relative}
.article .c-body>p{margin:0 0 1.35em;text-wrap:pretty;max-width:var(--measure)}
.article[lang="en"] .c-body>p:first-of-type::first-letter{font-family:var(--f-display);font-size:4.3em;line-height:.76;float:left;margin:.07em .11em 0 0;color:var(--accent-text)}
.article:not([lang="en"]) .c-body>p:first-of-type{font-size:1.14em;line-height:1.72;color:var(--ink)}
.article:not([lang="en"]) .c-body>p:first-of-type::before{content:"";display:block;width:52px;height:2px;background:var(--accent);margin:0 0 .7em}
.article[lang="en"] .c-body{font-family:var(--f-latin);font-size:18.5px;font-variation-settings:"opsz" 14;line-height:1.72}
.article h2{font-family:var(--f-display);font-size:clamp(25px,2.7vw,38px);line-height:1.12;margin:2.1em 0 .5em;color:var(--ink);max-width:22ch;position:relative}
.article h2::before{content:"";position:absolute;left:-26px;top:.52em;width:14px;height:2px;background:var(--accent);opacity:.85}
.article h3{font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--accent-text);margin:2.1em 0 .55em;display:flex;align-items:center;gap:12px}
.article h3::after{content:"";flex:1 1 auto;height:1px;background:color-mix(in srgb,var(--accent) 28%,transparent)}
.article .shloka{font-family:var(--f-shloka);text-align:center;font-size:1.1em;line-height:1.92;color:var(--accent-text);
  margin:1.9em auto;padding:1.15em 1.4em;max-width:36ch;font-style:normal;position:relative;
  background:var(--accent-04);border-top:var(--hair-gold);border-bottom:var(--hair-gold)}
.article .shloka+.shloka{margin-top:-1.9em;border-top:0;padding-top:0}
.article .centered{text-align:center}
.article ul,.article ol{padding-left:1.15em;margin:0 0 1.35em;max-width:var(--measure)}
.article li{margin:.34em 0}
.article li::marker{color:var(--accent)}
.article strong{font-weight:600;color:var(--ink)}
.article:not([lang="en"]) strong,.article:not([lang="en"]) b{font-family:var(--f-bold);font-weight:700}
.article .c-body a{color:var(--accent-text);border-bottom:1px solid color-mix(in srgb,var(--accent) 38%,transparent);transition:border-color var(--t1)}
.article .c-body a:hover{border-bottom-color:var(--accent)}
p.quoted{padding-left:18px;border-left:3px solid var(--accent);color:var(--ink2);font-style:normal}
p.tagged{position:relative;padding-left:20px}
p.tagged::before{content:"";position:absolute;left:0;top:.72em;width:9px;height:1px;background:var(--accent)}
.article .caption{font-family:var(--f-ui);font-size:12.5px;color:var(--ink3);margin:-.7em 0 1.9em;line-height:1.5}

/* ── rails: the margins carry content ── */
.rail{position:relative}
.rail-sticky{position:sticky;top:96px}
.rail .factbox{border-top:2px solid var(--accent);padding-top:13px;margin:0 0 30px}
.rail .factbox dt{font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-top:11px}
.rail .factbox dd{margin:2px 0 0;font-family:var(--f-display);font-size:18px;line-height:1.24;color:var(--accent-text)}
.rail .minitoc{margin:0 0 30px;padding:0;list-style:none;border-left:1px solid color-mix(in srgb,var(--accent) 24%,transparent)}
.rail .minitoc li{margin:0}
.rail .minitoc a{display:block;padding:6px 0 6px 14px;font-family:var(--f-ui);font-size:13px;line-height:1.4;color:var(--ink3);
  border-left:2px solid transparent;margin-left:-1px;transition:color var(--t1),border-color var(--t1)}
.rail .minitoc a:hover,.rail .minitoc a.on{color:var(--accent-text);border-left-color:var(--accent)}
.rail .mark{width:34px;height:34px;fill:var(--accent);opacity:.55;margin-bottom:18px}
.rail .secnum{font-family:var(--f-display);font-size:clamp(56px,6vw,96px);line-height:.8;color:color-mix(in srgb,var(--accent) 22%,transparent);margin-bottom:8px}
.rail .quote{font-family:var(--f-display);font-size:clamp(20px,1.8vw,27px);line-height:1.26;color:var(--accent-text);
  margin:0 0 30px;padding-left:16px;border-left:2px solid var(--accent)}
.rail .quote cite{display:block;font-family:var(--f-label);font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink3);font-style:normal;margin-top:12px}
.rail .aside{font-family:var(--f-ui);font-size:13px;line-height:1.6;color:var(--ink3);margin:0 0 26px;padding-top:12px;border-top:var(--hair)}
.rail .aside b{display:block;font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text);margin-bottom:7px}

/* ── figures: NEVER cropped. the frame takes the image's own ratio ── */
figure.fig{margin:2.4em 0;position:relative}
figure.fig img{width:100%;height:auto}
figure.fig figcaption{font-family:var(--f-ui);font-size:12.5px;color:var(--ink3);margin-top:11px;line-height:1.5;
  padding-left:14px;border-left:2px solid color-mix(in srgb,var(--accent) 34%,transparent)}
figure.fig.--full{grid-column:1/13;margin:clamp(42px,6vh,86px) 0}
figure.fig.--full figcaption{max-width:58ch;padding-left:0;border-left:0;border-top:var(--hair-gold);padding-top:11px;margin-top:14px}
figure.fig.--wide{grid-column:2/12;margin:clamp(34px,5vh,68px) 0}
figure.fig.--body{grid-column:4/10}
figure.fig.--side{grid-column:9/13;margin:.4em 0 1.6em}
figure.fig.--portrait{grid-column:9/13;margin:.4em 0 1.8em}
figure.fig.--flat{grid-column:3/11;margin:2.2em 0;background:var(--accent-04);padding:clamp(18px,2.4vw,40px)}
figure.fig.--flat img{box-shadow:var(--lift)}

/* bleed: one photograph edge to edge */
.bleed{grid-column:1/13;width:100vw;margin-left:calc(50% - 50vw);position:relative}
.bleed img{width:100%;height:auto;max-height:86vh;object-fit:cover;object-position:var(--pos,center 30%)}
.bleed figcaption{position:absolute;right:var(--gutter);bottom:18px;max-width:42ch;font-family:var(--f-ui);font-size:12px;
  color:#FBF4E4;text-align:right;text-shadow:0 1px 14px rgba(0,0,0,.9)}

/* ── bento: exactly N cells for N photographs, spans from aspect ── */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--gap);grid-auto-rows:minmax(0,13.5vw);grid-auto-flow:dense;
  margin:clamp(40px,6vh,80px) 0}
.bento .cell{position:relative;overflow:hidden;background:var(--accent-10);box-shadow:var(--lift);
  transition:transform var(--t2) var(--e-out),box-shadow var(--t2);will-change:transform}
.bento .cell img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 30%);
  transition:transform var(--t4) var(--e-out)}
.bento .cell:hover{transform:translateY(-5px);box-shadow:var(--lift-2);z-index:2}
.bento .cell:hover img{transform:scale(1.045)}
.bento .cell figcaption{position:absolute;inset:auto 0 0 0;padding:20px 15px 11px;font-family:var(--f-ui);font-size:11.5px;
  color:#FBF4E4;background:linear-gradient(180deg,transparent,rgba(21,16,12,.8));opacity:0;transform:translateY(8px);
  transition:opacity var(--t2),transform var(--t2) var(--e-out)}
.bento .cell:hover figcaption{opacity:1;transform:none}
.bento .cell.--flat{background:var(--accent-04);display:grid;place-items:center;padding:14px}
.bento .cell.--flat img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.bento .cell.--flat:hover img{transform:none}
.bento .w2{grid-column:span 2}.bento .w3{grid-column:span 3}.bento .w4{grid-column:span 4}.bento .w6{grid-column:span 6}
.bento .h2{grid-row:span 2}.bento .h3{grid-row:span 3}

/* ── pull quote in the flow ── */
.pull{grid-column:3/11;margin:clamp(42px,6vh,84px) 0;text-align:center;font-family:var(--f-display);
  font-size:clamp(25px,3.1vw,44px);line-height:1.22;color:var(--accent-text);position:relative;text-wrap:balance}
.pull::before{content:"";display:block;width:34px;height:34px;margin:0 auto 20px;background:var(--accent);opacity:.55;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 6c-4.2 7.4-6.4 13.6-6.4 19.4 0 4.6 2.4 8.7 6.4 11.2 4-2.5 6.4-6.6 6.4-11.2C38.4 19.6 36.2 13.4 32 6zM10 26c8 2 14 7 17 14-7 2-14 0-18-6-3-4-2-7 1-8zm44 0c3 1 4 4 1 8-4 6-11 8-18 6 3-7 9-12 17-14z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 6c-4.2 7.4-6.4 13.6-6.4 19.4 0 4.6 2.4 8.7 6.4 11.2 4-2.5 6.4-6.6 6.4-11.2C38.4 19.6 36.2 13.4 32 6zM10 26c8 2 14 7 17 14-7 2-14 0-18-6-3-4-2-7 1-8zm44 0c3 1 4 4 1 8-4 6-11 8-18 6 3-7 9-12 17-14z'/%3E%3C/svg%3E") center/contain no-repeat}

/* ── stats ── */
.stats{grid-column:1/13;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  margin:clamp(42px,6vh,80px) 0;border-top:2px solid var(--accent);border-bottom:1px solid color-mix(in srgb,var(--accent) 34%,transparent)}
.stats div{padding:26px 22px 24px 0;border-right:var(--hair);display:flex;flex-direction:column;justify-content:space-between}
.stats div:last-child{border-right:0}
.stats b{display:block;font-family:var(--f-display);font-size:clamp(30px,3.6vw,52px);line-height:1.02;overflow-wrap:anywhere;color:var(--accent-text);font-variant-numeric:tabular-nums}
.stats span{display:block;margin-top:auto;padding-top:12px;font-family:var(--f-label);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}

/* ── tables ── */
.table-wrap{grid-column:2/12;margin:2.4em 0;overflow-x:auto;border-top:2px solid var(--accent)}
.table-wrap table{width:100%;border-collapse:collapse;font-size:14.5px;font-family:var(--f-ui)}
.table-wrap th{font-family:var(--f-label);font-weight:600;letter-spacing:.13em;text-transform:uppercase;font-size:11px;
  color:var(--accent-text);text-align:left;padding:13px 14px;border-bottom:var(--hair-gold);position:sticky;top:0;background:var(--leaf)}
.table-wrap td{padding:10px 14px;border-bottom:var(--hair);vertical-align:top}
.table-wrap tr:hover td{background:var(--accent-04)}

/* ── embeds ── */
.yt,.h5p{grid-column:3/11;margin:2.6em 0;overflow:hidden;box-shadow:var(--lift-2);background:var(--night)}
.yt{aspect-ratio:16/9}.h5p{aspect-ratio:4/3;background:var(--leaf2)}
.yt iframe,.h5p iframe{width:100%;height:100%;border:0;display:block}

/* ── end matter ── */
.endmatter{padding:clamp(54px,8vh,100px) 0 0}
.endmatter .mark{margin:0 auto 26px}
.endmatter .actions{grid-column:1/13;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:8px}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-label);font-weight:600;letter-spacing:.16em;font-size:11.5px;
  text-transform:uppercase;padding:14px 24px;border:1px solid var(--accent);border-radius:2px;color:var(--accent-text);
  transition:background var(--t1),color var(--t1),transform var(--t1) var(--e-out)}
.btn:hover{background:var(--accent-text);color:var(--leaf);transform:translateY(-2px)}
.btn svg{width:15px;height:15px}
.btn.--solid{background:var(--accent-text);color:var(--leaf);border-color:var(--accent-text)}
.btn.--solid:hover{filter:brightness(.88)}
.pn{grid-column:1/13;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:color-mix(in srgb,var(--accent) 30%,transparent);
  margin:clamp(46px,7vh,86px) calc(-1*var(--gutter)) 0}
.pn a{background:var(--leaf2);padding:clamp(28px,4vw,46px) var(--gutter);transition:background var(--t2);position:relative;overflow:hidden}
.pn a::before{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--accent);transform:scaleX(0);
  transform-origin:left;transition:transform var(--t2) var(--e-out)}
.pn a:hover{background:var(--accent-04)}
.pn a:hover::before{transform:none}
.pn a .eyebrow{margin-bottom:11px}
.pn a .t{font-family:var(--f-display);font-size:clamp(19px,2vw,27px);line-height:1.14;color:var(--ink)}
.pn a.next{text-align:right}.pn a.next::before{transform-origin:right}
.pn a.next .eyebrow{justify-content:flex-end}
.more{background:var(--accent-04);padding:clamp(46px,6vh,80px) 0 clamp(52px,7vh,92px);margin-top:0}
.more h4{grid-column:1/13;font-family:var(--f-label);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent-text);margin:0 0 24px;display:flex;align-items:center;gap:14px}
.more h4::after{content:"";flex:1;height:1px;background:color-mix(in srgb,var(--accent) 30%,transparent)}
.more .items{grid-column:1/13;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--gap)}
.more a{display:block;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  transition:border-color var(--t1),transform var(--t1) var(--e-out)}
.more a:hover{border-top-color:var(--accent);transform:translateY(-3px)}
.more a .thumb{aspect-ratio:4/3;overflow:hidden;margin-bottom:12px;background:var(--accent-10)}
.more a .thumb img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 28%);transition:transform var(--t4) var(--e-out)}
.more a:hover .thumb img{transform:scale(1.05)}
.more a small{display:block;font-family:var(--f-label);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:7px}
.more a .t{font-family:var(--f-display);font-size:19px;line-height:1.16;color:var(--ink)}

/* ── section index page ── */
.sectionhero{position:relative;min-height:min(82vh,760px);display:flex;align-items:flex-end;overflow:hidden;background:var(--night)}
.sectionhero .shot{position:absolute;inset:0}
.sectionhero .shot img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 30%)}
.sectionhero .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,16,12,.48),rgba(21,16,12,.12) 34%,rgba(21,16,12,.55) 70%,var(--leaf) 99%)}
.sectionhero .big{position:absolute;left:var(--gutter);top:14vh;font-family:var(--f-display);font-size:clamp(200px,30vw,480px);
  line-height:.78;color:rgba(251,244,228,.13);z-index:1;user-select:none}
.sectionhero .txt{position:relative;z-index:2;padding:0 var(--gutter) clamp(34px,5vh,64px);width:100%}
.sectionhero h1{font-family:var(--f-display);font-size:clamp(36px,6vw,96px);line-height:1;margin:14px 0 0;color:var(--leaf);max-width:18ch;text-shadow:0 2px 34px rgba(0,0,0,.7)}
.sectionhero .eyebrow,.sectionhero .standfirst{color:var(--gold-hi)}
.seclist{padding:clamp(40px,6vh,76px) 0 clamp(54px,8vh,100px)}
.seclist .items{grid-column:1/13;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:clamp(24px,3vw,44px)}
.seclist article a{display:block}
.seclist .thumb{aspect-ratio:3/2;overflow:hidden;background:var(--accent-10);margin-bottom:16px;box-shadow:var(--lift)}
.seclist .thumb img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center 28%);transition:transform var(--t4) var(--e-out)}
.seclist article:hover .thumb img{transform:scale(1.05)}
.seclist .thumb.--none{display:grid;place-items:center;background:var(--accent-04)}
.seclist .thumb.--mat{background:var(--accent-04);display:grid;place-items:center;padding:12px}
.seclist .thumb.--mat img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.seclist article:hover .thumb.--mat img{transform:none}
.more a .thumb.--mat{background:var(--accent-04);display:grid;place-items:center;padding:8px}
.more a .thumb.--mat img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.seclist .thumb.--none svg{width:42px;height:42px;fill:var(--accent);opacity:.4}
.seclist h2{font-family:var(--f-display);font-size:clamp(21px,2.1vw,29px);line-height:1.14;margin:0 0 9px;color:var(--ink)}
.seclist p{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink3);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.seclist .meta{font-family:var(--f-label);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);margin-bottom:9px}

/* ── colophon ── */
.colophon{background:var(--night);color:rgba(251,244,228,.72);padding:clamp(54px,8vh,96px) 0 clamp(34px,5vh,58px);font-family:var(--f-ui);font-size:14px}
.colophon .a{grid-column:1/4}.colophon .b{grid-column:4/7}.colophon .c{grid-column:7/10}.colophon .d{grid-column:10/13}
.colophon b{display:block;font-family:var(--f-display);color:var(--gold-hi);font-size:19px;margin-bottom:9px}
.colophon img{height:42px;width:auto;opacity:.92;margin-bottom:14px}
.colophon a{color:var(--gold-hi);border-bottom:1px solid rgba(240,220,154,.3)}
.colophon .fine{grid-column:1/13;border-top:1px solid rgba(201,162,39,.24);padding-top:18px;margin-top:34px;
  font-size:12.5px;color:rgba(251,244,228,.66);letter-spacing:.03em;line-height:1.7;max-width:86ch}

/* ── activities ── */
.act-reveal{margin:1.3em 0 1.9em}
.act-answer{margin-top:13px;padding:15px 19px;border-left:3px solid var(--accent);background:var(--accent-04)}
.act-sort{list-style:none;padding:0;margin:1.5em 0 .7em;max-width:none}
.act-sort li{display:flex;align-items:flex-start;gap:13px;padding:14px 16px;margin:9px 0;background:var(--leaf2);
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);border-radius:2px;cursor:grab;text-align:left;line-height:1.55;
  transition:transform var(--t1),box-shadow var(--t1),border-color var(--t1),background var(--t1)}
.act-sort li:hover{box-shadow:var(--lift);transform:translateY(-1px);border-color:var(--accent)}
.act-sort li.is-drag{opacity:.45}
.act-sort li.is-ok{border-color:#2F7D4F;background:#EDF6EE}
.act-sort li.is-bad{border-color:#8B1E24;background:#FBEEEC}
.act-sort li .act-txt{flex:1 1 auto}
.act-grip{color:var(--accent);letter-spacing:-.22em;user-select:none;font-family:var(--f-ui);flex:none;padding-top:2px}
.act-bar{display:flex;align-items:center;gap:18px;margin:0 0 2.2em;flex-wrap:wrap}
.act-out{font-family:var(--f-label);font-weight:600;letter-spacing:.09em;color:var(--accent-text)}
.act-q{position:relative;padding-left:54px;margin-top:1.9em!important}
.act-q::before{content:attr(data-n);position:absolute;left:0;top:-5px;font-family:var(--f-display);font-size:31px;color:var(--accent);line-height:1;opacity:.8}

/* ── motion states ── */
[data-reveal]{opacity:0;transform:translateY(20px)}
.no-js [data-reveal],.reduced [data-reveal]{opacity:1;transform:none}
.split-w{display:inline-block;overflow:hidden;vertical-align:top}
.split-w>span{display:inline-block;will-change:transform}

/* ═══════════ RESPONSIVE ═══════════ */
@media (max-width:1100px){
  .c-body{grid-column:3/11}
  .c-rail-l{grid-column:1/3}.c-rail-r{grid-column:11/13}
  .rail .secnum{font-size:44px}
  figure.fig.--side,figure.fig.--portrait{grid-column:8/13}
  .bento{grid-auto-rows:minmax(0,18vw)}
}
@media (max-width:860px){
  .gridwrap{grid-template-columns:repeat(6,var(--col))}
  .c-body,.c-wide,.c-full,.byline,.pull,.stats,.table-wrap,.yt,.h5p,.more h4,.more .items,.seclist .items,.endmatter .actions,.pn{grid-column:1/7}
  figure.fig.--full,figure.fig.--wide,figure.fig.--body,figure.fig.--side,figure.fig.--portrait,figure.fig.--flat{grid-column:1/7}
  .c-rail-l,.c-rail-r{grid-column:1/7}
  .rail-sticky{position:static}
  .rail .quote{margin:26px 0 32px;font-size:22px}
  .open-darshan .portrait{grid-column:1/7;max-width:340px}
  .open-darshan .txt{grid-column:1/7;padding-left:0}
  .open-darshan.--noportrait .txt{grid-column:1/7}
  .open-report .facts,.open-report .txt,.open-report .shot{grid-column:1/7}
  .open-report .facts{margin-bottom:26px}
  .open-record .txt,.open-activity .txt{grid-column:1/7}
  .colophon .a,.colophon .b,.colophon .c,.colophon .d,.colophon .fine{grid-column:1/7}
  .pn{grid-template-columns:1fr;margin-inline:calc(-1*var(--gutter))}
  .pn a.next{text-align:left}.pn a.next .eyebrow{justify-content:flex-start}
  .bento{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(0,26vw)}
  .bento .w3,.bento .w4,.bento .w6{grid-column:span 4}.bento .w2{grid-column:span 2}
  .flipbook{width:min(560px,94vw)}
  .shelf__row::after{display:none}
  .book{width:min(62vw,270px);margin-bottom:82px}
  .shelf__row{gap:44px 24px;padding-bottom:20px}
}
@media (max-width:600px){
  body{font-size:17px;line-height:1.78}
  .topbar{padding-left:52px}
  .ribbon{width:28px;height:138px}
  .bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:minmax(0,42vw)}
  .bento .w2,.bento .w3,.bento .w4,.bento .w6{grid-column:span 2}
  .bento .h2,.bento .h3{grid-row:span 1}
  .stats div{padding:18px 14px 16px 0}
  .endmatter .actions .btn{flex:1 1 100%;justify-content:center}
  .article[lang="en"] .c-body>p:first-of-type::first-letter{font-size:3.6em}
  .open-feature .slab{margin-inline:16px;padding:22px 20px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ═══════════ PRINT ═══════════ */
@media print{
  @page{size:A4;margin:16mm 15mm 18mm}
  body{background:#fff;color:#141414;font-size:10.5pt;line-height:1.62}
  .topbar,.ribbon,.drawer,.leafbar,.endmatter .actions,.pn,.more,.colophon,.spreads__nav,.grain,.scrollcue{display:none!important}
  .gridwrap{max-width:none;padding:0;gap:0 8mm}
  .open-feature,.open-photostory{min-height:0;height:auto;display:block;background:#fff;page-break-after:always}
  .open-feature .shot,.open-photostory .shot{position:relative;height:auto}
  .open-feature .shot img,.open-photostory .shot img{height:auto;max-height:118mm;object-fit:cover}
  .open-feature .shot::after,.open-photostory .shot::after,.sectionhero .shot::after{display:none}
  .open-feature .slab{margin:6mm 0 0;background:none;box-shadow:none;backdrop-filter:none;padding:0;border-top-width:2pt;max-width:none}
  .open-photostory .txt{position:relative;padding:6mm 0 0;color:#141414}
  .open-photostory .txt h1,.open-feature .slab h1{font-size:30pt;color:#141414;text-shadow:none}
  .open-photostory .txt .standfirst{color:#3a3a3a}
  .open-darshan,.open-report,.open-record,.open-activity{padding:0;margin:0;background:#fff;break-after:page;page-break-after:always}
  .open-darshan .g,.open-report .g{align-items:start}
  .open-record .big,.open-activity::before,.open-darshan::before{display:none}
  .byline a[href$=".pdf"],.byline a[download]{display:none}
  .open-feature .slab .standfirst,.open-photostory .txt .standfirst{max-width:none}
  .stats{margin:4mm 0}
  .endmatter{padding:0}
  .endmatter .mark{display:none}
  .print-head{display:none}
  .reader>.gridwrap:first-of-type{break-before:avoid}
  .open-darshan::before,.open-activity::before{display:none}
  .open-darshan .portrait{grid-column:1/5}.open-darshan .txt{grid-column:5/13}
  .article{padding-top:0;break-before:page}
  .c-body{grid-column:1/13}
  .c-rail-l,.c-rail-r{display:none}
  figure.fig,figure.fig.--full,figure.fig.--wide,figure.fig.--body,figure.fig.--side,figure.fig.--portrait,figure.fig.--flat{grid-column:1/13;margin:5mm 0;break-inside:avoid}
  figure.fig img{max-height:108mm;width:auto;max-width:100%}
  .bleed{width:auto;margin-left:0}
  .bento{grid-template-columns:repeat(6,1fr);grid-auto-rows:34mm;gap:3mm;break-inside:avoid}
  .bento .cell figcaption{position:static;opacity:1;transform:none;background:none;color:#555;padding:2mm 0 0}
  .pull{grid-column:1/13;font-size:16pt;break-inside:avoid}
  .stats{break-inside:avoid}
  .yt,.h5p{display:none}
  .table-wrap{grid-column:1/13;overflow:visible}
  .table-wrap th{position:static;background:none}
  a{color:inherit;border:0!important}
  .print-foot{display:block!important;position:fixed;bottom:0;left:0;right:0;font-family:var(--f-label);font-size:8pt;
    letter-spacing:.12em;color:#8a8a8a;text-align:center;text-transform:uppercase}
}
.print-foot{display:none}