/* =========================================================
   ALICERCE - HOME MOBILE FINALE
   Solo telefono/tablet. Desktop invariato.
   ========================================================= */

@media (max-width:900px){

    html,
    body{
        width:100% !important;
        max-width:100% !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       HERO - TITOLO DENTRO LO SCHERMO
       ===================================================== */

    .alice-intro-stage .alice-cine-title{
        width:calc(100% - 32px) !important;
        max-width:520px !important;

        font-size:clamp(34px,9.2vw,44px) !important;
        line-height:.94 !important;
        letter-spacing:-.045em !important;
    }

    .alice-intro-stage .alice-title-fixed{
        width:100% !important;
        max-width:100% !important;

        white-space:normal !important;
    }

    .alice-intro-stage .alice-title-dynamic{
        margin-top:12px !important;

        font-size:11px !important;
        line-height:1.25 !important;
    }


    /* =====================================================
       FASCIA SERVIZI
       ===================================================== */

    .alice-services-band{
        height:88px !important;
    }

    .alice-services-track{
        gap:18px !important;
        animation-duration:32s !important;
    }

    .alice-services-track span{
        font-size:23px !important;
        letter-spacing:-.025em !important;
    }

    .alice-services-track i{
        font-size:14px !important;
    }


    /* =====================================================
       O QUE FAZEMOS
       NIENTE ESPLOSIONE LETTERE SU MOBILE
       ===================================================== */

    #servicos-principais{
        padding:22px 16px 38px !important;
    }

    #servicos-principais .home-services-head{
        width:100% !important;
        max-width:100% !important;

        margin:0 auto 24px !important;
        padding:0 !important;

        overflow:visible !important;
    }

    #servicos-principais .oqf-stage{
        width:100% !important;
        min-height:145px !important;

        padding:24px 0 8px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        overflow:visible !important;
    }

    #servicos-principais .home-services-head .oqf-title{
        display:block !important;

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

        margin:0 !important;
        padding:0 !important;

        color:#fff !important;

        font-size:clamp(32px,9.5vw,40px) !important;
        line-height:.94 !important;
        letter-spacing:-.05em !important;

        text-align:center !important;
        white-space:nowrap !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }

    #servicos-principais .oqf-char,
    #servicos-principais .oqf-space{
        display:inline-block !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }

    #servicos-principais .oqf-arrow{
        display:none !important;
    }

    #servicos-principais .oqf-copy{
        width:100% !important;
        max-width:100% !important;

        margin:0 !important;
        padding:0 !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }

    #servicos-principais .oqf-copy .small-title{
        margin:0 0 10px !important;
        padding-left:24px !important;

        opacity:1 !important;
        visibility:visible !important;

        font-size:11px !important;
        line-height:1.1 !important;

        transform:none !important;
    }

    #servicos-principais .oqf-copy p{
        width:100% !important;
        max-width:100% !important;

        margin:0 !important;

        opacity:1 !important;
        visibility:visible !important;

        font-size:13px !important;
        line-height:1.55 !important;

        text-transform:none !important;

        transform:none !important;
    }


    /* =====================================================
       CARD SERVIZI
       FOTO SEMPRE VISIBILE SU TELEFONO
       ===================================================== */

    #servicos-principais .alicerce-service-grid{
        width:100% !important;

        grid-template-columns:1fr !important;

        gap:18px !important;

        margin-top:16px !important;
    }

    #servicos-principais
    .home-services-grid article.service-reveal,
    #servicos-principais
    .home-services-grid article.service-reveal.is-visible{
        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }

    #servicos-principais .alicerce-service-card,
    #servicos-principais .alicerce-service-card:hover,
    #servicos-principais .alicerce-service-card.is-open,
    #servicos-principais .alicerce-service-card:focus-visible{
        min-height:0 !important;

        padding:0 0 24px !important;

        border-radius:24px !important;

        overflow:hidden !important;

        transform:none !important;

        cursor:default !important;
    }


    /* FOTO */

    #servicos-principais .alicerce-service-media,
    #servicos-principais .alicerce-service-card:hover .alicerce-service-media,
    #servicos-principais .alicerce-service-card.is-open .alicerce-service-media,
    #servicos-principais .alicerce-service-card:focus-visible .alicerce-service-media{
        position:relative !important;

        inset:auto !important;

        z-index:1 !important;

        display:block !important;

        width:100% !important;
        height:210px !important;

        opacity:1 !important;
        visibility:visible !important;

        clip-path:none !important;

        border-radius:24px 24px 0 0 !important;
    }

    #servicos-principais .alicerce-service-media img,
    #servicos-principais .alicerce-service-card:hover .alicerce-service-media img,
    #servicos-principais .alicerce-service-card.is-open .alicerce-service-media img,
    #servicos-principais .alicerce-service-card:focus-visible .alicerce-service-media img{
        position:absolute !important;

        inset:0 !important;

        display:block !important;

        width:100% !important;
        height:100% !important;

        object-fit:cover !important;
        object-position:center !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }


    /* VIA LE LINEETTE VECCHIE */

    #servicos-principais .alicerce-service-card::before,
    #servicos-principais .alicerce-service-card > .service-mark{
        display:none !important;
    }


    /* TESTO CARD */

    #servicos-principais .alicerce-service-card h3,
    #servicos-principais .alicerce-service-card:hover h3,
    #servicos-principais .alicerce-service-card.is-open h3,
    #servicos-principais .alicerce-service-card:focus-visible h3{
        position:relative !important;

        z-index:3 !important;

        max-width:none !important;

        margin:22px 22px 10px !important;

        color:#07182d !important;

        font-size:clamp(23px,6.6vw,29px) !important;
        line-height:1.05 !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }

    #servicos-principais .alicerce-service-card p,
    #servicos-principais .alicerce-service-card:hover p,
    #servicos-principais .alicerce-service-card.is-open p,
    #servicos-principais .alicerce-service-card:focus-visible p{
        position:relative !important;

        z-index:3 !important;

        max-width:none !important;

        margin:0 22px !important;

        color:rgba(7,24,45,.76) !important;

        font-size:15px !important;
        line-height:1.55 !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }


    /* NUMERO SOPRA LA FOTO */

    #servicos-principais .alicerce-service-number{
        top:16px !important;
        right:16px !important;

        z-index:5 !important;

        padding:6px 8px !important;

        border-radius:999px !important;

        background:rgba(7,24,45,.72) !important;

        color:#fff !important;
    }


    /* VER TRABALHO */

    #servicos-principais .alicerce-service-view,
    #servicos-principais .alicerce-service-card:hover .alicerce-service-view,
    #servicos-principais .alicerce-service-card.is-open .alicerce-service-view,
    #servicos-principais .alicerce-service-card:focus-visible .alicerce-service-view{
        position:relative !important;

        left:auto !important;
        bottom:auto !important;

        z-index:3 !important;

        display:flex !important;

        margin:18px 22px 0 !important;

        color:rgba(7,24,45,.60) !important;

        opacity:1 !important;
        visibility:visible !important;

        transform:none !important;
    }


    /* =====================================================
       CTA FINALE - TITOLO NON TAGLIATO
       ===================================================== */

    .cta.home-final-cta{
        width:100% !important;
        max-width:100% !important;

        margin:0 !important;

        padding:36px 18px 42px !important;

        gap:22px !important;

        overflow:hidden !important;
    }

    .home-final-cta-copy{
        width:100% !important;
        max-width:100% !important;
    }

    .home-final-cta-title,
    .cta.home-final-cta h2{
        width:100% !important;
        max-width:100% !important;

        margin:0 !important;

        font-size:clamp(32px,9.5vw,42px) !important;
        line-height:.98 !important;
        letter-spacing:-.04em !important;

        white-space:normal !important;
    }

    .home-final-cta p{
        max-width:100% !important;
    }

    .home-final-cta-btn{
        width:100% !important;

        justify-content:center !important;
    }
}


@media(max-width:520px){

    .alice-services-band{
        height:80px !important;
    }

    .alice-services-track span{
        font-size:21px !important;
    }

    #servicos-principais .alicerce-service-media,
    #servicos-principais .alicerce-service-card:hover .alicerce-service-media,
    #servicos-principais .alicerce-service-card.is-open .alicerce-service-media{
        height:195px !important;
    }
}