/* =========================================================
   Pipettemann — light.css
   Bright, minimal theme. Sections that were dark are re-scoped
   to light by swapping the colour tokens locally; only the
   footer keeps the navy canvas.
   ========================================================= */
:root{--on-accent:#F2F4F6;--on-accent-rgb:242,244,246;--shade-rgb:6,10,16}
body{background:var(--paper)}

/* ---- light scope: token swap ---- */
.hero,.marquee,.legacy,.phero,.next,.dark:not(.contact),.loader,.menu,.drop__in,.form,.cell--vol{
  --ink:#FFFFFF;      --ink-rgb:255,255,255;
  --ink-2:#F2F4F6;    --ink-2-rgb:242,244,246;
  --ink-3:#E6EAEE;    --ink-3-rgb:230,234,238;
  --paper:#060A10;    --paper-rgb:6,10,16;
  --accent-2:#2D74B4; --accent-2-rgb:45,116,180;
  --pass:#1F9D62;     --pass-rgb:31,157,98;
  color:var(--paper);
}
.legacy{background:var(--ink)!important}

/* ---- elements that sit on the accent blue keep light text ---- */
.btn--primary,.tl__card--now,.orb,.cell--site,.next:hover,.next:focus-visible,.pick input:checked+span{
  --paper:#F2F4F6;--paper-rgb:242,244,246;color:var(--paper)}
.orb:hover{--paper:#060A10;--paper-rgb:6,10,16;background:var(--on-accent);color:var(--paper)}
.next:hover .next__arrow{background:var(--on-accent)}

/* ---- nav: light by default, dark pill only over the footer ---- */
.nav__bar{color:var(--paper)}
.nav.on-light .nav__bar,.menu-open .nav .nav__bar{color:var(--ink)}
.menu-open .nav .brand{color:var(--accent)}
.menu-open .nav.is-scrolled .nav__bar{background:transparent;border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.nav.on-light.is-scrolled .nav__bar{background:rgba(var(--ink-rgb),0);background:rgba(255,255,255,.82);box-shadow:0 10px 40px -20px rgba(var(--shade-rgb),.25)}
.drop__in{border-color:rgba(var(--shade-rgb),.08);box-shadow:0 30px 70px -30px rgba(var(--shade-rgb),.35)}
.nav__links .drop a:hover,.nav__links .drop a:focus-visible{background:rgba(var(--accent-rgb),.1)}
.menu .menu__sub a:hover,.menu .menu__sub a:focus-visible{background:rgba(var(--accent-rgb),.12)}

/* ---- calmer, cleaner surfaces ---- */
.cursor__read,.hud--l{display:none}
.hero__shade{background:linear-gradient(90deg,rgba(var(--ink-rgb),.86) 0%,rgba(var(--ink-rgb),.3) 46%,transparent 66%),linear-gradient(0deg,rgba(var(--ink-rgb),.95),transparent 34%)}
.hero__fallback{background:radial-gradient(50% 60% at 72% 42%,rgba(var(--accent-rgb),.16),transparent 65%),var(--ink)}
.marquee{border-top:0}
.mq--b .mq__track{-webkit-text-stroke-color:rgba(var(--paper-rgb),.28)}
.phero::before{background:radial-gradient(640px circle at var(--mx,74%) var(--my,38%),rgba(var(--accent-rgb),.16),transparent 64%)}
.phero::after{display:none}
.cell{border-color:rgba(var(--shade-rgb),.06)}
.cell--vol{background:var(--ink);border-color:rgba(var(--shade-rgb),.08)}
.cell--vol::before{background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(var(--accent-rgb),.14),transparent 60%)}
.cell--vol .spec td{border-color:rgba(var(--paper-rgb),.1)}
.tl__card{border-color:rgba(var(--paper-rgb),.07)}
.next{background:var(--ink-2)}
.founder__bg{opacity:.35}
.founder::after{background:radial-gradient(80% 80% at 50% 50%,rgba(var(--ink-rgb),.4),var(--ink) 85%)}
.serve li::before{background:var(--accent)}
.tab[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.form{background:var(--ink);border:1px solid rgba(var(--shade-rgb),.08);box-shadow:0 40px 90px -50px rgba(var(--shade-rgb),.35)}
.cert{box-shadow:0 40px 90px -50px rgba(var(--shade-rgb),.4)}
@media (max-width:800px){
  .hero__shade{background:linear-gradient(0deg,rgba(var(--ink-rgb),.96) 18%,rgba(var(--ink-rgb),.5) 60%,rgba(var(--ink-rgb),.15))}
}

/* ---------- Cursor v2: blue dot with a soft trailing halo ---------- */
.cursor{mix-blend-mode:normal;color:var(--accent)}
.cursor.on-dark{color:var(--on-accent)}
.cursor__ring::before,.cursor__ring::after{display:none}
.cursor__dot,.cursor__ring{left:0;top:0;will-change:transform}
.cursor__dot{width:8px;height:8px;margin:-4px 0 0 -4px;background:currentColor;transition:width .35s var(--ease-out),height .35s var(--ease-out),margin .35s var(--ease-out),opacity .3s,background .3s}
.cursor__ring{width:40px;height:40px;margin:-20px 0 0 -20px;border:1px solid currentColor;border-radius:50%;opacity:.35;background:transparent;
  transition:width .45s var(--ease-out),height .45s var(--ease-out),margin .45s var(--ease-out),opacity .3s,background .3s,border-color .3s}
.cursor.is-link .cursor__ring{transform:none;width:64px;height:64px;margin:-32px 0 0 -32px;opacity:1;border-color:transparent;background:rgba(var(--accent-rgb),.14)}
.cursor.on-dark.is-link .cursor__ring{background:rgba(var(--on-accent-rgb),.2)}
.cursor.is-link .cursor__dot{width:5px;height:5px;margin:-2.5px 0 0 -2.5px}
.cursor.is-down .cursor__ring{width:30px;height:30px;margin:-15px 0 0 -15px;opacity:.8}
.cursor.is-text .cursor__dot,.cursor.is-text .cursor__ring{opacity:0}