/* SONIC V61 Cinematic Luxury — presentation only; preserve existing smoke, vinyl and brand */
:root { --sonic-lux-glow: rgba(103,99,246,.18); --sonic-lux-line: rgba(154,163,255,.22); }
html { scroll-behavior:smooth; }
body { -webkit-font-smoothing:antialiased; }
button, a, input, select, textarea { transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid #8fa8ff; outline-offset:3px; }

/* Homepage: existing canvas/smoke is untouched. */
body:has(.sonic-fluid-hero) { background-image:radial-gradient(ellipse 55% 25% at 80% 30%,rgba(67,54,148,.09),transparent 75%); }
.sonic-fluid-hero { isolation:isolate; }
.sonic-fluid-content { position:relative; z-index:2; }
.sonic-fluid-content h1 { text-wrap:balance; text-shadow:0 14px 70px rgba(0,0,0,.36); }
.sonic-fluid-content > p { text-wrap:pretty; }
body:has(.sonic-fluid-hero) main > section:not(.hero) { position:relative; }
body:has(.sonic-fluid-hero) main > section:not(.hero)::before {
 content:""; pointer-events:none; position:absolute; inset:0; z-index:0;
 background:radial-gradient(ellipse 55% 65% at 50% 20%,rgba(86,66,180,.065),transparent 75%);
}
body:has(.sonic-fluid-hero) main > section:not(.hero) > * { position:relative; z-index:1; }
body:has(.sonic-fluid-hero) .cards > article,
body:has(.sonic-fluid-hero) .steps > article,
body:has(.sonic-fluid-hero) .faq-list > details,
body:has(.sonic-fluid-hero) .sonic-showcase-window {
 transition:transform .4s cubic-bezier(.2,.75,.2,1),border-color .35s ease,box-shadow .4s ease;
}
@media (hover:hover) and (pointer:fine) {
 body:has(.sonic-fluid-hero) .cards > article:hover,
 body:has(.sonic-fluid-hero) .steps > article:hover,
 body:has(.sonic-fluid-hero) .faq-list > details:hover {
   transform:translateY(-4px);
   border-color:var(--sonic-lux-line);
   box-shadow:0 20px 55px rgba(3,4,19,.26),0 0 30px rgba(97,83,198,.08);
 }
}
body:has(.sonic-fluid-hero) .final-cta { box-shadow:0 35px 110px rgba(2,3,15,.28), inset 0 1px rgba(255,255,255,.035); }
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 body:has(.sonic-fluid-hero) .cards > article,
 body:has(.sonic-fluid-hero) .steps > article,
 body:has(.sonic-fluid-hero) .faq-list > details { transition:none; transform:none!important; }
}