:root { --ink:#070706; --panel:#11110f; --orange:#ff5a1f; --orange-soft:#ff9b4a; --olive:#9eb341; --cream:#f5efe7; --muted:#aaa39b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; color:var(--cream); background:radial-gradient(circle at 78% 18%,rgba(255,90,31,.16),transparent 30rem),linear-gradient(135deg,#050504 0%,#0b0b09 56%,#12100c 100%); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { width:min(1180px,calc(100% - 40px)); height:84px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.1); }
.brand { display:flex; align-items:center; gap:12px; color:var(--orange); font-size:24px; font-weight:700; }
.brand-mark { position:relative; width:40px; height:40px; display:block; border:2px solid var(--orange); border-right-color:transparent; border-radius:50%; box-shadow:0 0 22px rgba(255,90,31,.28); }
.brand-mark::before,.brand-mark::after { content:""; position:absolute; border:2px solid var(--orange); border-right-color:transparent; border-radius:50%; inset:5px; }
.brand-mark::after { inset:12px; background:var(--orange); box-shadow:0 0 14px var(--orange); }
.brand-mark i { position:absolute; width:14px; height:2px; right:-6px; top:18px; background:var(--orange); }
nav { display:flex; gap:28px; color:var(--muted); font-size:14px; }
nav a:hover,nav a:focus-visible { color:var(--cream); }
.hero { width:min(1180px,calc(100% - 40px)); min-height:calc(100vh - 84px); margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:72px; padding:54px 0 72px; }
.eyebrow { margin:0 0 20px; color:var(--orange); letter-spacing:.18em; text-transform:uppercase; font-size:12px; font-weight:800; }
h1 { max-width:720px; margin:0; font-size:clamp(48px,6vw,78px); line-height:.98; letter-spacing:-.05em; }
.lead { max-width:640px; margin:28px 0 0; color:var(--muted); font-size:19px; line-height:1.65; }
.hero-actions { display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.button { min-height:52px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; border-radius:16px; border:1px solid rgba(255,255,255,.14); font-weight:700; transition:transform .2s,border-color .2s; }
.button:hover { transform:translateY(-2px); }
.button.primary { color:#130704; background:linear-gradient(145deg,var(--orange-soft),var(--orange)); border-color:var(--orange); box-shadow:0 14px 40px rgba(255,90,31,.22); }
.button.secondary { background:rgba(255,255,255,.035); }
.hero-notes { display:flex; flex-wrap:wrap; gap:22px; margin:30px 0 0; padding:0; list-style:none; color:#c9c2ba; font-size:13px; }
.hero-notes li::before { content:"•"; color:var(--olive); margin-right:9px; }
.device-stage { display:flex; justify-content:center; perspective:1200px; }
.hero-screenshot-frame { width:min(390px,100%); padding:8px; position:relative; border:1px solid rgba(255,140,83,.42); border-radius:38px; background:linear-gradient(145deg,#242421,#050505 62%); box-shadow:0 50px 110px rgba(0,0,0,.72),inset 1px 1px rgba(255,255,255,.14),0 0 0 7px #070706; transform:rotateY(-7deg) rotateX(2deg); }
.hero-screenshot-frame::after { content:""; position:absolute; inset:8px; pointer-events:none; border-radius:30px; background:linear-gradient(115deg,rgba(255,255,255,.07),transparent 25%); }
.hero-screenshot { display:block; width:100%; height:auto; border-radius:30px; }
@media (max-width:900px) { .site-header nav{display:none}.hero{grid-template-columns:1fr;text-align:center;gap:52px}.lead{margin-inline:auto}.hero-actions,.hero-notes{justify-content:center}.hero-screenshot-frame{transform:none} }
@media (max-width:520px) { .site-header,.hero{width:min(100% - 28px,1180px)}.site-header{height:72px}.brand{font-size:20px}.hero{padding-top:38px}.hero h1{font-size:44px}.lead{font-size:17px}.button{width:100%} }

.section { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:120px 0; }
.section-heading { display:grid; grid-template-columns:1fr 1.2fr; column-gap:70px; align-items:end; margin-bottom:48px; }
.section-heading .eyebrow { grid-column:1/-1; }.section h2 { margin:0; font-size:clamp(40px,5vw,66px); line-height:1.02; letter-spacing:-.04em; }.section-heading>p:last-child,.section-copy,.access-copy>p:last-child,.support>div>p:last-child { color:var(--muted); line-height:1.7; font-size:17px; }
.feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }.feature-card { min-height:280px; padding:34px; position:relative; border:1px solid rgba(255,255,255,.11); border-radius:26px; background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); box-shadow:inset 1px 1px rgba(255,255,255,.06); }.feature-card>span { color:var(--orange); font-size:12px; font-weight:800; letter-spacing:.16em; }.feature-card h3 { margin:72px 0 13px; font-size:25px; }.feature-card p { margin:0; color:var(--muted); line-height:1.65; }
.radio-showcase { display:grid; grid-template-columns:1.05fr .95fr; gap:90px; align-items:center; }
.radio-screens { min-height:620px; position:relative; perspective:1400px; }
.product-shot { display:block; width:100%; height:auto; border-radius:28px; border:1px solid rgba(255,126,63,.32); box-shadow:0 32px 70px rgba(0,0,0,.6); }
.radio-screens .product-shot { position:absolute; width:61%; }
.radio-player-shot { left:0; top:54px; z-index:2; transform:rotateY(5deg) rotateZ(-1deg); }
.radio-catalog-shot { right:0; top:0; opacity:.82; transform:rotateY(-8deg) rotateZ(1.5deg); }
.stat-row { display:flex; gap:38px; margin-top:34px; }.stat-row span { display:grid;gap:5px}.stat-row strong { color:var(--orange);font-size:20px}.stat-row small { color:var(--muted) }
.drawer-showcase { display:grid; grid-template-columns:1fr .85fr; gap:90px; align-items:center; }
.drawer-shot-frame { width:min(440px,100%); justify-self:end; padding:9px; border-radius:36px; background:linear-gradient(145deg,#242421,#050505); box-shadow:0 42px 90px rgba(0,0,0,.58),inset 1px 1px rgba(255,255,255,.12); }
.drawer-shot-frame .product-shot { border-radius:28px; }
.section-heading.compact { display:block; max-width:750px; }.section-heading.compact .eyebrow { margin-bottom:18px; }.section-heading.compact>p:last-child { max-width:650px; }
.theme-row { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(290px,350px); gap:20px; overflow-x:auto; padding:6px 5px 30px; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:var(--orange) rgba(255,255,255,.06); perspective:1400px; }
.theme-card { margin:0; padding:10px 10px 22px; overflow:hidden; scroll-snap-align:center; border:1px solid rgba(255,255,255,.12); border-radius:28px; background:linear-gradient(145deg,#1a1a18,#090908); box-shadow:0 24px 50px rgba(0,0,0,.42),inset 1px 1px rgba(255,255,255,.08); transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease; }
.theme-card:hover { transform:translateY(-7px) rotateY(-2deg); border-color:rgba(255,90,31,.58); box-shadow:0 32px 64px rgba(0,0,0,.54),0 0 34px rgba(255,90,31,.1); }
.theme-screenshot { display:block; width:100%; height:auto; border-radius:20px; }
.theme-card figcaption { padding:16px 10px 0; }.theme-card h3 { margin:0 0 7px;font-size:19px}.theme-card p { margin:0;color:var(--muted);font-size:13px;line-height:1.5 }
.access { display:grid;grid-template-columns:1fr 420px;gap:90px;align-items:center}.price-card { padding:34px;border:1px solid rgba(255,90,31,.35);border-radius:28px;background:linear-gradient(145deg,#181713,#0a0a08);box-shadow:0 28px 70px rgba(0,0,0,.4),inset 1px 1px rgba(255,255,255,.08)}.price-badge { display:inline-flex;padding:8px 12px;border-radius:999px;color:var(--orange);background:rgba(255,90,31,.1);font-size:12px;font-weight:800}.price-line { display:grid;grid-template-columns:130px 1fr;align-items:baseline;gap:15px;padding:25px 0;border-bottom:1px solid rgba(255,255,255,.1)}.price-line strong { font-size:34px }.price-line small,.price-card p { color:var(--muted);line-height:1.55}.price-card .button { width:100%;margin-top:10px }
.support { display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}.support-links { border-top:1px solid rgba(255,255,255,.16) }.support-links a { min-height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.16);color:#d9d3cc}.support-links a:hover { color:var(--orange) }
footer { width:min(1180px,calc(100% - 40px));min-height:150px;margin:0 auto;padding:35px 0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-top:1px solid rgba(255,255,255,.12);color:var(--muted);font-size:13px}footer .brand { font-size:18px }footer>div { display:flex;justify-content:flex-end;gap:20px }
.legal-shell { min-height:100vh }.legal-article { width:min(780px,calc(100% - 40px));margin:0 auto;padding:92px 0 120px}.back-link { display:inline-block;margin-bottom:50px;color:var(--muted)}.legal-article h1 { margin-bottom:24px;font-size:clamp(44px,7vw,74px)}.legal-intro { margin:0 0 60px;color:#ccc4bc;font-size:20px;line-height:1.65}.legal-article h2 { margin:50px 0 13px;font-size:27px}.legal-article p,.legal-article li { color:var(--muted);font-size:16px;line-height:1.75}.legal-article li { margin-bottom:8px}.legal-date { margin-top:70px;padding-top:25px;border-top:1px solid rgba(255,255,255,.12) }
.support-email { color:var(--orange); font-weight:800; overflow-wrap:anywhere; }
.support-email:hover,.support-email:focus-visible { color:var(--orange-soft); text-decoration:underline; text-underline-offset:4px; }
.skip-link { position:fixed; left:16px; top:-80px; z-index:20; padding:12px 16px; border-radius:12px; color:#160703; background:var(--orange); font-weight:800; }
.skip-link:focus { top:16px; }

@media (max-width:900px) { .section{padding:86px 0}.section-heading,.radio-showcase,.drawer-showcase,.access,.support{grid-template-columns:1fr;gap:45px}.feature-grid{grid-template-columns:1fr}.feature-card{min-height:230px}.feature-card h3{margin-top:45px}.radio-screens{width:min(650px,100%);min-height:0;aspect-ratio:.675;margin:0 auto}.drawer-shot-frame{justify-self:center}.access{max-width:680px}.price-card{width:100%}footer{grid-template-columns:1fr;text-align:center}footer .brand,footer>div{justify-self:center} }
@media (max-width:520px) { .section{width:min(100% - 28px,1180px);padding:72px 0}.radio-screens{aspect-ratio:.6}.radio-screens .product-shot{width:67%}.radio-player-shot{top:40px}.theme-row{grid-auto-columns:82vw;margin-right:-14px}.theme-card{padding:7px 7px 17px}.theme-card h3{font-size:17px}.stat-row{gap:20px;flex-direction:column}.price-line{grid-template-columns:1fr;gap:4px}.support{gap:32px}footer{width:min(100% - 28px,1180px)} }

.text-button { min-height:52px; padding-inline:10px; border-color:transparent; color:var(--orange-soft); }
.text-button:hover,.text-button:focus-visible { border-color:rgba(255,155,74,.35); }
.quote-showcase { display:grid; grid-template-columns:.92fr 1.08fr; gap:78px; align-items:center; }
.quote-copy h2 { margin-bottom:26px; }
.quote-copy>.button { margin-top:30px; }
.quote-flow { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:34px 0 22px; }
.quote-flow span { min-height:112px; display:flex; flex-direction:column; justify-content:space-between; padding:18px; border:1px solid rgba(255,90,31,.3); border-radius:20px; background:linear-gradient(145deg,rgba(255,90,31,.1),rgba(255,255,255,.02)); }
.quote-flow strong { color:var(--orange); font-size:27px; }
.quote-flow small { color:#cbc4bc; line-height:1.35; }
.rare-note { margin:0; padding-left:18px; border-left:2px solid var(--olive); color:#c7c0b8; line-height:1.65; }
.quote-visuals { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start; }
.quote-visuals .product-frame:nth-child(2) { margin-top:70px; }
.product-frame,.wide-shot { margin:0; padding:8px; border:1px solid rgba(255,126,63,.32); border-radius:30px; background:linear-gradient(145deg,#242421,#050505 62%); box-shadow:0 32px 70px rgba(0,0,0,.55),inset 1px 1px rgba(255,255,255,.1); }
.product-frame img,.wide-shot img { display:block; width:100%; height:auto; border-radius:22px; }
.product-visual-grid { display:grid; grid-template-columns:minmax(280px,430px) 1fr; gap:60px; align-items:start; }
.wide-shot { width:100%; }
.wide-shot figcaption { padding:16px 12px 10px; color:var(--muted); font-size:13px; }
.pro-feature-list { display:grid; gap:14px; }
.pro-feature-list article { min-height:190px; padding:28px; border:1px solid rgba(255,255,255,.11); border-radius:24px; background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); }
.pro-feature-list span,.plan-label { color:var(--orange); font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.pro-feature-list h3 { margin:30px 0 10px; font-size:25px; }
.pro-feature-list p { margin:0; color:var(--muted); line-height:1.65; }
.sound-showcase { display:grid; gap:28px; }
.sound-card { display:grid; grid-template-columns:1fr minmax(270px,380px); gap:70px; align-items:center; padding:44px; border:1px solid rgba(255,255,255,.11); border-radius:30px; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015)); }
.sound-card.reverse { grid-template-columns:minmax(270px,380px) 1fr; }
.compact-frame { width:100%; }
.compare-wrap { overflow-x:auto; border:1px solid rgba(255,255,255,.12); border-radius:26px; background:rgba(255,255,255,.025); }
.compare-wrap:focus-visible { outline:2px solid var(--orange); outline-offset:4px; }
.comparison table { width:100%; min-width:720px; border-collapse:collapse; }
.comparison th,.comparison td { padding:20px 24px; text-align:left; border-bottom:1px solid rgba(255,255,255,.09); }
.comparison th { color:var(--orange-soft); font-size:13px; letter-spacing:.08em; text-transform:uppercase; background:rgba(255,90,31,.06); }
.comparison td { color:#d9d3cc; line-height:1.5; }
.comparison th:not(:first-child),.comparison td:not(:first-child) { width:20%; text-align:center; }
.comparison tbody tr:last-child td { border-bottom:0; }
.plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.plan-card { min-height:360px; display:flex; flex-direction:column; padding:34px; border:1px solid rgba(255,255,255,.12); border-radius:28px; background:linear-gradient(145deg,#171714,#090908); box-shadow:inset 1px 1px rgba(255,255,255,.06); }
.plan-card.featured { border-color:rgba(255,90,31,.65); background:radial-gradient(circle at 85% 12%,rgba(255,90,31,.2),transparent 15rem),linear-gradient(145deg,#1c1712,#090908); box-shadow:0 28px 70px rgba(255,90,31,.09),inset 1px 1px rgba(255,255,255,.08); }
.plan-card h3 { margin:54px 0 16px; color:var(--cream); font-size:48px; letter-spacing:-.04em; }
.plan-card p { margin:0 0 28px; color:var(--muted); line-height:1.65; }
.plan-card .button { width:100%; margin-top:auto; }
.theme-plan { grid-column:1/-1; min-height:260px; }
.theme-plan h3 { margin-top:36px; }
.support .hero-actions { margin-top:26px; }
footer>div { flex-wrap:wrap; }

@media (max-width:900px) {
  .quote-showcase,.product-visual-grid { grid-template-columns:1fr; }
  .quote-copy { max-width:720px; }
  .quote-visuals { max-width:680px; margin:0 auto; }
  .product-visual-grid .wide-shot { width:min(430px,100%); justify-self:center; }
  .sound-card,.sound-card.reverse { grid-template-columns:1fr; padding:34px; }
  .sound-card.reverse .product-frame { order:2; }
  .compact-frame { width:min(420px,100%); justify-self:center; }
}

@media (max-width:640px) {
  .hero h1 { font-size:clamp(40px,12vw,54px); }
  .quote-flow { grid-template-columns:1fr; }
  .quote-flow span { min-height:90px; }
  .quote-visuals { gap:10px; }
  .quote-visuals .product-frame:nth-child(2) { margin-top:34px; }
  .sound-card { padding:24px; }
  .plans { grid-template-columns:1fr; }
  .theme-plan { grid-column:auto; }
  .plan-card { min-height:320px; padding:28px; }
  .plan-card h3 { margin-top:42px; }
}
