/* Make AI Act, capa de maquetación. Todo con tokens del sistema. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-size:var(--text-md);line-height:var(--leading-body)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{margin:0}
p{margin:0}
ul,ol{margin:0}
.skip{position:absolute;left:var(--sp-2);top:calc(var(--sp-2) * -12);z-index:60;background:var(--yellow);color:var(--blue-deep);padding:var(--sp-3) var(--sp-4);font-weight:var(--weight-bold);text-decoration:none}
.skip:focus{top:var(--sp-2)}
.wrap{width:100%;max-width:var(--container-wide);margin:0 auto;padding-left:var(--sp-5);padding-right:var(--sp-5)}
.narrow{max-width:var(--container-content)}
.sec{padding-top:var(--sp-8);padding-bottom:var(--sp-8)}
.sec-tight{padding-top:var(--sp-7);padding-bottom:var(--sp-7)}
.brand,.hdr,.ftr,.cookie,.box-brand,.panel-hd{--muted-c:var(--tint-10);--link-c:var(--text-inverse)}
.brand{background:var(--surface-brand);color:var(--text-inverse)}
.brand a{color:var(--link-c)}
.tint{background:var(--surface-tint)}
.stack{display:flex;flex-direction:column}
.s1{gap:var(--sp-1)}.s2{gap:var(--sp-2)}.s3{gap:var(--sp-3)}.s4{gap:var(--sp-4)}.s5{gap:var(--sp-5)}.s6{gap:var(--sp-6)}.s7{gap:var(--sp-7)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3)}
.row-end{justify-content:flex-end}
.grid{display:grid;gap:var(--sp-5)}
.g2{grid-template-columns:1fr}.g3{grid-template-columns:1fr}.g4{grid-template-columns:1fr 1fr}
.split{display:grid;gap:var(--sp-7);grid-template-columns:1fr}
.kicker{font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);font-weight:var(--weight-semibold);margin:0}
.h1{font-family:var(--font-display);font-size:var(--text-h1);line-height:var(--leading-heading)}
.h2{font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--leading-heading)}
.h3{font-family:var(--font-body);font-weight:var(--weight-bold);font-size:var(--text-h3);line-height:var(--leading-heading)}
.poster{font-family:var(--font-display);font-size:var(--text-poster);line-height:var(--leading-tight);text-transform:uppercase}
.lead{font-size:var(--text-lg)}
.sm{font-size:var(--text-sm)}
.xs{font-size:var(--text-xs)}
.muted{color:var(--text-muted)}

.mono{font-family:var(--font-mono)}
.b{font-weight:var(--weight-bold)}
.box{background:var(--surface-card);border:var(--border-thin) solid var(--border-color);padding:var(--sp-5)}
.box-tint{background:var(--surface-tint);border:var(--border-thin) solid var(--line);padding:var(--sp-5)}
.box,.box-tint,.box-accent,.cal,.cal-mini,.map,.finder-list,.panel,table.cmp tbody,.logo-chip,.ph{color:var(--text-primary);--muted-c:var(--text-muted);--link-c:var(--blue)}
.muted{color:var(--muted-c,var(--text-muted))}
a{color:var(--link-c,var(--blue))}
.box-brand{background:var(--surface-brand);color:var(--text-inverse);border:var(--border-thin) solid var(--border-color);padding:var(--sp-5)}
.box-accent{background:var(--surface-accent);color:var(--text-on-yellow);border:var(--border-thin) solid var(--blue-deep);padding:var(--sp-5)}
.rule{border:0;border-top:var(--border-thin) solid var(--border-color);margin:0}
.rule-heavy{border:0;border-top:var(--border-heavy) solid var(--border-color);margin:0}
.linklist{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-2)}
.tag{display:inline-flex;align-items:center;gap:var(--sp-1);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-xs);font-weight:var(--weight-semibold);border:var(--border-thin) solid var(--border-color);padding:var(--sp-1) var(--sp-2);background:var(--surface-card);color:var(--text-primary);text-decoration:none;cursor:pointer;min-height:var(--tap-min)}
.tag[aria-pressed="true"],.tag.on{background:var(--surface-brand);color:var(--text-inverse)}
.tag:hover{background:var(--yellow);color:var(--blue-deep);border-color:var(--blue-deep)}
/* Cabecera */
.hdr{position:sticky;top:0;z-index:40;background:var(--surface-brand);color:var(--text-inverse);border-bottom:var(--border-thin) solid var(--border-color)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:nowrap;min-height:calc(var(--tap-min) + var(--sp-5));padding-top:var(--sp-3);padding-bottom:var(--sp-3)}
.hdr-logo{flex:0 0 auto}
.hdr .wrap{max-width:1440px}
.hdr-nav{display:none;gap:var(--sp-3);align-items:center;min-width:0;flex-wrap:nowrap;white-space:nowrap}
.hdr-nav a{font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-inverse);text-decoration:none;padding:var(--sp-2) 0;border-bottom:var(--border-thin) solid transparent}
.hdr-nav a:hover,.hdr-nav a[aria-current="page"]{background:none;border-bottom-color:var(--yellow);color:var(--yellow)}
.hdr-act{display:none;gap:var(--sp-3);align-items:center;flex:0 0 auto}
.burger{display:inline-flex;align-items:center;gap:var(--sp-2);min-height:var(--tap-min);min-width:var(--tap-min);justify-content:center;background:none;border:var(--border-thin) solid var(--white);color:var(--text-inverse);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);padding:var(--sp-2) var(--sp-3);cursor:pointer}
.burger:hover{background:var(--yellow);color:var(--blue-deep);border-color:var(--blue-deep)}
.drawer{border-top:var(--border-thin) solid var(--white);padding-top:var(--sp-4);padding-bottom:var(--sp-5)}
.drawer a{display:block;font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-weight:var(--weight-semibold);color:var(--text-inverse);text-decoration:none;padding:var(--sp-3) 0;border-bottom:var(--border-thin) solid var(--blue-hover);min-height:var(--tap-min)}
/* Pie */
.ftr{background:var(--surface-brand);color:var(--text-inverse);padding-top:var(--sp-8);padding-bottom:var(--sp-6);border-top:var(--border-heavy) solid var(--yellow)}
.ftr a{color:var(--text-inverse);text-decoration:none;font-size:var(--text-sm)}
.ftr a:hover{background:var(--yellow);color:var(--blue-deep)}
.ftr-cols{display:grid;gap:var(--sp-6);grid-template-columns:1fr 1fr}
.ftr-legal{display:flex;flex-wrap:wrap;gap:var(--sp-4);padding-top:var(--sp-5);border-top:var(--border-thin) solid var(--blue-hover)}
/* Migas */
.crumbs{font-size:var(--text-sm);padding-top:var(--sp-4);padding-bottom:var(--sp-4)}
.crumbs ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center}
.crumbs a{text-decoration:none}
.crumbs a:hover{background:var(--yellow)}
/* Buscador */
.finder{position:relative}
.finder input{width:100%;min-height:calc(var(--tap-min) + var(--sp-2));font-family:var(--font-body);font-size:var(--text-lg);padding:var(--sp-3) var(--sp-4);border:var(--border-thick) solid var(--border-color);background:var(--surface-card);color:var(--text-primary);border-radius:var(--radius-0)}
.finder-list{list-style:none;margin:0;padding:0;position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--surface-card);border:var(--border-thin) solid var(--border-color);border-top:0;max-height:calc(var(--sp-9) * 3);overflow:auto}
.finder-list a{display:block;padding:var(--sp-3) var(--sp-4);text-decoration:none;color:var(--text-primary);border-bottom:var(--border-thin) solid var(--line);font-size:var(--text-md)}
.finder-list a:hover{background:var(--yellow)}
/* Calendario vivo */
.cal{border:var(--border-thin) solid var(--border-color);background:var(--surface-card)}
.cal-row{display:grid;grid-template-columns:var(--sp-9) 1fr;border-top:var(--border-thin) solid var(--line);width:100%;text-align:left;background:none;border-left:0;border-right:0;border-bottom:0;cursor:pointer;font:inherit;color:inherit;padding:0}
.cal-row:first-child{border-top:0}
.cal-row:hover{background:var(--surface-tint)}
.cal-row[aria-expanded="true"]{background:var(--surface-tint)}
.cal-date{font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);font-weight:var(--weight-semibold);padding:var(--sp-4);border-right:var(--border-thin) solid var(--line)}
.cal-body{padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}
.cal-panel{padding:var(--sp-4) var(--sp-4) var(--sp-5) var(--sp-4);border-top:var(--border-thin) solid var(--line);background:var(--surface-tint);display:flex;flex-direction:column;gap:var(--sp-3)}
.cal-mini{border:var(--border-thin) solid var(--border-color);background:var(--surface-card);padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3)}
.cal-mini ol{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-3)}
.cal-mini li{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-3);align-items:start;font-size:var(--text-sm);border-left:var(--border-thick) solid var(--border-color);padding-left:var(--sp-3)}
.done{opacity:.65}
.sev{display:inline-block;font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-xs);font-weight:var(--weight-semibold);padding:var(--sp-1) var(--sp-2);border:var(--border-thin) solid}
.sev-ok{background:var(--sev-ok-bg);border-color:var(--sev-ok-border);color:var(--sev-ok-text)}
.sev-attention{background:var(--sev-attention-bg);border-color:var(--sev-attention-border);color:var(--sev-attention-text)}
.sev-risk{background:var(--sev-risk-bg);border-color:var(--sev-risk-border);color:var(--sev-risk-text)}
/* Pasos numerados */
.steps{display:grid;gap:var(--sp-5);grid-template-columns:1fr;counter-reset:s}
.step{border-top:var(--border-heavy) solid var(--border-color);padding-top:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}
.step-n{font-family:var(--font-condensed);font-size:var(--text-h3);font-weight:var(--weight-bold);letter-spacing:var(--tracking-caps)}
/* Tabla comparativa */
.tbl-wrap{overflow-x:auto}
table.cmp{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
table.cmp caption{text-align:left;padding-bottom:var(--sp-3);font-size:var(--text-sm)}
table.cmp th,table.cmp td{border:var(--border-thin) solid var(--line);padding:var(--sp-3);text-align:left;vertical-align:top}
table.cmp thead th{background:var(--surface-brand);color:var(--text-inverse);border-color:var(--border-color);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps)}
table.cmp tbody th{background:var(--surface-tint);font-weight:var(--weight-semibold)}
/* FAQ */
.faq{border-top:var(--border-thin) solid var(--border-color)}
.faq details{border-bottom:var(--border-thin) solid var(--line)}
.faq summary{cursor:pointer;padding:var(--sp-4) 0;font-weight:var(--weight-semibold);font-size:var(--text-lg);list-style:none;display:flex;gap:var(--sp-3);align-items:baseline;min-height:var(--tap-min)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";font-family:var(--font-display)}
.faq details[open] summary::before{content:"–"}
.faq .ans{padding-bottom:var(--sp-4);max-width:var(--container-content)}
/* Índice pegajoso */
.toc{border-left:var(--border-thick) solid var(--border-color);padding-left:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2);background:var(--surface-page)}
.toc a{font-size:var(--text-sm);text-decoration:none;color:var(--text-muted)}
.toc a:hover,.toc a[aria-current="true"]{background:var(--yellow);color:var(--blue-deep)}
/* Artículo */
.article{max-width:var(--container-content);display:flex;flex-direction:column;gap:var(--sp-5)}
.article h2{font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--leading-heading);padding-top:var(--sp-5)}
.article h3{font-weight:var(--weight-bold);font-size:var(--text-h3)}
.article p,.article li{font-size:var(--text-md);line-height:var(--leading-body)}
.article ul,.article ol{padding-left:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2)}
/* Mapa */
.map{position:relative;border:var(--border-thin) solid var(--border-color);background:var(--surface-tint);aspect-ratio:4 / 3}
.map-note{display:block;padding-top:var(--sp-2);font-size:var(--text-xs);color:var(--text-muted)}
.pin{position:absolute;transform:translate(-50%,-50%);min-width:var(--tap-min);min-height:var(--tap-min);display:flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;padding:0}
.pin>span:not(.pin-lbl){display:block;width:var(--sp-3);height:var(--sp-3);background:var(--surface-brand);border:var(--border-thin) solid var(--white);outline:var(--border-thin) solid var(--border-color)}
.pin[aria-pressed="true"]>span:not(.pin-lbl){background:var(--surface-accent);width:var(--sp-4);height:var(--sp-4)}
.pin-lbl{position:absolute;left:50%;top:calc(50% + var(--sp-3));transform:translateX(-50%);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-xs);white-space:nowrap;color:var(--text-primary);background:none;width:auto;height:auto;border:0;outline:0}
/* Gráficos observatorio */
.bars{display:flex;flex-direction:column;gap:var(--sp-3)}
.bar-row{display:grid;grid-template-columns:1fr;gap:var(--sp-1)}
.bar-track{background:var(--surface-tint);border:var(--border-thin) solid var(--line);height:var(--sp-5)}
.bar-fill{background:var(--surface-brand);height:100%}
.bar-fill.accent{background:var(--surface-accent)}
/* Formularios */
.field{display:flex;flex-direction:column;gap:var(--sp-2)}
.field label{font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);font-weight:var(--weight-semibold)}
.field input,.field select,.field textarea{font-family:var(--font-body);font-size:var(--text-md);padding:var(--sp-3);border:var(--border-thin) solid var(--border-color);background:var(--surface-card);color:var(--text-primary);min-height:var(--tap-min);border-radius:var(--radius-0)}
.err{color:var(--text-primary);background:var(--surface-accent);border:var(--border-thin) solid var(--blue-deep);padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm)}
/* Asistente flotante */
.fab{position:fixed;right:var(--sp-4);bottom:var(--sp-4);z-index:45;background:var(--surface-brand);color:var(--text-inverse);border:var(--border-thin) solid var(--white);outline:var(--border-thin) solid var(--border-color);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-weight:var(--weight-semibold);font-size:var(--text-sm);min-height:var(--tap-min);padding:var(--sp-3) var(--sp-4);cursor:pointer}
.fab:hover{background:var(--yellow);color:var(--blue-deep)}
.panel{position:fixed;right:var(--sp-4);bottom:calc(var(--tap-min) + var(--sp-6));z-index:46;width:calc(100% - var(--sp-6));max-width:var(--container-content);background:var(--surface-card);border:var(--border-thick) solid var(--border-color);display:flex;flex-direction:column;max-height:70vh}
.panel-hd{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--surface-brand);color:var(--text-inverse)}
.panel-bd{padding:var(--sp-4);overflow:auto;display:flex;flex-direction:column;gap:var(--sp-4)}
.msg{border:var(--border-thin) solid var(--line);padding:var(--sp-3);font-size:var(--text-sm)}
.msg.me{background:var(--surface-tint);border-color:var(--border-color)}
/* Cookies */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--surface-brand);color:var(--text-inverse);border-top:var(--border-heavy) solid var(--yellow);padding:var(--sp-4) 0}
/* Paginación */
.pager{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;padding-top:var(--sp-5)}
.pager a,.pager span{min-width:var(--tap-min);min-height:var(--tap-min);display:inline-flex;align-items:center;justify-content:center;border:var(--border-thin) solid var(--border-color);text-decoration:none;font-size:var(--text-sm);padding:0 var(--sp-3)}
.pager [aria-current="page"]{background:var(--surface-brand);color:var(--text-inverse)}
.hero-lines{display:flex;flex-direction:column;gap:var(--sp-4)}
.count{font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--leading-tight)}
.logos{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.logo-chip{border:var(--border-thin) solid var(--border-color);padding:var(--sp-4);font-family:var(--font-condensed);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);text-align:center;color:var(--text-muted);background:var(--surface-card)}
.ph{border:var(--border-thin) dashed var(--line);background:var(--surface-tint);padding:var(--sp-5);font-size:var(--text-sm);color:var(--text-muted);display:flex;align-items:center;justify-content:center;text-align:center;min-height:calc(var(--sp-9) * 1.5)}
@media (min-width:640px){.g2{grid-template-columns:1fr 1fr}.logos{grid-template-columns:repeat(3,1fr)}.bar-row{grid-template-columns:calc(var(--sp-9) * 2) 1fr auto;align-items:center;gap:var(--sp-4)}}
@media (min-width:900px){.hdr-nav{display:flex}.hdr-act{display:flex}.burger{display:none}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.split{grid-template-columns:1.05fr .95fr;align-items:start}.with-toc>:first-child{position:sticky;top:calc(var(--sp-8) + var(--sp-4))}.steps{grid-template-columns:repeat(4,1fr)}.ftr-cols{grid-template-columns:2fr 1fr 1fr 1fr}.logos{grid-template-columns:repeat(6,1fr)}.sec{padding-top:var(--sp-9);padding-bottom:var(--sp-9)}.with-toc{display:grid;grid-template-columns:calc(var(--sp-9) * 2.4) 1fr;gap:var(--sp-7);align-items:start}}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}html{scroll-behavior:auto}}

/* Foco: el amarillo del DS solo contrasta sobre azul (7,18:1); sobre blanco cae a 1,51:1.
   Se elige el color del anillo segun la superficie. Sin sombras: el DS las prohibe. */
:focus-visible{outline:var(--border-thick) solid var(--blue);outline-offset:var(--focus-offset)}
.brand :focus-visible,.box-brand :focus-visible,[data-theme="dark"] :focus-visible{outline-color:var(--yellow)}

/* ── Alineación de bloques repetidos ──────────────────────────────────────────
   Los hijos de una .grid ya se estiran a la misma altura, pero su contenido se
   apila arriba: el CTA queda a la altura que le toque segun cuanto texto lleve
   encima. Anclarlo abajo hace que toda la fila comparta linea de botones. */
.grid > .stack > :last-child{margin-top:auto}

/* Cuando las tarjetas de una fila comparten estructura, subgrid alinea tambien
   sus filas internas (valor, etiqueta, titulo, CTA) y no solo el borde exterior.
   Se declara cuantas filas tiene la tarjeta con --filas. */
.grid-sync{grid-template-rows:repeat(var(--filas,2),auto)}
.grid-sync > *{display:grid;grid-template-rows:subgrid;grid-row:span var(--filas,2);row-gap:inherit}
@supports not (grid-template-rows:subgrid){
  /* Sin subgrid no se puede alinear por filas: al menos no se rompe el apilado. */
  .grid-sync > *{display:flex;flex-direction:column;grid-row:auto}
}

/* Llamada fija en movil. En escritorio el CTA vive en la cabecera; al colapsarse en la
   hamburguesa la conversion se queda sin salida visible, asi que baja a una barra fija.
   El boton del asistente sube por encima para no solaparse. */
.cta-movil{position:fixed;left:0;right:0;bottom:0;z-index:44;padding:var(--sp-3) var(--sp-4);
  background:var(--surface-page);border-top:var(--border-thick) solid var(--blue)}
@media (min-width:900px){.cta-movil{display:none}}
@media (max-width:899px){.fab{bottom:calc(var(--tap-min) + var(--sp-6))}body{padding-bottom:calc(var(--tap-min) + var(--sp-6))}}
/* Con el banner de cookies abierto, la barra estorbaria: el banner manda. */
.cookie ~ .cta-movil,.cta-movil:has(~ .cookie){display:none}

/* Contraste de bordes. El --line del design system (#BFCCEA) da 1,61:1 sobre blanco, y se
   usa en controles y en indicación de estado: los botones del acordeón del calendario, el
   desplegable de FAQ, la lista del buscador y, en el DS, el borde de SelectionCard cuando
   NO está seleccionada. WCAG 1.4.11 pide 3:1 para eso.
   El valor nuevo se obtiene interpolando hacia --blue, así que sigue siendo azul: el sistema
   prohíbe el gris. 3,49:1 sobre blanco y 3,14:1 sobre la superficie de tinte.
   Va aquí y no en tokens/colors.4535fbcd.css porque ese fichero lo genera Claude Design y reimportar
   el sistema revertiría el cambio. */
:root{--line:#6B89C6}
[data-theme="dark"]{--line-dark:#51679D;--line:var(--line-dark)}