/* ==========================================================================
   QuVi · Overlay (Plan Detail) — CSS PRO (inline-compact)
   Base: core-index.css (surface/separator/brand/muted/rings/radius)
   - Tokenizado: usa tokens core cuando existen; lo faltante queda como --pd-*
   - Orden: tokens → a11y → overlay shell → header/buttons → layout/nav → views
            → cards → accordion → tables → audio → skeleton → pills → hero
   ========================================================================== */

/* ==========================================================================
   00) Tokens (overlay)
   ========================================================================== */
:root{
  /* Layout */
  --pd-maxw:1280px;--pd-h:95vh;--pd-radius:18px;--pd-sidebar-w:248px;--pd-pad-x:clamp(24px,2vw,28px);--pd-pad-y:14px;

  /* Cards: fondo opaco canónico (NO glass) */
  --pd-card-bg:#fff;

  /* Header height controls (single source of truth) */
  --pd-header-pad-y:10px;--pd-header-gap:10px;--pd-header-title-lh:1.2;--pd-header-sub-mt:1px;--pd-header-sub-fs:12px;--pd-header-sub-lh:1.1;--pd-header-icon:30px;--pd-header-close:28px;--pd-header-close-sm:34px;

  /* Audio pill height controls (header) */

  /* Text (core-first) */
  --pd-ink:var(--label,var(--ink,#0f172a));--pd-ink-mute:var(--muted-2,#6b7280);

  /* Borders (core-first) */
  --pd-border:color-mix(in oklch,var(--separator,#e6eaf0) 75%,transparent 25%);--pd-border-strong:color-mix(in oklch,var(--separator,#e6eaf0) 90%,transparent 10%);

  /* States */
  --pd-hover:color-mix(in oklch,var(--surface,#fff) 92%,var(--brand,#0d99ff) 8%);--pd-active:color-mix(in oklch,var(--surface,#fff) 90%,var(--brand,#0d99ff) 10%);

  /* Stage background (single neutral, from core) */
  --pd-stage-bg:var(--bg-subtle,#F4F8FF);

  /* Panels (glass-ish) */
  --pd-panel-bg:color-mix(in oklch,var(--surface,#fff) 84%,transparent);--pd-panel-bg2:color-mix(in oklch,var(--surface,#fff) 72%,transparent);

  /* Shadows (local) */
  --pd-shadow:0 -10px 32px rgba(15,23,42,.16);
   --pd-card-shadow:0 1px 2px rgba(15,23,42,.03),0 3px 10px rgba(2,6,23,.032);
   --pd-card-shadow-strong:0 2px 4px rgba(15,23,42,.04),0 6px 16px rgba(2,6,23,.045);

  /* Buttons */
  --pd-btn-radius:var(--qv-action-radius,9999px);--pd-btn-border:color-mix(in oklch,var(--separator,#e6eaf0) 70%,rgba(15,23,42,.22) 30%);--pd-btn-border-hover:color-mix(in oklch,var(--separator,#e6eaf0) 55%,rgba(15,23,42,.30) 45%);--pd-btn-bg:color-mix(in oklch,var(--surface,#fff) 82%,transparent);--pd-btn-bg-hover:color-mix(in oklch,var(--surface,#fff) 92%,transparent);

  /* Pills */
  --pd-pill-border:color-mix(in oklch,var(--separator,#e6eaf0) 70%,rgba(15,23,42,.16) 30%);--pd-pill-bg:color-mix(in oklch,var(--surface,#fff) 70%,transparent);

  /* Semantic tones */
  --pd-c-success-95:rgba(34,197,94,.95);--pd-c-danger-95:rgba(239,68,68,.95);
  --pd-tone-good-a:var(--pd-c-success-95);--pd-tone-good-b:rgba(6,182,212,.55);
  --pd-tone-risk-a:var(--pd-c-danger-95);--pd-tone-risk-b:rgba(245,158,11,.55);
  --pd-tone-rec-a:rgba(0.72 0.21 250);--pd-tone-rec-b:rgba(124,58,237,.55);
  --pd-tone-ctx-a:rgba(245,158,11,.92);--pd-tone-ctx-b:rgba(34,197,94,.45);

  /* Chevron (overlay source of truth) */
  --pd-chv-size:6px;--pd-chv-stroke:2px;--pd-chv-color:color-mix(in oklch,var(--pd-ink) 58%,transparent 42%);--pd-chv-dur:140ms;

  /* Legacy exact */
  --pd-glass-62:rgba(255,255,255,.62);--pd-glass-60:rgba(255,255,255,.60);--pd-glass-58:rgba(255,255,255,.58);--pd-glass-56:rgba(255,255,255,.56);
  --pd-soft-04:rgba(15,23,42,.04);--pd-soft-05:rgba(15,23,42,.05);--pd-soft-06:rgba(15,23,42,.06);--pd-soft-08:rgba(15,23,42,.08);
  --pd-ink-95:rgba(15,23,42,.95);--pd-ink-92:rgba(2,6,23,.92);--pd-ink-90:rgba(2,6,23,.90);--pd-ink-88:rgba(15,23,42,.88);--pd-ink-86:rgba(2,6,23,.86);--pd-ink-82:rgba(15,23,42,.82);--pd-ink-80:rgba(2,6,23,.80);--pd-ink-70:rgba(2,6,23,.70);--pd-ink-68:rgba(15,23,42,.68);--pd-ink-66:rgba(15,23,42,.66);--pd-ink-65:rgba(15,23,42,.65);--pd-ink-62:rgba(15,23,42,.62);--pd-ink-58:rgba(15,23,42,.58);--pd-ink-55:rgba(15,23,42,.55);--pd-ink-52:rgba(15,23,42,.52);--pd-ink-45:rgba(15,23,42,.45);

  /* Dashed (canonical) */
  --pd-dash-color:color-mix(in oklch,var(--pd-ink) 10%,transparent 90%);--pd-dash:1px dashed var(--pd-dash-color);
  --pd-dash-12:rgba(15,23,42,.12);--pd-dash-14:rgba(15,23,42,.14);--pd-dash-22:rgba(15,23,42,.22);

  /* Tables (single source of truth) */
  --pd-table-radius:14px;--pd-table-pad-y:8px;--pd-table-pad-x:12px;--pd-table-fs:13px;--pd-table-lh:1.35;
  --pd-table-ink:color-mix(in oklch,var(--pd-ink) 86%,transparent 14%);--pd-table-ink-soft:color-mix(in oklch,var(--pd-ink) 82%,transparent 18%);--pd-table-ink-strong:color-mix(in oklch,var(--pd-ink) 92%,transparent 8%);--pd-table-head-ink:color-mix(in oklch,var(--pd-ink-mute) 92%,transparent 8%);
  --pd-table-bg:color-mix(in oklch,var(--surface,#fff) 88%,color-mix(in oklch,var(--pd-ink) 8%,transparent 92%) 12%);--pd-table-shadow:inset 0 1px 0 rgba(255,255,255,.55);

    /* Badges */
   --pd-badge-bg:var(--pd-glass-62);
   --pd-badge-model:color-mix(in oklch,var(--surface,#fff) 92%,var(--brand,#0d99ff) 8%);
   --pd-badge-det:var(--pd-soft-05);
   --pd-badge-nope:color-mix(in oklch,var(--pd-c-danger-95) 12%,transparent);

  /* Mobile type scale */
    --pd-m-fs-body:13.5px;--pd-m-lh-body:1.6;
    --pd-m-fs-muted:12.5px;--pd-m-lh-muted:1.46;
    --pd-m-fs-label:11px;--pd-m-lh-label:1.24;
    --pd-m-fs-nav:13px;--pd-m-lh-nav:1.14;
    --pd-m-fs-title:16.5px;--pd-m-lh-title:1.16;
    --pd-m-fs-sub:12px;--pd-m-lh-sub:1.26;
    --pd-m-fs-section:14px;--pd-m-lh-section:1.24;
    --pd-m-fs-section-sub:12px;--pd-m-lh-section-sub:1.34;

  /* Pills (soft legacy) */
  --pd-pill-bg-soft:var(--pd-soft-06);
}

/* ==========================================================================
   01) A11y: reduced motion
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  .plan-detail-backdrop,.plan-detail-panel,.plan-detail-navitem,.pd-view,.sk::after{transition:none!important;animation:none!important;}
  /* El panel cerrado conserva su posición fuera de pantalla, sin animarla. */
  .plan-detail-navitem,.pd-view,.sk::after{transform:none!important;}
  .pd-acc>summary::after{transition:none!important;}
}

/* ==========================================================================
   02) Overlay: backdrop
   ========================================================================== */
.plan-detail-backdrop{
  position:fixed;
  inset:0;
  z-index:var(--z-modal,2000);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  background:rgba(15,23,42,0);
  -webkit-backdrop-filter:blur(0px);
  backdrop-filter:blur(0px);
  opacity:0;
  pointer-events:none;
  transition: opacity .2s ease, background .2s ease;
}
.plan-detail-backdrop.is-open{
  opacity:1;
  pointer-events:auto;
  background:rgba(15,23,42,0.22);
}
.plan-detail-backdrop.is-closing{
  opacity:0;
  pointer-events:none;
  background:rgba(15,23,42,0);
}

/* ==========================================================================
   03) Overlay: panel (grid shell)
   ========================================================================== */
.plan-detail-panel{
  width:100%;
  max-width:var(--pd-maxw);
  height:var(--pd-h);
  background:var(--pd-card-bg,#fff);
  color:var(--pd-ink);
  border-radius: var(--pd-radius) var(--pd-radius) 0 0;
  border:1px solid var(--pd-border-strong);
  border-bottom:0;
  box-shadow:var(--pd-shadow);
  transform: translate3d(0, 102%, 0) scale(1);
  will-change: transform;
  transition: transform .3s cubic-bezier(.16, 1, .3, 1);
  overflow:hidden;
  outline:none;
  contain:layout paint;
  display:grid;
  grid-template-columns:var(--pd-sidebar-w) minmax(0,1fr);
  grid-template-rows:auto auto minmax(0,1fr);
  grid-template-areas:"handle handle""sidebar header""sidebar content";
  box-shadow:var(--pd-shadow),inset -1px 0 0 var(--pd-border);
}
.plan-detail-backdrop.is-open .plan-detail-panel{
  transform: translate3d(0, 0, 0) scale(1);
}
.plan-detail-panel.dragging{
  transition: none !important;
}
.plan-detail-backdrop.is-closing .plan-detail-panel {
  transform: translate3d(0, 102%, 0) scale(0.985);
}

/* ==========================================================================
   04) Handle
   ========================================================================== */
.plan-detail-handle{grid-area:handle;justify-self:stretch;align-self:stretch;height:22px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;cursor:grab;touch-action:none;}
.plan-detail-handle::before{content:"";width:44px;height:4px;border-radius:999px;background:color-mix(in oklch,var(--separator,#e6eaf0) 80%,transparent 20%);}

/* ==========================================================================
   05) Header (height controlled via --pd-header-*)
   ========================================================================== */
.plan-detail-header{
  grid-area:header;
  position:relative;
  min-height:0;
  padding:var(--pd-header-pad-y) var(--pd-pad-x) var(--pd-header-pad-y);
  padding-right:calc(var(--pd-pad-x) + var(--pd-header-close) + 12px);
  border-bottom:1px solid var(--pd-border);
  border-left:1px solid var(--pd-border);
  cursor:default;
  /* Solidificamos un poco más el fondo para evitar ruidos visuales durante la animación */
  background:color-mix(in oklch,var(--surface,#fff) 94%,transparent 6%);
  /* Blur eliminado */
  display:grid;
  grid-template-columns:auto minmax(360px,1fr) auto;
  align-items:center;
  gap:var(--pd-header-gap);
}
.pd-hl{display:flex;align-items:center;gap:10px;min-width:0;}
.pd-titles{display:flex;flex-direction:column;min-width:0;}
.pd-title{font-weight:700;letter-spacing:-.02em;line-height:var(--pd-header-title-lh);color:var(--pd-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pd-sub{margin-top:var(--pd-header-sub-mt);font-size:var(--pd-header-sub-fs);line-height:var(--pd-header-sub-lh);color:var(--pd-ink-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.pd-brandMini{display:inline-flex;align-items:center;gap:10px;padding:0;margin:0;min-width:0;text-decoration:none;}
.pd-brandMini .brand__mark{width:28px;height:28px;border-radius:12px;font-size:14px;}
.pd-brandMini .brand__name{font-size:15px;line-height:1.02;}

.pd-planIcon{width:var(--pd-header-icon);height:var(--pd-header-icon);flex:0 0 var(--pd-header-icon);border-radius:10px;border:1px solid color-mix(in oklch,var(--separator,#e6eaf0) 70%,rgba(15,23,42,.18) 30%);background:var(--bg-subtle,#F4F8FF);box-shadow:0 1px 2px rgba(15,23,42,.06);position:relative;}
.pd-planIcon::before{content:"";position:absolute;inset:7px 8px 8px 8px;border-radius:4px;background:rgba(15,23,42,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.55);}
.pd-planIcon::after{content:"";position:absolute;width:7px;height:7px;right:7px;top:7px;border-radius:2px;background:rgba(255,255,255,.65);opacity:.9;}

.pd-audioHeader{min-width:0;}
.pd-hr{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto;justify-self:end;align-self:center;padding-right:0;position:static;}

/* Header price ico */
.pd-price-wrap{display:flex;align-items:center;gap:6px;}
.pd-price-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  flex:0 0 28px;
  inline-size:28px;
  block-size:28px;

  border-radius:9999px;

  background:color-mix(in oklch,var(--surface) 95%,var(--pd-ink) 5%);
  border:1px solid color-mix(in oklch,var(--separator) 85%,transparent);

  color:color-mix(in oklch,var(--pd-ink) 60%,transparent);

  line-height:0;
}

/* Lucide: cubre ambas formas (svg reemplaza el <i> o queda dentro) */
.pd-price-wrap svg{
  flex:0 0 18px;
  inline-size:18px;
  block-size:18px;
  stroke-width:1.8;
}

/* Header price — match renderer DOM */
.plan-detail-header .pd-price-value{display:flex;align-items:baseline;gap:10px;font-variant-numeric:tabular-nums;line-height:1.05;}
.plan-detail-header .pd-price-value .precio-principal{font-size:22px;font-weight:700;letter-spacing:-.04em;line-height:1.05;color:var(--pd-ink);}
.plan-detail-header .pd-price-value .precio-secundario{font-size:13px;font-weight:500;letter-spacing:-.04em;line-height:1.05;color:var(--pd-ink-55);}

@media (max-width:860px){
  .plan-detail-header{grid-template-columns:1fr auto;}
  .pd-audioHeader{display:none;}
}

/* Isapre mark (2-letter circle) in overlay header — canon */
.pd-isapreMark{inline-size:34px;block-size:34px;flex:0 0 34px;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;letter-spacing:.6px;line-height:1;text-transform:uppercase;font-variant-numeric:tabular-nums;user-select:none;background:color-mix(in oklch,var(--glass-95,rgba(255,255,255,.95)) 92%,var(--brand,#0d99ff) 8%);color:var(--brand);}

/* Close (X) — PROD (bg only · no border · black X) */
.plan-detail-header>.pd-x{position:absolute;top:var(--pd-header-pad-y);right:var(--pd-pad-x);appearance:none;width:var(--pd-header-close);height:var(--pd-header-close);margin:0;border:0;border-radius:999px;display:inline-grid;place-items:center;background:var(--bg-subtle,#F4F8FF);color:var(--ink,#0f172a);cursor:pointer;font-size:18px;line-height:1;background-clip:padding-box;transition:background .12s ease,transform .12s ease,box-shadow .12s ease;}
@media (hover:hover){.plan-detail-header>.pd-x:hover{background:color-mix(in oklch,var(--bg-subtle,#F4F8FF) 90%,var(--ink,#0f172a) 10%);}}
.plan-detail-header>.pd-x:active{transform:translateY(.5px);}
.plan-detail-header>.pd-x:focus-visible{outline:2px solid transparent;box-shadow:var(--qv-ring0),var(--qv-ring1);}

/* ==========================================================================
   06) Buttons
   ========================================================================== */
.pd-btn-ghost,.pd-activity-more,.plan-detail-cta.is-secondary{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:13px;line-height:1;cursor:pointer;text-decoration:none;padding:10px 12px;border-radius:var(--qv-action-radius,9999px);border:1px solid var(--pd-btn-border);background:var(--pd-btn-bg);color:color-mix(in oklch,var(--pd-ink) 78%,transparent 22%);box-shadow:none;background-clip:padding-box;transition:background .12s ease,border-color .12s ease,color .12s ease,box-shadow .12s ease;}
@media (hover:hover){.pd-btn-ghost:hover,.pd-activity-more:hover,.plan-detail-cta.is-secondary:hover{background:var(--pd-btn-bg-hover);border-color:var(--pd-btn-border-hover);color:var(--pd-ink);}}
.pd-btn-ghost:active,.pd-activity-more:active,.plan-detail-cta.is-secondary:active{filter:saturate(1.01);}
.pd-btn-ghost:focus-visible,.pd-activity-more:focus-visible,.plan-detail-cta.is-secondary:focus-visible{outline:2px solid transparent;box-shadow:var(--qv-ring0,0 0 0 2px color-mix(in oklch,var(--brand,#0d99ff) 25%,transparent)),var(--qv-ring1,0 0 0 4px color-mix(in oklch,var(--brand,#0d99ff) 45%,transparent));}

.pd-cta,.plan-detail-cta{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:13px;line-height:1;font-weight:var(--fw-700,700);cursor:pointer;text-decoration:none;padding:9px 12px;border-radius:var(--pd-btn-radius);border:1px solid color-mix(in oklch,var(--brand,#0d99ff) 55%,rgba(15,23,42,.18) 45%);background:var(--brand,#0d99ff);color:var(--surface,#fff);box-shadow:0 1px 2px rgba(15,23,42,.06);background-clip:padding-box;transition:background .12s ease,border-color .12s ease,color .12s ease,box-shadow .12s ease;}
@media (hover:hover){.pd-cta:hover,.plan-detail-cta:hover{background:var(--brand-hover,#077ee0);border-color:color-mix(in oklch,var(--brand-hover,#077ee0) 60%,rgba(15,23,42,.18) 40%);}}
.pd-cta:active,.plan-detail-cta:active{filter:saturate(1.02);}
.pd-cta:focus-visible,.plan-detail-cta:focus-visible{outline:2px solid transparent;box-shadow:var(--qv-ring0,0 0 0 2px color-mix(in oklch,var(--brand,#0d99ff) 25%,transparent)),var(--qv-ring1,0 0 0 4px color-mix(in oklch,var(--brand,#0d99ff) 45%,transparent));}

.plan-detail-cta.is-secondary{border-radius:var(--pd-btn-radius);padding:9px 12px;background:color-mix(in oklch,var(--surface,#fff) 92%,var(--bg-subtle,#f4f8ff) 8%);color:var(--pd-ink);}
.pd-cta--header-mobile{display:none;}

/* Responsive (single block; deduped safely) */
@media (max-width:720px){
  .pd-price{display:none;}
  .pd-cta,.plan-detail-cta{padding:9px 12px;}
  .pd-btn-ghost,.pd-activity-more,.plan-detail-cta.is-secondary{padding:9px 12px;}
  .plan-detail-header>.pd-x{width:var(--pd-header-close-sm);height:var(--pd-header-close-sm);}
}

/* CTA WhatsApp (misma base exacta; solo cambia color) */
.pd-cta--whatsapp{
  background:#22c55e;
  border-color:#22c55e;
  color:#fff;
}

@media (hover:hover){
  .pd-cta--whatsapp:hover{
    background:#16a34a;
    border-color:#16a34a;
    color:#fff;
  }
}

.pd-cta--whatsapp:focus-visible{
  outline:2px solid transparent;
  box-shadow:
    0 0 0 2px color-mix(in oklch,#22c55e 25%,transparent),
    0 0 0 4px color-mix(in oklch,#22c55e 45%,transparent);
}

/* ==========================================================================
   07) Layout: body
   ========================================================================== */
.plan-detail-body{display:contents;}

/* ==========================================================================
   08) Sidebar / Nav
   ========================================================================== */
.plan-detail-sidebar{grid-area:sidebar;padding:6px 10px;min-height:0;display:flex;flex-direction:column;gap:8px;background:var(--pd-card-bg,#fff);overflow:hidden;border-right:0;}
.plan-detail-nav{display:flex;flex-direction:column;gap:8px;padding:10px 0 14px;border-bottom:0;flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;}
.pd-sidebar-footer{
  flex:0 0 auto;
  padding-top:14px;
  padding-bottom:18px;
  background:var(--pd-card-bg,#fff);
}

.pd-sidebar-footer .pd-cta,
.pd-sidebar-footer .plan-detail-cta{
  display:flex;
  align-items:center;
  width:calc(100% - 26px);
  min-height:36px;
  margin-left:auto;
  margin-right:auto;
  justify-content:center;
  border-radius:var(--qv-action-radius,9999px);
  border:0;
  gap:4px;
  padding:0 9px;
  font-size:13px;
  line-height:1;
  font-weight:var(--fw-semibold);
  color:#fff;
  border:0;
  box-shadow:none;
  background:linear-gradient(180deg,color-mix(in oklch,var(--brand)86%,white 14%) 0%,var(--brand)100%);
  transition:background-image var(--motion-fast) var(--motion-ease),opacity var(--motion-fast) var(--motion-ease);
}

@media (hover:hover){
  .pd-sidebar-footer .pd-cta:hover,
  .pd-sidebar-footer .plan-detail-cta:hover{
    background:linear-gradient(180deg,color-mix(in oklch,var(--brand)80%,white 20%) 0%,color-mix(in oklch,var(--brand)95%,black 5%) 100%);
    border-color:transparent;
    color:#fff;
  }
}

.pd-sidebar-footer .pd-cta:active,
.pd-sidebar-footer .plan-detail-cta:active{
  filter:none;
  opacity:.98;
}

.pd-sidebar-footer .pd-cta:focus-visible,
.pd-sidebar-footer .plan-detail-cta:focus-visible{
  outline:2px solid color-mix(in oklch,var(--brand)40%,transparent);
  outline-offset:2px;
  box-shadow:none;
}

.pd-sidebar-footer .pd-cta + .pd-cta,
.pd-sidebar-footer .pd-cta + .plan-detail-cta,
.pd-sidebar-footer .plan-detail-cta + .pd-cta,
.pd-sidebar-footer .plan-detail-cta + .plan-detail-cta{
  margin-top:10px;
}

.plan-detail-navitem{appearance:none;border:0;background:transparent;width:100%;display:flex;align-items:center;gap:10px;padding:6px 12px 6px 10px;border-radius:10px;text-align:left;justify-content:flex-start;font:inherit;font-size:12.5px;font-weight:550;line-height:1.15;color:color-mix(in oklch,var(--pd-ink) 78%,var(--pd-ink-mute) 22%);cursor:pointer;transition:background .12s ease,color .12s ease;}

/* Hover + Selected: EXACTAMENTE los mismos colores */
@media (hover:hover){
  .plan-detail-navitem:hover{background:color-mix(in oklch,var(--surface,#fff) 92%,var(--brand,#0d99ff) 8%);color:var(--brand,#0d99ff);}
  .plan-detail-navitem:hover .pd-ico{color:var(--brand,#0d99ff);opacity:1;}
  .plan-detail-navitem:hover::after{border-right-color:var(--brand,#0d99ff);border-bottom-color:var(--brand,#0d99ff);}
}
.plan-detail-navitem.is-active,.plan-detail-navitem[aria-current]{background:color-mix(in oklch,var(--surface,#fff) 92%,var(--brand,#0d99ff) 8%);color:var(--brand,#0d99ff);}
.plan-detail-navitem.is-active .pd-ico,.plan-detail-navitem[aria-current] .pd-ico{color:var(--brand,#0d99ff);opacity:1;}
.plan-detail-navitem.is-active::after,.plan-detail-navitem[aria-current]::after{border-right-color:var(--brand,#0d99ff);border-bottom-color:var(--brand,#0d99ff);}

.plan-detail-navitem:focus-visible{outline:2px solid transparent;box-shadow:var(--qv-ring0,0 0 0 2px color-mix(in oklch,var(--brand,#0d99ff) 25%,transparent)),var(--qv-ring1,0 0 0 4px color-mix(in oklch,var(--brand,#0d99ff) 45%,transparent));}

.pd-ico{display:flex;align-items:center;justify-content:flex-start;width:18px;flex:0 0 18px;color:color-mix(in oklch,var(--pd-ink-mute) 80%,var(--pd-ink) 20%);opacity:.95;}
.pd-ico .pd-icon{display:block;}

.pd-navtext{flex:1 1 auto;min-width:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.plan-detail-navitem::after{content:"";width:4px;height:4px;flex:0 0 auto;margin-left:auto;border-right:var(--pd-chv-stroke,2px) solid var(--pd-chv-color);border-bottom:var(--pd-chv-stroke,2px) solid var(--pd-chv-color);transform:rotate(-45deg);opacity:.9;}

.plan-detail-sidebar-card{padding-top:10px;display:grid;gap:12px;}
.pd-sidebar-footer .pd-cta .cta-icon,
.pd-sidebar-footer .pd-cta i[data-lucide],
.pd-sidebar-footer .pd-cta svg.lucide,
.pd-sidebar-footer .plan-detail-cta .cta-icon,
.pd-sidebar-footer .plan-detail-cta i[data-lucide],
.pd-sidebar-footer .plan-detail-cta svg.lucide{
  width: 15px !important;
  height: 15px !important;
  display:flex;
  align-items:center;
  flex:0 0 15px;
  stroke-width:1.9;
}

/* ==========================================================================
   08.x) Sidebar: Brand (logo arriba del menú)
   ========================================================================== */
.plan-detail-sidebar .pd-brand{min-width:0;width:100%;padding:10px 10px 12px;margin:2px 0 6px;}
.plan-detail-sidebar .pd-brand .brand__mark{width:28px;height:28px;border-radius:12px;font-size:14px;}
.plan-detail-sidebar .pd-brand .brand__name{font-size:14.5px;line-height:1.05;}

/* ==========================================================================
   09) Content / Stage / Views
   ========================================================================== */
.plan-detail-content{grid-area:content;min-height:0;contain:paint;background:var(--bg-subtle,#F4F8FF);position:relative;overflow:hidden;overscroll-behavior:contain;border-left:1px solid var(--pd-border);}
.pd-stage{position:relative;height:100%;min-height:0;}
.pd-view{
  position:absolute;
  inset:0;
  padding:24px var(--pd-pad-x) 18px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  opacity:0;
  pointer-events:none;
  will-change: opacity;
  transition: none;
}
.pd-view.is-active{
  opacity:1;
  pointer-events:auto;
}
.pd-view-inner{min-height:1px;}

/* ==========================================================================
   10) Utilities: badges / muted / mono
   ========================================================================== */
.pd-badge{display:inline-flex;align-items:center;padding:4px 10px;border:0;border-radius:999px;font-size:12px;font-weight:500;letter-spacing:-.01em;}
/*.pd-badge--model{
  background:var(--success-bg);
  color:var(--success-ink);
}*/
.pd-badge--model{background:color-mix(in oklch,var(--surface,#fff) 92%,var(--brand,#0d99ff) 8%);color:var(--brand,#0d99ff);}
.pd-badge--det{background:var(--pd-soft-05);}
.pd-badge--nope{background:color-mix(in oklch,var(--pd-c-danger-95) 12%,transparent);}
.pd-sep{opacity:.55;margin:0 6px;}
.pd-muted{font-size:12px;line-height:1.25;color:var(--pd-ink-62);}
.pd-mono{font-family:var(--ff-mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);}

/* ==========================================================================
   11) Cards
   ========================================================================== */
.pd-card{background:var(--pd-card-bg,var(--surface,#fff));border:0;border-radius:16px;box-shadow:var(--pd-card-shadow);padding:12px;font-size:13px;color:color-mix(in oklch,var(--pd-ink) 92%,var(--pd-ink-mute) 8%);overflow:hidden;background-clip:padding-box;content-visibility:auto;contain-intrinsic-size:1px 220px;}
@media (hover:hover){.pd-card:hover{box-shadow:var(--pd-card-shadow);}}
.pd-card p{margin:0;}
.pd-card p+p{margin-top:8px;}
.pd-card .muted{color:var(--pd-ink-mute);}

.pd-card.pd-card--hero{position:relative;overflow:hidden;border-radius:16px;box-shadow:var(--pd-card-shadow);border:0;background:var(--pd-card-bg,var(--surface,#fff));background-clip:padding-box;}
.pd-card.pd-card--hero::before{content:none;}

/* ==========================================================================
   12) Accordion (details/summary) — canonical
   ========================================================================== */
.pd-acc{display:block;margin:24px 0;}
.pd-acc-body>.pd-acc{margin:24px 0 0;}
.pd-acc-body>.pd-acc:first-child{margin-top:0;}
.pd-acc-body>.pd-acc:last-child{margin-bottom:0;}

.pd-acc>summary{list-style:none;cursor:pointer;user-select:none;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px;}
.pd-acc>summary::-webkit-details-marker{display:none;}

.pd-acc-head{min-width:0;flex:1 1 auto;}
.pd-acc-title,.pd-acc-sub{min-width:0;}

.pd-acc-title{font-size:14px;font-weight:600;line-height:1.25;color:var(--pd-ink-90);}
.pd-acc-sub{font-size:12px;line-height:1.25;color:var(--pd-ink-62);margin-top:4px;}
.pd-acc:not([open]) .pd-acc-sub{display:none;}

.pd-acc>summary::after{content:"";width:var(--pd-chv-size);height:var(--pd-chv-size);border-right:var(--pd-chv-stroke) solid var(--pd-chv-color);border-bottom:var(--pd-chv-stroke) solid var(--pd-chv-color);transform:rotate(45deg);transform-origin:50% 50%;flex:0 0 auto;margin-top:2px;transition:transform var(--pd-chv-dur) ease;}
.pd-acc[open]>summary::after{transform:rotate(225deg);}

.pd-acc:not(.pd-disclosure)>summary:focus-visible{outline:2px solid transparent;box-shadow:var(--qv-ring0,0 0 0 2px color-mix(in oklch,var(--brand,#0d99ff) 25%,transparent)),var(--qv-ring1,0 0 0 4px color-mix(in oklch,var(--brand,#0d99ff) 45%,transparent));border-radius:14px;}

.pd-acc-body{display:block;padding:0 12px 12px;}

/* Gap canónico ENTRE summary (con subtítulo) y contenido */
.pd-acc:has(.pd-acc-sub)>.pd-acc-body{padding-top:12px;}

/* ==========================================================================
   13) Tables (canonical) + alias .pd-pe-table*
   ========================================================================== */
.pd-table-wrap,.pd-pe-table-wrap{border-radius:var(--pd-table-radius);overflow:hidden;background:var(--pd-table-bg);background-clip:padding-box;box-shadow:var(--pd-table-shadow);}
.pd-table,.pd-pe-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--pd-table-fs);line-height:var(--pd-table-lh);font-weight:500;color:var(--pd-table-ink);font-variant-numeric:tabular-nums;}
.pd-table thead th,.pd-pe-table thead th{padding:var(--pd-table-pad-y) var(--pd-table-pad-x);text-align:left;font-weight:600;color:var(--pd-table-head-ink);border-bottom:var(--pd-dash);background:transparent;}
.pd-table thead th.ta-r,.pd-pe-table thead th.ta-r{text-align:right;}
.pd-table tbody tr,.pd-pe-table tbody tr{border-bottom:0;box-shadow:none;background-image:none;}
.pd-table tbody td,.pd-pe-table tbody td{padding:var(--pd-table-pad-y) var(--pd-table-pad-x);color:var(--pd-table-ink-soft);background:transparent;border-bottom:0;box-shadow:none;background-image:none;}
.pd-table tbody tr+tr td,.pd-pe-table tbody tr+tr td{border-top:var(--pd-dash);}
.pd-table tbody td.ta-r,.pd-pe-table tbody td.ta-r{text-align:right;letter-spacing:-.01em;color:var(--pd-table-ink-strong);}

/* ==========================================================================
   14) Audio — contenedor compartido
   ========================================================================== */
#pdAudioSlot audio,#pdAudioEl{display:none;width:0;height:0;opacity:0;pointer-events:none;}
.pd-audioHeader{padding:0 14px;max-width:500px;justify-self:center;width:100%;}
@media (max-width:520px){.pd-audioHeader{padding:0 10px;}}

/* ==========================================================================
   15) Skeleton
   ========================================================================== */
.sk{position:relative;overflow:hidden;border-radius:10px;background:var(--pd-soft-08);}
.sk::after{content:"";position:absolute;inset:0;transform:translateX(-55%);background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);animation:sk-shimmer 1.15s ease-in-out infinite;}
.sk-title{height:12px;width:78%;margin-bottom:8px;}
.sk-sub{height:10px;width:92%;margin-bottom:10px;opacity:.9;}
.sk-time{height:10px;width:40%;opacity:.8;}
.sk-kpi-title{height:10px;width:34%;margin:6px 0 12px;}
.sk-kpi-row{height:36px;width:100%;border-radius:14px;}
@keyframes sk-shimmer{0%{transform:translateX(-55%);}100%{transform:translateX(55%);}}

/* ==========================================================================
   16) Pills (badge, no buttons)
   ========================================================================== */
.pd-kpi-pill,.pd-pill-uf{display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1;padding:4px 8px;border-radius:var(--rad-pill,9999px);border:1px solid var(--stroke-2);background:rgba(248,250,252,.8);color:var(--muted);white-space:nowrap;}
.pd-kpi-pill.is-neutral{background:rgba(248,250,252,.8);border-color:var(--stroke-1);color:var(--muted);}
.pd-kpi-pill.is-neutral-brand{background:color-mix(in oklch,var(--brand) 10%,white 90%);border-color:color-mix(in oklch,var(--brand) 16%,white 84%);color:var(--brand);}
.pd-kpi-pill.is-good{background:var(--success-soft);border-color:var(--ok-stroke);color:var(--success);}
.pd-kpi-pill.is-warn{background:var(--warn-bg);border-color:var(--warn-stroke);color:var(--warn-ink);}
.pd-kpi-value{font-size:22px;font-weight:600;letter-spacing:-.02em;margin-bottom:4px;font-variant-numeric:tabular-nums;}
.pd-kpi-foot{font-size:12px;color:var(--pd-ink-55);}

/* ==========================================================================
   17) Common blocks
   ========================================================================== */
.pd-mainrow{display:grid;grid-template-columns:1.65fr .95fr;gap:12px;margin-bottom:12px;}
.pd-panel-body{padding:12px 14px;}
.pd-divider{height:1px;background:var(--pd-soft-08);margin:12px 0;}
.pd-copy{padding-bottom:6px;}
.pd-copy .pd-res-text{font-size:13.5px;line-height:1.65;color:var(--pd-ink-86);margin:0 0 6px;}

/* ==========================================================================
   18) Hero
   ========================================================================== */

/* base */
.pd-hero-rail{display:none;}
.pd-card.pd-hero{position:relative;padding:24px;}
.pd-hero-grid{position:relative;display:grid;grid-template-columns:1.25fr 1fr;gap:24px;align-items:stretch;}

/* score card */
.pd-hero-score{padding:24px;min-width:0;display:flex;flex-direction:column;background:var(--pd-card-bg,#fff);border:0;border-radius:16px;box-shadow:var(--pd-card-shadow);overflow:hidden;background-clip:padding-box;}
.pd-hero-score-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;min-width:0;}
.pd-hero-score-main{min-width:0;}
.pd-hero-score-side{display:flex;flex-direction:column;align-items:flex-end;text-align:right;min-width:0;max-width:52%;}
.pd-hero-score-top{display:flex;align-items:baseline;gap:10px;}
.pd-hero-score-value{font-size:clamp(36px,4.2vw,48px);font-weight:700;letter-spacing:-.04em;line-height:1;color:var(--pd-ink-92);font-variant-numeric:tabular-nums;}
.pd-hero-score-max{font-size:14px;font-weight:600;color:var(--pd-ink-55);}
.pd-hero-score-label{font-size:11px;font-weight:600;letter-spacing:.01em;text-transform:uppercase;color:color-mix(in oklch,var(--pd-ink) 35%,transparent);}
.pd-hero-score-tag{margin-top:10px;display:inline-flex;align-items:center;padding:4px 8px;border:0;border-radius:var(--r-md);background:var(--pd-soft-05);color:var(--pd-ink-86);font-size:12px;font-weight:600;letter-spacing:-.01em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pd-hero-score-side .pd-hero-score-label{margin-top:0;}
.pd-hero-score-side .pd-hero-score-tag{margin-top:8px;padding:7px 10px;font-size:12px;}

/* rank cards */
.pd-rank-card{width:100%;padding:24px;background:var(--pd-card-bg,#fff);border:0;border-radius:16px;box-shadow:var(--pd-card-shadow);overflow:hidden;background-clip:padding-box;}
.pd-hero-ranksGrid{display:grid;grid-template-rows:1fr 1fr;gap:16px;height:100%;min-height:0;min-width:0;align-content:start;}
.pd-hero-ranksGrid>.pd-rank-card{height:100%;display:flex;flex-direction:row;align-items:flex-start;gap:10px;}
.pd-rank-content{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;}
.pd-rank-value{margin-top:0;font-size:16px;font-weight:600;letter-spacing:-.03em;line-height:1.2;color:var(--muted);font-variant-numeric:tabular-nums;}
.pd-rank-sub{margin-top:0;font-size:12px;line-height:1.25;color:var(--pd-ink-65);}

/* shared badge / icon */
.pd-badge{display:inline-flex;align-items:center;gap:6px;}
.pd-badge svg.lucide{flex:0 0 14px;inline-size:14px;block-size:14px;stroke-width:2;}
.pd-mini-ico,.pd-rank-ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;inline-size:28px;block-size:28px;border-radius:9999px;background:color-mix(in oklch,var(--brand) 10%,white 90%);border:1px solid color-mix(in oklch,var(--brand) 16%,white 84%);color:var(--brand);line-height:0;}
.pd-rank-ico{margin-top:2px;}
.pd-mini-ico i[data-lucide],.pd-rank-ico i[data-lucide]{display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px;inline-size:18px;block-size:18px;}
.pd-mini-ico svg.lucide,.pd-rank-ico svg.lucide{display:block;flex:0 0 18px;inline-size:18px;block-size:18px;stroke-width:1.9;}

/* mini panel */
.pd-hero-mini{margin-top:auto;}
.pd-mini-panel{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:center;margin-top:12px;padding-top:12px;border:0;border-top:1px dashed color-mix(in oklch,var(--pd-ink) 14%,transparent);background:transparent;box-shadow:none;}
.pd-mini-head{display:flex;align-items:flex-start;gap:10px;min-width:0;}
.pd-mini-text{display:flex;flex-direction:column;min-width:0;}
.pd-mini-cell{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:0 12px 0 0;}
.pd-mini-cell:last-child{padding:0 0 0 12px;}
.pd-mini-v{display:flex;align-items:center;min-width:0;font-size:14px;font-weight:600;letter-spacing:-.01em;line-height:1.1;color:var(--pd-ink-90);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pd-mini-v-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pd-mini-l{margin-top:2px;font-size:12px;color:var(--pd-ink-65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pd-mini-div{width:0;height:100%;min-height:26px;border-left:1px dashed color-mix(in oklch,var(--pd-ink) 14%,transparent);opacity:.95;}

/* tablet / mobile stack */
@media (max-width:720px){
.pd-hero-grid{grid-template-columns:1fr;}
}

/* small phones */
@media (max-width:480px){
.pd-hero-score{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"badge side""main side""mini mini";column-gap:14px;row-gap:6px;align-content:start;}
.pd-hero-score>.pd-badge,.pd-hero-score .pd-hero-badges{grid-area:badge;margin:0;align-self:start;}
.pd-hero-score-head{display:contents;}
.pd-hero-score-main{grid-area:main;min-width:0;}
.pd-hero-score-side{grid-area:side;display:flex;flex-direction:column;align-items:flex-end;text-align:right;justify-content:flex-start;min-width:0;max-width:none;margin:0;}
.pd-hero-mini{grid-area:mini;margin-top:2px;}
.pd-mini-panel{grid-template-columns:1fr;gap:10px;padding-top:10px;}
.pd-mini-div{width:100%;height:0;min-height:0;border-left:0;border-top:1px dashed color-mix(in oklch,var(--pd-ink) 14%,transparent);}
.pd-mini-cell{padding:0;}
.pd-mini-cell:last-child{padding:0;}
}

/* very small phones */
@media (max-width:420px){
.pd-hero-score-head{flex-direction:column;align-items:flex-start;}
.pd-hero-score-side{align-items:flex-start;text-align:left;max-width:none;}
.pd-hero-score-tag{white-space:normal;}
}

/* ==========================================================================
   19) Linklike
   ========================================================================== */
.pd-linklike{appearance:none;border:0;background:transparent;padding:0;margin:0;display:inline;min-height:0;line-height:inherit;vertical-align:baseline;font:inherit;font-weight:600;letter-spacing:-.01em;color:color-mix(in oklch,var(--pd-ink) 88%,var(--brand,#0d99ff));cursor:pointer;}
.pd-linklike:hover{color:var(--brand,#0d99ff);}
.pd-linklike:focus-visible{outline:2px solid color-mix(in oklch,var(--brand,#0d99ff) 45%,transparent);outline-offset:2px;}
.pd-linklike:active{transform:none;}

/* ==========================================================================
   20) Lock body scroll
   ========================================================================== */
html.plan-detail-open,body.plan-detail-open{overscroll-behavior:none;}

/* ==========================================================================
   21) Switch modo aprender overlay
   ========================================================================== */
.pd-sidebar-learn{
  margin:0 0 14px;
  padding-bottom:14px;
  border-bottom:1px solid var(--pd-border);
}

.pd-sidebar-learn-switch{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:8px 10px;
  border:1px solid rgba(15,23,42,.08);
  border-radius: 11px;
  background:rgba(255,255,255,.82);
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.pd-sidebar-learn-switch:hover{
  background:rgba(255,255,255,.92);
  border-color:rgba(15,23,42,.12);
}

.pd-sidebar-learn-copywrap{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
  flex:1 1 auto;
}

.pd-sidebar-learn-lead{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#0f172a;
  line-height:0;
}

.pd-sidebar-learn-lead i[data-lucide]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  inline-size:15px;
  block-size:15px;
}

.pd-sidebar-learn-lead svg.lucide{
  display:block;
  inline-size:15px;
  block-size:15px;
  stroke-width:1.9;
}

.pd-sidebar-learn-copy{
  display:flex;
  flex-direction:column;
  min-width:0;
  flex:1 1 auto;
}

.pd-sidebar-learn-title{
  font-size:12px;
  line-height:1.1;
  font-weight:600;
  color:#0f172a;
  letter-spacing:-.01em;
}

.pd-sidebar-learn-sub{
  margin-top:1px;
  font-size:10px;
  line-height:1.25;
  color:#64748b;
}

.pd-switch{
  position:relative;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.pd-switch-input{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
}

.pd-switch-ui{
  display:block;
  width:30px;
  height:17px;
  border-radius:999px;
  background:rgba(148,163,184,.34);
  position:relative;
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.05);
  transition:background .2s ease,box-shadow .2s ease;
}

.pd-switch-ui::after{
  content:"";
  position:absolute;
  top:2px;
  left:2px;
  width:13px;
  height:13px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.16);
  transition:transform .2s ease;
}

.pd-switch-input:checked + .pd-switch-ui{
  background:var(--success,#16a34a);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--success,#16a34a) 28%,transparent);
}

.pd-switch-input:checked + .pd-switch-ui::after{
  transform:translateX(13px);
}

.pd-switch-input:focus-visible + .pd-switch-ui{
  outline:2px solid color-mix(in srgb,var(--success,#16a34a) 22%,transparent);
  outline-offset:2px;
}

/* 13. Visor PDF: controles discretos y documento sin tarjeta contenedora. */
.pd-pdf{container:pdf-viewer / inline-size;min-width:0;color:var(--ink,#0b1220);}
.pd-pdf [hidden]{display:none!important;}
.pd-pdf-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 16px;}
.pd-pdf-pagination,.pd-pdf-zoom{display:flex;align-items:center;gap:4px;}
.pd-pdf-toolbar button,.pd-pdf-link,.pd-pdf-status button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:40px;min-height:40px;padding:8px;border:0;border-radius:8px;background:transparent;color:inherit;font:inherit;font-size:13px;line-height:1.3;text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:none;}
.pd-pdf-toolbar button:not([data-pdf-action="fit"]){border-radius:50%;}
.pd-pdf-link,.pd-pdf-status button{border-radius:var(--qv-action-radius,9999px);}
.pd-pdf-toolbar svg{flex:none;width:16px;height:16px;stroke-width:1.7;}
.pd-pdf-toolbar button:disabled{opacity:.35;cursor:default;}
.pd-pdf-toolbar button:not(:disabled):hover,.pd-pdf-link:hover,.pd-pdf-status button:hover{background:var(--qpd-hover,#eef2f6);color:var(--ink,#0b1220);}
.pd-pdf :is(button,a,.pd-pdf-viewport):focus-visible{outline:2px solid var(--brand,#008bff);outline-offset:3px;}
.pd-pdf-pagination span,.pd-pdf-zoom output{font-size:12px;line-height:1.3;font-variant-numeric:tabular-nums;white-space:nowrap;}
.pd-pdf-pagination span{min-width:95px;text-align:center;}
.pd-pdf-zoom output{min-width:44px;text-align:center;color:var(--muted,#64748b);}
.pd-pdf-zoom [data-pdf-action="fit"]{margin-left:8px;padding-inline:12px;border-left:1px solid var(--qpd-divider,#dfe6ef);border-radius:0 8px 8px 0;}
.pd-pdf-link{padding-inline:12px;}
.pd-pdf-status{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;min-height:180px;padding:32px;text-align:center;color:var(--muted,#64748b);font-size:14px;line-height:1.6;background:#eef1f5;border-radius:12px;}
.pd-pdf-status:has(+.pd-pdf-viewport:not([hidden])){min-height:0;margin-bottom:16px;padding:12px 16px;}
.pd-pdf-status button{background:#fff;border:1px solid var(--qpd-divider,#dfe6ef);padding-inline:16px;}
.pd-pdf-viewport{position:relative;height:clamp(360px,70dvh,900px);overflow:auto;padding:16px;border:1px solid var(--qpd-divider,#dfe6ef);border-radius:12px;background:#eef1f5;overscroll-behavior:contain;overflow-anchor:none;scroll-behavior:auto;touch-action:none;}
.pd-pdf-stack{position:relative;display:grid;gap:16px;align-content:start;margin:0 auto;}
.pd-pdf-page{position:relative;box-sizing:content-box;overflow:hidden;background:#fff;box-shadow:0 1px 4px #0b122012;}
.pd-pdf-page:not(.is-rendered)::before{content:"Página " attr(data-page-number);position:absolute;inset:0;display:grid;place-content:center;color:var(--muted,#64748b);font-size:14px;}
.pd-pdf-page[data-pdf-error]:not(.is-rendered)::before{content:attr(data-pdf-error);}
.pd-pdf-page canvas{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;}
/* Capa de texto PDF.js: selección real sobre el dibujo, sin duplicar texto visible. */
.pd-pdf-text{position:absolute;inset:0;overflow:hidden;line-height:1;text-align:initial;text-size-adjust:none;transform-origin:0 0;}
.pd-pdf-text :is(span,br){position:absolute;color:transparent;white-space:pre;cursor:text;transform-origin:0 0;}
.pd-pdf-text .markedContent{top:0;height:0;}
.pd-pdf-text ::selection{background:#008bff40;}
@container pdf-viewer (max-width:720px){
  .pd-pdf-toolbar{display:grid;grid-template-columns:1fr auto;gap:8px;}
  .pd-pdf-pagination{justify-self:start;}
  .pd-pdf-link{grid-area:1 / 2;justify-self:end;}
  .pd-pdf-zoom{grid-column:1 / -1;justify-self:center;}
  .pd-pdf-toolbar button,.pd-pdf-link{min-width:44px;min-height:44px;}
}
@container pdf-viewer (max-width:340px){
  .pd-pdf-pagination span{min-width:84px;font-size:12px;}
  .pd-pdf-pagination{gap:0;}
  .pd-pdf-link{gap:6px;padding-inline:6px;font-size:13px;}
  .pd-pdf-zoom{gap:2px;}
  .pd-pdf-zoom [data-pdf-action="fit"]{margin-left:2px;padding-inline:8px;font-size:13px;}
}
@media (max-width:768px){
  .pd-pdf-viewport{height:68dvh;min-height:320px;}
}

/* ==========================================================================
   23) Mobile type system
   ========================================================================== */
@media (max-width:768px){
.pd-title{font-size:var(--pd-m-fs-title);line-height:var(--pd-m-lh-title);}
.pd-sub{font-size:var(--pd-m-fs-sub);line-height:var(--pd-m-lh-sub);}
.plan-detail-navitem{font-size:var(--pd-m-fs-nav);line-height:var(--pd-m-lh-nav);}
.pd-card{font-size:var(--pd-m-fs-body);line-height:var(--pd-m-lh-body);}
.pd-muted{font-size:var(--pd-m-fs-muted);line-height:var(--pd-m-lh-muted);}
.pd-acc-title{font-size:var(--pd-m-fs-section);line-height:var(--pd-m-lh-section);}
.pd-acc-sub{font-size:var(--pd-m-fs-section-sub);line-height:var(--pd-m-lh-section-sub);}
.pd-kpi-foot{font-size:var(--pd-m-fs-muted);line-height:var(--pd-m-lh-muted);}
.pd-copy .pd-res-text{font-size:var(--pd-m-fs-body);line-height:1.62;}
}

@media (max-width:420px){
:root{--pd-m-fs-body:13px;--pd-m-fs-muted:12px;--pd-m-fs-label:10.5px;--pd-m-fs-nav:12.5px;--pd-m-fs-title:15.5px;--pd-m-fs-sub:11.5px;--pd-m-fs-section:13.5px;--pd-m-fs-section-sub:11.5px;}
}

/* ==========================================================================
   24) Mobile fullscreen + tabs nav
   ========================================================================== */
@media (max-width:768px){
:root{--pd-h:100dvh;--pd-radius:0px;--pd-pad-x:16px;--pd-pad-y:12px;--pd-header-pad-y:13px;--pd-header-gap:12px;--pd-header-icon:28px;--pd-header-close:34px;--pd-header-close-sm:34px;--pd-mobile-header-pad-x:18px;--pd-mobile-tabs-side-pad:20px;--pd-mobile-tabs-h:110px;}

.plan-detail-backdrop{align-items:stretch;background:rgba(15,23,42,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.plan-detail-panel{max-width:none;width:100vw;height:100dvh;min-height:100dvh;max-height:100dvh;border:0;border-radius:0;box-shadow:none;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"header""sidebar""content";}
.plan-detail-handle{display:none;}

.plan-detail-header{padding:calc(var(--pd-header-pad-y) + env(safe-area-inset-top,0px)) var(--pd-mobile-header-pad-x) var(--pd-header-pad-y);padding-right:calc(var(--pd-mobile-header-pad-x) + var(--pd-header-close) + 12px);border-left:0;border-bottom:1px solid var(--pd-border);background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;grid-template-columns:minmax(0,1fr) auto;gap:var(--pd-header-gap);}
.pd-hl{min-width:0;padding-right:92px;}
.pd-cta--header-mobile{display:inline-flex;position:absolute;top:calc(var(--pd-header-pad-y) + env(safe-area-inset-top,0px));right:calc(var(--pd-mobile-header-pad-x) + var(--pd-header-close-sm) + 10px);min-height:34px;padding:0 11px;border:0;outline:0;border-radius:999px;font-size:12.5px;line-height:1;white-space:nowrap;z-index:2;box-shadow:0 1px 2px rgba(15,23,42,.06);}
.pd-cta--header-mobile .cta-icon,.pd-cta--header-mobile i[data-lucide],.pd-cta--header-mobile svg.lucide{width:15px;height:15px;display:block;flex:0 0 15px;stroke-width:1.9;}
.pd-title{font-size:var(--pd-m-fs-title);line-height:var(--pd-m-lh-title);}
.pd-sub{font-size:var(--pd-m-fs-sub);line-height:var(--pd-m-lh-sub);}
.pd-audioHeader,.plan-detail-header .pd-price{display:none;}
.plan-detail-header .pd-price-value{gap:8px;}
.plan-detail-header .pd-price-value .precio-principal{font-size:18px;}
.plan-detail-header .pd-price-value .precio-secundario{font-size:11px;}
.plan-detail-header>.pd-x{top:calc(var(--pd-header-pad-y) + env(safe-area-inset-top,0px));right:var(--pd-mobile-header-pad-x);width:var(--pd-header-close-sm);height:var(--pd-header-close-sm);}

.plan-detail-sidebar{position:relative;z-index:3;padding:0;gap:0;min-height:var(--pd-mobile-tabs-h);border-right:0;border-bottom:1px solid var(--pd-border);background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;overflow:hidden;isolation:isolate;}
.plan-detail-sidebar .pd-brand,.pd-sidebar-footer,.pd-sidebar-learn{display:none;}
.plan-detail-sidebar::before{display:none;}
.plan-detail-sidebar::after{content:"›";position:absolute;top:0;right:0;bottom:0;width:28px;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;background:linear-gradient(to left,#fff 0%,rgba(255,255,255,.94) 42%,rgba(255,255,255,0) 100%);color:rgba(15,23,42,.52);font-size:22px;font-weight:500;line-height:1;pointer-events:none;z-index:4;}

.plan-detail-nav{display:flex;flex-direction:row;align-items:stretch;gap:8px;min-height:calc(var(--pd-mobile-tabs-h) - 22px);overflow-x:auto;overflow-y:hidden;padding:10px var(--pd-mobile-tabs-side-pad) 12px;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;overscroll-behavior-x:contain;overscroll-behavior-y:none;scroll-padding-inline:var(--pd-mobile-tabs-side-pad);position:relative;z-index:3;}
.plan-detail-nav::-webkit-scrollbar{display:none;}
.plan-detail-nav> :first-child{margin-left:2px;}
.plan-detail-nav> :last-child{margin-right:6px;}

.plan-detail-navitem{width:106px;min-width:106px;max-width:106px;flex:0 0 106px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:12px 8px 11px;border:0;border-radius:16px;background:color-mix(in oklch,var(--surface,#fff) 95%,var(--brand,#0d99ff) 5%);color:var(--brand,#0d99ff);font-size:13px;line-height:1.08;text-align:center;scroll-snap-align:start;position:relative;transition:background .16s ease,transform .16s ease,color .16s ease,border-color .16s ease;}
.plan-detail-navitem::after{display:none;}
.plan-detail-navitem + .plan-detail-navitem::before{display:none;}

.pd-ico{width:26px;flex:0 0 26px;display:flex;align-items:center;justify-content:center;color:currentColor;opacity:1;}
.pd-ico .pd-icon,.pd-ico i[data-lucide],.pd-ico svg.lucide{width:26px;height:26px;stroke-width:1.45;}

.pd-navtext{display:block;width:100%;white-space:normal;overflow:hidden;text-overflow:unset;font-size:13px;line-height:1.05;font-weight:500;letter-spacing:-.02em;text-align:center;text-wrap:balance;}

.plan-detail-navitem:hover{background:color-mix(in oklch,var(--surface,#fff) 91%,var(--brand,#0d99ff) 9%) !important;border:0 !important;box-shadow:none !important;color:var(--brand,#0d99ff);}
.plan-detail-navitem:hover .pd-ico{color:var(--brand,#0d99ff);opacity:1;}

.plan-detail-navitem.is-active,.plan-detail-navitem[aria-current]{background:color-mix(in oklch,var(--brand,#0d99ff) 14%,white 86%) !important;border:1px solid color-mix(in oklch,var(--brand,#0d99ff) 22%,white 78%) !important;box-shadow:none !important;color:var(--brand,#0d99ff);transform:translateY(-1px);}
.plan-detail-navitem.is-active .pd-ico,.plan-detail-navitem[aria-current] .pd-ico{color:var(--brand,#0d99ff);opacity:1;}

.plan-detail-navitem.is-disabled{opacity:.48;}

.plan-detail-content{border-left:0;background:var(--pd-stage-bg);margin-top:calc(var(--pd-mobile-tabs-h) * -1);position:relative;z-index:1;}
.pd-stage{height:100%;min-height:0;}
.pd-view{padding:calc(16px + var(--pd-mobile-tabs-h)) var(--pd-pad-x) calc(20px + env(safe-area-inset-bottom,0px));}
.pd-card{border-radius:18px;}
}

@media (max-width:560px){
:root{--pd-mobile-header-pad-x:17px;--pd-mobile-tabs-side-pad:18px;--pd-mobile-tabs-h:104px;}
.plan-detail-nav{padding-top:9px;padding-bottom:11px;}
.plan-detail-navitem{width:100px;min-width:100px;max-width:100px;flex-basis:100px;padding:11px 7px 10px;}
.pd-ico{width:24px;flex-basis:24px;}
.pd-ico .pd-icon,.pd-ico i[data-lucide],.pd-ico svg.lucide{width:24px;height:24px;}
.pd-navtext{font-size:12.5px;}
}

@media (max-width:420px){
:root{--pd-mobile-header-pad-x:16px;--pd-mobile-tabs-side-pad:16px;--pd-mobile-tabs-h:98px;}
.plan-detail-navitem{width:94px;min-width:94px;max-width:94px;flex-basis:94px;padding:10px 6px 9px;}
.pd-ico{width:22px;flex-basis:22px;}
.pd-ico .pd-icon,.pd-ico i[data-lucide],.pd-ico svg.lucide{width:22px;height:22px;}
.pd-navtext{font-size:12px;line-height:1.03;}
.pd-cta--header-mobile{padding:0 10px;font-size:12px;}
}

/* Lectura compartida de Resumen y Análisis; antes residía en Actividad. */
.qv-insight-head{text-align:center;padding:2px 8px 24px;}
.qv-insight-title{max-width:920px;margin:0 auto 14px;font-size:clamp(24px,2.4vw,30px);line-height:1.06;font-weight:700;letter-spacing:-.04em;color:var(--pd-ink-92);text-wrap:balance;}
.qv-insight-body{display:grid;gap:12px;margin:0 auto;max-width:76ch;font-size:14px;line-height:1.55;color:var(--pd-ink-70);text-wrap:pretty;}
.qv-insight-copy{max-width:720px;margin:0 auto;font-size:14px;line-height:1.65;color:var(--pd-ink);text-align:center;}
@media (max-width:720px){
.qv-insight-head{padding:4px 2px 16px;}
.qv-insight-title{font-size:clamp(24px,7vw,32px);}
.qv-insight-body{font-size:14px;line-height:1.62;}
}

/* Cabeceras equivalentes: un único origen, interlineado y ancho de introducción. */
.pd-overview{container:pd-overview / inline-size;box-sizing:border-box;padding:24px;display:grid;align-content:center;}
.pd-overview-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(420px,1.2fr);gap:28px;align-items:center;}
.pd-overview-intro{min-width:0;display:grid;gap:10px;}
.pd-overview-intro .pd-overview-title{margin:0;font-size:var(--qpd-title-size,20px);font-weight:600;line-height:1.25;letter-spacing:-.02em;color:var(--qpd-text-ink,var(--pd-ink));}
.pd-overview-intro .pd-overview-subtitle{margin:0;font-size:var(--qpd-body-size,13px);font-weight:400;line-height:1.5;color:var(--qpd-text-muted,var(--pd-ink-mute));}
@container pd-overview (max-width:752px){.pd-overview-layout{grid-template-columns:minmax(0,1fr);gap:24px;}}

/* Expansibles: secciones principales y detalles internos con el mismo control. */
.pd-disclosure>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;cursor:pointer;margin-inline:-12px;padding:16px 12px;border-radius:8px;font-size:var(--qpd-body-size,13px);font-weight:500;line-height:1.5;color:var(--qpd-text-ink,var(--pd-ink));}
.pd-disclosure>summary .pd-acc-title{font:inherit;color:inherit;}
.pd-disclosure>summary::-webkit-details-marker{display:none;}
.pd-disclosure>summary::marker{content:"";}
.pd-disclosure>summary::after{content:"";display:block;width:7px;height:7px;flex:0 0 7px;border-right:1.7px solid var(--pd-ink-mute);border-bottom:1.7px solid var(--pd-ink-mute);margin:0 2px 3px 0;transform:rotate(45deg);transition:transform .14s ease;}
.pd-disclosure[open]>summary::after{transform:rotate(225deg);margin-bottom:-3px;}
.pd-disclosure>summary:hover{color:var(--qpd-text-ink,var(--pd-ink));background:var(--qpd-disclosure-hover,#f8fafc);}
.pd-disclosure>summary:focus-visible{outline:2px solid var(--brand);outline-offset:-3px;box-shadow:none;}
.pd-disclosure-card.pd-card{padding:0;}
.pd-disclosure-card>.pd-disclosure{margin:0;border:0;}
:is(.pd-disclosure-card.pd-disclosure,.pd-disclosure-card>.pd-disclosure)>summary{margin-inline:0;padding:24px;border-radius:0;font-size:var(--qpd-section-size,14px);font-weight:600;line-height:1.25;}
:is(.pd-disclosure-card.pd-disclosure,.pd-disclosure-card>.pd-disclosure)>:is(.pd-acc-body,.pd-activity-disclosure-body){padding:0 24px 24px;}
@media(prefers-reduced-motion:reduce){.pd-disclosure>summary::after{transition:none;}}