/* The Lab Room · Preguntas frecuentes, 20 de octubre de 2026.
   Hasta hoy eran un bloque al final de la portada (portada.css, "preguntas frecuentes, 19 oct"); Mónica las quiere
   solo en el pie, así que pasan a su página y el CSS viene con ellas, igual: el acordeón de las preguntas de la
   ficha (producto.css), título Zodiak 300 como los de sección, pregunta Archivo 400 y respuesta Archivo 300 a 14,5
   en tinta suave. El relleno va en `.tlr-faq__cuerpo`, dentro de lo que se pliega: cerrada, cada pregunta mide su
   cabecera. Fuera el desplegable que lo envolvía (.tlr-faq__todo): aquí el título es el h1 de la página. */

.tlr-faq{padding-block:clamp(3rem,6vw,5rem) clamp(4rem,8vw,6rem);interpolate-size:allow-keywords}
.tlr-faq__titulo{margin:0 0 clamp(1.6rem,3vw,2.4rem);font-family:var(--serif);font-weight:var(--tlr-t-titulo-peso,300);
  font-size:clamp(2.125rem,3.2vw,2.875rem);line-height:1.05;letter-spacing:-.018em;color:var(--ink)}
.tlr-faq__lista{min-width:0;border-bottom:1px solid var(--line)}
.tlr-faq__item{border-top:1px solid var(--line)}
.tlr-faq__item > summary{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:44px;
  padding:20px 0;cursor:pointer;list-style:none;font:400 14.5px/1.5 var(--sans);color:var(--ink)}
.tlr-faq__item > summary::-webkit-details-marker{display:none}
.tlr-faq__item > summary:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.tlr-faq__mas{position:relative;width:12px;height:12px;flex:0 0 12px}
.tlr-faq__mas::before,.tlr-faq__mas::after{content:"";position:absolute;background:var(--ink);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.tlr-faq__mas::before{left:0;top:5.5px;width:12px;height:1px}
.tlr-faq__mas::after{left:5.5px;top:0;width:1px;height:12px}
.tlr-faq__item[open] .tlr-faq__mas::after{transform:scaleY(0)}
.tlr-faq__cuerpo{padding:0 0 22px}
.tlr-faq__cuerpo p{margin:0;font:var(--tlr-t-cuerpo,300 14.5px/1.75 'Archivo',sans-serif);color:var(--ink-soft)}
.tlr-faq__item::details-content{block-size:0;overflow:hidden;opacity:0;
  transition:block-size .4s cubic-bezier(.22,1,.36,1),opacity .28s ease,content-visibility .4s allow-discrete}
.tlr-faq__item[open]::details-content{block-size:auto;opacity:1}
@media (prefers-reduced-motion:reduce){
  .tlr-faq__mas::before,.tlr-faq__mas::after,.tlr-faq__item::details-content{transition:none}
}
