.inicio {
  --noche: #070b16;
  --noche-2: #0d1426;
  --brillo: color-mix(in srgb, var(--acento) 42%, #fff);
  --luz: #c3ccdc;
  --borde-oscuro: rgba(255, 255, 255, .13);
  --sombra-suave: 0 1px 2px rgba(11, 18, 32, .05), 0 14px 30px -18px rgba(11, 18, 32, .3);
  --sombra-alta: 0 2px 4px rgba(11, 18, 32, .05), 0 34px 60px -28px rgba(11, 18, 32, .45);
}
.defs-globales { position: absolute; width: 0; height: 0; overflow: hidden; }
.gs-a { stop-color: color-mix(in srgb, var(--acento) 88%, #fff); }
.gs-b { stop-color: var(--acento-oscuro); }
.gs-o0 { stop-color: transparent; }
.gs-o1 { stop-color: var(--brillo); }


.banner { background: var(--acento); color: #fff; font-size: .84rem; line-height: 1.35; }
.banner-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 14px; padding: 9px 0; text-align: center; }
.banner b { font-weight: 800; }
.banner-enlace { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.banner :focus-visible { outline-color: #fff; }


.inicio .cabecera { background: rgba(7, 11, 22, .86); border-bottom-color: var(--borde-oscuro); }
.inicio .marca { color: #fff; }
.inicio .nav a { color: var(--luz); }
.inicio .nav a:hover { color: #fff; }
.inicio .cabecera .btn-secundario { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }
.inicio .cabecera .btn-secundario:hover { border-color: #fff; }
.inicio .cabecera .btn-primario { box-shadow: 0 0 0 1px rgba(255, 255, 255, .22) inset, 0 8px 24px -10px var(--acento); }
.inicio .marca-icono { box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 6px 18px -6px var(--acento); }
.inicio .cabecera :focus-visible, .hero :focus-visible, .cta-final :focus-visible, #como-funciona :focus-visible { outline-color: #fff; }


.menu-movil { flex: none; }
.menu-movil summary { list-style: none; cursor: pointer; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .35); color: #fff; }
.menu-movil summary::-webkit-details-marker { display: none; }
.menu-movil summary svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.menu-movil[open] summary { border-color: #fff; background: rgba(255, 255, 255, .1); }
.menu-movil .lista { position: absolute; left: 0; right: 0; top: 100%; background: var(--noche-2); border-bottom: 1px solid var(--borde-oscuro); padding: 4px 16px 14px; display: grid; box-shadow: 0 24px 40px -20px rgba(0, 0, 0, .6); }
.menu-movil .lista a { padding: 15px 4px; color: #fff; text-decoration: none; font-weight: 600; border-bottom: 1px solid var(--borde-oscuro); }
@media (min-width: 900px) { .menu-movil { display: none; } }

section[id] { scroll-margin-top: 76px; }
.etiqueta { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--acento); background: var(--acento-suave); padding: 6px 12px; border-radius: 999px; }
.centrado { display: flex; justify-content: center; margin-top: 36px; }
@media (min-width: 960px) { }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
}
.btn-cta::after { content: ""; flex: none; width: 1.05em; height: 1.05em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .18s ease-out; }
.acciones .btn-cta::after { display: none; }
.pie-imagen { margin-top: 14px; font-size: .82rem; color: var(--suave); text-align: center; }
.pie-imagen a { color: inherit; }
@media (min-width: 900px) {
}


.movil { --ar: 214 / 424; --iy: 1.65%; position: absolute; right: 0; bottom: 0; z-index: 2; width: 28%; aspect-ratio: var(--ar); border-radius: 15% / 7.6%; background: linear-gradient(145deg, #5a6480 0, #1a2031 24%, #090c14 58%, #2a3248 100%); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .2), inset 0 0 0 4px #05070c, 0 0 0 1px rgba(0, 0, 0, .75), 0 40px 60px -22px rgba(0, 0, 0, .85); }
.movil::before, .movil::after { content: ""; position: absolute; width: 1.4%; border-radius: 2px; background: #3a4358; }
.movil::before { right: -1.3%; top: 24%; height: 12%; }
.movil::after { left: -1.3%; top: 17%; height: 7%; }
.mv-pantalla { position: absolute; inset: var(--iy) 3.3%; border-radius: 12.5% / 6.2%; overflow: hidden; background: #f1f4f9; }
.mv-pantalla svg { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.mv-pantalla::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(118deg, rgba(255, 255, 255, .26) 0, rgba(255, 255, 255, .05) 30%, transparent 31%); }
.mv-isla { position: absolute; z-index: 3; top: 3.3%; left: 50%; width: 27%; height: 2.4%; transform: translateX(-50%); border-radius: 999px; background: #04060b; box-shadow: 0 0 0 1px rgba(255, 255, 255, .06); }
.movil.mini { --ar: 214 / 374; --iy: 1.9%; position: relative; right: auto; bottom: auto; width: min(168px, 100%); margin-inline: auto; }
.movil.mini .mv-isla { top: 3.7%; height: 2.7%; }
@media (min-width: 480px) { }
@media (max-width: 599px) {
  .movil { width: 31%; bottom: 2%; }
  .movil:not(.mini)::after { display: none; }
}
@media (min-width: 960px) {
  .movil:not(.mini) { right: -2%; bottom: -2%; width: 27%; transform: rotateY(-9deg) rotate(1.5deg); }
}
@media (min-width: 960px) { }
@media (min-width: 960px) { }
.pestana { font-size: .72rem; font-weight: 700; padding: 2px 9px; border-radius: 999px; color: var(--suave); }
.pestana.activa { background: var(--acento); color: #fff; }


.lp-ui { font-family: var(--fuente); }
.lp-bg { fill: #f1f4f9; } .lp-top { fill: #e5e9f1; } .lp-side { fill: #101828; }
.lp-d1 { fill: #ff6b6b; } .lp-d2 { fill: #ffc14d; } .lp-d3 { fill: #4cd08f; }
.lp-url { fill: #fff; } .lp-logo { fill: var(--acento); }
.lp-card { fill: #fff; stroke: #dde3ec; } .lp-hoja { fill: #fff; stroke: #d5dce8; }
.lp-txt { fill: #0b1220; } .lp-sub { fill: #566176; } .lp-blanco { fill: #fff; }
.lp-acf { fill: var(--acento); } .lp-gris { fill: #c5cdda; } .lp-linea { fill: #d9dfe9; }
.lp-chip { fill: rgba(255, 255, 255, .22); }
.lp-pista { fill: #e7ebf3; }
.lp-ico { fill: none; stroke: #8794ad; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lp-lat.act .lp-ico { stroke: #fff; }
.lp-latfondo { fill: var(--acento); }
.lp-grid { stroke: #e3e8f0; stroke-width: 1; fill: none; }
.lp-pill { fill: color-mix(in srgb, var(--acento) 16%, #fff); stroke: var(--acento); stroke-width: 1.2; }
.lp-ba { fill: #c9d0dc; } .lp-bn { fill: url(#gAcento); } .lp-rk { fill: #9aa7c0; } .lp-rk.top { fill: var(--acento); }
.lp-g2, .lp-g3 { opacity: 0; }
.lp-bn, .lp-ba { transform-box: fill-box; transform-origin: 50% 100%; }
.lp-rk { transform-box: fill-box; transform-origin: 0 50%; }


.mv-ui { font-family: var(--fuente); }
.mv-ui .mv-bg { fill: #f1f4f9; } .mv-ui .mv-card { fill: #fff; stroke: #dde3ec; } .mv-ui .mv-card.top { stroke: var(--acento); stroke-width: 1.6; }
.mv-ui .mv-txt { fill: #0b1220; } .mv-ui .mv-sub { fill: #566176; } .mv-ui .mv-blanco { fill: #fff; } .mv-ui .mv-acento { fill: var(--acento); }
.mv-ui .mv-acf { fill: var(--acento); } .mv-ui .mv-pista { fill: #e3e8f0; } .mv-ui .mv-gris { fill: #bcc5d4; } .mv-ui .mv-oferta { fill: var(--acento); } .mv-ui .mv-oferta.g { fill: #9aa7c0; }
.mv-ui .mv-hoja { fill: #fff; stroke: #d5dce8; } .mv-ui .mv-hojagr { fill: #fff; stroke: #d5dce8; } .mv-ui .mv-linea { fill: #d9dfe9; }
.mv-ui .mv-haz { fill: var(--acento); opacity: .85; }
.mv-ui .mv-prog { fill: var(--acento); }
.mv-ui .mv-chip { fill: color-mix(in srgb, var(--acento) 15%, #fff); } .mv-ui .mv-chipt { fill: var(--acento-oscuro); } .mv-ui .mv-chipb { fill: rgba(255, 255, 255, .22); }
.mv-ui .mv-res { fill: url(#gAcentoH); }
.mv-ui .mv-boton { fill: #0b1220; } .mv-ui .mv-boton.acc { fill: var(--acento); }
.mv-ui .mv-check { fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mv-ui .mv-trazo { fill: none; stroke: #0b1220; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mv-ui .mv-flecha { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mv-ui .mv-spark { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.mv-ui .mv-punto { fill: #fff; }
.mv-ui .mv-bat { fill: none; stroke: #0b1220; stroke-width: 1; } .mv-ui .mv-bat-i { fill: #0b1220; }
.mv-ui .mv-home { fill: #0b1220; opacity: .75; }
.mv-ui .mv-zona { fill: color-mix(in srgb, var(--acento) 7%, #fff); stroke: var(--acento); stroke-width: 1.4; stroke-dasharray: 5 4; }
.mv-ui .mv-ico2, .mv-ui .mv-ico3 { fill: none; stroke: var(--acento); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mv-ui .mv-ico3 { stroke: #fff; }
.mv-ui .mv-borde { fill: var(--acento); }
.mv-ui .mv-pill { fill: #fff; stroke: var(--acento); stroke-width: 1.3; }
.mv-ui .mv-haz, .mv-ui .mv-prog, .mv-ui .mv-oferta, .mv-ui .mv-gris { transform-box: fill-box; transform-origin: 0 50%; }


.barras .ba { fill: #cdd3dd; }
.barras .bn { fill: url(#gAcento); }
.barras .base { stroke: #aab1bc; stroke-width: 1; fill: none; }
.barras .guia { stroke: #e6e9ee; stroke-width: 1; stroke-dasharray: 3 3; fill: none; }
.barras .ba, .barras .bn { transform-box: fill-box; transform-origin: 50% 100%; }
.hoja-factura { position: relative; overflow: hidden; width: 118px; aspect-ratio: 3 / 4; margin-inline: auto; padding: 11px 10px; display: flex; flex-direction: column; gap: 6px; background: #fff; border: 1px solid var(--linea); border-radius: 8px; box-shadow: var(--sombra-suave); }
.hoja-factura i { display: block; border-radius: 3px; background: #e4e8ee; }
.hf-cab { height: 14px; background: var(--acento) !important; }
.hf-l { height: 5px; } .hf-l.a { width: 80%; } .hf-l.b { width: 55%; } .hf-l.c { width: 68%; } .hf-l.d { width: 42%; margin-top: auto; }
.hf-tabla { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; margin-top: 4px; }
.hf-tabla i { height: 14px; background: color-mix(in srgb, var(--acento) 14%, #fff); }
.hf-haz { position: absolute; inset: 0; border-radius: 0 !important; background: linear-gradient(to bottom, transparent 0, color-mix(in srgb, var(--acento) 24%, transparent) 94%, var(--acento) 100%) !important; opacity: 0; }


section.bloque { padding: clamp(56px, 8vw, 100px) 0 0; }
.cabecera-seccion { max-width: 44em; }
.cabecera-seccion h2, .dos-col h2 { font-size: clamp(1.65rem, 4vw, 2.45rem); font-weight: 800; margin-top: 14px; text-wrap: balance; letter-spacing: -0.03em; }
.cabecera-seccion p, .subtexto { margin-top: 12px; color: var(--suave); font-size: 1.05rem; }
.rejilla { display: grid; gap: 16px; margin-top: 36px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .rejilla { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .rejilla.tres { grid-template-columns: repeat(3, 1fr); } .rejilla.cuatro { grid-template-columns: repeat(4, 1fr); } }
.tarjeta { position: relative; border: 1px solid var(--linea); border-radius: 18px; padding: 24px; background: #fff; box-shadow: var(--sombra-suave); transition: transform .22s ease-out, box-shadow .22s ease-out, border-color .22s ease-out; }
.tarjeta h3 { font-size: 1.12rem; font-weight: 700; margin-top: 14px; letter-spacing: -0.01em; }
.tarjeta p { margin-top: 8px; color: var(--suave); font-size: .98rem; }
.icono { flex: none; width: 46px; height: 46px; border-radius: 13px; background: linear-gradient(145deg, var(--acento-suave), #fff); border: 1px solid color-mix(in srgb, var(--acento) 22%, #fff); color: var(--acento); display: grid; place-items: center; transition: background-color .2s, color .2s, border-color .2s; }
.icono svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (hover: hover) {
  .tarjeta:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--acento) 45%, var(--linea)); box-shadow: 0 2px 4px rgba(11, 18, 32, .05), 0 28px 44px -24px color-mix(in srgb, var(--acento) 45%, transparent); }
  .tarjeta:hover .icono, .funcion:hover .icono { background: var(--acento); color: #fff; border-color: var(--acento); }
}


.comp { padding-top: 22px; overflow: hidden; }
.comp::before { content: ""; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--acento) 14%, transparent), transparent); pointer-events: none; }
.comp > .icono { position: absolute; right: 18px; top: 18px; }
.barras { width: 100%; max-width: 230px; height: auto; margin-bottom: 16px; }
.comp .etq { display: inline-block; font-size: .78rem; font-weight: 700; color: var(--acento); background: var(--acento-suave); padding: 3px 10px; border-radius: 999px; }
.comp h3 { margin-top: 10px; font-size: 1.4rem; }


@media (max-width: 639px) {
  .comp { display: grid; grid-template-columns: 92px 1fr; column-gap: 16px; align-items: center; padding: 16px; }
  .comp > .icono { display: none; }
  .comp .barras { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
  .comp .etq { grid-column: 2; justify-self: start; }
  .comp h3 { grid-column: 2; margin-top: 6px; font-size: 1.2rem; }
  .comp p { grid-column: 2; margin-top: 4px; font-size: .92rem; }
}


.factura-lectura { position: relative; overflow: hidden; margin-top: 20px; display: grid; gap: 24px; border: 1px solid color-mix(in srgb, var(--acento) 18%, var(--linea)); background: linear-gradient(135deg, var(--acento-suave) 0, #fff 62%); border-radius: 22px; padding: clamp(20px, 4vw, 40px); align-items: center; box-shadow: var(--sombra-suave); }
.factura-lectura::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(color-mix(in srgb, var(--acento) 18%, transparent) 1px, transparent 1.4px); background-size: 20px 20px; -webkit-mask-image: linear-gradient(115deg, #000, transparent 55%); mask-image: linear-gradient(115deg, #000, transparent 55%); }
.factura-lectura > * { position: relative; }
.factura-lectura h3 { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.02em; }
.factura-lectura p { margin-top: 10px; color: var(--suave); }
.fl-maqueta { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.fl-pdf { display: grid; gap: 8px; justify-items: center; }
.fl-pdf b { display: inline-flex; align-items: center; gap: 6px; font-size: .84rem; padding: 4px 11px; border-radius: 999px; background: #fff; border: 1px solid var(--linea); }
.fl-pdf svg { width: 16px; height: 16px; fill: none; stroke: var(--acento); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fl-flecha { width: 30px; height: 30px; padding: 5px; border-radius: 50%; background: var(--acento); fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transform: rotate(90deg); box-shadow: 0 8px 20px -6px var(--acento); }
.fl-campos { list-style: none; margin: 0; padding: 0; width: 100%; max-width: 340px; display: grid; gap: 6px; }
.fl-campos li { display: flex; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid var(--linea); border-left: 4px solid var(--acento); border-radius: 9px; padding: 8px 12px; font-size: .9rem; box-shadow: 0 6px 14px -10px rgba(11, 18, 32, .3); }
.fl-campos span { color: var(--suave); }
@media (min-width: 860px) {
  .factura-lectura { grid-template-columns: 1fr 1.15fr; gap: 40px; }
  .fl-maqueta { flex-direction: row; justify-content: center; gap: 18px; }
  .fl-flecha { transform: none; flex: none; }
  .fl-campos { max-width: 250px; }
}


#como-funciona { position: relative; isolation: isolate; overflow: hidden; margin-top: clamp(56px, 8vw, 100px); padding: clamp(56px, 8vw, 96px) 0; background: var(--noche); color: #fff; }
#como-funciona::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(50% 60% at 12% 0%, color-mix(in srgb, var(--acento) 50%, transparent), transparent 72%), radial-gradient(45% 55% at 100% 100%, color-mix(in srgb, var(--acento-oscuro) 55%, transparent), transparent 72%); }
#como-funciona::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: linear-gradient(to bottom, #000, transparent 85%); mask-image: linear-gradient(to bottom, #000, transparent 85%); }
#como-funciona .etiqueta { background: rgba(255, 255, 255, .1); color: #fff; border: 1px solid rgba(255, 255, 255, .22); }
#como-funciona .cabecera-seccion p { color: var(--luz); }
.pasos-visual { list-style: none; margin: 40px 0 0; padding: 0; display: grid; gap: 16px; counter-reset: paso; grid-template-columns: 1fr; }
.pasos-visual li { counter-increment: paso; position: relative; border: 1px solid var(--borde-oscuro); border-radius: 22px; padding: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .025)); }
.pasos-visual li::after { content: counter(paso); position: absolute; top: 14px; left: 14px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; font-size: 1rem; color: #fff; background: var(--acento); box-shadow: 0 0 0 4px color-mix(in srgb, var(--acento) 30%, transparent), 0 8px 22px -6px var(--acento); z-index: 3; }
.pasos-visual .icono { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); color: #fff; }
.pasos-visual h3 { font-size: 1.15rem; font-weight: 700; margin-top: 16px; color: #fff; }
.pasos-visual p { margin-top: 8px; color: var(--luz); font-size: .98rem; }
.pasos-visual .movil.mini { box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .2), inset 0 0 0 4px #05070c, 0 0 0 1px rgba(0, 0, 0, .75), 0 30px 50px -20px rgba(0, 0, 0, .9), 0 0 60px -16px color-mix(in srgb, var(--acento) 60%, transparent); }
@media (max-width: 859px) {
  .pasos-visual li { display: grid; grid-template-columns: 112px 1fr; column-gap: 18px; align-items: center; padding: 18px; }
  .pasos-visual .movil.mini { grid-row: 1 / span 3; width: 112px; }
  .pasos-visual .icono { display: none; }
  .pasos-visual h3 { margin-top: 0; }
  .pasos-visual p { margin-top: 6px; }
  .pasos-visual li::after { top: 10px; left: 10px; width: 28px; height: 28px; font-size: .9rem; }
}
@media (min-width: 860px) {
  .pasos-visual { grid-template-columns: repeat(3, 1fr); gap: 22px; }
  .pasos-visual li { display: flex; flex-direction: column; align-items: flex-start; padding: 26px 24px 28px; }
  .pasos-visual .movil.mini { margin: 4px auto 6px; }
  .pasos-visual li + li::before { content: ""; position: absolute; left: -22px; top: 36%; width: 22px; height: 2px; background: linear-gradient(90deg, transparent, var(--brillo)); }
}
#como-funciona .centrado .btn-primario { background: #fff; color: var(--acento); box-shadow: 0 14px 44px -10px var(--acento); }
#como-funciona .centrado .btn-primario:hover { background: var(--acento-suave); }


.dos-col { display: grid; gap: 36px; align-items: center; }
@media (min-width: 900px) { .dos-col { grid-template-columns: 1fr 1fr; gap: 64px; } .dos-col.invertida > :last-child { order: -1; } }
.lista-check { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.lista-check li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; color: var(--suave); }
.lista-check b { color: var(--texto); }
.lista-check svg { width: 26px; height: 26px; padding: 4px; border-radius: 50%; background: var(--acento-suave); fill: none; stroke: var(--acento); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; margin-top: -1px; }


#marca .dos-col { position: relative; }
.marca-visual { min-width: 0; }
.mv-escena { position: relative; padding: 0 0 54px; }
.mv-lamina { position: relative; overflow: hidden; margin: 0 0 0 24%; border: 1px solid var(--linea); border-radius: 14px; background: #fff; box-shadow: var(--sombra-alta); }
.mv-lamina img { width: 100%; height: auto; aspect-ratio: 1260 / 840; }
.mv-lamina::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .55) 50%, transparent 62%); translate: -120% 0; }
.mv-origen { position: absolute; left: 0; top: 14%; width: 25%; z-index: 2; text-align: center; transform: rotate(-5deg); }
.mv-origen .hoja-factura { width: 100%; box-shadow: var(--sombra-alta); }
.mv-origen b { display: block; margin-top: 8px; font-size: .78rem; color: var(--suave); }
.mv-puente { position: absolute; z-index: 3; left: 20.5%; top: 36%; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--acento); box-shadow: 0 0 0 5px #fff, 0 12px 26px -6px var(--acento); }
.mv-puente svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.mv-marca { position: absolute; z-index: 3; right: 3%; bottom: 0; display: flex; align-items: center; gap: 12px; padding: 10px 14px 10px 10px; background: #fff; border: 1px solid var(--linea); border-radius: 16px; box-shadow: 0 22px 40px -18px rgba(11, 18, 32, .5); }
.mv-marca b { display: block; font-size: .92rem; line-height: 1.2; }
.mv-marca small { display: block; color: var(--suave); font-size: .76rem; line-height: 1.2; }
.mm-logo { flex: none; width: 40px; height: 40px; border-radius: 11px; background: var(--acento); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 1.3rem; }
.mm-colores { display: flex; gap: 4px; margin-left: 4px; }
.mm-colores i { width: 16px; height: 16px; border-radius: 50%; box-shadow: 0 0 0 1px var(--linea); }
.mm-colores .c1 { background: var(--acento); } .mm-colores .c2 { background: var(--acento-oscuro); } .mm-colores .c3 { background: var(--acento-suave); }
@media (min-width: 900px) { .mv-lamina { transform: perspective(1400px) rotateY(-7deg) rotateX(2deg); } }
@media (max-width: 420px) { .mv-marca { right: 0; } .mm-colores { display: none; } }


.crm-visual { position: relative; margin: 36px 0 0; padding: 0 0 26px; min-width: 0; }
.mc-contrato { position: absolute; right: -6px; bottom: 34px; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--acento) 30%, var(--linea)); border-radius: 16px; box-shadow: 0 24px 42px -18px rgba(11, 18, 32, .55); line-height: 1.2; }
.mc-contrato small { display: block; font-size: .72rem; color: var(--suave); }
.mc-contrato b { display: block; font-size: .85rem; }
.mc-contrato .firma { width: 52px; height: 18px; fill: none; stroke: var(--acento); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 420px) { .mc-contrato .firma { display: none; } }

@media (max-width: 719px) {
  .crm-visual { padding-bottom: 0; }
  .crm-visual .ampliar { overflow-x: auto; overscroll-behavior-x: contain; }
  .crm-visual .ampliar img { width: 780px; max-width: none; }
  .crm-visual .ampliar-ico { display: none; }
  .mc-contrato { position: relative; right: auto; bottom: auto; width: fit-content; margin: -20px 10px 14px auto; }
}
.lista-check.dos { margin-top: 26px; }
@media (min-width: 760px) { .lista-check.dos { grid-template-columns: 1fr 1fr; gap: 14px 40px; } }


.ventana { border: 1px solid rgba(11, 18, 32, .14); border-radius: 12px; background: #fff; overflow: hidden; box-shadow: var(--sombra-alta); }
.ventana-barra { display: flex; align-items: center; gap: 6px; padding: 8px 12px; background: #e9edf4; border-bottom: 1px solid rgba(11, 18, 32, .1); }
.ventana-barra i { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #cfd5df; }
.ventana-barra i:nth-child(1) { background: #ff8c8c; } .ventana-barra i:nth-child(2) { background: #ffd075; } .ventana-barra i:nth-child(3) { background: #6fdca8; }
.ventana-barra span { margin-left: 8px; font-size: .74rem; font-weight: 700; color: var(--suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ampliar { position: relative; display: block; line-height: 0; color: inherit; text-decoration: none; }
.ampliar img { width: 100%; height: auto; background: #eef2f8; }
.ampliar-ico { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 9px; border-radius: 999px; background: rgba(11, 18, 32, .82); color: #fff; font-size: .78rem; font-weight: 700; line-height: 1.2; transition: background-color .15s; }
.ampliar-ico svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ampliar:hover .ampliar-ico, .ampliar:focus-visible .ampliar-ico { background: var(--acento); }
@media (min-width: 960px) { }
@media (min-width: 1100px) { }
@media (max-width: 599px) { }
@media (min-width: 640px) and (max-width: 959px) { }


.resalte { font-style: normal; color: var(--acento); background: linear-gradient(transparent 64%, color-mix(in srgb, var(--acento) 18%, transparent) 64%); }
.flujo { list-style: none; margin: 34px 0 0; padding: 0; display: grid; gap: 14px; grid-template-columns: 1fr; counter-reset: fl; }
.flujo li { counter-increment: fl; position: relative; padding: 20px 20px 22px; border: 1px solid var(--linea); border-radius: 18px; background: #fff; box-shadow: var(--sombra-suave); }
.flujo li::after { content: counter(fl); position: absolute; top: 12px; right: 16px; font-weight: 800; font-size: 2.1rem; line-height: 1; letter-spacing: -0.04em; color: transparent; -webkit-text-stroke: 1.5px color-mix(in srgb, var(--acento) 55%, #fff); }
.flujo h3 { font-size: 1.05rem; font-weight: 700; margin-top: 14px; }
.flujo p { margin-top: 6px; color: var(--suave); font-size: .94rem; }
.flujo li:last-child { border-color: color-mix(in srgb, var(--acento) 55%, var(--linea)); background: linear-gradient(180deg, var(--acento-suave), #fff 80%); }
@media (min-width: 560px) { .flujo { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .flujo { grid-template-columns: repeat(4, 1fr); gap: 26px; } .flujo li + li::before { content: ""; position: absolute; left: -26px; top: 44px; width: 26px; height: 2px; background: linear-gradient(90deg, transparent, var(--acento)); } }
.api-panel { position: relative; isolation: isolate; overflow: hidden; margin-top: 22px; display: grid; gap: 26px; padding: clamp(22px, 4vw, 44px); border-radius: 24px; background: var(--noche); color: #fff; box-shadow: var(--sombra-alta); }
.api-panel::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(50% 70% at 0% 0%, color-mix(in srgb, var(--acento) 55%, transparent), transparent 72%), radial-gradient(40% 60% at 100% 100%, color-mix(in srgb, var(--acento-oscuro) 55%, transparent), transparent 72%); }
.api-panel::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: linear-gradient(120deg, #000, transparent 70%); mask-image: linear-gradient(120deg, #000, transparent 70%); }
.api-cab { display: flex; gap: 16px; align-items: flex-start; }
.api-cab .icono { width: 54px; height: 54px; border-radius: 15px; background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .25); color: #fff; }
.api-cab .icono svg { width: 26px; height: 26px; }
.api-cab .etiqueta { background: rgba(255, 255, 255, .1); color: #fff; border: 1px solid rgba(255, 255, 255, .22); }
.api-panel h3 { font-size: clamp(1.3rem, 3vw, 1.85rem); font-weight: 800; margin-top: 12px; letter-spacing: -0.025em; color: #fff; text-wrap: balance; }
.api-cab p { margin-top: 10px; color: var(--luz); }
.api-panel .lista-check { margin-top: 0; }
.api-panel .lista-check li { color: #dbe3f1; }
.api-panel .lista-check svg { background: rgba(255, 255, 255, .1); stroke: var(--brillo); }
.api-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; padding-top: 22px; border-top: 1px solid var(--borde-oscuro); }
.api-pie p { flex: 1 1 260px; max-width: 40em; font-size: .88rem; color: var(--luz); }
.api-panel .btn-primario { background: #fff; color: var(--acento); box-shadow: 0 14px 44px -10px var(--acento); }
.api-panel .btn-primario:hover { background: var(--acento-suave); }
.api-panel :focus-visible { outline-color: #fff; }
@media (min-width: 900px) { .api-panel { grid-template-columns: 1.15fr 1fr; align-items: center; gap: 28px 48px; } .api-pie { grid-column: 1 / -1; } }


.capacidad h3 { margin-top: 16px; }
@media (max-width: 639px) {
  .capacidad { display: grid; grid-template-columns: 46px 1fr; column-gap: 14px; align-items: start; padding: 16px; }
  .capacidad .icono { grid-row: 1 / span 2; }
  .capacidad h3 { margin-top: 2px; font-size: 1.04rem; }
  .capacidad p { margin-top: 4px; font-size: .93rem; }
}


.galeria { display: grid; gap: 30px; margin-top: 34px; grid-template-columns: 1fr; align-items: start; }
.galeria figure, .crm-visual { margin-inline: 0; }
.galeria figure { margin-block: 0; min-width: 0; }
.galeria figcaption { margin-top: 14px; display: grid; gap: 4px; }
.galeria figcaption b { font-size: 1.05rem; }
.galeria figcaption span { color: var(--suave); font-size: .95rem; }
@media (min-width: 900px) { .galeria { grid-template-columns: 7fr 5fr; gap: 34px; } }

.mercado-rejilla { display: grid; gap: 28px; margin-top: 34px; grid-template-columns: minmax(0, 1fr); align-items: start; }
.mercado-puntos { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.mercado-puntos li { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 14px; align-items: start; padding: 16px 18px; border: 1px solid var(--linea); border-radius: 16px; background: #fff; box-shadow: var(--sombra-suave); }
.mercado-puntos h3 { font-size: 1.05rem; font-weight: 700; letter-spacing: -0.01em; }
.mercado-puntos p { margin-top: 4px; color: var(--suave); font-size: .95rem; }
.mercado-principal { margin: 0; min-width: 0; }
.mercado-principal figcaption { margin-top: 14px; display: grid; gap: 4px; }
.mercado-principal figcaption b { font-size: 1.05rem; }
.mercado-principal figcaption span { color: var(--suave); font-size: .95rem; }
@media (min-width: 960px) { .mercado-rejilla { grid-template-columns: 5fr 7fr; gap: 34px; } .mercado-puntos { position: sticky; top: 88px; } }   
@media (min-width: 900px) { .galeria.galeria-mercado { grid-template-columns: 1fr 1fr; } }
.crm-visual .ventana { max-width: 1020px; margin-inline: auto; }
.crm-visual .pie-imagen { max-width: 1020px; margin-inline: auto; }


.visor { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 14px; }
.visor:target { display: flex; }
.visor-fondo { position: absolute; inset: 0; background: rgba(5, 8, 15, .88); cursor: zoom-out; }
.visor figure { position: relative; margin: 0; max-width: min(96vw, 1240px); max-height: 94vh; overflow: auto; border-radius: 14px; background: #fff; box-shadow: 0 40px 90px -30px #000; }
.visor img { display: block; width: 100%; height: auto; background: #eef2f8; }
#v-renovaciones img { min-width: 860px; }
.visor figcaption { position: sticky; left: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 10px 16px; border-top: 1px solid var(--linea); background: #fff; font-size: .88rem; }
.visor figcaption span { color: var(--suave); }
.visor figcaption a { font-weight: 700; }
.visor .visor-cerrar { margin-left: auto; padding: 6px 16px; border-radius: 999px; background: var(--texto); color: #fff; text-decoration: none; }
.visor .visor-cerrar:hover { background: var(--acento); }


.funcion { display: flex; gap: 14px; align-items: flex-start; padding: 20px; background: #fff; border: 1px solid var(--linea); border-radius: 18px; box-shadow: var(--sombra-suave); transition: transform .22s ease-out, box-shadow .22s ease-out, border-color .22s ease-out; }
.funcion h3 { font-size: 1.02rem; font-weight: 700; }
.funcion p { margin-top: 4px; color: var(--suave); font-size: .94rem; }
.rejilla.funciones { gap: 16px; margin-top: 32px; }
@media (hover: hover) { .funcion:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--acento) 45%, var(--linea)); box-shadow: 0 28px 44px -26px color-mix(in srgb, var(--acento) 45%, transparent); } }


.perfil .icono { margin-bottom: 4px; }
.perfil h3 { margin-top: 12px; }
.perfil ul { margin: 12px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; color: var(--suave); font-size: .96rem; }
.perfil li { padding-left: 24px; position: relative; }
.perfil li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 9px; height: 5px; border-left: 2px solid var(--acento); border-bottom: 2px solid var(--acento); transform: rotate(-45deg) translateY(-30%); }


.razones { list-style: none; margin: 36px 0 0; padding: 0; display: grid; gap: 14px; counter-reset: razon; grid-template-columns: 1fr; }
@media (min-width: 640px) { .razones { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .razones { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
.razones li { counter-increment: razon; position: relative; overflow: hidden; border: 1px solid var(--linea); border-top: 3px solid var(--acento); background: linear-gradient(180deg, var(--acento-suave) 0, var(--panel) 70%); border-radius: 4px 4px 18px 18px; padding: 22px 22px 26px; transition: transform .22s ease-out, box-shadow .22s ease-out; }
.razones li::before { content: counter(razon, decimal-leading-zero); display: block; font-weight: 800; font-size: 2.4rem; line-height: 1; letter-spacing: -0.04em; margin-bottom: 10px; color: transparent; -webkit-text-stroke: 1.5px var(--acento); }
.razones h3 { font-size: 1.08rem; font-weight: 700; }
.razones p { margin-top: 8px; color: var(--suave); font-size: .96rem; }
@media (hover: hover) { .razones li:hover { transform: translateY(-4px); box-shadow: 0 28px 44px -26px color-mix(in srgb, var(--acento) 45%, transparent); } }


.testimonio { margin: 0; }
.testimonio blockquote { margin: 0; }
.testimonio blockquote p { margin: 0; color: var(--texto); font-size: 1.02rem; }
.testimonio figcaption { margin-top: 14px; display: grid; font-size: .9rem; color: var(--suave); }
.testimonio figcaption b { color: var(--texto); }


.colab { position: relative; overflow: hidden; display: grid; gap: 28px; align-items: center; border: 1px solid color-mix(in srgb, var(--acento) 20%, var(--linea)); border-radius: 24px; padding: clamp(24px, 5vw, 52px); background: linear-gradient(135deg, var(--acento-suave) 0, #fff 85%); box-shadow: var(--sombra-suave); }
.colab::before { content: ""; position: absolute; right: -90px; top: -90px; width: 300px; height: 300px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--acento) 25%, transparent); box-shadow: 0 0 0 36px color-mix(in srgb, var(--acento) 6%, transparent), 0 0 0 80px color-mix(in srgb, var(--acento) 4%, transparent); pointer-events: none; }
.colab > * { position: relative; }
.colab h2 { font-size: clamp(1.6rem, 4vw, 2.3rem); font-weight: 800; margin-top: 14px; text-wrap: balance; }
.colab .etiqueta { background: #fff; }
.colab-botones { display: flex; flex-direction: column; gap: 12px; }
@media (min-width: 900px) { .colab { grid-template-columns: 1.5fr 1fr; gap: 56px; } }


.pasos-lista { display: grid; gap: 22px; margin: 40px 0 0; padding: 0; list-style: none; counter-reset: paso; grid-template-columns: 1fr; }
.pasos-lista li { counter-increment: paso; position: relative; padding: 2px 0 0 60px; }
.pasos-lista li::before { content: counter(paso); position: absolute; left: 0; top: 0; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; font-size: 1.1rem; color: #fff; background: var(--acento); box-shadow: 0 0 0 5px var(--acento-suave), 0 10px 24px -8px var(--acento); }
.pasos-lista li:not(:last-child)::after { content: ""; position: absolute; left: 20px; top: 52px; bottom: -20px; width: 2px; background: repeating-linear-gradient(to bottom, color-mix(in srgb, var(--acento) 50%, transparent) 0 5px, transparent 5px 10px); }
.pasos-lista h3 { font-size: 1.12rem; font-weight: 700; }
.pasos-lista p { margin-top: 8px; color: var(--suave); font-size: .97rem; }
@media (min-width: 760px) {
  .pasos-lista { grid-template-columns: repeat(3, 1fr); gap: 28px; }
  .pasos-lista li { padding: 60px 0 0; }
  .pasos-lista li:not(:last-child)::after { left: 52px; right: -14px; top: 20px; bottom: auto; width: auto; height: 2px; background: repeating-linear-gradient(to right, color-mix(in srgb, var(--acento) 50%, transparent) 0 5px, transparent 5px 10px); }
}


.seguridad { display: grid; gap: 32px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .seguridad { grid-template-columns: 5fr 6fr; gap: 64px; } }
.seguridad ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.seguridad li { display: grid; grid-template-columns: 42px 1fr; gap: 14px; align-items: start; padding: 16px; border: 1px solid var(--linea); border-radius: 16px; background: #fff; box-shadow: var(--sombra-suave); transition: border-color .2s ease-out, box-shadow .2s ease-out; }
.seguridad li svg { width: 42px; height: 42px; padding: 9px; border-radius: 12px; background: linear-gradient(145deg, var(--acento-suave), #fff); border: 1px solid color-mix(in srgb, var(--acento) 22%, #fff); fill: none; stroke: var(--acento); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.seguridad li b { display: block; font-size: 1rem; }
.seguridad li span { color: var(--suave); font-size: .95rem; }
@media (hover: hover) { .seguridad li:hover { border-color: color-mix(in srgb, var(--acento) 45%, var(--linea)); } }
.aviso-honesto { margin-top: 22px; font-size: .92rem; color: var(--suave); border-left: 3px solid var(--acento); padding-left: 14px; }
.escudo { width: min(220px, 62%); height: auto; margin-top: 26px; overflow: visible; }
.e-aro { fill: none; stroke: var(--acento); stroke-opacity: .3; stroke-width: 1.5; stroke-dasharray: 3 7; transform-box: fill-box; transform-origin: center; }
.e-escudo { fill: var(--acento-suave); stroke: var(--acento); stroke-width: 4; stroke-linejoin: round; }
.e-check { fill: none; stroke: var(--acento); stroke-width: 9; stroke-linecap: round; stroke-linejoin: round; }
.e-nodo { fill: var(--acento); }


.contenedor.estrecho { width: min(780px, 100% - 32px); }
.faq { margin-top: 28px; display: grid; gap: 10px; }
.faq details { border: 1px solid var(--linea); border-radius: 16px; background: #fff; padding: 0 18px; box-shadow: var(--sombra-suave); transition: border-color .2s ease-out, background-color .2s ease-out; }
.faq details[open] { border-color: color-mix(in srgb, var(--acento) 45%, var(--linea)); background: linear-gradient(180deg, var(--acento-suave), #fff 70%); }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; min-height: 58px; font-weight: 700; font-size: 1.03rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary { position: relative; padding-right: 46px; }
.faq summary::after { content: ""; position: absolute; right: 0; top: 50%; width: 30px; height: 30px; margin-top: -15px; border-radius: 50%; background: var(--acento-suave); }
.faq summary::before { content: ""; position: absolute; z-index: 1; right: 11px; top: 50%; width: 8px; height: 8px; margin-top: -6px; border-right: 2.5px solid var(--acento); border-bottom: 2.5px solid var(--acento); transform: rotate(45deg); transition: transform .18s ease-out; }
.faq details[open] summary::before { transform: rotate(-135deg); margin-top: -2px; }
.faq details p { padding: 0 0 20px; color: var(--suave); max-width: 46em; }


.cta-final { position: relative; overflow: hidden; isolation: isolate; margin-top: clamp(56px, 8vw, 100px); background: var(--noche); color: #fff; }
.cta-final::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(55% 90% at 50% 120%, color-mix(in srgb, var(--acento) 70%, transparent), transparent 72%), radial-gradient(30% 50% at 0% 0%, color-mix(in srgb, var(--acento-oscuro) 55%, transparent), transparent 72%); }
.cta-final::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: radial-gradient(60% 90% at 50% 100%, #000 10%, transparent 80%); mask-image: radial-gradient(60% 90% at 50% 100%, #000 10%, transparent 80%); }
.cta-final .contenedor { padding: clamp(48px, 8vw, 92px) 0; text-align: center; }
.cta-final h2 { font-size: clamp(1.9rem, 4.6vw, 3rem); font-weight: 800; max-width: 18ch; margin-inline: auto; letter-spacing: -0.035em; text-wrap: balance; }
.cta-final p { margin: 16px auto 0; max-width: 36em; font-size: 1.1rem; color: var(--luz); }
.cta-final .botones { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.cta-final .btn-blanco { background: #fff; color: var(--acento); box-shadow: 0 14px 44px -8px var(--acento); }
.cta-final .btn-blanco:hover { background: var(--acento-suave); }
.cta-final .btn-borde { background: rgba(255, 255, 255, .06); color: #fff; border-color: rgba(255, 255, 255, .45); }
.cta-final .btn-borde:hover { border-color: #fff; background: rgba(255, 255, 255, .12); }


.wa-flotante { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: inline-flex; align-items: center; gap: 8px; min-height: 52px; min-width: 52px; justify-content: center; padding: 0 16px; border-radius: 999px; background: #0b6e3f; color: #fff; font-weight: 700; font-size: .95rem; text-decoration: none; box-shadow: 0 10px 24px -8px rgba(11, 18, 32, .5); }
.wa-flotante:hover { background: #095a33; }
.wa-flotante svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.wa-flotante :focus-visible, .wa-flotante:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.wa-flotante span { display: none; }
@media (min-width: 640px) { .wa-flotante span { display: inline; } .wa-flotante { right: 24px; bottom: 24px; } }


.inicio .pie { padding-bottom: 96px; background: #05080f; border-top: 0; color: #a6b1c6; }
.inicio .pie b { color: #fff; }
.inicio .pie a { color: var(--luz); }
.inicio .pie a:hover { color: #fff; }
.inicio .pie :focus-visible { outline-color: #fff; }


@media (prefers-reduced-motion: no-preference) {
  @media (hover: hover) { .btn-cta:hover::after { transform: translateX(3px); } .btn:hover { transform: translateY(-1px); } }

  
  @keyframes entra { from { opacity: 0; translate: 0 26px; } to { opacity: 1; translate: 0 0; } }
  @keyframes entra-texto { from { opacity: 0; translate: 0 16px; } to { opacity: 1; translate: 0 0; } }
  .movil:not(.mini) { animation: entra .9s cubic-bezier(.2, .7, .2, 1) .42s both; }
  @media (max-width: 959px) { }
  @keyframes halo { 50% { opacity: .8; } }
  @keyframes flota { 50% { transform: translateY(-7px); } }
  @keyframes onda { to { stroke-dashoffset: -1; } }
  @keyframes pulso { 50% { transform: scale(1.9); opacity: .35; } }

  .lp-pill { animation: lp-pill 15s cubic-bezier(.6, 0, .3, 1) infinite; }
  @keyframes lp-pill { 0%, 29% { transform: translateX(0); } 33.3%, 62% { transform: translateX(66px); } 66.6%, 95.5% { transform: translateX(132px); } 100% { transform: translateX(0); } }
  .lp-g { --t: 0s; }
  .lp-g1 { animation: lp-v1 15s ease-in-out infinite; } .lp-g2 { --t: 5s; animation: lp-v2 15s ease-in-out infinite; } .lp-g3 { --t: 10s; animation: lp-v3 15s ease-in-out infinite; }
  @keyframes lp-v1 { 0%, 29% { opacity: 1; } 33%, 96% { opacity: 0; } 100% { opacity: 1; } }
  @keyframes lp-v2 { 0%, 29% { opacity: 0; } 34%, 62% { opacity: 1; } 66%, 100% { opacity: 0; } }
  @keyframes lp-v3 { 0%, 62% { opacity: 0; } 67%, 95% { opacity: 1; } 99%, 100% { opacity: 0; } }
  .lp-g .lp-bn, .lp-g .lp-ba { animation: lp-crece 15s cubic-bezier(.2, .7, .2, 1) infinite; animation-delay: calc(var(--t) + var(--e, 0s)); }
  .lp-g .lp-rk { animation: lp-ancho 15s cubic-bezier(.2, .7, .2, 1) infinite; animation-delay: calc(var(--t) + var(--e, 0s) + .15s); }
  @keyframes lp-crece { 0% { transform: scaleY(.04); } 5% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
  @keyframes lp-ancho { 0% { transform: scaleX(.04); } 5% { transform: scaleX(1); } 100% { transform: scaleX(1); } }
  .lp-g .d1 { --e: .07s; } .lp-g .d2 { --e: .14s; } .lp-g .d3 { --e: .21s; } .lp-g .d4 { --e: .28s; } .lp-g .d5 { --e: .35s; }
  .lp-g .r1 { --e: .1s; } .lp-g .r2 { --e: .2s; }

  .mv-ui .mv-haz { animation: mv-escanea 3.2s ease-in-out infinite; }
  @keyframes mv-escanea { 0% { transform: translateY(0); opacity: 0; } 12%, 88% { opacity: .85; } 100% { transform: translateY(44px); opacity: 0; } }
  .mv-ui .mv-prog { animation: mv-llena 2.6s ease-out .4s both; } .mv-ui .mv-oferta, .mv-ui .mv-gris { animation: mv-llena 1.4s ease-out .9s both; }
  @keyframes mv-llena { from { transform: scaleX(.03); } to { transform: scaleX(1); } }
  .mv-ui .mv-spark { stroke-dasharray: 90; animation: mv-trazo 1.6s ease-out 1s both; }
  @keyframes mv-trazo { from { stroke-dashoffset: 90; } to { stroke-dashoffset: 0; } }
  .mv-ui .mv-campo, .mv-ui .mv-fila { animation: revela-svg .5s ease-out both; }
  .mv-ui .c0, .mv-ui .f0 { animation-delay: .2s; } .mv-ui .c1, .mv-ui .f1 { animation-delay: .5s; } .mv-ui .c2, .mv-ui .f2 { animation-delay: .8s; } .mv-ui .c3, .mv-ui .f3 { animation-delay: 1.1s; }
  @keyframes revela-svg { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

  .hf-haz { animation: hf-escanea 3.4s ease-in-out infinite; }
  @keyframes hf-escanea { 0% { translate: 0 -100%; opacity: 0; } 12%, 85% { opacity: 1; } 100% { translate: 0 0; opacity: 0; } }
  .mv-lamina::after { animation: brillo 7s ease-in-out 1.5s infinite; }
  @keyframes brillo { 0%, 55% { translate: -120% 0; } 100% { translate: 120% 0; } }
  .mc-contrato .firma path { stroke-dasharray: 1; animation: firma 5s ease-in-out infinite; }
  @keyframes firma { 0% { stroke-dashoffset: 1; } 35%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 1; } }
  .e-aro.a1 { animation: gira 60s linear infinite; } .e-aro.a2 { animation: gira 44s linear infinite reverse; }
  @keyframes gira { to { transform: rotate(360deg); } }
  .e-check { stroke-dasharray: 1; animation: firma 6s ease-in-out infinite; }
  .e-nodo { transform-box: fill-box; transform-origin: center; animation: pulso 3.4s ease-in-out infinite; }
  .e-nodo.n2 { animation-delay: -1.1s; } .e-nodo.n3 { animation-delay: -2.2s; }
  .fl-flecha { animation: avanza 2s ease-in-out infinite; }
  @keyframes avanza { 50% { translate: 4px 0; } }
  @media (max-width: 859px) { .fl-flecha { animation-name: avanza-v; } @keyframes avanza-v { 50% { translate: 0 4px; } } }
}


@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    @keyframes revela { from { opacity: 0; translate: 0 28px; } to { opacity: 1; translate: 0 0; } }
    @keyframes crece-v { from { transform: scaleY(.06); } to { transform: scaleY(1); } }
    .cabecera-seccion, .rejilla > *, .flujo > li, .api-panel, .galeria > figure, .factura-lectura, .pasos-visual > li, .marca-visual, .crm-visual, .razones > li, .pasos-lista > li, .seguridad > ul > li, .escudo, .faq details, .colab, .dos-col > div:first-child, .cta-final .contenedor > * {
      animation: revela linear both; animation-timeline: view(); animation-range: entry 0% entry 42%; }
    .rejilla > :nth-child(3n + 2), .razones > :nth-child(3n + 2) { animation-range: entry 6% entry 50%; }
    .rejilla > :nth-child(3n), .razones > :nth-child(3n) { animation-range: entry 12% entry 58%; }
    .comp .bn, .comp .ba { animation: crece-v linear both; animation-timeline: view(); animation-range: entry 8% cover 38%; }
  }
}

.lead-rejilla { display: grid; gap: 32px; align-items: start; }
@media (min-width: 900px) { .lead-rejilla { grid-template-columns: 1fr 1.1fr; gap: 56px; } }
.lead-form { display: grid; gap: 14px; background: #fff; border: 1px solid var(--linea); border-radius: 20px; padding: clamp(20px, 4vw, 32px); box-shadow: 0 24px 60px -30px rgba(11, 18, 32, .35); }
.lead-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lead-campo { display: grid; gap: 6px; }
.lead-campo label { font-weight: 700; font-size: .95rem; }
.lead-campo input, .lead-campo select { font: inherit; padding: 12px 14px; border: 1px solid #b9c1cc; border-radius: 10px; background: #fff; color: var(--texto); min-height: 48px; }
.lead-campo input:focus, .lead-campo select:focus { outline: 3px solid color-mix(in srgb, var(--acento) 40%, transparent); outline-offset: 1px; border-color: var(--acento); }
.lead-check { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; font-size: .9rem; color: var(--suave); }
.lead-check input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--acento); }
.lead-check [data-error], .lead-campo [data-error] { grid-column: 1 / -1; color: var(--error); font-weight: 600; font-size: .88rem; }
.lead-check [data-error]:empty, .lead-campo [data-error]:empty { display: none; }
[data-invalid] input, [data-invalid] select { border-color: var(--error); }
.lead-estado { min-height: 22px; font-weight: 600; }
.lead-estado[data-ok] { color: var(--ok); }
.lead-estado[data-err] { color: var(--error); }


/* =====================================================================================================================================================
   REDISEÑO PREMIUM (24-oct-2026). Paleta: azul marino #08182F, azul eléctrico #1688F7, azul claro #38BDF8, blanco y grises suaves.
   Fuentes autoalojadas (Inter y Sora): sin peticiones a terceros. Texto sobre claro con contraste AA (se usa #0b6fd6 para texto/botones, #1688F7 solo decorativo).
   ===================================================================================================================================================== */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 800; font-display: swap; src: url(/web/inter-latin.woff2) format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 600 800; font-display: swap; src: url(/web/sora-latin.woff2) format("woff2"); }
.inicio {
  --c-marino: #08182F; --c-marino-2: #0d2442; --c-elec: #1688F7; --c-azul: #0b6fd6; --c-azul-osc: #0959ae; --c-cian: #38BDF8; --c-suave: #F5F7FB; --c-linea: #dfe6f2;
  --c-texto: #0b1830; --c-muted: #51627f; --c-ok: #0f7a47;
  --fuente: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --f-titulo: "Sora", "Inter", system-ui, sans-serif;
  font-family: var(--fuente); color: var(--c-texto); background: #fff;
}
.inicio h1, .inicio h2, .inicio h3 { font-family: var(--f-titulo); letter-spacing: -.025em; }
.inicio .contenedor { width: min(1180px, 100% - 40px); }

/* franja superior y cabecera */
.inicio .banner { background: var(--c-marino); color: #cfe3fb; border-bottom: 1px solid rgba(255,255,255,.08); }
.inicio .banner b { color: #fff; }
.inicio .banner-enlace { color: var(--c-cian); }
.inicio .cabecera { background: rgba(255,255,255,.92); border-bottom: 1px solid var(--c-linea); }
.inicio .marca-icono { background: var(--c-marino); color: var(--c-cian); border-radius: 10px; font-family: var(--f-titulo); }
.inicio .marca { font-family: var(--f-titulo); color: var(--c-marino); }
.inicio .nav { gap: 6px; margin-left: 20px; }
.inicio .nav a { padding: 8px 10px; border-radius: 8px; font-size: .88rem; color: var(--c-muted); white-space: nowrap; }
.inicio .nav a:hover { color: var(--c-marino); background: var(--c-suave); }
.inicio .btn { border-radius: 12px; font-family: var(--fuente); }
.inicio .btn-primario { background: var(--c-azul); color: #fff; box-shadow: 0 10px 26px -12px rgba(22,136,247,.9); }
.inicio .btn-primario:hover { background: var(--c-azul-osc); }
.inicio .btn-secundario { background: #fff; border-color: #c5d0e4; color: var(--c-marino); }
.inicio .btn-fantasma { background: rgba(255,255,255,.08); border: 1.5px solid rgba(255,255,255,.3); color: #fff; }
.inicio .btn-fantasma:hover { background: rgba(255,255,255,.16); }
.inicio .cabecera .btn-fantasma { background: #fff; border-color: #c5d0e4; color: var(--c-marino); }
.inicio .btn-cta { text-transform: none; letter-spacing: 0; font-size: .95rem; }
.inicio .btn-grande { min-height: 54px; padding: 14px 26px; font-size: 1rem; }
.inicio .btn-blanco { background: #fff; color: var(--c-azul-osc); }

/* secciones */
.inicio .bloque { padding: clamp(60px, 8vw, 112px) 0; }
.inicio .bloque-claro { background: var(--c-suave); }
.inicio .bloque-oscuro { background: linear-gradient(180deg, var(--c-marino), #061225); color: #fff; }
.inicio .bloque-oscuro .cabecera-seccion p { color: #b9ccea; }
.inicio .cabecera-seccion { max-width: 760px; margin: 0 auto clamp(32px, 5vw, 56px); text-align: center; }
.inicio .cabecera-seccion h2 { font-size: clamp(1.8rem, 4.2vw, 2.9rem); font-weight: 800; margin-top: 10px; }
.inicio .cabecera-seccion p { margin-top: 14px; font-size: 1.1rem; color: var(--c-muted); }
.inicio .etiqueta { display: inline-block; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--c-azul); background: #e8f2ff; border-radius: 999px; padding: 6px 12px; }
.inicio .bloque-oscuro .etiqueta, .inicio .hero .etiqueta { background: rgba(56,189,248,.14); color: var(--c-cian); }
.inicio .resalte { font-style: normal; background: linear-gradient(100deg, var(--c-elec), var(--c-cian)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--c-elec); }
.inicio .centrado { text-align: center; margin-top: 40px; }
.inicio .pie-imagen { margin-top: 14px; font-size: .84rem; color: var(--c-muted); text-align: center; }
.inicio .bloque-oscuro .pie-imagen { color: #9fb6d8; }

/* hero */
.inicio .hero { position: relative; overflow: hidden; background: var(--c-marino); color: #fff; padding: clamp(44px, 6vw, 84px) 0 clamp(52px, 7vw, 100px); }
.inicio .hero::before, .inicio .hero::after { content: none; }
.inicio .hero-fondo { position: absolute; inset: 0; background: radial-gradient(700px 420px at 85% 0, rgba(22,136,247,.45), transparent 70%), radial-gradient(520px 360px at 0 100%, rgba(56,189,248,.18), transparent 70%), linear-gradient(180deg, #08182F, #061225); }
.inicio .hero-fondo::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 60px 60px; -webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%); mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%); }
.inicio .hero-rejilla { position: relative; display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.inicio .hero-texto { max-width: 560px; }
.inicio .hero h1 { margin-top: 18px; font-size: clamp(2rem, 3.9vw, 3.1rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; color: #fff; }
.inicio .hero .lead { margin-top: 20px; font-size: 1.15rem; color: #c3d6f2; }
.inicio .beneficios { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 10px; }
.inicio .beneficios li { display: flex; align-items: center; gap: 12px; font-weight: 600; color: #fff; }
.inicio .beneficios svg { flex: none; width: 36px; height: 36px; padding: 8px; border-radius: 10px; background: rgba(56,189,248,.16); fill: none; stroke: var(--c-cian); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.inicio .hero .botones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.inicio .hero-nota { margin-top: 18px; font-size: .86rem; color: #9fb6d8; }
.inicio .hero-escena { position: relative; min-height: 560px; }
.inicio .hero-escena .ventana { border-color: rgba(255,255,255,.14); box-shadow: 0 40px 90px -30px rgba(0,0,0,.7); }
.inicio .he-principal { position: absolute; left: 0; top: 0; width: 66%; z-index: 1; }
.inicio .he-principal .ampliar img { aspect-ratio: 4 / 3.3; object-fit: cover; object-position: top left; }
.inicio .he-tarifas { position: absolute; right: 0; top: 54px; width: 50%; z-index: 2; }
.inicio .he-tarifas .ampliar img { aspect-ratio: 4 / 3.6; object-fit: cover; object-position: top left; }
.inicio .he-lamina { position: absolute; left: 4%; bottom: 36px; width: 56%; z-index: 3; }
.inicio .he-lamina .ampliar img { aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; }
.inicio .he-pie { position: absolute; right: 0; bottom: -4px; margin: 0; width: 38%; text-align: right; color: #9fb6d8; }
@keyframes flota { 50% { transform: translateY(-8px); } }
.inicio .ampliar { display: block; cursor: zoom-in; }
.inicio .ampliar img { width: 100%; height: auto; display: block; }

/* proceso de 4 pasos */
.inicio .proceso { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(0, 1.3fr); gap: 28px; align-items: start; }
.inicio .proceso-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; position: relative; }
.inicio .paso-tab { width: 100%; text-align: left; display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: 16px; border: 1.5px solid var(--c-linea); background: #fff; color: var(--c-texto); font: inherit; cursor: pointer; transition: border-color .2s, box-shadow .2s, background .2s; }
.inicio .paso-tab:hover { border-color: #9cc5f2; }
.inicio .paso-tab b { display: block; font-family: var(--f-titulo); font-size: 1.02rem; }
.inicio .paso-tab small { display: block; margin-top: 4px; font-size: .88rem; color: var(--c-muted); line-height: 1.45; }
.inicio .paso-n { flex: none; width: 42px; height: 42px; border-radius: 12px; background: #e8f2ff; color: var(--c-azul); display: grid; place-items: center; font: 800 .95rem var(--f-titulo); }
.inicio .paso-tab.activo { border-color: var(--c-azul); background: #f3f8ff; box-shadow: 0 18px 38px -24px rgba(11,111,214,.8); }
.inicio .paso-tab.activo .paso-n { background: var(--c-azul); color: #fff; }
.inicio .proceso-vista { position: sticky; top: 90px; }
.inicio .pv { display: none; }
.inicio .pv.activo { display: block; }
.inicio .pv .ventana { box-shadow: 0 40px 80px -36px rgba(8,24,47,.5); }
.inicio .pv .ampliar img { max-height: 600px; object-fit: contain; object-position: top center; background: #f7f9fd; }
@keyframes aparece { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* problemas */
.inicio .problemas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.inicio .problemas li { background: #fff; border: 1px solid var(--c-linea); border-radius: 18px; padding: 20px 22px; display: grid; gap: 12px; }
.inicio .pr-antes, .inicio .pr-ahora { display: flex; gap: 10px; align-items: flex-start; }
.inicio .pr-antes { font-weight: 700; color: #8a2a3b; }
.inicio .pr-antes svg { flex: none; width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: #fde7ea; fill: none; stroke: #c43d52; stroke-width: 2.4; stroke-linecap: round; margin-top: 2px; }
.inicio .pr-ahora { color: var(--c-texto); }
.inicio .pr-ahora svg { flex: none; width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: #dff5ea; fill: none; stroke: var(--c-ok); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }

/* marca */
.inicio .marca-demo { max-width: 940px; margin: 0 auto; }
.inicio .marca-selector { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 22px; }
.inicio .marca-op { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 8px; border-radius: 14px; border: 1.5px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #fff; font: 700 .95rem var(--fuente); cursor: pointer; transition: all .2s; }
.inicio .marca-op:hover { background: rgba(255,255,255,.12); }
.inicio .marca-op.activo { border-color: var(--c-cian); background: rgba(56,189,248,.14); }
.inicio .mo-logo, .inicio .mf-logo { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; color: #fff; font: 800 1.1rem var(--f-titulo); flex: none; }
.inicio .mo-a { background: #0e7490; } .inicio .mo-b { background: #6d28d9; } .inicio .mo-c { background: #b45309; }
.inicio .marca-escena { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; }
.inicio .marca-estudio, .inicio .marca-programa { background: #fff; color: var(--c-texto); border-radius: 18px; padding: 20px; box-shadow: 0 30px 70px -36px rgba(0,0,0,.8); }
.inicio .me-etq { font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); margin-bottom: 12px; }
.inicio .mf-cab { display: flex; gap: 12px; align-items: center; }
.inicio .mf-cab b { display: block; font-family: var(--f-titulo); font-size: 1.1rem; }
.inicio .mf-cab small { color: var(--c-muted); }
.inicio .mf-contacto { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid var(--c-linea); display: grid; gap: 6px; font-size: .88rem; color: var(--c-muted); }
.inicio .mf-contacto li { display: flex; gap: 8px; align-items: center; }
.inicio .mf-contacto svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.inicio .me-cuerpo { margin-top: 16px; padding: 14px; border-radius: 14px; background: var(--c-suave); display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.inicio .me-ahorro small { display: block; font-size: .75rem; color: var(--c-muted); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.inicio .me-ahorro b { font: 800 1.9rem var(--f-titulo); color: var(--c-ok); }
.inicio .me-barras { display: grid; gap: 8px; }
.inicio .me-barras i { display: block; height: 12px; border-radius: 999px; background: #8f9db8; }
.inicio .me-barras i.b { width: 87.5%; background: #3f93e8; }
.inicio .marca-programa ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.inicio .marca-programa li { padding: 8px 12px; border-radius: 9px; font-size: .88rem; font-weight: 600; color: #3b4b66; background: #f3f6fb; }
.inicio .marca-programa li.act { color: #fff; }
.inicio .marca-demo[data-marca-activa="a"] .marca-programa li.act { background: #0e7490; }
.inicio .marca-demo[data-marca-activa="b"] .marca-programa li.act { background: #6d28d9; }
.inicio .marca-demo[data-marca-activa="c"] .marca-programa li.act { background: #b45309; }
.inicio .marca-demo[data-marca-activa="a"] .me-barras i.b { background: #0e7490; }
.inicio .marca-demo[data-marca-activa="b"] .me-barras i.b { background: #6d28d9; }
.inicio .marca-demo[data-marca-activa="c"] .me-barras i.b { background: #b45309; }
.inicio .marca-aviso { margin-top: 18px; text-align: center; font-size: .86rem; color: #9fb6d8; }
.inicio .marca-lista { list-style: none; margin: 34px auto 0; padding: 0; max-width: 760px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
.inicio .marca-lista li { display: flex; gap: 10px; align-items: flex-start; color: #dbe7fa; }
.inicio .marca-lista svg { flex: none; width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: rgba(56,189,248,.18); fill: none; stroke: var(--c-cian); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }

/* gana */
.inicio .api-aviso { margin-top: 20px; padding: 14px 16px; border-radius: 12px; background: rgba(255,255,255,.08); font-size: .9rem; color: #dbe7fa; }
.inicio .api-aviso b { color: #fff; }

/* cartera y equipo */
.inicio .cartera-rejilla { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 28px; align-items: center; }
.inicio .cartera-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.inicio .cartera-lista li { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--c-linea); border-radius: 16px; padding: 16px 18px; }
.inicio .cartera-lista h3 { font-size: 1rem; }
.inicio .cartera-lista p { margin-top: 4px; font-size: .92rem; color: var(--c-muted); }
.inicio .equipo { margin-top: 36px; display: grid; grid-template-columns: 1.3fr 1fr; gap: 24px; align-items: center; padding: 26px; border-radius: 20px; background: #fff; border: 1px solid var(--c-linea); }
.inicio .equipo h3 { font-size: 1.4rem; margin-top: 10px; }
.inicio .equipo p { margin-top: 8px; color: var(--c-muted); }
.inicio .equipo-roles { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.inicio .equipo-roles li { padding: 12px 14px; border-radius: 12px; background: var(--c-suave); }
.inicio .equipo-roles b { display: block; font-family: var(--f-titulo); }
.inicio .equipo-roles span { font-size: .9rem; color: var(--c-muted); }

/* herramientas */
.inicio details.mas { margin-top: 24px; text-align: center; }
.inicio details.mas summary { display: inline-block; cursor: pointer; font-weight: 700; color: var(--c-azul); padding: 12px 22px; border: 1.5px solid #bcd6f5; border-radius: 12px; list-style: none; }
.inicio details.mas summary::-webkit-details-marker { display: none; }
.inicio details.mas[open] summary { margin-bottom: 8px; }
.inicio details.mas .rejilla { text-align: left; }

/* cambio de CRM */
.inicio .cambio-rejilla { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 900px; margin: 0 auto; }
.inicio .cambio-col { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: 18px; padding: 24px; }
.inicio .cambio-col h3 { display: flex; gap: 10px; align-items: center; font-size: 1.15rem; margin-bottom: 14px; }
.inicio .cambio-col h3 svg { width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: rgba(56,189,248,.18); fill: none; stroke: var(--c-cian); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.inicio .cambio-col ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; color: #dbe7fa; }
.inicio .cambio-nota { margin-top: 18px; text-align: center; font-size: .9rem; color: #9fb6d8; }

/* planes */
.inicio .planes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 880px; margin: 0 auto; }
.inicio .plan { position: relative; display: grid; align-content: start; gap: 12px; padding: 28px; border: 1.5px solid var(--c-linea); border-radius: 22px; background: #fff; }
.inicio .plan-destacado { border-color: var(--c-azul); box-shadow: 0 30px 60px -34px rgba(11,111,214,.6); }
.inicio .plan-etq { position: absolute; top: -13px; left: 24px; background: var(--c-azul); color: #fff; font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.inicio .plan h3 { font-size: 1.4rem; }
.inicio .plan-resumen { color: var(--c-muted); }
.inicio .plan-precio { display: flex; align-items: baseline; gap: 6px; }
.inicio .plan-precio b { font: 800 2.6rem var(--f-titulo); letter-spacing: -.03em; }
.inicio .plan-precio span { color: var(--c-muted); font-weight: 600; }
.inicio .plan ul { list-style: none; margin: 4px 0 8px; padding: 0; display: grid; gap: 9px; }
.inicio .plan li { display: flex; gap: 10px; align-items: flex-start; font-size: .95rem; }
.inicio .plan li svg { flex: none; width: 20px; height: 20px; padding: 3px; border-radius: 50%; background: #dff5ea; fill: none; stroke: var(--c-ok); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }

/* seguridad, faq, prueba final */
.inicio .seg-cond { margin-top: 24px; text-align: center; font-weight: 600; color: var(--c-muted); }
.inicio .cta-final { background: linear-gradient(135deg, var(--c-marino), #0b2c57); color: #fff; padding: clamp(56px, 7vw, 96px) 0; text-align: center; }
.inicio .cta-final h2 { font-size: clamp(1.8rem, 4vw, 2.7rem); font-weight: 800; }
.inicio .cta-final p { margin: 14px auto 0; max-width: 40em; color: #c3d6f2; font-size: 1.08rem; }
.inicio .tres-pasos { list-style: none; margin: 28px auto 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.inicio .tres-pasos li { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); font-weight: 600; }
.inicio .tres-pasos b { width: 26px; height: 26px; border-radius: 50%; background: var(--c-cian); color: var(--c-marino); display: grid; place-items: center; font-size: .85rem; }
.inicio .cta-final .botones { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.inicio .btn-borde { background: transparent; border: 1.5px solid rgba(255,255,255,.4); color: #fff; }

/* formulario de contacto */
.inicio .lead-rejilla { display: grid; gap: 32px; align-items: start; }
@media (min-width: 900px) { .inicio .lead-rejilla { grid-template-columns: 1fr 1.1fr; gap: 56px; } }
.inicio .lead-rejilla h2 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); font-weight: 800; margin-top: 10px; }
.inicio .subtexto { margin-top: 12px; color: var(--c-muted); font-size: 1.05rem; }
.inicio .lead-form { display: grid; gap: 14px; background: #fff; border: 1px solid var(--c-linea); border-radius: 20px; padding: clamp(20px, 4vw, 32px); box-shadow: 0 30px 70px -40px rgba(8,24,47,.5); }
.inicio .lead-form select, .inicio .lead-form input[type=text], .inicio .lead-form input[type=email], .inicio .lead-form input[type=tel] { width: 100%; min-width: 0; }

/* pie y movimiento */
.inicio .pie { background: var(--c-marino); color: #b9ccea; border-top: 0; }
.inicio .pie a { color: #b9ccea; }
.inicio .pie a:hover { color: #fff; }
.inicio .pie b { color: #fff; font-family: var(--f-titulo); }

@media (max-width: 960px) {
  .inicio .hero-rejilla, .inicio .proceso, .inicio .cartera-rejilla, .inicio .equipo, .inicio .cambio-rejilla, .inicio .planes, .inicio .marca-escena { grid-template-columns: minmax(0, 1fr); }
  .inicio .hero-escena { min-height: 0; display: grid; gap: 14px; }
  .inicio .hero-escena > * { position: static; width: 100%; }
  .inicio .he-tarifas, .inicio .he-lamina { display: none; }
  .inicio .he-pie { text-align: center; max-width: none; }
  .inicio .proceso-vista { position: static; order: -1; }
  .inicio .problemas { grid-template-columns: 1fr; }
  .inicio .marca-lista { grid-template-columns: 1fr; }
}
@media (max-width: 560px) { .inicio .paso-tab small { display: none; } }

/* menu: 8 enlaces caben solo en pantallas anchas; por debajo, menu desplegable */
.inicio .nav { display: none; }
@media (min-width: 1300px) { .inicio .nav { display: flex; } .inicio .menu-movil { display: none; } }
@media (min-width: 900px) and (max-width: 1299px) { .inicio .menu-movil { display: block; } }

@media (prefers-reduced-motion: no-preference) {
  .inicio .he-tarifas { animation: flota 7s ease-in-out infinite; }
  .inicio .he-lamina { animation: flota 8s ease-in-out -3s infinite; }
  .inicio .pv.activo { animation: aparece .4s ease; }
}
.inicio .marca { flex: none; }
.inicio .marca-nombre { overflow: visible; text-overflow: clip; }
.inicio .api-aviso { grid-column: 1 / -1; }
.inicio .nav a { font-size: .85rem; padding: 8px 8px; }
.inicio .menu-movil summary { color: var(--c-marino); border-color: #c5d0e4; background: #fff; }
.inicio .menu-movil[open] summary { border-color: var(--c-azul); background: #eef5ff; }
.inicio .menu-movil .lista { background: #fff; border-bottom: 1px solid var(--c-linea); box-shadow: 0 24px 40px -24px rgba(8,24,47,.4); }
.inicio .menu-movil .lista a { color: var(--c-marino); border-bottom: 1px solid var(--c-linea); }