/* ==========================================================================
   Caribbean Tours — Frontend CSS
   Sistema visual público. Se mezcla con --ct-primary del cliente (inyectada
   por Frontend::output_brand_css_vars en wp_head).
   ========================================================================== */

/* ==========================================================================
   RESET GLOBAL ANTI-TEMA (Hello Elementor y similares)
   Va al inicio para que las reglas específicas del plugin (más abajo) lo
   sobreescriban. Neutraliza selectores amplios del tema en la sección FAQ y
   los controles de lightGallery.
   ========================================================================== */
.ct-catalog *,
.ct-single-tour *,
.ct-inquiry-form * {
  font-family: -apple-system, BlinkMacSystemFont,
               'Inter', sans-serif !important;
  line-height: normal;
}

/* FAQ reset global */
.ct-tour-faqs *,
.ct-faq-toggle,
.ct-faq-q,
.ct-faq-body p {
  all: unset;
  display: revert;
  box-sizing: border-box !important;
  font-family: -apple-system, BlinkMacSystemFont,
               'Inter', sans-serif !important;
}

.ct-faq-toggle {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  padding: 14px 0 !important;
  cursor: pointer !important;
  border: none !important;
  background: none !important;
}

.ct-faq-q {
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: #1f2937 !important;
  flex: 1 !important;
  text-align: left !important;
}

.ct-faq-icon {
  color: #9ca3af !important;
  font-size: 1rem !important;
  flex-shrink: 0 !important;
  margin-left: 12px !important;
  transition: transform 200ms !important;
}

.ct-faq.is-open .ct-faq-icon {
  transform: rotate(180deg) !important;
}

.ct-faq-body {
  display: none;
  padding: 0 0 14px !important;
}

.ct-faq-body p {
  font-size: 0.875rem !important;
  color: #6b7280 !important;
  line-height: 1.6 !important;
  display: block !important;
}

/* ── LIGHTGALLERY OVERRIDE COMPLETO ──
   Selectores con `body .lg-outer` para ganar especificidad frente a los
   estilos amplios de Hello Elementor, que se inyectan tarde en el DOM. */
body .lg-outer .lg-actions .lg-next,
body .lg-outer .lg-actions .lg-prev {
  background-color: rgba(0,0,0,.6) !important;
  border: none !important;
  border-radius: 4px !important;
  color: #ffffff !important;
}

body .lg-outer .lg-actions .lg-next:hover,
body .lg-outer .lg-actions .lg-prev:hover {
  background-color: rgba(0,0,0,.85) !important;
  color: #ffffff !important;
}

body .lg-outer .lg-actions .lg-next:before,
body .lg-outer .lg-actions .lg-prev:after {
  border-color: #ffffff !important;
  color: #ffffff !important;
}

body .lg-backdrop {
  background-color: rgba(0,0,0,.92) !important;
}

body .lg-outer .lg-toolbar {
  background-color: rgba(0,0,0,.6) !important;
}

body .lg-outer .lg-toolbar .lg-icon,
body .lg-outer .lg-actions .lg-next,
body .lg-outer .lg-actions .lg-prev {
  color: #ffffff !important;
  fill: #ffffff !important;
}

body .lg-outer .lg-toolbar .lg-icon:hover {
  color: #cccccc !important;
}

/* -- BASE -- */
.ct-catalog, .ct-single-tour, .ct-inquiry-form {
  font-family: 'Inter', system-ui, sans-serif;
  box-sizing: border-box;
}
*, *::before, *::after { box-sizing: inherit; }

/* -- CATÁLOGO -- */
.ct-catalog { width: 100%; }

/* ── FILTER BAR ── */
.ct-catalog .ct-filters {
  background: var(--ct-card-bg, #ffffff) !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  padding: 12px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-bottom: 20px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.05) !important;
}

/* Separador vertical entre grupos */
.ct-catalog .ct-filter-sep {
  width: 1px !important;
  height: 20px !important;
  background: #e5e7eb !important;
  flex-shrink: 0 !important;
}

/* Grupo de filtro */
.ct-catalog .ct-filter-group {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  flex-shrink: 0 !important;
}

/* Label del filtro */
.ct-catalog .ct-filter-label {
  all: unset !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #9ca3af !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  white-space: nowrap !important;
  margin-right: 2px !important;
  font-family: -apple-system, BlinkMacSystemFont,
               'Inter', sans-serif !important;
}

/* Pills de filtro */
.ct-catalog .ct-filter-btn {
  all: unset !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 12px !important;
  border-radius: 99px !important;
  border: 1px solid #e5e7eb !important;
  background: #f9fafb !important;
  color: #6b7280 !important;
  cursor: pointer !important;
  transition: all 120ms !important;
  white-space: nowrap !important;
  line-height: 1.5 !important;
  font-family: -apple-system, BlinkMacSystemFont,
               'Inter', sans-serif !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
}

.ct-catalog .ct-filter-btn:hover {
  border-color: var(--ct-primary, #0891b2) !important;
  color: var(--ct-primary, #0891b2) !important;
  background: #f0f9ff !important;
}

.ct-catalog .ct-filter-btn--active {
  background: var(--ct-primary, #0891b2) !important;
  border-color: var(--ct-primary, #0891b2) !important;
  color: #ffffff !important;
}

.ct-catalog .ct-filter-btn--active:hover {
  background: var(--ct-primary-dark, #0e7490) !important;
  border-color: var(--ct-primary-dark, #0e7490) !important;
  color: #ffffff !important;
}

/* Dropdowns para filtros secundarios */
.ct-catalog .ct-filter-select {
  all: unset !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 28px 4px 12px !important;
  border-radius: 99px !important;
  border: 1px solid #e5e7eb !important;
  background: #f9fafb !important;
  color: #6b7280 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  font-family: -apple-system, BlinkMacSystemFont,
               'Inter', sans-serif !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239ca3af'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  display: inline-block !important;
  line-height: 1.5 !important;
}

.ct-catalog .ct-filter-select:focus {
  outline: none !important;
  border-color: var(--ct-primary, #0891b2) !important;
}

/* Rango de precio */
.ct-catalog .ct-price-range {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.ct-catalog .ct-price-input {
  all: unset !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  background: #f9fafb !important;
  color: #6b7280 !important;
  width: 64px !important;
  text-align: center !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
}

.ct-catalog .ct-price-input:focus {
  outline: none !important;
  border-color: var(--ct-primary, #0891b2) !important;
}

.ct-catalog .ct-price-dash {
  color: #d1d5db !important;
  font-size: 12px !important;
}

/* Botón limpiar filtros */
.ct-catalog .ct-filter-clear {
  all: unset !important;
  margin-left: auto !important;
  font-size: 11px !important;
  color: #9ca3af !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  transition: all 120ms !important;
  font-family: inherit !important;
  white-space: nowrap !important;
}

.ct-catalog .ct-filter-clear:hover {
  color: #6b7280 !important;
  background: #f3f4f6 !important;
}

/* Mobile: wrap en dos filas */
@media (max-width: 768px) {
  .ct-catalog .ct-filters {
    padding: 10px 14px !important;
    gap: 6px !important;
  }
  .ct-catalog .ct-filter-sep {
    display: none !important;
  }
  .ct-catalog .ct-filter-group {
    flex-wrap: wrap !important;
    flex-shrink: 1 !important;
  }
  .ct-catalog .ct-filter-btn {
    font-size: 11px !important;
    padding: 3px 10px !important;
  }
}

/* -- CONTADOR -- */
.ct-catalog-meta {
  padding: 6px 0 12px;
  font-size: 0.75rem; color: #9ca3af;
}

/* -- GRID -- */
.ct-tours-grid {
  display: grid; gap: 16px;
}
.ct-grid--2col { grid-template-columns: repeat(2,1fr); }
.ct-grid--3col { grid-template-columns: repeat(3,1fr); }
.ct-grid--4col { grid-template-columns: repeat(4,1fr); }

@media (max-width: 768px) {
  .ct-grid--3col,
  .ct-grid--4col { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 480px) {
  .ct-tours-grid { grid-template-columns: 1fr; }
}

/* -- TOUR CARD -- */
.ct-tour-card {
  background: white;
  border-radius: 12px;
  border: 1px solid #f3f4f6;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  overflow: hidden; cursor: pointer;
  transition: all 200ms ease;
}
.ct-tour-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  transform: translateY(-2px);
}

/* -- IMAGEN CARD -- */
.ct-card-image {
  position: relative; height: 144px; overflow: hidden;
}
.ct-card-image img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 500ms ease;
}
.ct-tour-card:hover .ct-card-image img {
  transform: scale(1.05);
}
.ct-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.5), transparent);
}

/* -- BADGES -- */
.ct-badge {
  position: absolute;
  font-size: 0.7rem; font-weight: 700;
  padding: 2px 8px; border-radius: 99px;
}
.ct-badge--zone {
  top: 8px; left: 8px;
  background: var(--ct-primary); color: white;
}
.ct-badge--type {
  bottom: 8px; left: 8px;
  background: rgba(255,255,255,.2);
  backdrop-filter: blur(4px); color: white;
}
.ct-badge--soldout {
  top: 8px; right: 8px;
  background: #ef4444; color: white;
}
.ct-badge--paused {
  top: 8px; right: 8px;
  background: #f59e0b; color: white;
}

/* -- BODY CARD -- */
.ct-card-body { padding: 12px; }
.ct-card-title {
  font-weight: 700; font-size: 0.875rem;
  color: #1f2937; line-height: 1.3;
  margin: 0 0 6px;
  transition: color 150ms;
}
.ct-tour-card:hover .ct-card-title {
  color: var(--ct-primary);
}
.ct-card-desc {
  font-size: 0.75rem; color: #6b7280;
  line-height: 1.5; margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ct-card-footer {
  display: flex; align-items: center;
  justify-content: space-between; margin-bottom: 8px;
}
.ct-price-amount {
  font-size: 1.125rem; font-weight: 900; color: #1f2937;
}
.ct-price-label { font-size: 0.7rem; color: #9ca3af; }
.ct-card-duration { font-size: 0.75rem; color: #9ca3af; }

/* -- BOTONES FRONTEND -- */
.ct-btn {
  display: inline-flex; align-items: center;
  justify-content: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px;
  font-size: 0.875rem; font-weight: 700;
  cursor: pointer; border: none;
  text-decoration: none; transition: all 150ms;
  line-height: 1;
}
.ct-btn--primary {
  background: var(--ct-gradient,
    linear-gradient(135deg,var(--ct-primary),var(--ct-primary-dark)));
  color: white;
}
.ct-btn--primary:hover {
  box-shadow: 0 4px 12px rgba(var(--ct-primary-rgb),.35);
  color: white;
}
.ct-btn--whatsapp {
  background: #f0fdf4; color: #15803d;
  font-size: 0.75rem;
}
.ct-btn--whatsapp:hover { background: #dcfce7; }
.ct-btn--full { width: 100%; }
.ct-btn--disabled { opacity:.45; cursor:not-allowed; pointer-events:none; }

/* -- TOUR SINGLE -- */
.ct-single-tour { width: 100%; }
.ct-hero {
  position: relative; height: 224px; overflow: hidden;
  border-radius: 12px; margin-bottom: 0;
}
.ct-hero img {
  width: 100%; height: 100%; object-fit: cover;
}
.ct-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,.2) 60%,transparent 100%);
}
.ct-hero-content {
  position: absolute; bottom: 16px;
  left: 20px; right: 20px;
}
.ct-hero-badges { display: flex; gap: 6px; margin-bottom: 8px; }
.ct-hero-badge {
  font-size: 0.7rem; font-weight: 700;
  padding: 3px 10px; border-radius: 99px;
}
.ct-hero-badge--zone {
  background: var(--ct-primary); color: white;
}
.ct-hero-badge--type {
  background: rgba(255,255,255,.2);
  backdrop-filter: blur(4px); color: white;
}
.ct-tour-title {
  font-size: 1.5rem; font-weight: 900;
  color: white; margin: 0; line-height: 1.2;
}

/* -- LAYOUT SINGLE -- */
.ct-tour-layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 0;
  border: 1px solid #f3f4f6;
  border-radius: 12px;
  overflow: hidden;
  background: white;
}
.ct-tour-main {
  padding: 24px;
  border-right: 1px solid #f3f4f6;
}
.ct-tour-sidebar { padding: 20px; }

/* -- STATS BAR -- */
.ct-tour-stats {
  display: flex; align-items: center;
  gap: 0; margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f3f4f6;
}
.ct-stat { text-align: center; flex: 1; }
.ct-stat-value {
  display: block; font-weight: 700;
  font-size: 0.875rem; color: #1f2937;
}
.ct-stat-label {
  display: block; font-size: 0.7rem;
  color: #9ca3af; margin-top: 2px;
}
.ct-stat-divider {
  width: 1px; height: 32px;
  background: #f3f4f6; flex-shrink: 0;
}
.ct-lang-badges { display: flex; gap: 4px; justify-content: center; }
.ct-lang-badge {
  font-size: 0.65rem; font-weight: 700;
  background: #f3f4f6; color: #6b7280;
  padding: 2px 6px; border-radius: 4px;
  font-family: monospace;
}

/* -- DESCRIPCIÓN -- */
.ct-tour-description {
  font-size: 0.875rem; color: #6b7280;
  line-height: 1.6; margin-bottom: 20px;
}

/* -- INCLUYE / NO INCLUYE -- */
.ct-tour-inclusions {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 12px; margin-bottom: 20px;
}
.ct-includes {
  background: #ecfdf5; border-radius: 12px; padding: 12px;
}
.ct-excludes {
  background: #fff1f2; border-radius: 12px; padding: 12px;
}
.ct-includes h4 {
  font-size: 0.75rem; font-weight: 700;
  color: #065f46; margin: 0 0 8px;
}
.ct-excludes h4 {
  font-size: 0.75rem; font-weight: 700;
  color: #be123c; margin: 0 0 8px;
}
.ct-includes ul, .ct-excludes ul {
  list-style: none; margin: 0; padding: 0;
}
.ct-includes li {
  font-size: 0.75rem; color: #047857;
  padding: 2px 0;
}
.ct-includes li::before { content: '· '; }
.ct-excludes li {
  font-size: 0.75rem; color: #be123c;
  padding: 2px 0;
}
.ct-excludes li::before { content: '· '; }

/* -- GALERÍA -- */
.ct-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px,1fr));
  gap: 6px; margin-top: 16px;
}
.ct-gallery img {
  width: 100%; aspect-ratio: 1;
  object-fit: cover; border-radius: 8px;
}

/* -- PRECIO BOX -- */
.ct-price-box {
  background: #f9fafb; border-radius: 12px;
  padding: 16px; margin-bottom: 12px;
}
.ct-price-box .ct-price-label {
  font-size: 0.75rem; color: #9ca3af;
  display: block; margin-bottom: 4px;
}
.ct-price-main {
  font-size: 1.5rem; font-weight: 900; color: #1f2937;
  line-height: 1;
}
.ct-price-main span { font-size: 0.875rem; color: #9ca3af; font-weight: 400; }
.ct-price-secondary {
  font-size: 0.875rem; color: #6b7280; margin-top: 4px;
}

/* -- FORMULARIO FRONTEND -- */
.ct-inquiry-form { display: flex; flex-direction: column; gap: 8px; }
.ct-form-field { display: flex; flex-direction: column; gap: 4px; }
.ct-form-field label {
  font-size: 0.75rem; font-weight: 600; color: #374151;
}
.ct-form-field input {
  border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 8px 12px; font-size: 0.75rem;
  color: #1f2937; transition: border-color 150ms, box-shadow 150ms;
}
.ct-form-field input:focus {
  outline: none;
  border-color: var(--ct-primary);
  box-shadow: 0 0 0 3px rgba(var(--ct-primary-rgb),.15);
}
.ct-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ct-field-error {
  font-size: 0.7rem; color: #ef4444; min-height: 16px;
}
.ct-form-message {
  padding: 10px 14px; border-radius: 8px;
  font-size: 0.8125rem; font-weight: 500;
}
.ct-form-message--success {
  background: #ecfdf5; color: #065f46;
}
.ct-form-message--error {
  background: #fff1f2; color: #be123c;
}

/* -- NO RESULTS -- */
.ct-no-results {
  grid-column: 1/-1; text-align: center;
  padding: 48px; color: #9ca3af;
}
.ct-no-results-icon { font-size: 2rem; display: block; margin-bottom: 8px; }

/* -- PLACEHOLDER SIN FOTO -- */
.ct-card-image--no-photo .ct-placeholder-bg {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, #e5e7eb, #d1d5db);
}

/* ==========================================================================
   AISLAMIENTO DE TEMA Y COMPATIBILIDAD CON ELEMENTOR
   Reglas con !important al final del archivo para anular estilos del tema
   (colores heredados en botones, tipografías, box model) tanto en el editor
   clásico como dentro de widgets de Elementor. Ganan por especificidad y orden.
   ========================================================================== */

/* Aislar el box model del catálogo del tema activo. */
.ct-catalog,
.ct-catalog *,
.ct-catalog *::before,
.ct-catalog *::after,
.elementor-widget-shortcode .ct-catalog *,
.elementor-widget-shortcode .ct-catalog *::before,
.elementor-widget-shortcode .ct-catalog *::after {
  box-sizing: border-box !important;
}

.ct-catalog {
  display: block !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Inter', system-ui, sans-serif !important;
  color: #1f2937 !important;
  width: 100% !important;
}

/* ==========================================================================
   BOTONES DEL FORMULARIO DE RESERVA (reset anti-tema)
   ========================================================================== */
.ct-inquiry-form .ct-btn {
  all: unset !important;
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 12px 20px !important;
  border-radius: 8px !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 150ms !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
  margin-bottom: 8px !important;
}
.ct-inquiry-form .ct-btn--primary,
.ct-inquiry-form .ct-btn--submit {
  background: var(--ct-primary, #0891b2) !important;
  color: #ffffff !important;
}
.ct-inquiry-form .ct-btn--primary:hover,
.ct-inquiry-form .ct-btn--submit:hover {
  opacity: 0.9 !important;
}
.ct-inquiry-form .ct-btn--whatsapp {
  background: #f0fdf4 !important;
  color: #15803d !important;
  border: 1.5px solid #bbf7d0 !important;
}
.ct-inquiry-form .ct-btn--whatsapp:hover {
  background: #dcfce7 !important;
}
.ct-inquiry-form .ct-btn--disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* ==========================================================================
   BADGES DEL HERO (single tour) — en línea, sin superposición
   ========================================================================== */
.ct-hero-badges {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 8px !important;
  align-items: center !important;
}
.ct-hero-badge {
  position: static !important;
  display: inline-flex !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  padding: 3px 10px !important;
  border-radius: 99px !important;
  white-space: nowrap !important;
}
.ct-hero-badge--zone {
  background: var(--ct-primary, #0891b2) !important;
  color: #ffffff !important;
}
.ct-hero-badge--type {
  background: rgba(255,255,255,.2) !important;
  backdrop-filter: blur(4px) !important;
  color: #ffffff !important;
}
.ct-hero-badge--soldout {
  background: #ef4444 !important;
  color: #ffffff !important;
}
.ct-hero-badge--paused {
  background: #f59e0b !important;
  color: #ffffff !important;
}

/* ==========================================================================
   FAQ (acordeón en el single del tour)
   ========================================================================== */
.ct-tour-faqs {
  margin-top: 24px;
  border-top: 1px solid #f3f4f6;
  padding-top: 20px;
}
.ct-faqs-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 12px;
}
.ct-faq {
  border-bottom: 1px solid #f3f4f6;
}
.ct-faq-toggle {
  all: unset;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 14px 0;
  cursor: pointer;
  box-sizing: border-box;
}
.ct-faq-q {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
  flex: 1;
  text-align: left;
}
.ct-faq-icon {
  color: #9ca3af;
  font-size: 1rem;
  transition: transform 200ms;
  flex-shrink: 0;
  margin-left: 12px;
}
.ct-faq.is-open .ct-faq-icon {
  transform: rotate(180deg);
}
.ct-faq-body {
  padding: 0 0 14px;
}
.ct-faq-body p {
  font-size: 0.875rem;
  color: #6b7280;
  line-height: 1.6;
  margin: 0;
}

/* ==========================================================================
   RESPONSIVE MOBILE
   Ajustes finos para el catálogo y el single del tour en pantallas chicas.
   Se ubican al final para ganar por orden frente a las reglas base.
   ========================================================================== */

/* -- CATÁLOGO (≤600px): una sola columna -- */
@media (max-width: 600px) {
  .ct-tours-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 0 !important;
  }

  .ct-catalog {
    padding: 0 !important;
  }

  .ct-catalog-meta {
    font-size: 0.75rem !important;
    padding: 4px 0 8px !important;
  }
}

/* -- SINGLE TOUR (≤768px): columna única -- */
@media (max-width: 768px) {
  /* Layout: pasar de 2/3 + 1/3 a columna única. */
  .ct-tour-layout {
    grid-template-columns: 1fr !important;
  }

  .ct-tour-main {
    border-right: none !important;
    border-bottom: 1px solid #f3f4f6 !important;
    padding: 16px !important;
  }

  .ct-tour-sidebar {
    padding: 16px !important;
  }

  .ct-tour-title {
    font-size: 1.15rem !important;
  }

  /* Stats bar: scroll horizontal en mobile. */
  .ct-tour-stats {
    overflow-x: auto !important;
    gap: 0 !important;
    padding-bottom: 12px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .ct-stat {
    min-width: 80px !important;
    flex-shrink: 0 !important;
  }

  /* Includes/excludes: columna única. */
  .ct-tour-inclusions {
    grid-template-columns: 1fr !important;
  }

  /* Formulario: full width. */
  .ct-form-row {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 480px) {
  .ct-price-main {
    font-size: 1.25rem !important;
  }

  .ct-btn {
    padding: 12px !important;
    font-size: 0.875rem !important;
  }
}

/* ==========================================================================
   HERO GRANDE (single tour)
   Va al final para ganar por orden: la base fija 380px y los media queries
   posteriores (mismo selector + !important) la reducen en tablet/mobile.
   ========================================================================== */
.ct-hero {
  height: 380px !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}
.ct-hero img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}
.ct-hero-overlay {
  background: linear-gradient(
    to top,
    rgba(0,0,0,.75) 0%,
    rgba(0,0,0,.15) 50%,
    transparent 100%
  ) !important;
}

@media (max-width: 768px) {
  .ct-hero {
    height: 280px !important;
  }
}

@media (max-width: 480px) {
  .ct-hero {
    height: 220px !important;
  }
}