/* ============================================================
   Elétrica Express — identidade visual
   Fios elétricos como grafismo, azul-marinho + azul elétrico
   ============================================================ */

:root{
  --ee-bg:        #0B1220;
  --ee-bg-2:      #0F1930;
  --ee-surface:   #131F3A;
  --ee-line:      #1E2C4D;
  --ee-text:      #E6ECF7;
  --ee-muted:     #8FA0C2;
  --ee-blue:      #2E8CFF;
  --ee-blue-2:    #55A6FF;
  --ee-yellow:    #F5C518;
  --ee-green:     #3ECF6E;
  --ee-danger:    #FF5B5B;
  --ee-glow:      0 0 24px rgba(46,140,255,.55);
  --ee-radius:    14px;
  --ee-shadow:    0 20px 60px rgba(0,0,0,.45);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(46,140,255,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 30%, rgba(46,140,255,.06), transparent 60%),
    var(--ee-bg);
  color:var(--ee-text);
  font-family:'Inter', system-ui, sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ---------- HEADER ---------- */
.ee-header{
  position:sticky; top:0; z-index:50;
  background:rgba(11,18,32,.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ee-line);
}
.ee-header-inner{
  max-width:1240px; margin:0 auto;
  display:flex; align-items:center; gap:24px;
  padding:14px 24px;
}
.ee-logo{
  display:flex; align-items:center; gap:10px;
  font-family:'Rajdhani', sans-serif;
  font-weight:700; font-size:22px; letter-spacing:.5px;
}
.ee-logo-bolt{
  width:34px; height:34px; border-radius:9px;
  display:grid; place-items:center;
  background:linear-gradient(135deg, var(--ee-blue), #1a63c9);
  color:#fff; box-shadow:var(--ee-glow);
}
.ee-logo-alt{color:var(--ee-blue)}
.ee-nav{margin-left:auto}
.ee-nav ul{
  list-style:none; display:flex; gap:6px; margin:0; padding:0;
}
.ee-nav-link{
  display:inline-block; padding:8px 14px; border-radius:8px;
  font-weight:500; color:var(--ee-muted);
  transition:.2s;
}
.ee-nav-link:hover{color:var(--ee-text); background:rgba(255,255,255,.04)}
.ee-nav-link.ativo{color:var(--ee-text); background:rgba(46,140,255,.12); box-shadow:inset 0 0 0 1px rgba(46,140,255,.25)}

.ee-cta-nav{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 16px; border-radius:10px;
  background:linear-gradient(135deg, var(--ee-blue), #1a63c9);
  color:#fff; font-weight:600;
  box-shadow:var(--ee-glow);
  transition:transform .15s;
}
.ee-cta-nav:hover{transform:translateY(-1px)}

.ee-menu-btn{
  display:none;
  background:transparent; border:1px solid var(--ee-line);
  color:var(--ee-text); padding:8px 10px; border-radius:8px;
  font-size:20px; cursor:pointer;
  margin-left:auto;
}

/* ---------- PAGE ---------- */
.ee-page{max-width:1240px; margin:0 auto; padding:0 24px}

.ee-section{padding:96px 0; position:relative}
.ee-section-head{max-width:640px; margin-bottom:44px}
.ee-section-head h2{
  font-family:'Rajdhani', sans-serif;
  font-size:clamp(28px, 4vw, 44px); margin:12px 0 8px;
  line-height:1.05; font-weight:700; letter-spacing:.3px;
}
.ee-section-head h2 span{color:var(--ee-blue)}
.ee-section-head p{color:var(--ee-muted); margin:0}

.ee-tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  background:rgba(46,140,255,.10);
  color:var(--ee-blue-2);
  font-family:'JetBrains Mono', monospace;
  font-size:12px; letter-spacing:.5px; text-transform:uppercase;
  border:1px solid rgba(46,140,255,.25);
}
.ee-tag-urg{background:rgba(255,91,91,.10); color:#ff9c9c; border-color:rgba(255,91,91,.3)}

/* ---------- HERO ---------- */
.ee-hero{padding:80px 0 120px; position:relative}
.ee-hero-grid{
  position:relative;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  grid-template-rows:auto auto;
  gap:40px;
  min-height:520px;
}
.ee-hero-left{position:relative; z-index:2}
.ee-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--ee-blue-2); font-family:'JetBrains Mono',monospace;
  font-size:13px; text-transform:uppercase; letter-spacing:1px;
  margin:0 0 20px;
}
.ee-dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--ee-blue); box-shadow:var(--ee-glow);
  animation:ee-pulse 1.6s infinite;
}
@keyframes ee-pulse{
  0%,100%{opacity:1; transform:scale(1)}
  50%{opacity:.4; transform:scale(1.4)}
}
.ee-hero-title{
  font-family:'Rajdhani', sans-serif;
  font-size:clamp(44px, 7vw, 84px);
  line-height:.95; margin:0 0 20px; font-weight:700;
  letter-spacing:-.5px;
}
.ee-hero-title em{
  font-style:normal; color:var(--ee-blue);
  text-shadow:0 0 40px rgba(46,140,255,.35);
}
.ee-hero-lead{color:var(--ee-muted); font-size:18px; max-width:460px}

.ee-wire{
  position:absolute; inset:0; width:100%; height:100%;
  z-index:1; pointer-events:none;
  overflow:visible;
}

/* Badge emergência */
.ee-badge-emg{
  position:absolute; top:0; right:0; z-index:3;
  width:240px;
  background:linear-gradient(180deg, rgba(19,31,58,.95), rgba(11,18,32,.95));
  border:1px solid rgba(46,140,255,.35);
  border-radius:16px; padding:20px 20px 18px;
  box-shadow:var(--ee-shadow), 0 0 30px rgba(46,140,255,.15);
}
.ee-badge-emg-plug{
  position:absolute; top:-8px; left:50%; transform:translateX(-50%);
  width:24px; height:14px; border-radius:4px 4px 2px 2px;
  background:var(--ee-blue);
  box-shadow:0 0 12px var(--ee-blue);
}
.ee-badge-emg-plug::before,
.ee-badge-emg-plug::after{
  content:""; position:absolute; top:-4px;
  width:3px; height:6px; background:#c0c8d8; border-radius:2px;
}
.ee-badge-emg-plug::before{left:6px}
.ee-badge-emg-plug::after{right:6px}
.ee-badge-emg-pulse{
  position:absolute; top:14px; right:14px;
  width:10px; height:10px; border-radius:50%;
  background:var(--ee-danger);
  box-shadow:0 0 12px var(--ee-danger);
  animation:ee-pulse 1.2s infinite;
}
.ee-badge-emg-kicker{
  margin:0; font-family:'JetBrains Mono',monospace;
  font-size:11px; color:var(--ee-blue-2);
  letter-spacing:1px; text-transform:uppercase;
}
.ee-badge-emg-title{
  margin:6px 0 10px; font-family:'Rajdhani',sans-serif;
  font-size:24px; font-weight:700; line-height:1.05;
}
.ee-badge-emg-hint{margin:0; color:var(--ee-muted); font-size:13px}

/* CTA no fim do fio */
.ee-hero-cta{
  position:absolute; right:0; bottom:0; z-index:3;
  display:flex; flex-direction:column; gap:10px; align-items:flex-end;
}

.ee-btn-primary{
  display:inline-flex; align-items:center; gap:10px;
  padding:16px 22px; border-radius:12px;
  background:linear-gradient(135deg, var(--ee-blue), #1a63c9);
  color:#fff; font-weight:600; font-size:16px;
  box-shadow:var(--ee-glow), 0 10px 30px rgba(0,0,0,.4);
  transition:transform .15s;
  cursor:pointer; border:none;
}
.ee-btn-primary:hover{transform:translateY(-2px)}
.ee-btn-ghost{
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 18px; border-radius:12px;
  color:var(--ee-text); font-weight:500;
  border:1px solid var(--ee-line);
  background:rgba(255,255,255,.02);
  transition:.2s;
}
.ee-btn-ghost:hover{border-color:var(--ee-blue); color:var(--ee-blue-2)}

/* ---------- COBERTURA ---------- */
.ee-cobertura{
  position:relative;
  background:linear-gradient(180deg, var(--ee-bg-2), transparent);
  border:1px solid var(--ee-line); border-radius:20px;
  padding:40px 32px; overflow:hidden;
}
.ee-cobertura-wire{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:.6; pointer-events:none;
}
.ee-bairros{
  position:relative; z-index:1;
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, 1fr); gap:16px;
}
.ee-bairros li{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px; border-radius:10px;
  background:rgba(11,18,32,.6);
  border:1px solid var(--ee-line);
  font-family:'Rajdhani',sans-serif; font-weight:600; font-size:18px;
}
.ee-node{
  width:10px; height:10px; border-radius:50%;
  background:var(--ee-blue); box-shadow:0 0 10px var(--ee-blue);
  flex-shrink:0;
}

/* ---------- SERVIÇOS ---------- */
.ee-servicos{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.ee-card{
  position:relative;
  background:linear-gradient(180deg, var(--ee-surface), var(--ee-bg-2));
  border:1px solid var(--ee-line); border-radius:16px;
  padding:28px 24px;
  transition:.25s;
  overflow:hidden;
}
.ee-card::before{
  content:""; position:absolute; top:0; left:24px; right:24px; height:2px;
  background:linear-gradient(90deg, transparent, var(--ee-blue), transparent);
  opacity:.4;
}
.ee-card:hover{
  transform:translateY(-4px);
  border-color:rgba(46,140,255,.4);
  box-shadow:0 20px 40px rgba(0,0,0,.35), 0 0 30px rgba(46,140,255,.12);
}
.ee-card-icon{
  font-size:32px; color:var(--ee-blue); margin-bottom:16px;
  display:inline-block;
}
.ee-card h3{
  margin:0 0 8px; font-family:'Rajdhani',sans-serif;
  font-size:22px; font-weight:700;
}
.ee-card p{margin:0; color:var(--ee-muted); font-size:15px}

/* ---------- SOBRE ---------- */
.ee-sobre-grid{
  display:grid; grid-template-columns:1.3fr 1fr; gap:60px; align-items:center;
}
.ee-sobre h2{
  font-family:'Rajdhani',sans-serif; font-weight:700;
  font-size:clamp(28px,4vw,42px); margin:14px 0 20px; line-height:1.1;
}
.ee-sobre h2 span{color:var(--ee-blue)}
.ee-sobre p{color:var(--ee-muted); font-size:16px}
.ee-sobre-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:12px;
}
.ee-sobre-list li{
  display:flex; align-items:center; gap:14px;
  padding:16px 18px; border-radius:12px;
  background:var(--ee-surface); border:1px solid var(--ee-line);
  font-weight:500;
}
.ee-sobre-list i{color:var(--ee-blue); font-size:22px}

/* ---------- CONTATO ---------- */
.ee-contato-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:32px;
}
.ee-contato-info{
  background:var(--ee-surface); border:1px solid var(--ee-line);
  border-radius:16px; padding:32px;
  display:flex; flex-direction:column; gap:24px;
}
.ee-info-item{display:flex; gap:16px; align-items:flex-start}
.ee-info-item i{
  font-size:24px; color:var(--ee-blue);
  width:44px; height:44px; border-radius:10px;
  background:rgba(46,140,255,.10);
  display:grid; place-items:center;
  flex-shrink:0;
}
.ee-info-item strong{display:block; font-family:'Rajdhani',sans-serif; font-size:18px; margin-bottom:4px}
.ee-info-item p{margin:0; color:var(--ee-muted); font-size:15px}
.ee-urg{color:var(--ee-yellow); font-weight:600}

.ee-mapa{
  position:relative;
  background:
    radial-gradient(400px 300px at 60% 40%, rgba(46,140,255,.15), transparent 70%),
    var(--ee-bg-2);
  border:1px solid var(--ee-line); border-radius:16px;
  min-height:340px; overflow:hidden;
  display:grid; place-items:center;
}
.ee-mapa-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(46,140,255,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(46,140,255,.10) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:radial-gradient(ellipse at center, black 40%, transparent 80%);
}
.ee-mapa-pin{
  position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:22px;
}
.ee-mapa-pin i{
  font-size:44px; color:var(--ee-blue);
  filter:drop-shadow(0 0 12px var(--ee-blue));
  animation:ee-bob 2.4s ease-in-out infinite;
}
@keyframes ee-bob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
.ee-mapa-tag{
  position:absolute; bottom:14px; left:0; right:0;
  text-align:center; margin:0;
  font-family:'JetBrains Mono',monospace; font-size:12px;
  color:var(--ee-muted); letter-spacing:.5px;
}

/* ---------- FOOTER ---------- */
.ee-footer{
  border-top:1px solid var(--ee-line);
  margin-top:60px;
  background:rgba(11,18,32,.6);
}
.ee-footer-inner{
  max-width:1240px; margin:0 auto; padding:28px 24px;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px;
  color:var(--ee-muted); font-size:14px;
}
.ee-footer p{margin:0}
.ee-footer-cnpj{font-family:'JetBrains Mono',monospace; font-size:12px}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 960px){
  .ee-menu-btn{display:inline-flex}
  .ee-nav{
    position:absolute; top:100%; left:0; right:0;
    background:var(--ee-bg-2); border-bottom:1px solid var(--ee-line);
    display:none; padding:12px 16px;
  }
  .ee-nav.aberto{display:block}
  .ee-nav ul{flex-direction:column; gap:2px}
  .ee-nav-link{display:block; padding:12px}
  .ee-cta-nav{display:none}

  .ee-hero-grid{grid-template-columns:1fr; min-height:auto}
  .ee-badge-emg{position:relative; width:100%; max-width:320px; margin:0 auto}
  .ee-hero-cta{position:relative; align-items:stretch}
  .ee-btn-primary, .ee-btn-ghost{justify-content:center}
  .ee-wire{display:none}

  .ee-bairros{grid-template-columns:repeat(2, 1fr)}
  .ee-servicos{grid-template-columns:1fr}
  .ee-sobre-grid, .ee-contato-grid{grid-template-columns:1fr; gap:32px}
}
@media (max-width:520px){
  .ee-section{padding:64px 0}
  .ee-bairros{grid-template-columns:1fr}
}