/* Sangati — shared design system (rev.css) */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --paper:#F3EFE7; --paper2:#EAE4D9; --card:#FBF8F2; --ink:#151310; --ink2:#463F35; --muted:#8B8272; --line:#E0D8CA;
  --dark:#0F0E0B; --dark2:#181510; --cream:#F3EFE7; --amber:#C06A16; --sage:#516B54;
  --sh:0 1px 2px rgba(21,19,16,.05),0 12px 40px rgba(21,19,16,.07);
  --sh-lg:0 3px 10px rgba(21,19,16,.06),0 40px 80px rgba(21,19,16,.16);
  --ser:'Switzer',system-ui,-apple-system,sans-serif; --sans:'Switzer',system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.16,.8,.3,1);
}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.5;overflow-x:hidden}
::selection{background:rgba(192,106,22,.92);color:#fff}
a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}
.wrap{max-width:1160px;margin:0 auto;padding:0 26px}
h1,h2,h3{font-family:var(--ser);font-weight:600;line-height:1.04;letter-spacing:-.03em;text-wrap:balance}
h1{font-size:clamp(40px,6.6vw,72px);font-weight:600;letter-spacing:-.04em;line-height:1.03}
h2{font-size:clamp(28px,4.4vw,46px);font-weight:600;letter-spacing:-.033em}
h3{font-size:clamp(18px,2.3vw,22px);font-weight:600;letter-spacing:-.02em}
.eyebrow{font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.eyebrow-row{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.eyebrow-row .dsh{width:26px;height:1px;background:var(--muted)}
p.lead{color:var(--ink2);font-size:clamp(16.5px,2.1vw,20px);line-height:1.55;max-width:56ch;font-weight:400}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:500;font-size:15.5px;padding:15px 26px;border-radius:2px;border:0;cursor:pointer;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s}
.btn.solid{background:var(--ink);color:var(--cream)}.btn.solid:hover{transform:translateY(-2px);background:#000}
.btn.cream{background:var(--cream);color:var(--ink)}.btn.cream:hover{transform:translateY(-2px);box-shadow:var(--sh)}
.btn.line{background:rgba(243,239,231,.08);color:var(--cream);border:1px solid rgba(243,239,231,.55)}.btn.line:hover{background:rgba(243,239,231,.16);border-color:var(--cream);transform:translateY(-2px)}
.btn.line.ink{background:transparent;color:var(--ink);border-color:var(--line)}.btn.line.ink:hover{border-color:var(--ink);background:transparent}
.btn .a{transition:transform .25s}.btn:hover .a{transform:translateX(4px)}

.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
.nav .row{display:flex;align-items:center;justify-content:space-between;height:74px}
.nav.scr,.nav.solid{background:rgba(243,239,231,.86);backdrop-filter:blur(16px) saturate(1.2);border-color:var(--line)}
.brand{font-family:var(--ser);font-weight:700;font-size:25px;letter-spacing:-.03em;color:var(--cream);transition:color .4s}
.nav.scr .brand,.nav.solid .brand{color:var(--ink)}
.brand i{font-style:normal;color:var(--amber)}
.navlinks{display:flex;align-items:center;gap:34px}
.navlinks a{font-size:14.5px;font-weight:500;color:rgba(243,239,231,.8);transition:color .2s}
.navlinks a:hover{color:var(--cream)}
.nav.scr .navlinks a,.nav.solid .navlinks a{color:var(--ink2)}.nav.scr .navlinks a:hover,.nav.solid .navlinks a:hover{color:var(--ink)}
.navlinks a.active{color:var(--amber)}
.nav .btn{padding:10px 20px;font-size:14px}
.nav .btn.line{color:var(--cream)}.nav.scr .btn.line,.nav.solid .btn.line{color:var(--ink);border-color:var(--line);background:transparent}
.burger{display:none;flex-direction:column;gap:5px;background:0;border:0;cursor:pointer;padding:8px}
.burger span{width:24px;height:2px;background:var(--cream);border-radius:2px;transition:.3s}.nav.scr .burger span,.nav.solid .burger span{background:var(--ink)}
@media(max-width:900px){
  .navlinks{position:fixed;inset:74px 0 auto 0;flex-direction:column;align-items:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 26px 22px;transform:translateY(-135%);transition:transform .4s var(--ease)}
  .navlinks.open{transform:translateY(0)}
  .navlinks a{width:100%;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px;color:var(--ink2)}
  .navlinks .btn{margin-top:16px;width:100%;justify-content:center;color:var(--cream)}
  .burger{display:flex}
}

/* PAGE HEADER (inner pages) */
.pghead{padding:calc(74px + clamp(56px,9vw,110px)) 0 clamp(30px,5vw,56px);position:relative}
.pghead .back{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);margin-bottom:26px;transition:color .2s}
.pghead .back:hover{color:var(--ink)}
.pghead h1{margin:16px 0 22px;max-width:18ch}
.pghead p.lead{margin-bottom:4px}

section.blk{padding:clamp(60px,8vw,110px) 0}
.paper2{background:var(--paper2)}
.lead-in{max-width:22ch}

/* editorial numbered list */
.gaplist{border-top:1px solid var(--line)}
.gaprow{display:grid;grid-template-columns:auto 1fr 1.4fr;gap:28px;align-items:baseline;padding:30px 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease)}
@media(max-width:760px){.gaprow{grid-template-columns:1fr;gap:8px}}
.gaprow:hover{padding-left:10px}
.gaprow .gn{font-family:var(--ser);font-size:20px;color:var(--muted);font-weight:500}
.gaprow p{color:var(--ink2);font-size:15.5px;line-height:1.5}

/* signal / two-col list */
.sg{display:grid;grid-template-columns:repeat(2,1fr);gap:0 60px}
@media(max-width:760px){.sg{grid-template-columns:1fr}}
.sgrow{display:flex;gap:16px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease)}
.sgrow:hover{padding-left:8px}
.sgrow .sd{width:6px;height:6px;border-radius:50%;background:var(--amber);flex:0 0 auto;transform:translateY(6px)}
.sgrow b{font-weight:600;font-size:16.5px}.sgrow p{color:var(--muted);font-size:14px;margin-top:3px}

/* photo steps */
.hsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:820px){.hsteps{grid-template-columns:1fr;gap:34px}}
.hstep .ph{position:relative;border-radius:4px;overflow:hidden;aspect-ratio:4/3}
.hstep .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.hstep:hover .ph img{transform:scale(1.05)}
.hstep .num{font-family:var(--ser);font-size:15px;color:var(--muted);margin:20px 0 6px}
.hstep p{color:var(--ink2);font-size:15px;margin-top:8px;line-height:1.55}

/* split */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,6vw,80px);align-items:center}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:38px}}
.plist{margin-top:6px}
.plist .pi{display:flex;gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--ink)}
.plist .pi:last-child{border-bottom:0}
.plist .pi span{color:var(--sage);flex:0 0 auto}
.pquote{border-left:2px solid var(--amber);padding:6px 0 6px 26px}
.pquote .q{font-family:var(--ser);font-size:clamp(22px,3vw,30px);font-weight:600;color:var(--ink);line-height:1.25;letter-spacing:-.02em}
.pquote .att{margin-top:16px;font-size:13px;color:var(--muted)}

/* metrics */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
@media(max-width:720px){.metrics{grid-template-columns:1fr}}
.metric{padding:32px 30px 32px 0;border-top:1px solid var(--line);border-right:1px solid var(--line)}
.metric:last-child{border-right:0}@media(max-width:720px){.metric{border-right:0}}
.metric .mk{font-family:var(--ser);font-size:44px;font-weight:500;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.metric .mt{font-weight:600;margin-top:16px;font-size:16.5px}
.metric p{color:var(--ink2);font-size:14.5px;margin-top:7px;line-height:1.5}

/* cards grid (bento-ish) */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.cards{grid-template-columns:1fr}}
.pcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:28px;transition:transform .3s var(--ease),box-shadow .3s}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--sh)}
.pcard .pn{font-family:var(--ser);font-size:14px;color:var(--amber);font-weight:500}
.pcard h3{margin:14px 0 10px}.pcard p{color:var(--ink2);font-size:15px;line-height:1.55}

/* contact desks */
.crgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 44px;margin-top:32px}
@media(max-width:720px){.crgrid{grid-template-columns:1fr;gap:0}}
.cr{padding:24px 0;border-top:1px solid var(--line)}
.cr .role{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cr a{font-weight:600;font-size:16px;display:inline-block;margin:10px 0 6px;border-bottom:1px solid var(--amber);padding-bottom:1px}
.cr p{color:var(--ink2);font-size:13.5px}

/* prose */
.prose p{color:var(--ink2);font-size:17px;line-height:1.62;max-width:66ch;margin-bottom:18px}
.prose p b{color:var(--ink);font-weight:600}
.prose a.mail{color:var(--amber);border-bottom:1px solid var(--amber);font-weight:500}

/* CTA band */
.ctaband{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:clamp(34px,5vw,56px);display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(28px,5vw,56px);align-items:center}
@media(max-width:820px){.ctaband{grid-template-columns:1fr;gap:26px}}
.ctaband h2{margin:14px 0 10px}
.ctaband .right{display:flex;justify-content:flex-end}
@media(max-width:820px){.ctaband .right{justify-content:flex-start}}

/* footer */
footer{border-top:1px solid var(--line);padding:56px 0 46px}
.frow{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.frow .fb{font-family:var(--ser);font-weight:700;font-size:22px;letter-spacing:-.03em}.frow .fb i{font-style:normal;color:var(--amber)}
.frow p{color:var(--muted);font-size:13.5px;margin-top:10px;max-width:34ch;line-height:1.5}
.fnav{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:flex-start}
.fnav a{font-size:14px;color:var(--ink2)}.fnav a:hover{color:var(--ink)}

/* AUDIOBOOK */
.abhead{padding:calc(74px + clamp(56px,9vw,104px)) 0 30px}
.abmeta{margin-top:18px;font-size:13px;color:var(--muted);letter-spacing:.02em}
.eps{display:grid;gap:14px;padding-bottom:60px}
.ep{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;transition:border-color .3s}
.ep.playing{border-color:rgba(192,106,22,.5)}
.ep-top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.ep-num{font-family:var(--ser);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);font-weight:600}
.ep-title{font-family:var(--ser);font-size:clamp(19px,3.4vw,23px);font-weight:600;letter-spacing:-.02em}
.ep-desc{margin-top:8px;color:var(--ink2);font-size:15px;max-width:66ch;line-height:1.55}
.ep-player{display:flex;align-items:center;gap:14px;margin-top:18px}
.ep-btn{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:0;background:var(--ink);color:var(--cream);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.ep-btn:hover{background:#000;transform:scale(1.05)}
.ep-btn svg{width:16px;height:16px}
.ep-mid{flex:1 1 auto;min-width:0}
.ep-seek{width:100%;-webkit-appearance:none;appearance:none;height:4px;border-radius:2px;background:linear-gradient(to right,var(--amber) var(--p,0%),var(--line) var(--p,0%));cursor:pointer}
.ep-seek::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--card)}
.ep-seek::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--ink);border:2px solid var(--card)}
.ep-times{display:flex;justify-content:space-between;margin-top:7px;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.ep-resume{color:var(--amber)}
.ep-speed{flex:0 0 auto;border:1px solid var(--line);background:transparent;color:var(--ink2);font-family:var(--sans);font-size:12.5px;padding:8px 12px;border-radius:100px;cursor:pointer;min-width:56px;transition:border-color .2s,color .2s}
.ep-speed:hover{border-color:var(--amber);color:var(--ink)}
@media(max-width:560px){.ep{padding:18px 16px}.ep-player{gap:11px}.ep-btn{width:42px;height:42px}}

.brand{display:inline-flex;align-items:center;gap:9px}
.frow .fb{display:inline-flex;align-items:center;gap:10px}