/* =====================================
   Kontrast auf dem helleren Markenmotiv
   Das Hintergrundbild bleibt sichtbar,
   Inhalte erhalten nur ruhige Rauchglas-Zonen.
===================================== */

.site-header__brand-link,
.site-header__hours {
    position: relative;
    isolation: isolate;
}

.site-header__brand-link::before,
.site-header__hours::before {
    content: "";

    position: absolute;
    z-index: -1;

    border: 1px solid rgba(212, 192, 138, .09);
    border-radius: 28px;

    background: radial-gradient(
        ellipse at center,
        rgba(0, 10, 5, .4) 0%,
        rgba(0, 8, 4, .23) 58%,
        rgba(0, 8, 4, .05) 100%
    );
    box-shadow:
        0 12px 30px rgba(0, 0, 0, .18),
        inset 0 1px 0 rgba(255, 255, 255, .035);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);

    pointer-events: none;
}

.site-header__brand-link::before {
    inset: -5px -8px;
}

.site-header__hours::before {
    inset: -7px -10px;
}

.site-header__graphic {
    position: relative;
    z-index: 3;
}

.site-header__hours {
    z-index: 2;
}

.site-header__brand-image {
    filter:
        brightness(1.1)
        saturate(1.08)
        drop-shadow(0 3px 3px rgba(0, 0, 0, .82))
        drop-shadow(0 0 12px rgba(0, 0, 0, .48));
}

.site-header__date,
.site-header__time,
.site-header__time span,
.site-header__status {
    text-shadow:
        0 2px 2px rgba(0, 0, 0, .98),
        0 0 13px rgba(0, 0, 0, .92);
}

.site-header__date,
.site-header__time,
.site-header__time span {
    color: #E8E4DA;
}

.site-header__status .mb-bhi-open,
.site-header--open .site-header__manual-status {
    color: #70E983;
}

.site-header__status .mb-bhi-closed,
.site-header--closed .site-header__manual-status {
    color: #F07C72;
}

.site-header--appointment .site-header__manual-status {
    color: #61E875;
}

/* Grüne Markenakzente statt goldener Schrift. */
.hero__icon i,
.works__eyebrow,
.specialties__card i,
.reviews__stars,
.reviews__card > i,
.tattoo-story__eyebrow {
    color: #61E875;
    text-shadow:
        0 0 12px rgba(40, 200, 64, .34),
        0 2px 5px rgba(0, 0, 0, .9);
}

.hero__about,
.works-container,
.studio-container,
.specialties-container,
.reviews-container,
.tattoo-story-container,
.site-footer__inner,
.legal-page__card {
    background: linear-gradient(
        145deg,
        rgba(0, 12, 6, .24),
        rgba(0, 6, 3, .14)
    );
    box-shadow:
        0 20px 52px rgba(0, 0, 0, .25),
        inset 0 1px 0 rgba(255, 255, 255, .035);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.works-container[data-works-gallery] {
    background:
        radial-gradient(circle at 10% 12%, rgba(40, 200, 64, .09), transparent 30%),
        radial-gradient(circle at 92% 82%, rgba(40, 200, 64, .055), transparent 32%),
        linear-gradient(145deg, rgba(0, 12, 6, .28), rgba(0, 6, 3, .18));
}

.hero__usp-item,
.specialties__card,
.reviews__card,
.reviews__summary,
.works__instagram-link,
.studio__text,
.tattoo-story-form__submit {
    background: linear-gradient(
        145deg,
        rgba(0, 13, 6, .4),
        rgba(0, 7, 3, .27)
    );
    box-shadow:
        0 13px 30px rgba(0, 0, 0, .24),
        inset 0 1px 0 rgba(255, 255, 255, .035);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}

.hero__usp-item:hover {
    background: linear-gradient(
        145deg,
        rgba(0, 18, 8, .48),
        rgba(0, 8, 4, .34)
    );
}

.hero__icon {
    background: rgba(0, 10, 5, .46);
    box-shadow:
        0 7px 18px rgba(0, 0, 0, .32),
        inset 0 1px 0 rgba(255, 255, 255, .04);
}

.hero__usp h3,
.hero__usp p,
.specialties__card h3,
.specialties__card p,
.reviews__card,
.studio__text,
.tattoo-story__intro,
.site-footer__inner {
    text-shadow: 0 2px 6px rgba(0, 0, 0, .9);
}

@media (max-width: 767px) {
    .site-header__brand-link::before {
        inset: -4px -7px;
        border-radius: 18px;
    }

    .site-header__hours::before {
        inset: -6px -7px;
        border-radius: 16px;
    }

    .site-header__brand-link::before,
    .site-header__hours::before {
        -webkit-backdrop-filter: blur(1.5px);
        backdrop-filter: blur(1.5px);
    }

    .hero__about,
    .works-container,
    .studio-container,
    .specialties-container,
    .reviews-container,
    .tattoo-story-container,
    .site-footer__inner {
        background: linear-gradient(
            145deg,
            rgba(0, 12, 6, .3),
            rgba(0, 6, 3, .2)
        );
    }
}

@media (prefers-reduced-transparency: reduce) {
    .site-header__brand-link::before,
    .site-header__hours::before,
    .hero__about,
    .works-container,
    .studio-container,
    .specialties-container,
    .reviews-container,
    .tattoo-story-container,
    .site-footer__inner {
        background: rgba(0, 9, 4, .58);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}