:root{
    --svc-blue:#07182d;
    --svc-blue2:#0b315d;
    --svc-orange:#ff5a18;
    --svc-cream:#f2ede2;
    --svc-white:#fffdf8;
}

body{
    padding-top:0 !important;
    background:var(--svc-blue) !important;
}

.svc-page{
    overflow:hidden;
    background:var(--svc-cream);
    color:var(--svc-blue);
}


/* ============================================================
   HEADER — STESSO LINGUAGGIO HOME
   ============================================================ */

.site-header{
    position:fixed !important;

    top:24px !important;
    left:50% !important;
    right:auto !important;

    transform:translateX(-50%) !important;

    width:calc(100% - 150px) !important;
    max-width:1500px !important;

    height:30px !important;
    min-height:30px !important;

    padding:0 14px !important;

    background:rgba(255,248,226,.67) !important;

    border:1px solid rgba(255,255,255,.20) !important;
    border-radius:8px !important;

    backdrop-filter:blur(10px);

    z-index:99999 !important;
}

.site-header .brand{
    height:30px !important;

    display:flex !important;
    align-items:center !important;
}

.site-header .brand-logo{
    width:30px !important;
    height:30px !important;

    padding:0 !important;

    object-fit:contain !important;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}

.site-header .brand h1{
    margin:0 0 0 10px !important;

    font-size:13px !important;

    line-height:1 !important;

    white-space:nowrap !important;
}

.site-header .brand p,
.site-header .header-btn{
    display:none !important;
}

@media(min-width:901px){

    .site-header nav{
        position:absolute !important;

        left:50% !important;
        top:50% !important;

        transform:translate(-50%,-50%) !important;

        display:flex !important;

        align-items:center !important;

        gap:36px !important;

        margin:0 !important;
    }

    .site-header nav a{
        padding:0 !important;

        font-size:13px !important;

        line-height:1 !important;
    }

}


/* ============================================================
   HERO
   ============================================================ */

.svc-hero{
    min-height:100vh;

    padding:
        135px
        clamp(28px,5vw,90px)
        95px;

    background:var(--svc-cream);
}

.svc-hero-label{
    margin-bottom:40px;

    color:var(--svc-orange);

    font-size:11px;

    font-weight:900;

    letter-spacing:.2em;
}

.svc-title-mask{
    overflow:hidden;

    padding-bottom:20px;
}

.svc-title{
    margin:0;

    font-size:clamp(105px,18vw,300px);

    line-height:.72;

    letter-spacing:-.075em;

    font-weight:900;

    white-space:nowrap;
}

.svc-title .letter{
    display:inline-block;

    transform:translateY(110%);

    opacity:0;

    transition:
        transform 1.25s cubic-bezier(.16,1,.3,1),
        opacity .8s ease;

    transition-delay:calc(var(--i) * 75ms);
}

.svc-title.show .letter{
    transform:translateY(0);

    opacity:1;
}

.svc-hero-bottom{
    width:min(760px,100%);

    margin:
        95px
        0
        0
        auto;
}

.svc-hero-bottom h2{
    margin:0 0 20px;

    font-size:clamp(34px,4vw,64px);

    line-height:.95;

    letter-spacing:-.045em;
}

.svc-hero-bottom p{
    margin:0;

    font-size:16px;

    line-height:1.6;
}


/* ============================================================
   MACRO
   ============================================================ */

.svc-duo{
    display:grid;

    grid-template-columns:1fr 1fr;

    background:var(--svc-cream);
}

.svc-duo-card{
    min-height:440px;

    padding:
        35px
        clamp(28px,4vw,65px);

    display:flex;

    flex-direction:column;

    justify-content:space-between;
}

.svc-duo-card > span{
    font-size:11px;

    letter-spacing:.18em;
}

.svc-duo-card h2{
    margin:0 0 26px;

    font-size:clamp(60px,7vw,120px);

    line-height:.80;

    letter-spacing:-.065em;
}

.svc-duo-card p{
    margin:0;

    max-width:470px;

    font-size:15px;

    line-height:1.45;
}

.svc-orange{
    background:var(--svc-orange);

    color:var(--svc-blue);
}

.svc-blue{
    background:var(--svc-blue);

    color:#fff;
}


/* ============================================================
   INTRO
   ============================================================ */

.svc-intro{
    padding:
        130px
        clamp(28px,5vw,90px)
        100px;

    background:var(--svc-blue);

    color:#fff;
}

.svc-eyebrow{
    display:block;

    margin-bottom:22px;

    color:var(--svc-orange);

    font-size:11px;

    font-weight:900;

    letter-spacing:.2em;
}

.svc-big-title{
    margin:0;

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

    line-height:.80;

    letter-spacing:-.065em;
}


/* ============================================================
   SERVICE ROWS
   ============================================================ */

.svc-row{
    min-height:100vh;

    padding:
        100px
        clamp(28px,5vw,90px);

    display:grid;

    grid-template-columns:.8fr 1.25fr;

    align-items:center;

    gap:clamp(45px,7vw,130px);

    background:var(--svc-blue);

    color:#fff;
}

.svc-row-reverse{
    grid-template-columns:1.25fr .8fr;
}

.svc-row-reverse .svc-copy{
    order:2;
}

.svc-row-reverse .svc-image{
    order:1;
}

.svc-copy > span{
    display:block;

    margin-bottom:35px;

    color:var(--svc-orange);

    font-size:11px;

    letter-spacing:.18em;
}

.svc-copy h2{
    margin:0 0 30px;

    font-size:clamp(42px,4.6vw,78px);

    line-height:.90;

    letter-spacing:-.05em;
}

.svc-copy p{
    max-width:580px;

    margin:0;

    color:rgba(255,255,255,.70);

    font-size:16px;

    line-height:1.65;
}

.svc-image{
    height:min(76vh,780px);

    margin:0;

    overflow:hidden;
}

.svc-image img{
    width:100%;

    height:100%;

    object-fit:cover;

    transform:scale(1.06);

    transition:
        transform 1.3s cubic-bezier(.16,1,.3,1);
}

.svc-row:hover .svc-image img{
    transform:scale(1);
}


/* ============================================================
   PROCESS
   ============================================================ */

.svc-process{
    padding:
        135px
        clamp(28px,5vw,90px);

    background:var(--svc-cream);

    color:var(--svc-blue);
}

.svc-process-head p{
    width:min(600px,100%);

    margin:
        40px
        0
        85px
        auto;

    font-size:17px;

    line-height:1.55;
}

.svc-process-grid{
    display:grid;

    grid-template-columns:1fr 1.15fr 1fr;

    align-items:end;

    gap:20px;
}

.svc-process-card{
    position:relative;

    height:530px;

    margin:0;

    overflow:hidden;
}

.svc-process-tall{
    height:690px;
}

.svc-process-card img{
    width:100%;

    height:100%;

    object-fit:cover;
}

.svc-process-card figcaption{
    position:absolute;

    left:18px;
    bottom:18px;

    padding:8px 12px;

    background:rgba(7,24,45,.88);

    color:#fff;

    font-size:10px;

    letter-spacing:.15em;
}


/* ============================================================
   OTHER
   ============================================================ */

.svc-other{
    padding:
        130px
        clamp(28px,5vw,90px);

    background:var(--svc-orange);

    color:var(--svc-blue);
}

.svc-other-title > span{
    display:block;

    margin-bottom:30px;

    font-size:11px;

    font-weight:900;

    letter-spacing:.2em;
}

.svc-other-title h2{
    margin:0 0 80px;

    font-size:clamp(70px,10vw,160px);

    line-height:.76;

    letter-spacing:-.07em;
}

.svc-other-image{
    height:min(76vh,820px);

    margin:0;

    overflow:hidden;
}

.svc-other-image img{
    width:100%;

    height:100%;

    object-fit:cover;
}


/* ============================================================
   WORK
   ============================================================ */

.svc-work{
    padding:
        135px
        clamp(28px,5vw,90px)
        150px;

    background:var(--svc-cream);

    color:var(--svc-blue);
}

.svc-steps{
    position:relative;

    margin-top:110px;

    padding-top:44px;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:45px;

    border-top:
        1px solid
        rgba(7,24,45,.18);
}

.svc-progress{
    position:absolute;

    top:-2px;
    left:0;

    width:100%;
    height:3px;

    background:var(--svc-orange);

    transform:scaleX(0);

    transform-origin:left;

    transition:
        transform 2s cubic-bezier(.16,1,.3,1);
}

.svc-progress.show{
    transform:scaleX(1);
}

.svc-steps article > span{
    color:var(--svc-orange);

    font-size:11px;

    letter-spacing:.15em;
}

.svc-steps h3{
    margin:
        30px
        0
        18px;

    font-size:clamp(27px,2.5vw,43px);
}

.svc-steps p{
    margin:0;

    color:rgba(7,24,45,.68);

    font-size:14px;

    line-height:1.55;
}


/* ============================================================
   CTA
   ============================================================ */

.svc-cta{
    padding-top:120px;

    background:#050f1e;

    color:#fff;
}

.svc-cta-copy{
    padding:
        0
        clamp(28px,5vw,90px)
        90px;
}

.svc-cta-copy > span{
    display:block;

    margin-bottom:25px;

    color:var(--svc-orange);

    font-size:11px;

    letter-spacing:.2em;
}

.svc-cta h2{
    margin:0;

    font-size:clamp(70px,10vw,165px);

    line-height:.78;

    letter-spacing:-.07em;
}

.svc-cta p{
    margin:
        35px
        0
        0;

    color:rgba(255,255,255,.70);

    font-size:16px;
}

.svc-cta-link{
    height:44px;

    padding:
        0
        clamp(28px,5vw,90px);

    display:flex;

    align-items:center;

    justify-content:space-between;

    background:var(--svc-orange);

    color:var(--svc-blue);

    text-decoration:none;

    font-size:11px;

    font-weight:900;

    letter-spacing:.2em;
}

.svc-arrow{
    font-size:22px;

    animation:
        svcArrow
        1.3s
        ease-in-out
        infinite;
}

@keyframes svcArrow{

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

    50%{
        transform:translateX(10px);
    }
}


/* ============================================================
   REVEALS
   ============================================================ */

.reveal{
    opacity:0;

    transform:translateY(70px);

    transition:
        opacity 1.15s ease,
        transform 1.15s cubic-bezier(.16,1,.3,1);
}

.reveal.visible{
    opacity:1;

    transform:translateY(0);
}


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

@media(max-width:900px){

    .site-header{
        width:calc(100% - 40px) !important;
    }

    .svc-hero{
        padding:
            110px
            20px
            70px;
    }

    .svc-title{
        font-size:clamp(72px,22vw,145px);

        white-space:normal;
    }

    .svc-duo{
        grid-template-columns:1fr;
    }

    .svc-duo-card{
        min-height:300px;
    }

    .svc-intro,
    .svc-row,
    .svc-process,
    .svc-other,
    .svc-work{
        padding:
            85px
            20px;
    }

    .svc-row,
    .svc-row-reverse{
        min-height:0;

        grid-template-columns:1fr;

        gap:35px;
    }

    .svc-row-reverse .svc-copy,
    .svc-row-reverse .svc-image{
        order:initial;
    }

    .svc-image{
        height:500px;
    }

    .svc-process-grid{
        grid-template-columns:1fr;
    }

    .svc-process-card,
    .svc-process-tall{
        height:500px;
    }

    .svc-steps{
        grid-template-columns:1fr;

        gap:55px;

        padding:
            0
            0
            0
            28px;

        border-top:0;

        border-left:
            1px solid
            rgba(7,24,45,.18);
    }

    .svc-progress{
        top:0;
        left:-2px;

        width:3px;
        height:100%;

        transform:scaleY(0);

        transform-origin:top;
    }

    .svc-progress.show{
        transform:scaleY(1);
    }

    .svc-cta{
        padding-top:80px;
    }

    .svc-cta-copy{
        padding:
            0
            20px
            65px;
    }

    .svc-cta-link{
        padding:
            0
            20px;
    }

}




/* ==== SERVICOS FINAL CORRECTIONS START ==== */


/* ----------------------------------------------------------
   REMODELAÇÕES — evita taglio della parola nel blocco blu
   ---------------------------------------------------------- */

.svc-duo-card.svc-blue h2{
    font-size:clamp(48px,5.7vw,98px) !important;
    line-height:.84 !important;
    letter-spacing:-.055em !important;
    max-width:100% !important;
}


/* ----------------------------------------------------------
   SERVIZI — meno spazio blu vuoto
   ---------------------------------------------------------- */

.svc-row{
    min-height:82vh !important;

    padding-top:72px !important;
    padding-bottom:72px !important;
}


/* ----------------------------------------------------------
   FOTO — manteniamo presenza forte senza allungare la pagina
   ---------------------------------------------------------- */

.svc-image{
    height:min(68vh,700px) !important;
}


/* ----------------------------------------------------------
   PROCESSO — leggermente più compatto
   ---------------------------------------------------------- */

.svc-process{
    padding-top:110px !important;
    padding-bottom:110px !important;
}


/* ----------------------------------------------------------
   COME TRABALHAMOS — riduce spazio prima della CTA
   ---------------------------------------------------------- */

.svc-work{
    padding-bottom:95px !important;
}

.svc-steps{
    margin-top:85px !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media(max-width:900px){

    .svc-row{
        min-height:0 !important;

        padding-top:70px !important;
        padding-bottom:70px !important;
    }

    .svc-image{
        height:460px !important;
    }

    .svc-work{
        padding-bottom:75px !important;
    }

}


/* ==== SERVICOS FINAL CORRECTIONS END ==== */


/* =========================================================
   FIX MOBILE - FOTO SERVICOS SEMPRE VISIBILI
   Desktop mantiene il reveal originale
   ========================================================= */
@media(max-width:900px){

    .svc-image.reveal,
    .svc-process-card.reveal,
    .svc-other-image.reveal{
        opacity:1 !important;
        visibility:visible !important;
        transform:none !important;
    }

}