@font-face {
    font-family: 'berlinsans';
    src: url('./fonts/berlinsansfb_reg.ttf') format('truetype');
}

@font-face {
    font-family: 'berlinsansbold';
    src: url('./fonts/BRLNSB.TTF') format('truetype');
}

@font-face {
    font-family: 'poppins';
    src: url('./fonts/Poppins-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'poppinsbold';
    src: url('./fonts/Poppins-Bold.ttf') format('truetype');
}

body {
    font-family: 'berlinsans', Arial, sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}


/* NAVBAR */

.navbar-top {
    background: #d3dd5d;
}

.navbar-top .nav-item {
    margin: 0 15px;
}

.navbar-top a.nav-link {
    display: inline-block;
    transition: transform 0.2s ease, color 0.2s ease;
}

.navbar-top a.nav-link:hover,
.navbar-top a.nav-link:focus-visible {
    transform: scale(1.08);
    color: #000000;
}

.offcanvas .nav-link {
    display: inline-block;
    transition: transform 0.2s ease, color 0.2s ease;
}

.offcanvas .nav-link:hover,
.offcanvas .nav-link:focus-visible {
    transform: scale(1.06);
    color: #000000;
}

.social img {
    width: 30px;
    margin-left: 10px;
    transition: transform 0.2s ease;
}

.social img:hover,
.social a:hover img,
.social a:focus-visible img {
    transform: scale(1.12);
}


/* HERO */

.hero {
    background: #05264a;
    background-image: url('./img/bk1.png');
    padding: 100px 0 150px 0;
    color: white;
    position: relative;
    overflow: hidden;
    min-height: 600px;
    background-size: cover;
    background-position: center;
}

.hugo-hero {
    width: 100%;
    max-width: 650px;
    height: auto;
    margin: 0 -30% -50% 0;
    position: relative;
    transform: scale(1.1);
}

.logo {
    width: 100%;
    max-width: 500px;
    margin: 0 0 0 15%;
    height: auto;

}

.hero-text {
    font-family: 'berlinsans', Arial, sans-serif;
    /* tornar responsivo sem quebrar as 4 linhas fixas */
    font-size: clamp(14px, 1.6vw, 16px);
    line-height: 1.2;
    max-width: 350px;
    margin-bottom: 20%;
    text-align: right;
    /* garante que padding seja contado dentro da largura e evita que margem direita quebre o layout */
    box-sizing: border-box;
    padding-right: 12px;

    /* força 4 linhas separadas e alinhamento controlado */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end; /* texto alinhado à direita na coluna */
    gap: 0.1rem;
}

.hero-text .hero-line {
    display: block;
    width: 100%;
    white-space: nowrap; /* evita quebras dentro da mesma linha */
    overflow: hidden;
    text-overflow: ellipsis; /* caso não caiba, mostra elipse em vez de quebrar */
}

@media (max-width: 768px) {
    /* em telas pequenas queremos deslocar o bloco levemente para a esquerda e manter 4 linhas */
    .hero-text {
        align-items: flex-start !important; /* empurra para a esquerda da coluna */
        text-align: left !important;
        padding-right: 0 !important;
        padding-left: 6%;
        margin: 0 0 10% 0;
        font-size: clamp(12px, 2.2vw, 14px);
        line-height: 1.25;
        max-width: 72%; /* limita a largura para evitar colisão com a imagem */
    }

    .hero-text .hero-line {
        white-space: normal; /* permite quebra apenas se necessário em telas muito pequenas */
    }
}

.logo-if-hero {
    position: absolute;
    bottom: 13%;
    right: 8%;
    z-index: 10;
}

.logo-if-hero img {
    max-width: 80px;
    height: auto;
}

.wave {
    position: absolute;
    bottom: -30%;
    left: 0;
    width: 100%;
    line-height: 0;
    z-index: 5;
}

.wave svg {
    width: 100%;
    height: auto;
}

@media (min-width: 1201px) and (max-width: 1400px) {

    .hero {
        padding: 120px 0 100px 0;
        text-align: center;
    }

    .logo {
        margin-top: 40px;
        max-width: 500px;
        transform: scale(1.2);
    }

    .hero-text {
        margin: auto;
        margin-top: 20px;
    }

    .hugo-hero {
        margin-right: -30%;
        transform: scale(1.2);
    }

    .wave {
        bottom: -23%;
    }

    .logo-if-hero {
        right: 8%;
        bottom: 15%;
    }

}

@media (max-width: 992px) {

    .offcanvas {
        background: #d3dd5d;
    }

    .offcanvas-title {
        font-size: 24px;
    }


    .offcanvas .nav-link {
        font-size: 18px;
        padding: 10px 0;
    }

    .hero {
        padding: 120px 0 180px 0;
        text-align: center;
    }

    .logo {
        margin-bottom: 80px;
    }

    .hero-text {
        margin: auto;
        margin-top: 20px;
    }

    .hugo-hero {
        margin-right: -30%;
        transform: scale(1.2);
    }

    .wave {
        bottom: -10%;
    }


    .logo-if-hero {
        right: 65px;
        bottom: 45px;
    }

    .logo-if-hero img {
        max-width: 60px;
    }

}

@media (min-width: 993px) and (max-width: 1199px) {

    .nav-item {
        font-size: 10px;
    }

    .hero {
        text-align: center;
        padding: 100px 0 0px 0;
        min-height: auto;
    }

    /* logo acima */
    .logo {
        max-width: 400px;
        margin: auto;
        display: block;
        margin-bottom: 22%;
    }

    /* foto */
    .hugo-hero {
        margin: 0 -20% -12% 0;
        transform: scale(1.2)
    }

    /* texto */
    .hero-text {
        text-align: right;
        font-size: 12px;
        line-height: 1.3;
        margin: 0 20% 85% 0;
    }

    .wave {
        bottom: -30%;
    }

    /* logo if */
    .logo-if-hero {
        right: 7%;
        bottom: 8%;
    }

    .logo-if-hero img {
        max-width: 80px;
    }

}

@media (max-width: 768px) {

    .hugo-hero {
        margin-bottom: -55%;
        margin-left: -6% !important;
        /* diminuir deslocamento horizontal para reduzir sobreposição com o texto */
        transform: translateX(-12%) scale(1.15) !important;
    }

    .hero-text {
        max-width: 100%;
        /* usar padding em vez de margin-right para criar espaço interno sem alterar o fluxo da coluna */
        margin: 0 0 10% 0;
        padding-right: 15%;
        text-align: right;
        text-justify: inter-word;
        text-align-last: right;
        hyphens: auto;
        overflow-wrap: anywhere;
        word-break: normal;
        font-size: 12px;
        line-height: 1.4;
         transform: translateX(-13%) !important;
    }

    /* logo acima */
    .logo {
        max-width: 350px;
        margin: auto;
        display: block;
        margin-bottom: 22%;
    }

    .wave {
        bottom: 0;
    }

    .logo-if-hero {
        right: 23px;
        bottom: 30px;
    }

    .logo-if-hero img {
        max-width: 44px;
    }
}

/* ============================= */
/* SEÇÃO FRASE */
/* ============================= */

.frase {
    background: #061527;
    padding: clamp(72px, 9vw, 120px) 0;
    color: white;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: clamp(760px, 100vh, 1100px);
}

.frase-top {
    position: relative;
    min-height: clamp(420px, 55vw, 760px);
    padding-bottom: clamp(220px, 24vw, 390px);
}

/* garante que o conteúdo fique acima dos blobs */
.frase .container .texto-direita {
    position: relative;
    z-index: 2;
}

/* ============================= */
/* TÍTULOS */
/* ============================= */

.frase h1 {
    font-size: 65px;
    font-family: 'berlinsansbold', Arial, sans-serif;
}

/* ============================= */
/* TEXTO PRINCIPAL */
/* ============================= */

.frase-texto {
    font-family: 'poppins', Arial, sans-serif;
    font-size: 20px;
    line-height: 1.6;
    text-align: justify;
    max-width: 80%;
    margin: auto;
    padding-top: 80px;
}

.texto-direita {
    font-family: 'poppins', Arial, sans-serif;
    font-size: 18px;
    line-height: 1.6;
    text-align: justify;
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 0 auto;
}

.frase .col-lg-7 {
    margin-left: auto;
    margin-right: 0;
}

.frase>.container {
    position: relative;
    z-index: 2;
    width: 100%;
    margin-top: auto;
    padding-top: clamp(145px, 12vw, 213px);
}

@media (min-width: 992px) {
    .texto-direita {
        width: 70%;
    }
}

.texto-direita p {
    margin-bottom: 20px;
}

/* ============================= */
/* BLOBS */
/* ============================= */

.blob-right-frase {
    position: absolute;
    top: clamp(220px, 45%, 600px);
    right: 0;
    display: block;
    width: clamp(240px, 40vw, 560px);
    max-width: none;
    height: auto;
    object-fit: cover;
    z-index: 1;
}

.blob-right-frase-text {
    fill: #ffffff;
    font-family: 'berlinsans', Arial, sans-serif;
    font-size: 90px;
    dominant-baseline: middle;
}

.blob-wrapper {
    position: absolute;
    bottom: 70%;
    width: 450px;
    z-index: 1;
}

.blob-left-frase {
    position: absolute;
    left: 63%;
    transform: translateX(-50%);
    width: 125%;
    max-width: 125%;
    height: auto;
    object-fit: cover;
}

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

@media (min-width: 993px) and (max-width: 1199px) {

    .frase h1 {
        font-size: 55px;
    }

    .frase-texto {
        font-size: 18px;
        padding-top: 60px;
    }

    .blob-wrapper {
        width: 350px;
        left: -100px;
    }

    .blob-right-frase {
        top: clamp(205px, 54%, 640px);
        width: clamp(220px, 46vw, 500px);
    }

    .texto-direita {
        width: 92%;
        margin-left: auto;
        margin-right: 0;
    }

    .frase>.container {
        padding-top: clamp(190px, 20vw, 300px);
    }
}

@media (max-width:992px) {

    .frase {
        min-height: auto;
    }

    .frase-top {
        min-height: clamp(360px, 68vw, 620px);
    }

    .frase-texto {
        max-width: 90%;
    }

    .blob-right-frase {
        top: clamp(190px, 60%, 630px);
        width: clamp(200px, 52vw, 430px);
    }

    .blob-right-frase-text {
        font-size: 110px;
    }

    .blob-wrapper {
        bottom: 67%;
    }

    .blob-left-frase {
        display: none;
        width: clamp(200px, 25vw, 430px);
        left: 60%;
    }

    .texto-direita {
        margin: auto;
    }

    .frase>.container {
        padding-top: clamp(145px, 18vw, 240px);
    }
}

@media (max-width:768px) {

    .frase {
        min-height: auto;
    }

    .frase h1 {
        font-size: 40px;
    }

    .blob-wrapper {
        width: clamp(130px, 32vw, 210px);
        left: clamp(-40px, -6vw, -10px);
        bottom: -8px;
    }

    .blob-right-frase {
        top: auto;
        bottom: clamp(-110px, -25vw, -50px);
        right: -12px;
        width: clamp(200px, 64vw, 360px);
    }

    .blob-right-frase-text {
        font-size: 116px;
    }

    .blob-left-frase {
        display: none;
    }

    .frase-top {
        padding-bottom: clamp(190px, 34vw, 280px);
    }

    .texto-direita {
        width: 88%;
        margin: auto;
        padding-bottom: 10%;
    }

    .frase>.container {
        padding-top: clamp(170px, 22vw, 240px);
    }
}

/* COMPROMISSO */

.compromisso {
    background: #021a35;
    color: white;
}

.compromisso-blob-texto {
    position: relative;
    overflow: visible;
}

.compromisso-img-crop {
    position: relative;
}

.hugo-compromisso {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.blob-compromisso {
    position: absolute;
    left: 0;
    bottom: clamp(-115px, -10vw, -48px);
    width: clamp(320px, 52vw, 760px);
    height: auto;
    z-index: 2;
    pointer-events: none;
}

.blob-compromisso-text {
    fill: #ffffff;
    font-family: 'berlinsans', Arial, sans-serif;
    font-size: 90px;
}

.blob-compromisso-text-bold {
    font-family: 'berlinsansbold', Arial, sans-serif;
}

.compromisso-texto {
    font-family: 'poppins', Arial, sans-serif;
    font-size: 20px;
    line-height: 1.6;
    text-align: justify;
    max-width: min(1120px, 90%);
    margin: 5% auto 0 auto;
    padding: 150px 70px;
}

@media (max-width: 992px) {
    .compromisso-img-crop {
        height: clamp(360px, 62vw, 560px);
        overflow: hidden;
    }

    .hugo-compromisso {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 50% 28%;
        transform: scale(1.6);
        transform-origin: 63% 28%;
    }

    .blob-compromisso {
        width: clamp(240px, 60vw, 910px);
        bottom: clamp(-140px, -12vw, -68px);
    }

    .compromisso-texto {
        padding: 100px 30px;
    }

    .blob-compromisso-text {
        font-size: 90px;
    }
}

@media (max-width: 768px) {
    .compromisso-img-crop {
        height: clamp(200px, 36vw, 320px);
        overflow: hidden;
    }

    .compromisso-img-crop {
        height: clamp(360px, 62vw, 560px);
        overflow: hidden;
    }

    .blob-compromisso {
        width: clamp(240px, 82vw, 910px);
    }

    .hugo-compromisso {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 50% 28%;
        transform: scale(1.9);
        transform-origin: 64% 28%;
    }

}

/* PROPOSTAS INTRO */

.propostas-intro {
    background: #3c6ab3;
    color: white;
    padding: 0;
}

.propostas-wrap {
    position: relative;
    overflow: visible;
    z-index: 3;
    isolation: isolate;
}

.propostas-img {
    display: block;
    width: 100%;
    height: auto;
}

.proxima-proposta-titulo {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5.2vw;
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    z-index: 4;
    cursor: pointer;
    line-height: 0;
}

.proposta-titulo-svg {
    display: block;
    width: 100%;
    height: auto;
}

.propostas-logo-overlay {
    position: absolute;
    top: 8%;
    left: 6%;
    width: min(36vw, 700px);
    height: auto;
    z-index: 5;
}

.propostas-copy-overlay {
    position: absolute;
    top: 38%;
    left: 6%;
    width: min(42vw, 520px);
    max-width: 520px;
    z-index: 5;
}

.propostas-copy-overlay h2 {
    margin: 0 0 18px;
    font-family: 'berlinsansbold', Arial, sans-serif;
    font-size: clamp(30px, 4.8vw, 74px);
    line-height: 1.02;
    text-wrap: balance;
    color: #ffffff;
}

.propostas-copy-overlay .btn {
    border-radius: 999px;
    padding: 10px 20px;
    margin-top: clamp(14px, 3vw, 48px);
    font-family: 'berlinsans', Arial, sans-serif;
    font-size: clamp(14px, 1.45vw, 22px);
    white-space: nowrap;
    color: #4b66a2;
    transition: transform 0.2s ease, color 0.2s ease;
}

.propostas-intro .proxima-proposta-titulo {
    bottom: clamp(-78px, -6.8vw, -26px);
}

.propostas-copy-overlay .btn:hover,
.propostas-copy-overlay .btn:focus-visible {
    transform: scale(1.08);
    color: #243f74;
}

@media (min-width: 993px) and (max-width: 1199px) {
    .propostas-logo-overlay {
        top: 10%;
        left: 8%;
        width: min(40vw, 350px);
    }

    .propostas-copy-overlay {
        top: 40%;
        left: 8%;
        width: min(58vw, 340px);
    }

    .propostas-copy-overlay h2 {
        margin-bottom: 10px;
        font-size: clamp(22px, 5.2vw, 50px);
    }

    .propostas-copy-overlay .btn {
        padding: 9px 17px;
        font-size: clamp(12px, 1.9vw, 18px);
    }

    .propostas-intro .proxima-proposta-titulo {
        bottom: clamp(-52px, -7.4vw, -16px);
    }
}

@media (max-width: 992px) {
    .propostas-logo-overlay {
        top: 8%;
        left: 8%;
        width: min(50vw, 320px);
    }

    .propostas-copy-overlay {
        top: 40%;
        left: 8%;
        width: min(75vw, 343px);
    }

    .propostas-copy-overlay h2 {
        font-size: clamp(21px, 8vw, 45px);
    }

    .propostas-copy-overlay .btn {
        margin-top: 10px;
        padding: 8px 15px;
        font-size: clamp(11px, 2.2vw, 14px);
    }

    .propostas-intro .proxima-proposta-titulo {
        bottom: clamp(-40px, -7vw, -14px);
    }
}

@media (max-width: 768px) {
    .propostas-logo-overlay {
        top: 5%;
        left: 8%;
        width: min(42vw, 220px);
    }

    .propostas-copy-overlay {
        top: 38%;
        left: 8%;
        width: min(72vw, 270px);
    }

    .propostas-copy-overlay h2 {
        font-size: clamp(18px, 6vw, 28px);
        line-height: 1.08;
    }

    .propostas-copy-overlay .btn {
        margin-top: 9px;
        padding: 7px 13px;
        font-size: clamp(10px, 2.5vw, 13px);
    }

    .propostas-intro .proxima-proposta-titulo {
        bottom: clamp(-30px, -6.2vw, -12px);
    }
}


/* BLOCOS PROPOSTAS */

.bloco {
    padding: 0 0 56px 0;
}

.proposta-toggle {
    width: 100%;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0;
    font-family: 'berlinsansbold', Arial, sans-serif;
    font-size: clamp(46px, 8vw, 120px);
    line-height: 0.95;
    color: #061527;
    text-align: left;
    cursor: pointer;
}

.proposta-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(22px, 3vw, 42px);
    height: clamp(22px, 3vw, 42px);
    transition: transform 0.25s ease;
}

.proposta-icon img {
    display: block;
    width: 75%;
    height: auto;
}

.proposta-toggle[aria-expanded="true"] .proposta-icon {
    transform: rotate(180deg);
}

.proposta-conteudo {
    margin-top: 18px;
}

.proposta-conteudo p {
    margin: 0;
    max-width: 100%;
    padding: 0 20px;
    font-family: 'poppins', Arial, sans-serif;
    font-size: clamp(15px, 1.5vw, 21px);
    line-height: 1.5;
    color: #061527;
}

@media (max-width: 1199px) {
    .bloco {
        padding: 40px 0;
    }

    .proposta-toggle {
        font-size: clamp(36px, 14vw, 82px);
    }

    .proposta-conteudo {
        margin-top: 14px;
    }

    .proposta-icon-center {
        margin-top: 18px;
    }
}

/* SHARED PROPOSTA SECTION STYLES */

.proposta-subtitle {
    display: block;
    font-family: 'poppinsbold', Arial, sans-serif;
    font-size: clamp(20px, 5vw, 40px);
    color: #061527;
}

.proposta-icon-center {
    width: clamp(36px, 3.2vw, 46px);
    height: clamp(36px, 3.2vw, 46px);
    margin: 32px auto 0;
    border: 3px solid #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.proposta-toggle[aria-expanded="true"] .proposta-icon-center {
    transform: rotate(180deg);
}

.dialogar .proposta-toggle,
.construir .proposta-toggle,
.avancar .proposta-toggle {
    display: block;
    text-align: center;
    padding-top: clamp(40px, 8vw, 120px);
}

.dialogar .proposta-toggle[aria-expanded="false"],
.construir .proposta-toggle[aria-expanded="false"] {
    padding-bottom: clamp(72px, 18vw, 400px);
}

.avancar .proposta-toggle[aria-expanded="false"] {
    padding-bottom: clamp(90px, 10vw, 200px);
}

.dialogar .proposta-conteudo,
.construir .proposta-conteudo {
    margin-top: 28px;
    padding-bottom: clamp(48px, 25vw, 300px);
}

.avancar .proposta-conteudo {
    margin-top: 28px;
    padding-bottom: clamp(48px, 15vw, 300px);
}

/* DIALOGAR */

.dialogar,
.construir,
.avancar {
    position: relative;
    z-index: 1;
}

.dialogar {
    background: #d3dd5d;
}

/* CONSTRUIR */

.construir {
    background: #7e95cc;
}

/* AVANÇAR */

.avancar {
    background: #87d1d3;
}

/* PARTICIPAÇÃO */

.participacao {
    background: #021a35;
    color: white;
    position: relative;
    min-height: clamp(520px, 72vw, 960px);
    overflow: visible;
}

.hugo-participacao {
    position: absolute;
    left: 0;
    bottom: clamp(-100px, -3vw, -60px);
    width: clamp(300px, 58vw, 850px);
    height: auto;
    z-index: 2;
}

.participacao-texto-col {
    position: absolute;
    top: clamp(40px, 7vw, 100px);
    left: clamp(320px, 60vw, 850px);
    right: clamp(20px, 4vw, 80px);
    z-index: 3;
}

.participacao-titulo {
    font-family: 'berlinsansbold', Arial, sans-serif;
    font-size: clamp(28px, 4vw, 54px);
    line-height: 1.15;
    color: white;
    margin-bottom: 24px;
}

.participacao-destaque {
    color: #d3dd5d;
}

.participacao-descricao {
    font-family: 'poppins', Arial, sans-serif;
    font-size: clamp(13px, 1.3vw, 17px);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.88);
    max-width: 380px;
}

.participacao-rodape {
    position: absolute;
    bottom: clamp(24px, 10vw, 190px);
    right: clamp(20px, 10vw, 150px);
    font-family: 'poppins', Arial, sans-serif;
    font-size: clamp(13px, 1.3vw, 17px);
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.8);
    max-width: clamp(180px, 24vw, 300px);
    z-index: 4;
}

/* o grid vira apenas um wrapper semântico, sem layout */
.participacao-grid {
    position: static;
}

.participacao-foto-col {
    display: contents;
}

/* <= 1199px (tablet landscape / notebook menor) */
@media (min-width: 993px) and (max-width: 1199px) {
    .participacao {
        min-height: clamp(560px, 95vw, 980px);
        padding-bottom: 0;
    }

    .hugo-participacao {
        position: absolute;
        left: 0;
        right: 0;
        top: clamp(15px, 3vw, 30px);
        bottom: auto;
        width: 77vw;
        max-width: none;
        margin: 0;
        display: block;
    }

    .participacao-texto-col {
        position: absolute;
        top: clamp(22px, 8vw, 800px);
        left: auto;
        right: clamp(18px, 18vw, 120px);
        width: clamp(240px, 34vw, 380px);
        padding: 0;
        z-index: 4;
    }

    .participacao-descricao {
        font-size: clamp(10px, 1.6vw, 18px);
    }

    .participacao-rodape {
        position: absolute;
        left: clamp(14px, 6vw, 60px);
        right: auto;
        bottom: clamp(14px, 11vw, 90px);
        max-width: clamp(200px, 26vw, 320px);
        font-size: clamp(10px, 1.6vw, 18px);
        padding: 0;
        z-index: 5;
    }
}

/* <= 1199px (tablet landscape / notebook menor) */
@media (max-width: 1199px) {
    .participacao {
        min-height: clamp(560px, 95vw, 980px);
        padding-bottom: 0;
    }

    .hugo-participacao {
        position: absolute;
        left: 0;
        right: 0;
        top: clamp(15px, 3vw, 30px);
        bottom: auto;
        width: 77vw;
        max-width: none;
        margin: 0;
        display: block;
    }

    .participacao-texto-col {
        position: absolute;
        top: clamp(22px, 8vw, 800px);
        left: auto;
        right: clamp(18px, 18vw, 120px);
        width: clamp(240px, 34vw, 380px);
        padding: 0;
        z-index: 4;
    }

    .participacao-descricao {
        font-size: clamp(10px, 1.6vw, 18px);
    }

    .participacao-rodape {
        position: absolute;
        left: clamp(14px, 6vw, 60px);
        right: auto;
        bottom: clamp(14px, 11vw, 90px);
        max-width: clamp(200px, 26vw, 320px);
        font-size: clamp(10px, 1.6vw, 18px);
        padding: 0;
        z-index: 5;
    }
}

/* <= 992px (tablet) */
@media (max-width: 992px) {
    .participacao {
        min-height: clamp(560px, 112vw, 980px);
    }

    .hugo-participacao {
        width: 85vw;
        top: clamp(15px, 3vw, 30px);
    }

    .participacao-texto-col {
        top: clamp(18px, 15vw, 120px);
        right: clamp(14px, 15vw, 100px);
        width: clamp(200px, 40vw, 330px);
    }

    .participacao-titulo {
        font-size: clamp(22px, 7vw, 40px);
        margin-bottom: 12px;
    }

    .participacao-descricao {
        font-size: clamp(11px, 1.8vw, 18px);
        line-height: 1.45;
        max-width: none;
    }

    .participacao-rodape {
        bottom: clamp(12px, 10vw, 70px);
        left: clamp(12px, 6vw, 50px);
        max-width: clamp(170px, 40vw, 290px);
        font-size: clamp(10px, 2vw, 18px);
        line-height: 1.45;
    }
}

/* <= 768px (mobile) */
@media (max-width: 768px) {
    .participacao {
        min-height: clamp(560px, 132vw, 980px);
    }

    .hugo-participacao {
        width: 100vw;
        top: clamp(15px, 3vw, 30px);
    }

    .participacao-texto-col {
        top: clamp(20px, 11vw, 70px);
        right: clamp(14px, 4vw, 28px);
        width: clamp(180px, 44vw, 300px);
    }

    .participacao-titulo {
        font-size: clamp(20px, 6vw, 30px);
        margin-bottom: 12px;
    }

    .participacao-descricao {
        font-size: clamp(9px, 3vw, 13px);
        line-height: 1.45;
    }

    .participacao-rodape {
        left: clamp(14px, 4vw, 26px);
        bottom: clamp(14px, 11vw, 75px);
        max-width: clamp(150px, 44vw, 280px);
        font-size: clamp(9px, 2.7vw, 13px);
        line-height: 1.5;
    }
}

/* DEPOIMENTO */

.depoimento {
    position: relative;
    z-index: 1;
    background: #d0d3d8;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.depoimento .container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.depoimento-wrap {
    position: relative;
}

.depoimento-img {
    display: block;
    width: 100%;
    height: auto;
}

.depoimento-conteudo {
    font-family: 'berlinsans', Arial, sans-serif;
    position: absolute;
    top: clamp(36px, 12vw, 140px);
    left: clamp(22px, 10vw, 120px);
    max-width: clamp(250px, 50vw, 900px);
    line-height: 1.4;
    color: #061527;
}

.depoimento-conteudo h2 {
    margin: 0 0 clamp(20px, 7vw, 100px);
    font-size: clamp(34px, 5vw, 68px);
}

.depoimento-acoes {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-bottom: clamp(24px, 10vw, 155px);
}

.depoimento-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    border-radius: 999px;
    padding: 10px 18px;
    font-family: 'berlinsans', Arial, sans-serif;
    font-size: clamp(14px, 1.5vw, 26px);
    letter-spacing: 0.01em;
    text-decoration: none;
    color: #073056;
    transition: transform 0.2s ease, filter 0.2s ease;
}

.depoimento-btn:hover,
.depoimento-btn:focus-visible {
    transform: scale(1.07);
    filter: brightness(0.96);
}

.depoimento-btn-principal {
    background: #d3dd5d;
}

.depoimento-btn-secundario {
    background: #81cfd0;
}

.depoimento-redes-label {
    margin: 0;
    font-family: 'poppins', Arial, sans-serif;
    font-size: clamp(15px, 1.5vw, 28px);
    color: #061527;
    margin-bottom: clamp(14px, 6vw, 40px);
}

.depoimento-redes {
    display: flex;
    align-items: center;
    gap: clamp(8px, 1vw, 16px);
}

.depoimento-redes img {
    width: clamp(38px, 4vw, 68px);
    height: auto;
    display: block;
    transition: transform 0.2s ease;
}

.depoimento-redes a:hover img,
.depoimento-redes a:focus-visible img {
    transform: scale(1.12);
}

@media (max-width: 992px) {
    .depoimento-conteudo {
        top: clamp(18px, 8vw, 70px);
        left: clamp(12px, 10vw, 100px);
        max-width: clamp(220px, 50vw, 420px);
    }

    .depoimento-conteudo h2 {
        font-size: clamp(24px, 5.2vw, 42px);
        margin-bottom: clamp(16px, 4vw, 34px);
    }

    .depoimento-acoes {
        gap: clamp(10px, 2vw, 18px);
        margin-bottom: clamp(14px, 3vw, 26px);
    }

    .depoimento-btn {
        padding: 8px 14px;
        font-size: clamp(11px, 1.9vw, 16px);
    }

    .depoimento-redes-label {
        font-size: clamp(11px, 1.9vw, 16px);
        margin-bottom: clamp(8px, 2vw, 16px);
    }

    .depoimento-redes img {
        width: clamp(26px, 4.2vw, 40px);
    }
}

@media (max-width: 768px) {
    .depoimento-conteudo {
        top: clamp(10px, 5vw, 30px);
        left: clamp(10px, 5vw, 30px);
        max-width: min(58vw, 280px);
    }

    .depoimento-conteudo h2 {
        font-size: clamp(18px, 5.4vw, 30px);
        line-height: 1.08;
        margin-bottom: clamp(10px, 5vw, 30px);
    }

    .depoimento-acoes {
        gap: 10px;
        margin-bottom: 25px;
    }

    .depoimento-btn {
        padding: 7px 12px;
        font-size: clamp(9px, 2.6vw, 13px);
    }

    .depoimento-redes-label {
        font-size: clamp(9px, 2.4vw, 12px);
        margin-bottom: 20px;
    }

    .depoimento-redes {
        gap: 8px;
    }

    .depoimento-redes img {
        width: clamp(22px, 6.4vw, 34px);
    }
}

/* FOOTER */

footer {
    position: relative;
    z-index: 1;
    clear: both;
    background: #021a35;
    color: white;
    margin: 0;
    padding: 26px 0;
}

.footer-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(28px, 7vw, 90px);
}

.footer-logo-hugo {
    width: clamp(72px, 8vw, 125px);
    height: auto;
    display: block;
}

.footer-slogan {
    margin: 0;
    font-family: 'berlinsansbold', Arial, sans-serif;
    font-size: clamp(14px, 1.4vw, 22px);
    line-height: 1;
    color: #ffffff;
    white-space: nowrap;
}

.footer-logo-if {
    width: clamp(110px, vw, 220px);
    height: auto;
    display: block;
}

@media (max-width: 768px) {
    footer {
        padding: 18px 0;
    }

    .footer-inner {
        gap: clamp(14px, 4vw, 24px);
    }

    .footer-slogan {
        font-size: clamp(10px, 2.7vw, 14px);
    }

    .footer-logo-hugo {
        width: clamp(54px, 16vw, 86px);
    }

    .footer-logo-if {
        width: clamp(84px, 22vw, 130px);
    }
}

/* BOTÃO VOLTAR AO TOPO */

.btn-topo {
    position: fixed;
    right: clamp(12px, 2vw, 22px);
    bottom: clamp(12px, 2vw, 22px);
    width: clamp(34px, 3.2vw, 44px);
    height: clamp(34px, 3.2vw, 44px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(6, 21, 39, 0.45);
    color: #ffffff;
    font-family: 'berlinsansbold', Arial, sans-serif;
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1;
    text-decoration: none;
    backdrop-filter: blur(2px);
    z-index: 9999;
    transition: transform 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
}

.btn-topo.is-hidden {
    opacity: 0;
    pointer-events: none;
}

.btn-topo:hover,
.btn-topo:focus-visible {
    transform: scale(1.08);
    background: rgba(6, 21, 39, 0.65);
}