.hero {
    position: relative;
    min-height: 650px;
    overflow: hidden;
}

.hero-image {
    position: absolute;
    inset: 0;
    background-image: url('/themes/default/images/hero-kurzgeschichten.jpg');
    background-size: cover;
    background-position: center;
}

.hero-overlay {
    position: absolute;
    inset: 0;

    background: linear-gradient(
        90deg,
        rgba(255,255,255,0.95) 0%,
        rgba(255,255,255,0.85) 35%,
        rgba(255,255,255,0.20) 65%,
        rgba(255,255,255,0.00) 100%
    );
}

.hero-content {
    position: relative;
    z-index: 10;
    max-width: 600px;
    padding-top: 120px;
    color:#08214f;
}


.hero .container {
    position: relative;
    z-index: 10;
}

.hero h1 {
    font-size: 58px;
    line-height: 1.1;

    margin-bottom: 25px;

    color: #0f172a;
}

.hero p {
    font-size: 22px;
    line-height: 1.7;

    margin-bottom: 35px;

    color: #475569;
}