/* ==========================================================================
   landing.css: landing de impacto de HCEN. Colores y fuentes: hcen-tokens.css (paleta cerrada MI).
   Animaciones CSS + SMIL (el único JS es el formulario de #contacto). Con prefers-reduced-motion todo queda visible y quieto.
   ========================================================================== */

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ margin:0; font-family:var(--hc-sans); color:var(--hc-navy); background:var(--hc-f1); font-size:1.0625rem; line-height:1.55; overflow-x:hidden; }
h1,h2,h3{ font-family:var(--hc-display); margin:0; }
p,ul,ol{ margin:0; }
ul,ol{ padding:0; list-style:none; }
a{ color:inherit; }
svg{ display:block; }

.wrap{ width:min(1240px,100% - 3rem); margin-inline:auto; }

.saltar{ position:absolute; left:1rem; top:-4rem; z-index:20; background:#ffffff; color:var(--hc-navy); padding:.6rem 1rem; border-radius:var(--hc-radio); font-weight:700; }
.saltar:focus{ top:1rem; }

:focus-visible{ outline:3px solid var(--hc-rosa-c); outline-offset:4px; border-radius:6px; }
.cifras :focus-visible,.puertas :focus-visible,.puente :focus-visible{ outline-color:var(--hc-azul); }

/* ---------- comunes ---------- */
.kicker{ font-size:.8rem; letter-spacing:.22em; text-transform:uppercase; font-weight:800; color:var(--hc-rosa-c); margin-bottom:1.1rem; }
.kicker--azul{ color:var(--hc-azul-p); }
.titulo{ font-size:clamp(2.3rem,5.4vw,4.6rem); line-height:1; letter-spacing:-.035em; font-weight:700; color:var(--hc-navy); max-width:15ch; }
.titulo .ac{ color:var(--hc-azul-p); }
.titulo--claro{ color:#ffffff; }
.titulo--claro .ac{ color:var(--hc-rosa-c); }
.lead{ font-size:clamp(1.1rem,1.6vw,1.35rem); line-height:1.55; max-width:44rem; margin-top:1.6rem; color:rgb(20 33 58 / .86); }
.lead strong{ color:var(--hc-azul-p); font-weight:700; }
.lead--claro{ color:rgb(220 232 249 / .88); }
.lead--claro strong{ color:#ffffff; }

.mi-logo{ font-family:var(--hc-sans); letter-spacing:-.035em; white-space:nowrap; line-height:1; font-size:1.3rem; }
.mi-logo b{ font-weight:800; color:#ffffff; }
.mi-logo i{ font-style:normal; font-weight:500; color:var(--hc-rosa-c); }

.btn{ display:inline-flex; align-items:center; gap:.7rem; font-family:var(--hc-display); font-weight:700; text-decoration:none; border-radius:var(--hc-radio-pill);
  padding:1.05rem 2rem; font-size:1.15rem; transition:transform .25s ease, box-shadow .25s ease, background-color .25s ease; }
.btn span{ transition:transform .25s ease; }
.btn:hover span{ transform:translateX(5px); }
.btn--claro{ background:#ffffff; color:var(--hc-navy); box-shadow:0 14px 40px rgb(20 33 58 / .35); }
.btn--claro:hover{ transform:translateY(-2px); background:var(--hc-rosa-c); }
.btn--grande{ background:var(--hc-rosa-c); color:var(--hc-navy); font-size:clamp(1.4rem,3vw,2.2rem); padding:1.3rem 2.8rem; box-shadow:0 0 0 0 rgb(227 185 196 / .5); animation:llamar 2.8s ease-out infinite; }
.btn--grande:hover{ background:#ffffff; transform:translateY(-3px); }
@keyframes llamar{ 0%{box-shadow:0 0 0 0 rgb(227 185 196 / .45)} 70%,100%{box-shadow:0 0 0 22px rgb(227 185 196 / 0)} }

/* ---------- barra superior ---------- */
.top{ position:absolute; inset:0 0 auto; z-index:5; padding:1.6rem 0; }
.top-in{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.top-con{ font-size:.95rem; color:rgb(220 232 249 / .85); }
.top-con b{ font-family:var(--hc-display); color:#ffffff; }

/* ---------- 1 · hero ---------- */
.hero{ position:relative; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; color:#ffffff; overflow:hidden;
  background:
    radial-gradient(60% 55% at 78% 45%, rgb(31 111 208 / .45), transparent 70%),
    radial-gradient(40% 40% at 10% 100%, rgb(176 105 127 / .22), transparent 70%),
    var(--hc-grad); }
.hero::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgb(220 232 249 / .05) 1px, transparent 1px), linear-gradient(90deg, rgb(220 232 249 / .05) 1px, transparent 1px);
  background-size:64px 64px; -webkit-mask-image:radial-gradient(80% 70% at 60% 40%, #ffffff 30%, transparent 85%); mask-image:radial-gradient(80% 70% at 60% 40%, #ffffff 30%, transparent 85%); }
.hero-in{ position:relative; flex:1; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); align-items:center; gap:2rem; padding:7rem 0 3rem; }
.hero h1{ font-size:clamp(2.8rem,7vw,6.5rem); line-height:.95; letter-spacing:-.045em; font-weight:700; margin-bottom:1.8rem; }
.hero h1 .h-hcen{ color:#ffffff; }
.hero h1 .h-aca{ display:block; color:var(--hc-rosa-c); }
.bajada{ font-size:clamp(1.1rem,1.55vw,1.35rem); line-height:1.55; color:rgb(220 232 249 / .9); max-width:34rem; margin-bottom:2.3rem; }
.bajada strong{ color:#ffffff; font-weight:700; }
.hero-vis{ margin-right:-4vw; }
.hp{ width:100%; height:auto; overflow:visible; }

.e1,.e2,.e3,.e4{ animation:entrar 1s cubic-bezier(.16,1,.3,1) both; }
.e2{ animation-delay:.12s; } .e3{ animation-delay:.32s; } .e4{ animation-delay:.5s; }
.hero-vis{ animation:entrar-vis 1.4s cubic-bezier(.16,1,.3,1) .2s both; }
@keyframes entrar{ from{opacity:0; transform:translateY(32px)} to{opacity:1; transform:none} }
@keyframes entrar-vis{ from{opacity:0; transform:translateX(40px) scale(.97)} to{opacity:1; transform:none} }

/* SVG del puente (copia inline de assets/hcen-puente.svg) */
.hp-ico{ fill:none; stroke:#ffffff; stroke-opacity:.72; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.hp-aro{ fill:#ffffff; fill-opacity:.04; stroke:#dce8f9; stroke-opacity:.22; stroke-width:2; }
.hp-ruta{ fill:none; stroke:#dce8f9; stroke-opacity:.13; stroke-width:2; stroke-dasharray:2 10; stroke-linecap:round; }
.hp-dib{ stroke-dasharray:1; stroke-dashoffset:0; animation:hp-dibujar 1.6s cubic-bezier(.16,1,.3,1) .3s both; }
.hp-d2{ animation-delay:.65s; }
.hp-ap{ animation:hp-aparecer .9s ease-out 1.4s both; }
.hp-halo{ transform-box:fill-box; transform-origin:center; animation:hp-pulso 2.5s ease-out infinite; }
.hp-h2{ animation-delay:1.25s; }
.hp-nodo{ animation:hp-aparecer .8s ease-out 1.2s both; }
@keyframes hp-dibujar{ from{stroke-dashoffset:1} to{stroke-dashoffset:0} }
@keyframes hp-aparecer{ from{opacity:0} to{opacity:1} }
@keyframes hp-pulso{ 0%{transform:scale(1); opacity:.4} 100%{transform:scale(1.55); opacity:0} }

/* cinta de agentes de la salud */
.cinta{ position:relative; border-top:1px solid rgb(220 232 249 / .16); background:rgb(20 33 58 / .35); overflow:hidden; white-space:nowrap; }
.cinta-in{ display:inline-flex; animation:cinta 28s linear infinite; }
.cinta span{ font-family:var(--hc-display); font-weight:700; font-size:clamp(1.05rem,1.8vw,1.5rem); letter-spacing:-.01em; padding:1.1rem 0; color:rgb(220 232 249 / .9); display:inline-flex; align-items:center; }
.cinta span::after{ content:""; width:.5em; height:.5em; border-radius:50%; background:var(--hc-rosa-c); margin:0 1.6em; }
@keyframes cinta{ to{ transform:translateX(-50%); } }

/* ---------- 2 · cifras ---------- */
.cifras{ position:relative; padding:clamp(5rem,11vw,9rem) 0 clamp(4rem,9vw,7rem); background:var(--hc-f1); overflow:hidden; }
.cifras::before{ content:"HCEN"; position:absolute; right:-.06em; top:.1em; font-family:var(--hc-display); font-weight:700; font-size:clamp(9rem,30vw,28rem); line-height:1; letter-spacing:-.05em;
  color:transparent; -webkit-text-stroke:2px rgb(31 111 208 / .09); pointer-events:none; }
.cifras .wrap{ position:relative; }
.kpis{ margin-top:clamp(3rem,7vw,5.5rem); border-top:2px solid var(--hc-navy); }
.kpi{ display:grid; grid-template-columns:minmax(0,32rem) minmax(0,1fr); align-items:center; gap:1rem 3rem; padding:clamp(1.4rem,3vw,2.4rem) 0; border-bottom:1px solid var(--hc-linea-fuerte); }
.num{ font-family:var(--hc-display); font-weight:700; font-size:clamp(4rem,12vw,9rem); line-height:.9; letter-spacing:-.055em; color:var(--hc-azul-p); white-space:nowrap; }
.num small{ font-size:.5em; letter-spacing:-.02em; color:var(--hc-azul); }
.kpi:nth-child(2) .num{ color:var(--hc-navy); }
.kpi:nth-child(3) .num small{ color:var(--hc-rosa); }
.kpi-txt{ font-size:clamp(1.15rem,2vw,1.7rem); line-height:1.25; font-weight:700; color:var(--hc-navy); max-width:18ch; }
@supports (animation-timeline: view()){
  .kpi{ animation:subir linear both; animation-timeline:view(); animation-range:entry 10% cover 35%; }
}
@keyframes subir{ from{opacity:0; transform:translateY(40px) scale(.96)} to{opacity:1; transform:none} }

/* ---------- 3 · CDA ---------- */
.cda{ position:relative; background:var(--hc-navy); color:#ffffff; padding:clamp(5rem,11vw,9rem) 0; overflow:hidden; }
.cda::before{ content:""; position:absolute; left:50%; top:58%; width:min(900px,120vw); aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%;
  background:radial-gradient(closest-side, rgb(31 111 208 / .28), transparent); pointer-events:none; }
.cda .wrap{ position:relative; }
.motor{ display:grid; grid-template-columns:minmax(0,1fr) 190px minmax(0,1fr); align-items:center; margin:clamp(3rem,7vw,5rem) 0; }
.cod{ border-radius:var(--hc-radio-card); padding:1.4rem 1.6rem 1.6rem; border:1px solid rgb(220 232 249 / .14); min-width:0; overflow:hidden; }
.cod--xml{ background:rgb(255 255 255 / .04); }
.cod--fhir{ background:var(--hc-azul-p); box-shadow:0 30px 70px rgb(20 84 159 / .45); }
.cod-et{ font-family:var(--hc-display); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--hc-rosa-c); margin-bottom:1rem; }
.cod pre{ margin:0; font-family:"SF Mono",Menlo,Consolas,monospace; font-size:clamp(.72rem,1.05vw,.92rem); line-height:1.75; white-space:pre; color:#ffffff; }
.cod pre span{ display:inline-block; border-radius:4px; }
.cod--xml pre span{ animation:xml-off 6s ease-in-out infinite both; }
.cod--fhir pre span{ animation:json-on 6s ease-in-out infinite both; }
.cod pre span:nth-child(1){ animation-delay:0s; }
.cod pre span:nth-child(2){ animation-delay:.3s; }
.cod pre span:nth-child(3){ animation-delay:.6s; }
.cod pre span:nth-child(4){ animation-delay:.9s; }
.cod pre span:nth-child(5){ animation-delay:1.2s; }
.cod pre span:nth-child(6){ animation-delay:1.5s; }
.cod pre span:nth-child(7){ animation-delay:1.8s; }
.cod pre span:nth-child(8){ animation-delay:2.1s; }
.cod--fhir pre span:nth-child(1){ animation-delay:.6s; }
.cod--fhir pre span:nth-child(2){ animation-delay:.9s; }
.cod--fhir pre span:nth-child(3){ animation-delay:1.2s; }
.cod--fhir pre span:nth-child(4){ animation-delay:1.5s; }
.cod--fhir pre span:nth-child(5){ animation-delay:1.8s; }
.cod--fhir pre span:nth-child(6){ animation-delay:2.1s; }
.cod--fhir pre span:nth-child(7){ animation-delay:2.4s; }
.cod--fhir pre span:nth-child(8){ animation-delay:2.7s; }
@keyframes xml-off{
  0%{opacity:1; background:transparent}
  6%{opacity:1; background:rgb(227 185 196 / .28)}
  14%,78%{opacity:.18; background:transparent}
  92%,100%{opacity:1}
}
@keyframes json-on{
  0%{opacity:.14; background:transparent}
  8%{opacity:1; background:rgb(255 255 255 / .22)}
  18%,78%{opacity:1; background:transparent}
  92%,100%{opacity:.14}
}

.pons{ position:relative; height:190px; display:grid; place-items:center; }
.pons-via{ position:absolute; left:-10px; right:-10px; top:50%; height:4px; margin-top:-2px; border-radius:4px; overflow:hidden;
  background:linear-gradient(90deg, rgb(220 232 249 / .1), rgb(31 111 208 / .8), rgb(227 185 196 / .5)); }
.pons-via i{ position:absolute; inset:0; animation:via-x 1.8s linear infinite; }
.pons-via i::before{ content:""; position:absolute; left:0; top:50%; width:28px; height:4px; margin-top:-2px; border-radius:4px; background:#ffffff; box-shadow:0 0 12px #ffffff; }
.pons-via i:nth-child(2){ animation-delay:-.45s; } .pons-via i:nth-child(3){ animation-delay:-.9s; } .pons-via i:nth-child(4){ animation-delay:-1.35s; }
.pons-via i:nth-child(even)::before{ background:var(--hc-rosa-c); box-shadow:0 0 12px var(--hc-rosa-c); }
@keyframes via-x{ from{transform:translateX(-30px)} to{transform:translateX(100%)} }
.pons-chip{ position:relative; width:120px; height:120px; border-radius:50%; display:grid; place-items:center;
  background:radial-gradient(circle at 50% 35%, var(--hc-azul), var(--hc-azul-p) 60%, var(--hc-navy)); border:3px solid var(--hc-f4); box-shadow:0 0 50px rgb(31 111 208 / .6); }
.pons-chip b{ font-family:var(--hc-display); font-weight:700; font-size:1.7rem; letter-spacing:-.01em; color:#ffffff; }
.pons-chip::before,.pons-chip::after{ content:""; position:absolute; inset:-3px; border-radius:50%; border:2px solid var(--hc-rosa-c); animation:pulso 2.4s ease-out infinite; }
.pons-chip::after{ animation-delay:1.2s; }
@keyframes pulso{ from{transform:scale(1); opacity:.7} to{transform:scale(1.7); opacity:0} }

.pasos{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; counter-reset:none; }
.paso{ border-top:3px solid var(--hc-azul); padding-top:1.4rem; }
.paso:nth-child(3){ border-top-color:var(--hc-rosa-c); }
.paso-n{ display:block; font-family:var(--hc-display); font-weight:700; font-size:clamp(2.6rem,5vw,4rem); line-height:1; letter-spacing:-.04em; color:var(--hc-rosa-c); }
.paso h3{ font-size:1.6rem; margin:.8rem 0 .4rem; color:#ffffff; }
.paso p{ color:rgb(220 232 249 / .85); }

/* ---------- 4 · puertas ---------- */
.puertas{ background:#ffffff; padding:clamp(5rem,11vw,9rem) 0 clamp(4rem,9vw,7rem); }
.escalera{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem; align-items:end; margin-top:clamp(3rem,6vw,4.5rem); }
.esc{ position:relative; display:flex; flex-direction:column; border-radius:var(--hc-radio-card); padding:1.8rem 1.6rem 1.9rem; overflow:hidden;
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease; }
.esc::before{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--hc-azul); transform:scaleX(0); transform-origin:left; transition:transform .5s cubic-bezier(.16,1,.3,1); }
.esc::after{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:rgb(31 111 208 / .2); }
.esc:hover{ transform:translateY(-8px); box-shadow:0 28px 50px rgb(20 33 58 / .18); }
.esc:hover::before{ transform:scaleX(1); }
.esc--1{ min-height:340px; background:var(--hc-f4); }
.esc--2{ min-height:410px; background:var(--hc-f3); border:1px solid var(--hc-linea-fuerte); }
.esc--3{ min-height:480px; background:var(--hc-azul-p); color:#ffffff; }
.esc--4{ min-height:550px; background:var(--hc-navy); color:#ffffff; }
.esc--3::before,.esc--4::before{ background:var(--hc-rosa-c); }
.esc-ico{ width:72px; height:72px; border-radius:50%; display:grid; place-items:center; background:#ffffff; margin-bottom:1.2rem; }
.esc--3 .esc-ico,.esc--4 .esc-ico{ background:rgb(255 255 255 / .1); }
.esc-ico svg{ width:42px; height:42px; overflow:visible; fill:none; stroke:var(--hc-azul-p); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.esc--3 .esc-ico svg,.esc--4 .esc-ico svg{ stroke:var(--hc-rosa-c); }
.esc-n{ font-family:var(--hc-display); font-weight:700; font-size:clamp(2.6rem,4vw,3.6rem); line-height:1; letter-spacing:-.04em; color:var(--hc-azul-p); margin-bottom:auto; padding-bottom:1.5rem; }
.esc--3 .esc-n,.esc--4 .esc-n{ color:var(--hc-rosa-c); }
.esc-k{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; color:var(--hc-azul-p); margin-bottom:.5rem; }
.esc--3 .esc-k,.esc--4 .esc-k{ color:var(--hc-rosa-c); }
.esc h3{ font-size:clamp(1.35rem,1.9vw,1.75rem); line-height:1.1; margin-bottom:.7rem; }
.esc > p:last-child{ font-size:1rem; line-height:1.5; }
.esc--3 > p:last-child,.esc--4 > p:last-child{ color:rgb(220 232 249 / .92); }
.esc .late,.esc .mueve,.esc .anda{ transform-box:fill-box; transform-origin:center; }
.esc:hover .late{ animation:latido .9s ease-in-out infinite; }
.esc:hover .mueve{ animation:balanceo 1.2s ease-in-out infinite; transform-origin:50% 0; }
.esc:hover .anda{ animation:andar .7s ease-in-out infinite; }
@keyframes latido{ 0%,100%{transform:scale(1)} 40%{transform:scale(1.3)} }
@keyframes balanceo{ 0%,100%{transform:rotate(0)} 50%{transform:rotate(-8deg)} }
@keyframes andar{ 0%,100%{transform:translateX(0)} 50%{transform:translateX(5px)} }
@supports (animation-timeline: view()){
  .esc{ animation:subir linear both; animation-timeline:view(); animation-range:entry 0% cover 30%; }
}

.escala{ display:flex; align-items:center; gap:1.2rem; margin-top:2rem; font-family:var(--hc-display); font-weight:700; font-size:.95rem; letter-spacing:.08em; text-transform:uppercase; color:var(--hc-azul-p); }
.escala span:first-child,.escala span:last-child{ white-space:nowrap; }
.barra{ position:relative; flex:1; height:4px; border-radius:4px; background:linear-gradient(90deg,#dce8f9,#1f6fd0 60%,#14213a); }
.barra::after{ content:""; position:absolute; right:-4px; top:-6px; border-left:12px solid var(--hc-navy); border-top:8px solid transparent; border-bottom:8px solid transparent; }
.barra i{ position:absolute; top:-3px; left:0; width:10px; height:10px; border-radius:50%; background:var(--hc-rosa-c); box-shadow:0 0 0 4px rgb(227 185 196 / .35); animation:recorrer 4s cubic-bezier(.6,0,.4,1) infinite; }
@keyframes recorrer{ 0%{left:0} 85%,100%{left:calc(100% - 10px)} }

/* ---------- 5 · puente ---------- */
.puente{ background:var(--hc-f2); padding:clamp(5rem,10vw,8rem) 0; }
.puente-in{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:3rem 4rem; align-items:center; }
.diagrama{ width:100%; max-width:620px; height:auto; margin-top:2.5rem; }
.dg-flujo{ fill:none; stroke:#1f6fd0; stroke-width:5; stroke-linecap:round; stroke-dasharray:8 8; animation:fluir .8s linear infinite; }
@keyframes fluir{ to{ stroke-dashoffset:-16; } }
.dg-halo{ transform-box:fill-box; transform-origin:center; animation:respirar 3s ease-in-out infinite; }
@keyframes respirar{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} }
.vinetas{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.vinetas li,.seguridad li{ background:#ffffff; border:1px solid var(--hc-linea); border-radius:18px; padding:1.3rem 1.3rem 1.4rem; box-shadow:var(--hc-sombra); font-weight:600; line-height:1.45; }
.v-ico{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:var(--hc-f4); margin-bottom:.9rem; }
.v-ico svg{ width:22px; height:22px; fill:none; stroke:var(--hc-azul-p); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.seguridad{ grid-column:1 / -1; display:grid; grid-template-columns:auto minmax(0,1fr); gap:1.5rem 2.5rem; align-items:center; background:var(--hc-navy); color:#ffffff; border-radius:var(--hc-radio-card); padding:1.8rem 2rem; }
.seguridad h3{ font-size:.85rem; letter-spacing:.22em; text-transform:uppercase; font-family:var(--hc-sans); font-weight:800; color:var(--hc-rosa-c); }
.seguridad ul{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.seguridad li{ background:rgb(255 255 255 / .05); border-color:rgb(220 232 249 / .18); box-shadow:none; display:flex; align-items:center; gap:.9rem; padding:1rem 1.1rem; }
.seguridad .v-ico{ flex:none; margin:0; background:rgb(227 185 196 / .16); }
.seguridad .v-ico svg{ stroke:var(--hc-rosa-c); }

/* ---------- 6 · cierre ---------- */
.cierre{ position:relative; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; background:var(--hc-navy); color:#ffffff; overflow:hidden; }
.ondas{ position:absolute; left:50%; top:46%; width:0; height:0; pointer-events:none; }
.ondas i{ position:absolute; left:-30vmax; top:-30vmax; width:60vmax; height:60vmax; border-radius:50%; border:1px solid rgb(227 185 196 / .35); animation:onda 7.5s ease-out infinite both; }
.ondas i:nth-child(2){ animation-delay:2.5s; } .ondas i:nth-child(3){ animation-delay:5s; }
.ondas::before{ content:""; position:absolute; left:-35vmax; top:-35vmax; width:70vmax; height:70vmax; border-radius:50%; background:radial-gradient(closest-side, rgb(31 111 208 / .4), transparent); }
@keyframes onda{ from{transform:scale(.15); opacity:1} to{transform:scale(1.6); opacity:0} }
.cierre-in{ position:relative; flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:6rem 0 4rem; }
.cierre-t{ font-size:clamp(3rem,9vw,8.5rem); line-height:.92; letter-spacing:-.05em; font-weight:700; margin-bottom:3rem; max-width:13ch; }
.cierre-t span{ color:var(--hc-rosa-c); }
.cierre-mail{ margin-top:1.6rem; font-family:var(--hc-display); font-weight:600; font-size:clamp(1.1rem,2vw,1.4rem); }
.cierre-mail a{ color:rgb(220 232 249 / .92); text-decoration:none; border-bottom:1px solid rgb(227 185 196 / .5); }
.cierre-mail a:hover{ color:#ffffff; border-bottom-color:var(--hc-rosa-c); }
/* formulario de contacto (assets/contacto.js): tarjeta clara sobre el navy. Sin JS queda `hidden`. */
.form{ position:relative; width:min(640px,100%); display:flex; flex-direction:column; gap:1rem; text-align:left; color:var(--hc-navy);
  background:var(--hc-superficie); border:1px solid var(--hc-f4); border-radius:var(--hc-radio-card); padding:clamp(1.4rem,3vw,2.25rem); box-shadow:0 30px 70px rgb(20 33 58 / .45); }
.form[hidden]{ display:none; }
.form-trampa{ position:absolute; width:0; height:0; overflow:hidden; }
.form-fila{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); }
.campo{ display:flex; flex-direction:column; gap:.4rem; min-width:0; }
.campo label{ font-size:.92rem; font-weight:700; }
.campo input,.campo textarea{ width:100%; font:inherit; font-size:1rem; color:var(--hc-navy); background:var(--hc-f1); border:1.5px solid var(--hc-linea-fuerte);
  border-radius:var(--hc-radio); padding:.8rem .9rem; outline:none; transition:border-color .18s ease, background-color .18s ease; }
.campo textarea{ resize:vertical; min-height:6rem; }
.campo input:focus,.campo textarea:focus{ border-color:var(--hc-azul); background:#ffffff; }
.campo [aria-invalid="true"],.campo [aria-invalid="true"]:focus{ border-color:var(--hc-rosa); }
.campo input:disabled,.campo textarea:disabled{ opacity:.6; }
.campo-error{ font-size:.85rem; line-height:1.4; color:var(--hc-navy); padding-left:.6rem; border-left:2px solid var(--hc-rosa); }
.form-aviso:empty{ display:none; }
.form-aviso p{ font-size:.92rem; line-height:1.45; border-left:2px solid var(--hc-rosa); padding-left:1rem; }
.form-enviar{ border:0; cursor:pointer; background:var(--hc-navy); color:#ffffff; box-shadow:0 12px 28px rgb(20 33 58 / .22); }
.form-enviar:hover{ background:var(--hc-azul-p); transform:translateY(-2px); }
.form-enviar:disabled{ cursor:progress; opacity:.7; transform:none; }
.form :focus-visible{ outline-color:var(--hc-azul); }
.form-legal{ font-size:.8rem; line-height:1.5; color:rgb(20 33 58 / .66); }
.form-gracias{ text-align:center; padding:3rem 1.5rem; }
.form-gracias-t{ font-family:var(--hc-display); font-size:1.45rem; font-weight:700; letter-spacing:-.02em; }
.form-gracias p+p{ color:rgb(20 33 58 / .7); }
.firma{ position:relative; border-top:1px solid rgb(220 232 249 / .16); padding:1.6rem 0; }
.firma-in{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.pie-iwtg{ font-size:.95rem; color:rgb(220 232 249 / .8); }
.pie-iwtg a{ color:#ffffff; font-weight:700; text-decoration:none; }
.pie-iwtg a:hover{ text-decoration:underline; }

/* ---------- responsive ---------- */
@media (max-width: 980px){
  .hero-in{ grid-template-columns:minmax(0,1fr); padding:6.5rem 0 2rem; gap:1.5rem; }
  .hero-vis{ margin:0 auto; width:100%; max-width:560px; }
  .motor{ grid-template-columns:minmax(0,1fr); }
  .pons{ height:150px; }
  .pons-via{ left:50%; right:auto; top:-12px; bottom:-12px; width:4px; height:auto; margin:0 0 0 -2px;
    background:linear-gradient(180deg, rgb(220 232 249 / .1), rgb(31 111 208 / .8), rgb(227 185 196 / .5)); }
  .pons-via i{ animation-name:via-y; }
  .pons-via i::before{ left:50%; top:0; width:4px; height:28px; margin:0 0 0 -2px; }
  .pons-chip{ width:100px; height:100px; }
  .escalera{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .esc--1,.esc--2,.esc--3,.esc--4{ min-height:0; }
  .esc--2{ margin-top:2rem; } .esc--4{ margin-top:2rem; }
  .puente-in{ grid-template-columns:minmax(0,1fr); }
  .seguridad{ grid-template-columns:minmax(0,1fr); }
}
@keyframes via-y{ from{transform:translateY(-30px)} to{transform:translateY(100%)} }
@media (max-width: 640px){
  .wrap{ width:min(1240px,100% - 2.5rem); }
  .top-con{ display:none; }
  .kpi{ grid-template-columns:minmax(0,1fr); gap:.6rem; }
  .kpi-txt{ max-width:none; }
  .pasos{ grid-template-columns:minmax(0,1fr); gap:1.6rem; }
  .escalera{ grid-template-columns:minmax(0,1fr); gap:1rem; }
  .esc--2,.esc--4{ margin-top:0; }
  .esc--1{ width:88%; } .esc--2{ width:92%; } .esc--3{ width:96%; }
  .esc-n{ padding-bottom:1rem; }
  .vinetas,.seguridad ul{ grid-template-columns:minmax(0,1fr); }
  .seguridad{ padding:1.5rem 1.25rem; }
  .escala{ font-size:.78rem; gap:.8rem; }
  .btn--grande{ padding:1.15rem 2.2rem; }
  .cierre-t{ margin-bottom:2rem; }
  .cierre-in{ padding:5rem 0 3rem; }
  .cod{ padding:1.2rem 1.1rem 1.3rem; }
}

/* ---------- movimiento reducido: todo visible y quieto ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .hp-particulas,.pons-via i,.ondas i{ display:none; }
  .cinta-in{ flex-wrap:wrap; white-space:normal; }
  .cinta span:nth-child(n+6){ display:none; }
}
