main {
    padding-top: 45px;
}
#hero {
    background-color: var(--black);
    background-image: url('../../../images/2025/about/hero-bg.jpg');
    background-image: image-set(url('../../../images/2025/about/hero-bg.jpg') 1x, url('../../../images/2025/about/hero-bg@2x.jpg') 2x);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 54px 0;
    width: 1280px;
    max-width: calc(100% - 30px);
    border-radius: 15px;
    margin-bottom: 45px;
}

#hero .title {
    font-size: 56px;
}

#hero p {
    font-size: 16px;
    line-height: 1.625;
    max-width: 600px;
}

@media screen and (max-width: 992px) {
    #hero p br {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    #hero p {
        font-size: 16px;
        line-height: 24px;
    }
}

@media screen and (max-width: 567px) {
    #hero {
        background-image: url('../../../images/2025/about/hero-bg-m.jpg');
        background-image: image-set(url('../../../images/2025/about/hero-bg-m.jpg') 1x, url('../../../images/2025/about/hero-bg-m@2x.jpg') 2x);
        padding: 18px 0 87px;
        margin-bottom: 35px;
    }

    #hero .title {
       font-size: 47px;
       margin-bottom: 12px;
    }

    #hero .title img {
       width: 124px;
    }
}