/* =========================================================
   MOST WANTED – TATTOO BERLIN EPIC
   Vollständig auf .mw-tattoo-epic gekapselt.
========================================================= */

.mw-tattoo-epic {
    --te-blue: #00aeef;
    --te-bg: #07090a;
    --te-bg-2: #0b0e10;
    --te-panel: #111416;
    --te-line: rgba(255,255,255,.11);
    --te-text: rgba(255,255,255,.72);
    background: var(--te-bg);
    color: #fff;
    overflow: hidden;
}

.mw-tattoo-epic *,
.mw-tattoo-epic *::before,
.mw-tattoo-epic *::after {
    box-sizing: border-box;
}

.mw-te-shell {
    width: min(1320px, calc(100% - 48px));
    margin: 0 auto;
}

.mw-te-kicker {
    display: block;
    margin-bottom: 14px;
    color: var(--te-blue);
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.mw-te-center-heading {
    max-width: 880px;
    margin: 0 auto 48px;
    text-align: center;
}

.mw-te-center-heading h2,
.mw-te-copy h2,
.mw-te-final-content h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(2.5rem, 5vw, 5.1rem);
    font-weight: 950;
    line-height: .96;
    letter-spacing: -.055em;
}

.mw-te-center-heading p {
    max-width: 760px;
    margin: 22px auto 0;
    color: var(--te-text);
    font-size: 1rem;
    line-height: 1.8;
}

/* INTRO */
.mw-te-intro {
    padding: 110px 0;
    background:
        radial-gradient(circle at 80% 15%, rgba(0,174,239,.10), transparent 30%),
        linear-gradient(180deg, #090b0c, #07090a);
}

.mw-te-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
    gap: 78px;
    align-items: center;
}

.mw-te-copy p {
    margin: 24px 0 0;
    color: var(--te-text);
    line-height: 1.85;
}

.mw-te-copy .mw-te-lead {
    color: rgba(255,255,255,.93);
    font-size: clamp(1.12rem, 1.55vw, 1.36rem);
}

.mw-te-intro-actions,
.mw-te-final-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 34px;
}

.mw-te-button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    padding: 0 23px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 5px;
    color: #fff;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-decoration: none;
    text-transform: uppercase;
    transition: .25s ease;
}

.mw-te-button:hover,
.mw-te-button:focus-visible {
    border-color: var(--te-blue);
    box-shadow: 0 0 22px rgba(0,174,239,.15);
    transform: translateY(-2px);
}

.mw-te-button-primary {
    border-color: var(--te-blue);
    background: var(--te-blue);
    color: #050607;
}

.mw-te-intro-visual {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    border: 1px solid rgba(0,174,239,.30);
    border-radius: 18px;
    background: #080a0b;
    box-shadow: 0 30px 80px rgba(0,0,0,.35);
}

.mw-te-intro-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.72));
    pointer-events: none;
}

.mw-te-intro-visual img {
    width: 100%;
    height: 100%;
    min-height: 560px;
    object-fit: cover;
    display: block;
}

.mw-te-intro-badge {
    position: absolute;
    z-index: 2;
    left: 26px;
    bottom: 24px;
    padding: 14px 17px;
    border-left: 3px solid var(--te-blue);
    background: rgba(5,7,8,.83);
    backdrop-filter: blur(7px);
}

.mw-te-intro-badge strong,
.mw-te-intro-badge span {
    display: block;
}

.mw-te-intro-badge span {
    margin-top: 3px;
    color: rgba(255,255,255,.55);
    font-size: .76rem;
}

/* PROCESS */
.mw-te-process {
    padding: 115px 0 125px;
    border-top: 1px solid var(--te-line);
    background: #0b0e10;
}

.mw-te-process-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    border: 1px solid var(--te-line);
    border-radius: 16px;
    overflow: hidden;
    background: #0d1012;
}

.mw-te-process-card {
    position: relative;
    min-height: 360px;
    padding: 34px 30px 30px;
    border-right: 1px solid var(--te-line);
    background:
        linear-gradient(180deg, rgba(0,174,239,.035), transparent 42%),
        #0d1012;
}

.mw-te-process-card:last-child {
    border-right: 0;
}

.mw-te-process-number {
    display: block;
    margin-bottom: 32px;
    color: var(--te-blue);
    font-size: 2.8rem;
    font-weight: 950;
    line-height: 1;
    text-shadow: 0 0 25px rgba(0,174,239,.22);
}

.mw-te-process-icon {
    position: absolute;
    right: 26px;
    top: 31px;
    color: rgba(255,255,255,.30);
    font-size: 1.7rem;
}

.mw-te-process-card h3 {
    margin: 0 0 14px;
    font-size: 1.25rem;
}

.mw-te-process-card p {
    margin: 0;
    color: var(--te-text);
    line-height: 1.72;
}

/* ARTISTS */
.mw-te-artists {
    padding: 115px 0 125px;
    border-top: 1px solid var(--te-line);
    background:
        radial-gradient(circle at 50% 0, rgba(0,174,239,.07), transparent 25%),
        #07090a;
}

.mw-te-artist-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0,1fr));
    gap: 14px;
}

.mw-te-artist-card {
    overflow: hidden;
    border: 1px solid var(--te-line);
    border-radius: 12px;
    background: #111416;
    color: #fff;
    text-decoration: none;
    transition: .28s ease;
}

.mw-te-artist-card:hover {
    border-color: rgba(0,174,239,.80);
    box-shadow: 0 0 24px rgba(0,174,239,.16);
    transform: translateY(-4px);
}

.mw-te-artist-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    background: #0a0c0d;
}

.mw-te-artist-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}

.mw-te-artist-card:hover img {
    transform: scale(1.025);
}

.mw-te-artist-body {
    padding: 19px 18px 21px;
}

.mw-te-artist-body span {
    color: var(--te-blue);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.mw-te-artist-body h3 {
    margin: 8px 0 14px;
    font-size: 1.35rem;
}

.mw-te-artist-body strong {
    color: var(--te-blue);
    font-size: .76rem;
}

.mw-te-center-action {
    display: flex;
    justify-content: center;
    margin-top: 36px;
}

/* STYLES */
.mw-te-styles {
    padding: 115px 0 125px;
    border-top: 1px solid var(--te-line);
    background: #0b0e10;
}

.mw-te-style-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 18px;
}

.mw-te-style-card {
    position: relative;
    min-height: 460px;
    overflow: hidden;
    border: 1px solid var(--te-line);
    border-radius: 14px;
    background: #101315;
}

.mw-te-style-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.88) contrast(1.03);
    transition: transform .4s ease;
}

.mw-te-style-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.10) 20%, rgba(0,0,0,.88) 82%);
}

.mw-te-style-card > div {
    position: absolute;
    z-index: 2;
    left: 25px;
    right: 25px;
    bottom: 24px;
}

.mw-te-style-card > div > span {
    color: var(--te-blue);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.mw-te-style-card h3 {
    margin: 7px 0 9px;
    font-size: 1.55rem;
}

.mw-te-style-card p {
    margin: 0;
    color: rgba(255,255,255,.70);
    line-height: 1.6;
}

.mw-te-style-card:hover img {
    transform: scale(1.035);
}

/* BLOG */
.mw-te-journal {
    padding: 115px 0 125px;
    border-top: 1px solid var(--te-line);
    background: #07090a;
}

.mw-te-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 18px;
}

.mw-te-blog-card {
    overflow: hidden;
    border: 1px solid var(--te-line);
    border-radius: 12px;
    background: #111416;
    color: #fff;
    text-decoration: none;
    transition: .27s ease;
}

.mw-te-blog-card:hover {
    border-color: rgba(0,174,239,.70);
    box-shadow: 0 0 24px rgba(0,174,239,.13);
    transform: translateY(-3px);
}

.mw-te-blog-card img {
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
}

.mw-te-blog-card > div {
    padding: 22px;
}

.mw-te-blog-card span {
    color: var(--te-blue);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.mw-te-blog-card h3 {
    margin: 8px 0 10px;
    font-size: 1.3rem;
}

.mw-te-blog-card p {
    margin: 0;
    color: var(--te-text);
    line-height: 1.65;
}

.mw-te-blog-card strong {
    display: block;
    margin-top: 18px;
    color: var(--te-blue);
    font-size: .76rem;
}

/* EXPLORE VISUAL CARDS */
.mw-te-explore {
    padding: 115px 0 125px;
    border-top: 1px solid var(--te-line);
    background: #0b0e10;
}

.mw-te-explore-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 16px;
}

.mw-te-explore-card {
    overflow: hidden;
    border: 1px solid var(--te-line);
    border-radius: 12px;
    background: #111416;
    color: #fff;
    text-decoration: none;
    transition: .27s ease;
}

.mw-te-explore-card:hover {
    border-color: rgba(0,174,239,.75);
    box-shadow: 0 0 24px rgba(0,174,239,.14);
    transform: translateY(-4px);
}

.mw-te-explore-card img {
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
}

.mw-te-explore-card > div {
    padding: 22px;
}

.mw-te-explore-card span {
    color: var(--te-blue);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.mw-te-explore-card h3 {
    margin: 8px 0 9px;
    font-size: 1.35rem;
}

.mw-te-explore-card p {
    margin: 0;
    min-height: 76px;
    color: var(--te-text);
    line-height: 1.62;
}

.mw-te-explore-card strong {
    display: block;
    margin-top: 17px;
    color: var(--te-blue);
    font-size: .76rem;
}

/* QUALITY */
.mw-te-quality {
    padding: 105px 0 115px;
    border-top: 1px solid var(--te-line);
    background: #07090a;
}

.mw-te-quality-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 16px;
}

.mw-te-quality-grid article {
    padding: 26px;
    border-top: 2px solid rgba(0,174,239,.42);
    background: linear-gradient(180deg, rgba(0,174,239,.04), transparent);
}

.mw-te-quality-grid article > span {
    color: var(--te-blue);
    font-size: 1.6rem;
    font-weight: 950;
}

.mw-te-quality-grid h3 {
    margin: 20px 0 9px;
    font-size: 1.22rem;
}

.mw-te-quality-grid p {
    margin: 0;
    color: var(--te-text);
    line-height: 1.65;
}

/* FINAL CTA */
.mw-te-final {
    padding: 90px 0 125px;
    background:
        radial-gradient(circle at 85% 30%, rgba(0,174,239,.09), transparent 30%),
        #080a0b;
}

.mw-te-final-card {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    min-height: 480px;
    overflow: hidden;
    border: 1px solid rgba(0,174,239,.30);
    border-radius: 18px;
    background: #0e1214;
    box-shadow: 0 30px 70px rgba(0,0,0,.30);
}

.mw-te-final-image {
    min-height: 480px;
}

.mw-te-final-image img {
    width: 100%;
    height: 100%;
    min-height: 480px;
    object-fit: cover;
    display: block;
}

.mw-te-final-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 58px;
}

.mw-te-final-content p {
    max-width: 720px;
    margin: 22px 0 0;
    color: var(--te-text);
    line-height: 1.78;
}

.mw-te-final-facts {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
    margin-top: 34px;
    padding-top: 26px;
    border-top: 1px solid var(--te-line);
}

.mw-te-final-facts span,
.mw-te-final-facts strong,
.mw-te-final-facts small {
    display: block;
}

.mw-te-final-facts strong {
    font-size: .84rem;
}

.mw-te-final-facts small {
    margin-top: 5px;
    color: rgba(255,255,255,.45);
}

/* RESPONSIVE */
@media (max-width: 1180px) {
    .mw-te-artist-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mw-te-process-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mw-te-process-card { border-bottom: 1px solid var(--te-line); }
    .mw-te-process-card:nth-child(2) { border-right: 0; }
    .mw-te-explore-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 900px) {
    .mw-te-shell { width: min(100% - 36px,1320px); }
    .mw-te-intro-grid,
    .mw-te-final-card { grid-template-columns: 1fr; }
    .mw-te-intro-visual,
    .mw-te-intro-visual img { min-height: 440px; }
    .mw-te-style-grid,
    .mw-te-blog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mw-te-quality-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mw-te-final-content { padding: 40px; }
}

@media (max-width: 620px) {
    .mw-te-shell { width: calc(100% - 30px); }
    .mw-te-intro,
    .mw-te-process,
    .mw-te-artists,
    .mw-te-styles,
    .mw-te-journal,
    .mw-te-explore,
    .mw-te-quality { padding: 82px 0; }

    .mw-te-process-grid,
    .mw-te-artist-grid,
    .mw-te-style-grid,
    .mw-te-blog-grid,
    .mw-te-explore-grid,
    .mw-te-quality-grid,
    .mw-te-final-facts { grid-template-columns: 1fr; }

    .mw-te-process-card { border-right: 0; }
    .mw-te-artist-grid { gap: 12px; }
    .mw-te-artist-image { aspect-ratio: 1/1; }
    .mw-te-style-card { min-height: 400px; }
    .mw-te-final-content { padding: 30px 24px; }
    .mw-te-final-image,
    .mw-te-final-image img { min-height: 360px; }
}


/* =========================================================
   FINAL REDESIGN OVERRIDES
   Originale Inhalte/Struktur bleiben erhalten.
   Navigation und Footer werden nicht angefasst.
========================================================= */

body.mw-new-home {
    background:#f3f6f7;
}

.mw2-shell{
    width:min(1380px, calc(100% - 64px));
    margin:0 auto;
}
.mw2-hero{
    position:relative;
    overflow:hidden;
    padding:92px 0 86px;
    background:
      radial-gradient(circle at 82% 10%, rgba(0,174,232,.16), transparent 30%),
      radial-gradient(circle at 12% 100%, rgba(255,255,255,.055), transparent 28%),
      linear-gradient(135deg,#121a20 0%,#202b32 52%,#10171c 100%);
    border-bottom:1px solid rgba(255,255,255,.08);
}
.mw2-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(560px,1.1fr);
    gap:70px;
    align-items:center;
}
.mw2-breadcrumb{
    margin-bottom:20px;
    color:rgba(255,255,255,.48);
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.mw2-kicker{
    display:inline-block;
    margin-bottom:16px;
    color:#00aeef;
    font-size:13px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.mw2-hero-copy h1{
    margin:0;
    color:#fff;
    font-size:clamp(66px,7.1vw,122px);
    font-weight:950;
    letter-spacing:-.06em;
    line-height:.9;
}
.mw2-hero-copy h2{
    margin:20px 0 0;
    color:#00aeef;
    font-size:clamp(26px,2.4vw,42px);
    line-height:1.08;
    letter-spacing:-.035em;
}
.mw2-lead{
    max-width:720px;
    margin:26px 0 0;
    color:#d1d9dd;
    font-size:clamp(18px,1.45vw,23px);
    line-height:1.62;
}
.mw2-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;}
.mw2-btn{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:54px;padding:0 26px;border-radius:4px;
    text-decoration:none;font-size:14px;font-weight:900;
    letter-spacing:.04em;text-transform:uppercase;transition:.22s ease;
}
.mw2-btn-primary{background:#00aeef;color:#fff;box-shadow:0 12px 32px rgba(0,174,239,.24);}
.mw2-btn-light{background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.24);}
.mw2-btn:hover{transform:translateY(-2px);}
.mw2-hero-gallery{
    display:grid;grid-template-columns:1.45fr .8fr;grid-template-rows:1fr 1fr;
    gap:14px;min-height:650px;
}
.mw2-hero-gallery figure{
    margin:0;overflow:hidden;border-radius:18px;
    box-shadow:0 28px 65px rgba(0,0,0,.27);
    border:1px solid rgba(255,255,255,.14);background:#29343a;
}
.mw2-hero-main{grid-row:1 / 3;}
.mw2-hero-gallery img{
    width:100%;height:100%;display:block;object-fit:cover;
    filter:brightness(1.06) contrast(1.04) saturate(.92);
}

/* Die alte Seite bleibt inhaltlich identisch, bekommt aber die hellere V3-Balance. */
.mw-tattoo-epic{
    --te-blue:#00aeef;
    --te-bg:#f3f6f7;
    --te-bg-2:#ffffff;
    --te-panel:#ffffff;
    --te-line:rgba(12,31,42,.10);
    --te-text:#000000;
    background:#f3f6f7;
    color:#000000;
}
.mw-te-center-heading h2,
.mw-te-copy h2,
.mw-te-final-content h2{color:#000000;}
.mw-te-center-heading p,.mw-te-copy p{color:#000000;}

.mw-te-intro{
    background:#fff;
    padding:108px 0;
}
.mw-te-intro-visual{
    box-shadow:0 24px 60px rgba(17,40,54,.13);
}
.mw-te-intro-visual img{filter:brightness(1.06) contrast(1.04) saturate(.92);}

.mw-te-process{
    background:#edf3f5;
    border-color:rgba(12,31,42,.08);
}
.mw-te-process-card{
    background:#fff;
    border-color:rgba(12,31,42,.09);
}
.mw-te-process-card h3{color:#000000;}
.mw-te-process-card p{color:#000000;}
.mw-te-process-icon{color:#00aeef;}

.mw-te-artists{
    background:#fff;
}
.mw-te-artist-card{
    background:#f2f6f8;
    border-color:rgba(12,31,42,.09);
}
.mw-te-artist-body h3{color:#000000;}
.mw-te-artist-body strong{color:#000000;}

.mw-te-styles{
    background:#0d1419;
}
.mw-te-styles .mw-te-center-heading h2{color:#fff;}
.mw-te-styles .mw-te-center-heading p{color:#aebbc3;}
.mw-te-style-card{
    border-color:rgba(255,255,255,.12);
}
.mw-te-style-card img{filter:brightness(.96) contrast(1.06) saturate(.9);}
.mw-te-style-card div{background:linear-gradient(to top,rgba(4,8,10,.94),rgba(4,8,10,.06));}

.mw-te-journal{
    background:#f0f5f7;
}
.mw-te-blog-card{
    background:#fff;
    border-color:rgba(12,31,42,.09);
    box-shadow:0 8px 24px rgba(20,42,56,.045);
}
.mw-te-blog-card h3{color:#000000;}
.mw-te-blog-card p{color:#000000;}

.mw-te-explore{
    background:#fff;
}
.mw-te-explore-card{
    box-shadow:0 12px 32px rgba(17,40,54,.08);
}
.mw-te-explore-card img{
    filter:brightness(1.05) contrast(1.04) saturate(.94);
}
.mw-te-explore-card::after{
    background:linear-gradient(to top,rgba(7,12,15,.92),rgba(7,12,15,.12) 72%);
}

.mw-te-quality{
    background:#edf3f5;
    border-color:rgba(12,31,42,.08);
}
.mw-te-quality-grid article{
    background:#fff;
    border-color:rgba(12,31,42,.09);
}
.mw-te-quality-grid h3{color:#000000;}
.mw-te-quality-grid p{color:#000000;}

.mw-te-final{
    background:
      radial-gradient(circle at 20% 0%,rgba(0,174,239,.20),transparent 35%),
      #101820;
}
.mw-te-final-card{
    background:#151f25;
    border-color:rgba(255,255,255,.12);
}
.mw-te-final-content h2{color:#fff;}
.mw-te-final-content p{color:#bdc9cf;}
.mw-te-final-image img{filter:brightness(1.06) contrast(1.04) saturate(.92);}

@media (max-width:1100px){
    .mw2-shell{width:min(100% - 40px,1380px);}
    .mw2-hero-grid{grid-template-columns:1fr;gap:48px;}
    .mw2-hero-gallery{min-height:560px;}
}
@media (max-width:700px){
    .mw2-shell{width:min(100% - 28px,1380px);}
    .mw2-hero{padding:58px 0 54px;}
    .mw2-hero-copy h1{font-size:clamp(54px,16vw,78px);}
    .mw2-hero-gallery{grid-template-columns:1fr 1fr;grid-template-rows:420px 205px;min-height:0;}
    .mw2-hero-main{grid-column:1 / 3;grid-row:auto;}
}


/* =========================================================
   KORREKTURRUNDE V4 – NUR DIE ABGESPROCHENEN PUNKTE
========================================================= */

/* 1) Intro: Lead wieder lesbar + Badge "Most Wanted" weiß */
.mw-te-intro .mw-te-lead{
    color:#000000 !important;
    opacity:1 !important;
}
.mw-te-intro-badge strong{
    color:#fff !important;
}
.mw-te-intro-badge span{
    color:rgba(255,255,255,.72) !important;
}

/* 2) Tattoo-Stile: Beschriftungen stärker vom Bild lösen */
.mw-te-style-card::after{
    background:linear-gradient(
        180deg,
        rgba(0,0,0,.03) 18%,
        rgba(0,0,0,.18) 48%,
        rgba(0,0,0,.92) 79%,
        rgba(0,0,0,.98) 100%
    ) !important;
}
.mw-te-style-card > div{
    left:22px;
    right:22px;
    bottom:20px;
    padding:17px 18px 16px;
    background:rgba(4,8,10,.76) !important;
    border-left:2px solid #00aeef;
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
}
.mw-te-style-card h3{
    color:#fff !important;
    text-shadow:0 2px 12px rgba(0,0,0,.55);
}
.mw-te-style-card p{
    color:rgba(255,255,255,.86) !important;
}
.mw-te-style-card > div > span{
    color:#00aeef !important;
}

/* 3) Tattoo-Blog Button auf hellem Journal sichtbar */
.mw-te-journal .mw-te-center-action .mw-te-button{
    border-color:#111820 !important;
    background:#111820 !important;
    color:#fff !important;
    box-shadow:0 8px 24px rgba(17,24,32,.12);
}
.mw-te-journal .mw-te-center-action .mw-te-button:hover,
.mw-te-journal .mw-te-center-action .mw-te-button:focus-visible{
    border-color:#00aeef !important;
    background:#00aeef !important;
    color:#071015 !important;
}

/* 4) "Dein Tattoo-Projekt im Detail" exakt in der V3-Kartenlogik */
.mw2-detail-project{
    padding:100px 0;
    background:#fff;
}
.mw2-detail-project .mw2-shell{
    width:min(1380px, calc(100% - 64px));
    margin:0 auto;
}
.mw2-detail-heading{
    margin-bottom:34px;
}
.mw2-detail-heading h2{
    margin:8px 0 0;
    color:#000000;
    font-size:clamp(42px,4.5vw,72px);
    line-height:.98;
    letter-spacing:-.045em;
}
.mw2-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1.35fr;
    gap:16px;
}
.mw2-info-card{
    position:relative;
    min-height:310px;
    padding:0;
    background:#0f171c;
    color:#fff;
    text-decoration:none;
    overflow:hidden;
}
.mw2-info-card img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}
.mw2-info-image img{
    filter:brightness(.78) contrast(1.04) saturate(.92);
}
.mw2-info-studio img{
    filter:brightness(.82) contrast(1.06);
}
.mw2-info-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(7,12,15,.94) 0%,rgba(7,12,15,.42) 58%,rgba(7,12,15,.10) 100%);
}
.mw2-info-card > div{
    position:absolute;
    z-index:2;
    left:36px;
    right:36px;
    bottom:32px;
}
.mw2-info-card div > span{
    color:#00b8f0;
    font-size:12px;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.mw2-info-card h3{
    margin:8px 0 10px;
    color:#fff;
    font-size:30px;
}
.mw2-info-card p{
    margin:0;
    color:#d0d8dd;
    line-height:1.65;
}
.mw2-info-card strong{
    display:inline-block;
    margin-top:24px;
    color:#00b8f0;
    font-size:13px;
}
.mw2-info-card:hover{
    box-shadow:0 14px 34px rgba(17,40,54,.14);
}
@media(max-width:1100px){
    .mw2-detail-project .mw2-shell{width:min(100% - 40px,1380px);}
    .mw2-info-grid{grid-template-columns:1fr 1fr;}
    .mw2-info-studio{grid-column:1 / 3;}
}
@media(max-width:700px){
    .mw2-detail-project{padding:76px 0;}
    .mw2-detail-project .mw2-shell{width:min(100% - 28px,1380px);}
    .mw2-info-grid{grid-template-columns:1fr;}
    .mw2-info-studio{grid-column:auto;}
    .mw2-info-card{min-height:330px;}
}


/* =========================================================
   FINAL V5 – Sichtbarkeit der sekundären Buttons + CTA-Fakten
========================================================= */

/* Intro: sekundärer Button "Unsere Artists" auf hellem Hintergrund */
.mw-te-intro .mw-te-button-secondary,
.mw-te-intro .mw-te-button-ghost,
.mw-te-intro .mw-te-actions a:not(.mw-te-button-primary){
    color:#111820 !important;
    border-color:#9aa7ae !important;
    background:#ffffff !important;
}
.mw-te-intro .mw-te-button-secondary:hover,
.mw-te-intro .mw-te-button-ghost:hover,
.mw-te-intro .mw-te-actions a:not(.mw-te-button-primary):hover{
    color:#ffffff !important;
    border-color:#111820 !important;
    background:#111820 !important;
}

/* Artists: "Gesamtes Team entdecken" auf hellem Hintergrund sichtbar */
.mw-te-artists .mw-te-center-action .mw-te-button,
.mw-te-artists .mw-te-button-secondary,
.mw-te-artists .mw-te-button-ghost{
    color:#111820 !important;
    border-color:#111820 !important;
    background:#ffffff !important;
}
.mw-te-artists .mw-te-center-action .mw-te-button:hover,
.mw-te-artists .mw-te-button-secondary:hover,
.mw-te-artists .mw-te-button-ghost:hover{
    color:#ffffff !important;
    background:#111820 !important;
}

/* Finale CTA: Kostenfreie Beratung / Walk-ins / Berlin-Weißensee */
.mw-te-final-meta,
.mw-te-final-meta div,
.mw-te-final-meta strong,
.mw-te-final-meta span,
.mw-te-final-facts,
.mw-te-final-facts div,
.mw-te-final-facts strong,
.mw-te-final-facts span{
    opacity:1 !important;
}
.mw-te-final-meta strong,
.mw-te-final-facts strong{
    color:#ffffff !important;
}
.mw-te-final-meta span,
.mw-te-final-facts span{
    color:#aebbc3 !important;
}


/* =========================================================
   FINAL V6 – alter Hero zurück + sanft aufgehellt
========================================================= */

/* Alter Unterseiten-Hero bleibt strukturell unverändert.
   Das Hintergrundbild wird nur optisch heller/freundlicher behandelt. */
.mw-subpage-hero::before{
    filter:brightness(1.22) contrast(.93) saturate(.88) !important;
}
.mw-subpage-hero::after{
    background:
        linear-gradient(90deg,
            rgba(7,13,17,.72) 0%,
            rgba(7,13,17,.52) 38%,
            rgba(7,13,17,.20) 68%,
            rgba(7,13,17,.10) 100%
        ) !important;
}
.mw-subpage-hero .mw-subpage-hero-inner,
.mw-subpage-hero .mw-subpage-hero-content{
    position:relative;
    z-index:2;
}

/* "Unsere Artists" – bewusst dunkel auf weiß, damit er garantiert sichtbar ist */
.mw-te-intro .mw-te-actions .mw-te-button-secondary,
.mw-te-intro .mw-te-actions .mw-te-button-ghost,
.mw-te-intro .mw-te-actions a[href="#artists"]{
    color:#111820 !important;
    background:#ffffff !important;
    border:2px solid #111820 !important;
    box-shadow:none !important;
}
.mw-te-intro .mw-te-actions .mw-te-button-secondary:hover,
.mw-te-intro .mw-te-actions .mw-te-button-ghost:hover,
.mw-te-intro .mw-te-actions a[href="#artists"]:hover{
    color:#ffffff !important;
    background:#111820 !important;
    border-color:#111820 !important;
}

/* Falls der Link über eine andere Klassenkombination kommt: ebenfalls sichtbar */
.mw-te-intro .mw-te-actions a:not(.mw-te-button-primary){
    color:#111820 !important;
    background:#ffffff !important;
    border:2px solid #111820 !important;
}

/* Button "Unsere Artists" */
.neuer-button-artists {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 26px;

    background: #ffffff;
    color: #111820 !important;

    border: 2px solid #111820;
    border-radius: 4px;

    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none !important;

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.neuer-button-artists:hover,
.neuer-button-artists:focus-visible {
    background: #111820;
    color: #ffffff !important;
    border-color: #111820;
    text-decoration: none !important;
    transform: translateY(-2px);
}

.neuer-button-artists:active {
    transform: translateY(0);
}
/* =========================================================
   MOST WANTED – NEUER UNIVERSALER HERO-LOOK
   Test zunächst auf tattoo-berlin.php
========================================================= */

body.mw-new-home .mw-subpage-hero {
    background:
        linear-gradient(
            90deg,
            rgba(7, 13, 17, 0.82) 0%,
            rgba(7, 13, 17, 0.65) 38%,
            rgba(7, 13, 17, 0.26) 68%,
            rgba(7, 13, 17, 0.18) 100%
        ),
        url("../images/mw-subpage-background.jpg")
        center center / cover no-repeat !important;
}

/* bisherige zusätzliche Abdunklung deutlich reduzieren */
body.mw-new-home .mw-subpage-hero-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.02),
            rgba(0, 0, 0, 0.16)
        ),
        radial-gradient(
            circle at 72% 38%,
            rgba(0, 174, 239, 0.10),
            transparent 34%
        ) !important;
}

/* starke alte schwarze Vignette entschärfen */
body.mw-new-home .mw-subpage-hero-vignette {
    box-shadow:
        inset 0 0 110px rgba(0, 0, 0, 0.42) !important;
}

/* Texte bleiben knackig und gut lesbar */
body.mw-new-home .mw-subpage-hero h1 {
    color: #ffffff !important;
}

body.mw-new-home .mw-subpage-hero h2,
body.mw-new-home .mw-subpage-hero-kicker {
    color: #00aeef !important;
}

body.mw-new-home .mw-subpage-hero p {
    color: rgba(255, 255, 255, 0.82) !important;
}

/* Button etwas moderner und heller */
body.mw-new-home .mw-subpage-hero-button {
    background: #00aeef !important;
    border-color: #00aeef !important;
    color: #ffffff !important;

    box-shadow:
        0 10px 30px rgba(0, 174, 239, 0.18);

    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

body.mw-new-home .mw-subpage-hero-button:hover,
body.mw-new-home .mw-subpage-hero-button:focus-visible {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #111820 !important;

    transform: translateY(-2px);

    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.22);
}

/* =========================================================
   MOST WANTED – NEUER HERO-LOOK MOBILE
========================================================= */

@media (max-width: 768px) {

    body.mw-new-home .mw-subpage-hero {
        background:
            linear-gradient(
                180deg,
                rgba(7, 13, 17, 0.38) 0%,
                rgba(7, 13, 17, 0.58) 52%,
                rgba(7, 13, 17, 0.82) 100%
            ),
            url("../images/mw-subpage-background.jpg")
            center center / cover no-repeat !important;
    }

    body.mw-new-home .mw-subpage-hero-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.05),
                rgba(0, 0, 0, 0.20)
            ),
            radial-gradient(
                circle at 65% 25%,
                rgba(0, 174, 239, 0.10),
                transparent 38%
            ) !important;
    }

    body.mw-new-home .mw-subpage-hero-vignette {
        box-shadow:
            inset 0 0 65px rgba(0, 0, 0, 0.32) !important;
    }

    body.mw-new-home .mw-subpage-hero p {
        color: rgba(255, 255, 255, 0.88) !important;
    }
}

/* =========================================================
   MOST WANTED – HARMONIC FLOW SYSTEM
   Ziel:
   - keine reinweißen oder tiefschwarzen Großflächen
   - weichere Übergänge zwischen den Bereichen
   - Hero bleibt unverändert
   - Inhalte / Struktur / Bilder bleiben unangetastet
========================================================= */

.mw-tattoo-epic{
    --mw-deep:#111a20;
    --mw-dark:#17232a;
    --mw-dark-soft:#223039;
    --mw-mid:#40505a;
    --mw-stone:#cfd5d8;
    --mw-stone-2:#d9dee1;
    --mw-soft:#e3e6e8;
    --mw-soft-2:#e9ebec;
    --mw-ink:#182129;
    --mw-muted:#647078;
    --mw-blue:#00aeef;

    --te-blue:var(--mw-blue);
    --te-line:rgba(26,43,53,.12);
    --te-text:#637078;

    background:var(--mw-soft-2);
    color:var(--mw-ink);
}

/* =========================
   GLOBAL TYPOGRAPHY BALANCE
========================= */

.mw-tattoo-epic .mw-te-center-heading h2,
.mw-tattoo-epic .mw-te-copy h2{
    color:var(--mw-ink);
}

.mw-tattoo-epic .mw-te-center-heading p,
.mw-tattoo-epic .mw-te-copy p{
    color:var(--mw-muted);
}

.mw-tattoo-epic .mw-te-kicker{
    color:var(--mw-blue);
}

/* =========================
   INTRO
   Hero läuft weich in ein Rauchgrau aus.
========================= */

.mw-te-intro{
    position:relative;
    padding:110px 0 118px;
    background:
        radial-gradient(circle at 84% 16%, rgba(0,174,239,.055), transparent 29%),
        linear-gradient(
            180deg,
            #d7dde0 0%,
            #e1e5e7 34%,
            #e7e9ea 72%,
            #e2e6e8 100%
        ) !important;
}

.mw-te-intro::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-1px;
    height:145px;
    pointer-events:none;
    background:linear-gradient(
        180deg,
        rgba(17,26,32,.22) 0%,
        rgba(73,89,99,.09) 34%,
        rgba(226,230,232,0) 100%
    );
}

.mw-te-intro .mw-te-lead{
    color:#38464f !important;
}

.mw-te-intro-visual{
    border-color:rgba(55,78,91,.18);
    background:#26343c;
    box-shadow:0 28px 64px rgba(30,47,57,.16);
}

.mw-te-intro-badge{
    background:rgba(18,27,33,.88);
}

/* =========================
   PROCESS
   Nur eine Nuance dunkler als Intro
========================= */

.mw-te-process{
    position:relative;
    padding:112px 0 124px;
    border-top:0 !important;
    background:
        linear-gradient(
            180deg,
            #e2e6e8 0%,
            #d9dfe2 34%,
            #d4dade 72%,
            #cfd6d9 100%
        ) !important;
}

.mw-te-process-grid{
    border-color:rgba(38,58,69,.13);
    background:rgba(236,239,240,.64);
    box-shadow:0 16px 38px rgba(37,53,63,.06);
}

.mw-te-process-card{
    background:
        linear-gradient(180deg, rgba(0,174,239,.025), rgba(255,255,255,0)),
        rgba(232,235,237,.82) !important;
    border-color:rgba(38,58,69,.12) !important;
}

.mw-te-process-card h3{
    color:var(--mw-ink);
}

.mw-te-process-card p{
    color:#607079;
}

/* =========================
   ARTISTS
   Kernkorrektur: kein Weiß-auf-Weiß mehr.
========================= */

.mw-te-artists{
    position:relative;
    padding:116px 0 128px;
    border-top:0 !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0,174,239,.055), transparent 26%),
        linear-gradient(
            180deg,
            #cfd6d9 0%,
            #bfc9ce 24%,
            #aebbc1 55%,
            #8f9da5 82%,
            #71808a 100%
        ) !important;
}

.mw-te-artists .mw-te-center-heading h2{
    color:#162028 !important;
}

.mw-te-artists .mw-te-center-heading p{
    color:#4e5c64 !important;
}

.mw-te-artist-card{
    border-color:rgba(17,31,39,.16) !important;
    background:#d6dcdf !important;
    color:#182129 !important;
    box-shadow:0 12px 28px rgba(18,31,39,.09);
}

.mw-te-artist-image{
    background:#1a242a;
}

.mw-te-artist-body{
    background:
        linear-gradient(180deg,#d8dde0 0%,#cfd6d9 100%);
}

.mw-te-artist-body h3{
    color:#172129 !important;
}

.mw-te-artist-body strong{
    color:#40515b !important;
}

.mw-te-artist-card:hover{
    border-color:rgba(0,174,239,.56) !important;
    box-shadow:0 15px 34px rgba(24,40,49,.16);
}

.mw-te-artists .mw-te-center-action .mw-te-button{
    border-color:#2e3d46 !important;
    background:#cbd3d7 !important;
    color:#172129 !important;
    box-shadow:none !important;
}

.mw-te-artists .mw-te-center-action .mw-te-button:hover,
.mw-te-artists .mw-te-center-action .mw-te-button:focus-visible{
    background:#223039 !important;
    border-color:#223039 !important;
    color:#f2f4f5 !important;
}

/* =========================
   STYLES
   Weicher Übergang in den dunkleren Teil.
========================= */

.mw-te-styles{
    position:relative;
    padding:116px 0 128px;
    border-top:0 !important;
    background:
        linear-gradient(
            180deg,
            #71808a 0%,
            #55646d 13%,
            #3d4b54 28%,
            #2a373f 48%,
            #1e2a31 70%,
            #172229 100%
        ) !important;
}

.mw-te-styles .mw-te-center-heading h2{
    color:#f0f2f3 !important;
}

.mw-te-styles .mw-te-center-heading p{
    color:#c2cbd0 !important;
}

.mw-te-style-card{
    border-color:rgba(255,255,255,.12) !important;
    background:#1a252b;
    box-shadow:0 18px 38px rgba(5,10,13,.13);
}

/* =========================
   BLOG
   Dunkel wieder sanft zurück auf mittleres Grau.
========================= */

.mw-te-journal{
    position:relative;
    padding:118px 0 126px;
    border-top:0 !important;
    background:
        linear-gradient(
            180deg,
            #172229 0%,
            #223039 16%,
            #35444d 32%,
            #63727b 52%,
            #9aa6ac 72%,
            #c6ced2 88%,
            #d6dcdf 100%
        ) !important;
}

.mw-te-journal .mw-te-center-heading h2{
    color:#f1f3f4 !important;
}

.mw-te-journal .mw-te-center-heading p{
    color:#d0d7da !important;
}

.mw-te-blog-card{
    background:#d9dee1 !important;
    color:#172129 !important;
    border-color:rgba(29,46,56,.16) !important;
    box-shadow:0 10px 28px rgba(27,43,52,.09);
}

.mw-te-blog-card h3{
    color:#172129 !important;
}

.mw-te-blog-card p{
    color:#58666e !important;
}

.mw-te-blog-card strong{
    color:#008fc5 !important;
}

.mw-te-journal .mw-te-center-action .mw-te-button{
    background:#26343c !important;
    border-color:#26343c !important;
    color:#f1f3f4 !important;
}

.mw-te-journal .mw-te-center-action .mw-te-button:hover,
.mw-te-journal .mw-te-center-action .mw-te-button:focus-visible{
    background:#00aeef !important;
    border-color:#00aeef !important;
    color:#101820 !important;
}

/* =========================
   DETAIL CARDS
   Bleiben visuell stark, liegen aber nicht mehr auf Weiß.
========================= */

.mw2-detail-project{
    position:relative;
    padding:104px 0 114px;
    background:
        linear-gradient(
            180deg,
            #d6dcdf 0%,
            #dce1e3 45%,
            #d7dde0 100%
        ) !important;
}

.mw2-detail-heading h2{
    color:#182129 !important;
}

.mw2-info-card{
    box-shadow:0 14px 32px rgba(24,39,48,.12);
}

/* =========================
   QUALITY
   Leicht dunkler, aber nicht schwarz.
========================= */

.mw-te-quality{
    position:relative;
    padding:108px 0 118px;
    border-top:0 !important;
    background:
        linear-gradient(
            180deg,
            #d7dde0 0%,
            #cbd3d7 34%,
            #b8c2c7 68%,
            #a4b0b6 100%
        ) !important;
}

.mw-te-quality .mw-te-center-heading h2{
    color:#172129 !important;
}

.mw-te-quality-grid article{
    background:
        linear-gradient(180deg, rgba(236,239,240,.84), rgba(212,218,221,.72)) !important;
    border-color:rgba(33,50,60,.12) !important;
    box-shadow:0 10px 24px rgba(26,43,52,.05);
}

.mw-te-quality-grid h3{
    color:#172129 !important;
}

.mw-te-quality-grid p{
    color:#59676f !important;
}

/* =========================
   FINAL CTA
   Organischer Rückweg zum Hero-Farbklima.
========================= */

.mw-te-final{
    position:relative;
    padding:96px 0 128px;
    background:
        radial-gradient(circle at 84% 28%, rgba(0,174,239,.07), transparent 30%),
        linear-gradient(
            180deg,
            #a4b0b6 0%,
            #7c8a93 18%,
            #53616a 36%,
            #33414a 55%,
            #223039 75%,
            #172229 100%
        ) !important;
}

.mw-te-final-card{
    background:#202c33 !important;
    border-color:rgba(255,255,255,.12) !important;
    box-shadow:0 28px 64px rgba(17,28,34,.22);
}

.mw-te-final-content h2{
    color:#f2f4f5 !important;
}

.mw-te-final-content p{
    color:#c4cdd1 !important;
}

.mw-te-final-facts strong{
    color:#f1f3f4 !important;
}

.mw-te-final-facts small{
    color:#9facb2 !important;
}

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

.neuer-button-artists{
    background:#dce1e3 !important;
    color:#1b252c !important;
    border-color:#2f3d46 !important;
}

.neuer-button-artists:hover,
.neuer-button-artists:focus-visible{
    background:#26343c !important;
    color:#f0f2f3 !important;
    border-color:#26343c !important;
}

/* =========================
   MOBILE
========================= */

@media (max-width:768px){

    .mw-te-intro{
        background:
            linear-gradient(
                180deg,
                #d3dade 0%,
                #dee3e5 46%,
                #e4e7e8 100%
            ) !important;
    }

    .mw-te-process{
        background:
            linear-gradient(180deg,#e4e7e8 0%,#d7dde0 100%) !important;
    }

    .mw-te-artists{
        background:
            linear-gradient(
                180deg,
                #d7dde0 0%,
                #b9c3c8 42%,
                #8f9da5 100%
            ) !important;
    }

    .mw-te-styles{
        background:
            linear-gradient(
                180deg,
                #8f9da5 0%,
                #56656e 22%,
                #314048 48%,
                #1c282f 76%,
                #172229 100%
            ) !important;
    }

    .mw-te-journal{
        background:
            linear-gradient(
                180deg,
                #172229 0%,
                #324149 22%,
                #6f7e86 48%,
                #afb9be 72%,
                #d5dbde 100%
            ) !important;
    }

    .mw2-detail-project{
        background:#d7dde0 !important;
    }

    .mw-te-quality{
        background:
            linear-gradient(180deg,#d7dde0 0%,#a6b2b8 100%) !important;
    }

    .mw-te-final{
        background:
            linear-gradient(
                180deg,
                #a6b2b8 0%,
                #66757e 24%,
                #3b4952 48%,
                #253239 70%,
                #172229 100%
            ) !important;
    }
}


/* =========================================================
   FINAL HARMONY V2 – Hero-Auslauf + Artist-Portraits
   Nur CSS. PHP/HTML und Bilddateien bleiben unverändert.
========================================================= */

/* 1) Hero -> Intro:
   Direkt unter dem Hero bewusst dunkler starten und erst weich
   in das helle Rauchgrau des Inhalts übergehen. */
.mw-te-intro{
    background:
        radial-gradient(circle at 84% 22%, rgba(0,174,239,.045), transparent 30%),
        linear-gradient(
            180deg,
            #87949b 0%,
            #a3afb5 7%,
            #bdc7cc 15%,
            #d1d8dc 25%,
            #dde2e4 38%,
            #e3e7e8 58%,
            #e2e6e8 100%
        ) !important;
}

.mw-te-intro::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:235px;
    pointer-events:none;
    background:
        linear-gradient(
            180deg,
            rgba(24,34,40,.24) 0%,
            rgba(53,68,77,.12) 30%,
            rgba(129,145,154,.045) 62%,
            rgba(226,230,232,0) 100%
        ) !important;
}

/* Inhalt sicher über dem Übergang halten */
.mw-te-intro > .mw-te-shell{
    position:relative;
    z-index:1;
}


/* 2) ARTISTS:
   Die dunklen Originalbilder bleiben unverändert.
   Der Bildbereich bekommt jedoch dieselbe Slate-Familie wie die
   Sektion und läuft weich in den Kartenkörper aus. */
.mw-te-artist-card{
    position:relative;
    isolation:isolate;
    background:transparent !important;
    border-color:rgba(31,47,56,.14) !important;
    box-shadow:0 14px 32px rgba(25,40,49,.08) !important;
}

.mw-te-artist-image{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 40%, #26343c 0%, #202c33 48%, #1b272e 100%) !important;
}

/* Originalfoto selbst: keine Bilddatei wird verändert. */
.mw-te-artist-image img{
    position:relative;
    z-index:1;
}

/* Schwarze/rechteckige Fotokante optisch in die Kartenfarbe auflösen. */
.mw-te-artist-image::after{
    content:"";
    position:absolute;
    z-index:2;
    left:0;
    right:0;
    bottom:-1px;
    height:38%;
    pointer-events:none;
    background:
        linear-gradient(
            180deg,
            rgba(32,44,51,0) 0%,
            rgba(42,56,64,.08) 24%,
            rgba(79,94,103,.20) 48%,
            rgba(132,146,154,.46) 70%,
            rgba(180,190,195,.78) 88%,
            #cbd3d7 100%
        );
}

/* Textteil beginnt dort, wo das Bild optisch ausläuft. */
.mw-te-artist-body{
    position:relative;
    z-index:3;
    margin-top:-1px;
    background:
        linear-gradient(
            180deg,
            #cbd3d7 0%,
            #d1d8dc 48%,
            #d6dcdf 100%
        ) !important;
}

/* Dezenter Zusammenhalt statt sichtbarer Trennkante. */
.mw-te-artist-body::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-22px;
    height:23px;
    pointer-events:none;
    background:linear-gradient(
        180deg,
        rgba(203,211,215,0) 0%,
        rgba(203,211,215,.78) 72%,
        #cbd3d7 100%
    );
}

/* Mobile: der Effekt darf stärker greifen, weil das Portrait
   dort fast die gesamte Bildschirmbreite einnimmt. */
@media (max-width:620px){
    .mw-te-artist-grid{
        gap:22px !important;
    }

    .mw-te-artist-card{
        border-color:rgba(34,51,61,.11) !important;
        box-shadow:0 16px 34px rgba(25,40,49,.075) !important;
    }

    .mw-te-artist-image::after{
        height:46%;
        background:
            linear-gradient(
                180deg,
                rgba(32,44,51,0) 0%,
                rgba(53,68,77,.08) 22%,
                rgba(92,108,117,.24) 48%,
                rgba(145,158,165,.52) 72%,
                rgba(190,199,203,.84) 90%,
                #cbd3d7 100%
            );
    }

    .mw-te-artist-body{
        padding-top:25px;
    }
}
/* =========================================================
   ARTISTS – RUNDE PORTRAITS OHNE RECHTECKIGEN BILDKASTEN
========================================================= */

.mw-te-artist-card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.mw-te-artist-card:hover {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: translateY(-3px);
}


/* Neuer Portrait-Container */
.mw-te-artist-portrait {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    aspect-ratio: 1 / 1;

    overflow: visible;
    background: transparent;
}


/* Dunkler Kreis läuft weich ins Transparente aus */
.mw-te-artist-portrait::before {
    content: "";
    position: absolute;
    z-index: 0;

    width: 104%;
    height: 104%;

    border-radius: 50%;

    background: radial-gradient(
        circle at center,
        rgba(15, 24, 30, 0.98) 0%,
        rgba(22, 33, 40, 0.94) 48%,
        rgba(48, 64, 73, 0.68) 66%,
        rgba(101, 117, 126, 0.34) 80%,
        rgba(160, 172, 178, 0.10) 91%,
        rgba(160, 172, 178, 0) 100%
    );

    pointer-events: none;
}


/* Original PNG bleibt unverändert */
.mw-te-artist-portrait img {
    position: relative;
    z-index: 1;

    width: 100%;
    height: 100%;

    object-fit: contain;
    display: block;

    background: transparent !important;
}


/* Textbereich nicht mehr wie ein harter Kartenblock */
.mw-te-artist-body {
    position: relative;
    z-index: 2;

    margin-top: 4px;
    padding: 20px 18px 22px;

    background: linear-gradient(
        180deg,
        rgba(207, 215, 219, 0.62) 0%,
        rgba(207, 215, 219, 0.32) 55%,
        rgba(207, 215, 219, 0) 100%
    ) !important;

    border-radius: 10px;
}


/* Mobile etwas luftiger */
@media (max-width: 620px) {

    .mw-te-artist-grid {
        gap: 28px !important;
    }

    .mw-te-artist-portrait {
        width: 100%;
        aspect-ratio: 1 / 1;
    }

    .mw-te-artist-portrait::before {
        width: 108%;
        height: 108%;

        background: radial-gradient(
            circle at center,
            rgba(15, 24, 30, 0.98) 0%,
            rgba(23, 35, 42, 0.94) 50%,
            rgba(58, 74, 83, 0.62) 68%,
            rgba(116, 131, 139, 0.30) 82%,
            rgba(174, 184, 189, 0.08) 92%,
            rgba(174, 184, 189, 0) 100%
        );
    }

    .mw-te-artist-body {
        margin-top: 2px;
        padding: 22px 18px 24px;
    }
}
/* =========================================================
   ARTISTS FINAL – PORTRAITS DIREKT INS DESIGN AUSBLENDEN
========================================================= */

/* Karte selbst komplett freistellen */
.mw-te-artist-card {
    position: relative;
    overflow: visible !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    color: #172129;
}


/* Portrait-Bereich: KEIN eigener Kasten, KEIN grauer Kreis */
.mw-te-artist-portrait {
    position: relative;

    width: 100%;
    aspect-ratio: 1 / 1;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: visible !important;
    background: transparent !important;
}


/* alten künstlichen Hintergrund vollständig entfernen */
.mw-te-artist-portrait::before,
.mw-te-artist-portrait::after {
    display: none !important;
    content: none !important;
}


/* DAS ENTSCHEIDENDE:
   Das Originalbild selbst wird außen weich transparent */
.mw-te-artist-portrait img {
    position: relative;

    width: 100%;
    height: 100%;

    display: block;
    object-fit: contain;

    background: transparent !important;

    -webkit-mask-image: radial-gradient(
        circle at center,
        #000 0%,
        #000 67%,
        rgba(0,0,0,.98) 72%,
        rgba(0,0,0,.88) 77%,
        rgba(0,0,0,.62) 83%,
        rgba(0,0,0,.30) 89%,
        rgba(0,0,0,.08) 94%,
        transparent 100%
    );

    mask-image: radial-gradient(
        circle at center,
        #000 0%,
        #000 67%,
        rgba(0,0,0,.98) 72%,
        rgba(0,0,0,.88) 77%,
        rgba(0,0,0,.62) 83%,
        rgba(0,0,0,.30) 89%,
        rgba(0,0,0,.08) 94%,
        transparent 100%
    );

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}


/* Textbereich ebenfalls ohne weißen Kasten */
.mw-te-artist-body {
    position: relative;

    margin-top: -10px;
    padding: 20px 14px 24px;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* weißen Schleier aus vorherigem Versuch entfernen */
.mw-te-artist-body::before,
.mw-te-artist-body::after {
    display: none !important;
    content: none !important;
}


/* Texte */
.mw-te-artist-body h3 {
    color: #172129 !important;
}

.mw-te-artist-body strong {
    color: #40515b !important;
}


/* Hover sehr subtil */
.mw-te-artist-card:hover {
    transform: translateY(-3px);
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* MOBILE */
@media (max-width: 620px) {

    .mw-te-artist-grid {
        gap: 34px !important;
    }

    .mw-te-artist-body {
        margin-top: -6px;
        padding: 18px 12px 26px;
    }

    .mw-te-artist-portrait img {
        -webkit-mask-image: radial-gradient(
            circle at center,
            #000 0%,
            #000 65%,
            rgba(0,0,0,.97) 71%,
            rgba(0,0,0,.80) 78%,
            rgba(0,0,0,.48) 85%,
            rgba(0,0,0,.18) 91%,
            transparent 100%
        );

        mask-image: radial-gradient(
            circle at center,
            #000 0%,
            #000 65%,
            rgba(0,0,0,.97) 71%,
            rgba(0,0,0,.80) 78%,
            rgba(0,0,0,.48) 85%,
            rgba(0,0,0,.18) 91%,
            transparent 100%
        );
    }
}
/* =========================================================
   MOST WANTED – HARMONIC FOOTER
   Übergang aus dem neuen Tattoo-Berlin-Farbkonzept
========================================================= */

body.mw-new-home .mw-footer {
    position: relative;

    /* exakt dort starten, wo unser letzter Seitenverlauf endet */
    background:
        radial-gradient(
            circle at 74% 5%,
            rgba(0, 174, 239, 0.055),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #172229 0%,
            #162127 9%,
            #141e24 20%,
            #121b20 36%,
            #10171c 55%,
            #0e1519 72%,
            #0c1216 88%,
            #0a0f12 100%
        ) !important;

    color: #e6eaec !important;

    /* keine sichtbare Kante zur letzten Section */
    border-top: 0 !important;
}


/* alten blauen Lichtfleck viel subtiler machen */
body.mw-new-home .mw-footer::before {
    top: -180px !important;
    width: 760px !important;
    height: 430px !important;

    background: rgba(0, 174, 239, 0.045) !important;
    filter: blur(125px) !important;
}


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

body.mw-new-home .mw-footer-top {
    border-bottom: 1px solid rgba(199, 211, 217, 0.12) !important;
}


/* Headline nicht hartweiß */
body.mw-new-home .mw-footer-brand h2 {
    color: #edf0f1 !important;
}


/* Beschreibung wärmer / weicher */
body.mw-new-home .mw-footer-brand p {
    color: #aab5bb !important;
}


/* Kicker */
body.mw-new-home .mw-footer .mw-home-kicker,
body.mw-new-home .mw-footer-label {
    color: #00aeef !important;
}


/* Kontaktbutton nicht als weißer Fremdkörper */
body.mw-new-home .mw-footer .mw-home-info-button {
    background: rgba(215, 222, 225, 0.10) !important;
    color: #edf1f2 !important;

    border: 1px solid rgba(215, 222, 225, 0.28) !important;

    box-shadow: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}


body.mw-new-home .mw-footer .mw-home-info-button:hover,
body.mw-new-home .mw-footer .mw-home-info-button:focus-visible {
    background: #00aeef !important;
    border-color: #00aeef !important;
    color: #10171c !important;

    transform: translateY(-2px);
}


/* =========================================================
   EISBÄREN / CLUB-KARTE
========================================================= */

body.mw-new-home .mw-footer-club a {
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.025),
            rgba(0,174,239,.025)
        ) !important;

    border-color: rgba(0,174,239,.18) !important;

    box-shadow:
        0 16px 40px rgba(0,0,0,.10);
}


body.mw-new-home .mw-footer-club a:hover {
    border-color: rgba(0,174,239,.55) !important;

    box-shadow:
        0 18px 42px rgba(0,0,0,.16);
}


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

body.mw-new-home .mw-footer-column h3 {
    color: #dde3e6 !important;
}


body.mw-new-home .mw-footer-hours span,
body.mw-new-home .mw-footer-links span,
body.mw-new-home .mw-footer-column address,
body.mw-new-home .mw-footer-navigation a {
    color: #909da4 !important;
}


body.mw-new-home .mw-footer-hours strong,
body.mw-new-home .mw-footer-links strong {
    color: #d9e0e3 !important;
}


/* Links */
body.mw-new-home .mw-footer-navigation a:hover,
body.mw-new-home .mw-footer-links a:hover,
body.mw-new-home .mw-footer-text-link:hover {
    color: #00aeef !important;
}


/* =========================================================
   SOCIAL / UNTERER FOOTER
========================================================= */

body.mw-new-home .mw-footer-social-row {
    border-top-color: rgba(199,211,217,.10) !important;
}


body.mw-new-home .mw-footer-bottom {
    border-top: 1px solid rgba(199,211,217,.10) !important;
}


body.mw-new-home .mw-footer-bottom p {
    color: #718087 !important;
}


body.mw-new-home .mw-footer-counter span {
    color: #77868d !important;
}


body.mw-new-home .mw-footer-counter strong {
    color: #00aeef !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    body.mw-new-home .mw-footer {
        background:
            radial-gradient(
                circle at 65% 2%,
                rgba(0,174,239,.045),
                transparent 34%
            ),
            linear-gradient(
                180deg,
                #172229 0%,
                #141f25 18%,
                #111a1f 42%,
                #0e1519 68%,
                #0a0f12 100%
            ) !important;
    }
}
/* =========================================================
   FINAL SECTION -> FOOTER
   unteren Rand exakt auf Footer-Farbe auslaufen lassen
========================================================= */

.mw-te-final {
    position: relative;
}

/* Die letzten Pixel der Tattoo-Seite werden auf eine
   einheitliche Farbe gebracht, damit der Footer nahtlos anschließt */
.mw-te-final::after {
    content: "";
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 220px;

    pointer-events: none;

    background: linear-gradient(
        180deg,
        rgba(23, 34, 41, 0) 0%,
        rgba(23, 34, 41, 0.20) 25%,
        rgba(23, 34, 41, 0.52) 50%,
        rgba(23, 34, 41, 0.82) 75%,
        #172229 100%
    );

    z-index: 0;
}

/* Inhalt bleibt über dem Übergang */
.mw-te-final > .mw-te-shell {
    position: relative;
    z-index: 1;
}

/* =========================================================
   INTRO-BILD KOMPAKTER
   Desktop: bewusst etwa halb so hoch wie zuvor.
   Das Bild bleibt unverzerrt und wird nur per object-fit beschnitten.
========================================================= */
@media (min-width: 901px) {
    .mw-te-intro-grid {
        align-items: center;
    }

    .mw-te-intro-visual {
        min-height: 0 !important;
        height: 320px !important;
        align-self: center;
    }

    .mw-te-intro-visual img {
        width: 100%;
        height: 100% !important;
        min-height: 0 !important;
        object-fit: cover;
        object-position: center;
    }
}

/* 2026-09-07: Tattoo Berlin - dunkle Schrift auf hellen Flaechen = echtes Schwarz */
.mw-tattoo-epic .mw-te-intro .mw-te-lead,
.mw-tattoo-epic .mw-te-center-heading h2,
.mw-tattoo-epic .mw-te-center-heading p,
.mw-tattoo-epic .mw-te-copy h2,
.mw-tattoo-epic .mw-te-copy p,
.mw-tattoo-epic .mw-te-process-card h3,
.mw-tattoo-epic .mw-te-process-card p,
.mw-tattoo-epic .mw-te-artists .mw-te-center-heading h2,
.mw-tattoo-epic .mw-te-artists .mw-te-center-heading p,
.mw-tattoo-epic .mw-te-artist-card,
.mw-tattoo-epic .mw-te-artist-body h3,
.mw-tattoo-epic .mw-te-artist-body strong,
.mw-tattoo-epic .mw-te-blog-card,
.mw-tattoo-epic .mw-te-blog-card h3,
.mw-tattoo-epic .mw-te-blog-card p,
.mw-tattoo-epic .mw-te-quality .mw-te-center-heading h2,
.mw-tattoo-epic .mw-te-quality-grid h3,
.mw-tattoo-epic .mw-te-quality-grid p,
.mw-tattoo-epic .mw2-detail-heading h2{
    color:#000000 !important;
    -webkit-text-fill-color:#000000 !important;
}

/* 2026-09-07: Tattoo Berlin - Journal heading/text stay white on dark section, desktop + mobile */
.mw-tattoo-epic .mw-te-journal .mw-te-center-heading h2,
.mw-tattoo-epic .mw-te-journal .mw-te-center-heading p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}