/* Shared across all pages: navigation dropdowns, footer, the Arrivals board, the request-received landing. */

/* nav dropdowns */
.nav { align-items: center; }
.nav > a, .dd__top { padding: 10px 0; }
.nav a[aria-current="page"] { opacity: 1; box-shadow: inset 0 -2px 0 var(--sun); }
.dd { position: relative; }
.dd__top span { font-size: .7em; opacity: .7; }
.dd__menu { position: absolute; top: 100%; left: -18px; min-width: 300px; display: grid; gap: 2px; padding: 10px; border-radius: 18px; background: #fff; color: var(--ink); box-shadow: 0 30px 60px -20px rgba(7,20,35,.45), 0 0 0 1px rgba(10,21,32,.06); opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .25s var(--ease), visibility 0s .25s; }
.dd:hover .dd__menu, .dd:focus-within .dd__menu { opacity: 1; visibility: visible; transform: none; transition: opacity .2s, transform .25s var(--ease), visibility 0s; }
.dd__menu a { display: block; padding: 10px 12px; border-radius: 12px; color: var(--ink); text-decoration: none; opacity: 1; }
.dd__menu a:hover, .dd__menu a:focus-visible { background: var(--sand); }
.dd__menu b { display: block; font: 700 .92rem/1.25 var(--fb); }
.dd__menu small { display: block; margin-top: 2px; font: 500 .78rem/1.3 var(--fb); color: var(--mute); }
.dd__sep { margin: 8px 12px 2px; font: 600 .62rem/1 var(--fm); letter-spacing: .18em; text-transform: uppercase; color: var(--lagoon-d); }
.hdr__partner { display: none; align-items: center; gap: 6px; color: inherit; text-decoration: none; font: 600 .86rem/1 var(--fb); opacity: .85; }
.hdr__partner svg { width: 18px; height: 18px; }
.hdr__partner:hover { opacity: 1; }
@media (min-width: 1100px) { .hdr__partner { display: inline-flex; } }
@media (min-width: 980px) and (max-width: 1100px) { .nav { gap: 18px; } }
.mnav__k { margin: 14px 0 0; font: 600 .66rem/1 var(--fm); letter-spacing: .2em; text-transform: uppercase; color: var(--lagoon); }
.mnav > a { font-size: 1.6rem; padding: 10px 0; }
.mnav { max-height: calc(100svh - 72px); overflow-y: auto; }

/* footer */
.ftr { padding-block: 64px 120px; }
.ftr__grid { grid-template-columns: minmax(0,1fr); gap: 34px; }
@media (min-width: 760px) { .ftr__grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; } }
.ftr__brand .muted { max-width: 28rem; margin: 6px 0 18px; }
.ftr__k { margin: 0 0 14px; font: 600 .68rem/1 var(--fm); letter-spacing: .2em; text-transform: uppercase; color: var(--lagoon); }
.ftr__list { gap: 9px; }
.ftr__list a { font-weight: 500; color: rgba(255,255,255,.85); }
.ftr__contact a { font-weight: 700; color: #fff; }
.ftr__bottom { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); }
.ftr__social { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.ftr__social a { color: #fff; font-weight: 600; font-size: .88rem; text-decoration: none; }
.ftr__social a:hover { color: var(--sun); }
.ftr__bottom .ftr__c { border: 0; padding: 0; margin: 0; }
@media (min-width: 980px) { .ftr { padding-bottom: 64px; } }

/* ---------- ARRIVALS: split-flap board of partner resorts ---------- */
.arrivals { background: radial-gradient(70rem 40rem at 80% 0%, #12395a, var(--night) 60%); color: #fff; overflow: hidden; }
.arrivals .h2 em { color: var(--sun-2); }
.arrivals .lead { color: rgba(255,255,255,.75); }
.arrivals__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 10px 40px; margin-bottom: 34px; }
.arrivals__head .lead { max-width: 26rem; margin: 0; }
.arr { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; align-items: start; }
@media (min-width: 1040px) { .arr { grid-template-columns: minmax(0,1.35fr) minmax(0,.9fr); gap: 28px; } }
.arr__board { padding: 10px; border-radius: 20px; background: #05090f; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 40px 80px -40px #000; }
.arr__row { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr) minmax(0,.9fr) minmax(0,.9fr); gap: 12px; align-items: center; width: 100%; padding: 9px 12px; border: 0; border-radius: 10px; background: transparent; color: #fff; text-align: left; font: inherit; cursor: pointer; transition: background-color .2s; }
.arr__row + .arr__row { border-top: 1px solid rgba(255,255,255,.05); }
.arr__row:hover { background: rgba(255,255,255,.04); }
.arr__row[aria-selected="true"] { background: rgba(244,183,64,.1); box-shadow: inset 3px 0 0 var(--sun); }
.arr__row--head { cursor: default; padding-block: 6px 10px; font: 600 .62rem/1 var(--fm); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); }
.arr__row--head:hover { background: none; }
.flaps { display: inline-flex; flex-wrap: wrap; gap: 3px 9px; }
.flaps .fw { display: inline-flex; gap: 2px; white-space: nowrap; }
.flaps i { display: inline-grid; place-items: center; min-width: .95em; height: 1.55em; padding: 0 1px; border-radius: 3px; background: linear-gradient(#1b232d 0 49%, #10161d 51% 100%); box-shadow: inset 0 -1px 0 rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.04); font: 600 .86rem/1 var(--fm); font-style: normal; color: #f2f5f8; transition: transform .06s; }
.flaps i.flip { transform: scaleY(.6); }
.flaps--dim i { color: #8fa3b6; font-size: .72rem; height: 1.6em; }
.flaps--sun i { color: var(--sun); }
.arr__st em { font: 600 .66rem/1.2 var(--fm); letter-spacing: .1em; text-transform: uppercase; font-style: normal; color: var(--lagoon); display: inline-flex; align-items: center; gap: 6px; }
.arr__st em::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--lagoon); animation: ping 2.4s infinite; }
.arr__card { position: relative; overflow: hidden; border-radius: 22px; background: #fff; color: var(--ink); box-shadow: 0 40px 80px -40px #000; }
@media (min-width: 1040px) { .arr__card { position: sticky; top: 100px; } }
.arr__photos { position: relative; aspect-ratio: 16 / 10; background: #0b2236; }
.arr__photos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity .6s, transform 1.2s var(--ease); }
.arr__photos img.on { opacity: 1; transform: none; }
.arr__body { padding: 20px 22px 22px; }
.arr__k { margin: 0 0 6px; font: 600 .68rem/1 var(--fm); letter-spacing: .16em; text-transform: uppercase; color: var(--lagoon-d); }
.arr__card h3 { font: 400 2.1rem/1 var(--fd); margin-bottom: .35em; }
.arr__card.pop .arr__body { animation: fade .5s var(--ease); }
.arr__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0 18px; }
.arr__facts div { padding: 10px 12px; border-radius: 12px; background: var(--sand); }
.arr__facts dt { font: 600 .6rem/1.2 var(--fm); letter-spacing: .14em; text-transform: uppercase; color: var(--mute); }
.arr__facts dd { margin: 4px 0 0; font-weight: 800; font-size: .95rem; }
.arr__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.arr__acts .btn--glass { color: var(--ink); border-color: rgba(10,21,32,.2); background: transparent; }
@media (max-width: 760px) {
  .arr__row { grid-template-columns: minmax(0,1fr) auto; gap: 4px 10px; padding: 10px; }
  .arr__row--head span:nth-child(2), .arr__row--head span:nth-child(4) { display: none; }
  .arr__area { grid-column: 1; grid-row: 2; }
  .arr__time { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .arr__st { display: none; }
  .flaps i { font-size: .74rem; min-width: .82em; }
  .flaps--dim i { font-size: .62rem; }
}

/* landing moment when a request is received */
.touch { display: block; width: min(360px, 90%); height: auto; margin: 0 auto 6px; overflow: visible; }
.touch__plane { animation: touchdown 1.8s cubic-bezier(.3,.7,.3,1) both; }
@keyframes touchdown { 0% { transform: translate(-120px, -46px) rotate(-6deg); opacity: 0; } 15% { opacity: 1; } 70% { transform: translate(110px, 0) rotate(-1deg); } 100% { transform: translate(150px, 0) rotate(0); } }
.touch__rip ellipse { transform-box: fill-box; transform-origin: center; opacity: 0; animation: rip 1.4s 1.1s ease-out forwards; }
.touch__rip ellipse + ellipse { animation-delay: 1.3s; }
@media (max-width: 1039px) { .arr__card { order: -1; } }

.hdr:has(.mnav.is-open) { background: var(--night); color: #fff; }