  :root {
    --bg: #F3F4FA; --surface: #FFFFFF; --surface-2: #E8EAF3;
    --text: #2B2E52; --text-muted: #62658A; --border: #D7DAEA;
    --primary: #3D4178; --primary-dark: #2B2E52; --primary-tint: #E8EAF3;
    --accent: #E2694F; --accent-dark: #C8543C; --accent-tint: #FBE7E1; --accent-text: #B3442A;
    --shadow: 0 1px 2px rgba(20, 30, 27, 0.06);
    --radius: 16px;
    --serif: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
    --sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  }
  html[data-theme="dark"] {
    --bg: #23253F; --surface: #2E3050; --surface-2: #383A5E;
    --text: #EDEEF9; --text-muted: #B3B6D6; --border: #454877;
    --primary: #A0A5DD; --primary-dark: #A6AAE0; --primary-tint: #282A4D;
    --accent: #F08468; --accent-dark: #F6A088; --accent-tint: #2E2036; --accent-text: #F08468;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  }
  * { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  body { font-family: var(--sans); background: var(--bg); color: var(--text); line-height: 1.5; -webkit-font-smoothing: antialiased; transition: background 0.2s ease, color 0.2s ease; }
  a { color: inherit; text-decoration: none; }
  h1, h2, h3 { font-family: var(--serif); font-weight: 500; letter-spacing: -0.015em; margin: 0; }
  .skip-link { position: absolute; left: -9999px; top: 0; background: var(--accent); color: #fff; padding: 10px 16px; z-index: 200; border-radius: 0 0 8px 0; }
  .skip-link:focus { left: 0; }

  .header-row { max-width: 1180px; margin: 0 auto; padding: 26px 28px 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; row-gap: 10px; }
  .wordmark { font-family: var(--serif); font-weight: 700; font-size: 18px; color: var(--text); }
  .nav-pill { background: var(--surface-2); border-radius: 200px; padding: 6px; display: flex; align-items: center; gap: 2px; }
  .nav-pill a { font-family: var(--serif); font-size: 15px; font-weight: 500; padding: 9px 18px; border-radius: 200px; color: var(--text-muted); }
  .nav-pill a.is-active { background: var(--surface); color: var(--text); }
  @media (max-width: 640px) { .nav-pill { order: 3; width: 100%; overflow-x: auto; } .nav-pill a { white-space: nowrap; } }
  .icon-btn { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface); display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--text); font-size: 15px; }
  .icon-btn:hover { background: var(--surface-2); }
  .icon-btn:focus-visible, a:focus-visible, .nav-pill a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

  .hero { max-width: 1180px; margin: 0 auto; padding: 50px 28px 16px; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 36px; align-items: center; }
  @media (max-width: 900px) { .hero { grid-template-columns: 1fr; padding-top: 30px; } }
  .hero h1 { font-size: 42px; line-height: 1.14; letter-spacing: -0.02em; }
  .hero .lede { font-family: var(--sans); font-size: 16.5px; line-height: 1.5; color: var(--text-muted); margin: 20px 0 30px; max-width: 460px; }
  .btn-row { display: flex; gap: 12px; flex-wrap: wrap; }
  .btn { font-family: var(--serif); font-size: 15px; font-weight: 500; padding: 12px 22px; border-radius: 10px; cursor: pointer; display: inline-block; border: none; }
  .btn-fill { background: var(--primary-dark); color: #fff; }
  .btn-fill:hover { background: var(--primary); }
  .btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--border); }
  .btn-ghost:hover { background: var(--surface-2); }

  .summary-panel { background: var(--surface-2); border-radius: 20px; padding: 30px 30px; }
  .summary-row { display: flex; justify-content: space-between; align-items: baseline; padding: 15px 0; border-bottom: 1px solid var(--border); }
  .summary-row:first-child { padding-top: 0; }
  .summary-row:last-child { border-bottom: none; padding-bottom: 0; }
  .summary-row .lbl { font-size: 14px; color: var(--text-muted); }
  .summary-row .val { font-family: var(--serif); font-size: 26px; font-weight: 600; color: var(--accent-text); letter-spacing: -0.02em; }

  .source-strip { max-width: 1180px; margin: 26px auto 0; padding: 0 28px; }
  .source-strip .inner { font-size: 13px; color: var(--text-muted); text-align: center; }
  .source-strip strong { color: var(--text); font-weight: 500; }

  .section { padding: 64px 28px; }
  .section-inner { max-width: 1180px; margin: 0 auto; }
  .section.band { background: var(--surface-2); }
  .section-head { margin-bottom: 32px; max-width: 560px; }
  .section-head h2 { font-size: 24px; letter-spacing: -0.015em; }
  .section-head p { font-family: var(--sans); color: var(--text-muted); font-size: 14.5px; margin-top: 8px; }

  .picker-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
  @media (max-width: 860px) { .picker-grid { grid-template-columns: 1fr; } }
  .picker-card { background: var(--surface); border-radius: var(--radius); padding: 30px; border: 1px solid var(--border); box-shadow: var(--shadow); transition: border-color 0.15s ease, transform 0.15s ease; }
  .picker-card:hover { border-color: var(--accent); transform: translateY(-2px); }
  .picker-card .tag { display: inline-block; font-size: 12.5px; border-radius: 20px; padding: 4px 13px; margin-bottom: 16px; background: var(--surface-2); color: var(--text-muted); }
  .picker-card h3 { font-size: 22px; margin-bottom: 10px; }
  .picker-card p.desc { font-family: var(--sans); color: var(--text-muted); font-size: 14px; margin: 0 0 22px; }
  .picker-foot { display: flex; align-items: baseline; justify-content: space-between; border-top: 1px solid var(--border); padding-top: 14px; }
  .picker-foot .count { font-family: var(--serif); font-size: 20px; font-weight: 600; color: var(--accent-text); }
  .picker-foot .count span { display: block; font-family: var(--sans); font-size: 11.5px; color: var(--text-muted); font-weight: 400; }
  .picker-foot a { font-family: var(--sans); font-size: 13.5px; font-weight: 600; color: var(--text); }

  .calc-banner { margin-top: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 18px 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
  .calc-banner p { font-family: var(--sans); font-size: 14px; margin: 0; }
  .calc-banner a { display: inline-block; padding: 5px 0; font-family: var(--sans); font-size: 13.5px; font-weight: 600; color: var(--accent-text); }

  .data-note { max-width: 1180px; margin: 0 auto; padding: 30px 28px 0; }
  .data-note-inner { background: var(--accent-tint); border-radius: 10px; padding: 12px 18px; font-size: 13px; color: var(--text); text-align: center; }
  .data-note-inner strong { color: var(--accent-text); }

  footer { border-top: 1px solid var(--border); margin-top: 40px; padding: 24px 28px 50px; }
  .footer-inner { max-width: 1180px; margin: 0 auto; text-align: center; }
  footer p { font-family: var(--sans); font-size: 12.5px; color: var(--text-muted); margin: 0 0 10px; max-width: 700px; margin-left: auto; margin-right: auto; }
  footer .links a { color: var(--text-muted); font-size: 12.5px; margin: 0 8px; font-weight: 600; }
  footer .links a:hover { color: var(--text); }

  /* Accesibilidad: contraste AA de textos sobre el color primario en modo oscuro */
  html[data-theme="dark"] .btn-primary, html[data-theme="dark"] .btn-fill, html[data-theme="dark"] .annual-banner__cell,
  html[data-theme="dark"] .category-tab.is-active, html[data-theme="dark"] .skip-link, html[data-theme="dark"] .chip[aria-pressed="true"] { color: #14152A; }

/* Aviso de alcance de la RPT */
.lede-note { margin: 12px 0 0; font-size: 0.9rem; line-height: 1.5; color: var(--text-muted); max-width: 60ch; }

/* ===================== Portada (diseño 2026): banda luminosa + resumen + tarjetas ===================== */
.home{--muted:var(--text-muted);--primary-2:#5560B8;--h-shadow:0 1px 2px rgba(30,34,80,.06),0 8px 24px rgba(30,34,80,.06);
  --fs-xs:.8125rem;--fs-sm:.875rem;--fs-base:1rem;--fs-lg:1.25rem;--fs-xl:1.75rem;--fs-2xl:clamp(2rem,1.2rem + 2.6vw,2.75rem);
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:72px;font-family:var(--sans);font-size:var(--fs-base);line-height:1.6}
html[data-theme="dark"] .home{--primary-2:#B7BCF0;--h-shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25)}
.home h1{font:600 var(--fs-2xl)/1.15 var(--serif);letter-spacing:-.02em;margin:0}
.home h2{font:600 var(--fs-lg)/1.3 var(--serif);letter-spacing:-.01em;margin:0}
.home h3{font:600 var(--fs-lg)/1.3 var(--serif);margin:0}
.home p{margin:0}
.h-wrap{max-width:1120px;margin-left:auto;margin-right:auto;padding-left:var(--s5);padding-right:var(--s5)}
.h-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.h-band{background:radial-gradient(1200px 400px at 85% -10%,#DDE2FF 0%,transparent 60%),radial-gradient(900px 380px at 0% 0%,#FFE7DF 0%,transparent 55%),var(--bg);border-bottom:1px solid var(--border);padding-bottom:var(--s8)}
html[data-theme="dark"] .h-band{background:radial-gradient(1200px 400px at 85% -10%,#2F3366 0%,transparent 60%),radial-gradient(900px 380px at 0% 0%,#3A2730 0%,transparent 55%),var(--bg)}
.h-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--s7);align-items:center;padding-top:var(--s7)}
/* La banda continúa por detrás de la cabecera: sin corte de color */
.header-row{position:relative;z-index:2}
.h-band{margin-top:-80px;padding-top:80px}
@media (max-width:1100px){.h-band{margin-top:-64px;padding-top:64px}}
.h-txt{display:flex;flex-direction:column;gap:var(--s4)}
.h-lead{font-size:var(--fs-lg);line-height:1.5;color:var(--muted);max-width:40ch}
.h-meta{display:inline-flex;align-items:center;gap:var(--s2);font-size:var(--fs-sm);color:var(--muted)}
.h-dot{width:8px;height:8px;border-radius:50%;background:#2E9E6B;flex:none}
.h-stats{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s5);box-shadow:var(--h-shadow)}
.home .h-stats-t{font:600 var(--fs-sm)/1.4 var(--serif);color:var(--muted);margin-bottom:var(--s3)}
.h-stats dl{margin:0;display:grid;gap:var(--s4)}
.h-stats dl div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);padding-bottom:var(--s3);border-bottom:1px solid var(--border)}
.h-stats dt{font-size:var(--fs-sm);color:var(--muted)}
.h-stats dd{margin:0}
.h-num{font:600 var(--fs-xl)/1.1 var(--serif);color:var(--accent-text);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.h-stats-f{margin-top:var(--s3);font-size:var(--fs-xs);color:var(--muted)}
.h-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);margin-top:calc(var(--s7) * -1);position:relative}
.h-card{display:flex;flex-direction:column;gap:var(--s3);text-decoration:none;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s6);box-shadow:var(--h-shadow);transition:transform .15s ease,border-color .15s ease}
.h-card:hover{transform:translateY(-2px);border-color:var(--primary-2)}
.h-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.h-card p{color:var(--muted)}
.h-kicker{font-size:var(--fs-sm);font-weight:600;color:var(--muted)}
.h-ico{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--primary-tint);color:var(--primary)}
.h-ico--acc{background:var(--accent-tint);color:var(--accent-text)}
.h-go{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-weight:600;color:var(--primary)}
.h-count{font-size:var(--fs-sm);font-weight:400;color:var(--muted)}
.h-sec{margin-top:var(--s8);display:flex;flex-direction:column;gap:var(--s4)}
.h-minis{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.h-mini{flex-direction:row;align-items:center;gap:var(--s4);padding:var(--s4) var(--s5);box-shadow:0 1px 2px rgba(30,34,80,.05)}
.h-mini .h-ico{width:40px;height:40px;border-radius:12px;flex:none}
.h-mtxt{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.home .h-mini h3{font-size:var(--fs-base)}
.h-mini p{font-size:var(--fs-sm)}
.h-mini .h-go{margin-top:0;flex:none;font-size:var(--fs-sm)}
.h-datos{font-size:var(--fs-sm);color:var(--muted);max-width:75ch}
.h-datos strong{color:var(--text)}
@media (max-width:860px){.h-hero{grid-template-columns:1fr;gap:var(--s5);padding-top:var(--s6)}.h-cards{grid-template-columns:1fr;margin-top:calc(var(--s6) * -1)}}
@media (max-width:700px){.h-minis{grid-template-columns:1fr}.h-wrap{padding-left:var(--s4);padding-right:var(--s4)}.h-card{padding:var(--s5)}}
@media (max-width:520px){.h-mini .h-go{display:none}.h-mini{padding:var(--s4)}}
@media (prefers-reduced-motion:reduce){.h-card{transition:none}.h-card:hover{transform:none}}
