/* Shared branded background for every page except the home hero. */
body:not([data-page="home"]) {
    position: relative;
    background: #071d2d;
    isolation: isolate;
}

body:not([data-page="home"])::before {
    position: fixed;
    z-index: -2;
    background-image: url("../assets/images/accommodation/home-hero.jpeg");
    background-position: center;
    background-size: cover;
    content: "";
    inset: 0;
}

body:not([data-page="home"])::after {
    position: fixed;
    z-index: -1;
    background:
        linear-gradient(135deg, rgb(3 18 30 / 0.88), rgb(8 37 56 / 0.68)),
        linear-gradient(0deg, rgb(5 24 38 / 0.8), transparent 65%);
    content: "";
    inset: 0;
    pointer-events: none;
}

body:not([data-page="home"]) .site-header {
    position: absolute;
    z-index: var(--z-header);
    top: 0;
    right: 0;
    left: 0;
    min-height: 96px;
    border: 0;
    background: linear-gradient(180deg, rgb(2 15 25 / 0.86), transparent);
    box-shadow: none;
    backdrop-filter: none;
}

body:not([data-page="home"]) .site-header__container,
body:not([data-page="home"]) .site-header__inner {
    display: flex;
    min-height: 96px;
    align-items: center;
    gap: 1.15rem;
}

body:not([data-page="home"]) .brand__logo,
body:not([data-page="home"]) .brand__image {
    width: 70px;
    height: 70px;
    border: 1px solid rgb(255 255 255 / 0.2);
    border-radius: 16px;
    object-fit: cover;
    box-shadow: 0 10px 28px rgb(0 0 0 / 0.28);
}

body:not([data-page="home"]) .primary-navigation {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: clamp(0.55rem, 1vw, 1.05rem);
}

body:not([data-page="home"]) .primary-navigation__list {
    display: flex;
    margin: 0;
    padding: 0;
    align-items: center;
    justify-content: center;
    gap: clamp(0.55rem, 1vw, 1.05rem);
    list-style: none;
}

body:not([data-page="home"]) .primary-navigation a,
body:not([data-page="home"]) .primary-navigation__link,
body:not([data-page="home"]) .site-header__secure-label {
    color: rgb(255 255 255 / 0.9);
    font-size: 0.82rem;
    font-weight: 700;
    text-decoration: none;
    text-shadow: 0 2px 12px rgb(0 0 0 / 0.5);
    white-space: nowrap;
}

body:not([data-page="home"]) .primary-navigation a:hover,
body:not([data-page="home"]) .primary-navigation a[aria-current="page"] {
    color: #f5dda5;
}

body:not([data-page="home"]) .header-actions,
body:not([data-page="home"]) .site-header__actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.5rem;
}

body:not([data-page="home"]) .header-actions .button--text,
body:not([data-page="home"]) .site-header__actions .button--ghost {
    color: #fff;
}

body:not([data-page="home"]) .header-actions .button--primary,
body:not([data-page="home"]) .site-header__actions .button--primary {
    border-color: #d8ad52;
    background: linear-gradient(135deg, #f5dda5, #c8912f);
    color: #071d2d;
}

body:not([data-page="home"]) .navigation-toggle,
body:not([data-page="home"]) .site-header__menu-button {
    display: none;
    width: 46px;
    height: 46px;
    margin-inline-start: auto;
    padding: 11px;
    border: 1px solid rgb(255 255 255 / 0.22);
    border-radius: 12px;
    background: rgb(255 255 255 / 0.1);
    color: #fff;
}

body:not([data-page="home"]) .navigation-toggle__line,
body:not([data-page="home"]) .site-header__menu-button span {
    display: block;
    height: 2px;
    margin: 5px 0;
    border-radius: 99px;
    background: #fff;
}

body:not([data-page="home"]) .site-header + main .page-hero {
    padding-top: clamp(8rem, 14vw, 11rem);
}

body:not([data-page="home"]) .site-header + .auth-page,
body:not([data-page="home"]) .site-header + .payment-page,
body:not([data-page="home"]) .site-header + main:not(:has(.page-hero)) {
    padding-top: calc(96px + 2rem);
}

body:not([data-page="home"]) .page-hero {
    position: relative;
    display: grid;
    min-height: 720px;
    overflow: hidden;
    align-items: center;
    background: linear-gradient(90deg, rgb(3 18 30 / 0.9), rgb(7 29 45 / 0.42));
}

body:not([data-page="home"]) .page-hero__background {
    position: absolute;
    z-index: -1;
    inset: 0;
}

body:not([data-page="home"]) .page-hero__background::after {
    position: absolute;
    background: linear-gradient(90deg, rgb(3 18 30 / 0.9), rgb(7 29 45 / 0.58) 55%, rgb(3 18 30 / 0.28));
    content: "";
    inset: 0;
}

body:not([data-page="home"]) .page-hero__background-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body:not([data-page="home"]) .page-hero__content {
    width: min(100% - 2rem, var(--container-width));
    margin-inline: auto;
    padding-right: min(46%, 540px);
}

body:not([data-page="home"]) .page-hero__content h1,
body:not([data-page="home"]) .page-hero__content p,
body:not([data-page="home"]) .page-hero__content a {
    color: #fff;
}

body:not([data-page="home"]) .hero-search-panel {
    position: absolute;
    z-index: 3;
    top: 50%;
    right: max(1rem, calc((100vw - var(--container-width)) / 2));
    width: min(430px, calc(100% - 2rem));
    max-height: calc(100% - 130px);
    padding: 1.35rem;
    overflow-y: auto;
    border: 1px solid rgb(245 221 165 / 0.28);
    border-radius: 22px;
    background: rgb(7 29 45 / 0.91);
    box-shadow: 0 30px 70px rgb(0 0 0 / 0.38);
    transform: translateY(-46%);
    backdrop-filter: blur(18px);
}

body:not([data-page="home"]) .hero-search-panel .section-heading {
    margin-bottom: 1rem;
}

body:not([data-page="home"]) .hero-search-panel .section-heading__eyebrow {
    margin-bottom: 0.25rem;
    color: #d8ad52;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body:not([data-page="home"]) .hero-search-panel .section-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
}

body:not([data-page="home"]) .hero-search-panel .section-heading__description,
body:not([data-page="home"]) .hero-search-panel .section-heading__link {
    display: none;
}

body:not([data-page="home"]) .hero-search-panel .search-form,
body:not([data-page="home"]) .hero-search-panel .search-form__grid {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
}

body:not([data-page="home"]) .hero-search-panel .form-field,
body:not([data-page="home"]) .hero-search-panel .search-form__location,
body:not([data-page="home"]) .hero-search-panel .search-form__submit,
body:not([data-page="home"]) .hero-search-panel .checkbox-field {
    grid-column: 1;
}

body:not([data-page="home"]) .hero-search-panel .form-label,
body:not([data-page="home"]) .hero-search-panel .checkbox-field {
    color: rgb(255 255 255 / 0.86);
    font-size: 0.8rem;
}

body:not([data-page="home"]) .hero-search-panel input:not([type="checkbox"]),
body:not([data-page="home"]) .hero-search-panel select,
body:not([data-page="home"]) .hero-search-panel textarea {
    width: 100%;
    min-height: 54px;
    border: 1px solid rgb(255 255 255 / 0.35);
    border-radius: 12px;
    background: rgb(255 255 255 / 0.96);
    color: #071d2d;
}

body:not([data-page="home"]) .hero-search-panel .button--primary {
    width: 100%;
    min-height: 56px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(135deg, #f5c94e, #d99b18);
    color: #071d2d;
    font-weight: 850;
    text-transform: uppercase;
    box-shadow: 0 12px 26px rgb(217 155 24 / 0.25);
}

body:not([data-page="home"]) .hero-search-source {
    padding-top: 3rem;
}

body[data-page="host-dashboard"] .dashboard-header {
    border-bottom: 1px solid rgb(216 173 82 / 0.2);
    background: rgb(7 29 45 / 0.93);
    box-shadow: 0 15px 35px rgb(0 0 0 / 0.22);
    backdrop-filter: blur(18px);
}

body[data-page="host-dashboard"] .dashboard-header a,
body[data-page="host-dashboard"] .dashboard-header button,
body[data-page="host-dashboard"] .dashboard-header__user-name {
    color: #fff;
}

body[data-page="host-dashboard"] .dashboard-sidebar {
    background: rgb(7 29 45 / 0.92);
    backdrop-filter: blur(18px);
}

body[data-page="host-dashboard"] .dashboard-navigation__button,
body[data-page="host-dashboard"] .dashboard-sidebar a {
    color: rgb(255 255 255 / 0.86);
}

body[data-page="host-dashboard"] .dashboard-navigation__button:hover,
body[data-page="host-dashboard"] .dashboard-navigation__button[aria-current="page"] {
    background: rgb(216 173 82 / 0.16);
    color: #f5dda5;
}

body:not([data-page="home"]) main > .section,
body:not([data-page="home"]) main > section:not(.page-hero),
body:not([data-page="home"]) .listing-page,
body:not([data-page="home"]) .detail-page {
    background: rgb(251 250 246 / 0.94);
    backdrop-filter: blur(10px);
}

body:not([data-page="home"]) .auth-page,
body:not([data-page="home"]) .payment-page,
body:not([data-page="home"]) .dashboard-shell {
    background: transparent;
}

body:not([data-page="home"]) .auth-card,
body:not([data-page="home"]) .payment-card,
body:not([data-page="home"]) .dashboard-content,
body:not([data-page="home"]) dialog,
body:not([data-page="home"]) .filter-panel {
    border: 1px solid rgb(255 255 255 / 0.4);
    background: rgb(255 255 255 / 0.94);
    box-shadow: 0 28px 70px rgb(0 0 0 / 0.24);
    backdrop-filter: blur(22px);
}

body:not([data-page="home"]) .site-footer {
    background: rgb(5 22 35 / 0.96);
}

@media (max-width: 760px) {
    body:not([data-page="home"])::before {
        background-attachment: scroll;
        background-position: 58% center;
    }

    body:not([data-page="home"]) .auth-card,
    body:not([data-page="home"]) .payment-card,
    body:not([data-page="home"]) .dashboard-content {
        border-radius: 18px;
    }
}

@media (max-width: 1080px) {
    body:not([data-page="home"]) .navigation-toggle,
    body:not([data-page="home"]) .site-header__menu-button {
        display: block;
    }

    body:not([data-page="home"]) .primary-navigation {
        position: absolute;
        top: calc(100% - 0.25rem);
        right: 1rem;
        left: 1rem;
        display: none;
        max-height: calc(100vh - 110px);
        padding: 0.8rem;
        overflow-y: auto;
        border: 1px solid rgb(255 255 255 / 0.14);
        border-radius: 18px;
        align-items: stretch;
        background: rgb(7 29 45 / 0.98);
        box-shadow: 0 24px 55px rgb(0 0 0 / 0.32);
        flex-direction: column;
    }

    body:not([data-page="home"]) .primary-navigation[data-open="true"],
    body:not([data-page="home"]) .site-header:has([aria-expanded="true"]) .primary-navigation {
        display: flex;
    }

    body:not([data-page="home"]) .primary-navigation__list {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body:not([data-page="home"]) .primary-navigation a {
        display: block;
        min-height: 44px;
        padding: 0.7rem;
        border-radius: 10px;
        font-size: 0.92rem;
    }

    body:not([data-page="home"]) .primary-navigation a:hover {
        background: rgb(255 255 255 / 0.08);
    }

    body:not([data-page="home"]) .header-actions,
    body:not([data-page="home"]) .site-header__actions {
        display: none;
    }
}

@media (max-width: 900px) {
    body:not([data-page="home"]) .page-hero {
        display: block;
        min-height: auto;
        overflow: visible;
        padding-bottom: 2rem;
    }

    body:not([data-page="home"]) .page-hero__content {
        padding-right: 0;
        padding-bottom: 2rem;
    }

    body:not([data-page="home"]) .hero-search-panel {
        position: relative;
        top: auto;
        right: auto;
        width: min(100% - 2rem, 620px);
        max-height: none;
        margin-inline: auto;
        transform: none;
    }
}

@media (max-width: 620px) {
    body:not([data-page="home"]) .site-header,
    body:not([data-page="home"]) .site-header__container,
    body:not([data-page="home"]) .site-header__inner { min-height: 78px; }
    body:not([data-page="home"]) .brand__logo,
    body:not([data-page="home"]) .brand__image { width: 58px; height: 58px; border-radius: 13px; }
    body:not([data-page="home"]) .site-header + main .page-hero { padding-top: 7.5rem; }
}

.membership-guide {
    width: min(1180px, calc(100% - 2rem));
    margin: 2.5rem auto;
    padding: clamp(1.4rem, 3vw, 2.75rem);
    color: #f8fbff;
    border: 1px solid rgb(255 255 255 / 0.14);
    border-radius: 28px;
    background: linear-gradient(145deg, rgb(7 29 45 / 0.97), rgb(10 50 76 / 0.94));
    box-shadow: 0 28px 70px rgb(0 0 0 / 0.28);
}

.membership-guide__heading { max-width: 820px; margin-bottom: 1.75rem; }
.membership-guide__heading h1,
.membership-guide__heading h2 { margin: 0.35rem 0 0.8rem; color: #fff; }
.membership-guide__heading p { color: rgb(236 245 251 / 0.82); }
.membership-guide__eyebrow,
.membership-card__label { color: #f6bd3b; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
.membership-guide__grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.membership-card { padding: 1.5rem; border: 1px solid rgb(246 189 59 / 0.22); border-radius: 20px; background: rgb(255 255 255 / 0.07); }
.membership-card h2,
.membership-card h3 { color: #fff; }
.membership-card p,
.membership-card li { color: rgb(239 247 252 / 0.84); }
.membership-card li + li { margin-top: 0.55rem; }
.membership-card__note { margin-top: 1.1rem; padding: 0.9rem 1rem; border-left: 3px solid #f6bd3b; background: rgb(0 0 0 / 0.16); }
.membership-steps { display: grid; gap: 0.75rem; margin-top: 1.4rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.membership-steps span { padding: 0.9rem; border-radius: 14px; background: rgb(255 255 255 / 0.08); }
.membership-steps strong { display: inline-grid; width: 28px; height: 28px; margin-right: 0.4rem; color: #082238; border-radius: 50%; place-items: center; background: #f6bd3b; }

@media (max-width: 760px) {
    .membership-guide__grid,
    .membership-steps { grid-template-columns: 1fr; }
}