@charset "utf-8";

/* =====================================================
   HEADER.CSS – PREMIUM HERO V5.1
===================================================== */

.mk-header{
    position:relative;
    width:100%;
    background:#000;
    overflow:hidden;
}

.mk-hero{
    position:relative;
    width:100%;
    height:940px;
    overflow:hidden;
    background:#000;
}

.mk-hero-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1.035);
    filter:brightness(.76) contrast(1.08) saturate(.96);
}

.mk-hero-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    background:
        linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.48) 42%,rgba(0,0,0,.12) 100%),
        linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.04) 42%,rgba(0,0,0,.46) 100%);
}

.mk-header-top{
    position:absolute;
    top:54px;
    left:50%;
    transform:translateX(-50%);
    width:92%;
    max-width:1500px;
    z-index:20;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.mk-logo img{
    width:205px;
    height:auto;
}

.mk-nav{
    display:flex;
    align-items:center;
    gap:42px;
}

.mk-nav a{
    position:relative;
    color:#fff;
    font-size:12px;
    font-weight:600;
    letter-spacing:2.6px;
    text-transform:uppercase;
    opacity:.88;
    transition:.35s ease;
}

.mk-nav a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-11px;
    width:0;
    height:1px;
    background:var(--mk-gold);
    transition:.35s ease;
}

.mk-nav a:hover{
    color:var(--mk-gold-light);
    opacity:1;
}

.mk-nav a:hover::after{
    width:100%;
}

.mk-menu-btn{
    display:none;
}

.mk-hero-content{
    position:absolute;
    left:8%;
    bottom:135px;
    z-index:25;
    max-width:980px;
}

.mk-hero-kicker{
    margin:0 0 30px;
    color:var(--mk-gold-light);
    font-size:13px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
}

.mk-hero-content h1{
    margin:0;
    font-family:var(--mk-sans);
    color:#fff;
    font-size:58px;
    line-height:1.15;
    font-weight:300;
    letter-spacing:3.8px;
    text-transform:uppercase;
    text-shadow:0 12px 38px rgba(0,0,0,.82);
}

.mk-hero-content .mk-gold-line{
    width:155px;
    height:3px;
    margin:46px 0 34px;
    background:var(--mk-gold);
}

.mk-hero-subline{
    margin:0;
    color:var(--mk-gold-light);
    font-size:17px;
    line-height:1.6;
    font-weight:500;
    letter-spacing:3.2px;
    text-transform:uppercase;
}

.mk-scroll-hint{
    position:absolute;
    right:8%;
    bottom:58px;
    z-index:25;
    color:rgba(255,255,255,.72);
    font-size:11px;
    letter-spacing:2.6px;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:16px;
}

.mk-scroll-hint span{
    display:block;
    width:70px;
    height:1px;
    background:var(--mk-gold);
}

.mk-header::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    z-index:30;
    width:100%;
    height:4px;
    background:linear-gradient(90deg,transparent,var(--mk-gold),transparent);
}
/* HERO TEXT FIX */
.mk-hero-content{
    display:block !important;
    opacity:1 !important;
    visibility:visible !important;
    position:absolute !important;
    left:8% !important;
    top:48% !important;
    bottom:auto !important;
    transform:translateY(-10%) !important;
    z-index:999 !important;
    max-width:980px !important;
}

.mk-hero-kicker,
.mk-hero-subline,
.mk-hero-content h1,
.mk-hero-content .mk-gold-line,
.mk-scroll-hint{
    display:block !important;
    opacity:1 !important;
    visibility:visible !important;
}

.mk-hero-content h1{
    color:#fff !important;
    font-size:54px !important;
    line-height:1.16 !important;
    font-weight:300 !important;
    letter-spacing:3.8px !important;
    text-transform:uppercase !important;
}

.mk-hero-kicker{
    color:#d8ba79 !important;
    margin-bottom:28px !important;
}

.mk-hero-subline{
    color:#d8ba79 !important;
}
/* TEST HERO CONTENT SICHTBAR MACHEN */
.mk-hero-content{
    position:absolute !important;
    left:80px !important;
    top:420px !important;
    z-index:99999 !important;
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    background:red !important;
    padding:30px !important;
}

.mk-hero-content *{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    color:#fff !important;
    font-size:40px !important;
}