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

header{

    width:100%;
    height:100px;

    display:flex;
    align-items:center;

    padding:0 40px;

    background:#ffffff;

    position:sticky;
    top:0;
    z-index:1000;

    box-shadow:0 2px 18px rgba(0,0,0,.05);

}

/* --------------------------
   Linke Seite
--------------------------- */

.header-left{

    flex:0 0 260px;

    display:flex;
    align-items:center;

}

.logo img{

    height:100px;
    width:auto;

}

/* --------------------------
   Mitte
--------------------------- */

.header-center{

    flex:1;

    display:flex;
    justify-content:center;
    padding-right:25px;
    box-sizing:border-box;
}
/* --------------------------
   Navigation
--------------------------- */

.header-center nav{

    width:100%;

    display:flex;

    justify-content:center;

}

.header-center nav > ul{

    display:flex;

    align-items:center;

    gap:32px;

    list-style:none;

    margin:0;

    padding:0;

}

.header-center nav > ul > li{

    list-style:none;

}

.header-center nav a{

    text-decoration:none;

    white-space: nowrap;
    color:#4a4a4a;

    font-size:13px;

    font-weight:500;

    transition:.3s;

}

.header-center nav > ul > li > a:hover{
    font-weight:700;
    color:#4a4a4a;
}

.header-center nav a.active{

    color:#4a4a4a;

    font-weight:700;

    position:relative;

}
/* Wundmanagement */

.dropdown-menu a.wund-link.active{

    color:#911E64 !important;

    font-weight:700;

}

/* Palliativpflege */

.dropdown-menu a.palliativ-link.active{

    color:#EB557D !important;

    font-weight:700;

}

.header-center nav > ul > li > a.active::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-12px;

    width:100%;
    height:3px;

    background:#4a4a4a;

    border-radius:10px;

}
/* --------------------------
   Rechte Seite
--------------------------- */

.header-right{
    display:flex;
    align-items:center;
    gap:20px;
    flex-shrink:0;
    white-space:nowrap;
    position:relative;
}
.button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    height:44px;
    padding:12px 22px;

    background:#eb557d;
    color:#fff;

    text-decoration:none;
    border-radius:30px;

    font-size:14px;
    font-weight:600;

    white-space:nowrap;
    flex-shrink:0;

    margin-right:0;

    position:relative;
        width: 190px;
    box-sizing: border-box;
    text-align: center;
}
.button:hover{

    background:#eb557d;

    transform:translateY(-2px);

}

.button span{

    font-size:15px;

}

.language-switch{
    display:flex;
    align-items:center;

    height:44px;

    flex-shrink:0;
    white-space:nowrap;

    position:static !important;
    margin:0 !important;
}
.language-switch a{

    color:#4a4a4a;
    text-decoration:none;
    padding:0 4px;

}

.language-switch a:hover{
    color:#4a4a4a !important;
    font-weight:700;
}

.language-switch a.active{
    color:#4a4a4a !important;
    font-weight:700 !important;
}
/* Dropdown Menü */

.dropdown{
    position:relative;
}

.dropdown-menu{
    display:none;
    position:absolute;
    top:100%;
    left:50%;
    transform:translateX(-50%);
    min-width:220px;
    background:#fff;
    list-style:none;
    margin:0;
    padding:8px 0;
    border-radius:12px;
    box-shadow:0 8px 24px rgba(0,0,0,.15);

    flex-direction:column;
    gap:0;

    z-index:1000;
}

.dropdown:hover .dropdown-menu{
    display:flex;
}

.dropdown-menu li{
    width:100%;
    margin:0;
}

.dropdown-menu a{
    display:block;
    width:100%;
    padding:12px 20px;
    text-decoration:none;
    white-space:nowrap;
}
/* Leistungen & Preise */

.dropdown-menu a.wund-link{
    color:#911E64 !important;
    font-weight:500;
}

.dropdown-menu a.wund-link:hover{
    color:#911E64 !important;
    font-weight:700;
}

.dropdown-menu a.palliativ-link{
    color:#EB557D !important;
    font-weight:500;
}

.dropdown-menu a.palliativ-link:hover{
    color:#EB557D !important;
    font-weight:700;
}
/* Nur für Einblicke und Aktuelles */

.neutral-link,
.neutral-link.active{
    color:#444;
    font-weight:500;
}

.neutral-link:hover,
.neutral-link.active:hover{
    color:#444;
    font-weight:700;
}
/* ==========================
   Breadcrumbs
========================== */

.breadcrumbs{

    max-width:1200px;

    margin:20px auto 10px;

    padding:0 20px;

    font-size:.95rem;

    color:#777;

}

.breadcrumbs a{

    color:#911e64;

    text-decoration:none;

    transition:.2s;

}

.breadcrumbs a:hover{

    text-decoration:underline;

}

.breadcrumbs .separator{

    margin:0 8px;

    color:#bbb;

}

.breadcrumbs .current{

    color:#555;

    font-weight:600;

}
/* =========================================================
   WISSEN – UNTER-UNTERMENÜ
   ========================================================= */

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu-menu {
    display: none;

    position: absolute;
    top: 0;
    left: 100%;

    min-width: 240px;

    margin: 0;
    padding: 8px 0;

    background: #ffffff;

    border-radius: 0 10px 10px 10px;

    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);

    list-style: none;

    z-index: 1000;
}

.dropdown-submenu:hover > .dropdown-submenu-menu {
    display: block;
}

.dropdown-submenu-menu li {
    margin: 0;
    padding: 0;
}

.dropdown-submenu-menu a {
    display: block;

    padding: 10px 18px;

    white-space: nowrap;

    text-decoration: none;
}

.dropdown-submenu-menu a:hover,
.dropdown-submenu-menu a.active {
    background: #fdf0f5;
}