/* Homepage "night to day" theme: a night band after the hero, then pale indigo surfaces,
   sharp grotesk chapter titles and quiet, borderless components. Loaded only by pages/home, after home-sections.css. */
main:has(> .home-discovery-section--sticky) {
    --ed-ink: #141838; --ed-muted: #5d6385; --ed-line: #dde0f2; --ed-paper: #fcfcff; --ed-tint: #e9ebf8;
    --ed-accent: #e5484f; --ed-teal: #1f6f73; --ed-shadow: #1c226659;
    --ed-night-ink: #eef0fb; --ed-night-muted: #93a3b6; --ed-night-accent: #ff8990;
    --ed-display: 'Space Grotesk', 'Inter', Arial, sans-serif;
}
/* The Spotlight band continues the hero palette. */
.home-dmo-spotlight { --ed-ink: var(--ed-night-ink); --ed-muted: var(--ed-night-muted); --ed-accent: var(--ed-night-accent); --ed-line: #ffffff26; color: var(--ed-ink); }

/* Chapter eyebrows: a tabular number, a hairline, then a tracked label. No pills. */
main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) .section-heading > span {
    display: inline-flex; align-items: center; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none;
    color: var(--ed-muted); font-size: 11px; font-weight: 600; letter-spacing: .22em; line-height: 1; text-transform: uppercase;
}
main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) .section-heading > span::before {
    content: counter(home-chapter, decimal-leading-zero);
    margin-inline-end: 14px; padding-inline-end: 46px;
    background: linear-gradient(var(--ed-line), var(--ed-line)) right center / 32px 1px no-repeat;
    color: var(--ed-accent); font-family: var(--ed-display); font-size: 13px; font-weight: 600; letter-spacing: .02em; font-variant-numeric: tabular-nums;
}
[dir="rtl"] main .section-heading > span::before { background-position: left center; }

/* Chapter titles share the hero's sharp grotesk. Tight tracking only for Latin scripts. */
main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) .section-heading h2 {
    max-width: 760px; margin: 16px 0 0; color: var(--ed-ink);
    font-family: var(--ed-display); font-size: clamp(30px, 3.4vw, 46px); font-weight: 600; line-height: 1.06;
}
:root:is(:lang(en),:lang(de),:lang(es),:lang(fr),:lang(id),:lang(it),:lang(ms),:lang(pt),:lang(vi)) main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) .section-heading h2 {
    letter-spacing: -.035em;
}

main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) { padding: 72px 0; }
main > :is(.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) .section-heading-row { align-items: flex-end; margin-bottom: 32px; }
main > :is(.home-travel-services-section,.home-categories-section) .section-heading { margin-bottom: 32px; }

/* "View all" becomes an underlined text link with a travelling arrow. */
main > :is(.home-featured-section,.home-recommendations-section) .section-view-all {
    display: inline-flex; align-items: center; gap: 10px; min-height: 0; padding: 0 0 6px; border: 0; border-bottom: 1px solid currentColor; border-radius: 0;
    background: none; box-shadow: none; color: var(--ed-ink); font-size: 13px; font-weight: 600; letter-spacing: .04em;
}
main > :is(.home-featured-section,.home-recommendations-section) .section-view-all::after { content: '→'; transition: transform .3s cubic-bezier(.2, .7, .2, 1); }
[dir="rtl"] main .section-view-all::after { content: '←'; }
main > :is(.home-featured-section,.home-recommendations-section) .section-view-all:hover { color: var(--ed-accent); background: none; transform: none; }
main > :is(.home-featured-section,.home-recommendations-section) .section-view-all:hover::after { transform: translateX(4px); }
[dir="rtl"] main .section-view-all:hover::after { transform: translateX(-4px); }

/* The hero's lower edge settles into the night band before any scrolling. */
main:has(> .home-dmo-spotlight) > .home-hero { box-shadow: inset 0 -140px 90px -70px #0b1626; }

/* Spotlight: the night band, with the visitor's area as a live location chip. */
.home-dmo-spotlight .dmo-spotlight-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.dmo-spotlight-location {
    display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; margin: 0; padding: 7px 18px 7px 7px; border: 1px solid #ffffff1f; border-radius: 999px;
    background: #ffffff0d; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: var(--ed-night-ink);
}
.dmo-spotlight-pin { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #fc5b62; color: #fff; }
.dmo-spotlight-pin::after { content: ''; position: absolute; inset: 0; border-radius: inherit; border: 1px solid #fc5b62; animation: ed-ping 2.6s cubic-bezier(.2, .7, .2, 1) infinite; }
.dmo-spotlight-pin svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.dmo-spotlight-place { display: flex; flex-direction: column; font-size: 16px; font-weight: 600; line-height: 1.2; letter-spacing: -.01em; }
.dmo-spotlight-place small { margin-bottom: 3px; color: var(--ed-night-muted); font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
@keyframes ed-ping { 0% { transform: scale(1); opacity: .8; } 80%, 100% { transform: scale(1.9); opacity: 0; } }

/* Featured rises over the night band as a rounded sheet. */
main:has(> .home-dmo-spotlight) > .home-dmo-spotlight { padding-bottom: 112px; }
main:has(> .home-dmo-spotlight) > .home-featured-section { position: relative; z-index: 1; margin-top: -40px; border-radius: 40px 40px 0 0; }

/* Featured: portrait photographs without frames, caption on a soft scrim. */
.home-featured-section .home-card-grid { gap: 20px; }
.home-featured-section .home-listing-card { aspect-ratio: 4 / 5; border: 0; border-radius: 24px; background: var(--ed-tint); box-shadow: none; }
.home-featured-section .home-listing-card:hover { transform: translateY(-4px); box-shadow: 0 34px 50px -30px var(--ed-shadow); }
.home-featured-section .home-listing-image { background: var(--ed-tint); }
.home-featured-section .home-listing-image:after { background: linear-gradient(180deg, #0000 40%, #0d1030bf 100%); }
.home-featured-section .home-listing-body { left: 20px; right: 20px; bottom: 20px; }
.home-featured-section .home-listing-body h3 { margin-bottom: 10px; font-size: 21px; font-weight: 600; letter-spacing: -.015em; text-shadow: 0 2px 18px #0006; }
.home-featured-section .listing-distance {
    display: inline-flex; padding: 5px 11px; border: 1px solid #ffffff4d; border-radius: 999px; background: #ffffff26;
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff !important; font-size: 12px; font-weight: 600; box-shadow: none;
}
.home-featured-section .is-image-missing { background: linear-gradient(160deg, #e3e6f7 0, #b4bae0 100%); }
.home-featured-section .is-image-missing:after { background: linear-gradient(180deg, #0000 40%, #1d2350b3 100%); }
.home-featured-section .is-image-missing .home-listing-fallback { color: #6a71a6; opacity: .6; }

/* Shared card surface for service, recommendation and category cards. */
.home-travel-services-section .travel-service-grid .travel-service-card,
.home-recommendations-section .recommendation-card,
.home-categories-section .category-card {
    border: 1px solid var(--ed-line); border-radius: 24px; background: var(--ed-paper); box-shadow: none;
}
:is(.home-travel-services-section .travel-service-card, .home-recommendations-section .recommendation-card, .home-categories-section .category-card):hover {
    border-color: #c3c8ea; box-shadow: 0 30px 44px -30px var(--ed-shadow); transform: translateY(-3px);
}

.travel-service-compact-logo { border-color: var(--ed-line); background: #fff; color: var(--ed-muted); }
.travel-service-compact-copy .travel-service-eyebrow { color: var(--ed-teal); background: none; border: 0; padding: 0; letter-spacing: .18em; }
.travel-service-compact-copy h3 { color: var(--ed-ink); }
.travel-service-compact-copy p { color: var(--ed-muted); }
.travel-service-compact-action { border: 1px solid var(--ed-ink); border-radius: 999px; background: none; color: var(--ed-ink); }
.travel-service-compact-action:hover { background: var(--ed-ink); color: var(--ed-paper); }

.home-recommendations-section:after { opacity: .35; filter: hue-rotate(45deg) saturate(.7); }
.home-recommendations-section .recommendation-card h3 { color: var(--ed-ink); }
.home-recommendations-section .recommendation-card-body p { color: var(--ed-muted); }
.home-recommendations-section .recommendation-card-footer { border-color: var(--ed-line); color: var(--ed-ink); }

.home-categories-section .category-card { overflow: hidden; }
/* Replace the warm daylight wash with a cool one that suits the indigo surfaces. */
.home-categories-section--soft-light {
    background-image: var(--home-seam), radial-gradient(ellipse at 92% 8%, #ffffffb3 0, #fff0 58%), radial-gradient(ellipse at 4% 95%, #c9cdf233 0, #c9cdf200 60%);
}
.home-categories-section .category-card-image { background: var(--ed-tint); }
.home-categories-section .category-card-icon { background: var(--ed-tint); color: var(--ed-muted); }
.home-categories-section .category-card h3 { color: var(--ed-ink); }
.home-categories-section .category-card-arrow { color: var(--ed-muted); }
.home-categories-section .category-card:hover .category-card-arrow { color: var(--ed-accent); }

/* The footer closes the page as a rounded night sheet, mirroring Featured. */
main > .home-categories-section { padding-bottom: 112px; }
main:has(> .home-discovery-section--sticky) + .iswhere-footer { position: relative; z-index: 1; margin-top: -40px; border-radius: 40px 40px 0 0; }

@media (max-width: 767px) {
    main > :is(.home-dmo-spotlight,.home-featured-section,.home-travel-services-section,.home-recommendations-section,.home-categories-section) { padding: 52px 0; }
    .home-dmo-spotlight .dmo-spotlight-header { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
    main:has(> .home-dmo-spotlight) > .home-dmo-spotlight { padding-bottom: 84px; }
    main:has(> .home-dmo-spotlight) > .home-featured-section,
    main:has(> .home-discovery-section--sticky) + .iswhere-footer { margin-top: -28px; border-radius: 28px 28px 0 0; }
    main > .home-categories-section { padding-bottom: 84px; }
    .home-featured-section .home-listing-card { border-radius: 18px; }
    .home-featured-section .home-listing-body { left: 14px; right: 14px; bottom: 14px; }
    .home-featured-section .home-listing-body h3 { font-size: 16px; }
    :is(.home-travel-services-section .travel-service-card, .home-recommendations-section .recommendation-card, .home-categories-section .category-card) { border-radius: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .dmo-spotlight-pin::after { animation: none; opacity: 0; }
    main > :is(.home-featured-section,.home-recommendations-section) .section-view-all::after { transition: none; }
}

/* Discovery dock: white over the night surfaces (hero, Spotlight, footer), night glass over the day surfaces.
   home-scroll.js sets .is-over-day from what is behind the dock; registered colours let the palettes cross-fade. */
@property --dock-bg { syntax: '<color>'; inherits: true; initial-value: #fff; }
@property --dock-border { syntax: '<color>'; inherits: true; initial-value: #dce5ea; }
@property --dock-ink { syntax: '<color>'; inherits: true; initial-value: #223e4c; }
@property --dock-muted { syntax: '<color>'; inherits: true; initial-value: #647783; }
@property --dock-line { syntax: '<color>'; inherits: true; initial-value: #e1e8ee; }
@property --dock-hover { syntax: '<color>'; inherits: true; initial-value: #f3f7f8; }
@property --dock-pin { syntax: '<color>'; inherits: true; initial-value: #e0f4f1; }
@property --dock-pin-ink { syntax: '<color>'; inherits: true; initial-value: #198e85; }
@property --dock-pin-ring { syntax: '<color>'; inherits: true; initial-value: #fc5b6200; }
@property --dock-map { syntax: '<color>'; inherits: true; initial-value: #19978c; }
@property --dock-map-fill { syntax: '<color>'; inherits: true; initial-value: #def4ee; }
@property --dock-tip-bg { syntax: '<color>'; inherits: true; initial-value: #223e4c; }
@property --dock-tip-ink { syntax: '<color>'; inherits: true; initial-value: #fff; }
@property --dock-ask-hover { syntax: '<color>'; inherits: true; initial-value: #f5f3fc; }
@property --dock-sheen { syntax: '<color>'; inherits: true; initial-value: #fff0; }
@property --dock-shadow { syntax: '<color>'; inherits: true; initial-value: #193b4b2e; }

.home-discovery-section--sticky {
    --dock-bg: #fff; --dock-border: #dce5ea; --dock-ink: #223e4c; --dock-muted: #647783; --dock-line: #e1e8ee; --dock-hover: #f3f7f8;
    --dock-pin: #e0f4f1; --dock-pin-ink: #198e85; --dock-pin-ring: #fc5b6200; --dock-map: #19978c; --dock-map-fill: #def4ee;
    --dock-tip-bg: #223e4c; --dock-tip-ink: #fff; --dock-ask-hover: #f5f3fc; --dock-sheen: #fff0; --dock-shadow: #193b4b2e;
}
.home-discovery-section--sticky.is-over-day {
    --dock-bg: #0d1830db; --dock-border: #ffffff24; --dock-ink: #eef0fb; --dock-muted: #9aa8c4; --dock-line: #ffffff1f; --dock-hover: #ffffff12;
    --dock-pin: #fc5b62; --dock-pin-ink: #fff; --dock-pin-ring: #fc5b6229; --dock-map: #9ee5df; --dock-map-fill: #9ee5df1f;
    --dock-tip-bg: #eef0fb; --dock-tip-ink: #141838; --dock-ask-hover: #8b7cf621; --dock-sheen: #ffffff14; --dock-shadow: #0b1626a6;
}
/* Transitions start after the first measurement, so the dock never fades in from the wrong palette on load. */
.home-discovery-section--sticky.is-dock-ready {
    transition: --dock-bg .5s ease, --dock-border .5s ease, --dock-ink .5s ease, --dock-muted .5s ease, --dock-line .5s ease, --dock-hover .5s ease,
        --dock-pin .5s ease, --dock-pin-ink .5s ease, --dock-pin-ring .5s ease, --dock-map .5s ease, --dock-map-fill .5s ease,
        --dock-tip-bg .5s ease, --dock-tip-ink .5s ease, --dock-ask-hover .5s ease, --dock-sheen .5s ease, --dock-shadow .5s ease;
}
main:has(> .home-discovery-section--sticky) .home-search-card--compact {
    border: 1px solid var(--dock-border); background: var(--dock-bg); color: var(--dock-ink);
    backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4);
    box-shadow: inset 0 1px 0 var(--dock-sheen), 0 24px 48px -22px var(--dock-shadow);
}
.home-search-card--compact .home-discovery-location-btn { color: var(--dock-ink); }
.home-search-card--compact :is(.home-discovery-location-btn, .location-map-btn, .home-direct-search):hover { background: var(--dock-hover); box-shadow: none; }
.home-search-card--compact .home-discovery-label,
.home-search-card--compact .home-discovery-location-btn .current-location-secondary,
.home-search-card--compact .home-near-chevron { color: var(--dock-muted); }
.home-search-card--compact .home-near-pin { background: var(--dock-pin); color: var(--dock-pin-ink); box-shadow: 0 0 0 4px var(--dock-pin-ring); }
.home-search-card--compact .location-switch { border-color: var(--dock-line); background: transparent; color: var(--dock-muted); }
.home-search-card--compact .location-switch:hover { border-color: var(--dock-muted); color: var(--dock-ink); }
.home-search-card--compact .location-switch::after { background: var(--dock-tip-bg); color: var(--dock-tip-ink); }
.home-search-card--compact .home-discovery-search-row::before,
.home-search-card--compact .home-discovery-search-row > * + *::before { background: var(--dock-line); }
.home-search-card--compact .home-direct-search { color: var(--dock-muted); }
.home-search-card--compact .home-direct-search:is(:hover, :focus-visible) { color: var(--dock-ink); background: var(--dock-hover); box-shadow: none; }
.home-search-card--compact :is(.home-ask-launch, .location-map-btn) { color: var(--dock-ink); }
.home-search-card--compact .home-ask-launch:is(:hover, :focus-visible) { background: var(--dock-ask-hover); }
.home-search-card--compact .home-near-map { color: var(--dock-map); fill: var(--dock-map-fill); }
.home-search-card--compact :is(button, a):focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }
.home-chapter-progress i { background: var(--dock-line); }
@media (max-width: 991px) {
    .home-search-card--compact .home-discovery-search-row { border-top-color: var(--dock-line); }
}

/* Dialogs opened from the dock: pale indigo sheets over a blurred night scrim. Scoped by id, so the Explore page keeps its own look. */
#recommendedAreasModal .recommended-areas-backdrop { background: #0b1626b8; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
#recommendedAreasModal .recommended-areas-dialog { border: 1px solid #fff; background: #f4f5fc; box-shadow: 0 48px 110px -30px #050b1ae6; }
#recommendedAreasModal :is(.recommended-areas-header, .recommended-areas-body) { background: transparent; }
#recommendedAreasModal .recommended-areas-header h3,
#directSearchDialog h2 { color: #141838; font-family: 'Space Grotesk', 'Inter', Arial, sans-serif; font-weight: 600; letter-spacing: -.03em; }
#recommendedAreasModal :is(.recommended-area-head h4, .recommended-panel-title) { color: #141838; font-family: 'Space Grotesk', 'Inter', Arial, sans-serif; font-weight: 600; letter-spacing: -.02em; }
#recommendedAreasModal .recommended-area-head p { color: #5d6385; }
#recommendedAreasModal .recommended-areas-close,
#directSearchDialog [data-direct-search-close] { border: 1px solid #dde0f2; border-radius: 50%; background: #fff; color: #141838; transition: background .2s, color .2s; }
#recommendedAreasModal .recommended-areas-close:hover,
#directSearchDialog [data-direct-search-close]:hover { background: #141838; color: #fff; }
#recommendedAreasModal .recommended-areas-search i { color: #5d6385; }
#recommendedAreasModal .recommended-areas-search input,
#directSearchDialog input { border: 1px solid #dde0f2; border-radius: 14px; background: #fff; color: #141838; box-shadow: none; }
#recommendedAreasModal .recommended-areas-search input:focus,
#directSearchDialog input:focus { border-color: #5b63d6; outline: 0; box-shadow: 0 0 0 4px #5b63d629; }
#recommendedAreasModal :is(.recommended-country-panel, .recommended-area-panel) { border: 1px solid #e4e6f5; border-radius: 20px; background: #fff; box-shadow: none; }
#recommendedAreasModal :is(.recommended-sort-select, .recommended-country-toggle) { border-color: #dde0f2; background-color: #fff; color: #141838; }
#recommendedAreasModal .recommended-country-item { color: #141838; }
#recommendedAreasModal .recommended-country-item:hover { background: #eef0fb; transform: none; }
#recommendedAreasModal .recommended-country-item.is-active { border-color: #141838; background: #141838; color: #fff; box-shadow: 0 14px 28px -16px #1c2266b3; }
#recommendedAreasModal .recommended-country-icon,
#recommendedAreasModal .rec-search-icon { background: #e9ebf8; color: #3f47b8; }
#recommendedAreasModal .recommended-country-name { color: inherit; }
#recommendedAreasModal .recommended-place-secondary { color: #5d6385; }
#recommendedAreasModal .recommended-country-item.is-active .recommended-place-secondary { color: #b9bfe0; }
#recommendedAreasModal .recommended-country-item.is-active .recommended-country-icon { background: #ffffff1f; color: #ff8990; }
#recommendedAreasModal .recommended-country-count { background: #e9ebf8; color: #3f47b8; }
#recommendedAreasModal .recommended-country-item.is-active .recommended-country-count { background: #ffffff1f; color: #fff; }
#recommendedAreasModal .recommended-area-item { border: 1px solid #e4e6f5; background: #fcfcff; color: #141838; box-shadow: none; }
#recommendedAreasModal .recommended-area-item:hover { border-color: #c3c8ea; background: #fff; color: #141838; box-shadow: 0 16px 28px -18px #1c226680; }
#recommendedAreasModal .recommended-area-item i { color: #e5484f; }
#recommendedAreasModal :is(.recommended-area-item small, .recommended-area-item > small) { color: #5d6385; }
#recommendedAreasModal .recommended-search-result:hover { background: #eef0fb; }

#directSearchDialog { padding: 26px; border: 1px solid #fff; border-radius: 28px; background: #f4f5fc; color: #141838; box-shadow: 0 48px 110px -30px #050b1ae6; }
#directSearchDialog::backdrop { background: #0b1626b8; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
#directSearchDialog h2 { font-size: 24px; }
#directSearchDialog input { padding: 14px 16px; }
#directSearchDialog button[type="submit"] { padding: 0 22px; border: 0; border-radius: 14px; background: #141838; color: #fff; font-weight: 600; transition: background .2s; }
#directSearchDialog button[type="submit"]:hover { background: #2a3170; }
#directSearchDialog .direct-search-status,
#directSearchDialog .direct-search-item small { color: #5d6385; }
#directSearchDialog .direct-search-item { border-bottom-color: #e4e6f5; }
#directSearchDialog .direct-search-item > a { color: #141838; }
#directSearchDialog .direct-search-item > a:hover { background: #fff; }
:is(#recommendedAreasModal, #directSearchDialog) :is(button, a, input, select):focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 2px; }