/* NAVEG-FI — design system do portal cativo. Auto-suficiente: fonte e logo
   são assets locais (/assets), que carregam antes do cliente ter internet. */
@font-face{ font-family:'Sora'; src:url(/assets/sora.woff2) format('woff2');
  font-weight:100 800; font-style:normal; font-display:swap; }
:root{
  --bg:#060a1e; --bg-2:#0a1030; --card:rgba(16,23,54,.62); --card-2:rgba(12,18,44,.6);
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.14);
  --txt:#f0f3fb; --muted:#98a1cf; --muted-2:#6a7297;
  --g1:#57d63a; --g2:#12a24a; --accent:#43cf7d;
  --disp:'Sora',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ok:#3fd07a; --err:#ff6b6b; --radius:18px;
}
*{ box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body{ font-family:var(--body); color:var(--txt); background:var(--bg);
  background-image:
    radial-gradient(60% 42% at 82% -6%, rgba(87,214,58,.16), transparent 60%),
    radial-gradient(60% 42% at -8% 10%, rgba(43,91,255,.16), transparent 60%);
  -webkit-font-smoothing:antialiased; }
h1,h2,h3,.disp{ font-family:var(--disp); letter-spacing:-.02em; }
svg{ display:block; }
a{ color:var(--accent); }
.mono{ font-variant-numeric:tabular-nums; }

.wrap{ max-width:1080px; margin:0 auto; padding:0 20px; }
.brand{ display:flex; align-items:center; gap:11px; font-family:var(--disp); font-weight:800; font-size:17px; }
.brand img{ height:30px; } .brand span{ color:var(--accent); }

.btn{ font-family:var(--body); border:none; border-radius:12px; padding:14px 18px; font-size:15px; font-weight:800;
  cursor:pointer; color:#04180c; background:linear-gradient(135deg,var(--g1),var(--g2));
  box-shadow:0 10px 26px rgba(18,162,74,.3); transition:transform .13s, box-shadow .13s; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.btn:hover{ transform:translateY(-1px); box-shadow:0 14px 32px rgba(18,162,74,.4); }
.btn:disabled{ opacity:.6; cursor:progress; box-shadow:none; }
.btn.ghost{ background:transparent; color:var(--txt); box-shadow:none; border:1px solid var(--line-2); }
.btn.ghost:hover{ border-color:var(--accent); }
.btn.block{ width:100%; }

.card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:0 22px 60px rgba(2,6,23,.5); backdrop-filter:blur(8px); }

.seg{ display:flex; gap:4px; background:rgba(6,10,28,.5); border:1px solid var(--line); padding:4px; border-radius:13px; }
.seg button{ flex:1; padding:10px 6px; border:none; background:transparent; cursor:pointer; font-size:13.5px;
  font-weight:700; color:var(--muted); border-radius:9px; transition:.16s; }
.seg button.active{ background:rgba(255,255,255,.08); color:#fff; }

label.f{ display:block; font-size:12px; font-weight:700; color:var(--muted); margin:16px 0 7px; }
.fld{ width:100%; padding:14px 15px; border-radius:12px; border:1.5px solid var(--line-2);
  background:rgba(6,10,28,.55); color:var(--txt); font-size:16px; outline:none; transition:.16s; }
.fld:focus{ border-color:var(--accent); box-shadow:0 0 0 4px rgba(63,208,122,.13); }

.consent{ display:flex; gap:10px; align-items:flex-start; margin:15px 2px 2px; font-size:12.5px; color:var(--muted); line-height:1.5; }
.consent input{ width:18px; height:18px; margin-top:1px; accent-color:var(--accent); flex:none; }

.msg{ margin-top:15px; padding:13px 15px; border-radius:12px; font-size:14px; display:none; line-height:1.45; }
.msg.show{ display:block; }
.msg.ok{ background:rgba(63,208,122,.13); color:var(--ok); border:1px solid rgba(63,208,122,.3); }
.msg.err{ background:rgba(255,107,107,.12); color:var(--err); border:1px solid rgba(255,107,107,.3); }

.pill{ padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700; background:rgba(255,255,255,.08); }
.pill.ok{ background:rgba(63,208,122,.16); color:var(--ok); }

/* radar wifi */
.radar{ position:relative; width:120px; height:120px; margin:0 auto; }
.radar .ring{ position:absolute; inset:0; border-radius:50%; border:1.5px solid rgba(67,207,125,.7); opacity:0;
  animation:radar 3.3s cubic-bezier(.2,.55,.3,1) infinite; }
.radar .ring:nth-child(2){ animation-delay:1.1s; } .radar .ring:nth-child(3){ animation-delay:2.2s; }
@keyframes radar{ 0%{ transform:scale(.26); opacity:0; } 14%{ opacity:.85; } 100%{ transform:scale(1); opacity:0; } }
.radar .core{ position:absolute; inset:0; display:grid; place-items:center; }
.radar .core svg{ width:44px; height:44px; color:var(--accent); filter:drop-shadow(0 4px 14px rgba(87,214,58,.45)); }

/* carousel */
.caro{ position:relative; overflow:hidden; border-radius:var(--radius); height:100%; }
.caro .track{ display:flex; height:100%; transition:transform .55s cubic-bezier(.22,.7,.2,1); }
.caro .cell{ min-width:100%; }
.caro .dots{ position:absolute; bottom:12px; left:0; right:0; display:flex; gap:7px; justify-content:center; }
.caro .dot{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.35); border:none; padding:0; cursor:pointer; transition:.2s; }
.caro .dot.on{ width:22px; border-radius:5px; background:var(--accent); }

.foot{ text-align:center; color:var(--muted-2); font-size:11.5px; padding:22px; border-top:1px solid var(--line); margin-top:8px; }
.foot b{ color:var(--muted); }
.hidden{ display:none !important; }
@media (prefers-reduced-motion:reduce){ .radar .ring{ animation:none; opacity:.3; } .caro .track{ transition:none; } }
