/* ==========================================================================
   MedisimCR · home-v2.css — hoja de estilos AUTOCONTENIDA de la portada v2
   --------------------------------------------------------------------------
   Generada localmente a partir del prototipo aprobado 11-conversion-final-v2
   (design-prototypes-medisim/{shared,11-conversion-final-v2}), sin modificar su
   diseño visual. No depende de public_html/css/medisim.css ni lo sobreescribe:
   se sirve SOLO en templates/Pages/home_v2.php, detrás de MediSim.homeV2.enabled.
   Las familias tipográficas (Space Grotesk / Inter / JetBrains Mono) se cargan vía
   Google Fonts en el <head> de home_v2.php, igual que ya hace la home actual con
   Bricolage Grotesque / Atkinson Hyperlegible — no se auto-hospedan fuentes nuevas.
   ========================================================================== */

/* ---- shared/css/tokens.css (variables de diseño) ---- */
/* ==========================================================================
   MedisimCR · design tokens (variables centralizadas)
   --------------------------------------------------------------------------
   Base = marca actual de producción (public_html/css/medisim.css):
   ink #0E1B2C · teal #0F7C7A · mint #2ED3A0 · coral #FF5A5F · amber #F2A93B
   Cada diseño redefine SOLO lo que necesita en su :root (styles.css).
   Los componentes compartidos (components.css) leen únicamente estos tokens.
   ========================================================================== */


:root{
  /* Marca (producción) */
  --c-ink:#0E1B2C; --c-ink-2:#18304A; --c-ink-3:#22405C;
  --c-teal:#0F7C7A; --c-teal-d:#0A5E5C;
  --c-mint:#2ED3A0; --c-mint-bg:#E3F8F1;
  --c-coral:#FF5A5F; --c-coral-bg:#FFE9EA;
  --c-amber:#F2A93B; --c-amber-bg:#FFF4E0;

  /* Roles semánticos (los componentes usan SOLO estos) */
  --bg:#F3F7F9;            /* fondo de página */
  --bg-alt:#FFFFFF;        /* fondo de secciones alternas */
  --surface:#FFFFFF;       /* tarjetas */
  --surface-2:#EAF1F5;     /* tarjetas secundarias / inputs */
  --line:#DCE5EB;          /* bordes */
  --text:#14212E;          /* texto principal */
  --muted:#4F6272;         /* texto secundario (>=4.5:1 sobre --bg) */
  --heading:var(--c-ink);
  --accent:var(--c-teal);        /* color de acción/énfasis */
  --accent-strong:var(--c-teal-d);
  --on-accent:#FFFFFF;
  --cta:var(--c-mint);           /* fondo del CTA principal */
  --cta-hover:#25BD8E;
  --on-cta:var(--c-ink);
  --link:var(--c-teal-d);
  --ok:#0B6B4F;  --ok-bg:var(--c-mint-bg);
  --warn:#8A5A0B; --warn-bg:var(--c-amber-bg);
  --bad:#A62B2F;  --bad-bg:var(--c-coral-bg);
  --data-1:var(--c-teal); --data-2:var(--c-mint); --data-3:var(--c-amber); --data-4:var(--c-coral);
  --focus:var(--c-ink); --focus-ring:var(--c-mint);

  /* Semáforo de reportes (Fortaleza / Por reforzar / Oportunidad de mejora) */
  --lvl-strong:#12A57A; --lvl-mid:#E09A1F; --lvl-weak:#E5484D;

  /* Tipografía */
  --f-head:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --f-body:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --fs-body:1.0625rem;
  --fs-h1:clamp(2.1rem,5.2vw,3.75rem);
  --fs-h2:clamp(1.6rem,3.4vw,2.5rem);
  --fs-h3:1.2rem;
  --fs-lead:clamp(1.08rem,1.6vw,1.3rem);
  --lh-body:1.6; --ls-head:-.02em; --fw-head:800;

  /* Espaciado y forma */
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem; --sp-5:1.5rem; --sp-6:2rem; --sp-7:3rem; --sp-8:5rem;
  --section-y:clamp(3.5rem,8vw,6.5rem);
  --gutter:clamp(1rem,4vw,2rem);
  --maxw:1160px; --maxw-narrow:760px;
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(14,27,44,.06),0 4px 14px rgba(14,27,44,.06);
  --shadow-2:0 2px 4px rgba(14,27,44,.06),0 18px 44px rgba(14,27,44,.12);

  /* Movimiento */
  --dur:.25s; --ease:cubic-bezier(.2,.7,.2,1);

  /* Breakpoints (referencia; CSS no admite var() en @media):
     --bp-sm:480px · --bp-md:768px · --bp-lg:1024px · --bp-xl:1440px */
}

/* ---- shared/css/base.css (reset, tipografía base, utilidades) ---- */
/* MedisimCR · base.css — reset, tipografía, layout y accesibilidad. Sin estilos de marca propios: todo sale de tokens.css */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--bg);color:var(--text);font:var(--fs-body)/var(--lh-body) var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg,video{max-width:100%;height:auto}
img{display:block}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:var(--fw-head);letter-spacing:var(--ls-head);line-height:1.1;margin:0 0 .5em;color:var(--heading);text-wrap:balance}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3);line-height:1.25}
p{margin:0 0 1em} ul,ol{margin:0;padding:0}
a{color:var(--link);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;box-shadow:0 0 0 6px var(--focus-ring);border-radius:6px}
.skip-link{position:absolute;left:1rem;top:-4rem;background:var(--c-ink);color:#fff;padding:.7rem 1rem;border-radius:var(--r-sm);z-index:100;transition:top .15s}
.skip-link:focus{top:1rem}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0}
.wrap{width:min(var(--maxw),100% - 2*var(--gutter));margin-inline:auto}
.narrow{width:min(var(--maxw-narrow),100% - 2*var(--gutter));margin-inline:auto}
.section{padding-block:var(--section-y)}
.section.alt{background:var(--bg-alt)}
.eyebrow{display:inline-block;font:700 .8rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-strong);margin-bottom:1rem}
.lead{font-size:var(--fs-lead);color:var(--muted);max-width:60ch}
.muted{color:var(--muted)} .small{font-size:.9rem}
.center{text-align:center} .center .lead{margin-inline:auto}
.stack>*+*{margin-top:var(--sp-4)}
.grid{display:grid;gap:var(--sp-5)}
.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.cols-3,.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cols-2,.cols-3,.cols-4{grid-template-columns:minmax(0,1fr)}}
.section-head{max-width:46rem;margin-bottom:clamp(2rem,5vw,3.5rem)}
.section-head.center{margin-inline:auto}
/* Scroll reveal (JS añade .is-in; sin JS todo es visible) */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal{opacity:1;transform:none}
}
[hidden]{display:none!important}

/* ---- shared/css/components.css (componentes compartidos) ---- */
/* MedisimCR · components.css — componentes reutilizables (futuros partials PHP). Solo leen tokens. */

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.8rem 1.4rem;border:2px solid transparent;border-radius:var(--r-pill);font:700 1rem/1.1 var(--f-body);text-decoration:none;cursor:pointer;transition:background var(--dur),transform .1s,box-shadow var(--dur),border-color var(--dur);background:var(--accent);color:var(--on-accent)}
.btn:hover{background:var(--accent-strong)} .btn:active{transform:translateY(1px)}
.btn-cta{background:var(--cta);color:var(--on-cta)} .btn-cta:hover{background:var(--cta-hover)}
.btn-ghost{background:transparent;color:var(--accent-strong);border-color:currentColor} .btn-ghost:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.btn-lg{min-height:58px;padding:1rem 1.9rem;font-size:1.1rem}
.btn-sm{min-height:40px;padding:.5rem 1rem;font-size:.92rem}
.btn-block{width:100%}
.cta-row{display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center}
.cta-note{font-size:.92rem;color:var(--muted);margin-top:.9rem}
.text-link{font-weight:700}

/* ---------- Header / nav ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--header-bg,var(--bg));border-bottom:1px solid var(--line);backdrop-filter:saturate(1.4) blur(10px)}
.site-header .wrap{display:flex;align-items:center;gap:1rem;min-height:68px}
.brand{display:inline-flex;align-items:center;gap:.55rem;font:800 1.3rem/1 var(--f-head);color:var(--heading);text-decoration:none;letter-spacing:-.02em;flex:none}
.brand svg,.brand img{width:34px;height:34px;flex:none}
.brand b{color:var(--brand-accent,var(--accent));font-weight:800}
.nav{margin-left:auto;display:flex;align-items:center;gap:.25rem}
.nav a:not(.btn){color:var(--text);text-decoration:none;padding:.55rem .8rem;border-radius:var(--r-pill);font-size:.96rem;font-weight:700;white-space:nowrap}
.nav a:not(.btn):hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.nav .nav-login{font-weight:700}
.nav-toggle{display:none;margin-left:auto;background:transparent;border:2px solid var(--line);border-radius:var(--r-pill);min-height:44px;padding:.4rem 1rem;font-weight:700;cursor:pointer;color:var(--text)}
@media (max-width:61.25em){
  .nav-toggle{display:inline-flex;align-items:center;gap:.5rem}
  .nav{position:absolute;left:0;right:0;top:100%;margin:0;flex-direction:column;align-items:stretch;gap:0;padding:.75rem var(--gutter) 1.25rem;background:var(--header-bg-open,var(--bg-alt));border-bottom:1px solid var(--line);box-shadow:var(--shadow-2);display:none}
  .nav.is-open{display:flex}
  .nav a:not(.btn){padding:.9rem .5rem;border-bottom:1px solid var(--line);border-radius:0;min-height:48px}
  .nav .btn{margin-top:.75rem}
}
/* Arquitectura SEO (páginas satélite futuras) — se muestran en el menú "Guías" y en el footer */
.nav-seo{position:relative}
.nav-seo summary{list-style:none;cursor:pointer;padding:.55rem .8rem;border-radius:var(--r-pill);font-weight:700;font-size:.96rem}
.nav-seo summary::-webkit-details-marker{display:none}
.nav-seo summary::after{content:"▾";margin-left:.35rem;font-size:.75em}
.nav-seo ul{list-style:none;position:absolute;top:calc(100% + .4rem);left:0;min-width:17rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-2);padding:.5rem;z-index:5}
.nav-seo a{display:block!important;border-radius:var(--r-sm)!important;padding:.6rem .8rem!important}
@media (max-width:61.25em){.nav-seo ul{position:static;box-shadow:none;border:0;padding:0 0 0 .75rem}}
.badge-soon{display:inline-block;font:700 .68rem/1 var(--f-body);letter-spacing:.06em;text-transform:uppercase;padding:.28rem .5rem;border-radius:var(--r-pill);background:var(--warn-bg);color:var(--warn);vertical-align:middle;margin-left:.35rem}

/* ---------- CTA sticky (discreto) ---------- */
.sticky-cta{position:fixed;z-index:60;left:0;right:0;bottom:0;padding:.6rem var(--gutter) calc(.6rem + env(safe-area-inset-bottom));background:var(--sticky-bg,var(--c-ink));color:#fff;transform:translateY(110%);visibility:hidden;transition:transform .35s var(--ease),visibility 0s .35s;box-shadow:0 -6px 24px rgba(14,27,44,.18)}
.sticky-cta.is-visible{transform:none;visibility:visible;transition:transform .35s var(--ease),visibility 0s 0s}
.sticky-cta .wrap{display:flex;align-items:center;justify-content:center;gap:1rem}
.sticky-cta p{margin:0;font-weight:700}
.sticky-cta .txt-mobile{display:none}
@media (max-width:640px){.sticky-cta .txt-desktop{display:none}.sticky-cta .txt-mobile{display:inline}.sticky-cta .btn{flex:1;min-height:52px}.sticky-cta p{display:none}}
body.has-sticky{padding-bottom:0}

/* ---------- Píldoras, etiquetas, avisos ---------- */
.pill{display:inline-flex;align-items:center;gap:.35rem;font:700 .78rem/1 var(--f-body);padding:.4rem .7rem;border-radius:var(--r-pill);background:var(--surface-2);color:var(--muted)}
.pill.ok{background:var(--ok-bg);color:var(--ok)} .pill.warn{background:var(--warn-bg);color:var(--warn)} .pill.bad{background:var(--bad-bg);color:var(--bad)}
.tag-demo{display:inline-flex;align-items:center;gap:.4rem;font:700 .72rem/1 var(--f-body);letter-spacing:.06em;text-transform:uppercase;padding:.35rem .6rem;border-radius:var(--r-sm);background:var(--warn-bg);color:var(--warn);border:1px dashed currentColor}
.notice{font-size:.9rem;color:var(--muted);border-left:4px solid var(--accent);padding:.35rem 0 .35rem .9rem;margin:1rem 0 0}
.notice strong{color:var(--text)}
/* Marcadores de prototipo: elementos que NO deben llegar a producción tal cual */
html.proto-flags [data-placeholder]{outline:2px dashed var(--c-amber);outline-offset:3px;position:relative}
html.proto-flags [data-placeholder]::after{content:"PLACEHOLDER · " attr(data-placeholder);position:absolute;left:0;top:-1.35rem;font:700 .62rem/1 var(--f-body);letter-spacing:.05em;text-transform:uppercase;background:var(--c-amber);color:#3b2600;padding:.2rem .4rem;border-radius:4px;white-space:nowrap;z-index:3;pointer-events:none}
html.proto-flags span[data-placeholder]::after{top:auto;bottom:100%}
html.proto-flags [data-demo-block]{position:relative}

/* ---------- Áreas (7) ---------- */
.areas{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));list-style:none}
.area-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;box-shadow:var(--shadow-1)}
.area-card .area-n{font:800 .85rem/1 var(--f-mono);color:var(--accent-strong)}
.area-card h3{margin:0;font-size:1.08rem}
.area-card p{margin:0;font-size:.92rem;color:var(--muted)}

/* ---------- Pasos ---------- */
.steps{list-style:none;counter-reset:s;display:grid;gap:1.25rem}
.steps>li{counter-increment:s;display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start}
.steps>li::before{content:counter(s);display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--cta);color:var(--on-cta);font:800 1.25rem var(--f-head)}
.steps h3{margin:0 0 .2rem}.steps p{margin:0;color:var(--muted)}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:.75rem}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:0}
.faq summary{cursor:pointer;list-style:none;padding:1.05rem 3rem 1.05rem 1.25rem;font:700 1.05rem/1.35 var(--f-head);position:relative;color:var(--heading);min-height:48px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);font:400 1.6rem/1 var(--f-body);color:var(--accent-strong);transition:transform var(--dur)}
.faq details[open] summary::after{content:"–"}
.faq details>div{padding:0 1.25rem 1.15rem;color:var(--muted)}
.faq details>div p:last-child{margin-bottom:0}

/* ---------- Membresía ---------- */
.price-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--shadow-2);display:grid;gap:1.25rem}
.price-card .price{font:800 clamp(2.4rem,6vw,3.6rem)/1 var(--f-head);color:var(--heading);letter-spacing:-.03em}
.price-card .price small{font:400 1rem var(--f-body);color:var(--muted);letter-spacing:0}
.checklist{list-style:none;display:grid;gap:.6rem}
.checklist li{position:relative;padding-left:2rem}
.checklist li::before{content:"";position:absolute;left:0;top:.2rem;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--ok-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%230B6B4F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat}
.checklist li.soon::before{background-color:var(--warn-bg);background-image:none}
.pay-methods{display:flex;flex-wrap:wrap;gap:.5rem}

/* ---------- Estadísticas ---------- */
.stat b{display:block;font:800 clamp(2rem,4vw,2.8rem)/1 var(--f-head);color:var(--heading)}
.stat span{color:var(--muted);font-size:.95rem}

/* ---------- Simulación demo (renderizada por shared/js/sim-demo.js) ---------- */
.sim{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-2);overflow:hidden;color:var(--text)}
.sim-top{display:flex;align-items:center;gap:.75rem;justify-content:space-between;padding:.85rem 1.1rem;border-bottom:1px solid var(--line);background:var(--surface-2);flex-wrap:wrap}
.sim-meta{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:.92rem}
.sim-timer{font:700 .95rem var(--f-mono);padding:.3rem .65rem;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line)}
.sim-timer.low{color:var(--bad);border-color:var(--bad)}
.sim-bar{height:6px;background:var(--line)} .sim-bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .4s var(--ease)}
.sim-body{padding:1.25rem 1.25rem 1.5rem;display:grid;gap:1rem}
.sim-case{font-weight:700;font-size:1.08rem;line-height:1.5;margin:0}
.sim-q{margin:0;color:var(--muted)}
.sim-opts{display:grid;gap:.6rem;list-style:none}
.sim-opt{width:100%;text-align:left;display:grid;grid-template-columns:2rem 1fr auto;gap:.75rem;align-items:center;min-height:56px;padding:.8rem 1rem;background:var(--surface);border:2px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:border-color var(--dur),background var(--dur)}
.sim-opt:hover:not([disabled]){border-color:var(--accent)}
.sim-opt .k{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--surface-2);font:800 .9rem var(--f-head)}
.sim-opt[aria-pressed="true"]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--surface))}
.sim-opt.is-correct{border-color:var(--lvl-strong);background:var(--ok-bg);color:var(--ok)}
.sim-opt.is-wrong{border-color:var(--lvl-weak);background:var(--bad-bg);color:var(--bad)}
.sim-opt[disabled]{cursor:default}
.sim-explain{background:var(--surface-2);border-radius:var(--r-md);padding:1rem 1.1rem;font-size:.97rem}
.sim-explain[hidden]{display:none}
.sim-explain strong{display:block;margin-bottom:.25rem}
.sim-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem}
.sim-result{display:grid;gap:.75rem;text-align:center;padding:1rem 0}
.sim-result .big{font:800 3rem/1 var(--f-head)}

/* ---------- Reportes demo (renderizados por shared/js/report-demo.js) ---------- */
.rep{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1rem,3vw,1.75rem);box-shadow:var(--shadow-1);color:var(--text)}
.rep-title{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin:0 0 1rem;font:700 1.05rem var(--f-head)}
.rep-bars{display:grid;gap:.85rem;list-style:none}
.rep-bar{display:grid;grid-template-columns:minmax(0,11rem) 1fr 3.4rem;gap:.75rem;align-items:center;font-size:.92rem}
.rep-bar .lbl{font-weight:700;line-height:1.2}
.rep-bar .val{font:700 .95rem var(--f-mono);text-align:right}
.rep-track{height:10px;background:var(--surface-2);border-radius:99px;overflow:hidden;position:relative}
.rep-track i{position:absolute;inset:0 auto 0 0;width:0;border-radius:99px;background:var(--lvl-mid);transition:width .9s var(--ease)}
.rep-track i.strong{background:var(--lvl-strong)} .rep-track i.weak{background:var(--lvl-weak)}
.rep-track .mark{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--heading);opacity:.55}
@media (max-width:520px){.rep-bar{grid-template-columns:1fr 3.2rem}.rep-bar .rep-track{grid-column:1/-1;grid-row:2}}
.rep-table{width:100%;border-collapse:collapse;font-size:.92rem}
.rep-table th{text-align:left;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:.5rem .5rem;border-bottom:2px solid var(--line)}
.rep-table td{padding:.6rem .5rem;border-bottom:1px solid var(--line);vertical-align:middle}
.rep-table tr.area-row td{background:var(--surface-2);font-weight:800}
.rep-table td.sub{padding-left:1.4rem}
.rep-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r-md)}
.lvl{display:inline-flex;align-items:center;gap:.4rem;font:700 .76rem/1 var(--f-body);padding:.35rem .6rem;border-radius:var(--r-pill)}
.lvl::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:currentColor}
.lvl.strong{background:var(--ok-bg);color:var(--ok)} .lvl.mid{background:var(--warn-bg);color:var(--warn)} .lvl.weak{background:var(--bad-bg);color:var(--bad)}
.rep-heat{display:grid;grid-template-columns:repeat(auto-fill,minmax(3.1rem,1fr));gap:6px}
.rep-heat button,.rep-heat div{aspect-ratio:1;border-radius:8px;border:0;display:grid;place-items:center;font:700 .78rem var(--f-mono);color:#fff;cursor:default}
.rep-heat .h-strong{background:#0B7A5B} .rep-heat .h-mid{background:var(--lvl-mid);color:#2b1c00} .rep-heat .h-weak{background:#C22F35}
.rep-donut{display:grid;place-items:center;position:relative;width:min(100%,11rem);aspect-ratio:1;margin-inline:auto}
.rep-donut svg{width:100%;height:100%;transform:rotate(-90deg)}
.rep-donut .c{position:absolute;text-align:center;line-height:1.1}.rep-donut .c b{display:block;font:800 2rem var(--f-head)}
.rep-trend svg{width:100%;height:auto;display:block}
.rep-legend{display:flex;flex-wrap:wrap;gap:.5rem 1rem;font-size:.82rem;color:var(--muted);margin-top:.75rem}
.rep-legend span::before{content:"";display:inline-block;width:.7rem;height:.7rem;border-radius:3px;margin-right:.4rem;background:var(--c);vertical-align:-1px}
.rep-criterion{display:grid;gap:.4rem}
.rep-criterion .big{font:800 clamp(2rem,5vw,2.8rem)/1 var(--f-head)}
.rep-dims{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}
.rep-dim{border:1px solid var(--line);border-radius:var(--r-md);padding:.75rem .9rem;background:var(--surface)}
.rep-dim b{display:block;font:800 1.5rem var(--f-head)} .rep-dim span{font-size:.85rem;color:var(--muted)}
.rep-tree{list-style:none;display:grid;gap:.25rem;font-size:.92rem}
.rep-tree ul{list-style:none;margin:.25rem 0 .5rem 1rem;padding-left:.9rem;border-left:2px solid var(--line);display:grid;gap:.25rem}
.rep-tree li>div{display:flex;justify-content:space-between;gap:.75rem;align-items:center;padding:.35rem .6rem;border-radius:8px;background:var(--surface-2)}

/* ---------- Footer ---------- */
.site-footer{background:var(--footer-bg,var(--c-ink));color:var(--footer-text,#B9CBD8);padding-block:clamp(2.5rem,6vw,4rem) 2rem;font-size:.95rem}
.site-footer a{color:#fff}
.site-footer .brand{color:#fff}
.site-footer .foot-grid{display:grid;gap:2rem;grid-template-columns:1.4fr repeat(3,1fr)}
@media (max-width:860px){.site-footer .foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.site-footer .foot-grid{grid-template-columns:1fr}}
.site-footer h2{font:700 .8rem var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:.8rem}
.site-footer ul{list-style:none;display:grid;gap:.45rem}
.site-footer .legal{border-top:1px solid rgba(255,255,255,.14);margin-top:2rem;padding-top:1.25rem;font-size:.85rem;max-width:80ch}
.bc{font-size:.85rem;color:var(--muted);margin-bottom:1rem}
.bc ol{list-style:none;display:flex;gap:.5rem;flex-wrap:wrap}.bc li+li::before{content:"/";margin-right:.5rem}

/* ---------- Toast de ruta (solo prototipos) ---------- */
.route-toast{position:fixed;left:50%;bottom:5.5rem;transform:translate(-50%,20px);z-index:200;max-width:min(94vw,34rem);background:#0E1B2C;color:#fff;border:1px solid #2ED3A0;border-radius:var(--r-md);padding:.85rem 1.1rem;font-size:.85rem;box-shadow:var(--shadow-2);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.route-toast.is-on{opacity:1;transform:translate(-50%,0)}
.route-toast code{display:block;margin-top:.35rem;font:600 .78rem var(--f-mono);color:#2ED3A0;word-break:break-all}
.proto-bar{position:fixed;right:.75rem;top:.75rem;z-index:150;display:flex;gap:.4rem}

.rep-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:1rem}
.rep-summary .stat b{font-size:clamp(1.6rem,3vw,2.1rem)}

/* Reserva de altura antes de que el JS de demo pinte el widget (evita saltos de layout / CLS).
   En PHP estos bloques llegan ya renderizados y esta regla deja de tener efecto. */
[data-sim]:empty{min-height:28rem}
[data-report="areaBars"]:empty{min-height:12rem}
[data-report="subBars"]:empty{min-height:24rem}
[data-report="donut"]:empty{min-height:8.5rem}
[data-report="criterion"]:empty{min-height:8rem}
[data-report="trend"]:empty{min-height:7rem}
[data-report="heat"]:empty{min-height:12rem}
[data-report="dims"]:empty{min-height:5rem}
[data-report="summary"]:empty{min-height:3.5rem}
[data-report="topbottom"]:empty{min-height:9rem}
[data-report="hierarchy"]:empty{min-height:24rem}
[data-report="table"]:empty{min-height:60rem}

/* ---- 11-conversion-final-v2/styles.css (estilos propios de esta portada) ---- */
/* ==========================================================================
   11 · CONVERSIÓN FINAL — estilos propios (prefijo .cf-)
   Base visual: 10 (aurora, premium, oscuro/claro por sección) + 02 (dashboard) + 06 (caso) + 05 (plan).
   Solo transform/opacity en animaciones · prefers-reduced-motion respetado · mobile first (390 px).
   ========================================================================== */
/* Fuentes de respaldo con métricas ajustadas (evita saltos de layout al cargar las fuentes locales) */
@font-face{font-family:"SG Fallback";src:local("Arial"),local("Helvetica");size-adjust:101.1%;font-weight:400 800}
@font-face{font-family:"Inter Fallback";src:local("Arial"),local("Helvetica");size-adjust:105.8%;font-weight:400 800}
:root{
  --f-head:"Space Grotesk","SG Fallback",Arial,sans-serif;
  --f-body:"Inter","Inter Fallback",Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --fs-body:1rem; --fw-head:700; --ls-head:-.035em;
  --fs-h1:clamp(2rem,6.4vw,3.6rem);
  --fs-h2:clamp(1.65rem,4.2vw,2.85rem);
  --fs-lead:clamp(1.02rem,1.5vw,1.2rem);
  --section-y:clamp(3rem,7vw,5.75rem);
  --maxw:1200px;
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px;
  --bg:#F4F7FC; --bg-alt:#FFFFFF; --surface:#FFFFFF; --surface-2:#EDF2FA; --line:#DAE3F0;
  --text:#0F1B2D; --muted:#46566B; --heading:#0A1424;
  --accent:#0F7A80; --accent-strong:#0A5C63; --on-accent:#FFFFFF;
  --cta:#2ED3A0; --cta-hover:#25BD8E; --on-cta:#0A1424; --link:#0A5C63;
  --gt:linear-gradient(100deg,#0B7F6B 0%,#2A62D6 58%,#6A4FD8 100%);
  --shadow-1:0 1px 2px rgba(15,27,45,.05),0 6px 18px rgba(15,27,45,.06);
  --shadow-2:0 2px 4px rgba(15,27,45,.06),0 24px 56px rgba(15,27,45,.12);
  --footer-bg:#040911; --footer-text:#A9BACD; --sticky-bg:#0A1424;
}
.theme-dark{
  --bg:#060D19; --bg-alt:#0A1424; --surface:#0F1C31; --surface-2:#16263F; --line:#243852;
  --text:#E8EFF7; --muted:#A9BACD; --heading:#F4F8FD;
  --accent:#2ED3A0; --accent-strong:#5DE3BB; --on-accent:#0A1424; --link:#7FE6C6;
  --ok:#7CF0C6; --ok-bg:#0E3B30; --warn:#F6C46B; --warn-bg:#3A2A0A; --bad:#FFA0A3; --bad-bg:#45191C;
  --focus:#FFFFFF; --focus-ring:#2ED3A0;
  --gt:linear-gradient(100deg,#7DF0CE 0%,#7DB8FF 55%,#B9A9FF 100%);
  --shadow-1:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.28);
  --shadow-2:0 2px 4px rgba(0,0,0,.3),0 28px 60px rgba(0,0,0,.42);
  --header-bg:rgba(6,13,25,.88); --header-bg-open:#0A1424;
  background:var(--bg); color:var(--text);
}
.site-header{border-bottom-color:rgba(255,255,255,.08)}
.brand b{color:var(--accent-strong)}
.ic{width:1.25rem;height:1.25rem;flex:none}
.cf-gt{color:var(--accent-strong)}
@supports (-webkit-background-clip:text) or (background-clip:text){
  .cf-gt{background:var(--gt);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
}
.eyebrow{letter-spacing:.14em;font-family:var(--f-mono);font-weight:600;font-size:.72rem}
.section-head h2{letter-spacing:-.04em}
.cf-fine{font-size:.82rem;color:var(--muted);margin:1rem 0 0;max-width:60ch}
.cf-flag{display:inline-flex;align-items:center;gap:.4rem;font:700 .74rem/1 var(--f-body);letter-spacing:.02em;padding:.4rem .65rem;border-radius:var(--r-pill);background:var(--bad-bg);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 45%,transparent)}
.cf-flag::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:currentColor;animation:cf-pulse 2.4s ease-in-out infinite}
.cf-flag.ok{background:var(--ok-bg);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,transparent)}
.cf-flag.mid{background:var(--warn-bg);color:var(--warn);border-color:color-mix(in srgb,var(--warn) 45%,transparent)}
@keyframes cf-pulse{50%{transform:scale(1.5);opacity:.55}}

/* ---------- Aurora (mesh sin blur) ---------- */
.cf-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.cf-aurora::before,.cf-aurora::after{content:"";position:absolute;border-radius:50%;width:var(--au,44rem);height:var(--au,44rem);will-change:transform}
.cf-aurora::before{left:-14rem;top:-24rem;background:radial-gradient(closest-side,rgba(46,211,160,.28),transparent 72%);animation:cf-a1 34s ease-in-out infinite alternate}
.cf-aurora::after{right:-16rem;top:-14rem;background:radial-gradient(closest-side,rgba(112,104,255,.32),transparent 72%);animation:cf-a2 40s ease-in-out infinite alternate}
.cf-aurora-2::before{top:-10rem;left:auto;right:-8rem;opacity:.8}.cf-aurora-2::after{right:auto;left:-18rem;top:-18rem;opacity:.7}
@media (min-width:1000px){.cf-aurora{--au:60rem}}
@keyframes cf-a1{to{transform:translate3d(12%,10%,0) scale(1.1)}}
@keyframes cf-a2{to{transform:translate3d(-10%,14%,0) scale(1.08)}}

/* =============== 1 · HERO =============== */
.cf-hero{position:relative;overflow:hidden;padding:clamp(1.75rem,5vw,4rem) 0 clamp(2.25rem,6vw,4.5rem)}
.cf-hero::after{content:"";position:absolute;inset:0;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:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 50% 20%,#000 0,transparent 70%);mask-image:radial-gradient(ellipse at 50% 20%,#000 0,transparent 70%);pointer-events:none}
.cf-hero-in{position:relative;z-index:1;display:grid;gap:1.75rem;align-items:center}
.cf-kicker{display:inline-flex;align-items:center;gap:.55rem;margin:0 0 .9rem;font:600 .72rem/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-strong)}
.cf-dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(46,211,160,.2);animation:cf-pulse 2.4s ease-in-out infinite}
.cf-hero h1{margin:0;font-size:var(--fs-h1);line-height:1.04;letter-spacing:-.04em}
.cf-lead{margin:1rem 0 0;font-size:var(--fs-lead);color:var(--muted);max-width:34rem}
.cf-cta{margin-top:1.4rem}
.cf-cta .btn{flex:1 1 auto}
.cf-trialline{list-style:none;margin:1.1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem .5rem}
.cf-trialline li{display:inline-flex;align-items:center;gap:.35rem;font-size:.86rem;font-weight:600;color:var(--text);padding:.42rem .75rem;border-radius:var(--r-pill);background:rgba(255,255,255,.06);border:1px solid var(--line)}
.cf-trialline b{font-family:var(--f-mono);color:var(--accent-strong)}

.cf-hero-app{position:relative;min-width:0}
.cf-win{background:linear-gradient(180deg,var(--surface),var(--bg-alt));border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-2),0 0 0 1px rgba(255,255,255,.03) inset;overflow:hidden}
.cf-win-bar,.cf-dash-bar{display:flex;align-items:center;gap:.4rem;padding:.65rem .9rem;border-bottom:1px solid var(--line);font:600 .74rem var(--f-mono);color:var(--muted)}
.cf-win-bar i,.cf-dash-bar i{width:.6rem;height:.6rem;border-radius:50%;background:var(--surface-2);border:1px solid var(--line)}
.cf-win-bar span,.cf-dash-bar span{margin-left:.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf-dash-bar em{margin-left:auto;font-style:normal}
.cf-win-body{display:grid;gap:.85rem;padding:.9rem}
.cf-hcase{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-md);padding:.95rem}
.cf-hcase-h,.cf-hrep-h{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.cf-hstem{margin:.7rem 0 .6rem;font-size:.92rem;line-height:1.5;color:var(--text)}
.cf-hopts{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.cf-hopts li{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border:1px solid var(--line);border-radius:12px;font-size:.88rem;background:var(--surface)}
.cf-hopts li i{font:700 .78rem var(--f-mono);font-style:normal;width:1.55rem;height:1.55rem;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--muted);flex:none}
.cf-hopts li.ok{border-color:var(--ok);background:var(--ok-bg);color:var(--ok);font-weight:600}
.cf-hopts li.ok i{background:var(--ok);color:var(--bg)}
.cf-hopts li .ic{margin-left:auto;width:1.1rem}
.cf-hres{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.75rem 0 0}
.cf-hex{font-size:.78rem;color:var(--muted)}
.cf-hrep{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-md);padding:.95rem;display:grid;gap:.8rem;align-content:start}
.cf-hrep-h span:first-child{font:700 .9rem var(--f-head);color:var(--heading)}
.cf-hrep-top{display:flex;align-items:center;gap:1rem}
.cf-hrep-top .rep-donut{width:6rem;flex:none;margin:0}
.cf-hrep-top .rep-donut .c b{font-size:1.2rem}.cf-hrep-top .rep-donut .c span{font-size:.6rem}
.cf-hbars .rep-legend{font-size:.66rem;gap:.25rem .7rem;margin-top:.5rem}
.cf-hweak .cf-flag{white-space:nowrap;font-size:.68rem;padding:.35rem .55rem}
.cf-hweak .lvl{white-space:nowrap;font-size:.7rem}
.cf-hweak{display:grid;gap:.4rem;justify-items:start}
.cf-hweak b{font:700 1.05rem/1.2 var(--f-head);color:var(--heading)}
.cf-hbars .rep-bars{gap:.5rem}
.cf-hbars .rep-bar{grid-template-columns:minmax(0,6.2rem) 1fr 2.5rem;gap:.5rem;font-size:.74rem}
.cf-hbars .rep-bar .val{font-size:.76rem}
.cf-hbars .rep-bar.is-focus{background:var(--bad-bg);border-radius:8px;margin:0 -.4rem;padding:.2rem .4rem;outline:1px solid color-mix(in srgb,var(--bad) 50%,transparent)}
.cf-demo-note{margin:.7rem .2rem 0;font-size:.74rem;color:var(--muted)}

@media (max-width:699px){
  .cf-hrep-top .rep-donut{display:none}
  .cf-hrep{padding:.7rem .85rem}
  .cf-hrep-top{gap:.5rem}
  .cf-hero-app .cf-win-bar{display:none}
  .cf-hcase{padding:.8rem}
  .cf-cta .btn-ghost{flex:1 1 100%;border:0;min-height:44px;padding:.3rem;text-decoration:underline;text-underline-offset:4px;font-size:.98rem}
  .cf-trialline{gap:.35rem}.cf-trialline li{font-size:.8rem;padding:.35rem .6rem}
}
@media (min-width:700px){
  .cf-win-body{grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);padding:1.1rem;gap:1rem}
}
@media (min-width:1000px){
  .cf-hero-in{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2rem,4vw,3.5rem)}
  .cf-cta .btn{flex:0 0 auto}
}

/* =============== 2 · MINI CASO =============== */
.cf-casesec{background:var(--bg-alt);padding-block:clamp(2rem,6vw,4.5rem)}
.cf-case-grid{display:grid;gap:1.1rem}
.cf-case-intro h2{margin:0;font-size:clamp(1.5rem,4.4vw,2.6rem);line-height:1.08}
.cf-case-intro .eyebrow{margin-bottom:.6rem}
.cf-case-sub{margin:.4rem 0 0}
.cf-case{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-2);padding:clamp(.95rem,3vw,1.6rem);min-width:0}
.cf-case-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem}
.cf-stem{margin:.85rem 0 .5rem;font-size:.97rem;line-height:1.55;color:var(--text)}
.cf-q{margin:0 0 .75rem;font:700 1.05rem/1.3 var(--f-head);color:var(--heading)}
.cf-opts{border:0;margin:0;padding:0;display:grid;gap:.5rem;min-width:0}
.cf-opt{display:flex;align-items:center;gap:.7rem;min-height:52px;padding:.65rem .85rem;border:2px solid var(--line);border-radius:14px;background:var(--bg);cursor:pointer;transition:border-color .15s,background .15s,transform .15s;position:relative}
.cf-opt:hover{border-color:var(--accent)}
.cf-opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.cf-opt i{font:700 .82rem var(--f-mono);font-style:normal;width:1.8rem;height:1.8rem;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--muted);flex:none}
.cf-opt span{flex:1;font-size:.95rem;font-weight:600;line-height:1.35}
.cf-opt .ic{display:none;margin-left:auto}
.cf-opt:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--bg))}
.cf-opt:has(input:checked) i{background:var(--accent);color:var(--on-accent)}
.cf-opt:has(input:focus-visible){outline:3px solid var(--focus-ring);outline-offset:2px}
.cf-opt.is-ok{border-color:var(--ok);background:var(--ok-bg);color:var(--ok)}
.cf-opt.is-ok i{background:var(--ok);color:#fff}
.cf-opt.is-ok .ic{display:block}
.cf-opt.is-bad{border-color:var(--bad);background:var(--bad-bg);color:var(--bad)}
.cf-opt.is-bad i{background:var(--bad);color:#fff}
.cf-case.is-done .cf-opt{cursor:default}
.cf-case-actions{margin-top:.85rem}
.cf-confirm{width:100%}
.cf-confirm:disabled{background:var(--surface-2);color:var(--muted);cursor:not-allowed;opacity:1}
.cf-result{margin-top:1rem;border-top:1px dashed var(--line);padding-top:1rem;animation:cf-rise .35s var(--ease)}
.cf-result-h .lvl{font-size:.9rem;padding:.5rem .8rem}
.cf-result-grid{display:grid;gap:.6rem;margin:.9rem 0 0}
.cf-result-grid div{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:.6rem .75rem}
.cf-result-grid dt{font:700 .7rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cf-result-grid dd{margin:.15rem 0 0;font-weight:600;font-size:.92rem}
.cf-why{margin-top:.8rem;font-size:.93rem}
.cf-why b{font:700 .72rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong)}
.cf-why p{margin:.3rem 0 0;color:var(--muted);line-height:1.55}
@keyframes cf-rise{from{opacity:0;transform:translateY(8px)}}
.cf-bridge{background:linear-gradient(135deg,#0A1424,#0D2A3A 60%,#123B4A);color:#E8EFF7;border-radius:var(--r-lg);padding:clamp(1.1rem,3.5vw,1.9rem);border:1px solid #1F3B52;animation:cf-rise .4s var(--ease);--muted:#A9BACD}
.cf-bridge-big{margin:0;font:700 clamp(1.1rem,3.2vw,1.55rem)/1.25 var(--f-head);letter-spacing:-.02em}
.cf-bridge-big b{color:#5DE3BB}
.cf-bridge-map{list-style:none;margin:1rem 0 1.1rem;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.cf-bridge-map li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.55rem .65rem;min-width:0}
.cf-bridge-map small{display:block;font:600 .64rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:#93A8BE}
.cf-bridge-map b{font-size:.84rem;line-height:1.25;display:block;overflow-wrap:anywhere}
.cf-bridge .btn-ghost{color:#E8EFF7}
.cf-bridge .cta-row .btn{flex:1 1 auto}
@media (min-width:700px){
  .cf-result-grid{grid-template-columns:1fr 1fr}
  .cf-confirm{width:auto;min-width:16rem}
}
@media (min-width:980px){
  .cf-case-grid{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:1.5rem 3rem;align-items:start}
  .cf-case-intro{position:sticky;top:6rem}
  .cf-bridge{grid-column:2}
}
@media (max-width:520px){.cf-case-sub{display:none}.cf-case-intro .eyebrow{display:none}}

/* =============== 3 · DASHBOARD =============== */
.cf-dashsec{position:relative;background:linear-gradient(180deg,#060D19 0,#08111F 100%);padding-block:var(--section-y);overflow:hidden}
.cf-dashsec::before{content:"";position:absolute;left:50%;top:-20%;width:90%;aspect-ratio:1;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(46,211,160,.12),transparent 70%);pointer-events:none}
.cf-dashsec .wrap{position:relative}
.cf-dash-head{max-width:46rem;margin-bottom:clamp(1.5rem,4vw,2.5rem)}
.cf-dash-head h2{margin:0;font-size:var(--fs-h2);line-height:1.05}
.cf-dash-sub{margin:.7rem 0 0;font:600 clamp(1.15rem,2.6vw,1.6rem) var(--f-head);color:var(--accent-strong)}
.cf-dash{background:linear-gradient(180deg,#0E1B30,#0A1424);border:1px solid #243852;border-radius:var(--r-xl);box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.03) inset;overflow:hidden}
.cf-levels{list-style:none;margin:0;padding:.85rem .9rem 0;display:flex;flex-wrap:wrap;gap:.35rem .3rem;counter-reset:lv}
.cf-levels li{counter-increment:lv;font-size:.74rem;padding:.4rem .65rem;border-radius:var(--r-pill);border:1px solid var(--line);color:var(--muted);display:inline-flex;align-items:center;gap:.4rem;transition:background .2s,color .2s,border-color .2s}
.cf-levels li::before{content:counter(lv);font:700 .68rem var(--f-mono);width:1.25rem;height:1.25rem;border-radius:50%;display:grid;place-items:center;background:var(--surface-2)}
.cf-levels li.on{color:var(--text)}
.cf-levels li.cur{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:var(--accent);color:var(--heading)}
.cf-levels li.cur::before{background:var(--accent);color:var(--on-accent)}
.cf-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;padding:.9rem}
.cf-kpi{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:16px;padding:.8rem .9rem;display:grid;gap:.15rem;align-content:start;min-width:0}
.cf-kpi small{font:600 .68rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cf-kpi b{font:700 clamp(1.7rem,4.4vw,2.6rem)/1 var(--f-head);color:var(--heading);letter-spacing:-.04em}
.cf-of{font-size:.5em;color:var(--muted);font-weight:600}
.cf-kpi-s{font-size:.74rem;color:var(--muted)}
.cf-kpi-trend b{color:var(--accent-strong)}
.cf-spark{display:block;color:var(--accent);height:34px}
.cf-spark svg{width:100%;max-width:150px;height:34px}
.cf-cols{display:grid;gap:.85rem;padding:0 .9rem .9rem}
.cf-col{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:18px;padding:.9rem;min-width:0}
.cf-col h3{margin:0 0 .7rem;font:700 .95rem var(--f-head);color:var(--heading);display:flex;align-items:center;gap:.5rem}
.cf-col h3 span{width:1.4rem;height:1.4rem;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--on-accent);font:700 .72rem var(--f-mono)}
.cf-col h3 em{font-style:normal;color:var(--muted);font-weight:600;font-size:.78rem}
.cf-list{list-style:none;margin:0;padding:0;display:grid;gap:.25rem}
.cf-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t v" "b l";gap:.3rem .6rem;align-items:center;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:12px;padding:.55rem .6rem;color:var(--text);cursor:pointer;font:inherit;min-height:48px;transition:background .15s,border-color .15s}
.cf-row:hover{background:rgba(255,255,255,.05)}
.cf-row.is-sel{background:color-mix(in srgb,var(--accent) 12%,transparent);border-color:var(--accent)}
.cf-row-t{grid-area:t;font-weight:700;font-size:.88rem;line-height:1.25}
.cf-row-t small{font:600 .7rem var(--f-mono);color:var(--muted);margin-right:.2rem}
.cf-row .rep-track{grid-area:b;height:8px}
.cf-row-v{grid-area:v;font:700 .9rem var(--f-mono)}
.cf-row-l{grid-area:l;justify-self:end;font-size:.66rem;padding:.28rem .5rem}
.cf-dimhead{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;margin-bottom:.8rem;padding:.75rem;border-radius:14px;background:rgba(255,255,255,.04)}
.cf-dh-n{flex:1 1 100%;font-weight:700;font-size:.9rem;color:var(--heading);line-height:1.25}
.cf-dimhead b{font:700 1.9rem/1 var(--f-head);letter-spacing:-.04em;color:var(--heading)}
.cf-list-dims{gap:.55rem}
.cf-drow{display:grid;grid-template-columns:minmax(0,1fr) 2.8rem;grid-template-areas:"t v" "b b";gap:.25rem .5rem;font-size:.86rem}
.cf-drow span{grid-area:t;font-weight:600}.cf-drow b{grid-area:v;text-align:right;font:700 .85rem var(--f-mono)}.cf-drow .rep-track{grid-area:b;height:8px}
.cf-verdict{margin:.9rem 0 0;padding:.7rem .8rem;border-radius:12px;background:color-mix(in srgb,var(--accent) 10%,transparent);border-left:3px solid var(--accent);font-size:.86rem;line-height:1.45}
.cf-verdict b{color:var(--heading)}.cf-dm{color:var(--muted);font-size:.78rem}
.cf-dash-foot{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin:0;padding:.85rem .95rem;border-top:1px solid var(--line);font-size:.76rem;color:var(--muted)}
.cf-key{display:inline-flex;align-items:center;gap:.4rem}.cf-key i{width:.7rem;height:.7rem;border-radius:3px}
.k-s{background:var(--lvl-strong)}.k-m{background:var(--lvl-mid)}.k-w{background:var(--lvl-weak)}.k-l{width:2px!important;height:.9rem!important;border-radius:0!important;background:var(--heading);opacity:.6}
.cf-after{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.2rem;margin-top:1.5rem}
.cf-after-t{color:var(--muted);font-size:.92rem}
.cf-dashsec .rep-track .mark{background:#fff;opacity:.7}
@media (max-width:999px){
  .cf-list-areas{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.4rem;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .cf-list-areas li{flex:0 0 11.2rem}
  .cf-list-areas .cf-row{border-color:var(--line);height:100%}
  .cf-list-areas .cf-row-l{display:none}
  .cf-list-areas .cf-row{grid-template-areas:"t v" "b b"}
}
@media (min-width:700px){.cf-kpis{grid-template-columns:repeat(4,minmax(0,1fr));padding:1.1rem}.cf-cols{padding:0 1.1rem 1.1rem}.cf-levels{padding:1.1rem 1.1rem 0}}
@media (min-width:1000px){.cf-cols{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,.95fr);gap:1rem}.cf-col{padding:1.1rem}}

/* =============== 4 · DIFERENCIACIÓN =============== */
.cf-diff{background:var(--bg)}
.cf-diff-grid{display:grid;gap:1rem}
.cf-old,.cf-new{border-radius:var(--r-lg);padding:clamp(1.1rem,3vw,1.8rem)}
.cf-old{border:2px dashed var(--line);background:transparent;color:var(--muted)}
.cf-old h3,.cf-new h3{margin:0 0 .9rem;font:700 1.15rem var(--f-head);color:var(--heading)}
.cf-old ul,.cf-new ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.cf-old li{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:12px;background:var(--surface-2);font-weight:600}
.cf-old .ic{color:var(--muted)}
.cf-old-end{margin:1.1rem 0 0;font:600 1.05rem var(--f-head)}
.cf-new{background:linear-gradient(160deg,#0A1424,#0D2B38);color:#E8EFF7;border:1px solid #1F3B52;box-shadow:var(--shadow-2);position:relative;--muted:#A9BACD}
.cf-new h3{color:#fff}
.cf-new ul{grid-template-columns:repeat(2,minmax(0,1fr))}
.cf-new li{display:flex;align-items:center;gap:.55rem;padding:.6rem .65rem;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-weight:600;font-size:.9rem;line-height:1.2}
.cf-new .ic{color:#5DE3BB}
.cf-new-end{margin:1.1rem 0 0;font:700 1.25rem var(--f-head)}
.cf-new-end em{font-style:normal;color:#5DE3BB}
.cf-old-end em{font-style:normal;text-decoration:underline}
@media (min-width:900px){.cf-diff-grid{grid-template-columns:.7fr 1.3fr;align-items:stretch}.cf-new ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.cf-new li{font-size:.8rem;padding:.55rem .5rem;gap:.4rem}.cf-new .ic{width:1.05rem;height:1.05rem}}

/* =============== 5 · ÁREAS =============== */
.cf-areasec{background:var(--bg-alt)}
.cf-areas{display:grid;gap:.7rem}
.cf-area{--h:170;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;position:relative;transition:box-shadow .2s,transform .2s}
.cf-area::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:hsl(var(--h) 62% 42%)}
.cf-area[data-a="1"]{--h:172}.cf-area[data-a="2"]{--h:205}.cf-area[data-a="3"]{--h:262}.cf-area[data-a="4"]{--h:220}.cf-area[data-a="5"]{--h:150}.cf-area[data-a="6"]{--h:285}.cf-area[data-a="7"]{--h:190}
.cf-area:hover{box-shadow:var(--shadow-1)}
.cf-area summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr;gap:.1rem .8rem;align-items:center;padding:1rem 1.1rem;min-height:56px}
.cf-area summary::-webkit-details-marker{display:none}
.cf-area-n{grid-row:1/3;width:2.4rem;height:2.4rem;border-radius:12px;display:grid;place-items:center;font:700 1.1rem var(--f-head);background:hsl(var(--h) 60% 92%);color:hsl(var(--h) 65% 26%)}
.cf-area-name{font:700 1.05rem/1.2 var(--f-head);color:var(--heading)}
.cf-area-c{font:600 .74rem var(--f-mono);color:var(--muted)}
.cf-subs{list-style:none;margin:0;padding:0 1.1rem 1.1rem;display:flex;flex-wrap:wrap;gap:.4rem}
.cf-subs li{font-size:.82rem;font-weight:600;padding:.4rem .65rem;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);display:inline-flex;gap:.4rem;align-items:baseline;line-height:1.25}
.cf-subs li span{font:600 .68rem var(--f-mono);color:hsl(var(--h) 60% 32%)}
@media (min-width:640px){.cf-areas{grid-template-columns:repeat(2,minmax(0,1fr))}.cf-area[data-a="1"]{grid-column:1/-1}}
@media (min-width:900px){
  .cf-areas{grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}
  .cf-area summary{cursor:default;pointer-events:none;align-content:start;padding-bottom:.6rem}
  .cf-area[data-a="1"]{grid-column:1/3;grid-row:1/3}.cf-area[data-a="4"]{grid-column:3/5}.cf-area[data-a="7"]{grid-column:3/5}
  .cf-area[data-a="1"] .cf-area-n{width:3rem;height:3rem;font-size:1.4rem}.cf-area[data-a="1"] .cf-area-name{font-size:1.3rem}
}

/* =============== 6 · SIMULACRO =============== */
.cf-examsec{background:var(--bg)}
.cf-exam{background:linear-gradient(180deg,#0E1B30,#0A1424);border:1px solid #243852;border-radius:var(--r-xl);padding:clamp(1rem,3vw,1.8rem);box-shadow:var(--shadow-2)}
.cf-exam-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin-bottom:1.1rem}
.cf-exam-stat{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:14px;padding:.7rem .85rem;display:grid}
.cf-exam-stat b{font:700 clamp(1.6rem,4vw,2.4rem)/1 var(--f-head);color:var(--heading);letter-spacing:-.04em}
.cf-exam-stat span{font-size:.76rem;color:var(--muted)}
.cf-exam-clock b{font-family:var(--f-mono);color:var(--accent-strong);font-size:clamp(1.3rem,3.6vw,2rem);letter-spacing:0}
.cf-exam-map{display:flex;flex-wrap:wrap;gap:.6rem}
.cf-eg{flex:1 1 auto;text-align:left;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:14px;padding:.65rem .75rem;color:inherit;font:inherit;cursor:pointer;display:grid;gap:.5rem;min-height:48px;transition:opacity .2s,border-color .2s,background .2s}
.cf-eg:hover,.cf-eg.is-on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.cf-eg-l{font-size:.78rem;font-weight:700;color:var(--heading)}.cf-eg-l b{font:700 .72rem var(--f-mono);color:var(--accent-strong);margin-right:.2rem}
.cf-eg-c{display:flex;flex-wrap:wrap;gap:.35rem .5rem}
.cf-sub{display:inline-flex;gap:2px}
.cf-sub i{width:7px;height:7px;border-radius:2px;background:rgba(93,227,187,.32);transition:background .2s,opacity .35s}
.cf-eg.is-on .cf-sub i{background:var(--accent)}
.cf-exam-map:has(.is-on) .cf-eg:not(.is-on){opacity:.5}
.cf-exam-map.is-anim:not(.is-in) .cf-sub i{opacity:0}
.cf-exam-hint{margin:.9rem 0 0;font-size:.86rem;color:var(--muted);min-height:1.4em}
.cf-exam-hint b{color:var(--heading)}
.cf-exam-next{display:flex;align-items:center;gap:.9rem;margin-top:1.1rem;padding:.9rem 1rem;border-radius:16px;background:color-mix(in srgb,var(--accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.cf-exam-next b{display:block;font:700 1rem var(--f-head);color:var(--heading)}.cf-exam-next span{font-size:.84rem;color:var(--muted)}
.cf-arrow{font:700 1.5rem var(--f-head);color:var(--accent)}
.cf-examsec .section-head h2{font-size:clamp(1.5rem,4vw,2.6rem)}
@media (min-width:800px){.cf-exam-top{grid-template-columns:repeat(4,minmax(0,1fr))}.cf-sub i{width:9px;height:9px}}

/* =============== 7 · PLAN =============== */
.cf-plansec{background:var(--bg-alt)}
.cf-plansec .section-head h2{font-size:clamp(1.55rem,4vw,2.6rem)}
.cf-plan{display:grid;gap:1.1rem}
.cf-plan-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}
.cf-plan-ctrl p{margin:0}
.cf-weeks{display:inline-flex;gap:.4rem}
.cf-weeks button{min-width:48px;min-height:48px;border-radius:var(--r-pill);border:2px solid var(--line);background:var(--surface);font:700 1rem var(--f-mono);color:var(--text);cursor:pointer}
.cf-weeks button[aria-pressed="true"]{background:var(--heading);border-color:var(--heading);color:var(--bg-alt)}
.cf-phases{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;counter-reset:ph}
.cf-phases li{counter-increment:ph;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:.9rem 1rem;display:grid;gap:.15rem;position:relative;overflow:hidden;min-width:0}
.cf-phases li::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--gt)}
.cf-phases small{font:600 .72rem var(--f-mono);color:var(--accent-strong)}
.cf-phases b{font:700 1.1rem var(--f-head);color:var(--heading)}
.cf-phases span{font-size:.86rem;color:var(--muted)}
.cf-phases i{display:none}
.cf-planapp{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.1rem;box-shadow:var(--shadow-1);display:grid;gap:.9rem;align-content:start}
.cf-planapp-h{display:flex;justify-content:space-between;align-items:center}
.cf-planapp-h b{font:700 1.05rem var(--f-head);color:var(--heading)}
.cf-week{display:grid;gap:.4rem;font-size:.88rem}.cf-week b{font:700 1.4rem var(--f-head);color:var(--heading)}
.cf-prio{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.cf-prio li{padding:.6rem .8rem;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-weight:700;font-size:.9rem}
.cf-prio small{display:block;font:600 .66rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media (min-width:900px){
  .cf-plan{grid-template-columns:minmax(0,1.6fr) minmax(0,.9fr);align-items:start}
  .cf-plan-ctrl,.cf-phases{grid-column:1}.cf-planapp{grid-column:2;grid-row:1/3}
  .cf-phases{grid-template-columns:var(--cols,repeat(4,1fr));gap:.5rem}
  .cf-phases li{padding:1rem .85rem 1rem 1.05rem}
  .cf-phases b{font-size:1rem}
}

/* =============== 8 · PRUEBA =============== */
.cf-trial{position:relative;overflow:hidden;background:linear-gradient(135deg,#052B2F 0,#082036 55%,#0B1730 100%)}
.cf-trial-in{position:relative;z-index:1;display:grid;gap:1.6rem;align-items:center}
.cf-trial h2{margin:0;font-size:clamp(1.9rem,5.4vw,3.4rem);line-height:1.02}
.cf-trial-end{margin:.9rem 0 1.4rem;font-size:1.02rem;color:var(--text);max-width:30rem}
.cf-trial-btn{width:100%}
.cf-trial-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.cf-trial-facts li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:1rem;display:grid;gap:.2rem}
.cf-trial-facts b{font:700 clamp(2.2rem,7vw,3.6rem)/1 var(--f-head);letter-spacing:-.05em;color:#7DF0CE}
.cf-trial-facts span{font-size:.84rem;color:#C7D5E4}
@media (min-width:640px){.cf-trial-btn{width:auto}}
@media (min-width:900px){.cf-trial-in{grid-template-columns:1fr 1fr;gap:3rem}}

/* =============== 9 · MEMBRESÍA =============== */
.cf-member{background:linear-gradient(180deg,#fff 0,#E9F6F3 100%)}
.cf-member .section-head h2{font-size:clamp(1.7rem,4.4vw,3rem)}
.cf-mem-grid{display:grid;gap:1.25rem;align-items:start}
.cf-benefits{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.cf-benefits li{display:flex;align-items:center;gap:.7rem;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:.8rem .85rem;box-shadow:var(--shadow-1);min-height:64px}
.cf-benefits .ic{width:2.3rem;height:2.3rem;padding:.5rem;border-radius:12px;background:color-mix(in srgb,var(--accent) 12%,#fff);color:var(--accent-strong)}
.cf-benefits b{font:700 .9rem/1.25 var(--f-head);color:var(--heading)}
.cf-price{background:linear-gradient(170deg,#0A1424,#0D2B38);color:#E8EFF7;border-radius:var(--r-xl);padding:clamp(1.25rem,3.5vw,2rem);box-shadow:var(--shadow-2);border:1px solid #1F3B52;display:grid;gap:1rem;--muted:#A9BACD}
.cf-price-t{margin:0;font:600 .74rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#5DE3BB}
.cf-price-val{font:700 clamp(2rem,6vw,2.8rem)/1.05 var(--f-head);letter-spacing:-.04em;color:#fff}
.cf-price-val small{display:block;font:500 .9rem var(--f-body);letter-spacing:0;color:#A9BACD;margin-top:.3rem}
.cf-price-tbd{font-size:clamp(1.5rem,4.6vw,2.05rem);color:#F6C46B}
.cf-price-dev{display:none;margin:0;font-size:.76rem;color:#F6C46B}
html.proto-flags .cf-price-dev{display:block}
.cf-facts{margin:0;display:grid;gap:.5rem}
.cf-facts div{display:flex;justify-content:space-between;gap:1rem;padding:.65rem .8rem;border-radius:12px;background:rgba(255,255,255,.06);font-size:.88rem}
.cf-facts dt{color:#A9BACD}.cf-facts dd{margin:0;font-weight:700;text-align:right}
.cf-methods{display:flex;flex-wrap:wrap;gap:.4rem}
.cf-methods span{font:700 .78rem var(--f-body);padding:.4rem .7rem;border-radius:var(--r-pill);border:1px solid rgba(93,227,187,.5);color:#7DF0CE}
.cf-price .btn-ghost{color:#E8EFF7}
.cf-price .cf-fine{color:#A9BACD;margin:0}
/* v2.24.1 FINAL: el <li class="cf-plan"> de la tarjeta de precios reutilizaba .cf-plan (layout 2 columnas de la sección de planes ≥1000px) y desbordaba 6px a 1024px con planes visibles */
.cf-price .cf-plan{grid-template-columns:minmax(0,1fr);align-items:stretch}
@media (min-width:640px){.cf-benefits{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){.cf-mem-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.cf-mem-side{position:sticky;top:6rem}.cf-benefits li{padding:1rem;min-height:84px}.cf-benefits b{font-size:.95rem}}

/* =============== 11 · FAQ =============== */
.cf-faq{background:var(--bg-alt);--surface:#F4F7FC}
.cf-faq .faq summary{font-family:var(--f-head)}

/* =============== 12 · FINAL =============== */
.cf-final{position:relative;overflow:hidden;text-align:center}
.cf-final-in{position:relative;z-index:1;display:grid;justify-items:center;gap:1.2rem}
.cf-final h2{margin:0;font-size:clamp(1.8rem,5.2vw,3.3rem);line-height:1.05;max-width:22ch}
.cf-final-cta{justify-content:center}.cf-final-cta .btn{flex:1 1 auto}
.cf-final .cf-fine{margin:0}
@media (min-width:640px){.cf-final-cta .btn{flex:0 0 auto}}

/* =============== Sticky =============== */
.cf-sticky .wrap{gap:.9rem}
.cf-sticky-link{color:#7FE6C6;font-weight:700;font-size:.92rem;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
@media (max-width:640px){.cf-sticky{padding-block:.5rem}.cf-sticky .btn{min-height:48px}}

@media (prefers-reduced-motion:reduce){
  .cf-aurora::before,.cf-aurora::after,.cf-dot,.cf-flag::before{animation:none}
  .cf-result,.cf-bridge{animation:none}
}

/* --- ajustes 2 --- */
.cf-mem-left{display:grid;gap:1rem;min-width:0}
.cf-steps{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;counter-reset:st}
.cf-steps li{counter-increment:st;display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:center;background:transparent;border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent);border-radius:16px;padding:.7rem .85rem}
.cf-steps li::before{content:counter(st);grid-row:1/3;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font:700 .9rem var(--f-mono);background:var(--heading);color:#fff}
.cf-steps b{font:700 .95rem var(--f-head);color:var(--heading)}.cf-steps span{font-size:.82rem;color:var(--muted)}
.cf-code{margin:0;font-size:.9rem;color:var(--muted)}.cf-code a{font-weight:700}
@media (min-width:640px){.cf-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cf-wkbar{display:grid;grid-template-columns:repeat(var(--n,12),1fr);gap:3px;height:14px}
.cf-wkbar i{border-radius:4px;background:var(--line)}
.cf-wkbar .p0{background:#2ED3A0}.cf-wkbar .p1{background:#2AA7C9}.cf-wkbar .p2{background:#4C7BE0}.cf-wkbar .p3{background:#7A64D9}
.cf-area[data-a="1"] .cf-subs li{font-size:.92rem;padding:.5rem .8rem}
.cf-sub{gap:3px}.cf-eg-c{gap:.5rem .8rem}
@media (min-width:800px){.cf-sub i{width:12px;height:12px;border-radius:3px}.cf-eg{padding:.85rem 1rem;gap:.7rem}.cf-eg-l{font-size:.86rem}}

@media (max-width:999px){
  .cf-list-subs .cf-row:not(.is-sel){grid-template-areas:"t v" "b b"}
  .cf-list-subs .cf-row:not(.is-sel) .cf-row-l{display:none}
  .cf-list-subs .cf-row{min-height:44px;padding:.45rem .6rem}
}
.cf-bridge-map b{overflow-wrap:normal;word-break:normal}
@media (max-width:560px){
  .cf-bridge-map{grid-template-columns:1fr;gap:.35rem}
  .cf-bridge-map li{display:flex;justify-content:space-between;align-items:baseline;gap:.8rem}
  .cf-bridge-map b{text-align:right}
}

/* v2.24.1 · el hero ya llega renderizado por el servidor (sin reservar altura para contenido insertado por JavaScript) */

/* ==========================================================================
   v2 · ADICIONES (sobre 11)
   ========================================================================== */
.sprite{position:absolute}
.cf-foot-p{margin-top:1rem}
.is-w60{width:60%}
.rep-track .mark:not([style]){left:calc(var(--pass,70) * 1%)}
.cf-exam-map.is-anim:not(.is-in) .cf-sub i{opacity:0}

/* Hero: línea de precio discreta (solo con datos confirmados) */
.cf-priceline{margin:.9rem 0 0;font-size:.86rem;font-weight:600;color:var(--muted)}

/* Mini caso: más compacto en móvil (390 px) */
@media (max-width:520px){
  .cf-casesec{padding-block:1.75rem}
  .cf-case-grid{gap:.85rem}
  .cf-case{padding:.9rem}
  .cf-stem{font-size:.92rem;line-height:1.5;margin:.65rem 0 .4rem}
  .cf-q{font-size:1rem;margin-bottom:.55rem}
  .cf-opt{min-height:48px;padding:.5rem .7rem}
  .cf-opt span{font-size:.9rem}
  .cf-result{margin-top:.8rem;padding-top:.8rem}
  .cf-result-grid{gap:.4rem}
  .cf-why{margin-top:.6rem;font-size:.88rem}
  .cf-bridge{padding:1rem}
}

/* Dashboard: resumen móvil + expandir/colapsar */
.cf-summary{display:none;padding:.9rem;gap:.75rem}
.cf-summary:empty{display:none!important}
.cf-dash.is-compact .cf-summary{display:grid}
.cf-dash.is-compact .cf-dash-bar{display:none}
.cf-sum-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.cf-prio-card{background:color-mix(in srgb,var(--bad) 8%,transparent);border:1px solid color-mix(in srgb,var(--bad) 40%,var(--line));border-radius:16px;padding:.85rem;display:grid;gap:.55rem}
.cf-prio-h{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.cf-prio-h b{font:700 1.1rem/1.2 var(--f-head);color:var(--heading)}
.cf-sum-l{margin:.1rem 0 0;font:700 .68rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cf-summary .cf-list{gap:.5rem}
.cf-sum-dim{margin:0;font-size:.86rem;color:var(--muted)}.cf-sum-dim b{color:var(--heading)}
.cf-sum-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.cf-mini{border-radius:14px;padding:.7rem .75rem;display:grid;gap:.15rem;border:1px solid var(--line);background:rgba(255,255,255,.035);min-width:0}
.cf-mini small{font:700 .64rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.cf-mini b{font:700 .85rem/1.25 var(--f-head);color:var(--heading)}
.cf-mini span{font:700 .9rem var(--f-mono)}
.cf-mini.ok small,.cf-mini.ok span{color:var(--ok)}.cf-mini.weak small,.cf-mini.weak span{color:var(--bad)}
.cf-fullbtn{margin:0 .9rem .9rem;width:calc(100% - 1.8rem)}
@media (min-width:1000px){.cf-fullbtn{display:none}}
.cf-dash.is-compact .cf-full{border-top:1px solid var(--line)}

/* Diferenciación: comparación en segundos */
.cf-old p{margin:0}
.cf-old h3{margin-bottom:.6rem}
.cf-new ul{grid-template-columns:repeat(auto-fit,minmax(11.5rem,1fr))}
.cf-diff .section-head{margin-bottom:1.25rem}

/* Áreas: compactas en móvil (que se lean como cobertura, no como otra página) */
@media (max-width:899px){
  .cf-areas{gap:.5rem}
  .cf-area summary{padding:.65rem .85rem;min-height:52px;gap:0 .7rem}
  .cf-area-n{width:2rem;height:2rem;font-size:.95rem;border-radius:10px}
  .cf-area-name{font-size:.98rem}
  .cf-area::before{height:3px}
}

/* Plan: en móvil solo fases (la vista «Mi plan de estudio» queda para escritorio) */
@media (max-width:699px){
  .cf-planapp{display:none}
  .cf-phases{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
  .cf-phases li{padding:.7rem .75rem .7rem .9rem}
  .cf-phases span{font-size:.8rem}
  .cf-plan{gap:.8rem}
}

/* Prueba: hechos numéricos y de texto */
.cf-trial-facts strong{font:700 1.15rem/1.15 var(--f-head);color:#7DF0CE;letter-spacing:-.02em}
@media (max-width:639px){
  .cf-trial{padding-block:2.25rem}
  .cf-trial-in{gap:1.1rem}
  .cf-trial-facts li{padding:.75rem .85rem}
  .cf-trial-facts b{font-size:2.1rem}
  .cf-trial-end{margin:.6rem 0 1rem}
}

/* Bloque comercial intermedio (alta intención) */
.cf-intent{background:linear-gradient(135deg,#0A1830 0,#0B2438 100%);padding-block:clamp(1.75rem,4.5vw,3rem);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cf-intent-in{display:grid;gap:1.25rem;align-items:center}
.cf-intent h2{margin:.3rem 0 .8rem;font-size:clamp(1.45rem,3.6vw,2.2rem);line-height:1.1;letter-spacing:-.035em}
.cf-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.cf-chips li{font-size:.82rem;font-weight:600;padding:.4rem .7rem;border-radius:var(--r-pill);border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);color:var(--text);background:rgba(255,255,255,.05)}
.cf-intent-cta{display:grid;gap:.6rem;justify-items:start}
.cf-intent-price{margin:0;font-size:.95rem;color:var(--muted)}
.cf-intent-price b{font:700 1.7rem var(--f-head);color:#fff;letter-spacing:-.03em}
.cf-intent-link{color:#7FE6C6;font-weight:700;font-size:.92rem;text-decoration:underline;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
@media (max-width:639px){.cf-intent-cta .btn{width:100%}.cf-intent-cta{justify-items:stretch}.cf-intent-link{justify-content:center}}
@media (min-width:900px){.cf-intent-in{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2.5rem}.cf-intent-cta{justify-items:end;text-align:right}}

/* Membresía: columna lateral (precio + soporte), proceso y aviso de no repetición */
.cf-mem-side{display:grid;gap:1rem;min-width:0}
.cf-norepeat{margin:-.25rem 0 0}
.cf-process h3{margin:0 0 .6rem;font:700 1.05rem var(--f-head);color:var(--heading)}
.cf-steps{grid-template-columns:1fr}
@media (min-width:640px){.cf-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.cf-steps{grid-template-columns:repeat(4,minmax(0,1fr))}.cf-steps li{grid-template-columns:1fr;row-gap:.3rem}.cf-steps li::before{grid-row:auto}}
.cf-support{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1rem 1.1rem;box-shadow:var(--shadow-1)}
.cf-support h3{margin:0 0 .6rem;font:700 1rem var(--f-head);color:var(--heading)}
.cf-support-list{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.cf-support-a{display:flex;align-items:center;gap:.7rem;min-height:48px;padding:.5rem .7rem;border-radius:12px;border:1px solid var(--line);text-decoration:none;color:var(--heading)}
.cf-support-a:hover{border-color:var(--accent)}
.cf-support-a b{display:block;font-size:.92rem}.cf-support-a small{display:block;color:var(--muted);font-size:.8rem}
.cf-support-a .ic{color:var(--accent-strong)}
@media (max-width:639px){.cf-benefits li{padding:.6rem .7rem;min-height:56px}.cf-benefits .ic{width:2rem;height:2rem;padding:.42rem}}

/* Testimonios (existe solo con datos reales y consentimiento) */
.cf-proof{background:var(--bg)}
.cf-proof-flag{margin:0 0 1rem;font:700 .8rem var(--f-mono);color:#8a5a00;background:#FFF3D6;border:1px dashed #C99A2E;border-radius:10px;padding:.5rem .75rem;display:inline-block}
.cf-slots{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.cf-slot{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.1rem;display:grid;gap:.7rem;align-content:start}
.cf-slot-h{display:flex;align-items:center;gap:.7rem}
.cf-slot-h img{border-radius:50%;object-fit:cover}
.cf-slot-ph{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font:700 .85rem var(--f-mono);color:var(--muted);flex:none}
.cf-slot small{display:block;color:var(--muted)}
.cf-slot-q{margin:0;color:var(--text)}
.cf-slot footer{font-size:.8rem;color:var(--muted)}
@media (min-width:800px){.cf-slots{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Final más compacto */
@media (max-width:639px){.cf-final{padding-block:2.5rem}.cf-final-in{gap:.9rem}}

/* Membresía en móvil: primero precio y CTA (decisión), después detalle */
@media (max-width:999px){.cf-mem-side{order:-1}}
@media (max-width:639px){
  .cf-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}
  .cf-steps li{grid-template-columns:1fr;row-gap:.2rem;padding:.6rem .7rem}
  .cf-steps li::before{grid-row:auto;width:1.7rem;height:1.7rem;font-size:.8rem}
  .cf-steps b{font-size:.9rem}.cf-steps span{font-size:.78rem;line-height:1.35}
  .cf-benefits{gap:.4rem}
  .cf-benefits li{min-height:52px;gap:.5rem;padding:.5rem .6rem}
  .cf-benefits b{font-size:.82rem}
  .cf-benefits .ic{width:1.8rem;height:1.8rem;padding:.35rem}
  .cf-price{gap:.75rem}
}

/* Hero 1000–1199 px: columna de producto estrecha → paneles apilados (evita recorte del reporte) */
@media (min-width:1000px) and (max-width:1199px){
  .cf-win-body{grid-template-columns:minmax(0,1fr)}
}

/* Evita saltos cuando los valores del servidor se insertan (data-cfg) */
.cf-trialline b{display:inline-block;min-width:1.5ch;text-align:right}
.cf-bankcount{margin:.75rem 0 0;font-weight:600;max-width:34rem}

/* ==========================================================================
   v2.24.1 · Casos clínicos DEMO (hero visual + caso interactivo). Sin desbordes a 320 px; sin opciones ocultas.
   ========================================================================== */
.cf-hcase,.cf-hrep,.cf-win-body>*{min-width:0}
.cf-hq{margin:0 0 .6rem;font:700 .95rem/1.3 var(--f-head);color:var(--heading)}
.cf-hopts li{align-items:flex-start;overflow-wrap:anywhere}
.cf-hopts li .cf-hopt-t{flex:1;min-width:0;line-height:1.4}
.cf-hopts li i{margin-top:.05rem}
.cf-hopts li .ic{flex:none;margin-top:.15rem}
.cf-hres{overflow-wrap:anywhere}
.cf-hscore{display:grid;place-items:center;align-content:center;width:5rem;height:5rem;border-radius:50%;flex:none;border:6px solid var(--accent);background:var(--surface);line-height:1.05}
.cf-hscore b{font:700 1.25rem var(--f-head);color:var(--heading)}
.cf-hscore small{font-size:.6rem;color:var(--muted)}
.cf-hweak{min-width:0;overflow-wrap:anywhere}
.cf-hweak small{font:700 .66rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
ul.cf-hbars{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.cf-hbars li{display:grid;grid-template-columns:minmax(0,7.4rem) minmax(0,1fr) 2.6rem;align-items:center;gap:.5rem;font-size:.74rem}
.cf-hbar-n{min-width:0;line-height:1.2;overflow-wrap:anywhere}
.cf-hbar-t{display:block;height:.55rem;border-radius:99px;background:var(--surface-2);overflow:hidden}
.cf-hbar-t i{display:block;height:100%;background:var(--accent);border-radius:99px}
.cf-hbars b{text-align:right;font:700 .76rem var(--f-mono)}
@media (max-width:420px){.cf-hbars li{grid-template-columns:minmax(0,1fr) 2.6rem}.cf-hbar-t{grid-column:1/-1;grid-row:2}.cf-hbars b{grid-column:2;grid-row:1}}
.cd-meta{margin:.55rem 0 0;font-size:.78rem;color:var(--muted);overflow-wrap:anywhere}
.cd-findings{margin:.2rem 0 .8rem;padding-left:1.15rem;font-size:.93rem;line-height:1.5;color:var(--text)}
.cd-findings li{margin:.2rem 0;overflow-wrap:anywhere}
.cf-stem,.cf-q,.cf-opt span,.cf-result dd,.cf-why p{overflow-wrap:anywhere}
.cd-dis{list-style:none;margin:.4rem 0 0;padding:0;display:grid;gap:.5rem}
.cd-dis li{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:.6rem .75rem;font-size:.9rem;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.cd-dis li b{display:inline-block;margin-right:.35rem;font:700 .8rem var(--f-mono);color:var(--heading)}
.cd-dis li.is-best{border-color:var(--ok)}
.cf-case [data-cd="badge"]:focus{outline:none}
.cf-bridge .btn{white-space:normal;text-align:center}
@media (prefers-reduced-motion:reduce){.cf-result{animation:none}}

/* v2.24.1 · Responsive global — texto ampliado (150%) en 320–430px: los hijos de grid/flex no podían encoger
   (min-width:auto) y empujaban el contenido más allá del viewport. Se corrige en el componente, sin overflow-x:hidden. */
.cf-diff-grid{grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.cf-diff-grid{grid-template-columns:.7fr 1.3fr}}
.cf-diff-grid>*,.cf-win-body>*,.cf-hrep>*,.cf-hrep-h>*,.cf-hrep-top>*,.cf-hbars li>*{min-width:0}
.cf-hrep-h,.cf-hrep-top{flex-wrap:wrap}
.cf-old h3,.cf-old p,.cf-old li,.cf-new h3,.cf-new p,.cf-new li{overflow-wrap:break-word}
.cf-hbars b,.cf-hbar-t{min-width:0}
.site-header .wrap{flex-wrap:wrap;row-gap:.4rem}
.site-header .brand{min-width:0;flex:0 1 auto}
.nav-toggle{flex:0 0 auto}
.cf-trial,.cf-price{min-width:0}
/* texto ampliado: todo hijo de grid/flex de la portada puede encoger y partir palabras largas */
#contenido :where(div,ul,ol,li,article,aside,dl,dd,dt,section,details,p,h2,h3,span,b,strong,small){min-width:0}
#contenido :where(h2,h3,p,li,dd,dt,b,strong,span,small){overflow-wrap:break-word}
@media (max-width:480px){.cf-new ul{grid-template-columns:minmax(0,1fr)}.cf-new li{flex-wrap:wrap}}
/* beneficios: columnas automáticas según ancho real (con texto 150% pasa a 1 columna en vez de comprimir a ~45px) */
@media (max-width:639px){.cf-benefits{grid-template-columns:repeat(auto-fit,minmax(min(100%,10.5rem),1fr))}}
.cf-benefits .ic{flex:none}
@media (min-width:61.26em){.nav{flex-wrap:wrap;justify-content:flex-end;min-width:0}}
@media (min-width:640px){.cf-benefits{grid-template-columns:repeat(auto-fit,minmax(min(100%,10.5rem),1fr))}}