@font-face{font-family:'Sora';src:url("../fonts/sora.woff2") format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:'Manrope';src:url("../fonts/manrope.woff2") format("woff2");font-weight:200 800;font-display:swap}

:root{
  color-scheme:dark;
  --ink:#0F2438; --ink-2:#132B41; --panel:rgba(15,36,56,.7);
  --text:#F2F7FA; --soft:#A9C0D2; --line:rgba(242,247,250,.12);
  --blue:#2E9FE0; --ice:#7FCBF2; --warm:#FF8A3D;
  --disp:'Sora','Arial Narrow',sans-serif;
  --sans:'Manrope',-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.23,1,.32,1);
  --t-h1:clamp(2.4rem,5.4vw,4.2rem); --t-h2:clamp(1.9rem,3.8vw,3rem); --t-small:.875rem;
  --sec-y:clamp(72px,10vw,128px);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--sans);font-size:1.04rem;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:1.06;margin:0;letter-spacing:-.03em;text-wrap:balance}
p{margin:0;max-width:62ch}
ul{margin:0;padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:4px}
.wrap{width:100%;max-width:1160px;margin-inline:auto;padding-inline:max(20px,env(safe-area-inset-left,0px))}
section[id]{scroll-margin-top:76px}
.escena{position:fixed;inset:0;width:100%;height:100%;z-index:-1;display:block;pointer-events:none;animation:aparece .8s var(--ease) both}
@keyframes aparece{from{opacity:0}}

/* ---------- Encabezado ---------- */
.top{position:fixed;inset:0 0 auto;z-index:50;transition:background-color .3s,box-shadow .3s}
.top.scrolled{background:rgba(15,36,56,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:20px;transition:padding .3s var(--ease)}
.top.scrolled .nav{padding-block:12px}
.wordmark{font-family:var(--disp);font-weight:800;font-size:1.35rem;letter-spacing:-.03em;text-decoration:none}
.wordmark span{color:var(--blue)}
.navlinks{display:flex;align-items:center;gap:28px;font-size:.95rem;font-weight:600}
.navlinks a{text-decoration:none;color:var(--soft);transition:color .2s}
.btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--sans);font-weight:700;font-size:1rem;text-decoration:none;border:0;cursor:pointer;
  padding:.85em 1.45em;border-radius:999px;background:var(--warm);color:#1A1006;transition:transform .16s var(--ease),background-color .2s,color .2s}
.btn:active{transform:scale(.97)}
.btn-sm{padding:.6em 1.15em;font-size:.92rem}
.btn-ghost{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px rgba(242,247,250,.35)}
.btn svg{width:1.1em;height:1.1em;transition:transform .2s var(--ease)}
.menu-toggle{display:none;background:none;border:0;padding:10px;margin-right:-10px;cursor:pointer;color:var(--text)}
.menu-toggle span{display:block;width:22px;height:2px;background:currentColor;margin:5px 0;transition:transform .25s var(--ease),opacity .2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none}
@media (hover:hover) and (pointer:fine){
  .navlinks a:hover{color:var(--text)}
  .btn:hover{background:var(--text)}
  .btn:hover svg{transform:translateX(3px)}
  .btn-ghost:hover{background:rgba(242,247,250,.08)}
}
@media (max-width:820px){
  .navlinks{display:none}
  .menu-toggle{display:block}
  .mobile-menu{display:grid;background:rgba(15,36,56,.97);border-top:1px solid var(--line)}
  .mobile-menu[hidden]{display:none!important}
  .mobile-menu a{padding:16px 20px;text-decoration:none;border-bottom:1px solid var(--line);font-size:1.05rem}
  .mobile-menu .btn{margin:16px 20px;justify-content:center}
}

.eyebrow{display:flex;align-items:center;gap:10px;font-weight:700;font-size:var(--t-small);color:var(--soft);margin-bottom:18px}
.eyebrow::before{content:"";width:22px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--warm),var(--ice))}

/* ---------- Hero ---------- */
.hero{min-height:min(100svh,940px);display:flex;align-items:flex-end;padding-block:clamp(130px,16vw,180px) clamp(64px,8vw,96px);position:relative}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(15,36,56,.85) 0%,rgba(15,36,56,.5) 45%,rgba(15,36,56,0) 75%)}
.hero-text{max-width:720px;display:grid;gap:24px;justify-items:start}
.hero h1{font-size:var(--t-h1)}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--warm),var(--ice));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lede{font-size:clamp(1.1rem,1.6vw,1.22rem);color:var(--soft);max-width:48ch}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-text>*{animation:sube .7s var(--ease) both}
.hero-text>*:nth-child(2){animation-delay:.06s}.hero-text>*:nth-child(3){animation-delay:.12s}.hero-text>*:nth-child(4){animation-delay:.18s}
@keyframes sube{from{opacity:0;transform:translateY(18px)}}
@media (max-width:760px){.hero::before{background:linear-gradient(180deg,rgba(15,36,56,0) 0%,rgba(15,36,56,.7) 40%,rgba(15,36,56,.92) 60%)}}

/* ---------- Cifras ---------- */
.cifras{background:rgba(19,43,65,.88);border-block:1px solid var(--line)}
.cifras .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.cifra{padding:26px 0 26px 24px;border-left:1px solid var(--line)}
.cifra:first-child{border-left:0;padding-left:0}
.cifra .num{font-family:var(--disp);font-size:clamp(1.7rem,2.8vw,2.2rem);font-weight:800}
.cifra .lbl{color:var(--soft);font-size:.92rem}
@media (max-width:640px){.cifras .wrap{grid-template-columns:1fr}.cifra{border-left:0;padding-left:0;border-top:1px solid var(--line)}.cifra:first-child{border-top:0}}

/* ---------- Secciones ---------- */
.sec{padding-block:var(--sec-y);background:var(--panel)}
.sin-3d .sec{background:var(--ink)}
.sec-head{max-width:660px;margin-bottom:clamp(36px,5vw,56px)}
.sec-head h2{font-size:var(--t-h2)}
.sec-head p{color:var(--soft);margin-top:16px}

/* ---------- Servicios ---------- */
.servicios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.servicio{background:rgba(242,247,250,.05);border:1px solid var(--line);border-radius:16px;padding:28px 24px;transition:background-color .2s,border-color .2s}
.servicio .icono{width:48px;height:48px;border-radius:12px;background:rgba(46,159,224,.16);color:var(--ice);display:grid;place-items:center;margin-bottom:18px}
.servicio .icono svg{width:26px;height:26px}
.servicio h3{font-size:1.2rem}
.servicio p{color:var(--soft);margin-top:10px;font-size:.96rem}
@media (hover:hover) and (pointer:fine){.servicio:hover{background:rgba(46,159,224,.1);border-color:rgba(127,203,242,.4)}}
@media (max-width:860px){.servicios{grid-template-columns:minmax(0,1fr)}}

/* ---------- Por qué ---------- */
.razones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.razon{padding:24px 0 0;border-top:2px solid var(--line);transition:border-color .4s var(--ease)}
.razon.is-visible{border-top-color:var(--ice)}
.razon h3{font-family:var(--sans);font-size:1.12rem;font-weight:700}
.razon p{color:var(--soft);margin-top:8px}
@media (max-width:700px){.razones{grid-template-columns:minmax(0,1fr)}}

/* ---------- Cobertura ---------- */
.cobertura .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.cobertura h2{font-size:clamp(1.6rem,3vw,2.3rem);max-width:22ch}
.cobertura p{color:var(--soft);margin-top:12px}

/* ---------- Contacto ---------- */
.contacto{background:rgba(19,43,65,.92)}
.contacto .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,6vw,80px);align-items:start}
.contacto h2{font-size:var(--t-h2)}
.contacto .lede{color:var(--soft);margin-top:16px}
.contacto .hero-ctas{margin-top:28px}
.datos-contacto{display:grid;gap:20px}
.datos-contacto dt{font-size:var(--t-small);color:var(--soft);font-weight:700}
.datos-contacto dd{margin:4px 0 0;font-size:1.1rem}
@media (max-width:860px){.contacto .wrap{grid-template-columns:minmax(0,1fr)}}

/* ---------- Pie ---------- */
.pie{background:#0B1B2C;color:var(--soft);padding-block:56px 28px;position:relative}
.pie .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.pie h2{color:var(--text);font-family:inherit;font-size:var(--t-small);font-weight:700;line-height:inherit;letter-spacing:0;margin:0 0 14px}
.pie ul{display:grid;gap:4px}
.pie li a{display:inline-block;padding-block:6px;text-decoration:none}
.pie .marca{font-family:var(--disp);font-weight:800;font-size:1.25rem;color:var(--text)}
.pie .marca span{color:var(--blue)}
.pie .desc{font-size:.92rem;margin-top:12px;max-width:34ch}
.pie .base{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:var(--t-small)}
@media (hover:hover) and (pointer:fine){.pie a:hover{color:var(--text)}}
@media (max-width:760px){.pie .wrap{grid-template-columns:minmax(0,1fr)}}

/* ---------- Aparición al bajar (solo con JavaScript) ---------- */
@media (scripting:enabled){
  .reveal{opacity:.001;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease),border-color .4s var(--ease)}
  .reveal.is-visible{opacity:1;transform:none}
  .stagger>.reveal:nth-child(2){transition-delay:.06s}.stagger>.reveal:nth-child(3){transition-delay:.12s}.stagger>.reveal:nth-child(4){transition-delay:.18s}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-property:opacity,color,background-color,border-color!important}
  .reveal{transform:none!important}
}

/* ---------- Formulario de cotización por WhatsApp ---------- */
#cotizacion{margin-top:28px;max-width:560px}
.campo{display:grid;gap:6px;margin-bottom:16px}
.campos-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.campo label{font-size:.9rem;color:var(--soft);font-weight:600}
.campo .opcional{font-weight:400}
.campo input,.campo select,.campo textarea{width:100%;font:inherit;font-size:16px;color:var(--text);background:rgba(15,36,56,.85);border:1px solid rgba(242,247,250,.2);border-radius:8px;padding:12px 14px;transition:border-color .2s}
.campo textarea{resize:vertical;min-height:110px}
.campo textarea::placeholder{color:rgba(169,192,210,.6)}
.campo input:focus-visible,.campo select:focus-visible,.campo textarea:focus-visible{outline:none;border-color:var(--ice);box-shadow:0 0 0 3px rgba(127,203,242,.25)}
.campo input[aria-invalid="true"]{border-color:var(--warm)}
#cotizacion .btn{margin-top:4px}
#cotizacion .btn svg{transform:none}
.error{color:var(--warm);font-weight:600;font-size:.95rem;margin-bottom:12px}
#cotizacion .nota{font-size:var(--t-small);color:var(--soft);margin-top:12px}
.datos-contacto a{text-decoration:none;border-bottom:1px solid var(--blue)}
@media (max-width:480px){.campos-2{grid-template-columns:minmax(0,1fr)}}

/* ---------- WhatsApp: botón fijo solo en celular ---------- */
.wa-fijo{display:none}
@media (max-width:760px){
  .wa-fijo{display:grid;place-items:center;position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:40;
    width:56px;height:56px;border-radius:50%;background:#25D366;color:#0B1F14;box-shadow:0 6px 20px rgba(0,0,0,.35);transition:transform .16s var(--ease),opacity .2s}
  .wa-fijo:active{transform:scale(.94)}
  .wa-fijo.oculto{opacity:0;pointer-events:none;transform:scale(.8)}
  .wa-fijo svg{width:30px;height:30px}
  .pie{padding-bottom:96px}
}