/* Blaupausen-Hero fuer beproba und sanaudit: dunkle Flaeche, Strangschema rechts, Anmerkungen als Text.
 * Rueckbau: Arbeitsordner/beproba_Ueberarbeitung_2026-10-16/ZURUECKSETZEN_Hero_Blaupause.ps1
 */
.beproba-page .beproba-landing-hero {
    background:
        radial-gradient(ellipse at 74% 42%, #1d3656 0%, #15263d 52%, #101d2f 100%);
    color: #fff;
}

/* Feines Raster wie auf Plandruck */
.beproba-page .beproba-landing-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 28px 28px;
}

/* Gleicher weicher Bilduebergang wie bei sanaudit, ohne zusaetzliche Abdunklung. */
.beproba-page .beproba-landing-hero::before {
    content: none;
}

.beproba-page .beproba-landing-hero .beproba-landing-grid {
    z-index: 2;
    /* Gleicher Titelbeginn auf beiden Seiten, unabhaengig von der Textlaenge. */
    align-items: start;
}

.hero-blueprint {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.hero-blueprint-stage {
    position: absolute;
    top: 50%;
    right: max(16px, calc((100% - 1280px) / 2));
    height: calc(100% + 40px);
    width: auto;
    max-width: 78%;
    aspect-ratio: 7281 / 4008;
    transform: translateY(-50%);
}

.hero-blueprint-stage img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}

/* Rechts scharf, nach links verschwimmend und auslaufend */
.hero-blueprint-stage .hb-sharp {
    opacity: 0.92;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 16%, rgba(0, 0, 0, 0.55) 30%, #000 44%);
    mask-image: linear-gradient(90deg, transparent 0%, transparent 16%, rgba(0, 0, 0, 0.55) 30%, #000 44%);
}

.hero-blueprint-stage .hb-soft {
    opacity: 0.45;
    filter: blur(2px);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.6) 10%, #000 22%, rgba(0, 0, 0, 0.4) 36%, transparent 46%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.6) 10%, #000 22%, rgba(0, 0, 0, 0.4) 36%, transparent 46%);
}
/* sanaudit: gleiche Blaupause, Anmerkungen in Mint */
.hero-blueprint-mint .hero-blueprint-notes {
    color: #7fd3bd;
}

.beproba-page .beproba-landing-hero,
.sanaudit-page .sanaudit-hero {
    min-height: 440px;
    padding: 46px 0 50px;
}

.sanaudit-page .sanaudit-hero {
    background:
        radial-gradient(ellipse at 74% 42%, #1d3656 0%, #15263d 52%, #101d2f 100%);
}

.sanaudit-page .sanaudit-hero .beproba-landing-title {
    color: #ffffff;
}

.sanaudit-page .sanaudit-hero .beproba-landing-text {
    color: rgba(255, 255, 255, 0.9);
}

.sanaudit-page .sanaudit-eyebrow {
    color: #7fd3bd;
}

.sanaudit-page .sanaudit-hero-topics {
    color: rgba(255, 255, 255, 0.72);
}

.sanaudit-page .sanaudit-hero .beproba-primary-button {
    color: #10283a !important;
}

/* Schmale Bildschirme: Schema dezent im Hintergrund, ohne Anmerkungen */
@media (max-width: 980px) {
    .hero-blueprint-stage {
        top: auto;
        bottom: 8px;
        right: -8%;
        height: auto;
        width: 116%;
        max-width: none;
        transform: none;
    }

    .hero-blueprint-stage .hb-sharp {
        opacity: 0.22;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .hero-blueprint-stage .hb-soft,
    .hero-blueprint-stage .hb-notes {
        display: none;
    }

}