/* ============================================================
BULBVPN landing — enhance.css (additive polish layer)
Loads AFTER each page's own stylesheet. Nothing here changes any
static position, size, colour, copy or font: every resting / final
frame equals the shipped Figma-matched state.
Safety model
------------
* Every hidden-from-state + ambient / entrance / float loop is gated
behind `html.bv-on`, which enhance.js adds ONLY when JS runs AND
reduced-motion is not requested. So: no JS, reduced-motion, or a
frozen capture that never armed => no `.bv-on` => pixel-perfect
static page (nothing hidden, nothing moving).
* Hover / :active / :focus-visible / ::selection are pure CSS,
interaction-triggered, and revert 1:1 on mouse-leave / blur.
* GPU-only: transform / opacity / filter. No layout props animated,
no reflow on scroll.
* Never touches .fit/.fit-d/.fit-t/.bp-d/.bp-t/.bp-p/.canvas.
* Never overrides the .dm/.inter translateY(0.35em) baseline nudge
nor the phone .pp --u positioning: text is revealed opacity-only
(logo) or rides a self-contained container (m-card/m-feat/kb-illus).
* Glow colours are the tokens.css brand palette expressed with alpha:
purple --c-purple #c547ff = 197,71,255 · cyan --c-cyan #51dcff =
81,220,255 · plan-lime #84ff00 = 132,255,0.
============================================================ */
:root{
--bv-ease-out: cubic-bezier(.16,1,.3,1);
--bv-ease-soft: cubic-bezier(.2,.8,.2,1);
}
/* ---------------------------------------------------------------
1. SCROLL-REVEAL — self-contained containers only.
.m-card / .m-feat carry their content as CHILDREN and .kb-illus
wraps its own , so translate/scale moves the whole unit with
zero desync against the page's flat absolutely-positioned text.
(Desktop/tablet "cards" are bare background rectangles whose text
lives in separate absolute siblings, so they are deliberately NOT
revealed — sliding them would detach them from their labels.)
--------------------------------------------------------------- */
.bv-on .bv-rev{
opacity:0;
transform:translateY(16px) scale(.988);
transition:opacity .6s var(--bv-ease-out), transform .6s var(--bv-ease-out);
transition-delay:calc(var(--bv-i,0) * 80ms);
will-change:opacity, transform;
}
.bv-on .bv-rev.bv-in{
opacity:1;
transform:none;
will-change:auto;
}
/* ---------------------------------------------------------------
2. HEADER NAV ENTRANCE (marketing pages) — one-shot cascade.
`header nav a` = the 6 nav anchors (4 pills + login + buy); none
carry a baseline nudge. account.html has no