/* Correcciones móviles · Chan Paradise Sailing · 30 oct 2026
   Se carga al final en las portadas ES/EN. Escritorio: solo afecta .total y elementos ocultos. */

/* Calculadora: "Anticipo (30%): $8,010" en una sola línea (también en escritorio) */
.total small span { display: inline; }

.swipe-hint, .carousel-dots { display: none; }

@media (max-width: 720px) {

  /* ---------- 1. Aviso de cookies compacto, abajo, sin tapar el encabezado ---------- */
  .cookie, .cookie.cookie-inline {
    position: fixed !important; top: auto !important; left: 8px !important; right: 8px !important;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important; width: auto !important; max-width: none !important;
    padding: 12px 14px !important; z-index: 950 !important;
    border: 0 !important; border-top: 2px solid var(--teal) !important;
    box-shadow: 0 10px 30px rgba(13, 27, 38, .28) !important;
  }
  .cookie p { font-size: 13px !important; line-height: 1.4 !important; margin: 0 0 10px !important; }
  .cookie > div { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px !important; }
  .cookie button { min-height: 44px; font-size: 13px; padding: 8px 6px; white-space: nowrap; }
  body.cookie-flow .hero { margin-top: 76px !important; }

  /* ---------- 2. Página más corta: secciones con menos aire ---------- */
  .section { padding-top: 56px !important; padding-bottom: 56px !important; }
  .section-heading { margin-bottom: 0; }
  .section-heading h2 { font-size: 32px; }
  .pricing-section .split-heading h2 { font-size: 28px; }

  /* "Por qué elegirnos" repite la franja de confianza: en móvil solo quedan las reseñas */
  .why-section > .wrap > .section-heading, .why-section .why-grid { display: none !important; }
  .why-section { padding-top: 48px !important; }
  .why-section .review-box { margin-top: 0 !important; padding: 0 0 6px !important; border: 0 !important; background: transparent !important; }
  .review-box .button { width: 100%; justify-content: center; }

  /* Carruseles deslizables */
  .experience-grid, .route-grid, .include-grid, .gallery, .google-review-cards:not([hidden]) {
    display: flex !important; grid-template-columns: none !important;
    gap: 12px !important; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding: 0 16px;
    margin-left: -16px !important; margin-right: -16px !important;
    padding: 6px 16px 10px !important;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .experience-grid::-webkit-scrollbar, .route-grid::-webkit-scrollbar, .include-grid::-webkit-scrollbar,
  .gallery::-webkit-scrollbar, .google-review-cards::-webkit-scrollbar { display: none; }
  .experience-grid > *, .route-grid > *, .include-grid > *, .google-review-cards > * {
    flex: 0 0 86% !important; max-width: 86%; scroll-snap-align: start; min-width: 0 !important; margin: 0 !important;
  }
  .gallery { margin: 0 !important; }
  .gallery > img {
    flex: 0 0 86% !important; width: 86% !important; height: 300px !important; max-height: none !important;
    object-fit: cover; scroll-snap-align: start; margin: 0 !important;
  }
  .include-grid { border: 0 !important; }
  .include-grid > article { border: 1px solid var(--line) !important; background: #fff; }
  .route-grid > article { min-height: 0; height: 460px !important; }
  .route-card:after { background: linear-gradient(0deg, rgba(1,20,34,.95) 0%, rgba(1,20,34,.82) 55%, rgba(1,20,34,.15) 100%) !important; }
  .route-card h3 { font-size: 28px !important; }
  .route-grid > article img { height: 100%; }

  .swipe-hint {
    display: block; margin: 22px 0 6px; font: 500 12px/1.3 var(--sans, Arial, sans-serif);
    letter-spacing: .06em; color: var(--muted); text-align: right;
  }
  .route-section .swipe-hint { color: #fff; opacity: .85; }
  .route-section .carousel-dots { color: #fff; }
  .gallery-section .swipe-hint { color: var(--muted); opacity: 1; }
  .gallery-section .swipe-hint { padding: 0 16px; }
  .carousel-dots { display: flex; justify-content: center; gap: 7px; margin: 10px 0 0; }
  .carousel-dots span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .22; transition: opacity .2s, transform .2s; }
  .carousel-dots span.on { opacity: .85; transform: scale(1.25); }

  /* Experiencias: texto completo (sin recortes "…") e imagen más baja */
  .experience-card .card-body > p {
    display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important;
  }
  .experience-card .card-image img { height: 170px !important; max-height: 170px !important; object-fit: cover; }
  .experience-card .card-body { padding: 22px 20px !important; }
  .mini-card { min-height: 0 !important; }
  .mini-card > div { padding: 24px 20px !important; }

  /* ---------- 3. Formulario: 16 px para que iPhone no haga zoom ---------- */
  .contact input, .contact select, .contact textarea,
  #quoteForm input, #quoteForm select, #quoteForm textarea { font-size: 16px !important; }
  #quoteForm input:not([type=checkbox]):not(.hp), #quoteForm select { min-height: 44px; }
  .consent { min-height: 44px; align-items: flex-start; }
  .consent input[type=checkbox] { width: 22px; height: 22px; flex: 0 0 22px; }

  /* ---------- 4. Calculadora: deslizadores grandes + botones − / + ---------- */
  .range-stepper { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 10px; margin: 6px 0 14px; }
  .step-btn {
    width: 44px; height: 44px; border: 1px solid var(--line); background: #fff; color: var(--ink);
    font: 400 24px/1 var(--sans, Arial, sans-serif); cursor: pointer; border-radius: 0; padding: 0;
  }
  .step-btn:active { background: var(--cream); }
  .calculator input[type="range"] { height: 44px; margin: 0; background: transparent; }
  .calculator input[type="range"]::-webkit-slider-thumb { width: 28px; height: 28px; }
  .calculator input[type="range"]::-moz-range-thumb { width: 28px; height: 28px; }
  .calculator .toggle button { min-height: 44px; min-width: 56px; font-size: 14px; }
  .breakdown div { font-size: 14px; }

  /* ---------- 5. Áreas táctiles de al menos 44 px ---------- */
  .experience-card a, .mini-card a, .text-link, .review-expand, .review-original,
  .hero-quote a, .steps-cta .text-link, .route-section a, .faq-section a, .phone-link,
  footer a, .footer-grid a, .socials a, .cookie-settings, .lang {
    display: inline-flex !important; align-items: center; min-height: 44px !important; margin-top: 0;
  }
  footer a, .footer-grid a { display: flex !important; }
  .google-review-cards .review-expand { padding: 0; background: none; border: 0; }
  .faqs summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; }

  /* ---------- 6. Texto mínimo 12 px ---------- */
  .eyebrow { font-size: 12px !important; letter-spacing: .18em !important; }
  .hero-v2 .hero-card > span { font-size: 12px !important; letter-spacing: .16em !important; }
  .experience-recommendation { font-size: 12px !important; letter-spacing: .12em !important; }
  .card-body > span, .mini-card span, .include-grid span, .why-grid span, .route-card span,
  .experience-highlights strong, .experience-highlights span { font-size: 12px !important; }
  .experience-highlights span { font-size: 14px !important; }
  .pt-head > span { font-size: 12px !important; letter-spacing: .06em !important; }
  .pt-head em { font-size: 12px !important; }
  .pt-row small { font-size: 12px !important; }
  .pt-row > span { padding: 14px 6px !important; }
  .compare-label { font-size: 12px !important; letter-spacing: .14em !important; }
  .trust-grid b { font-size: 14px !important; }
  .google-review-source, .review-date, .review-translation, .google-review-cards .review-translation { font-size: 12px !important; }
  .fineprint, .pt-note, .route-note, .hero-card-note, .copyright, .copyright span { font-size: 12px !important; }
  .range-label span, .option-row label { font-size: 13px !important; }
  .mobile-bar a { font-size: 13px !important; letter-spacing: .08em !important; }
  .calc-photo { display: none; }
  .vessel-badge span, .socials a, .socials span, .socials a * { font-size: 12px !important; }
}

@media (max-width: 380px) {
  .pt-row { grid-template-columns: .7fr 1fr 1fr !important; }
  .pt-row b { font-size: 19px !important; }
  .mobile-bar a { font-size: 12px !important; letter-spacing: .04em !important; }
}

/* Botón "Cotizar / Get a quote" en la barra móvil (30 oct 2026) */
@media (max-width: 720px) {
  .mobile-bar { grid-template-columns: 1.35fr 1.15fr 1fr !important; }
  .mobile-bar .mobile-bar-quote { letter-spacing: .04em !important; padding: 0 6px; white-space: nowrap; }
}
@media (max-width: 360px) {
  .mobile-bar .mobile-bar-wa { gap: 6px; }
  .mobile-bar a { letter-spacing: .02em !important; font-size: 12px !important; }
}

/* Saltos del menú / barra: el título no queda debajo del encabezado fijo (30 oct 2026) */
section[id], #google-opiniones, #quoteForm { scroll-margin-top: 90px; }
@media (max-width: 720px) {
  section[id], #google-opiniones { scroll-margin-top: 76px; }
  /* "Cotizar" lleva directo al formulario: se quita la foto decorativa del bloque de contacto */
  .contact .contact-image { display: none !important; }
}

/* ===== Auditoría 30 oct 2026 · web, tablet y móvil ===== */
/* Todas las pantallas */
:root { --teal: #806332; }                     /* latón con contraste AA sobre marfil */
.route-card span, .mini-card span, .trust-grid span { color: var(--aqua) !important; }
@media (min-width: 721px) { .socials a, .socials span, .socials a * { font-size: 12px !important; } }
input, select, textarea, button { font-family: inherit; }
.contact textarea { font-family: var(--sans); }
/* Formulario: nombre en su propia fila; lada + teléfono debajo */
.form-row > .phone-fields { grid-column: 1 / -1; }
.form-row:has(> .phone-fields) { grid-template-columns: 1fr; }
/* Calculadora: botones − / + a los lados del deslizador */
.range-stepper { display: grid; grid-template-columns: 40px 1fr 40px; align-items: center; gap: 12px; margin: 6px 0 14px; }
.step-btn { width: 40px; height: 40px; border: 1px solid var(--line); background: #fff; color: var(--ink);
  font: 400 22px/1 var(--sans, Arial, sans-serif); cursor: pointer; border-radius: 0; padding: 0; }
.step-btn:hover { background: var(--cream); }
.calculator input[type="range"] { margin: 0; }
/* "02" ya no queda pegado a "RECOMENDADO" */
.experience-card .card-body > span { display: block; margin-bottom: 8px; }
/* Texto mínimo 12 px también en tablet y escritorio */
@media (min-width: 721px) {
  .eyebrow, .hero-v2 .hero-card > span, .experience-recommendation, .card-body > span, .mini-card span,
  .include-grid span, .route-card span, .pt-head > span, .pt-head em, .compare-label, .vessel-badge span,
  .experience-highlights strong, .google-review-source, .review-date, .review-translation, .fineprint,
  .pt-note, .route-note, .copyright, .copyright span, .trust-grid span, .occasions li { font-size: 12px !important; }
}

/* Móvil */
@media (max-width: 720px) {
  .experience-card .card-image { height: 170px !important; }
  .step-btn { width: 44px; height: 44px; }
  .range-stepper { grid-template-columns: 44px 1fr 44px; }
}

/* Tablet (y pantallas táctiles medianas) */
@media (min-width: 721px) and (max-width: 1180px), (min-width: 721px) and (pointer: coarse) {
  .step-btn { width: 44px; height: 44px; }
  .range-stepper { grid-template-columns: 44px 1fr 44px; }
  .calculator .toggle button { min-height: 44px; min-width: 56px; }
  .faqs summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; }
  .text-link, .review-expand, .review-original, .hero-quote a, .experience-card a, .mini-card a,
  .footer-grid a, .socials a, .cookie-settings, .lang, .phone-link {
    display: inline-flex !important; align-items: center; min-height: 44px !important;
  }
  .google-review-cards .review-expand { padding: 0; background: none; border: 0; }
  .nav a { min-height: 44px; display: inline-flex; align-items: center; }
}
@media (min-width: 721px) and (max-width: 1000px) {
  /* Inicio: texto legible sobre la foto */
  .hero-shade { background: linear-gradient(0deg, rgba(13,27,38,.94) 18%, rgba(13,27,38,.78) 60%, rgba(13,27,38,.62)) !important; }
  /* Rutas: una tarjeta por fila, texto con espacio */
  .route-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
  .route-grid > article { margin: 0 !important; height: 340px !important; transform: none !important; }
  .route-card:after { background: linear-gradient(0deg, rgba(1,20,34,.95) 0%, rgba(1,20,34,.75) 50%, rgba(1,20,34,.1) 100%) !important; }
  .route-card div { max-width: 600px; }
  /* Contacto: formulario a lo ancho, sin la franja de foto */
  .contact { grid-template-columns: 1fr !important; }
  .contact .contact-image { display: none !important; }
  .contact-panel { padding: 70px 8vw !important; }
}

/* Tabla de precios por grupo en celular: renglones parejos (30 oct 2026) */
@media (max-width: 720px) {
  .pt-row:not(.pt-head) > span:first-child { font-size: 15px !important; line-height: 1.15; }
  .pt-row:not(.pt-head) > span:first-child strong { display: block; font: 400 24px/1 var(--serif); color: var(--ink); margin-bottom: 2px; }
  .pt-row small span { display: block; }
}