/* ===== G cafe Bilbao — components & motion (faithful to Savoria, own code) ===== */

/* ---------- buttons (sharp, Savoria style) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--serif);font-style:italic;font-size:16px;font-weight:400;letter-spacing:.01em;
  padding:15px 26px;border-radius:var(--r-btn);border:1px solid transparent;cursor:pointer;
  transition:background .35s var(--ease),color .35s var(--ease),border-color .35s,transform .35s var(--ease)}
.btn .arr{font-style:normal;transition:transform .35s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn.solid{background:var(--green-btn);color:var(--cream-bright)}
.btn.solid:hover{background:var(--green-btn-2);color:var(--ochre)}
.btn.ochre{background:var(--ochre);color:var(--ink)}
.btn.ochre:hover{background:var(--ochre-2);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--cream-bright);border-color:var(--line-2)}
.btn.ghost:hover{background:rgba(255,252,243,.08);border-color:var(--ochre);color:var(--ochre)}
.btn.lg{padding:17px 34px;font-size:18px}

.hover-link{display:inline-flex;align-items:center;gap:.5em;font-family:var(--sans);font-size:13px;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ochre);position:relative;width:max-content}
.hover-link::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:currentColor;transition:right .4s var(--ease)}
.hover-link:hover::after{right:0}
.hover-link .arr{transition:transform .35s var(--ease)}
.hover-link:hover .arr{transform:translateX(4px)}

/* ---------- figure reveal / hover-zoom ---------- */
.figrev{position:relative;overflow:hidden;background:var(--green-3)}
.figrev img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.5s var(--ease)}
.figrev::after{content:"";position:absolute;inset:0;background:var(--green);transform:translateY(0);transition:transform 1.2s var(--ease);z-index:2}
.figrev.in img{transform:scale(1)}
.figrev.in::after{transform:translateY(-101%)}

.parallax{position:relative;overflow:hidden}
.parallax img{will-change:transform}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .95s var(--ease),transform .95s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.40s}
.no-js .reveal{opacity:1;transform:none}

/* word-rise display headings (spans pre-rendered in HTML → no CLS) */
.sr{display:block}
.sr .ln{display:block;overflow:hidden}
.sr .w{display:inline-block;transform:translateY(112%);transition:transform .9s var(--ease)}
.sr.in .w,.loaded .sr[data-hero].in .w{transform:none}
.no-js .sr .w{transform:none}
@media (prefers-reduced-motion:reduce){.sr .w{transform:none;transition:none}}

/* block hero rise (sub/actions) */
[data-rise]{opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease) .15s,transform 1s var(--ease) .15s}
.loaded [data-rise]{opacity:1;transform:none}
.no-js [data-rise]{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-rise]{opacity:1;transform:none;transition:none}}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:var(--cream-bright);isolation:isolate;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-media img{width:100%;height:118%;object-fit:cover;position:absolute;top:-9%;left:0;right:0}
.hero-scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,29,29,.58) 0%,rgba(20,29,29,.18) 30%,rgba(20,29,29,.30) 58%,rgba(20,29,29,.86) 100%)}
.hero-corners{position:absolute;inset:0;z-index:1;pointer-events:none;display:none;
  padding:clamp(80px,10vw,120px) var(--gut) 0}
@media (min-width:768px){.hero-corners{display:block}}
.hero-corners .cc{position:absolute;font-family:var(--sans);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,252,243,.75)}
.hero-corners .tl{top:clamp(86px,11vw,128px);left:var(--gut)}
.hero-corners .tr{top:clamp(86px,11vw,128px);right:var(--gut)}
.hero-inner{position:relative;z-index:2;padding-bottom:clamp(48px,8vw,104px);padding-top:120px;width:100%}
.hero h1{color:var(--ochre);max-width:16ch}
.hero h1 .roman{color:var(--cream-bright)}
.hero-sub{max-width:44ch;color:rgba(255,252,243,.9);margin-top:1.6rem;font-size:clamp(16px,1.6vw,20px);font-family:var(--serif);font-style:italic;font-weight:300}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.2rem}
.hero-foot{position:absolute;left:0;right:0;bottom:clamp(20px,3vw,34px);z-index:2;
  display:none;justify-content:space-between;gap:1rem;padding-inline:var(--gut);
  font-family:var(--sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,252,243,.72)}
@media (min-width:640px){.hero-foot{display:flex}}

/* page hero (inner pages) */
.hero.page{min-height:68svh;align-items:center}
.hero.page .hero-inner{padding-top:clamp(120px,16vw,180px);padding-bottom:clamp(40px,6vw,80px)}
.hero.page h1{max-width:20ch}

/* ---------- stat counters ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,30px);margin-top:clamp(28px,3vw,44px)}
.stat b{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(40px,6vw,76px);color:var(--ochre);line-height:1}
.stat span{display:block;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-dim);margin-top:.6rem;max-width:16ch}

/* ---------- scattered house plates (Signature Series) ---------- */
.platter{position:relative}
.platter-head .ph-lede{margin-top:1.2rem;max-width:42ch}
@media (min-width:860px){
  .platter-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,38ch);align-items:end;gap:clamp(32px,6vw,90px)}
  .platter-head .ph-lede{margin-top:0;padding-bottom:.5rem;max-width:none}
}
.dish{position:relative;padding-top:1.1rem;border-top:1px solid var(--line-2)}
.dish .dn{font-family:var(--serif);font-weight:300;font-size:clamp(22px,2.4vw,30px);color:var(--cream-bright);line-height:1.1}
.dish .dp{color:var(--ochre);font-size:15px;margin-top:.5rem;letter-spacing:.02em}
.dish .dd{color:var(--cream-dim);font-size:14px;margin-top:.4rem;max-width:30ch}
.dish .dfig{overflow:hidden;margin-top:1rem;aspect-ratio:4/3}
.dish .dfig img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.dish:hover .dfig img{transform:scale(1.05)}
/* mobile = simple stacked grid */
.platter-grid{display:grid;grid-template-columns:1fr;gap:clamp(26px,4vw,40px)}
@media (min-width:640px){.platter-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){
  /* scattered asymmetric layout on desktop */
  .platter-grid{grid-template-columns:repeat(12,1fr);row-gap:clamp(40px,5vw,72px)}
  .platter-grid .dish{display:flex;flex-direction:column}
  .dish.s1{grid-column:1/5}
  .dish.s2{grid-column:8/13;margin-top:clamp(60px,8vw,120px)}
  .dish.s3{grid-column:2/6;margin-top:clamp(20px,3vw,40px)}
  .dish.s4{grid-column:7/11;margin-top:clamp(-10px,0vw,10px)}
  .dish .dfig{max-width:360px}
  .dish.s2 .dfig,.dish.s4 .dfig{align-self:flex-end}
}

/* ---------- accordion ---------- */
.accordion{border-top:1px solid var(--line-2)}
.acc-item{border-bottom:1px solid var(--line-2)}
.acc-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.4rem;
  background:transparent;border:0;cursor:pointer;text-align:left;padding:1.3rem 0;color:var(--cream-bright);
  font-family:var(--serif);font-weight:300;font-size:clamp(20px,2vw,26px);line-height:1.2;
  transition:color .3s var(--ease)}
.acc-head:hover,.acc-item.open .acc-head{color:var(--ochre)}
.acc-head:focus-visible{outline:2px solid var(--ochre);outline-offset:4px}
.acc-head .pm{position:relative;flex:0 0 18px;width:18px;height:18px}
.acc-head .pm::before,.acc-head .pm::after{content:"";position:absolute;background:currentColor;transition:transform .35s var(--ease),opacity .35s}
.acc-head .pm::before{top:8px;left:0;width:18px;height:2px}
.acc-head .pm::after{top:0;left:8px;width:2px;height:18px}
.acc-item.open .pm::after{transform:scaleY(0);opacity:0}
.acc-body{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.acc-body-inner{padding:0 0 1.5rem;color:var(--cream-dim);font-size:15px;line-height:1.65;max-width:54ch}
html:not(.js) .acc-body{max-height:none}

/* ---------- bigword ---------- */
.bigword{font-family:var(--serif);font-weight:300;font-size:clamp(66px,17vw,230px);line-height:.88;
  letter-spacing:-.03em;color:var(--ochre);text-align:center}
.brand-block{text-align:center}
.brand-block .kick{font-family:var(--serif);font-style:italic;color:var(--cream-dim);margin-top:1rem}

/* philosophy split */
.philo{display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,56px);align-items:end;margin-top:clamp(30px,5vw,70px)}
@media (min-width:900px){.philo{grid-template-columns:1.1fr .9fr}}
.philo .label{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-dim);align-self:end}

/* ---------- full-bleed banner / promo ---------- */
.promo{position:relative;min-height:clamp(380px,52vw,600px);display:flex;align-items:center;color:var(--cream-bright);overflow:hidden;isolation:isolate}
.promo .parallax{position:absolute;inset:0;z-index:-2}
.promo .parallax img{width:100%;height:120%;object-fit:cover;position:absolute;top:-10%;left:0;right:0}
.promo .scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(20,29,29,.78),rgba(20,29,29,.3))}
.promo .inner{padding-block:clamp(48px,8vw,96px)}
.promo h2{color:var(--cream-bright);max-width:18ch}
.promo .flag{display:inline-flex;align-items:center;gap:.6rem;background:rgba(255,252,243,.12);
  border:1px solid rgba(255,252,243,.26);padding:7px 16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:1.3rem}

/* ---------- reserve / contact panel ---------- */
.reserve-wrap{display:grid;grid-template-columns:1fr;gap:clamp(30px,4vw,56px);align-items:center}
@media (min-width:900px){.reserve-wrap{grid-template-columns:1fr 1fr}}
.rpanel{background:var(--green-btn);padding:clamp(26px,3.4vw,46px)}
.rpanel h3{color:var(--ochre);margin-bottom:1.6rem}
.field{margin-bottom:1.2rem}
.field label{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,252,243,.7);margin-bottom:.5rem}
.field input,.field select,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(255,252,243,.3);
  color:var(--cream-bright);padding:.6rem 0;font-size:16px;transition:border-color .3s}
.field input::placeholder,.field textarea::placeholder{color:rgba(255,252,243,.45)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--ochre)}
.field select option{background:var(--green-btn);color:var(--cream-bright)}
.field.two{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.rpanel .btn.ochre{margin-top:.4rem}
/* phone-first reserve panel (no form) */
.rpanel .rp-lead{color:rgba(255,252,243,.82);margin-bottom:1.8rem;max-width:42ch}
.rp-lines{list-style:none;display:grid;gap:1.3rem;margin:0 0 2rem}
.rp-lines li{display:flex;flex-direction:column;gap:.4rem;padding-bottom:1.3rem;border-bottom:1px solid rgba(255,252,243,.18)}
.rp-lines li:last-child{padding-bottom:0;border-bottom:0}
.rp-lines .lbl{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,252,243,.6)}
.rp-lines .big{font-family:var(--serif);font-weight:300;font-size:clamp(21px,2.2vw,27px);color:var(--cream-bright);line-height:1.05}
.rp-lines a.big{transition:color .3s var(--ease)}
.rp-lines a.big:hover{color:var(--ochre)}

/* ---------- testimonials (horizontal scroll-scrub) ---------- */
.tscrub{position:relative;overflow:hidden}
.tscrub .track{display:flex;gap:clamp(16px,2vw,26px);will-change:transform;padding-inline:var(--gut)}
.tcard{flex:0 0 min(86vw,420px);background:var(--green-3);border:1px solid var(--line);padding:clamp(24px,3vw,38px);display:flex;flex-direction:column;justify-content:space-between;min-height:300px}
.tcard.ochre{background:var(--ochre);color:var(--ink)}
.tcard.ochre *{color:var(--ink)}
.tcard blockquote{font-family:var(--serif);font-weight:300;font-size:clamp(18px,1.8vw,22px);line-height:1.4;color:var(--cream-bright)}
.tcard cite{display:block;margin-top:1.4rem;font-style:normal;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-dim)}
.tcard .rate{font-family:var(--serif);font-weight:300;font-size:clamp(46px,6vw,70px);line-height:1;color:var(--ink)}
.tcard .rate small{display:block;font-family:var(--sans);font-size:13px;letter-spacing:.08em;margin-top:.8rem}
.tcard .brandmark{font-family:var(--serif);font-style:italic;font-size:26px}

/* ---------- journal (scattered) ---------- */
.journal{display:grid;grid-template-columns:1fr;gap:clamp(32px,4vw,52px)}
@media (min-width:900px){
  .journal{grid-template-columns:repeat(12,1fr)}
  .jpost.j1{grid-column:1/5}
  .jpost.j2{grid-column:5/9;margin-top:clamp(30px,5vw,64px)}
  .jpost.j3{grid-column:9/13;margin-top:clamp(70px,9vw,128px)}
}
.jpost .date{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
.jpost h3{font-size:clamp(22px,2.2vw,28px);color:var(--cream-bright);margin:.7rem 0 1rem;font-weight:300}
.jpost .dfig{overflow:hidden;aspect-ratio:4/3;margin-bottom:1rem}
.jpost .dfig img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.jpost:hover .dfig img{transform:scale(1.05)}

/* ---------- CTA band ---------- */
.cta{position:relative;overflow:hidden;background:linear-gradient(135deg,#24413A 0%,#1B2D2A 60%,#223B3B 100%)}
.cta .inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2rem;
  padding-block:clamp(72px,11vw,150px)}
.cta h2{color:var(--ochre);max-width:18ch}
.cta h2 em{color:var(--ochre)}

/* ---------- menu list (menu page) ---------- */
.mcat{margin-bottom:clamp(44px,6vw,80px)}
.mcat-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line-2);padding-bottom:1rem;margin-bottom:1.6rem}
.mcat-head h2,.mcat-head h3{color:var(--ochre);font-size:clamp(26px,3.4vw,42px);line-height:1.05;font-weight:300}
.mcat-head span{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-dim)}
.mlist{display:grid;grid-template-columns:1fr;gap:1.1rem 3rem}
@media (min-width:760px){.mlist{grid-template-columns:1fr 1fr}}
.mitem{display:flex;gap:1rem;align-items:baseline;border-bottom:1px dotted var(--line);padding-bottom:1rem}
.mitem .mn{font-family:var(--serif);font-weight:300;font-size:19px;color:var(--cream-bright);flex:1}
.mitem .mn small{display:block;font-family:var(--sans);font-size:14px;color:var(--cream-dim);margin-top:.2rem;font-weight:400}
.mitem .mp{color:var(--ochre);font-size:16px;white-space:nowrap}

/* ---------- route / directions (find-us) ---------- */
.route{display:grid;grid-template-columns:1fr;gap:clamp(30px,4vw,56px)}
@media (min-width:980px){.route{grid-template-columns:1.05fr .95fr}}
.steps{counter-reset:step;border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;padding:clamp(18px,2.4vw,28px) 0;border-bottom:1px solid var(--line)}
.step .no{counter-increment:step;font-family:var(--serif);font-weight:300;font-size:clamp(26px,3vw,40px);color:var(--ochre);line-height:1}
.step .no::before{content:counter(step,decimal-leading-zero)}
.step h3{font-size:clamp(19px,2vw,24px);color:var(--cream-bright);margin-bottom:.4rem;font-weight:400}
.step p{color:var(--cream);font-size:15px}
.step .dist{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);margin-top:.5rem}
.route-mark{background:var(--ochre);color:var(--ink);font-weight:600;padding:0 .25em}

/* schematic route map */
.mapcard{background:var(--green-3);border:1px solid var(--line);padding:clamp(18px,2vw,26px);position:sticky;top:100px}
.mapcard svg{width:100%;height:auto;display:block}
.routemap{width:100%;height:clamp(380px,56vh,580px);border:0;display:block;background:var(--green-2)}
.map-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem;font-size:13px;color:var(--cream-dim)}
.map-legend i{display:inline-block;width:14px;height:14px;margin-right:.4rem;vertical-align:-2px}

/* arrival modes */
.modes{display:grid;grid-template-columns:1fr;gap:clamp(16px,2vw,22px);margin-top:1.4rem}
@media (min-width:720px){.modes{grid-template-columns:repeat(3,1fr)}}
.mode{background:var(--green-2);border:1px solid var(--line);padding:clamp(20px,2.4vw,28px);transition:border-color .4s,transform .4s var(--ease)}
.mode:hover{border-color:var(--line-2);transform:translateY(-4px)}
.mode h3{font-size:19px;color:var(--cream-bright);margin-bottom:.5rem;font-weight:400}
.mode .t{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ochre);margin-bottom:.8rem;display:block}
.mode p{font-size:14px;color:var(--cream-dim)}

/* info cards (contact) */
.ccards{display:grid;grid-template-columns:1fr;gap:clamp(14px,2vw,20px)}
@media (min-width:640px){.ccards{grid-template-columns:1fr 1fr}}
.ccard{background:var(--green-3);border:1px solid var(--line);padding:clamp(22px,2.6vw,32px);transition:border-color .4s,transform .4s var(--ease)}
.ccard:hover{border-color:var(--line-2);transform:translateY(-4px)}
.ccard .lbl{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-dim)}
.ccard .big{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(22px,2.4vw,30px);color:var(--cream-bright);margin-top:.6rem}
.ccard a.big:hover{color:var(--ochre)}
.ccard .sub{font-size:14px;color:var(--cream-dim);margin-top:.4rem}

/* hours table */
.hours{width:100%;border-collapse:collapse}
.hours td{padding:.7rem 0;border-bottom:1px solid var(--line);font-size:15px}
.hours td:last-child{text-align:right;color:var(--ochre)}
.hours tr.today td{color:var(--cream-bright)}
.hours tr.today td:last-child{color:var(--ochre)}

/* ---------- full-bleed slider (gallery) ---------- */
.sig{position:relative;overflow:hidden;background:var(--green-3)}
.sig__track{display:flex;transition:transform .8s var(--ease)}
.sig__slide{min-width:100%;position:relative}
.sig__cap{position:absolute;left:0;bottom:0;right:0;z-index:3;padding:clamp(20px,3vw,42px);color:#fff;
  background:linear-gradient(0deg,rgba(20,29,29,.82),transparent)}
.sig-t{font-family:var(--serif);font-weight:300;font-size:clamp(23px,3vw,34px);color:#fff;margin:0}
.slider-nav{position:absolute;right:clamp(16px,2vw,28px);top:clamp(16px,2vw,28px);z-index:4;display:flex;gap:.5rem}
.slider-nav button,.notes-nav button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,252,243,.4);
  background:rgba(20,29,29,.3);color:#fff;cursor:pointer;display:grid;place-items:center;font-size:22px;line-height:1;
  transition:background .3s,color .3s,border-color .3s}
.slider-nav button:hover{background:var(--ochre);color:var(--ink);border-color:var(--ochre)}
.dot{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,252,243,.4);cursor:pointer;padding:0;transition:background .3s,transform .3s}
.dot.on{background:var(--ochre);transform:scale(1.25)}

/* ---------- cookie banner ---------- */
.cookie{position:fixed;left:50%;bottom:20px;transform:translate(-50%,170%);z-index:90;width:min(700px,calc(100% - 32px));
  background:var(--ink);color:var(--cream);border:1px solid var(--line);padding:22px 24px;
  box-shadow:0 18px 50px rgba(0,0,0,.4);transition:transform .6s var(--ease)}
.cookie.show{transform:translateX(-50%)}
.cookie p{color:rgba(216,203,184,.9);font-size:14px;line-height:1.5}
.cookie a{color:var(--ochre);text-decoration:underline;text-underline-offset:2px}
.cookie-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:15px}
.cookie .btn{font-size:14px;padding:11px 22px}
.cookie .btn.link{background:none;border:0;color:rgba(216,203,184,.7);padding:11px 8px;font-style:normal;font-family:var(--sans)}

/* ---------- legal / prose ---------- */
.legal{padding-top:clamp(120px,15vw,180px)}
.legal .lead{max-width:60ch}
.prose{max-width:72ch;margin-top:clamp(28px,4vw,48px)}
.prose h2{font-size:clamp(24px,3vw,34px);margin-top:2.6rem;margin-bottom:.8rem}
.prose h3{font-size:clamp(19px,2vw,23px);color:var(--cream-bright);margin-top:1.8rem;margin-bottom:.5rem;font-weight:400}
.prose p,.prose li{color:var(--cream);font-size:16px;line-height:1.7}
.prose ul{margin:.8rem 0 0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.5rem}
.prose li{list-style:disc}
.prose a{color:var(--ochre);text-decoration:underline;text-underline-offset:2px}
.prose .updated{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-dim)}
.prose .table-wrap{overflow-x:auto;margin-top:1.1rem;-webkit-overflow-scrolling:touch}
.prose table{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
.prose th,.prose td{text-align:left;vertical-align:top;padding:.7rem .8rem;border-bottom:1px solid var(--line);color:var(--cream);line-height:1.5}
.prose thead th{color:var(--cream-bright);font-weight:600;letter-spacing:.02em;border-bottom-color:var(--line-2);white-space:nowrap}
.prose tbody td:first-child{color:var(--cream-bright)}

/* ---------- 404 ---------- */
.nf{min-height:72svh;display:grid;place-items:center;text-align:center;padding-top:clamp(120px,15vw,180px)}
.nf .big404{font-family:var(--serif);font-weight:300;font-size:clamp(90px,24vw,260px);line-height:.9;color:var(--ochre)}

/* ---------- misc ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{border:1px solid var(--line-2);padding:7px 15px;font-size:13px;color:var(--cream);letter-spacing:.04em}
hr.rule{border:0;height:1px;background:var(--line);margin:0}
.anchor{scroll-margin-top:100px}