/* ==========================================
   VARIÁVEIS
========================================== */

:root{

    --azul-principal:#0b1622;
    --azul-secundario:#142536;
    --azul-terciario:#1d3449;

    --dourado:#d4af37;
    --dourado-hover:#bd9727;
    --dourado-claro:#ead78b;

    --branco:#ffffff;

    --cinza-fundo:#f8f9fb;
    --cinza-claro:#eef1f4;
    --cinza-borda:#dce1e6;
    --cinza-texto:#5b6570;

    --verde-whatsapp:#25d366;

    --sombra-suave:
    0 15px 40px rgba(11,22,34,.10);

    --sombra-media:
    0 20px 55px rgba(11,22,34,.18);

    --sombra-forte:
    0 30px 80px rgba(0,0,0,.32);

}


/* ==========================================
   RESET
========================================== */

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}


html{

    scroll-behavior:smooth;

}


body{

    font-family:
    "Segoe UI",
    Arial,
    Helvetica,
    sans-serif;

    color:#222;
    background:#fff;

    line-height:1.7;

}


img{

    max-width:100%;
    display:block;

}


a{

    text-decoration:none;

}


ul{

    list-style:none;

}


button,
input,
select,
textarea{

    font:inherit;

}


button{

    border:none;

}


section{

    scroll-margin-top:90px;

}


/* ==========================================
   TOPO
========================================== */

.topo-projeto{

    position:sticky;

    top:0;

    width:100%;

    z-index:1000;

    background:
    rgba(11,22,34,.97);

    backdrop-filter:
    blur(12px);

    box-shadow:
    0 4px 20px
    rgba(0,0,0,.25);

}


.topo-wrapper{

    width:92%;

    max-width:1450px;

    margin:auto;

    padding:
    15px 0;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

}


.logo-link{

    flex-shrink:0;

}


.logo-topo{

    width:auto;

    height:58px;

}


.menu-projeto ul{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:27px;

}


.menu-projeto a{

    position:relative;

    display:inline-block;

    color:#fff;

    font-size:.93rem;

    font-weight:500;

    padding:
    8px 0;

    transition:.3s;

}


.menu-projeto a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:0;

    height:2px;

    background:
    var(--dourado);

    transition:.3s;

}


.menu-projeto a:hover{

    color:
    var(--dourado);

}


.menu-projeto a:hover::after{

    width:100%;

}


.btn-voltar-topo{

    flex-shrink:0;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    padding:
    11px 21px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-size:.91rem;

    font-weight:700;

    transition:.3s;

}


.btn-voltar-topo:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-2px);

}


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

.hero-paineis-premium{

    position:relative;

    min-height:
    calc(100vh - 88px);

    overflow:hidden;

    background:

    linear-gradient(
        90deg,
        rgba(5,12,20,.94) 0%,
        rgba(5,12,20,.82) 48%,
        rgba(5,12,20,.60) 100%
    ),

    url("../assets/img/quadros-paineis/hero-quadros-paineis.jpg");

    background-size:cover;

    background-position:center;

    background-attachment:fixed;

}


.hero-paineis-premium::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    radial-gradient(
        circle at 18% 35%,
        rgba(212,175,55,.10),
        transparent 34%
    );

    pointer-events:none;

}


.hero-paineis-premium::after{

    content:"";

    position:absolute;

    left:0;

    right:0;

    bottom:0;

    height:170px;

    background:

    linear-gradient(
        to bottom,
        transparent,
        rgba(5,12,20,.55)
    );

    pointer-events:none;

}


.hero-overlay{

    position:relative;

    z-index:2;

    width:90%;

    max-width:1400px;

    min-height:
    calc(100vh - 88px);

    margin:auto;

    padding:
    75px 0 95px;

    display:grid;

    grid-template-columns:
    minmax(0,1.3fr)
    minmax(360px,460px);

    align-items:center;

    gap:70px;

}


/* ==========================================
   CONTEÚDO DO HERO
========================================== */

.hero-conteudo{

    color:#fff;

}


.tag-hero{

    display:inline-flex;

    align-items:center;

    padding:
    8px 16px;

    margin-bottom:24px;

    color:#111;

    background:
    var(--dourado);

    border-radius:50px;

    font-size:.76rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.4px;

    box-shadow:
    0 10px 30px
    rgba(212,175,55,.18);

}


.hero-conteudo h1{

    max-width:850px;

    margin-bottom:26px;

    font-size:
    clamp(3rem,5.4vw,5.25rem);

    line-height:1.03;

    letter-spacing:-2.3px;

    text-wrap:balance;

}


.hero-destaque{

    max-width:800px;

    margin-bottom:18px;

    color:
    var(--dourado-claro);

    font-size:
    clamp(1.15rem,2vw,1.4rem);

    font-weight:600;

    line-height:1.45;

}


.hero-conteudo > p:not(.hero-destaque){

    max-width:820px;

    margin-bottom:16px;

    color:#e1e6eb;

    font-size:1.08rem;

}


/* ==========================================
   SELOS DO HERO
========================================== */

.hero-selos{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    margin-top:30px;

}


.hero-selos span{

    display:inline-flex;

    align-items:center;

    gap:9px;

    padding:
    10px 14px;

    color:#fff;

    background:
    rgba(255,255,255,.08);

    border:
    1px solid
    rgba(255,255,255,.13);

    border-radius:9px;

    font-size:.91rem;

    backdrop-filter:
    blur(10px);

}


.hero-selos i{

    color:
    var(--dourado);

}


/* ==========================================
   BOTÕES DO HERO
========================================== */

.hero-botoes{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

    margin-top:32px;

}


.btn-hero-principal,
.btn-hero-secundario{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:54px;

    padding:
    14px 25px;

    border-radius:9px;

    font-weight:700;

    transition:.3s;

}


.btn-hero-principal{

    color:#111;

    background:
    var(--dourado);

}


.btn-hero-principal:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-3px);

}


.btn-hero-secundario{

    color:#fff;

    border:
    1px solid
    rgba(255,255,255,.55);

    background:
    rgba(255,255,255,.05);

    backdrop-filter:
    blur(8px);

}


.btn-hero-secundario:hover{

    color:
    var(--azul-principal);

    background:#fff;

    transform:
    translateY(-3px);

}


/* ==========================================
   FORMULÁRIO
========================================== */

.box-cadastro-projeto{

    position:relative;

    padding:
    34px;

    background:#fff;

    border-radius:20px;

    box-shadow:
    var(--sombra-forte);

}


.box-cadastro-projeto::before{

    content:"";

    position:absolute;

    top:0;

    left:30px;

    right:30px;

    height:4px;

    background:

    linear-gradient(
        90deg,
        var(--dourado),
        var(--dourado-claro)
    );

    border-radius:
    0 0 8px 8px;

}


.mini-tag-form{

    display:inline-block;

    color:
    var(--dourado-hover);

    font-size:.72rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.3px;

}


.box-cadastro-projeto h2{

    margin:
    7px 0 8px;

    color:
    var(--azul-principal);

    font-size:1.85rem;

    line-height:1.2;

}


.box-cadastro-projeto > p{

    margin-bottom:22px;

    color:
    var(--cinza-texto);

    font-size:.95rem;

}


/* ==========================================
   CAMPOS DO FORMULÁRIO
========================================== */

#form-orcamento-paineis{

    display:flex;

    flex-direction:column;

    gap:13px;

}


.campo-formulario label{

    display:block;

    margin-bottom:5px;

    color:
    var(--azul-principal);

    font-size:.79rem;

    font-weight:700;

}


.input-com-icone{

    position:relative;

}


.input-com-icone > i{

    position:absolute;

    top:50%;

    left:14px;

    transform:
    translateY(-50%);

    color:
    #8a949e;

    font-size:.92rem;

    pointer-events:none;

}


.campo-formulario input,
.campo-formulario select,
.campo-formulario textarea{

    width:100%;

    color:#1f2937;

    background:#fff;

    border:
    1px solid
    #d7dde3;

    border-radius:8px;

    outline:none;

    transition:.3s;

}


.campo-formulario input,
.campo-formulario select{

    height:48px;

    padding:
    0 14px 0 42px;

}


.campo-formulario textarea{

    min-height:105px;

    padding:
    13px 14px;

    resize:vertical;

}


.campo-formulario input::placeholder,
.campo-formulario textarea::placeholder{

    color:#9aa3ac;

}


.campo-formulario input:focus,
.campo-formulario select:focus,
.campo-formulario textarea:focus{

    border-color:
    var(--dourado);

    box-shadow:

    0 0 0 4px
    rgba(212,175,55,.13);

}


.btn-enviar-formulario{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    width:100%;

    min-height:52px;

    margin-top:4px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-weight:800;

    cursor:pointer;

    transition:.3s;

}


.btn-enviar-formulario:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-2px);

    box-shadow:
    0 12px 25px
    rgba(212,175,55,.22);

}


.aviso-formulario{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:7px;

    color:#7a848e;

    text-align:center;

    font-size:.72rem;

}


.aviso-formulario i{

    color:
    var(--dourado-hover);

}


/* ==========================================
   INDICADOR DE ROLAGEM
========================================== */

.indicador-scroll{

    position:absolute;

    z-index:4;

    left:50%;

    bottom:20px;

    transform:
    translateX(-50%);

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:4px;

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

    font-size:.72rem;

    text-transform:uppercase;

    letter-spacing:1px;

}


.indicador-scroll i{

    color:
    var(--dourado);

    animation:
    setaRolagem 1.7s
    infinite;

}


@keyframes setaRolagem{

    0%,
    100%{

        transform:
        translateY(0);

    }

    50%{

        transform:
        translateY(7px);

    }

}


/* ==========================================
   RESPONSIVO
========================================== */

@media(max-width:1180px){

    .menu-projeto ul{

        gap:17px;

    }


    .menu-projeto a{

        font-size:.84rem;

    }


    .hero-overlay{

        grid-template-columns:
        minmax(0,1fr)
        400px;

        gap:42px;

    }

}


@media(max-width:1024px){

    .menu-projeto{

        display:none;

    }


    .hero-paineis-premium{

        background-attachment:
        scroll;

    }


    .hero-overlay{

        grid-template-columns:
        1fr;

        padding:
        85px 0 100px;

    }


    .hero-conteudo{

        max-width:900px;

    }


    .box-cadastro-projeto{

        width:100%;

        max-width:680px;

    }

}


@media(max-width:768px){

    .topo-wrapper{

        width:92%;

        padding:
        12px 0;

    }


    .logo-topo{

        height:47px;

    }


    .btn-voltar-topo{

        padding:
        9px 15px;

        font-size:.84rem;

    }


    .hero-paineis-premium{

        min-height:auto;

        background-position:
        60% center;

    }


    .hero-overlay{

        min-height:auto;

        width:92%;

        padding:
        65px 0 95px;

    }


    .hero-conteudo h1{

        font-size:
        clamp(2.75rem,11vw,4rem);

        letter-spacing:-1.2px;

    }


    .hero-conteudo > p:not(.hero-destaque){

        font-size:1rem;

    }


    .hero-selos{

        display:grid;

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

    }


    .hero-selos span{

        width:100%;

    }


    .box-cadastro-projeto{

        padding:
        29px 23px;

    }

}


@media(max-width:520px){

    .logo-topo{

        height:42px;

    }


    .btn-voltar-topo i{

        display:none;

    }


    .tag-hero{

        font-size:.66rem;

        letter-spacing:1px;

    }


    .hero-conteudo h1{

        font-size:2.75rem;

    }


    .hero-selos{

        grid-template-columns:
        1fr;

    }


    .hero-botoes{

        flex-direction:column;

    }


    .btn-hero-principal,
    .btn-hero-secundario{

        width:100%;

    }


    .box-cadastro-projeto h2{

        font-size:1.6rem;

    }


    .indicador-scroll span{

        display:none;

    }

}

/* ==========================================
   ELEMENTOS GERAIS DAS SEÇÕES
========================================== */

.container{

    width:90%;

    max-width:1200px;

    margin:auto;

}


.tag-secao{

    display:inline-block;

    color:
    var(--dourado-hover);

    font-size:.76rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.5px;

}


.tag-secao::before{

    content:"";

    display:inline-block;

    width:32px;

    height:2px;

    margin-right:10px;

    vertical-align:middle;

    background:
    var(--dourado);

}


/* ==========================================
   VISÃO GERAL
========================================== */

.secao-visao-geral{

    position:relative;

    padding:
    110px 0;

    overflow:hidden;

    background:

    linear-gradient(
        180deg,
        #ffffff 0%,
        #f8f9fb 100%
    );

}


.secao-visao-geral::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.10),
        transparent 70%
    );

    pointer-events:none;

}


/* ==========================================
   INTRODUÇÃO
========================================== */

.intro-projeto-premium{

    position:relative;

    z-index:2;

    max-width:930px;

    margin:
    0 auto 62px;

    text-align:center;

}


.intro-projeto-premium h2{

    margin:
    13px 0 23px;

    color:
    var(--azul-principal);

    font-size:
    clamp(2.3rem,4vw,3.35rem);

    line-height:1.14;

    letter-spacing:-1.2px;

    text-wrap:balance;

}


.intro-projeto-premium p{

    margin-bottom:17px;

    color:
    var(--cinza-texto);

    font-size:1.04rem;

}


/* ==========================================
   GRID DE RESUMO
========================================== */

.grid-resumo-paineis{

    position:relative;

    z-index:2;

    display:grid;

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

    gap:23px;

}


/* ==========================================
   CARTÃO DE RESUMO
========================================== */

.resumo-painel-card{

    position:relative;

    min-height:410px;

    padding:
    34px 27px 30px;

    overflow:hidden;

    background:#fff;

    border:
    1px solid
    var(--cinza-borda);

    border-radius:18px;

    box-shadow:
    0 13px 35px
    rgba(11,22,34,.075);

    transition:
    transform .35s,
    box-shadow .35s,
    border-color .35s;

}


.resumo-painel-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:

    linear-gradient(
        90deg,
        var(--dourado),
        var(--dourado-claro)
    );

    transform:
    scaleX(0);

    transform-origin:left;

    transition:.4s;

}


.resumo-painel-card:hover{

    transform:
    translateY(-9px);

    border-color:
    rgba(212,175,55,.55);

    box-shadow:
    0 24px 55px
    rgba(11,22,34,.15);

}


.resumo-painel-card:hover::before{

    transform:
    scaleX(1);

}


/* ==========================================
   ÍCONE E NUMERAÇÃO
========================================== */

.icone-resumo{

    width:62px;

    height:62px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:26px;

    color:
    var(--dourado-hover);

    background:
    rgba(212,175,55,.13);

    border-radius:15px;

    font-size:1.65rem;

    transition:.35s;

}


.resumo-painel-card:hover .icone-resumo{

    color:#111;

    background:
    var(--dourado);

    transform:
    rotate(-4deg)
    scale(1.04);

}


.numero-resumo{

    position:absolute;

    top:22px;

    right:23px;

    color:
    rgba(11,22,34,.08);

    font-size:2.4rem;

    font-weight:900;

    line-height:1;

}


.resumo-painel-card h3{

    margin-bottom:13px;

    color:
    var(--azul-principal);

    font-size:1.35rem;

    line-height:1.25;

}


.resumo-painel-card > p{

    margin-bottom:20px;

    color:
    var(--cinza-texto);

    font-size:.94rem;

}


/* ==========================================
   LISTA DOS CARTÕES
========================================== */

.resumo-painel-card ul{

    display:flex;

    flex-direction:column;

    gap:9px;

}


.resumo-painel-card li{

    position:relative;

    padding-left:22px;

    color:#434d57;

    font-size:.88rem;

}


.resumo-painel-card li::before{

    content:"✓";

    position:absolute;

    left:0;

    top:0;

    color:
    var(--dourado-hover);

    font-weight:900;

}


/* ==========================================
   FAIXA DE INDICADORES
========================================== */

.faixa-indicadores-paineis{

    position:relative;

    z-index:2;

    display:grid;

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

    margin-top:58px;

    overflow:hidden;

    background:
    var(--azul-principal);

    border-radius:18px;

    box-shadow:
    var(--sombra-media);

}


.indicador-painel{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:16px;

    min-height:125px;

    padding:
    25px 20px;

    border-right:
    1px solid
    rgba(255,255,255,.10);

    transition:.3s;

}


.indicador-painel:last-child{

    border-right:none;

}


.indicador-painel:hover{

    background:
    var(--azul-secundario);

}


.indicador-painel > i{

    color:
    var(--dourado);

    font-size:1.9rem;

}


.indicador-painel strong{

    display:block;

    color:
    var(--dourado);

    font-size:1.35rem;

    line-height:1.2;

}


.indicador-painel span{

    display:block;

    margin-top:4px;

    color:#d4dbe2;

    font-size:.84rem;

}


/* ==========================================
   BLOCO INFORMATIVO
========================================== */

.bloco-informativo-paineis{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:
    78px
    minmax(0,1fr)
    auto;

    align-items:center;

    gap:27px;

    margin-top:40px;

    padding:
    32px 35px;

    color:#fff;

    background:

    linear-gradient(
        125deg,
        var(--azul-secundario),
        var(--azul-principal)
    );

    border-left:
    6px solid
    var(--dourado);

    border-radius:16px;

    box-shadow:
    var(--sombra-media);

}


.icone-bloco-informativo{

    width:66px;

    height:66px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:
    var(--dourado);

    background:
    rgba(255,255,255,.07);

    border:
    1px solid
    rgba(255,255,255,.10);

    border-radius:50%;

    font-size:1.8rem;

}


.conteudo-bloco-informativo span{

    color:
    var(--dourado);

    font-size:.73rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.2px;

}


.conteudo-bloco-informativo h3{

    margin:
    5px 0 8px;

    color:#fff;

    font-size:1.35rem;

    line-height:1.3;

}


.conteudo-bloco-informativo p{

    color:#cfd6dd;

    font-size:.92rem;

}


.btn-bloco-informativo{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-width:150px;

    padding:
    13px 20px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-size:.9rem;

    font-weight:800;

    transition:.3s;

}


.btn-bloco-informativo:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-3px);

}


/* ==========================================
   RESPONSIVIDADE DA VISÃO GERAL
========================================== */

@media(max-width:1100px){

    .grid-resumo-paineis{

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

    }


    .resumo-painel-card{

        min-height:auto;

    }


    .bloco-informativo-paineis{

        grid-template-columns:
        70px 1fr;

    }


    .btn-bloco-informativo{

        grid-column:
        2;

        justify-self:start;

    }

}


@media(max-width:850px){

    .faixa-indicadores-paineis{

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

    }


    .indicador-painel:nth-child(2){

        border-right:none;

    }


    .indicador-painel:nth-child(-n+2){

        border-bottom:
        1px solid
        rgba(255,255,255,.10);

    }

}


@media(max-width:650px){

    .secao-visao-geral{

        padding:
        78px 0;

    }


    .intro-projeto-premium{

        margin-bottom:45px;

    }


    .intro-projeto-premium h2{

        font-size:2.25rem;

    }


    .grid-resumo-paineis{

        grid-template-columns:
        1fr;

    }


    .faixa-indicadores-paineis{

        grid-template-columns:
        1fr;

    }


    .indicador-painel{

        justify-content:flex-start;

        padding-left:30px;

        border-right:none;

        border-bottom:
        1px solid
        rgba(255,255,255,.10);

    }


    .indicador-painel:nth-child(2){

        border-bottom:
        1px solid
        rgba(255,255,255,.10);

    }


    .indicador-painel:last-child{

        border-bottom:none;

    }


    .bloco-informativo-paineis{

        grid-template-columns:
        1fr;

        padding:
        29px 24px;

    }


    .btn-bloco-informativo{

        grid-column:auto;

    }

}

/* ==========================================
   CABEÇALHO DAS SEÇÕES
========================================== */

.cabecalho-secao{

    max-width:860px;

    margin:
    0 auto 70px;

    text-align:center;

}


.cabecalho-secao h2{

    margin:
    13px 0 20px;

    color:
    var(--azul-principal);

    font-size:
    clamp(2.3rem,4vw,3.35rem);

    line-height:1.15;

    letter-spacing:-1.2px;

    text-wrap:balance;

}


.cabecalho-secao p{

    color:
    var(--cinza-texto);

    font-size:1.04rem;

}


/* ==========================================
   PORTFÓLIO PREMIUM
========================================== */

.secao-portfolio-premium{

    position:relative;

    padding:
    110px 0;

    overflow:hidden;

    background:
    var(--cinza-fundo);

}


.secao-portfolio-premium::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:1px;

    background:

    linear-gradient(
        90deg,
        transparent,
        rgba(212,175,55,.55),
        transparent
    );

}


/* ==========================================
   CASE DO PROJETO
========================================== */

.case-painel{

    display:grid;

    grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);

    align-items:center;

    gap:68px;

}


/* ==========================================
   ÁREA DE IMAGENS
========================================== */

.case-media{

    min-width:0;

}


/* ==========================================
   CARROSSEL
========================================== */

.carousel-painel{

    position:relative;

    width:100%;

    height:570px;

    overflow:hidden;

    background:
    #e7ebef;

    border-radius:21px;

    box-shadow:
    0 24px 60px
    rgba(11,22,34,.19);

}


.carousel-painel::before{

    content:"";

    position:absolute;

    inset:0;

    z-index:2;

    pointer-events:none;

    border:
    1px solid
    rgba(255,255,255,.16);

    border-radius:21px;

}


.carousel-track{

    display:flex;

    height:100%;

    transition:

    transform .65s
    cubic-bezier(.22,.61,.36,1);

}


.carousel-slide{

    min-width:100%;

    height:100%;

}


.carousel-slide img{

    width:100%;

    height:100%;

    object-fit:cover;

}


/* ==========================================
   BOTÕES DO CARROSSEL
========================================== */

.carousel-btn{

    position:absolute;

    z-index:4;

    top:50%;

    transform:
    translateY(-50%);

    width:49px;

    height:49px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    background:
    rgba(11,22,34,.84);

    border:
    1px solid
    rgba(255,255,255,.14);

    border-radius:50%;

    cursor:pointer;

    backdrop-filter:
    blur(8px);

    transition:.3s;

}


.carousel-btn:hover{

    color:#111;

    background:
    var(--dourado);

    transform:
    translateY(-50%)
    scale(1.05);

}


.carousel-prev{

    left:17px;

}


.carousel-next{

    right:17px;

}


/* ==========================================
   INDICADORES DO CARROSSEL
========================================== */

.carousel-dots{

    position:absolute;

    z-index:4;

    left:50%;

    bottom:20px;

    transform:
    translateX(-50%);

    display:flex;

    align-items:center;

    gap:8px;

    padding:
    8px 12px;

    background:
    rgba(11,22,34,.60);

    border-radius:50px;

    backdrop-filter:
    blur(8px);

}


.carousel-dots button{

    width:9px;

    height:9px;

    padding:0;

    background:
    rgba(255,255,255,.58);

    border-radius:50%;

    cursor:pointer;

    transition:.3s;

}


.carousel-dots button.ativo{

    width:29px;

    background:
    var(--dourado);

    border-radius:50px;

}


/* ==========================================
   CONTEÚDO DO CASE
========================================== */

.case-conteudo{

    min-width:0;

}


.tag-bloco{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:
    var(--dourado-hover);

    font-size:.75rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.35px;

}


.tag-bloco::before{

    content:"";

    width:28px;

    height:2px;

    background:
    var(--dourado);

}


.case-conteudo h3{

    margin:
    13px 0 23px;

    color:
    var(--azul-principal);

    font-size:
    clamp(2.1rem,3.3vw,2.85rem);

    line-height:1.14;

    letter-spacing:-.9px;

    text-wrap:balance;

}


.case-conteudo > p{

    margin-bottom:17px;

    color:
    var(--cinza-texto);

    font-size:1rem;

}


/* ==========================================
   FICHA TÉCNICA
========================================== */

.ficha-tecnica{

    display:grid;

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

    gap:12px;

    margin:
    28px 0;

}


.ficha-tecnica > div{

    padding:
    14px 16px;

    background:#fff;

    border-left:
    4px solid
    var(--dourado);

    border-radius:9px;

    box-shadow:
    0 8px 22px
    rgba(11,22,34,.07);

    transition:.3s;

}


.ficha-tecnica > div:hover{

    transform:
    translateY(-3px);

    box-shadow:
    0 13px 28px
    rgba(11,22,34,.12);

}


.ficha-tecnica span{

    display:block;

    margin-bottom:3px;

    color:#8a949f;

    font-size:.69rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.8px;

}


.ficha-tecnica strong{

    display:block;

    color:
    var(--azul-principal);

    font-size:.94rem;

}


/* ==========================================
   ESCOPO DO PROJETO
========================================== */

.escopo-case{

    margin-top:26px;

}


.titulo-escopo-case{

    display:block;

    margin-bottom:14px;

    color:
    var(--azul-principal);

    font-size:.88rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.8px;

}


.lista-destaques-projeto{

    display:grid;

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

    gap:
    10px 19px;

}


.lista-destaques-projeto li{

    position:relative;

    padding-left:24px;

    color:#404a54;

    font-size:.89rem;

}


.lista-destaques-projeto li::before{

    content:"✓";

    position:absolute;

    left:0;

    top:0;

    color:
    var(--dourado-hover);

    font-weight:900;

}


/* ==========================================
   FRASE DE DESTAQUE
========================================== */

.frase-impacto-projeto{

    display:grid;

    grid-template-columns:
    35px 1fr;

    gap:13px;

    margin:
    28px 0;

    padding:
    21px 23px;

    color:#fff;

    background:
    var(--azul-principal);

    border-left:
    5px solid
    var(--dourado);

    border-radius:12px;

    box-shadow:
    0 13px 30px
    rgba(11,22,34,.13);

}


.frase-impacto-projeto > i{

    color:
    var(--dourado);

    font-size:1.35rem;

}


.frase-impacto-projeto p{

    color:#e0e5ea;

    font-size:.93rem;

    font-style:italic;

}


/* ==========================================
   BOTÃO DO PROJETO
========================================== */

.btn-case-projeto{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:51px;

    padding:
    13px 23px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-size:.91rem;

    font-weight:800;

    transition:.3s;

}


.btn-case-projeto:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-3px);

    box-shadow:
    0 12px 26px
    rgba(212,175,55,.22);

}


/* ==========================================
   RESPONSIVIDADE DO PORTFÓLIO
========================================== */

@media(max-width:1050px){

    .case-painel{

        grid-template-columns:
        1fr;

        gap:48px;

    }


    .carousel-painel{

        height:530px;

    }

}


@media(max-width:700px){

    .secao-portfolio-premium{

        padding:
        80px 0;

    }


    .cabecalho-secao{

        margin-bottom:48px;

    }


    .cabecalho-secao h2{

        font-size:2.25rem;

    }


    .carousel-painel{

        height:390px;

        border-radius:16px;

    }


    .carousel-btn{

        width:43px;

        height:43px;

    }


    .ficha-tecnica,
    .lista-destaques-projeto{

        grid-template-columns:
        1fr;

    }

}


@media(max-width:480px){

    .carousel-painel{

        height:310px;

    }


    .carousel-prev{

        left:10px;

    }


    .carousel-next{

        right:10px;

    }


    .case-conteudo h3{

        font-size:2rem;

    }


    .frase-impacto-projeto{

        grid-template-columns:
        1fr;

    }

}

/* ==========================================
   PROJETO COM FUNDO ESCURO
========================================== */

.secao-case-alternativo{

    position:relative;

    padding:
    115px 0;

    overflow:hidden;

    background:

    linear-gradient(
        135deg,
        #08121c 0%,
        #0b1824 52%,
        #102435 100%
    );

}


.secao-case-alternativo::before{

    content:"";

    position:absolute;

    top:-250px;

    left:-230px;

    width:550px;

    height:550px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.09),
        transparent 68%
    );

    pointer-events:none;

}


.secao-case-alternativo::after{

    content:"";

    position:absolute;

    right:-150px;

    bottom:-240px;

    width:500px;

    height:500px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(52,102,143,.20),
        transparent 69%
    );

    pointer-events:none;

}


.secao-case-alternativo .container{

    position:relative;

    z-index:2;

}


/* ==========================================
   LAYOUT INVERTIDO
========================================== */

.case-painel-invertido{

    grid-template-columns:
    minmax(0,1.06fr)
    minmax(0,.94fr);

}


.secao-case-alternativo .case-conteudo h3{

    color:#fff;

}


.secao-case-alternativo .case-conteudo > p{

    color:#c6d0d9;

}


.secao-case-alternativo .tag-bloco{

    color:
    var(--dourado);

}


/* ==========================================
   DIFERENCIAIS DE ARQUITETURA
========================================== */

.destaques-arquitetura{

    display:grid;

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

    gap:14px;

    margin:
    30px 0;

}


.destaque-arquitetura-item{

    display:grid;

    grid-template-columns:
    48px 1fr;

    gap:14px;

    padding:
    18px;

    background:
    rgba(255,255,255,.055);

    border:
    1px solid
    rgba(255,255,255,.09);

    border-radius:12px;

    backdrop-filter:
    blur(10px);

    transition:.3s;

}


.destaque-arquitetura-item:hover{

    transform:
    translateY(-4px);

    background:
    rgba(255,255,255,.085);

    border-color:
    rgba(212,175,55,.34);

}


.icone-arquitetura{

    width:45px;

    height:45px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:
    var(--dourado);

    background:
    rgba(212,175,55,.10);

    border-radius:10px;

    font-size:1.1rem;

}


.destaque-arquitetura-item h4{

    margin-bottom:5px;

    color:#fff;

    font-size:.94rem;

    line-height:1.3;

}


.destaque-arquitetura-item p{

    color:#aebbc6;

    font-size:.79rem;

    line-height:1.5;

}


/* ==========================================
   FICHA TÉCNICA ESCURA
========================================== */

.ficha-tecnica-escura > div{

    background:
    rgba(255,255,255,.06);

    border-top:
    1px solid
    rgba(255,255,255,.07);

    border-right:
    1px solid
    rgba(255,255,255,.07);

    border-bottom:
    1px solid
    rgba(255,255,255,.07);

    box-shadow:none;

}


.ficha-tecnica-escura > div:hover{

    background:
    rgba(255,255,255,.09);

    box-shadow:none;

}


.ficha-tecnica-escura span{

    color:#8595a3;

}


.ficha-tecnica-escura strong{

    color:#fff;

}


.secao-case-alternativo
.titulo-escopo-case{

    color:
    var(--dourado);

}


.secao-case-alternativo
.lista-destaques-projeto li{

    color:#c3cdd5;

}


/* ==========================================
   BOX DE EXPANSÃO
========================================== */

.box-expansao-projeto{

    display:grid;

    grid-template-columns:
    64px 1fr;

    gap:19px;

    margin:
    29px 0;

    padding:
    23px;

    background:

    linear-gradient(
        110deg,
        rgba(212,175,55,.14),
        rgba(212,175,55,.04)
    );

    border:
    1px solid
    rgba(212,175,55,.26);

    border-radius:13px;

}


.icone-expansao{

    width:57px;

    height:57px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#111;

    background:
    var(--dourado);

    border-radius:50%;

    font-size:1.35rem;

}


.box-expansao-projeto span{

    color:
    var(--dourado);

    font-size:.69rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

}


.box-expansao-projeto h4{

    margin:
    3px 0 6px;

    color:#fff;

    font-size:1.05rem;

}


.box-expansao-projeto p{

    color:#b9c4cd;

    font-size:.86rem;

}


/* ==========================================
   CARROSSEL VERTICAL
========================================== */

.carousel-painel-vertical{

    height:740px;

}


.carousel-painel-vertical
.carousel-slide img{

    object-position:center;

}


/* ==========================================
   SELO DA IMAGEM
========================================== */

.selo-imagem-projeto{

    position:absolute;

    z-index:5;

    left:22px;

    top:22px;

    display:flex;

    align-items:center;

    gap:12px;

    padding:
    13px 17px;

    color:#fff;

    background:
    rgba(7,17,27,.85);

    border:
    1px solid
    rgba(255,255,255,.12);

    border-radius:11px;

    box-shadow:
    0 12px 30px
    rgba(0,0,0,.25);

    backdrop-filter:
    blur(10px);

}


.selo-imagem-projeto > i{

    color:
    var(--dourado);

    font-size:1.35rem;

}


.selo-imagem-projeto strong{

    display:block;

    color:
    var(--dourado);

    font-size:1.12rem;

    line-height:1.2;

}


.selo-imagem-projeto span{

    display:block;

    margin-top:2px;

    color:#d2d9df;

    font-size:.72rem;

}


/* ==========================================
   RESPONSIVIDADE DO PROJETO 02
========================================== */

@media(max-width:1050px){

    .case-painel-invertido{

        grid-template-columns:
        1fr;

    }


    .case-painel-invertido
    .case-media{

        grid-row:1;

    }


    .carousel-painel-vertical{

        height:580px;

    }

}


@media(max-width:700px){

    .secao-case-alternativo{

        padding:
        80px 0;

    }


    .destaques-arquitetura{

        grid-template-columns:
        1fr;

    }


    .carousel-painel-vertical{

        height:430px;

    }

}


@media(max-width:480px){

    .carousel-painel-vertical{

        height:340px;

    }


    .box-expansao-projeto{

        grid-template-columns:
        1fr;

    }


    .selo-imagem-projeto{

        left:13px;

        top:13px;

        padding:
        10px 13px;

    }

}

/* ==========================================
   PROJETO 03 — AUTOMAÇÃO INDUSTRIAL
========================================== */

.secao-automacao-industrial{

    position:relative;

    padding:
    115px 0;

    overflow:hidden;

    background:
    #ffffff;

}


.secao-automacao-industrial::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:1px;

    background:

    linear-gradient(
        90deg,
        transparent,
        rgba(212,175,55,.55),
        transparent
    );

}


/* ==========================================
   CABEÇALHO
========================================== */

.cabecalho-projeto-automacao{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:50px;

    margin-bottom:65px;

}


.cabecalho-projeto-automacao-texto{

    max-width:820px;

}


.cabecalho-projeto-automacao h2{

    max-width:800px;

    margin:
    14px 0 20px;

    color:
    var(--azul-principal);

    font-size:
    clamp(2.35rem,4vw,3.45rem);

    line-height:1.12;

    letter-spacing:-1.2px;

}


.cabecalho-projeto-automacao p{

    max-width:720px;

    color:
    var(--cinza-texto);

    font-size:1.04rem;

}


.numero-projeto{

    flex-shrink:0;

    text-align:right;

}


.numero-projeto span{

    display:block;

    margin-bottom:-12px;

    color:#9099a2;

    font-size:.71rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.7px;

}


.numero-projeto strong{

    display:block;

    color:
    rgba(11,31,52,.08);

    font-size:7.5rem;

    line-height:1;

    letter-spacing:-8px;

}


/* ==========================================
   CONTEÚDO PRINCIPAL
========================================== */

.case-automacao{

    display:grid;

    grid-template-columns:
    minmax(0,.95fr)
    minmax(0,1.05fr);

    align-items:center;

    gap:68px;

}


/* ==========================================
   CARROSSEL
========================================== */

.carousel-automacao{

    height:690px;

}


.carousel-automacao::after{

    content:"";

    position:absolute;

    inset:0;

    z-index:2;

    pointer-events:none;

    background:

    linear-gradient(
        180deg,
        transparent 52%,
        rgba(7,18,28,.42) 100%
    );

}


.carousel-automacao
.carousel-btn,

.carousel-automacao
.carousel-dots{

    z-index:5;

}


/* ==========================================
   SELO
========================================== */

.selo-automacao{

    position:absolute;

    z-index:5;

    left:23px;

    bottom:23px;

    display:flex;

    align-items:center;

    gap:14px;

    max-width:250px;

    padding:
    14px 18px;

    color:#fff;

    background:
    rgba(7,18,28,.88);

    border:
    1px solid
    rgba(255,255,255,.12);

    border-radius:12px;

    backdrop-filter:
    blur(10px);

}


.selo-automacao-icone{

    width:45px;

    height:45px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    color:#111;

    background:
    var(--dourado);

    border-radius:50%;

    font-size:1.1rem;

}


.selo-automacao strong{

    display:block;

    color:#fff;

    font-size:.9rem;

}


.selo-automacao span{

    display:block;

    margin-top:2px;

    color:#bfc8cf;

    font-size:.71rem;

}


/* ==========================================
   CONTEÚDO TÉCNICO
========================================== */

.subtitulo-tecnico{

    display:block;

    margin-bottom:8px;

    color:
    var(--dourado-hover);

    font-size:.75rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.15px;

}


.case-conteudo-automacao h3{

    margin:
    0 0 21px;

    color:
    var(--azul-principal);

    font-size:
    clamp(2rem,3vw,2.65rem);

    line-height:1.16;

    letter-spacing:-.8px;

}


.case-conteudo-automacao > p{

    margin-bottom:16px;

    color:
    var(--cinza-texto);

}


/* ==========================================
   RECURSOS
========================================== */

.recursos-automacao{

    display:grid;

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

    gap:13px;

    margin:
    28px 0;

}


.recurso-automacao{

    display:grid;

    grid-template-columns:
    44px 1fr;

    align-items:center;

    gap:12px;

    padding:
    16px;

    background:
    #f5f7f9;

    border:
    1px solid
    #e4e9ed;

    border-radius:11px;

    transition:.3s;

}


.recurso-automacao:hover{

    transform:
    translateY(-4px);

    background:#fff;

    border-color:
    rgba(212,175,55,.45);

    box-shadow:
    0 13px 28px
    rgba(11,22,34,.10);

}


.recurso-automacao > i{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:
    var(--dourado-hover);

    background:
    rgba(212,175,55,.12);

    border-radius:9px;

}


.recurso-automacao strong{

    display:block;

    color:
    var(--azul-principal);

    font-size:.86rem;

}


.recurso-automacao span{

    display:block;

    margin-top:3px;

    color:#707b85;

    font-size:.72rem;

    line-height:1.45;

}


/* ==========================================
   FLUXO DE AUTOMAÇÃO
========================================== */

.fluxo-automacao-wrapper{

    margin-top:110px;

    padding:
    72px 42px 55px;

    background:

    linear-gradient(
        135deg,
        #08131e,
        #102739
    );

    border-radius:24px;

    box-shadow:
    0 28px 70px
    rgba(8,19,30,.20);

}


.titulo-fluxo-automacao{

    max-width:730px;

    margin:
    0 auto 52px;

    text-align:center;

}


.titulo-fluxo-automacao > span{

    color:
    var(--dourado);

    font-size:.72rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.3px;

}


.titulo-fluxo-automacao h3{

    margin:
    11px 0 16px;

    color:#fff;

    font-size:
    clamp(2rem,3.2vw,2.8rem);

    line-height:1.15;

}


.titulo-fluxo-automacao p{

    color:#b9c5ce;

    font-size:.95rem;

}


.fluxo-automacao{

    display:grid;

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

    align-items:center;

    gap:10px;

}


.etapa-fluxo{

    position:relative;

    min-height:240px;

    padding:
    28px 17px 22px;

    text-align:center;

    background:
    rgba(255,255,255,.055);

    border:
    1px solid
    rgba(255,255,255,.09);

    border-radius:14px;

    transition:.3s;

}


.etapa-fluxo:hover{

    transform:
    translateY(-6px);

    background:
    rgba(255,255,255,.085);

    border-color:
    rgba(212,175,55,.38);

}


.etapa-fluxo-destaque{

    background:

    linear-gradient(
        145deg,
        rgba(212,175,55,.20),
        rgba(212,175,55,.07)
    );

    border-color:
    rgba(212,175,55,.40);

}


.numero-etapa{

    position:absolute;

    top:11px;

    right:13px;

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

    font-size:.68rem;

    font-weight:800;

}


.icone-etapa-fluxo{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:
    12px auto 18px;

    color:#111;

    background:
    var(--dourado);

    border-radius:50%;

    box-shadow:
    0 10px 24px
    rgba(212,175,55,.18);

    font-size:1.25rem;

}


.etapa-fluxo h4{

    margin-bottom:9px;

    color:#fff;

    font-size:.94rem;

}


.etapa-fluxo p{

    color:#aebbc5;

    font-size:.73rem;

    line-height:1.5;

}


.seta-fluxo{

    color:
    var(--dourado);

    font-size:.85rem;

}


/* ==========================================
   BENEFÍCIOS
========================================== */

.beneficios-automacao{

    display:grid;

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

    align-items:center;

    gap:65px;

    margin-top:95px;

    padding:
    55px;

    background:
    #f4f6f8;

    border-radius:22px;

}


.beneficios-automacao-conteudo h3{

    margin:
    13px 0 18px;

    color:
    var(--azul-principal);

    font-size:
    clamp(1.9rem,3vw,2.55rem);

    line-height:1.16;

}


.beneficios-automacao-conteudo p{

    color:
    var(--cinza-texto);

}


.beneficios-automacao-grid{

    display:grid;

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

    gap:14px;

}


.beneficios-automacao-grid > div{

    min-height:170px;

    padding:
    22px;

    background:#fff;

    border:
    1px solid
    #e3e8ec;

    border-radius:13px;

    transition:.3s;

}


.beneficios-automacao-grid > div:hover{

    transform:
    translateY(-5px);

    border-color:
    rgba(212,175,55,.48);

    box-shadow:
    0 15px 32px
    rgba(11,22,34,.10);

}


.beneficios-automacao-grid i{

    display:block;

    margin-bottom:15px;

    color:
    var(--dourado-hover);

    font-size:1.45rem;

}


.beneficios-automacao-grid strong{

    display:block;

    margin-bottom:8px;

    color:
    var(--azul-principal);

    font-size:.92rem;

}


.beneficios-automacao-grid span{

    display:block;

    color:#717d87;

    font-size:.79rem;

    line-height:1.55;

}


/* ==========================================
   RESPONSIVIDADE
========================================== */

@media(max-width:1150px){

    .fluxo-automacao{

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

        gap:17px;

    }


    .seta-fluxo{

        display:none;

    }

}


@media(max-width:1050px){

    .case-automacao{

        grid-template-columns:
        1fr;

    }


    .carousel-automacao{

        height:570px;

    }


    .beneficios-automacao{

        grid-template-columns:
        1fr;

    }

}


@media(max-width:750px){

    .secao-automacao-industrial{

        padding:
        80px 0;

    }


    .cabecalho-projeto-automacao{

        align-items:flex-start;

    }


    .numero-projeto{

        display:none;

    }


    .carousel-automacao{

        height:430px;

    }


    .recursos-automacao{

        grid-template-columns:
        1fr;

    }


    .fluxo-automacao-wrapper{

        margin-top:75px;

        padding:
        55px 20px 35px;

        border-radius:17px;

    }


    .fluxo-automacao{

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

    }


    .beneficios-automacao{

        margin-top:70px;

        padding:
        35px 22px;

    }


    .beneficios-automacao-grid{

        grid-template-columns:
        1fr;

    }

}


@media(max-width:500px){

    .carousel-automacao{

        height:340px;

    }


    .selo-automacao{

        left:12px;

        bottom:15px;

        max-width:220px;

        padding:
        10px 13px;

    }


    .fluxo-automacao{

        grid-template-columns:
        1fr;

    }


    .etapa-fluxo{

        min-height:auto;

    }

}

/* ==========================================
   PROCESSO DE DESENVOLVIMENTO
========================================== */

.secao-processo-paineis{

    position:relative;

    padding:
    120px 0;

    overflow:hidden;

    background:

    linear-gradient(
        180deg,
        #f4f6f8 0%,
        #ffffff 100%
    );

}


.secao-processo-paineis::before{

    content:"";

    position:absolute;

    top:-240px;

    right:-220px;

    width:580px;

    height:580px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.09),
        transparent 68%
    );

    pointer-events:none;

}


.cabecalho-processo{

    position:relative;

    z-index:2;

}


/* ==========================================
   RESUMO HORIZONTAL
========================================== */

.processo-resumo{

    position:relative;

    margin:
    75px 0 70px;

    padding:
    0 10px;

}


.processo-resumo-linha{

    position:absolute;

    top:24px;

    left:5%;

    width:90%;

    height:3px;

    overflow:hidden;

    background:
    #dfe4e8;

    border-radius:50px;

}


.processo-resumo-progresso{

    display:block;

    width:0;

    height:100%;

    background:

    linear-gradient(
        90deg,
        #b98b20,
        var(--dourado),
        #e7ca67
    );

    border-radius:50px;

    transition:
    width 2.2s
    cubic-bezier(.22,.61,.36,1);

}


.processo-resumo.ativo
.processo-resumo-progresso{

    width:100%;

}


.processo-resumo-etapas{

    position:relative;

    z-index:2;

    display:grid;

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

    gap:8px;

}


.processo-resumo-item{

    text-align:center;

}


.processo-resumo-item span{

    width:50px;

    height:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:
    0 auto 13px;

    color:
    var(--azul-principal);

    background:#fff;

    border:
    3px solid
    #dfe4e8;

    border-radius:50%;

    box-shadow:
    0 8px 20px
    rgba(11,22,34,.08);

    font-size:.72rem;

    font-weight:900;

    transition:.5s;

}


.processo-resumo.ativo
.processo-resumo-item span{

    border-color:
    var(--dourado);

}


.processo-resumo-item strong{

    display:block;

    color:
    var(--azul-principal);

    font-size:.72rem;

    line-height:1.35;

}


.processo-resumo-item-destaque span{

    color:#111;

    background:
    var(--dourado);

    border-color:
    var(--dourado);

    transform:
    scale(1.13);

}


/* ==========================================
   GRID DE CARDS
========================================== */

.grid-processo-paineis{

    display:grid;

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

    gap:24px;

}


/* ==========================================
   CARD PADRÃO
========================================== */

.card-processo-painel{

    position:relative;

    min-height:440px;

    padding:
    31px 29px;

    overflow:hidden;

    background:#fff;

    border:
    1px solid
    #e0e6ea;

    border-radius:17px;

    box-shadow:
    0 14px 38px
    rgba(11,22,34,.07);

    opacity:0;

    transform:
    translateY(35px);

    transition:

    opacity .7s ease,
    transform .7s ease,
    border-color .3s ease,
    box-shadow .3s ease;

}


.card-processo-painel.visivel{

    opacity:1;

    transform:
    translateY(0);

}


.card-processo-painel::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:

    linear-gradient(
        90deg,
        var(--dourado),
        transparent
    );

    transform:
    scaleX(0);

    transform-origin:left;

    transition:.4s;

}


.card-processo-painel:hover{

    transform:
    translateY(-7px);

    border-color:
    rgba(212,175,55,.45);

    box-shadow:
    0 23px 50px
    rgba(11,22,34,.13);

}


.card-processo-painel:hover::before{

    transform:
    scaleX(1);

}


/* ==========================================
   TOPO DO CARD
========================================== */

.topo-card-processo{

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:20px;

    margin-bottom:24px;

}


.numero-card-processo{

    color:
    #c6cdd3;

    font-size:.75rem;

    font-weight:900;

    letter-spacing:1px;

}


.icone-card-processo{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:
    var(--dourado-hover);

    background:
    rgba(212,175,55,.12);

    border-radius:14px;

    font-size:1.35rem;

    transition:.3s;

}


.card-processo-painel:hover
.icone-card-processo{

    color:#111;

    background:
    var(--dourado);

    transform:
    rotate(-4deg)
    scale(1.05);

}


/* ==========================================
   TEXTOS DOS CARDS
========================================== */

.card-processo-painel h3{

    margin-bottom:13px;

    color:
    var(--azul-principal);

    font-size:1.28rem;

    line-height:1.3;

}


.card-processo-painel > p{

    min-height:79px;

    margin-bottom:23px;

    color:
    var(--cinza-texto);

    font-size:.88rem;

    line-height:1.65;

}


.card-processo-painel ul{

    display:grid;

    gap:9px;

}


.card-processo-painel li{

    position:relative;

    padding-left:22px;

    color:#48535c;

    font-size:.82rem;

}


.card-processo-painel li::before{

    content:"";

    position:absolute;

    top:8px;

    left:0;

    width:7px;

    height:7px;

    background:
    var(--dourado);

    border-radius:50%;

}


/* ==========================================
   CARD FAT
========================================== */

.card-processo-fat{

    color:#fff;

    background:

    linear-gradient(
        145deg,
        #07131e 0%,
        #0d2334 100%
    );

    border-color:
    rgba(212,175,55,.40);

    box-shadow:
    0 22px 55px
    rgba(7,19,30,.23);

}


.card-processo-fat::after{

    content:"";

    position:absolute;

    right:-85px;

    bottom:-110px;

    width:250px;

    height:250px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.17),
        transparent 68%
    );

    pointer-events:none;

}


.card-processo-fat
.numero-card-processo{

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

}


.card-processo-fat
.icone-card-processo{

    color:#111;

    background:
    var(--dourado);

}


.card-processo-fat h3{

    color:#fff;

}


.card-processo-fat > p{

    color:#bec9d1;

}


.card-processo-fat li{

    color:#d4dce2;

}


.selo-card-fat{

    position:absolute;

    top:0;

    left:50%;

    transform:
    translateX(-50%);

    padding:
    7px 15px;

    color:#111;

    background:
    var(--dourado);

    border-radius:
    0 0 9px 9px;

    font-size:.65rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:.8px;

}


/* ==========================================
   DESTAQUE FINAL
========================================== */

.destaque-final-processo{

    display:grid;

    grid-template-columns:
    74px minmax(0,1fr) auto;

    align-items:center;

    gap:25px;

    margin-top:65px;

    padding:
    37px 40px;

    color:#fff;

    background:

    linear-gradient(
        120deg,
        #07131f,
        #0d2638
    );

    border:
    1px solid
    rgba(212,175,55,.30);

    border-radius:18px;

    box-shadow:
    0 23px 55px
    rgba(7,19,30,.18);

}


.icone-destaque-processo{

    width:68px;

    height:68px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#111;

    background:
    var(--dourado);

    border-radius:50%;

    font-size:1.45rem;

}


.texto-destaque-processo span{

    color:
    var(--dourado);

    font-size:.69rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

}


.texto-destaque-processo h3{

    margin:
    4px 0 7px;

    color:#fff;

    font-size:1.35rem;

}


.texto-destaque-processo p{

    max-width:690px;

    color:#bdc8d0;

    font-size:.86rem;

}


.btn-processo-contato{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:51px;

    padding:
    13px 22px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-size:.86rem;

    font-weight:900;

    white-space:nowrap;

    transition:.3s;

}


.btn-processo-contato:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-3px);

    box-shadow:
    0 13px 28px
    rgba(212,175,55,.22);

}


/* ==========================================
   RESPONSIVIDADE
========================================== */

@media(max-width:1100px){

    .processo-resumo{

        overflow-x:auto;

        padding-bottom:18px;

    }


    .processo-resumo-linha{

        left:28px;

        width:850px;

    }


    .processo-resumo-etapas{

        grid-template-columns:
        repeat(9,90px);

        min-width:850px;

    }


    .grid-processo-paineis{

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

    }


    .destaque-final-processo{

        grid-template-columns:
        68px 1fr;

    }


    .btn-processo-contato{

        grid-column:
        1 / -1;

        width:max-content;

        margin-left:93px;

    }

}


@media(max-width:700px){

    .secao-processo-paineis{

        padding:
        80px 0;

    }


    .processo-resumo{

        margin:
        55px 0;

    }


    .grid-processo-paineis{

        grid-template-columns:
        1fr;

    }


    .card-processo-painel{

        min-height:auto;

    }


    .card-processo-painel > p{

        min-height:auto;

    }


    .destaque-final-processo{

        grid-template-columns:
        1fr;

        padding:
        30px 24px;

    }


    .btn-processo-contato{

        grid-column:auto;

        width:100%;

        margin-left:0;

    }

}

/* ==========================================
   DIFERENCIAIS DOS PAINÉIS
========================================== */

.secao-diferenciais-paineis{

    position:relative;

    padding:
    120px 0;

    overflow:hidden;

    background:

    linear-gradient(
        135deg,
        #07131f 0%,
        #0b1e2d 55%,
        #0d2638 100%
    );

}


.secao-diferenciais-paineis::before{

    content:"";

    position:absolute;

    top:-220px;

    left:-220px;

    width:560px;

    height:560px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.13),
        transparent 68%
    );

    pointer-events:none;

}


.secao-diferenciais-paineis::after{

    content:"";

    position:absolute;

    right:-180px;

    bottom:-260px;

    width:600px;

    height:600px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(51,105,148,.22),
        transparent 68%
    );

    pointer-events:none;

}


.secao-diferenciais-paineis .container{

    position:relative;

    z-index:2;

}


/* ==========================================
   CABEÇALHO
========================================== */

.cabecalho-diferenciais{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:55px;

    margin-bottom:65px;

}


.cabecalho-diferenciais-texto{

    max-width:820px;

}


.cabecalho-diferenciais .tag-secao{

    color:
    var(--dourado);

}


.cabecalho-diferenciais h2{

    margin:
    14px 0 20px;

    color:#fff;

    font-size:
    clamp(2.35rem,4vw,3.45rem);

    line-height:1.13;

    letter-spacing:-1.2px;

}


.cabecalho-diferenciais p{

    max-width:720px;

    color:#bdc8d1;

    font-size:1.03rem;

}


.selo-diferenciais{

    display:flex;

    align-items:center;

    gap:14px;

    flex-shrink:0;

    padding:
    18px 21px;

    background:
    rgba(255,255,255,.065);

    border:
    1px solid
    rgba(212,175,55,.28);

    border-radius:13px;

    backdrop-filter:
    blur(10px);

}


.selo-diferenciais > i{

    color:
    var(--dourado);

    font-size:1.65rem;

}


.selo-diferenciais strong{

    display:block;

    color:#fff;

    font-size:.9rem;

}


.selo-diferenciais span{

    display:block;

    margin-top:3px;

    color:#aebbc5;

    font-size:.71rem;

}


/* ==========================================
   LAYOUT
========================================== */

.diferenciais-layout{

    display:grid;

    grid-template-columns:
    minmax(0,.86fr)
    minmax(0,1.14fr);

    align-items:stretch;

    gap:35px;

}


/* ==========================================
   IMAGEM
========================================== */

.imagem-diferenciais{

    position:relative;

    height:100%;

    min-height:760px;

    overflow:hidden;

    border-radius:20px;

    box-shadow:
    0 28px 65px
    rgba(0,0,0,.30);

}


.imagem-diferenciais img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:
    transform .8s ease;

}


.imagem-diferenciais:hover img{

    transform:
    scale(1.045);

}


.overlay-imagem-diferenciais{

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        180deg,
        rgba(7,19,31,.04) 15%,
        rgba(7,19,31,.30) 50%,
        rgba(7,19,31,.96) 100%
    );

}


.destaque-imagem-diferenciais{

    position:absolute;

    z-index:2;

    left:35px;

    right:35px;

    bottom:38px;

}


.destaque-imagem-diferenciais > span{

    color:
    var(--dourado);

    font-size:.71rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1.2px;

}


.destaque-imagem-diferenciais h3{

    margin:
    10px 0 15px;

    color:#fff;

    font-size:
    clamp(1.8rem,2.7vw,2.5rem);

    line-height:1.16;

}


.destaque-imagem-diferenciais p{

    color:#c2ccd4;

    font-size:.91rem;

    line-height:1.7;

}


.selo-experiencia-painel{

    position:absolute;

    z-index:3;

    top:23px;

    left:23px;

    display:flex;

    align-items:center;

    gap:12px;

    padding:
    13px 17px;

    background:
    rgba(7,19,31,.84);

    border:
    1px solid
    rgba(255,255,255,.13);

    border-radius:11px;

    backdrop-filter:
    blur(10px);

}


.selo-experiencia-painel > i{

    color:
    var(--dourado);

    font-size:1.3rem;

}


.selo-experiencia-painel strong{

    display:block;

    color:#fff;

    font-size:.84rem;

}


.selo-experiencia-painel span{

    display:block;

    color:#aebac3;

    font-size:.68rem;

}


/* ==========================================
   GRID DOS DIFERENCIAIS
========================================== */

.grid-diferenciais-paineis{

    display:grid;

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

    gap:16px;

}


/* ==========================================
   CARD
========================================== */

.card-diferencial-painel{

    position:relative;

    display:grid;

    grid-template-columns:
    55px 1fr;

    gap:16px;

    min-height:176px;

    padding:
    22px;

    overflow:hidden;

    background:
    rgba(255,255,255,.055);

    border:
    1px solid
    rgba(255,255,255,.09);

    border-radius:14px;

    backdrop-filter:
    blur(8px);

    transition:.35s;

}


.card-diferencial-painel::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:4px;

    height:100%;

    background:
    var(--dourado);

    transform:
    scaleY(0);

    transform-origin:bottom;

    transition:.35s;

}


.card-diferencial-painel:hover{

    transform:
    translateY(-5px);

    background:
    rgba(255,255,255,.085);

    border-color:
    rgba(212,175,55,.32);

    box-shadow:
    0 17px 35px
    rgba(0,0,0,.17);

}


.card-diferencial-painel:hover::before{

    transform:
    scaleY(1);

}


.icone-diferencial-painel{

    width:52px;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:
    var(--dourado);

    background:
    rgba(212,175,55,.11);

    border-radius:12px;

    font-size:1.2rem;

    transition:.3s;

}


.card-diferencial-painel:hover
.icone-diferencial-painel{

    color:#111;

    background:
    var(--dourado);

    transform:
    rotate(-4deg);

}


.numero-diferencial{

    display:block;

    margin-bottom:3px;

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

    font-size:.65rem;

    font-weight:900;

}


.card-diferencial-painel h3{

    margin-bottom:8px;

    color:#fff;

    font-size:1rem;

    line-height:1.3;

}


.card-diferencial-painel p{

    color:#aebbc5;

    font-size:.78rem;

    line-height:1.57;

}


/* ==========================================
   FAIXA DE COMPROMISSOS
========================================== */

.faixa-compromissos-paineis{

    display:grid;

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

    align-items:center;

    gap:26px;

    margin-top:62px;

    padding:
    30px 34px;

    background:
    rgba(255,255,255,.055);

    border:
    1px solid
    rgba(255,255,255,.09);

    border-radius:16px;

    backdrop-filter:
    blur(10px);

}


.compromisso-painel{

    display:flex;

    align-items:center;

    gap:15px;

}


.compromisso-painel > i{

    color:
    var(--dourado);

    font-size:1.35rem;

}


.compromisso-painel strong{

    display:block;

    color:#fff;

    font-size:.88rem;

}


.compromisso-painel span{

    display:block;

    margin-top:4px;

    color:#9fadb8;

    font-size:.7rem;

    line-height:1.45;

}


.divisor-compromisso{

    width:1px;

    height:46px;

    background:
    rgba(255,255,255,.12);

}


/* ==========================================
   BLOCO FINAL
========================================== */

.bloco-final-diferenciais{

    display:grid;

    grid-template-columns:
    minmax(0,1fr) auto;

    align-items:center;

    gap:45px;

    margin-top:38px;

    padding:
    43px 45px;

    background:

    linear-gradient(
        110deg,
        rgba(212,175,55,.15),
        rgba(212,175,55,.045)
    );

    border:
    1px solid
    rgba(212,175,55,.28);

    border-radius:17px;

}


.bloco-final-diferenciais-conteudo > span{

    color:
    var(--dourado);

    font-size:.7rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1.15px;

}


.bloco-final-diferenciais h3{

    max-width:760px;

    margin:
    7px 0 11px;

    color:#fff;

    font-size:
    clamp(1.55rem,2.5vw,2.2rem);

    line-height:1.2;

}


.bloco-final-diferenciais p{

    max-width:790px;

    color:#b6c2cb;

    font-size:.88rem;

    line-height:1.65;

}


.btn-diferenciais-contato{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:53px;

    padding:
    14px 23px;

    color:#111;

    background:
    var(--dourado);

    border-radius:8px;

    font-size:.87rem;

    font-weight:900;

    white-space:nowrap;

    transition:.3s;

}


.btn-diferenciais-contato:hover{

    background:
    var(--dourado-hover);

    transform:
    translateY(-3px);

    box-shadow:
    0 14px 30px
    rgba(212,175,55,.22);

}


/* ==========================================
   RESPONSIVIDADE
========================================== */

@media(max-width:1100px){

    .diferenciais-layout{

        grid-template-columns:
        1fr;

    }


    .imagem-diferenciais{

        min-height:620px;

    }


    .faixa-compromissos-paineis{

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

    }


    .divisor-compromisso{

        display:none;

    }

}


@media(max-width:850px){

    .cabecalho-diferenciais{

        align-items:flex-start;

        flex-direction:column;

    }


    .grid-diferenciais-paineis{

        grid-template-columns:
        1fr;

    }


    .bloco-final-diferenciais{

        grid-template-columns:
        1fr;

    }


    .btn-diferenciais-contato{

        width:max-content;

    }

}


@media(max-width:650px){

    .secao-diferenciais-paineis{

        padding:
        80px 0;

    }


    .imagem-diferenciais{

        min-height:530px;

    }


    .destaque-imagem-diferenciais{

        left:22px;

        right:22px;

        bottom:26px;

    }


    .faixa-compromissos-paineis{

        grid-template-columns:
        1fr;

        padding:
        25px 22px;

    }


    .bloco-final-diferenciais{

        padding:
        31px 23px;

    }


    .btn-diferenciais-contato{

        width:100%;

    }

}


@media(max-width:480px){

    .imagem-diferenciais{

        min-height:480px;

    }


    .selo-experiencia-painel{

        top:14px;

        left:14px;

    }


    .card-diferencial-painel{

        grid-template-columns:
        1fr;

    }

}

/* ==========================================
   NORMAS, SEGURANÇA E CONFORMIDADE
========================================== */

.secao-normas-paineis{

    position:relative;

    padding:120px 0;

    overflow:hidden;

    background:

    linear-gradient(
        180deg,
        #f5f7f9 0%,
        #ffffff 100%
    );

}


.secao-normas-paineis::before{

    content:"";

    position:absolute;

    top:-260px;

    right:-220px;

    width:600px;

    height:600px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.10),
        transparent 68%
    );

    pointer-events:none;

}


.secao-normas-paineis::after{

    content:"";

    position:absolute;

    bottom:-260px;

    left:-220px;

    width:580px;

    height:580px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(10,31,68,.08),
        transparent 68%
    );

    pointer-events:none;

}


.secao-normas-paineis .container{

    position:relative;

    z-index:2;

}


/* ==========================================
   CABEÇALHO
========================================== */

.cabecalho-normas-paineis{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:50px;

    margin-bottom:70px;

}


.cabecalho-normas-conteudo{

    max-width:850px;

}


.cabecalho-normas-conteudo h2{

    max-width:820px;

    margin:14px 0 20px;

    color:var(--azul-principal);

    font-size:clamp(2.3rem,4vw,3.4rem);

    line-height:1.14;

    letter-spacing:-1.2px;

}


.cabecalho-normas-conteudo p{

    max-width:760px;

    color:var(--cinza-texto);

    font-size:1rem;

    line-height:1.75;

}


.selo-conformidade-paineis{

    display:flex;

    align-items:center;

    gap:14px;

    flex-shrink:0;

    padding:18px 21px;

    background:#fff;

    border:1px solid #e2e7eb;

    border-radius:14px;

    box-shadow:

    0 15px 38px
    rgba(11,22,34,.08);

}


.icone-selo-conformidade{

    width:53px;

    height:53px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#111;

    background:var(--dourado);

    border-radius:12px;

    font-size:1.25rem;

}


.selo-conformidade-paineis strong{

    display:block;

    color:var(--azul-principal);

    font-size:.88rem;

}


.selo-conformidade-paineis span{

    display:block;

    margin-top:3px;

    color:#77838d;

    font-size:.7rem;

}


/* ==========================================
   LAYOUT PRINCIPAL
========================================== */

.layout-normas-paineis{

    display:grid;

    grid-template-columns:

    minmax(0,.78fr)
    minmax(0,1.22fr);

    align-items:start;

    gap:42px;

}


/* ==========================================
   APRESENTAÇÃO
========================================== */

.apresentacao-normas-paineis{

    position:sticky;

    top:110px;

    padding:39px 37px;

    color:#fff;

    background:

    linear-gradient(
        145deg,
        #07131f,
        #0d2a3e
    );

    border:1px solid rgba(212,175,55,.28);

    border-radius:20px;

    box-shadow:

    0 25px 60px
    rgba(7,19,31,.20);

}


.apresentacao-normas-paineis::before{

    content:"";

    position:absolute;

    right:-60px;

    bottom:-70px;

    width:210px;

    height:210px;

    border-radius:50%;

    background:

    radial-gradient(
        circle,
        rgba(212,175,55,.17),
        transparent 68%
    );

    pointer-events:none;

}


.numero-tecnico-normas{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:24px;

}


.numero-tecnico-normas span{

    display:flex;

    align-items:center;

    justify-content:center;

    width:42px;

    height:42px;

    color:#111;

    background:var(--dourado);

    border-radius:50%;

    font-size:.72rem;

    font-weight:900;

}


.numero-tecnico-normas strong{

    color:var(--dourado);

    font-size:.72rem;

    text-transform:uppercase;

    letter-spacing:1px;

}


.apresentacao-normas-paineis h3{

    margin-bottom:17px;

    color:#fff;

    font-size:clamp(1.75rem,2.8vw,2.35rem);

    line-height:1.2;

}


.apresentacao-normas-paineis > p{

    margin-bottom:29px;

    color:#bdc8d1;

    font-size:.9rem;

    line-height:1.72;

}


/* ==========================================
   PRINCÍPIOS NORMATIVOS
========================================== */

.lista-principios-normativos{

    display:grid;

    gap:15px;

}


.principio-normativo{

    display:grid;

    grid-template-columns:20px 1fr;

    gap:11px;

    align-items:start;

}


.principio-normativo i{

    margin-top:3px;

    color:var(--dourado);

    font-size:.84rem;

}


.principio-normativo span{

    color:#d2d9df;

    font-size:.8rem;

    line-height:1.55;

}


.aviso-aplicabilidade-normas{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:22px 1fr;

    gap:11px;

    margin-top:30px;

    padding:17px;

    background:rgba(255,255,255,.06);

    border:1px solid rgba(255,255,255,.09);

    border-radius:11px;

}


.aviso-aplicabilidade-normas i{

    color:var(--dourado);

}


.aviso-aplicabilidade-normas p{

    color:#aebbc5;

    font-size:.72rem;

    line-height:1.55;

}


/* ==========================================
   GRID DAS NORMAS
========================================== */

.grid-normas-tecnicas{

    display:grid;

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

    gap:18px;

}


.card-norma-tecnica{

    position:relative;

    min-height:340px;

    padding:27px 25px;

    overflow:hidden;

    background:#fff;

    border:1px solid #e0e6ea;

    border-radius:16px;

    box-shadow:

    0 14px 38px
    rgba(11,22,34,.065);

    transition:.35s;

}


.card-norma-tecnica::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:

    linear-gradient(
        90deg,
        var(--dourado),
        transparent
    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}


.card-norma-tecnica:hover{

    transform:translateY(-6px);

    border-color:rgba(212,175,55,.45);

    box-shadow:

    0 23px 50px
    rgba(11,22,34,.12);

}


.card-norma-tecnica:hover::before{

    transform:scaleX(1);

}


.topo-card-norma{

    display:flex;

    align-items:center;

    gap:13px;

    margin-bottom:20px;

}


.icone-card-norma{

    width:51px;

    height:51px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--dourado-hover);

    background:rgba(212,175,55,.12);

    border-radius:12px;

    font-size:1.15rem;

    transition:.3s;

}


.card-norma-tecnica:hover
.icone-card-norma{

    color:#111;

    background:var(--dourado);

    transform:rotate(-4deg);

}


.topo-card-norma > span{

    color:#8a949c;

    font-size:.67rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:.8px;

}


.card-norma-tecnica h3{

    margin-bottom:12px;

    color:var(--azul-principal);

    font-size:1.28rem;

}


.card-norma-tecnica > p{

    min-height:94px;

    margin-bottom:19px;

    color:var(--cinza-texto);

    font-size:.81rem;

    line-height:1.63;

}


.card-norma-tecnica ul{

    display:grid;

    gap:8px;

}


.card-norma-tecnica li{

    position:relative;

    padding-left:19px;

    color:#53606a;

    font-size:.75rem;

}


.card-norma-tecnica li::before{

    content:"";

    position:absolute;

    top:7px;

    left:0;

    width:6px;

    height:6px;

    background:var(--dourado);

    border-radius:50%;

}


/* ==========================================
   CARD IEC EM DESTAQUE
========================================== */

.card-norma-destaque{

    color:#fff;

    background:

    linear-gradient(
        145deg,
        #081724,
        #103047
    );

    border-color:rgba(212,175,55,.35);

}


.card-norma-destaque h3{

    color:#fff;

}


.card-norma-destaque > p{

    color:#bdc8d1;

}


.card-norma-destaque li{

    color:#d1d9df;

}


.card-norma-destaque
.topo-card-norma > span{

    color:#aebbc5;

}


.selo-norma-principal{

    position:absolute;

    top:0;

    right:18px;

    padding:7px 12px;

    color:#111;

    background:var(--dourado);

    border-radius:0 0 8px 8px;

    font-size:.59rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:.7px;

}


/* ==========================================
   PILARES
========================================== */

.pilares-conformidade-paineis{

    margin-top:75px;

    padding:42px;

    background:#fff;

    border:1px solid #e0e6ea;

    border-radius:19px;

    box-shadow:

    0 20px 50px
    rgba(11,22,34,.08);

}


.cabecalho-pilares-conformidade{

    margin-bottom:32px;

    text-align:center;

}


.cabecalho-pilares-conformidade span{

    color:var(--dourado-hover);

    font-size:.69rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1px;

}


.cabecalho-pilares-conformidade h3{

    margin-top:7px;

    color:var(--azul-principal);

    font-size:clamp(1.6rem,2.7vw,2.2rem);

}


.grid-pilares-conformidade{

    display:grid;

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

    gap:16px;

}


.pilar-conformidade{

    position:relative;

    padding:27px 23px;

    background:#f7f9fa;

    border:1px solid #e4e9ed;

    border-radius:14px;

    transition:.3s;

}


.pilar-conformidade:hover{

    transform:translateY(-5px);

    background:#fff;

    border-color:rgba(212,175,55,.4);

    box-shadow:

    0 16px 35px
    rgba(11,22,34,.09);

}


.numero-pilar{

    position:absolute;

    top:18px;

    right:18px;

    color:#c3cbd1;

    font-size:.65rem;

    font-weight:900;

}


.pilar-conformidade > i{

    margin-bottom:20px;

    color:var(--dourado-hover);

    font-size:1.4rem;

}


.pilar-conformidade h4{

    margin-bottom:9px;

    color:var(--azul-principal);

    font-size:1rem;

}


.pilar-conformidade p{

    color:#69757e;

    font-size:.75rem;

    line-height:1.55;

}


/* ==========================================
   DOCUMENTAÇÃO
========================================== */

.bloco-documentacao-paineis{

    display:grid;

    grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);

    align-items:center;

    gap:50px;

    margin-top:40px;

    padding:55px;

    overflow:hidden;

    color:#fff;

    background:

    linear-gradient(
        130deg,
        #07131f,
        #0c293d
    );

    border:1px solid rgba(212,175,55,.28);

    border-radius:20px;

    box-shadow:

    0 25px 60px
    rgba(7,19,31,.18);

}


.tag-documentacao{

    color:var(--dourado);

    font-size:.68rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1px;

}


.documentacao-conteudo h3{

    max-width:680px;

    margin:9px 0 15px;

    color:#fff;

    font-size:clamp(1.7rem,3vw,2.45rem);

    line-height:1.18;

}


.documentacao-conteudo > p{

    max-width:720px;

    color:#bac6cf;

    font-size:.86rem;

    line-height:1.67;

}


.lista-documentacao-paineis{

    display:grid;

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

    gap:12px 20px;

    margin-top:28px;

}


.lista-documentacao-paineis div{

    display:flex;

    align-items:center;

    gap:9px;

}


.lista-documentacao-paineis i{

    color:var(--dourado);

    font-size:.75rem;

}


.lista-documentacao-paineis span{

    color:#d3dbe1;

    font-size:.78rem;

}


/* ==========================================
   VISUAL DA DOCUMENTAÇÃO
========================================== */

.documentacao-visual{

    position:relative;

    min-height:330px;

}


.icone-documentacao-central{

    position:absolute;

    top:50%;

    left:50%;

    width:130px;

    height:130px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#111;

    background:var(--dourado);

    border-radius:50%;

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

    box-shadow:

    0 0 0 22px
    rgba(212,175,55,.08),

    0 0 0 44px
    rgba(212,175,55,.04);

    font-size:2.35rem;

}


.documento-flutuante{

    position:absolute;

    display:flex;

    align-items:center;

    gap:8px;

    padding:11px 14px;

    background:rgba(255,255,255,.08);

    border:1px solid rgba(255,255,255,.11);

    border-radius:10px;

    backdrop-filter:blur(8px);

}


.documento-flutuante i{

    color:var(--dourado);

}


.documento-flutuante span{

    color:#fff;

    font-size:.72rem;

    font-weight:700;

}


.documento-flutuante-01{

    top:25px;

    left:30px;

}


.documento-flutuante-02{

    top:58px;

    right:10px;

}


.documento-flutuante-03{

    bottom:45px;

    left:5px;

}


.documento-flutuante-04{

    right:35px;

    bottom:20px;

}


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

.cta-normas-paineis{

    display:grid;

    grid-template-columns:70px minmax(0,1fr) auto;

    align-items:center;

    gap:24px;

    margin-top:40px;

    padding:35px 39px;

    background:#fff;

    border:1px solid #e0e6ea;

    border-radius:17px;

    box-shadow:

    0 18px 45px
    rgba(11,22,34,.08);

}


.cta-normas-icone{

    width:65px;

    height:65px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#111;

    background:var(--dourado);

    border-radius:50%;

    font-size:1.35rem;

}


.cta-normas-texto > span{

    color:var(--dourado-hover);

    font-size:.66rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1px;

}


.cta-normas-texto h3{

    margin:5px 0 7px;

    color:var(--azul-principal);

    font-size:1.35rem;

}


.cta-normas-texto p{

    max-width:750px;

    color:#737f88;

    font-size:.82rem;

    line-height:1.55;

}


.btn-cta-normas{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:52px;

    padding:14px 22px;

    color:#111;

    background:var(--dourado);

    border-radius:8px;

    font-size:.84rem;

    font-weight:900;

    white-space:nowrap;

    transition:.3s;

}


.btn-cta-normas:hover{

    background:var(--dourado-hover);

    transform:translateY(-3px);

    box-shadow:

    0 14px 30px
    rgba(212,175,55,.22);

}


/* ==========================================
   RESPONSIVIDADE
========================================== */

@media(max-width:1100px){

    .layout-normas-paineis{

        grid-template-columns:1fr;

    }


    .apresentacao-normas-paineis{

        position:relative;

        top:auto;

    }


    .grid-pilares-conformidade{

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

    }


    .bloco-documentacao-paineis{

        grid-template-columns:1fr;

    }


    .documentacao-visual{

        width:100%;

        max-width:500px;

        margin:0 auto;

    }


    .cta-normas-paineis{

        grid-template-columns:65px 1fr;

    }


    .btn-cta-normas{

        grid-column:1 / -1;

        width:max-content;

        margin-left:89px;

    }

}


@media(max-width:850px){

    .cabecalho-normas-paineis{

        align-items:flex-start;

        flex-direction:column;

    }


    .grid-normas-tecnicas{

        grid-template-columns:1fr;

    }


    .card-norma-tecnica{

        min-height:auto;

    }


    .card-norma-tecnica > p{

        min-height:auto;

    }

}


@media(max-width:650px){

    .secao-normas-paineis{

        padding:80px 0;

    }


    .apresentacao-normas-paineis{

        padding:31px 24px;

    }


    .pilares-conformidade-paineis{

        padding:31px 22px;

    }


    .grid-pilares-conformidade{

        grid-template-columns:1fr;

    }


    .bloco-documentacao-paineis{

        padding:38px 24px;

    }


    .lista-documentacao-paineis{

        grid-template-columns:1fr;

    }


    .documentacao-visual{

        min-height:300px;

        transform:scale(.9);

    }


    .cta-normas-paineis{

        grid-template-columns:1fr;

        padding:30px 23px;

    }


    .btn-cta-normas{

        grid-column:auto;

        width:100%;

        margin-left:0;

    }

}


@media(max-width:450px){

    .documentacao-visual{

        min-height:350px;

        transform:none;

    }


    .icone-documentacao-central{

        width:105px;

        height:105px;

        font-size:1.9rem;

    }


    .documento-flutuante-01{

        top:20px;

        left:0;

    }


    .documento-flutuante-02{

        top:70px;

        right:0;

    }


    .documento-flutuante-03{

        bottom:65px;

        left:0;

    }


    .documento-flutuante-04{

        right:0;

        bottom:10px;

    }

}

/* ==========================================
   CTA FINAL — QUADROS E PAINÉIS
========================================== */

.secao-cta-final-paineis{

    position:relative;

    padding:120px 0 85px;

    overflow:hidden;

    background:

    radial-gradient(
        circle at 12% 20%,
        rgba(212,175,55,.13),
        transparent 28%
    ),

    radial-gradient(
        circle at 88% 80%,
        rgba(43,103,148,.20),
        transparent 32%
    ),

    linear-gradient(
        135deg,
        #050f18 0%,
        #071a28 45%,
        #0b2639 100%
    );

}


.secao-cta-final-paineis::before{

    content:"";

    position:absolute;

    inset:0;

    opacity:.25;

    background-image:

    linear-gradient(
        rgba(255,255,255,.025) 1px,
        transparent 1px
    ),

    linear-gradient(
        90deg,
        rgba(255,255,255,.025) 1px,
        transparent 1px
    );

    background-size:45px 45px;

    pointer-events:none;

}


.secao-cta-final-paineis::after{

    content:"";

    position:absolute;

    top:-180px;

    right:-170px;

    width:470px;

    height:470px;

    border:1px solid rgba(212,175,55,.10);

    border-radius:50%;

    box-shadow:

    0 0 0 70px rgba(212,175,55,.025),
    0 0 0 140px rgba(212,175,55,.015);

    pointer-events:none;

}


.secao-cta-final-paineis .container{

    position:relative;

    z-index:2;

}


/* ==========================================
   LAYOUT
========================================== */

.cta-final-layout{

    display:grid;

    grid-template-columns:

    minmax(0,1fr)
    minmax(430px,.78fr);

    align-items:start;

    gap:70px;

}


/* ==========================================
   CONTEÚDO
========================================== */

.cta-final-conteudo{

    padding-top:25px;

}


.tag-cta-final{

    display:inline-flex;

    align-items:center;

    gap:9px;

    color:var(--dourado);

    font-size:.72rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1.3px;

}


.tag-cta-final::before{

    content:"";

    width:35px;

    height:2px;

    background:var(--dourado);

}


.cta-final-conteudo h2{

    max-width:780px;

    margin:18px 0 23px;

    color:#fff;

    font-size:clamp(2.4rem,4.8vw,4.1rem);

    line-height:1.08;

    letter-spacing:-1.7px;

}


.texto-principal-cta-final{

    max-width:740px;

    color:#bec9d1;

    font-size:1rem;

    line-height:1.78;

}


/* ==========================================
   BENEFÍCIOS
========================================== */

.beneficios-cta-final{

    display:grid;

    gap:15px;

    margin-top:42px;

}


.beneficio-cta-final{

    display:grid;

    grid-template-columns:56px 1fr;

    align-items:center;

    gap:16px;

    max-width:680px;

    padding:15px 18px;

    background:rgba(255,255,255,.045);

    border:1px solid rgba(255,255,255,.08);

    border-radius:13px;

    backdrop-filter:blur(8px);

    transition:.3s;

}


.beneficio-cta-final:hover{

    transform:translateX(6px);

    background:rgba(255,255,255,.075);

    border-color:rgba(212,175,55,.26);

}


.icone-beneficio-cta{

    width:51px;

    height:51px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--dourado);

    background:rgba(212,175,55,.10);

    border-radius:11px;

    font-size:1.15rem;

}


.beneficio-cta-final strong{

    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:.9rem;

}


.beneficio-cta-final span{

    display:block;

    color:#aebac3;

    font-size:.76rem;

    line-height:1.45;

}


/* ==========================================
   CANAIS DE CONTATO
========================================== */

.canais-contato-cta{

    display:grid;

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

    gap:14px;

    margin-top:37px;

}


.canal-cta{

    display:grid;

    grid-template-columns:42px 1fr auto;

    align-items:center;

    gap:12px;

    min-height:80px;

    padding:15px 17px;

    border-radius:13px;

    transition:.3s;

}


.canal-cta > i:first-child{

    font-size:1.45rem;

}


.canal-cta > i:last-child{

    font-size:.72rem;

}


.canal-cta span{

    display:block;

    margin-bottom:3px;

    font-size:.65rem;

}


.canal-cta strong{

    display:block;

    font-size:.78rem;

}


.canal-whatsapp-cta{

    color:#fff;

    background:rgba(37,211,102,.12);

    border:1px solid rgba(37,211,102,.26);

}


.canal-whatsapp-cta > i:first-child{

    color:#3fdd79;

}


.canal-whatsapp-cta span{

    color:#a8cdb5;

}


.canal-whatsapp-cta:hover{

    transform:translateY(-4px);

    background:rgba(37,211,102,.19);

    border-color:rgba(37,211,102,.43);

    box-shadow:

    0 15px 34px
    rgba(10,60,28,.22);

}


.canal-email-cta{

    color:#fff;

    background:rgba(212,175,55,.10);

    border:1px solid rgba(212,175,55,.24);

}


.canal-email-cta > i:first-child{

    color:var(--dourado);

}


.canal-email-cta span{

    color:#bfb58e;

}


.canal-email-cta:hover{

    transform:translateY(-4px);

    background:rgba(212,175,55,.16);

    border-color:rgba(212,175,55,.40);

    box-shadow:

    0 15px 34px
    rgba(83,66,15,.18);

}


/* ==========================================
   INFORMAÇÃO
========================================== */

.informacao-atendimento-cta{

    display:grid;

    grid-template-columns:20px 1fr;

    gap:11px;

    max-width:690px;

    margin-top:24px;

    padding:16px 18px;

    background:rgba(255,255,255,.035);

    border-left:3px solid var(--dourado);

    border-radius:0 9px 9px 0;

}


.informacao-atendimento-cta i{

    margin-top:3px;

    color:var(--dourado);

    font-size:.82rem;

}


.informacao-atendimento-cta p{

    color:#9daab4;

    font-size:.73rem;

    line-height:1.55;

}


/* ==========================================
   FORMULÁRIO
========================================== */

.cta-final-formulario-wrapper{

    position:relative;

    padding:36px 34px;

    background:

    linear-gradient(
        150deg,
        rgba(255,255,255,.98),
        rgba(245,247,249,.98)
    );

    border:1px solid rgba(255,255,255,.24);

    border-radius:22px;

    box-shadow:

    0 35px 80px
    rgba(0,0,0,.30);

}


.cta-final-formulario-wrapper::before{

    content:"";

    position:absolute;

    top:0;

    left:34px;

    right:34px;

    height:4px;

    background:

    linear-gradient(
        90deg,
        transparent,
        var(--dourado),
        transparent
    );

    border-radius:0 0 20px 20px;

}


.cabecalho-formulario-cta{

    margin-bottom:27px;

}


.cabecalho-formulario-cta > span{

    color:var(--dourado-hover);

    font-size:.66rem;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:1px;

}


.cabecalho-formulario-cta h3{

    margin:7px 0 9px;

    color:var(--azul-principal);

    font-size:1.65rem;

    line-height:1.2;

}


.cabecalho-formulario-cta p{

    color:#71808a;

    font-size:.79rem;

    line-height:1.55;

}


.formulario-cta-paineis{

    display:grid;

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

    gap:17px 14px;

}


.grupo-campo-completo{

    grid-column:1 / -1;

}


.grupo-campo-cta label{

    display:block;

    margin-bottom:7px;

    color:#34424d;

    font-size:.72rem;

    font-weight:800;

}


.campo-cta-com-icone{

    position:relative;

}


.campo-cta-com-icone > i{

    position:absolute;

    z-index:2;

    top:50%;

    left:15px;

    color:#a4afb7;

    font-size:.78rem;

    transform:translateY(-50%);

    pointer-events:none;

}


.campo-cta-com-icone input,
.campo-cta-com-icone select,
.campo-cta-com-icone textarea{

    width:100%;

    color:#26343e;

    background:#fff;

    border:1px solid #dce3e8;

    border-radius:9px;

    outline:none;

    font-family:inherit;

    font-size:.77rem;

    transition:.25s;

}


.campo-cta-com-icone input,
.campo-cta-com-icone select{

    height:51px;

    padding:0 41px;

}


.campo-cta-com-icone select{

    padding-right:35px;

    cursor:pointer;

}


.campo-cta-com-icone textarea{

    min-height:135px;

    padding:15px 15px 15px 41px;

    resize:vertical;

    line-height:1.55;

}


.campo-textarea-cta > i{

    top:20px;

    transform:none;

}


.campo-cta-com-icone input::placeholder,
.campo-cta-com-icone textarea::placeholder{

    color:#a2acb4;

}


.campo-cta-com-icone input:focus,
.campo-cta-com-icone select:focus,
.campo-cta-com-icone textarea:focus{

    border-color:var(--dourado);

    box-shadow:

    0 0 0 3px
    rgba(212,175,55,.12);

}


.campo-cta-com-icone:focus-within > i{

    color:var(--dourado-hover);

}


/* ==========================================
   HONEYPOT
========================================== */

.campo-honeypot{

    position:absolute !important;

    left:-9999px !important;

    width:1px !important;

    height:1px !important;

    opacity:0 !important;

}


/* ==========================================
   CHECKBOX
========================================== */

.aceite-formulario-cta{

    grid-column:1 / -1;

    display:grid;

    grid-template-columns:19px 1fr;

    align-items:start;

    gap:9px;

    cursor:pointer;

}


.aceite-formulario-cta input{

    position:absolute;

    opacity:0;

    pointer-events:none;

}


.checkbox-personalizado-cta{

    width:18px;

    height:18px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-top:1px;

    background:#fff;

    border:1px solid #cfd8de;

    border-radius:4px;

    transition:.2s;

}


.checkbox-personalizado-cta i{

    color:#111;

    font-size:.58rem;

    opacity:0;

    transform:scale(.5);

    transition:.2s;

}


.aceite-formulario-cta input:checked
+ .checkbox-personalizado-cta{

    background:var(--dourado);

    border-color:var(--dourado);

}


.aceite-formulario-cta input:checked
+ .checkbox-personalizado-cta i{

    opacity:1;

    transform:scale(1);

}


.aceite-formulario-cta > span:last-child{

    color:#74818a;

    font-size:.68rem;

    line-height:1.45;

}


/* ==========================================
   BOTÃO DE ENVIO
========================================== */

.btn-enviar-cta{

    grid-column:1 / -1;

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:11px;

    width:100%;

    min-height:55px;

    margin-top:2px;

    overflow:hidden;

    color:#111;

    background:

    linear-gradient(
        100deg,
        #d4af37,
        #e7c95f
    );

    border:0;

    border-radius:9px;

    cursor:pointer;

    font-family:inherit;

    font-size:.82rem;

    font-weight:900;

    transition:.3s;

}


.btn-enviar-cta::before{

    content:"";

    position:absolute;

    top:0;

    left:-100%;

    width:65%;

    height:100%;

    background:

    linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.38),
        transparent
    );

    transform:skewX(-20deg);

    transition:.55s;

}


.btn-enviar-cta:hover{

    transform:translateY(-3px);

    box-shadow:

    0 15px 32px
    rgba(173,134,20,.25);

}


.btn-enviar-cta:hover::before{

    left:135%;

}


.btn-enviar-cta:disabled{

    cursor:not-allowed;

    opacity:.75;

    transform:none;

}


.carregando-btn-cta{

    display:none;

}


.btn-enviar-cta.enviando
.texto-btn-cta,

.btn-enviar-cta.enviando
.icone-seta-btn-cta{

    display:none;

}


.btn-enviar-cta.enviando
.carregando-btn-cta{

    display:inline-flex;

    align-items:center;

    gap:8px;

}


/* ==========================================
   MENSAGEM DE STATUS
========================================== */

.mensagem-form-cta{

    display:none;

    grid-column:1 / -1;

    padding:13px 15px;

    border-radius:8px;

    font-size:.72rem;

    line-height:1.5;

}


.mensagem-form-cta.sucesso{

    display:block;

    color:#176334;

    background:#eaf8ef;

    border:1px solid #b8e4c8;

}


.mensagem-form-cta.erro{

    display:block;

    color:#8a2929;

    background:#fff0f0;

    border:1px solid #edc5c5;

}


/* ==========================================
   SEGURANÇA
========================================== */

.seguranca-formulario-cta{

    grid-column:1 / -1;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:7px;

    color:#8a959d;

    font-size:.62rem;

    text-align:center;

}


.seguranca-formulario-cta i{

    color:#84929b;

}


/* ==========================================
   FAIXA FINAL
========================================== */

.faixa-final-cta-paineis{

    display:grid;

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

    gap:1px;

    margin-top:75px;

    overflow:hidden;

    background:rgba(255,255,255,.09);

    border:1px solid rgba(255,255,255,.09);

    border-radius:14px;

}


.faixa-final-cta-paineis > div{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:76px;

    padding:18px;

    background:rgba(6,18,28,.84);

    text-align:center;

}


.faixa-final-cta-paineis i{

    color:var(--dourado);

    font-size:1rem;

}


.faixa-final-cta-paineis span{

    color:#bdc8d1;

    font-size:.7rem;

    line-height:1.4;

}


/* ==========================================
   RESPONSIVIDADE
========================================== */

@media(max-width:1150px){

    .cta-final-layout{

        grid-template-columns:1fr;

    }


    .cta-final-conteudo{

        padding-top:0;

    }


    .cta-final-formulario-wrapper{

        width:100%;

        max-width:760px;

        margin:0 auto;

    }

}


@media(max-width:850px){

    .faixa-final-cta-paineis{

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

    }

}


@media(max-width:650px){

    .secao-cta-final-paineis{

        padding:80px 0 60px;

    }


    .cta-final-layout{

        gap:48px;

    }


    .cta-final-conteudo h2{

        font-size:clamp(2.15rem,11vw,3.1rem);

    }


    .canais-contato-cta{

        grid-template-columns:1fr;

    }


    .cta-final-formulario-wrapper{

        padding:32px 22px;

        border-radius:17px;

    }


    .formulario-cta-paineis{

        grid-template-columns:1fr;

    }


    .grupo-campo-completo{

        grid-column:auto;

    }


    .aceite-formulario-cta,
    .btn-enviar-cta,
    .mensagem-form-cta,
    .seguranca-formulario-cta{

        grid-column:auto;

    }


    .faixa-final-cta-paineis{

        grid-template-columns:1fr;

    }


    .faixa-final-cta-paineis > div{

        justify-content:flex-start;

        min-height:auto;

        text-align:left;

    }

}


@media(max-width:430px){

    .beneficio-cta-final{

        grid-template-columns:1fr;

    }


    .canal-cta{

        grid-template-columns:37px 1fr auto;

        padding:14px;

    }


    .canal-cta strong{

        font-size:.71rem;

    }

}

/* ==========================================
   BOTÃO FLUTUANTE WHATSAPP
========================================== */

.whatsapp-float{

    position:fixed;

    right:28px;

    bottom:28px;

    width:72px;

    height:72px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#25D366;

    color:#fff;

    font-size:2.2rem;

    box-shadow:
        0 15px 35px rgba(37,211,102,.45);

    z-index:9999;

    transition:.35s;

    animation:pulseWhatsapp 2s infinite;

}

.whatsapp-float:hover{

    transform:scale(1.12);

    background:#1ebe5d;

    box-shadow:
        0 22px 45px rgba(37,211,102,.60);

}

@keyframes pulseWhatsapp{

    0%{

        box-shadow:
            0 0 0 0 rgba(37,211,102,.55);

    }

    70%{

        box-shadow:
            0 0 0 18px rgba(37,211,102,0);

    }

    100%{

        box-shadow:
            0 0 0 0 rgba(37,211,102,0);

    }

}

@media(max-width:768px){

    .whatsapp-float{

        width:62px;

        height:62px;

        right:18px;

        bottom:18px;

        font-size:1.9rem;

    }

}