/* ═══════════════════════════════════════════════════════════
   OptixMC Layout Fixes – Scroll, Subpages, Positionierung
   (lädt als letztes CSS und überschreibt Legacy-Konflikte)
   ═══════════════════════════════════════════════════════════ */

/* ── 1. Globales Scroll-Verhalten ─────────────────────────── */

html {
    overflow-x: hidden !important;
    scroll-behavior: smooth;
}

body {
    display: block !important;
    align-items: unset !important;
    justify-content: unset !important;
    text-align: left !important;
    overflow-x: hidden !important;
    min-height: 100dvh !important;
}

/* Unterseiten: Scrollen erzwingen (Legacy setzt overflow:hidden auf Desktop) */
html.subpage-active,
html.scrollable,
body.subpage-active,
body.scrollable {
    overflow: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
    max-height: none !important;
    min-height: 100dvh !important;
}

body.subpage-active .container {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
}

@media (min-width: 769px) {
    html.subpage-active,
    html.scrollable,
    body.subpage-active,
    body.scrollable {
        overflow: auto !important;
        overflow-x: hidden !important;
        height: auto !important;
    }
}

/* Landing: kein erzwungenes Body-Scroll-Lock */
html.landing-active,
body.landing-active {
    overflow-x: hidden !important;
}

/* ── 2. Container & Sections ─────────────────────────────── */

.container {
    max-width: 1200px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: var(--header-h) clamp(1rem, 3vw, 2rem) 2rem !important;
    box-sizing: border-box !important;
}

.section {
    width: 100% !important;
    overflow: visible !important;
    height: auto !important;
}

.section.is-visible {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 1 !important;
    overflow: visible !important;
    height: auto !important;
}

.page-view.is-active {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ── 3. Landingpage ──────────────────────────────────────── */

body.landing-active .social-links {
    display: none !important;
}

body.landing-active .landing-social {
    display: flex !important;
}

body.subpage-active .landing-social {
    display: none !important;
}

body.landing-active #section-start.is-visible {
    min-height: calc(100dvh - var(--header-h) - 1rem) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-y: auto !important;
    padding: 0 !important;
}

body.landing-active #viewStart.landing-page {
    min-height: auto !important;
    padding: 0.25rem 0 0.5rem !important;
    justify-content: center !important;
}

body.landing-active .landing-dashboard {
    margin-bottom: 0.65rem !important;
}

/* Server-Banner immer sichtbar */
.landing-dashboard__slot--server,
.landing-dashboard__slot--server .server-status-wrapper,
.landing-dashboard__slot--server .minecraft-server-status {
    display: flex !important;
    visibility: visible !important;
    width: 100% !important;
}

.landing-dashboard__slot {
    align-items: stretch !important;
}

.player-count-display {
    height: auto !important;
    min-height: unset !important;
    max-height: none !important;
}

.minecraft-server-status {
    height: auto !important;
    min-height: unset !important;
}

.new-players-card {
    min-height: unset !important;
}

/* Neue Spieler – Desktop: kompakte Karte fix oben rechts, nicht im Hero-Flow */
@media (min-width: 769px) {
    #viewStart.is-active #recentVerificationsContainer.landing-new-players {
        position: fixed !important;
        top: calc(var(--header-h) + 0.6rem) !important;
        right: max(1rem, env(safe-area-inset-right, 0px)) !important;
        left: auto !important;
        bottom: auto !important;
        width: 248px !important;
        max-width: 248px !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: none !important;
        align-self: auto !important;
        z-index: 10040 !important;
        text-align: left !important;
        max-height: min(360px, calc(100dvh - var(--header-h) - 1rem)) !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    #viewStart.is-active #recentVerificationsContainer .new-players-card__list,
    #viewStart.is-active #recentVerificationsContainer .recent-verifications-slider {
        max-height: 200px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        align-items: stretch !important;
    }

    #viewStart.is-active #recentVerificationsContainer .recent-verification-item {
        width: 100% !important;
        max-width: 100% !important;
        transform: none !important;
        opacity: 1 !important;
    }

    #viewStart.is-active #recentVerificationsContainer .recent-verification-item:nth-child(2),
    #viewStart.is-active #recentVerificationsContainer .recent-verification-item:nth-child(3) {
        transform: none !important;
        opacity: 1 !important;
    }
}

/* ── 4. Unterseiten – Scroll & Abstände ──────────────────── */

body.subpage-active .section:not(.is-visible) {
    display: none !important;
}

body.subpage-active .section.is-visible {
    display: block !important;
    min-height: auto !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.5rem !important;
}

/* News – Details am Dateiende (PAGE FLOW / Footer) */

#section-news .news-wrapper {
    width: 100% !important;
    max-width: 920px !important;
    margin: 0 auto !important;
    padding-top: clamp(1.25rem, 4vh, 2.75rem) !important;
    padding-bottom: clamp(1rem, 3vh, 2rem) !important;
}

#section-news .news-title-container {
    position: relative !important;
    margin-bottom: 1rem !important;
    text-align: center !important;
}

/* Profil – Breite/Wrapper (Page-Stage am Dateiende) */
#viewProfil,
#viewProfil.is-active {
    min-width: 0 !important;
    width: 100% !important;
    max-width: min(1100px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

.profil-wrapper,
.profil-container {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Live Map – Details in PAGE STAGE (Ende der Datei) */

section#section-livemap .livemap-container,
section#section-livemap.is-visible .livemap-container,
section#section-livemap.is-visible #viewLivemap .livemap-container {
    width: min(100%, 1100px) !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    left: auto !important;
    transform: none !important;
    position: relative !important;
}

section#section-livemap .livemap-actions,
section#section-livemap.is-visible .livemap-actions,
section#section-livemap.is-visible #viewLivemap .livemap-container .livemap-actions {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    margin: 0 auto 0.75rem !important;
    width: 100% !important;
    max-width: 1100px !important;
}

@media (max-width: 768px) {
    section#section-livemap .livemap-container {
        width: 100% !important;
        margin: 0 !important;
        transform: none !important;
    }
}

/* Täglich – Details in PAGE STAGE (Ende der Datei) */

/* Impressum / Datenschutz / AGB */
#section-impressum.is-visible,
#section-datenschutz.is-visible,
#section-nutzungsbedingungen.is-visible {
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    padding-bottom: 1rem !important;
}

#section-impressum.is-visible #viewImpressum.is-active,
#section-datenschutz.is-visible #viewDatenschutz.is-active,
#section-nutzungsbedingungen.is-visible #viewNutzungsbedingungen.is-active {
    display: block !important;
    overflow: visible !important;
    height: auto !important;
    padding-bottom: 2rem !important;
}

/* Markt / Coming Soon – Details in PAGE STAGE (Ende der Datei) */

/* ── 5. Header / Login / User-Menü ───────────────────────── */

.site-header {
    pointer-events: none;
}

.site-header__inner {
    overflow: visible !important;
}

.site-header__actions {
    position: relative !important;
    overflow: visible !important;
}

.site-header__actions .login-btn {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: 2 !important;
    background: var(--c-surface) !important;
    box-shadow: none !important;
}

.site-header__actions .login-btn:hover {
    background: var(--c-surface-hover) !important;
    transform: none !important;
}

.site-header__actions .user-menu {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: 2 !important;
}

.user-menu-wrapper {
    position: relative !important;
}

.user-menu-dropdown {
    z-index: 10100 !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
}

/* ── 6. Footer & Spielmodi ───────────────────────────────── */

.site-footer {
    position: relative !important;
    z-index: 2 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    clear: both !important;
}

.footer-modes {
    margin-bottom: 0.75rem !important;
}

.site-footer__social {
    display: flex;
    gap: 0.5rem;
    margin-top: 1rem;
}

.site-footer__social a {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    color: var(--c-muted);
    transition: color 0.2s, background 0.2s, border-color 0.2s;
}

.site-footer__social a:hover {
    color: var(--c-text);
    background: var(--c-surface-hover);
    border-color: var(--c-border-light);
}

.site-footer__social a svg {
    width: 16px;
    height: 16px;
}

.social-links {
    display: none !important;
}

/* ── 7. Video-Hintergrund ─────────────────────────────────── */

#videoBg {
    position: fixed !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* ── 8. Responsive Landing-Dashboard ─────────────────────── */

@media (max-width: 768px) {
    #viewStart.is-active #recentVerificationsContainer.landing-new-players {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        width: 100% !important;
        max-width: min(400px, 100%) !important;
        margin: 0.85rem auto 0 !important;
        max-height: none !important;
    }
}

/* ═══ SCROLL-LOCK ENDGÜLTIG ENTFERNEN ═══ */

html,
body,
body.loaded {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
    max-height: none !important;
    min-height: 100dvh !important;
    overscroll-behavior-y: auto !important;
    scroll-behavior: auto !important;
}

@media (min-width: 769px) {
    html,
    body,
    body.loaded {
        overflow-y: auto !important;
        height: auto !important;
    }
}

.container {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
}

.section,
.section.is-visible,
.section:not(#section-start) {
    min-height: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

#section-taeglich,
#section-taeglich.is-visible,
#section-livemap,
#section-livemap.is-visible,
#section-coming,
#section-coming.is-visible,
#section-taeglich.is-visible #viewTaeglich,
#section-taeglich.is-visible #viewTaeglich.is-active,
#section-livemap.is-visible #viewLivemap,
#section-livemap.is-visible #viewLivemap.is-active,
#section-coming.is-visible #viewComing,
#section-coming.is-visible #viewComing.is-active {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Footer: Standard sichtbar – auf Landing erst nach Scrollen */
.site-footer,
#siteFooter {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding-top: 1.25rem !important;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
    border-top-color: var(--c-border) !important;
}

/* Nur Landing: Footer versteckt bis gescrollt */
body.landing-active:not(.footer-revealed) .site-footer,
body.landing-active:not(.footer-revealed) #siteFooter {
    max-height: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-top-color: transparent !important;
    pointer-events: none !important;
    visibility: hidden !important;
    transition:
        max-height 0.45s ease,
        opacity 0.3s ease,
        padding 0.35s ease,
        visibility 0s linear 0.35s;
}

body.landing-active.footer-revealed .site-footer,
body.landing-active.footer-revealed #siteFooter {
    max-height: 720px !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding-top: 1.25rem !important;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
    border-top-color: var(--c-border) !important;
    transition:
        max-height 0.45s ease,
        opacity 0.3s ease,
        padding 0.35s ease,
        visibility 0s linear 0s;
}

/* Leichter Scroll-Spielraum auf Landing & kurzen Seiten */
body.landing-active .container,
body.subpage-active .container {
    padding-bottom: 0.75rem !important;
}

.page-scroll-tail {
    height: 0;
    pointer-events: none;
    visibility: hidden;
}

body.landing-active .page-scroll-tail {
    height: min(18vh, 140px);
}

/* ═══ PAGE STAGE – dynamische Hero-Zentrierung (lädt zuletzt) ═══ */

:root {
    --page-stage-min: calc(100dvh - var(--header-h) - clamp(0.75rem, 3vh, 2rem));
    --page-pad-y: clamp(0.75rem, 2.5vh, 1.75rem);
    --page-gap: clamp(0.5rem, 1.5vh, 1rem);
}

/* Landing: echte Viewport-Zentrierung */
#section-start.is-visible {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    min-height: var(--page-stage-min) !important;
    padding-block: var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

#section-start.is-visible > #viewStart,
#viewStart.landing-page.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    gap: var(--page-gap) !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Livemap / Täglich / Markt / News: zentriert wenn kurz, normal scrollbar wenn lang */
#section-livemap.is-visible,
#section-taeglich.is-visible,
#section-coming.is-visible,
#section-news.is-visible {
    display: block !important;
    min-height: var(--page-stage-min) !important;
    padding-block: var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

#section-livemap.is-visible > #viewLivemap,
#section-taeglich.is-visible > #viewTaeglich,
#section-coming.is-visible > #viewComing,
#section-news.is-visible > #viewNews,
#viewLivemap.is-active,
#viewTaeglich.is-active,
#viewComing.is-active,
#viewNews.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    min-height: calc(var(--page-stage-min) - 2 * var(--page-pad-y)) !important;
    height: auto !important;
    margin-block: auto !important;
    padding: 0 !important;
    gap: var(--page-gap) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    position: relative !important;
    transform: none !important;
}

/* Hero-Inhalt: Abstände nur über gap, nicht feste Margins */
.landing-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: var(--page-gap) !important;
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 920px !important;
}

.landing-hero__top {
    gap: var(--page-gap) !important;
    margin-bottom: 0 !important;
}

body.landing-active .landing-dashboard,
.landing-dashboard {
    margin: 0 !important;
}

.landing-cta {
    margin: 0 !important;
}

.page-stage__inner {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0 clamp(0.5rem, 2vw, 1rem);
    display: flex;
    flex-direction: column;
    gap: var(--page-gap);
    align-items: stretch;
    box-sizing: border-box;
}

#section-kontakt.is-visible .contact-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    text-align: center;
    gap: var(--page-gap);
}

#section-kontakt.is-visible .contact-hero__top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--page-gap);
    width: 100%;
}

#section-kontakt.is-visible .contact-cards {
    width: 100%;
    text-align: left;
}

.page-flow__inner {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0 clamp(0.5rem, 2vw, 1rem);
    box-sizing: border-box;
}

/* Fließ-Seiten: oben beginnend, kein erzwungenes 100vh */
#section-impressum.is-visible,
#section-datenschutz.is-visible,
#section-nutzungsbedingungen.is-visible {
    display: block !important;
    min-height: auto !important;
    padding-top: var(--page-pad-y) !important;
    padding-bottom: 0 !important;
    padding-inline: 0 !important;
}

#section-impressum.is-visible #viewImpressum.is-active,
#section-datenschutz.is-visible #viewDatenschutz.is-active,
#section-nutzungsbedingungen.is-visible #viewNutzungsbedingungen.is-active {
    display: block !important;
    padding-top: 0 !important;
    min-height: auto !important;
    height: auto !important;
}

/* News: alles im Dokumentfluss, kein Nested-Scroll */
#section-news.is-visible #viewNews.is-active {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    position: relative !important;
    transform: none !important;
    will-change: auto !important;
}

#section-news .news-wrapper,
#section-news .news-container,
#section-news .news-grid,
#section-news .news-card-wrapper,
#section-news .news-card {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    position: relative !important;
}

/* Unterseiten: Footer im Fluss, am unteren Rand bei kurzem Inhalt */
body.subpage-active {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100dvh !important;
    overscroll-behavior-y: auto !important;
}

body.subpage-active > .container {
    flex: 1 0 auto !important;
    width: 100% !important;
}

body.subpage-active > .page-scroll-tail {
    height: 0 !important;
    flex: 0 0 0 !important;
}

body.subpage-active .site-footer,
body.subpage-active #siteFooter {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: auto !important;
    padding-top: 1.25rem !important;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
    border-top-color: var(--c-border) !important;
    margin-top: auto !important;
    flex-shrink: 0 !important;
    width: 100% !important;
    transition: none !important;
}

/* News: Hero zentriert, Footer erst nach Scrollen (wie Livemap/Täglich) */
#section-news.is-visible > #viewNews,
#section-news.is-visible > #viewNews.is-active {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.news-page-active .site-footer,
body.news-page-active #siteFooter,
html.news-page-active .site-footer,
html.news-page-active #siteFooter {
    margin-top: 0 !important;
}

/* Unterseiten-Footer: auch wenn html-Klasse gesetzt */
html.subpage-active .site-footer,
html.subpage-active #siteFooter,
body.subpage-footer-on .site-footer,
body.subpage-footer-on #siteFooter,
html.subpage-footer-on .site-footer,
html.subpage-footer-on #siteFooter {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: auto !important;
    padding-top: 1.25rem !important;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
    border-top-color: var(--c-border) !important;
}

/* Livemap: Hero (Buttons + Map) vertikal zentriert mit Abstand oben */
section#section-livemap.is-visible {
    min-height: var(--page-stage-min) !important;
    padding-block: clamp(1.5rem, 5vh, 3rem) var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
}

section#section-livemap.is-visible > #viewLivemap,
section#section-livemap.is-visible > #viewLivemap.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    width: 100% !important;
    min-height: calc(var(--page-stage-min) - clamp(1.5rem, 5vh, 3rem) - var(--page-pad-y)) !important;
    height: auto !important;
    margin-block: auto !important;
    padding-top: clamp(0.75rem, 2.5vh, 1.5rem) !important;
    padding-bottom: 0 !important;
    gap: var(--page-gap) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    transform: none !important;
}

section#section-livemap.is-visible .livemap-actions,
section#section-livemap.is-visible #viewLivemap .livemap-container .livemap-actions {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto var(--page-gap) !important;
}

section#section-livemap.is-visible .livemap-container {
    margin-top: 0 !important;
    flex-shrink: 0 !important;
}

body.livemap-page-active .site-footer,
body.livemap-page-active #siteFooter,
html.livemap-page-active .site-footer,
html.livemap-page-active #siteFooter {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    section#section-livemap.is-visible {
        padding-block: clamp(1rem, 4vh, 2.25rem) var(--page-pad-y) !important;
    }

    section#section-livemap.is-visible > #viewLivemap,
    section#section-livemap.is-visible > #viewLivemap.is-active {
        padding-top: clamp(0.5rem, 2vh, 1rem) !important;
        min-height: calc(var(--page-stage-min) - clamp(1rem, 4vh, 2.25rem) - var(--page-pad-y)) !important;
    }

    section#section-livemap.is-visible .livemap-container {
        margin-top: 0 !important;
    }
}

/* Täglich: Glücksrad vertikal zentriert mit Abstand oben */
section#section-taeglich.is-visible {
    min-height: var(--page-stage-min) !important;
    padding-block: clamp(1.5rem, 5vh, 3rem) var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
}

section#section-taeglich.is-visible > #viewTaeglich,
section#section-taeglich.is-visible > #viewTaeglich.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    width: 100% !important;
    min-height: calc(var(--page-stage-min) - clamp(1.5rem, 5vh, 3rem) - var(--page-pad-y)) !important;
    height: auto !important;
    margin-block: auto !important;
    padding-top: clamp(1rem, 3vh, 2rem) !important;
    padding-bottom: 0 !important;
    gap: var(--page-gap) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    transform: none !important;
}

section#section-taeglich.is-visible .wheel-container {
    margin: 0 auto !important;
    flex-shrink: 0 !important;
}

body.taeglich-page-active .site-footer,
body.taeglich-page-active #siteFooter,
html.taeglich-page-active .site-footer,
html.taeglich-page-active #siteFooter {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    section#section-taeglich.is-visible {
        padding-block: clamp(1rem, 4vh, 2.25rem) var(--page-pad-y) !important;
    }

    section#section-taeglich.is-visible > #viewTaeglich,
    section#section-taeglich.is-visible > #viewTaeglich.is-active {
        padding-top: clamp(0.75rem, 2.5vh, 1.5rem) !important;
        min-height: calc(var(--page-stage-min) - clamp(1rem, 4vh, 2.25rem) - var(--page-pad-y)) !important;
    }

    section#section-taeglich.is-visible .wheel-container {
        gap: clamp(1.5rem, 4vh, 2.5rem) !important;
    }
}

/* Profil: Hero zentriert, Footer erst nach Scrollen */
section#section-profil.is-visible {
    display: block !important;
    min-height: var(--page-stage-min) !important;
    padding-block: clamp(1.5rem, 5vh, 3rem) var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
    align-items: unset !important;
    justify-content: unset !important;
}

section#section-profil.is-visible > #viewProfil,
section#section-profil.is-visible > #viewProfil.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    width: 100% !important;
    max-width: min(1100px, 100%) !important;
    min-width: 0 !important;
    min-height: calc(var(--page-stage-min) - clamp(1.5rem, 5vh, 3rem) - var(--page-pad-y)) !important;
    height: auto !important;
    margin: 0 auto !important;
    margin-block: auto !important;
    padding: clamp(0.75rem, 2vw, 1.5rem) !important;
    padding-top: clamp(1rem, 3vh, 2rem) !important;
    padding-bottom: 0 !important;
    gap: var(--page-gap) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

section#section-profil.is-visible .profil-wrapper,
section#section-profil.is-visible .profil-loading {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
}

body.profil-page-active .site-footer,
body.profil-page-active #siteFooter,
html.profil-page-active .site-footer,
html.profil-page-active #siteFooter {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    section#section-profil.is-visible {
        padding-block: clamp(1rem, 4vh, 2.25rem) var(--page-pad-y) !important;
    }

    section#section-profil.is-visible > #viewProfil,
    section#section-profil.is-visible > #viewProfil.is-active {
        padding-top: clamp(0.75rem, 2.5vh, 1.5rem) !important;
        min-height: calc(var(--page-stage-min) - clamp(1rem, 4vh, 2.25rem) - var(--page-pad-y)) !important;
    }
}

/* Kontakt: Abstand oben wie Livemap/Täglich, Footer erst nach Scrollen */
section#section-kontakt.is-visible {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    min-height: var(--page-stage-min) !important;
    padding-block: clamp(1.5rem, 5vh, 3rem) var(--page-pad-y) !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

section#section-kontakt.is-visible > #viewKontakt,
section#section-kontakt.is-visible > #viewKontakt.is-active {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: safe center !important;
    width: 100% !important;
    flex: 0 1 auto !important;
    min-height: calc(var(--page-stage-min) - clamp(1.5rem, 5vh, 3rem) - var(--page-pad-y)) !important;
    height: auto !important;
    padding-top: clamp(0.75rem, 2.5vh, 1.5rem) !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    gap: var(--page-gap) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

section#section-kontakt.is-visible .contact-hero {
    flex-shrink: 0 !important;
    padding-top: clamp(0.25rem, 1vh, 0.75rem) !important;
}

body.kontakt-page-active .site-footer,
body.kontakt-page-active #siteFooter,
html.kontakt-page-active .site-footer,
html.kontakt-page-active #siteFooter {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    section#section-kontakt.is-visible {
        padding-block: clamp(1rem, 4vh, 2.25rem) var(--page-pad-y) !important;
    }

    section#section-kontakt.is-visible > #viewKontakt,
    section#section-kontakt.is-visible > #viewKontakt.is-active {
        padding-top: clamp(0.5rem, 2vh, 1rem) !important;
        min-height: calc(var(--page-stage-min) - clamp(1rem, 4vh, 2.25rem) - var(--page-pad-y)) !important;
    }
}

/* Inaktive Sections/Views: kein Durchbluten auf andere Unterseiten */
.section:not(.is-visible) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.section:not(.is-visible) .page-view,
.section:not(.is-visible) .page-view.is-active,
.section:not(.is-visible) .contact-hero {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}