:root{
  --accent:#f47a1f;
  --accent-dim:#a85618;
  --accent-bg:#3a2310;
  --gold:#f0920f;
}

body{
  background:
    radial-gradient(1100px 600px at 75% -10%, rgba(244,122,31,.06), transparent 60%),
    radial-gradient(900px 700px at 10% 20%, rgba(244,122,31,.025), transparent 60%),
    var(--bg);
}

.btn-primary:hover{background:#ff8f3a;box-shadow:0 6px 28px -8px rgba(244,122,31,.55)}
.cta-row .btn-primary{background:linear-gradient(105deg,#f47a1f 0%,#f0920f 52%,#ffb257 100%);color:#160a02}
.cta-row .btn-primary:hover{background:linear-gradient(105deg,#ff8f3a 0%,#ffa63a 52%,#ffc27a 100%);box-shadow:0 6px 30px -8px rgba(244,122,31,.55)}
@keyframes cta-breathe{
  0%,100%{box-shadow:0 0 0 0 rgba(244,122,31,0)}
  50%{box-shadow:0 6px 30px -8px rgba(244,122,31,.5)}
}
@keyframes glint{
  0%,70%,100%{color:var(--text-dim);text-shadow:none}
  82%{color:var(--text);text-shadow:0 0 10px rgba(244,122,31,.55)}
  94%{color:var(--text-dim);text-shadow:0 0 0 rgba(244,122,31,0)}
}

.hero::before{background:none;animation:none}
.hero-fx{background:radial-gradient(660px 520px at 70% 42%, rgba(244,122,31,.12), rgba(244,122,31,.03) 48%, transparent 70%)}
.hero-fx::before{background:radial-gradient(640px 580px at 14% 62%, rgba(240,146,15,.16), transparent 64%)}
.hero-fx::after{background:radial-gradient(440px 360px at 50% 66%, rgba(244,122,31,.05), transparent 64%)}
.hero-vignette{
  background:
    linear-gradient(118deg, rgba(244,122,31,.06) 0%, transparent 32%, transparent 58%, rgba(240,146,15,.09) 100%),
    radial-gradient(126% 122% at 50% 38%, transparent 48%, rgba(7,8,10,.5) 100%),
    linear-gradient(180deg, rgba(7,8,10,.32) 0%, transparent 22%, transparent 66%, rgba(7,8,10,.62) 100%);
}
.hero-topo path{stroke:rgba(244,122,31,.18)}
.hero-topo .t-gold path{stroke:rgba(240,146,15,.16)}
.hero-motes{display:none}

.hero h1 .accent::after{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 52%),
    linear-gradient(100deg, rgba(244,122,31,.34) 0%, rgba(240,146,15,.36) 100%);
}

.screen{box-shadow:0 0 0 1px rgba(255,255,255,.01) inset,0 30px 60px -30px rgba(0,0,0,.7),0 0 100px -30px rgba(244,122,31,.22)}
.hero .screen{
  box-shadow:
    0 0 0 1px rgba(244,122,31,.1) inset,
    0 30px 70px -28px rgba(0,0,0,.75),
    0 0 130px -22px rgba(244,122,31,.24),
    0 0 70px -30px rgba(240,146,15,.14);
}
.hero .screen::before{background:linear-gradient(180deg, rgba(244,122,31,.12), transparent 16%)}

.step-num::after{
  background:
    linear-gradient(90deg, transparent, rgba(244,122,31,.9), transparent),
    linear-gradient(90deg, var(--accent-dim), transparent);
  background-size:38% 100%, 100% 100%;
  background-repeat:no-repeat;
  background-position:-55% 0, 0 0;
}
@keyframes glyph-bob{
  0%,100%{transform:translateY(0);filter:drop-shadow(0 0 0 rgba(244,122,31,0))}
  50%{transform:translateY(-3px);filter:drop-shadow(0 0 6px rgba(244,122,31,.5))}
}

.price-card::after{
  background:conic-gradient(from var(--edge-angle),
    transparent 0deg,transparent 240deg,
    rgba(244,122,31,.15) 280deg,rgba(244,122,31,.85) 310deg,rgba(244,122,31,.15) 340deg,
    transparent 360deg);
}
.price-card:hover{box-shadow:0 18px 40px -22px rgba(0,0,0,.7), 0 0 60px -30px rgba(244,122,31,.18)}

.sticky-cta:hover{background:#ff8f3a}
.vid-thumb{background:radial-gradient(circle at 50% 50%, rgba(244,122,31,.05), transparent 60%), linear-gradient(180deg, var(--surface-2), var(--bg-2))}

.svr-hero-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center;position:relative;z-index:1}
.svr-shot{margin:0;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#0a0c0e;box-shadow:0 0 0 1px rgba(244,122,31,.08) inset,0 30px 70px -28px rgba(0,0,0,.8),0 0 120px -30px rgba(244,122,31,.22)}
.svr-shot img{display:block;width:100%;height:auto}
.hero .svr-shot{max-width:640px;margin-left:0;margin-right:auto}

@media (max-width: 980px){
  .svr-hero-grid{grid-template-columns:1fr;gap:28px}
  .hero .svr-shot{width:100%;max-width:560px;margin-inline:auto}
}