/* ==================== Homepage full-viewport scroll panels ==================== */

html.home-scroll-snap {
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
}

body.page-home {
    padding-top: 0 !important;
    --home-header-height: var(--mobile-header-offset, 88px);
}

.page-home .main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1020;
}

.page-home .home-panel {
    height: 100dvh;
    min-height: 100dvh;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    margin: 0;
}

.page-home .home-panel.about-us,
.page-home .home-panel.gallery-green-section,
.page-home .home-panel.map-section {
    padding: var(--home-header-height) clamp(20px, 4vw, 60px) clamp(20px, 3vh, 40px);
}

/* ── Hero ── */
.page-home .home-panel--hero {
    padding: 0;
    position: relative;
    color: white;
    justify-content: stretch;
}

.page-home .home-panel--hero.hero {
    height: 100dvh;
    min-height: 100dvh;
}

.page-home .home-panel--hero .hero-fallback-image,
.page-home .home-panel--hero .hero-fallback-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-home .home-panel--hero .hero-content {
    position: relative;
    z-index: 1;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: var(--home-header-height) clamp(20px, 4vw, 40px) clamp(20px, 4vh, 40px);
}

/* ── About + Reviews: original sizes, vertically centered in panel ── */
.page-home .home-panel--about.about-us {
    flex-direction: column;
    gap: clamp(24px, 4vh, 40px);
}

.page-home .home-panel--about .about-content {
    width: 100%;
    padding: 0;
    flex: none;
    height: auto;
}

.page-home .home-panel--about .reviews-content-col {
    width: 100%;
    padding: 0;
    flex: none;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.page-home .home-panel--about .about-content p {
    margin-bottom: 30px;
}

.page-home .home-panel--about .reviews-section-header {
    margin-bottom: clamp(28px, 5vw, 48px);
}

.page-home .home-panel--about .reviews-card-wrap {
    flex: none;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.page-home .home-panel--about .carousel-wrapper.reviews-carousel-container {
    flex: none;
    height: auto;
    max-width: min(100%, 620px);
    width: 100%;
}

.page-home .home-panel--about .reviews-carousel-stage {
    flex: none;
    min-height: clamp(220px, 32vw, 280px);
    height: auto;
}

/* ── Gallery + Green Initiative: original sizes ── */
.page-home .home-panel--gallery.gallery-green-section {
    flex-direction: column;
    gap: clamp(24px, 4vh, 40px);
}

.page-home .home-panel--gallery .why-content-col,
.page-home .home-panel--gallery .about-gallery-wrapper {
    width: 100%;
    padding: 0;
    flex: none;
    height: auto;
    display: block;
}

.page-home .home-panel--gallery .green-initiative-grid {
    min-height: 0;
    grid-auto-rows: auto;
    align-content: start;
}

.page-home .home-panel--gallery {
    height: auto;
    min-height: 100dvh;
    overflow: visible;
}

.page-home .home-panel--gallery .carousel-wrapper.gallery-carousel-card {
    flex: none;
    max-width: 550px;
    width: 100%;
    height: 420px;
    margin-inline: auto;
}

/* ── Map: restore full-width image so marker positions stay aligned ── */
.page-home .home-panel--map {
    justify-content: center;
    text-align: center;
    overflow: visible;
}

.page-home .home-panel--map .interactive-map-container {
    flex: none;
    width: 100%;
    max-width: 900px;
    margin-inline: auto;
}

.page-home .home-panel--map .map-stage {
    width: 100%;
    position: relative;
}

.page-home .home-panel--map .map-image,
.page-home .home-panel--map .map-image img {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
    margin-inline: auto;
}

/* Last panel: map fills the screen, footer scrolls in below without snap-back */
.page-home .home-panel--end {
    height: auto;
    min-height: 100dvh;
    overflow: visible;
    justify-content: flex-start;
    padding: var(--home-header-height) 0 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

.page-home .home-panel--end .map-section {
    flex: none;
    width: 100%;
    min-height: calc(100dvh - var(--home-header-height));
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 clamp(20px, 4vw, 60px) clamp(20px, 3vh, 32px);
    margin: 0;
    overflow: visible;
}

.page-home .home-panel--end .interactive-map-container {
    margin-inline: auto;
}

.page-home .home-panel--end .main-footer {
    flex-shrink: 0;
    width: 100%;
    scroll-snap-align: none;
}

/* ── Desktop: side-by-side columns ── */
@media (min-width: 992px) {
    body.page-home {
        --home-header-height: var(--header-offset);
    }

    .page-home .home-panel--about.about-us,
    .page-home .home-panel--gallery.gallery-green-section {
        flex-direction: row;
        align-items: center;
        gap: clamp(40px, 5vw, 72px);
        padding-inline: clamp(40px, 5vw, 80px);
    }

    .page-home .home-panel--about .about-content,
    .page-home .home-panel--about .reviews-content-col,
    .page-home .home-panel--gallery .why-content-col,
    .page-home .home-panel--gallery .about-gallery-wrapper {
        flex: 1;
        width: 50%;
        max-width: 50%;
    }
}

/* ── Mobile & tablet: natural section stacking (no overlap) ── */
@media (max-width: 991.98px) {
    html.home-scroll-snap {
        scroll-snap-type: none;
        scroll-behavior: auto;
    }

    body.page-home {
        --home-header-height: var(--mobile-header-offset, 88px);
    }

    .page-home .home-panel {
        height: auto;
        min-height: 0;
        overflow: visible;
        justify-content: flex-start;
        scroll-snap-align: none;
        scroll-snap-stop: normal;
        scroll-margin-top: var(--home-header-height);
    }

    .page-home .home-panel--hero.hero {
        min-height: 100svh;
        height: auto;
    }

    .page-home .home-panel--hero .hero-content {
        justify-content: center;
        min-height: calc(100svh - var(--home-header-height));
        padding-top: calc(var(--home-header-height) + 24px);
        padding-bottom: clamp(32px, 6vh, 48px);
    }

    .page-home .home-panel--about.about-us,
    .page-home .home-panel--gallery.gallery-green-section {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: calc(var(--home-header-height) + 32px) clamp(20px, 5vw, 32px) clamp(48px, 8vh, 72px);
    }

    /* About block — full section */
    .page-home .home-panel--about .about-content {
        width: 100%;
        max-width: 640px;
        margin-inline: auto;
        padding-bottom: clamp(40px, 7vh, 56px);
    }

    /* Reviews — separate visual section below About */
    .page-home .home-panel--about .reviews-content-col {
        width: 100%;
        max-width: 640px;
        margin-inline: auto;
        padding-top: clamp(40px, 7vh, 56px);
        border-top: 1px solid rgba(45, 93, 90, 0.14);
    }

    .page-home .home-panel--about .reviews-section-header {
        margin-bottom: clamp(24px, 4vh, 36px);
    }

    /* Green Initiative — title/intro hero block */
    .page-home .home-panel--gallery .why-content-col {
        width: 100%;
        max-width: 640px;
        margin-inline: auto;
    }

    .page-home .home-panel--gallery .green-initiative-header {
        padding-bottom: clamp(8px, 2vh, 16px);
        margin-bottom: clamp(24px, 4vh, 36px);
    }

    .page-home .home-panel--gallery .green-initiative-intro {
        margin-top: clamp(16px, 3vh, 24px);
        margin-bottom: clamp(28px, 5vh, 40px);
    }

    .page-home .home-panel--about .reviews-carousel-stage {
        min-height: clamp(280px, 45vw, 340px);
    }

    .page-home .home-panel--gallery .green-initiative-grid {
        min-height: 0;
        grid-template-rows: auto;
        margin-bottom: clamp(40px, 7vh, 56px);
    }

    .page-home .home-panel--about .about-content,
    .page-home .home-panel--about .reviews-content-col,
    .page-home .home-panel--gallery .why-content-col,
    .page-home .home-panel--gallery .about-gallery-wrapper {
        position: relative;
        z-index: 1;
    }

    /* Photo Gallery — separate section below Green Initiative */
    .page-home .home-panel--gallery .about-gallery-wrapper {
        width: 100%;
        max-width: 640px;
        margin-inline: auto;
        padding-top: clamp(40px, 7vh, 56px);
        border-top: 1px solid rgba(45, 93, 90, 0.14);
    }

    .page-home .home-panel--gallery .carousel-wrapper.gallery-carousel-card {
        height: clamp(240px, 55vw, 320px);
        max-width: 100%;
    }

    .page-home .home-panel--end {
        min-height: 0;
        padding-top: calc(var(--home-header-height) + 24px);
    }

    .page-home .home-panel--end .map-section {
        min-height: 0;
        padding-top: clamp(24px, 4vh, 40px);
        padding-bottom: clamp(32px, 6vh, 48px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html.home-scroll-snap {
        scroll-behavior: auto;
    }
}

html.home-scroll-snap--released {
    scroll-snap-type: none;
}
