/* Global multi-browser compatibility fallbacks */
:root {
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);
    --header-top-h: calc(44px + var(--safe-area-top));
    --header-h: calc(var(--header-top-h) + var(--header-main-h));
}

.site-header {
    backdrop-filter: blur(18px) saturate(120%);
    -webkit-backdrop-filter: blur(18px) saturate(120%);
    padding-left: var(--safe-area-left);
    padding-right: var(--safe-area-right);
}

.skip-link {
    top: calc(0.75rem + var(--safe-area-top));
    left: calc(0.75rem + var(--safe-area-left));
}

.badge {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.newsletter-modal {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.cookie-banner {
    backdrop-filter: blur(14px) saturate(120%);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
}

.venue-lightbox-overlay {
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.newsletter-modal,
.venue-lightbox {
    padding:
        calc(1rem + var(--safe-area-top))
        calc(1rem + var(--safe-area-right))
        calc(1rem + var(--safe-area-bottom))
        calc(1rem + var(--safe-area-left));
}

.floating-actions {
    right: calc(var(--floating-right) + var(--safe-area-right));
    bottom: calc(var(--floating-bottom) + var(--safe-area-bottom));
}

.cookie-banner {
    right: calc(1rem + var(--safe-area-right));
    bottom: calc(1rem + var(--safe-area-bottom));
}

@media (max-width: 860px) {
    .main-nav {
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        left: calc(1rem + var(--safe-area-left));
        right: calc(1rem + var(--safe-area-right));
    }
}

@media (max-width: 700px) {
    .floating-actions {
        right: calc(0.9rem + var(--safe-area-right));
        bottom: calc(0.9rem + var(--safe-area-bottom));
    }

    .cookie-banner {
        left: calc(1rem + var(--safe-area-left));
        right: calc(1rem + var(--safe-area-right));
        bottom: calc(1rem + var(--safe-area-bottom));
    }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .site-header {
        background: linear-gradient(180deg, rgba(8, 10, 13, 0.94), rgba(8, 10, 13, 0.88));
    }

    .badge {
        background: rgba(255, 255, 255, 0.18);
    }

    .newsletter-modal {
        background: rgba(3, 4, 6, 0.82);
    }

    .cookie-banner {
        background: radial-gradient(circle at top right, rgba(207, 31, 53, 0.16), transparent 42%), linear-gradient(180deg, rgba(14, 14, 18, 0.985), rgba(8, 8, 12, 0.975));
    }

    .venue-lightbox-overlay {
        background: rgba(0, 0, 0, 0.88);
    }
}

@supports not (content-visibility: auto) {
    img[loading="lazy"],
    .section,
    .section-dark,
    .hero-home,
    .hero-inner {
        content-visibility: visible;
        contain-intrinsic-size: auto;
    }
}

@supports (-webkit-touch-callout: none) {
    body.page-organization::before {
        background-attachment: scroll;
    }
}

@media (hover: none) and (pointer: coarse) {
    body.page-organization::before {
        background-attachment: scroll;
    }
}