﻿/* KODA Monde Shell - scoped base layout for fixed backgrounds + glass */

/* ── Full-width breakout (Elementor container safe) ── */
.koda-monde {
    position: relative;
    isolation: isolate;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: clip;
    background-image: var(--koda-bg-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.koda-monde__background {
    display: none;
    position: sticky;
    top: 0;
    height: 100vh;
    background-image: var(--koda-bg-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

.koda-monde__overlays {
    position: absolute;
    inset: 0;
    background: var(--koda-bg-overlay, rgba(0, 0, 0, 0.45));
    pointer-events: none;
    z-index: 1;
}

.koda-monde__content {
    position: relative;
    z-index: 2;
}

/* ── Hero offset (pushes hero below sticky header) ── */
.koda-monde .hero {
    padding-top: var(--koda-hero-offset, 0px);
}

/* ── Full-width sections (100vw layout for all mondes) ── */
.koda-monde[data-koda-monde] .terra-section {
    max-width: none;
    width: 100%;
    box-sizing: border-box;
    margin-left: 0;
    margin-right: 0;
    padding-left: max(24px, calc((100% - 1200px) / 2));
    padding-right: max(24px, calc((100% - 1200px) / 2));
    border-radius: 0;
}

.koda-monde[data-koda-monde] .terra-section.koda-glass {
    border-radius: 0;
}

.koda-monde[data-koda-monde] .terra-nav {
    max-width: none;
    width: 100%;
    box-sizing: border-box;
    margin-left: 0;
    margin-right: 0;
    padding-left: max(24px, calc((100% - 1200px) / 2));
    padding-right: max(24px, calc((100% - 1200px) / 2));
    border-radius: 0;
}

/* iOS/Safari fallback for background-attachment: fixed */
@supports (-webkit-touch-callout: none) {
    .koda-monde {
        background-image: none;
        background-attachment: scroll;
    }

    .koda-monde__background {
        display: block;
    }

    .koda-monde__overlays {
        position: sticky;
        top: 0;
        height: 100vh;
    }
}

/* ── Glassmorphism utility ── */
.koda-monde .koda-glass {
    background: var(--glass-bg, rgba(255, 255, 255, 0.08));
    border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.18));
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(var(--glass-blur, 14px)) saturate(1.2);
    -webkit-backdrop-filter: blur(var(--glass-blur, 14px)) saturate(1.2);
    border-radius: var(--glass-radius, 18px);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .koda-monde .koda-glass {
        background: rgba(0, 0, 0, 0.35);
    }
}

/* Ensure panels remain readable */
.koda-monde .koda-glass * {
    position: relative;
}
