/* ChatUp dark theme
   Loaded after styles.css and motion.css. Turns the site dark and premium:
   near-black background with soft blue glows, glass surfaces, Inter type,
   gradient highlights instead of marker pens, and a glowing blue call to action. */
:root{
  --paper:#070A12; --card:#0D1220; --card2:#0B101C;
  --ink:#EEF2FA; --ink2:#D3DAE8; --body:#A9B2C5; --muted:#9AA3B7; --soft:#7D879C;
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.14);
  --green:#8AA6FF; --marker:rgba(79,123,255,.24); --cta:#4F7BFF; --cta2:#8AA6FF; --cta-ink:#fff;
  --red:#F07167; --dim:#8A93A8; --dim2:#B8C0D0;
  --display:'Inter Tight','Inter',system-ui,sans-serif;
  --text:'Inter',system-ui,sans-serif;
  --hand:'JetBrains Mono',ui-monospace,monospace;
  --grad:linear-gradient(92deg,#B9C9FF 0%,#7C9CFF 45%,#A78BFA 100%);
  --surface:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  --glow:0 0 0 1px rgba(124,156,255,.28),0 30px 80px -30px rgba(79,123,255,.55);
  color-scheme:dark;
}
html{background:#070A12}
body{
  background:
    radial-gradient(1100px 620px at 78% -8%,rgba(79,123,255,.20),transparent 62%),
    radial-gradient(800px 520px at -6% 4%,rgba(124,92,255,.11),transparent 60%),
    #070A12;
  color:var(--ink);font-feature-settings:"cv11","ss01";letter-spacing:-.005em}
/* faint grid behind the hero, fading out */
body::before{content:"";position:absolute;left:0;right:0;top:0;height:980px;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(900px 560px at 50% 0%,#000 20%,transparent 75%);mask-image:radial-gradient(900px 560px at 50% 0%,#000 20%,transparent 75%)}
body{position:relative;isolation:isolate}
a{color:var(--ink)}a:hover{color:#fff}
h1,h2,h3{font-weight:600;color:#F4F7FD}
h1,h2{letter-spacing:-.04em}
::selection{background:rgba(79,123,255,.45);color:#fff}
.skip{background:#fff;color:#070A12}

/* highlights: gradient text instead of a marker pen */
.mk,.mk-rv,.mk-now,.motion .mk-rv{background-image:var(--grad)!important;background-size:100% 100%!important;
  -webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;
  padding:0 .04em;animation:none!important}
.gbox h2 .mk{padding:0 .04em;border-radius:0}

/* bands between sections */
.band{background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.008));border-color:var(--line)}

/* nav: glass */
.nav{background:rgba(13,18,32,.62);border:1px solid rgba(255,255,255,.09);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 20px 50px -28px rgba(0,0,0,.9)}
.logo,.logo:hover{color:#fff}
.logo svg.lg,footer.site .flogo svg.lg{display:block;height:1.18em;width:auto;overflow:visible}
.navlinks a.l{color:#AEB6C8}.navlinks a.l:hover{color:#fff}
.pill{background:var(--cta);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 10px 30px -10px rgba(79,123,255,.85)}
.pill:hover{color:#fff}
.pill .dot{background:rgba(7,10,18,.38)}
.btn:hover{box-shadow:0 16px 36px -14px rgba(79,123,255,.7)}
.navwrap::before{background:rgba(7,10,18,.55)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .navwrap::before{background:rgba(7,10,18,.92)}
  .nav{background:#0D1220}
}

/* hero */
.hero .lede{color:#A9B2C5}
.micro{color:var(--soft)}
.trust{color:#B8C0D0}
.mail{background:#0C111E;border:1px solid rgba(255,255,255,.1);transform:none;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 40px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.4)}
.mail-top{background:rgba(255,255,255,.03);border-bottom:1px solid var(--line)}
.mail-top b{color:#B8C0D0}.mail-top span{color:var(--soft)}
.mail-from{border-bottom:1px solid var(--line)}
.avatar{background:rgba(79,123,255,.16);color:#A9BDFF}
.mail-body{color:#C9D1E0}
.mail-body .subj{color:#fff}
.hl{color:#fff}
.hand,.cmp .note,.proof-label{font-family:var(--hand);font-size:12px!important;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:#8AA6FF;transform:none}
.hand{padding-left:4px}
.cmp .note{top:26px}
.proof-label{margin-bottom:18px}
.reply{background:linear-gradient(135deg,#4F7BFF,#3457D5);color:#fff;border:1px solid rgba(255,255,255,.14);
  box-shadow:0 24px 50px -24px rgba(79,123,255,.8)}
.reply .a{background:rgba(255,255,255,.2)}
.reply small{color:rgba(255,255,255,.72)}
.motion .hero-art .reply::before{background:#fff;box-shadow:0 0 0 3px #070A12}

/* slider */
.slide{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1) inset,0 16px 36px -20px rgba(0,0,0,.9)}
.slide .base{color:#C3CADA}
.slide .trail{background:linear-gradient(90deg,#3E66E8,#4F7BFF);box-shadow:0 0 30px rgba(79,123,255,.55)}
.slide .knob{background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.5)}

/* text blocks */
.problem .txt{color:#A9B2C5}
.problem .kicker{color:#fff}
.sec-head p,.card p,.whyc p,.principles p,.faq-head p,.book-left>p,.later p,.faq details p{color:#9AA3B7}

/* cards */
.card,.whyc,.fitcard.yes,.res,.legal{background:var(--surface);border:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.04) inset}
.card:hover{box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 24px 50px -30px rgba(0,0,0,.9);border-color:rgba(255,255,255,.14)}
.card .n{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.card .when{color:var(--soft)}
.card.result{background:radial-gradient(420px 260px at 80% 0%,rgba(124,156,255,.35),transparent 70%),linear-gradient(160deg,#1A2B6B,#0E1636);border-color:rgba(124,156,255,.35);box-shadow:var(--glow)}
.card.result .n{background:none;color:#fff}
.card.result .when{color:#B9C9FF}
.card.result h3{color:#fff}
.card.result p{color:#D3DCF5}
.whyc .wi{background:rgba(79,123,255,.14);box-shadow:0 0 0 1px rgba(124,156,255,.25) inset}
.whyc .wn{color:#fff}
.expect{border-color:var(--line2)}
.fastnote{color:#9AA3B7}

/* timeline */
@media (min-width:1101px) and (min-height:720px){
  .motion .tl-track{background:rgba(255,255,255,.1)}
  .motion .tl-fill{background:linear-gradient(90deg,#4F7BFF,#8AA6FF);box-shadow:0 0 12px rgba(79,123,255,.8)}
  .motion .tl-dots span{background:#070A12;border-color:rgba(255,255,255,.2)}
  .motion .tl-dots span::after{background:#4F7BFF;box-shadow:0 0 14px rgba(79,123,255,.9)}
  .motion .tl-dots span:last-child::after{background:#fff;box-shadow:0 0 0 4px #4F7BFF,0 0 18px rgba(79,123,255,.9)}
}

/* template vs researched */
.cmp.bad{background:rgba(255,255,255,.015);border:1px dashed rgba(255,255,255,.14)}
.cmp.bad .msg{background:rgba(255,255,255,.03);color:#7D879C}
.cmp.good{background:var(--surface);border:1px solid rgba(124,156,255,.3);box-shadow:var(--glow)}
.cmp.good .msg{background:rgba(255,255,255,.03);border:1px solid var(--line);color:#C9D1E0}
.cmp.good .msg b{color:#fff}
.cmp.bad .ticks{color:#8A93A8}.cmp.good .ticks{color:#D3DAE8}
.motion .cmp.bad .x{background-image:linear-gradient(#F07167,#F07167)}
.principles{border-color:var(--line)}

/* guarantee */
.gbox{background:radial-gradient(900px 420px at 85% -10%,rgba(79,123,255,.32),transparent 62%),radial-gradient(600px 400px at 0% 110%,rgba(124,92,255,.14),transparent 60%),linear-gradient(180deg,#0F1733,#0A0F22);
  color:#fff;border:1px solid rgba(124,156,255,.22);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 40px 120px -50px rgba(79,123,255,.6)}
.gbox h2,.qual-head h3{color:#fff}
.gsub,.gbox .terms{color:#C3CADA}
.gcta small,.cv-cap,.qual-head span{color:#8E98B0}
.lightbtn,.lightbtn:hover{background:#fff;color:#070A12;box-shadow:0 10px 30px -12px rgba(255,255,255,.35)}
.qual{border-top-color:rgba(255,255,255,.1)}
.qual-grid div{color:#D3DAE8}
.cv{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}
.cv .cn{background:rgba(79,123,255,.25);color:#fff;box-shadow:0 0 0 1px rgba(124,156,255,.4) inset}
.cv p{color:#fff}
.cv small{color:#8E98B0}

/* fit */
.fitcard.no{border:1px dashed rgba(255,255,255,.14)}
.fitcard div{color:#D3DAE8}.fitcard.no div{color:#8A93A8}

/* faq */
.faq{border-top-color:var(--line)}
.faq-list{border-top:1px solid var(--line2)}
.faq details{border-bottom-color:var(--line)}
.faq summary{color:#EEF2FA}
.faq summary:hover{background:rgba(255,255,255,.03)}
.faq summary::after{color:var(--soft)}
.faq details[open] summary::after{color:#8AA6FF}

/* booking */
.bookbox{background:radial-gradient(700px 360px at 90% 0%,rgba(79,123,255,.16),transparent 60%),var(--surface),#0A0E19;border:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.05) inset}
.oncall{background:rgba(255,255,255,.03);border:1px solid var(--line);transform:none}
.oncall small{color:var(--soft)}
.oncall div{color:#D3DAE8}
.oncall i{font-family:var(--hand);font-size:13px;color:#8AA6FF;padding-top:4px}
.later{border:1px dashed rgba(255,255,255,.14)}
.later small{color:var(--soft)}
.later a.mail5{color:#fff;border-bottom-color:#4F7BFF}
.cal{background:#0D1220;border:1px solid var(--line);box-shadow:0 40px 90px -40px rgba(0,0,0,.95)}
.cal-head{color:#fff;border-bottom-color:var(--line)}
.cal-foot{border-top-color:var(--line);color:var(--soft)}
.cal-foot a{color:#fff}

/* footer + simple pages */
footer.site{border-top-color:var(--line)}
footer.site .flogo{color:#fff}
footer.site a{color:#8E98B0}footer.site a:hover{color:#fff}
.toc b{color:#8AA6FF}.toc a{color:#9AA3B7}
.doc main{color:#A9B2C5}
.legal dt{color:var(--soft)}
.simple p{color:#A9B2C5}
.res-num{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.res-what{color:#fff}.res-quote{color:#9AA3B7}.res-who{color:var(--soft);border-top-color:var(--line)}

/* inline icon colours, drawn for the light site, recoloured for dark */
[stroke="#14213D"]{stroke:#DDE4F2}
.slide .knob [stroke="#14213D"]{stroke:#0B1330}
[stroke="#2E5BD8"]{stroke:#8AA6FF}
[stroke="#A8412E"]{stroke:#F07167}
[stroke="#7C8598"]{stroke:#6B7489}
.whyc .wi [stroke]{stroke:#A9BDFF}

/* phones */
@media (max-width:860px){
  body::before{height:720px;background-size:44px 44px}
  .hand{font-size:11px!important}
  .cmp .note{font-size:11px!important}
  .oncall{transform:none}
}
.logo{display:flex;align-items:center}