:root{
    --brand-blue:#0000FF;

    /* Header Optik */
    --header-grad-start:#ede9fe;
    --header-grad-mid:#c7d2fe;
    --header-grad-end:#a5b4fc;
    --header-border:rgba(255,255,255,0.35);
    --header-shadow:0 14px 40px rgba(79,70,229,0.25);

    /* Buttons (Header) */
    --btn-bg:rgba(79,70,229,0.12);
    --btn-border:rgba(79,70,229,0.35);
    --btn-hover-bg:rgba(79,70,229,0.20);
    --btn-hover-border:rgba(79,70,229,0.55);
    --btn-text:#3730a3;
}

html, body { 
    height:100%; 
    overflow-x:hidden; 
}

body{
    font-family:'Plus Jakarta Sans', sans-serif;
    background-color:var(--brand-blue);
}

/* Seitenhintergrund */
.hero-gradient{
    background:linear-gradient(180deg,#ffffff 0%, #0000FF 100%);
    min-height:100vh;
}

/* ===== RESPONSIVE HEADER/FOOTER LÖSUNG ===== */

/* Header bleibt oben fixiert (alle Geräte) */
.nav-container {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 0.75rem;
    display: flex;
    justify-content: center;
    pointer-events: none;
    z-index: 50;
}

.nav-blur{
    pointer-events:auto;
    background:linear-gradient(135deg,var(--header-grad-start),var(--header-grad-mid),var(--header-grad-end));
    border:1px solid var(--header-border);
    border-radius:26px;
    width:100%;
    max-width:1100px;
    box-shadow:var(--header-shadow);
    overflow:hidden;
}

.site-scroll {
    height: auto;
    overflow-y: visible;
    overflow-x: hidden;
    padding-top: 140px;
    padding-bottom: 70px;
}

body {
    overflow-y: auto;
    overflow-x: hidden;
}

/* LAPTOP (ab 1024px): Header und Footer fixiert */
@media (min-width: 1024px) {
    body {
        overflow: hidden;
    }

    .nav-container {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        pointer-events: none;
    }

    .nav-container[style*="bottom"] {
        top: auto;
        bottom: 0;
    }

    .site-scroll {
        height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
        padding-top: 128px;
        padding-bottom: 220px;
    }
}

/* Tablet-Anpassung */
@media (min-width: 768px) and (max-width: 1023px) {
    .site-scroll {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

/* ===== BUTTONS ===== */
.btn-header{
    background:var(--btn-bg);
    color:var(--btn-text);
    border:1px solid var(--btn-border);
    padding:0.65rem 1.2rem;
    border-radius:14px;
    font-weight:800;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:0.12em;
    transition:all .25s ease;
    display:flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
}

.btn-header:hover{
    background:var(--btn-hover-bg);
    border-color:var(--btn-hover-border);
    transform:translateY(-1px);
}

/* ===== MOBILE SPEZIFISCH ===== */
@media (max-width:767px){
    .btn-wrap{
        width:100%;
        display:flex;
        flex-direction:row;
        flex-wrap:nowrap;
        gap:6px;
        justify-content:center;
    }

    .btn-header{
        width:auto;
        flex:0 0 auto;
        font-size:9px;
        padding:0.45rem 0.6rem;
        border-radius:10px;
        letter-spacing:0.08em;
    }

    .brand-text span{
        white-space:normal;
    }

    /* Footer kompakt wie Header */
    .nav-container[style*="bottom"] footer {
        flex-direction:row;
        align-items:center;
        justify-content:space-between;
        gap:8px;
        padding:0.5rem 0.75rem;
    }

    .nav-container[style*="bottom"] footer .flex-wrap {
        gap:6px;
        flex-wrap:nowrap;
    }

    .nav-container[style*="bottom"] footer .flex-wrap a {
        font-size:9px;
        padding:5px 8px;
        letter-spacing:0.06em;
    }

    .nav-container[style*="bottom"] footer > div:first-child {
        font-size:8px;
        letter-spacing:0.06em;
    }
}

/* ===== TEXT-FORMATIERUNG FÜR AGB/DATENSCHUTZ/IMPRESSUM ===== */
/* Verhindert dass Text aus dem Container läuft */
.prose {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
}

.prose p,
.prose h2,
.prose h3,
.prose li,
.prose a {
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}

.prose a {
    display: inline;
    word-break: break-all; /* Für lange URLs */
}

/* Mobile Optimierung für Texte */
@media (max-width: 640px) {
    .prose {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .prose h2 {
        font-size: 1.1rem;
    }

    .prose h1 {
        font-size: 1.75rem;
        line-height: 1.2;
    }

    .glass-card {
        padding: 1.5rem !important;
    }
}

/* Scrollbar Styling */
.site-scroll::-webkit-scrollbar { 
    width: 10px; 
}

.site-scroll::-webkit-scrollbar-thumb { 
    background: rgba(0,0,0,0.15); 
    border-radius: 999px; 
}

.site-scroll::-webkit-scrollbar-track { 
    background: rgba(255,255,255,0.08); 
}
