/* Travel landing page carousel. Booking forms and product-detail benefits are separate. */
.travel-hero-deck { margin-top: 24px; }
.travel-hero-deck-apt { margin-top: 0; }
.travel-hero-deck .travel-hero { margin-top: 0; }
.travel-hero-benefit { display: grid; grid-template-columns: 1.1fr 1fr; min-height: 560px; margin-top: 18px; overflow: hidden; border-radius: 28px; background: #fffbed; color: #171717; }
.travel-hero-benefit-photo { position: relative; grid-column: 2; grid-row: 1; min-width: 0; overflow: hidden; background: #e9ede3; }
.travel-hero-benefit-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 56% center; }
.travel-hero-benefit-photo::after { position: absolute; inset: 60% 0 0; content: ""; background: linear-gradient(transparent, rgb(0 0 0 / .45)); }
.travel-hero-benefit-photo > span { position: absolute; left: 24px; right: 20px; bottom: 22px; z-index: 1; font-size: 11px; font-weight: 800; letter-spacing: .1em; color: #fff; }
.travel-hero-benefit-copy { grid-column: 1; grid-row: 1; align-self: center; min-width: 0; padding: 40px 42px; }
.travel-page .travel-hero-benefit-kicker { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 800; letter-spacing: .035em; color: #785512; }
.travel-hero-benefit-kicker svg { width: 29px; height: 29px; padding: 5px; border-radius: 8px; background: var(--travel-yellow); color: #171717; }
.travel-page .travel-hero-benefit h2 { margin-top: 18px; font-size: clamp(28px, 3vw, 42px); line-height: 1.5; letter-spacing: -.04em; }
.travel-hero-benefit h2 em { font-style: normal; background: linear-gradient(transparent 62%, var(--travel-yellow) 62%); }
.travel-page .travel-hero-benefit-lead { margin-top: 12px; font-size: 14px; line-height: 1.85; color: #575249; }
.travel-hero-benefit-price { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 20px; }
.travel-hero-benefit-price > span { font-size: 12px; color: #625d54; }
.travel-hero-benefit-price s { margin-left: 4px; font-size: 18px; font-weight: 700; }
.travel-hero-benefit-price strong { font-size: 30px; font-weight: 900; line-height: 1.3; }
.travel-hero-benefit-price b { font-size: 19px; }
.travel-page .travel-hero-benefit-points { display: grid; gap: 5px; margin-top: 16px; }
.travel-hero-benefit-points li { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; line-height: 1.6; }
.travel-hero-benefit-points svg { color: #2f684a; width: 17px; height: 17px; }
.travel-hero-benefit-copy > .travel-button-yellow { margin-top: 23px; padding: 12px 22px; white-space: normal; line-height: 1.5; text-align: center; }
.travel-page .travel-hero-benefit-terms { max-width: 420px; margin-top: 13px; color: #706b62; font-size: 10px; line-height: 1.8; }
.travel-hero-benefit-terms a { white-space: nowrap; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.travel-hero-slides { display: grid; grid-template-columns: minmax(0, 1fr); }
.travel-hero-slides [data-hero-slide] { grid-area: 1 / 1; align-self: stretch; width: 100%; min-width: 0; margin-top: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .35s ease, visibility .35s; }
.travel-hero-deck:not(.is-ready) [data-hero-slide]:first-child { opacity: 1; visibility: visible; pointer-events: auto; }
.travel-hero-deck.is-ready [data-hero-slide].is-current { opacity: 1; visibility: visible; pointer-events: auto; }
.travel-hero-deck:focus-visible { outline: 3px solid #d7ad26; outline-offset: 4px; }
@media (min-width: 641px) and (max-width: 960px) {
    .travel-hero-benefit { grid-template-columns: 1.15fr 1fr; min-height: 500px; }
    .travel-hero-benefit-copy { padding: 30px 28px; }
    .travel-page .travel-hero-benefit h2 { font-size: 30px; }
}
@media (max-width: 640px) {
    .travel-hero-deck { margin-top: 12px; }
    .travel-hero-deck-apt { margin-top: 0; }
    .travel-hero-benefit { grid-template-columns: minmax(0, 1fr); grid-template-rows: 150px auto; min-height: 0; border-radius: 20px; }
    .travel-hero-benefit-photo { grid-column: 1; grid-row: 1; }
    .travel-hero-benefit-photo img { object-position: 50% 43%; }
    .travel-hero-benefit-photo > span { left: 20px; bottom: 12px; font-size: 9px; }
    .travel-hero-benefit-copy { grid-column: 1; grid-row: 2; padding: 20px; align-self: start; }
    .travel-page .travel-hero-benefit-kicker { gap: 7px; font-size: 10px; }
    .travel-hero-benefit-kicker svg { width: 24px; height: 24px; padding: 4px; border-radius: 6px; }
    .travel-page .travel-hero-benefit h2 { margin-top: 10px; font-size: 26px; line-height: 1.45; letter-spacing: -.04em; }
    .travel-page .travel-hero-benefit-lead { margin-top: 8px; font-size: 12px; line-height: 1.7; }
    .travel-hero-benefit-price { margin-top: 12px; gap: 12px; }
    .travel-hero-benefit-price > span { font-size: 10px; }
    .travel-hero-benefit-price s { font-size: 16px; }
    .travel-hero-benefit-price strong { font-size: 25px; }
    .travel-hero-benefit-price b { font-size: 16px; }
    .travel-page .travel-hero-benefit-points { gap: 3px; margin-top: 10px; }
    .travel-hero-benefit-points li { gap: 6px; font-size: 11px; }
    .travel-hero-benefit-copy > .travel-button-yellow { width: 100%; min-height: 44px; margin-top: 15px; padding: 10px 12px; font-size: 12px; }
    .travel-page .travel-hero-benefit-terms { margin-top: 9px; font-size: 9px; line-height: 1.7; }
    .travel-hero-deck-apt .travel-hero-benefit { border-radius: 12px; }
}
@media (max-width: 359px) {
    .travel-hero-benefit { grid-template-rows: 125px auto; }
    .travel-hero-benefit-copy { padding: 16px; }
    .travel-page .travel-hero-benefit h2 { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
    .travel-hero-deck.is-ready [data-hero-slide] { transition: none; }
}
