header::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('/assets/images/header-bg.jpg');
    background-size: cover;
    background-position: center;
    opacity: 0;
    z-index: 0;
}

.section {
    position: relative;
    overflow: hidden;
    padding: 150px 0;
}

.section-bg {
    position: absolute;
    inset: 0;
    background-image: url('/assets/images/nature-bg.jpg');
    background-size: cover;
    background-position: center;
    will-change: transform;
    transform: scale(1.2);
}

.section::after {
    content: "";
    position: absolute;
    bottom: -40px;
    left: 0;
    width: 100%;
    height: 200px;

    background-color: #16a34a;

    -webkit-mask-image: url('/assets/images/wave-mask.png');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    -webkit-mask-position: center;

    mask-image: url('/assets/images/wave-mask.png');
    mask-repeat: no-repeat;
    mask-size: cover;
    mask-position: center;
}

.section-content {
    position: relative;
}