.beta-info{max-width:1080px; padding-block:3rem 4rem}
.beta-info [id]{scroll-margin-top:7rem}
.beta-intro{max-width:820px}
.beta-intro h1{font-size:clamp(2rem,5vw,3.3rem); line-height:1.12; letter-spacing:-.04em; margin:.8rem 0 1rem}
.beta-info .lead{max-width:68ch; font-size:1.12rem}
.beta-fecha,.beta-nota{font-size:.88rem; color:var(--mute)}
.beta-info section{padding:2rem 0; border-top:1px solid var(--line); margin-top:1rem}
.beta-info section>p{max-width:80ch}
.beta-info section h2{font-size:clamp(1.5rem,3vw,2rem); margin:0 0 1rem}
.beta-saltos,.beta-acciones{display:flex; flex-wrap:wrap; gap:.6rem 1rem; margin:1.5rem 0}
.beta-saltos a{display:inline-flex; align-items:center; min-height:44px; text-underline-offset:4px}
.beta-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin:1.4rem 0}
.beta-card{padding:1.25rem; background:var(--card); border:1px solid var(--line); border-radius:12px; min-width:0}
.beta-card h3{font-size:1.08rem; margin:0 0 .6rem; color:var(--ink)}
.beta-card p{margin:0; color:var(--mute); line-height:1.7}
/* La fecha de instalación de cada función, al pie de su ficha: una fecha
   dice más que «disponible», y la verificación que hay detrás va con ella. */
.beta-card .beta-desde{margin-top:.7rem; font-size:.82rem; color:var(--ink)}
.beta-estado{display:inline-block; padding:.3rem .65rem; border-radius:6px; background:#BDF4DC; color:#16382C; font-size:.8rem; font-weight:700}
.beta-config{background:#DAE9FF; color:#193655}
.beta-pendiente{background:#FFE9AF; color:#47360B}
.beta-lista{padding-left:1.3rem; max-width:80ch}
.beta-lista li{padding:.35rem 0}
.beta-info a:focus-visible{outline:3px solid var(--aire); outline-offset:4px}
.beta-info a{overflow-wrap:anywhere}
.beta-acciones .btn{white-space:normal; text-align:center; min-height:44px}
@media(max-width:640px){.beta-grid{grid-template-columns:1fr}.beta-info{padding-block:2rem}.beta-acciones{flex-direction:column}}
/* La beta repartida en pestañas: la cabecera ya no tiene que dejar el aire de
   media página abajo, porque lo que sigue es la barra; y un panel trae una
   sección sola, así que la línea que separaba secciones ya no separa nada. */
/* `max-width:none` para que el encabezado arranque donde arrancan la barra
   y el texto de los paneles: con los 1080 px de `.beta-info` y los márgenes
   automáticos del `.wrap`, el título quedaba 50 px adentro de todo lo
   demás y se leía como si fuera otra columna. */
.beta-cabeza{padding-bottom:1rem;max-width:none}
.pest-caja .beta-info{padding-block:0}
.pest-panel .beta-info section{border-top:0;margin-top:0;padding-top:0}
/* `.beta-info [id]{scroll-margin-top:7rem}` vive más arriba en este archivo y
   le ganaba por orden de hoja al del panel, que es el que sabe cuánto miden
   las barras de verdad. Medido: los cuatro anclas de /beta/ caían 10 px
   debajo de la barra. */
.pest-panel .beta-info [id]{scroll-margin-top:calc(var(--pest-tope, 7rem) + 1rem)}
