/* =========================================
VARIÁVEIS DE CORES E FONTES
========================================= */
/* =========================================
1. ATUALIZAÇÃO DAS VARIÁVEIS NO :root
========================================= */
:root {
    --cor-primaria: #06F7B9;
    /* Ciano */
    --cor-secundaria: #0A926F;
    /* Verde Escuro */
    --cor-texto-p: #7A7A7A;
    /* Cinza Textos */
    --cor-fundo-preto: #000000;
    --cor-fundo-escuro: #1F1F1F;
    --cor-branco: #ffffff;

    /* VARIÁVEIS QUE FALTAVAM (Adicionadas) */
    --realce: #0A926F;
    /* Verde principal dos botões de formulário */
    --realce-hover: #06F7B9;
    /* Ciano para efeito de hover */
    --dark-grey: #1F1F1F;
    --white: #ffffff;
    --primary: #0A926F;

    --fonte-principal: 'Advent Pro', sans-serif;
}

/* =========================================
RESET E ESTILOS GERAIS
========================================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
}

body {
    font-family: var(--fonte-principal);
    background-color: var(--cor-fundo-preto);
    color: var(--cor-branco);
    overflow-x: hidden;
}

/* =========================================
BOTÕES GERAIS (COM GRADIENTE)
========================================= */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(90deg, var(--cor-secundaria) 0%, var(--cor-primaria) 100%);
    color: var(--cor-branco);
    padding: 12px 28px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(6, 247, 185, 0.2);
}

.btn:hover {
    background: linear-gradient(90deg, var(--cor-primaria) 0%, var(--cor-secundaria) 100%);
    color: var(--cor-branco);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(6, 247, 185, 0.4);
}

/* =========================================
HEADER (CABEÇALHO)
========================================= */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 50px;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 1000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.logo img {
    height: 90px;
    transition: transform 0.3s ease;
}

.logo img:hover {
    transform: scale(1.05);
}

.nav-menu ul {
    display: flex;
    gap: 35px;
}

.nav-menu a {
    position: relative;
    color: var(--cor-branco);
    font-size: 20px;
    font-weight: 400;
    transition: color 0.3s ease;
    padding-bottom: 5px;
}

.nav-menu a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: var(--cor-primaria);
    transition: width 0.3s ease;
}

.nav-menu a:hover,
.nav-menu a.active {
    color: var(--cor-primaria);
}

.nav-menu a:hover::after,
.nav-menu a.active::after {
    width: 100%;
}

.btn-header {
    padding: 10px 24px;
    font-size: 16px;
}

/* =========================================
SEÇÃO HERO (FUNDO COM IMAGENS)
========================================= */
.hero {
    position: relative;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
}

.hero-slideshow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}

.slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.slide.active {
    opacity: 1;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.65);
    z-index: -1;
}

.hero-content {
    z-index: 1;
    max-width: 800px;
    padding: 20px;
}

.hero-content h1 {
    font-size: 3.5rem;
    font-weight: 600;
    margin-bottom: 15px;
    line-height: 1.2;
}

.hero-subtitle {
    font-size: 1.2rem;
    letter-spacing: 4px;
    margin-bottom: 30px;
    color: var(--cor-branco);
    text-transform: uppercase;
}

/* =========================================
SEÇÃO DIFERENCIAIS
========================================= */
.diferenciais-section {
    background-color: var(--cor-fundo-preto);
    padding: 100px 0 150px 0;
    position: relative;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-tag {
    display: block;
    color: var(--cor-branco);
    font-size: 14px;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.section-title {
    color: var(--cor-primaria);
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.section-subtitle {
    color: var(--cor-texto-p);
    font-size: 1.2rem;
}

.diferenciais-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 30px;
}

.diferencial-card {
    background-color: var(--cor-fundo-escuro);
    border: none;
    border-right: 3px solid var(--cor-primaria);
    border-radius: 25px;
    padding: 60px 30px;
    min-height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    opacity: 0;
    transform: translateY(80px);
}

.diferencial-card.show {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.8s ease-out, transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.diferencial-card.show:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 30px rgba(6, 247, 185, 0.15);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-icon {
    font-size: 45px;
    color: var(--cor-primaria);
    margin-bottom: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60px;
}

.card-icon img {
    width: 65px;
    height: 65px;
    object-fit: contain;
}

.diferencial-card:not(.highlight-card) .card-icon img {
    filter: brightness(0) saturate(100%) invert(79%) sepia(40%) saturate(4649%) hue-rotate(111deg) brightness(102%) contrast(96%);
}

.diferencial-card h3 {
    font-size: 1.15rem;
    color: var(--cor-branco);
    margin-bottom: 20px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 1px;
}

.diferencial-card p {
    color: var(--cor-texto-p);
    font-size: 1.05rem;
    line-height: 1.7;
    font-weight: 400;
}

.highlight-card {
    background-color: var(--cor-primaria);
    border-right: none;
    box-shadow: 0 10px 30px rgba(6, 247, 185, 0.3);
}

.highlight-card .card-icon,
.highlight-card .card-icon i,
.highlight-card h3,
.highlight-card p {
    color: var(--cor-fundo-preto);
}

/* =========================================
SEÇÕES DE FUNDO CLARO (Planejamento e Depoimentos)
========================================= */
.planejamento-section,
.depoimentos-section {
    background-color: #ffffff;
    padding: 100px 0;
    position: relative;
}

.depoimentos-section {
    padding-bottom: 180px;
}

.dark-text .section-tag {
    color: #111111;
    font-weight: 500;
}

/* Verde escuro sofisticado e legível nos títulos das seções claras */
.planejamento-section .section-title,
.depoimentos-section .dark-title-green {
    color: #0b5c46 !important;
}

/* =========================================
CARROSSEL AUTOMÁTICO DE DEPOIMENTOS (SCROLL INFINITO)
========================================= */
.depoimentos-carousel-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 40px;
    display: flex;
}

.depoimentos-track {
    display: flex;
    gap: 30px;
    width: max-content;
    animation: scrollAnimation 35s linear infinite;
}

.depoimentos-carousel-wrapper:hover .depoimentos-track {
    animation-play-state: paused;
}

.depoimentos-track .review-card,
.review-card {
    background-color: #F8F9FA;
    border-radius: 15px;
    padding: 30px;
    width: 350px;
    flex-shrink: 0;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    gap: 15px;
}

@keyframes scrollAnimation {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-350px * 3 - 90px));
    }
}

.review-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.user-info {
    display: flex;
    align-items: center;
    gap: 15px;
}

.user-info .avatar {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    object-fit: cover;
}

.user-text h4 {
    color: #111111;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 2px;
}

.user-text .review-time {
    color: #777777;
    font-size: 0.85rem;
}

/* Ajuste de alinhamento para focar no topo da imagem (mostrar rostos) */
.solucao-card img[src*="marriage"],
.solucao-card img[src*="corporate"] {
    object-position: center top;
}

.google-icon {
    width: 20px;
    height: 20px;
}

.stars {
    display: flex;
    align-items: center;
    gap: 3px;
    color: #FBBC05;
    font-size: 14px;
}

.verified-icon {
    color: #1A73E8;
    font-size: 14px;
    margin-left: 5px;
}

.review-text {
    color: #333333;
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Curva Preta de transição no final */
.section-curved-bottom-dark {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    line-height: 0;
}

.section-curved-bottom-dark svg {
    width: 100%;
    height: auto;
    max-height: 120px;
}

/* =========================================
SEÇÃO NOSSAS SOLUÇÕES (SERVIÇOS)
========================================= */
.solucoes-section {
    background-color: var(--cor-fundo-preto);
    padding: 100px 0;
    position: relative;
}

.solucoes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 35px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.solucao-card {
    background-color: var(--cor-fundo-escuro);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(6, 247, 185, 0.15);
    /* Borda sutil ciano */
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
}

.solucao-card:hover {
    transform: translateY(-8px);
    border-color: var(--cor-primaria);
    box-shadow: 0 10px 30px rgba(6, 247, 185, 0.2);
}

.solucao-img {
    width: 100%;
    height: 240px;
    overflow: hidden;
}

.solucao-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.solucao-card:hover .solucao-img img {
    transform: scale(1.08);
    /* Efeito zoom suave na foto ao passar o mouse */
}

.solucao-info {
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    flex-grow: 1;
}

.solucao-info h3 {
    color: var(--cor-primaria);
    font-size: 1.35rem;
    font-weight: 600;
}

.solucao-info p {
    color: var(--cor-texto-p);
    font-size: 1rem;
    line-height: 1.6;
}

/* Alinhamento do botão centralizado abaixo dos cards */
.solucoes-btn-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

/* =========================================
ANIMAÇÃO "APPEAR FROM DOWN" NOS CARDS
========================================= */

/* Estado inicial dos cards (invisíveis e levemente abaixo) */
.solucao-card {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.7s cubic-bezier(0.25, 1, 0.5, 1),
        transform 0.7s cubic-bezier(0.25, 1, 0.5, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

/* Estado ativo quando a seção aparece na tela */
.solucao-card.show {
    opacity: 1;
    transform: translateY(0);
}

/* Efeito Escalonado (cada card aparece em sequência) */
.solucoes-grid .solucao-card:nth-child(1) {
    transition-delay: 0.1s;
}

.solucoes-grid .solucao-card:nth-child(2) {
    transition-delay: 0.2s;
}

.solucoes-grid .solucao-card:nth-child(3) {
    transition-delay: 0.3s;
}

.solucoes-grid .solucao-card:nth-child(4) {
    transition-delay: 0.4s;
}

.solucoes-grid .solucao-card:nth-child(5) {
    transition-delay: 0.5s;
}

.solucoes-grid .solucao-card:nth-child(6) {
    transition-delay: 0.6s;
}

/* =========================================
SEÇÃO FILMAGEM PROFISSIONAL (ENQUADRAMENTO PERFEITO)
========================================= */
.filmagem-section {
    position: relative;
    padding: 60px 0 80px 0;
    /* Padding reduzido para a seção não ficar gigante */
    overflow: hidden;
    background-color: #ffffff;
}

/* O vídeo ocupa 100% da área da seção sem distorcer */
.filmagem-video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Camada suave transparente sobre o vídeo */
.filmagem-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.45);
    /* Ajuste este valor se quiser mais/menos transparente */
    z-index: 1;
}

.filmagem-container {
    position: relative;
    z-index: 2;
}

/* Ajuste dos textos do cabeçalho */
.filmagem-section .section-header {
    margin-bottom: 35px;
}

.dark-subtitle {
    color: #444444;
    max-width: 750px;
    margin: 10px auto 0 auto;
    font-size: 1.05rem;
    line-height: 1.5;
}

/* Grid 2x2 Compacto */
.filmagem-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    /* Reduzido de 30px para 20px */
}

/* Cards com proporção enxuta */
.filmagem-card {
    border-radius: 20px;
    padding: 30px 25px;
    /* Reduzido para ocupar menos espaço vertical */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.filmagem-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.filmagem-icon {
    width: 45px;
    /* Ícones levemente menores */
    height: 45px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.filmagem-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.filmagem-card h3 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}

.filmagem-card p {
    font-size: 0.92rem;
    line-height: 1.5;
}

/* Cores dos Cards */
.filmagem-card.card-cyan {
    background-color: var(--cor-primaria);
    color: #111111;
}

.filmagem-card.card-cyan p {
    color: #222222;
}

.filmagem-card.card-cyan .filmagem-icon img {
    filter: brightness(0);
}

.filmagem-card.card-dark {
    background-color: #1F1F1F;
    color: #ffffff;
}

.filmagem-card.card-dark p {
    color: #b0b0b0;
}

.filmagem-card.card-dark .filmagem-icon img {
    filter: brightness(0) saturate(100%) invert(79%) sepia(40%) saturate(4649%) hue-rotate(111deg) brightness(102%) contrast(96%);
}

/* Responsividade Mobile */
@media (max-width: 768px) {
    .filmagem-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================
SEÇÃO NOSSOS TRABALHOS (BACKGROUND PRETO)
========================================= */
.trabalhos-section {
    background-color: #000000;
    padding: 70px 0;
    color: #ffffff;
    width: 100%;
    overflow: hidden;
}

/* Cabeçalho */
.trabalhos-header {
    text-align: center;
    margin-bottom: 35px;
}

.trabalhos-title {
    color: var(--cor-primaria, #06F7B9);
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 12px;
}

.trabalhos-subtitle {
    color: #e0e0e0;
    font-size: 1.1rem;
    font-weight: 300;
}

/* Slider Full Width */
.trabalhos-slider-container {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-bottom: 40px;
}

.trabalhos-loop-wrapper {
    display: flex;
    width: 100%;
    overflow-x: hidden;
}

/* Trilho com Animação Contínua em Loop */
.trabalhos-track {
    display: flex;
    gap: 0px;
    /* Sem espaço entre fotos, exatamente como no print */
    animation: scrollLoop 35s linear infinite;
    width: max-content;
}

/* Ao passar o mouse, desacelera suavemente para ver os detalhes */
.trabalhos-slider-container:hover .trabalhos-track {
    animation-play-state: paused;
}

.trabalhos-track img {
    height: 480px;
    /* Altura ideal das fotos verticais */
    width: calc(100vw / 5);
    /* Mostra exatamente 5 fotos por tela no Desktop */
    min-width: 260px;
    object-fit: cover;
    display: block;
    transition: filter 0.3s ease, transform 0.3s ease;
}

.trabalhos-track img:hover {
    transform: scale(1.02);
    z-index: 2;
}

/* Keyframe do Loop Infinito */
@keyframes scrollLoop {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* Botão "Veja Todos os Projetos" */
.trabalhos-btn-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.btn-trabalhos {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: var(--cor-primaria, #06F7B9);
    color: #000000;
    padding: 14px 32px;
    border-radius: 50px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(6, 247, 185, 0.2);
}

.btn-trabalhos:hover {
    background-color: #00e0a4;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(6, 247, 185, 0.4);
}

/* Setas de Navegação (Opcionais) */
.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.6);
    color: #ffffff;
    border: none;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    transition: background 0.3s ease;
}

.slider-arrow:hover {
    background: var(--cor-primaria, #06F7B9);
    color: #000;
}

.arrow-left {
    left: 15px;
}

.arrow-right {
    right: 15px;
}

/* Responsividade Mobile */
@media (max-width: 992px) {
    .trabalhos-track img {
        height: 380px;
        width: calc(100vw / 3);
        /* 3 fotos por tela no Tablet */
    }
}

@media (max-width: 576px) {
    .trabalhos-title {
        font-size: 1.8rem;
    }

    .trabalhos-track img {
        height: 320px;
        width: calc(100vw / 2);
        /* 2 fotos por tela no Celular */
    }
}

/* =========================================
SEÇÃO SOBRE NÓS & NOSSOS NÚMEROS
========================================= */
.sobre-home-section {
    position: relative;
    padding: 80px 0;
    background-color: #fcfcfc;
    overflow: hidden;
}

/* Imagem de Fundo (b2.png) Suave/Marca d'água */
.sobre-bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0.12;
    /* Ajuste a opacidade conforme preferir */
    pointer-events: none;
    z-index: 0;
}

.relative-z {
    position: relative;
    z-index: 1;
}

.sobre-home-content {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 70px;
}

.sobre-text-col {
    flex: 1.1;
}

.sobre-text-col .section-title {
    color: var(--cor-primaria, #00A877);
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 25px;
    text-align: left;
}

.sobre-paragraph {
    color: #666666;
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 18px;
}

.sobre-highlight {
    color: #333333;
    font-size: 1.05rem;
    margin-top: 25px;
    line-height: 1.6;
}

/* Mosaico de Imagens (rl1.png, rl2.png, rl3.jpg) */
.sobre-images-col {
    flex: 0.9;
    display: flex;
    gap: 15px;
}

.mosaic-left {
    display: flex;
    flex-direction: column;
    gap: 15px;
    flex: 1;
}

.mosaic-left img {
    width: 100%;
    border-radius: 12px;
    object-fit: cover;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.img-top {
    height: 200px;
}

.img-bottom {
    height: 180px;
}

.mosaic-right {
    flex: 1;
}

.img-tall {
    width: 100%;
    height: 395px;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

/* --- Bloco Nossos Números --- */
.nossos-numeros-wrapper {
    margin-top: 20px;
}

.nossos-numeros-wrapper .section-title {
    color: var(--cor-primaria, #00A877);
    font-size: 2.4rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 40px;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.stat-card {
    background-color: #f7f7f7;
    border: 1px solid #e8e8e8;
    border-radius: 24px;
    padding: 40px 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.stat-number {
    color: var(--cor-primaria, #00A877);
    font-size: 3.2rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.stat-label {
    color: #333333;
    font-size: 1.05rem;
    font-weight: 500;
}

/* Responsividade */
@media (max-width: 992px) {
    .sobre-home-content {
        flex-direction: column;
    }

    .stats-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }

    .sobre-images-col {
        width: 100%;
    }
}

/* ================= SEÇÃO CONTATO ================= */
.contato-section {
    background-color: var(--dark-grey);
    padding: 80px 0 100px 0;
    position: relative;
    z-index: 5;
}

.contato-wrapper {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 40px;
    align-items: flex-start;
}

.contato-info-col {
    padding-top: 10px;
}

.contato-lista {
    list-style: none;
    padding: 0;
    margin: 30px 0 35px 0;
}

.contato-lista li {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Jost', sans-serif;
    font-size: 15px;
    color: #E0E0E0;
    margin-bottom: 22px;
}

.contato-lista i {
    color: var(--realce);
    font-size: 20px;
}

.contato-lista strong {
    color: var(--white);
    font-weight: 600;
}

.btn-whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: #00C853;
    color: #FFFFFF;
    font-family: 'Montserrat', sans-serif;
    font-size: 14.5px;
    font-weight: 600;
    padding: 14px 28px;
    border-radius: 50px;
    text-decoration: none;
    transition: background-color 0.3s ease, transform 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 200, 83, 0.25);
    margin-bottom: 40px;
}

.btn-whatsapp:hover {
    background-color: #00E676;
    transform: translateY(-3px);
}

.btn-whatsapp i {
    font-size: 19px;
}

.contato-redes p {
    font-family: 'Jost', sans-serif;
    font-size: 15px;
    color: #CCCCCC;
    margin-bottom: 16px;
}

.social-icons {
    display: flex;
    gap: 14px;
}

.social-icons a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 18px;
    text-decoration: none;
    transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.social-icons a:hover {
    background-color: var(--realce);
    color: #000000;
    transform: translateY(-4px);
}

.contato-form-card {
    background-color: #FFFFFF;
    border-radius: 28px;
    padding: 45px 40px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
    margin-top: -110px;
    position: relative;
    z-index: 10;
}

.contato-form-card h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 28px;
    font-weight: 500;
    color: #111111;
    text-align: center;
    margin-bottom: 10px;
}

.form-sub {
    font-family: 'Jost', sans-serif;
    font-size: 15px;
    color: #666666;
    text-align: center;
    margin-bottom: 30px;
    line-height: 1.5;
}

.contato-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contato-form input {
    width: 100%;
    padding: 14px 18px;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    font-family: 'Jost', sans-serif;
    font-size: 14px;
    color: #333333;
    outline: none;
    transition: border-color 0.3s ease;
}

.contato-form input::placeholder {
    color: #999999;
}

.contato-form input:focus {
    border-color: var(--realce);
}

.btn-submit {
    background-color: var(--realce);
    color: #FFFFFF !important;
    font-family: var(--fonte-principal);
    font-size: 16px;
    font-weight: 600;
    padding: 14px 20px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    margin-top: 12px;
    width: 100%;
    display: block;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(10, 146, 111, 0.3);
}

.btn-submit:hover {
    background-color: var(--realce-hover);
    color: #000000 !important;
    /* Texto fica preto com fundo ciano visível */
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(6, 247, 185, 0.4);
}

/* ================= SEÇÃO MAPA ================= */
.mapa-section {
    width: 100%;
    background-color: var(--dark-grey);
    line-height: 0;
    overflow: hidden;
}

.mapa-container {
    width: 100%;
    height: 420px;
    position: relative;
}

.mapa-container iframe {
    width: 100%;
    height: 100%;
    border: none;
    filter: grayscale(100%) contrast(1.1) opacity(0.88);
    transition: filter 0.3s ease, opacity 0.3s ease;
}

.mapa-container:hover iframe {
    filter: grayscale(0%) contrast(1) opacity(1);
}

/* ================= RODAPÉ / FOOTER ================= */
.main-footer {
    background-color: #000000;
    padding-top: 70px;
    color: #FFFFFF;
    font-family: 'Jost', sans-serif;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1.2fr 1fr 1.3fr;
    gap: 30px;
    padding-bottom: 60px;
}

.footer-brand-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.footer-logo {
    max-width: 170px;
    height: auto;
    margin-bottom: 18px;
}

.footer-tagline {
    font-size: 13.5px;
    color: #CCCCCC;
    margin-bottom: 24px;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.footer-tagline strong {
    color: #FFFFFF;
    font-weight: 700;
}

.footer-socials {
    display: flex;
    gap: 12px;
}

/* Redes Sociais do Rodapé / Footer */
.footer-socials a {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: #262626;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    text-decoration: none;
    transition: background-color 0.3s ease, transform 0.3s ease, color 0.3s ease;
}

.footer-socials a:hover {
    background-color: var(--cor-primaria);
    color: #000000;
    transform: translateY(-3px);
}

.footer-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: var(--realce);
    margin-bottom: 22px;
    letter-spacing: 0.3px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links a {
    color: #CCCCCC;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease, padding-left 0.3s ease;
    display: inline-block;
}

.footer-links a:hover {
    color: var(--cor-primaria);
    padding-left: 4px;
}

.footer-contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-contact-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #CCCCCC;
    font-size: 14px;
    margin-bottom: 16px;
    line-height: 1.4;
}

.footer-contact-list i {
    color: var(--realce);
    font-size: 17px;
    min-width: 20px;
}

.footer-bottom {
    background-color: #1A1A1A;
    padding: 22px 0;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13.5px;
    color: #AAAAAA;
}

.privacy-link {
    color: #AAAAAA;
    text-decoration: none;
    transition: color 0.3s ease;
}

.privacy-link:hover {
    color: var(--realce);
}

/* ================= RESPONSIVIDADE (CONTATO, MAPA E FOOTER) ================= */
@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }
}

@media (max-width: 900px) {
    .contato-wrapper {
        grid-template-columns: 1fr;
    }

    .contato-form-card {
        margin-top: 0;
        padding: 35px 24px;
    }
}

@media (max-width: 650px) {
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .footer-bottom-content {
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }

    .mapa-container {
        height: 320px;
    }
}

/* Correção do Botão Solicitar Orçamento */
.btn-orcamento,
a.btn-header {
    background-color: var(--realce);
    /* Garante que o fundo fique laranja/visível */
    color: #FFFFFF !important;
    /* Cor do texto em branco com contraste */
    opacity: 1 !important;
    /* Garante que não está transparente */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

/* Estado ao passar o mouse */
.btn-orcamento:hover,
a.btn-header:hover {
    background-color: var(--primary);
    /* Laranja mais escuro no hover */
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

/* =========================================
PÁGINA SOBRE NÓS - ESTILOS EXCLUSIVOS
========================================= */

/* Banner Superior */
.page-banner {
    background-color: var(--cor-fundo-preto);
    padding: 140px 0 60px 0;
    text-align: center;
}

.page-banner h1 {
    font-family: var(--fonte-principal);
    font-size: 42px;
    color: var(--cor-primaria);
    font-weight: 600;
    margin: 0;
}

/* Seção Equipe */
.equipe-section {
    padding: 80px 0;
    background-color: #FAFAFA;
}

.equipe-header {
    margin-bottom: 50px;
}

.equipe-sub {
    font-family: var(--fonte-principal);
    font-size: 15px;
    letter-spacing: 2px;
    color: var(--cor-secundaria);
    font-weight: 600;
    margin-top: 10px;
}

/* Grid de Membros */
.equipe-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.equipe-card {
    background-color: #FFFFFF;
    border-radius: 20px;
    padding: 35px 25px;
    text-align: center;
    border: 1px solid #EAEAEA;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.equipe-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(10, 146, 111, 0.15);
}

/* Foto Circular do Membro */
.equipe-img-wrapper {
    width: 170px;
    height: 170px;
    margin: 0 auto 20px auto;
    border-radius: 50%;
    overflow: hidden;
    background-color: #F0F0F0;
}

.equipe-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.equipe-card h3 {
    font-family: var(--fonte-principal);
    font-size: 22px;
    color: var(--cor-secundaria);
    margin-bottom: 12px;
    font-weight: 600;
}

.equipe-card p {
    font-family: var(--fonte-principal);
    font-size: 15px;
    color: var(--cor-texto-p);
    line-height: 1.6;
}

/* Botão WhatsApp Pedir Orçamento */
.equipe-btn-wrapper {
    text-align: center;
    margin-top: 50px;
}

.btn-whatsapp-equipe {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: var(--cor-primaria);
    color: #000000;
    font-family: var(--fonte-principal);
    font-size: 18px;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(6, 247, 185, 0.3);
}

.btn-whatsapp-equipe:hover {
    background-color: var(--cor-secundaria);
    color: #FFFFFF;
    transform: translateY(-3px);
}

/* Responsividade da Equipe */
@media (max-width: 992px) {
    .equipe-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .equipe-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================
CORREÇÕES PARA A PÁGINA SOBRE NÓS & EQUIPE
========================================= */

/* Banner Superior */
.page-banner {
    background-color: #000000;
    padding: 130px 0 50px 0;
    text-align: center;
}

.page-banner h1 {
    font-family: 'Advent Pro', sans-serif;
    font-size: 42px;
    color: #06F7B9;
    font-weight: 600;
    margin: 0;
}

/* Subtítulo */
.sobre-subtitle {
    font-family: 'Advent Pro', sans-serif;
    font-size: 15px;
    letter-spacing: 2px;
    color: #0A926F;
    font-weight: 700;
    margin-bottom: 20px;
}

/* Forçar cores escuras e legíveis no texto sobre fundo claro */
.sobre-paragraph {
    color: #333333 !important;
    font-family: 'Advent Pro', sans-serif;
    font-size: 17px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.sobre-highlight {
    color: #000000 !important;
    font-family: 'Advent Pro', sans-serif;
    font-size: 18px;
    margin-top: 20px;
}

/* Seção Equipe */
.equipe-section {
    padding: 80px 0;
    background-color: #F8F9FA;
}

.equipe-sub {
    font-family: 'Advent Pro', sans-serif;
    font-size: 15px;
    letter-spacing: 2px;
    color: #0A926F;
    font-weight: 700;
    margin-top: 10px;
}

.equipe-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.equipe-card {
    background-color: #FFFFFF;
    border-radius: 20px;
    padding: 35px 25px;
    text-align: center;
    border: 1px solid #EAEAEA;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.equipe-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(10, 146, 111, 0.15);
}

.equipe-img-wrapper {
    width: 170px;
    height: 170px;
    margin: 0 auto 20px auto;
    border-radius: 50%;
    overflow: hidden;
    background-color: #EEEEEE;
}

.equipe-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.equipe-card h3 {
    font-family: 'Advent Pro', sans-serif;
    font-size: 22px;
    color: #0A926F;
    margin-bottom: 12px;
    font-weight: 600;
}

.equipe-card p {
    font-family: 'Advent Pro', sans-serif;
    font-size: 15px;
    color: #444444 !important;
    /* Força cor visível */
    line-height: 1.6;
}

.equipe-btn-wrapper {
    text-align: center;
    margin-top: 50px;
}

.btn-whatsapp-equipe {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: #06F7B9;
    color: #000000;
    font-family: 'Advent Pro', sans-serif;
    font-size: 18px;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(6, 247, 185, 0.3);
}

.btn-whatsapp-equipe:hover {
    background-color: #0A926F;
    color: #FFFFFF;
    transform: translateY(-3px);
}

/* Responsividade */
@media (max-width: 992px) {
    .equipe-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .equipe-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================
PÁGINA DE TRABALHOS (PROJETOS)
========================================= */

.banner-subtitle {
    font-family: 'Advent Pro', sans-serif;
    color: #CCCCCC;
    font-size: 18px;
    margin-top: 10px;
}

.trabalhos-grid-section {
    padding: 60px 0 100px 0;
    background-color: #FFFFFF;
}

/* Grid de 3 Colunas */
.trabalhos-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 35px;
}

.trabalho-card {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.trabalho-title {
    font-family: 'Advent Pro', sans-serif;
    font-size: 24px;
    color: #111111;
    font-weight: 600;
    margin-bottom: 18px;
    text-align: center;
}

/* Container do Carrossel de Imagens */
.carousel-container {
    position: relative;
    width: 100%;
    height: 440px;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

.carousel-slides {
    width: 100%;
    height: 100%;
    position: relative;
}

.slide-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

.slide-img.active {
    opacity: 1;
}

/* Botões de Navegação (Setas) */
.carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.6);
    color: #FFFFFF;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    z-index: 10;
    transition: all 0.3s ease;
}

.carousel-arrow:hover {
    background-color: #06F7B9;
    color: #000000;
}

.carousel-arrow.prev {
    left: 15px;
}

.carousel-arrow.next {
    right: 15px;
}

/* Responsividade */
@media (max-width: 992px) {
    .trabalhos-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .trabalhos-grid {
        grid-template-columns: 1fr;
    }

    .carousel-container {
        height: 380px;
    }
}