/* =============================================================================
   page-fr-luxury-bus.css
   Ajustes de maquetación de las páginas /fr/luxury-bus/ construidas con el
   texto de los documentos de SUBE.

   Se carga DESPUÉS de page-destinations-to.min.css y solo reparte anchos y
   quita huecos: no toca colores, tipografías ni componentes del sitio.
   Si prefieren, todo esto puede integrarse en page-destinations-to.min.css
   y borrarse este archivo.

   Páginas que lo usan:
     - monterrey-to-mexico-city.html
     - guanajuato-to-san-miguel-de-allende.html
     - queretaro-to-san-miguel-de-allende.html
   ========================================================================== */

/* --------------------------------------------------- datos de la ruta */
/* Las dos columnas se reparten a partes iguales. Antes la izquierda medía
   860 px fijos y la derecha se quedaba con lo que sobraba. */
.quick-facts__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:56px}
.facts-cards{max-width:none}
.quick-facts__right{padding-bottom:0}
.quick-facts__right h2{font-size:26px;font-weight:800;color:#003a5d;margin:0 0 10px}
.quick-facts__right h3{font-size:16px;font-weight:800;color:#003a5d;margin:0 0 6px}
.quick-facts__right p{font-size:14px;color:#3c5c73;margin:0 0 12px}

/* Rutas sin bloque de horarios: las fichas ocupan todo el ancho a 3 columnas */
.quick-facts--solo .quick-facts__grid{grid-template-columns:1fr}
.facts-cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.quick-facts--solo .quick-facts__cta{justify-content:center}

/* --------------------------------------------------------------- CTA */
/* Los botones van en fila y con su ancho natural, no como barras. */
.quick-facts__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.alt-routes-card .quick-facts__cta .btn-primary{width:auto;margin-top:0}

/* ------------------------------------------------------------ reservar */
.booking-section__grid{grid-template-columns:minmax(0,1fr)}
.booking-methods-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
.booking-methods-row .booking-method{margin:0;height:100%}
.booking-methods-row .dash-list{grid-template-columns:1fr}

/* ---------------------------------------------------------- conexiones */
/* La foto de esta sección mide 720 px de alto por regla del sitio y se salía
   de escala respecto al resto de la página. */
.journey-extend__grid{width:min(100% - 120px,1320px);margin:0 auto;grid-template-columns:minmax(0,360px) minmax(0,1fr)}
.journey-extend__media img{height:100%;min-height:320px;max-height:460px}
.journey-extend__card{padding:34px 32px}
.journey-extend__col .dash-list{margin-bottom:18px}

/* --------------------------------------------- bloques de foto lateral */
/* Foto grande a un lado y fichas al otro, alternando el lado. */
.discover-main-grid--wide{max-width:none;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:34px;margin:0 auto 34px;align-items:stretch}
.discover-main-grid--wide .discover-main-grid__image{height:100%}
.discover-main-grid--wide .discover-main-grid__image img{height:100%;min-height:320px;border-radius:20px}
.discover-main-grid--wide .discover-main-grid__side{display:grid;gap:14px;align-content:start}
.discover-main-grid--wide .discover-main-grid__side h3{text-align:left;margin:0 0 2px}
.discover-main-grid--rev .discover-main-grid__image{order:2}

/* Imagen a todo el ancho cuando la sección no lleva texto a su lado */
.figura{margin:0 0 32px}
.figura img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:var(--radius,20px);box-shadow:0 18px 45px rgba(0,58,93,.12)}

/* -------------------------------------------------- collage de platillos */
.food-collage{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 22px}
.food-collage img,.food-collage__ph{display:block;width:100%;height:180px;object-fit:cover;border-radius:16px}
/* hueco marcado: espacio reservado para una foto que el sitio aún no tiene */
.food-collage__ph{border:2px dashed #cdd8e0;background:repeating-linear-gradient(45deg,#f7f5f2,#f7f5f2 10px,#f1eee9 10px,#f1eee9 20px)}

/* ------------------------------------------------------------- varios */
.travel-tips .alt-routes-card{margin-bottom:22px}
.travel-tips .alt-routes-card .travel-tips__grid{margin-top:10px}
.journey-banner__card h3{text-align:center;margin:0 0 6px}
.journey-banner__grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.benefit-card .check-list li{font-size:.9rem}
.route-cta__actions p{margin:0 0 18px}
.section-cierre{max-width:820px;margin:18px auto 0;text-align:center;font-size:14px;color:#3c5c73}

/* ------------------------------------------------------------- móvil */
@media(max-width:1200px){ .grid--4{grid-template-columns:repeat(2,1fr)} }
@media(max-width:1024px){
  .quick-facts__grid{grid-template-columns:1fr;gap:34px}
  .booking-methods-row{grid-template-columns:1fr}
  .journey-extend__grid{width:min(100% - 48px,1320px);grid-template-columns:1fr}
  .journey-extend__media img{height:240px;min-height:0}
}
@media(max-width:900px){
  .facts-cards--3{grid-template-columns:1fr}
  .discover-main-grid--wide{grid-template-columns:1fr;gap:20px}
  .discover-main-grid--rev .discover-main-grid__image{order:0}
  .discover-main-grid--wide .discover-main-grid__image img{height:220px;min-height:0}
  .food-collage{grid-template-columns:repeat(2,minmax(0,1fr))}
  .food-collage img,.food-collage__ph{height:140px}
  .figura img{aspect-ratio:16/10}
  .journey-banner__grid--2{grid-template-columns:1fr}
}