.page > .hero{
    position: relative;
    color: var(--white);
    background-color: var(--black);
    padding: 240px 0 120px;
    display: flex;
    align-items: center;
}

.page .hero .hero__container{
    position: relative;
    padding-block: 40px 60px;
}

.page .hero .hero__container .hero__title{
    font-size: clamp(2.25rem, 2.5vw, 3.5rem);
    line-height: 120%;
    font-weight: 400;
    color: var(--white);
    font-family: var(--font-family-primary);
}

@media all and (max-width: 810px){
    .page .hero{
        padding: 180px 0 60px;
    }
}

@media (max-width: 650px){
    
    .page > .hero > .hero__container{
        padding-block: 20px 25px;
    }
}

.page .info {
    padding: 80px 0;
}

.page .info .info__container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px 40px;
}

.page .info .info__wrapper{
    font-size: clamp(1.125rem, 1.5vw, 1.5rem);
    line-height: 1.3;
}

.page .text-media{
    padding: 80px 0;
    color: var(--black);
    background-color: var(--white);
}

.page .text-media:nth-child(even){
    background-color: var(--black);
    color: var(--white);
}

.page .text-media:nth-child(even) .text-media__container{
    grid-template-columns: 1fr 1.25fr;
}

.page .text-media:nth-child(even) .text-media__container .text-media__wrapper:first-child{
    order: 2;
}

.page .text-media .text-media__container{
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    justify-content: flex-start;
    align-items: center;
    gap: 40px 80px;
}

.page .text-media .text-media__wrapper{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
}

.page .text-media .text-media__wrapper__title{
    font-size: clamp(1.75rem, 2vw, 2.5rem);
    font-weight: 400;
    line-height: 1;
}

.page .text-media .text-media__wrapper__media {
    position: relative;
    width: 100%;
    overflow: hidden;
    aspect-ratio: 705/470;
    border-radius: 10px;
}

.page .text-media .text-media__wrapper img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.page .text-media .text-media__wrapper {
    font-size: clamp(1.125rem, 1.5vw, 1.25rem);
    line-height: 1.3;
}

@media all and (max-width: 1024px){
    .page .text-media .text-media__container{
        column-gap: 40px;
    }

    .page .info{
        padding: 40px 0;
    }

    .page .text-media{
        padding: 64px 0;
    }
}

@media all and (max-width: 810px){
    .page .text-media .text-media__container,
    .page .text-media:nth-child(even) .text-media__container{
        grid-template-columns: 1fr;
    }
    .page .text-media:nth-child(even) .text-media__container .text-media__wrapper:first-child{
        order: -1;
    }
    .page .text-media .text-media__wrapper{
        align-items: flex-start;
    }

}