/* DOMINO Header oberhalb der Navbar */
.site-header{
    background:
        radial-gradient(circle at 18% 18%, rgba(151,217,80,.12), transparent 28%),
        radial-gradient(circle at 82% 20%, rgba(58,145,189,.10), transparent 30%),
        #fff;
    box-shadow:0 2px 14px rgba(31,38,48,.08);
    position:relative;
    z-index:1000;
}

.header-inner{
    max-width:1500px;
    margin:0 auto;
    min-height:128px;
    padding:16px 48px 14px;
    display:grid;
    grid-template-columns:minmax(260px, 360px) 1fr minmax(245px, 340px);
    align-items:center;
    gap:34px;
}

.brand{
    display:inline-flex;
    align-items:center;
    width:max-content;
}

.brand img{
    width: 270px;
    max-width:100%;
    height:auto;
    display:block;
}

.header-contact{
    justify-self:center;
    display:grid;
    gap:9px;
    font-size:17px;
    line-height:1.2;
    color:#1f2630;
}

.header-contact a{
    display:flex;
    align-items:center;
    gap:12px;
    color:#1f2630;
    text-decoration:none;
    font-weight:700;
}

.header-contact i{
    width:24px;
    color:#3a82ad;
    font-size:18px;
    text-align:center;
}

.header-actions{
    justify-self:end;
    display:grid;
    justify-items:end;
    gap:13px;
}

.account-actions{
    display:flex;
    align-items:center;
}

.socials{
    display:flex;
    gap:12px;
}

.socials a{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff;
    color:#3a82ad;
    text-decoration:none;
    border:2px solid rgba(58,145,189,.22);
    box-shadow:0 3px 10px rgba(31,38,48,.08);
    font-size:19px;
}

.socials a:nth-child(2){
    color:#a73f28;
    border-color:rgba(159,36,32,.22);
}

.socials a:nth-child(3){
    color:#e0b220;
    border-color:rgba(217,167,24,.28);
}

.socials a:hover,
.socials a:focus{
    transform:translateY(-2px);
    background:#fffaf0;
}

.header-actions .btn {
    padding: 10px 16px;
}

/* Dropdown-Hauptpunkte wie die übrigen Navigationslinks darstellen */
.navbar-custom button.nav-link {
    margin: 0;
    padding-right: 20px !important;
    padding-left: 20px !important;
    border: 0;
    background: transparent;
    color: #fff !important;
    font-family: "Lato", sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    box-shadow: none;
}

.navbar-custom button.nav-link:hover,
.navbar-custom button.nav-link:focus,
.navbar-custom button.nav-link.show {
    color: #fff !important;
    background: transparent;
}

@media (min-width: 1200px) {
    .navbar-custom .mobile-nav-container {
        width: 100%;
        max-width: 1500px;
        padding-right: 48px;
        padding-left: 28px;
    }
}


@media(max-width:1100px){
    .header-inner{
        grid-template-columns:minmax(220px, 300px) 1fr;
        gap:18px 28px;
        min-height:auto;
    }

    .brand img{width:260px}
    .header-contact{justify-self:end}
    .header-actions{
        grid-column:1 / -1;
        justify-self:stretch;
        display:flex;
        align-items:center;
        justify-content:space-between;
    }
}

@media(max-width:760px){
    .header-inner{
        padding:16px 18px;
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:14px;
    }

    .brand img{width:250px}
    .header-contact{justify-self:start;font-size:15px}
    .header-actions{
        width:100%;
        align-items:flex-start;
        flex-direction:column;
        gap:12px;
    }

    .account-actions{
        width:100%;
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .account-actions .btn{
        width:100%;
        text-align:center;
    }
}

/* Mobile Navigation */
@media (max-width: 1199.98px) {
    .navbar-custom {
        min-height: 64px !important;
        padding: 0 !important;
    }

    .navbar-custom .mobile-nav-container {
        width: 100%;
        max-width: none;
        padding: 0 18px;
    }

    .navbar-custom .navbar-toggler {
        position: relative;
        display: flex;
        width: 48px;
        height: 48px;
        margin: 8px 0;
        padding: 0;
        align-items: center;
        justify-content: center;
        border: 2px solid rgba(255,255,255,.9);
        border-radius: 8px;
        box-shadow: none;
    }

    .navbar-custom .navbar-toggler:focus {
        box-shadow: 0 0 0 3px rgba(255,255,255,.24);
    }

    .navbar-custom .navbar-toggler-icon,
    .navbar-custom .navbar-toggler-icon::before,
    .navbar-custom .navbar-toggler-icon::after {
        display: block;
        width: 25px;
        height: 3px;
        border-radius: 3px;
        background: #fff;
        background-image: none;
    }

    .navbar-custom .navbar-toggler-icon { position: relative; }

    .navbar-custom .navbar-toggler-icon::before,
    .navbar-custom .navbar-toggler-icon::after {
        position: absolute;
        left: 0;
        content: "";
    }

    .navbar-custom .navbar-toggler-icon::before { top: -8px; }
    .navbar-custom .navbar-toggler-icon::after { top: 8px; }

    .navbar-custom .navbar-collapse {
        width: calc(100% + 36px);
        margin: 0 -18px !important;
        padding: 0;
        background: #3a82ad;
    }

    .navbar-custom .navbar-nav {
        width: 100%;
        height: auto;
        max-height: none;
        margin: 0;
        padding: 8px 0 14px;
        overflow: visible;
    }

    .navbar-custom .nav-item {
        width: 100%;
        border-bottom: 1px solid rgba(255,255,255,.18);
    }

    .navbar-custom .nav-item:last-child { border-bottom: 0; }

    .navbar-custom .nav-link,
    .navbar-custom button.nav-link {
        display: flex;
        width: 100%;
        min-height: 50px;
        margin: 0;
        padding: 13px 22px !important;
        align-items: center;
        justify-content: space-between;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #fff !important;
        font: 800 16px/1.35 "Lato", sans-serif;
        text-align: left;
        box-shadow: none;
    }

    .navbar-custom .dropdown-toggle::after {
        margin-left: auto;
        border-top: .42em solid #fff;
        border-right: .36em solid transparent;
        border-left: .36em solid transparent;
        transition: transform .2s ease;
    }

    .navbar-custom .dropdown-toggle.show::after { transform: rotate(180deg); }

    .navbar-custom .dropdown-menu {
        position: static !important;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        padding: 4px 0 8px;
        transform: none !important;
        border: 0;
        border-radius: 0;
        background: #306f96;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
    }

    .navbar-custom .dropdown-menu .dropdown-item {
        display: block !important;
        width: 100%;
        min-height: 44px;
        padding: 11px 34px;
        border-radius: 0;
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.4 !important;
        text-align: left;
        white-space: normal;
    }

    .navbar-custom .dropdown-menu .dropdown-item:hover,
    .navbar-custom .dropdown-menu .dropdown-item:focus {
        background: rgba(255,255,255,.14);
        color: #fff;
    }
}