/*
Theme Name: AgroPampa Lite
Theme URI: https://seusite.com/agropampa-lite/
Author: Seu Nome
Author URI: https://seusite.com/
Description: AgroPampa Lite é um tema robusto para o agronegócio. (Versão Gratuita).
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: agropampa-lite
Tags: e-commerce, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template
Tested up to: 6.4
Requires PHP: 7.4
*/

/* --- VARIÁVEIS CSS FIXAS (Na versão PRO isto é gerado via PHP) --- */
:root {
    --cor-primaria: #2c5e2e;
    --cor-secundaria: #d4a017;
}

/* Reset básico para garantir que fica bonito */
body {
    font-family: 'Georgia', serif;
    /* Fonte mais clássica/tradicional */
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    color: #333;
}

header {
    background-color: #333;
    /* Cor padrão se o usuário não escolher outra */
    color: white;
    padding: 20px;
    text-align: center;
    border-bottom: 5px solid #d4a017;
    /* Um dourado/amarelo trigo */
}

.conteudo {
    max-width: 900px;
    margin: 20px auto;
    padding: 20px;
    background: white;
    border: 1px solid #ddd;
}

/* --- Estilos do Menu --- */

.navegacao-principal {
    background-color: #d4a017;
    /* Aquele amarelo trigo */
    border-top: 1px solid #b88a10;
    text-align: center;
    /* Centraliza os links */
}

/* Remove as bolinhas da lista */
.navegacao-principal ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Coloca os itens um ao lado do outro */
.navegacao-principal ul li {
    display: inline-block;
    position: relative;
}

/* O visual dos links */
.navegacao-principal ul li a {
    display: block;
    padding: 15px 20px;
    color: #333;
    /* Cor do texto */
    text-decoration: none;
    font-weight: bold;
    text-transform: uppercase;
    /* Letras maiúsculas */
    font-size: 14px;
    transition: background 0.3s;
}

/* Quando passa o rato por cima */
.navegacao-principal ul li a:hover {
    background-color: #2c5e2e;
    /* Verde Pampa */
    color: white;
}

/* --- Vitrine (Front Page) --- */

/* Hero Section (Banner Verde) */
.destaque-topo {
    background-color: #2c5e2e;
    /* Verde Pampa */
    color: white;
    padding: 60px 20px;
    text-align: center;
    margin-bottom: 40px;
}

.conteudo-destaque h2 {
    font-size: 2.5em;
    margin-top: 0;
}

.botao-acao {
    display: inline-block;
    background-color: #d4a017;
    color: #333;
    padding: 10px 20px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    margin-top: 10px;
}

.botao-acao:hover {
    background-color: #fff;
}

/* Grid de Produtos */
.titulo-secao {
    border-left: 5px solid #d4a017;
    padding-left: 10px;
    margin-bottom: 20px;
    color: #333;
}

.grid-produtos {
    display: flex;
    /* Cria o layout flexível */
    flex-wrap: wrap;
    /* Permite quebra de linha se não couber */
    gap: 20px;
    /* Espaço entre os cartões */
}

.cartao-produto {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    width: 30%;
    /* Cada produto ocupa +/- 30% da tela (3 por linha) */
    flex-grow: 1;
    overflow: hidden;
    /* Garante que nada sai da borda */
    transition: transform 0.2s;
}

.cartao-produto:hover {
    transform: translateY(-5px);
    /* Efeito de levantar levemente */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.imagem-produto img {
    width: 100%;
    /* Imagem preenche o cartão */
    height: auto;
    display: block;
}

.info-produto {
    padding: 15px;
    text-align: center;
}

.botao-ver {
    display: inline-block;
    margin-top: 10px;
    padding: 5px 15px;
    border: 1px solid #2c5e2e;
    color: #2c5e2e;
    text-decoration: none;
    font-size: 0.9em;
}

.botao-ver:hover {
    background-color: #2c5e2e;
    color: white;
}

/* Responsividade para telemóveis */
@media (max-width: 768px) {
    .cartao-produto {
        width: 100%;
        /* No telemóvel, ocupa 100% (um por linha) */
    }
}

/* Preço do Produto */
.preco-produto {
    color: #2c5e2e;
    /* Verde forte */
    font-size: 1.2em;
    /* Letra maior */
    font-weight: bold;
    margin: 5px 0;
    font-family: Arial, sans-serif;
    /* Fonte limpa para números */
}

/* --- Página de Produto Único (Single) --- */

.produto-detalhe-container {
    display: flex;
    gap: 40px; /* Espaço entre a foto e o texto */
    margin-top: 30px;
}

/* Coluna da Imagem */
.produto-imagem-grande {
    flex: 1; /* Ocupa 1 parte do espaço */
}

.produto-imagem-grande img {
    width: 100%;
    height: auto;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Coluna do Texto */
.produto-info-completa {
    flex: 1; /* Ocupa o mesmo tamanho da imagem */
}

.produto-info-completa h1 {
    font-size: 2.5em;
    margin-top: 0;
    color: #333;
}

.preco-destaque {
    font-size: 2em;
    color: #2c5e2e; /* Verde Pampa */
    font-weight: bold;
    margin-bottom: 20px;
}

.descricao-texto {
    font-size: 1.1em;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
}

/* Botão de WhatsApp Simulado */
.botao-whatsapp {
    display: inline-block;
    background-color: #25D366; /* Cor oficial do WhatsApp */
    color: white;
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.1em;
    border-radius: 50px;
    transition: background 0.3s;
}

.botao-whatsapp:hover {
    background-color: #128C7E;
}

/* Responsividade: No telemóvel, fica um em cima do outro */
@media (max-width: 768px) {
    .produto-detalhe-container {
        flex-direction: column; /* Muda a direção para coluna */
    }
}

/* --- Modelo de Página: Largura Total --- */

.conteudo-full {
    width: 100%;       /* Ocupa a tela toda */
    max-width: 1200px; /* Mas não deixa esticar demais em monitores gigantes */
    margin: 0 auto;    /* Centraliza */
    padding: 40px 20px;
    background: white;
    box-sizing: border-box; /* Garante que o padding não estoure a largura */
}

.cabecalho-pagina {
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 2px solid #f4f4f4;
    padding-bottom: 20px;
}

.titulo-pagina {
    font-size: 3em;
    color: #2c5e2e;
}

/* --- ESTILO GAUCHESCO PERSONALIZADO --- */

/* 1. Hero Section */
.hero-gaucho {
    position: relative;
    height: 500px; /* Altura do banner */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

/* Máscara preta transparente para o texto ler melhor sobre a foto */
.mascara-escura {
    background: rgba(0, 0, 0, 0.5); 
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hero-titulo {
    font-size: 3.5em;
    margin: 0;
    text-shadow: 2px 2px 4px #000;
    font-family: 'Georgia', serif;
    border-bottom: 3px solid #d4a017; /* Linha dourada */
    padding-bottom: 10px;
}

.hero-texto {
    font-size: 1.2em;
    margin-bottom: 30px;
    font-style: italic;
}

/* Botão estilo Couro */
.botao-couro {
    background-color: #8B4513; /* Marrom sela */
    color: white;
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    border: 2px solid #5C2E0B;
    text-transform: uppercase;
    transition: all 0.3s;
}

.botao-couro:hover {
    background-color: #5C2E0B;
    transform: scale(1.05); /* Aumenta um pouco */
}

/* 2. Faixa de Ícones */
.faixa-icones {
    background-color: #f9f9f9;
    padding: 60px 20px;
    border-bottom: 1px solid #ddd;
}

.container-icones {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    text-align: center;
}

.item-icone {
    flex: 1;
    min-width: 250px;
    padding: 20px;
}

.img-icone {
    max-width: 80px; /* Tamanho dos ícones */
    margin-bottom: 20px;
    filter: sepia(100%) hue-rotate(50deg) saturate(1.5); /* Truque CSS para deixar ícones coloridos em tom 'pampa' */
}

.item-icone h3 {
    color: #2c5e2e;
    text-transform: uppercase;
    font-size: 1.2em;
    margin-bottom: 10px;
}

/* 3. Títulos Ornamentais */
.titulo-rustico-container {
    text-align: center;
    margin: 50px 0 30px 0;
}

.titulo-rustico {
    font-size: 2em;
    color: #333;
    display: inline-block;
    padding: 0 20px;
    background: #fff; /* Para cobrir a linha atrás */
    position: relative;
    z-index: 1;
}

.linha-ornamental {
    height: 2px;
    background: #d4a017;
    margin-top: -25px; /* Sobe para ficar atrás do texto */
    width: 60%;
    margin-left: 20%;
    z-index: 0;
}

/* --- HEADER PROFISSIONAL 2.0 --- */

/* Reset de Margens para o Header */
body { margin: 0; padding: 0; }

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

/* Barra de Topo (Escura) */
.top-bar {
    background-color: #1a1a1a;
    color: #ccc;
    font-size: 0.85em;
    padding: 8px 0;
    border-bottom: 1px solid #333;
}
.top-bar .container-header {
    display: flex;
    justify-content: space-between;
}

/* Header Principal (Branco e Limpo) */
.header-principal {
    background-color: white;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    padding: 15px 0;
    position: sticky; /* Cola no topo ao rolar */
    top: 0;
    z-index: 1000;
}

.header-flex {
    display: flex;
    align-items: center; /* Centraliza verticalmente */
    justify-content: space-between;
}

/* 1. Logo */
.logo-area img {
    max-height: 60px; /* Controla o tamanho do logo */
    width: auto;
}
.logo-area h1 { margin: 0; font-size: 1.8em; color: #2c5e2e; }
.logo-area a { text-decoration: none; color: inherit; }

/* 2. Menu */
.menu-area ul {
    margin: 0; padding: 0; list-style: none; display: flex;
}
.menu-area ul li a {
    text-decoration: none;
    color: #333;
    font-weight: 600;
    padding: 10px 15px;
    text-transform: uppercase;
    font-size: 0.9em;
    transition: color 0.3s;
}
.menu-area ul li a:hover { color: #d4a017; }

/* 3. Carrinho e Botões */
.acoes-header {
    display: flex;
    align-items: center;
    gap: 15px;
}

.carrinho-botao {
    text-decoration: none;
    color: #333;
    font-size: 1.2em;
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
}

.texto-carrinho {
    font-size: 0.8em;
    font-weight: bold;
}

.bolinha-contador {
    position: absolute;
    top: -8px;
    left: -8px;
    background-color: #d4a017;
    color: white;
    font-size: 0.6em;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.botao-orcamento {
    background-color: #2c5e2e;
    color: white;
    padding: 8px 15px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
}
.botao-orcamento:hover { background-color: #1e4220; }

/* Responsividade Básica (Esconde menu no telemóvel para não quebrar) */
@media (max-width: 768px) {
    .menu-area { display: none; } /* Num tema real, aqui entraria o Menu Hambúrguer */
    .texto-carrinho { display: none; }
    .header-flex { flex-wrap: wrap; }
    .logo-area { width: 100%; text-align: center; margin-bottom: 10px; }
    .acoes-header { width: 100%; justify-content: center; }
}

.loja-container {
    padding: 40px 0;
    max-width: 1200px;
    margin: 0 auto;
}
/* Estiliza o botão padrão do WooCommerce para combinar com o tema */
.woocommerce button.button.alt {
    background-color: #2c5e2e !important; /* Verde Pampa */
    color: white !important;
}

/* --- SUBMENUS (DROPDOWN) --- */

/* 1. Prepara o item pai para segurar o submenu */
.menu-area ul li {
    position: relative; /* Importante para o submenu saber onde ancorar */
}

/* 2. O Submenu em si (A caixinha flutuante) */
.menu-area ul ul {
    display: none; /* Escondido por padrão */
    position: absolute;
    top: 100%; /* Aparece logo abaixo do menu principal */
    left: 0;
    background-color: #fff;
    border-top: 3px solid #d4a017; /* Detalhe dourado no topo */
    box-shadow: 0 4px 10px rgba(0,0,0,0.15); /* Sombra para dar profundidade */
    min-width: 220px; /* Largura mínima */
    z-index: 9999; /* Garante que fica por cima de tudo */
    padding: 0;
    flex-direction: column; /* Itens um embaixo do outro */
}

/* 3. A Mágica: Mostra quando passa o mouse no pai */
.menu-area ul li:hover > ul {
    display: flex; /* Muda de 'none' para 'flex' */
}

/* 4. Estilo dos itens do submenu */
.menu-area ul ul li {
    width: 100%;
    border-bottom: 1px solid #f0f0f0;
}

.menu-area ul ul li:last-child {
    border-bottom: none;
}

.menu-area ul ul li a {
    padding: 12px 20px;
    font-size: 0.85em;
    text-transform: capitalize; /* Apenas a primeira letra maiúscula, fica mais elegante */
    color: #555;
    display: block; /* Ocupa a linha toda */
    white-space: nowrap; /* Impede que o texto quebre linha */
}

/* Hover no item do submenu */
.menu-area ul ul li a:hover {
    background-color: #2c5e2e; /* Verde Pampa */
    color: white;
}

/* Pequena seta para indicar que tem submenu (Opcional, mas ajuda o usuário) */
.menu-menu-principal-container > ul > li.menu-item-has-children > a::after {
    content: '\25BC'; /* Código unicode para seta para baixo (▼) */
    font-size: 10px;
    margin-left: 5px;
    color: #d4a017;
    position: relative;
    top: -1px;
}

/* --- Estilos do Botão WooCommerce na Vitrine --- */

/* Centraliza e dá espaço */
.acoes-loja {
    margin-top: 15px;
    text-align: center;
}

/* O botão 'Adicionar ao Carrinho' */
.acoes-loja .button {
    background-color: #d4a017; /* Amarelo Trigo */
    color: #333;
    padding: 10px 20px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 4px;
    font-size: 0.9em;
    display: inline-block;
    transition: background 0.3s;
}

.acoes-loja .button:hover {
    background-color: #2c5e2e; /* Verde Pampa */
    color: white;
}

/* Selo de Oferta (caso uses promoção) */
.selo-oferta {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #e74c3c;
    color: white;
    padding: 5px 10px;
    font-size: 0.8em;
    font-weight: bold;
    border-radius: 3px;
    z-index: 10;
}

/* Ajuste no preço para suportar "De: R$100 Por: R$80" */
.preco-produto del {
    color: #999;
    font-size: 0.8em;
    margin-right: 5px;
}
.preco-produto ins {
    text-decoration: none;
    font-weight: bold;
}

/* --- ESTILIZAÇÃO GERAL DO WOOCOMMERCE --- */

/* Ajuste do cabeçalho da loja */
.titulo-loja-header {
    background-color: #f4f4f4;
    padding: 20px 0;
    border-bottom: 1px solid #ddd;
    margin-bottom: 30px;
}
.titulo-loja-header h1 {
    margin: 0;
    color: #2c5e2e;
    font-size: 2em;
}

/* Links e Caminho (Breadcrumbs) */
.woocommerce-breadcrumb {
    color: #666;
    font-size: 0.9em;
}
.woocommerce-breadcrumb a {
    color: #d4a017;
    text-decoration: none;
}

/* BOTÕES GERAIS (Checkout, Carrinho, Comprar) */
.woocommerce #respond input#submit, 
.woocommerce a.button, 
.woocommerce button.button, 
.woocommerce input.button {
    background-color: #2c5e2e !important; /* Verde Fundo */
    color: white !important;
    border-radius: 4px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 12px 20px;
    transition: background 0.3s;
}

.woocommerce #respond input#submit:hover, 
.woocommerce a.button:hover, 
.woocommerce button.button:hover, 
.woocommerce input.button:hover {
    background-color: #1a3c1c !important; /* Verde mais escuro */
}

/* MENSAGENS DE ALERTA (Sucesso/Erro) */
.woocommerce-message {
    border-top-color: #2c5e2e !important; /* Borda verde */
}
.woocommerce-message::before {
    color: #2c5e2e !important; /* Ícone verde */
}
.woocommerce-info {
    border-top-color: #d4a017 !important; /* Borda amarela */
}
.woocommerce-info::before {
    color: #d4a017 !important;
}

/* TABELA DO CARRINHO */
.woocommerce table.shop_table {
    border: 1px solid #ddd;
    border-radius: 5px;
}
.woocommerce table.shop_table th {
    background-color: #f9f9f9;
    color: #333;
}

/* PREÇOS */
.woocommerce div.product p.price, 
.woocommerce div.product span.price {
    color: #2c5e2e; /* Preço sempre verde */
    font-size: 1.25em;
}

/* INPUTS (Campos de formulário no checkout) */
.woocommerce form .form-row input.input-text, 
.woocommerce form .form-row textarea {
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px;
}
.woocommerce form .form-row input.input-text:focus {
    border-color: #d4a017; /* Fica amarelo quando clica para digitar */
    outline: none;
}




/* ==========================================================
   MELHORIAS DE DESIGN (AgroPampa Pro)
   Cole isto no final do seu style.css
   ========================================================== */

/* 1. TIPOGRAFIA PROFISSIONAL (Modernização) */
/* Mantemos Georgia para parágrafos, mas usamos Sans-serif para impacto */
h1, h2, h3, h4, h5, h6,
.menu-area ul li a,
.botao-acao,
.button,
.preco-produto,
th {
    font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: -0.5px; /* Deixa o título mais compacto e moderno */
}

/* 2. MELHORIA NA SECÇÃO DE ÍCONES (Diferenciais) */
/* Transforma os itens soltos em cartões elegantes */
.item-icone {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-bottom: 4px solid #d4a017; /* Detalhe dourado na base */
    border-radius: 8px; /* Cantos arredondados */
    padding: 30px 20px;
    margin: 10px; /* Espaço entre eles */
    transition: transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05); /* Sombra suave */
}

.item-icone:hover {
    transform: translateY(-5px); /* Levanta ao passar o mouse */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.item-icone h3 {
    font-size: 1.4em;
    font-weight: 700;
    margin-top: 15px;
    color: #333;
}

.item-icone p {
    color: #666;
    font-size: 0.95em;
    line-height: 1.5;
}

/* 3. O BOTÃO "VER CARRINHO" (Pós-clique) */
/* Quando você clica em comprar, aparece um link 'Ver carrinho'. Vamos estilizá-lo */
a.added_to_cart.wc-forward {
    display: inline-block;
    margin-left: 10px;
    padding: 8px 15px;
    border: 1px solid #2c5e2e;
    color: #2c5e2e;
    background-color: transparent;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.85em;
    font-weight: bold;
    font-family: sans-serif;
    text-transform: uppercase;
}

a.added_to_cart.wc-forward:hover {
    background-color: #2c5e2e;
    color: white;
}

/* Ajuste para o botão 'Adicionar' e 'Ver carrinho' ficarem alinhados */
.acoes-loja {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

/* 4. DESIGN DA PÁGINA DO CARRINHO (Versão Reforçada) */

/* Tabela de Produtos */
.woocommerce table.shop_table {
    border-collapse: separate;
    border-spacing: 0;
    border: none !important;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px !important;
}

/* Cabeçalho Verde (Agora com !important para forçar) */
.woocommerce table.shop_table th {
    background-color: #2c5e2e !important; 
    color: white !important;
    font-weight: 600;
    padding: 15px !important;
    text-transform: uppercase;
    font-size: 0.9em;
    border: none !important;
}

.woocommerce table.shop_table td {
    padding: 20px 15px !important;
    border-bottom: 1px solid #eee !important;
    vertical-align: middle;
}

/* Caixa de Totais do Carrinho (Direita ou Baixo) */
.woocommerce .cart-collaterals .cart_totals {
    background-color: #f9f9f9;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    width: 100%;
}

.woocommerce .cart-collaterals .cart_totals h2 {
    font-size: 1.5em;
    color: #333;
    border-bottom: 2px solid #d4a017;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-family: 'Segoe UI', sans-serif;
}

/* Inputs de Quantidade (+/-) */
.woocommerce .quantity .qty {
    width: 60px;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
    font-weight: bold;
    color: #333;
}

/* Botão de Remover (X) vermelho */
.woocommerce a.remove {
    color: #e74c3c !important;
    font-weight: bold;
    border: 1px solid #e74c3c !important;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    margin: 0 auto;
}
.woocommerce a.remove:hover {
    background-color: #e74c3c !important;
    color: white !important;
}

/* Botão de Atualizar Carrinho */
.woocommerce button[name="update_cart"] {
    background-color: #ddd !important;
    color: #333 !important;
    font-weight: normal !important;
}
.woocommerce button[name="update_cart"]:hover {
    background-color: #ccc !important;
}




/* ==========================================================
   EFEITO BRASÃO NO LOGO (Sobreposição)
   ========================================================== */

/* 1. Permitir que o logo "vaze" para fora do header */
.header-principal {
    overflow: visible !important; /* Crucial: Deixa o logo sair da caixa */
    position: relative;
    z-index: 1000;
}

/* 2. Área do Logo (O Container) */
.logo-area {
    position: relative; /* Torna-se a âncora para o logo flutuante */
    /* IMPORTANTE: Como o logo vai flutuar, precisamos reservar 
       um espaço vazio aqui para o Menu não bater nele.
       Ajuste este valor conforme a largura do teu logo.
    */
    min-width: 180px; 
    min-height: 60px; /* Mantém a altura mínima da barra */
    display: flex;
    align-items: center; /* Centraliza verticalmente */
}

/* 3. A Imagem do Logo (O Brasão) */
.logo-area img {
    position: absolute; /* Tira do fluxo e faz flutuar */
    top: -10px;         /* Ajuste fino: Sobe um pouco ou desce */
    left: 0;
    
    /* Aumenta o tamanho para ser maior que o header */
    max-height: 140px !important; 
    width: auto;
    
    /* Garante que fica em cima do banner/hero */
    z-index: 2000; 
    
    /* Efeito de Sombra para destacar do fundo */
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.3));
    
    /* Transição suave se o mouse passar */
    transition: transform 0.3s ease;
}

/* Efeito ao passar o mouse no logo */
.logo-area img:hover {
    transform: scale(1.05); /* Aumenta ligeiramente */
}

/* --- Ajuste para Telemóveis --- */
/* No celular, não queremos que ele tape o conteúdo, então voltamos ao normal */
@media (max-width: 768px) {
    .logo-area {
        min-width: 0;
        justify-content: center;
    }
    .logo-area img {
        position: static; /* Volta ao normal */
        max-height: 80px !important;
        filter: none;
        margin-bottom: 10px;
    }
}


/* --- ESTILOS DA BARRA DE TOPO E SOCIAIS --- */

/* Ajusta o container direito para alinhar Frase + Ícones */
.sociais-topo {
    display: flex;
    align-items: center;
    gap: 20px; /* Espaço entre a frase e os ícones */
}

/* Esconde a frase em celulares muito pequenos para caber os ícones */
@media (max-width: 600px) {
    .frase-topo-texto {
        display: none;
    }
}

.icones-rede {
    display: flex;
    gap: 15px; /* Espaço entre cada ícone */
}

.icones-rede a {
    color: #ccc; /* Cor padrão cinza claro */
    font-size: 1.1em;
    text-decoration: none;
    transition: transform 0.2s, color 0.2s;
}

/* Hover: Efeito ao passar o mouse */
.icones-rede a:hover {
    color: #fff; /* Fica branco brilhante */
    transform: translateY(-2px); /* Sobe um pouquinho */
}

/* Cores Específicas para cada rede (Opcional - se quiseres dar cor) */
/* Se preferires manter tudo neutro, não copies esta parte abaixo */
.icones-rede a .fa-whatsapp:hover { color: #25D366; }
.icones-rede a .fa-instagram:hover { color: #E1306C; }
.icones-rede a .fa-facebook-f:hover { color: #1877F2; }


/* Ajuste do ícone dentro do botão de orçamento */
.botao-orcamento i {
    margin-right: 8px; /* Espaço entre o ícone e o texto */
    font-size: 1.1em;  /* Ícone ligeiramente maior */
}

/* --- ESTILOS DO RODAPÉ (FOOTER) --- */

.site-footer {
    background-color: #1a1a1a; /* Fundo escuro */
    color: #b0b0b0; /* Texto cinza claro para não cansar a vista */
    font-size: 0.95em;
    margin-top: 50px; /* Separa do conteúdo */
}

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

/* Grid de 3 Colunas */
.footer-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    padding: 60px 0;
    border-bottom: 1px solid #333; /* Linha separadora suave */
}

.footer-col {
    flex: 1; /* Cada coluna ocupa espaço igual */
    min-width: 250px; /* Tamanho mínimo para celular */
}

/* Títulos dos Widgets */
.titulo-widget {
    color: #fff;
    font-family: 'Segoe UI', sans-serif;
    text-transform: uppercase;
    font-size: 1.1em;
    border-bottom: 2px solid #d4a017; /* Detalhe Dourado */
    display: inline-block;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Estilo para Listas (Menus e Links no Footer) */
.widget-rodape ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.widget-rodape ul li {
    margin-bottom: 10px;
    border-bottom: 1px solid #2a2a2a;
    padding-bottom: 10px;
}

.widget-rodape ul li a {
    color: #b0b0b0;
    text-decoration: none;
    transition: color 0.3s, padding-left 0.3s;
}

.widget-rodape ul li a:hover {
    color: #d4a017; /* Fica dourado ao passar o mouse */
    padding-left: 5px; /* Move levemente para a direita */
}

/* Barra de Copyright */
.site-info {
    background-color: #111; /* Um tom ainda mais escuro */
    padding: 20px 0;
    font-size: 0.85em;
}

.flex-copyright {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.credito-dev a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
}

/* Responsividade */
@media (max-width: 768px) {
    .footer-grid {
        flex-direction: column; /* Empilha as colunas */
        gap: 30px;
    }
    .flex-copyright {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
}





/* --- CLASSES PADRÃO DO WORDPRESS (OBRIGATÓRIO) --- */
.aligncenter { display: block; margin: 0 auto; }
.alignleft { float: left; margin-right: 1.5em; }
.alignright { float: right; margin-left: 1.5em; }
.wp-caption { max-width: 100%; border: 1px solid #ccc; padding: 5px; text-align: center; }
.wp-caption-text { font-size: 0.8em; margin-top: 5px; }
.screen-reader-text {
    border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
    height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
.sticky { background-color: #f9f9f9; border: 1px solid #ddd; padding: 10px; }
.bypostauthor { border-left: 3px solid #2c5e2e; padding-left: 10px; }
.gallery-caption { font-size: 0.8em; }