
:root{
  --bg:#030712; --panel:#0b1022; --card:#10172d; --card2:#141d39; --line:#34415f;
  --text:#ffffff; --muted:#d7def1; --soft:#aeb8d3; --primary:#8b5cf6; --primary2:#d946ef;
  --green:#22c55e; --orange:#f97316; --shadow:0 24px 70px rgba(0,0,0,.48); --radius:26px;
  --font: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;color:var(--text);font-family:var(--font);font-weight:650;letter-spacing:.005em;overflow-x:hidden;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;background:#030712}
button,a,input,select,textarea{font:inherit}
.hidden{display:none!important}
.grid-bg{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black 0,black 72%,transparent)}
.bg-orb{position:fixed;width:340px;height:340px;border-radius:50%;filter:blur(18px);opacity:.24;pointer-events:none}.orb-a{left:-130px;top:170px;background:radial-gradient(circle,var(--primary),transparent 70%)}.orb-b{right:-120px;top:280px;background:radial-gradient(circle,var(--primary2),transparent 70%)}
.app-shell{position:relative;width:min(1160px,94vw);margin:0 auto;padding:22px 0 42px}.hero{position:relative;text-align:center;display:flex;justify-content:center;align-items:flex-start;gap:18px;padding:6px 64px 12px}.hero h1{margin:0;font-size:clamp(34px,5.2vw,72px);line-height:.98;font-weight:950;letter-spacing:.04em;word-break:break-word}.hero p{margin:10px 0 0;font-size:clamp(12px,1.4vw,17px);letter-spacing:.46em;font-weight:900}.secure-pill{position:absolute;right:0;top:16px;border:1px solid color-mix(in srgb,var(--line) 82%,white);background:rgba(7,14,31,.88);border-radius:14px;padding:10px 14px;color:#fff;font-size:13px;font-weight:900;white-space:nowrap}.back-btn{position:absolute;left:0;top:16px;z-index:10;width:52px;height:52px;border-radius:16px;border:1px solid var(--line);background:rgba(15,23,42,.92);color:#fff;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.30)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);align-items:start;margin:16px auto 34px;width:min(760px,100%);position:relative}.steps:before{content:"";position:absolute;left:15%;right:15%;top:21px;height:3px;background:color-mix(in srgb,var(--line) 70%,transparent);border-radius:99px}.step{text-align:center;position:relative;z-index:1;color:var(--soft);font-size:13px;font-weight:850}.step b{display:grid;place-items:center;margin:0 auto 10px;width:44px;height:44px;border-radius:50%;background:var(--card2);color:var(--text);border:1px solid var(--line);font-size:18px}.step.active b{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;box-shadow:0 0 22px color-mix(in srgb,var(--primary) 55%,transparent)}.step.done b{background:linear-gradient(135deg,#16a34a,#4ade80);color:#fff;box-shadow:0 0 18px rgba(34,197,94,.38);font-size:0}.step.done b:after{content:"✓";font-size:21px}.panel{display:none;animation:show .22s ease}.panel.active{display:block}@keyframes show{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
h2{margin:0;text-align:center;font-size:clamp(32px,4.8vw,58px);line-height:1.1;font-weight:950;color:var(--text);letter-spacing:-.025em}.lead{text-align:center;margin:14px auto 28px;color:var(--muted);font-size:clamp(18px,2vw,23px);font-weight:750}.screen-carousel{display:flex;gap:18px;overflow-x:auto;padding:18px 4px 32px;scroll-snap-type:x mandatory;scrollbar-width:none}.screen-carousel::-webkit-scrollbar{display:none}.plan-card{scroll-snap-align:center;flex:0 0 258px;min-height:392px;border:1px solid var(--line);background:linear-gradient(160deg,var(--card2),var(--card));border-radius:28px;padding:20px;text-align:center;box-shadow:var(--shadow);transform:perspective(1000px) rotateY(-4deg) scale(.96);transition:.25s ease;color:var(--text)}.plan-card.selected{border-color:var(--primary);box-shadow:0 0 0 1px color-mix(in srgb,var(--primary) 55%,transparent),0 24px 80px color-mix(in srgb,var(--primary) 24%,transparent);transform:perspective(1000px) rotateY(0) scale(1.05);z-index:2}.badge{display:inline-flex;min-height:31px;align-items:center;justify-content:center;border-radius:999px;background:linear-gradient(90deg,#fb923c,#f97316);padding:7px 14px;color:#fff;font-size:13px;font-weight:950}.plan-number{font-size:84px;line-height:1;margin-top:10px;font-weight:950;color:var(--text)}.plan-card h3{margin:0 0 10px;color:var(--primary);font-size:31px;font-weight:950}.plan-card p{margin:0 auto 16px;color:var(--muted);font-size:16px;line-height:1.45;font-weight:750;max-width:195px}.features{list-style:none;margin:0 0 18px;padding:0;text-align:left;color:var(--muted);font-size:14px;line-height:1.9;font-weight:700}.price{margin-top:auto;font-size:24px;font-weight:950;color:var(--text)}.price small{font-size:14px;color:var(--muted);margin-left:4px}.dots{display:flex;justify-content:center;gap:12px}.dot{width:16px;height:16px;border-radius:50%;border:0;background:#64748b;cursor:pointer}.dot.active{width:38px;border-radius:99px;background:linear-gradient(90deg,var(--primary),var(--primary2))}
.device-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0 auto 18px}.device-card{position:relative;min-height:158px;border:1px solid var(--line);background:linear-gradient(155deg,var(--card2),var(--card));border-radius:24px;padding:24px 18px;color:var(--text);cursor:pointer;box-shadow:0 16px 42px rgba(0,0,0,.22);transition:.2s ease;text-align:center}.device-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--primary) 55%,var(--line))}.device-card.selected{border-color:var(--primary);box-shadow:0 0 0 1px color-mix(in srgb,var(--primary) 44%,transparent),0 18px 55px color-mix(in srgb,var(--primary) 22%,transparent)}.device-card .icon{font-size:44px;line-height:1;margin-bottom:13px;display:block}.device-card h3{margin:0 0 8px;color:var(--text)!important;font-size:clamp(21px,2.15vw,26px);font-weight:950;text-shadow:none;letter-spacing:-.015em}.device-card p{margin:0;color:var(--muted)!important;font-size:clamp(15px,1.45vw,17px);line-height:1.35;font-weight:760;text-shadow:none}.check{position:absolute;right:15px;top:15px;width:31px;height:31px;border-radius:50%;border:3px solid var(--soft);background:transparent;display:grid;place-items:center}.device-card.selected .check{border-color:var(--primary);background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff}.device-card.selected .check:after{content:"✓";font-weight:950;font-size:18px}.qty{position:absolute;left:14px;top:14px;background:var(--primary);color:#fff;border-radius:999px;padding:4px 9px;font-size:13px;font-weight:950}.info-box{margin:24px auto 22px;width:min(620px,100%);border:1px solid color-mix(in srgb,var(--primary) 60%,var(--line));background:color-mix(in srgb,var(--primary) 18%,transparent);color:var(--text);border-radius:15px;padding:15px 18px;text-align:center;font-size:16px;font-weight:760}.primary-btn,.whatsapp-btn{display:flex;align-items:center;justify-content:center;margin:0 auto;min-height:62px;border:0;border-radius:18px;background:linear-gradient(90deg,var(--primary),var(--primary2));color:#fff!important;text-decoration:none;padding:16px 28px;font-weight:950;font-size:22px;cursor:pointer;box-shadow:0 16px 45px color-mix(in srgb,var(--primary) 30%,transparent)}.primary-btn:disabled{opacity:.45;cursor:not-allowed}.whatsapp-btn{max-width:470px;gap:10px;background:linear-gradient(90deg,#16a34a,#22c55e);flex-direction:column;font-size:19px}.whatsapp-btn small{font-size:14px;font-weight:750}.safe-note{text-align:center;color:var(--muted);font-weight:700}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:0 auto 24px}.result-card{border:1px solid var(--line);background:linear-gradient(155deg,var(--card2),var(--card));border-radius:24px;padding:22px;box-shadow:var(--shadow);color:var(--text)}.tag{display:inline-block;background:linear-gradient(90deg,var(--primary),var(--primary2));color:#fff;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:950}.result-head{display:flex;align-items:center;gap:14px;margin:17px 0}.result-head .icon{font-size:40px}.result-head h3{margin:0;color:var(--text);font-size:24px}.result-head p{margin:4px 0 0;color:var(--muted)}.result-card>b{display:block;color:var(--soft);font-size:12px;letter-spacing:.08em;margin-top:10px}.apps{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.app-chip{display:inline-flex;align-items:center;justify-content:center;min-height:42px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;border-radius:13px;padding:10px 13px;font-weight:900}.result-card small{display:block;color:var(--soft);font-weight:850;margin-top:12px}.code-box{display:flex;justify-content:space-between;align-items:center;gap:10px;background:color-mix(in srgb,var(--panel) 78%,transparent);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-top:7px}.code-box span{font-size:25px;letter-spacing:.08em;font-weight:950}.copy-btn{border:0;border-radius:10px;background:var(--primary);color:#fff;padding:8px 10px;font-weight:900;cursor:pointer}.download-link{display:block;margin-top:14px;color:var(--text);font-weight:900}.android-notice{border:1px solid rgba(34,197,94,.52);background:rgba(34,197,94,.12);border-radius:18px;padding:16px;margin:0 auto 20px;max-width:760px;color:var(--text);font-weight:850;text-align:center}.benefits{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:34px;border:1px solid var(--line);border-radius:22px;padding:14px;background:rgba(11,16,34,.52)}.benefits article{display:flex;flex-direction:column;gap:4px;color:var(--text);font-size:14px}.benefits span{color:var(--muted);font-size:12px}
/* Layout 1: Premium 3D Roxo */
body[data-theme="premium3d"]{--bg:#030712;--panel:#0b1022;--card:#080d1d;--card2:#111831;--line:#34415f;--text:#ffffff;--muted:#dfe6fb;--soft:#aeb8d3;background:radial-gradient(circle at top,#111947 0,#030712 55%,#000 100%)}
body[data-theme="premium3d"] .hero h1{background:linear-gradient(90deg,#f5d0fe,#a78bfa,#ffffff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 13px 40px rgba(139,92,246,.25)}
body[data-theme="premium3d"] .hero p{color:#f8fbff}body[data-theme="premium3d"] h2{text-shadow:0 4px 24px rgba(0,0,0,.62)}body[data-theme="premium3d"] .device-card .icon{filter:drop-shadow(0 0 12px color-mix(in srgb,var(--primary) 55%,transparent))}
/* Layout 2: Moderno Claro - tudo legível no fundo branco */
body[data-theme="cleanlight"]{--bg:#f6f8fc;--panel:#ffffff;--card:#ffffff;--card2:#f8fafc;--line:#d5deee;--text:#101828;--muted:#344054;--soft:#64748b;background:linear-gradient(135deg,#f8fbff 0%,#edf4ff 48%,#f8fbff 100%)}
body[data-theme="cleanlight"] .grid-bg{background-image:linear-gradient(rgba(15,23,42,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.04) 1px,transparent 1px);mask-image:none}body[data-theme="cleanlight"] .bg-orb{opacity:.13;filter:blur(28px)}body[data-theme="cleanlight"] .hero h1{color:#111827;background:none;-webkit-text-fill-color:#111827;text-shadow:none;letter-spacing:.035em}body[data-theme="cleanlight"] .hero p,body[data-theme="cleanlight"] h2,body[data-theme="cleanlight"] .lead{color:#111827;text-shadow:none}body[data-theme="cleanlight"] .lead{color:#475467}body[data-theme="cleanlight"] .secure-pill,body[data-theme="cleanlight"] .back-btn{background:#fff;color:#111827;border-color:#cbd5e1;box-shadow:0 8px 24px rgba(15,23,42,.10)}body[data-theme="cleanlight"] .step{color:#334155}body[data-theme="cleanlight"] .step b{background:#fff;color:#111827;border-color:#c7d2fe}body[data-theme="cleanlight"] .step.active b,body[data-theme="cleanlight"] .step.done b{color:#fff}body[data-theme="cleanlight"] .plan-card,body[data-theme="cleanlight"] .device-card,body[data-theme="cleanlight"] .result-card{background:#fff;border-color:#d8e1ef;box-shadow:0 18px 48px rgba(15,23,42,.10)}body[data-theme="cleanlight"] .plan-card h3{color:var(--primary)}body[data-theme="cleanlight"] .plan-number,body[data-theme="cleanlight"] .price,body[data-theme="cleanlight"] .device-card h3,body[data-theme="cleanlight"] .result-head h3{color:#101828!important}body[data-theme="cleanlight"] .plan-card p,body[data-theme="cleanlight"] .features,body[data-theme="cleanlight"] .device-card p,body[data-theme="cleanlight"] .result-head p,body[data-theme="cleanlight"] .safe-note,body[data-theme="cleanlight"] .benefits span{color:#344054!important}body[data-theme="cleanlight"] .device-card.selected{background:#fff;box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 45%,transparent),0 20px 60px rgba(15,23,42,.12)}body[data-theme="cleanlight"] .info-box{color:#111827;background:#f4f0ff}body[data-theme="cleanlight"] .code-box{background:#f8fafc}body[data-theme="cleanlight"] .benefits{background:#fff;color:#111827;box-shadow:0 18px 48px rgba(15,23,42,.08)}body[data-theme="cleanlight"] .benefits article,body[data-theme="cleanlight"] .result-card{color:#111827}
/* Layout 3: Simples e legível - alto contraste, menos efeitos */
body[data-theme="accessible"]{--bg:#071b1f;--panel:#09262b;--card:#0f3a40;--card2:#12464e;--line:#2dd4bf;--text:#ffffff;--muted:#e8fffb;--soft:#b7f7ee;--primary:#14b8a6;--primary2:#22c55e;background:linear-gradient(135deg,#061317,#08292e 55%,#061317)}
body[data-theme="accessible"] .grid-bg{background-image:none}body[data-theme="accessible"] .bg-orb{opacity:.10}body[data-theme="accessible"] .hero h1{color:#fff;background:none;-webkit-text-fill-color:#fff;text-shadow:none;font-size:clamp(34px,4.8vw,62px)}body[data-theme="accessible"] .hero p{letter-spacing:.28em;color:#dffcf7}body[data-theme="accessible"] h2{text-shadow:none;font-size:clamp(32px,4.4vw,52px)}body[data-theme="accessible"] .device-grid{grid-template-columns:1fr;max-width:760px}body[data-theme="accessible"] .device-card{display:grid;grid-template-columns:62px 1fr 40px;align-items:center;text-align:left;min-height:106px;padding:18px 22px;background:linear-gradient(135deg,#12464e,#0d3338);border-radius:18px}body[data-theme="accessible"] .device-card .check{grid-column:3;position:static;justify-self:end;grid-row:1/3}body[data-theme="accessible"] body[data-theme="accessible"] .device-card .icon{grid-column:1;grid-row:1/3;margin:0;font-size:42px}body[data-theme="accessible"] .device-card h3{grid-column:2;margin:0 0 6px;font-size:25px}body[data-theme="accessible"] .device-card p{grid-column:2;font-size:17px}.qty{z-index:2}body[data-theme="accessible"] .plan-card{transform:none;min-height:360px}body[data-theme="accessible"] .plan-card.selected{transform:scale(1.03)}body[data-theme="accessible"] .primary-btn{font-size:24px;min-height:70px}body[data-theme="accessible"] .benefits{grid-template-columns:repeat(3,1fr)}

/* Cor personalizada do nome da empresa definida no painel admin */
body.has-brand-name-color .hero h1{
  background:none!important;
  color:var(--brand-name-color)!important;
  -webkit-text-fill-color:var(--brand-name-color)!important;
  text-shadow:0 10px 34px color-mix(in srgb,var(--brand-name-color) 30%,transparent)!important;
}
body[data-theme="cleanlight"].has-brand-name-color .hero h1{
  text-shadow:none!important;
}

@media(max-width:900px){.app-shell{width:min(94vw,720px);padding-top:16px}.hero{padding:58px 0 8px}.secure-pill{right:0;top:8px}.back-btn{top:8px}.hero h1{font-size:clamp(34px,11vw,54px)}.hero p{letter-spacing:.25em}.steps{margin-bottom:26px}.device-grid{grid-template-columns:1fr 1fr;gap:14px}.benefits{grid-template-columns:1fr 1fr}.screen-carousel{padding-left:10px}.device-card{min-height:145px}body[data-theme="accessible"] .device-grid{grid-template-columns:1fr}}
@media(max-width:560px){.hero{padding-top:60px}.secure-pill{font-size:12px;padding:8px 10px}.steps span{font-size:11px}.step b{width:38px;height:38px}.steps:before{top:18px}h2{font-size:33px}.lead{font-size:18px}.device-grid{grid-template-columns:1fr}.device-card{min-height:132px}.benefits{grid-template-columns:1fr}.plan-card{flex-basis:82vw}.primary-btn{width:100%;font-size:20px}.info-box{font-size:15px}}

/* Correções finais de contraste por layout */
body[data-theme="cleanlight"] #screenStep h2,
body[data-theme="cleanlight"] #deviceStep h2,
body[data-theme="cleanlight"] #resultStep h2{
  color:#0f172a!important;
  -webkit-text-fill-color:#0f172a!important;
  background:none!important;
  text-shadow:none!important;
}
body[data-theme="cleanlight"] #screenStep .lead,
body[data-theme="cleanlight"] #deviceStep .lead,
body[data-theme="cleanlight"] #resultStep .lead{
  color:#475569!important;
  -webkit-text-fill-color:#475569!important;
}
body[data-theme="accessible"] .device-card .icon{grid-column:1;grid-row:1/3;margin:0;font-size:42px}
