:root{
/* elevation — hairlines first, shadows almost never */
--elev-hairline:1px solid var(--hairline);
--elev-emphasis:3px solid var(--hairline);
--elev-glow:0 0 15px rgba(92,88,85,.2);           /* hover / featured card */
--elev-modal:0 20px 60px rgba(0,0,0,.7),0 0 0 1px rgba(148,163,184,.1) inset;
--divider-dashed:1px dashed var(--hairline-dashed);

/* the dot-grid backdrop: 1.2px dots, 22px lattice, radial-masked, 15% opacity */
--dot-color:#fffdfbb0;
--dot-size:1.2px;
--dot-spacing:22px;

/* glass — used only on the announcement bar and floating nav */
--blur-glass:blur(12px) saturate(180%); /* @kind other */
--blur-soft:blur(4px); /* @kind other */

/* motion */
--dur-fast:200ms; /* @kind other */
--dur-base:300ms; /* @kind other */
--dur-slow:1000ms; /* @kind other */   /* hero entrance fade+rise */
--ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
--rise:20px;         /* fade-in-up travel */
}
@keyframes volt-fade-in-up{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}
@keyframes volt-fade-in{0%{opacity:0;transform:scale(.95)}100%{opacity:1;transform:scale(1)}}
@keyframes volt-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes volt-marquee{from{transform:translateX(0)}to{transform:translateX(calc(-100% - var(--gap,16px)))}}