/*
 * Sección "Preguntas frecuentes" de la Home, justo después del Hall of
 * Fame. El padding vertical replica exactamente el de "Sobre nosotros"
 * (pages/about.css) para que el espaciado entre secciones de la Home sea
 * homogéneo; la cabecera reutiliza .canalla-section-head (theme-shell.css,
 * cargado también en la Home), así que aquí solo hace falta el estilo del
 * acordeón de preguntas y el botón.
 */
.canalla-home-faq{position:relative;width:100%;box-sizing:border-box;padding:clamp(84px,10vh,130px) max(24px,5vw) clamp(76px,9vh,120px);color:#fff}
.canalla-home-faq__list{display:grid;gap:14px;width:min(880px,100%);margin:clamp(36px,5vw,56px) auto 0}
.canalla-home-faq__item{border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.03);overflow:hidden;transition:border-color .2s ease,background-color .2s ease}
.canalla-home-faq__item:hover,.canalla-home-faq__item[open]{border-color:rgba(214,177,31,.5);background:rgba(214,177,31,.06)}
.canalla-home-faq__item summary{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:16px;align-items:center;min-height:66px;padding:16px 22px;cursor:pointer;list-style:none}
.canalla-home-faq__item summary::-webkit-details-marker{display:none}
.canalla-home-faq__item summary:focus-visible{outline:2px solid var(--canalla-color-gold,#d6b11f);outline-offset:-4px;border-radius:14px}
.canalla-home-faq__question{color:#fff;font-size:clamp(15px,1.7vw,17px);font-weight:600;line-height:1.35}
.canalla-home-faq__toggle{position:relative;flex:0 0 auto;width:32px;height:32px;border:1px solid rgba(255,255,255,.16);border-radius:50%}
.canalla-home-faq__toggle::before,.canalla-home-faq__toggle::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:1px;background:#fff;transform:translate(-50%,-50%);transition:transform .2s ease}
.canalla-home-faq__toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
.canalla-home-faq__item[open] summary .canalla-home-faq__toggle::after{transform:translate(-50%,-50%) rotate(0)}
.canalla-home-faq__answer{padding:0 22px 22px;color:var(--canalla-text-secondary,rgba(255,255,255,.62));font-size:15px;line-height:1.7}
.canalla-home-faq__answer p{margin:0}
.canalla-home-faq__cta{display:flex;justify-content:center;margin-top:clamp(32px,4.5vw,48px)}
/*
 * Mismo diseño que el botón de "Sobre nosotros" (pages/about.css), a
 * petición expresa: replica el botón "Quiero estar al día" de la
 * Newsletter (fondo oscuro, borde y texto dorados, dorado sólido solo al
 * pasar el ratón) en vez del dorado sólido del resto de la web. Ver el
 * comentario de about.css para el porqué del !important.
 */
.canalla-home-faq .canalla-button{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:46px;padding:0 24px;border:1px solid var(--canalla-color-gold,#e6bd16)!important;border-radius:12px;text-decoration:none!important;font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease}
.canalla-home-faq .canalla-button--primary{background:#17191f!important;color:var(--canalla-color-gold,#e6bd16)!important}
.canalla-home-faq .canalla-button--primary:hover,.canalla-home-faq .canalla-button--primary:focus-visible{transform:translateY(-1px);border-color:var(--canalla-color-gold,#e6bd16)!important;background:var(--canalla-color-gold,#e6bd16)!important;color:#090a0d!important}
@media(max-width:900px){
  .canalla-home-faq{padding:clamp(64px,9vh,100px) 20px clamp(56px,8vh,90px)}
  .canalla-home-faq__item summary{padding:14px 16px;min-height:58px}
  .canalla-home-faq__answer{padding:0 16px 18px}
}
@media(prefers-reduced-motion:reduce){.canalla-home-faq__toggle::after,.canalla-home-faq .canalla-button--primary{transition:none}}
