.mainTitle {
    opacity: 0;
    transform: translateY(50px);
    transition: 0.3s;
    animation: fadeIn 1.5s 0.3s forwards;
}

.text {
    opacity: 0;
    transform: translateY(50px);
    transition: 0.3s;
    animation: fadeIn 1.5s 0.6s forwards;
}

.arrow {
    opacity: 0;
    transform: translateY(50px);
    transition: 0.3s;
    animation: fadeIn 1.5s 0.9s forwards;
}

@keyframes fadeIn {
    from {
        transform: translateY(50px);
        opacity: 0;
    }

    to {
        transform: translateY(0px);
        opacity: 1;
    }
}

.flashStyle {
    width: 150vw;
    left: -25vw;
    height: 1px;
    z-index: -1;
    position: relative;
    transform: rotate(-20deg);
    box-shadow: 0px 200px 180px 13px #C7C7C7;
}

.flashStyle.a {
    top: -100px
}

.flashStyle.b {
    top: 1700px
}

.flashStyle.c {
    top: 700px
}

section.title h1 {
    font-size: 60px;
    font-weight: 900;
    line-height: 1.1;
}

section.title .left {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
}

section.title .left p {
    font-size: 21px;
    line-height: 1.7;
    color: var(--fontSecund);
    font-weight: 500;
}

@keyframes floatAnimation {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-15px) rotate(2deg);
    }

    100% {
        transform: translateY(0px);
    }
}

section.title .right {
    animation: fadeIn 1.5s forwards, floatAnimation 7s ease-in-out infinite;
    border-top: 1px solid #ffffff4a;
    border-left: 1px solid #ffffff4a;
    border-right: 1px solid #2222224a;
    border-bottom: 1px solid #4444444a;
    width: 600px;
    border-radius: 79% 21% 79% 21% / 79% 21% 79% 21%;
}

section.title .left a {
    margin-top: 200px;
    width: max-content;
}

section.title {
    padding-top: 280px;
    padding-bottom: 200px;
}

section.cases .container,
section.about .container {
    gap: 130px;
}

section.about {
    padding-top: 50px;
    padding-bottom: 250px;
}

section h2 {
    font-size: 22px;
    width: 250px;
    text-align: center;
    padding: 16px;
    color: var(--fontSecund);
    border-radius: 100px;
}

section.cases .casesList .imgItem:before,
section h2,
.glass {
    background: linear-gradient(.13turn, #ffffff02, #ffffff04, #ffffff07, #ffffff09, #ffffff12, #ffffff20, #ffffff35);
    border-top: 1px solid #ffffff4a;
    border-left: 1px solid #ffffff4a;
    border-right: 1px solid #4444444a;
    border-bottom: 1px solid #4444444a;
    -webkit-backdrop-filter: brightness(80%) blur(3px);
    backdrop-filter: brightness(80%) blur(3px);
}

section.about p {
    font-size: 18px;
    line-height: 1.9;
    font-weight: 500;
    max-width: 1050px;
    text-align: justify;
    color: var(--fontSecund);
}

section>.container,
footer>.container {
    margin: auto;
    padding-inline: 20px;
}

section.cases .casesList {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
}

section.cases {
    padding-top: 50px;
    padding-bottom: 150px;
}

section.cases .casesList .imgItem {
    padding: 30px;
    box-sizing: border-box;
    height: 360px;
    justify-content: space-between;
    width: 100%;
    border-radius: 25px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 18px;
    position: relative;
    transition: 0.16s;
    cursor: pointer;
    transform: translateY(0px);
    opacity: 0;
    overflow: hidden;
    text-decoration: none;
    color: var(--fontPrimary);
}

section.cases .casesList .imgItem.visivel {
    animation: fadeIn 0.5s forwards;
}

section.cases .casesList .imgItem:after {
    content: "";
    display: flex;
    width: 100%;
    height: 33%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(0deg, #000000ee, #000000aa, #00000001);
}

section.cases .casesList .imgItem:before {
    content: "";
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 25px;
    -webkit-backdrop-filter: brightness(50%) blur(2px);
    backdrop-filter: brightness(50%) blur(2px);
    opacity: 0;
    transition: 0.12s;
}

section.cases .casesList .imgItem .infos {
    gap: 4px;
}

section.cases .casesList .imgItem:hover .more {
    transform: translateY(0px);
    opacity: 1;
}

section.cases .casesList .imgItem .more {
    font-size: 17px;
    font-weight: 500;
    transform: translateY(-35px);
    opacity: 0;
    transition: 0.18s;
}

section.cases .casesList .imgItem:hover {
    margin-top: -20px;
    filter: grayscale(1);
}


section.cases .casesList .imgItem:hover:before {
    opacity: 1;
}


section.cases .casesList .imgItem p {
    font-weight: 600;
    font-size: 24px;
}

section.cases .casesList .imgItem b,
section.cases .casesList .imgItem p {
    z-index: 1;
}

section.cases .container {
    max-width: 1300px;
}

.patrocinios h3 {
    font-size: 25px;
    font-weight: 500;
    color: var(--fontSecund);
    text-align: center;
    margin-bottom: 50px;
}

.patrocinios img {
    max-width: 500px;
    border-radius: 30px;
}

.patrocinioItem {
    gap: 70px;
    opacity: 0;
    transition: 0.16s;
}

.patrocinioItem.visivel {
    opacity: 1;
}

.patrocinioItem.invert {
    flex-direction: row-reverse;
}

.patrocinioItem.invert>img {
    transform: translateX(130px);
    transition: 0.16s;
}

.patrocinioItem.visivel.invert>img {
    transform: translateX(0px);
}

.patrocinioItem>img {
    transform: translateX(-130px);
    transition: 0.16s;
}

.patrocinioItem.visivel>img {
    transform: translateX(0px);
}

.patrocinioItem.invert>div {
    transform: translateX(-130px);
    transition: 0.16s;
}

.patrocinioItem.visivel.invert>div {
    transform: translateX(0px);
}

.patrocinioItem>div {
    transform: translateX(130px);
    transition: 0.16s;
}

.patrocinioItem.visivel>div {
    transform: translateX(0px);
}

section.patrocinios .container {
    gap: 130px;
}

section.patrocinios .container>div {
    gap: 90px;
}

section.about br {
    display: none;
}

@media (max-width: 1500px) {
    section .container {
        width: initial;
    }
}

@media (max-width: 1200px) {
    section.title .container {
        flex-direction: column-reverse;
        gap: 50px;
    }
}

@media (max-width: 950px) {
    .casesList {
        flex-direction: column;
        gap: 35px !important;
    }

    section.cases .casesList .imgItem {
        background-position: top;
        opacity: 1;
    }

    .patrocinioItem.invert {
        flex-direction: column;
    }

    .patrocinioItem {
        flex-direction: column;
    }

    .patrocinioItem>img {
        margin: auto;
    }
}

@media (max-width: 650px) {
    .video {
        width: 100% !important;
        height: 960px !important;
        filter: brightness(80%);
        left: 0px;
    }

    section.about br {
        display: flex;
    }


    section.patrocinios h3 {
        display: none;
    }

    section.title h1 {
        font-size: 50px;
    }

    section.patrocinios .patrocinioItem:before {
        content: attr(data-title);
        text-align: center;
        font-size: 25px;
        font-weight: 500;
        color: var(--fontSecund);
        
    }

    section.patrocinios .container div {
        gap: 30px;
    }

    section.title .right {
        border-radius: 0px;
        animation: none;
        border: none;
        position: absolute;
        top: 0px;
        height: 100%;
        object-fit: cover;
    }

    section.title .fadeIni {
        position: absolute;
        background: red;
        width: 100%;
        height: 200px;
        background: linear-gradient(0deg, #00000000, #000000aa, #000000);
        z-index: 1;
        top: 0;
        left: 0;
    }

    .flashStyle {
        display: none;
    }

    .flashStyle.c {
        display: initial;
        box-shadow: 0px 200px 30px 2px #C7C7C7;
        transform: rotate(60deg);
        top: 1000px;
        left: 20vw;
    }

    section.title .fade {
        position: absolute;
        background: red;
        width: 100%;
        top: 960px;
        transform: translateY(-100%);
        height: 300px;
        background: linear-gradient(0deg, #000000, #000000aa, #00000000);
        z-index: 1;
        bottom: 0;
        left: 0;
    }

    section.title .left {
        z-index: 2;
    }

    section.title .left p.text {
        color: var(--fontPrimary);
    }

    section.title .left a {
        margin-top: 200px;
        margin-left: auto;
    }

    section.title .left svg stop {
        stop-color: var(--fontPrimary);
    }

    h2 {
        z-index: 2;
    }

    section.cases .casesList {
        flex-direction: row;
        overflow-x: scroll;
        overflow-y: visible;
        padding-top: 20px;
    }


    section.cases .casesList .imgItem {
        height: 400px;
        min-width: 300px;
        padding: 20px;
    }

    section.cases .container {
        padding-inline: 0px !important;
    }
}

@media (max-width: 500px) {
    .patrocinioItem>img {
        width: 100%;
    }

    h1.mainTitle {
        font-size: 50px !important;
    }
}
