@charset "utf-8";

/* =========================================================
   MOST WANTED – INDEX 2026
   Nur für body.mw-page-index
   Wird NACH css-newhome.css geladen.
   Keine andere Seite wird beeinflusst.
========================================================= */

body.mw-page-index{
    --mwi-blue:#00aeef;
    --mwi-ink:#172129;
    --mwi-dark:#172229;
    --mwi-dark-2:#223039;
    --mwi-dark-3:#33434c;
    --mwi-mid:#87959d;
    --mwi-mid-2:#9eabb1;
    --mwi-stone:#c7d0d4;
    --mwi-soft:#d4dade;
    --mwi-soft-2:#dce1e3;
    --mwi-white:#f3f6f7;
    --mwi-muted:#5a6971;
    --mwi-light-muted:#bdc8cd;
    --mwi-line:rgba(23,33,41,.13);
    --mwi-shadow:0 24px 58px rgba(24,40,49,.14);

    background:var(--mwi-dark);
    color:var(--mwi-ink);
}

/* =========================================================
   BASIS / SICHERHEIT
========================================================= */

body.mw-page-index main{
    display:block;
    width:100%;
    overflow:hidden;
    background:var(--mwi-dark);
}

body.mw-page-index .mw-home-section-inner,
body.mw-page-index .mw-home-info-inner,
body.mw-page-index .mw-home-intro .events-inner{
    width:min(1240px,calc(100% - 48px));
    margin-inline:auto;
    position:relative;
    z-index:4;
}

body.mw-page-index .mw-home-kicker,
body.mw-page-index .mw-home-info-kicker,
body.mw-page-index .mw-home-info-label,
body.mw-page-index .mw-home-card-label,
body.mw-page-index .mw-home-price-category{
    color:var(--mwi-blue)!important;
    font-weight:800!important;
    letter-spacing:.14em;
    text-transform:uppercase;
}

body.mw-page-index a:focus-visible{
    outline:2px solid var(--mwi-blue);
    outline-offset:4px;
}

/* =========================================================
   VIDEO HERO
   Bewusst heller als vorher.
   Das Video kann später 1:1 ersetzt werden.
========================================================= */

body.mw-page-index .mw-video-hero{
    position:relative;
    min-height:clamp(650px,78vh,880px);
    overflow:hidden;
    isolation:isolate;
    background:#15222a;
}

body.mw-page-index .mw-video-hero-media{
    position:absolute;
    inset:0;
    z-index:-5;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    opacity:.78;
    filter:
        brightness(.82)
        contrast(1.04)
        saturate(.78);
}

body.mw-page-index .mw-video-hero-overlay{
    position:absolute;
    inset:0;
    z-index:-4;
    background:
        linear-gradient(
            90deg,
            rgba(9,16,20,.66) 0%,
            rgba(18,30,37,.46) 42%,
            rgba(20,31,38,.36) 68%,
            rgba(9,15,19,.54) 100%
        ),
        linear-gradient(
            180deg,
            rgba(10,16,20,.10) 0%,
            rgba(18,29,35,.12) 52%,
            rgba(23,34,41,.88) 100%
        );
}

body.mw-page-index .mw-video-hero-vignette{
    position:absolute;
    inset:0;
    z-index:-3;
    pointer-events:none;
    box-shadow:
        inset 0 0 120px rgba(0,0,0,.28),
        inset 0 -120px 150px rgba(23,34,41,.38);
}

body.mw-page-index .mw-video-hero::after{
    content:"";
    position:absolute;
    left:-7%;
    right:-7%;
    bottom:-1px;
    height:clamp(150px,14vw,245px);
    z-index:-2;
    pointer-events:none;
    background:
        linear-gradient(
            180deg,
            rgba(23,34,41,0) 0%,
            rgba(23,34,41,.18) 20%,
            rgba(23,34,41,.48) 48%,
            rgba(23,34,41,.78) 73%,
            #273943 100%
        );
    border-radius:46% 54% 0 0 / 15% 18% 0 0;
    transform:scaleX(1.08);
}

body.mw-page-index .mw-video-hero-inner{
    position:relative;
    z-index:2;
    width:min(1320px,calc(100% - 56px));
    margin-inline:auto;
}

body.mw-page-index .mw-video-hero-logo img{
    filter:
        drop-shadow(0 16px 35px rgba(0,0,0,.30))
        drop-shadow(0 0 22px rgba(0,174,239,.08));
}

body.mw-page-index .mw-video-hero-kicker{
    color:var(--mwi-blue)!important;
}

body.mw-page-index .mw-video-hero-content h1{
    color:#fff!important;
    text-shadow:0 8px 30px rgba(0,0,0,.22);
}

body.mw-page-index .mw-video-hero-content p{
    color:rgba(245,248,249,.88)!important;
}

body.mw-page-index .mw-video-hero-services{
    color:rgba(244,247,248,.72)!important;
}

body.mw-page-index .mw-video-hero-button{
    border-radius:12px!important;
    background:var(--mwi-blue)!important;
    border-color:var(--mwi-blue)!important;
    color:#fff!important;
    box-shadow:0 12px 30px rgba(0,174,239,.20);
}

body.mw-page-index .mw-video-hero-button-secondary{
    background:rgba(17,27,33,.38)!important;
    border-color:rgba(242,246,247,.46)!important;
    color:#fff!important;
    backdrop-filter:blur(8px);
}

body.mw-page-index .mw-video-hero-button:hover,
body.mw-page-index .mw-video-hero-button:focus-visible{
    transform:translateY(-2px);
    background:#eef2f3!important;
    border-color:#eef2f3!important;
    color:#172129!important;
}

body.mw-page-index .mw-video-hero-scroll{
    z-index:5;
}

/* =========================================================
   01 – INTRO
   Dunkler Hero -> Slate -> hell
========================================================= */

body.mw-page-index .mw-home-intro{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:140px 0 170px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #273943 0%,
            #31444e 14%,
            #3b4f58 30%,
            #465b64 46%,
            #566a73 60%,
            #6e7f87 72%,
            #91a0a6 82%,
            #bac4c8 91%,
            #dce1e3 100%
        )!important;
}

body.mw-page-index .mw-home-intro::before{
    content:"";
    position:absolute;
    width:min(820px,64vw);
    height:min(820px,64vw);
    right:-18vw;
    top:10%;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.045),transparent 70%);
    filter:blur(28px);
    pointer-events:none;
}

body.mw-page-index .mw-home-intro-content{
    max-width:1080px;
}

body.mw-page-index .mw-home-intro h2{
    max-width:1000px;
    color:#f0f4f5!important;
    font-size:clamp(3rem,5.7vw,5.4rem)!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
    text-wrap:balance;
}

body.mw-page-index .mw-home-intro-lead{
    max-width:930px;
    color:#e5ecef!important;
    font-size:clamp(1.15rem,1.5vw,1.38rem)!important;
    line-height:1.72!important;
}

body.mw-page-index .mw-home-intro-text{
    max-width:980px;
}

body.mw-page-index .mw-home-intro-text p{
    color:#d5dfe3!important;
    font-size:1.02rem!important;
    line-height:1.82!important;
}

body.mw-page-index .mw-home-intro strong{
    color:#fff!important;
}

body.mw-page-index .mw-home-intro-actions .event-button{
    border-radius:12px!important;
}

body.mw-page-index .mw-home-intro-actions .event-button-secondary{
    border-color:rgba(255,255,255,.55)!important;
    color:#fff!important;
}

/* =========================================================
   02 – STUDIOINFOS + PREISE
   Heller Premium-Bereich mit dunklen Karten
========================================================= */

body.mw-page-index .mw-home-info{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:150px 0 165px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #dce1e3 0%,
            #d9dfe1 20%,
            #d2d9dc 42%,
            #c6cfd3 64%,
            #b5c0c5 82%,
            #a3b0b6 100%
        )!important;
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-info::after{
    content:"";
    position:absolute;
    left:-10%;
    right:-10%;
    bottom:-1px;
    height:clamp(300px,28vw,500px);
    z-index:1;
    pointer-events:none;
    background:linear-gradient(
        180deg,
        rgba(51,67,76,0) 0%,
        rgba(51,67,76,.04) 14%,
        rgba(51,67,76,.10) 28%,
        rgba(51,67,76,.20) 42%,
        rgba(51,67,76,.34) 56%,
        rgba(51,67,76,.52) 69%,
        rgba(51,67,76,.72) 82%,
        rgba(51,67,76,.90) 93%,
        #33434c 100%
    );
    border-radius:50% 50% 0 0 / 13% 17% 0 0;
    transform:scaleX(1.10);
}

body.mw-page-index .mw-home-info-header h2,
body.mw-page-index .mw-home-prices-header h2{
    color:var(--mwi-ink)!important;
    font-size:clamp(2.8rem,4.8vw,4.7rem)!important;
    letter-spacing:-.035em;
}

body.mw-page-index .mw-home-info-header p,
body.mw-page-index .mw-home-prices-header p{
    color:#53656f!important;
}

body.mw-page-index .mw-home-info-grid{
    gap:22px!important;
}

body.mw-page-index .mw-home-info-card{
    background:
        linear-gradient(145deg,#172229 0%,#11191d 100%)!important;
    border:1px solid rgba(0,174,239,.16)!important;
    border-radius:16px!important;
    box-shadow:0 24px 48px rgba(24,39,48,.16)!important;
}

body.mw-page-index .mw-home-info-card:hover{
    transform:translateY(-6px);
    border-color:rgba(0,174,239,.58)!important;
    box-shadow:0 30px 58px rgba(24,39,48,.23)!important;
}

body.mw-page-index .mw-home-info-card h3,
body.mw-page-index .mw-home-info-card strong{
    color:#eef2f3!important;
}

body.mw-page-index .mw-home-info-card p,
body.mw-page-index .mw-home-hours-row span,
body.mw-page-index .mw-home-contact-row span,
body.mw-page-index .mw-home-check-item{
    color:#bdc8cd!important;
}

body.mw-page-index .mw-home-hours-row,
body.mw-page-index .mw-home-contact-row{
    border-color:rgba(255,255,255,.10)!important;
}

body.mw-page-index .mw-home-info-note{
    color:#9facb2!important;
}

body.mw-page-index .mw-home-card-link{
    border-radius:10px!important;
}

/* Preise als eigener visueller Block im hellen Feld */
body.mw-page-index .mw-home-prices{
    position:relative;
    z-index:4;
    margin-top:125px!important;
    padding:70px 58px 58px;
    border:1px solid rgba(24,40,49,.10);
    border-radius:28px;
    background:rgba(228,233,235,.54);
    box-shadow:
        0 30px 80px rgba(24,40,49,.10),
        inset 0 1px 0 rgba(255,255,255,.48);
    backdrop-filter:blur(10px);
}

body.mw-page-index .mw-home-price-card{
    background:#e7ebed!important;
    border:1px solid rgba(23,33,41,.12)!important;
    border-radius:15px!important;
    box-shadow:0 16px 34px rgba(28,45,55,.08)!important;
}

body.mw-page-index .mw-home-price-card-featured{
    background:
        linear-gradient(145deg,rgba(0,174,239,.10),rgba(231,235,237,.96) 60%)!important;
    border-color:rgba(0,174,239,.42)!important;
}

body.mw-page-index .mw-home-price-card h3,
body.mw-page-index .mw-home-price{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-price-card p{
    color:#5a6971!important;
}

body.mw-page-index .mw-home-price-badge{
    color:#fff!important;
}

body.mw-page-index .mw-home-price-list{
    background:#d3dbde!important;
    border-color:rgba(23,33,41,.13)!important;
    border-radius:15px!important;
    box-shadow:none!important;
}

body.mw-page-index .mw-home-price-list-heading{
    background:rgba(255,255,255,.22)!important;
    border-color:rgba(23,33,41,.12)!important;
}

body.mw-page-index .mw-home-price-list-heading h3,
body.mw-page-index .mw-home-price-list-row strong{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-price-list-heading p,
body.mw-page-index .mw-home-price-list-row span{
    color:#5a6971!important;
}

body.mw-page-index .mw-home-price-list-row{
    border-color:rgba(23,33,41,.10)!important;
}

body.mw-page-index .mw-home-price-list-row b{
    color:#007ead!important;
}

body.mw-page-index .mw-home-price-notice{
    background:#9fadb4!important;
    border:0!important;
    border-left:4px solid var(--mwi-blue)!important;
    border-radius:10px!important;
    box-shadow:none!important;
}

body.mw-page-index .mw-home-price-notice strong{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-price-notice p{
    color:#394b54!important;
}

/* CTA in Info */
body.mw-page-index .mw-home-info-cta{
    background:
        radial-gradient(circle at 84% 16%,rgba(0,174,239,.16),transparent 30%),
        linear-gradient(145deg,#172229,#223039)!important;
    border:1px solid rgba(0,174,239,.22)!important;
    border-radius:18px!important;
    box-shadow:0 28px 60px rgba(24,39,48,.22)!important;
}

body.mw-page-index .mw-home-info-cta h2{
    color:#fff!important;
}

body.mw-page-index .mw-home-info-cta p{
    color:#bdc8cd!important;
}

/* =========================================================
   03 – EXPERIENCE
   Tiefer dunkler Schwerpunkt
========================================================= */

body.mw-page-index .mw-home-experience{
    position:relative;
    isolation:isolate;
    padding:160px 0 150px!important;
    margin-top:-1px;
    background:
        radial-gradient(circle at 14% 20%,rgba(0,174,239,.09),transparent 24%),
        linear-gradient(180deg,#33434c 0%,#2b3a43 42%,#223039 100%)!important;
}

body.mw-page-index .mw-home-experience::before{
    content:none!important;
    display:none!important;
}

body.mw-page-index .mw-home-experience h2,
body.mw-page-index .mw-home-experience h3{
    color:#f0f4f5!important;
}

body.mw-page-index .mw-home-experience p{
    color:#bdc8cd!important;
}

body.mw-page-index .mw-home-stat{
    background:rgba(18,27,32,.72)!important;
    border-color:rgba(255,255,255,.10)!important;
    border-radius:15px!important;
}

body.mw-page-index .mw-home-stat-number{
    color:#fff!important;
    text-shadow:0 0 32px rgba(0,174,239,.10);
}

body.mw-page-index .mw-home-service-card{
    background:rgba(18,27,32,.76)!important;
    border-color:rgba(255,255,255,.10)!important;
    border-radius:17px!important;
}

body.mw-page-index .mw-home-service-number{
    color:rgba(0,174,239,.18)!important;
    font-size:clamp(5rem,9vw,9rem);
    font-weight:900;
    line-height:.8;
}

body.mw-page-index .mw-home-inline-highlight{
    color:#eaf0f2!important;
}

/* =========================================================
   04 – ERSTES TATTOO
   Dunkel -> hell, großzügiger Editorial-Bereich
========================================================= */

body.mw-page-index .mw-home-first-tattoo{
    position:relative;
    isolation:isolate;
    padding:160px 0 150px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #223039 0%,
            #40515b 14%,
            #687880 30%,
            #929fa5 47%,
            #b8c2c6 66%,
            #dce1e3 100%
        )!important;
}

body.mw-page-index .mw-home-first-heading h2{
    color:#f2f5f6!important;
    font-size:clamp(2.8rem,5vw,5rem)!important;
}

body.mw-page-index .mw-home-first-content{
    border-left-color:rgba(0,174,239,.82)!important;
}

body.mw-page-index .mw-home-first-content p{
    color:#edf2f4!important;
}

body.mw-page-index .mw-home-first-content p:nth-last-child(-n+2){
    color:#334750!important;
}

/* =========================================================
   05 – DETAILS / BESUCH
   Hell mit dunklen Premium-Karten
========================================================= */

body.mw-page-index .mw-home-details{
    position:relative;
    isolation:isolate;
    padding:150px 0 165px!important;
    margin-top:-1px;
    background:
        radial-gradient(circle at 8% 18%,rgba(0,174,239,.07),transparent 24%),
        linear-gradient(180deg,#dce1e3 0%,#d5dbde 48%,#c6d0d4 100%)!important;
}

body.mw-page-index .mw-home-details h2{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-details .mw-home-section-heading p,
body.mw-page-index .mw-home-training-heading p{
    color:#53656f!important;
}

body.mw-page-index .mw-home-highlight-link,
body.mw-page-index .mw-home-image-button{
    border-radius:14px!important;
    border-color:rgba(23,33,41,.13)!important;
    box-shadow:0 18px 38px rgba(24,40,49,.12)!important;
}

body.mw-page-index .mw-home-detail-card{
    background:#172229!important;
    border:1px solid rgba(0,174,239,.14)!important;
    border-radius:16px!important;
    box-shadow:0 20px 42px rgba(24,40,49,.14)!important;
}

body.mw-page-index .mw-home-detail-card h3{
    color:#f0f4f5!important;
}

body.mw-page-index .mw-home-detail-card p{
    color:#bdc8cd!important;
}

body.mw-page-index .mw-home-training{
    background:
        radial-gradient(circle at 0% 50%,rgba(0,174,239,.10),transparent 30%),
        #33434c!important;
    border:1px solid rgba(0,174,239,.15)!important;
    border-radius:18px!important;
}

body.mw-page-index .mw-home-training h2{
    color:#f0f4f5!important;
}

body.mw-page-index .mw-home-training p{
    color:#bdc8cd!important;
}

/* =========================================================
   06 – HANDWERK / STILE
   Heller Start -> dunkler Auslauf
========================================================= */

body.mw-page-index .mw-home-craft{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:155px 0 180px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #c6d0d4 0%,
            #bbc6ca 16%,
            #a8b5ba 30%,
            #8d9ba2 43%,
            #718089 56%,
            #586a73 69%,
            #43555e 81%,
            #33434c 100%
        )!important;
}

body.mw-page-index .mw-home-craft-content h2,
body.mw-page-index .mw-home-reasons-heading h2{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-craft-content p{
    color:#40535d!important;
}

body.mw-page-index .mw-home-craft-image::before{
    border-color:rgba(0,174,239,.56)!important;
}

body.mw-page-index .mw-home-craft-image img{
    border-radius:18px!important;
    box-shadow:0 28px 60px rgba(24,40,49,.18);
}

body.mw-page-index .mw-home-reason-card{
    background:rgba(221,227,229,.74)!important;
    border-color:rgba(23,33,41,.12)!important;
    border-radius:15px!important;
}

body.mw-page-index .mw-home-reason-card h3{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-reason-card p{
    color:#53656f!important;
}

body.mw-page-index .mw-home-styles .mw-home-section-heading h2{
    color:#eef2f3!important;
}

body.mw-page-index .mw-home-styles .mw-home-section-heading p{
    color:#bdc8cd!important;
}

body.mw-page-index .mw-home-style-card{
    background:#172229!important;
    border-color:rgba(255,255,255,.10)!important;
    border-radius:14px!important;
}

body.mw-page-index .mw-home-style-card h3{
    color:#eef2f3!important;
}

body.mw-page-index .mw-home-style-card p{
    color:#bdc8cd!important;
}

/* =========================================================
   07 – ARTISTS
   Dunkel -> heller Galeriecharakter
========================================================= */

body.mw-page-index .mw-home-artists{
    position:relative;
    isolation:isolate;
    padding:165px 0 175px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #33434c 0%,
            #44565f 12%,
            #5d6f78 26%,
            #7e8d94 42%,
            #a1adb2 60%,
            #c2cbcf 78%,
            #d4dade 100%
        )!important;
}

body.mw-page-index .mw-home-artists-intro h2{
    color:#f0f4f5!important;
    font-size:clamp(2.8rem,5vw,4.8rem)!important;
}

body.mw-page-index .mw-home-artists-intro p{
    color:#d5dfe3!important;
}

body.mw-page-index .mw-home-artists-intro .mw-home-artists-lead{
    color:#fff!important;
}

body.mw-page-index .mw-home-artist-card{
    background:#172229!important;
    border:1px solid rgba(0,174,239,.13)!important;
    border-radius:16px!important;
    box-shadow:0 22px 48px rgba(24,40,49,.18)!important;
}

body.mw-page-index .mw-home-artist-content h3{
    color:#f2f5f6!important;
}

body.mw-page-index .mw-home-artist-image{
    background:linear-gradient(180deg,#263841,#11191d)!important;
}

/* =========================================================
   08 – GUTSCHEINE
   Hell -> mittel
========================================================= */

body.mw-page-index .mw-home-vouchers{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:160px 0!important;
    margin-top:-1px;
    background:
        radial-gradient(circle at 88% 20%,rgba(0,174,239,.09),transparent 28%),
        linear-gradient(180deg,#d4dade 0%,#c4cdd1 45%,#9eabb1 100%)!important;
}

body.mw-page-index .mw-home-vouchers-content h2{
    color:var(--mwi-ink)!important;
}

body.mw-page-index .mw-home-vouchers-content p,
body.mw-page-index .mw-home-vouchers-content .mw-home-vouchers-lead{
    color:#4d606a!important;
}

body.mw-page-index .mw-home-voucher-image{
    background:rgba(233,237,239,.62)!important;
    border-color:rgba(23,33,41,.13)!important;
    border-radius:18px!important;
    box-shadow:0 30px 70px rgba(24,40,49,.15)!important;
}

/* =========================================================
   09 – PFLEGE
   Mittel -> dunkel -> Footer
========================================================= */

body.mw-page-index .mw-home-aftercare{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:165px 0 190px!important;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #9eabb1 0%,
            #87959d 14%,
            #708088 28%,
            #596a73 43%,
            #455760 58%,
            #33434c 74%,
            #223039 88%,
            #172229 100%
        )!important;
}

body.mw-page-index .mw-home-aftercare::after{
    content:"";
    position:absolute;
    left:-8%;
    right:-8%;
    bottom:-1px;
    height:170px;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(23,34,41,0),#172229 88%);
    border-radius:52% 48% 0 0 / 20% 17% 0 0;
    transform:scaleX(1.08);
}

body.mw-page-index .mw-home-aftercare-content h2{
    color:#f3f6f7!important;
}

body.mw-page-index .mw-home-aftercare-content p,
body.mw-page-index .mw-home-aftercare-content .mw-home-aftercare-lead{
    color:#dce5e8!important;
}

body.mw-page-index .mw-home-aftercare-point{
    color:#f0f4f5!important;
}

body.mw-page-index .mw-home-aftercare-partner,
body.mw-page-index .mw-home-aftercare-certificate{
    background:#11191d!important;
    border-color:rgba(255,255,255,.10)!important;
    border-radius:16px!important;
    box-shadow:0 24px 52px rgba(0,0,0,.22)!important;
}

/* Footer-Anschluss ohne Lichtkante */
body.mw-page-index .mw-home-aftercare + footer,
body.mw-page-index footer.mw-footer{
    margin-top:-1px!important;
    border-top:0!important;
}

/* =========================================================
   BUTTONS – einheitlicher Index-Look
========================================================= */

body.mw-page-index .mw-home-info-button,
body.mw-page-index .mw-home-card-link,
body.mw-page-index .event-button{
    border-radius:10px!important;
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background .22s ease,
        color .22s ease,
        border-color .22s ease!important;
}

body.mw-page-index .mw-home-info-button:not(.mw-home-info-button-secondary),
body.mw-page-index .mw-home-card-link{
    background:var(--mwi-blue)!important;
    border-color:var(--mwi-blue)!important;
    color:#fff!important;
}

body.mw-page-index .mw-home-info-button:hover,
body.mw-page-index .mw-home-card-link:hover,
body.mw-page-index .event-button:hover{
    transform:translateY(-2px)!important;
}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1024px){
    body.mw-page-index .mw-video-hero-inner{
        width:min(100% - 38px,900px);
    }

    body.mw-page-index .mw-home-prices{
        padding:54px 38px 44px;
    }

    body.mw-page-index .mw-home-info-grid,
    body.mw-page-index .mw-home-price-grid{
        grid-template-columns:1fr!important;
    }

    body.mw-page-index .mw-home-stats{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    body.mw-page-index .mw-home-artists-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}

@media(max-width:760px){

    body.mw-page-index .mw-home-section-inner,
    body.mw-page-index .mw-home-info-inner,
    body.mw-page-index .mw-home-intro .events-inner{
        width:calc(100% - 30px);
    }

    body.mw-page-index .mw-video-hero{
        min-height:720px;
    }

    body.mw-page-index .mw-video-hero-media{
        opacity:.72;
        object-position:58% center;
    }

    body.mw-page-index .mw-video-hero-overlay{
        background:
            linear-gradient(
                180deg,
                rgba(8,14,18,.34) 0%,
                rgba(14,24,30,.40) 34%,
                rgba(18,29,36,.62) 68%,
                rgba(23,34,41,.92) 100%
            );
    }

    body.mw-page-index .mw-video-hero-inner{
        width:calc(100% - 30px);
    }

    body.mw-page-index .mw-video-hero-logo{
        opacity:.92;
    }

    body.mw-page-index .mw-video-hero-content h1{
        font-size:clamp(2.75rem,12vw,4.4rem)!important;
        line-height:.98!important;
    }

    body.mw-page-index .mw-home-intro,
    body.mw-page-index .mw-home-info,
    body.mw-page-index .mw-home-experience,
    body.mw-page-index .mw-home-first-tattoo,
    body.mw-page-index .mw-home-details,
    body.mw-page-index .mw-home-craft,
    body.mw-page-index .mw-home-artists,
    body.mw-page-index .mw-home-vouchers,
    body.mw-page-index .mw-home-aftercare{
        padding-top:110px!important;
        padding-bottom:115px!important;
    }

    body.mw-page-index .mw-home-intro{
        background:
            linear-gradient(
                180deg,
                #273943 0%,
                #3d5059 20%,
                #687880 46%,
                #aab5ba 72%,
                #dce1e3 100%
            )!important;
    }

    body.mw-page-index .mw-home-intro h2,
    body.mw-page-index .mw-home-artists-intro h2{
        font-size:clamp(2.45rem,10vw,3.65rem)!important;
    }

    body.mw-page-index .mw-home-prices{
        margin-top:80px!important;
        padding:34px 18px 24px;
        border-radius:20px;
    }

    body.mw-page-index .mw-home-info-card,
    body.mw-page-index .mw-home-price-card,
    body.mw-page-index .mw-home-detail-card,
    body.mw-page-index .mw-home-service-card,
    body.mw-page-index .mw-home-reason-card,
    body.mw-page-index .mw-home-style-card{
        border-radius:13px!important;
    }

    body.mw-page-index .mw-home-stats,
    body.mw-page-index .mw-home-artists-grid,
    body.mw-page-index .mw-home-reasons-grid,
    body.mw-page-index .mw-home-style-grid{
        grid-template-columns:1fr!important;
    }

    body.mw-page-index .mw-home-first-layout{
        grid-template-columns:1fr!important;
        gap:38px!important;
    }

    body.mw-page-index .mw-home-first-heading{
        position:static!important;
    }

    body.mw-page-index .mw-home-first-content{
        padding-left:20px!important;
    }

    body.mw-page-index .mw-home-first-content p,
    body.mw-page-index .mw-home-first-content p:nth-last-child(-n+2){
        color:#e8eef0!important;
    }

    body.mw-page-index .mw-home-highlight-links,
    body.mw-page-index .mw-home-details-grid,
    body.mw-page-index .mw-home-training-links{
        grid-template-columns:1fr!important;
    }

    body.mw-page-index .mw-home-training{
        grid-template-columns:1fr!important;
        padding:28px 22px!important;
    }

    body.mw-page-index .mw-home-craft-layout,
    body.mw-page-index .mw-home-vouchers-layout,
    body.mw-page-index .mw-home-aftercare-layout{
        grid-template-columns:1fr!important;
        gap:42px!important;
    }

    body.mw-page-index .mw-home-aftercare-media{
        grid-template-columns:1fr!important;
    }

    body.mw-page-index .mw-home-craft-content h2,
    body.mw-page-index .mw-home-reasons-heading h2{
        color:#172129!important;
    }

    body.mw-page-index .mw-home-styles .mw-home-section-heading h2{
        color:#f0f4f5!important;
    }
}

@media(max-width:430px){
    body.mw-page-index .mw-video-hero{
        min-height:680px;
    }

    body.mw-page-index .mw-video-hero-actions{
        flex-direction:column!important;
        align-items:stretch!important;
    }

    body.mw-page-index .mw-video-hero-button{
        width:100%!important;
    }

    body.mw-page-index .mw-home-info-card,
    body.mw-page-index .mw-home-price-card,
    body.mw-page-index .mw-home-stat,
    body.mw-page-index .mw-home-detail-card,
    body.mw-page-index .mw-home-service-card{
        padding:25px 20px!important;
    }
}

/* =========================================================
   REDUCED MOTION
========================================================= */

@media(prefers-reduced-motion:reduce){
    body.mw-page-index *,
    body.mw-page-index *::before,
    body.mw-page-index *::after{
        scroll-behavior:auto!important;
        transition:none!important;
        animation:none!important;
    }
}


/* =========================================================
   INDEX – KORREKTURRUNDE 02
   Lesbarkeit / Übergänge / Button-Hover / Nummern / Gutscheine
========================================================= */

/* Termin-anfragen: Hover bewusst weiß mit blauer Schrift */
body.mw-page-index .mw-home-info-cta .mw-home-info-button:not(.mw-home-info-button-secondary):hover,
body.mw-page-index .mw-home-info-cta .mw-home-info-button:not(.mw-home-info-button-secondary):focus-visible,
body.mw-page-index .mw-home-info-cta .mw-home-card-link:hover,
body.mw-page-index .mw-home-info-cta .mw-home-card-link:focus-visible{
    background:#ffffff!important;
    border-color:#ffffff!important;
    color:#00aeef!important;
    -webkit-text-fill-color:#00aeef!important;
}

/* 1 / 2 / 3: weiß mit blauem Leuchtschatten */
body.mw-page-index .mw-home-service-number{
    color:#ffffff!important;
    -webkit-text-fill-color:#ffffff!important;
    opacity:1!important;
    text-shadow:
        0 0 8px rgba(0,174,239,.88),
        0 0 18px rgba(0,174,239,.68),
        0 0 34px rgba(0,174,239,.48)!important;
}

/* Etwas mehr Kontrast der Texte in den drei dunklen Service-Blöcken */
body.mw-page-index .mw-home-service-card p{
    color:#c9d3d7!important;
    -webkit-text-fill-color:#c9d3d7!important;
}
body.mw-page-index .mw-home-service-card h3{
    color:#f5f7f8!important;
    -webkit-text-fill-color:#f5f7f8!important;
}

/* Gutscheinbereich ohne blauen Lichtfleck / sichtbare Rechteckkante */
body.mw-page-index .mw-home-vouchers{
    background:
        linear-gradient(
            180deg,
            #d4dade 0%,
            #cfd6d9 18%,
            #c7d0d4 38%,
            #bbc6ca 58%,
            #aebbc0 78%,
            #9eabb1 100%
        )!important;
}

/* Sicherstellen, dass keine pseudo-elemente dort eine Lichtkante erzeugen */
body.mw-page-index .mw-home-vouchers::before,
body.mw-page-index .mw-home-vouchers::after{
    background:none!important;
    box-shadow:none!important;
}

/* Intro-Text auf dem helleren unteren Verlauf mit leicht stärkerer Kontur */
body.mw-page-index .mw-home-intro-lead,
body.mw-page-index .mw-home-intro-text p{
    text-shadow:0 1px 1px rgba(23,34,41,.16);
}


/* =========================================================
   INDEX – KORREKTURRUNDE 03 / FINAL CLEANUP
   1) Trennlinie Styles -> Artists entfernen
   2) Info/CTA -> Experience ohne harte Kante / Lichtfleck
   3) Intro -> Öffnungszeiten ohne blauen Lichtkegel
========================================================= */


/* ---------------------------------------------------------
   01 · TATTOO-STILE -> ARTISTS
   Jede sichtbare 1px-Trennlinie aus alten Styles neutralisieren
--------------------------------------------------------- */

body.mw-page-index .mw-home-styles,
body.mw-page-index .mw-home-artists,
body.mw-page-index .mw-home-styles + .mw-home-artists{
    border-top:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
}

body.mw-page-index .mw-home-styles::before,
body.mw-page-index .mw-home-styles::after,
body.mw-page-index .mw-home-artists::before,
body.mw-page-index .mw-home-artists::after{
    border:0!important;
    box-shadow:none!important;
}

/* Falls die alte Haupt-CSS eine horizontale Linie über background-image setzt */
body.mw-page-index .mw-home-artists{
    background-image:
        linear-gradient(
            180deg,
            #33434c 0%,
            #44565f 12%,
            #5d6f78 26%,
            #7e8d94 42%,
            #a1adb2 60%,
            #c2cbcf 78%,
            #d4dade 100%
        )!important;
}


/* ---------------------------------------------------------
   02 · INTRO -> ÖFFNUNGSZEITEN
   Blauen Lichtkegel vollständig entfernen.

   Wichtig: keine radialen blauen Layer und keine Pseudo-
   Elemente an der oberen Kante des Info-Bereichs.
--------------------------------------------------------- */

body.mw-page-index .mw-home-info{
    background-image:
        linear-gradient(
            180deg,
            #dce1e3 0%,
            #d9dfe1 16%,
            #d5dcdf 31%,
            #cfd7da 46%,
            #c7d0d4 60%,
            #bbc6ca 73%,
            #aebbc0 84%,
            #9eabb1 92%,
            #7f8f97 97%,
            #5d6f78 100%
        )!important;

    box-shadow:none!important;
    border-top:0!important;
}

/* Alle alten Licht-/Glow-Pseudoelemente oberhalb dieser Section aus */
body.mw-page-index .mw-home-info::before{
    content:none!important;
    display:none!important;
    background:none!important;
    box-shadow:none!important;
    filter:none!important;
}


/* ---------------------------------------------------------
   03 · INFO / CTA -> EXPERIENCE
   Die alte separate Welle wird entfernt.

   Stattdessen läuft DIE INFO-SECTION SELBST bereits bis in
   das dunkle Slate hinein. Die Experience startet exakt mit
   derselben Farbe. Dadurch gibt es keinen geraden Cut.
--------------------------------------------------------- */

body.mw-page-index .mw-home-info{
    padding-bottom:250px!important;

    background:
        linear-gradient(
            180deg,
            #dce1e3 0%,
            #d9dfe1 12%,
            #d4dade 25%,
            #cbd4d8 39%,
            #bec9ce 52%,
            #acb9bf 64%,
            #94a3aa 74%,
            #77878f 82%,
            #5d6f78 89%,
            #485b64 94%,
            #3b4d56 97%,
            #33434c 100%
        )!important;
}

/* Alte Extra-Welle war für die sichtbare Kante verantwortlich */
body.mw-page-index .mw-home-info::after{
    content:none!important;
    display:none!important;
}

/* CTA: kein externer Lichtfleck / Glow in den hellen Hintergrund */
body.mw-page-index .mw-home-info-cta{
    box-shadow:
        0 18px 42px rgba(23,34,41,.14)!important;
}

body.mw-page-index .mw-home-info-cta::before,
body.mw-page-index .mw-home-info-cta::after{
    content:none!important;
    display:none!important;
    background:none!important;
    box-shadow:none!important;
    filter:none!important;
}

/* Experience übernimmt exakt die Endfarbe der vorherigen Section */
body.mw-page-index .mw-home-experience{
    margin-top:-1px!important;
    border-top:0!important;
    box-shadow:none!important;

    background:
        linear-gradient(
            180deg,
            #33434c 0%,
            #32424b 12%,
            #2f3f48 28%,
            #2b3a43 48%,
            #273740 68%,
            #223039 100%
        )!important;
}

/* Keine zweite obere Welle / kein alter Schatten */
body.mw-page-index .mw-home-experience::before{
    content:none!important;
    display:none!important;
    background:none!important;
    box-shadow:none!important;
    filter:none!important;
}


/* ---------------------------------------------------------
   04 · ABSICHERUNG GEGEN ALTE SECTION-LINIEN
--------------------------------------------------------- */

body.mw-page-index .mw-home-intro,
body.mw-page-index .mw-home-info,
body.mw-page-index .mw-home-experience,
body.mw-page-index .mw-home-first-tattoo,
body.mw-page-index .mw-home-details,
body.mw-page-index .mw-home-craft,
body.mw-page-index .mw-home-artists,
body.mw-page-index .mw-home-vouchers,
body.mw-page-index .mw-home-aftercare{
    border-top:0!important;
    border-bottom:0!important;
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media(max-width:760px){
    body.mw-page-index .mw-home-info{
        padding-bottom:145px!important;

        background:
            linear-gradient(
                180deg,
                #dce1e3 0%,
                #d5dcdf 24%,
                #c5cfd3 46%,
                #aab7bd 65%,
                #829198 79%,
                #5c6e77 90%,
                #33434c 100%
            )!important;
    }
}

/* =========================================================
   INDEX – KORREKTURRUNDE 04
   Letzte sichtbare Trennlinie: Tattoo-Stile -> Artists
   ========================================================= */

/* Der Styles-Block sitzt innerhalb des Craft-Bereichs. Alte Haupt-CSS
   kann dort noch eine 1px-Akzentkante bzw. ein Pseudo-Element setzen. */
body.mw-page-index .mw-home-craft .mw-home-styles{
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background-image:none!important;
}

body.mw-page-index .mw-home-craft .mw-home-styles::before,
body.mw-page-index .mw-home-craft .mw-home-styles::after{
    content:none!important;
    display:none!important;
    border:0!important;
    outline:0!important;
    background:none!important;
    box-shadow:none!important;
    filter:none!important;
}

/* Auch mögliche Linien auf dem letzten inneren Wrapper neutralisieren. */
body.mw-page-index .mw-home-styles > :last-child,
body.mw-page-index .mw-home-styles .mw-home-styles-grid,
body.mw-page-index .mw-home-styles .mw-home-section-heading{
    border-bottom:0!important;
    box-shadow:none!important;
}

/* Die beiden angrenzenden Flächen treffen sich pixelgenau in #33434c.
   2px Überlappung verhindert zusätzlich Subpixel-/Rendering-Seams. */
body.mw-page-index .mw-home-craft{
    border-bottom:0!important;
    box-shadow:none!important;
}

body.mw-page-index .mw-home-artists{
    margin-top:-2px!important;
    border-top:0!important;
    outline:0!important;
    box-shadow:none!important;
}


/* =========================================================
   INDEX – KORREKTURRUNDE 05
   Tatsächliche Ursache der blauen Linie vor ARTISTS:
   css-newhome.css setzt auf .mw-home-artists::before ein
   1px blaues Gradient-Element.
   ========================================================= */

body.mw-page-index .mw-home-artists::before{
    content:none!important;
    display:none!important;
    position:static!important;
    width:0!important;
    height:0!important;
    inset:auto!important;
    background:none!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    filter:none!important;
    opacity:0!important;
}

/* Artists selbst ohne künstliche Kante */
body.mw-page-index .mw-home-artists{
    border-top:0!important;
    outline:0!important;
    box-shadow:none!important;
}


/* =========================================================
   INDEX – MOBILE KORREKTURRUNDE
   Nur Lesbarkeit auf kleinen Displays
   Desktop bleibt vollständig unangetastet.
========================================================= */

@media(max-width:760px){

    /* -----------------------------------------------------
       01 · INTRO
       Die weißen Fließtexte laufen mobil zu weit in den
       bereits hellen unteren Verlauf hinein.
       -> Text dort dunkel setzen.
    ----------------------------------------------------- */

    body.mw-page-index .mw-home-intro .mw-home-intro-lead,
    body.mw-page-index .mw-home-intro .mw-home-intro-text p{
        color:#334750!important;
        -webkit-text-fill-color:#334750!important;
        text-shadow:none!important;
    }

    body.mw-page-index .mw-home-intro .mw-home-intro-text strong,
    body.mw-page-index .mw-home-intro .mw-home-intro-lead strong{
        color:#172129!important;
        -webkit-text-fill-color:#172129!important;
    }


    /* -----------------------------------------------------
       02 · ERSTES TATTOO
       Der Text steht mobil vollständig auf hellem Verlauf.
       -> komplette Content-Spalte dunkel setzen.
    ----------------------------------------------------- */

    body.mw-page-index .mw-home-first-tattoo .mw-home-first-content p{
        color:#40535d!important;
        -webkit-text-fill-color:#40535d!important;
        text-shadow:none!important;
    }

    body.mw-page-index .mw-home-first-tattoo .mw-home-first-content strong{
        color:#172129!important;
        -webkit-text-fill-color:#172129!important;
    }

    body.mw-page-index .mw-home-first-tattoo .mw-home-first-content{
        border-left-color:#00aeef!important;
    }
}
