
:root{
  --primary:#1e40af; --primary-600:#1d4ed8;
  --accent:#f59e0b; --accent-600:#d97706;
  --bg:#0b1220; --card:#0f172a; --text:#e5e7eb; --muted:#9ca3af;
  --shadow:0 10px 30px rgba(0,0,0,.25); --radius:18px
}
html,body{height:100%} body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
background:linear-gradient(180deg,#0b1220 0%,#0d1b2a 60%,#0b1220 100%);color:var(--text)}
.navbar{background:rgba(13,27,42,.7)!important;backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06)}
.brand-logo{height:40px;width:auto}
.btn-accent{background:var(--accent);color:#111827;border:none;box-shadow:var(--shadow)}
.btn-accent:hover{background:var(--accent-600);color:#0b0f19}
.btn-primary{background:linear-gradient(180deg,var(--primary-600),var(--primary));border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}
.btn-primary:hover{filter:brightness(1.05)}
.hero{position:relative;padding:90px 0 60px;background:
radial-gradient(1000px 400px at 10% 10%, rgba(14,165,233,.15), transparent 60%),
radial-gradient(800px 300px at 90% 20%, rgba(245,158,11,.12), transparent 70%)}
.hero h1{font-weight:800;letter-spacing:.3px}
.badge-chip{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.08);
padding:.35rem .7rem;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:.9rem;color:#fef3c7}
.phone-mock{border-radius:30px;border:1px solid rgba(255,255,255,.15);box-shadow:0 25px 60px rgba(0,0,0,.45)}
.section-title{font-weight:800;letter-spacing:.2px}
.card-modern{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.10);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-modern .icon{font-size:28px;width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;
background:rgba(37,99,235,.18);border:1px solid rgba(255,255,255,.12)}
.pricing-card{position:relative;border-radius:22px;background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.12);padding:28px;height:100%;transition:transform .25s ease, box-shadow .25s ease}
.pricing-card:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(0,0,0,.35)}
.pricing-card.popular{border:2px solid var(--accent);box-shadow:0 20px 70px rgba(245,158,11,.25)}
.pricing-price{font-size:40px;font-weight:800}
.pricing-desc{color:var(--muted)}
.ribbon{position:absolute;top:16px;left:16px;background:#0ea5e9;color:#05253b;font-weight:700;font-size:.85rem;
padding:.3rem .6rem;border-radius:999px;border:1px solid rgba(255,255,255,.2)}
.ribbon.right{left:auto;right:16px;background:var(--accent);color:#1f2937}
ul.checks{list-style:none;padding-left:0;margin:0}
ul.checks li{padding-left:28px;position:relative;margin:.6rem 0;color:#e5e7eb}
ul.checks li:before{content:"\f00c";font:normal normal normal 14px/1 "Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:2px;color:#22c55e}
footer{border-top:1px solid rgba(255,255,255,.08);background:rgba(13,27,42,.7)}
.progress-steps{display:flex;gap:.75rem}.progress-steps .step{flex:1;height:8px;border-radius:8px;background:rgba(255,255,255,.14)}
.progress-steps .step.active{background:linear-gradient(90deg,var(--accent),var(--primary-600))}
.summary{position:sticky;top:20px;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.input-stepper{display:flex;align-items:center;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.15)}
.input-stepper input{width:70px;text-align:center;background:transparent;border:none;color:var(--text);padding:.6rem 0}
.input-stepper button{background:rgba(255,255,255,.08);color:#fff;border:none;width:44px;height:44px}
.form-control,.form-select,textarea{background:rgba(255,255,255,.06)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:12px!important}
.form-control::placeholder{color:#9ca3af}
.accordion-button{background:rgba(255,255,255,.06);color:#fff}
.accordion-item{background:transparent;border-color:rgba(255,255,255,.15)}
.small-muted{color:#9ca3af;font-size:.9rem}
a{color:#93c5fd}a:hover{color:#bfdbfe}
.gallery img{border-radius:16px;border:1px solid rgba(255,255,255,.12);box-shadow:0 15px 40px rgba(0,0,0,.3)}
.fullscreen{min-height:100vh;display:flex;align-items:center;justify-content:center}
.game-card{max-width:900px;width:100%;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:24px;box-shadow:var(--shadow)}
.opt{border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:14px;cursor:pointer}
.opt:hover{background:rgba(255,255,255,.08)}
.result-badge{background:#10b981;color:#062e2e;padding:.5rem .8rem;border-radius:999px;font-weight:700;display:inline-block}
