/* Slide «Buen Fin» 13–22 nov 2026 — propuesta 2 (fondo #0D343F con círculo rojo #C01A35), la que va a producción.
   Logo oficial del Buen Fin 2026; sin precios ni MSI. 12-nov (Carlos: «los productos acomódalos alrededor del círculo»):
   el círculo, los 4 equipos y el sello vienen ya acomodados en UNA imagen (buenfin26-circulo-*), así el acomodo es
   idéntico en todos los anchos; en móvil (≤767 px) va la fila de equipos de fondo, tenue, como antes. */
.rtg-bf { --bf-amarillo: #FFF131; --bf-rojo: #C01A35; --bf-950: #0D343F; --bf-ar: 1.2162;   /* proporción de buenfin26-circulo-* (2312×1901); la alternativa B es 1.7083 */
  --bf-alto: 424px; overflow: hidden; }
.rtg-bf::before { content: none !important; }
.rtg-bf--2 { background: linear-gradient(100deg, var(--bf-950) 0, #11414D 55%, #0B2C35 100%); }
.rtg-bf__body { position: absolute; z-index: 3; inset: 0; display: flex; align-items: center; padding: 26px calc(var(--rtg-hero-inset, 0px) + 76px) 44px; color: #fff; pointer-events: none; }
.rtg-bf__copy { max-width: 500px; pointer-events: auto; }
.rtg-bf__logo { display: none; width: 92px; height: auto; margin: 0 auto 6px; filter: drop-shadow(0 6px 12px rgb(0 0 0 / 28%)); transform: rotate(-3deg); }
.rtg-bf__eyebrow { display: inline-block; margin: 0 0 12px; padding: 6px 12px; border-radius: 6px; background: var(--bf-amarillo); color: var(--bf-950); font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.rtg-bf--2 .rtg-bf__eyebrow { background: var(--bf-rojo); color: #fff; }
.rtg-bf__title { margin: 0 0 12px; color: #fff; font-size: 50px; font-weight: 900; line-height: 1.04; }
.rtg-bf__title em { display: block; color: var(--bf-amarillo); font-style: normal; }
.rtg-bf__text { margin: 0 0 20px; font-size: 17px; font-weight: 500; line-height: 1.4; }
.rtg-bf__ship { display: inline-block; margin-left: 12px; font-size: 13px; font-weight: 600; opacity: .9; }
/* Arte: alto útil = slide menos el aire de arriba (12 px) y de los puntos del carrusel (44 px); ancho = ese alto por la
   proporción de la imagen, sin pasar del hueco que deja el texto (24 px de aire) ni tocar las flechas. Los «sizes» del
   <picture> en roentgen-hero.tpl repiten estas cuentas: si cambian aquí, cambian allá. */
.rtg-bf__art { position: absolute; z-index: 1; top: 12px; bottom: 44px; right: calc(var(--rtg-hero-inset, 0px) + 58px); display: flex; align-items: center;
  width: min(calc(var(--bf-alto) * var(--bf-ar)), calc(100% - 2 * var(--rtg-hero-inset, 0px) - 658px)); pointer-events: none; }
.rtg-bf__art picture { display: block; width: 100%; }
.rtg-bf__art .rtg-bf__grupo { display: block; width: 100%; height: auto; aspect-ratio: var(--bf-ar); }   /* reserva el espacio: sin salto */
@media (min-width: 1200px) and (max-width: 1439px) {
  .rtg-bf__copy { max-width: 450px; } .rtg-bf__title { font-size: 46px; }
  .rtg-bf__art { width: min(calc(var(--bf-alto) * var(--bf-ar)), calc(100% - 2 * var(--rtg-hero-inset, 0px) - 608px)); }
}
@media (max-width: 1199px) {   /* el hero baja a 460 px */
  .rtg-bf { --bf-alto: 404px; }
  .rtg-bf__body { padding-left: calc(var(--rtg-hero-inset, 0px) + 40px); }
  .rtg-bf__copy { max-width: 360px; } .rtg-bf__title { font-size: 38px; } .rtg-bf__text { font-size: 15px; }
  .rtg-bf__art { width: min(calc(var(--bf-alto) * var(--bf-ar)), calc(100% - 2 * var(--rtg-hero-inset, 0px) - 482px)); }
}
@media (max-width: 1023px) {   /* tableta: sin flechas; el arte llega al margen del sitio */
  .rtg-bf__copy { max-width: 320px; } .rtg-bf__title { font-size: 31px; } .rtg-bf__text { font-size: 14px; }
  .rtg-bf__art { right: var(--rtg-hero-inset, 0px); width: min(calc(var(--bf-alto) * var(--bf-ar)), calc(100% - 2 * var(--rtg-hero-inset, 0px) - 384px)); }
}
@media (max-width: 767px) {
  .rtg-bf__body { justify-content: center; padding: 10px 16px 30px; text-align: center; }
  .rtg-bf__copy { max-width: none; } .rtg-bf__logo { display: block; }
  .rtg-bf__eyebrow { font-size: 10px; padding: 4px 8px; margin-bottom: 6px; } .rtg-bf__title { font-size: 22px; margin-bottom: 4px; } .rtg-bf__title em { display: inline; }
  .rtg-bf__text { display: none; } .rtg-bf__ship { display: none; }
  .rtg-bf .rtg-xpo__cta { padding: 9px 16px; font-size: 12px; }
  /* móvil: la fila de equipos (buenfin26-equipos-*) de fondo al 22 %, pegada abajo, a todo el ancho */
  .rtg-bf__art { inset: 0; width: auto; align-items: flex-end; opacity: .22; }
  .rtg-bf__art .rtg-bf__grupo { aspect-ratio: 828 / 268; }
}
/* Hover y foco del botón propios del slide: la roentgen-expo.css de producción (v4) no los trae. */
.rtg-bf .rtg-xpo__cta:hover, .rtg-bf .rtg-xpo__cta:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 24px rgb(0 0 0 / 28%); }
.rtg-bf .rtg-xpo__cta:focus-visible { outline: 3px solid var(--bf-amarillo); outline-offset: 3px; }
