.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

html.has-anim {
    .js-anim {
        --a-duration: .65s;
        --a-ease: ease;
        --a-distance: 24px;
        --a-delay: 0ms;

        opacity: 0;
        transform: translate3d(0, var(--a-distance), 0);
        transition:
            opacity var(--a-duration) var(--a-ease) var(--a-delay),
            transform var(--a-duration) var(--a-ease) var(--a-delay);
        will-change: opacity, transform;
    }

    .js-anim.anim-fade {
        transform: none;
    }

    .js-anim.anim-fade-up {
        /* default */
    }

    .js-anim.anim-fade-down {
        transform: translate3d(0, calc(var(--a-distance) * -1), 0);
    }

    .js-anim.anim-fade-left {
        transform: translate3d(calc(var(--a-distance) * -1), 0, 0);
    }

    .js-anim.anim-fade-right {
        transform: translate3d(var(--a-distance), 0, 0);
    }

    .js-anim.is-inview {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.has-anim .js-anim {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

.sobre-history {
    padding-block: 6rem;
    background: var(--color-white);

    .sobre-history__title {
        text-align: center;
        font-size: clamp(2rem, 2.2vw + 1.2rem, 3.25rem);
        font-weight: 700;
        line-height: 1.1;
        margin-bottom: 4rem;
        color: var(--color-red);
        text-wrap: balance;
    }

    .sobre-history__items {
        display: flex;
        flex-direction: column;
        gap: 3.5rem;
    }

    .sobre-history__item {
        padding-block: 0;
    }

    .sobre-history__headline {
        * {
            font-size: 1.5rem;
            line-height: 1.4;
            color: var(--color-blue);
        }

        b, strong {
            font-weight: 700;
        }
    }

    .sobre-history__description {
        margin-top: 1rem;

        p + p {
            margin-top: 1rem;
        }

        * {
            font-size: 1.125rem;
            line-height: 1.65;
            color: #474747;
        }

        b, strong {
            font-weight: 700;
            color: var(--color-blue);
        }
    }

    .sobre-history__media {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 1.5rem;

        img {
            position: relative;
            z-index: 1;
            max-inline-size: 34rem;
            inline-size: 100%;
            block-size: auto;
            display: block;
        }
    }

    .sobre-history__item:nth-child(even) {
        .sobre-history__media {
            justify-content: flex-start;
        }
    }

    .sobre-history__item:last-child {
        background-color: #F6F6F6;
        margin-inline: calc(50% - 50vw);
        padding-inline: calc(50vw - 50%);
        padding-block: 3.5rem;
    }

    @media (width <= 992px) {
        padding-block: 4rem;

        .sobre-history__title {
            margin-bottom: 2.5rem;
        }

        .sobre-history__items {
            gap: 2.5rem;
        }

        .sobre-history__media {
            justify-content: center;
            padding: 1rem;

            &::before {
                inline-size: min(22rem, 92%);
            }

            img {
                max-inline-size: 28rem;
                margin-inline: auto;
            }
        }

        .sobre-history__item:nth-child(even) {
            .sobre-history__media {
                justify-content: center;
            }
        }

        .sobre-history__item:last-child {
            padding-block: 2.5rem;
        }
    }
}

.sobre-highlight {
    padding-block: 6rem;

    .sobre-highlight__description {
        * {
            font-size: 1.15rem;
            line-height: 1.5;
            color: #474747;
        }

        b, strong {
            font-weight: 700;
            color: var(--color-blue);
        }
    }

    .sobre-highlight__headline {
        * {
            font-size: 1.275rem;
            line-height: 1.5;
            color: var(--color-blue);
        }

        b, strong {
            font-weight: 700;
        }
    }

    .sobre-highlight__description > *:last-child,
    .sobre-highlight__headline > *:last-child {
        margin-bottom: 0;
    }

    @media (width >= 992px) {
        .row {
            --bs-gutter-x: 0;
            align-items: stretch;
        }

        .row > .col-lg-6 {
            padding-inline: 4rem;
            display: flex;
            align-items: center;
        }

        .row > .col-lg-6:first-child {
            padding-inline-start: 0;
        }

        .row > .col-lg-6 + .col-lg-6 {
            padding-inline-end: 0;
            border-left: 1px solid var(--color-blue);
        }
    }

    @media (width <= 992px) {
        padding-block: 4rem;
    }
}

.sobre-diversification {
    padding-block: 6rem;

    .sobre-diversification__headline {
        font-size: 1.375rem;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--color-blue);
        margin-bottom: 1.5rem !important;
    }

    .sobre-diversification__title {
        font-size: clamp(2rem, 1.6vw + 1.1rem, 2rem);
        font-weight: 700;
        line-height: 1.1;
        margin-bottom: 0;
        color: var(--color-blue);
        text-wrap: balance;
    }

    .sobre-diversification__description {
        p + p {
            margin-top: 1rem;
        }

        * {
            font-size: 1.125rem;
            line-height: 1.75;
            color: #474747;
        }

        b, strong {
            font-weight: 700;
            color: #2A2A2A;
        }
    }

    .sobre-diversification__description > *:last-child {
        margin-bottom: 0;
    }

    @media (width >= 992px) {
        .row {
            --bs-gutter-x: 0;
            align-items: stretch;
        }

        .row > [class*='col-'] {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .row > .col-lg-5 {
            padding-inline-end: 4rem;
        }

        .row > .col-lg-7 {
            padding-inline-start: 4rem;
            border-left: 1px solid var(--color-blue);
        }
    }

    @media (width <= 992px) {
        padding-block: 4rem;

        .sobre-diversification__headline {
            margin-bottom: 1rem !important;
        }
    }
}

.sobre-numbers {
    padding-block: 6rem;
    background-color: #E9EEF7;
    border-bottom: 6px solid var(--color-blue);

    .sobre-numbers__image {
        display: flex;
        justify-content: center;

        img {
            display: block;
            max-inline-size: 40rem;
            inline-size: 100%;
            block-size: auto;
        }
    }

    .sobre-numbers__description {
        p + p {
            margin-top: 1rem;
        }

        * {
            font-size: 1.375rem;
            line-height: 1.55;
            color: var(--color-blue);
        }

        b, strong {
            font-weight: 700;
        }
    }

    .sobre-numbers__description > *:last-child {
        margin-bottom: 0;
    }

    @media (width <= 992px) {
        padding-block: 4rem;
        border-bottom-width: 4px;

        .sobre-numbers__description * {
            font-size: 1.25rem;
        }
    }
}

.sobre-hero {
    background-color: var(--color-blue);
    color: var(--color-white);
    overflow: clip;
    position: relative;
    isolation: isolate;
    background: var(--color-blue) url('data:image/svg+xml,<svg width="346" height="525" viewBox="0 0 346 525" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 506.798V207.672C0 195.312 6.70751 183.925 17.5181 177.934L330.87 4.26202C341.173 -1.44878 353.699 -1.4188 363.976 4.34127L673.624 177.904C684.355 183.918 691 195.261 691 207.562V506.464C691 532.575 662.828 548.973 640.138 536.051C522.463 469.031 353.719 373.792 347.445 373.792C341.158 373.792 169.786 469.424 50.7171 536.465C28.0298 549.239 0 532.834 0 506.798Z" fill="%23EE2D22"/></svg>') no-repeat right center / contain;

    @media (width <= 992px) {
        padding-block-start: 40px;
        background-image: none;
    }

    &:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
        background: url('data:image/svg+xml,<svg width="404" height="332" viewBox="0 0 404 332" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M-290 509.298V210.172C-290 197.812 -283.292 186.425 -272.482 180.434L40.8695 6.76202C51.1734 1.05122 63.6992 1.0812 73.9756 6.84127L383.624 180.404C394.355 186.418 401 197.761 401 210.062V508.964C401 535.075 372.828 551.473 350.138 538.551C232.463 471.531 63.7188 376.292 57.4446 376.292C51.1576 376.292 -120.214 471.924 -239.283 538.965C-261.97 551.739 -290 535.334 -290 509.298Z" stroke="%23EE2D22" stroke-width="5"/></svg>') no-repeat left bottom;
    }


    .row {
        align-items: stretch;
        min-height: 45vh;
    }

    .sobre-hero__title {
        font-size: 2.5rem;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 0;
        background-color: var(--color-blue);
        text-wrap: balance;

        @media (width <= 992px) {
            text-align: center;
            font-size: 2rem;

            br {
                display: none;
            }
        }
    }

    .sobre-hero__media {
        max-width: 100%;
        height: auto;
        margin-inline: auto;
        object-fit: contain;
    }

}


.sobre-purpose {
    padding-block: 6rem;

    .sobre-purpose__title {
        font-size: 2.5rem;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 0;
        color: var(--color-red);
        text-wrap: balance;
    }
    
    .col-12.col-lg-8 {
        border-left: 1px solid #eee;
        @media (width <= 992px) {
            border-left: none;
        }
    }

    .sobre-purpose__headline {
        padding-inline-start: 1.5rem;

        @media (width <= 992px) {
            padding-inline-start: 0;
        }

        b, strong {
            font-weight: 700;
            color: var(--color-blue);
        }
        * {
            font-size: 1.5rem;
            color: var(--color-blue);
            line-height: 1.5;
        }
    }

    .sobre-purpose__description {
        margin-top: 4rem;
        color: var(--color-black);
        b, strong {
            font-weight: 700;
            color: var(--color-blue);
        }

        * {
            font-size: 1.25rem;
            line-height: 1.5;
        }
    }
}

.sobre-mvv {
    padding-block: 6rem;
    background-color: #F6F6F6;
    
    *, *::before, *::after {
        box-sizing: border-box;
    }

    .row.gy-4{
        @media (width <= 992px) {
            gap: 2rem;
        }
    }
    .sobre-mvv__title {
        font-size: 1.75rem;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 1rem;
        color: var(--color-blue);
        text-wrap: balance;
        
        @media (width <= 992px) {
            text-align: center;
        }
    }

    p {
        font-size: 1rem;
        line-height: 1.5;
        color: #474747;
        b, strong {
            font-weight: 700;
            color: var(--color-blue);
        }

        @media (width <= 992px) {
            text-align: center;
        }
    }

    .sobre-mvv__icon {
        margin-bottom: 1.5rem;

        @media (width <= 992px) {
            text-align: center;
        }

    }

    .sobre-mvv__values {
        margin-top: 4rem;
        display: flex;
        align-items: center;
        gap: 4rem;

        @media (width <= 992px) {
            flex-direction: column;
            gap: 2rem;
            h2 {
                text-align: center;
            }

            .sobre-mvv__icon {
                text-align: center;
            }
        }
    }


    .sobre-mvv__value-card {
        background-color: var(--color-white);
        padding: 3rem 1.5rem 1.5rem;
        border-radius: .5rem;
        height: 80%;

        .sobre-mvv__value-title {
            font-size: 1.25rem;
            font-weight: 700;
            line-height: 1.2;
            margin-bottom: 1rem;

            @media (width <= 992px) {
                text-align: center;
            }
        }

        .sobre-mvv__value-desc > * {
            font-size: .875rem;
            line-height: 1.25;
            color: #474747;
        }

    }
    
    .sobre-mvv__value-letter {
        font-size: 1.5rem;
        font-weight: 700;
        border-radius: 50%;
        background-color: var(--color-blue);
        color: var(--color-white);
        display: inline-flex;
        justify-content: center;
        align-items: center;
        block-size: 3rem;
        inline-size: 3rem;
        padding: 1rem;
        margin-left: 1.5rem;
        transform: translateY(50%);

        @media (width <= 992px) {
            margin-inline: auto;
            text-align: center;
            display: flex;
        }
    }
}


.sobre-video {
    --sobre-video-radius: 1.5rem;
    padding-block-end: 6rem;
    background: linear-gradient(to bottom, #F6F6F6 50%, #FFFFFF 50%);

    .sobre-video__frame,
    .ratio {
        max-inline-size: 72rem;
        margin-inline: auto;
        border-radius: var(--sobre-video-radius);
        overflow: hidden;
        background-color: #000;
        box-shadow: 0 18px 48px rgba(0, 0, 0, .14);

        aspect-ratio: 16 / 9;
        position: relative;
    }

    .sobre-video__poster {
        appearance: none;
        border: 0;
        padding: 0;
        margin: 0;
        inline-size: 100%;
        block-size: 100%;
        background: transparent;
        cursor: pointer;
        display: grid;
        place-items: center;
        position: absolute;
        inset: 0;

        img {
            inline-size: 100%;
            block-size: 100%;
            object-fit: cover;
            display: block;
            filter: saturate(1.02) contrast(1.02);
            transform: scale(1.01);
        }

        &:focus-visible {
            outline: 3px solid var(--color-blue);
            outline-offset: 4px;
        }
    }

    .sobre-video__play {
        inline-size: 4.5rem;
        block-size: 4.5rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, .92);
        position: absolute;
        display: grid;
        place-items: center;
        box-shadow: 0 14px 38px rgba(0, 0, 0, .18);

        &::before {
            content: '';
            inline-size: 0;
            block-size: 0;
            border-style: solid;
            border-width: .9rem 0 .9rem 1.35rem;
            border-color: transparent transparent transparent rgba(0, 0, 0, .65);
            margin-inline-start: .2rem;
        }
    }

    .sobre-video__player {
        iframe {
            position: absolute;
            inset: 0;
            inline-size: 100%;
            block-size: 100%;
            border: 0;
            display: block;
        }
    }

    .sobre-video__link {
        display: block;
        max-inline-size: 72rem;
        margin-inline: auto;
        border-radius: var(--sobre-video-radius);
        overflow: hidden;
        text-decoration: none;
        box-shadow: 0 18px 48px rgba(0, 0, 0, .14);

        &:focus-visible {
            outline: 3px solid var(--color-blue);
            outline-offset: 4px;
        }

        img {
            display: block;
            inline-size: 100%;
            block-size: auto;
        }
    }

    @media (width <= 992px) {
        --sobre-video-radius: 1rem;
        padding-block: 4rem;

        .sobre-video__play {
            inline-size: 4rem;
            block-size: 4rem;

            &::before {
                border-width: .8rem 0 .8rem 1.2rem;
            }
        }
    }
}