/* ── Base ──────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
:root{
  --bg:#050509;
  --text:#f0f0ff;
  --dim:rgba(206,206,242,.64);
  --line:rgba(255,255,255,.09);
  --red:#ff2056;
  --c1:#38bdf8;--c2:#a78bfa;--c3:#ff2056;--c4:#34d399;--c5:#fb923c;
  --pad:clamp(20px,4vw,52px);
  --max:1200px;
}
body{background:var(--bg);color:var(--text);font-family:'Space Grotesk',sans-serif;font-size:15px;line-height:1.65;min-width:320px}

body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.02;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px}

/* ── Cursor ────────────────────────────────── */
#cd,#cr{display:none;position:fixed;pointer-events:none;z-index:9999;border-radius:50%;transform:translate(-50%,-50%)}
@media(pointer:fine){
  body{cursor:none}
  #cd{display:block;width:5px;height:5px;background:var(--red);box-shadow:0 0 8px var(--red)}
  #cr{display:block;width:28px;height:28px;border:1px solid rgba(255,32,86,.4);transition:all .18s}
  body.hov #cd{background:#fff;box-shadow:0 0 6px #fff}
  body.hov #cr{width:40px;height:40px;border-color:rgba(255,255,255,.4)}
}

/* ── Loader ────────────────────────────────── */
#loader{position:fixed;inset:0;z-index:9990;background:#000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;
  transition:opacity .4s,visibility .4s}
#loader.out{opacity:0;visibility:hidden}
#lLogo{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.5rem,6vw,4rem);letter-spacing:.18em;color:var(--text)}
#lTrack{width:min(240px,70vw);height:1px;background:rgba(255,255,255,.1)}
#lBar{height:100%;width:0;background:var(--red);box-shadow:0 0 6px var(--red);transition:width .08s linear}
#lPct{font-size:.6rem;letter-spacing:.22em;color:rgba(255,32,86,.55);margin-top:.4rem}
#loader::after{content:'';position:absolute;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,32,86,.4),transparent);
  animation:scan 2.2s linear infinite}
@keyframes scan{0%{top:0}100%{top:100%}}

/* ── Canvas ────────────────────────────────── */
#bgc{position:fixed;inset:0;z-index:0;pointer-events:none}

/* ── Nav ───────────────────────────────────── */
#nav{position:fixed;top:0;left:0;right:0;z-index:100;
  padding:.9rem var(--pad);display:flex;align-items:center;justify-content:space-between;
  transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
#nav.on{background:rgba(5,5,9,.92);backdrop-filter:blur(20px);border-color:var(--line)}
.nlogo{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;letter-spacing:.14em;color:var(--red);text-decoration:none}
.nlinks{display:flex;gap:1.8rem;list-style:none}
.nlinks a{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-decoration:none;transition:color .2s}
.nlinks a:hover{color:var(--text)}
.ncta{padding:.3rem .9rem;border:1px solid var(--red);border-radius:2px;color:var(--red)!important;transition:background .2s!important}
.ncta:hover{background:rgba(255,32,86,.1)!important}
#hbg{display:none;cursor:pointer;flex-direction:column;gap:5px}
#hbg span{display:block;width:20px;height:1.5px;background:var(--text);transition:.25s}
.mnav{display:none}
.mnav-sep{display:none}
@media(max-width:820px){
  .nlinks{display:none}
  #hbg{display:flex}
  .mnav{display:block;position:fixed;top:0;right:0;bottom:0;width:min(270px,80vw);
    background:rgba(5,5,15,.97);backdrop-filter:blur(20px);
    padding:5rem 2rem 2rem;z-index:99;border-left:1px solid var(--line);
    overflow-y:auto;overscroll-behavior:contain;
    transform:translateX(100%);transition:transform .25s}
  .mnav.on{transform:translateX(0)}
  .mnav-sep{display:block;margin:1.4rem 0 .2rem;color:var(--red);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase}
  .mnav a{display:flex;align-items:center;min-height:44px;padding:.6rem 0;font-size:.9rem;letter-spacing:.07em;color:var(--dim);text-decoration:none;border-bottom:1px solid var(--line)}
  .mov{display:none;position:fixed;inset:0;z-index:98}
  .mov.on{display:block}
}

/* ═══════════ HERO ═══════════ */
#hero{
  position:relative;min-height:100dvh;overflow:hidden;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  column-gap:clamp(2rem,5vw,6rem);
  padding:5.5rem var(--pad) 4rem;
}

.htext{
  position:relative;z-index:1;
  display:flex;flex-direction:column;
}

.hphoto{position:relative;z-index:1;
  height:clamp(420px,68vh,580px);
  overflow:hidden;border-radius:3px;align-self:center;
  box-shadow:-3px 0 0 var(--red),0 0 40px rgba(255,32,86,.13)}
.hphoto img{width:100%;height:100%;object-fit:cover;object-position:center 12%;
  filter:grayscale(100%) contrast(1.1) brightness(.78);display:block}
.hphoto::after{content:'';position:absolute;inset:0;z-index:2;
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.11) 0px,rgba(0,0,0,.11) 1px,transparent 1px,transparent 3px),
    linear-gradient(to right,rgba(5,5,9,.5) 0%,transparent 28%),
    linear-gradient(to top,rgba(5,5,9,.4) 0%,transparent 22%),
    linear-gradient(to bottom,rgba(5,5,9,.25) 0%,transparent 12%)}
.hphoto::before{content:'';position:absolute;inset:0;background:rgba(255,32,86,.10);z-index:3;mix-blend-mode:multiply}
.hbrow{font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--red);margin-bottom:1.4rem;
  display:flex;align-items:center;gap:.55rem}
.hbrow::before{content:'';display:block;width:1.4rem;height:1px;background:var(--red)}

.hname{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,7.5rem);
  line-height:.88;letter-spacing:.02em;
  margin-bottom:1rem;
}

.hrole{font-size:.92rem;color:var(--dim);min-height:1.5rem;margin-bottom:1.2rem}
.hrole #tw{color:var(--text)}
#cb{display:inline-block;width:2px;height:.85em;background:var(--red);margin-left:2px;vertical-align:middle;animation:blink .9s step-end infinite}
@keyframes blink{50%{opacity:0}}

/* ── Hero ex-badges ── */
.hcv{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1.8rem}
.hcv-ex{font-size:.56rem;letter-spacing:.07em;padding:.22rem .7rem;
  border:1px solid rgba(255,255,255,.1);border-radius:20px;
  color:var(--dim);background:rgba(255,255,255,.025)}

.havail{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1.8rem;
  font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.4rem .85rem;border:1px solid rgba(255,32,86,.35);border-radius:20px;
  background:rgba(255,32,86,.06);color:var(--dim)}
.havail strong{color:var(--text);font-weight:500}
.havail .dot{width:7px;height:7px;border-radius:50%;background:var(--red);
  box-shadow:0 0 8px var(--red);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

.hstats{display:flex;gap:0;margin-bottom:2rem;border:1px solid var(--line);border-radius:2px;overflow:hidden;width:fit-content}
.hstat{padding:.55rem 1rem;display:flex;flex-direction:column;gap:.15rem;border-right:1px solid var(--line)}
.hstat:last-child{border-right:none}
.sn{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;line-height:1;color:var(--text)}
.sl{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}

.hctas{display:flex;gap:.6rem;flex-wrap:wrap}
.bred{padding:.6rem 1.6rem;background:var(--red);color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:2px;transition:background .2s,box-shadow .2s}
.bred:hover{background:#d91545;box-shadow:0 0 20px rgba(255,32,86,.35)}
.bghost{padding:.6rem 1.6rem;border:1px solid var(--line);color:var(--text);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:2px;transition:border-color .2s}
.bghost:hover{border-color:rgba(255,255,255,.3)}

.scrl{position:absolute;bottom:2rem;left:var(--pad);display:flex;align-items:center;gap:.5rem;
  font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);
  animation:bob 2.5s ease-in-out infinite;z-index:2}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

@media(max-width:740px){
  #hero{grid-template-columns:1fr;padding-top:5rem}
  .hphoto{height:55vw;min-height:200px;max-height:320px;width:100%}
  .hname{font-size:clamp(3.2rem,12vw,5rem)}
  .hstats{width:100%}
  .hstat{flex:1;padding:.5rem .7rem}
}

/* ── Unicorn ── */
#unicorn{position:fixed;z-index:9998;pointer-events:none;display:none;
  filter:drop-shadow(0 0 12px rgba(255,32,86,.55))}
#unicorn.run{display:block;animation:unicornGallop 2.6s ease-in-out forwards}
@keyframes unicornGallop{
  0%  {transform:translateX(0) translateY(0)}
  15% {transform:translateX(14vw) translateY(-22px)}
  30% {transform:translateX(30vw) translateY(0)}
  48% {transform:translateX(48vw) translateY(-22px)}
  64% {transform:translateX(64vw) translateY(0)}
  80% {transform:translateX(80vw) translateY(-16px)}
  100%{transform:translateX(calc(100vw + 150px)) translateY(0)}
}
/* leg swing */
.uleg{transform-box:fill-box;transform-origin:50% 0}
.ubl1{animation:uleg .34s ease-in-out infinite alternate}
.ubl2{animation:uleg .34s ease-in-out infinite alternate-reverse}
.ufl1{animation:uleg .34s ease-in-out infinite alternate-reverse}
.ufl2{animation:uleg .34s ease-in-out infinite alternate}
@keyframes uleg{from{transform:rotate(-28deg)}to{transform:rotate(28deg)}}

/* ═══════════ SHARED ═══════════ */
.inner{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.cap{font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--dim)}
.bigtitle{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.4rem,2.2vw,2rem);letter-spacing:.04em;margin-top:.3rem}

/* ═══════════ LAB ═══════════ */
#lab{padding:5rem 0}
.lab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.2rem;margin-top:2.4rem}
.lab-card{display:flex;flex-direction:column;gap:.8rem;padding:1.8rem;background:var(--card);border:1px solid var(--border);border-radius:2px;text-decoration:none;color:inherit;transition:border-color .25s,box-shadow .25s;position:relative;overflow:hidden}
.lab-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,0,68,.04),transparent 60%);opacity:0;transition:opacity .3s}
.lab-card:hover{border-color:rgba(255,0,68,.3);box-shadow:0 0 28px rgba(255,0,68,.07)}
.lab-card:hover::before{opacity:1}
.lab-card-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.lab-card-name{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:.08em;color:var(--text)}
.lab-card-arrow{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red);white-space:nowrap;transition:transform .2s}
.lab-card:hover .lab-card-arrow{transform:translateX(4px)}
.lab-card-desc{font-size:.82rem;line-height:1.7;color:var(--dim);flex:1}
.lab-card-tags{display:flex;gap:.5rem;flex-wrap:wrap}
.lab-tag{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;padding:.2rem .6rem;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:2px;color:var(--dim2)}

/* ═══════════ QBR ═══════════ */
#qbr{padding:5rem 0;background:linear-gradient(180deg,transparent,rgba(255,32,86,.022) 50%,transparent);position:relative;z-index:1}
.qtag{display:inline-block;padding:.16rem .75rem;background:rgba(255,32,86,.1);border:1px solid rgba(255,32,86,.2);border-radius:2px;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:.8rem}
.qtitle{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.4rem,2.2vw,2rem);letter-spacing:.04em;margin-bottom:.6rem}
.qsub{font-size:.82rem;color:var(--dim);max-width:480px;line-height:1.65;margin-bottom:2rem}

/* ── QBR data sources ── */
.qsources{display:flex;align-items:center;gap:.6rem;margin-bottom:1.4rem;flex-wrap:wrap}
.qsrc-btn{display:flex;align-items:center;gap:.4rem;padding:.38rem 1rem;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:2px;color:var(--dim);font-size:.65rem;letter-spacing:.09em;text-transform:uppercase;font-family:inherit;cursor:pointer;transition:border-color .2s,color .2s}
.qsrc-btn:hover:not(:disabled){border-color:rgba(255,255,255,.22);color:var(--text)}
.qsrc-btn:disabled{opacity:.32;cursor:not-allowed}
.qsrc-badge{font-size:.5rem;padding:.1rem .38rem;background:rgba(255,32,86,.12);border:1px solid rgba(255,32,86,.22);border-radius:10px;color:var(--red);margin-left:.2rem;letter-spacing:.05em}
#qsrc-status{font-size:.62rem;color:var(--dim)}

/* ── QBR account selector ── */
.qacc-wrap{margin-bottom:1.2rem}
.qacc-wrap select{width:100%;max-width:500px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:2px;color:var(--text);font-family:inherit;font-size:.84rem;padding:.55rem .85rem;outline:none;cursor:pointer;transition:border-color .2s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(200,200,240,.35)' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center}
.qacc-wrap select:focus{border-color:rgba(255,32,86,.3)}
.qacc-wrap select option{background:#0d0d14}

/* ── QBR form grid ── */
.qform-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.7rem;margin-bottom:1rem}
.qf-wide{grid-column:span 2}
@media(max-width:700px){.qform-grid{grid-template-columns:1fr 1fr}.qf-wide{grid-column:span 2}}
@media(max-width:440px){.qform-grid{grid-template-columns:1fr}.qf-wide{grid-column:span 1}}
.qf label{display:block;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:.25rem}
.qf input,.qf select{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:2px;color:var(--text);font-family:inherit;font-size:.84rem;padding:.55rem .85rem;outline:none;transition:border-color .2s}
.qf input:focus,.qf select:focus{border-color:rgba(255,32,86,.3)}

/* ── QBR transcript ── */
.qtranscript-wrap{margin-bottom:1.2rem}
.qtrans-toggle{background:none;border:1px dashed rgba(255,255,255,.1);border-radius:2px;color:var(--dim);font-size:.65rem;letter-spacing:.08em;font-family:inherit;cursor:pointer;padding:.42rem 1rem;transition:border-color .2s,color .2s;display:flex;align-items:center;gap:.5rem}
.qtrans-toggle:hover{border-color:rgba(255,255,255,.2);color:var(--text)}
.qtrans-hint{opacity:.45;font-size:.58rem}
.qtrans-body{margin-top:.6rem;display:none}
.qtrans-body textarea{width:100%;min-height:100px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:2px;color:var(--text);font-family:inherit;font-size:.78rem;padding:.7rem .85rem;outline:none;resize:vertical;transition:border-color .2s;line-height:1.55}
.qtrans-body textarea:focus{border-color:rgba(255,32,86,.3)}

/* ── QBR output tabs ── */
.qout-wrap{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-top:1.4rem}
.qtabs{display:flex;overflow-x:auto;border-bottom:1px solid var(--line)}
.qtab{background:none;border:none;border-bottom:2px solid transparent;padding:.52rem 1.1rem;font-family:inherit;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);cursor:pointer;transition:color .2s,border-color .2s;white-space:nowrap;margin-bottom:-1px}
.qtab.on{color:var(--red);border-bottom-color:var(--red)}
.qtab:hover:not(.on){color:var(--text)}
.qtab-panel{display:none;padding:1.5rem}
.qtab-panel.on{display:block}
.qtab-panel h2{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin:1.4rem 0 .45rem}
.qtab-panel h2:first-child{margin-top:0}
.qtab-panel p{margin-bottom:.6rem;color:var(--dim)}
.qtab-panel ul,.qtab-panel ol{padding-left:1.2rem;margin-bottom:.6rem}
.qtab-panel li{margin-bottom:.22rem;color:var(--dim)}
.qtab-panel strong{color:var(--text);font-weight:600}
.qtab-panel table{width:100%;border-collapse:collapse;margin-bottom:.85rem;font-size:.78rem}
.qtab-panel th{text-align:left;padding:.38rem .6rem;border-bottom:1px solid var(--line);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.qtab-panel td{padding:.38rem .6rem;border-bottom:1px solid rgba(255,255,255,.03);color:var(--dim)}
.qloading{padding:2rem 1.5rem;color:var(--dim);font-size:.82rem;display:flex;align-items:center;gap:.4rem}
.qactions{display:flex;gap:.5rem;padding:.85rem 1.5rem;border-top:1px solid var(--line)}
.qact-btn{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:2px;color:var(--dim);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;font-family:inherit;cursor:pointer;padding:.32rem .85rem;transition:border-color .2s,color .2s}
.qact-btn:hover{border-color:rgba(255,255,255,.2);color:var(--text)}

.qrow{display:flex;align-items:center;gap:.9rem;margin-bottom:1rem;flex-wrap:wrap}
#qbtn{padding:.58rem 1.8rem;background:var(--red);color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border:none;border-radius:2px;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:background .2s,box-shadow .2s}
#qbtn:hover{background:#d91545;box-shadow:0 0 20px rgba(255,32,86,.35)}
#qbtn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}
#qst{font-size:.72rem;color:var(--dim)}
.scur{display:inline-block;width:2px;height:.85em;background:var(--red);margin-left:2px;vertical-align:middle;animation:blink .9s step-end infinite}
.qnote{font-size:.66rem;color:rgba(190,190,235,.46);text-align:center;margin-top:.9rem}

/* ═══════════ STORY ═══════════ */
#story{padding:5rem 0 1rem;position:relative;z-index:1}
.shd{padding:0 var(--pad);max-width:var(--max);margin:0 auto 3rem}

.ch{width:100%;border-top:1px solid var(--line);position:relative;overflow:hidden;
  border-left:2px solid var(--cc,transparent);
  opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
.ch.vis{opacity:1;transform:none}
.ch[data-c="1"]{--cc:var(--c1)}
.ch[data-c="2"]{--cc:var(--c2)}
.ch[data-c="3"]{--cc:var(--c3)}
.ch[data-c="4"]{--cc:var(--c4)}
.ch[data-c="5"]{--cc:var(--c5)}

/* ghost numeral */
.chN{position:absolute;right:-.02em;bottom:-.05em;
  font-family:'Bebas Neue',sans-serif;font-size:clamp(5rem,11vw,10rem);
  line-height:1;color:var(--cc);opacity:.035;pointer-events:none;user-select:none}

.chi{max-width:var(--max);margin:0 auto;padding:2.5rem var(--pad);position:relative;z-index:1}

.chm{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.6rem}
.chml{font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--cc);opacity:.7}
.chmy{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}

.chco{font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.8rem,3.2vw,3rem);
  line-height:.95;letter-spacing:.02em;
  padding-bottom:.8rem;border-bottom:1px solid var(--line);margin-bottom:1rem}

.chro{font-size:.8rem;color:var(--dim);margin-bottom:1.4rem;font-weight:400}

.chb{display:grid;grid-template-columns:1fr 140px;gap:2.5rem;align-items:start}
@media(max-width:640px){.chb{grid-template-columns:1fr;gap:1.5rem}.chm{flex-direction:column;gap:.2rem}}

.chone{font-size:.84rem;color:var(--dim);line-height:1.7;padding-left:1.1rem;border-left:1px solid var(--cc);margin-left:0}

.chst{text-align:right}
.chsn{display:block;font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.6rem,2.5vw,2.2rem);line-height:1;color:var(--cc);letter-spacing:.02em}
.chsl{display:block;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:.35rem;line-height:1.5}

.churn{display:flex;align-items:flex-end;justify-content:flex-end;gap:.35rem}
.churn-was{font-family:'Bebas Neue',sans-serif;font-size:1.1rem;line-height:1;color:var(--dim)}
.churn-arr{font-size:.85rem;color:var(--dim);padding-bottom:.1rem}
.churn-now{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.6rem,2.5vw,2.2rem);line-height:1;color:var(--c4)}

/* ═══════════ RED BREAK ═══════════ */
#redbreak{
  background:var(--red);
  padding:clamp(3rem,6vw,5rem) var(--pad);
  text-align:center;
  position:relative;z-index:1;
  overflow:hidden;
}
#redbreak::before{
  content:'';position:absolute;inset:0;opacity:.06;
  background:repeating-linear-gradient(90deg,transparent,transparent 60px,rgba(255,255,255,.5) 60px,rgba(255,255,255,.5) 61px);
}
.rbinner{max-width:820px;margin:0 auto;position:relative}
.rbline{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.8rem,4vw,3.2rem);
  color:#fff;line-height:1.1;letter-spacing:.02em;
}
.rbline + .rbline{margin-top:.4rem;opacity:.65}

/* ═══════════ ARTICLES ═══════════ */
#arts{padding:5rem 0;position:relative;z-index:1}
.ahd{margin-bottom:2rem}
.ftabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:1rem}
.ftab{padding:.22rem .8rem;border:1px solid var(--line);border-radius:20px;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);cursor:pointer;background:none;transition:border-color .2s,color .2s,background .2s}
.ftab:hover{border-color:rgba(255,32,86,.25);color:var(--text)}
.ftab.on{border-color:var(--red);color:var(--red);background:rgba(255,32,86,.05)}
.agrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.8rem}
.acard{padding:1.1rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.014);display:flex;flex-direction:column;gap:.55rem;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s;opacity:0;animation:aup .35s ease forwards}
.acard{transform:translateY(6px)}
.acard:hover{border-color:rgba(255,32,86,.18);transform:translateY(-2px)}
@keyframes aup{to{opacity:1;transform:translateY(0)}}
.atype{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:.35rem}
.atype::before{content:'';display:block;width:4px;height:4px;border-radius:50%;background:var(--red);flex-shrink:0}
.aflag{font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red);display:flex;align-items:center;gap:.3rem}
.atitle{font-size:.86rem;font-weight:500;line-height:1.45;color:var(--text)}
.ameta{font-size:.66rem;color:var(--dim);margin-top:auto}
.aempty{text-align:center;color:var(--dim);padding:2.5rem;font-size:.84rem}

/* ═══════════ CONTACT ═══════════ */
#cta{padding:5rem 0 4rem;background:linear-gradient(0deg,rgba(255,32,86,.02),transparent);position:relative;z-index:1}
.ctain{max-width:540px;margin:0 auto;padding:0 var(--pad);text-align:center}
.ctahead{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,4vw,3.2rem);letter-spacing:.03em;line-height:.92;margin-bottom:1rem}
.ctasub{font-size:.86rem;color:var(--dim);margin-bottom:2.5rem;line-height:1.7}
.clinks{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.clink{padding:.6rem 1.4rem;border:1px solid var(--line);border-radius:2px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);text-decoration:none;transition:border-color .2s,background .2s}
.clink:hover{border-color:rgba(255,32,86,.25);background:rgba(255,32,86,.04)}
.clink.prim{background:var(--red);border-color:var(--red);color:#fff}
.clink.prim:hover{background:#d91545;border-color:#d91545}

/* ═══════════ STACKS ═══════════ */
#stacks{padding:5rem 0;position:relative;z-index:1}
.stacksub{font-size:.84rem;color:var(--dim);max-width:500px;margin:.5rem 0 2rem;line-height:1.65}

.stabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1.6rem}
.stab{padding:.35rem 1.1rem;background:transparent;border:1px solid var(--line);
  border-radius:2px;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);cursor:pointer;font-family:inherit;transition:all .2s}
.stab:hover{border-color:rgba(255,255,255,.2);color:var(--text)}
.stab.on{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:var(--text)}

.srecipewrap{background:rgba(255,255,255,.016);border:1px solid rgba(255,255,255,.06);
  border-top:2px solid var(--scolor,var(--red));border-radius:8px;
  padding:1.2rem 1.5rem;margin-bottom:2rem;transition:border-color .4s}
.srlabel{font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--scolor,var(--red));margin-bottom:1rem;transition:color .4s}
.srecipe{display:flex;align-items:center;gap:.55rem;overflow-x:auto;
  scrollbar-width:none;padding-bottom:.1rem}
.srecipe::-webkit-scrollbar{display:none}
.srstep{flex-shrink:0;min-width:125px;background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);border-top:2px solid var(--scolor,var(--red));
  border-radius:6px;padding:.65rem .9rem;
  opacity:0;animation:srIn .35s ease forwards}
@keyframes srIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.srnum{font-size:.5rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--scolor,var(--red));margin-bottom:.2rem}
.srtool{font-family:'Bebas Neue',sans-serif;font-size:.95rem;letter-spacing:.04em;color:var(--text)}
.sraction{font-size:.59rem;color:var(--dim);margin-top:.1rem;line-height:1.35}
.srarrow{flex-shrink:0;color:var(--dim);opacity:.2;font-size:.7rem}

.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(242px,1fr));gap:.7rem}
.stcard{padding:1.1rem;border-radius:8px;
  background:linear-gradient(145deg,rgba(255,255,255,.03) 0%,rgba(255,255,255,.015) 100%);
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 2px 12px rgba(0,0,0,.35);
  display:flex;flex-direction:column;gap:.55rem;
  position:relative;overflow:hidden;cursor:pointer;
  transition:box-shadow .22s,transform .22s,border-color .22s,opacity .22s;
  opacity:0;animation:aup .3s ease forwards}
.stcard::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--cc,var(--red))}
.stcard:hover{box-shadow:0 8px 32px rgba(0,0,0,.5);transform:translateY(-3px);
  border-color:rgba(255,255,255,.13)}
.stcard.active{border-color:var(--cc,var(--red));transform:translateY(-2px);
  box-shadow:0 0 0 1px var(--cc,var(--red)),0 12px 40px rgba(0,0,0,.45)}
.stcard.dimmed{opacity:.25;transform:none!important;box-shadow:none!important}
.stcard.highlight{border-color:var(--cc,var(--red));transform:translateY(-2px);
  box-shadow:0 0 0 1px var(--cc,var(--red)),0 8px 28px rgba(0,0,0,.4)}
.stcard-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem}
.stcard-name{font-family:'Bebas Neue',sans-serif;font-size:1.08rem;letter-spacing:.04em;color:var(--text)}
.stcard-cat{font-size:.54rem;letter-spacing:.09em;text-transform:uppercase;
  padding:.15rem .5rem;border-radius:20px;
  background:var(--cc-bg,rgba(255,255,255,.05));border:1px solid var(--cc-brd,rgba(255,255,255,.08));
  color:var(--cc,var(--dim));white-space:nowrap;flex-shrink:0}
.stcard-desc{font-size:.79rem;color:var(--dim);line-height:1.58;flex:1}
.stcard-conn{display:flex;flex-wrap:wrap;gap:.28rem}
.stconn{font-size:.58rem;letter-spacing:.04em;padding:.12rem .45rem;
  border:1px solid rgba(255,255,255,.07);border-radius:20px;
  color:rgba(200,200,240,.28);cursor:pointer;
  transition:color .15s,border-color .15s,background .15s}
.stconn:hover{color:var(--cc,var(--red));border-color:var(--cc,var(--red));background:rgba(255,255,255,.04)}
.stcard-detail{max-height:0;overflow:hidden;
  transition:max-height .35s ease,padding-top .35s ease}
.stcard.active .stcard-detail{max-height:160px;padding-top:.75rem}
.stcard-uselabel{font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cc,var(--red));margin-bottom:.4rem;display:flex;align-items:center;gap:.4rem}
.stcard-uselabel::before{content:'';display:block;width:.8rem;height:1px;background:var(--cc,var(--red))}
.stcard-use{font-size:.78rem;color:rgba(200,200,240,.58);line-height:1.65;
  border-left:1px solid rgba(255,255,255,.07);padding-left:.75rem}

/* ── QBR single input row ── */
.qinput-row{display:flex;gap:.6rem;align-items:flex-end;margin-bottom:.75rem;flex-wrap:wrap}
.qinput-row .qf{flex:1;min-width:240px}
.qinput-row input{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:2px;color:var(--text);font-family:inherit;font-size:1rem;padding:.65rem 1rem;outline:none;transition:border-color .2s}
.qinput-row input:focus{border-color:rgba(255,32,86,.4)}
.qacc-simple{width:100%;max-width:420px;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:2px;color:var(--dim);font-family:inherit;font-size:.76rem;padding:.42rem .85rem;outline:none;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(200,200,240,.25)' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center;transition:border-color .2s}
.qacc-simple:focus{border-color:rgba(255,255,255,.2)}
.qacc-simple option{background:#0d0d14}

/* ── Pipeline animation ── */
.qpipeline{display:none;margin:1.6rem 0}
.qpipeline.show{display:block}
.qpipe-steps{position:relative;padding-left:1.6rem}
.qpipe-steps::before{content:'';position:absolute;left:6px;top:12px;bottom:12px;width:1px;background:var(--line)}
.qpipe-step{position:relative;display:flex;align-items:baseline;gap:.7rem;padding:.32rem 0;opacity:0;transform:translateY(5px);transition:opacity .28s ease,transform .28s ease}
.qpipe-step.show{opacity:1;transform:none}
.qpipe-dot{position:absolute;left:-1.6rem;top:.42rem;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);transition:background .25s,border-color .25s,box-shadow .25s;flex-shrink:0}
.qpipe-step.active .qpipe-dot{background:var(--red);border-color:var(--red);box-shadow:0 0 6px rgba(255,32,86,.5);animation:pulse 1s ease-in-out infinite}
.qpipe-step.done .qpipe-dot{background:var(--c4);border-color:var(--c4);box-shadow:none;animation:none}
.qpipe-tool{font-size:.7rem;font-weight:600;color:var(--text);min-width:88px;letter-spacing:.02em}
.qpipe-label{font-size:.68rem;color:var(--dim);flex:1}
.qpipe-step.active .qpipe-label{color:var(--text)}
.qpipe-result{font-size:.62rem;color:var(--c4);margin-left:auto;opacity:0;transition:opacity .3s;white-space:nowrap;padding-left:.5rem}
.qpipe-step.done .qpipe-result{opacity:1}

/* ── QBR Intel preview ── */
.qintel-wrap{background:rgba(255,255,255,.025);border:1px solid var(--line);border-left:2px solid var(--c1);border-radius:2px;padding:.65rem 1.1rem;margin-bottom:1rem;animation:aup .25s ease}
.qintel-head{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;color:var(--c1);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.qintel-head::before{content:'';display:block;width:.45rem;height:.45rem;border-radius:50%;background:var(--c1);animation:pulse 1.5s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.qintel-row{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.qintel-item{display:flex;flex-direction:column;gap:.06rem;min-width:120px;max-width:220px}
.qintel-lbl{font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.qintel-val{font-size:.72rem;color:var(--text);line-height:1.4}
.qintel-loading{font-size:.72rem;color:var(--dim);font-style:italic}

/* ── QBR production note ── */
.qpro-note{font-size:.64rem;color:rgba(190,190,235,.46);margin-top:.25rem;display:flex;align-items:center;gap:.4rem;line-height:1.5}
.qpro-dot{display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--c4);flex-shrink:0}

/* ── Post-gen CTA ── */
.qgen-cta{margin-top:1.2rem;padding:.9rem 1.2rem;background:rgba(255,32,86,.04);border:1px solid rgba(255,32,86,.12);border-radius:2px;display:none;animation:aup .3s ease}
.qgen-cta.show{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.qgen-cta-text{font-size:.76rem;color:var(--dim);line-height:1.55}
.qgen-cta-text strong{color:var(--text)}
.qgen-cta-btn{flex-shrink:0;padding:.45rem 1.2rem;background:var(--red);color:#fff;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:2px;white-space:nowrap;transition:background .2s}
.qgen-cta-btn:hover{background:#d91545}

/* ═══════════ FOOTER ═══════════ */
footer{padding:1.4rem var(--pad);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;font-size:.62rem;letter-spacing:.05em;color:rgba(180,180,220,.22);position:relative;z-index:1}
footer a{color:rgba(255,32,86,.4);text-decoration:none}
footer a:hover{color:var(--red)}

/* ═══════════ REVEAL ═══════════ */
.rev{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
.rev.vis{opacity:1;transform:none}

/* ═══════════ PLAYBOOKS — AI BUILD LOADOUTS ═══════════ */
.playbook-quest{--card:rgba(255,255,255,.035);--cyan:var(--c1);--violet:var(--c2);--green:var(--c4);--amber:var(--c5);padding:5rem 0}
.playbook-quest,.playbook-quest *,.playbook-quest *::before,.playbook-quest *::after{box-sizing:border-box}
.playbook-quest button{font:inherit;cursor:pointer}
.quest-head{display:flex;justify-content:space-between;align-items:end;gap:1.4rem;margin-bottom:1.4rem}
.quest-head h1{margin:.15rem 0 0;font-family:'Bebas Neue',sans-serif;font-size:5rem;line-height:.9;letter-spacing:.04em}
.quest-head p{max-width:640px;margin:.85rem 0 0;color:var(--dim);font-size:.88rem;line-height:1.7}
.quest-score{min-width:180px;padding:.8rem 1rem;border:1px solid rgba(255,32,86,.22);border-radius:3px;background:rgba(255,32,86,.06);text-align:right}
.quest-score span{display:block;color:var(--dim);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase}
.quest-score strong{display:block;margin-top:.2rem;color:var(--red);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase}
.loadout-stage{display:grid;gap:1rem}
.quest-console{display:grid;gap:1rem;padding:1.1rem;border:1px solid rgba(255,32,86,.22);border-top:2px solid var(--red);border-radius:3px;background:linear-gradient(135deg,rgba(255,32,86,.06),transparent 45%),rgba(255,255,255,.03)}
.quest-console h2{margin:.2rem 0 0;font-family:'Bebas Neue',sans-serif;font-size:3.2rem;line-height:.95;letter-spacing:.04em}
.quest-input{width:100%;min-height:112px;padding:.95rem 1rem;border:1px solid var(--line);border-radius:3px;background:rgba(0,0,0,.26);color:var(--text);font:inherit;line-height:1.55;resize:vertical;outline:2px solid transparent;outline-offset:2px}
.quest-input:focus{border-color:rgba(255,32,86,.5);box-shadow:0 0 0 2px rgba(255,32,86,.12)}
.quest-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.quest-run{min-height:38px;padding:.55rem 1.1rem;border-radius:2px;font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--red);background:var(--red);color:#fff}
.quest-run:disabled{cursor:progress;opacity:.72}
.quest-run:focus-visible,.loadout-cta:focus-visible,.example-row button:focus-visible,.loadout:focus-visible,.mini-choice:focus-visible,.ai-choice:focus-visible{outline:2px solid rgba(56,189,248,.75);outline-offset:2px}
.detected{color:var(--dim);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}
.detected strong{color:var(--text)}
.interpretation{padding:.7rem .85rem;border:1px dashed rgba(255,255,255,.14);border-radius:3px;background:rgba(0,0,0,.18);color:var(--dim);font-size:.76rem;line-height:1.55}
.ai-status{padding:.62rem .75rem;border:1px solid rgba(255,255,255,.13);border-radius:3px;background:rgba(255,255,255,.035);color:var(--dim);font-size:.72rem;line-height:1.5}
.ai-status.ok{border-color:rgba(52,211,153,.28);color:rgba(196,245,222,.86)}
.ai-status.warn{border-color:rgba(251,146,60,.32);color:rgba(255,214,180,.86)}
.ai-status.busy{border-color:rgba(56,189,248,.32);color:rgba(190,231,255,.88)}
.quest-run[aria-busy="true"]{border-color:rgba(56,189,248,.55);background:rgba(56,189,248,.16);color:rgba(210,240,255,.95)}
.copy-notice{padding:.62rem .75rem;border:1px solid rgba(52,211,153,.32);border-radius:3px;background:rgba(52,211,153,.07);color:rgba(196,245,222,.9);font-size:.72rem;font-weight:600;line-height:1.5}
.example-row{display:flex;gap:.5rem;flex-wrap:wrap}
.example-row button{padding:.36rem .7rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.03);color:var(--dim);font-size:.66rem}
.example-row button:hover{border-color:rgba(255,255,255,.26);color:var(--text)}
.quest-brief{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.025)}
.quest-brief h3{margin:0;font-size:1rem}
.quest-brief p{margin:.35rem 0 0;color:var(--dim);font-size:.82rem;line-height:1.6}
.reward{display:grid;gap:.1rem;min-width:138px;text-align:right}
.reward span{color:var(--dim);font-size:.54rem;letter-spacing:.16em;text-transform:uppercase}
.reward strong{color:var(--green);font-family:'Bebas Neue',sans-serif;font-size:1.55rem;letter-spacing:.04em}
.loadout-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.loadout{min-height:310px;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:.75rem;padding:1rem;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:3px;background:rgba(255,255,255,.032);color:var(--text);text-align:left;transition:border-color .2s,transform .2s,background .2s}
.loadout:hover,.loadout.on{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.06);transform:translateY(-2px)}
.loadout.on{box-shadow:0 0 0 1px rgba(255,32,86,.8),0 0 28px rgba(255,32,86,.08)}
.loadout-head{display:flex;justify-content:space-between;gap:1rem;align-items:start}
.loadout h3{margin:0;font-family:'Bebas Neue',sans-serif;font-size:1.55rem;letter-spacing:.04em}
.badge{white-space:nowrap;padding:.16rem .55rem;border:1px solid rgba(255,255,255,.12);border-radius:20px;color:var(--dim);font-size:.52rem;letter-spacing:.12em;text-transform:uppercase}
.loadout p{margin:0;color:var(--dim);font-size:.78rem;line-height:1.6}
.tool-row{display:flex;flex-wrap:wrap;gap:.4rem}
.tool-row span{padding:.22rem .55rem;border:1px solid rgba(255,255,255,.1);border-radius:2px;background:rgba(255,255,255,.04);font-size:.62rem;color:rgba(240,240,255,.85)}
.moves{margin:0;padding-left:1.1rem;color:var(--dim);font-size:.76rem;line-height:1.55}
.moves li+li{margin-top:.24rem}
.loadout-cta{display:inline-flex;justify-content:center;align-items:center;min-height:34px;border:1px solid rgba(255,32,86,.38);border-radius:2px;background:rgba(255,32,86,.08);color:var(--red);font-size:.62rem;font-weight:600;letter-spacing:.12em;text-decoration:none;text-transform:uppercase}
.selected-plan{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.025)}
.selected-plan span{color:var(--red);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase}
.selected-plan h3{margin:.2rem 0;font-family:'Bebas Neue',sans-serif;font-size:1.6rem;letter-spacing:.04em}
.selected-plan p{max-width:680px;margin:0;color:var(--dim);font-size:.82rem;line-height:1.55}
.work-choice-panel{display:grid;gap:1rem;padding:1rem 1.1rem;border:1px solid rgba(52,211,153,.22);border-top:2px solid var(--green);border-radius:3px;background:linear-gradient(135deg,rgba(52,211,153,.06),transparent 46%),rgba(255,255,255,.025)}
.work-choice-panel h3{margin:.2rem 0 0;font-family:'Bebas Neue',sans-serif;font-size:1.65rem;letter-spacing:.04em}
.work-choice-panel p{margin:.35rem 0 0;color:var(--dim);font-size:.78rem;line-height:1.55}
.choice-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}
.choice-label{display:block;margin-bottom:.45rem;color:var(--green);font-size:.56rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.mini-choice-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.mini-choice{min-height:66px;display:grid;align-content:center;gap:.16rem;padding:.65rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.032);color:var(--text);text-align:left}
.mini-choice:hover,.mini-choice.on{border-color:rgba(52,211,153,.68);background:rgba(52,211,153,.08)}
.mini-choice b{font-size:.78rem}
.mini-choice span{color:var(--dim);font-size:.56rem;letter-spacing:.09em;text-transform:uppercase}
.blueprint-panel{display:grid;gap:1rem;padding:1rem 1.1rem;border:1px solid rgba(167,139,250,.24);border-top:2px solid var(--violet);border-radius:3px;background:linear-gradient(135deg,rgba(167,139,250,.07),transparent 48%),rgba(255,255,255,.025)}
.blueprint-head{display:flex;justify-content:space-between;align-items:start;gap:1rem}
.blueprint-head h3{margin:.2rem 0 0;font-family:'Bebas Neue',sans-serif;font-size:1.8rem;letter-spacing:.04em}
.blueprint-head p{max-width:620px;margin:.35rem 0 0;color:var(--dim);font-size:.82rem;line-height:1.55}
.reward-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(167,139,250,.18);border-bottom:1px solid rgba(167,139,250,.18)}
.reward-strip div{min-width:0;padding:.75rem .9rem}
.reward-strip div+div{border-left:1px solid rgba(167,139,250,.18)}
.reward-strip span{display:block;color:var(--violet);font-size:.54rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.reward-strip strong{display:block;margin-top:.18rem;overflow:hidden;color:var(--text);font-size:.86rem;text-overflow:ellipsis;white-space:nowrap}
.ai-choice-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}
.ai-choice{min-height:72px;display:grid;align-content:center;gap:.18rem;padding:.75rem;border:1px solid var(--line);border-radius:3px;background:rgba(255,255,255,.032);color:var(--text);text-align:left}
.ai-choice:hover,.ai-choice.on{border-color:rgba(167,139,250,.7);background:rgba(167,139,250,.08)}
.ai-choice b{font-size:.86rem}
.ai-choice span{color:var(--dim);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase}
.blueprint-preview{border:1px solid rgba(255,255,255,.1);border-radius:3px;background:rgba(0,0,0,.35);overflow:hidden}
.blueprint-preview-head{display:flex;justify-content:space-between;gap:1rem;padding:.7rem .85rem;border-bottom:1px solid rgba(255,255,255,.08);color:var(--dim);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase}
.blueprint-preview-head strong{overflow:hidden;color:var(--violet);font-size:.56rem;text-overflow:ellipsis;white-space:nowrap}
.blueprint-box{max-height:380px;overflow:auto;margin:0;padding:1rem;border:0;background:transparent;color:rgba(240,240,255,.86);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:.74rem;line-height:1.6;white-space:pre-wrap}
@media(max-width:1040px){.loadout-grid{grid-template-columns:1fr}}
@media(max-width:720px){
  .playbook-quest{padding:3.5rem 0}
  .quest-head,.quest-brief{grid-template-columns:1fr}
  .quest-head{display:grid}
  .quest-head h1{font-size:3.2rem}
  .quest-console h2{font-size:2.35rem}
  .quest-score,.reward{text-align:left}
  .selected-plan{display:grid}
  .choice-columns,.mini-choice-row{grid-template-columns:1fr}
  .blueprint-head{display:grid}
  .ai-choice-row{grid-template-columns:1fr}
  .reward-strip{grid-template-columns:1fr}
  .reward-strip div+div{border-top:1px solid rgba(167,139,250,.18);border-left:0}
}

/* ── UI audit fixes ─────────────────────────── */

/* Blueprint collapse (keeps the Playbooks section from dominating the page) */
.blueprint-actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.loadout-cta.ghost{border-color:rgba(167,139,250,.42);background:rgba(167,139,250,.08);color:var(--c2)}
.loadout-cta.ghost:hover{border-color:rgba(167,139,250,.75);background:rgba(167,139,250,.14)}
.blueprint-hint{margin:0;color:var(--dim);font-size:.78rem;line-height:1.55}

/* Tap targets: comfortable on touch, unchanged density on desktop */
.example-row button{min-height:40px;padding:.4rem .8rem;cursor:pointer}
.ftab{min-height:40px;padding:.3rem 1rem;display:inline-flex;align-items:center}
.loadout-cta{padding:.35rem .9rem}

@media(pointer:coarse){
  .example-row button,.ftab{min-height:44px}
  .qact-btn,.qsrc-btn,.qtab{min-height:44px;display:inline-flex;align-items:center}
  .ai-choice,.mini-choice{min-height:56px}
}

/* Articles: cap the homepage wall, reveal the rest on demand */
.arts-more{display:flex;justify-content:center;margin-top:1.8rem}
.arts-more button{min-height:44px;padding:.5rem 1.6rem;border:1px solid var(--line);border-radius:2px;
  background:rgba(255,255,255,.03);color:var(--text);font-family:inherit;font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .2s,background .2s}
.arts-more button:hover{border-color:rgba(255,32,86,.45);background:rgba(255,32,86,.06)}

/* Mobile Playbooks order: pick a loadout, see the pick, then advanced controls */
@media(max-width:720px){
  .loadout-stage>.quest-console{order:1}
  .loadout-stage>.quest-brief{order:2}
  .loadout-stage>.loadout-grid{order:3}
  .loadout-stage>.selected-plan{order:4}
  .loadout-stage>.blueprint-panel{order:5}
  .loadout-stage>.work-choice-panel{order:6}
  .blueprint-actions{width:100%}
  .blueprint-actions .loadout-cta{flex:1}
}

/* ── Announcement bar ───────────────────────── */
:root{--announce-h:36px}
#announce{position:fixed;top:0;left:0;right:0;z-index:101;height:var(--announce-h);
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  padding:0 var(--pad);
  background:linear-gradient(90deg,rgba(255,32,86,.18),rgba(167,139,250,.16) 55%,rgba(255,32,86,.14));
  border-bottom:1px solid rgba(255,32,86,.28);
  backdrop-filter:blur(20px);
  font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text);
  text-align:center;line-height:1.2;text-decoration:none;
  transition:background .25s}
#announce:hover{background:linear-gradient(90deg,rgba(255,32,86,.26),rgba(167,139,250,.22) 55%,rgba(255,32,86,.2))}
#announce:hover .an-soon{border-color:rgba(255,255,255,.4);color:var(--text)}
#announce .an-dot{width:6px;height:6px;border-radius:50%;background:var(--red);
  box-shadow:0 0 8px var(--red);animation:pulse 2s ease-in-out infinite;flex-shrink:0}
#announce b{font-family:'Bebas Neue',sans-serif;font-size:.92rem;letter-spacing:.14em;color:var(--red);font-weight:400}
#announce .an-soon{padding:.1rem .5rem;border:1px solid rgba(255,255,255,.22);border-radius:20px;
  font-size:.56rem;letter-spacing:.14em;color:var(--dim);white-space:nowrap}

/* Everything fixed/offset shifts down by the bar height */
#nav{top:var(--announce-h)}
#hero{padding-top:calc(5.5rem + var(--announce-h))}
.mnav{padding-top:calc(5rem + var(--announce-h))}

@media(max-width:600px){
  :root{--announce-h:52px}
  #announce{flex-wrap:wrap;gap:.35rem;font-size:.58rem;padding:.3rem var(--pad)}
  #announce b{font-size:.82rem}
}

/* ── Redesign v2: AI-Ops job-search focus ───── */

/* Hero value sentence */
.hval{color:var(--dim);font-size:.98rem;line-height:1.6;max-width:46ch;margin:.2rem 0 1.4rem}
.hval strong{color:var(--text);font-weight:600}

/* "Open to roles" availability — green status, distinct from red brand accent */
.havail.avail-open{border-color:rgba(52,211,153,.4);background:rgba(52,211,153,.07)}
.havail.avail-open .dot{background:var(--c4);box-shadow:0 0 8px var(--c4)}

/* Proof of Work intro band */
#work{padding:clamp(3.5rem,8vw,5.5rem) 0 0}
.work-intro{max-width:760px}
.work-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,5vw,3.2rem);
  letter-spacing:.02em;line-height:.98;margin:.6rem 0 0;text-wrap:balance}
.work-sub{color:var(--dim);font-size:.96rem;line-height:1.6;max-width:52ch;margin:1rem 0 0}

/* ── QBR pinned scorecard banner ────────────── */
.qbanner{margin:1.4rem 0 0;padding:1.1rem 1.2rem 1.2rem;border:1px solid rgba(167,139,250,.28);
  border-top:2px solid var(--c2);border-radius:3px;
  background:linear-gradient(135deg,rgba(167,139,250,.07),transparent 52%),rgba(255,255,255,.025)}
.qbanner p{margin:0;color:var(--text);font-size:.9rem;line-height:1.55}
.qbanner p strong{color:var(--c2)}
.qbanner p + p{margin-top:.2rem}
/* one-liner first, Monday move last, scorecard in the middle */
.qbanner p:last-child{color:var(--dim);font-size:.84rem;margin-top:.7rem}
.qbanner p:last-child strong{color:var(--red)}
/* scorecard table -> 4 stat tiles */
.qbanner table{width:100%;border-collapse:collapse;table-layout:fixed;margin:.9rem 0}
.qbanner thead th{padding:.1rem .5rem .45rem;border:0;border-right:1px solid rgba(167,139,250,.16);
  text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.5rem;letter-spacing:.11em;text-transform:uppercase;color:var(--c2);font-weight:600;vertical-align:bottom}
.qbanner tbody td{padding:.15rem .5rem 0;border:0;border-right:1px solid rgba(167,139,250,.16);
  text-align:center;font-family:'Bebas Neue',sans-serif;font-size:1.55rem;letter-spacing:.03em;
  color:var(--text);font-variant-numeric:tabular-nums;line-height:1.05;word-break:break-word}
.qbanner thead th:last-child,.qbanner tbody td:last-child{border-right:0}
@media(max-width:520px){
  /* keep the 4-column label-above-value pairing; just tighten */
  .qbanner thead th{font-size:.44rem;letter-spacing:.06em;padding:.1rem .3rem .4rem}
  .qbanner tbody td{font-size:1.15rem;padding:.15rem .3rem 0}
}