/* =====================================================================
   League of Industrial Operators - lio.css
   A program of Apex 8 Publishing. Design system per build brief §6.
   Square corners, hairline rules, machinist tick scale, serif body,
   accent used only where specified. Light + dark themes.
   ===================================================================== */

/* ---- Tokens: full light palette on bare :root ---- */
:root{
  --ground:#ECEEEB; --surface:#F7F8F6; --surface-2:#E3E6E2;
  --ink:#14181A; --ink-2:#535B5E; --ink-3:#7C8488;
  --rule:#C7CCC7; --rule-strong:#9AA29C;
  --accent:#D9A21B; --accent-ink:#1A1305; --accent-deep:#8A5F00;

  --disp:"Saira Condensed","Archivo Narrow",Impact,sans-serif;
  --narrow:"Archivo Narrow","Archivo",system-ui,sans-serif;
  --body:"Newsreader",Georgia,"Times New Roman",serif;
  --maxw:1160px;
  --pad:clamp(20px,5vw,44px);
}
/* dark when system prefers it and user hasn't forced light */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#131719; --surface:#1B2023; --surface-2:#232A2D;
    --ink:#EDEFEC; --ink-2:#A3ABAE; --ink-3:#798285;
    --rule:#2C3437; --rule-strong:#465053;
    --accent:#E5B23A; --accent-ink:#181203; --accent-deep:#E5B23A;
  }
}
/* explicit user choice always wins */
:root[data-theme="dark"]{
  --ground:#131719; --surface:#1B2023; --surface-2:#232A2D;
  --ink:#EDEFEC; --ink-2:#A3ABAE; --ink-3:#798285;
  --rule:#2C3437; --rule-strong:#465053;
  --accent:#E5B23A; --accent-ink:#181203; --accent-deep:#E5B23A;
}
:root[data-theme="light"]{
  --ground:#ECEEEB; --surface:#F7F8F6; --surface-2:#E3E6E2;
  --ink:#14181A; --ink-2:#535B5E; --ink-3:#7C8488;
  --rule:#C7CCC7; --rule-strong:#9AA29C;
  --accent:#D9A21B; --accent-ink:#1A1305; --accent-deep:#8A5F00;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--ground);color:var(--ink);
  font-family:var(--body);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---- Theme-aware logo swap (flash-free, works without JS) ---- */
.only-dark{display:none}
.only-light{display:block}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .only-dark{display:block}
  :root:not([data-theme="light"]) .only-light{display:none}
}
:root[data-theme="dark"] .only-dark{display:block}
:root[data-theme="dark"] .only-light{display:none}
:root[data-theme="light"] .only-light{display:block}
:root[data-theme="light"] .only-dark{display:none}

/* ---- Machinist tick scale across the very top of every page ---- */
.tickscale{height:10px;opacity:.7;
  background:repeating-linear-gradient(to right,var(--rule-strong) 0 1px,transparent 1px 12px)}

/* ---- Type primitives ---- */
.eyebrow{font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.20em;font-size:12.5px;color:var(--accent)}
.label{font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.16em;font-size:12px;color:var(--ink-3)}
h1,h2,h3,h4{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;
  line-height:1.02;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(38px,6.4vw,74px)}
h2{font-size:clamp(28px,4vw,44px)}
h3{font-size:clamp(20px,2.4vw,26px)}
h4{font-size:18px;letter-spacing:-.01em}
p{max-width:64ch}
.lead{font-size:clamp(18px,2.2vw,22px);line-height:1.5;color:var(--ink-2);max-width:60ch}
.num{font-variant-numeric:tabular-nums}
b,strong{font-weight:600;color:var(--ink)}

/* ---- Layout ---- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
section{padding:clamp(48px,7vw,88px) 0;border-top:1px solid var(--rule)}
.sec-head{display:flex;flex-direction:column;gap:12px;margin-bottom:36px}

/* ---- Masthead ---- */
.mast{position:sticky;top:0;z-index:50;background:var(--ground);
  border-bottom:3px solid var(--ink)}
.mast-in{max-width:var(--maxw);margin:0 auto;padding:14px var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px}
.brand .mark{height:38px;width:auto}
.brand .lock{height:34px;width:auto}
.brand .sub{font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;font-size:10px;color:var(--ink-3);border-left:1px solid var(--rule);
  padding-left:12px;line-height:1.3;max-width:150px}
.nav{display:flex;align-items:center;gap:26px}
.nav a{font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;font-size:12.5px;color:var(--ink-2);transition:color .15s}
.nav a:hover{color:var(--ink)}
.nav .join{color:var(--ground);background:var(--ink);border:1px solid var(--ink);
  padding:9px 16px;letter-spacing:.12em}
.nav .join:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.themebtn{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;
  font-size:11px;color:var(--ink-3);background:none;border:1px solid var(--rule);
  padding:7px 10px;cursor:pointer}
.themebtn:hover{color:var(--ink);border-color:var(--rule-strong)}
.menubtn{display:none}

/* mobile nav */
@media (max-width:860px){
  .nav{position:fixed;inset:0 0 0 auto;width:min(82vw,320px);background:var(--surface);
    border-left:3px solid var(--ink);flex-direction:column;align-items:stretch;gap:0;
    padding:76px 24px 24px;transform:translateX(100%);transition:transform .2s ease;box-shadow:-1px 0 0 var(--rule)}
  .nav.open{transform:none}
  .nav a{padding:15px 0;border-bottom:1px solid var(--rule);font-size:14px}
  .nav .join{text-align:center;margin-top:16px;border:1px solid var(--ink);padding:14px}
  .menubtn{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--rule-strong);
    padding:9px 12px;cursor:pointer;font-family:var(--narrow);font-weight:600;text-transform:uppercase;
    letter-spacing:.14em;font-size:12px;color:var(--ink)}
  .navscrim{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:40;opacity:0;visibility:hidden;transition:opacity .2s}
  .navscrim.open{opacity:1;visibility:visible}
}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:600;
  font-size:15px;letter-spacing:.01em;padding:14px 24px;border:1px solid var(--ink);
  background:var(--ink);color:var(--ground);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn-ghost{background:none;color:var(--ink);border:1px solid var(--rule-strong)}
.btn-ghost:hover{background:none;border-color:var(--accent);color:var(--accent-deep)}
.btn-lg{padding:17px 30px;font-size:16px}
.btnrow{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

/* ---- Callout strip: accent left rule allowed ---- */
.callout{border-left:3px solid var(--accent);padding:6px 0 6px 22px}

/* ---- Hairline card (no radius, no shadow) ---- */
.card{background:var(--surface);border:1px solid var(--rule);padding:26px}
.grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule)}
.grid > *{background:var(--surface)}

/* ---- Hero (cinematic cockpit / starting grid) ---- */
.hero{position:relative;overflow:hidden;isolation:isolate;border-top:none;
  padding:clamp(48px,8vw,104px) 0 clamp(40px,6vw,72px)}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hero-bg{opacity:.5}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hero-bg{opacity:1}}
:root[data-theme="dark"] .hero-bg{opacity:1}
:root[data-theme="light"] .hero-bg{opacity:.5}
.gridfloor{position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);width:170%;height:62%}
.gridfloor line{stroke:var(--accent);stroke-opacity:.14;stroke-width:1;vector-effect:non-scaling-stroke}
.gridfloor line.start{stroke-opacity:.4;stroke-width:2}
.hero-glow{position:absolute;left:50%;bottom:-10%;transform:translateX(-50%);width:74%;height:70%;
  background:radial-gradient(ellipse at 50% 100%, rgba(229,178,58,.18), rgba(229,178,58,0) 60%)}
.hero-crest{position:absolute;right:-24px;top:5%;height:80%;width:auto;opacity:.055}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,64px);align-items:center}
.leocue{margin-top:20px;display:flex;align-items:center;gap:11px;flex-wrap:wrap;
  font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.13em;font-size:11.5px;color:var(--ink-3)}
.leocue .crest{height:22px;width:auto}
.leocue .ph{color:var(--accent);text-transform:none;letter-spacing:.02em}
.leocue .sep{color:var(--rule-strong)}
.hero h1{margin:16px 0 0}
.hero .accentword{color:var(--accent)}
.hero .lead{margin-top:20px}
.hero .btnrow{margin-top:28px}
.hero .fromline{margin-top:16px;font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;font-size:12.5px;color:var(--ink-3)}
.hero .fromline b{color:var(--ink)}
/* hero instrument panel */
.instr{background:var(--surface);border:1px solid var(--rule);padding:22px}
.instr .instr-top{display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--rule);padding-bottom:12px;margin-bottom:16px}
.instr .instr-top .t{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--ink-3)}
.instr .instr-top .v{font-family:var(--narrow);font-weight:600;letter-spacing:.12em;font-size:12px;color:var(--accent)}
.telemetry{width:100%;height:96px;display:block}
.ladder{margin-top:16px;display:flex;flex-direction:column;gap:0}
.ladder .rung{display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--rule)}
.ladder .rung:last-child{border-bottom:none}
.ladder .rung .n{font-family:var(--narrow);font-weight:600;font-size:11px;letter-spacing:.14em;color:var(--ink-3);width:20px}
.ladder .rung .s{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:15px}
.ladder .rung .d{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--ink-3);margin-left:auto}
.ladder .rung .dot{width:7px;height:7px;background:var(--rule-strong)}
.ladder .rung.on .dot{background:var(--accent)}
.ladder .rung.on .s{color:var(--ink)}

/* ---- Cockpit / converging layer ---- */
.converge{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.converge .chip{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.12em;
  font-size:12px;color:var(--ink-2);border:1px solid var(--rule);padding:8px 13px;background:var(--surface)}
.bigline{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;
  font-size:clamp(24px,3.4vw,38px);margin-top:26px;color:var(--ink);text-wrap:balance}
.bigline .accentword{color:var(--accent)}

/* ---- Experience-advantage list ---- */
.knowlist{display:flex;flex-direction:column;gap:0;margin-top:8px;max-width:720px}
.knowlist .k{display:flex;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--rule)}
.knowlist .k .idx{font-family:var(--narrow);font-weight:600;font-size:11px;letter-spacing:.14em;color:var(--accent);width:26px;flex:none}
.knowlist .k .t{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:clamp(19px,2.3vw,24px);color:var(--ink)}
.turn{margin-top:26px;font-size:clamp(18px,2.2vw,22px);color:var(--ink-2)}
.turn b{color:var(--ink)}

/* ---- Journey ---- */
.journey{display:grid;grid-template-columns:repeat(4,1fr)}
.journey .j{padding:24px;border-left:1px solid var(--rule);position:relative}
.journey .j:first-child{border-left:none}
.journey .j .n{font-family:var(--narrow);font-weight:600;font-size:11px;letter-spacing:.16em;color:var(--ink-3)}
.journey .j h3{margin:12px 0 8px}
.journey .j p{font-size:15px;color:var(--ink-2)}
.journey .j .arrow{position:absolute;top:26px;right:-8px;color:var(--rule-strong);font-family:var(--disp);font-weight:800}
.journey-foot{margin-top:22px;font-family:var(--disp);font-weight:800;letter-spacing:-.01em;
  font-size:clamp(18px,2.3vw,24px);text-wrap:balance}

/* ---- Book (Apex 8) ---- */
.book-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,4vw,48px);align-items:center}
.book{aspect-ratio:3/4.2;background:var(--ink);color:var(--ground);border:1px solid var(--ink);
  padding:26px;display:flex;flex-direction:column;justify-content:space-between;max-width:320px;position:relative}
.book::before{content:"";position:absolute;left:14px;top:0;bottom:0;width:1px;background:var(--accent);opacity:.5}
.book .btop{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--accent)}
.book .bt{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;font-size:44px;line-height:.92}
.book .bs{font-family:var(--body);font-style:italic;font-size:16px;color:var(--ground);opacity:.9;line-height:1.35}
.book .bb{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:10.5px;color:var(--ground);opacity:.75}

/* ---- Sessions ---- */
.sessions{display:grid;grid-template-columns:repeat(3,1fr)}
.sessions .s{padding:24px;border-left:1px solid var(--rule)}
.sessions .s:first-child{border-left:none}
.sessions .s .day{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--accent)}
.sessions .s h3{margin:10px 0 8px;font-size:20px}
.sessions .s p{font-size:15px;color:var(--ink-2)}
.sched-note{margin-top:18px;font-size:14px;color:var(--ink-3);font-style:italic}

/* ---- Unlocks list ---- */
.unlocks{columns:2;column-gap:40px;margin-top:6px}
.unlocks li{break-inside:avoid;list-style:none;padding:12px 0 12px 22px;position:relative;border-bottom:1px solid var(--rule);font-size:15.5px;color:var(--ink)}
.unlocks li::before{content:"";position:absolute;left:0;top:19px;width:9px;height:1px;background:var(--accent-deep)}
.protective{margin-top:22px;font-size:14.5px;color:var(--ink-2);border-left:3px solid var(--accent);padding-left:20px;max-width:70ch}

/* ---- Programs (coming soon) ---- */
.programs{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.prog{border:1px solid var(--rule);background:var(--surface);padding:26px;display:flex;flex-direction:column}
.prog .ptag{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--accent)}
.prog h3{margin:10px 0 12px}
.prog p{font-size:15px;color:var(--ink-2)}
.prog ul{margin:14px 0 0;padding:0}
.prog li{list-style:none;font-size:14.5px;color:var(--ink-2);padding:7px 0 7px 20px;position:relative;border-top:1px solid var(--rule)}
.prog li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:1px;background:var(--rule-strong)}
.prog .pfoot{margin-top:auto;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.prog .soon{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--ink-3);border:1px solid var(--rule-strong);padding:6px 10px}
.notaccred{margin-top:22px;font-size:13px;color:var(--ink-3);max-width:78ch}

/* ---- Doors ---- */
.doors{display:grid;grid-template-columns:repeat(3,1fr)}
.doors .door{padding:26px;border-left:1px solid var(--rule)}
.doors .door:first-child{border-left:none}
.doors .door .dn{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--ink-3)}
.doors .door h3{margin:10px 0 10px;font-size:21px}
.doors .door p{font-size:15px;color:var(--ink-2)}
.doors .door .dlink{margin-top:14px;display:inline-block;font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:3px}

/* ---- Pricing ---- */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch}
.plan{background:var(--surface);border:1px solid var(--rule);padding:0;display:flex;flex-direction:column}
.plan .topbar{height:4px;background:var(--rule)}
.plan.feat{border-color:var(--rule-strong)}
.plan.feat .topbar{background:var(--accent)}
.plan .pin{padding:26px;display:flex;flex-direction:column;gap:0;flex:1}
.plan .cad{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:10px}
.plan .badge{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:var(--accent-ink);background:var(--accent);padding:3px 8px}
.plan .price{font-family:var(--disp);font-weight:800;letter-spacing:-.03em;font-size:46px;margin:16px 0 2px;color:var(--ink)}
.plan .price small{font-size:16px;font-weight:600;color:var(--ink-3);letter-spacing:0}
.plan .per{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--ink-2)}
.plan .save{margin-top:12px;font-size:14px;color:var(--ink-2)}
.plan .save b{color:var(--ink)}
.plan .btn{margin-top:auto;justify-content:center}
.plan .cta-wrap{margin-top:auto;padding-top:24px}
.plan .cta-wrap .btn{margin-top:0;width:100%}
.plan .promo{margin-top:12px;font-size:12.5px;color:var(--ink-3)}
.pricing-foot{margin-top:20px;font-size:13px;color:var(--ink-3)}
.pricing-foot a{border-bottom:1px solid var(--rule-strong)}

/* ---- Final conversion ---- */
.final{text-align:center}
.final h2{max-width:22ch;margin:0 auto}
.final .accentword{color:var(--accent)}
.final .btnrow{justify-content:center;margin-top:28px}
.final .priceline{margin-top:16px;font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--ink-3)}
.final .priceline b{color:var(--ink)}

/* ---- FAQ ---- */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:18px;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--disp);font-weight:800;color:var(--accent);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"\2013"}
.faq .a{padding:0 0 20px;font-size:16px;color:var(--ink-2);max-width:70ch}
.faq .a b{color:var(--ink)}

/* ---- Footer ---- */
.foot{border-top:3px solid var(--ink);background:var(--surface)}
.foot-in{max-width:var(--maxw);margin:0 auto;padding:clamp(32px,5vw,52px) var(--pad)}
.foot-top{display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-start}
.foot .brand .sub{border-left-color:var(--rule)}
.foot-links{display:flex;flex-wrap:wrap;gap:24px}
.foot-links a{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--ink-2)}
.foot-links a:hover{color:var(--ink)}
.foot .fine{margin-top:26px;padding-top:22px;border-top:1px solid var(--rule);font-size:12.5px;color:var(--ink-3);line-height:1.7;max-width:88ch}
.foot .fine b{color:var(--ink-2)}
.foot .apex{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--ink-2)}

/* ---- Utility ---- */
.mono-note{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--ink-3)}
.hb4m{font-family:var(--disp);font-weight:800;letter-spacing:.02em}
.hb4m .four{color:var(--accent)}

/* ---- Responsive ---- */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .journey{grid-template-columns:1fr 1fr}
  .journey .j:nth-child(3){border-left:none}
  .sessions{grid-template-columns:1fr}
  .sessions .s{border-left:none;border-top:1px solid var(--rule)}
  .sessions .s:first-child{border-top:none}
  .book-grid{grid-template-columns:1fr;gap:28px}
  .book{margin:0 auto}
  .programs{grid-template-columns:1fr}
  .pricing{grid-template-columns:1fr}
  .doors{grid-template-columns:1fr}
  .doors .door{border-left:none;border-top:1px solid var(--rule)}
  .doors .door:first-child{border-top:none}
}
@media (max-width:560px){
  .journey{grid-template-columns:1fr}
  .journey .j{border-left:none;border-top:1px solid var(--rule)}
  .journey .j:first-child{border-top:none}
  .journey .j .arrow{display:none}
  .unlocks{columns:1}
  .brand .sub{display:none}
}

/* ============================================================
   Overrides - real logo files, fixed dark command bar, book cover
   ============================================================ */
/* Masthead & footer: fixed graphite bar in both themes (uses the real amber lockup) */
.mast{background:#12161a;border-bottom:1px solid rgba(229,178,58,.30)}
.mast .brand .sub{color:#8b9297;border-left-color:rgba(255,255,255,.14)}
.nav a{color:#b9bfc1}
.nav a:hover{color:#fff}
.nav .join{color:#14181A;background:#EDEFEC;border-color:#EDEFEC}
.nav .join:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.themebtn{color:#9aa1a4;border-color:rgba(255,255,255,.20)}
.themebtn:hover{color:#fff;border-color:rgba(255,255,255,.42)}
.menubtn{color:#EDEFEC;border-color:rgba(255,255,255,.28)}
@media (max-width:860px){
  .nav{background:#12161a;border-left:1px solid rgba(229,178,58,.30)}
  .nav a{border-bottom-color:rgba(255,255,255,.10)}
  .nav .join{border-color:#EDEFEC}
}
.foot{background:#12161a;border-top:1px solid rgba(229,178,58,.30);color:#c7ccc9}
.foot .apex{color:#d6dbd9}
.foot .brand .sub{color:#8b9297;border-left-color:rgba(255,255,255,.14)}
.foot-links a{color:#b9bfc1}
.foot-links a:hover{color:#fff}
.foot .fine{color:#7f888c;border-top-color:rgba(255,255,255,.10)}
.foot .fine b{color:#b9bfc1}

/* Apex 8 real cover */
.bookwrap{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.bookimg{max-width:300px;width:100%;height:auto}
.bookmeta{display:flex;flex-direction:column;gap:9px}
.bmb{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--ink-3)}
.booklink{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:3px;align-self:flex-start}
.booklink:hover{color:var(--accent-deep)}

/* ===== Kov benchmark pass: condensed athletic display, single-column cinematic hero ===== */
h1,h2{text-transform:uppercase;letter-spacing:.012em;line-height:.94}
h1{font-size:clamp(46px,8.4vw,104px)}
h2{font-size:clamp(30px,4.6vw,52px)}
.btn{text-transform:uppercase;letter-spacing:.05em}
h1.head-xl{font-weight:800;font-size:clamp(54px,12vw,150px);line-height:.84;letter-spacing:.006em;margin:16px 0 0;max-width:none}
h1.head-xl span{display:block}
h1.head-xl .outline{color:var(--accent)}
@supports ((-webkit-text-stroke:1px #000)){h1.head-xl .outline{color:transparent;-webkit-text-stroke:1.8px var(--accent)}}
.kicker{font-size:13px;letter-spacing:.24em}
.herosub{margin-top:22px;max-width:54ch;color:var(--ink-2)}
.hero .btnrow{margin-top:30px}
.gridfloor line{stroke-opacity:.14}
.hero-glow{left:50%;right:auto;bottom:-10%;transform:translateX(-50%);width:74%;height:70%;
  background:radial-gradient(ellipse at 50% 100%, rgba(229,178,58,.18), rgba(229,178,58,0) 60%)}
.hero-grid{grid-template-columns:1fr;gap:38px}
.instr{width:100%}
.instr .telemetry{height:82px}
.ladder{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;border-top:1px solid var(--rule)}
.ladder .rung{display:block;position:relative;padding:16px 16px;border-left:1px solid var(--rule);border-bottom:none}
.ladder .rung:first-child{border-left:none}
.ladder .rung .dot{position:absolute;top:19px;right:16px}
.ladder .rung .s{display:block;margin-top:8px;font-size:17px}
.ladder .rung .d{display:block;margin-left:0;margin-top:3px;font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:9.5px;color:var(--ink-3)}
@media (max-width:640px){.ladder{grid-template-columns:1fr 1fr}.ladder .rung:nth-child(3){border-left:none}}

/* Solid horizon line in hero (replaces perspective grid) */
.horizon{position:absolute;left:0;right:0;bottom:19%;height:1px;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,rgba(229,178,58,0) 0%,rgba(229,178,58,.62) 16%,rgba(229,178,58,.62) 84%,rgba(229,178,58,0) 100%)}

/* Room-floor grid: recedes to a back wall line (no vanishing point) */
.roomfloor{position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);width:172%;height:60%}
.roomfloor .fl{stroke:var(--accent);stroke-opacity:.13;stroke-width:1;vector-effect:non-scaling-stroke}
.roomfloor .frontline{stroke:var(--accent);stroke-opacity:.10;stroke-width:1;vector-effect:non-scaling-stroke}
.roomfloor .backwall{stroke:var(--accent);stroke-opacity:.5;stroke-width:2;vector-effect:non-scaling-stroke}

/* ===== AI IQ interactive graph card (moved off the hero) ===== */
.iqgraph{width:100%;height:118px;display:block;border-bottom:1px solid var(--rule)}
#iqline{stroke:var(--accent);transition:stroke .2s ease}
#iqdot{fill:var(--accent);transition:fill .2s ease}
.instr-top .v{text-transform:uppercase;white-space:nowrap}
.stagebar{display:grid;grid-template-columns:repeat(4,1fr)}
.stg{display:flex;align-items:center;gap:9px;padding:11px 16px;border-left:1px solid var(--rule);background:none;cursor:pointer;text-align:left;transition:background .15s}
.stg:first-child{border-left:none}
.stg .n{font-family:var(--narrow);font-weight:600;font-size:11px;letter-spacing:.14em;color:var(--ink-3)}
.stg .s{font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:16px;color:var(--ink-2);line-height:1}
.stg:hover,.stg.on{background:var(--surface-2)}
.stg:hover .s,.stg.on .s{color:var(--ink)}
@media (max-width:640px){.stagebar{grid-template-columns:1fr 1fr}.stg:nth-child(3){border-left:none}}

/* ============================================================
   Augmentation Path - operating-system panel (looping motion)
   ============================================================ */
.sap .lead{margin-top:8px;margin-bottom:0}
.sap-panel{margin-top:30px;background:var(--surface);border:1px solid var(--rule)}

/* status bar */
.sap-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 20px;border-bottom:1px solid var(--rule)}
.sap-tag{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--ink-3)}
.sap-status{display:flex;align-items:center;gap:9px;font-family:var(--narrow);font-weight:600;
  text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--accent)}
.sap-status .pulse{width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 0 rgba(229,178,58,.55);animation:sapBeacon 2.4s ease-out infinite}
@keyframes sapBeacon{0%{box-shadow:0 0 0 0 rgba(229,178,58,.5)}70%{box-shadow:0 0 0 7px rgba(229,178,58,0)}100%{box-shadow:0 0 0 0 rgba(229,178,58,0)}}

/* role selector (segmented) - retained for compatibility */
.sap-roles{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--rule)}
.sap-role{position:relative;font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;font-size:12.5px;color:var(--ink-3);background:none;border:0;border-left:1px solid var(--rule);
  padding:15px 8px;cursor:pointer;transition:color .15s,background .15s}
.sap-role:first-child{border-left:0}
.sap-role:hover{color:var(--ink-2);background:var(--surface-2)}
.sap-role.on{color:var(--ink);background:var(--surface-2)}
.sap-role.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent)}

/* path track + nodes */
.sap-track{padding:32px 22px 12px}
.sap-stages{position:relative;display:grid;grid-template-columns:repeat(4,1fr)}
.sap-stages::before{content:"";position:absolute;left:12.5%;right:12.5%;top:10px;height:2px;background:var(--rule)}
.rail-lit{position:absolute;left:12.5%;right:12.5%;top:10px;height:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left center;transition:transform 1.05s ease}
.sap-stages.armed .rail-lit{transform:scaleX(1)}
.sap-stage{position:relative;background:none;border:0;cursor:pointer;display:flex;flex-direction:column;
  align-items:center;gap:9px;padding:4px 6px 14px;text-align:center}
.sap-stage .dot{width:14px;height:14px;border-radius:50%;background:var(--rule-strong);
  border:2px solid var(--surface);box-shadow:0 0 0 1px var(--rule);position:relative;z-index:1;
  transition:background .3s ease,box-shadow .3s ease}
.sap-stages.armed .sap-stage:nth-of-type(1) .dot{transition-delay:.12s}
.sap-stages.armed .sap-stage:nth-of-type(2) .dot{transition-delay:.36s}
.sap-stages.armed .sap-stage:nth-of-type(3) .dot{transition-delay:.60s}
.sap-stages.armed .sap-stage:nth-of-type(4) .dot{transition-delay:.84s}
.sap-stages.armed .sap-stage .dot{background:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.sap-stage .k{font-family:var(--narrow);font-weight:600;font-size:10.5px;letter-spacing:.16em;color:var(--ink-3)}
.sap-stage .s{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:.02em;
  font-size:15px;line-height:1;color:var(--ink-2);transition:color .15s}
.sap-stage:hover .s,.sap-stage.on .s{color:var(--ink)}
.sap-stages.armed .sap-stage.on .dot{background:var(--accent);box-shadow:0 0 0 1px var(--accent);animation:sapNode 2.1s ease-out infinite}
@keyframes sapNode{
  0%{box-shadow:0 0 0 1px var(--accent),0 0 0 0 rgba(229,178,58,.5)}
  70%{box-shadow:0 0 0 1px var(--accent),0 0 0 9px rgba(229,178,58,0)}
  100%{box-shadow:0 0 0 1px var(--accent),0 0 0 0 rgba(229,178,58,0)}}

/* readout */
.sap-readout{padding:20px 22px 22px;border-top:1px solid var(--rule);min-height:124px}
.sap-stagename{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:.02em;
  font-size:20px;color:var(--accent);animation:sapFade .34s ease}
.sap-copy{margin-top:8px;font-size:16.5px;line-height:1.5;color:var(--ink-2);max-width:72ch;animation:sapFade .34s ease}
@keyframes sapFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* outcome strip */
.sap-outcome{padding:16px 22px;border-top:1px solid var(--rule);background:var(--surface-2);
  border-left:3px solid var(--accent);font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.09em;font-size:12.5px;color:var(--ink)}

/* closing statement */
.sap-foot{margin-top:24px;font-family:var(--body);font-style:italic;font-size:clamp(17px,2vw,21px);
  line-height:1.45;color:var(--ink-2);max-width:74ch}

@media (max-width:640px){
  .sap-stage .k{display:none}
  .sap-stage .s{font-size:12.5px}
  .sap-readout{min-height:150px}
}
@media (prefers-reduced-motion:reduce){
  .sap-status .pulse,.sap-stages.armed .sap-stage.on .dot,.sap-stagename,.sap-copy{animation:none}
  .rail-lit,.sap-stage .dot,.sap-stage .s{transition:none}
}

/* ============================================================
   Command center - systems light up in sequence (looping)
   ============================================================ */
.crow{margin-top:6px;border:1px solid var(--rule);background:var(--surface);padding:clamp(22px,4vw,36px)}
.crow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.crow .sys{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;
  font-size:13px;color:var(--ink-3);border:1px solid var(--rule);background:var(--ground);padding:16px 12px;
  text-align:center;transition:color .45s ease,border-color .45s ease,background .45s ease,box-shadow .45s ease}
.crow.live .sys{color:var(--ink);border-color:var(--accent);background:var(--surface);
  box-shadow:inset 0 0 0 1px rgba(229,178,58,.22);transition-delay:calc(var(--i) * .13s)}
.crow-stem{width:2px;height:34px;margin:16px auto 0;background:var(--rule);transform:scaleY(0);
  transform-origin:top;transition:transform .55s ease 1s, background .55s ease 1s}
.crow.live .crow-stem{transform:scaleY(1);background:var(--accent)}
.crow-anchor{margin:0 auto;max-width:440px;border:1px solid var(--rule);background:var(--ground);
  padding:16px 22px;text-align:center;
  transition:border-color .55s ease 1.2s,background .55s ease 1.2s,box-shadow .55s ease 1.2s}
.crow.live .crow-anchor{border-color:var(--accent);background:var(--surface);
  box-shadow:0 0 0 1px var(--accent),0 0 34px rgba(229,178,58,.14)}
.crow-anchor .ca-k{display:block;font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.18em;font-size:10.5px;color:var(--ink-3)}
.crow-anchor .ca-name{display:block;margin-top:5px;font-family:var(--disp);font-weight:800;text-transform:uppercase;
  letter-spacing:.02em;font-size:clamp(22px,3vw,30px);color:var(--ink-3);transition:color .55s ease 1.2s}
.crow.live .crow-anchor .ca-name{color:var(--accent)}
@media (max-width:640px){.crow-grid{grid-template-columns:repeat(2,1fr)}}
/* nine-system variant (3x3) */
.crow.nine .crow-grid{grid-template-columns:repeat(3,1fr)}
@media (max-width:640px){.crow.nine .crow-grid{grid-template-columns:repeat(2,1fr)}}

/* system-vs-you contrast pairs */
.contrast{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.contrast .cx{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--rule)}
.contrast .sysside{color:var(--ink-3);font-size:16px}
.contrast .youside{position:relative;padding-left:18px;color:var(--ink);font-weight:600;font-size:16px}
.contrast .youside::before{content:"";position:absolute;left:0;top:11px;width:9px;height:1px;background:var(--accent)}
@media (max-width:560px){.contrast .cx{grid-template-columns:1fr;gap:3px}.contrast .youside{padding-left:0}.contrast .youside::before{display:none}}

/* learn-how-to list */
.learnlist{margin-top:16px;list-style:none;max-width:82ch}
.learnlist li{position:relative;padding:11px 0 11px 26px;border-bottom:1px solid var(--rule);font-size:16px;color:var(--ink-2)}
.learnlist li::before{content:"";position:absolute;left:0;top:19px;width:12px;height:1px;background:var(--accent-deep)}

@media (prefers-reduced-motion:reduce){
  .crow .sys,.crow-stem,.crow-anchor,.crow-anchor .ca-name{transition:none}
}

/* ============================================================
   Progression motion (green = completed, amber = active) + tokens
   ============================================================ */
:root{--go:#2F9C5A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--go:#4FBE7A}}
:root[data-theme="dark"]{--go:#4FBE7A}
:root[data-theme="light"]{--go:#2F9C5A}

.sap-stage.done .dot{background:var(--go);box-shadow:0 0 0 1px var(--go)}
.sap-stage.done .s{color:var(--ink-2)}
.sap-stage.on .dot{background:var(--accent);box-shadow:0 0 0 1px var(--accent);animation:sapNode 2.1s ease-out infinite}
.sap-stage.on .s{color:var(--ink)}
.rail-lit{transition:transform 1s ease}
@media (prefers-reduced-motion:reduce){.sap-stage.on .dot{animation:none}.rail-lit{transition:none}}

/* Leadership / next-path bridge */
.leadpath{font-size:clamp(19px,2.5vw,26px);line-height:1.42;color:var(--ink);max-width:58ch}
.leadpath b{color:var(--accent)}
.leadpath-foot{margin-top:22px;font-family:var(--disp);font-weight:800;letter-spacing:-.01em;
  font-size:clamp(18px,2.3vw,24px);text-wrap:balance;color:var(--ink)}
.leadpath-foot .accentword{color:var(--accent)}

/* wider measure for body paragraphs */
section .lead:not(.herosub){max-width:68ch}
.turn{max-width:72ch}
.leadpath{max-width:64ch}
.book .bs, .sap-copy{max-width:70ch}

/* ============================================================
   REWORK ADDITIONS - capability stations, evidence, flows, roles
   ============================================================ */

/* capability station names are longer words; size + verb sub-label */
.sap-stage .s{font-size:13.5px;letter-spacing:.01em}
.sap-stage .verb{display:block;margin-top:5px;font-family:var(--narrow);font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;font-size:10px;color:var(--ink-3)}
@media (max-width:640px){.sap-stage .s{font-size:11px}.sap-stage .verb{font-size:9px}}

/* ---- Evidence: the market is repricing augmented people ---- */
.evid{margin-top:30px;border:1px solid var(--rule);background:var(--surface)}
.evid-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.evid .stat{padding:26px 24px;border-left:1px solid var(--rule)}
.evid .stat:first-child{border-left:none}
.evid .stat .n{font-family:var(--disp);font-weight:800;letter-spacing:-.03em;font-size:clamp(40px,6vw,58px);
  line-height:.9;color:var(--accent);font-variant-numeric:tabular-nums}
.evid .stat .k{margin-top:12px;font-size:15px;color:var(--ink-2);line-height:1.45;max-width:34ch}
.evid .stat .k b{color:var(--ink)}
.evid-src{margin-top:14px;font-family:var(--narrow);font-weight:600;text-transform:uppercase;
  letter-spacing:.13em;font-size:11px;color:var(--ink-3)}
@media (max-width:760px){.evid-grid{grid-template-columns:1fr}.evid .stat{border-left:none;border-top:1px solid var(--rule)}.evid .stat:first-child{border-top:none}}

/* ---- Flow: sequential step band (learn-to-learn, Frank story) ---- */
.flow{display:flex;flex-wrap:wrap;border:1px solid var(--rule);background:var(--surface);margin-top:8px}
.flow .step{flex:1 1 0;min-width:180px;padding:24px 22px;border-left:1px solid var(--rule);position:relative}
.flow .step:first-child{border-left:none}
.flow .step .sk{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--accent)}
.flow .step h4{margin:10px 0 8px;font-size:18px;letter-spacing:-.01em;text-transform:uppercase}
.flow .step p{font-size:14.5px;color:var(--ink-2);line-height:1.5}
.flow .step .arrow{position:absolute;top:24px;right:-9px;z-index:2;color:var(--rule-strong);font-family:var(--disp);font-weight:800;font-size:20px;background:var(--surface);line-height:1}
@media (max-width:720px){.flow .step{flex:1 1 100%;border-left:none;border-top:1px solid var(--rule)}.flow .step:first-child{border-top:none}.flow .step .arrow{display:none}}

.doctrine{margin-top:24px;font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;
  font-size:clamp(20px,2.8vw,30px);text-wrap:balance;color:var(--ink)}
.doctrine .accentword{color:var(--accent)}

/* ---- Intersection formula ---- */
.formula{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;
  font-size:clamp(22px,3.4vw,40px);line-height:1.05;color:var(--ink);text-wrap:balance;margin-top:6px}
.formula .x{color:var(--accent);margin:0 .18em}

/* ---- Roles list (new places to go) ---- */
.roles{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.roles .r{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.1em;
  font-size:12.5px;color:var(--ink);border:1px solid var(--rule-strong);padding:9px 14px;background:var(--surface)}
.roles .r.hot{border-color:var(--accent);color:var(--accent-deep)}
.adecard{margin-top:26px;border:1px solid var(--rule);border-left:3px solid var(--accent);background:var(--surface);padding:26px}
.adecard .tag{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--accent)}
.adecard h3{margin:10px 0 12px}
.adecard p{font-size:16px;color:var(--ink-2);margin-bottom:12px}
.adecard p:last-child{margin-bottom:0}
.adecard b{color:var(--ink)}

/* ---- Build-your-own list ---- */
.wants{list-style:none;margin-top:10px;max-width:760px}
.wants li{position:relative;padding:14px 0 14px 30px;border-bottom:1px solid var(--rule);font-size:clamp(16px,1.9vw,19px);color:var(--ink-2)}
.wants li:first-child{border-top:1px solid var(--rule)}
.wants li::before{content:"";position:absolute;left:0;top:22px;width:14px;height:2px;background:var(--accent)}
.wants li b{color:var(--ink)}

/* ---- Toolbox chips ---- */
.toolbox{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.toolbox .t{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.1em;
  font-size:11.5px;color:var(--ink-2);border:1px solid var(--rule);padding:8px 12px;background:var(--surface)}

/* mobile: let station columns shrink below word width (prevents overflow) */
.sap-stages{grid-template-columns:repeat(4,minmax(0,1fr))}

/* command center: acronym + full-name reveal on light-up (JS-driven .lit) */
.crow .sys{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:68px;padding:12px 10px;text-align:center}
.crow .sys b{font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:14px;color:var(--ink-3);transition:color .4s ease}
.crow .sys small{display:block;font-family:var(--narrow);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:9px;line-height:1.18;color:var(--accent-deep);opacity:0;max-height:0;overflow:hidden;transition:opacity .4s ease,max-height .4s ease}
.crow .sys.lit{border-color:var(--accent);background:var(--surface);box-shadow:inset 0 0 0 1px rgba(229,178,58,.22)}
.crow .sys.lit b{color:var(--ink)}
.crow .sys.lit small{opacity:1;max-height:36px}
@media (prefers-reduced-motion:reduce){.crow .sys,.crow .sys b,.crow .sys small{transition:none}}

/* ---- Badge showcase (job-hunting look) ---- */
.badgeshow{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;margin:22px 0 8px;align-items:stretch}
@media(max-width:720px){.badgeshow{grid-template-columns:1fr}}
.bcard{border:1px solid var(--rule);background:var(--surface);padding:20px;display:flex;gap:16px;align-items:center}
.bcard .pfp{width:76px;height:76px;flex:0 0 76px;border:1px solid var(--accent);background:var(--ground);display:flex;align-items:center;justify-content:center;padding:9px}
.bcard .pfp img{width:100%;height:100%;object-fit:contain}
.bcard .who .nm{font-family:var(--disp);font-size:23px;line-height:1.05;letter-spacing:.01em;color:var(--ink);display:flex;align-items:center;gap:8px}
.bcard .who .nm .vf{font-size:12px;color:var(--go);letter-spacing:0}
.bcard .who .tt{font-family:var(--narrow);text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--ink-3);margin-top:5px}
.bcard .who .cred{margin-top:11px;display:inline-block;font-family:var(--narrow);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);border:1px solid var(--accent);padding:4px 9px}
.bframe{border:1px solid var(--rule);background:var(--ground);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 20px;gap:13px}
.bframe img{width:118px;height:auto}
.bframe figcaption{font-family:var(--narrow);font-size:13px;line-height:1.4;color:var(--ink-2);max-width:28ch;margin:0}
.jobdesk{border:1px solid var(--accent);background:var(--surface);padding:22px 24px;margin-top:26px}
.jobdesk .tag{font-family:var(--narrow);text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--accent-deep);margin-bottom:8px}
.jobdesk h3{font-family:var(--disp);font-size:26px;margin:0 0 10px;color:var(--ink)}
.jobdesk p{margin:0 0 14px}
.seats{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.seats .seat{font-family:var(--narrow);text-transform:uppercase;letter-spacing:.08em;font-size:12px;color:var(--ink-2);border:1px solid var(--rule-strong);padding:6px 11px}