/* =========================================================
   ALICERCE — O QUE FAZEMOS
   ANIMAZIONE EDITORIALE / CINEMATICA
   ========================================================= */


/* SEZIONE */
#servicos-principais,
.alicerce-services-cinematic{

    position:relative !important;

    overflow:hidden !important;

    padding-top:0 !important;

    background:
        linear-gradient(
            115deg,
            #050914 0%,
            #07182d 46%,
            #123b70 100%
        ) !important;
}


/* =========================================================
   TESTATA DELLA SEZIONE
   ========================================================= */

#servicos-principais .home-services-head,
.alicerce-services-cinematic .home-services-head{

    position:relative !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;

    padding:
        0
        clamp(28px,6vw,105px)
        30px !important;
}


/* =========================================================
   AREA DEL TITOLO O QUE FAZEMOS
   ========================================================= */

.oqf-stage{

    position:relative;

    width:100%;

    min-height:330px;

    display:flex;

    align-items:center;
    justify-content:center;

    overflow:hidden;
}


/* TITOLO GRANDE */

.oqf-title{

    position:relative;

    z-index:2;

    margin:0 !important;

    width:100%;

    display:flex;

    align-items:center;
    justify-content:center;

    white-space:nowrap;

    color:#fff;

    font-size:
        clamp(68px,9vw,150px);

    line-height:.84;

    letter-spacing:-.065em;

    font-weight:800;

    text-align:center;

    text-transform:uppercase;

    transform-origin:center center;

    will-change:
        transform;
}


/* SINGOLA LETTERA */

.oqf-char{

    position:relative;

    display:inline-block;

    will-change:
        transform,
        opacity;
}


/* SPAZI FRA LE PAROLE */

.oqf-space{

    display:inline-block;

    width:.28em;
}


/* =========================================================
   FRECCIA ARANCIONE A DESTRA
   ========================================================= */

.oqf-arrow{

    position:absolute;

    right:clamp(18px,3.5vw,64px);
    top:56px;

    width:22px;
    height:92px;

    opacity:.95;

    pointer-events:none;

    animation:
        oqfArrowMove
        1.45s
        ease-in-out
        infinite;
}


.oqf-arrow::before{

    content:"";

    position:absolute;

    left:50%;
    top:0;

    width:2px;
    height:73px;

    transform:
        translateX(-50%);

    background:#ff5a18;
}


.oqf-arrow::after{

    content:"";

    position:absolute;

    left:50%;
    bottom:0;

    width:0;
    height:0;

    transform:
        translateX(-50%);

    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-top:13px solid #ff5a18;
}


@keyframes oqfArrowMove{

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

    50%{
        transform:translateY(12px);
    }

}


/* =========================================================
   TESTI SUBITO SOTTO
   ========================================================= */

.oqf-copy{

    position:relative;

    z-index:4;

    width:100%;

    margin-top:-16px;

    padding:0 !important;

    opacity:0;

    transform:
        translateY(38px);
}


/* SERVIÇOS PRINCIPAIS */

.oqf-copy .small-title{

    display:block !important;

    width:auto !important;

    margin:
        0
        0
        14px !important;

    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;

    background:transparent !important;

    color:#ff5a18 !important;

    font-size:
        clamp(18px,2vw,30px) !important;

    line-height:1 !important;

    letter-spacing:.13em !important;

    font-weight:400 !important;

    text-transform:uppercase !important;
}


/* FRASE */

.oqf-copy p{

    width:100% !important;
    max-width:1180px !important;

    margin:0 !important;

    color:rgba(255,255,255,.86) !important;

    font-size:
        clamp(13px,1.15vw,17px) !important;

    line-height:1.5 !important;

    letter-spacing:.025em !important;

    text-transform:uppercase;
}


/* =========================================================
   CARD SUBITO DOPO
   ========================================================= */

#servicos-principais .home-services-grid,
#servicos-principais .alicerce-service-grid,
.alicerce-services-cinematic .home-services-grid,
.alicerce-services-cinematic .alicerce-service-grid{

    margin-top:
        28px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:800px){

    .oqf-stage{

        min-height:
            250px;
    }


    .oqf-title{

        white-space:normal;

        font-size:
            clamp(50px,14vw,76px);

        line-height:.90;

        letter-spacing:-.055em;
    }


    .oqf-arrow{

        right:10px;
        top:32px;

        height:70px;
    }


    .oqf-arrow::before{

        height:53px;
    }


    .oqf-copy{

        margin-top:-8px;
    }


    .oqf-copy .small-title{

        font-size:
            17px !important;
    }


    .oqf-copy p{

        font-size:
            12px !important;

        text-transform:none;
    }

}