/* UsGo! homepage. Original layout; colours and type come from the shared design tokens. */
.hm-hero { position: relative; min-height: min(980px, calc(82svh / var(--page-zoom))); display: flex; align-items: flex-start; color: #fff; isolation: isolate; overflow: hidden; background: var(--navy); padding: calc(var(--header-h) + 34px) 0 64px; }
.has-hero .hm-hero { margin-top: calc(-1 * var(--header-h)); }
.hm-hero-photo { position: absolute; inset: 0; z-index: -2; }
.hm-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.hm-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10, 20, 51, .74) 0%, rgba(10, 20, 51, .58) 45%, rgba(10, 20, 51, .7) 72%, rgba(10, 20, 51, .95) 100%); }
.hm-hero h1 { color: #fff; font-size: clamp(44px, 8vw, 104px); line-height: .98; letter-spacing: -.045em; max-width: 12ch; }
.hm-hero-sub { font-size: clamp(17px, 1.7vw, 22px); line-height: 1.45; max-width: 44ch; margin-top: 12px; color: #E6EBFA; }
.hm-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.hm-search { display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; gap: 6px; margin-top: 18px; padding: 8px; background: rgba(255, 255, 255, .97); border-radius: 22px; box-shadow: var(--sh-3); max-width: 880px; color: var(--ink); }
.hm-search label { display: grid; gap: 1px; padding: 8px 14px; border-radius: 14px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); transition: background .2s; min-width: 0; }
.hm-search label:hover, .hm-search label:focus-within { background: var(--blue-50); }
.hm-search select, .hm-search input { border: 0; background: none; padding: 2px 0; width: 100%; min-width: 0; font: 500 15.5px/1.4 var(--body); color: var(--ink); text-transform: none; letter-spacing: 0; outline: none; }
.hm-search .btn { min-height: 100%; border-radius: 16px; padding: 0 26px; }
.hm-credit { position: absolute; right: 16px; bottom: 10px; font-size: 11.5px; opacity: .72; }
.hm-credit a { text-decoration: underline; }

.hm-section { padding: 88px 0; }
.hm-tint { background: var(--bg); }
.hm-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 34px; }
.hm-head h2 { font-size: clamp(30px, 4vw, 50px); letter-spacing: -.035em; }
.hm-head p { color: var(--muted); max-width: 58ch; margin-top: 10px; font-size: 17px; }

.hm-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: hs; }
.hm-step { position: relative; padding: 28px 24px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-l); counter-increment: hs; transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.hm-step:hover { transform: translateY(-5px); box-shadow: var(--sh-2); }
.hm-step::after { content: counter(hs); position: absolute; right: 22px; top: 12px; font: 800 58px/1 var(--display); color: var(--blue-50); z-index: 0; }
.hm-step > * { position: relative; z-index: 1; }
.hm-step h3 { font-size: 19px; margin: 14px 0 6px; }
.hm-step p { color: var(--muted); font-size: 15px; }

.hm-dests { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 210px; gap: 14px; }
.hm-dest { position: relative; display: block; overflow: hidden; border-radius: var(--r-l); background: var(--navy-2); color: #fff; isolation: isolate; }
.hm-dest:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.hm-dest:nth-child(6) { grid-column: span 2; }
.hm-dest img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .7s var(--ease); }
.hm-dest:hover img, .hm-dest:focus-visible img { transform: scale(1.07); }
.hm-dest::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 42%, rgba(10, 20, 51, .84) 100%); }
.hm-dest-text { position: absolute; left: 18px; right: 18px; bottom: 15px; }
.hm-dest strong { display: block; font: 700 21px/1.15 var(--display); }
.hm-dest:nth-child(1) strong { font-size: 32px; }
.hm-dest span { font-size: 13.5px; color: #E3E8F7; }

.hm-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 44px; align-items: center; }
.hm-split.flip > :first-child { order: 2; }
.hm-photo { position: relative; border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 4 / 4.4; box-shadow: var(--sh-3); }
.hm-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.hm-photo:hover img { transform: scale(1.04); }
.hm-split h2 { font-size: clamp(30px, 3.6vw, 46px); letter-spacing: -.035em; }
.hm-split > div > p { color: var(--muted); font-size: 17px; margin-top: 12px; max-width: 54ch; }
.hm-list { display: grid; gap: 10px; margin: 20px 0; }
.hm-offer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 14px; align-items: center; padding: 14px 18px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-m); color: inherit; transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s; }
.hm-offer:hover { transform: translateY(-2px); box-shadow: var(--sh-2); border-color: var(--blue-100); }
.hm-offer strong { color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hm-offer b { color: var(--ink); white-space: nowrap; }
.hm-offer small { color: var(--muted); font-size: 13.5px; }
.hm-offer em { font-style: normal; font-size: 13px; font-weight: 700; color: var(--teal-600); white-space: nowrap; text-align: right; }
.hm-none { padding: 18px; border: 1px dashed var(--line-2); border-radius: var(--r-m); color: var(--muted); font-size: 15px; background: #fff; }

.hm-cost { background: var(--navy); color: #DCE3F8; }
.hm-cost h2 { color: #fff; }
.hm-cost .hm-head p { color: #C6CEEA; }
.hm-figures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hm-figure { padding: 26px; border-radius: var(--r-l); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); transition: background .25s, transform .25s var(--ease); }
.hm-figure:hover { background: rgba(255, 255, 255, .1); transform: translateY(-3px); }
.hm-figure span { display: block; font-size: 13px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--marigold); }
.hm-figure h3 { color: #fff; font-size: 22px; margin: 10px 0 6px; }
.hm-figure p { font-size: 15px; color: #C6CEEA; }
.hm-note { margin-top: 18px; font-size: 14px; color: #C6CEEA; }

.hm-safety { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.hm-safety article { padding: 24px; border-radius: var(--r-l); background: #fff; border: 1px solid var(--line); }
.hm-safety h3 { font-size: 18px; margin: 12px 0 6px; }
.hm-safety p { color: var(--muted); font-size: 15px; }

.hm-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.hm-reveal.in { opacity: 1; transform: none; }
html:not(.hm-js) .hm-reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .hm-hero-photo img { animation: hmDrift 26s ease-out both; }
  .hm-hero-text > * { animation: hmRise .9s var(--ease) both; }
  .hm-hero-text > :nth-child(2) { animation-delay: .1s; } .hm-hero-text > :nth-child(3) { animation-delay: .2s; } .hm-hero-text > :nth-child(4) { animation-delay: .3s; }
}
@media (prefers-reduced-motion: reduce) { .hm-reveal { opacity: 1; transform: none; transition: none; } .hm-dest img, .hm-photo img, .hm-step, .hm-offer, .hm-figure { transition: none; } }
@keyframes hmDrift { from { transform: scale(1.09); } to { transform: scale(1); } }
@keyframes hmRise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (max-width: 1024px) {
  .hm-steps, .hm-safety { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hm-dests { grid-template-columns: repeat(3, 1fr); }
  .hm-dest:nth-child(6) { grid-column: auto; }
  .hm-split { gap: 28px; }
}
@media (max-width: 860px) {
  .hm-split, .hm-split.flip { grid-template-columns: 1fr; }
  .hm-split.flip > :first-child { order: 0; }
  .hm-photo { aspect-ratio: 16 / 10; }
  .hm-figures { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hm-hero { padding: calc(var(--header-h) + 18px) 0 44px; min-height: 0; }
  .hm-section { padding: 56px 0; }
  .hm-search { grid-template-columns: 1fr 1fr; border-radius: 20px; }
  .hm-search label:first-child, .hm-search .btn { grid-column: 1 / -1; }
  .hm-search .btn { min-height: 48px; }
  .hm-search select, .hm-search input { font-size: 16px; }
  .hm-hero-actions .btn { flex: 1 1 calc(50% - 5px); }
  .hm-hero-actions .btn:first-child { flex-basis: 100%; }
  .hm-steps, .hm-safety { grid-template-columns: 1fr; }
  .hm-dests { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 160px; gap: 10px; }
  .hm-dest:nth-child(1) { grid-column: span 2; grid-row: span 1; }
  .hm-dest:nth-child(1) strong { font-size: 25px; }
  .hm-dest strong { font-size: 18px; }
  .hm-credit { display: none; }
}
