/* Portada de AllSitesOK (k-*). Se carga solo en la portada, encima de app.css.
   Blanco y azul eléctrico, marino en las franjas oscuras, verde solo para OK
   y rojo solo para incidencias. Se anima transform, nunca opacity. */
@font-face { font-family: "Caveat"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("fonts/caveat-latin-wght-normal.woff2") format("woff2") }

.cab { background: rgba(255, 255, 255, .9) }
.cab .envoltura { min-height: 76px }
.ico-l { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: none }

.k-pastilla { display: inline-flex; align-items: center; gap: 8px; font: 600 .72rem var(--sans); letter-spacing: .09em; text-transform: uppercase;
  color: #3B5B8F; background: #EAF1FF; border: 1px solid #D6E3FF; border-radius: 6px; padding: 5px 11px; margin-bottom: 18px }
.k-pastilla::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--azul) }
.k-pastilla.oscura { background: rgba(11, 95, 255, .18); border-color: rgba(96, 150, 255, .35); color: #C7D8FF }
.k-pastilla.oscura::before { background: #5B9BFF }
.k-h2 { font-size: clamp(1.9rem, 3.4vw, 2.6rem); font-weight: 800; letter-spacing: -.04em; line-height: 1.08; color: var(--marino); margin: 0 0 18px }
.k-h2 span, .k-h2.azul { color: var(--azul) }
.k-parrafo { color: #475569; font-size: 1.05rem; max-width: 30em }
.k-parrafo b { color: var(--marino) }
.k-btn { min-height: 50px; padding: 0 24px; margin-top: 10px }
.k-seccion { padding: clamp(64px, 8vw, 104px) 0 }

/* ---------- analizador ---------- */
.k-analiza { display: flex; align-items: center; background: #fff; border: 1px solid #D5DEEC; border-radius: 10px; padding: 5px 5px 5px 16px;
  max-width: 540px; box-shadow: 0 14px 34px -14px rgba(11, 95, 255, .28) }
.k-analiza .ico-l { color: var(--azul); width: 20px; height: 20px }
.k-analiza input { flex: 1; min-width: 0; border: 0; box-shadow: none !important; background: transparent; min-height: 50px; font: 500 1rem var(--sans); padding: 0 12px }
.k-analiza .btn { min-height: 50px; padding: 0 22px; border-radius: 8px; font-size: .98rem }
.k-analiza:focus-within { border-color: var(--azul); box-shadow: 0 0 0 4px rgba(11, 95, 255, .15) }
@media (max-width: 480px) {
  .k-analiza { flex-wrap: wrap; padding: 6px }
  .k-analiza .ico-l { margin-left: 8px }
  .k-analiza .btn { flex: 1 1 100% }
}
.k-checks { list-style: none; padding: 0; margin: 20px 0 0; display: flex; flex-wrap: wrap; gap: 8px 26px; font-size: .9rem; color: #475569 }
.k-checks li { display: inline-flex; align-items: center; gap: 8px }
.k-checks li::before { content: ""; width: 14px; height: 14px; flex: none;
  background: no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4L16 6' fill='none' stroke='%230B5FFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }

/* ---------- héroe ---------- */
.k-heroe { position: relative; overflow: hidden; padding: clamp(48px, 7vw, 88px) 0 clamp(56px, 7vw, 88px);
  background: radial-gradient(55% 80% at 88% 20%, #DCE8FF 0%, rgba(220, 232, 255, 0) 70%), radial-gradient(40% 50% at 0% 100%, #EEF4FF 0%, rgba(238, 244, 255, 0) 70%), #FAFCFF }
.k-heroe::after { content: ""; position: absolute; right: -8%; top: -10%; width: 60%; height: 120%; pointer-events: none;
  background: repeating-radial-gradient(circle at 100% 0%, rgba(11, 95, 255, .06) 0 1px, transparent 1px 38px) }
.k-heroe-rej { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 56px; align-items: center }
@media (max-width: 980px) { .k-heroe-rej { grid-template-columns: minmax(0, 1fr); gap: 48px } }
.k-heroe h1 { font-size: clamp(2.3rem, 3.9vw, 3.4rem); font-weight: 800; letter-spacing: -.05em; line-height: 1.02; color: var(--marino); margin-bottom: 22px }
.k-heroe h1 span { display: block; color: var(--azul) }
@media (min-width: 981px) { .k-heroe h1 { white-space: nowrap } }
.k-entrada { font-size: 1.12rem; color: #475569; max-width: 26em; margin-bottom: 30px }

/* panel del héroe */
.k-dash-escena { position: relative; padding: 0 0 34px }
.k-dash { display: grid; grid-template-columns: 150px minmax(0, 1fr); background: #fff; border: 1px solid #E3EAF5; border-radius: 16px; overflow: hidden;
  box-shadow: 0 40px 80px -30px rgba(10, 31, 68, .35), 0 8px 20px -8px rgba(10, 31, 68, .08); font-size: .8rem }
.k-dash-lat { border-right: 1px solid #EDF1F7; padding: 18px 10px; display: flex; flex-direction: column; gap: 2px; color: #52627A }
.k-dash-logo { display: flex; align-items: center; gap: 6px; margin: 0 6px 18px }
.k-dash-logo svg { width: 20px; height: 20px }
.k-dash-logo .marca { font-size: .95rem }
.k-dash-lat > span:not(.k-dash-logo) { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 7px; font-weight: 500 }
.k-dash-lat .ico-l { width: 15px; height: 15px }
.k-dash-lat .act { background: #EEF4FF; color: var(--azul); font-weight: 600 }
.k-dash-main { position: relative; padding: 18px 20px 20px; min-width: 0 }
.k-anadir { position: absolute; top: 14px; right: 16px; background: var(--marino); color: #fff; font: 600 .72rem var(--sans); padding: 6px 11px; border-radius: 6px }
.k-dash-estado { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; align-items: center; margin: 30px 0 16px }
.k-ok-grande svg { width: 46px; height: 46px; display: block }
.k-ok-grande circle { fill: #22C55E; animation: k-ok 2.4s ease-out infinite }
.k-ok-grande path { fill: none; stroke: #fff; stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round }
@keyframes k-ok { 0% { filter: drop-shadow(0 0 0 rgba(34, 197, 94, .6)) } 60% { filter: drop-shadow(0 0 10px rgba(34, 197, 94, .0)) } }
.k-dash-estado b { display: block; font-size: 1.25rem; font-weight: 700; letter-spacing: -.02em; color: var(--marino) }
.k-dash-estado small { color: #64748B; font-size: .74rem }
.k-fecha { grid-column: 1 / -1; grid-row: 1; font-size: .74rem; font-weight: 600; color: var(--marino); text-align: right; margin-bottom: 6px }
.k-fecha small { display: block; font-weight: 400; color: #64748B; font-variant-numeric: tabular-nums }
.k-dash-cifras { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px }
.k-dash-cifras div { border: 1px solid #E9EEF6; border-radius: 10px; padding: 12px 14px; background: #FBFCFE }
.k-dash-cifras b { display: block; font-size: 1.35rem; font-weight: 700; letter-spacing: -.03em; color: var(--marino); font-variant-numeric: tabular-nums }
.k-dash-cifras small { color: #64748B; font-size: .72rem }
.k-dash-tabla { width: 100%; border-collapse: collapse; border: 1px solid #E9EEF6; border-radius: 10px; overflow: hidden; font-variant-numeric: tabular-nums }
.k-dash-tabla th { text-align: left; font-weight: 600; color: #52627A; font-size: .72rem; padding: 9px 10px; background: #F7F9FC; border-bottom: 1px solid #E9EEF6 }
.k-dash-tabla td { padding: 9px 10px; border-top: 1px solid #F0F3F8; color: #1E293B; white-space: nowrap; transition: background .35s }
.k-dash-tabla tr.escanea td { background: #EEF4FF }
.k-dash-tabla td.cambia { color: var(--azul) }
.k-dash-tabla i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; vertical-align: 1px }
.k-dash-tabla i.p-ok { background: #22C55E; box-shadow: 0 0 0 3px #DCFCE7 }
.k-dash-tabla td:last-child { color: #15803D }
@media (max-width: 1180px) { .k-dash { grid-template-columns: minmax(0, 1fr) } .k-dash-lat { display: none } }
@media (max-width: 560px) {
  .k-dash-tabla th:nth-child(4), .k-dash-tabla td:nth-child(4) { display: none }
  .k-fecha { display: none }
  .k-dash-cifras b { font-size: 1.05rem }
  .k-dash-main { padding: 14px }
}
.k-flota { position: absolute; right: -14px; bottom: 0; display: flex; gap: 12px; align-items: center; background: #fff; border: 1px solid #E3EAF5; border-radius: 12px;
  padding: 12px 16px; box-shadow: 0 20px 40px -14px rgba(10, 31, 68, .3); font-size: .8rem; line-height: 1.35; color: #334155; max-width: 250px;
  animation: k-flotar 6s ease-in-out infinite }
.k-flota b { display: block; color: var(--marino) }
.k-flota-ico { width: 36px; height: 36px; border-radius: 10px; background: var(--azul); color: #fff; display: grid; place-items: center; flex: none }
.k-flota-ico .ico-l { width: 18px; height: 18px }
@keyframes k-flotar { 50% { transform: translateY(-8px) } }
@media (max-width: 1180px) { .k-flota { right: 10px } }

/* ---------- funciona con ---------- */
.k-con { padding: 40px 0 10px; background: #fff }
.k-mini { font: 600 .74rem var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #64748B; text-align: center; margin: 0 0 22px }
.k-con-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 28px }
.k-con-lista li { font-size: 1.3rem; font-weight: 700; letter-spacing: -.03em; color: #64748B }
@media (max-width: 700px) { .k-con-lista { justify-content: center } .k-con-lista li { font-size: 1.05rem } }

/* ---------- iconos ---------- */
.k-vigila { padding: 48px 0 24px; background: #fff }
.k-iconos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 24px 12px; text-align: center }
@media (max-width: 1000px) { .k-iconos { grid-template-columns: repeat(4, minmax(0, 1fr)) } }
@media (max-width: 480px) { .k-iconos { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
.k-iconos li { display: flex; flex-direction: column; align-items: center; gap: 4px }
.k-iconos .ico-l { width: 62px; height: 62px; padding: 19px; border-radius: 50%; background: #EEF4FF; color: var(--azul); margin-bottom: 12px; stroke-width: 2.1;
  transition: transform .9s cubic-bezier(.2, .7, .2, 1), background .25s }
.k-iconos li:hover .ico-l { background: #DCE8FF }
.k-iconos b { font-size: .95rem; color: var(--marino) }
.k-iconos span { font-size: .8rem; color: #64748B; line-height: 1.4; max-width: 13em }

/* ---------- problema ---------- */
.k-prob-rej { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 56px; align-items: center }
@media (max-width: 980px) { .k-prob-rej { grid-template-columns: minmax(0, 1fr) } }
.k-ventanas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px }
@media (max-width: 560px) { .k-ventanas { grid-template-columns: minmax(0, 1fr) } }
.k-ventana { background: #fff; border: 1px solid #E3EAF5; border-radius: 12px; box-shadow: 0 20px 40px -24px rgba(10, 31, 68, .3); overflow: hidden;
  display: flex; flex-direction: column; gap: 12px; padding: 0 14px 16px }
.k-v-barra { display: flex; gap: 6px; padding: 12px 0 10px; margin: 0 -14px; padding-left: 14px; border-bottom: 1px solid #EEF2F7; background: #F8FAFD }
.k-v-barra i { width: 9px; height: 9px; border-radius: 50%; background: #F87171 }
.k-v-barra i:nth-child(2) { background: #FBBF24 } .k-v-barra i:nth-child(3) { background: #34D399 }
.k-v-url { display: flex; align-items: center; gap: 8px; font-size: .82rem; color: #64748B; margin-top: 4px }
.k-v-url .ico-l { width: 15px; height: 15px }
.k-chip { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 9px; font-weight: 700; font-size: .92rem; line-height: 1.2 }
.k-chip::before { content: ""; width: 22px; height: 22px; border-radius: 50%; flex: none; background: no-repeat center/12px }
.k-chip.ok { background: #EBFBF1; color: #14532D; align-self: flex-start; padding-right: 16px }
.k-chip.ok::before { background-color: #16A34A; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4L16 6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.k-chip.mal { background: #FEF1F1; color: #B91C1C; border: 1px solid #FBD5D5; min-height: 64px }
.k-chip.mal::before { background-color: #DC2626; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 6l8 8M14 6l-8 8' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") }
.k-chip.av { background: #FFF6E8; color: #9A4A00; border: 1px solid #FBE3BF; min-height: 64px }
.k-chip.av::before { border-radius: 4px; background-color: transparent; width: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22L12 2Z' fill='%23F59E0B'/%3E%3Cpath d='M12 9v5M12 17.5v.5' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E"); background-size: 22px }
.k-esq { display: block; height: 8px; border-radius: 4px; background: #EEF2F7 }
.k-esq.corta { width: 60% }

/* ---------- alertas (oscura) ---------- */
.k-alertas { position: relative; overflow: hidden; color: #CBD5E1; padding: clamp(64px, 8vw, 96px) 0;
  background: radial-gradient(50% 70% at 50% 40%, rgba(11, 95, 255, .35) 0%, rgba(11, 95, 255, 0) 70%), linear-gradient(135deg, #061A3A 0%, #0A2A5E 100%) }
.k-alertas::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px); background-size: 48px 48px }
.k-al-rej { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr); gap: 40px; align-items: center }
@media (max-width: 1080px) { .k-al-rej { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) } .k-canales { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (max-width: 760px) { .k-al-rej { grid-template-columns: minmax(0, 1fr) } .k-canales { grid-template-columns: minmax(0, 1fr) } }
.k-alertas .k-h2 { color: #fff }
.k-alertas .k-parrafo { color: #CBD5E1 }
.k-btn-linea { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .6); min-height: 48px; margin-top: 10px }
.k-btn-linea:hover { background: rgba(255, 255, 255, .1); color: #fff }
.k-alertas :focus-visible { outline-color: #fff }
.k-telefono-escena { perspective: 1400px; display: grid; place-items: center; padding: 10px 0 }
.k-telefono { width: 280px; border-radius: 44px; padding: 14px 14px 80px; border: 9px solid #0B1120;
  background: radial-gradient(80% 60% at 50% 20%, #3B6FD8 0%, #16307A 45%, #0B1638 100%);
  box-shadow: 0 50px 90px -30px rgba(0, 0, 0, .7), 0 0 0 1px #2A3B5C, inset 0 0 0 1px rgba(255, 255, 255, .06);
  transform: rotateY(-16deg) rotateX(8deg) rotateZ(6deg); transition: transform .9s cubic-bezier(.2, .7, .2, 1) }
.k-telefono.sube { transform: rotateY(-16deg) rotateX(8deg) rotateZ(6deg) translateY(32px) }
.k-telefono.sube.visto { transform: rotateY(-16deg) rotateX(8deg) rotateZ(6deg) }
.k-tel-cab { display: flex; justify-content: space-between; align-items: center; color: #fff; font: 600 .72rem var(--sans); padding: 0 8px }
.k-isla { width: 78px; height: 22px; background: #0B1120; border-radius: 12px }
.k-tel-candado { display: grid; place-items: center; color: #fff; margin: 14px 0 4px }
.k-tel-candado .ico-l { width: 16px; height: 16px }
.k-tel-hora { text-align: center; color: #fff; font: 300 3.8rem/1 var(--sans); letter-spacing: -.03em; margin-bottom: 26px }
.k-tel-hora small { display: block; font: 500 .78rem var(--sans); letter-spacing: 0; color: #DCE6FF; margin-top: 6px }
.k-noti { display: flex; gap: 10px; background: rgba(255, 255, 255, .88); backdrop-filter: blur(10px); border-radius: 16px; padding: 11px 12px; margin-bottom: 9px;
  font-size: .76rem; line-height: 1.35; color: #1E293B; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .5) }
.k-noti b { display: block; font-size: .74rem; color: #0F172A }
.k-noti strong { font-weight: 700 }
.k-noti small { display: block; color: #52627A; font-style: italic; margin-top: 2px }
.k-noti-ico { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; flex: none; color: #fff; font: 800 .8rem var(--sans) }
.k-noti.mal .k-noti-ico { background: #DC2626 } .k-noti.ok .k-noti-ico { background: #16A34A }
.k-noti.mal { animation: k-noti 5s ease-in-out infinite }
@keyframes k-noti { 0%, 70%, 100% { transform: none } 76% { transform: translateX(-3px) } 82% { transform: translateX(3px) } 88% { transform: translateX(-2px) } }
.k-canales { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px }
.k-canales li { display: flex; gap: 14px; align-items: center; font-size: .86rem; color: #B8C6DD }
.k-canales li > span { width: 42px; height: 42px; border-radius: 10px; background: var(--azul); color: #fff; display: grid; place-items: center; flex: none;
  box-shadow: 0 8px 20px -6px rgba(11, 95, 255, .7) }
.k-canales b { display: block; color: #fff; font-size: .98rem }

/* ---------- pasos ---------- */
.k-pasos { list-style: none; margin: 34px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px }
@media (max-width: 980px) { .k-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (max-width: 520px) { .k-pasos { grid-template-columns: minmax(0, 1fr) } }
.k-pasos li { display: flex; gap: 16px; align-items: flex-start; font-size: .9rem; color: #52627A }
.k-pasos li > span { width: 52px; height: 52px; border-radius: 50%; background: #EEF4FF; color: var(--azul); display: grid; place-items: center; flex: none }
.k-pasos b { display: block; color: var(--marino); font-size: 1rem; margin: 4px 0 4px }

/* ---------- precio ---------- */
.k-precio { padding-top: 24px }
.k-precio-rej { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center }
@media (max-width: 1000px) { .k-precio-rej { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) } .k-precio-rej > div:first-child { grid-column: 1 / -1 } }
@media (max-width: 640px) { .k-precio-rej { grid-template-columns: minmax(0, 1fr) } }
.k-precio .k-h2 { font-size: clamp(2rem, 3.6vw, 2.8rem) }
.k-precio .k-h2 span { display: block; font-size: 1.2em }
.k-plan { background: #fff; border: 1px solid #E3EAF5; border-radius: 16px; padding: 30px; box-shadow: 0 30px 60px -30px rgba(10, 31, 68, .3) }
.k-plan-logo { display: flex; align-items: center; gap: 7px }
.k-plan-logo svg { width: 22px; height: 22px }
.k-plan-logo .marca { font-size: 1rem }
.k-plan-precio { font: 800 3rem/1 var(--sans); letter-spacing: -.05em; color: var(--marino); margin: 22px 0 22px; display: flex; align-items: baseline; gap: 10px }
.k-plan-precio small { font-size: .85rem; font-weight: 500; letter-spacing: 0; color: #64748B }
.k-plan ul, .k-agencias ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; font-size: .92rem; color: #1E293B }
.k-plan li, .k-agencias li { padding-left: 26px; position: relative }
.k-plan li::before, .k-agencias li::before { content: ""; position: absolute; left: 0; top: 4px; width: 15px; height: 15px;
  background: no-repeat center/15px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4L16 6' fill='none' stroke='%2316A34A' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.k-agencias li::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4L16 6' fill='none' stroke='%230B5FFF' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.k-plan-nota { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid #EEF2F7; font-size: .8rem; color: #64748B }
.k-agencias { background: linear-gradient(160deg, #EEF4FF, #F6F9FF); border: 1px solid #DCE6F8; border-radius: 16px; padding: 30px }
.k-agencias > small { display: block; color: #52627A; font-size: .9rem }
.k-agencias > b { display: block; font-size: 1.15rem; color: var(--marino); margin: 4px 0 20px }
.k-agencias ul { margin-bottom: 26px; color: #334155 }
.k-btn-azul { color: var(--azul); border-color: var(--azul); background: #fff; min-height: 48px; width: 100% }
.k-btn-azul:hover { color: #fff; background: var(--azul); border-color: var(--azul) }

/* ---------- confianza ---------- */
.k-confianza { padding-top: 24px }
.k-tarjetas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 30px }
@media (max-width: 900px) { .k-tarjetas { grid-template-columns: minmax(0, 1fr) } }
.k-tarjetas figure { margin: 0; background: #fff; border: 1px solid #E3EAF5; border-radius: 14px; padding: 26px; box-shadow: 0 20px 40px -30px rgba(10, 31, 68, .35);
  display: flex; flex-direction: column; justify-content: space-between; gap: 22px }
.k-tarjetas blockquote { margin: 0; font-size: 1rem; line-height: 1.55; color: #1E293B }
.k-tarjetas figcaption { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 12px; font-size: .82rem; color: #64748B; align-items: center }
.k-tarjetas figcaption .ico-l { grid-row: span 2; width: 38px; height: 38px; padding: 9px; border-radius: 50%; background: #EEF4FF; color: var(--azul) }
.k-tarjetas figcaption b { color: var(--marino); font-size: .92rem }

/* ---------- FAQ ---------- */
.k-faq-sec { padding-top: 24px }
.k-faq-rej { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 56px; align-items: start }
@media (max-width: 860px) { .k-faq-rej { grid-template-columns: minmax(0, 1fr); gap: 20px } }
.k-faq details { border-bottom: 1px solid #E3EAF5 }
.k-faq details:first-child { border-top: 1px solid #E3EAF5 }
.k-faq summary { cursor: pointer; list-style: none; padding: 19px 40px 19px 0; font-weight: 600; color: var(--marino); position: relative }
.k-faq summary::-webkit-details-marker { display: none }
.k-faq summary::after { content: "+"; position: absolute; right: 6px; top: 15px; font: 400 1.5rem/1 var(--sans); color: var(--azul) }
.k-faq details[open] summary::after { content: "–" }
.k-faq details p { color: #475569; margin: -4px 0 20px }

/* ---------- CTA final ---------- */
.k-final { position: relative; overflow: hidden; padding: clamp(72px, 9vw, 112px) 0; color: #CBD5E1;
  background: radial-gradient(60% 90% at 50% 0%, #0E3A86 0%, rgba(14, 58, 134, 0) 70%), linear-gradient(180deg, #071D44 0%, #061634 100%) }
.k-globo { position: absolute; left: -110px; bottom: -150px; width: 440px; height: 440px; pointer-events: none; animation: k-girar 60s linear infinite }
.k-globo * { fill: none; stroke: #3A7BFF; stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: .1 9 }
.k-globo circle { stroke-dasharray: none; stroke: rgba(58, 123, 255, .35); stroke-width: 1.4 }
@keyframes k-girar { to { transform: rotate(360deg) } }
.k-final-in { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center }
.k-final h2 { color: #fff; font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; letter-spacing: -.05em; margin: 0 0 10px }
.k-final h2 span { color: #4D8DFF }
.k-final p { font-size: 1.1rem; margin: 0 0 28px; color: #DCE6FF }
.k-final .k-analiza { width: 100%; max-width: 620px; box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .6) }
.k-final .k-checks { justify-content: center; color: #CBD5E1 }
.k-final .k-checks li::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4L16 6' fill='none' stroke='%237FB0FF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.k-final :focus-visible { outline-color: #fff }
.k-firma { position: absolute; right: max(24px, calc((100% - 1160px) / 2)); bottom: 70px; font: 600 1.7rem/1.05 "Caveat", cursive; color: #E2E8F0; transform: rotate(-8deg) }
.k-firma svg { display: block; width: 110px; height: 55px; margin: 6px 0 0 -30px; fill: none; stroke: #E2E8F0; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round }
@media (max-width: 1100px) { .k-firma { display: none } }

/* entrada al hacer scroll (la clase .sube la pone el JS; solo transform) */
.k-iconos li, .k-ventana, .k-canales li, .k-pasos li, .k-plan, .k-agencias, .k-tarjetas figure { transition: transform .9s cubic-bezier(.2, .7, .2, 1) }

/* ---------- contacto ---------- */
.c-heroe { min-height: calc(100vh - 76px - 1px); display: flex; align-items: center }
.c-rej { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 56px; align-items: center }
@media (max-width: 900px) { .c-rej { grid-template-columns: minmax(0, 1fr) } }
.c-botones { display: flex; gap: 12px; flex-wrap: wrap }
.c-btn { min-height: 54px; padding: 0 24px; font-size: 1rem }
.c-btn .ico-l { width: 20px; height: 20px }
.btn.c-wa { background: #15803D; border-color: #15803D; color: #fff }
.btn.c-wa:hover { background: #166534; border-color: #166534; color: #fff }
.c-tarjetas { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px }
.c-tarjetas li { display: flex; gap: 16px; align-items: center; background: #fff; border: 1px solid #E3EAF5; border-radius: 14px; padding: 18px 20px;
  box-shadow: 0 20px 40px -32px rgba(10, 31, 68, .45) }
.c-tarjetas .ico-l { width: 46px; height: 46px; padding: 12px; border-radius: 12px; background: #EEF4FF; color: var(--azul) }
.c-tarjetas b { display: block; color: var(--marino) }
.c-tarjetas a, .c-tarjetas span { font-weight: 600; font-size: 1.05rem; text-decoration: none; overflow-wrap: anywhere }
.c-tarjetas span { color: #1E293B; font-weight: 500 }
.c-tarjetas small { display: block; color: #64748B; font-size: .82rem }

@media (prefers-reduced-motion: reduce) {
  .k-flota, .k-ok-grande circle, .k-noti.mal, .k-globo { animation: none }
}