.hero{
    position: relative;
    min-height: 60svh;
    display: grid;
    align-items: flex-start;
    background: url("../assets/hero.webp") center / cover no-repeat;
    overflow: hidden;
}

.hero::after{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,.80));
    z-index: 1;
    }

.hero-content{
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    box-sizing: border-box;
    padding: var(--gutter);
}

.hero-subtitle{
    font-style: italic;
    opacity: .92;
    max-width: 60ch;
}

.hero-content h1, .hero-content p{
    color: rgba(255,255,255,.92);
}

.hero-subtitle{
    color: rgba(255,255,255,.82);
}

/* ----- Hero — Pages internes (menu & contact) ----- */
.hero--menu,
.hero--team {
    background: url("../assets/nature.webp") center / cover no-repeat;
    min-height: 20svh;
}

body[data-theme="night"] .hero--menu,
body.is-night-mode .hero--menu,
body[data-theme="night"] .hero--team,
body.is-night-mode .hero--team {
    background: url("../assets/space.webp") center / cover no-repeat;
    min-height: 20svh;
}

.hero--menu .hero-content,
.hero--team .hero-content {
    align-items: flex-start;
}

.hero--menu::after,
.hero--team::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,.80));
    z-index: 1;
}