/* Orys · web v3 · secciones y responsive. */
/* ---------- 1 · Portada ---------- */
.portada { padding-block: calc(var(--seccion) * .9) var(--seccion); min-height: min(92vh, 900px); display: flex; align-items: center; }
.portada__grid {
display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: auto auto auto;
column-gap: clamp(2rem, 5vw, 5rem); row-gap: 2rem; align-items: end;
}
.portada__etiqueta { grid-column: 2; grid-row: 1; justify-self: end; text-align: right; max-width: 28ch; }
/* Subgrid, no display:contents: [data-reveal] necesita una caja real con
bounding rect para que el IntersectionObserver de main.js la detecte
(con display:contents el rect es 0x0 y el bloque nunca gana .is-visible). */
.portada__texto {
display: grid; grid-column: 1 / -1; grid-row: 2 / 4;
grid-template-columns: subgrid; grid-template-rows: subgrid; align-items: start;
}
.portada__texto > h1 { grid-column: 1 / -1; grid-row: 1; }
.portada__cuerpo { grid-column: 1; grid-row: 2; align-self: start; display: flex; flex-direction: column; gap: 2.5rem; }
.portada__lead { margin-top: 0; }
.portada__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; }
.portada__hub { grid-column: 2; grid-row: 3; align-self: end; margin: 0; width: 100%; max-width: 520px; justify-self: end; }
.hub { width: 100%; height: auto; }
/* Portada con fotografia (prueba ronda 1, .impeccable/assets/hero): la foto
ocupa el fondo a sangre, el sujeto vive en el tercio derecho y sustituye al
hub. Los tokens de texto se fijan al valor claro porque la foto es hueso
sea cual sea el tema; --foto-oscura invierte para fotos de fondo tinta. */
.portada--foto { position: relative; isolation: isolate; overflow: hidden; color: var(--tinta); min-height: 100svh;
--tinta: #141414; --tinta-suave: #3A3935; --gris: #6B665D; --hairline: #D6D1C4; --hueso-sobre-tinta: #EFEDE6; }
.portada--foto-oscura { --tinta: #EFEDE6; --tinta-suave: #D9D5CB; --gris: #A19B8F; --hairline: #2E2C28; --hueso-sobre-tinta: #141414; }
/* Anclada a la derecha y un 10 % mayor que el viewport: el sujeto del render
(tercio derecho) se aleja del titular; el recorte se lo come el borde izquierdo. */
.portada__foto { position: absolute; inset: 0 0 0 auto; z-index: -1; width: 110%; height: 100%; object-fit: cover; object-position: 100% center; }
.portada--foto picture { display: contents; }
.portada--foto .portada__hub { display: none; }
.portada--foto .portada__etiqueta { grid-column: 1; justify-self: start; text-align: left; }
.portada--foto .portada__texto > h1 { max-width: 10ch; }
/* A toda la altura de la vista, el padding se mide en vh para que el CTA no
caiga bajo el pliegue en portatiles de 720-768 px de alto. */
.portada--foto { padding-block: clamp(5.5rem, 12vh, 9rem) clamp(3rem, 8vh, 6rem); }
@media (min-width: 48.01rem) and (max-height: 780px) {
.portada--foto { --fs-hero: clamp(3rem, 6vw, 5.25rem); }
.portada--foto .portada__cuerpo { gap: 2rem; }
}
.hub__nodos text { font-family: var(--font-mono); }
/* ---------- 2 · Mecanismo (tinta) ---------- */
.mecanismo .display { margin-top: 1rem; max-width: 18ch; }
/* Petición compartida: la misma frase entra en los dos paneles. */
.mecanismo__peticion { display: grid; grid-template-columns: auto 1fr; gap: 1.5rem; align-items: baseline; margin-top: 3.5rem; padding-block: 1.25rem; border-top: 1px solid var(--regla); }
.mecanismo__peticion .etiqueta { margin: 0; }
.mecanismo__prompt { margin: 0; font-size: var(--fs-lead); line-height: 1.35; max-width: 44ch; text-wrap: balance; }
.mecanismo__paneles { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--regla); border-top: 1px solid var(--regla); }
.mecanismo__panel { display: flex; flex-direction: column; gap: 1.25rem; }
.mecanismo__cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.mecanismo__cabecera .etiqueta { margin: 0; }
.mecanismo__figura { padding-block: .5rem; }
.mecanismo__figura img { width: 100%; height: auto; }
.mecanismo__panel--arnes { border-top: 2px solid var(--naranja); }
/* Respuesta: turno del agente + borrador citado + cierre. */
.mecanismo__respuesta { display: flex; flex-direction: column; gap: 1rem; }
.mecanismo__respuesta p { margin: 0; }
.mecanismo__respuesta blockquote { margin: 0; padding-left: 1rem; border-left: 2px solid var(--hairline); color: var(--tinta-suave); }
.mecanismo__panel--arnes .mecanismo__respuesta blockquote { border-left-color: var(--naranja); color: var(--tinta); }
/* Fuentes: rotulación mono; tachadas donde no ha podido consultarlas. */
.mecanismo__fuentes { list-style: none; margin: auto 0 0; padding: 1rem 0 0; border-top: 1px solid var(--hairline); display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.mecanismo__fuentes li { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-label); text-transform: uppercase; color: var(--gris); display: inline-flex; align-items: center; gap: .5rem; }
.mecanismo__fuentes li::before { content: ""; width: 6px; height: 6px; background: var(--tinta); flex: none; }
.mecanismo__fuentes--vacias li { text-decoration: line-through; }
.mecanismo__fuentes--vacias li::before { background: transparent; border: 1px solid var(--gris); }
.mecanismo__nota { margin-top: 2rem; max-width: 52ch; }
/* ---------- 3 · Capas ---------- */
.capas .display { margin-top: 1rem; }
.capas__slices { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: auto 1fr auto auto; margin-top: 3.5rem; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.capas__slice { padding: 2rem 1.5rem 2.5rem 0; border-left: 1px solid var(--hairline); padding-left: 1.5rem; display: grid; grid-template-rows: subgrid; grid-row: span 4; gap: .75rem; min-height: 16rem; }
.capas__slice:first-child { border-left: 0; padding-left: 0; }
.capas__num { grid-row: 1; font-size: var(--fs-label); letter-spacing: var(--track-label); color: var(--gris); }
.capas__slice .title { grid-row: 3; align-self: end; margin-top: 0; }
.capas__slice .secundario { grid-row: 4; }
.capas__slice--nucleo { position: relative; }
.capas__slice--nucleo::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--naranja); }
.capas__nota { margin-top: 2rem; max-width: 60ch; }
/* ---------- 4 · Montaje ---------- */
.montaje__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); row-gap: 3rem; }
/* La cabecera pegajosa vive en su propia celda (fila 1): el límite de un sticky es su bloque
contenedor, y si fuera hija directa del grid seguiría pegada hasta pisar la coda (fila 2). */
.montaje__lateral { grid-column: 2; grid-row: 1; }
.montaje__cabecera { position: sticky; top: calc(var(--nav-desprendido) + 5rem); display: flex; flex-direction: column; gap: 1rem; }
.montaje__rail { grid-column: 1; grid-row: 1 / span 2; position: relative; padding-left: clamp(1.5rem, 3vw, 2.5rem); --progreso: 0; }
.montaje__rail::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--hairline); }
.montaje__rail::after {
content: ""; position: absolute; left: -0.5px; top: 0; bottom: 0; width: 2px;
background: var(--naranja); transform-origin: top; transform: scaleY(var(--progreso));
}
.montaje__paso { display: grid; grid-template-columns: minmax(0, .55fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; padding-block: 2rem; border-bottom: 1px solid var(--hairline); }
.montaje__paso:last-child { border-bottom: 0; }
.montaje__numeral { font-size: var(--fs-numeral); font-weight: 700; letter-spacing: -0.05em; line-height: .85; color: var(--tinta); }
.montaje__cuerpo { display: flex; flex-direction: column; gap: .5rem; padding-top: .5rem; }
.montaje__cuerpo .etiqueta { margin-top: .5rem; }
.montaje__coda { grid-column: 2; grid-row: 2; align-self: end; display: flex; flex-direction: column; gap: .5rem; padding-top: 2rem; border-top: 1px solid var(--hairline); }
/* ---------- 5 · Precios (hoja de especificaciones) ---------- */
.precios__cabecera { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; } /* alineada a la izquierda como el resto (decisión Elliot 26-08-2026) */
.espec { margin-top: 3.5rem; border-top: 1px solid var(--tinta); table-layout: fixed; }
/* Banda Pro: fondo de la (capa de columna, bajo filas y celdas). Firefox pintaba el
::before absoluto con z-index -1 por encima de los hairlines y rompía las reglas de grupo. */
.espec__col--pro { background: var(--hueso-alto); }
.espec th, .espec td { text-align: left; vertical-align: top; padding: 1rem 1.25rem 1rem 0; border-bottom: 1px solid var(--hairline); font-weight: 400; }
.espec thead th { vertical-align: bottom; padding-bottom: 1.5rem; }
.espec__concepto { width: 28%; }
.espec__paquete { width: 24%; position: relative; }
.espec__paquete .etiqueta { display: block; margin-bottom: .75rem; }
.espec__cifra { font-family: var(--font-sans); font-size: var(--fs-display); font-weight: 600; letter-spacing: var(--track-display); line-height: 1; color: var(--tinta); white-space: nowrap; }
.espec__moneda { font-size: .5em; font-weight: 500; vertical-align: .55em; letter-spacing: 0; }
.espec__recomendado {
position: absolute; top: -1.6rem; left: 1rem;
display: inline-block; padding: .25rem .7rem;
font-family: var(--font-mono); font-size: .7rem; letter-spacing: var(--track-label); text-transform: uppercase;
background: var(--naranja); color: var(--tinta-sobre-naranja); border-radius: 999px;
}
.espec__paquete--pro::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--naranja); }
.espec tbody th[scope="row"] { color: var(--tinta-suave); }
/* Fila de grupo: 1 th + 3 td vacías (no colspan) para que la banda de la Pro sea continua en todos los navegadores. */
.espec__grupo th, .espec__grupo td { padding-top: 2rem; padding-bottom: .5rem; border-bottom: 1px solid var(--tinta); }
.espec tbody td { color: var(--tinta); }
.espec thead .espec__paquete, .espec tbody td[data-paquete] { padding-left: 1rem; }
.espec__mantenimiento th, .espec__mantenimiento td { border-bottom: 1px solid var(--tinta); }
.precios__tech { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--hairline); display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 2rem; align-items: baseline; }
.precios__tech .etiqueta { grid-column: 1 / -1; }
.precios__tech-cifra { font-family: var(--font-sans); font-size: var(--fs-title); font-weight: 600; letter-spacing: -0.02em; }
.precios__nota { margin-top: 2rem; max-width: 60ch; }
/* ---------- 6 · Los «no» (naranja full-bleed) ---------- */
/* Dos columnas 7/5 (28-08-2026, del lienzo de rediseño): texto y lista a la izquierda,
conector gigante a la derecha, apoyado en la base de la lista y girando despacio. */
.los-no__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); }
.los-no__titulo { font-size: clamp(3.5rem, 9vw, 7.5rem); margin-top: 1rem; max-width: 12ch; }
.los-no__lista { display: grid; grid-template-columns: 1fr 1fr; margin-top: 3.5rem; border-top: 1px solid var(--regla); }
.los-no__item { display: block; padding: 2rem 2rem 2rem 0; border-bottom: 1px solid var(--regla); font-size: var(--fs-lead); line-height: 1.4; }
.los-no__item:nth-child(even) { border-left: 1px solid var(--regla); padding-left: 2rem; }
.los-no__simbolo { display: flex; align-items: flex-end; justify-content: flex-end; }
.conector--los-no { width: clamp(200px, 25vw, 360px); height: auto; aspect-ratio: 1; color: var(--tinta-sobre-naranja); }
/* ---------- 6b · Segundo tiempo (construir a medida, después de configurar) ---------- */
.segundo-tiempo__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 5rem); row-gap: 3rem; align-items: start; }
.segundo-tiempo__texto { display: flex; flex-direction: column; align-items: flex-start; gap: 1.5rem; }
.segundo-tiempo__texto .display { margin-top: -.5rem; max-width: 16ch; }
.segundo-tiempo__texto .lead { max-width: 46ch; }
.segundo-tiempo__texto .cta { margin-top: .5rem; }
.segundo-tiempo__nota { margin-top: 1.5rem; max-width: 52ch; }
/* Dos tiempos apilados con hairlines, sin tarjetas; el segundo lleva regla naranja como el slice núcleo de capas. */
.segundo-tiempo__tiempos { border-top: 1px solid var(--hairline); margin-top: .35rem; }
.segundo-tiempo__tiempo { position: relative; display: flex; flex-direction: column; gap: .75rem; padding-block: 2rem; border-bottom: 1px solid var(--hairline); font-size: var(--fs-lead); line-height: 1.4; }
.segundo-tiempo__tiempo p { margin: 0; }
.segundo-tiempo__tiempo .etiqueta { font-size: var(--fs-label); line-height: 1.2; }
.segundo-tiempo__tiempo--despues::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--naranja); }
/* ---------- 7 · Preguntas (tinta, mismo bloque que mecanismo) ---------- */
.preguntas__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(2rem, 5vw, 5rem); }
.preguntas__cabecera { display: flex; flex-direction: column; gap: 1rem; align-self: start; position: sticky; top: calc(var(--nav-desprendido) + 5rem); }
.preguntas__lista { border-top: 1px solid var(--regla); }
.preguntas__item { display: grid; grid-template-columns: 4rem 1fr; gap: 1.5rem; padding-block: 2rem; border-bottom: 1px solid var(--regla); }
/* Regla naranja corta en la primera columna (antes bajo el numeral; decisión Elliot 26-08-2026: sin numeral). */
.preguntas__item::before { content: ""; width: 1.5rem; height: 2px; margin-top: .7em; background: var(--naranja); }
.preguntas__item > div { display: flex; flex-direction: column; gap: .75rem; max-width: 58ch; }
/* ---------- 8 · Contacto (naranja) + pie ---------- */
.contacto { padding-bottom: 2rem; }
.contacto__bloque { display: flex; flex-direction: column; gap: 1.25rem; max-width: 40ch; }
.contacto__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 1rem; }
.contacto__correo { color: var(--texto); border-bottom: 1px solid var(--regla); padding-bottom: .1rem; }
.contacto__correo:hover { border-bottom-color: var(--texto); }
.contacto__hairline { margin-block: var(--seccion) 2.5rem; }
.pie { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 2rem; padding-bottom: 1rem; }
.pie__celda { display: flex; flex-direction: column; gap: .5rem; }
.pie__wordmark { font-weight: 700; letter-spacing: var(--track-display); font-size: 1.25rem; }
.pie__celda--indice a { color: var(--texto-secundario); padding: .15rem 0; }
.pie__celda--indice a:hover { color: var(--texto); }
.pie__celda--legal { align-items: flex-start; }
.pie__celda--legal a { color: var(--texto); border-bottom: 1px solid var(--regla); }
/* ---------- Responsive ≤ 48 rem ---------- */
@media (max-width: 64rem) {
.capas__slices { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(2, auto 1fr auto auto); }
.capas__slice:nth-child(3) { border-left: 0; padding-left: 0; }
.capas__slice:nth-child(-n+2) { border-bottom: 1px solid var(--hairline); }
}
@media (max-width: 48rem) {
.portada { min-height: 0; }
.portada__grid { grid-template-columns: 1fr; }
.portada__texto > h1 { grid-column: 1; grid-row: 1; }
.portada__cuerpo { grid-column: 1; grid-row: 2; }
.portada__etiqueta { grid-column: 1; grid-row: 4; justify-self: start; text-align: left; margin-top: .5rem; }
.portada__hub { grid-column: 1; grid-row: 5; max-width: 420px; justify-self: start; }
/* Móvil (27-08-2026): misma superficie que en escritorio, hueso fijo en ambos temas,
con la foto bajo el texto en recorte vertical 4:5 (assets/img/portada-enchufe-movil-*)
cuyo borde superior ya viene fundido a #EFEDE6: no hay banda ni corte, y el enchufe
entra entero. Antes era una banda 16:9 que en oscuro quedaba encajada entre la
portada tinta y el mecanismo claro. */
.portada--foto { flex-direction: column; align-items: stretch; padding-bottom: 0; min-height: 0; background: #EFEDE6; }
.portada--foto picture { order: 2; display: block; width: 100%; margin-top: -1rem; }
.portada--foto .portada__foto { position: static; width: 100%; height: auto; aspect-ratio: 4 / 5; object-position: center bottom; }
.portada--foto .portada__etiqueta { grid-row: 1; margin-top: 0; margin-bottom: .5rem; }
.portada--foto .portada__texto { grid-row: 2 / 4; }
.hub text { font-size: 21px; }
.mecanismo__paneles { grid-template-columns: 1fr; }
.mecanismo__peticion { grid-template-columns: 1fr; gap: .5rem; margin-top: 2rem; }
/* Conmutador (27-08-2026): los dos paneles ocupan la misma celda y solo uno se ve;
pestañas mono con regla naranja bajo la activa, y deslizar cambia de panel (JS).
Sin JS el conmutador sigue oculto y los paneles se apilan como antes. */
.mecanismo__conmutador { display: flex; margin-top: 2rem; border-bottom: 1px solid var(--regla); }
.mecanismo__conmutador[hidden] { display: none; }
.mecanismo__pestana {
flex: 1; position: relative; padding: .85rem 0 .9rem; text-align: center;
font-family: var(--font-mono); font-size: var(--fs-label); font-weight: 500; letter-spacing: var(--track-label); text-transform: uppercase;
color: var(--texto-secundario);
}
.mecanismo__pestana[aria-selected="true"] { color: var(--texto); }
.mecanismo__pestana::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--naranja); transform: scaleX(0); transform-origin: center; }
.mecanismo__pestana[aria-selected="true"]::after { transform: scaleX(1); }
.mecanismo__paneles.is-conmutable { border-top: 0; touch-action: pan-y; background: none; }
/* Los dos paneles comparten celda: la altura del bloque es fija (la del panel más alto)
y la página no salta al cambiar (decisión Elliot 27-08-2026). El panel corto estira su
fondo y ancla la lista de fuentes abajo, como en escritorio. */
.mecanismo__paneles.is-conmutable > .mecanismo__panel { grid-area: 1 / 1; }
.mecanismo__paneles.is-conmutable > .mecanismo__panel[aria-hidden="true"] { visibility: hidden; opacity: 0; pointer-events: none; }
/* Sin regla naranja en móvil: apilada entre hairlines leía como cambio de sección (Elliot, 27-08-2026). */
.capas__slice--nucleo::before { display: none; }
/* Capas: se mantiene el 2×2 de ≤ 64 rem (antes 1 columna: 1.158 px para cuatro
líneas de texto), con menos aire por slice. */
.capas__slices { margin-top: 2rem; }
.capas__slice { min-height: 0; padding: 1.25rem 1rem 1.5rem 0; gap: .5rem; }
.capas__slice:nth-child(even) { padding-left: 1rem; }
.capas__slice .title { font-size: 1.2rem; }
.montaje__grid { grid-template-columns: 1fr; }
.montaje__lateral { grid-column: 1; grid-row: 1; }
.montaje__cabecera { position: static; }
.montaje__rail { grid-column: 1; grid-row: 2; }
.montaje__coda { grid-column: 1; grid-row: 3; }
.montaje__paso { grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding-block: 1.25rem; }
.montaje__cuerpo { padding-top: 0; }
.montaje__coda { padding-top: 1.5rem; }
/* Precios: lista por concepto con tres valores (spec §5) */
.espec colgroup { display: none; }
.espec thead .espec__paquete, .espec tbody td[data-paquete] { padding-left: 0; }
.espec, .espec thead, .espec tbody, .espec tr, .espec th, .espec td { display: block; width: auto; }
.espec thead tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
/* I3: --fs-display sin wrap desborda la columna de 3 a 390px; se reduce
solo aquí para que la cifra siga en una línea sin romper el ancho. */
.espec__cifra { font-size: 1.75rem; }
.espec thead .espec__concepto { display: none; }
.espec__paquete--pro::before { left: 0; }
.espec tbody tr { padding-block: .75rem; border-bottom: 1px solid var(--hairline); }
.espec tbody th[scope="row"] { border-bottom: 0; padding: 0 0 .5rem; }
.espec tbody td { border-bottom: 0; padding: .15rem 0; display: grid; grid-template-columns: 5.5rem 1fr; gap: 1rem; background: none; margin: 0; }
.espec tbody td[data-paquete="Pro"] { background: var(--hueso-alto); }
.espec tbody td::before { content: attr(data-paquete); font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-label); text-transform: uppercase; color: var(--gris); }
.espec__grupo th { padding-top: 1.25rem; }
.espec__grupo td { display: none; }
/* Opción A (27-08-2026): pestañas fijas con precio y una sola columna de valores.
El tablist lo construye JS desde el thead; con .is-conmutable la tabla oculta el
thead, el rótulo de paquete de cada celda y las celdas de los otros paquetes. */
.espec__conmutador {
position: sticky; top: calc(var(--nav-desprendido) + 3.25rem); z-index: 2;
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: end;
margin-top: 2rem; padding-top: 1.25rem; background: var(--hueso); border-bottom: 1px solid var(--tinta);
}
.espec__conmutador[hidden] { display: none; }
.espec__pestana { position: relative; display: flex; flex-direction: column; gap: .4rem; padding: 0 0 .9rem; text-align: left; color: var(--gris); }
.espec__pestana .etiqueta { color: inherit; }
.espec__pestana .espec__cifra { font-size: 1.15rem; color: var(--tinta-suave); }
.espec__pestana[aria-selected="true"], .espec__pestana[aria-selected="true"] .espec__cifra { color: var(--tinta); }
.espec__pestana::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--naranja); transform: scaleX(0); transform-origin: left; }
.espec__pestana[aria-selected="true"]::after { transform: scaleX(1); }
.espec__pestana .espec__recomendado { position: static; margin-bottom: .1rem; align-self: flex-start; }
.espec.is-conmutable { margin-top: 0; border-top: 0; }
.espec.is-conmutable thead { display: none; }
.espec.is-conmutable tbody td { grid-template-columns: 1fr; padding: .1rem 0 0; font-size: 1.05rem; background: none; }
.espec.is-conmutable tbody td::before { display: none; }
.espec.is-conmutable tbody td.is-oculto { display: none; }
.precios__tech { grid-template-columns: 1fr; }
.segundo-tiempo__grid { grid-template-columns: 1fr; row-gap: 2.5rem; }
.segundo-tiempo__tiempo { font-size: 1.1rem; padding-block: 1.25rem; }
.los-no__grid { grid-template-columns: 1fr; row-gap: 2rem; }
.los-no__lista { grid-template-columns: 1fr; }
.los-no__item:nth-child(even) { border-left: 0; padding-left: 0; }
.los-no__lista { margin-top: 2rem; }
.los-no__item { padding: 1.25rem 0; font-size: 1.1rem; }
.los-no__simbolo { justify-content: flex-start; }
.conector--los-no { width: 120px; }
.preguntas__grid { grid-template-columns: 1fr; row-gap: 2rem; }
.preguntas__cabecera { position: static; }
.preguntas__item { grid-template-columns: 2.5rem 1fr; gap: 1rem; padding-block: 1.25rem; }
.pie { grid-template-columns: 1fr; }
/* Contador de sección (27-08-2026): «02 / 08 · Qué se instala». Da posición y
cuánto queda; la portada no cuenta. Si cambia el número de secciones, actualizar
el «08» (checks.mjs lo comprueba contra las etiquetas .etiqueta--seccion). */
main { counter-reset: seccion; }
.etiqueta--seccion::before { counter-increment: seccion; content: counter(seccion, decimal-leading-zero) " / 08 · "; }
}