:root{

  --paper:#FAF9F4;
  --paper-2:#F3F1E7;
  --card:#FFFFFF;
  --ink:#17190F;
  --ink-2:#565A46;
  --ink-3:#8B8E77;
  --olive:#4C5536;
  --olive-2:#333A22;
  --olive-3:#242A16;
  --olive-pale:#EAEEDC;
  --gold:#A97C25;
  --gold-2:#8A6520;
  --gold-3:#D9AC46;
  --gold-pale:#F6EEDB;
  --line:rgba(60,66,40,.12);
  --line-2:rgba(60,66,40,.24);
  --on-dark:#F6F4EA;
  --on-dark-2:rgba(246,244,234,.74);
  --on-dark-3:rgba(246,244,234,.42);

  --sh-1:0 1px 2px rgba(45,50,25,.045), 0 10px 26px -18px rgba(45,50,25,.22);
  --sh-2:0 2px 4px rgba(45,50,25,.04), 0 22px 48px -26px rgba(45,50,25,.34);
  --sh-3:0 34px 70px -34px rgba(30,34,16,.46);

  --f-body:'IBM Plex Sans Arabic', system-ui, 'Segoe UI', Tahoma, sans-serif;
  --f-disp:'Amiri', 'IBM Plex Sans Arabic', Georgia, serif;
  --f-sign:var(--f-body);

  --t-hero:    clamp(1.95rem, 1.18rem + 3.35vw, 4.1rem);
  --t-h2:      clamp(1.6rem, 1.34rem + 1.15vw, 2.4rem);
  --t-h3:      clamp(1.1rem, 1.05rem + .24vw, 1.3rem);
  --t-state:   clamp(1.2rem, 1.02rem + .82vw, 1.72rem);
  --t-quote:   clamp(1.2rem, 1.02rem + .96vw, 1.86rem);
  --t-lead:    clamp(1.05rem, 1.01rem + .26vw, 1.18rem);
  --t-body:    clamp(1.05rem, 1.02rem + .16vw, 1.08rem);
  --t-cap:     clamp(.95rem, .93rem + .12vw, 1rem);
  --t-mini:    clamp(.86rem, .845rem + .07vw, .9rem);
  --t-eyebrow: clamp(.82rem, .8rem + .1vw, .88rem);
  --t-num-xl:  clamp(2.5rem, 1.6rem + 3.6vw, 4.4rem);
  --t-num-lg:  clamp(1.9rem, 1.4rem + 2.1vw, 2.9rem);
  --t-ord:     clamp(2.1rem, 1.5rem + 2.4vw, 3.2rem);

  --lh-body:1.92; --lh-lead:1.88; --lh-h:1.7;

  --sp-1:.5rem; --sp-2:.75rem; --sp-3:1rem; --sp-4:1.4rem; --sp-5:1.9rem;

  --sec-y:  clamp(2.2rem, 4.8vw, 3.6rem);
  --head-y: clamp(1.2rem, 2.6vw, 2rem);
  --gap:    clamp(1rem, 2.2vw, 1.8rem);
  --gutter: clamp(1.15rem, 3.6vw, 3rem);
  --container:1180px;
  --hdr-h:  clamp(62px, 6.6vw, 80px);

  --ease:cubic-bezier(.22,.72,.16,1);
  --spring:cubic-bezier(.22,1.16,.36,1);
  --dur:620ms;
  --r-s:10px; --r-m:16px; --r-l:22px; --r-xl:28px;

  color-scheme: light;
  font-size:16px;
}

*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:clip;
  scroll-padding-top:calc(var(--hdr-h) + 1rem); accent-color:var(--olive);
}
body{
  margin:0; color:var(--ink); font-family:var(--f-body); font-size:var(--t-body);
  line-height:var(--lh-body); letter-spacing:0; text-wrap:pretty; overflow-x:clip;
  -webkit-tap-highlight-color:transparent;
  background-color:var(--paper);
  background-image:radial-gradient(rgba(76,85,54,.05) 1px, transparent 1.1px);
  background-size:24px 24px;
  background-attachment:fixed;
}
img,svg,video{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,p,figure,blockquote,dl,dd,ol,ul{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:inherit}
b,strong{font-weight:600}
::selection{background:var(--gold-pale)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
svg[viewBox]{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}

.wrap{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.skip{position:fixed;top:-100px;inset-inline-start:1rem;z-index:300;background:var(--olive);color:var(--on-dark);padding:.8rem 1.2rem;border-radius:var(--r-s);font-weight:600}
.skip:focus{top:1rem}

html.js .rv{opacity:0;transform:translateY(24px)}
html.js .rv.is-in{
  opacity:1;transform:none;
  transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
  transition-delay:calc(var(--i,0) * 70ms);
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.92rem 1.7rem;border:1.5px solid transparent;border-radius:100px;
  font-weight:600;font-size:var(--t-cap);line-height:1.4;position:relative;overflow:hidden;
  transition:transform .3s var(--spring), background-color .28s var(--ease),
             border-color .28s var(--ease), color .28s var(--ease), box-shadow .28s var(--ease);
}
.btn svg{width:18px;height:18px;flex:none}
.btn::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(100deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease);
}

.btn:active{transform:scale(.975)}
.btn-solid{background:var(--olive);color:var(--on-dark);border-color:var(--olive);box-shadow:var(--sh-1)}

.btn-line{border-color:var(--line-2);color:var(--ink);background:var(--card)}

.btn-gold{background:var(--gold);color:#1B1706;border-color:var(--gold);box-shadow:0 12px 30px -14px rgba(120,86,18,.75)}

.btn-glass{border-color:rgba(246,244,234,.46);color:var(--on-dark)}

.btn-sm{padding:.6rem 1.15rem}
.lnk{
  display:inline-flex;align-items:center;gap:.45rem;color:var(--gold-2);font-weight:600;
  font-size:var(--t-cap);border-bottom:1.5px solid var(--gold-pale);padding-bottom:3px;
  transition:border-color .25s var(--ease), gap .25s var(--ease);
}
.lnk::after{content:'←';transition:transform .3s var(--ease)}

.hdr{
  position:fixed;inset-inline:0;top:0;z-index:120;
  background:color-mix(in srgb, var(--paper) 82%, transparent);
  backdrop-filter:saturate(1.15) blur(10px);
  -webkit-backdrop-filter:saturate(1.15) blur(10px);
  border-bottom:1px solid transparent;
  transition:background-color .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.hdr.is-stuck{
  background:color-mix(in srgb, var(--paper) 95%, transparent);
  border-bottom-color:var(--line);box-shadow:0 10px 34px -30px rgba(40,45,25,1);
}
.hdr-in{
  max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);
  height:var(--hdr-h);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);
}
.brand{order:2;flex:none;display:flex;align-items:center}
.brand img{height:clamp(40px,4.8vw,56px);width:auto;transition:transform .4s var(--spring)}

.hdr-side{order:1;display:flex;align-items:center;gap:clamp(.7rem,1.8vw,1.7rem);min-width:0}
.nav{display:flex;align-items:center;gap:clamp(.7rem,1.6vw,1.6rem)}
.nav a{
  position:relative;font-size:var(--t-cap);color:var(--ink-2);padding-block:.4rem;
  white-space:nowrap;transition:color .25s var(--ease);
}
.nav a::after{
  content:'';position:absolute;inset-inline:0;bottom:0;height:1.5px;background:var(--gold);
  transform:scaleX(0);transform-origin:100% 50%;transition:transform .32s var(--ease);
}
.nav a.is-here{color:var(--ink)}
.nav a.is-here::after{transform:scaleX(1)}
.nav .nav-cta{display:none}
.hdr-progress{position:absolute;inset-inline:0;bottom:-1px;height:2px;background:linear-gradient(to left,var(--gold),var(--gold-3));transform:scaleX(0);transform-origin:100% 50%}
.burger{display:none;width:44px;height:40px;flex-direction:column;justify-content:center;gap:5px;padding:0 9px}
.burger span{display:block;width:100%;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .2s,width .3s}
.burger span:nth-child(3){width:62%}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(-45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){width:100%;transform:translateY(-7px) rotate(45deg)}

.sec{padding-block:var(--sec-y)}
.sec + .sec{padding-top:calc(var(--sec-y) * .4)}
.sec + .band,.band + .sec{padding-top:calc(var(--sec-y) * .6)}
.eyebrow{
  font-size:var(--t-eyebrow);color:var(--gold-2);font-weight:600;
  display:inline-flex;align-items:center;gap:.55rem;line-height:1.7;
}
.eyebrow::before{content:'';width:22px;height:1.5px;background:var(--gold);flex:none}
.head{margin-bottom:var(--head-y);max-width:60ch}
.head.center{margin-inline:auto;text-align:center}
.head.center .eyebrow{justify-content:center}
.head h2{
  font-family:var(--f-disp);font-weight:700;font-size:var(--t-h2);line-height:var(--lh-h);
  margin-top:.5rem;text-wrap:balance;color:var(--olive-2);
}
.head .lead{margin-top:.6rem;color:var(--ink-2);font-size:var(--t-lead);line-height:var(--lh-lead)}

.hero{position:relative;isolation:isolate;padding-block:calc(var(--hdr-h) + var(--sec-y)) var(--sec-y);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:-3;overflow:hidden}
.hero-bg picture{display:block;width:100%;height:100%}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 58%}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(to left,
      color-mix(in srgb, var(--paper) 58%, transparent) 0%,
      color-mix(in srgb, var(--paper) 34%, transparent) 44%,
      transparent 78%),
    linear-gradient(to bottom,
      color-mix(in srgb, var(--paper) 38%, transparent) 0%,
      color-mix(in srgb, var(--paper) 50%, transparent) 46%,
      color-mix(in srgb, var(--paper) 82%, transparent) 84%,
      var(--paper) 100%);
}
.hero-glow{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero-glow::before,.hero-glow::after{content:'';position:absolute;border-radius:50%;filter:blur(70px)}
.hero-glow::before{inset-inline-end:-8%;top:-14%;width:46vw;height:46vw;background:radial-gradient(circle, rgba(217,172,70,.24), transparent 68%)}
.hero-glow::after{inset-inline-start:-10%;bottom:-22%;width:52vw;height:52vw;background:radial-gradient(circle, rgba(76,85,54,.18), transparent 68%)}
.hero-grid{
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(2rem,5vw,4.5rem);align-items:center;
}
html.js .hero-stage{animation:heroUp .95s var(--ease) both}
html.js .hero-copy > *{animation:heroAct .55s var(--ease) both}
html.js .hero-copy > *:nth-child(1){animation-delay:.06s}
html.js .hero-copy > *:nth-child(2){animation-delay:.15s}
html.js .hero-copy > *:nth-child(3){animation-delay:.24s}
html.js .hero-copy > *:nth-child(4){animation-delay:.33s}
html.js .hero-copy > *:nth-child(5){animation-delay:.42s}
html.js .hero-stage{animation-delay:.2s}
@keyframes heroUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

@keyframes heroAct{from{opacity:1;transform:translateY(12px)}to{opacity:1;transform:none}}

.chip{
  display:inline-flex;align-items:center;gap:.55rem;background:var(--card);
  border:1px solid var(--line);border-radius:100px;padding:.42rem 1rem .42rem .8rem;
  font-size:var(--t-mini);color:var(--ink-2);box-shadow:var(--sh-1);line-height:1.8;
}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:none;position:relative}
.chip i::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--gold);opacity:.5;animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{transform:scale(.7);opacity:.6}70%,100%{transform:scale(1.5);opacity:0}}
.chip b{color:var(--ink);font-weight:600}

h1{
  margin-top:var(--sp-4);font-family:var(--f-disp);font-weight:700;font-size:var(--t-hero);
  line-height:var(--lh-h);text-wrap:balance;color:var(--olive-2);position:relative;
}
.h1-top{
  display:block;font-family:var(--f-body);font-weight:600;color:var(--ink-2);
  font-size:var(--t-lead);line-height:1.8;margin-bottom:.25rem;
}
.h1-mark{position:relative;display:inline-block}
.h1-mark svg{
  position:absolute;inset-inline:-.1em;bottom:-.16em;width:calc(100% + .2em);height:.34em;
  color:var(--gold-3);stroke-width:6;overflow:visible;
}
.h1-mark path{stroke-dasharray:1;stroke-dashoffset:1;pathLength:1}
html.js .h1-mark path{animation:draw 1.1s .8s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.hero-p{margin-top:var(--sp-4);max-width:48ch;color:var(--ink-2);font-size:var(--t-lead);line-height:var(--lh-lead)}
.hero-act{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:var(--sp-5)}
.hero-trust{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem clamp(1rem,2.6vw,2.2rem);
  margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:1px solid var(--line);
  font-size:var(--t-mini);color:var(--ink-3);
}
.hero-trust span{display:inline-flex;align-items:center;gap:.4rem}
.hero-trust b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.stars{display:inline-flex;gap:1px;color:var(--gold-3)}
.stars svg{width:14px;height:14px;fill:currentColor;stroke:none}

.hero-stage{position:relative;aspect-ratio:1/1.02;width:min(30rem,100%);margin-inline:auto}
.stage-plate{
  position:absolute;inset-inline:5%;top:11%;aspect-ratio:1/1;border-radius:50%;
  background:linear-gradient(152deg, var(--olive) 0%, var(--olive-3) 76%);
  box-shadow:var(--sh-3);overflow:hidden;
}
.stage-plate::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(rgba(246,244,234,.09) 1px, transparent 1.1px);
  background-size:18px 18px;
}
.stage-plate::after{
  content:'';position:absolute;inset-inline-start:-30%;top:-40%;width:80%;height:110%;
  background:radial-gradient(circle, rgba(217,172,70,.3), transparent 66%);
}
.stage-phone{
  position:absolute;inset-inline:0;top:0;margin-inline:auto;height:100%;width:auto;
  filter:drop-shadow(0 9px 17px rgba(24,28,12,.42));z-index:3;
}
.stage-paper{
  position:absolute;width:34%;border-radius:8px;overflow:hidden;background:#fff;
  border:1px solid rgba(255,255,255,.7);box-shadow:var(--sh-3);z-index:2;
}
.stage-paper img{width:100%;aspect-ratio:3/3.6;object-fit:cover;object-position:top center}
.stage-paper.p1{inset-inline-end:-6%;top:10%;rotate:-8deg}
.stage-paper.p2{inset-inline-start:-7%;bottom:2%;rotate:9deg;z-index:4}
.stage-badge{
  position:absolute;z-index:5;display:inline-flex;align-items:center;gap:.42rem;
  background:var(--card);border:1px solid var(--line);border-radius:100px;
  padding:.42rem .85rem;font-size:var(--t-mini);font-weight:600;color:var(--ink);
  box-shadow:var(--sh-2);white-space:nowrap;line-height:1.7;
}
.stage-badge svg{width:15px;height:15px;color:var(--olive);flex:none}
.stage-badge.b1{inset-inline-end:2%;top:4%}
.stage-badge.b2{inset-inline-start:0;top:44%}
.stage-badge.b3{inset-inline-end:6%;bottom:2%}
html.js .stage-paper,html.js .stage-badge,html.js .stage-phone{animation:float 7s var(--ease) infinite alternate}
html.js .stage-paper.p2{animation-delay:-2.4s}
html.js .stage-badge.b1{animation-delay:-1.2s}
html.js .stage-badge.b2{animation-delay:-3.6s}
html.js .stage-badge.b3{animation-delay:-4.8s}
html.js .stage-phone{animation-duration:9s}
@keyframes float{from{translate:0 -6px}to{translate:0 6px}}

.word-sec{padding-block:calc(var(--sec-y) * .95)}
.word{position:relative;max-width:44rem;margin-inline:auto;text-align:center}

.orn{position:relative;display:block;width:min(230px,68%);height:10px;margin-inline:auto}
.orn::before{
  content:'';position:absolute;inset-inline:0;top:50%;height:1px;translate:0 -50%;
  background:linear-gradient(to left, transparent, var(--line-2) 24%, var(--line-2) 76%, transparent);
}
.orn::after{
  content:'';position:absolute;left:50%;top:50%;width:8px;height:8px;
  translate:-50% -50%;rotate:45deg;background:var(--gold);
  box-shadow:0 0 0 6px var(--paper);
}
.orn-b{margin-top:clamp(1rem,2.2vw,1.5rem)}
.word .eyebrow{justify-content:center;margin-block:clamp(1.1rem,2.4vw,1.6rem) clamp(1.1rem,2.6vw,1.7rem)}
.word blockquote{
  font-family:var(--f-disp);font-size:var(--t-quote);line-height:2.05;
  max-width:46ch;margin-inline:auto;color:var(--olive-2);text-align:start;
}
.word blockquote .qline{display:block}
html.js .word blockquote .qline-in{display:inline-block;max-width:0;overflow:hidden;white-space:nowrap;vertical-align:top}
.word figcaption{display:flex;flex-direction:column;align-items:center;gap:.2rem;margin-top:clamp(1.5rem,3.4vw,2.4rem)}
.sign-line{position:relative;display:inline-flex;align-items:center;gap:.6rem}
.sign{font-family:var(--f-sign);font-weight:700;font-size:var(--t-quote);line-height:2;color:var(--olive);white-space:nowrap}
.sign-wrap{display:inline-block;overflow:hidden;vertical-align:bottom;max-width:100%;white-space:nowrap}
html.js .sign-wrap{max-width:0}
.pen{width:20px;height:20px;color:var(--gold);flex:none}
html.js .pen{opacity:0;transform:translateY(-6px) rotate(-18deg);transition:opacity .45s var(--ease), transform .45s var(--spring)}

.figures{
  position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-xl);
  color:var(--on-dark);box-shadow:var(--sh-3);
  padding:clamp(1.8rem,3.6vw,2.8rem) clamp(1.1rem,3vw,2.4rem);
}
.fig-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.22);will-change:transform}
.figures::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(120% 90% at 84% 8%, rgba(217,172,70,.22), transparent 58%),
    linear-gradient(155deg, rgba(38,44,23,.8) 0%, rgba(18,22,11,.9) 78%);
}
.figures::after{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(246,244,234,.07) 1px, transparent 1.1px);
  background-size:20px 20px;
}
.fig-head{position:relative;text-align:center;margin-bottom:clamp(1.2rem,2.6vw,1.9rem)}
.fig-head .eyebrow{color:var(--gold-3);justify-content:center}
.fig-head .eyebrow::before{background:var(--gold-3)}
.fig-head h2{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h2);line-height:var(--lh-h);margin-top:.5rem;text-wrap:balance}
.fig-grid{
  position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;border-top:1px solid rgba(246,244,234,.16);
}
.fig{
  display:flex;flex-direction:column;align-items:center;gap:.2rem;text-align:center;
  padding:clamp(1rem,2.4vw,1.7rem) .6rem;border-inline-start:1px solid rgba(246,244,234,.16);
  transition:background-color .35s var(--ease);
}
.fig:first-child{border-inline-start:0}

.fig b{
  font-family:var(--f-disp);font-weight:700;color:var(--gold-3);line-height:1.25;
  font-size:var(--t-num-lg);font-variant-numeric:tabular-nums;direction:ltr;
}
.fig:first-child b{font-size:var(--t-num-xl)}
.fig span{font-size:var(--t-cap);color:var(--on-dark-2);line-height:1.7}
.fig-bar{width:0;height:2px;background:var(--gold-3);border-radius:2px;margin-top:.5rem;transition:width .9s .25s var(--ease)}
.fig.is-in .fig-bar{width:34%}
.fig-foot{
  position:relative;margin-top:clamp(1rem,2.2vw,1.5rem);padding-top:var(--sp-3);
  border-top:1px solid rgba(246,244,234,.16);display:flex;flex-wrap:wrap;
  align-items:center;justify-content:center;gap:.6rem clamp(1rem,2.4vw,2rem);text-align:center;
}
.fig-foot p{font-size:var(--t-cap);color:var(--on-dark-2);line-height:1.8}
.fig-foot .lnk{color:var(--gold-3);border-bottom-color:rgba(217,172,70,.35)}

.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,20rem);gap:clamp(1.6rem,4vw,3.6rem);align-items:start}
.rail{
  --rail-pad:clamp(2.7rem,5vw,3.6rem);
  --rail-x:clamp(.9rem,1.7vw,1.2rem);
  position:relative;padding-inline-start:var(--rail-pad);
}
.rail::before{
  content:'';position:absolute;inset-inline-start:var(--rail-x);
  top:.7rem;bottom:2.2rem;width:2px;background:var(--line);border-radius:2px;
}
.rail-fill{
  position:absolute;inset-inline-start:var(--rail-x);top:.7rem;width:2px;
  background:linear-gradient(to bottom,var(--gold-3),var(--gold));border-radius:2px;
  height:0;transition:height .18s linear;
}
.beat{position:relative;padding-bottom:clamp(1.8rem,4vw,3rem)}
.beat:last-child{padding-bottom:0}
.beat-dot{
  position:absolute;inset-inline-start:calc(var(--rail-x) - var(--rail-pad) - 8px);top:.42rem;
  width:18px;height:18px;border-radius:50%;background:var(--paper);
  border:2px solid var(--line-2);z-index:2;
  transition:border-color .4s var(--ease), transform .5s var(--spring), background-color .4s;
}
.beat-dot::after{
  content:'';position:absolute;inset:3px;border-radius:50%;background:var(--gold);
  transform:scale(0);transition:transform .45s var(--spring);
}
.beat.is-on .beat-dot{border-color:var(--gold);transform:scale(1.14)}
.beat.is-on .beat-dot::after{transform:scale(1)}
.beat-k{
  display:inline-flex;align-items:center;gap:.5rem;font-size:var(--t-mini);font-weight:600;
  color:var(--gold-2);background:var(--gold-pale);border-radius:100px;padding:.2rem .75rem;line-height:1.8;
}
.beat-h{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);color:var(--olive-2);margin-top:.6rem}
.beat-p{margin-top:.45rem;color:var(--ink-2);font-size:var(--t-body);line-height:var(--lh-body);max-width:56ch}
.beat-p b{color:var(--ink);font-weight:600}

.shuffle{position:relative;width:100%;max-width:40rem;padding-bottom:40%;margin-top:var(--sp-4)}
.shuffle figure{
  position:absolute;top:0;width:23%;border-radius:10px;overflow:hidden;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2);
  transition:transform .9s var(--spring), box-shadow .35s var(--ease);
}
.shuffle figure img{width:100%;aspect-ratio:3/3.9;object-fit:cover;object-position:top center}
.shuffle figcaption{
  position:absolute;inset-inline:0;bottom:0;text-align:center;font-weight:600;
  font-size:var(--t-mini);color:#4C5536;line-height:1.7;padding:1.4rem .3rem .45rem;
  background:linear-gradient(to top, rgb(255 252 244) 42%, transparent);
}
.shuffle figure:nth-child(1){inset-inline-start:0;transform:translate(7%,16px) rotate(-11deg)}
.shuffle figure:nth-child(2){inset-inline-start:25.6%;transform:translate(-12%,36px) rotate(9deg)}
.shuffle figure:nth-child(3){inset-inline-start:51.3%;transform:translate(9%,5px) rotate(-6deg)}
.shuffle figure:nth-child(4){inset-inline-start:77%;transform:translate(-7%,30px) rotate(13deg)}
.shuffle.is-tidy figure{transform:none}

.shuffle-cap{position:relative;height:1.9em;margin-top:.35rem;max-width:38rem}
.shuffle-cap span{
  position:absolute;inset-inline-start:0;top:0;font-size:var(--t-mini);line-height:1.9;
  transition:opacity .5s var(--ease), transform .5s var(--ease);
}
.shuffle-cap .was{color:var(--ink-3)}
.shuffle-cap .now{color:var(--gold-2);font-weight:600;opacity:0;transform:translateY(6px)}
.shuffle.is-tidy + .shuffle-cap .was{opacity:0;transform:translateY(-6px)}
.shuffle.is-tidy + .shuffle-cap .now{opacity:1;transform:none}

.story-aside{display:grid;gap:var(--sp-3);position:sticky;top:calc(var(--hdr-h) + 1.4rem)}
.acard{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  padding:clamp(1rem,2.1vw,1.4rem);position:relative;overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .3s;
}
.acard::before{content:'';position:absolute;inset-block:0;inset-inline-start:0;width:3px;background:var(--gold);transform:scaleY(0);transform-origin:50% 0;transition:transform .5s var(--ease)}

.acard.is-in::before{transform:scaleY(1)}
.acard h3{font-size:var(--t-eyebrow);color:var(--gold-2);font-weight:600;margin-bottom:.35rem}
.acard p{color:var(--ink-2);font-size:var(--t-cap);line-height:var(--lh-body)}

.story-grid > .rail{grid-area:1 / 1}
.story-grid > .story-close{grid-area:2 / 1}
.story-grid > .story-aside{grid-area:1 / 2}
.story-close{
  margin-top:clamp(1.8rem,4vw,3rem);text-align:center;max-width:44rem;margin-inline:auto;
}
.story-close .orn{margin-bottom:clamp(1rem,2.4vw,1.6rem)}

.sc-lead{color:var(--ink-2);font-size:var(--t-body);line-height:var(--lh-body)}
.sc-q{
  margin-top:.45rem;font-family:var(--f-disp);font-weight:700;
  font-size:var(--t-h2);line-height:var(--lh-h);color:var(--olive-2);text-wrap:balance;
}

.compass{border-top:1px solid var(--line)}
.cpx{
  display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);
  gap:clamp(.8rem,2.6vw,2.6rem);align-items:start;position:relative;
  padding:clamp(1.4rem,3.2vw,2.4rem) clamp(.4rem,1.4vw,1rem);
  border-bottom:1px solid var(--line);
  transition:background-color .4s var(--ease);
}

.cpx::before{
  content:'';position:absolute;inset-inline:0;top:-1px;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:100% 50%;transition:transform .8s var(--ease);
}
.cpx.is-in::before{transform:scaleX(1)}
.cpx-side{display:flex;align-items:center;gap:clamp(.7rem,1.6vw,1rem)}
.cpx-n{
  order:2;margin-inline-start:auto;
  font-family:var(--f-disp);font-weight:700;font-size:var(--t-ord);line-height:1.05;
  color:transparent;-webkit-text-stroke:2px var(--gold);flex:none;
  direction:ltr;font-variant-numeric:tabular-nums;
  transition:color .45s var(--ease), -webkit-text-stroke-color .45s var(--ease);
}
.cpx.is-in .cpx-n{color:rgba(169,124,37,.1)}

.cpx-t{display:flex;align-items:center;gap:.85rem;order:1;min-width:0}
.cpx-t h3{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);color:var(--olive-2)}
.cpx-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:clamp(46px,5.4vw,58px);height:clamp(46px,5.4vw,58px);flex:none;
  border-radius:50%;background:var(--olive-pale);color:var(--olive);
  transition:background-color .35s var(--ease), transform .6s var(--spring), opacity .5s var(--ease);
}
html.js .cpx-ico{transform:scale(.5);opacity:0}
html.js .cpx.is-in .cpx-ico{transform:none;opacity:1}

.cpx-ico svg{width:60%;height:auto;stroke-width:2.4;fill:none;overflow:visible}

.i-eye .eye{transform-origin:24px 24px;animation:eyeBlink 5.2s var(--ease) infinite}
@keyframes eyeBlink{0%,90%,100%{transform:scaleY(1)}94%{transform:scaleY(.06)}97%{transform:scaleY(1)}}
.i-eye .iris{fill:var(--gold);stroke:none}
.i-eye .pupil{fill:var(--olive-3);stroke:none}
.i-eye .iris,.i-eye .pupil{animation:eyeLook 6.4s var(--ease) infinite}
@keyframes eyeLook{0%,16%{transform:translateX(0)}30%,46%{transform:translateX(5.5px)}60%,76%{transform:translateX(-5.5px)}90%,100%{transform:translateX(0)}}

.i-msg .d{fill:var(--gold);stroke:none;transform-origin:center;animation:msgDot 1.5s var(--ease) infinite}
.i-msg .d2{animation-delay:.18s}
.i-msg .d3{animation-delay:.36s}
@keyframes msgDot{0%,62%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-3.4px);opacity:1}}

.i-target .dot{fill:var(--gold);stroke:none;transform-origin:24px 24px;animation:tgtHit 3.2s var(--ease) infinite}
@keyframes tgtHit{0%,64%,100%{transform:scale(1)}72%{transform:scale(1.5)}82%{transform:scale(1)}}
.i-target .ping{transform-origin:24px 24px;opacity:0;animation:tgtPing 3.2s var(--ease) infinite}
@keyframes tgtPing{0%,66%{transform:scale(.45);opacity:0}70%{opacity:.75}100%{transform:scale(2.4);opacity:0}}

.i-shield .check{stroke:var(--gold);stroke-dasharray:24;stroke-dashoffset:24;animation:shTick 3.8s var(--ease) infinite}
@keyframes shTick{0%{stroke-dashoffset:24}16%,70%{stroke-dashoffset:0}86%,100%{stroke-dashoffset:24}}
.cpx-lead{
  font-family:var(--f-disp);font-weight:700;font-size:var(--t-state);line-height:var(--lh-h);
  color:var(--olive-2);max-width:30ch;
}
.cpx-body{margin-top:.6rem;color:var(--ink-2);font-size:var(--t-body);line-height:var(--lh-body);max-width:60ch}
html.js .cpx-lead{opacity:0;transform:translateY(12px)}
html.js .cpx-body{opacity:0;transform:translateY(12px)}
html.js .cpx.is-in .cpx-lead{
  opacity:1;transform:none;
  transition:opacity .6s .14s var(--ease), transform .6s .14s var(--ease);
}
html.js .cpx.is-in .cpx-body{
  opacity:1;transform:none;
  transition:opacity .6s .28s var(--ease), transform .6s .28s var(--ease);
}
.compass-close{
  margin-top:var(--head-y);font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);
  line-height:var(--lh-h);color:var(--olive-2);text-align:center;
}
.compass-close span{color:var(--gold-2)}

.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.9rem,2vw,1.35rem)}
.bcell{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  padding:clamp(1.1rem,2.2vw,1.6rem);position:relative;overflow:hidden;
  transition:transform .34s var(--ease), box-shadow .34s var(--ease), border-color .34s;
}
.bcell::after{content:'';position:absolute;inset-inline:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:100% 50%;transition:transform .42s var(--ease)}

.bico{
  display:inline-flex;align-items:center;justify-content:center;width:2.7rem;height:2.7rem;
  border-radius:13px;background:var(--olive-pale);color:var(--olive);margin-bottom:.75rem;
  transition:transform .38s var(--spring), background-color .3s, color .3s;
}
.bico svg{width:21px;height:21px}

.bcell h3{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);margin-bottom:.3rem;color:var(--olive-2)}
.bcell p{color:var(--ink-2);font-size:var(--t-cap);line-height:var(--lh-body)}

.flow-sec{padding-bottom:calc(var(--sec-y) * .55);overflow:hidden}
.flow{position:relative}
.flow-track{
  display:flex;align-items:center;gap:clamp(1rem,2.4vw,2rem);
  overflow-x:auto;overscroll-behavior-x:contain;
  padding-block:clamp(1rem,2vw,1.6rem) clamp(.6rem,1.4vw,1rem);
  padding-inline:calc(50% - clamp(90px,9vw,118px));
  scrollbar-width:none;cursor:grab;
}
.flow-track::-webkit-scrollbar{display:none}
.flow-track.is-drag{cursor:grabbing}
.flow-track.is-drag .fslide{transition:none}
.flow-track.no-fx .fslide{transform:none!important;transition:none!important}
.fslide{
  flex:none;width:clamp(180px,19vw,236px);cursor:pointer;
  transform:scale(var(--s,.84));opacity:var(--op,.5);
  transition:transform .45s var(--ease), opacity .45s var(--ease);
  will-change:transform;
}
.fslide img{width:100%;height:auto;filter:drop-shadow(0 22px 34px rgba(45,50,25,.3))}
.fslide span{
  display:block;margin-top:.85rem;text-align:center;font-size:var(--t-cap);color:var(--ink-2);
  line-height:1.7;opacity:0;transition:opacity .4s var(--ease);
}
.fslide.on span{opacity:1}
.flow-nav{
  position:absolute;top:44%;z-index:20;width:46px;height:46px;border-radius:50%;
  background:var(--card);border:1px solid var(--line);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-1);
  transition:transform .3s var(--spring), color .25s, border-color .25s;
}
.flow-nav svg{width:20px;height:20px}

.flow-nav.prev{right:clamp(.4rem,3vw,2.4rem)}
.flow-nav.next{left:clamp(.4rem,3vw,2.4rem)}

.reasons{border-top:1px solid var(--line)}
.reasons li{
  display:grid;grid-template-columns:clamp(2.6rem,3.6vw,3.4rem) minmax(0,.86fr) minmax(0,1.14fr);
  gap:var(--gap);align-items:baseline;padding:clamp(1.1rem,2.4vw,1.7rem) .5rem;
  border-bottom:1px solid var(--line);
  transition:background-color .3s var(--ease), padding-inline-start .3s var(--ease);
}

.rs-n{font-size:var(--t-cap);color:var(--gold-2);font-weight:600;font-variant-numeric:tabular-nums;direction:ltr;text-align:start}
.reasons h3{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);color:var(--olive-2)}
.reasons p{color:var(--ink-2);max-width:56ch;font-size:var(--t-cap);line-height:var(--lh-body)}

.band{position:relative;isolation:isolate;overflow:hidden;color:var(--on-dark);padding-block:clamp(2.2rem,4.6vw,3.4rem)}
.band-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.22);will-change:transform}
.band::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom, rgba(18,21,11,.84), rgba(18,21,11,.7))}
.band .eyebrow{color:var(--gold-3)}
.band .eyebrow::before{background:var(--gold-3)}
.band-in{text-align:center;max-width:44rem;margin-inline:auto}
.band h2{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h2);line-height:var(--lh-h);margin-top:.55rem;text-wrap:balance}
.band p{margin-top:.7rem;color:var(--on-dark-2);font-size:var(--t-lead);line-height:var(--lh-lead)}
.band-act{display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;margin-top:clamp(1.3rem,2.8vw,2rem)}

.subs{display:grid;gap:clamp(.8rem,1.8vw,1.2rem)}
.sub-row{
  display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:clamp(.8rem,2vw,1.6rem);
  align-items:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  padding:clamp(1rem,2vw,1.4rem);transition:border-color .3s var(--ease), box-shadow .3s var(--ease);
}

.sub-row h3{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);display:flex;flex-direction:column;color:var(--olive-2)}
.sub-row h3 a{color:inherit;text-decoration:none}

.sub-row h3 small{font-family:var(--f-body);font-weight:400;font-size:var(--t-mini);color:var(--ink-3);line-height:1.8}
.sub-row ul{display:flex;flex-wrap:wrap;gap:.45rem}
.sub-row li{
  display:inline-flex;align-items:center;gap:.45rem;background:var(--paper);
  border:1px solid var(--line);border-radius:100px;padding:.42rem .85rem .42rem .5rem;
  font-size:var(--t-cap);line-height:1.7;
  transition:transform .25s var(--spring), border-color .25s, background-color .25s;
}

.sub-row li b{
  font-size:var(--t-mini);font-weight:600;color:var(--olive);background:var(--olive-pale);
  border-radius:100px;padding:.06rem .5rem;font-variant-numeric:tabular-nums;direction:ltr;
}
.sub-row li a{display:inline-flex;align-items:center;gap:.45rem;color:inherit;text-decoration:none}

.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.9rem,2vw,1.35rem)}
.steps li{
  position:relative;overflow:hidden;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-m);
  padding:clamp(1.1rem,2.2vw,1.6rem);
  transition:transform .32s var(--ease), box-shadow .32s var(--ease), border-color .32s;
}
.steps li::before{
  content:'';position:absolute;inset-inline:0;top:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:100% 50%;transition:transform .7s .1s var(--ease);
}
.steps li.is-in::before{transform:scaleX(1)}

.st-n{
  display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;
  border-radius:50%;background:var(--olive);color:var(--on-dark);margin-bottom:.75rem;
  font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:1;
  transition:transform .38s var(--spring), background-color .3s;
}

.steps b{display:block;font-family:var(--f-disp);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h);color:var(--olive-2);margin-bottom:.25rem}
.steps small{display:block;font-size:var(--t-cap);color:var(--ink-2);line-height:var(--lh-body)}
.start-act{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem;margin-top:clamp(1.5rem,3vw,2.4rem)}

.guard{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.4rem,3.4vw,3.4rem);align-items:start}
.guard-head{margin-bottom:0}
.guard-facts{display:grid;gap:0}
.guard-facts div{padding:var(--sp-3) .6rem;border-top:1px solid var(--line);border-radius:10px;transition:background-color .3s var(--ease)}

.guard-facts div:first-child{border-top:0}
.guard-facts dt{font-family:var(--f-disp);font-size:var(--t-h3);font-weight:700;line-height:var(--lh-h);margin-bottom:.15rem;color:var(--olive-2)}
.guard-facts dd{font-size:var(--t-cap);color:var(--ink-2);line-height:var(--lh-body)}

.faq-search{
  display:flex;align-items:center;gap:.6rem;margin-top:var(--sp-3);background:var(--card);
  border:1px solid var(--line);border-radius:100px;padding:.65rem 1.05rem;max-width:26rem;
  transition:border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.faq-search:focus-within{border-color:var(--olive);box-shadow:var(--sh-1)}
.faq-search svg{width:17px;height:17px;color:var(--ink-3);flex:none}
.faq-search input{flex:1;min-width:0;border:0;background:none;color:inherit;font:inherit;font-size:var(--t-cap);outline:none}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  display:flex;align-items:center;gap:var(--sp-3);padding:clamp(.95rem,1.9vw,1.25rem) .5rem;
  font-family:var(--f-disp);font-size:var(--t-h3);font-weight:700;line-height:var(--lh-h);color:var(--olive-2);
  cursor:pointer;list-style:none;border-radius:10px;
  transition:color .25s var(--ease), background-color .25s var(--ease), padding-inline-start .25s var(--ease);
}
.faq summary::-webkit-details-marker{display:none}

.faq summary::after{
  content:'';flex:none;margin-inline-start:auto;width:14px;height:14px;
  background:linear-gradient(var(--ink-3),var(--ink-3)) center/14px 1.8px no-repeat,
             linear-gradient(var(--ink-3),var(--ink-3)) center/1.8px 14px no-repeat;
  transition:transform .35s var(--spring);
}
.faq details[open] summary{color:var(--olive)}
.faq details[open] summary::after{transform:rotate(90deg);background-image:linear-gradient(var(--olive),var(--olive)),linear-gradient(transparent,transparent)}
.faq .ans{animation:panelIn .42s var(--ease) both}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.faq .ans p{padding:0 .5rem clamp(.9rem,1.8vw,1.35rem);color:var(--ink-2);font-size:var(--t-cap);line-height:var(--lh-body);max-width:74ch}
.faq .ans a{color:var(--gold-2);border-bottom:1px solid var(--gold-pale)}
.faq-empty{padding-block:var(--sp-3);color:var(--ink-3);font-size:var(--t-cap)}

.finale{text-align:center;max-width:52rem;margin-inline:auto}
.finale-mark{width:clamp(56px,7vw,78px);margin-inline:auto;opacity:.9}
.finale h2{font-family:var(--f-disp);font-weight:700;font-size:var(--t-h2);line-height:var(--lh-h);color:var(--olive-2);margin-top:var(--sp-3);text-wrap:balance}
.finale p{margin-top:.8rem;color:var(--ink-2);font-size:var(--t-lead);line-height:var(--lh-lead)}
.finale-act{display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;margin-top:var(--sp-5)}
.finale-note{margin-top:var(--sp-4);font-size:var(--t-mini);color:var(--ink-3);line-height:1.8}

.ft{
  position:relative;color:var(--on-dark);border-top:0;
  background:linear-gradient(158deg, var(--olive) 0%, var(--olive-3) 82%);
}
.ft::before{content:'';position:absolute;inset-inline:0;top:0;height:2px;background:linear-gradient(to left, transparent, var(--gold) 26%, var(--gold-3) 62%, transparent)}
.ft-in{
  display:grid;grid-template-columns:minmax(0,1.45fr) repeat(3,minmax(0,1fr));
  gap:clamp(1.2rem,2.6vw,2.2rem);padding-block:clamp(1.8rem,3.4vw,2.6rem) clamp(1.2rem,2.4vw,1.8rem);
}
.ft-brand img{height:clamp(62px,7vw,86px);width:auto;margin-bottom:.85rem}
.ft-brand p{font-size:var(--t-mini);color:var(--on-dark-2);line-height:1.9;max-width:34ch}
.ft-social{display:flex;gap:.45rem;margin-top:var(--sp-3)}
.ft-social a{
  display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:50%;border:1px solid rgba(217,172,70,.42);background:rgba(217,172,70,.1);
  color:var(--gold-3);
  transition:transform .3s var(--spring), color .25s, border-color .25s, background-color .25s;
}
.ft-social a svg{width:17px;height:17px}

.ft-col h3{font-size:var(--t-mini);color:var(--gold-3);font-weight:700;margin-bottom:.5rem;line-height:1.9}
.ft-col a{display:block;padding-block:.24rem;font-size:var(--t-mini);color:var(--on-dark-2);line-height:1.85;transition:color .25s var(--ease), transform .25s var(--ease)}

.ft-end{
  padding-block:var(--sp-2) var(--sp-4);border-top:1px solid rgba(246,244,234,.14);
  font-size:var(--t-mini);color:var(--on-dark-3);line-height:1.9;
}

@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr;gap:clamp(2rem,6vw,3rem)}
  .hero-stage{max-width:min(26rem,84%)}
  .story-grid{grid-template-columns:1fr}

  .story-grid > .rail,
  .story-grid > .story-close,
  .story-grid > .story-aside{grid-area:auto}
  .story-aside{position:static;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
  .guard{grid-template-columns:1fr}
  .ft-in{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ft-brand{grid-column:1 / -1}
}

@media (max-width:960px){
  .fig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fig:nth-child(4){border-inline-start:0}
  .fig:nth-child(n+4){border-block-start:1px solid rgba(246,244,234,.16)}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:1fr}

  .compass{border-top:0;display:grid;gap:clamp(.9rem,2.4vw,1.3rem)}
  .cpx{
    grid-template-columns:1fr;gap:clamp(.8rem,2.6vw,1.1rem);
    background:var(--card);border:1px solid var(--line);border-bottom:1px solid var(--line);
    border-radius:var(--r-l);box-shadow:var(--sh-1);
    padding:clamp(1.3rem,4.4vw,1.9rem);
  }
  .cpx:hover{background:var(--card)}
  .cpx::before{display:none}
  .cpx-n{-webkit-text-stroke-width:2.5px}
  .cpx-lead{max-width:none}
}

@media (max-width:860px){
  .nav{
    position:fixed;inset:var(--hdr-h) 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);
    padding-block:var(--sp-2) var(--sp-4);padding-inline:var(--gutter);
    transform:translateY(-12px);opacity:0;pointer-events:none;
    transition:opacity .3s var(--ease),transform .3s var(--ease);
    max-height:calc(100dvh - var(--hdr-h));overflow:auto;box-shadow:0 22px 44px -32px rgba(40,45,25,1);
  }
  .nav.is-open{opacity:1;transform:none;pointer-events:auto}
  .nav a{padding-block:.9rem;font-size:var(--t-body);border-bottom:1px solid var(--line);color:var(--ink)}
  .nav a::after{display:none}
  .nav .nav-cta{display:inline-flex;margin-top:1rem;border-bottom:0;color:var(--on-dark);justify-content:center}
  .burger{display:flex;order:-1}
  .hdr-cta{display:none}
  .hdr-side{flex:1;gap:.5rem;justify-content:flex-start}
  .reasons li{grid-template-columns:2.4rem minmax(0,1fr);gap:.2rem var(--sp-3)}
  .reasons p{grid-column:2 / -1}
  .sub-row{grid-template-columns:1fr;gap:.6rem}
  .story-aside{grid-template-columns:1fr}
}

@media (max-width:640px){
  .fig-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fig{border-inline-start:0}
  .fig:nth-child(2n){border-inline-start:1px solid rgba(246,244,234,.16)}
  .fig:nth-child(n+3){border-block-start:1px solid rgba(246,244,234,.16)}
  .fig:first-child{grid-column:1 / -1;border-block-start:0}
  .bento{grid-template-columns:1fr}
  .ft-in{grid-template-columns:1fr}
  .hero-act .btn,.finale-act .btn,.band-act .btn{flex:1 1 12rem}
  .flow-nav{width:38px;height:38px}

}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .rv{opacity:1;transform:none;transition:none}
  html.js .sign-wrap{max-width:none!important}
  html.js .word blockquote .qline-in{max-width:none!important;white-space:normal!important}
  html.js .pen{opacity:1;transform:none}
  html.js .hero-copy > *,html.js .hero-stage{opacity:1}
  .shuffle figure{transform:none!important}
  *{animation:none!important;transition:none!important}
}

@media print{
  .hdr,.flow-nav,.faq-search,.to-top,.hero-stage,.band-bg{display:none!important}
  body{background:#fff}
  .sec{padding-block:1rem}
}

[data-u~="abs"]{position:absolute}
[data-u~="centerpage"]{min-height:100dvh;display:grid;place-items:center}
[data-u~="centerrow"]{justify-content:center;margin-top:1rem}
[data-u~="gold"]{color:var(--gold-2)}
[data-u~="panel"]{background:var(--bg);color:var(--text)}
[data-u~="chipflat"]{background:var(--sunken);border-color:var(--outline);color:var(--text-2)}
[data-u~="ink"]{color:var(--text)}
[data-u~="ink2"]{color:var(--text-2)}
[data-u~="mt2"]{margin-top:2px}
[data-u~="mt6"]{margin-top:6px}
[data-u~="pt16"]{padding-top:16px}
[data-u~="wfull"]{width:100%}
[data-u~="flex"]{display:flex}
[data-u~="noscript"]{padding:24px;text-align:center;font-family:Tahoma,sans-serif}

.ad-slot { text-align: center; margin: 20px 0 8px; }
.ad-slot.flush { padding-top: 0; padding-bottom: 24px; margin: 0; }
.ad-aside { max-width: 480px; margin: 6px auto 42px; padding: 0 20px; text-align: center; }
.ad-aside.wide { max-width: 760px; margin: 24px auto 8px; padding: 0; }
.ad-note { font-size: 10px; font-weight: 700; opacity: .45; margin-bottom: 6px; }
ins.adsbygoogle { display: block; }

.ad-slot, .ad-aside, .read-ad { display: none; }
html.ads-on .ad-slot, html.ads-on .ad-aside { display: block; }
html.ads-on .read-ad { display: block; }
html.ads-on .read-ad[hidden] { display: none; }

ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; }

@media (hover:hover){
.btn:hover::after{transform:translateX(120%)}
.btn-solid:hover{background:var(--olive-2);border-color:var(--olive-2);transform:translateY(-3px);box-shadow:var(--sh-2)}
.btn-line:hover{border-color:var(--olive);color:var(--olive);transform:translateY(-3px);box-shadow:var(--sh-1)}
.btn-gold:hover{background:#BE8C2B;border-color:#BE8C2B;transform:translateY(-3px)}
.btn-glass:hover{background:rgba(246,244,234,.14);border-color:var(--on-dark);transform:translateY(-3px)}
.lnk:hover{border-bottom-color:var(--gold)}
.lnk:hover::after{transform:translateX(-5px)}
.brand:hover img{transform:translateY(-2px) scale(1.03)}
.nav a:hover{color:var(--ink)}
.nav a:hover::after{transform:scaleX(1)}
.fig:hover{background:rgba(246,244,234,.06)}
.fig-foot .lnk:hover{border-bottom-color:var(--gold-3)}
.shuffle.is-tidy figure:hover{transform:translateY(-6px);box-shadow:var(--sh-3)}
.acard:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.acard:hover::before{transform:scaleY(1)}
.cpx:hover{background:var(--card)}
.cpx:hover .cpx-n{color:rgba(169,124,37,.22)}
.cpx:hover .cpx-ico{background:var(--gold-pale);color:var(--gold-2);transform:translateY(-2px)}
.bcell:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.bcell:hover::after{transform:scaleX(1)}
.bcell:hover .bico{transform:translateY(-2px) rotate(-7deg);background:var(--gold-pale);color:var(--gold-2)}
.flow-nav:hover{color:var(--olive);border-color:var(--line-2);transform:scale(1.08)}
.reasons li:hover{background:var(--card);padding-inline-start:1.1rem}
.sub-row:hover{border-color:var(--line-2);box-shadow:var(--sh-1)}
.sub-row h3 a:hover{text-decoration:underline}
.sub-row li:hover{transform:translateY(-2px);border-color:var(--gold);background:var(--gold-pale)}
.steps li:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.steps li:hover .st-n{transform:translateY(-2px) scale(1.05);background:var(--olive-2)}
.guard-facts div:hover{background:var(--card)}
.faq summary:hover{color:var(--gold-2);background:var(--card);padding-inline-start:1rem}
.ft-social a:hover{transform:translateY(-3px);color:#1B1706;border-color:var(--gold-3);background:var(--gold-3)}
.ft-col a:hover{color:var(--on-dark);transform:translateX(-4px)}
}
