/* Tickets Costa del Sol · 24.10.2 · Ficha de producto más ancha y aireada
   Ordenador: el contenido pasa de un máximo fijo de 1240 px a ocupar casi toda la pantalla (hasta 1600 px),
   con márgenes laterales proporcionales. La columna de compra crece un poco y las cajas se reparten mejor.
   El texto largo conserva un ancho de lectura cómodo. Móvil: menos margen lateral y menos relleno interior. */

/* ── Ancho general (portada, contenido, relacionados y publicidad usan el mismo contenedor) ── */
.f24 .f24-wrap{width:min(100% - clamp(32px,4.5vw,112px),1600px)!important}
.f24 .f24-hero>.f24-hero-in{width:min(100% - clamp(32px,4.5vw,112px),1600px)!important}

@media (min-width:1061px){
  .f24 .f24-grid{grid-template-columns:minmax(0,1fr) clamp(340px,24vw,410px);gap:clamp(20px,2vw,32px)}
  .f24 .f24-main{gap:clamp(20px,1.8vw,28px)}
  /* Galería algo más protagonista cuando hay espacio */
  .f24 .f24-intro{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(16px,1.6vw,24px)}
  /* Datos rápidos: 3 por fila en pantallas grandes (6 datos = 2 filas iguales) */
  .f24 .f24-facts{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}
  /* Índice + texto: el índice algo más ancho; el texto con ancho de lectura cómodo */
  .f24 .f24-article{grid-template-columns:clamp(190px,14vw,230px) minmax(0,1fr);gap:clamp(16px,1.6vw,24px)}
  .f24 .f24-article-card{padding:8px clamp(24px,2.4vw,40px) 22px}
  .f24 .f24-article-card .prose,.f24 .f24-article-card .f24-text,.f24 .f24-article-card .f24-notice,.f24 .f24-article-card .f24-checklist,.f24 .f24-article-card .f24-faq{max-width:82ch}
  .f24 .f24-article-card .prose{font-size:clamp(1rem,.94rem + .2vw,1.08rem)}
  .f24 .f24-article-card .prose :is(table,figure,img,.table-wrap,iframe){max-width:100%}
}
/* Pantallas muy grandes (≥1800 px): tarjetas relacionadas algo más anchas */
@media (min-width:1800px){.f24 .f24-cards{grid-auto-columns:clamp(260px,18%,320px)!important}}

/* ── Móvil: 12 px de margen y cajas con menos relleno = más ancho útil para fotos y texto ── */
@media (max-width:600px){
  .f24 .f24-wrap{width:calc(100% - 24px)!important}
  .f24 .f24-hero>.f24-hero-in{padding-left:12px!important;padding-right:12px!important}
  .f24 .f24-hero>.f24-hero-credit{margin-left:12px;margin-right:12px}
  .f24 .f24-grid{gap:14px;margin-top:14px}
  .f24 .f24-pitch{padding:14px 14px 16px}
  .f24 .f24-facts{padding:6px;gap:6px}
  .f24 .f24-article-card{padding:2px 14px 12px}
  .f24 .f24-compare .f24-offer{margin-left:8px;margin-right:8px}
  .f24 .f24-info{padding:14px}
  .f24 .f24-nav{margin:0 -12px;padding:6px 12px}
}

/* Cabecera de la web alineada con el contenido de la ficha (solo en fichas de experiencias y eventos) */
@media (min-width:1061px){
  body.tpl-actividad .public-header,body.tpl-evento .public-header{box-sizing:border-box;width:min(100% - clamp(32px,4.5vw,112px),1600px)!important;max-width:none!important;margin-inline:auto!important;padding-left:0!important;padding-right:0!important}
}
