/* =====================================================================
   Pulse website — shared stylesheet
   Brand tokens: see CLAUDE.md. Most layout lives in inline styles on each
   element (carried over from the design canvas); this file holds the
   shared classes, states and animations.
   ===================================================================== */
:root{
  --brand:#B921C4;   /* links, CTA hover */
  --plum:#470137;    /* CTA buttons */
  --mist:#F8FAFA;    /* page background */
  --ink:#1D1D1F;     /* headlines, text */
  --grey:#6E6E73;    /* body text, captions */
  --white:#FFFFFF;
  --grad:linear-gradient(90deg,#B921C4 0%,#7B5CE6 55%,#3AA8F2 100%);
  --font:'Lexend Deca',ui-sans-serif,system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px}
.skip-link:focus{left:8px}
img{max-width:100%}

/* ---- legal pages (privacy, terms) ---- */
.legal a:hover{color:var(--plum)}

/* ---- carried over from the design canvas ---- */
body{margin:0;background:#F8FAFA}
a{color:#B921C4}a:hover{color:#B921C4}
h1,h2,h3{text-wrap:balance;margin:0}
p{text-wrap:pretty;margin:0}
.display{font-size:clamp(44px,6vw,72px);font-weight:700;line-height:1.04;letter-spacing:-0.03em;color:#1D1D1F}
.headline{font-size:clamp(30px,4vw,40px);font-weight:700;line-height:1.15;letter-spacing:-0.02em;color:#1D1D1F}
.body{font-size:19px;font-weight:400;line-height:1.55;color:#6E6E73}
.small{font-size:14px;font-weight:400;line-height:1.45;color:#6E6E73}
.btn{background:#470137;color:#FFFFFF;text-decoration:none;font-weight:600;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;box-sizing:border-box;font-size:14px;transition:background .2s}
.btn:hover{background:#B921C4;color:#FFFFFF}
html{scroll-behavior:smooth}
.nav-link{color:#1D1D1F;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:44px}
.nav-link:hover{color:#B921C4}
.text-link{color:#B921C4;text-decoration:none;font-weight:600}
.text-link:hover{text-decoration:underline}
.grad-text{background:linear-gradient(90deg,#B921C4 0%,#7B5CE6 55%,#3AA8F2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#B921C4;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.j-prog{width:0;animation:jprog 14s linear infinite}
.j-dot{left:0;animation:jdot 14s linear infinite}
.j-node{animation:jnode 14s ease-in-out infinite both}
.j-card{opacity:.55;animation:jcard 14s ease-in-out infinite both}
.j-step:nth-child(2) .j-node,.j-step:nth-child(2) .j-card{animation-delay:2s}
.j-step:nth-child(3) .j-node,.j-step:nth-child(3) .j-card{animation-delay:4s}
.j-step:nth-child(4) .j-node,.j-step:nth-child(4) .j-card{animation-delay:6s}
.j-step:nth-child(5) .j-node,.j-step:nth-child(5) .j-card{animation-delay:8s}
.j-step:nth-child(6) .j-node,.j-step:nth-child(6) .j-card{animation-delay:10s}
.j-step:nth-child(7) .j-node,.j-step:nth-child(7) .j-card{animation-delay:12s}
@keyframes jprog{0%{width:0;opacity:1}86%{width:100%;opacity:1}96%{width:100%;opacity:0}100%{width:0;opacity:0}}
@keyframes jdot{0%{left:0;opacity:1}86%{left:100%;opacity:1}96%{left:100%;opacity:0}100%{left:0;opacity:0}}
@keyframes jnode{0%{background:#FFFFFF;color:#1D1D1F;transform:scale(1)}3%,15%{background:#B921C4;color:#FFFFFF;transform:scale(1.08)}19%,100%{background:#FFFFFF;color:#1D1D1F;transform:scale(1)}}
@keyframes jcard{0%{opacity:.55;transform:none}3%,15%{opacity:1;transform:translateY(-6px)}19%,100%{opacity:.55;transform:none}}
@media (prefers-reduced-motion:reduce){.j-prog,.j-dot,.j-node,.j-card{animation:none}.j-prog{width:100%}.j-dot{display:none}.j-card{opacity:1}}
.hero-photo{background:url(../img/hero-lobby.jpg) center/cover no-repeat}
.hero-shade{background:linear-gradient(180deg,rgba(29,29,31,.05) 0%,rgba(29,29,31,.25) 100%)}
.hcard{opacity:0;box-shadow:0 20px 50px -20px rgba(29,29,31,.45);animation:hcard 25s cubic-bezier(.4,0,.2,1) infinite both}
@keyframes hcard{0%{opacity:0;transform:translateY(190px) scale(.96)}2%{opacity:1;transform:translateY(122px) scale(1)}10%{opacity:1;transform:translateY(122px) scale(1)}12%{opacity:1;transform:translateY(0) scale(1)}20%{opacity:1;transform:translateY(0) scale(1)}22%{opacity:.88;transform:translateY(-122px) scale(.97)}30%{opacity:.88;transform:translateY(-122px) scale(.97)}32%{opacity:0;transform:translateY(-190px) scale(.94)}100%{opacity:0;transform:translateY(-190px) scale(.94)}}
.live-dot{animation:livedot 1.6s ease-in-out infinite}
@keyframes livedot{0%,100%{opacity:1}50%{opacity:.3}}
.sending-dot{animation:livedot 1s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.hcard{animation:none}.hcard:nth-child(1){opacity:1;transform:translateY(122px)}.hcard:nth-child(2){opacity:1;transform:none}.hcard:nth-child(3){opacity:.88;transform:translateY(-122px) scale(.97)}.live-dot,.sending-dot{animation:none}}
.band-glow{background:radial-gradient(35% 50% at 15% 85%,rgba(185,33,196,.95),transparent 70%),radial-gradient(40% 55% at 85% 20%,rgba(58,168,242,.85),transparent 70%),radial-gradient(35% 45% at 55% 60%,rgba(123,92,230,.8),transparent 70%),radial-gradient(30% 40% at 40% 10%,rgba(211,92,235,.6),transparent 70%);filter:blur(60px);animation:bandglow 18s ease-in-out infinite alternate}
@keyframes bandglow{0%{transform:translate(0,0) rotate(0deg) scale(1)}50%{transform:translate(4%,-3%) rotate(8deg) scale(1.05)}100%{transform:translate(-4%,3%) rotate(-6deg) scale(1)}}
.band-grain{background:linear-gradient(180deg,rgba(71,1,55,0) 0%,rgba(71,1,55,.25) 100%)}
@media (prefers-reduced-motion:reduce){.band-glow{animation:none}}
@media (max-width:760px){.shot-glow{background:radial-gradient(40% 55% at 8% 95%,rgba(185,33,196,.6),transparent 70%),radial-gradient(45% 55% at 95% 100%,rgba(58,168,242,.55),transparent 70%),radial-gradient(40% 45% at 35% 0%,rgba(123,92,230,.35),transparent 70%);filter:blur(48px)}
.af-panel{background-color:#F8FAFA;background-image:radial-gradient(rgba(29,29,31,.14) 1px,transparent 1.4px);background-size:22px 22px}
.af-node{opacity:0;box-shadow:0 1px 2px rgba(29,29,31,.06);animation:12s ease-in-out infinite both}
.af-conn{opacity:0;transform-origin:top;animation:12s ease-in-out infinite both}
.af-n0{animation-name:afn0}
@keyframes afn0{0%,4%{opacity:0;transform:translateY(12px);box-shadow:0 1px 2px rgba(29,29,31,.06)}8%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}21%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}24%,90%{opacity:1;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}96%,100%{opacity:0;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}}
.af-c0{animation-name:afc0}
@keyframes afc0{0%,12%{opacity:0;transform:scaleY(0)}13%{opacity:1;transform:scaleY(0)}18%,90%{opacity:1;transform:scaleY(1)}96%,100%{opacity:0;transform:scaleY(1)}}
.af-n1{animation-name:afn1}
@keyframes afn1{0%,19%{opacity:0;transform:translateY(12px);box-shadow:0 1px 2px rgba(29,29,31,.06)}23%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}36%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}39%,90%{opacity:1;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}96%,100%{opacity:0;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}}
.af-c1{animation-name:afc1}
@keyframes afc1{0%,27%{opacity:0;transform:scaleY(0)}28%{opacity:1;transform:scaleY(0)}33%,90%{opacity:1;transform:scaleY(1)}96%,100%{opacity:0;transform:scaleY(1)}}
.af-n2{animation-name:afn2}
@keyframes afn2{0%,34%{opacity:0;transform:translateY(12px);box-shadow:0 1px 2px rgba(29,29,31,.06)}38%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}51%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}54%,90%{opacity:1;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}96%,100%{opacity:0;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}}
.af-c2{animation-name:afc2}
@keyframes afc2{0%,42%{opacity:0;transform:scaleY(0)}43%{opacity:1;transform:scaleY(0)}48%,90%{opacity:1;transform:scaleY(1)}96%,100%{opacity:0;transform:scaleY(1)}}
.af-n3{animation-name:afn3}
@keyframes afn3{0%,49%{opacity:0;transform:translateY(12px);box-shadow:0 1px 2px rgba(29,29,31,.06)}53%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}66%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}69%,90%{opacity:1;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}96%,100%{opacity:0;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}}
.af-c3{animation-name:afc3}
@keyframes afc3{0%,57%{opacity:0;transform:scaleY(0)}58%{opacity:1;transform:scaleY(0)}63%,90%{opacity:1;transform:scaleY(1)}96%,100%{opacity:0;transform:scaleY(1)}}
.af-n4{animation-name:afn4}
@keyframes afn4{0%,64%{opacity:0;transform:translateY(12px);box-shadow:0 1px 2px rgba(29,29,31,.06)}68%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}88%{opacity:1;transform:none;box-shadow:0 0 0 3px #3B82F6,0 10px 24px -10px rgba(59,130,246,.45)}91%,90%{opacity:1;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}96%,100%{opacity:0;transform:none;box-shadow:0 1px 2px rgba(29,29,31,.06)}}
@media (prefers-reduced-motion:reduce){.af-node,.af-conn{animation:none;opacity:1;transform:none}}
.af-btn{transition:transform .15s}
.af-btn:hover{transform:translateY(-2px)!important}
.af-btn:focus-visible{outline:3px solid #B921C4;outline-offset:3px}
.af-open .af-node,.af-open .af-conn{animation-play-state:paused}
.af-overlay{background:rgba(248,250,250,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.af-close{color:#1D1D1F}.af-close:hover{color:#B921C4}
.form-submit:hover{background:#470137!important}
.form-submit:focus-visible,.received-close:focus-visible{outline:3px solid #B921C4;outline-offset:2px}
.received-scrim{background:rgba(29,29,31,.35);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:rcvfade .2s ease-out}
.received-card{box-shadow:0 24px 60px -20px rgba(29,29,31,.45);animation:rcvpop .25s cubic-bezier(.2,.8,.2,1)}
@keyframes rcvfade{from{opacity:0}to{opacity:1}}
@keyframes rcvpop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
.received-close:hover{color:#B921C4}
.phone{box-shadow:inset 0 0 0 1px rgba(29,29,31,.04),0 30px 60px -24px rgba(29,29,31,.28),0 8px 18px -10px rgba(29,29,31,.18)}
.phone::before{content:"";position:absolute;left:-3px;top:150px;width:3px;height:56px;border-radius:2px 0 0 2px;background:#D5DADE;box-shadow:0 74px 0 #D5DADE}
.phone::after{content:"";position:absolute;right:-3px;top:190px;width:3px;height:84px;border-radius:0 2px 2px 0;background:#D5DADE}
.feature-link:hover{color:#B921C4!important}
.foot-link{color:#6E6E73;text-decoration:none}
.foot-link:hover{color:#B921C4}
.marquee{display:flex;gap:16px;width:max-content;animation:marquee 40s linear infinite}
.marquee.rev{animation-direction:reverse}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.scroller{scrollbar-width:none}
.scroller::-webkit-scrollbar{display:none}
@media (prefers-reduced-motion:reduce){.marquee{animation:none}}
.rg-cell{transition:transform .12s}
.rg-cell:hover{transform:scale(1.15)}
.rg-cell:focus-visible{outline:2px solid #3AA8F2;outline-offset:1px}