/* ===========================
   GLOBAL
=========================== */

body {
    background:#f4f6f8;
    font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    margin:0;
    padding:0;
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

.site-main--chat {
    display: flex;
    flex-direction: column;
}

.site-main--chat .container {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ===========================
   HEADER
=========================== */

.header-wrapper {
    background:#ffffff;
    border-bottom:1px solid #e5e5e5;
    padding:1rem 0;
    position:sticky;
    top:0;
    z-index:1000;
}

.header-logo {
    height: 100px !important;
    width: auto !important;
    max-width: none !important;
}

.header-nav a {
    color:#333;
    text-decoration:none;
    font-weight:500;
    padding:0.5rem 0;
}

.header-nav a:hover,
.header-nav a.is-active {
    color:#0d6efd;
}

.header-nav a.is-active {
    font-weight:700;
}

/* Mobile Navigation */
@media (max-width: 768px) {
    .header-nav {
        flex-direction:column;
        gap:0.75rem;
        text-align:right;
    }
}

/* ===========================
   HERO
=========================== */

.hero-box {
    background:#ffffff;
    padding:3rem;
    border-radius:12px;
    box-shadow:0 2px 6px rgba(0,0,0,0.08);
    margin-bottom:2rem;
}

.hero-logo {
    max-width:320px;   /* Großes Logo nur im Hero */
    height:auto;
    margin-bottom:25px;
}

/* ===========================
   CARDS
=========================== */

.card {
    border-radius:12px;
    border:none;
    box-shadow:0 2px 6px rgba(0,0,0,0.08);
}

/* ===========================
   BUTTONS
=========================== */

.btn {
    border-radius:6px;
}

/* ===========================
   INPUTS
=========================== */

input.form-control {
    border-radius:6px;
}

/* ===========================
   FOOTER
=========================== */

footer,
.site-footer {
    background:#1c1f24;
    color:#fff;
    padding:0.75rem 0;
    text-align:center;
    flex-shrink:0;
    margin-top:auto;
}

footer img {
    height:48px;
    width:auto;
    margin-bottom:12px;
}