/* INPETRAVEL V4.9.16.3 — ajuste global de heroes, conservando los textos editables del CMS.
   Se carga despues de los estilos existentes para no sustituir la apariencia del proyecto. */

/* Hero principal construido mediante bloques (portada, landings). */
.travel-hero {
  min-height: clamp(470px, 42vw, 625px);
}
.travel-hero .travel-hero__content {
  padding-top: clamp(5.5rem, 7vw, 7.25rem);
  padding-bottom: clamp(3.5rem, 5vw, 4.5rem);
}
.travel-hero h1 {
  width: 100%;
  max-width: 1180px;
  margin-top: .85rem;
  margin-bottom: 1.1rem;
  font-size: clamp(2.55rem, 4.5vw, 4.65rem);
  line-height: 1.075;
  letter-spacing: -.055em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
/* El fragmento verde sigue siendo editable, pero ya no fuerza un salto de linea. */
.travel-hero h1 span {
  display: inline !important;
  color: var(--green);
}
.travel-hero .travel-hero__content > p:not(.travel-hero__kicker) {
  max-width: 780px;
  line-height: 1.68;
}
.travel-hero .travel-hero__actions { margin-top: 1.5rem; }
.travel-hero .travel-hero__trust { margin-top: 2rem; }
.travel-hero .travel-hero__scrim {
  background: linear-gradient(90deg, rgba(10, 15, 20, .90) 0%, rgba(10, 15, 20, .73) 43%, rgba(10, 15, 20, .43) 75%, rgba(10, 15, 20, .15) 100%);
}

/* Heroes del CMS y de las fichas del catalogo. */
.page-hero { min-height: clamp(315px, 29vw, 440px); }
.page-hero .page-hero__inner {
  padding-top: clamp(4.25rem, 5.4vw, 5.5rem);
  padding-bottom: clamp(3rem, 4.8vw, 5rem);
}
.page-hero h1 {
  width: 100%;
  max-width: 1120px;
  margin: .75rem 0 1rem;
  font-size: clamp(2.25rem, 4.1vw, 4.25rem);
  line-height: 1.1;
  letter-spacing: -.047em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

/* Salvaguarda visual: nunca mas de dos lineas visibles, incluso antes de cargar JS.
   JS intenta ajustar la tipografia sin recortar el titulo. */
.travel-hero h1,
.page-hero h1 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
/* Durante la medicion JS se muestra el titulo completo, sin limitar su altura. */
.travel-hero h1.hero-title--measuring,
.page-hero h1.hero-title--measuring {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}

@media (max-width: 700px) {
  .travel-hero { min-height: 0; }
  .travel-hero .travel-hero__content {
    padding-top: 5.3rem;
    padding-bottom: 3rem;
  }
  .travel-hero h1 {
    max-width: 100%;
    font-size: clamp(1.45rem, 6.5vw, 2.35rem);
    line-height: 1.13;
    letter-spacing: -.048em;
  }
  .travel-hero .travel-hero__content > p:not(.travel-hero__kicker) {
    font-size: 1rem;
    line-height: 1.6;
  }
  .travel-hero .travel-hero__actions { margin-top: 1.2rem; }
  .travel-hero .travel-hero__trust { margin-top: 1.5rem; }
  .travel-hero .travel-hero__scrim {
    background: linear-gradient(90deg, rgba(10, 15, 20, .89), rgba(10, 15, 20, .57));
  }
  .page-hero { min-height: 0; }
  .page-hero .page-hero__inner {
    padding-top: 4.8rem;
    padding-bottom: 2.9rem;
  }
  .page-hero h1 {
    font-size: clamp(1.45rem, 6.6vw, 2.4rem);
    line-height: 1.13;
    letter-spacing: -.045em;
  }
}