/* ═══════════════════════════════════════════════════════════════
   KARAZ — shared design system
   Knowledge for AI-Driven Resilient Agro-Zones
   An Agricom system · Huggin Munin Limited
   Palette derived from the KARAZ mark: burgundy fruit, pine leaf,
   navy circuit plate, amber node.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --burgundy:#7C0620; --burgundy-2:#A31232; --rose:#E0576F;
  --navy:#0E314F; --navy-2:#071A2B; --pine:#1B5A43; --amber:#F0A32E;
  --paper:#FBFAF8; --paper-2:#F2F0EC; --line:#E4E0D9;
  --ink:#14100D; --ink-60:rgba(20,16,13,.62); --ink-40:rgba(20,16,13,.40);
  --ink-12:rgba(20,16,13,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{background:var(--paper);color:var(--ink);font-family:Inter,system-ui,-apple-system,sans-serif;
  font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ── type scale ── */
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase}
.serif{font-family:'Inter Tight',Inter,sans-serif;font-weight:800;letter-spacing:-.042em;line-height:1.0}
.serif em{font-style:italic;font-weight:800}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(22px,4vw,56px)}
section{padding:clamp(76px,9vw,132px) 0}
.h1{font-size:clamp(2.5rem,5.8vw,5rem)}
.h2{font-size:clamp(2rem,4.2vw,3.5rem)}
.h3{font-size:clamp(1.25rem,1.9vw,1.6rem);font-weight:600;letter-spacing:-.028em;line-height:1.18;
  font-family:'Inter Tight',Inter,sans-serif}
.h4{font-family:'Inter Tight',Inter,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.1rem,1.5vw,1.32rem);line-height:1.2}
.lead{font-size:clamp(1.04rem,1.28vw,1.18rem);line-height:1.64;color:var(--ink-60)}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--burgundy);display:block;margin-bottom:20px}
.eyebrow.am{color:var(--amber)}
.note{font-size:12.5px;color:var(--ink-40);line-height:1.7;margin-top:26px;max-width:86ch}
.dark .note{color:rgba(255,255,255,.42)}

/* ── skip link ── */
.skip{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--ink);color:var(--paper);
  padding:12px 20px;border-radius:0 0 6px 0;font-size:13.5px;font-weight:600}
.skip:focus{left:0}

/* ── nav ── */
header{position:fixed;top:0;left:0;right:0;z-index:900;padding:15px 0;transition:background .3s,box-shadow .3s}
header.stuck{background:rgba(251,250,248,.93);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.nav{max-width:1280px;margin:0 auto;padding:0 clamp(22px,4vw,56px);display:flex;align-items:center;
  justify-content:space-between;gap:22px}
.brandlock{display:flex;align-items:center;gap:14px}
.logo{height:40px;width:auto}
.navlinks{display:flex;gap:26px}
.navlinks a{font-size:13px;font-weight:500;color:var(--ink-60);transition:color .2s;
  padding-bottom:3px;border-bottom:1.5px solid transparent}
.navlinks a:hover{color:var(--burgundy)}
.navlinks a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--burgundy)}
.navtoggle{display:none;background:none;border:1px solid var(--line);border-radius:8px;
  width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;color:var(--ink)}
@media(max-width:1040px){
  .navlinks{position:fixed;inset:74px 0 auto;flex-direction:column;gap:0;background:var(--paper);
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 0;
    box-shadow:0 20px 40px rgba(20,16,13,.07);display:none}
  .navlinks.open{display:flex}
  .navlinks a{padding:14px clamp(22px,4vw,56px);font-size:15px;border-bottom:1px solid var(--line)}
  .navlinks a[aria-current="page"]{border-bottom-color:var(--line);color:var(--burgundy)}
  .navtoggle{display:inline-flex}
  .nav .btn{display:none}
}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:999px;
  font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid var(--ink);
  background:var(--ink);color:var(--paper);transition:all .22s}
.btn:hover{background:var(--burgundy);border-color:var(--burgundy);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.light{background:#fff;color:var(--navy-2);border-color:#fff}
.btn.light:hover{background:var(--amber);border-color:var(--amber)}
.btn.outline-l{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn.outline-l:hover{background:#fff;color:var(--navy-2);border-color:#fff}
.arrow{width:15px;height:15px;flex-shrink:0}
.ctarow{margin-top:30px;display:flex;gap:11px;flex-wrap:wrap}

/* ── page header (interior pages) ── */
.phead{padding:clamp(132px,15vw,190px) 0 clamp(40px,5vw,62px)}
.phead h1{max-width:17ch}
.phead .lead{margin-top:24px;max-width:60ch}
.phead .rule{margin-top:clamp(34px,4vw,52px);border-top:2px solid var(--ink)}
.crumb{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-40);margin-bottom:18px;display:flex;gap:8px;flex-wrap:wrap}
.crumb a{color:var(--burgundy)}
.crumb a:hover{text-decoration:underline}

/* ── annotation marks: circle · underline · bracket ── */
.mark{position:relative;display:inline-block}
.mark>svg{position:absolute;pointer-events:none;overflow:visible;z-index:-1}
.mark>svg path{fill:none;stroke:var(--burgundy);stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);
  transition:stroke-dashoffset 1.15s cubic-bezier(.35,.1,.25,1)}
.mark.drawn>svg path{stroke-dashoffset:0}
.mark[data-mark="circle"]>svg{left:-7%;top:-26%;width:114%;height:152%}
.mark[data-mark="circle"]>svg path{stroke-width:2.6}
.mark[data-mark="under"]>svg{left:-2%;bottom:-34%;width:104%;height:44%}
.mark[data-mark="under"]>svg path{stroke-width:3.2}
.mark[data-mark="bracket"]>svg{left:-5%;top:-18%;width:110%;height:136%}
.mark[data-mark="bracket"]>svg path{stroke-width:2.4}
.dark .mark>svg path,.navyband .mark>svg path,.rig .mark>svg path,
.close .mark>svg path{stroke:var(--amber)}

/* ── handwritten margin notes ── */
.hand{position:absolute;font-family:Caveat,cursive;font-size:clamp(17px,1.5vw,22px);
  font-weight:600;color:var(--burgundy);line-height:1.15;pointer-events:none;z-index:4;max-width:19ch}
.hand svg{overflow:visible;display:block}
.hand svg path{fill:none;stroke:var(--burgundy);stroke-width:1.8;stroke-linecap:round;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);
  transition:stroke-dashoffset 1s cubic-bezier(.35,.1,.25,1) .2s}
.hand.drawn svg path{stroke-dashoffset:0}
.hand span{opacity:0;transform:translateY(6px);display:block;
  transition:opacity .6s ease .55s,transform .6s ease .55s}
.hand.drawn span{opacity:1;transform:none}
.dark .hand,.navyband .hand,.rig .hand,.close .hand{color:var(--amber)}
.dark .hand svg path,.navyband .hand svg path,.rig .hand svg path,
.close .hand svg path{stroke:var(--amber)}
@media(max-width:1180px){.hand{display:none}}

/* ── dark / tinted bands ── */
.dark{background:var(--ink);color:#fff}
.dark h2,.dark h3,.dark .h3,.dark .h4{color:#fff}
.dark .lead{color:rgba(255,255,255,.62)}
.navyband{background:var(--navy);color:#fff}
.navyband .lead{color:rgba(255,255,255,.62)}
.tint{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* ── generic grids ── */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,48px)}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,28px)}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,22px)}
@media(max-width:980px){.g3{grid-template-columns:1fr 1fr}.g4{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.g2,.g3,.g4{grid-template-columns:1fr}}

/* ── ruled column set (the "horizons" pattern) ── */
.ruled{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:52px;border-top:2px solid var(--ink)}
.ruled.two{grid-template-columns:repeat(2,1fr)}
.ruled.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.ruled,.ruled.two,.ruled.four{grid-template-columns:1fr;border-top:none}}
.ruled>div{padding:28px clamp(16px,2.2vw,34px) 6px;border-right:1px solid var(--line)}
.ruled>div:first-child{padding-left:0}
.ruled>div:last-child{border-right:none}
@media(max-width:900px){.ruled>div{padding:26px 0;border-right:none;border-top:2px solid var(--ink)}}
.ruled .hz{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--amber);font-weight:700}
.ruled .q{display:block;margin-top:16px;font-family:'Inter Tight',Inter,sans-serif;font-weight:700;
  font-size:clamp(1.45rem,2.3vw,1.9rem);line-height:1.08;letter-spacing:-.035em}
.ruled p{margin-top:14px;font-size:14.5px;color:var(--ink-60);line-height:1.6}
.dark .ruled{border-top-color:rgba(255,255,255,.5)}
.dark .ruled>div{border-right-color:rgba(255,255,255,.16)}
.dark .ruled p{color:rgba(255,255,255,.6)}
@media(max-width:900px){.dark .ruled>div{border-top-color:rgba(255,255,255,.5)}}

/* ── panel card ── */
.panel{border:1px solid var(--line);border-radius:6px;background:#fff;padding:clamp(22px,2.4vw,30px);
  transition:border-color .3s,transform .3s}
.panel:hover{border-color:var(--ink);transform:translateY(-3px)}
.panel .pn{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-40)}
.panel h3,.panel .h4{margin-top:12px}
.panel p{margin-top:12px;font-size:14.5px;color:var(--ink-60);line-height:1.62}
.dark .panel{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16)}
.dark .panel:hover{border-color:var(--amber);transform:translateY(-3px)}
.dark .panel p{color:rgba(255,255,255,.62)}
.dark .panel .pn{color:var(--amber)}

/* ── spec table ── */
.spec{width:100%;border-collapse:collapse;margin-top:34px;font-size:14px}
.spec caption{text-align:left;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-40);padding-bottom:14px}
.spec th{text-align:left;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-40);font-weight:700;padding:0 16px 12px 0;
  border-bottom:2px solid var(--ink)}
.spec td{padding:15px 16px 15px 0;border-bottom:1px solid var(--line);color:var(--ink-60);
  line-height:1.55;vertical-align:top}
.spec td:first-child{color:var(--ink);font-weight:600}
.spec tr:hover td{background:rgba(20,16,13,.018)}
.dark .spec th{color:var(--amber);border-bottom-color:rgba(255,255,255,.5)}
.dark .spec td{border-bottom-color:rgba(255,255,255,.14);color:rgba(255,255,255,.62)}
.dark .spec td:first-child{color:#fff}
.dark .spec tr:hover td{background:rgba(255,255,255,.035)}
.spec .yes{color:var(--pine);font-weight:600}
.spec .no{color:var(--burgundy);font-weight:600}
.dark .spec .yes{color:#6FD9AE}
.dark .spec .no{color:#F08A80}
@media(max-width:760px){
  .spec,.spec tbody,.spec tr,.spec td{display:block;width:100%}
  .spec thead{display:none}
  .spec tr{border-bottom:2px solid var(--ink);padding:6px 0 14px}
  .spec td{border-bottom:none;padding:5px 0}
  .spec td[data-l]::before{content:attr(data-l);display:block;font-family:'JetBrains Mono',monospace;
    font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-40);margin-bottom:3px}
  .dark .spec tr{border-bottom-color:rgba(255,255,255,.4)}
}

/* ── stat row ── */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,44px);margin-top:40px;
  padding-top:24px;border-top:1px solid var(--line)}
@media(max-width:860px){.stats{grid-template-columns:1fr 1fr;gap:26px}}
@media(max-width:460px){.stats{grid-template-columns:1fr}}
.stats b{display:block;font-family:'JetBrains Mono',monospace;font-size:clamp(1.5rem,3vw,2.2rem);
  font-weight:700;letter-spacing:-.05em;line-height:1;color:var(--burgundy)}
.stats span{display:block;margin-top:9px;font-size:12.5px;color:var(--ink-60);line-height:1.45}
.dark .stats{border-top-color:rgba(255,255,255,.18)}
.dark .stats b{color:var(--amber)}
.dark .stats span{color:rgba(255,255,255,.55)}

/* ── check / cross list ── */
.claims{list-style:none;margin-top:32px;display:grid;gap:0}
.claims li{display:grid;grid-template-columns:26px 1fr;gap:14px;padding:17px 0;
  border-bottom:1px solid var(--line);font-size:15px;line-height:1.55;color:var(--ink-60)}
.claims li b{color:var(--ink);font-weight:600}
.claims li:first-child{border-top:1px solid var(--line)}
.claims .ic{width:20px;height:20px;margin-top:2px}
.dark .claims li{border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.62)}
.dark .claims li b{color:#fff}
.dark .claims li:first-child{border-top-color:rgba(255,255,255,.14)}

/* ── numbered steps ── */
.steps{counter-reset:s;margin-top:44px;border-top:2px solid var(--ink)}
.steps>li{list-style:none;counter-increment:s;display:grid;grid-template-columns:56px 1fr;
  gap:clamp(14px,2vw,28px);padding:26px 0;border-bottom:1px solid var(--line);align-items:start}
.steps>li::before{content:counter(s,decimal-leading-zero);font-family:'JetBrains Mono',monospace;
  font-size:13px;font-weight:700;color:var(--burgundy);letter-spacing:-.02em;padding-top:3px}
.steps .sh{font-family:'Inter Tight',Inter,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.08rem,1.5vw,1.3rem);line-height:1.2}
.steps p{margin-top:9px;font-size:14.5px;color:var(--ink-60);line-height:1.62;max-width:70ch}
.dark .steps{border-top-color:rgba(255,255,255,.5)}
.dark .steps>li{border-bottom-color:rgba(255,255,255,.14)}
.dark .steps>li::before{color:var(--amber)}
.dark .steps p{color:rgba(255,255,255,.62)}

/* ── quote / pull ── */
.pull{border-left:3px solid var(--burgundy);padding:6px 0 6px clamp(18px,2.4vw,30px);margin-top:34px;
  font-family:'Inter Tight',Inter,sans-serif;font-weight:700;letter-spacing:-.032em;
  font-size:clamp(1.25rem,2.2vw,1.75rem);line-height:1.22;max-width:30ch}
.pull cite{display:block;margin-top:14px;font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink-40);font-style:normal;font-weight:500}
.dark .pull{border-left-color:var(--amber)}
.dark .pull cite{color:rgba(255,255,255,.42)}

/* ── attribution block (funder chain) ── */
.attrib{border:1px solid var(--line);border-left:4px solid var(--burgundy);border-radius:5px;
  background:#fff;padding:clamp(24px,2.6vw,34px);margin-top:38px}
.attrib .ah{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-40);margin-bottom:16px;display:block}
.attrib p{font-size:15.5px;line-height:1.66;color:var(--ink-60);max-width:78ch}
.attrib p+p{margin-top:14px}
.attrib b{color:var(--ink);font-weight:600}
.chain{list-style:none;margin-top:24px;display:grid;gap:0;border-top:1px solid var(--line)}
.chain li{display:grid;grid-template-columns:108px 1fr;gap:16px;padding:14px 0;
  border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink-60);line-height:1.55}
.chain .role{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--burgundy);font-weight:700;padding-top:3px}
.chain b{color:var(--ink);font-weight:600}
@media(max-width:620px){.chain li{grid-template-columns:1fr;gap:5px}}

/* ── clocks (hero) ── */
.clockwrap{position:relative}
.clocks{border-top:2px solid var(--ink)}
.ctitle{display:block;padding:14px 0 4px;color:var(--ink-40)}
.clockrow{display:grid;grid-template-columns:1fr 96px;gap:6px 16px;padding:16px 0;border-bottom:1px solid var(--line)}
.clockrow .lb{font-size:14.5px;font-weight:600;letter-spacing:-.015em}
.clockrow .lb em{display:block;font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-40);margin-top:4px;font-weight:400}
.track{grid-column:1/-1;position:relative;height:11px;background:var(--paper-2);border-radius:2px;
  overflow:hidden;margin-top:10px}
.track i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;width:0;
  transition:width 1.3s cubic-bezier(.2,.7,.3,1)}
.clockrow .yr{font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:700;
  letter-spacing:-.03em;text-align:right;align-self:start}

/* ── engine diagram ── */
.eng{display:grid;grid-template-columns:1fr 58px 1fr;gap:clamp(16px,2.4vw,34px);align-items:center;margin-top:54px}
@media(max-width:900px){.eng{grid-template-columns:1fr;gap:18px}.eng .mid{transform:rotate(90deg);justify-self:center}}
.feed{display:flex;flex-direction:column;gap:9px}
.feed div{border:1px solid rgba(255,255,255,.18);border-radius:5px;padding:14px 17px;font-size:14.5px;
  color:rgba(255,255,255,.66);transition:border-color .25s,background .25s}
.feed div:hover{border-color:var(--amber);background:rgba(240,163,46,.06)}
.feed div b{color:#fff;font-weight:600}
.feed div.human{border-color:rgba(240,163,46,.6);background:rgba(240,163,46,.07)}
.feed div.human b{color:var(--amber)}
.mid{color:var(--amber);justify-self:center}
.out{display:flex;flex-direction:column;gap:9px}
.out div{background:rgba(255,255,255,.07);border-radius:5px;padding:14px 17px;font-size:14.5px;font-weight:600}
.out div span{display:block;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.12em;
  color:var(--amber);font-weight:500;margin-bottom:6px;text-transform:uppercase}
.engnote{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,48px)}
@media(max-width:760px){.engnote{grid-template-columns:1fr;gap:24px}}
.engnote p{font-size:14.5px;color:rgba(255,255,255,.6);line-height:1.65}
.engnote b{color:#fff}

/* ── crop cards ── */
.crops{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,26px);margin-top:52px}
@media(max-width:900px){.crops{grid-template-columns:1fr}}
.crop{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff;
  display:flex;flex-direction:column;transition:border-color .3s,transform .3s}
.crop:hover{border-color:var(--ink);transform:translateY(-4px)}
.crop .top{height:190px;background-size:cover;background-position:center;position:relative}
.crop .top.dk{background:var(--navy);display:flex;align-items:center;justify-content:center;padding:18px}
.crop .top.bg-cherry{background:linear-gradient(150deg,var(--burgundy) 0%,#5A0417 60%,var(--navy-2) 100%)}
.crop .top .tag{position:absolute;top:14px;left:14px;background:rgba(20,16,13,.8);color:#fff;
  border-radius:999px;padding:6px 12px;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  letter-spacing:.13em;text-transform:uppercase;backdrop-filter:blur(6px);z-index:2}
.crop .bd{padding:clamp(24px,2.6vw,34px);flex:1;display:flex;flex-direction:column}
.crop .usp{font-family:'Inter Tight',Inter,sans-serif;font-weight:800;font-size:clamp(1.4rem,2.2vw,1.85rem);
  line-height:1.06;letter-spacing:-.038em;max-width:16ch}
.crop .usp b{font-weight:800;font-style:italic;color:var(--burgundy)}
.crop.wn .usp b{color:var(--pine)}
.crop .bd>p{margin-top:16px;font-size:14.5px;color:var(--ink-60);line-height:1.62}
.crop ul{list-style:none;margin-top:auto;padding-top:24px}
.crop li{padding:12px 0;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink-60);
  display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start}
.crop li b{color:var(--ink);font-weight:600}
.crop li .d{width:5px;height:5px;border-radius:50%;margin-top:7px;background:var(--rose)}
.crop.wn li .d{background:var(--pine)}
.kpis{margin-top:16px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-40);line-height:1.85}

/* ── decision cards ── */
.decs{display:grid;gap:10px;margin-top:48px}
.dec{background:#fff;border:1px solid var(--line);border-radius:5px;
  display:grid;grid-template-columns:5px 132px 1fr 176px;transition:border-color .25s,transform .25s}
.dec:hover{border-color:var(--ink);transform:translateX(4px)}
@media(max-width:920px){.dec{grid-template-columns:5px 1fr}
  .dec .dwin{grid-column:2;border-left:none;border-top:1px solid var(--line)}
  .dec .dmeta{grid-column:2;padding-bottom:0}}
.dec .bar{border-radius:3px 0 0 3px}
.dec .dmeta{padding:20px 22px;display:flex;flex-direction:column;justify-content:center;gap:7px}
.dec .dmeta .blk{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:700}
.dec .dmeta .zn{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-40)}
.dec .dbody{padding:20px 22px 20px 0;display:flex;flex-direction:column;justify-content:center;gap:7px}
@media(max-width:920px){.dec .dbody{padding:0 22px 20px}}
.dec .act{font-size:16px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.dec .why{font-size:13.5px;color:var(--ink-60);line-height:1.5}
.dec .dwin{border-left:1px solid var(--line);padding:20px 22px;display:flex;flex-direction:column;
  justify-content:center;gap:4px}
.dec .dwin .lbl{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-40)}
.dec .dwin .val{font-family:'JetBrains Mono',monospace;font-size:13.5px;font-weight:700;letter-spacing:-.02em}
.dec .sev{display:inline-flex;align-items:center;gap:7px;font-family:'JetBrains Mono',monospace;
  font-size:8.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.dec .sev i{width:6px;height:6px;border-radius:50%}

/* ── the rig (harvest-date interactive) ── */
.rig{background:var(--navy);color:#fff;padding:clamp(56px,7vw,104px) 0}
.rig h2{color:#fff;max-width:16ch}
.rig .sub{margin-top:20px;color:rgba(255,255,255,.62);max-width:52ch;font-size:16px;line-height:1.62}
.rig-hint{margin-top:26px;display:inline-flex;align-items:center;gap:9px;color:var(--amber);
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.rig-hint svg{animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(-5px)}}
.rigsvg{width:100%;height:auto;display:block;margin-top:32px;touch-action:none;cursor:grab}
.rigsvg.drag{cursor:grabbing}
.rig-read{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,44px);margin-top:26px;
  padding-top:22px;border-top:1px solid rgba(255,255,255,.18)}
@media(max-width:620px){.rig-read{grid-template-columns:1fr;gap:18px}}
.rig-read b{display:block;font-family:'JetBrains Mono',monospace;font-size:clamp(1.5rem,3vw,2.3rem);
  font-weight:700;letter-spacing:-.05em;line-height:1;transition:color .3s}
.rig-read span{display:block;margin-top:9px;font-size:12.5px;color:rgba(255,255,255,.52);line-height:1.45}
.rig-foot{margin-top:24px;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.08em;
  color:rgba(255,255,255,.3);text-transform:uppercase;line-height:1.9;max-width:90ch}

/* ── group lineage ── */
.hmrow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}
@media(max-width:900px){.hmrow{grid-template-columns:1fr;gap:32px}}
.verticals{border-top:1px solid var(--line)}
.vert{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:20px 0;
  border-bottom:1px solid var(--line);transition:padding-left .28s,color .28s}
.vert:hover{padding-left:10px}
.vert .vn{font-size:16px;font-weight:600;letter-spacing:-.02em}
.vert .vs{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-40)}
.vert.on .vn,.vert.on .vs{color:var(--burgundy)}
.ravens{margin-top:24px;font-size:12.5px;color:var(--ink-40);line-height:1.8;max-width:46ch}

/* ── close / footer ── */
.close{background:var(--navy-2);color:#fff;padding:clamp(70px,9vw,128px) 0;position:relative;overflow:hidden}
.close::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(240,163,46,.13),transparent 70%);right:-160px;top:-200px}
.close h2{color:#fff;max-width:18ch;position:relative;z-index:1}
.close p{margin-top:22px;color:rgba(255,255,255,.66);max-width:54ch;position:relative;z-index:1;font-size:17px}
.close .ctarow{position:relative;z-index:1;margin-top:34px}
footer{background:var(--navy-2);color:rgba(255,255,255,.55);padding:clamp(46px,5vw,72px) 0 28px;
  border-top:1px solid rgba(255,255,255,.1)}
footer a{color:rgba(255,255,255,.55);font-size:13.5px;transition:color .2s}
footer a:hover{color:#fff}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
@media(max-width:760px){.fgrid{grid-template-columns:1fr;gap:28px}}
.flinks{display:flex;flex-direction:column;gap:10px}
.fh{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--amber);margin-bottom:14px;display:block}
.fbot{margin-top:44px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:rgba(255,255,255,.32)}

/* ── reveal + a11y ── */
.rv{opacity:0;transform:translateY(22px);
  transition:opacity .85s cubic-bezier(.2,.7,.3,1),transform .85s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none}
  .mark>svg path,.hand svg path{stroke-dashoffset:0!important}
  .hand span{opacity:1;transform:none}
}
:focus-visible{outline:2.5px solid var(--amber);outline-offset:3px;border-radius:3px}
.dark :focus-visible,.navyband :focus-visible,.close :focus-visible,footer :focus-visible,
.rig :focus-visible{outline-color:var(--amber)}

/* ── navy band inherits every dark-context override ─────────── */
.navyband .ruled{border-top-color:rgba(255,255,255,.5)}
.navyband .ruled>div{border-right-color:rgba(255,255,255,.16)}
.navyband .ruled p{color:rgba(255,255,255,.6)}
@media(max-width:900px){.navyband .ruled>div{border-top-color:rgba(255,255,255,.5)}}
.navyband .panel{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16)}
.navyband .panel:hover{border-color:var(--amber)}
.navyband .panel p{color:rgba(255,255,255,.62)}
.navyband .panel .pn{color:var(--amber)}
.navyband .spec th{color:var(--amber);border-bottom-color:rgba(255,255,255,.5)}
.navyband .spec td{border-bottom-color:rgba(255,255,255,.14);color:rgba(255,255,255,.62)}
.navyband .spec td:first-child{color:#fff}
.navyband .spec tr:hover td{background:rgba(255,255,255,.035)}
.navyband .spec .yes{color:#6FD9AE}.navyband .spec .no{color:#F08A80}
.navyband .steps{border-top-color:rgba(255,255,255,.5)}
.navyband .steps>li{border-bottom-color:rgba(255,255,255,.14)}
.navyband .steps>li::before{color:var(--amber)}
.navyband .steps p{color:rgba(255,255,255,.62)}
.navyband .claims li{border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.62)}
.navyband .claims li b{color:#fff}
.navyband .claims li:first-child{border-top-color:rgba(255,255,255,.14)}
.navyband .stats{border-top-color:rgba(255,255,255,.18)}
.navyband .stats b{color:var(--amber)}
.navyband .stats span{color:rgba(255,255,255,.55)}
.navyband .note{color:rgba(255,255,255,.42)}
.navyband .pull{border-left-color:var(--amber)}
.navyband .pull cite{color:rgba(255,255,255,.42)}
@media(max-width:760px){.navyband .spec tr{border-bottom-color:rgba(255,255,255,.4)}}
