/* ========================================================================== Tokens — his real brand, inverted back to the dark ground his site uses. Sources: Brand/brand-tokens.css, extracted from learn.jbarrows.com. ========================================================================== */ :root{ /* ⚠ VERBATIM FROM JOHN'S BRAND STORE, NOT SAMPLED FROM HIS SITE. An earlier version of this file took its palette by eyedropping learn.jbarrows.com and got the roles backwards: it led with #006AFF, which is his SECONDARY. It also had no equivalent of the accent below, which is the one colour here that is not simply another blue and is doing the most work to make this look like an upgrade. */ --jb:#3088F3; /* Primary — buttons, links, the working accent */ --jb-deep:#006AFF; /* Secondary — headline emphasis, the punchier blue */ --jb-accent:#1F0AE8; /* Accent — indigo. Depth in gradients, pressed */ --dark:#28282D; /* Dark — raised surfaces, hovers */ --ground:#080808; /* Black — page ground. Note: NOT pure #000 */ --ink:#F2F2F3; --ink-2:#C4C4CA; --muted:#A3A3AB; /* brighter supporting copy for comfortable dark-mode reading */ --hero-soft:#ECECF0; /* near-white secondary copy over the moving hero */ --hero-nav:#DDDEE4; /* brighter secondary hierarchy without reaching pure white */ --assistant-ground:#07111F; --assistant-raise:#0B192C; --raise:#131317; /* between Black and Dark, so cards read as lifted */ --raise-2:var(--dark); --line:#25252A; --line-2:#35353C; /* ⚠ radius 0 is a real brand signature on his site: every button and card is square. It is the cheapest single thing that stops this reading as generic SaaS. */ --r:0px; /* ⚠ INTER IS THE BRAND BODY FACE, NOT A FALLBACK. This file previously listed "proxima-nova" first and carried a warning about Adobe domain-locking. His brand store names the pair outright: Oswald for headings, Inter for body. Both are Google Fonts, so there is no licence to arrange and no domain to authorise. */ --head:"Oswald","Inter Tight",system-ui,sans-serif; --body:"Inter",system-ui,-apple-system,sans-serif; --max:1180px; } *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body); font-size:16.5px;line-height:1.62;overflow-x:clip;-webkit-font-smoothing:antialiased} body.assistant-modal-open{overflow:hidden} img{max-width:100%;display:block} a{color:inherit} .wrap{max-width:var(--max);margin:0 auto;padding:0 24px} h1,h2,h3,.h{font-family:var(--head);font-weight:600;letter-spacing:.01em; text-transform:uppercase;line-height:1.04;margin:0;text-wrap:balance} .eyebrow{font-family:var(--head);font-size:12px;font-weight:500;letter-spacing:.2em; text-transform:uppercase;color:var(--jb);margin:0 0 14px} /* ── Nav ─────────────────────────────────────────────────────────────────── */ /* ⚠ SCOPED TO #nav, NOT THE BARE ELEMENT. This was `nav{position:fixed}`, which caught every