/* ==========================================================================
   drscottkimball.com · YouTube brand layer (Oct 2026)
   Load AFTER site.css (and app.css). Matches the locked @drscottkimball
   thumbnail + end card: black stage, white condensed caps, orange brush
   accent, cyan swoosh, SK monogram. Changes look only — no markup or logic.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Permanent+Marker&family=Figtree:wght@400;500;600;700;800&display=swap");

:root{
  --dsk-black:#080707; --dsk-black-2:#121010; --dsk-black-3:#1c1918; --dsk-line:#2c2725;
  --dsk-paper:#f7f5f2; --dsk-soft:#d9d3ce; --dsk-mute:#a59d97;
  --dsk-orange:#FA9F18; --dsk-cyan:#00CFF6;
  /* remap the site's existing tokens */
  --brand-navy:var(--dsk-black); --navy:var(--dsk-black); --navy2:var(--dsk-black-2); --navy3:var(--dsk-black-2); --ink:var(--dsk-paper);
  --brand-slate:var(--dsk-soft); --slate:var(--dsk-soft); --muted:var(--dsk-mute); --line:var(--dsk-line); --mist:var(--dsk-black-2);
  --cyan:var(--dsk-cyan); --cyan2:var(--dsk-cyan); --amber:var(--dsk-orange); --amber2:var(--dsk-orange);
  --bare:#2a2523; --building:var(--dsk-cyan); --built:var(--dsk-orange);
  --r:4px; --shadow:0 24px 60px -24px rgba(0,0,0,.8);
  --display:"Anton","Oswald","Impact","Arial Narrow",sans-serif;
  --brush:"Permanent Marker","Marker Felt",cursive;
  --head:"Figtree","Montserrat",system-ui,sans-serif; --body:"Figtree","Inter",system-ui,sans-serif;
  color-scheme:dark;
}
body{background:var(--dsk-black);color:var(--dsk-soft)}
h1,h2,h3{color:var(--dsk-paper)}
/* Latin-script headlines get the thumbnail treatment; CJK/Hindi/Arabic keep Noto */
:root:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)):not(:lang(hi)):not(:lang(ar)) :is(.hero h1,.s h2,.final h2,.cm-head h3,.hero.sub h1){
  font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.005em;line-height:.98}
.hero h1{font-size:clamp(46px,6.6vw,92px)}
.s h2{font-size:clamp(36px,4.8vw,64px)}
.hero h1 em,.s h2 em,.final h2 em{font-family:var(--brush);text-transform:uppercase;color:var(--dsk-orange);background:none;-webkit-text-fill-color:var(--dsk-orange);display:inline-block;transform:rotate(-3deg)}
/* cyan swoosh under the hero headline */
.hero h1::after{content:"";display:block;width:min(460px,80%);aspect-ratio:700/83;margin-top:16px;background:url(/assets/brand/dsk-swoosh.png) left center/contain no-repeat}
.eyebrow{color:var(--dsk-cyan);font-family:var(--head);font-weight:800}

/* logo → brush wordmark (text stays for screen readers) */
.logo{display:block;width:150px;height:34px;flex:none;font-size:0!important;color:transparent!important;background:url(/assets/brand/dsk-wordmark.png) left center/contain no-repeat}
.logo span{display:none}
.top .logo{width:120px;height:28px}

/* buttons: squared, condensed caps */
.btn{border-radius:2px;font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.04em;font-size:19px;box-shadow:none;color:var(--dsk-black)}
.btn:hover{box-shadow:none;background:#ffb341}
.btn.ghost{color:var(--dsk-cyan);box-shadow:inset 0 0 0 2px var(--dsk-cyan)}
.btn.ghost:hover{background:var(--dsk-cyan);color:var(--dsk-black)}
.btn.dark{background:transparent;color:var(--dsk-cyan);box-shadow:inset 0 0 0 2px var(--dsk-cyan)}
:lang(zh) .btn,:lang(ja) .btn,:lang(ko) .btn,:lang(hi) .btn,:lang(ar) .btn{font-family:var(--head);font-weight:700}

/* nav / hero / sections */
.nav{background:rgba(8,7,7,.9);border-bottom-color:var(--dsk-line)}
.nav .links a{color:var(--dsk-soft)}.nav .links a:hover{color:var(--dsk-cyan)}
.nav select{border-radius:2px;border-color:var(--dsk-line);color:var(--dsk-soft)}
.hero{background:var(--dsk-black)}
.hero p.sub{color:var(--dsk-soft)}
.hero .meta{color:var(--dsk-mute)}
.stars{display:none}
.hero .mtn{opacity:.35}
section.s{background:var(--dsk-black)}
section.s.alt,.dark,.eco{background:var(--dsk-black-2)}
.s p.lead,.dark p.lead,.reads p,.step p,.faq p,.offer p,.offer ul,.about .family p,.fit p,.dimnote,.s.alt .lead{color:var(--dsk-soft)}

/* cards and panels: dark surfaces, square corners */
.qs div,.step,.mgrid .c,.gifts span,.plan,.offer,.dim,.ladder li,.tiers,.kpis2 div,.pillars.light .pillar,.applyf input,.applyf textarea,.linkrow input,.chips2 span{
  background:var(--dsk-black-2);border-color:var(--dsk-line);color:var(--dsk-paper);border-radius:4px}
.qs div,.mgrid .c b,.gifts span,.plan .price,.offer .price,.faq summary,.about blockquote,.ladder li b,.tiers td,.kpis2 b,.quote,.applyf .lbl,.dim .dev,.pillars.light .pillar h3{color:var(--dsk-paper)}
.qs div span{color:var(--dsk-orange);font-family:var(--brush);font-size:18px;letter-spacing:.04em}
.step .n{background:transparent;border:2px solid var(--dsk-cyan);color:var(--dsk-cyan);font-family:var(--display);font-weight:400}
.demo{background:var(--dsk-black-2);border:2px solid var(--dsk-cyan);border-radius:4px}
.demo .cell{border-radius:3px;color:var(--dsk-soft)}
.demo .cell.built,.demo .cell.building{color:var(--dsk-black)}
.demo .cell b{font-family:var(--display);font-weight:400}
.mgrid .c{border-top:3px solid var(--dsk-line)}
.mgrid .c.summit{background:var(--dsk-black-2);border-top-color:var(--dsk-cyan)}
.mgrid .c.base{background:var(--dsk-black-2);border-top-color:var(--dsk-orange)}
.mgrid .c.base em,.mgrid .c em{color:var(--dsk-orange)}
.reads .sm{background:var(--dsk-black-3);border-left:3px solid var(--dsk-cyan);border-radius:2px}
.gifts span{border-radius:2px}
.plan.full{background:var(--dsk-black-2);border:2px solid var(--dsk-orange)}
.plan .price{font-family:var(--display);font-weight:400}
.plan li:before{border-color:var(--dsk-cyan)}
.previews img{border-color:var(--dsk-line);border-radius:3px}
.pillar{background:var(--dsk-black);border-color:var(--dsk-line);border-radius:4px}
.pillar p{color:var(--dsk-soft)}
.about img{border-radius:50%;aspect-ratio:1;border:6px solid var(--dsk-orange);box-shadow:none}
.about blockquote{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(28px,3vw,40px);line-height:1.05;border-inline-start-color:var(--dsk-orange)}
.about .family{background:var(--dsk-black-2);border-radius:4px}
.faq summary:after{color:var(--dsk-orange)}
.offer.featured{border-color:var(--dsk-orange)}
.offer .badge{border-radius:2px;background:var(--dsk-orange)}
.offer .ok,.offer .save,.offer .xref a,.about .family .k,.dim.tab .ok,.dimnote a,.fgaddon a,.tiers td+td{color:var(--dsk-orange)}
.dim.ssd .ok{color:var(--dsk-cyan)}
.ladder li.on{background:var(--dsk-black-3);border-color:var(--dsk-orange)}
.tiers th{background:var(--dsk-black-3)}
.chips2 input:checked+span{background:var(--dsk-orange);color:var(--dsk-black);border-color:var(--dsk-orange)}
.eco-card,.climbmap,.cm-stop{background:var(--dsk-black-2);border-radius:4px}
.eco-card .eco-n,.eco-card .eco-cta,.cm-step,.cm-links a,.cm-head .eyebrow,.eco .eyebrow{color:var(--dsk-orange)}
.cm-tags span{background:transparent;color:var(--dsk-soft);border:1px solid var(--dsk-line);border-radius:2px}
.fgcover{background:var(--dsk-black-2);border:2px solid var(--dsk-cyan);border-radius:4px}
.final{background:var(--dsk-black)}
.final::before{content:"";display:block;width:min(640px,86%);aspect-ratio:1000/219;margin:0 auto 26px;background:url(/assets/brand/dsk-wordmark.png) center/contain no-repeat}
footer.site{background:var(--dsk-black);border-top:1px solid var(--dsk-line);color:var(--dsk-mute)}
footer.site a{color:var(--dsk-cyan)}
footer.site .wrap::before{content:"";width:46px;height:30px;flex:none;background:url(/assets/brand/dsk-sk.png) left center/contain no-repeat}

/* assessment app (app.css) — colors only; flow and scoring untouched */
body.app{background:var(--dsk-black)}
.top{background:rgba(8,7,7,.9)}
.top .count{color:var(--dsk-cyan)}
.trailbar .camp{background:var(--dsk-black)}


/* ===== homepage trail (Oct 19) ===== */
.hero.trailhero .wrap.one{display:block;max-width:1160px;padding-top:72px;padding-bottom:70px}
.hero.trailhero h1{max-width:14ch;margin:16px 0 0}
.hero.trailhero p.sub{margin:22px 0 0;max-width:60ch}
.trail{display:grid;gap:12px;margin-top:40px}
.camp{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;background:var(--dsk-black-2);border:1px solid var(--dsk-line);padding:24px 24px 22px;text-decoration:none;color:var(--dsk-paper);min-width:0;position:relative;border-radius:4px}
.camp.now{border:2px solid var(--dsk-orange);background:#14100a}
.camp.next{opacity:.78}
.cn{font-family:var(--display);font-size:56px;line-height:.9;color:transparent;-webkit-text-stroke:2px var(--dsk-mute)}
.camp.now .cn{color:var(--dsk-orange);-webkit-text-stroke:0}
.cbody{display:flex;flex-direction:column;gap:8px;min-width:0}
.ck{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dsk-cyan)}
.camp.now .ck{color:var(--dsk-orange)}
.dn{font-family:var(--display);text-transform:uppercase;font-size:clamp(30px,3vw,40px);line-height:1}
.dq{font-family:var(--brush);color:var(--dsk-orange);font-size:clamp(20px,2.2vw,26px);line-height:1.1;transform:rotate(-2deg);transform-origin:left;display:inline-block}
.dd{color:var(--dsk-soft);font-size:15px;line-height:1.5;max-width:62ch}
.camp .btn{align-self:flex-start;margin-top:10px;display:inline-flex}
.camp.now:hover .btn{background:#ffb341}
.ways{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;background:var(--dsk-line);margin-top:34px}
.way{display:flex;flex-direction:column;gap:6px;background:var(--dsk-black);padding:20px 18px;text-decoration:none;color:var(--dsk-paper);min-width:0}
.way:hover{background:var(--dsk-black-2)}
.way b{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:22px;letter-spacing:.02em}
.way span{font-size:14px;color:var(--dsk-soft);line-height:1.5}
.hero.trailhero .tag{margin-top:30px}
@media(max-width:900px){.ways{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.camp{grid-template-columns:40px 1fr;gap:12px;padding:18px}.cn{font-size:38px}.ways{grid-template-columns:1fr}}
:lang(zh) .dn,:lang(ja) .dn,:lang(ko) .dn,:lang(hi) .dn,:lang(ar) .dn{font-family:var(--head);font-weight:800;font-size:clamp(24px,2.6vw,32px)}
:lang(zh) .dq,:lang(ja) .dq,:lang(ko) .dq,:lang(hi) .dq,:lang(ar) .dq{font-family:var(--head);font-weight:700;transform:none}
:lang(zh) .way b,:lang(ja) .way b,:lang(ko) .way b,:lang(hi) .way b,:lang(ar) .way b{font-family:var(--head);font-weight:800;font-size:18px}

/* ===== results page: Summit Map → True North handoff (Oct 19) ===== */
.unlock{background:var(--dsk-black-2);border:1px solid var(--dsk-line);border-radius:4px;box-shadow:none}
.unlock h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:28px}
.hand,.handwrap{max-width:860px;margin:18px auto 0}
.hand{border:2px solid var(--dsk-orange);padding:clamp(22px,4vw,36px);position:relative;color:var(--dsk-paper);border-radius:4px}
.hand .htag{position:absolute;top:-13px;left:22px;background:var(--dsk-orange);color:var(--dsk-black);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px}
.hand .eyebrow{color:var(--dsk-cyan);margin-top:4px}
.hand h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,4.6vw,46px);line-height:.98;margin:10px 0 0;color:var(--dsk-paper)}
.hand .lede{font-size:17px;color:var(--dsk-soft);max-width:58ch;margin:16px 0 0}
.hand .bridge{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;margin-top:24px}
.hand .b{background:var(--dsk-black);border:1px solid var(--dsk-line);padding:14px 16px;min-width:0;border-radius:3px}
.hand .b.c{border-color:var(--dsk-cyan)}
.hand .k{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dsk-mute)}
.hand .b.c .k{color:var(--dsk-cyan)}
.hand .t{font-family:var(--display);text-transform:uppercase;font-size:22px;line-height:1;margin-top:6px}
.hand .q{font-family:var(--brush);color:var(--dsk-orange);font-size:17px;margin-top:4px}
.hand .d{font-size:13.5px;color:var(--dsk-soft);margin-top:8px}
.hand .arr2{font-family:var(--display);font-size:36px;color:var(--dsk-cyan);line-height:1}
.hand .gets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin:22px 0 0;padding:0;list-style:none}
.hand .gets li{padding-left:22px;position:relative;font-size:14.5px;color:var(--dsk-soft)}
.hand .gets li::before{content:"";position:absolute;left:0;top:.62em;width:11px;height:3px;background:var(--dsk-cyan);transform:rotate(-8deg)}
.hand .offers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.hand .of{background:var(--dsk-black);border:1px solid var(--dsk-line);padding:20px 20px 18px;display:flex;flex-direction:column;gap:8px;min-width:0;position:relative;border-radius:3px}
.hand .of.best{border:2px solid var(--dsk-cyan)}
.hand .of.single{grid-column:1/-1;max-width:520px}
.hand .pill{position:absolute;top:-11px;right:16px;background:var(--dsk-cyan);color:var(--dsk-black);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:3px 9px}
.hand .of h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:21px;color:var(--dsk-paper);margin:0}
.hand .pr{font-family:var(--display);font-size:42px;line-height:1;margin:4px 0 0;font-variant-numeric:tabular-nums}
.hand .pr s{color:var(--dsk-mute);font-size:20px;margin-left:8px}
.hand .of p{margin:0;font-size:14px;color:var(--dsk-soft)}
.hand .of .btn{margin-top:auto;align-self:stretch;justify-content:center}
.btn.ghost2{background:transparent;color:var(--dsk-cyan);box-shadow:inset 0 0 0 2px var(--dsk-cyan)}
.btn.ghost2:hover{background:var(--dsk-cyan);color:var(--dsk-black)}
.hand .later{margin-top:22px;padding-top:20px;border-top:1px solid var(--dsk-line);display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.hand .later label{display:block;font-size:14px;font-weight:700;margin-bottom:6px}
.hand .later small{display:block;font-size:13px;color:var(--dsk-mute);margin-bottom:8px}
.hand .later input{width:100%;font:inherit;font-size:16px;color:var(--dsk-paper);background:var(--dsk-black-3);border:1px solid var(--dsk-line);padding:11px 12px;border-radius:2px}
.hand .later input.bad{border-color:var(--dsk-orange)}
.hand .later .ok{grid-column:1/-1;color:var(--dsk-cyan);font-weight:700;font-size:15px}
.hand .fine{font-size:13px;color:var(--dsk-mute);margin:18px 0 0}
@media(max-width:640px){.hand .bridge{grid-template-columns:1fr}.hand .arr2{transform:rotate(90deg);justify-self:center}.hand .gets,.hand .offers,.hand .later{grid-template-columns:1fr}}
[dir=rtl] .hand .htag{left:auto;right:22px}[dir=rtl] .hand .pill{right:auto;left:16px}[dir=rtl] .hand .gets li{padding-left:0;padding-right:22px}[dir=rtl] .hand .gets li::before{left:auto;right:0}

/* ===== assessment + results app: dark brand theme (overrides app.css light theme) ===== */
body.app,body.map{background:var(--dsk-black);color:var(--dsk-paper)}
.top{background:rgba(8,7,7,.92);border-bottom-color:var(--dsk-line)}
.q,.inter h1{color:var(--dsk-paper)}
.inter h1{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.005em}
:lang(zh) .inter h1,:lang(ja) .inter h1,:lang(ko) .inter h1,:lang(hi) .inter h1,:lang(ar) .inter h1{font-family:var(--head);font-weight:800;text-transform:none}
.inter p,.tnhelp{color:var(--dsk-soft)}
.prompt{color:var(--dsk-cyan)}
.opt{background:var(--dsk-black-2);border-color:var(--dsk-line);color:var(--dsk-paper);box-shadow:none;border-radius:4px}
.opt:hover{background:var(--dsk-black-3);border-color:var(--dsk-cyan)}
.opt.sel{background:#1a1409;border-color:var(--dsk-orange)}
.opt kbd{border-color:var(--dsk-line);color:var(--dsk-cyan);border-radius:3px}
.stmt{background:var(--dsk-black-2);color:var(--dsk-paper);border:1.5px solid var(--dsk-line);box-shadow:none;border-radius:4px}
.stmt .ab{background:var(--dsk-orange);color:var(--dsk-black)}
.dotb{color:var(--dsk-mute)}.dotb .d{border-color:var(--dsk-cyan);background:var(--dsk-black-2)}.dotb:hover .d{border-color:var(--dsk-paper)}
.dotb.sel{color:var(--dsk-paper)}.dotb .ab{background:var(--dsk-black-3);color:var(--dsk-paper)}
.backb{color:var(--dsk-mute)}.backb:hover{color:var(--dsk-paper)}.hint{color:var(--dsk-mute)}
.form input[type=text],.form input[type=email],.defs input,.vform textarea,#stmt{background:var(--dsk-black-2);border-color:var(--dsk-line);color:var(--dsk-paper);border-radius:3px}
.form label.chk{color:var(--dsk-soft)}
.spinner{border-color:var(--dsk-line);border-top-color:var(--dsk-orange)}
.valcard{background:var(--dsk-black-2);color:var(--dsk-paper);border:1.5px solid var(--dsk-line);box-shadow:none;border-radius:4px}.valcard span{color:var(--dsk-soft)}
.vchip{background:var(--dsk-black-2);border-color:var(--dsk-line);color:var(--dsk-paper);border-radius:3px}.vchip small{color:var(--dsk-mute)}.vchip.sel{background:#1a1409;border-color:var(--dsk-orange)}
.vform .chips2 span{background:var(--dsk-black-2);color:var(--dsk-paper);border-color:var(--dsk-line)}
.draft.sel{border-color:var(--dsk-orange);background:#1a1409}.draft .k{color:var(--dsk-orange)}
blockquote.tnq{color:var(--dsk-paper)}
.mapbar{background:rgba(8,7,7,.92);border-bottom:1px solid var(--dsk-line)}
.fbcard{background:var(--dsk-black-2);color:var(--dsk-paper);box-shadow:none;border:1px solid var(--dsk-line);border-radius:4px}
.fbcard h2,.fq b{color:var(--dsk-paper)}.fbcard .fbsub,.fl span{color:var(--dsk-soft)}
.acc span,.chips span{border-color:var(--dsk-line);color:var(--dsk-paper);background:var(--dsk-black);border-radius:3px}
.acc input:checked+span,.chips input:checked+span{background:var(--dsk-orange);border-color:var(--dsk-orange);color:var(--dsk-black)}
.fl select{background:var(--dsk-black);color:var(--dsk-paper);border-color:var(--dsk-line);border-radius:3px}
.fbcard.climb{background:var(--dsk-black-2);border:2px solid var(--dsk-cyan)}
.toast{background:var(--dsk-black-3);color:var(--dsk-paper);border:1px solid var(--dsk-line)}
.trailbar .track{background:var(--dsk-line)}.trailbar .done{background:linear-gradient(90deg,var(--dsk-cyan),var(--dsk-orange))}
.trailbar .labels{color:var(--dsk-mute)}
.unlock .ebk span,.unlock .ebk small{color:var(--dsk-soft)}
.ebk{background:var(--dsk-black-3);border-color:var(--dsk-orange);border-radius:3px}.ebk b{color:var(--dsk-paper)}.ebk em{color:var(--dsk-orange)}.ebk small{color:var(--dsk-mute)}