:root{--navy:#071925;--steel:#0d2b40;--lime:#b8f34a;--ice:#edf4f6;--ink:#10202c;--muted:#63727d;--white:#fff;--line:rgba(15,42,59,.13);--shadow:0 24px 70px rgba(3,20,31,.16);--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:#f7fafb;line-height:1.6}h1,h2,h3,strong,.brand{font-family:"Space Grotesk",Manrope,sans-serif}h1,h2,h3,p{margin-top:0}a{color:inherit;text-decoration:none}img{display:block;width:100%;object-fit:cover}button,input,select,textarea{font:inherit}.nav{position:absolute;z-index:10;top:0;left:0;right:0;height:82px;padding:0 clamp(20px,5vw,78px);display:flex;align-items:center;justify-content:space-between;color:#fff;border-bottom:1px solid rgba(255,255,255,.17)}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.08em}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--lime);color:var(--lime);border-radius:9px}.nav nav{display:flex;gap:30px;font-size:14px}.nav nav a{opacity:.78}.nav nav a:hover{opacity:1}.nav-cta{font-size:14px;font-weight:700;border-bottom:2px solid var(--lime);padding:10px 0}.hero{position:relative;min-height:780px;padding:170px clamp(22px,7vw,110px) 70px;display:grid;grid-template-columns:minmax(0,720px) 330px;gap:8vw;align-items:end;color:white;background:var(--hero) center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,18,28,.96) 0%,rgba(3,18,28,.76) 48%,rgba(3,18,28,.24) 100%),linear-gradient(0deg,rgba(3,18,28,.65),transparent 55%)}.hero>*:not(.hero-shade){position:relative}.eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.17em;color:#335366;margin-bottom:22px}.eyebrow.light{color:var(--lime)}.hero h1{font-size:clamp(48px,7vw,92px);line-height:.94;letter-spacing:-.055em;margin-bottom:26px}.hero h1 em,.pain h2 em{font-style:normal;color:var(--lime)}.hero-content>p{max-width:640px;font-size:18px;color:rgba(255,255,255,.78)}.hero-actions{display:flex;gap:12px;margin:34px 0 50px}.btn{min-height:52px;border:0;border-radius:8px;padding:14px 22px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn.lime,.btn.primary{background:var(--lime);color:#092032}.btn.glass{border:1px solid rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(12px)}.btn.disabled{opacity:.45;pointer-events:none}.trust-row{display:flex;gap:28px;font-size:12px;color:rgba(255,255,255,.65)}.trust-row span{max-width:115px}.trust-row b{display:block;color:#fff;font-size:20px}.hero-card{background:rgba(7,25,37,.83);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:30px}.hero-card>span{font-size:11px;letter-spacing:.12em;color:var(--lime)}.hero-card strong{display:block;font-size:28px;margin:12px 0}.hero-card p{font-size:14px;color:rgba(255,255,255,.7)}.hero-card a{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.15);padding-top:18px;font-weight:700}.pain,.advantages,.works{padding:110px clamp(22px,7vw,110px)}.pain{display:grid;grid-template-columns:1fr 1.2fr;gap:8vw;background:#fff}.pain h2,.section-head h2,.calc-copy h2,.appointment-copy h2{font-size:clamp(38px,5vw,64px);line-height:1.02;letter-spacing:-.045em}.pain-grid{display:grid;gap:0}.pain-grid article{display:grid;grid-template-columns:45px 1fr;column-gap:18px;border-top:1px solid var(--line);padding:25px 0}.pain-grid article>b{grid-row:1/3;color:#78a326}.pain-grid h3{margin:0 0 7px;font-size:20px}.pain-grid p{margin:0;color:var(--muted);font-size:14px}.system{background:var(--navy);color:white;padding:110px clamp(22px,7vw,110px);display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center}.system h2{font-size:clamp(38px,4.8vw,62px);line-height:1.04}.system-copy>p,.calc-copy>p,.appointment-copy>p{color:rgba(255,255,255,.68);font-size:17px}.system ul{padding:0;margin:34px 0;list-style:none}.system li{border-top:1px solid rgba(255,255,255,.15);padding:15px 0;display:flex;gap:20px;font-weight:600}.system li span{color:var(--lime)}.system small{display:block;border-left:3px solid var(--lime);padding-left:15px;color:rgba(255,255,255,.58)}.system-visual{position:relative}.system-visual img{height:620px;border-radius:var(--radius)}.visual-label{position:absolute;left:-25px;right:25px;bottom:25px;background:#fff;color:var(--ink);border-radius:14px;padding:20px}.visual-label b,.visual-label span{display:block}.visual-label span{font-size:12px;color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:flex-end}.section-head h2{max-width:680px}.adv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px}.adv-grid article{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px;min-height:260px}.adv-grid article>span{font-size:32px;color:#7ca728}.adv-grid h3{font-size:20px;margin-top:35px}.adv-grid p{color:var(--muted);font-size:14px}.calculator{background:#0c3046;color:#fff;padding:110px clamp(22px,7vw,110px);display:grid;grid-template-columns:1fr 1fr;gap:8vw}.includes{border-top:1px solid rgba(255,255,255,.15);padding-top:25px}.includes b,.includes span{display:block}.includes span{margin-top:8px;font-size:13px;color:rgba(255,255,255,.6)}.calc-card{background:#fff;color:var(--ink);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}.calc-card>label{font-weight:700}.meter-input{display:flex;align-items:center;border-bottom:2px solid var(--ink);margin:18px 0 30px}.meter-input input{border:0;outline:0;font-size:52px;font-family:"Space Grotesk";font-weight:700;width:100%;padding:6px}.meter-input span{font-size:22px;color:var(--muted)}.calc-line,.calc-total{display:flex;justify-content:space-between;gap:18px}.calc-line{font-size:13px;color:var(--muted)}.calc-total{align-items:end;border-top:1px solid var(--line);margin-top:18px;padding-top:20px}.calc-total span{font-size:13px;max-width:130px}.calc-total strong{font-size:clamp(25px,3vw,39px);color:#577c12}.disclaimer{font-size:11px;line-height:1.5;color:var(--muted);background:var(--ice);padding:14px;border-radius:8px;margin:22px 0}.check{display:flex;gap:10px;align-items:flex-start;font-size:12px;color:var(--muted)}.check input{margin-top:4px;accent-color:#6c9819}.calc-card .btn{width:100%;margin-top:22px}.works{background:#fff}.gallery{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;margin-top:45px}.gallery figure{margin:0;position:relative;overflow:hidden;border-radius:18px;background:#ddd;min-height:450px}.gallery figure.wide{min-height:570px}.gallery img{height:100%;position:absolute}.gallery figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:14px;background:rgba(7,25,37,.82);backdrop-filter:blur(10px);color:#fff;border-radius:10px;font-size:13px}.appointment{background:var(--navy);color:#fff;padding:110px clamp(22px,7vw,110px);display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw}.cities{display:flex;flex-wrap:wrap;gap:8px}.cities span{border:1px solid rgba(255,255,255,.2);border-radius:30px;padding:7px 12px;font-size:12px}.appointment-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;background:#fff;color:var(--ink);padding:32px;border-radius:var(--radius)}.field label{display:block;font-size:12px;font-weight:800;margin-bottom:6px}.field label small{font-weight:500;color:var(--muted)}.field input,.field select,.field textarea{width:100%;border:1px solid #cfdbdf;border-radius:8px;padding:12px 13px;background:#fff;min-height:48px}.field textarea{resize:vertical}.full{grid-column:1/-1}.form-status{font-size:13px}.form-status.success{color:#426b0a}.form-status.error,.alert.error{color:#9e2929;background:#fff0f0;padding:12px;border-radius:8px}footer{background:#04111a;color:rgba(255,255,255,.65);padding:55px clamp(22px,7vw,110px);display:grid;grid-template-columns:1fr 1fr;gap:15px;font-size:13px}footer .brand{color:#fff}footer small{max-width:650px}.floating-cta{display:none}.installer{min-height:100vh;display:grid;place-items:center;padding:25px;background:linear-gradient(135deg,#061824,#0e405b)}.install-card{width:min(700px,100%);background:#fff;padding:clamp(25px,5vw,55px);border-radius:var(--radius);box-shadow:var(--shadow)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid label{font-size:13px;font-weight:700}.form-grid input{display:block;width:100%;margin-top:6px;border:1px solid #cad7dc;border-radius:8px;padding:12px}.alert{margin:15px 0}
@media(max-width:900px){.nav nav{display:none}.hero{grid-template-columns:1fr;min-height:760px}.hero-card{display:none}.pain,.system,.calculator,.appointment{grid-template-columns:1fr}.adv-grid{grid-template-columns:1fr 1fr}.system-visual img{height:500px}.section-head{display:block}.gallery{grid-template-columns:1fr 1fr}.gallery figure,.gallery figure.wide{min-height:430px}}
@media(max-width:620px){.nav{height:68px;padding:0 18px}.nav-cta{font-size:11px}.hero{padding:130px 20px 55px;min-height:720px;background-position:58% center}.hero h1{font-size:49px}.hero-content>p{font-size:16px}.hero-actions{flex-direction:column}.trust-row{gap:14px}.trust-row b{font-size:17px}.pain,.advantages,.works,.system,.calculator,.appointment{padding:75px 20px}.pain h2,.section-head h2,.calc-copy h2,.appointment-copy h2,.system h2{font-size:39px}.adv-grid{grid-template-columns:1fr}.adv-grid article{min-height:220px}.system-visual img{height:430px}.visual-label{left:12px;right:12px}.calc-card,.appointment-form{padding:22px}.calc-total{display:block}.calc-total strong{display:block;margin-top:8px}.gallery{grid-template-columns:1fr}.gallery figure,.gallery figure.wide{min-height:390px}.appointment-form{grid-template-columns:1fr}.field,.full{grid-column:1}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:1}footer{grid-template-columns:1fr;padding-bottom:95px}.floating-cta{display:block;position:fixed;z-index:20;left:16px;right:16px;bottom:12px;background:var(--lime);color:#071925;border-radius:9px;padding:14px;text-align:center;font-weight:800;box-shadow:0 12px 35px rgba(3,17,26,.35)}}

.process-section{background:#071925;color:#fff;padding:110px clamp(22px,7vw,110px);overflow:hidden}.process-head{display:flex;justify-content:space-between;gap:35px;align-items:end}.process-head h2{font-size:clamp(38px,5vw,64px);line-height:1.02;letter-spacing:-.045em;margin-bottom:0}.process-intro{max-width:690px;color:rgba(255,255,255,.66);font-size:16px;margin:26px 0 42px}.process-nav{display:flex;align-items:center;gap:15px}.process-nav button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.26);background:transparent;color:#fff;font-size:21px;cursor:pointer}.process-nav button:hover{background:var(--lime);border-color:var(--lime);color:var(--navy)}.process-nav div{min-width:74px;text-align:center}.process-nav strong{font-size:28px;color:var(--lime)}.process-nav span{font-size:13px;color:rgba(255,255,255,.5)}.process-slider{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-inline:contain;padding:2px 0 22px}.process-slider::-webkit-scrollbar{display:none}.process-card{flex:0 0 calc((100% - 36px)/3);scroll-snap-align:start;background:#0d2b40;border:1px solid rgba(255,255,255,.12);border-radius:20px;overflow:hidden;transition:transform .25s,border-color .25s}.process-card:hover{transform:translateY(-5px);border-color:rgba(184,243,74,.6)}.process-card img{height:315px;object-fit:cover;background:#fff}.process-card>div{padding:23px}.process-card span{font-size:11px;font-weight:800;letter-spacing:.16em;color:var(--lime)}.process-card h3{font-size:23px;margin:7px 0 10px}.process-card p{font-size:13px;color:rgba(255,255,255,.65);margin:0}.process-progress{height:3px;background:rgba(255,255,255,.14);margin-top:12px}.process-progress span{display:block;height:100%;background:var(--lime);transition:width .35s}.process-note{font-size:11px;color:rgba(255,255,255,.45);margin:18px 0 0}.process-slider:focus-visible{outline:2px solid var(--lime);outline-offset:6px}
@media(max-width:900px){.process-card{flex-basis:calc((100% - 18px)/2)}.process-card img{height:300px}}
@media(max-width:620px){.process-section{padding:75px 20px}.process-head{align-items:flex-end}.process-head h2{font-size:39px}.process-head .eyebrow{margin-bottom:14px}.process-nav{gap:7px}.process-nav div{display:none}.process-nav button{width:42px;height:42px}.process-intro{font-size:14px;margin:20px 0 30px}.process-slider{margin-right:-20px;padding-right:20px}.process-card{flex-basis:86%}.process-card img{height:335px}.process-card>div{padding:20px}.process-card h3{font-size:21px}}

/* Fondo principal como elemento real para validar cargas y evitar rutas CSS cacheadas. */
.hero{background:#071925;overflow:hidden}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}.hero-shade{z-index:1}.hero-content,.hero-card{z-index:2}
@media(max-width:620px){.hero-bg{object-position:58% center}}

/* V11: fuerza la fotografía principal como fondo de borde a borde. */
.hero{position:relative!important;width:100%!important;min-height:100vh!important;min-height:100svh!important;overflow:hidden!important;isolation:isolate!important;background:#071925!important}
.hero>.hero-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;min-width:100%!important;min-height:100%!important;object-fit:cover!important;object-position:center center!important;z-index:0!important;margin:0!important;padding:0!important;border:0!important}
.hero>.hero-shade{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:1!important;background:linear-gradient(90deg,rgba(3,18,28,.88) 0%,rgba(3,18,28,.64) 55%,rgba(3,18,28,.42) 100%)!important}
.hero>.hero-content,.hero>.hero-card{position:relative!important;z-index:2!important}
@media(max-width:620px){.hero>.hero-bg{object-position:52% center!important}.hero>.hero-shade{background:linear-gradient(180deg,rgba(3,18,28,.62) 0%,rgba(3,18,28,.48) 46%,rgba(3,18,28,.88) 100%)!important}}

/* Portada de pantalla completa: la fotografía cubre todo el hero. */
.hero {
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  isolation: isolate;
  background: #071925;
}

/* V20 · Paleta azul SIPREACON */
:root{--navy:#06385f;--steel:#074c7e;--lime:#dddf4c;--ice:#edf7fc;--ink:#082b45;--muted:#53748b;--line:rgba(7,76,126,.17);--shadow:0 28px 80px rgba(2,45,77,.18)}
body{background:#f3f9fc;color:var(--ink)}
.nav{background:linear-gradient(180deg,rgba(3,43,73,.78),rgba(3,43,73,.08));border-color:rgba(134,185,218,.3)}
.brand-mark{border-color:#dddf4c;color:#dddf4c;box-shadow:0 0 0 5px rgba(221,223,76,.08)}.nav-cta{border-color:#dddf4c}
.hero>.hero-shade{background:linear-gradient(90deg,rgba(3,43,73,.94) 0%,rgba(7,76,126,.72) 50%,rgba(3,43,73,.2) 100%),linear-gradient(0deg,rgba(3,43,73,.65),transparent 62%)!important}
.hero h1 em,.pain h2 em{color:#dddf4c;text-shadow:0 8px 30px rgba(221,223,76,.12)}
.eyebrow{color:#074c7e}.eyebrow.light,.hero-card>span{color:#dddf4c}
.btn.lime,.btn.primary,.floating-cta{background:linear-gradient(135deg,#dddf4c,#aabd12);color:#052f50;box-shadow:0 12px 30px rgba(170,189,18,.23)}
.btn.lime:hover,.btn.primary:hover{box-shadow:0 16px 36px rgba(170,189,18,.34)}.btn.glass{border-color:rgba(134,185,218,.55);background:rgba(7,76,126,.28)}
.hero-card{background:linear-gradient(145deg,rgba(3,48,82,.94),rgba(7,76,126,.78));border-color:rgba(134,185,218,.35);box-shadow:0 24px 65px rgba(1,31,54,.3)}
.pain{background:linear-gradient(145deg,#fff 0%,#edf7fc 100%)}.pain-grid article>b,.adv-grid article>span{color:#4e8abb}
.system{background:linear-gradient(135deg,#032f50 0%,#074c7e 60%,#0a5f96 100%)}.system-visual img{box-shadow:0 30px 75px rgba(0,28,50,.38)}
.visual-label{border-left:5px solid #dddf4c;box-shadow:0 16px 42px rgba(1,39,68,.2)}
.advantages{background:linear-gradient(180deg,#f3f9fc,#e6f2f9)}.adv-grid article{border-color:rgba(78,138,187,.24);box-shadow:0 16px 45px rgba(7,76,126,.08);transition:.25s}.adv-grid article:hover{transform:translateY(-6px);border-color:#86b9da;box-shadow:0 24px 55px rgba(7,76,126,.16)}
.process-section{background:radial-gradient(circle at 85% 10%,rgba(78,138,187,.3),transparent 35%),linear-gradient(145deg,#032f50,#074c7e 75%,#06385f)}
.process-card{background:linear-gradient(160deg,#074c7e,#06385f);border-color:rgba(134,185,218,.3);box-shadow:0 18px 42px rgba(1,31,54,.22)}.process-card:hover{border-color:#dddf4c}.process-card span,.process-nav strong{color:#dddf4c}.process-progress span{background:linear-gradient(90deg,#aabd12,#dddf4c)}.process-nav button:hover{background:#dddf4c;border-color:#dddf4c;color:#06385f}
.calculator{background:linear-gradient(135deg,#074c7e 0%,#4e8abb 100%)}.calc-card{border-top:6px solid #dddf4c}.meter-input{border-color:#074c7e}.calc-total strong{color:#074c7e}.disclaimer{background:#eaf5fb;border-left:3px solid #86b9da}.check input{accent-color:#074c7e}
.works{background:#f7fbfd}.gallery figure{box-shadow:0 18px 48px rgba(7,76,126,.15)}.gallery figcaption{background:rgba(3,56,95,.9)}
.appointment{background:radial-gradient(circle at 10% 90%,rgba(134,185,218,.24),transparent 38%),linear-gradient(145deg,#032f50,#074c7e)}.appointment-form{border-top:6px solid #dddf4c;box-shadow:0 28px 75px rgba(0,25,45,.32)}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid rgba(134,185,218,.35);border-color:#4e8abb}.cities span{border-color:rgba(134,185,218,.48);background:rgba(134,185,218,.08)}
.form-status.success{color:#315f00;background:#f5f8cf;padding:12px;border-radius:8px}.form-status.error{color:#9e2929;background:#fff0f0}footer{background:#02243e}.floating-cta{border:1px solid rgba(255,255,255,.28)}
@media(max-width:620px){.hero>.hero-shade{background:linear-gradient(180deg,rgba(3,43,73,.74) 0%,rgba(7,76,126,.56) 44%,rgba(3,43,73,.94) 100%)!important}.appointment-form{border-top-width:4px}.nav{background:rgba(3,43,73,.7);backdrop-filter:blur(10px)}}

.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
}

.hero-shade {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(3,18,28,.88) 0%, rgba(3,18,28,.66) 52%, rgba(3,18,28,.42) 100%),
    linear-gradient(0deg, rgba(3,18,28,.68) 0%, rgba(3,18,28,.10) 65%);
}

.hero > .hero-content,
.hero > .hero-card {
  position: relative;
  z-index: 2;
}

@media (max-width: 620px) {
  .hero {
    min-height: 100vh;
    min-height: 100svh;
  }

  .hero-bg {
    object-position: 52% center;
  }

  .hero-shade {
    background:
      linear-gradient(180deg, rgba(3,18,28,.72) 0%, rgba(3,18,28,.50) 45%, rgba(3,18,28,.88) 100%),
      rgba(3,18,28,.18);
  }
}