.home-hero-v5 {
    isolation: isolate;
}

.home-living-scene {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.home-living-scene canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.home-hero-v5:has(.home-living-scene)::before,
.home-hero-v5:has(.home-living-scene)::after,
.home-hero-v5:has(.home-living-scene) .home-vista-vignette,
.home-hero-v5:has(.home-living-scene) .home-hero-noise,
.home-hero-v5:has(.home-living-scene) .home-map-lines {
    z-index: 1;
    pointer-events: none;
}

.home-hero-v5 .home-vista-layout, .home-hero-v5 .home-stats-wrap {
    position: relative;
    z-index: 2;
}

.home-motion-toggle {
    position: absolute;
    right: 16px;
    bottom: 12px;
    z-index: 3;
    border: 1px solid #ffffff55;
    border-radius: 20px;
    padding: 8px 13px;
    background: #101c30df;
    color: #fff;
    font-family: inherit;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    min-width: 132px;
    cursor: pointer;
}

.home-motion-toggle:hover {
    background: #213750;
}

.home-motion-toggle:focus-visible {
    outline: 3px solid #91ddff;
    outline-offset: 3px;
}

html[data-season="automne"] .home-hero-v5 .home-vista-vignette {
    background: radial-gradient(circle at 73% 22%, rgba(164, 186, 204, .09), transparent 35%);
}

@media (max-width: 700px) {
    .home-motion-toggle {
        bottom: 4px;
        right: 8px;
        padding: 6px 10px;
        font-size: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-living-scene, .home-motion-toggle {
        display: none !important;
    }
}

/* Keep the readability veil full height; the base hero used a square glow. */
.home-hero-v5:has(.home-living-scene)::before {
    aspect-ratio: auto;
    height: 100%;
}

.home-hero-v5 > .home-living-weather {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.home-hero-v5 > .home-living-sun {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.home-hero-v5:has(.home-living-scene) .home-vista-layout,
.home-hero-v5:has(.home-living-scene) .home-stats-wrap {
    z-index: 3;
}

.home-hero-v5 .home-motion-toggle {
    z-index: 4;
}

@media (prefers-reduced-motion: reduce) {
    .home-living-weather, .home-living-sun {
        display: none !important;
    }
}
