/* ============================== FONTES - Poppins ================================= */
 @font-face {
     font-family: 'Poppins';
     src: url('../fonts/Poppins/Poppins-Regular.woff2') format('woff2'), url('../fonts/Poppins/Poppins-Regular.woff') format('woff');
     font-weight: 400;
     font-style: normal;
}
 @font-face {
     font-family: 'Poppins';
     src: url('../fonts/Poppins/Poppins-Medium.woff2') format('woff2'), url('../fonts/Poppins/Poppins-Medium.woff') format('woff');
     font-weight: 500;
     font-style: normal;
}
 @font-face {
     font-family: 'Poppins';
     src: url('../fonts/Poppins/Poppins-SemiBold.woff2') format('woff2'), url('../fonts/Poppins/Poppins-SemiBold.woff') format('woff');
     font-weight: 600;
     font-style: normal;
}
 @font-face {
     font-family: 'Poppins';
     src: url('../fonts/Poppins/Poppins-Bold.woff2') format('woff2'), url('../fonts/Poppins/Poppins-Bold.woff') format('woff');
     font-weight: 700;
     font-style: normal;
}

/* ==================== AJUSTE HOVER EM TODOS OS BOTÕES ==================== */

.contact-header:hover {
    color: #000 !important;
}


.contact-header:hover img {
    filter: brightness(0) saturate(100%);
}


 html, body {
     font-family: 'Poppins', sans-serif;
     font-weight: 400;
     font-style: normal;
}
 h1, h2, h3 {
     font-weight: 700;
}
 h4, .subtitle {
     font-weight: 600;
}
 button, .btn {
     font-weight: 500;
}
 p, li, span {
     font-weight: 400;
}

a {
    color: #ABD192 !important;
    text-decoration: none !important;
}

a:hover {
    color: #fff !important;
}
/* ======================================== FONT IMPORTS ======================================== */
 @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
/* Se você tiver os arquivos da AG Body em local próprio, adicione assim: */
 @font-face {
     font-family: 'AG Body';
     src: url('../fonts/AG-Body-Regular.woff2') format('woff2'), url('../fonts/AG-Body-Regular.woff') format('woff');
     font-weight: 400;
     font-style: normal;
}
 @font-face {
     font-family: 'AG Body';
     src: url('../fonts/AG-Body-Medium.woff2') format('woff2'), url('../fonts/AG-Body-Medium.woff') format('woff');
     font-weight: 500;
     font-style: normal;
}
 @font-face {
     font-family: 'AG Body';
     src: url('../fonts/AG-Body-Bold.woff2') format('woff2'), url('../fonts/AG-Body-Bold.woff') format('woff');
     font-weight: 700;
     font-style: normal;
}
/* ========================================================= ENHANCEMENTS — APPEND-ONLY (não altera o que já existe) Cole este bloco no FINAL do style.css ========================================================= */
/* ===== Parallax: header + services ===== */
 .header-section{
    /* mantém seu layout e adiciona parallax nativo */
     background: url("../images/header-bg.jpg") center center / cover no-repeat fixed;
}
 .services-background{
     background-attachment: fixed;
    /* mantém a imagem no lugar ao rolar */
}

.services-accordion {
    padding-bottom: 120px;
}

 .navbar>.container-fluid {
     justify-content: flex-start !important;
}

button.btn.btn-contact:hover {
    background: #ABD192;
    /* color: #000 !important; */
}

/* Em telas grandes, deixamos o painel da esquerda “grudado” para o acordeon não mover a imagem de services */
 @media (min-width: 992px){
     .services-section .row{
         align-items: stretch;
    }
     .services-background{
         position: sticky;
         top: 0;
         height: 100vh;
        /* ocupa a viewport inteira */
         min-height: 100vh;
    }
    

    
}
/* Em mobile desabilita parallax (melhor performance) */
 @media (max-width: 991.98px){
     .header-section{
         background-attachment: scroll;
    }
     .services-background{
         background-attachment: scroll;
         min-height: 320px;
    }
}
/* ===== Acordeon: abre/fecha suave sem “pular” layout ===== */
/* Mantém seu display toggle, mas adiciona fade/slide sutil */
/* Accordion - efeito suave de abrir/fechar */
/* ======================================== ACORDEON — ANIMAÇÃO SUAVE ======================================== */
 .services-accordion .service-description {
     max-height: 0;
     overflow: hidden;
     opacity: 0;
     transform: translateY(-6px);
     transition: max-height 0.4s ease, opacity 0.3s ease, transform 0.3s ease;
     will-change: max-height, opacity, transform;
}
 .services-accordion .service-description.active {
     max-height: 500px;
    /* suficiente para todo conteúdo */
     opacity: 1;
     transform: translateY(0);
}
/* ======================================== ACORDEON — ESTADO DO BOTÃO ======================================== */
 .service-button {
     width: 100%;
     background: transparent;
     border: none;
     border-bottom: 1px solid #C1C5C9;
     padding: 25px 8px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     font-size: 36px;
     color: #214A6B;
     text-transform: uppercase;
     letter-spacing: -1px;
     line-height: 1.7;
     transition: background-color 0.3s ease, color 0.3s ease;
}
/* Feedback ao passar o mouse */
 .service-button:hover {
     background-color: #f8f9fa;
}
/* Botão realmente ativo — quando a descrição está aberta */
 .service-item.active > .service-button {
     background-color: #f5f7f9;
     color: #214A6B;
}
/* Remove destaque do botão que recebe foco automático */
 .service-button:focus {
     outline: none;
     background-color: transparent;
     color: #214A6B;
}
/* Botão do acordeon com feedback visual */
 .service-button{
     transition: background-color .25s ease;
}
 .service-button:hover{
     background-color: #f5f7f9;
}
/* ===== Menu fixo ao rolar ===== */
 .navbar.fixed{
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 1000;
     background-color: rgba(0, 50, 60, 0.55);
     box-shadow: 0 2px 10px rgba(0,0,0,.08);
     backdrop-filter: saturate(120%) blur(6px);
}
 .navbar.fixed .nav-link{
     color:#fff;
}
 .navbar.fixed .nav-link:hover{
     color:#ABD192;
}
 .navbar.fixed .btn-contact{
     border-color:#ABD192;
     color:#ABD192;
     background: transparent;
}
 .navbar.fixed .btn-contact:hover{
     background:0 2px 10px rgba(0,0,0,.08);
     color:#fff;
}

 .nav-link:hover {
    color: #fff !important;
 }
 /* ===== Animações ao rolar (use data-animate no HTML) ===== */
 [data-animate]{
     opacity: 0;
     transform: translateY(30px);
     transition: opacity .7s ease, transform .7s ease;
}
 [data-animate].active{
     opacity: 1;
     transform: translateY(0);
}
/* ===== Pequenos refinamentos de compatibilidade ===== */
 .background-image{
     pointer-events: none;
}
 /* evita “toques” no bg */
/* ======================================== TYPOGRAPHY SCALE ======================================== */
 :root {
    /* Body sizes */
     --ag-body-large: 20px;
     --ag-body-medium: 18px;
     --ag-body-small: 16px;
    /* Headings */
     --heading-xl: 64px;
     --heading-lg: 48px;
     --heading-md: 36px;
     --heading-sm: 28px;
}
 body {
     font-family: 'AG Body', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
     font-size: var(--ag-body-medium);
     font-weight: 400;
     color: #333;
     line-height: 1.6;
}
 section {
     padding-left: 5.8rem !important;
}
 section#services {
     padding-left: 0 !important;
}
 /* ====== HEADINGS ====== */
 h1, .hero-title {
     font-family: 'Poppins', sans-serif;
     font-size: var(--heading-xl);
     font-weight: 600;
     line-height: 1.2;
     letter-spacing: -1px;
}
 h2, .section-title {
     font-family: 'Poppins', sans-serif;
     font-size: var(--heading-lg);
     font-weight: 600;
     line-height: 1.2;
}
 h3, .subtitle, .differential-title, .value-title, .member-name {
     font-family: 'Poppins', sans-serif;
     font-size: var(--heading-sm);
     font-weight: 500;
     line-height: 1.3;
}
 /* ====== PARAGRAPH / BODY ====== */
 p, .about-description, .hero-description, .service-description p, .member-description, .contact-intro {
     font-family: 'AG Body', sans-serif;
     font-size: var(--ag-body-medium);
     font-weight: 400;
     line-height: 1.6;
}
 .badge-text, .contact-label, .footer-bottom p {
     font-family: 'AG Body', sans-serif;
     font-size: var(--ag-body-small);
     font-weight: 500;
     letter-spacing: 0.5px;
     text-transform: uppercase;
}
 /* ======================================== RESET AND BASE STYLES ======================================== */
 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
}
 body {
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
     line-height: 1.6;
     color: #333;
}
 .background-image {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     z-index: -2;
}
 .overlay-image {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     z-index: -1;
}
 /* ======================================== HEADER SECTION ======================================== */
 .header-section {
     position: relative;
     min-height: 982px;
     width: 100%;
}
 .header-background {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: -1;
}
 .navbar {
     position: relative;
     z-index: 10;
     padding: 28px 5.8rem;
     background-color: rgba(0, 50, 60, 0.55);
}
 .navbar-nav .nav-link {
     color: #f5f5f5;
     font-weight: 500;
     font-size: 16px;
     margin-right: 24px;
     transition: color 0.3s ease;
}
 .navbar-nav .nav-link:hover {
     color: #ABD192;
}
 .btn-contact {
     background: transparent;
     border: 1px solid #ABD192;
     color: #ABD192;
     font-weight: 600;
     font-size: 16px;
     padding: 8px 16px;
     border-radius: 444px;
     display: flex;
     align-items: center;
     gap: 4px;
     transition: all 0.3s ease;
     letter-spacing: 0.2px;
}
 .btn-contact:hover {
     background: #ABD192;
     /* color: #000; */
}
 .contact-icon {
     width: 20px;
     height: 20px;
}
 /* ======================================== HERO SECTION ======================================== */
 .hero-section {
     position: absolute;
     z-index: 0;
     background: #214A6B;
     width: 100%;
     right: 0;
     top: 467px;
     padding: 78px 70px 182px;
}
 .hero-title {
     color: #C8E1B7;
     font-size: 60px;
     font-weight: 500;
     line-height: 70px;
     letter-spacing: -1px;
     text-transform: uppercase;
     margin-bottom: 0;
}
 .hero-description {
     color: #f5f5f5;
     font-size: 24px;
     font-weight: 500;
     line-height: 34px;
     margin-top: 20px;
     margin-bottom: 64px;
     padding-right: 20%;
}
 .btn-hero {
     background: #ABD192;
     /* color: #000; */
     font-weight: 600;
     font-size: 18px;
     padding: 16px 20px;
     border-radius: 444px;
     border: none;
     /* transition: background-color 0.3s ease; */
}
 /* .btn-hero:hover {
     background: #9BC182;
     color: #000;
} */
 .arrow-icon {
     width: 20px;
     height: 20px;
}
 /* ======================================== ABOUT SECTION ======================================== */
 .about-section {
     background: #191B1E;
     padding: 158px 0 0px 0;
     overflow: hidden;
}
 .about-title {
     color: #f5f5f5;
     font-size: 56px;
     font-weight: 600;
     line-height: 60px;
     letter-spacing: -1px;
     padding-right: 90px;
}
 .about-badge {
     display: flex;
     align-items: center;
     gap: 16px;
     padding-top: 20px;
     margin-bottom: 72px;
}
 .badge-dot {
     width: 11px;
     height: 11px;
     background: #ABD192;
     border-radius: 50%;
}
 .badge-text {
     color: #ABD192;
     font-size: 14px;
     font-weight: 500;
     text-transform: uppercase;
     letter-spacing: 2px;
}
 .about-description {
     color: #DCE0E5;
     font-size: 20px;
     font-weight: 500;
     line-height: 30px;
     margin-bottom: 32px;
}
 .btn-outline-team {
     background: transparent;
     border: 1px solid #ABD192;
     color: #ABD192;
     font-weight: 600;
     font-size: 16px;
     padding: 8px 16px;
     border-radius: 444px;
     display: flex;
     align-items: center;
     gap: 4px;
     transition: all 0.3s ease;
     letter-spacing: 0.2px;
}
 .btn-outline-team:hover {
     background: #ABD192;
     color: #000;
}

.arrow-icon:hover{
    filter: brightness(0) saturate(100%);

}
 .arrow-icon {
     width: 20px;
     height: 20px;
}
 /* ======================================== PROCESS SECTION ======================================== */
 .process-section {
     background: #191B1E;
     padding: 150px 0;
}
 .process-header {
     max-width: 485px;
     margin-bottom: 108px;
}
 .process-title {
     color: #f5f5f5;
     font-size: 36px;
     font-weight: 600;
     line-height: 1.1;
     letter-spacing: -1px;
}
 .process-subtitle {
     color: #f5f5f5;
     font-size: 20px;
     font-weight: 500;
     margin-top: 32px;
}
 .process-step {
     min-width: 240px;
}
 .process-icon {
     width: 100px;
     height: 100px;
     margin-bottom: 32px;
}
 .step-title {
     color: #ABD192;
     font-size: 28px;
     line-height: 1.2;
     margin-bottom: 32px;
}
 .step-description {
     color: #EDF1EA;
     font-size: 16px;
     line-height: 24px;
}
 /* ======================================== SERVICES SECTION ======================================== */
 .services-section {
     background: #EAEFF4;
     overflow: hidden;
}
 .services-background {
     position: relative;
     min-height: 100%;
     height: auto;
     background-image: url("../images/services-bg.jpg");
     /* background-size: cover; */
     background-position: left;
     background-repeat: no-repeat;
}
 .services-content {
     position: relative;
     z-index: 10;
     padding: 160px 80px;
     text-align: center;
     color: #f5f5f5;
}
 .services-title {
     font-size: 36px;
     font-weight: 600;
     line-height: 1.1;
     letter-spacing: -1px;
     margin-bottom: 25px;
}
 .services-subtitle {
     font-size: 20px;
     font-weight: 500;
     line-height: 30px;
}
 .services-list {
     padding: 70px 0 0 40px;
     width: 85%;
     height: auto;
     align-self: center;
}
 .services-intro {
     color: #2C2F33;
     font-size: 22px;
     font-weight: 600;
     line-height: 26px;
     margin-bottom: 46px;
     padding-right: 30px;
}
 .service-button {
     width: 100%;
     background: transparent;
     border: none;
     border-bottom: 1px solid #C1C5C9;
     padding: 25px 8px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     font-size: 36px;
     color: #214A6B;
     text-transform: uppercase;
     letter-spacing: -1px;
     line-height: 1.7;
     transition: background-color 0.3s ease;
}
 .service-button:hover {
     background: #f8f9fa;
}
 .expand-icon {
     width: 15px;
     height: 24px;
     transition: transform 0.3s ease;
}
 .expand-icon.active {
     transform: rotate(180deg);
}
 .service-description {
     display: none;
     padding: 23px 8px;
     border-bottom: 1px solid #C1C5C9;
}
 .service-description.active {
     display: block;
}
 .service-description p {
     color: #70757A;
     font-size: 16px;
     font-weight: 500;
     line-height: 24px;
     margin: 0;
}
 /* ======================================== DIFFERENTIALS SECTION ======================================== */
 .differentials-section {
     background: #ABD192;
     padding: 160px 0 70px 0;
     overflow: hidden;
}
 .differentials-header {
     max-width: 526px;
     margin-bottom: 80px;
}
 .differentials-title {
     color: #214A6B;
     font-size: 56px;
     font-weight: 600;
     line-height: 1;
     letter-spacing: -1px;
}
 .differentials-subtitle {
     color: #2C2F33;
     font-size: 22px;
     font-weight: 600;
     line-height: 1.2;
     margin-top: 32px;
}
 .differential-item {
     min-width: 240px;
     padding: 0 70px 0 0;
}
 .differential-number {
     color: #f5f5f5;
     font-size: 64px;
     line-height: 1.1;
     letter-spacing: -1px;
     text-transform: uppercase;
     margin-bottom: 32px;
}
 .differential-title {
     color: #214A6B;
     font-size: 28px;
     line-height: 34px;
     margin-bottom: 32px;
}
 .differential-description {
     color: #70757A;
     font-size: 16px;
     line-height: 24px;
}
 /* ======================================== VALUES SECTION ======================================== */
 .values-section {
     position: relative;
     min-height: 650px;
     background-image: url("../images/bg-valores.png");
     background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
}
 .values-background {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
 .values-content {
     position: relative;
     padding: 169px 0 70px 0;
     min-height: 650px;
     display: flex;
     align-items: center;
}
 .values-header {
     max-width: 526px;
     margin-bottom: 80px;
}
 .values-title {
     color: #ABD192;
     font-size: 56px;
     font-weight: 600;
     line-height: 1;
     letter-spacing: -1px;
}
 .values-subtitle {
     color: #f5f5f5;
     font-size: 22px;
     font-weight: 600;
     line-height: 1.2;
     margin-top: 32px;
}
 .values-grid {
     max-width: 100%;
}
 .value-item {
     max-width: 305px;
}
 .value-title {
     color: #f5f5f5;
     font-size: 36px;
     font-weight: 600;
     line-height: 1.1;
     letter-spacing: -1px;
     margin-bottom: 32px;
}
 .value-description {
     color: #f5f5f5;
     font-size: 18px;
     line-height: 26px;
     padding-right: 90px;
}
 /* ======================================== TEAM SECTION ======================================== */
 .team-section {
     background: #214A6B;
     padding: 160px 0 93px;
     overflow: hidden;
}
 .team-header {
     margin-bottom: 92px;
}
 .team-badge {
     display: flex;
     align-items: center;
     gap: 16px;
     margin-bottom: 48px;
}
 .team-title {
     color: #f5f5f5;
     font-size: 56px;
     font-weight: 600;
     letter-spacing: -1px;
     line-height: 60px;
     max-width: 590px;
}
 .team-member {
     min-width: 240px;
}
 .member-photo {
     width: 160px;
     height: 160px;
     border-radius: 50%;
     object-fit: cover;
     margin-bottom: 32px;
}
 .member-name {
     color: #ABD192;
     font-size: 28px;
     font-weight: 500;
     line-height: 1.2;
     margin-bottom: 4px;
}
 .member-role {
     color: #fff;
     font-size: 16px;
     font-weight: 600;
     line-height: 24px;
     letter-spacing: 0.15px;
     margin-bottom: 16px;
}
 .member-description {
     color: #EAEFF4;
     font-size: 16px;
     font-weight: 500;
     line-height: 24px;
     margin-bottom: 8px;
     padding-right: 50px;
}
 .btn-linkedin {
     background: transparent;
     border: none;
     color: #ABD192;
     font-weight: 600;
     font-size: 16px;
     padding: 0 !important;
     border-radius: 8px;
     display: flex;
     align-items: center;
     gap: 4px;
     transition: background-color 0.3s ease;
     letter-spacing: 0.2px;
}
 .btn-linkedin:hover {
     background: rgba(33, 74, 107, 0.2);
     color: #ABD192;
}
 .linkedin-icon {
     width: 10px;
     height: 8px;
     margin-top: 5px;
}
 /* ======================================== FOOTER SECTION ======================================== */
 .footer-section {
     background: #f5f5f5;
     padding: 72px 0 72px 5.8rem;
     overflow: hidden;
}
 .contact-intro {
     color: #191B1E;
     font-size: 18px;
     font-weight: 500;
     line-height: 24px;
     margin-bottom: 32px;
     padding-right: 50px;
}
 .contact-form {
     margin-bottom: 32px;
}
 .form-label {
     color: #2C2F33;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 8px;
}
 .form-control {
     border: 1px solid #C1C5C9;
     border-radius: 6px;
     padding: 8px 12px;
     font-size: 16px;
}
 .form-control:focus {
     border-color: #ABD192;
     box-shadow: 0 0 0 0.2rem rgba(171, 209, 146, 0.25);
}
 .btn-submit {
     width: 100%;
     background: #ABD192;
     color: #000;
     font-weight: 600;
     padding: 8px 16px;
     border-radius: 6px;
     border: none;
     transition: background-color 0.3s ease;
}
 .btn-submit:hover {
     background: #9BC182;
     color: #000;
}
 .social-links {
     display: flex;
     gap: 16px;
}
 .social-icon {
     width: 24px;
     height: 24px;
     cursor: pointer;
     transition: opacity 0.3s ease;
}
 .social-icon:hover {
     opacity: 0.8;
}
 .locations {
     color: #2C2F33;
     font-size: 18px;
     font-weight: 500;
     line-height: 24px;
}
 .company {
     line-height: 12px;
}
 .contact-info h4 {
     color: #2C2F33;
     font-size: 16px;
     font-weight: 700;
     margin-bottom: 24px;
}
 .contact-item {
     display: flex;
     gap: 16px;
     margin-bottom: 24px;
}
 .contact-icon {
     width: 21px;
     height: 18px;
     flex-shrink: 0;
}
 .contact-label {
     color: #575C61;
     font-size: 14px;
     line-height: 1.4;
}
 .contact-value {
     color: #2C2F33;
     font-size: 16px;
     font-weight: 700;
     margin-top: 4px;
     line-height: 20px;
}
 .footer-bottom {
     border-top: 1px solid #C1C5C9;
     padding: 24px 0;
     margin-top: 104px;
     text-align: center;
}
 .footer-bottom p {
     color: #8B8F94;
     font-size: 16px;
     font-weight: 400;
     letter-spacing: 0.15px;
     margin: 0;
}
 @media (min-width: 768px) {
     .bg-mobile-header {
         display: none !important;
    }
     .hero-section {
         max-width: 100%;
         height: 515px;
        /* padding-left: 292px !important;
         padding-right: 292px !important;
         */
    }

    .cards-process {
        width: 308px;
    }
}
 /* @media (min-width: 1400px) {
     .bg-mobile-header {
         display: none !important;
    }
     .hero-section {
         max-width: 100%;
         height: 515px;
         padding-left: 292px !important;
         padding-right: 292px !important;
    }
}
 */
 /* ======================================== DESKTOP MEDIA QUERIES ======================================== */
 @media (min-width: 1200px) {
     .navbar {
         max-width: 100%;
         margin: 0 auto;
        /* padding: 28px 150px;
         */
    }
     .hero-section {
         max-width: 100%;
         height: 515px;
    }
     .services-list {
        /* width: 50%;
         */
         margin-left: 5%;
    }
     .hero-section {
         max-width: 100%;
         height: 515px;
         padding-left: 88px !important;
         padding-right: 30px !important;
    }

    .cards-process {
        width: 340px !important;
        padding-right: 20px;
        padding-left: 20px;
    }

    .about-description {
        padding-right: 86px;
    }

    .contact-info {
        /* position: relative; */
        padding-left: 80px;
    }

    .footer-section {
        background: #f5f5f5;
        padding: 72px 0 0px 5.8rem;
        overflow: hidden;
    }
}
 @media (min-width: 1600px) {
     .navbar {
         max-width: 100%;
         margin: 0 auto;
        /* padding: 44px 116px;
         */
    }
     .hero-section {
         padding-left: 140px !important;
         padding-right: 30px !important;
    }
}
 @media (min-width: 1800px) {
     .hero-section {
         padding-left: 88px !important;
         padding-right: 30px !important;
    }

     .cards-process {
        width: 440px !important;
    }
}
 @media (min-width: 1921px) {
     .bg-mobile-header {
         display: none !important;
    }
     .hero-section {
         max-width: 100%;
         height: 515px;
         padding-left: 100px !important;
         padding-right: 100px !important;
    }

    .about-section {
        background: #191B1E;
        padding: 158px 40px 0px 0 !important;
        overflow: hidden;
    }
        .cards-process {
        width: 25% !important;
    }
}
 /* ======================================== MOBILE MEDIA QUERIES ======================================== */
 @media (max-width: 768px) {
     section {
        padding: 64px 0px !important;
    }
     .bg-desktop-header {
         display: none !important;
    }
     .bg-mobile-header {
         background: url("../images/header-bg-mobile.png") no-repeat;
         background-position: center center;
         background-size: cover !important;
         padding-top: 20%;
         height: 320px;
    }
     .hero-section {
         position: static;
         /* padding-bottom: 30px !important; */
         margin-top: 0;
    }
     .hero-title {
         font-size: 40px;
         line-height: 48px;
         margin-bottom: 32px;
    }
     .hero-description {
         margin-bottom: 40px;
    }
     .about-section {
         /* padding: 100px 0 0 0; */
    }
     .about-title {
         font-size: 40px;
         line-height: 48px;
         margin-bottom: 32px;
    }
     .about-badge {
         margin-bottom: 40px;
    }
     .process-section {
         /* padding: 40px 0 0; */
    }
     .process-header {
         margin-bottom: 40px;
         
    }

    .process-step {
        padding-top: 72px;
    }
     .services-content {
         padding: 64px 20px;
    }
     .services-list {
         margin-left: 0;
         width: 100%;
         padding: 0px 10px 0 10px;
    }
     .services-intro {
         margin-bottom: 40px;
    }
     .service-button {
         font-size: 28px;
         padding: 20px 8px;
    }
    .services-accordion {
         padding-bottom: 0;
    }
     .differentials-section {
         padding: 100px 0;
    }
    .differentials-header {
        margin-bottom: 0px;
    }
     .differentials-title {
         font-size: 40px;
    }
    .differential-item {
        padding: 72px 70px 0 0;
    }
     .differential-number {
         font-size: 40px;
    }
     .values-content {
         padding: 0px 0;
    }
     .value-title {
         font-size: 40px;
         margin-bottom: 10px !important;
    }
     .team-section {
         padding-bottom: 0px !important;
    }
     .team-title {
         font-size: 40px;
         line-height: 48px;
    }
     .team-header {
         margin-bottom: 40px;
    }
    .team-member {
        padding-top: 64px;
    }
    .footer-section {
        background: #f5f5f5;
        padding: 30px 0 5px 0 !important;
        overflow: hidden;
    }
     .footer-bottom {
         margin-top: 40px;
         padding: 24px 0 0 0;
    }
}

/* ========================================
   BOTÃO HERO COM ÍCONE WHATSAPP
======================================== */

/* Hover: fundo transparente, borda e texto verdes */
.btn.btn-hero:hover {
    background: transparent !important;
    border: 2px solid #ABD192 !important;
    color: #ABD192 !important;
}