/* Kravos Concept — hand-built stylesheet, no framework, no build step.
   Modern, airy, light on the eye. Sharp corners. Doppio One headings,
   Manrope + Roboto for everything else. */

:root{
  --red:#E01F26;
  --red-ink:#B0141A;
  --ink:#191714;
  --ink-soft:#5c574f;
  --ink-faint:#8a8479;
  --paper:#FCFBF8;
  --tint:#F5F1EA;
  --line:#E6E1D6;
  --white:#fff;
  --wrap:1200px;
  --gut:clamp(22px,6vw,72px);
  --band:clamp(84px,14vw,190px);
  --ease:cubic-bezier(.22,1,.36,1);
  --hd:"Doppio One","Roboto Slab",Georgia,serif;
  --bd:"Manrope","Roboto",system-ui,Segoe UI,Helvetica,Arial,sans-serif;
  --ui:"Roboto","Manrope",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;border-radius:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--bd);font-size:18px;line-height:1.72;font-weight:400;letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
@media (min-width:900px){body{font-size:19px}}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-family:var(--hd);font-weight:400;line-height:1.12;letter-spacing:-.01em}
p{margin:0}
strong{font-weight:700;color:var(--ink)}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}

/* ---------- primitives ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.band{padding:var(--band) 0}
.band--tint{background:var(--tint)}
.band--ink{background:var(--ink);color:#efe9df}
.band--ink .eyebrow{color:#fff}
.band--ink .muted{color:#c3bbac}
.band--ink .lead{color:#c3bbac}
.band--ink .checks li span{color:#c3bbac}
.band--ink strong{color:#fff}
.stack>*+*{margin-top:22px}
.measure{max-width:60ch}
.measure-s{max-width:46ch}
.center{text-align:center;margin-inline:auto}

.eyebrow{
  font-family:var(--ui);font-weight:700;text-transform:uppercase;
  letter-spacing:.2em;font-size:.72rem;color:var(--red);
  display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow::before{content:"";width:22px;height:2px;background:currentColor;opacity:.9}
.eyebrow.center{justify-content:center}

.t-hero{font-size:clamp(2.5rem,6.6vw,5rem);line-height:1.04}
.t-xl{font-size:clamp(2rem,4.6vw,3.4rem)}
.t-lg{font-size:clamp(1.6rem,3.2vw,2.3rem)}
.t-md{font-size:clamp(1.2rem,2vw,1.5rem)}
.lead{font-size:clamp(1.08rem,1.7vw,1.32rem);color:var(--ink-soft);line-height:1.6}
.muted{color:var(--ink-soft)}
.tiny{font-family:var(--ui);font-size:.8rem;letter-spacing:.02em;color:var(--ink-faint)}
.kicker-num{font-family:var(--hd);color:var(--red);font-size:1rem;letter-spacing:0}

/* ---------- buttons ---------- */
.btn{
  --bg:var(--red);--fg:#fff;--bd:var(--red);
  display:inline-flex;align-items:center;gap:.65em;
  font-family:var(--ui);font-weight:700;font-size:.92rem;letter-spacing:.02em;
  background:var(--bg);color:var(--fg);border:1.5px solid var(--bd);
  padding:16px 26px;cursor:pointer;transition:transform .3s var(--ease),background .2s,color .2s,border-color .2s;
}
.btn svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:hover svg{transform:translateX(4px)}
.btn--primary:hover{--bg:var(--red-ink);--bd:var(--red-ink)}
.btn--ghost{--bg:transparent;--fg:var(--ink);--bd:var(--line)}
.btn--ghost:hover{--bg:var(--ink);--fg:#fff;--bd:var(--ink)}
.btn--light{--bg:transparent;--fg:#fff;--bd:rgba(255,255,255,.45)}
.btn--light:hover{--bg:#fff;--fg:var(--ink);--bd:#fff}
.btn--lg{padding:19px 34px;font-size:1rem}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}
.textlink{font-family:var(--ui);font-weight:700;font-size:.9rem;color:var(--red);
  border-bottom:1.5px solid currentColor;padding-bottom:2px}
.textlink:hover{color:var(--red-ink)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:70;background:color-mix(in srgb,var(--paper) 90%,transparent);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:transform .4s var(--ease)}
.hdr.hide{transform:translateY(-102%)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:18px;height:72px}
.hdr__logo img{height:24px;width:auto;display:block}
.hdr__nav{display:none;gap:30px;font-family:var(--ui);font-weight:600;font-size:.9rem}
.hdr__nav a{color:var(--ink-soft);padding:6px 0;position:relative;transition:color .2s}
.hdr__nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--red);transition:width .3s var(--ease)}
.hdr__nav a:hover,.hdr__nav a[aria-current]{color:var(--ink)}
.hdr__nav a:hover::after,.hdr__nav a[aria-current]::after{width:100%}
.hdr__cta{display:none}
.hdr__burger{display:inline-flex;flex-direction:column;gap:5px;background:none;border:0;padding:8px;cursor:pointer}
.hdr__burger span{width:24px;height:2px;background:var(--ink);transition:.3s var(--ease)}
.hdr.menu-open .hdr__burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hdr.menu-open .hdr__burger span:nth-child(2){opacity:0}
.hdr.menu-open .hdr__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (min-width:940px){
  .hdr__nav,.hdr__cta{display:flex}
  .hdr__burger{display:none}
}
.mobnav{display:none;border-bottom:1px solid var(--line);background:var(--paper)}
.mobnav.open{display:block}
.mobnav a{display:block;padding:16px var(--gut);font-family:var(--ui);font-weight:600;border-top:1px solid var(--line)}
.mobnav a:first-child{border-top:0}
.mobnav .btn{margin:18px var(--gut) 24px}

/* ---------- hero ---------- */
.hero{padding:clamp(70px,11vw,140px) 0 clamp(56px,9vw,110px)}
.hero__grid{display:grid;grid-template-columns:1fr;gap:clamp(38px,6vw,64px);align-items:center}
@media (min-width:960px){.hero__grid{grid-template-columns:1.15fr .85fr}}
.hero h1{margin-top:20px}
.hero h1 em{font-style:normal;color:var(--red)}
.hero .lead{margin-top:26px;max-width:42ch}
.hero .btn-row{margin-top:38px}
.hero__meta{margin-top:34px;display:flex;flex-wrap:wrap;gap:10px 28px}
.hero__meta span{font-family:var(--ui);font-size:.82rem;color:var(--ink-faint);display:flex;align-items:center;gap:8px}
.hero__meta span::before{content:"";width:6px;height:6px;background:var(--red)}
.hero__panel{border:1px solid var(--line);background:var(--white);padding:28px}
.hero__panel img{width:100%;aspect-ratio:4/5;object-fit:cover}
.hero__panel figcaption{margin-top:16px;font-family:var(--ui);font-size:.8rem;color:var(--ink-faint)}

/* ---------- generic split ---------- */
.split{display:grid;grid-template-columns:1fr;gap:clamp(32px,6vw,72px);align-items:center}
@media (min-width:900px){
  .split{grid-template-columns:1fr 1fr}
  .split--textL{grid-template-columns:1.1fr .9fr}
  .split--textR{grid-template-columns:.9fr 1.1fr}
}
.frame{border:1px solid var(--line);background:var(--white);padding:14px}
.frame img{width:100%;object-fit:cover;aspect-ratio:1/1}
.frame.portrait img{aspect-ratio:4/5}
.band--ink .frame{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.04)}

/* ---------- bullet list ---------- */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:16px}
/* li has 3 grid items — ::before, strong, span — but only 2 columns. Without
   explicit placement, auto-flow wraps the 3rd item (span) into row 2 col 1,
   the 22px bullet column, forcing its text to wrap one word per line. Pin the
   bullet across both rows and force both text nodes into column 2. */
.checks li{display:grid;grid-template-columns:22px 1fr;gap:4px 14px;align-items:start}
.checks li::before{content:"";grid-column:1;grid-row:1/-1;width:12px;height:12px;margin-top:7px;background:var(--red)}
.checks li strong{grid-column:2;display:block;font-size:1.08rem}
.checks li span{grid-column:2;color:var(--ink-soft);font-size:1.19rem}

/* ---------- number cards ---------- */
.cards{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:52px}
.cards--2{grid-template-columns:1fr}
.cards--3{grid-template-columns:1fr}
@media (min-width:680px){.cards--2{grid-template-columns:1fr 1fr}.cards--3{grid-template-columns:1fr 1fr}}
@media (min-width:980px){.cards--3{grid-template-columns:repeat(3,1fr)}}
.cardx{background:var(--paper);padding:34px 30px;transition:background .25s var(--ease),transform .25s var(--ease)}
.cardx:hover{background:var(--white);transform:translateY(-3px)}
.band--ink .cardx{background:var(--ink)}
.band--ink .cardx:hover{background:#221f1b}
.cardx h3{margin-top:12px;font-size:1.2rem}
.cardx p{margin-top:9px;color:var(--ink-soft);font-size:.97rem}
.band--ink .cardx p{color:#c3bbac}

/* ---------- weeks ---------- */
.weeks{border:1px solid var(--line);background:var(--white);margin-top:52px}
.wk{display:grid;grid-template-columns:70px 1fr;gap:22px;padding:24px var(--gut);
  border-top:1px solid var(--line);transition:background .22s,padding-left .28s var(--ease)}
.wk:first-child{border-top:0}
.wk:hover{background:var(--tint);padding-left:calc(var(--gut) + 8px)}
.wk b{font-family:var(--hd);color:var(--red)}
.wk h3{font-size:1.12rem}
.wk p{color:var(--ink-soft);font-size:.95rem;margin-top:2px}
@media (max-width:560px){.wk{grid-template-columns:1fr;gap:4px}}

/* ---------- price / value stack ---------- */
.price{display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--ink);margin-top:52px}
@media (min-width:860px){.price{grid-template-columns:1.25fr .75fr}}
.price__list{padding:8px 0}
.price__row{display:grid;grid-template-columns:1fr auto;gap:18px;padding:20px var(--gut);border-top:1px solid var(--line)}
.price__row:first-child{border-top:0}
.price__row strong{display:block}
.price__row span{color:var(--ink-soft);font-size:.94rem}
.price__row b{font-family:var(--ui);color:var(--ink-faint);font-size:.9rem;white-space:nowrap;text-decoration:line-through}
.price__buy{background:var(--ink);color:#efe9df;padding:var(--gut);display:flex;flex-direction:column;justify-content:center;gap:6px}
.price__buy .strike{color:#8a8479;text-decoration:line-through;font-family:var(--ui);font-size:.95rem}
.price__buy .now{font-family:var(--hd);font-size:clamp(2.2rem,5vw,3rem);color:#fff;line-height:1}
.price__buy .emi{color:#c3bbac;font-size:.9rem}
.price__buy .btn{margin-top:16px}

/* ---------- includes list (home) ---------- */
.incl{border:1px solid var(--line);background:var(--white);margin-top:44px}
.incl__row{display:grid;grid-template-columns:1fr auto;gap:18px;padding:20px var(--gut);border-top:1px solid var(--line)}
.incl__row:first-child{border-top:0}
.incl__row strong{display:block}
.incl__row span{color:var(--ink-soft);font-size:.94rem}
.incl__row b{font-family:var(--ui);color:var(--ink-faint);font-size:.9rem;white-space:nowrap;text-decoration:line-through}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;border-block:1px solid var(--line);background:var(--white);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee__row{display:flex;width:max-content;animation:scroll 44s linear infinite}
.marquee:hover .marquee__row{animation-play-state:paused}
.tool{display:flex;align-items:center;gap:13px;padding:26px 36px;border-right:1px solid var(--line);flex:none}
.tool img{width:28px;height:28px;object-fit:contain}
.tool span{font-family:var(--ui);font-weight:600;font-size:.82rem;color:var(--ink-soft);white-space:nowrap}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- autoplay demo reel (muted loop, custom controls) ---------- */
.reelwrap{margin-top:52px;border:1px solid var(--line)}
.reel{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.reel iframe,.reel > div{position:absolute;inset:0;width:100%;height:100%;border:0}
.reel__tap{position:absolute;inset:0;cursor:pointer;background:transparent;z-index:2}
.reel__badge{position:absolute;left:16px;bottom:16px;z-index:3;pointer-events:none;
  display:inline-flex;align-items:center;gap:9px;background:var(--red);color:#fff;
  font-family:var(--ui);font-weight:700;font-size:.82rem;letter-spacing:.02em;padding:11px 16px}
.reel__badge svg{width:15px;height:15px;fill:currentColor}
.reelwrap.is-live .reel__badge{background:var(--ink)}
@media (prefers-reduced-motion:reduce){.reel__badge{background:var(--ink)}}

/* control bar */
.reel__bar{display:flex;align-items:center;gap:14px;padding:12px 16px;background:var(--white);
  border-top:1px solid var(--line);font-family:var(--ui);font-size:.82rem;color:var(--ink-soft);flex-wrap:wrap}
.reel__btn{flex:none;width:34px;height:34px;display:grid;place-items:center;background:var(--ink);
  border:0;cursor:pointer;color:#fff;transition:background .2s}
.reel__btn:hover{background:var(--red)}
.reel__btn svg{width:15px;height:15px;fill:currentColor}
.reel__cc{width:auto;padding:0 9px;font-family:var(--ui);font-weight:700;font-size:.72rem;letter-spacing:.06em}
.reel__cc.is-on{background:var(--red)}
.reel__time{flex:none;font-variant-numeric:tabular-nums;letter-spacing:.02em;color:var(--ink-faint)}
.reel__rate{flex:none;display:flex;align-items:center;gap:7px;margin-left:auto}
.reel__rate span{text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;color:var(--ink-faint)}
.reel__rate select{font:inherit;font-family:var(--ui);font-size:.82rem;padding:7px 10px;border:1px solid var(--line);
  background:var(--white);color:var(--ink);cursor:pointer}
.reel__seek{flex:1 1 180px;-webkit-appearance:none;appearance:none;height:4px;background:var(--line);cursor:pointer;outline-offset:4px}
.reel__seek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:var(--red);border:0;cursor:pointer}
.reel__seek::-moz-range-thumb{width:14px;height:14px;background:var(--red);border:0;border-radius:0;cursor:pointer}
.reel__seek::-moz-range-progress{background:var(--red);height:4px}

/* ---------- marketing flow diagram ---------- */
.mflow{display:grid;grid-template-columns:1fr;gap:14px;margin-top:44px;align-items:stretch}
@media (min-width:880px){.mflow{grid-template-columns:minmax(180px,1fr) 2.4fr minmax(180px,1fr)}}
.mflow__end{border:1px solid var(--ink);background:var(--white);padding:24px 22px;display:flex;
  flex-direction:column;justify-content:center;gap:10px;text-align:center}
.mflow__end strong{font-family:var(--hd);font-weight:400;font-size:clamp(1.05rem,1.7vw,1.25rem);line-height:1.25}
.mflow__tag{font-family:var(--ui);font-weight:700;text-transform:uppercase;letter-spacing:.18em;
  font-size:.66rem;color:var(--red)}
.mflow__mid{position:relative;border:1px solid var(--red);background:var(--tint);padding:30px 26px;
  text-align:center;overflow:hidden}
.mflow__arrow{position:absolute;left:6%;right:6%;top:50%;height:2px;background:var(--red);opacity:.28}
.mflow__arrow::after{content:"";position:absolute;right:-1px;top:-5px;border:6px solid transparent;
  border-left-color:var(--red);opacity:.55}
.mflow__word{position:relative;font-family:var(--hd);font-size:clamp(1.8rem,4.6vw,3rem);color:var(--ink);letter-spacing:.02em}
.mflow__sub{position:relative;margin-top:8px;color:var(--ink-soft);font-size:clamp(.95rem,1.5vw,1.08rem)}
.mflow__chips{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px}
.mflow__chips span{font-family:var(--ui);font-size:.76rem;font-weight:600;background:var(--white);
  border:1px solid var(--line);padding:6px 11px;color:var(--ink-soft)}
.mflow__not{position:relative;margin-top:18px;font-family:var(--hd);color:var(--red);
  font-size:clamp(1.05rem,2vw,1.35rem)}
@media (max-width:879px){
  .mflow__arrow{left:50%;right:auto;top:auto;bottom:-1px;width:2px;height:22px;transform:translateX(-50%)}
  .mflow__arrow::after{right:auto;left:-5px;top:auto;bottom:-1px;border-left-color:transparent;border-top-color:var(--red)}
}

/* ---------- home track chooser ---------- */
.pickrow{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--ink);margin-top:44px}
@media (min-width:820px){.pickrow{grid-template-columns:repeat(3,1fr)}}
.pickrow__card{background:var(--paper);padding:30px 26px;display:flex;flex-direction:column;gap:8px;
  transition:background .22s var(--ease),transform .22s var(--ease)}
.pickrow__card:hover{background:var(--white);transform:translateY(-3px)}
.pickrow__k{font-family:var(--hd);color:var(--red);font-size:.95rem}
.pickrow__card strong{font-family:var(--hd);font-weight:400;font-size:1.35rem}
.pickrow__card > span:not(.pickrow__k):not(.pickrow__go){color:var(--ink-soft);font-size:.95rem}
.pickrow__go{margin-top:auto;padding-top:14px;font-family:var(--ui);font-weight:700;font-size:.85rem;color:var(--red)}

.mods-prompt{margin-top:22px;padding:18px 20px;background:var(--tint);border:1px solid var(--line);
  border-left:3px solid var(--red);font-family:var(--ui);font-weight:600;color:var(--ink-soft);font-size:.95rem}

/* ---------- track picker — pick one, hide the rest ---------- */
.trackpick{display:grid;gap:1px;background:var(--line);border:1px solid var(--ink);margin-top:40px;max-width:520px}
.trackpick__q{grid-column:1/-1;background:var(--white);padding:14px 20px;font-family:var(--hd);font-size:1.05rem}
.trackpick__btn{display:flex;flex-direction:column;gap:4px;align-items:flex-start;text-align:left;
  background:var(--white);border:0;padding:18px 20px;cursor:pointer;transition:background .18s,padding-left .2s var(--ease)}
.trackpick__btn:hover{background:var(--tint);padding-left:26px}
.trackpick__label{font-family:var(--ui);font-weight:700;font-size:1rem}
.trackpick__sub{font-family:var(--bd);font-size:.9rem;color:var(--ink-soft)}
.track-change{display:inline-flex;align-items:center;gap:12px;margin-top:24px;background:none;border:0;cursor:pointer;
  font-family:var(--ui);font-weight:700;font-size:.9rem;color:var(--red);padding:4px 0;transition:gap .2s var(--ease)}
.track-change svg{width:38px;height:9px;stroke:currentColor}
.track-change:hover{gap:18px}
.track-meta{margin-top:16px;font-size:.98rem;color:var(--ink-soft);max-width:70ch}
.track-meta span{color:var(--ink-faint);font-family:var(--ui);font-size:.86rem}

/* ---------- apply wizard — boxed card, roomy, one question at a time ---------- */
.apply-wrap{background:var(--tint);display:flex;align-items:center;justify-content:center;
  min-height:calc(100vh - 74px);min-height:calc(100svh - 74px);padding:clamp(32px,6vw,72px) var(--gut)}
.apply-card{width:100%;max-width:580px;background:var(--white);border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(20,17,15,.04),0 24px 60px -28px rgba(20,17,15,.22);
  padding:clamp(26px,4.5vw,44px);display:flex;flex-direction:column}
.apply-card .wz{display:flex;flex-direction:column}
.apply-card__top{flex:none}
.wzp__eyebrow{font-family:var(--ui);font-weight:700;text-transform:uppercase;letter-spacing:.2em;font-size:.66rem;color:var(--red)}
.wzp__h1{font-family:var(--hd);font-weight:400;font-size:clamp(1rem,2.4vw,1.25rem);line-height:1.2;margin:7px 0 16px}
.wz__bar{height:3px;background:var(--line);overflow:hidden}
.wz__bar span{display:block;height:100%;width:0;background:var(--red);transition:width .45s var(--ease)}

.apply-card__mid{padding:clamp(22px,4vw,34px) 0}

/* the spoken reply / "thinking…" — flashy: solid red, white, big */
.wz__say{font-family:var(--hd);font-weight:400;font-size:clamp(1.3rem,3.6vw,1.85rem);line-height:1.24;
  color:#fff;background:var(--red);padding:16px 20px;margin:0 0 clamp(22px,4vw,30px);
  box-shadow:7px 7px 0 rgba(224,31,38,.22)}
.wz__say:empty{display:none}
.wz__say.pop{animation:sayPop .5s var(--ease)}
@keyframes sayPop{0%{opacity:0;transform:scale(.92) translateY(-10px)}55%{transform:scale(1.035)}100%{opacity:1;transform:none}}
.wz__say .think::after{content:'';animation:think 1.2s steps(4,end) infinite}
@keyframes think{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}100%{content:'....'}}

.wz__track{position:relative;overflow:hidden}
.wz.js .wz__screen{display:none}
.wz.js .wz__screen.show{display:block}
.wz:not(.js) .wz__screen{display:block;margin-bottom:40px}
.wz:not(.js) [data-review]{display:none}
.wz:not(.js) #wz-next,.wz:not(.js) #wz-back,.wz:not(.js) #wz-skip{display:none}
.wz.js.wz--fwd .wz__screen.show{animation:wzIn-r .4s var(--ease)}
.wz.js.wz--back .wz__screen.show{animation:wzIn-l .4s var(--ease)}
@keyframes wzIn-r{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
@keyframes wzIn-l{from{opacity:0;transform:translateX(-34px)}to{opacity:1;transform:none}}

.q__label{display:block;font-family:var(--hd);font-size:clamp(1.3rem,3.4vw,1.85rem);line-height:1.18;letter-spacing:-.01em;margin-bottom:18px}
.q__label em{font-style:normal;font-family:var(--ui);font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--ink-faint);margin-left:10px;vertical-align:middle}
.q__in{width:100%;font:inherit;font-family:var(--bd);font-size:clamp(1.1rem,2.4vw,1.4rem);color:var(--ink);
  background:transparent;border:0;border-bottom:2px solid var(--line);padding:12px 2px;transition:border-color .2s}
.q__in::placeholder{color:var(--ink-faint);font-weight:400}
.q__in:focus{outline:0;border-bottom-color:var(--red)}
.q__ta{border:2px solid var(--line);padding:14px;min-height:110px;resize:vertical;font-size:1.05rem}
.q__ta:focus{border-color:var(--red)}

.opts{display:grid;gap:0;border-top:1px solid var(--line)}
.opts--row{grid-template-columns:1fr 1fr;border:1px solid var(--line)}
.opts label{display:flex;align-items:center;gap:14px;padding:13px 4px;cursor:pointer;font-family:var(--bd);font-size:1.02rem;
  border-bottom:1px solid var(--line);transition:padding-left .2s var(--ease),color .15s}
.opts--row label{border-bottom:0;border-right:1px solid var(--line);padding-left:16px}
.opts--row label:last-child{border-right:0}
.opts label:hover{padding-left:10px}
.opts--row label:hover{padding-left:20px}
.opts input{accent-color:var(--red);width:20px;height:20px;flex:none}
.opts label:has(input:checked){color:var(--ink);font-weight:700}
.opts label:has(input:checked) span:not(em){border-bottom:2px solid var(--red)}
.opts .is-reco span em{display:inline-block;margin-left:10px;background:var(--red);color:#fff;font-family:var(--ui);font-style:normal;
  font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:4px 8px;vertical-align:middle;border-bottom:0!important}
.consent{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:var(--tint);border-left:3px solid var(--red);
  cursor:pointer;font-size:1rem;line-height:1.5;color:var(--ink)}
/* [type=checkbox] bumps specificity above ".form input{width:100%}" (same
   specificity as ".consent input" otherwise, and .form's rule comes later in
   the file — without this the checkbox stretches to 100% width and the
   label text gets starved into a ~70px column, wrapping into a huge block). */
.consent input[type=checkbox]{accent-color:var(--red);width:20px!important;height:20px;flex:none;margin-top:2px}
.consent span{color:var(--ink)}
.form .consent strong{color:var(--ink)}

.wz__recap{padding:clamp(18px,4vw,28px);border:1px solid var(--ink);background:var(--tint)}
.wz__recap-hi{font-family:var(--hd);font-size:clamp(1.35rem,3.4vw,1.9rem);line-height:1.15}
.wz__recap-l{margin-top:10px;font-size:clamp(1.02rem,2vw,1.15rem);color:var(--ink);line-height:1.45}
.wz__recap-l strong{color:var(--red)}
.wz__recap-m{margin-top:14px;color:var(--ink-soft);line-height:1.45}
.wz__recap-t{margin-top:16px;font-family:var(--hd);color:var(--red);font-size:1.1rem}

.apply-card__nav{flex:none;padding-top:20px;border-top:1px solid var(--line)}
.wz__err{display:none;margin-bottom:10px;color:var(--red);font-family:var(--ui);font-weight:700;font-size:.88rem}
.wz__err[hidden]{display:none}
.wz__nav{display:flex;align-items:center;gap:16px}
.wz__fwd{display:flex;align-items:center;gap:18px;margin-left:auto}
.wz-arr{width:44px;height:10px;flex:none}
.wz-arr--l{transform:scaleX(-1)}
.wz__next,.wz__submit{display:inline-flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;
  font-family:var(--ui);font-weight:700;font-size:1.05rem;letter-spacing:.01em;color:var(--ink);padding:6px 0;transition:gap .25s var(--ease),color .15s}
.wz__next:hover,.wz__submit:hover{gap:20px;color:var(--red)}
.wz__submit{color:var(--red)}
.wz__back{display:inline-flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;
  font-family:var(--ui);font-weight:600;font-size:.9rem;color:var(--ink-faint);padding:6px 0;transition:gap .25s var(--ease),color .15s}
.wz__back:hover{gap:18px;color:var(--ink)}
.wz__skip{background:none;border:0;cursor:pointer;font-family:var(--ui);font-weight:600;font-size:.84rem;
  color:var(--ink-faint);text-decoration:underline;text-underline-offset:3px;padding:6px 0}
.wz__skip:hover{color:var(--red)}
@media (max-width:440px){
  .apply-wrap{padding-left:16px;padding-right:16px}
  .apply-card{padding:26px 22px}
  .wz__say{font-size:1.25rem;padding:14px 16px;box-shadow:5px 5px 0 rgba(224,31,38,.22)}
  .wz__fwd{gap:12px}
}

.apply-done{padding:24px 0}
.ad-state{display:none}
.ad-state.show{display:block;animation:rise .45s var(--ease)}

@media (prefers-reduced-motion:reduce){
  .wz.js .wz__screen.show{animation:none!important}
}

/* ---------- skills grid ---------- */
.skillgrid{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:1fr;gap:1px;
  background:var(--line);border:1px solid var(--line)}
@media (min-width:620px){.skillgrid{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.skillgrid{grid-template-columns:repeat(3,1fr)}}
.skillgrid li{background:var(--paper);padding:18px 20px;font-family:var(--ui);font-weight:600;font-size:.95rem;
  display:flex;align-items:center;gap:12px}
.skillgrid li::before{content:"";flex:none;width:9px;height:9px;background:var(--red)}

/* ---------- modules accordion ---------- */
.mods{display:grid;grid-template-columns:1fr;gap:12px;margin-top:28px}
@media (min-width:900px){.mods{grid-template-columns:1fr 1fr;gap:12px 24px}}
.mod{border:1px solid var(--line);background:var(--white);height:max-content}
.mod > summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:12px;
  align-items:start;padding:18px 20px;font-family:var(--bd);font-weight:700;font-size:1rem;line-height:1.4}
.mod > summary::-webkit-details-marker{display:none}
.mod > summary:hover{background:var(--tint)}
.mod__n{font-family:var(--hd);color:var(--red);font-size:.9rem;padding-top:1px}
.mod > summary::after{content:"+";color:var(--red);font-family:var(--ui);font-weight:400;font-size:1.4rem;line-height:1}
.mod[open] > summary::after{content:"–"}
.mod[open] > summary{background:var(--tint)}
.mod__body{padding:4px 20px 22px 20px}
.mod__body > p{color:var(--ink-soft);font-size:.96rem;line-height:1.6}
.mod__keys{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.ktag{font-family:var(--ui);font-size:.72rem;font-weight:600;letter-spacing:.02em;color:var(--ink-soft);
  background:var(--tint);border:1px solid var(--line);padding:5px 9px}
.mod__tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}

/* ---------- tool chips ---------- */
.tchip{display:inline-flex;align-items:center;gap:10px}
.tchip__ic{flex:none;width:34px;height:34px;display:grid;place-items:center;background:var(--white);border:1px solid var(--line)}
.tchip__ic img{width:20px;height:20px;object-fit:contain}
.tchip__mono{font-family:var(--ui);font-weight:700;font-size:.72rem;letter-spacing:.03em;color:var(--red);text-transform:uppercase}
.tchip--icon{gap:0}
.tchip--full .tchip__lbl{font-family:var(--ui);font-size:.82rem;color:var(--ink-soft)}
.toolgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px}
@media (min-width:560px){.toolgrid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:900px){.toolgrid{grid-template-columns:repeat(4,1fr)}}
.toolgrid .tchip{background:var(--paper);padding:16px 18px}
.toolgrid .tchip__ic{width:38px;height:38px}
.toolgrid .tchip__ic img{width:22px;height:22px}
.band--ink .toolgrid{border-color:rgba(255,255,255,.14)}
.band--ink .toolgrid .tchip{background:var(--ink)}
.band--ink .toolgrid .tchip__ic{background:#fff;border-color:transparent}
.band--ink .tchip--full .tchip__lbl{color:#c3bbac}

/* ---------- career-switch confidence ---------- */
.switchr{border:1px solid var(--ink);background:var(--ink);color:#f3ede2;padding:clamp(30px,5vw,56px)}
.switchr h2{font-size:clamp(1.6rem,3.4vw,2.4rem);max-width:22ch}
.switchr p{margin-top:16px;color:#cfc4b6;max-width:56ch;font-size:1.05rem}
.switchr .big{font-family:var(--hd);color:#fff;font-size:clamp(1.1rem,2vw,1.35rem);margin-top:20px}
.switchr .fineprint{margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);
  font-size:.82rem;color:#9a9285;max-width:60ch}

/* ---------- FAQ ---------- */
.faq{border:1px solid var(--line);background:var(--white);margin-top:44px}
.faq details{border-top:1px solid var(--line)}
.faq details:first-child{border-top:0}
.faq summary{list-style:none;cursor:pointer;padding:24px var(--gut);display:flex;justify-content:space-between;gap:20px;
  font-family:var(--hd);font-size:1.05rem;transition:background .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{background:var(--tint)}
.faq summary::after{content:"+";color:var(--red);font-family:var(--ui);font-weight:400;font-size:1.5rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{padding:0 var(--gut) 26px;color:var(--ink-soft);max-width:72ch}

/* ---------- forms ---------- */
/* color:var(--ink) is deliberate — a form embedded in a .band--ink (dark)
   section would otherwise inherit that section's light text color onto any
   element here that doesn't set its own (e.g. .consent), making it unreadable
   against the form's own light input backgrounds. */
.form{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px;color:var(--ink)}
.form .two{display:grid;grid-template-columns:1fr;gap:1px}
@media (min-width:640px){.form .two{grid-template-columns:1fr 1fr}}
.form input,.form textarea{font:inherit;font-family:var(--bd);font-size:1rem;padding:17px 18px;border:0;background:var(--white);color:var(--ink);width:100%}
.form textarea{min-height:130px;resize:vertical}
.form input::placeholder,.form textarea::placeholder{color:var(--ink-faint)}
.form input:focus,.form textarea:focus{outline:2.5px solid var(--red);outline-offset:-2.5px}
.form button{grid-column:1/-1;border:0;justify-content:center}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field-err{color:var(--red);font-family:var(--ui);font-size:.82rem;font-weight:700;margin-top:6px}
.note-ok{background:var(--red);color:#fff;padding:15px 18px;font-family:var(--ui);font-weight:700;font-size:.9rem;letter-spacing:.02em}

/* ---------- address / map note ---------- */
.addr{border:1px solid var(--line);background:var(--white);padding:32px}
.addr address{font-style:normal;font-size:1.05rem;line-height:1.7}
.addr .flag{margin-top:18px;padding:14px 16px;background:var(--tint);border-left:3px solid var(--red);
  font-size:.92rem;color:var(--ink-soft)}

/* ---------- footer ---------- */
.ftr{background:var(--ink);color:#b7afa1;padding:var(--band) 0 44px}
.ftr__top{display:grid;grid-template-columns:1fr 1fr;gap:32px 24px}
.ftr__top > div:first-child{grid-column:1 / -1}
@media (min-width:820px){
  .ftr__top{grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px}
  .ftr__top > div:first-child{grid-column:auto}
}
.ftr__social{display:flex;flex-direction:column;gap:2px}
.ftr__social a{display:flex;align-items:center;gap:10px}
.ftr__social img{filter:brightness(0) invert(.72);transition:filter .2s;flex:none}
.ftr__social a:hover img{filter:brightness(0) invert(1)}
.ftr img{height:24px;width:auto;margin-bottom:18px}
.ftr h4{color:#fff;font-family:var(--ui);text-transform:uppercase;letter-spacing:.18em;font-size:.74rem;margin-bottom:15px}
.ftr a{display:block;padding:5px 0;color:#b7afa1;transition:color .2s}
.ftr a:not(.btn):hover{color:#fff}
.ftr .btn{display:inline-flex;color:var(--fg)}
.ftr .btn:hover{color:var(--fg)}
.ftr__map{margin-top:48px;display:grid;grid-template-columns:1fr;gap:20px;
  border:1px solid rgba(255,255,255,.16);padding:16px}
@media (min-width:760px){.ftr__map{grid-template-columns:1.6fr 1fr;align-items:center}}
.ftr__map-frame{position:relative;aspect-ratio:16/9;background:#0c0a09;overflow:hidden}
@media (min-width:760px){.ftr__map-frame{aspect-ratio:auto;height:240px}}
.ftr__map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  filter:grayscale(.55) contrast(1.02)}
.ftr__map-side h4{color:#fff;font-family:var(--ui);text-transform:uppercase;letter-spacing:.18em;font-size:.74rem;margin-bottom:12px}
.ftr__map-side .btn{margin-top:14px}

.ftr__bar{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;font-family:var(--ui);font-size:.8rem;color:#847d70}

/* ---------- universal-audience strip ---------- */
.confused{display:grid;grid-template-columns:1fr;gap:20px;align-items:center;
  border:1px solid var(--line);background:var(--white);padding:clamp(24px,4vw,40px)}
@media (min-width:820px){.confused{grid-template-columns:auto 1fr}}
.confused__k{font-family:var(--hd);font-size:clamp(1.6rem,3.4vw,2.4rem);color:var(--red);line-height:1;white-space:nowrap}
.confused p{font-size:clamp(1.05rem,1.7vw,1.28rem);line-height:1.55}
.confused strong{color:var(--ink)}

/* ---------- full-screen manifesto ---------- */
.manifesto{position:relative;min-height:65vh;min-height:65svh;display:grid;place-items:center;
  background:var(--ink);color:#f3ede2;overflow:hidden;isolation:isolate;padding:clamp(64px,10vw,120px) 0}
.manifesto::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(60% 55% at 50% 0%,rgba(224,31,38,.28),transparent 65%),
             radial-gradient(50% 50% at 90% 100%,rgba(224,31,38,.14),transparent 60%)}
.manifesto__in{text-align:center;max-width:900px}
.manifesto__h{font-size:clamp(2.1rem,5.4vw,4rem);line-height:1.12;letter-spacing:-.015em;max-width:20ch;margin-inline:auto}
.manifesto__sub{margin-top:26px;font-size:clamp(1.05rem,2vw,1.5rem);color:#c9bfae;max-width:34ch;margin-inline:auto;line-height:1.45}
.manifesto__q{margin:clamp(32px,5vw,52px) 0 0;padding-top:26px;border-top:1px solid rgba(255,255,255,.16);
  font-family:var(--hd);font-size:clamp(1.15rem,2.2vw,1.7rem);color:#fff;max-width:30ch;margin-inline:auto;line-height:1.3}
.manifesto__q cite{display:block;margin-top:14px;font-family:var(--ui);font-style:normal;font-weight:700;
  font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.manifesto .btn{margin-top:clamp(30px,4vw,44px)}

/* ---------- mentor / instructed-by ---------- */
.mentor{display:grid;grid-template-columns:1fr;gap:clamp(28px,5vw,56px);align-items:center}
@media (min-width:860px){.mentor{grid-template-columns:.8fr 1.2fr}}
.mentor__photo{border:1px solid var(--line);background:var(--white);padding:12px}
.mentor__photo img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:top}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:34px}
@media (min-width:560px){.stats{grid-template-columns:repeat(4,1fr)}}
.stats div{background:var(--paper);padding:22px 18px}
.band--ink .stats div{background:var(--ink)}
.stats b{font-family:var(--hd);font-size:clamp(1.7rem,3.2vw,2.3rem);display:block;line-height:1}
.stats span{font-family:var(--ui);font-size:.78rem;color:var(--ink-faint);letter-spacing:.02em;display:block;margin-top:8px}
.band--ink .stats span{color:#9a9285}

/* ---------- fx overlay (rain / confetti) ---------- */
.fx-canvas{position:fixed;inset:0;z-index:120;pointer-events:none}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.07s}
.reveal[data-d="2"]{transition-delay:.14s}
.reveal[data-d="3"]{transition-delay:.21s}

/* ---------- intent modal ---------- */
.intent{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:24px;background:rgba(20,17,15,.72);backdrop-filter:blur(5px)}
.intent.open{display:grid;animation:fade .28s ease}
@keyframes fade{from{opacity:0}}
.intent__box{background:var(--paper);border:1px solid var(--ink);max-width:620px;width:100%;padding:clamp(28px,5vw,48px);position:relative;box-shadow:18px 18px 0 rgba(224,31,38,.92);max-height:88vh;overflow-y:auto}
.intent__box .stack-tight>*+*{margin-top:12px}
.intent__list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px}
.intent__list li{display:grid;grid-template-columns:14px 1fr;gap:10px;font-size:.98rem;color:var(--ink-soft);line-height:1.5}
.intent__list li::before{content:"";width:7px;height:7px;margin-top:8px;background:var(--red)}
.intent__state{display:none}
.intent__state.show{display:block;animation:rise .4s var(--ease)}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.intent__q{font-family:var(--hd);font-size:clamp(1.4rem,3.4vw,2rem);line-height:1.16}
.intent__p{margin-top:16px;color:var(--ink-soft)}
.intent__btns{margin-top:26px;display:flex;flex-wrap:wrap;gap:12px}
.intent__btns .btn{flex:1 1 auto;justify-content:center}
.intent__x{position:absolute;top:10px;right:14px;background:none;border:0;font-size:1.5rem;line-height:1;color:var(--ink-faint);cursor:pointer}
.intent__x:hover{color:var(--red)}
.intent__tag{font-family:var(--ui);text-transform:uppercase;letter-spacing:.2em;font-size:.68rem;font-weight:700;color:var(--red)}
.whoru__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.whoru__opts{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.whoru__opts .btn{justify-content:center}
.whoru__opts .btn.is-suggested{outline:2px solid var(--red);outline-offset:2px}

/* ---------- dashboard ---------- */
.dash{max-width:1120px;margin:0 auto;padding:40px var(--gut) 80px}
.dash code{font-family:var(--ui);background:var(--tint);border:1px solid var(--line);padding:1px 5px;font-size:.85em}
.rd-form{display:flex;flex-wrap:wrap;gap:10px;align-items:center;border:1px solid var(--line);background:var(--white);padding:16px}
.rd-form input[type=text]{flex:1 1 200px;font:inherit;font-family:var(--bd);font-size:.95rem;padding:11px 13px;border:1px solid var(--line)}
.rd-form select{font:inherit;font-family:var(--ui);font-size:.9rem;padding:11px 12px;border:1px solid var(--line);background:var(--white)}
.rd-form input:focus,.rd-form select:focus{outline:2px solid var(--red);outline-offset:-2px}
.rd-arrow{color:var(--red);font-weight:700}
.dash__head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;margin-bottom:28px}
.dash__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:24px}
.dash__stats div{background:var(--white);padding:20px}
.dash__stats b{font-family:var(--hd);font-size:1.6rem;display:block}
.dash__stats span{font-family:var(--ui);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-faint)}
@media (max-width:640px){.dash__stats{grid-template-columns:repeat(2,1fr)}}

/* filter builder */
.fbar{display:flex;flex-direction:column;gap:10px;margin-bottom:22px;
  padding:13px 15px;background:var(--tint);border:1px solid var(--line)}
.fbar__row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fbar__lead{font-family:var(--ui);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink)}
.fbar__none{font-family:var(--ui);font-size:.82rem;color:var(--ink-faint)}
.fbar__pills{display:flex;flex-wrap:wrap;gap:6px}
.fpill{display:inline-flex;align-items:center;gap:6px;font-family:var(--ui);font-size:.8rem;font-weight:600;
  background:var(--ink);color:#fff;padding:5px 6px 5px 11px}
.fpill button{background:none;border:0;color:#fff;cursor:pointer;font-size:1rem;line-height:1;padding:0 3px;opacity:.7}
.fpill button:hover{opacity:1}
.fbar__sel{font:inherit;font-family:var(--ui);font-size:.85rem;padding:9px 11px;border:1px solid var(--line);background:var(--white)}
.fbar__sel:focus{outline:2px solid var(--red);outline-offset:-2px}
.fbar__sel:disabled{opacity:.5}
.btn--sm{padding:8px 15px;font-size:.8rem}
.badge{display:inline-block;font-family:var(--ui);font-size:.62rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;padding:2px 7px;border:1px solid currentColor;margin-top:4px}
.badge--draft{color:#b26a00}
.tbl tr.is-draft td{background:#fffbf0}
.tbl tr.is-draft.unread td{background:#fff4e6}
.chip{font-family:var(--ui);font-size:.8rem;font-weight:600;padding:8px 14px;border:1px solid var(--line);color:var(--ink-soft)}
.chip[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.tbl{width:100%;border-collapse:collapse;border:1px solid var(--line);background:var(--white);font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:13px 14px;border-top:1px solid var(--line);vertical-align:top}
.tbl th{font-family:var(--ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint);border-top:0}
.tbl tr.unread td{background:#fff7f2}
.tbl .src{font-family:var(--ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--red)}
.tbl form{display:inline}
.tbl button{background:none;border:0;color:var(--ink-faint);cursor:pointer;font-family:var(--ui);font-size:.8rem}
.tbl button:hover{color:var(--red)}
.pager{display:flex;gap:6px;margin-top:20px;font-family:var(--ui);font-size:.85rem}
.pager a,.pager span{padding:8px 12px;border:1px solid var(--line)}
.pager .active{background:var(--ink);color:#fff}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:40px}
.login-box{width:100%;max-width:380px;border:1px solid var(--line);background:var(--white);padding:38px}

/* ===== dashboard sidebar shell ===== */
.dash-shell{display:flex;min-height:100vh;background:var(--paper)}
.dnav{flex:0 0 232px;background:var(--ink);color:#fff;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;transition:flex-basis .18s var(--ease);overflow:hidden}
.dash-shell.is-collapsed .dnav{flex-basis:60px}
.dnav__top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 14px 14px}
.dnav__logo{display:flex;align-items:center}
.dnav__logo img{height:20px;width:auto}
.dnav__mark{display:none;font-family:var(--hd);font-size:1.2rem;color:#fff}
.dnav__toggle,.dmain__menu{background:none;border:0;color:#fff;cursor:pointer;padding:6px;display:inline-flex}
.dnav__toggle svg,.dmain__menu svg{width:20px;height:20px}
.dnav__links{display:flex;flex-direction:column;margin-top:6px}
.dnav__link{display:flex;align-items:center;gap:13px;padding:12px 19px;color:#fff;opacity:.72;
  font-family:var(--ui);font-size:.9rem;white-space:nowrap;border-left:3px solid transparent}
.dnav__link:hover{opacity:1;background:rgba(255,255,255,.06)}
.dnav__link.is-active{opacity:1;background:rgba(255,255,255,.11);border-left-color:var(--red)}
.dnav__link svg{flex:0 0 20px;width:20px;height:20px}
.dnav__out{margin-top:auto;padding:14px 8px;border-top:1px solid rgba(255,255,255,.12)}
.dnav__out button{width:100%;display:flex;align-items:center;gap:13px;padding:11px;background:none;border:0;
  color:#fff;opacity:.72;cursor:pointer;font-family:var(--ui);font-size:.9rem}
.dnav__out button:hover{opacity:1}
.dnav__out svg{flex:0 0 20px;width:20px;height:20px}
.dash-shell.is-collapsed .dnav__link span,
.dash-shell.is-collapsed .dnav__out span,
.dash-shell.is-collapsed .dnav__logo img{display:none}
.dash-shell.is-collapsed .dnav__mark{display:block}
.dmain{flex:1 1 auto;min-width:0;padding:clamp(18px,3.4vw,40px)}
.dmain__menu{display:none;margin-bottom:12px;color:var(--ink)}
.dmain .dash{max-width:none}
.dash__head{align-items:flex-start}

@media (max-width:820px){
  .dnav{position:fixed;z-index:60;left:0;top:0;flex-basis:230px;transform:translateX(-100%);transition:transform .2s var(--ease)}
  .dash-shell.nav-open .dnav{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.4)}
  .dash-shell.is-collapsed .dnav{flex-basis:230px}
  .dash-shell.is-collapsed .dnav__link span,.dash-shell.is-collapsed .dnav__out span,.dash-shell.is-collapsed .dnav__logo img{display:inline}
  .dash-shell.is-collapsed .dnav__mark{display:none}
  .dnav__toggle{display:none}
  .dmain__menu{display:inline-flex}
}

/* ===== code & tracking ===== */
.ct-card{border:1px solid var(--line);background:var(--white);padding:22px;margin-bottom:22px}
.ct-form{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.ct-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ct-lbl{font-family:var(--ui);font-weight:700;font-size:.8rem;min-width:150px}
.ct-form input[type=text]{font:inherit;font-family:var(--ui);font-size:.9rem;padding:10px 12px;border:1px solid var(--line);min-width:220px}
.ct-chk{font-family:var(--ui);font-size:.82rem;display:inline-flex;align-items:center;gap:6px}
.snip{border:1px solid var(--line);background:var(--tint);padding:14px;margin-bottom:10px;display:flex;flex-direction:column;gap:9px}
.snip--new{background:#f4f8f4}
.snip__head{display:flex;align-items:center;gap:10px}
.snip__name{flex:1;font:inherit;font-family:var(--ui);font-weight:700;font-size:.9rem;padding:8px 10px;border:1px solid var(--line)}
.snip__state{font-family:var(--ui);font-size:.62rem;font-weight:700;letter-spacing:.08em;padding:3px 7px;border:1px solid var(--ink-faint);color:var(--ink-faint)}
.snip__state.on{color:#0a7d2c;border-color:#0a7d2c}
.snip__meta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.snip__meta select,.snip__meta input{font:inherit;font-family:var(--ui);font-size:.82rem;padding:7px 9px;border:1px solid var(--line);background:var(--white)}
.snip__code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;padding:10px;border:1px solid var(--line);background:var(--white);width:100%;resize:vertical}
.snip__row2{display:flex;gap:16px;margin:-4px 0 18px}
.linkbtn{background:none;border:0;color:var(--ink-faint);cursor:pointer;font-family:var(--ui);font-size:.8rem;text-decoration:underline}
.linkbtn:hover{color:var(--ink)}
.linkbtn--danger:hover{color:var(--red)}
.capi-out{margin-top:14px;padding:12px;background:var(--ink);color:#e8e8e8;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;line-height:1.5;overflow:auto;max-height:340px;white-space:pre-wrap;word-break:break-word}

/* post editor fields */
.pf{display:flex;flex-direction:column;gap:14px;margin-bottom:16px}
.pf label{display:flex;flex-direction:column;gap:5px;font-family:var(--ui);font-weight:700;font-size:.8rem}
.pf input,.pf textarea,.pf select{font:inherit;font-family:var(--bd);font-weight:400;font-size:.95rem;padding:11px 13px;border:1px solid var(--line);background:var(--white);width:100%}
.pf .two{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:640px){.pf .two{grid-template-columns:1fr 1fr}}
.pf input:focus,.pf textarea:focus,.pf select:focus{outline:2px solid var(--red);outline-offset:-2px}

/* ===== internal-linking / explore ===== */
.explore{border-top:1px solid var(--line)}
.explore__grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:22px}
@media (min-width:720px){.explore__grid{grid-template-columns:repeat(3,1fr)}}
.explore__card{display:flex;flex-direction:column;gap:4px;padding:26px 24px;background:var(--paper);position:relative;transition:background .2s var(--ease)}
.explore__card:hover{background:var(--white)}
.explore__label{font-family:var(--hd);font-size:1.15rem}
.explore__sub{font-family:var(--ui);font-size:.85rem;color:var(--ink-soft)}
.explore__card svg{width:22px;height:22px;color:var(--red);margin-top:8px;transition:transform .2s var(--ease)}
.explore__card:hover svg{transform:translateX(5px)}

/* ===== blog ===== */
.postgrid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:640px){.postgrid{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.postgrid{grid-template-columns:repeat(3,1fr)}}
.postcard{display:flex;flex-direction:column;background:var(--paper);transition:background .2s var(--ease),transform .2s var(--ease)}
.postcard:hover{background:var(--white);transform:translateY(-3px)}
.postcard__img{display:block;aspect-ratio:16/10;background:var(--tint) center/cover no-repeat}
.postcard__body{display:flex;flex-direction:column;gap:9px;padding:24px 22px}
.postcard__date{font-family:var(--ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint)}
.postcard__title{font-family:var(--hd);font-size:1.2rem;line-height:1.25}
.postcard__ex{font-family:var(--bd);font-size:.92rem;color:var(--ink-soft)}
.postcard__more{margin-top:auto;display:inline-flex;align-items:center;gap:7px;font-family:var(--ui);font-weight:700;font-size:.8rem;color:var(--red)}
.postcard__more svg{width:18px;height:18px}
.prose{max-width:720px}
.prose h2{font-family:var(--hd);font-size:1.6rem;margin:38px 0 14px}
.prose h3{font-family:var(--hd);font-size:1.25rem;margin:30px 0 10px}
.prose p{margin:0 0 18px;line-height:1.75;font-size:1.05rem}
.prose ul,.prose ol{margin:0 0 18px;padding-left:1.3em;line-height:1.75}
.prose li{margin-bottom:8px}
.prose a{color:var(--red);text-decoration:underline}
.prose img{border:1px solid var(--line);margin:20px 0}
.prose blockquote{margin:24px 0;padding:12px 20px;border-left:3px solid var(--red);background:var(--tint);font-style:italic}

/* ===== careers form extras ===== */
.form--wide select,.form--wide input[type=file]{font:inherit;font-family:var(--bd);font-size:1rem;padding:17px 18px;border:0;background:var(--white);width:100%;color:var(--ink)}
.form--wide .filewrap label{display:block;padding:17px 18px;background:var(--white);font-family:var(--ui);font-size:.85rem;font-weight:700}
.form--wide .filewrap input[type=file]{padding:10px 0 0;background:none;font-weight:400;font-size:.9rem}

/* ===== lead stage select ===== */
.stageform{margin:0}
.stagesel{font:inherit;font-family:var(--ui);font-size:.78rem;padding:5px 7px;border:1px solid var(--line);background:var(--white)}
.stagesel.is-contacted{border-color:#b26a00;color:#b26a00}
.stagesel.is-joined{border-color:#0a7d2c;color:#0a7d2c;font-weight:700}
.stagesel.is-dropped{border-color:var(--ink-faint);color:var(--ink-faint)}

/* ---------- events ---------- */
/* Flexbox, not grid: explicit basis + hard min-width floors so neither side
   can ever be squeezed by the other's intrinsic content size (a fr-track grid
   blows out when one side's content is wide — this can't). Below ~820px
   combined width the card wraps to its own full-width row underneath. */
.ev-hero{display:flex;flex-wrap:wrap;gap:clamp(30px,5vw,56px);align-items:center;margin-top:clamp(36px,5vw,56px)}
.ev-hero__main{flex:1 1 420px;min-width:300px}
.ev-side{flex:0 1 360px;min-width:280px;max-width:380px;display:flex;flex-direction:column;gap:18px}
.ev-media{border:1px solid rgba(255,255,255,.16);background:#0c0a09;padding:8px}
.ev-media img{width:100%;height:auto;max-height:340px;object-fit:contain;background:#0c0a09;display:block;margin:0 auto}
.ev-card{background:var(--white);color:var(--ink);padding:clamp(22px,4vw,30px);border:1px solid var(--line)}
.ev-card__when{font-family:var(--ui);font-weight:700;font-size:1rem;color:var(--red);text-transform:uppercase;letter-spacing:.06em;line-height:1.5}
.ev-card__price{font-family:var(--hd);font-size:clamp(1.7rem,4vw,2.2rem);margin-top:10px}
.ev-card .btn{margin-top:18px;width:100%;justify-content:center}
.ev-card__note{margin-top:12px;font-size:1rem;color:var(--ink-faint)}

.countdown{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.18);margin-top:22px}
.countdown div{background:var(--ink);padding:14px 6px;text-align:center}
.countdown b{color:#fff;font-family:var(--hd);font-size:1.6rem;display:block;font-variant-numeric:tabular-nums}
.countdown span{font-family:var(--ui);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:#9a9285;display:block;margin-top:4px}

/* events listing — creatives always shown in full, never cropped */
.evgrid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:640px){.evgrid{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.evgrid{grid-template-columns:repeat(3,1fr)}}
.evtile{display:flex;flex-direction:column;background:var(--paper);transition:background .2s var(--ease),transform .2s var(--ease)}
.evtile:hover{background:var(--white);transform:translateY(-3px)}
.evtile__img{aspect-ratio:1/1;background:#0c0a09;display:flex;align-items:center;justify-content:center}
.evtile__img img{width:100%;height:100%;object-fit:contain}
.evtile__body{display:flex;flex-direction:column;gap:9px;padding:22px 20px}
.evtile__date{font-family:var(--ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--red);font-weight:700}
.evtile__title{font-family:var(--hd);font-size:1.15rem;line-height:1.25}
.evtile__ex{font-size:.92rem;color:var(--ink-soft)}
.evtile__more{margin-top:auto;display:inline-flex;align-items:center;gap:7px;font-family:var(--ui);font-weight:700;font-size:.8rem;color:var(--red)}
.evtile__more svg{width:18px;height:18px}

/* chunked content clusters (event description, rendered paragraph-by-paragraph) */
.cluster{max-width:620px}
.cluster .prose{max-width:none}
.cluster .prose p{margin-bottom:0;font-size:1.3rem;line-height:1.6}

/* admin-authored HTML lists re-skinned as a checks-style list, no markup change needed */
.content-list ul{list-style:none;padding:0;margin:0;display:grid;gap:16px}
.content-list li{position:relative;padding-left:28px;color:var(--ink-soft);font-size:1.19rem;line-height:1.65}
.content-list li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:12px;background:var(--red)}
.content-list p{color:var(--ink-soft);margin-top:14px}

/* photo + short quote cluster */
.qcluster{display:grid;grid-template-columns:1fr;gap:28px;align-items:center;max-width:620px;margin:0 auto}
@media (min-width:680px){.qcluster{grid-template-columns:auto 1fr;text-align:left}}
.qcluster__photo{width:168px;height:168px;flex:none;border:1px solid rgba(255,255,255,.18);padding:6px;margin:0 auto}
@media (min-width:680px){.qcluster__photo{margin:0}}
.qcluster__photo img{width:100%;height:100%;object-fit:cover;object-position:top}
.qcluster blockquote{margin:0;font-family:var(--hd);font-size:clamp(1.2rem,2.6vw,1.6rem);line-height:1.35;color:#fff}
.qcluster cite{display:block;margin-top:12px;font-family:var(--ui);font-style:normal;font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}

/* floating whatsapp CTA */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:90;width:56px;height:56px;border-radius:50%!important;
  background:#25D366;display:grid;place-items:center;box-shadow:0 10px 28px -8px rgba(0,0,0,.45);
  transition:transform .25s var(--ease);animation:waPulse 2.6s ease-in-out infinite}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px;fill:#fff}
@media (min-width:900px){.wa-float{right:30px;bottom:30px;width:62px;height:62px}.wa-float svg{width:30px;height:30px}}
@keyframes waPulse{0%,100%{box-shadow:0 10px 28px -8px rgba(37,211,102,.5)}50%{box-shadow:0 10px 28px -8px rgba(37,211,102,.95)}}
@media (prefers-reduced-motion:reduce){.wa-float{animation:none}}

/* confetti canvas (thank-you page) */
.confetti-canvas{position:fixed;inset:0;z-index:5;pointer-events:none}

/* thank-you page share box */
.share-box{border:1px solid var(--line);background:var(--white);padding:clamp(22px,4vw,32px);display:flex;flex-direction:column;gap:16px}
.share-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.share-link{flex:1 1 220px;font-family:var(--ui);font-size:.93rem;padding:12px 14px;border:1px solid var(--line);background:var(--tint);color:var(--ink-soft);overflow-x:auto;white-space:nowrap}

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