/* detectIA — portada pública. Sin recursos externos, sin estilos en línea. */
@font-face { font-family: "PJS"; src: url("../fonts/pjs-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "PJS"; src: url("../fonts/pjs-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "PJS"; src: url("../fonts/pjs-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }

:root {
  --ink: #05070d; --ink-2: #0b111f; --ink-3: #111a2e; --rule: #1d2a45; --rule-2: #2e4068;
  --paper: #f1f0e8; --paper-2: #e4e2d6; --blue: #1f44d6; --blue-2: #2f6bff; --cyan: #2ad4ff; --lime: #b6ff3c; --red: #ff4d6d; --amber: #ffb020;
  --font: "PJS", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --pad: clamp(18px, 5vw, 72px); --max: 1240px; --ease: cubic-bezier(.2, .7, .1, 1);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: 66px; -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--ink); color: #b9c6dc; font: 400 1.0625rem/1.6 var(--font); -webkit-font-smoothing: antialiased; }
img, svg, video, canvas { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-weight: 800; letter-spacing: -0.035em; line-height: 1.02; }
h2 { font-size: clamp(2.1rem, 6vw, 4.4rem); }
h3 { font-size: 1.3rem; letter-spacing: -0.02em; line-height: 1.2; }
p { margin: 0; } ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid var(--focus, var(--lime)); outline-offset: 3px; border-radius: 6px; }
::selection { background: var(--lime); color: var(--ink); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: fixed; left: 12px; top: -80px; z-index: 100; background: var(--lime); color: var(--ink); padding: 12px 16px; border-radius: 10px; font-weight: 800; text-decoration: none; transition: top .2s; }
.skip:focus { top: 12px; }
.progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 70; pointer-events: none; }
.progress i { display: block; height: 100%; transform: scaleX(0); transform-origin: 0 50%; background: linear-gradient(90deg, var(--blue-2), var(--cyan), var(--lime)); }

/* Entrada al hacer scroll: solo si el JavaScript ha arrancado (clase «js» en <html>) */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }

/* ---------- Paletas de bloque ---------- */
.ink { background: var(--ink); color: #b9c6dc; --h: #eef4ff; --muted: #7f90ac; --line: var(--rule); --accent: var(--lime); --focus: var(--lime); color-scheme: dark; }
.paper { background: var(--paper); color: #333c4d; --h: var(--ink); --muted: #5a6474; --line: #cfcdbf; --accent: var(--blue); --focus: var(--blue); color-scheme: light; }
.blue { background: var(--blue); color: #dbe5ff; --h: #fff; --muted: #b9c8f5; --line: rgb(255 255 255 / .22); --accent: var(--lime); --focus: #fff; color-scheme: dark; }
.lime { background: var(--lime); color: #1c2610; --h: var(--ink); --muted: #33431b; --line: rgb(5 7 13 / .2); --accent: var(--ink); --focus: var(--ink); color-scheme: light; }
.ink h1, .ink h2, .ink h3, .paper h2, .paper h3, .blue h2, .blue h3, .lime h2, .lime h3 { color: var(--h); }

/* ---------- Cabecera ---------- */
.top { background: var(--ink); position: fixed; inset: 0 0 auto 0; z-index: 50; display: flex; align-items: center; gap: 24px; padding: 14px var(--pad); border-bottom: 1px solid transparent; transition: border-color .3s, padding .3s; --focus: var(--lime); }
.js .top:not(.stuck) { background: transparent; }
.top.stuck { background: var(--ink); border-color: var(--rule); padding-block: 8px; }
.logo { display: flex; align-items: center; gap: 10px; min-height: 44px; text-decoration: none; color: #fff; font-weight: 800; font-size: 1.35rem; letter-spacing: -0.04em; }
.logo b { color: var(--cyan); font-weight: 800; }
.menu { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.menu a:not(.btn) { white-space: nowrap; padding: 11px 12px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .9375rem; color: #c9d5ea; transition: color .2s, background-color .2s; }
.menu a:not(.btn):hover { color: #fff; background: rgb(255 255 255 / .09); }
.menu .menu-cta { margin-left: 8px; }
@media (min-width: 901px) and (max-width: 1180px) { .menu .menu-cta { display: none; } .menu a:not(.btn) { padding: 11px 8px; font-size: .875rem; } .top { gap: 14px; } }
.top-actions { display: flex; align-items: center; gap: 10px; }
.burger { display: none; width: 46px; height: 46px; border-radius: 12px; border: 1px solid var(--rule-2); background: rgb(255 255 255 / .05); padding: 0; place-items: center; align-content: center; gap: 5px; }
.burger i { display: block; width: 18px; height: 2px; background: #fff; border-radius: 2px; transition: transform .25s, opacity .2s; }
.burger[aria-expanded="true"] i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] i:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.veil { position: fixed; inset: 0; z-index: 45; background: rgb(5 7 13 / .7); }

/* ---------- Botones ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border-radius: 999px; border: 2px solid transparent; font-weight: 800; font-size: 1rem; text-decoration: none; white-space: nowrap; transition: transform .2s var(--ease), background-color .2s, color .2s, border-color .2s, box-shadow .2s; }
.btn-main { background: var(--lime); color: var(--ink); }
.btn-main:hover { box-shadow: 0 0 0 7px rgb(182 255 60 / .2); }
.lime .btn-main, .paper .btn-main { background: var(--ink); color: #fff; } .lime .btn-main:hover, .paper .btn-main:hover { box-shadow: 0 0 0 7px rgb(5 7 13 / .14); }
.plan.featured .btn-main { background: var(--lime); color: var(--ink); }
.btn-ghost { color: #fff; border-color: var(--rule-2); background: rgb(255 255 255 / .04); } .btn-ghost:hover { border-color: var(--cyan); color: var(--cyan); }
.btn-line { color: #fff; border-color: var(--rule-2); min-height: 44px; padding: 0 18px; font-size: .9375rem; } .btn-line:hover { background: #fff; color: var(--ink); border-color: #fff; }
.btn-white { background: #fff; color: var(--ink); } .btn-white:hover { background: var(--ink); color: #fff; }
.btn-white-line { color: #fff; border-color: rgb(255 255 255 / .6); } .btn-white-line:hover { background: #fff; color: var(--blue); }
.btn-dark { background: var(--ink); color: #fff; } .btn-dark:hover { background: var(--blue); }
.btn[disabled] { opacity: .55; cursor: progress; }

/* ---------- Portada ---------- */
.hero { position: relative; min-height: 100svh; display: grid; align-items: center; padding: 92px var(--pad) 34px; overflow: hidden; isolation: isolate; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(60% 55% at 78% 42%, rgb(47 107 255 / .3), transparent 70%), radial-gradient(40% 40% at 10% 92%, rgb(182 255 60 / .1), transparent 70%); }
#radar { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.hero-in { width: min(100%, var(--max)); margin-inline: auto; display: grid; gap: clamp(10px, 2vh, 24px); }
/* Ficha de informe viva en la portada: el mismo lenguaje de papel y tinta que el expediente */
.ticket { display: none; }
@media (min-width: 1100px) {
  .hero-in { grid-template-columns: minmax(0, 1fr) minmax(330px, 410px); column-gap: clamp(28px, 4vw, 64px); align-items: center; }
  .hero-in > :not(.ticket) { grid-column: 1; }
  .hero-in .hero-title { font-size: clamp(2.4rem, min(5.1vw, 9.4vh), 5.6rem); }
  .hero-in > .hero-stats { grid-column: 1 / -1; grid-row: 5; max-width: none; margin-top: clamp(4px, 1.5vh, 16px); }
  .ticket { display: grid; grid-column: 2; grid-row: 1 / span 4; position: relative; background: #fbfaf5; color: var(--ink); border: 2px solid var(--ink);
    border-radius: 8px; box-shadow: 12px 12px 0 var(--lime); transform: rotate(2deg); }
  #radar { opacity: .55; -webkit-mask-image: linear-gradient(90deg, transparent 0 42%, #000 62%), linear-gradient(180deg, #000 58%, transparent 76%); -webkit-mask-composite: source-in;
    mask-image: linear-gradient(90deg, transparent 0 42%, #000 62%), linear-gradient(180deg, #000 58%, transparent 76%); mask-composite: intersect; }
}
.ticket-head { display: flex; justify-content: space-between; gap: 10px; padding: 11px 16px; border-bottom: 2px solid var(--ink); font: 600 .72rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.ticket-head span + span { color: var(--blue); }
.ticket-main { display: flex; align-items: center; gap: 16px; padding: 18px 16px 14px; }
.ticket-grade { width: 82px; height: 82px; flex: none; display: grid; place-items: center; border-radius: 18px; border: 2px solid var(--ink); background: var(--g); color: var(--ink); font: 800 3.4rem/1 var(--font); letter-spacing: -0.05em; transition: background-color .5s; }
.ticket-grade[data-grade="F"], .ticket-grade[data-grade="E"] { color: #fff; }
.ticket-grade.flip { animation: flip .5s var(--ease); }
@keyframes flip { 40% { transform: scale(.82) rotate(-6deg); } }
.ticket-score { font: 800 1.8rem/1 var(--font); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; } .ticket-score span { display: inline-block; min-width: 2ch; }
.ticket-sub { margin-top: 4px; font: 600 .78rem/1.3 var(--mono); color: #5a6474; }
.ticket-rows { border-top: 1px dashed #b9b6a4; }
.ticket-rows li { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px dashed #b9b6a4; font-size: .875rem; color: #333c4d; transition: color .4s; }
.ticket-rows i { width: 18px; height: 18px; flex: none; border-radius: 50%; background: var(--red); position: relative; transition: background-color .4s; }
.ticket-rows i::after { content: ""; position: absolute; left: 5px; top: 8px; width: 8px; height: 2px; background: #fff; }
.ticket-rows li[data-ok="1"] { color: #8a8f99; } .ticket-rows li[data-ok="1"] span { text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: #1c8a3a; }
.ticket-rows li[data-ok="1"] i { background: #1c8a3a; }
.ticket-rows li.info { color: #6b7280; } .ticket-rows li.info i { background: #9aa1ad; } .ticket-rows li.info i::after { left: 8px; top: 4px; width: 2px; height: 10px; }
.ticket-rows li[data-ok="1"] i::after { left: 6px; top: 3px; width: 5px; height: 9px; background: none; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ticket-foot { display: grid; gap: 7px; padding: 13px 16px 16px; font: 600 .72rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: #5a6474; }
.ticket-bar { height: 8px; border-radius: 99px; background: var(--paper-2); overflow: hidden; border: 1px solid var(--ink); }
.ticket-bar b { display: block; height: 100%; width: 100%; background: var(--blue); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease); }
.ticket-stamp { position: absolute; right: 18px; top: 68px; padding: 6px 12px; border: 3px solid #1c8a3a; border-radius: 8px; color: #1c8a3a; background: rgb(251 250 245 / .92); font: 800 .875rem/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; transform: rotate(-8deg) scale(1.5); opacity: 0; transition: transform .4s cubic-bezier(.2, 1.6, .4, 1), opacity .2s; }
.ticket.done .ticket-stamp { transform: rotate(-8deg); opacity: 1; }
.kicker { display: inline-flex; align-items: center; gap: 10px; justify-self: start; padding: 8px 12px; border: 2px solid var(--cyan); border-radius: 8px; font: 600 .78rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--cyan); background: rgb(5 7 13 / .6); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); flex: none; animation: ping 2.2s infinite; }
@keyframes ping { 0% { box-shadow: 0 0 0 0 rgb(182 255 60 / .7); } 70%, 100% { box-shadow: 0 0 0 11px rgb(182 255 60 / 0); } }
.hero-title { font-size: clamp(2.4rem, min(8.4vw, 10.2vh), 6.8rem); line-height: .95; letter-spacing: -0.055em; }
.hero-title .line { display: block; overflow: hidden; padding-bottom: .1em; margin-bottom: -.04em; white-space: nowrap; }
.hero-title .line > span { display: inline-block; animation: rise .9s var(--ease) both; }
.hero-title .line:nth-of-type(3) > span { animation-delay: .1s; } .hero-title .line:nth-of-type(4) > span { animation-delay: .2s; }
.hero-title .accent > span { color: transparent; background: linear-gradient(92deg, var(--cyan), var(--lime) 72%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding-right: .06em; }
@keyframes rise { from { transform: translateY(105%); } }
@keyframes fadeup { from { opacity: 0; transform: translateY(18px); } }
.a1, .a2, .a3, .a4 { animation: fadeup .8s var(--ease) both; } .a2 { animation-delay: .35s; } .a3 { animation-delay: .5s; } .a4 { animation-delay: .65s; }
.lead { max-width: 58ch; font-size: clamp(1rem, 1.5vw, 1.25rem); color: #c3cfe4; }
.cta { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--rule); max-width: 1000px; margin-top: 6px; }
.hero-stats li { padding: 14px 16px 0 0; display: grid; gap: 4px; align-content: start; }
.hero-stats li + li { padding-left: 16px; border-left: 1px solid var(--rule); }
.hero-stats b { font: 800 clamp(1.5rem, 3vw, 2.3rem)/1 var(--font); letter-spacing: -0.04em; color: #fff; font-variant-numeric: tabular-nums; }
.hero-stats span { font-size: .8438rem; color: #8d9db8; line-height: 1.35; }
.hero-src { font-size: .8125rem; color: #7f90ac; max-width: 80ch; }
@media (min-width: 1100px) { .hero-in > .hero-src { grid-column: 1 / -1; grid-row: 6; } }

/* ---------- Bloques ---------- */
.block { padding: clamp(64px, 10vw, 140px) var(--pad); position: relative; }
.block > * { width: min(100%, var(--max)); margin-inline: auto; }
.block-head { display: grid; gap: 16px; margin-bottom: clamp(30px, 5vw, 60px); }
.block-head > p:not(.idx) { max-width: 60ch; font-size: 1.125rem; }
.idx { font: 600 .8125rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.idx::before { content: ""; width: 34px; height: 3px; background: currentColor; }
.idx span { opacity: .55; }
.fine { margin-top: 22px; font-size: .875rem; color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }

/* ---------- 01 Expediente ---------- */
.dossier { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 60px); align-items: center; }
.dossier .block-head { margin: 0; } .dossier h2 { font-size: clamp(2rem, 4.6vw, 3.6rem); }
.file { position: relative; background: #fbfaf5; border: 2px solid var(--ink); border-radius: 6px; padding: 0 0 6px; box-shadow: 10px 10px 0 var(--ink); transform: rotate(-.6deg); }
.file-head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 18px; border-bottom: 2px solid var(--ink); font: 600 .75rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.file-rows li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: center; padding: 13px 18px; border-bottom: 1px dashed #b9b6a4; font-size: .9375rem; color: #333c4d; }
.redact { position: relative; justify-self: start; font: 600 .875rem/1.35 var(--mono); color: #a3122f; padding: 3px 6px; }
.redact::after { content: ""; position: absolute; inset: 0; background: var(--ink); transform-origin: 100% 50%; transition: transform .7s var(--ease); }
.file.in .redact::after { transform: scaleX(0); }
.file-rows li:nth-child(1) .redact::after { transition-delay: .5s; } .file-rows li:nth-child(2) .redact::after { transition-delay: .9s; } .file-rows li:nth-child(3) .redact::after { transition-delay: 1.3s; }
.file-rows li:nth-child(4) .redact::after { transition-delay: 1.7s; } .file-rows li:nth-child(5) .redact::after { transition-delay: 2.1s; } .file-rows li:nth-child(6) .redact::after { transition-delay: 2.5s; }
.stamp { position: absolute; right: 18px; bottom: -26px; padding: 9px 14px; border: 3px solid #c0142f; border-radius: 8px; color: #c0142f; background: rgb(251 250 245 / .9); font: 800 .875rem/1.15 var(--mono); letter-spacing: .08em; text-transform: uppercase; text-align: center; transform: rotate(-7deg) scale(1.6); opacity: 0; transition: transform .45s cubic-bezier(.2, 1.6, .4, 1) 3s, opacity .2s linear 3s; }
.file.in .stamp { transform: rotate(-7deg); opacity: 1; }
.file-foot { padding: 12px 190px 10px 18px; font-size: .8125rem; color: #5a6474; }

/* ---------- Cinta ---------- */
.tape { background: var(--lime); color: var(--ink); overflow: hidden; padding: 15px 0; border-block: 2px solid var(--ink); }
.tape-track { display: flex; width: max-content; animation: tape 50s linear infinite; }
.tape span { font: 800 clamp(1.05rem, 2.4vw, 1.7rem)/1 var(--font); letter-spacing: -0.03em; padding: 0 22px; white-space: nowrap; display: flex; align-items: center; gap: 44px; }
.tape span::after { content: ""; width: 11px; height: 11px; background: var(--ink); transform: rotate(45deg); }
@keyframes tape { to { transform: translateX(-50%); } }

/* ---------- 02 Tres miradas ---------- */
.looks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.look { position: relative; padding: 20px; border: 2px solid var(--ink); border-radius: 10px; background: #fbfaf5; color: #333c4d; box-shadow: 8px 8px 0 var(--blue-2); display: grid; gap: 12px; align-content: start; transition: border-color .3s, transform .4s var(--ease), opacity .8s var(--ease); }
.look:hover { transform: translate(-4px, -4px); box-shadow: 12px 12px 0 var(--lime); }
.look:nth-child(2) { box-shadow: 8px 8px 0 var(--cyan); } .look:nth-child(3) { box-shadow: 8px 8px 0 var(--lime); }
.look-art { margin-top: 10px; border-radius: 6px; background: radial-gradient(120% 120% at 50% 0%, rgb(47 107 255 / .18), transparent 70%), #070b16; border: 1px solid var(--rule); }
.look .num { font: 800 3.2rem/.85 var(--font); letter-spacing: -0.06em; color: transparent; -webkit-text-stroke: 2px var(--ink); margin-top: 8px; }
.look h3 { font-size: 1.7rem; } .ink .look h3 { color: var(--ink); }
.look::before { content: ""; position: absolute; top: -9px; left: 50%; width: 46px; height: 14px; margin-left: -23px; border-radius: 3px; background: #c9ccd3; border: 2px solid var(--ink); z-index: 2; }
.look ul { display: grid; gap: 6px; margin-top: 4px; font-size: .9375rem; color: var(--ink); }
.look li { padding-left: 22px; position: relative; }
.look li::before { content: ""; position: absolute; left: 0; top: .72em; width: 12px; height: 2px; background: var(--blue); }
.ring { transform-origin: 160px 100px; animation: breathe 3.4s ease-in-out infinite; } .ring.r2 { animation-delay: .6s; }
@keyframes breathe { 50% { transform: scale(1.08); opacity: .45; } }
.beam { transform-origin: 160px 100px; animation: spin 5s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.blip { animation: blink 2.4s infinite; } .blip.b2 { animation-delay: .8s; } .blip.b3 { animation-delay: 1.5s; }
@keyframes blink { 0%, 100% { opacity: .25; } 40% { opacity: 1; } }
.scanline { animation: scan 3.2s ease-in-out infinite; }
@keyframes scan { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(142px); } }
.trend { stroke-dasharray: 420; stroke-dashoffset: 420; } .in .trend { animation: draw 2.4s var(--ease) .3s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.pulse { transform-origin: 280px 44px; animation: pulse 1.8s infinite; }
@keyframes pulse { 50% { transform: scale(1.7); opacity: .35; } }

/* ---------- 03 Simulador ---------- */
.sim { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(260px, 1fr); grid-template-areas: "actions actions" "term side"; gap: 16px; }
.sim-actions { grid-area: actions; display: flex; flex-wrap: wrap; gap: 10px; }
.sim-term { grid-area: term; border: 2px solid var(--ink); border-radius: 18px; background: #04060b; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto; min-height: 400px; box-shadow: 10px 10px 0 var(--ink); color-scheme: dark; }
.sim-bar { display: flex; align-items: center; gap: 7px; padding: 12px 16px; border-bottom: 1px solid var(--rule); background: var(--ink-3); }
.sim-bar i { width: 11px; height: 11px; border-radius: 50%; background: var(--rule-2); }
.sim-bar span { margin-left: 10px; font: 600 .8125rem/1 var(--mono); color: #8d9db8; }
.sim-log { padding: 18px; font: 500 .875rem/1.75 var(--mono); color: #b9c6dc; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; }
.sim-log li { white-space: pre-wrap; overflow-wrap: anywhere; animation: line .35s var(--ease) both; }
@keyframes line { from { opacity: 0; transform: translateX(-8px); } }
.sim-log .muted { color: #8d9db8; } .sim-log .ok { color: var(--lime); } .sim-log .bad { color: #ff7a92; } .sim-log .warn { color: var(--amber); } .sim-log .info { color: var(--cyan); }
.sim-meter { height: 5px; background: var(--rule); }
.sim-meter i { display: block; height: 100%; transform: scaleX(0); transform-origin: 0 50%; background: var(--lime); transition: transform .5s linear; }
.sim-side { grid-area: side; border: 2px solid var(--ink); border-radius: 18px; background: var(--ink-2); padding: 24px; display: grid; gap: 12px; justify-items: center; text-align: center; align-content: center; box-shadow: 10px 10px 0 var(--ink); color: #b9c6dc; }
.grade { position: relative; width: 168px; height: 168px; display: grid; place-items: center; --g: var(--rule-2); }
.grade span { font: 800 5.4rem/1 var(--font); letter-spacing: -0.06em; color: var(--g); transition: color .5s, transform .5s var(--ease); }
.grade svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.grade circle { fill: none; stroke-width: 8; stroke: var(--rule); }
.grade circle + circle { stroke: var(--g); stroke-linecap: round; stroke-dasharray: 327; stroke-dashoffset: 327; transition: stroke-dashoffset 1.2s var(--ease), stroke .5s; }
[data-grade="A"] { --g: var(--lime); } [data-grade="B"] { --g: #7fe36a; } [data-grade="C"] { --g: var(--amber); } [data-grade="D"] { --g: #ff8a3d; } [data-grade="E"], [data-grade="F"] { --g: var(--red); }
.grade.pop span { transform: scale(1.14); }
.sim-score { font-size: 1.05rem; color: #8d9db8; } .sim-score b { color: #fff; font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.sim-counts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; font-size: .875rem; }
.sim-counts li { padding: 8px 10px; border-radius: 12px; border: 1px solid var(--rule); text-align: left; color: #8d9db8; }
.sim-counts b { color: #fff; font-variant-numeric: tabular-nums; margin-right: 4px; }
.c-crit b { color: #ff7a92; } .c-high b { color: #ff9a57; } .c-med b { color: var(--amber); } .c-low b { color: var(--cyan); }
.sim-note { font-size: .875rem; color: #8d9db8; min-height: 2.8em; }

/* ---------- 04 Funciones ---------- */
.bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px;
  grid-template-areas: "nota nota ia avisos" "norma prop pdf avisos" "emerg emerg prog evid" "equipo equipo evid2 evid2"; }
.a-nota { grid-area: nota; } .a-ia { grid-area: ia; } .a-avisos { grid-area: avisos; } .a-norma { grid-area: norma; } .a-prop { grid-area: prop; }
.a-pdf { grid-area: pdf; } .a-emerg { grid-area: emerg; } .a-prog { grid-area: prog; } .a-evid { grid-area: evid; } .a-equipo { grid-area: equipo; }
.bento { grid-template-areas: "nota nota ia avisos" "norma prop pdf avisos" "emerg emerg prog evid" "equipo equipo equipo equipo"; }
.cell.a-equipo { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; column-gap: 40px; min-height: 0; padding-block: 26px; } .cell.a-equipo h3, .cell.a-equipo p { grid-column: 1; } .cell.a-equipo .mini-team { grid-column: 2; grid-row: 1 / span 2; margin: 0; width: 100%; align-self: center; }
.cell { position: relative; padding: 22px; border-radius: 22px; border: 2px solid var(--ink); display: flex; flex-direction: column; gap: 10px; overflow: hidden; min-height: 200px; isolation: isolate; box-shadow: 6px 6px 0 var(--ink); transition: transform .3s var(--ease), box-shadow .3s var(--ease), opacity .8s var(--ease); }
.cell:hover { transform: translate(-3px, -3px); box-shadow: 9px 9px 0 var(--ink); }
.cell::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .35s; background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 50%), var(--glow, rgb(31 68 214 / .13)), transparent 62%); }
.cell:hover::before { opacity: 1; }
.cell p { font-size: .9688rem; }
.cell > * { min-width: 0; } .cell > :last-child:not(p) { margin-top: auto; }
.cell.a-equipo { display: grid; }
.c-white { background: #fbfaf5; color: #333c4d; } .c-white h3 { color: var(--ink); }
.c-ink { background: var(--ink); color: #b9c6dc; --glow: rgb(42 212 255 / .2); } .c-ink h3 { color: #fff; }
.c-blue { background: var(--blue); color: #dbe5ff; --glow: rgb(255 255 255 / .16); } .c-blue h3 { color: #fff; }
.c-lime { background: var(--lime); color: #1c2610; --glow: rgb(255 255 255 / .5); } .c-lime h3 { color: var(--ink); }
.grades { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.grades i { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 12px; font: 800 1.3rem/1 var(--font); font-style: normal; color: var(--ink); transform: translateY(14px); opacity: 0; transition: transform .6s var(--ease), opacity .6s; }
.in .grades i { transform: none; opacity: 1; }
.grades i:nth-child(2) { transition-delay: .07s; } .grades i:nth-child(3) { transition-delay: .14s; } .grades i:nth-child(4) { transition-delay: .21s; } .grades i:nth-child(5) { transition-delay: .28s; } .grades i:nth-child(6) { transition-delay: .35s; }
.gA { background: var(--lime); } .gB { background: #7fe36a; } .gC { background: var(--amber); } .gD { background: #ff8a3d; } .gE { background: var(--red); } .grades .gF { background: #b3122f; color: #fff; }
.typing { font: 600 .8438rem/1.5 var(--mono); color: var(--blue); margin-top: 4px; }
.typing span { opacity: 0; transform: translateY(6px); transition: opacity .6s var(--ease) .5s, transform .6s var(--ease) .5s; }
.typing span::after { content: ""; display: inline-block; width: .55em; height: 1.05em; margin-left: 3px; vertical-align: -.15em; background: var(--blue); animation: caret 1s step-end infinite; }
.in .typing span { opacity: 1; transform: none; }
@keyframes caret { 50% { opacity: 0; } }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.chips i { font: 600 .8125rem/1 var(--mono); font-style: normal; padding: 7px 10px; border-radius: 999px; border: 2px solid var(--ink); color: var(--ink); }
.mono-line { font: 600 .8125rem/1.5 var(--mono); color: #1c2610; overflow-wrap: anywhere; background: rgb(5 7 13 / .09); padding: 8px 10px; border-radius: 10px; margin-top: 4px; }
.channels { display: grid; gap: 6px; margin-top: 6px; }
.channels li { padding: 9px 12px; border-radius: 12px; border: 1px solid rgb(255 255 255 / .3); font-weight: 600; color: #fff; display: flex; align-items: center; gap: 10px; transform: translateX(-14px); opacity: 0; transition: transform .5s var(--ease), opacity .5s; }
.in .channels li { transform: none; opacity: 1; }
.channels li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); }
.channels li:nth-child(2) { transition-delay: .06s; } .channels li:nth-child(3) { transition-delay: .12s; } .channels li:nth-child(4) { transition-delay: .18s; } .channels li:nth-child(5) { transition-delay: .24s; } .channels li:nth-child(6) { transition-delay: .3s; } .channels li:nth-child(7) { transition-delay: .36s; }
.pulse-row { display: flex; gap: 5px; align-items: flex-end; height: 76px; flex: none; }

.pulse-row i { flex: 1; height: 100%; border-radius: 4px 4px 0 0; background: var(--rule-2); transform: scaleY(.3); transform-origin: 50% 100%; animation: bars 2.6s ease-in-out infinite; }
.pulse-row i:nth-child(3n) { animation-delay: .3s; } .pulse-row i:nth-child(3n+1) { animation-delay: .7s; } .pulse-row i:nth-child(5n) { animation-delay: 1.1s; }
.pulse-row i:nth-child(11) { background: var(--red); animation-name: spike; }
@keyframes bars { 50% { transform: scaleY(.62); } } @keyframes spike { 50% { transform: scaleY(1); } }
.mini-pdf { width: 92px; height: 116px; margin-top: 6px; background: #fff; border: 2px solid var(--ink); border-radius: 6px; padding: 9px; display: grid; gap: 6px; align-content: start; transform: rotate(-5deg); box-shadow: 4px 4px 0 var(--ink); }
.mini-pdf i { height: 7px; width: 55%; background: var(--blue); border-radius: 2px; }
.mini-pdf b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: var(--lime); color: var(--ink); font: 800 1.05rem/1 var(--font); }
.mini-pdf s { height: 5px; background: #cfcdbf; border-radius: 2px; } .mini-pdf s:last-child { width: 60%; }
.mini-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 6px; max-width: 190px; }
.mini-cal i { aspect-ratio: 1; border-radius: 5px; background: var(--paper-2); } .mini-cal i.on { background: var(--blue); animation: blink 2.6s infinite; }
.mini-code { font: 500 .78rem/1.6 var(--mono); background: var(--ink); color: #b9c6dc; padding: 10px 12px; border-radius: 10px; margin-top: 4px; overflow-wrap: anywhere; } .mini-code b { color: #ff7a92; font-weight: 600; }
.mini-team { display: flex; align-items: center; margin-top: 8px; }
.mini-team i { width: 40px; height: 40px; margin-right: -8px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--blue); border: 2px solid var(--blue); font: 800 .9rem/1 var(--font); font-style: normal; }
.mini-team i:last-of-type { background: var(--lime); color: var(--ink); font-size: .78rem; }
.mini-team span { flex: 1; height: 10px; margin-left: 24px; border-radius: 99px; background: rgb(255 255 255 / .25); overflow: hidden; }
.mini-team span b { display: block; height: 100%; width: 62%; background: var(--lime); border-radius: 99px; transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.4s var(--ease) .4s; }
.in .mini-team span b { transform: none; }

/* ---------- 05 Vídeo y detalles ---------- */
.frame { margin-block: 0; border: 1px solid var(--rule-2); border-radius: 22px; overflow: hidden; background: #04060b; }
.frame-bar { display: flex; align-items: center; gap: 7px; padding: 12px 16px; background: var(--ink-3); border-bottom: 1px solid var(--rule); }
.frame-bar i { width: 11px; height: 11px; border-radius: 50%; background: var(--rule-2); }
.frame-bar span { margin-inline: auto; font: 600 .8125rem/1 var(--mono); color: #8d9db8; padding: 6px 16px; border-radius: 999px; background: #04060b; }
.frame-media { position: relative; }
.frame video { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #04060b; }
.play { position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 20px 0 16px; border-radius: 999px; border: 2px solid var(--ink); background: var(--lime); color: var(--ink); font: 800 1rem/1 var(--font); box-shadow: 6px 6px 0 var(--ink); transition: transform .25s var(--ease), opacity .3s; }
.play small { font: 600 .8125rem/1 var(--mono); opacity: .7; }
.play:hover { transform: translate(-2px, -2px); }
.frame.playing .play { opacity: 0; pointer-events: none; }
.frame figcaption, .shot figcaption { padding: 10px 16px; font-size: .8438rem; color: #8d9db8; }
.shots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.shot { margin: 0; border: 1px solid var(--rule); border-radius: 16px; overflow: hidden; background: var(--ink-3); transition: transform .5s var(--ease), border-color .3s, opacity .8s var(--ease); }
.shot:hover { transform: translateY(-6px) rotate(-.6deg); border-color: var(--rule-2); }
.shot img { width: 100%; height: auto; }
.shot-img { position: relative; display: block; }
.shot-img::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 24%; background: linear-gradient(90deg, rgb(255 255 255 / 0), #fff 85%); pointer-events: none; }
.transcript { margin-top: 18px; border: 1px solid var(--rule); border-radius: 14px; padding: 0 18px; }
.transcript summary { cursor: pointer; padding: 14px 0; font-weight: 800; color: #eef4ff; min-height: 44px; }
.transcript ol { margin: 0 0 16px; padding-left: 20px; display: grid; gap: 6px; font-size: .9375rem; }
.nojs { margin-top: 18px; padding: 16px 18px; border-radius: 14px; background: rgb(5 7 13 / .35); color: #fff; }

/* ---------- 06 Comparativa ---------- */
.compare { border: 2px solid var(--ink); border-radius: 22px; background: #fbfaf5; overflow: hidden; box-shadow: 10px 10px 0 var(--ink); }
.compare table { width: 100%; border-collapse: collapse; }
.compare th, .compare td { padding: 15px 16px; text-align: center; border-bottom: 1px solid var(--line); }
.compare tr:last-child th, .compare tr:last-child td { border-bottom: 0; }
.compare thead th { font-size: .9375rem; color: var(--ink); vertical-align: bottom; line-height: 1.25; }
.compare thead small { display: block; font-weight: 400; color: var(--muted); font-size: .8125rem; margin-top: 2px; }
.compare tbody th { text-align: left; font-weight: 600; color: var(--ink); font-size: .9688rem; }
.compare .us { background: var(--ink); }
.compare thead .us { color: var(--lime); font-size: 1.2rem; }
.compare td.us { border-bottom-color: var(--rule); }
.v { display: inline-block; width: 22px; height: 22px; border-radius: 50%; vertical-align: middle; position: relative; flex: none; }
.v-si { background: #1c8a3a; } .us .v-si { background: var(--lime); }
.v-si::after { content: ""; position: absolute; left: 7px; top: 4px; width: 6px; height: 10px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); } .us .v-si::after { border-color: var(--ink); }
.v-parcial { border: 2px solid #9a6300; } .v-parcial::after { content: ""; position: absolute; inset: 0 50% 0 0; background: #9a6300; border-radius: 22px 0 0 22px; }
.v-no { border: 2px solid #8f95a3; } .v-no::after { content: ""; position: absolute; left: 4px; right: 4px; top: 8px; height: 2px; background: #6b7280; }

/* ---------- 07 Seguridad propia ---------- */
.vault-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.vault-grid .block-head { margin: 0; } .vault-grid h2 { font-size: clamp(1.9rem, 4.2vw, 3.3rem); line-height: 1.05; }
.vd { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 0; }
.vd-box { border: 2px solid var(--rule-2); border-radius: 18px; padding: 20px 10px; display: grid; gap: 4px; text-align: center; background: var(--ink-2); min-height: 150px; align-content: start; }
.vd-box b { color: #fff; font-size: 1.15rem; letter-spacing: -0.02em; } .vd-box span { font-size: .8438rem; color: #8d9db8; }
.vd-box em { white-space: nowrap; font: 600 clamp(.6rem, .78vw, .72rem)/1.3 var(--mono); font-style: normal; text-transform: uppercase; letter-spacing: .06em; margin-top: 8px; padding: 5px 8px; border-radius: 8px; justify-self: center; }
.vd-web { border-color: var(--blue-2); } .vd-web em { background: rgb(47 107 255 / .2); color: #9db8ff; }
.vd-db { border-style: dashed; } .vd-db em { background: rgb(255 255 255 / .08); color: #c9d5ea; }
.vd-motor { border-color: var(--lime); } .vd-motor em { background: rgb(182 255 60 / .16); color: var(--lime); }
.vd-link { width: clamp(22px, 4vw, 54px); height: 3px; background: repeating-linear-gradient(90deg, var(--cyan) 0 8px, transparent 8px 16px); background-size: 16px 3px; animation: dash 1s linear infinite; }
.vd-link-2 { background-image: repeating-linear-gradient(90deg, var(--lime) 0 8px, transparent 8px 16px); }
@keyframes dash { to { background-position: 16px 0; } }
.proofs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(30px, 5vw, 60px); border-top: 1px solid var(--rule); border-left: 1px solid var(--rule); }
.proofs li { padding: 22px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); display: grid; gap: 6px; align-content: start; }
.proofs b { color: #fff; font-size: 1.05rem; } .proofs span { font-size: .9375rem; }

/* ---------- 08 Planes ---------- */
.bill { display: inline-flex; padding: 5px; border-radius: 999px; background: var(--ink); justify-self: start; gap: 2px; }
.bill button { border: 0; background: none; color: #c9d5ea; padding: 10px 20px; border-radius: 999px; font-weight: 800; min-height: 46px; transition: background-color .25s, color .25s; display: inline-flex; align-items: center; gap: 8px; }
.bill button.on { background: #fff; color: var(--ink); }
.bill small { font: 600 .72rem/1 var(--mono); padding: 5px 8px; border-radius: 99px; background: var(--lime); color: var(--ink); letter-spacing: .02em; }
.plans { display: grid; gap: 16px; align-items: stretch; }
.plans-1 { grid-template-columns: minmax(0, 460px); } .plans-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .plans-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .plans-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.plan { position: relative; padding: 28px; border-radius: 26px; background: #fbfaf5; color: #333c4d; border: 2px solid var(--ink); display: grid; gap: 12px; align-content: start; grid-template-rows: auto auto auto auto auto 1fr auto; box-shadow: 8px 8px 0 var(--ink); transition: transform .35s var(--ease), box-shadow .35s var(--ease), opacity .8s var(--ease); }
.plan:hover { transform: translate(-4px, -4px); box-shadow: 12px 12px 0 var(--ink); }
.plan.featured { background: var(--ink); color: #b9c6dc; box-shadow: 8px 8px 0 var(--blue); --focus: var(--lime); } .plan.featured:hover { box-shadow: 12px 12px 0 var(--blue); }
.plan h3 { color: var(--ink); font-size: 1.6rem; } .plan.featured h3, .plan.featured .price b, .plan.featured .plan-limits b { color: #fff; }
.tag { position: absolute; top: -15px; left: 26px; background: var(--blue); color: #fff; font: 800 .75rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; padding: 8px 12px; border-radius: 999px; border: 2px solid var(--ink); }
.plan-desc { font-size: .9375rem; min-height: 3em; }
.price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.price b { font: 800 clamp(2.2rem, 3.6vw, 3rem)/1 var(--font); letter-spacing: -0.05em; color: var(--ink); font-variant-numeric: tabular-nums; }
.price b.swap { animation: fadeup .45s var(--ease); }
.price-eq { font: 600 .8125rem/1.3 var(--mono); min-height: 1.3em; color: #1c6b2e; margin-top: -6px; } .plan.featured .price-eq { color: var(--lime); }
.plan-limits { display: grid; gap: 4px; padding-block: 12px; border-block: 1px solid rgb(127 144 172 / .35); font-size: .9375rem; } .plan-limits b { color: var(--ink); }
.plan-features { display: grid; gap: 7px; font-size: .9375rem; align-content: start; }
.plan-features li { padding-left: 24px; position: relative; }
.plan-features li::before { content: ""; position: absolute; left: 2px; top: .38em; width: 6px; height: 11px; border: solid var(--blue); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.plan.featured .plan-features li::before { border-color: var(--lime); }
.plan .btn { width: 100%; }
.fine.dark { color: #33431b; } .plans-empty { font-size: 1.125rem; } .lime a:not(.btn) { color: var(--ink); font-weight: 600; }

/* ---------- 09 Preguntas ---------- */
.faq-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 4vw, 60px); align-items: start; }
.faq-wrap .block-head { margin: 0; position: sticky; top: 100px; }
.faq { border-top: 1px solid var(--rule); }
.faq details { border-bottom: 1px solid var(--rule); }
.faq summary { list-style: none; cursor: pointer; padding: 20px 46px 20px 0; position: relative; font: 800 clamp(1.05rem, 2vw, 1.35rem)/1.25 var(--font); letter-spacing: -0.02em; color: #eef4ff; transition: color .2s; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--lime); }
.faq summary::before, .faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 18px; height: 2.5px; margin-top: -1px; background: currentColor; border-radius: 2px; transition: transform .3s var(--ease); }
.faq summary::after { transform: rotate(90deg); } .faq details[open] summary::after { transform: rotate(0); }
.faq details p { padding: 0 46px 22px 0; max-width: 68ch; animation: line .4s var(--ease); }

/* ---------- Cierre y pie ---------- */
.end { padding: clamp(80px, 13vw, 170px) var(--pad); text-align: center; position: relative; overflow: hidden; }
.end-in { display: grid; gap: 22px; justify-items: center; position: relative; }
.end h2 { font-size: clamp(2.3rem, 7.6vw, 5.6rem); } .end em { font-style: normal; color: var(--lime); }
.end p { font-size: 1.125rem; } .end .cta { justify-content: center; }
.foot { padding: 30px var(--pad) calc(30px + env(safe-area-inset-bottom)); background: var(--ink); border-top: 1px solid var(--rule); display: flex; flex-wrap: wrap; gap: 14px 30px; justify-content: space-between; align-items: center; font-size: .875rem; color: #8d9db8; --focus: var(--lime); }
.foot b { color: #fff; } .foot p a { display: inline-block; padding-block: 12px; margin-block: -12px; } .foot nav { display: flex; flex-wrap: wrap; gap: 0 6px; } .foot nav a { padding: 12px 8px; display: inline-block; } .foot a:hover { color: var(--lime); }
.noscript { text-align: center; padding: 14px; font-size: .875rem; color: #8d9db8; background: var(--ink); }

/* ---------- Control de animaciones (dentro del menú) ---------- */
.motion { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 46px; height: 46px; margin-left: 6px; padding: 0; border-radius: 50%; background: none; color: #c9d5ea; border: 2px solid var(--rule-2); font: 600 .9375rem/1 var(--font); flex: none; }
.motion:hover { color: #fff; border-color: var(--cyan); }
.motion span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.motion .i-play { display: none; } .paused .motion .i-play { display: block; } .paused .motion .i-pause { display: none; }
html.paused *, html.paused *::before, html.paused *::after, .offscreen *, .offscreen *::before, .offscreen *::after { animation-play-state: paused !important; }
@media (min-width: 1380px) { .motion { width: auto; padding: 0 14px; border-radius: 999px; } .motion span { position: static; width: auto; height: auto; overflow: visible; clip-path: none; font-size: .875rem; } }

/* ---------- Adaptación ---------- */
@media (max-width: 1080px) {
  .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "nota nota" "ia avisos" "norma avisos" "prop pdf" "emerg emerg" "prog evid" "equipo equipo"; }
  .cell.a-equipo { grid-template-columns: minmax(0, 1fr); } .cell.a-equipo .mini-team { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .plans-3, .plans-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vault-grid, .dossier, .faq-wrap { grid-template-columns: 1fr; } .faq-wrap .block-head { position: static; }
}
@media (max-width: 900px) {
  .burger { display: grid; }
  .top-actions { margin-left: auto; }
  .menu { position: fixed; inset: 0 0 0 auto; width: min(330px, 88vw); margin: 0; padding: 88px 16px 24px; flex-direction: column; align-items: stretch; gap: 2px; background: var(--ink-2); border-left: 1px solid var(--rule); transform: translateX(104%); visibility: hidden; transition: transform .35s var(--ease), visibility 0s .35s; z-index: 48; overflow-y: auto; }
  .menu.open { transform: none; visibility: visible; transition: transform .35s var(--ease), visibility 0s; }
  .menu a:not(.btn) { padding: 15px 16px; font-size: 1.125rem; border-radius: 14px; }
  .menu .menu-cta { display: inline-flex; margin: 14px 0 0; }
  .top { z-index: 49; } .top .logo, .top .top-actions { position: relative; z-index: 49; }
  .top.menu-open { background: transparent; border-color: transparent; }
  .looks, .shots { grid-template-columns: 1fr; }
  .sim { grid-template-columns: 1fr; grid-template-areas: "actions" "term" "side"; }
  .sim-actions .btn { flex: 1 1 100%; }
  .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-stats li:nth-child(3) { padding-left: 0; border-left: 0; }
  .hero-stats li:nth-child(n+3) { border-top: 1px solid var(--rule); margin-top: 14px; }
  .proofs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sim-term { min-height: 340px; }
  #radar { opacity: .5; }
  .hero { min-height: 0; padding-top: 110px; }
  .motion { width: 100%; height: 50px; margin: 10px 0 0; border-radius: 999px; } .motion span { position: static; width: auto; height: auto; overflow: visible; clip-path: none; }
}
@media (max-width: 720px) {
  /* La tabla se convierte en fichas: cada característica con sus cuatro respuestas debajo */
  .compare { box-shadow: 6px 6px 0 var(--ink); }
  .compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .compare table, .compare tbody { display: block; }
  .compare tbody tr { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 2px solid var(--ink); }
  .compare tbody tr:last-child { border-bottom: 0; }
  .compare tbody th { grid-column: 1 / -1; padding: 14px 14px 8px; border-bottom: 0; }
  .compare td { padding: 8px 4px 12px; border-bottom: 0; display: grid; gap: 6px; justify-items: center; }
  .compare td::before { content: attr(data-col); font: 600 .66rem/1.2 var(--mono); letter-spacing: .02em; color: var(--muted); text-align: center; }
  .compare td.us::before { color: var(--lime); }
  .compare td.us { border-radius: 10px 10px 0 0; }
}
@media (max-width: 640px) {
  .bento { grid-template-columns: 1fr; grid-template-areas: "nota" "ia" "avisos" "norma" "prop" "pdf" "emerg" "prog" "evid" "equipo"; }
  .plans-2, .plans-3, .plans-4, .proofs { grid-template-columns: 1fr; }
  .cta .btn { width: 100%; }
  .play { left: 10px; bottom: 10px; min-height: 46px; padding: 0 14px 0 12px; font-size: .9375rem; box-shadow: 4px 4px 0 var(--ink); }
  .vd { grid-template-columns: 1fr; justify-items: stretch; }
  .vd-box { min-height: 0; } .vd-box em { font-size: .75rem; }
  .vd-link { width: 3px; height: 26px; justify-self: center; background: repeating-linear-gradient(180deg, var(--cyan) 0 8px, transparent 8px 16px); background-size: 3px 16px; animation-name: dashv; }
  .vd-link-2 { background-image: repeating-linear-gradient(180deg, var(--lime) 0 8px, transparent 8px 16px); }
  .file-rows li { grid-template-columns: 1fr; gap: 4px; }
  .file { transform: none; box-shadow: 6px 6px 0 var(--ink); margin-bottom: 26px; } .stamp { right: 10px; bottom: -30px; font-size: .75rem; } .file-foot { padding-right: 18px; padding-bottom: 34px; }
  .hero-title .line { white-space: normal; }
}
@keyframes dashv { to { background-position: 0 16px; } }
.compare-more { margin-top: 22px; }
@media (max-width: 720px) { .compare.short tbody tr:nth-child(n+6) { display: none; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; transition-delay: 0s !important; }
  .js .reveal { opacity: 1; transform: none; }
  .tape-track { animation: none; } .trend { stroke-dashoffset: 0; }
  .grades i, .channels li, .stamp { opacity: 1; transform: none; } .stamp { transform: rotate(-7deg); } .redact::after { transform: scaleX(0); }
  .typing span { opacity: 1; transform: none; }
  .motion { display: none; }
}

/* ---------- Sin JavaScript: todo el contenido a la vista ---------- */
html:not(.js) .redact::after { transform: scaleX(0); }
html:not(.js) .stamp { opacity: 1; transform: rotate(-7deg); }
html:not(.js) .grades i, html:not(.js) .channels li, html:not(.js) .typing span { opacity: 1; transform: none; }
html:not(.js) .trend { stroke-dashoffset: 0; }
html:not(.js) .mini-team span b { transform: none; }
html:not(.js) .ticket, html:not(.js) .sim, html:not(.js) .play, html:not(.js) .motion, html:not(.js) .bill { display: none; }
@media (min-width: 1100px) { html:not(.js) .hero-in { grid-template-columns: minmax(0, 1fr); } html:not(.js) .hero-in > .hero-src { grid-row: auto; } }
@media (max-width: 900px) {
  html:not(.js) .burger, html:not(.js) .menu .menu-cta { display: none; }
  html:not(.js) .top { position: relative; flex-wrap: wrap; row-gap: 6px; }
  html:not(.js) .menu { position: static; order: 3; width: 100%; padding: 0; margin: 0; flex-direction: row; flex-wrap: wrap; gap: 0; background: none; border: 0;
    transform: none; visibility: visible; overflow: visible; }
  html:not(.js) .menu a:not(.btn) { padding: 10px; font-size: .9375rem; }
  html:not(.js) .hero { padding-top: 32px; }
}

/* ---------- Confianza (configurable) ---------- */
.proof-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 3px solid var(--ink); border-bottom: 3px solid var(--ink); margin-bottom: clamp(28px, 4vw, 48px); }
.proof-stats li { padding: 22px 18px 20px 0; display: grid; gap: 6px; align-content: start; }
.proof-stats li + li { padding-left: 18px; border-left: 2px solid var(--ink); }
.proof-stats b { font: 800 clamp(2rem, 4.4vw, 3.6rem)/1 var(--font); letter-spacing: -0.05em; color: var(--ink); font-variant-numeric: tabular-nums; }
.proof-stats span { font-size: .9375rem; color: #1c2610; line-height: 1.35; }
.cases-note { font: 600 .78rem/1.4 var(--mono); letter-spacing: .04em; text-transform: uppercase; color: #33431b; margin-bottom: 14px; }
.cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.case { background: #fbfaf5; border: 2px solid var(--ink); border-radius: 10px; padding: 22px; display: flex; flex-direction: column; gap: 10px; box-shadow: 8px 8px 0 var(--ink); }
.case h3 { color: var(--ink); font-size: 1.25rem; } .case p { font-size: .9688rem; color: #333c4d; }
.case-result { margin-top: auto; align-self: flex-start; padding: 7px 12px; border-radius: 999px; background: var(--ink); color: var(--lime) !important; font: 600 .8125rem/1.2 var(--mono) !important; }
.end p strong { color: #fff; }
@media (max-width: 900px) { .proof-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .proof-stats li:nth-child(3) { padding-left: 0; border-left: 0; } .proof-stats li:nth-child(n+3) { border-top: 2px solid var(--ink); } .cases { grid-template-columns: 1fr; } }
.transcript-voice { margin: 0 0 14px; font-size: .9375rem; font-style: italic; color: #c9d4e8; }
#reel::cue { background: rgba(10, 18, 36, .82); color: #fff; font: 600 1rem/1.35 var(--font, sans-serif); }