/* Volta · instalador ficticio. Noche y amarillo de aviso: se ve desde lejos, como una furgoneta de urgencias. */
:root{
  --paper:#0f0f0e; --paper2:#191917; --ink:#f3f1ea; --mute:#a9a59b; --mute-on-ink:#55524c;
  --line:rgba(255,255,255,.14); --line-on-ink:rgba(0,0,0,.14);
  --acc:#ffd400; --acc-text:#ffd400; --on-acc:#0f0f0e;
  --fd:'Barlow Condensed',system-ui,sans-serif; --fd-weight:800; --fd-track:0; --fd-case:uppercase; --radius:2px; --foot-size:20vw;
}
.logo span{font-size:28px}
.nav-cta{border-color:var(--acc);color:var(--acc)}
.nav-cta:hover{background:var(--acc);color:var(--on-acc)}
.sec-ink .eyebrow{color:#7a5f00}
.hero{padding:clamp(40px,7vw,96px) 0 clamp(40px,6vw,72px)}
.hero .h-display{font-size:clamp(3.4rem,11vw,10.5rem);line-height:.86;max-width:12ch}
.hero-side{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 48px;align-items:end;margin-top:32px}
.hero-side .cta-row{margin-top:0}
.live{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;color:var(--acc);margin:0 0 18px}
.live i{width:10px;height:10px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.6);animation:ping 1.8s infinite}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}

/* 3:14 de la madrugada */
.nt-pin{height:100svh;display:flex;align-items:center;background:#070707;overflow:hidden}
.nt-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(20px,4vw,64px);align-items:center}
.nt-clock{font-size:clamp(4.6rem,10vw,9rem);line-height:.9;margin:0 0 14px;color:var(--acc);font-variant-numeric:tabular-nums}
.nt-say{display:grid;max-width:14ch}
.nt-say .say{grid-area:1/1;opacity:0;transform:translateY(14px);transition:opacity .5s,transform .5s}
.nt-say .say.on{opacity:1;transform:none}
.nt-eta{margin:18px 0 0;display:flex;align-items:baseline;gap:12px;color:var(--mute)}
.nt-eta b{font-size:2.4rem;color:var(--ink)}
.nt-scene{position:relative}
.nt-svg{width:100%;height:auto;display:block;overflow:visible}
.nt-svg .road{fill:none;stroke:#2a2a27;stroke-width:16;stroke-linecap:round}
.nt-svg .route{fill:none;stroke:var(--acc);stroke-width:5;stroke-linecap:round}
.nt-svg .house path,.nt-svg .house rect,.nt-svg .house line{fill:none;stroke:#5a5852;stroke-width:3}
.nt-svg .room rect{fill:#ffd400;fill-opacity:var(--lit,.75);transition:fill-opacity .25s}
.nt-svg .room circle{fill:#fff3b0;opacity:var(--lit,.75);filter:drop-shadow(0 0 10px #ffd400)}
.nt-svg .room text{font:600 15px Inter,system-ui;fill:#0f0f0e;opacity:var(--txt,1)}
.nt-svg .room.dark text{fill:#5a5852}
.nt-svg .van rect,.nt-svg .van path{fill:var(--acc)}
.nt-svg .van circle{fill:#0f0f0e;stroke:#5a5852;stroke-width:3}
.nt-svg .van text{font:800 11px 'Barlow Condensed',system-ui;fill:#0f0f0e}
.nt-phone{position:absolute;left:0;top:0;width:min(300px,52%);background:#fff;color:#111;border-radius:16px;padding:14px;box-shadow:0 20px 50px rgba(0,0,0,.6);opacity:0;transform:translateY(20px) scale(.96);transition:opacity .4s,transform .4s}
.nt-phone.on{opacity:1;transform:none}
.nt-phone .q{margin:0 0 10px;background:#f1f1f1;border-radius:999px;padding:8px 14px;font-size:13px}
.nt-phone ol{list-style:none;margin:0;padding:0}
.nt-phone li{position:relative;padding:9px 6px;border-top:1px solid #eee;font-size:12px}
.nt-phone li b{display:block;font-size:13px}
.nt-phone li span{color:#666}
.nt-phone li.hit{background:#fff8d1;border-radius:8px;border-top:0}
.nt-phone li em{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-style:normal;font-weight:600;font-size:12px;background:#111;color:#ffd400;border-radius:999px;padding:5px 10px}
.nt-phone li em.calling{animation:blink .6s infinite alternate}
@keyframes blink{to{background:#ffd400;color:#111}}

/* pedir técnico */
.res-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,6vw,96px);align-items:start}
.estimate{margin-top:34px;border-top:2px solid var(--ink);padding-top:20px}
.estimate small{display:block;color:var(--mute);font-size:15px}
.estimate b{margin:8px 0;color:var(--acc)}
.estimate span{color:var(--mute);font-size:15px}
.card-form{background:var(--paper)}

/* servicios */
.srv{list-style:none;margin:40px 0 0;padding:0;border-top:2px solid var(--ink)}
.srv li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;padding:22px 0;border-bottom:1px solid var(--line);align-items:center}
.srv b{font-family:var(--fd);font-weight:700;text-transform:uppercase;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1}
.srv span{grid-column:1;color:var(--mute);font-size:15px}
.srv em{grid-row:1/3;grid-column:2;font-style:normal;font-family:var(--fd);font-weight:800;font-size:clamp(1.6rem,3vw,2.6rem);color:var(--acc);white-space:nowrap}

/* zona y opiniones */
.zone .towns{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.zone .towns li{display:flex;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line-on-ink);font-weight:600;font-size:1.1rem}
.zone .towns b{font-family:var(--fd);font-size:1.4rem}
.r-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);margin-top:40px}
.quotes blockquote{margin:0;border-top:2px solid var(--acc);padding-top:18px}
.quotes p{margin:0 0 14px;font-size:1.15rem;line-height:1.45;font-weight:500}
.quotes cite{font-style:normal;color:var(--mute);font-size:15px}
.close .h-display{font-size:clamp(3.2rem,9vw,8.4rem)}

@media (max-width:1020px){
  .nt-grid,.res-grid{grid-template-columns:minmax(0,1fr)}
  .nt-pin{align-items:flex-start;padding-top:24px}
  .hero-side{grid-template-columns:minmax(0,1fr)}
  .zone .towns{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .nt-pin{height:calc(100svh - 64px)}
  .nt-clock{font-size:4rem;margin-bottom:6px}
  .nt-say{font-size:1.9rem}
  .nt-eta{margin-top:8px}
  .nt-eta b{font-size:1.8rem}
  .nt-phone{width:62%;padding:10px}
  .nt-phone li:nth-child(3){display:none}
  .quotes{grid-template-columns:minmax(0,1fr)}
  .zone .towns{grid-template-columns:minmax(0,1fr)}
}