#tripulantes.tripulante-section {
  --tripulante-selection-bg: #ffd83d;
  --tripulante-selection-fg: #062c89;
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #f5fbff;
  isolation: isolate;
}

#tripulantes .tripulante-reference-art,
#tripulantes .tripulante-reference-art img {
  display: block;
  width: 100%;
  height: 100%;
}

#tripulantes .tripulante-reference-art {
  position: absolute;
  inset: 0;
}

#tripulantes .tripulante-reference-art img {
  object-fit: cover;
  object-position: center top;
}

#tripulantes .tripulante-semantic-copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  color: rgba(0, 33, 140, .001);
  pointer-events: none;
  user-select: text;
  -webkit-user-select: text;
}

#tripulantes .tripulante-semantic-copy ::selection {
  color: var(--tripulante-selection-fg);
  background: var(--tripulante-selection-bg);
}

#tripulantes .tripulante-copy {
  position: absolute;
  margin: 0;
}

#tripulantes .tripulante-copy h2,
#tripulantes .tripulante-copy h3,
#tripulantes .tripulante-copy p,
#tripulantes .tripulante-copy li,
#tripulantes .tripulante-eyebrow {
  margin: 0;
}

#tripulantes .tripulante-semantic-link {
  color: rgba(0, 33, 140, .001);
  text-decoration: none;
  pointer-events: auto;
}

#tripulantes .tripulante-hotspot {
  position: absolute;
  z-index: 6;
  display: block;
  min-width: 44px;
  min-height: 44px;
  border-radius: 999px;
  background: transparent;
}

#tripulantes .tripulante-hotspot:focus-visible,
#tripulantes .tripulante-semantic-link:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(0, 123, 255, .5);
}

@media (min-width: 768px) {
  #tripulantes.tripulante-section { aspect-ratio: 1672 / 836; }
  #tripulantes .tripulante-eyebrow { position: absolute; top: 3.8%; left: 6.3%; width: 34%; font-size: clamp(11px, .85vw, 16px); letter-spacing: .24em; font-weight: 800; }
  #tripulantes .tripulante-hero-copy { top: 8.5%; left: 6.2%; width: 39%; }
  #tripulantes .tripulante-hero-copy h2 { font-size: clamp(32px, 4vw, 70px); line-height: .92; font-weight: 950; }
  #tripulantes .tripulante-hero-copy h3 { margin-top: 2.2%; font-size: clamp(16px, 1.65vw, 30px); line-height: 1.05; font-weight: 850; }
  #tripulantes .tripulante-hero-copy p { margin-top: 2%; width: 84%; font-size: clamp(14px, 1.18vw, 22px); line-height: 1.18; }
  #tripulantes .tripulante-hero-copy .tripulante-semantic-link { display: inline-flex; min-height: 46px; margin-top: 3%; padding: 0 22px; align-items: center; font-size: clamp(15px, 1.25vw, 22px); font-weight: 900; }
  #tripulantes .tripulante-story-copy { left: 6.2%; bottom: 5.6%; width: 40.8%; }
  #tripulantes .tripulante-story-copy h3 { font-size: clamp(19px, 2vw, 36px); font-weight: 900; }
  #tripulantes .tripulante-story-copy p { width: 88%; margin-top: 1.8%; font-size: clamp(12px, 1.05vw, 19px); line-height: 1.23; }
  #tripulantes .tripulante-story-copy .tripulante-handwritten { width: 52%; margin-top: 4%; font-size: clamp(18px, 2vw, 34px); line-height: .95; }
  #tripulantes .tripulante-benefits-copy { left: 51%; top: 55%; width: 17%; }
  #tripulantes .tripulante-benefits-copy h3 { font-size: clamp(20px, 2vw, 36px); font-weight: 900; }
  #tripulantes .tripulante-benefits-copy ul { margin: 5% 0 0; padding: 0; list-style: none; }
  #tripulantes .tripulante-benefits-copy li { display: flex; min-height: 44px; align-items: center; padding-left: 18%; font-size: clamp(11px, .95vw, 17px); line-height: 1.12; }
  #tripulantes .tripulante-whatsapp-copy { right: 5.7%; top: 58%; width: 26%; text-align: center; }
  #tripulantes .tripulante-whatsapp-copy h3 { font-size: clamp(13px, 1.15vw, 20px); line-height: 1.05; font-weight: 900; }
  #tripulantes .tripulante-whatsapp-copy .tripulante-semantic-link { display: flex; min-height: 50px; margin-top: 4%; align-items: center; justify-content: center; font-size: clamp(14px, 1.3vw, 23px); font-weight: 900; }
  #tripulantes .tripulante-trust-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4%; margin: 5% 0 0; padding: 0; list-style: none; }
  #tripulantes .tripulante-trust-list li { font-size: clamp(10px, .8vw, 14px); line-height: 1.1; }
  #tripulantes .tripulante-hotspot-experiences { left: 6.3%; top: 41.7%; width: 24%; height: 8%; }
  #tripulantes .tripulante-hotspot-whatsapp { right: 6.5%; top: 74.5%; width: 23%; height: 8%; }
}

@media (max-width: 767px) {
  #tripulantes.tripulante-section { aspect-ratio: 941 / 1576; }
  #tripulantes .tripulante-eyebrow { position: absolute; top: 2%; left: 14%; width: 42%; font-size: clamp(8px, 2vw, 14px); font-weight: 800; }
  #tripulantes .tripulante-hero-copy { top: 6%; left: 14%; width: 72%; }
  #tripulantes .tripulante-hero-copy h2 { width: 52%; font-size: clamp(25px, 6.2vw, 46px); line-height: .94; font-weight: 950; }
  #tripulantes .tripulante-hero-copy h3 { width: 51%; margin-top: 2%; font-size: clamp(15px, 3.4vw, 25px); line-height: 1.05; font-weight: 850; }
  #tripulantes .tripulante-hero-copy p { width: 50%; margin-top: 2%; font-size: clamp(12px, 2.6vw, 18px); line-height: 1.15; }
  #tripulantes .tripulante-hero-copy .tripulante-semantic-link { display: inline-flex; min-height: 44px; margin-top: 3%; padding: 0 18px; align-items: center; font-size: clamp(13px, 3vw, 20px); font-weight: 900; }
  #tripulantes .tripulante-story-copy { top: 36%; left: 14.5%; width: 70%; }
  #tripulantes .tripulante-story-copy h3 { font-size: clamp(18px, 4.4vw, 30px); line-height: 1; font-weight: 900; }
  #tripulantes .tripulante-story-copy p { width: 90%; margin-top: 2%; font-size: clamp(11px, 2.55vw, 17px); line-height: 1.18; }
  #tripulantes .tripulante-story-copy .tripulante-handwritten { width: 52%; margin-top: 5%; font-size: clamp(17px, 4.2vw, 28px); line-height: .92; }
  #tripulantes .tripulante-benefits-copy { top: 59%; left: 14%; width: 72%; }
  #tripulantes .tripulante-benefits-copy h3 { font-size: clamp(20px, 5vw, 32px); font-weight: 900; }
  #tripulantes .tripulante-benefits-copy ul { margin: 3% 0 0; padding: 0; list-style: none; }
  #tripulantes .tripulante-benefits-copy li { display: flex; min-height: 45px; align-items: center; padding-left: 16%; font-size: clamp(11px, 2.7vw, 17px); line-height: 1.12; }
  #tripulantes .tripulante-whatsapp-copy { left: 14%; bottom: 4%; width: 72%; text-align: center; }
  #tripulantes .tripulante-whatsapp-copy h3 { font-size: clamp(13px, 3vw, 20px); line-height: 1.05; font-weight: 900; }
  #tripulantes .tripulante-whatsapp-copy .tripulante-semantic-link { display: flex; width: 68%; min-height: 46px; margin: 4% auto 0; align-items: center; justify-content: center; font-size: clamp(14px, 3.4vw, 21px); font-weight: 900; }
  #tripulantes .tripulante-trust-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2%; margin: 6% 0 0; padding: 0; list-style: none; }
  #tripulantes .tripulante-trust-list li { font-size: clamp(9px, 2.2vw, 14px); line-height: 1.1; }
  #tripulantes .tripulante-hotspot-experiences { left: 13.5%; top: 27.8%; width: 40%; height: 4.5%; }
  #tripulantes .tripulante-hotspot-whatsapp { left: 27%; bottom: 7.5%; width: 47%; height: 4.3%; }
}

@media (prefers-reduced-motion: reduce) {
  #tripulantes,
  #tripulantes *,
  #tripulantes *::before,
  #tripulantes *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}