/* SONIC V31 — Fluid Hero / Studio typography, accessibility and layout polish */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
:root{--sonic-ink:#16161a;--sonic-orange:#b15f2c;--sonic-border:#e8e5e0}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif!important;color:#16161a!important;background:#fff!important}
button,a,select,input,textarea{font-family:inherit!important}
.nav{position:relative!important;z-index:30!important;max-width:100%!important;min-height:86px!important;margin:0!important;padding:12px clamp(20px,3vw,58px)!important;background:#090913!important;color:#fff!important;display:flex!important;flex-wrap:nowrap!important;gap:20px!important}
.nav .brand{flex-shrink:0;color:#fff!important;gap:9px!important;display:flex!important;align-items:center!important;font-weight:800!important;font-size:13px!important;letter-spacing:-.025em!important;line-height:1.2!important;max-width:220px!important}
.sonic-brand-image{display:block;width:72px;height:64px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 0 10px #197fff2b)}
.nav .brand small{color:#a9b3d7!important;font-size:9px!important;letter-spacing:.13em!important;margin-top:4px!important}
.nav nav{flex:1;min-width:0;display:flex!important;gap:clamp(9px,1.15vw,19px)!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important}
.nav nav a{font-size:11px!important;font-weight:700!important;color:#e6e7f1!important;white-space:nowrap!important;line-height:1.4!important}
.nav nav a:hover{color:#ff918c!important}
.nav-actions{display:flex!important;gap:8px!important;align-items:center!important;flex-shrink:0}
.nav-actions select{background:#202130!important;color:#fff!important;border:1px solid #45465b!important;min-height:42px!important}
.nav-actions .ghost{background:transparent!important;color:#fff!important;border:1px solid #626378!important;min-height:42px!important}
.nav-actions .primary{background:#ff6658!important;color:#fff!important;border-color:#ff6658!important;min-height:42px!important}
.nav-actions .primary:hover{background:#e84f44!important}
main>.sonic-fluid-hero{position:relative!important;isolation:isolate!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:690px!important;height:calc(100svh - 86px)!important;max-height:970px!important;margin:0!important;padding:80px 24px!important;border-radius:0!important;text-align:center!important;background:#070615!important;color:#fff!important}
.sonic-fluid-hero #sonic-fluid-canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:-3!important;pointer-events:none!important;display:block!important}
.sonic-fluid-scrim{position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse 66% 63% at 50% 48%,rgba(3,4,12,.84) 0%,rgba(3,4,12,.68) 47%,rgba(3,4,12,.24) 100%)}
.sonic-fluid-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#03040c5e 0%,transparent 25%,transparent 74%,#03040c9e 100%)}
.sonic-fluid-hero:before,.sonic-fluid-hero:after{display:none!important}
.sonic-fluid-content{position:relative;z-index:2;width:min(850px,100%)!important;max-width:850px!important;margin:0 auto!important;display:flex;flex-direction:column;align-items:center;gap:0}
.sonic-fluid-content>.eyebrow,.sonic-fluid-content>h1,.sonic-fluid-content>p,.sonic-fluid-content>.hero-buttons,.sonic-fluid-content>.hero-meta{max-width:100%!important}
.sonic-fluid-content>.eyebrow{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;padding:11px 17px!important;border:1px solid #ffffff55!important;border-radius:999px!important;background:#ffffff17!important;backdrop-filter:blur(12px);font-size:11px!important;font-weight:800!important;letter-spacing:.12em!important;color:#fff!important;text-transform:uppercase}
.sonic-fluid-content h1{font-family:'Plus Jakarta Sans',system-ui,sans-serif!important;font-size:clamp(48px,6.4vw,94px)!important;line-height:1.055!important;letter-spacing:-.075em!important;color:#fff!important;margin:28px 0 21px!important;font-weight:800!important;text-wrap:balance!important}
.sonic-fluid-content h1 em{font-style:normal!important;background:none!important;color:#ff958e!important;-webkit-text-fill-color:#ff958e!important}
.sonic-fluid-content>p[data-i18n="intro"]{color:#f0eaf5!important;font-size:clamp(15px,1.3vw,18px)!important;line-height:1.85!important;max-width:630px!important;margin:0 auto 32px!important;font-weight:500!important;text-shadow:0 1px 10px #0005}
.sonic-fluid-content .hero-buttons{display:flex!important;justify-content:center!important;gap:13px!important;flex-wrap:wrap!important;margin:0!important}
.sonic-fluid-content .hero-buttons .primary{background:#ff6658!important;color:#fff!important;border-color:#ff6658!important;box-shadow:none!important;border-radius:999px!important;font-size:14px!important;font-weight:800!important;min-height:52px!important;padding:14px 28px!important}
.sonic-fluid-content .hero-buttons .primary:hover{background:#e65349!important}
.sonic-fluid-content .hero-buttons .outline{background:#ffffff1d!important;color:#fff!important;border:1px solid #ffffff7a!important;backdrop-filter:blur(9px);border-radius:999px!important;font-size:14px!important;font-weight:800!important;min-height:52px!important;padding:14px 28px!important}
.sonic-fluid-content .hero-note{font-size:12px!important;color:#f2eaf5!important;margin:25px 0 0!important;line-height:1.65!important;max-width:680px!important}
.sonic-fluid-content .hero-meta{display:flex!important;gap:10px!important;justify-content:center!important;flex-wrap:wrap!important;margin:26px 0 0!important}
.sonic-fluid-content .hero-meta span{background:#ffffff1b!important;color:#fff!important;border:1px solid #ffffff50!important;border-radius:999px!important;padding:9px 13px!important;font-size:11px!important;font-weight:700!important}
/* The lifetime offer remains exactly as configured in V30.2, now below the hero. */
.sonic-v31-package{width:min(100% - 48px,1152px);margin:85px auto 15px;padding:0;box-sizing:border-box}
.sonic-v31-package-inner{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:36px;padding:42px;background:#f7f6f3;border:1px solid #e8e5e0;border-radius:30px}
.sonic-v31-eyebrow{font-size:11px;letter-spacing:.15em;color:#a15a2e;font-weight:800}
.sonic-v31-package-heading h2{font-size:clamp(31px,3.6vw,51px);line-height:1.13;letter-spacing:-.055em;margin:14px 0 15px;color:#111}
.sonic-v31-package-heading p{color:#625f5c;font-size:14px;line-height:1.8;max-width:410px;margin:0}
.sonic-v31-package .sonic-v27-offer{max-width:none!important;width:100%!important;margin:0!important;padding:29px!important;border-radius:24px!important;background:#fff!important;border:1px solid #e7e3de!important;box-shadow:none!important;backdrop-filter:none!important;text-align:left!important}
.sonic-v31-package .sonic-v27-kicker{color:#a15a2e!important;font-weight:800!important;letter-spacing:.09em!important}
.sonic-v31-package .sonic-v27-price{font-size:clamp(29px,3vw,40px)!important;line-height:1.2!important;color:#111!important;letter-spacing:-.045em!important}
.sonic-v31-package .sonic-v27-price small{font-size:13px!important;letter-spacing:0!important;color:#666!important}
.sonic-v31-package .sonic-v27-benefits{display:grid!important;gap:10px!important;margin:21px 0!important}
.sonic-v31-package .sonic-v27-benefits span{color:#2d2a27!important;font-size:13px!important;line-height:1.65!important}
.sonic-v31-package .sonic-v27-offer p{font-size:12px!important;line-height:1.75!important;color:#67625e!important;max-width:none!important}
.sonic-v31-package .sonic-v27-cta{display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:999px!important;background:#111!important;color:#fff!important;padding:14px 22px!important;font-size:13px!important;margin-top:12px!important;text-decoration:none!important}
/* Normalize the older content modules which otherwise retained dark backgrounds and unreadable text. */
#features .cards article,#steps .steps article{background:#f7f6f3!important;border:1px solid #e7e3df!important;color:#171717!important}
#features .cards article h3,#steps .steps article h3,#features .cards article strong,#steps .steps article strong{color:#111!important}
#features .cards article p,#steps .steps article p{color:#5e5a57!important}
#features .feature-icon,#steps .steps b{color:#a6582b!important}
#features,#steps,#platforms,#benefits,#requirements,#faq,#solutions,#comparison,#help,#pricing,#why-sonic,#release-guide,#unlimited,#royalty-explained,#faq-extra{color:#171717!important}
#features h2,#steps h2,#platforms h2,#benefits h2,#requirements h2,#faq h2,#solutions h2,#comparison h2,#help h2,#pricing h2,#why-sonic h2,#release-guide h2,#unlimited h2,#royalty-explained h2,#faq-extra h2{color:#111!important}
#features p,#steps p,#platforms p,#benefits p,#requirements p,#faq p,#solutions p,#comparison p,#help p,#pricing p,#why-sonic p,#release-guide p,#unlimited p,#royalty-explained p,#faq-extra p{line-height:1.75}
#faq summary,#faq-extra summary{font-size:14px!important;font-weight:700!important;color:#161616!important;line-height:1.6!important}
#faq details,#faq-extra details{background:#fff!important;border:1px solid #e8e5e0!important;border-radius:16px!important;color:#111!important}
#faq details p,#faq-extra details p{color:#5b5754!important}
#platforms .platform-list span{color:#222!important;background:#f4f2ef!important;border-color:#e7e3de!important}
#security,.security{color:#161616!important}
.final-cta .outline,.final-cta .secondary{color:#fff!important;border-color:#aaa!important}
/* Form dialog remains readable regardless of page theme */
.modal .dialog{background:#fff!important;color:#161616!important;border:1px solid #ddd!important;box-shadow:0 30px 90px #0006!important}
.modal .dialog h2,.modal .dialog label{color:#171717!important}.modal .dialog p{color:#5e5e5e!important}
.modal .dialog input:not([type=checkbox]),.modal .dialog select{background:#fff!important;color:#171717!important;border:1px solid #d5d5d5!important;border-radius:10px!important}
.modal .dialog .close{color:#171717!important}.modal .dialog .form-brand{color:#b15f2c!important}.modal .dialog .switch{color:#a05227!important}
:focus-visible{outline:3px solid #ff958e!important;outline-offset:3px!important}
@media(max-width:1250px){.nav nav{gap:8px!important}.nav nav a{font-size:10px!important}.nav{padding-left:20px!important;padding-right:20px!important}.nav .brand{font-size:12px!important}.sonic-brand-image{width:58px;height:56px}}
@media(max-width:1030px){.nav nav a:nth-child(-n+2),.nav nav a:nth-child(4),.nav nav a:nth-child(5){display:none!important}.nav nav{gap:14px!important}}
@media(max-width:740px){.nav{min-height:76px!important;padding:10px 14px!important;gap:10px!important}.nav nav{display:none!important}.nav .brand{font-size:12px!important;max-width:185px!important}.sonic-brand-image{width:52px;height:50px}.nav-actions{margin-left:auto!important;gap:6px!important}.nav-actions select{min-height:38px!important;padding:6px!important;font-size:11px!important;max-width:68px!important}.nav-actions .ghost{display:none!important}.nav-actions .primary{min-height:38px!important;padding:8px 12px!important;font-size:12px!important}main>.sonic-fluid-hero{height:auto!important;min-height:690px!important;max-height:none!important;padding:95px 18px!important}.sonic-fluid-content h1{font-size:clamp(44px,10.5vw,68px)!important;letter-spacing:-.07em!important}.sonic-fluid-content>p[data-i18n="intro"]{font-size:14px!important;line-height:1.75!important}.sonic-fluid-content .hero-note{font-size:11px!important}.sonic-fluid-content .hero-meta span{font-size:10px!important}.sonic-v31-package{width:calc(100% - 30px);margin:50px auto 10px}.sonic-v31-package-inner{grid-template-columns:1fr;padding:23px;gap:25px}.sonic-v31-package .sonic-v27-offer{padding:23px!important}}
@media(max-width:420px){.nav .brand{font-size:10px!important}.sonic-brand-image{width:44px;height:46px}.sonic-fluid-content h1{font-size:42px!important}.sonic-fluid-content .hero-buttons{width:100%!important}.sonic-fluid-content .hero-buttons .primary,.sonic-fluid-content .hero-buttons .outline{width:100%!important}.sonic-fluid-content>.eyebrow{font-size:9px!important}.sonic-v31-package-inner{padding:15px}.sonic-v31-package .sonic-v27-price{font-size:27px!important}}
@media(prefers-reduced-motion:reduce){.sonic-fluid-hero *{animation:none!important;transition:none!important}}