:root{
  --bg:#f6f3ec; --paper:#fffdf8; --ink:#1a1c1f; --muted:#50555d; --faint:#8b9098;
  --line:#e0dacc; --rule:#1a1c1f; --amber:#e08700; --amber-deep:#a95f00;
  --ok:#177a4b; --warnc:#8f6400; --bad:#b93a32;
  --cond:"Barlow Condensed","Barlow",sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16.5px/1.62 Barlow,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
/* faint drafting grid on paper */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(26,28,31,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(26,28,31,.028) 1px,transparent 1px);
  background-size:56px 56px}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 26px}
.mono{font-family:var(--mono)}
h1,h2,h3,h4{margin:0}
.disp{font-family:var(--cond);font-weight:700;letter-spacing:-.01em;line-height:1.0}
.gt{color:var(--amber-deep)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* buttons — printed, not glowing */
.btn{display:inline-flex;align-items:center;gap:9px;border-radius:2px;padding:13px 22px;cursor:pointer;
  font:600 15px/1 Barlow;border:1px solid transparent;
  transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--ink);color:#fffdf8;border-color:var(--ink)}
.btn-primary:hover{background:#000}
.btn-line{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fffdf8}
.btn-lg{padding:15px 28px;font-size:16px}

/* header */
header{position:sticky;top:0;z-index:50;background:rgba(246,243,236,.96);border-bottom:1px solid var(--rule)}
nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:11px;font:600 19px/1 var(--cond);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.mark{width:32px;height:32px;border-radius:2px;background:var(--amber);display:grid;place-items:center}
.mark svg{width:18px;height:18px}
.tm{font-size:.55em;vertical-align:super;opacity:.55}
.navlinks{display:flex;gap:22px;font:500 14.5px/1 Barlow;color:var(--muted)}
.navlinks a:hover{color:var(--ink)}
.navcta{display:flex;align-items:center;gap:10px}
.navcta .btn{padding:10px 16px;font-size:13.5px}
@media(max-width:1090px){.navlinks{display:none}}
@media(max-width:640px){
  nav{height:56px}
  .brand{font-size:15px;gap:8px;letter-spacing:.04em}
  .brand .mark{width:26px;height:26px}.brand .mark svg{width:15px;height:15px}
  .navcta{gap:6px}
  .navcta .btn{padding:9px 11px;font-size:12px}
}
@media(max-width:400px){
  .brand{font-size:13.5px;gap:6px}
  .navcta .btn{padding:8px 8px;font-size:11.5px}
}

/* hero — ink on paper, no photo wash */
.hero{position:relative;border-bottom:1px solid var(--rule);overflow:hidden}
.hero .bgimg{display:none}
.hero-in{position:relative;display:grid;grid-template-columns:1.18fr .92fr;gap:56px;align-items:center;padding-top:76px;padding-bottom:72px}
.kicker{font:500 12.5px/1.5 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--amber-deep);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kicker::before{content:"";width:26px;height:2px;background:var(--amber)}
.hero h1{font-size:clamp(44px,6.6vw,86px);margin:20px 0 18px;max-width:13ch}
.hero h1 em{font-style:normal;color:var(--amber-deep)}
.hero .lead{color:var(--muted);font-size:clamp(17px,1.9vw,19.5px);max-width:56ch;margin:0 0 30px}
.hero .lead b{color:var(--ink);font-weight:600}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero .micro{margin-top:20px;color:var(--faint);font:400 14.5px/1.55 Barlow;max-width:52ch}
@media(max-width:920px){.hero-in{grid-template-columns:1fr;padding-top:56px;padding-bottom:52px}.traveler{max-width:560px}}

/* traveler — a printed shop document */
.traveler{background:var(--paper);border:1px solid var(--rule);border-radius:2px;
  box-shadow:8px 8px 0 rgba(26,28,31,.06)}
.tv-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--rule);
  font:600 12px/1 var(--mono);letter-spacing:.07em;color:var(--ink)}
.tv-head span:last-child{color:var(--faint)}
.tv-body{padding:16px}
.tv-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line);
  font:400 12.5px/1.55 var(--mono);color:var(--muted)}
.tv-row b{color:var(--ink);font-weight:600}
.tv-row .ok{color:var(--ok)}.tv-row .amb{color:var(--amber-deep)}
.tv-route{display:flex;gap:6px;padding:14px 0 4px;flex-wrap:wrap}
.tv-route span{font:500 11px/1 var(--mono);letter-spacing:.06em;padding:7px 10px;border:1px solid var(--line);border-radius:2px;color:var(--faint)}
.tv-route .done{border-color:var(--ok);color:var(--ok)}
.tv-route .now{border-color:var(--amber);color:var(--amber-deep);background:rgba(224,135,0,.08)}

/* record strip — static stamps, no marquee */
.ticker{border-bottom:1px solid var(--rule);background:var(--paper);overflow-x:auto;scrollbar-width:none}
.ticker::-webkit-scrollbar{display:none}
.ticker .inner{display:flex;width:max-content}
.ticker span{font:500 12px/1 var(--mono);letter-spacing:.04em;color:var(--faint);padding:13px 24px;border-right:1px solid var(--line);white-space:nowrap}
.ticker span b{color:var(--amber-deep);font-weight:500}

/* section chrome — drawing sheet */
.sec{border-bottom:1px solid var(--rule);padding:84px 0}
.sheetbar{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:40px;border-bottom:1px solid var(--rule);padding-bottom:13px}
.sheetbar .no{font:600 12px/1 var(--mono);letter-spacing:.11em;color:var(--ink)}
.sheetbar .rt{font:500 11.5px/1 var(--mono);letter-spacing:.1em;color:var(--faint);text-transform:uppercase}
.sec h2.disp{font-size:clamp(32px,4.3vw,52px);max-width:24ch}
.sec .sub{color:var(--muted);font-size:18px;max-width:66ch;margin:16px 0 0}
.sec .sub b{color:var(--ink);font-weight:600}

/* problem strip */
.problem{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;margin-top:8px}
.problem .plist{list-style:none;margin:0;padding:0}
.problem .plist li{display:flex;gap:14px;padding:13px 0;border-bottom:1px dashed var(--line);color:var(--muted);font-size:16px}
.problem .plist li .x{font-family:var(--mono);color:var(--bad);flex:none}
.problem .one{background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:28px;box-shadow:8px 8px 0 rgba(26,28,31,.05)}
.problem .one h3{font-family:var(--cond);font-weight:700;font-size:25px;margin-bottom:10px}
.problem .one p{color:var(--muted);margin:0;font-size:15.5px}
.problem .one .mono-tag{display:inline-block;margin-top:16px;font:500 11.5px/1 var(--mono);letter-spacing:.07em;color:var(--ok);border:1px solid var(--ok);border-radius:2px;padding:6px 9px}
@media(max-width:860px){.problem{grid-template-columns:1fr}}

/* modules — a ruled ledger, not cards */
.mods{display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px 30px;margin-top:8px}
.mod{border-top:2px solid var(--rule);padding:16px 0 0}
.mod .mno{font:500 11px/1 var(--mono);letter-spacing:.1em;color:var(--faint)}
.mod h3{font-family:var(--cond);font-weight:700;font-size:23px;margin:9px 0 6px;display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.mod h3 .st{font:600 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--amber-deep);border:1px solid var(--amber);border-radius:2px;padding:3px 6px;transform:translateY(-1px)}
.mod p{color:var(--muted);font-size:14.5px;line-height:1.58;margin:0 0 13px}
.mod .chips{display:flex;flex-wrap:wrap;gap:6px}
.mod .chips span{font:500 10.5px/1 var(--mono);letter-spacing:.04em;color:var(--faint);border:1px solid var(--line);background:var(--paper);border-radius:2px;padding:5px 8px}
@media(max-width:960px){.mods{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.mods{grid-template-columns:1fr}}
.modnote{margin-top:34px;color:var(--muted);font-size:16px;max-width:72ch}
.modnote b{color:var(--ink)}

/* the thread */
.thread{margin-top:8px;position:relative}
.step{display:grid;grid-template-columns:150px 1fr;gap:30px;padding:26px 0;border-bottom:1px dashed var(--line)}
.step .sn{font:600 12px/1.6 var(--mono);letter-spacing:.1em;color:var(--amber-deep)}
.step .sn small{display:block;color:var(--faint);font-weight:400;letter-spacing:.06em}
.step h3{font-family:var(--cond);font-weight:700;font-size:24px;margin:0 0 6px}
.step p{color:var(--muted);font-size:15.5px;margin:0;max-width:72ch}
.step .rec{display:inline-block;margin-top:12px;font:500 11.5px/1.7 var(--mono);color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:2px;padding:8px 12px}
.step .rec b{color:var(--amber-deep);font-weight:500}
@media(max-width:700px){.step{grid-template-columns:1fr;gap:8px}}

/* photo band — a full-bleed figure with its caption below, no wash */
.band{border-bottom:1px solid var(--rule);background:var(--paper)}
.band img{position:static;display:block;width:100%;height:auto;max-height:540px;object-fit:cover}
.band::after{display:none;content:none}
.band .bc{position:static;max-width:1180px;padding-top:24px;padding-bottom:34px}
.band .bc h3{font-family:var(--cond);font-weight:700;font-size:clamp(24px,3vw,32px);max-width:30ch;color:var(--ink)}
.band .bc p{color:var(--muted);font-size:16px;max-width:66ch;margin:8px 0 0}

/* quality split */
.qsplit{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:start;margin-top:8px}
.qsplit .checks{list-style:none;padding:0;margin:20px 0 0}
.qsplit .checks li{display:block;position:relative;padding:8px 0 8px 22px;color:var(--muted);font-size:15.5px}
.qsplit .checks li::before{content:"■";position:absolute;left:2px;top:14px;color:var(--amber);font-size:9px;line-height:1}
.qsplit .checks li b{color:var(--ink);font-weight:600}
.gate{background:var(--paper);border:1px solid var(--rule);border-radius:2px;overflow:hidden;box-shadow:8px 8px 0 rgba(26,28,31,.06)}
.gate-head{display:flex;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--rule);
  font:600 12px/1 var(--mono);letter-spacing:.07em;color:var(--ink)}
.gate-head span:last-child{color:var(--faint)}
.gate-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px dashed var(--line);
  font:400 12.5px/1.55 var(--mono);color:var(--muted)}
.gate-row .pill{font:600 10.5px/1 var(--mono);letter-spacing:.07em;border-radius:2px;padding:5px 8px;flex:none}
.gate-row .pass{color:var(--ok);border:1px solid var(--ok)}
.gate-row .warn{color:var(--warnc);border:1px solid var(--warnc)}
.gate-row .block{color:var(--bad);border:1px solid var(--bad)}
.gate-foot{padding:14px 16px;font:600 12.5px/1.5 var(--mono);letter-spacing:.05em;color:var(--bad)}
.gate-foot small{display:block;color:var(--faint);font-weight:400;letter-spacing:.02em;margin-top:4px}
.gate-foot.okf{color:var(--ok)}
.gate-foot.ambf{color:var(--amber-deep)}
.qnote{font-size:15px;color:var(--muted);border-left:2px solid var(--amber);padding-left:15px;margin-top:22px;max-width:60ch}
.qnote b{color:var(--ink)}
@media(max-width:880px){.qsplit{grid-template-columns:1fr}}

/* AI section */
.aihead{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;margin-top:8px}
.aihead p{color:var(--muted);font-size:16.5px;margin:0 0 14px;max-width:62ch}
.aihead p b{color:var(--ink);font-weight:600}
.posture{background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:22px;box-shadow:8px 8px 0 rgba(26,28,31,.05)}
.posture h4{font-family:var(--cond);font-weight:700;font-size:20px;margin-bottom:12px}
.posture ul{list-style:none;margin:0;padding:0}
.posture li{padding:8px 0;border-bottom:1px dashed var(--line);color:var(--muted);font-size:14.5px;display:flex;gap:10px}
.posture li:last-child{border-bottom:none}
.posture li::before{content:"▸";color:var(--amber-deep);flex:none}
.agents{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 30px;margin-top:38px}
.agent{border-top:1px solid var(--rule);padding-top:12px}
.agent b{display:block;font:600 12.5px/1.3 var(--mono);letter-spacing:.03em;color:var(--amber-deep);margin-bottom:6px}
.agent span{color:var(--muted);font-size:14px;line-height:1.55;display:block}
@media(max-width:880px){.aihead{grid-template-columns:1fr}.agents{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.agents{grid-template-columns:1fr}}

/* subs strip */
.subsgrid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;margin-top:8px}
.fvis{border:1px solid var(--rule);border-radius:2px;overflow:hidden;background:var(--paper);box-shadow:8px 8px 0 rgba(26,28,31,.06)}
.fvis img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.subsgrid .checks{list-style:none;padding:0;margin:18px 0 0}
.subsgrid .checks li{display:block;position:relative;padding:8px 0 8px 22px;color:var(--muted);font-size:15.5px}
.subsgrid .checks li::before{content:"■";position:absolute;left:2px;top:14px;color:var(--amber);font-size:9px;line-height:1}
@media(max-width:860px){.subsgrid{grid-template-columns:1fr}}

/* numbers */
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:8px}
.num{border-top:2px solid var(--rule);padding:18px 0 0}
.num .big{font:600 27px/1.25 var(--cond)}
.num .big i{font-style:normal;color:var(--amber-deep)}
.num p{color:var(--faint);font-size:14.5px;margin:10px 0 0}
@media(max-width:760px){.nums{grid-template-columns:1fr}}

/* founder */
.founder-sec{padding:84px 0;border-bottom:1px solid var(--rule);background:var(--paper)}
.founder-in{max-width:820px}
.founder-in p{font-size:clamp(18px,2.3vw,23px);line-height:1.55;color:var(--ink);margin:0 0 22px;font-weight:400}
.founder-in p b{color:var(--amber-deep);font-weight:600}
.founder-in .small{font-size:16.5px;color:var(--muted)}
.sig{margin-top:30px;padding-top:18px;border-top:1px solid var(--rule);font:500 13px/1.7 var(--mono);color:var(--faint)}
.sig b{color:var(--ink);font-weight:600;font-size:14px}

/* who for */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
.col{background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:30px}
.col.yes{box-shadow:8px 8px 0 rgba(224,135,0,.14)}
.col h4{font-family:var(--cond);font-weight:700;font-size:21px;margin:0 0 16px}
.col ul{list-style:none;margin:0;padding:0}
.col li{padding:9px 0;color:var(--muted);font-size:15.5px;display:flex;gap:11px;align-items:flex-start;border-bottom:1px dashed var(--line)}
.col li:last-child{border-bottom:none}
.col.yes li::before{content:"✓";color:var(--amber-deep);font-weight:700;flex:none}
.col.no li::before{content:"✕";color:var(--faint);flex:none;font-size:13px;line-height:1.7}
.anti{margin-top:30px;color:var(--muted);font-size:17px;max-width:76ch}
.anti b{color:var(--ink)}
@media(max-width:760px){.cols{grid-template-columns:1fr}}

/* terms */
.terms{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:8px}
.term{border-top:2px solid var(--rule);padding:16px 0 0}
.term h4{font-family:var(--cond);font-weight:700;font-size:21px;margin-bottom:8px}
.term p{color:var(--muted);font-size:15px;margin:0}
@media(max-width:760px){.terms{grid-template-columns:1fr}}

/* trade cards */
.trades{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
.trade{background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:28px;position:relative;display:block;
  transition:box-shadow .15s,transform .15s;box-shadow:5px 5px 0 rgba(26,28,31,.05)}
.trade:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 rgba(224,135,0,.22)}
.trade .tno{font:500 11px/1 var(--mono);letter-spacing:.1em;color:var(--faint)}
.trade h3{font-family:var(--cond);font-weight:700;font-size:27px;margin:12px 0 8px}
.trade p{color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 16px}
.trade .go{font:600 12px/1 var(--mono);letter-spacing:.09em;color:var(--amber-deep)}
.trade .go::after{content:" →"}
@media(max-width:760px){.trades{grid-template-columns:1fr}}

/* faq */
.qa{max-width:860px;margin-top:8px}
.q{border:1px solid var(--rule);border-radius:2px;margin-bottom:10px;background:var(--paper);overflow:hidden}
.q button{width:100%;text-align:left;background:none;border:none;color:var(--ink);font:600 16.5px/1.45 Barlow;padding:19px 52px 19px 20px;cursor:pointer;position:relative}
.q button::after{content:"+";position:absolute;right:19px;top:15px;color:var(--amber-deep);font-size:22px;font-weight:300;transition:.2s}
.q.open button::after{transform:rotate(45deg)}
.q .a{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--muted);font-size:15.5px;line-height:1.6}
.q.open .a{max-height:600px}
.q .a div{padding:0 20px 20px}

/* final — the one dark, photographic moment */
.final{padding:96px 0;border-bottom:1px solid var(--rule);text-align:left;position:relative;overflow:hidden;color:#fffdf8}
.final .bgimg{position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat}
.final .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,17,19,.93) 0 40%,rgba(16,17,19,.72))}
.final .wrap{position:relative}
.final h2{font-size:clamp(40px,6vw,72px);max-width:16ch;color:#fffdf8}
.final p{color:#c9cdd3;font-size:17.5px;max-width:56ch;margin:18px 0 30px}
.final .ctas{display:flex;gap:12px;flex-wrap:wrap}
.final .btn-primary{background:var(--amber);border-color:var(--amber);color:#1a1c1f}
.final .btn-primary:hover{background:#f19a14}
.final .btn-line{border-color:rgba(255,253,248,.55);color:#fffdf8}
.final .btn-line:hover{background:rgba(255,253,248,.14)}
.final .fnote{margin-top:20px;color:#9aa0a8;font-size:14.5px}
.final .fnote b{color:#c9cdd3}

/* footer — drawing title block, ink on paper */
footer{padding:0}
.tblock{display:grid;grid-template-columns:2fr 1.4fr 1.4fr 1fr;border-left:1px solid var(--rule);border-right:1px solid var(--rule);background:var(--paper)}
.tcell{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:18px 20px;min-height:86px}
.tcell:last-child{border-right:none}
.tcell .lbl{font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:9px}
.tcell .val{font:500 14.5px/1.55 Barlow;color:var(--muted)}
.tcell .val a{display:block;padding:2px 0}
.tcell .val a:hover{color:var(--ink)}
.tcell.brandcell .val{display:flex;align-items:center;gap:10px;color:var(--ink);font:600 17px/1 var(--cond);text-transform:uppercase;letter-spacing:.05em}
.fbottom{display:flex;justify-content:space-between;align-items:center;padding:20px 0 34px;color:var(--faint);font:400 12px/1.6 var(--mono);flex-wrap:wrap;gap:10px}
@media(max-width:860px){.tblock{grid-template-columns:1fr 1fr}.tcell:nth-child(2n){border-right:none}}

/* reveal — animates only when JS present */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s cubic-bezier(.2,.7,.2,1),transform .55s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(26,28,31,.55);display:none;align-items:center;justify-content:center;padding:20px;z-index:100}
.modal-bg.open{display:flex}
.modal{width:100%;max-width:440px;background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:30px;box-shadow:12px 12px 0 rgba(26,28,31,.18)}
.modal h3{font-family:var(--cond);font-weight:700;font-size:27px;margin:0 0 6px}
.modal p.sub{margin:0 0 18px;color:var(--muted);font-size:15px}
.modal label{display:block;font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin:14px 0 7px}
.modal input{width:100%;padding:12px 13px;border-radius:2px;border:1px solid var(--rule);background:#fff;color:var(--ink);font:400 15.5px/1.2 Barlow}
.modal input::placeholder{color:#a8adb4}
.modal .btn{width:100%;justify-content:center;margin-top:20px}
.modal .err{color:var(--bad);font-size:13px;margin-top:12px;min-height:16px}
.modal .x{float:right;background:none;border:none;color:var(--faint);cursor:pointer;font-size:24px;line-height:1;margin:-6px -4px 0 0}
.modal .x:hover{color:var(--ink)}
.modal .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.modal .priv{color:var(--faint);font-size:11.5px;line-height:1.5;margin:14px 0 0}
.modal .sent{text-align:center;padding:6px 0}
.modal .sent h3{margin:0 0 8px}.modal .sent p{color:var(--muted);font-size:15px;margin:0 0 6px}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none}
}
