/* Reuse the real Home title component in styles.css:
   h1 + brand-display / brand-script / brand-block.
   The fonts, relative sizes, optical margins, rotation and block padding
   remain defined there, including the original 700px mobile rules.
   Only the text-area width and the whole composition's fit are adapted. */
.visa-hero-copy, .esta-hero-copy, .cruises-hero-copy { container-type: inline-size; }
h1.brand-hero-title {
  --title-fit: 23cqw;
  width: 100%;
  max-width: 570px;
  container-type: inline-size;
  color: #341b47;
  font-size: min(clamp(2.65rem, 4.45vw, 4.9rem), var(--title-fit));
}
h1.brand-hero-title--long { --title-fit: min(13cqw, 4.65rem); }
/* "Estados Unidos" has taller capitals and deeper swashes than "aventura".
   Compensate only that glyph difference against the Home's optical margins. */
h1.brand-hero-title--long .brand-script {
  margin-top: calc(-.42em + .13em);
  margin-bottom: calc(-.07em + .10em);
}
h1.brand-hero-title > span { white-space: nowrap; }
h1.brand-hero-title .brand-display:first-child {
  color: #341b47;
  -webkit-text-stroke: 0;
  text-shadow: none;
}
@media (max-width: 700px) {
  h1.brand-hero-title {
    max-width: 440px;
    font-size: min(clamp(2.05rem, 10.4vw, 3.5rem), var(--title-fit));
  }
  h1.brand-hero-title--long .brand-script {
    margin-top: calc(-.4em + .13em);
    margin-bottom: calc(-.06em + .10em);
  }
}