/* Space Coast Co-Hosts — Home page styles */
.hero { position: relative; width: 100%; overflow: hidden; background: var(--color-white);
}
.hero-background { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.hero-background img { width: 100%; height: 100%; object-fit: cover; opacity: .12; }
.hero > .content,
.hero > .gallery-shell { position: relative; z-index: 2; }
.content { padding-top: 24px; text-align: center; }
.eyebrow { display: inline-flex; align-items: center; justify-content: center; flex-wrap: nowrap; max-width: 100%; gap: 7px; padding: 7px 12px; border: 1px solid var(--color-brand-soft-border); border-radius: var(--radius-pill); background: var(--color-white); color: var(--color-brand); line-height: 1.25; font-weight: 600; white-space: nowrap;
}
.eyebrow .spark { color: var(--color-accent); }
.eyebrow .palm { line-height: 1; }
.description { max-width: 1120px; margin: 0 auto; color: var(--color-copy-deep); line-height: 1.55;
}
.hero-actions { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 12px; }
.primary--secondary { border: 1px solid var(--color-brand); background: transparent; color: var(--color-brand); }
.primary--secondary:hover { background: var(--color-brand); color: var(--color-white); }

.gallery-shell { position: relative; height: 390px; margin-top: 28px; overflow: hidden; }
.gallery-window { position: absolute; inset: 0; overflow: hidden; padding: 8px 24px 42px; cursor: grab; touch-action: pan-y;
}
.gallery-window.is-dragging { cursor: grabbing; }
.gallery-track { width: max-content; height: 100%; display: flex; align-items: flex-end; gap: 18px; transition: transform .55s var(--ease-emphasis); will-change: transform;
}
.gallery-track.no-transition { transition: none; }
.gallery-card { flex: none; max-height: 100%; clip-path: inset(0 round var(--radius-lg)); background: var(--color-surface-media); box-shadow: var(--shadow-md);
}
.gallery-card img { transition: transform .5s ease; }
.gallery-card:hover img { transform: scale(1.04); }
.g1 { width: 292px; height: 292px; }
.g2 { width: 376px; height: 328px; }
.g3 { width: 310px; height: 365px; }
.g4 { width: 278px; height: 315px; }
.g5 { width: 324px; height: 300px; }
.g6 { width: 300px; height: 338px; }
.g7 { width: 350px; height: 280px; }
.g8 { width: 380px; height: 320px; }
.gallery-dots { position: absolute; left: 50%; bottom: 12px; display: flex; gap: 8px; transform: translateX(-50%);
}
.gallery-dot { width: 22px; height: 5px; border: 0; border-radius: var(--radius-pill); background: var(--color-dot); }
.gallery-dot.active { width: 32px; background: var(--color-brand); }
.gallery-dot:focus-visible { outline-offset: 4px; }

.hero-decor { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.hero-decor__ripple { position: absolute; border: 2px solid rgba(var(--rgb-brand), .12); border-radius: 50%; }
.hero-decor__ripple--left { top: 118px; left: 2%; width: 170px; height: 170px; box-shadow: 0 0 0 18px rgba(var(--rgb-brand), .06), 0 0 0 38px rgba(var(--rgb-brand), .03); animation: heroRippleLeft 8s ease-in-out infinite;
}
.hero-decor__ripple--right { top: 132px; right: 4%; width: 132px; height: 132px; box-shadow: 0 0 0 16px rgba(var(--rgb-brand), .05); animation: heroRippleRight 7s ease-in-out infinite 1s;
}
.hero-decor__dune { position: absolute; left: -70px; bottom: 92px; width: 310px; height: 126px; border-radius: var(--radius-pill); background: linear-gradient(180deg, rgba(var(--rgb-accent), .12), rgba(var(--rgb-accent), .05)); animation: heroDuneDrift 10s ease-in-out infinite;
}
.hero-decor__shell { position: absolute; width: 112px; height: 74px; opacity: .9; background:
    radial-gradient(circle at 10% 100%, transparent 26px, rgba(var(--rgb-brand), .12) 26px 29px, transparent 29px),
    radial-gradient(circle at 30% 100%, transparent 26px, rgba(var(--rgb-brand), .12) 26px 29px, transparent 29px),
    radial-gradient(circle at 50% 100%, transparent 26px, rgba(var(--rgb-brand), .12) 26px 29px, transparent 29px),
    radial-gradient(circle at 70% 100%, transparent 26px, rgba(var(--rgb-brand), .12) 26px 29px, transparent 29px),
    radial-gradient(circle at 90% 100%, transparent 26px, rgba(var(--rgb-brand), .12) 26px 29px, transparent 29px);
}
.hero-decor__shell--left { top: 298px; left: 8%; animation: heroShellLeft 6s ease-in-out infinite; }
.hero-decor__shell--right { top: 256px; right: 12%; animation: heroShellRight 7s ease-in-out infinite .8s; }
.hero-decor__foam { position: absolute; right: 10%; bottom: 122px; width: 124px; height: 36px; border-radius: var(--radius-pill); background: radial-gradient(circle, rgba(var(--rgb-brand), .10) 0 20%, transparent 21%) 0 50% / 24px 24px repeat-x; opacity: .75; animation: heroFoamFloat 5.5s ease-in-out infinite;
}

/* =========================================================
   ABOUT
   ========================================================= */

.about-section { background: var(--color-white); }
.about-shell { display: grid; grid-template-columns: .9fr 1.1fr; gap: 72px; align-items: center; }
.about-kicker { margin-bottom: 20px; }
.about-title { margin-bottom: 26px; }
.about-text p { margin: 0; }
.about-text p + p { margin-top: 1em; }
.about-visual { position: relative; min-width: 0; min-height: 520px; }
.about-image-main { position: absolute; inset: 0 0 40px 60px; box-shadow: var(--shadow-md);
}

.about-image-float { position: absolute; left: 0; bottom: 0; width: 210px; height: 165px; border: 8px solid var(--color-white); box-shadow: var(--shadow-md);
}
.about-accent { position: absolute; right: -8px; top: 30px; width: 80px; height: 8px; border-radius: var(--radius-pill); background: var(--color-accent);
}

/* =========================================================
   SERVICES
   ========================================================= */

.services-section,
.booking-section { background: var(--color-brand-deep); color: var(--color-white); }
.services-head { display: grid; grid-template-columns: .75fr 1.25fr; gap: 60px; margin-bottom: 52px; }
.services-kicker,
.properties-kicker { color: var(--color-accent); }
.services-intro { color: rgba(var(--rgb-white), .76); }
.services-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 44px; align-items: start; }
.services-visual { position: sticky; top: 122px; height: 620px; }

.services-list { border-top: 1px solid rgba(var(--rgb-white), .14); }
.service-row { display: grid; grid-template-columns: 52px 1fr; gap: 20px; padding: 24px 0; border-bottom: 1px solid rgba(var(--rgb-white), .14); }
.service-number { color: var(--color-accent); font-weight: 600; }
.service-heading-row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.service-icon { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: var(--radius-sm); background: rgba(var(--rgb-white), .08); color: var(--color-accent);
}
.service-title { color: var(--color-white); }
.service-text { margin: 10px 0 0; color: rgba(var(--rgb-white), .72); line-height: 1.6; }
.service-text p { margin: 0; }
.service-text p + p { margin-top: .8em; }
.maid-link { color: var(--color-accent); text-decoration: underline; }


/* =========================================================
   PROPERTY POTENTIAL
   ========================================================= */

.potential-section { background: var(--color-surface-soft); }
.potential-heading { max-width: 820px; margin-bottom: 42px; }
.potential-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 54px; }
.potential-visual { min-height: 500px; }

.potential-list { display: grid; min-width: 0; }
.potential-item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 18px; padding: 22px 0; border-bottom: 1px solid var(--color-border); }
.potential-num { color: var(--color-brand); font-weight: 600; }
.potential-item__title { margin-bottom: 9px; }
.potential-item p { margin: 0; color: var(--color-copy); line-height: 1.62; }
.contact-strip { display: grid; grid-template-columns: 1.4fr .8fr 1fr; gap: 1px; margin-top: 34px; overflow: hidden; border: 1px solid var(--color-border); border-radius: 22px; background: var(--color-border);
}
.contact-item { min-width: 0; display: flex; align-items: center; gap: 14px; padding: 22px; background: var(--color-white); }
.contact-item > div { min-width: 0; }
.contact-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 13px; background: var(--color-surface-soft); color: var(--color-brand);
}
.contact-label { display: block; color: var(--color-brand); font-weight: 600; text-transform: uppercase; letter-spacing: .14em; }
.contact-link { display: block; max-width: 100%; overflow-wrap: anywhere; font-weight: 500; }

/* =========================================================
   PROCESS FLOW
   ========================================================= */

.process-section { background: var(--color-white); }
.process-head { max-width: 960px; margin: 0 auto 58px; text-align: center; }
.process-title { margin-bottom: 20px; }
.process-copy { max-width: 930px; margin-inline: auto; }
.process-stage { padding: 20px 0 28px; overflow: visible; }
.process-flow { width: 100%; margin-inline: auto; display: grid; align-items: stretch; justify-content: center; gap: 16px; isolation: isolate; }
.process-flow[data-process-columns="1"] { max-width: 236px; grid-template-columns: minmax(0, 1fr); }
.process-flow[data-process-columns="2"] { max-width: 488px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.process-flow[data-process-columns="3"] { max-width: 740px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.process-flow[data-process-columns="4"] { max-width: 992px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.process-flow[data-process-columns="5"] { max-width: 1244px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.process-point { appearance: none; position: relative; z-index: 1; width: 100%; min-width: 0; height: auto; min-height: 0; aspect-ratio: 1; margin: 0; padding: clamp(20px, 2vw, 32px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; border: 1.5px solid var(--color-muted); border-radius: 50%; background: var(--color-white); color: var(--color-muted-2); cursor: pointer; transform: translateY(0) scale(1); transform-origin: center; box-shadow: none; transition:
    transform .62s cubic-bezier(.22, .72, .18, 1),
    background .48s ease,
    border-color .48s ease,
    color .42s ease,
    box-shadow .55s ease; will-change: transform;
}
.process-point__icon { width: 48px; height: 48px; flex: 0 0 48px; display: grid; place-items: center; border-radius: 50%; background: var(--color-surface-soft); color: var(--color-brand); transition: background-color .42s ease, color .42s ease, transform .56s cubic-bezier(.22, .72, .18, 1);
}
.process-point__title { min-width: 0; color: inherit; overflow-wrap: anywhere; text-align: center; transition: color .42s ease; }
.process-point.is-active { z-index: 2; border-color: var(--color-brand-650); background: linear-gradient(135deg, var(--color-brand-400) 0%, var(--color-brand) 58%, var(--color-brand-700) 100%); color: var(--color-white); transform: translateY(-8px) scale(1.03); box-shadow: 0 20px 44px rgba(var(--rgb-brand), .2);
}
.process-point.is-active::before { content: ""; position: absolute; inset: 22px; border: 2px solid rgba(var(--rgb-white), .82); border-radius: 50%;
}
.process-point.is-active .process-point__icon { background: rgba(var(--rgb-white), .12); color: var(--color-accent); transform: scale(1.04); }
.process-point:focus-visible { outline: 3px solid rgba(var(--rgb-accent), .6); outline-offset: 5px; }

/* =========================================================
   REVENUE CTA
   ========================================================= */

.revenue-cta { background: var(--color-white); }
.revenue-cta__card { display: grid; grid-template-columns: 1.05fr .95fr; overflow: hidden; border: 1px solid var(--color-border); border-radius: 28px; background: var(--color-surface-cta); box-shadow: var(--shadow-md);
}
.revenue-cta__content { padding: 58px; }
.revenue-cta__title { margin-bottom: 18px; }
.revenue-cta__text { max-width: 670px; }
.revenue-cta__visual { padding: 18px; }
.revenue-cta__image-wrap { height: 100%; min-height: 370px; border-radius: 22px; }

.revenue-cta__gold-corner { display: none; }

/* =========================================================
   PROPERTY SEARCH + PROPERTY CARDS
   ========================================================= */

.properties-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.properties-head .body-copy { margin-top: 12px; color: rgba(var(--rgb-white), .76); }
.hostaway-booking-widget { position: relative; overflow: visible; }
.stay-search { display: grid; grid-template-columns: minmax(185px, 1.05fr) minmax(360px, 1.55fr) minmax(210px, 1fr) auto; gap: 8px; margin: 0 0 38px; padding: 8px; overflow: visible; border: 1px solid rgba(var(--rgb-white), .2); border-radius: var(--radius-lg); background: var(--color-white); box-shadow: 0 22px 52px rgba(var(--rgb-shadow-deep), .22);
}
.stay-search__fallback { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-control); color: var(--color-ink-soft); }
.stay-search__fallback legend { padding-inline: 6px; color: var(--color-brand); font-weight: 600; }
.stay-search__fallback label { min-width: 0; display: grid; align-content: start; gap: 6px; color: var(--color-muted-mid); font-weight: 500; }
.stay-search__fallback input,
.stay-search__fallback select { width: 100%; min-height: 44px; padding: 9px 11px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-ink-soft); }
.stay-search__fallback-checkbox { display: flex !important; align-items: center; align-self: end; min-height: 44px; }
.stay-search__fallback-checkbox input[type="checkbox"] { width: 18px; min-height: 18px; flex: 0 0 18px; padding: 0; }
.stay-search__fallback-submit { align-self: end; min-height: 44px; }
.search-field { position: relative; min-width: 0; min-height: 64px; padding: 9px 13px; display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; overflow: visible; border: 1px solid transparent; border-radius: var(--radius-md); background: var(--color-surface-control); color: var(--color-brand); transition: border-color var(--duration-fast) ease, background var(--duration-fast) ease, box-shadow var(--duration-fast) ease;
}
.search-field:hover { background: var(--color-surface-muted); }
.search-field:focus-within,
.search-field.is-open { background: var(--color-white); border-color: var(--color-border-strong); box-shadow: 0 0 0 3px rgba(var(--rgb-brand), .10); }
.search-field > i { grid-column: 1; grid-row: 1 / 3; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: var(--color-surface-icon); color: var(--color-brand);
}
.search-field label { grid-column: 2; grid-row: 1; margin-bottom: 2px; color: var(--color-muted-light); line-height: 1.1; font-weight: 600; text-transform: uppercase; letter-spacing: .09em;
}
.stay-search .search-field > label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.search-field select,
.search-field input { grid-column: 2; grid-row: 2; width: 100%; min-width: 0; padding: 0; border: 0; outline: none; background: transparent; color: var(--color-ink-soft); font-weight: 600;
}
.search-btn { min-width: 142px; min-height: 64px; padding: 0 22px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: var(--radius-md); background: var(--color-accent); color: var(--color-ink-soft); font-weight: 600; cursor: pointer; box-shadow: 0 9px 20px rgba(var(--rgb-accent), .2); transition: transform var(--duration-fast) ease, background var(--duration-fast) ease;
}
.search-btn:hover { transform: translateY(-1px); background: var(--color-accent-bright); }

.search-dropdown-trigger { grid-column: 2; grid-row: 2; width: 100%; min-width: 0; padding: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; outline: none; background: transparent; color: var(--color-ink-soft); font-weight: 600; text-align: left; cursor: pointer;
}
.stay-search .search-dropdown-trigger,
.stay-search .date-range-trigger { grid-row: 1 / 3; }
.search-dropdown-trigger > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-dropdown-trigger > i { flex: 0 0 auto; color: var(--color-muted-lighter); transition: transform var(--duration-medium) ease, color var(--duration-fast) ease; }
.search-field--dropdown.is-open .search-dropdown-trigger > i { transform: rotate(180deg); color: var(--color-brand); }
.search-popover { position: absolute; z-index: 60; left: 0; top: calc(100% + 10px); width: max-content; min-width: 100%; max-width: min(360px, calc(100vw - (var(--page-gutter) * 2))); max-height: var(--search-popover-available-height, none); overflow-y: auto; padding: 8px; border: 1px solid var(--color-border-soft); border-radius: 20px; background: var(--color-white); box-shadow: var(--shadow-lg); animation: searchPopoverIn .22s var(--ease-standard);
}
.search-field.opens-above .search-popover { top: auto; bottom: calc(100% + 10px); }
.search-popover[hidden] { display: none !important; }
.search-popover--location { min-width: 230px; }
.search-popover--guests { left: auto; right: 0; width: 340px; padding: 18px; }
.search-option { width: 100%; padding: 11px 12px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 0; border-radius: 13px; background: transparent; color: var(--color-ink-700); font-weight: 500; text-align: left; cursor: pointer; transition: background var(--duration-fast) ease, color var(--duration-fast) ease;
}
.search-option:hover,
.search-option:focus-visible { outline: none; background: var(--color-surface-option-hover); }
.search-option > i { opacity: 0; color: var(--color-brand); }
.search-option.is-selected { background: var(--color-surface-selected); color: var(--color-brand-600); }
.search-option.is-selected > i { opacity: 1; }
.guest-picker-row { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.guest-picker-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.guest-picker-copy strong { color: var(--color-ink-800); line-height: 1.2; font-weight: 600; }
.guest-picker-copy span { color: var(--color-muted-soft); line-height: 1.35; }
.guest-stepper { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }
.stepper-btn { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--color-border-strong); border-radius: 50%; background: var(--color-white); color: var(--color-brand); cursor: pointer; transition: transform var(--duration-fast) ease, background var(--duration-fast) ease, border-color var(--duration-fast) ease;
}
.stepper-btn:hover:not(:disabled) { transform: translateY(-1px); border-color: var(--color-brand-300); background: var(--color-surface-stepper); }
.stepper-btn:disabled { opacity: .35; cursor: not-allowed; }
.stepper-btn i { display: grid; place-items: center; }
#guestNumber { width: 24px; color: var(--color-ink-soft); font-weight: 600; text-align: center; }
.guest-picker-divider { height: 1px; margin: 16px 0; background: var(--color-surface-divider); }
.pet-choice { flex: 0 0 auto; display: flex; padding: 3px; border-radius: var(--radius-sm); background: var(--color-surface-toggle); }
.pet-choice-btn { min-width: 50px; height: 34px; border: 0; border-radius: 9px; background: transparent; color: var(--color-muted-mid); font-weight: 600; cursor: pointer; transition: background var(--duration-fast) ease, color var(--duration-fast) ease, box-shadow var(--duration-fast) ease;
}
.pet-choice-btn.is-selected { background: var(--color-white); color: var(--color-brand); box-shadow: 0 2px 8px rgba(var(--rgb-shadow), .10); }

.search-field--dates { position: relative; }
.date-range-trigger { grid-column: 2; grid-row: 2; width: 100%; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 18px; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; color: var(--color-ink-soft); text-align: left; cursor: pointer;
}
.date-range-trigger__segment { min-width: 0; display: grid; gap: 3px; }
.date-range-trigger__caption { color: var(--color-muted-2); line-height: 1; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; }
.date-range-trigger__segment strong { overflow: hidden; color: var(--color-ink-soft); line-height: 1.25; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.date-range-trigger__arrow { display: grid; place-items: center; color: var(--color-muted-2); }
.date-range-trigger__chevron { justify-self: end; color: var(--color-muted-2); transition: transform var(--duration-medium) var(--ease-standard); }
.search-field--dates.is-open .date-range-trigger__chevron { transform: rotate(180deg); color: var(--color-brand); }
.date-range-popover { position: absolute; z-index: 80; top: calc(100% + 12px); left: 50%; width: min(760px, calc(100vw - (var(--page-gutter) * 2))); max-height: var(--search-popover-available-height, none); overflow-y: auto; padding: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-white); box-shadow: var(--shadow-lg); transform: translateX(-50%); animation: datePopoverIn var(--duration-medium) var(--ease-standard);
}
.search-field--dates.opens-above .date-range-popover { top: auto; bottom: calc(100% + 12px); }
.date-range-popover[hidden] { display: none !important; }
.calendar-toolbar { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 12px; padding: 2px 2px 14px; }
.calendar-toolbar__copy { display: grid; gap: 3px; text-align: center; }
.calendar-toolbar__copy strong { color: var(--color-ink); font-family: var(--font-heading); font-weight: 400; }
.calendar-toolbar__copy span { color: var(--color-muted-2); }
.calendar-nav { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-ink-soft); cursor: pointer; transition: transform var(--duration-fast) ease, background var(--duration-fast) ease, border-color var(--duration-fast) ease, color var(--duration-fast) ease;
}
.calendar-nav:hover:not(:disabled) { transform: translateY(-1px); border-color: var(--color-border-strong); background: var(--color-surface-soft); color: var(--color-brand); }
.calendar-nav:disabled { opacity: .35; cursor: not-allowed; }
.calendar-months { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; user-select: none; }
.calendar-month { min-width: 0; }
.calendar-month__title { margin-bottom: 12px; color: var(--color-ink-soft); text-align: center; }
.calendar-weekdays,
.calendar-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.calendar-weekdays { margin-bottom: 5px; }
.calendar-weekdays span { height: 26px; display: grid; place-items: center; color: var(--color-muted-2); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.calendar-day { position: relative; isolation: isolate; min-width: 0; max-height: 44px; aspect-ratio: 1; display: grid; place-items: center; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--color-ink-soft); font-weight: 600; cursor: pointer; touch-action: pan-y; transition: transform var(--duration-fast) ease, color var(--duration-fast) ease, background var(--duration-fast) ease, box-shadow var(--duration-fast) ease;
}
.calendar-day:not(:disabled):hover { transform: translateY(-1px); background: var(--color-surface-muted); color: var(--color-brand); }
.calendar-day:disabled { color: var(--color-border-strong); cursor: not-allowed; }
.calendar-day.is-today:not(.is-range-start):not(.is-range-end) { box-shadow: inset 0 0 0 1px var(--color-brand); color: var(--color-brand); }
.calendar-day.is-in-range,
.calendar-day.is-preview-range { border-radius: 5px; background: rgba(var(--rgb-brand), .11); color: var(--color-brand-hover); }
.calendar-day.is-range-start,
.calendar-day.is-range-end,
.calendar-day.is-drag-anchor { border-radius: var(--radius-sm); background: var(--color-brand); color: var(--color-white); box-shadow: 0 7px 18px rgba(var(--rgb-brand), .24); transform: none; }
.calendar-day.is-range-start::before,
.calendar-day.is-range-end::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; width: 52%; background: rgba(var(--rgb-brand), .11); }
.calendar-day.is-range-start::before { left: 50%; }
.calendar-day.is-range-end::before { right: 50%; }
.calendar-day.is-range-start.is-range-end::before { display: none; }
.calendar-day.is-drag-preview { background: var(--color-white); color: var(--color-brand); box-shadow: inset 0 0 0 2px var(--color-brand); }
.calendar-day:focus-visible { outline: 3px solid rgba(var(--rgb-brand), .22); outline-offset: 2px; }
.calendar-empty { max-height: 44px; aspect-ratio: 1; }
.calendar-footer { margin-top: 15px; padding-top: 14px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; border-top: 1px solid var(--color-border); }
.calendar-clear,
.calendar-done { min-height: 40px; padding: 9px 16px; border-radius: var(--radius-pill); font-weight: 600; cursor: pointer; transition: transform var(--duration-fast) ease, background var(--duration-fast) ease, border-color var(--duration-fast) ease, color var(--duration-fast) ease; }
.calendar-clear { border: 1px solid var(--color-border); background: var(--color-white); color: var(--color-ink-soft); }
.calendar-clear:hover { border-color: var(--color-border-strong); background: var(--color-surface-soft); }
.calendar-done { border: 1px solid var(--color-brand); background: var(--color-brand); color: var(--color-white); }
.calendar-done:hover:not(:disabled) { transform: translateY(-1px); border-color: var(--color-brand-hover); background: var(--color-brand-hover); }
.calendar-done:disabled { opacity: .38; cursor: not-allowed; }
.calendar-selection-summary { color: var(--color-muted); line-height: 1.4; text-align: center; }
.search-field--dates.has-error { border-color: var(--color-accent) !important; box-shadow: 0 0 0 3px rgba(var(--rgb-accent), .13) !important; }
.search-field--dates.has-error .calendar-selection-summary { color: var(--color-accent-text); font-weight: 600; }

.properties-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
.property-card { overflow: hidden; border: 1px solid rgba(var(--rgb-white), .1); border-radius: var(--radius-lg); background: var(--color-card-dark); transition: transform var(--duration-medium) ease, border-color var(--duration-medium) ease; }
.property-card:hover { transform: translateY(-5px); border-color: rgba(var(--rgb-accent), .52); }
.property-image { height: 230px; border-radius: 0; background: var(--color-card-media); }
.property-image img { transition: transform .5s ease; }
.property-card:hover .property-image img { transform: scale(1.035); }
.property-content { padding: 19px; }
.property-title { min-height: 50px; margin-bottom: 14px; color: var(--color-white); }
.property-meta { display: flex; flex-wrap: wrap; gap: 10px 14px; color: rgba(var(--rgb-white), .68); }
.property-meta span { display: flex; align-items: center; gap: 6px; }

.properties-more { display: flex; justify-content: center; margin-top: 32px; }
.properties-more__link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 13px 24px; border: 1px solid var(--color-accent); border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-ink); font-weight: 600; transition: transform var(--duration-fast) ease, background var(--duration-fast) ease, border-color var(--duration-fast) ease;
}
.properties-more__link i { display: inline-grid; place-items: center; width: 1em; height: 1em; flex: 0 0 1em; line-height: 1;
}
.properties-more__link i::before { display: block; line-height: 1; }
.properties-more__link:hover { transform: translateY(-2px); background: var(--color-accent-hover); border-color: var(--color-accent-hover); }
.properties-more__link:focus-visible { outline: 3px solid rgba(var(--rgb-accent), .28); outline-offset: 4px; }

/* =========================================================
   STAYS
   ========================================================= */

.stays-section { background: var(--color-white); }
.stays-showcase { display: grid; grid-template-columns: .9fr 1.1fr; gap: 54px; align-items: center; }
.stays-title { margin-bottom: 20px; }
.stays-visual { position: relative; min-width: 0; min-height: 450px; padding: 42px 0 0 54px; }
.stays-image-frame { height: 420px; border-radius: 24px 24px 90px 24px; }

.stays-gold-line { display: none; }

/* =========================================================
   THINGS TO DO
   ========================================================= */

.things-section { background: var(--color-surface-things); }
.things-head { margin-bottom: 38px; text-align: center; }
.things-kicker { width: 64px; height: 3px; margin: 0 auto 18px; border-radius: var(--radius-pill); background: var(--color-accent); }
.things-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; }
.things-more { display: flex; justify-content: center; margin-top: 28px; }
.thing-card { position: relative; height: 285px; background: var(--color-border); box-shadow: 0 14px 34px rgba(var(--rgb-shadow), .09); }
.thing-card__media { position: absolute; inset: 0; }
.thing-card img { transition: transform .5s ease; }
a.thing-card:hover img { transform: scale(1.04); }
.thing-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(var(--rgb-overlay), .8) 100%); }
.thing-card__label { position: absolute; left: 18px; right: 18px; bottom: 16px; color: var(--color-white); }
.thing-card__title { color: var(--color-white); }
