/* ===== RESET E CONFIGURAÇÕES GERAIS ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* Cores principais baseadas na Intelbras - Padrão Verde */
    --primary-color: #00a651;
    --primary-dark: #008542;
    --primary-light: #33b873;
    --secondary-color: #00a651;
    --secondary-dark: #008542;
    --secondary-light: #33b873;
    
    /* Cores neutras */
    --white: #ffffff;
    --black: #000000;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    
    /* Cores de estado */
    --success: #00a651;
    --warning: #f59e0b;
    --error: #ef4444;
    --info: #00a651;
    
    /* Tipografia - Similar à Intelbras */
    --font-family: 'Roboto', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 4rem;
    
    /* Espaçamentos */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 0.5rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;
    --spacing-3xl: 4rem;
    --spacing-4xl: 5rem;
    
    /* Bordas */
    --border-radius-sm: 0.25rem;
--border-radius-md: 0.5rem;
--border-radius-lg: 0.75rem;
--border-radius-xl: 1rem;
--border-radius-2xl: 1.5rem;
    
    /* Sombras */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    
    /* Transições */
    --transition-fast: 0.15s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
    --transition-slow: 0.5s ease-in-out;
}

/* Modo de alto contraste */
[data-contrast="high"],
.high-contrast {
    --primary-color: #ffffff;
    --primary-dark: #ffffff;
    --primary-light: #cccccc;
    --secondary-color: #000000;
    --secondary-dark: #000000;
    --secondary-light: #333333;
    --gray-50: #000000;
    --gray-100: #000000;
    --gray-200: #333333;
    --gray-300: #666666;
    --gray-400: #999999;
    --gray-500: #cccccc;
    --gray-600: #ffffff;
    --gray-700: #ffffff;
    --gray-800: #ffffff;
    --gray-900: #ffffff;
    --white: #ffffff;
    --black: #000000;
}

/* Estilos específicos para alto contraste - FUNDO ESCURO */
.high-contrast {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast body {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .header {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-bottom: 2px solid #ffffff !important;
}

.high-contrast .top-bar {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .main-nav {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .nav-content {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .nav-menu {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .nav-list {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .nav-item {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .nav-link {
    color: #ffffff !important;
    background-color: transparent !important;
}

.high-contrast .nav-link:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
    text-decoration: underline !important;
}

.high-contrast .dropdown-menu {
    background-color: #000000 !important;
    border: 2px solid #ffffff !important;
    color: #ffffff !important;
}

.high-contrast .dropdown-menu a {
    color: #ffffff !important;
    background-color: transparent !important;
}

.high-contrast .dropdown-menu a:hover {
    background-color: #ffffff !important;
    color: #000000 !important;
}

.high-contrast .footer {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-top: 2px solid #ffffff !important;
}

.high-contrast .footer-content,
.high-contrast .footer-section,
.high-contrast .footer-main,
.high-contrast .footer-bottom {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .footer-description,
.high-contrast .footer-contact-item,
.high-contrast .footer-contact-item span,
.high-contrast .footer-section h3,
.high-contrast .footer-links a,
.high-contrast .footer-info p,
.high-contrast .footer-link {
    color: #ffffff !important;
}

.high-contrast .footer-contact-item i {
    color: #ffffff !important;
}

.high-contrast .footer-links a:hover,
.high-contrast .footer-link:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
    background-color: #333333 !important;
}

.high-contrast .footer-bottom {
    border-top: 2px solid #ffffff !important;
}

.high-contrast .footer-divider {
    color: #ffffff !important;
}

/* Estilos para outros elementos em alto contraste */
.high-contrast .btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #ffffff !important;
}

.high-contrast .btn:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}

.high-contrast .contact-item {
    color: #ffffff !important;
}

.high-contrast .contact-item:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
}

.high-contrast .social-links a {
    color: #ffffff !important;
}

.high-contrast .social-links a:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
}

.high-contrast .whatsapp-button {
    background-color: #ffffff !important;
    color: #000000 !important;
}

.high-contrast .back-to-top {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Logos em alto contraste */
.high-contrast .logo-img {
    filter: brightness(0) invert(1) !important; /* Transforma em branco */
}

.high-contrast .footer-logo img {
    filter: brightness(0) invert(1) !important; /* Transforma em branco */
}

.high-contrast .logo img {
    filter: brightness(0) invert(1) !important; /* Transforma em branco */
}

.high-contrast .mobile-menu .logo img {
    filter: brightness(0) invert(1) !important; /* Transforma em branco */
}

/* Outras imagens em alto contraste */
.high-contrast .certification-logo {
    filter: brightness(0) invert(1) !important; /* Transforma em branco */
}

.high-contrast .product-showcase-image {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .solution-image {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .product-image {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

/* Imagens dos sliders em alto contraste */
.high-contrast .carousel img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .carousel picture img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .owl-carousel img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .owl-item img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

/* Imagens específicas dos sliders */
.high-contrast .carousel .owl-carousel .owl-item img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .carousel .owl-carousel .owl-item picture img {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .carousel .owl-carousel .owl-item picture source {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

/* Overlay dos sliders */
.high-contrast .carousel .owl-carousel .owl-item a {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

.high-contrast .carousel .owl-carousel .owl-item picture {
    filter: brightness(0.8) contrast(1.2) !important; /* Melhora visibilidade */
}

/* Ícones em alto contraste */
.high-contrast .fas,
.high-contrast .fab,
.high-contrast .far {
    color: #ffffff !important;
}

.high-contrast .stat-card-icon i,
.high-contrast .tradition-feature-icon i,
.high-contrast .solution-icon i {
    color: #ffffff !important;
}

/* Mobile menu em alto contraste */
.high-contrast .mobile-menu {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .mobile-nav-menu {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .mobile-nav-link {
    color: #ffffff !important;
}

.high-contrast .mobile-nav-link:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
}

.high-contrast .mobile-submenu {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .mobile-submenu a {
    color: #ffffff !important;
}

.high-contrast .mobile-submenu a:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
}

/* Carousel e seções em alto contraste */
.high-contrast .carousel {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .carousel .owl-carousel {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .carousel .owl-item {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions h2,
.high-contrast .solutions h3,
.high-contrast .solutions p {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-item {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .solutions .solution-item:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

/* Seção Solutions específica */
.high-contrast .solutions .section-header {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .stats-title {
    color: #ffffff !important;
}

.high-contrast .solutions .section-subtitle {
    color: #ffffff !important;
}

.high-contrast .solutions .solutions-grid {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .solution-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .solutions .solution-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .solutions .solution-card-header {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .solution-icon {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .solution-icon i {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-badge {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .solutions .solution-card-content {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .solution-title {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-description {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-features {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .solutions .solution-features li {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-features i {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-link {
    color: #ffffff !important;
}

.high-contrast .solutions .solution-link:hover {
    color: #ffffff !important;
    background-color: #333333 !important;
    text-decoration: underline !important;
}

/* Outras seções específicas */
.high-contrast .stats-new {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-header {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-title {
    color: #ffffff !important;
}

.high-contrast .stats-subtitle {
    color: #ffffff !important;
}

.high-contrast .stats-cards {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stat-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .stat-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.high-contrast .stat-card-icon {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stat-card-icon i {
    color: #ffffff !important;
}

.high-contrast .stat-card-number {
    color: #ffffff !important;
}

.high-contrast .stat-card-label {
    color: #ffffff !important;
}

.high-contrast .stat-card-description {
    color: #ffffff !important;
}

/* Seção Stats específica - Indicadores de Confiança */
.high-contrast .stats-new .stats-header {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .stats-title {
    color: #ffffff !important;
}

.high-contrast .stats-new .stats-subtitle {
    color: #ffffff !important;
}

.high-contrast .stats-new .stats-cards {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .stats-new .stat-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .stats-new .stat-card-icon {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card-icon i {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card-number {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card-label {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card-description {
    color: #ffffff !important;
}

/* Estilos adicionais para garantir cobertura completa */
.high-contrast .stats-new {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .container {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .typing-title {
    color: #ffffff !important;
}

.high-contrast .stats-new h2 {
    color: #ffffff !important;
}

.high-contrast .stats-new p {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card * {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card .fas {
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card .fab {
    color: #ffffff !important;
}

/* Correção específica para cards não visíveis */
.high-contrast .stats-new .stat-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.3) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Forçar fundo preto em todos os elementos dos cards */
.high-contrast .stats-new .stat-card,
.high-contrast .stats-new .stat-card *,
.high-contrast .stats-new .stat-card div,
.high-contrast .stats-new .stat-card span,
.high-contrast .stats-new .stat-card p,
.high-contrast .stats-new .stat-card h1,
.high-contrast .stats-new .stat-card h2,
.high-contrast .stats-new .stat-card h3,
.high-contrast .stats-new .stat-card h4,
.high-contrast .stats-new .stat-card h5,
.high-contrast .stats-new .stat-card h6 {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .stat-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.5) !important;
}

/* Forçar visibilidade de todos os elementos dos cards */
.high-contrast .stats-new .stat-card > * {
    color: #ffffff !important;
    background-color: #000000 !important;
}

.high-contrast .stats-new .stat-card .stat-card-icon {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .stats-new .stat-card .stat-card-icon i {
    color: #ffffff !important;
    font-size: 2rem !important;
}

.high-contrast .stats-new .stat-card .stat-card-number {
    color: #ffffff !important;
    font-size: 2.5rem !important;
    font-weight: bold !important;
}

.high-contrast .stats-new .stat-card .stat-card-label {
    color: #ffffff !important;
    font-size: 1.2rem !important;
    font-weight: bold !important;
}

.high-contrast .stats-new .stat-card .stat-card-description {
    color: #ffffff !important;
    font-size: 0.9rem !important;
}

/* Garantir que a seção inteira seja visível */
.high-contrast .stats-new {
    background-color: #000000 !important;
    color: #ffffff !important;
    padding: 2rem 0 !important;
    margin: 0 !important;
}

.high-contrast .stats-new .container {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .stats-new .stats-cards {
    background-color: #000000 !important;
    color: #ffffff !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 1.5rem !important;
}

/* Estilos de emergência para garantir visibilidade */
.high-contrast .stats-new .stat-card,
.high-contrast .stats-new .stat-card *,
.high-contrast .stats-new .stat-card div,
.high-contrast .stats-new .stat-card span,
.high-contrast .stats-new .stat-card p,
.high-contrast .stats-new .stat-card h1,
.high-contrast .stats-new .stat-card h2,
.high-contrast .stats-new .stat-card h3,
.high-contrast .stats-new .stat-card h4,
.high-contrast .stats-new .stat-card h5,
.high-contrast .stats-new .stat-card h6 {
    color: #ffffff !important;
    background-color: #000000 !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Forçar visibilidade específica para cada card */
.high-contrast .stats-new .stat-card:nth-child(1),
.high-contrast .stats-new .stat-card:nth-child(2),
.high-contrast .stats-new .stat-card:nth-child(3),
.high-contrast .stats-new .stat-card:nth-child(4) {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    min-height: 200px !important;
    padding: 1rem !important;
    margin: 0.5rem !important;
}

/* Garantir que todos os elementos filhos tenham fundo preto */
.high-contrast .stats-new .stat-card .stat-card-icon,
.high-contrast .stats-new .stat-card .stat-card-number,
.high-contrast .stats-new .stat-card .stat-card-label,
.high-contrast .stats-new .stat-card .stat-card-description {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Forçar fundo preto em todos os elementos internos */
.high-contrast .stats-new .stat-card * {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Seção Tradition Certifications */
.high-contrast .tradition-certifications {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-content {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-text {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-title {
    color: #ffffff !important;
}

.high-contrast .tradition-paragraph {
    color: #ffffff !important;
}

.high-contrast .tradition-features {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-feature {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .tradition-feature:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-feature-icon {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .tradition-feature-icon i {
    color: #ffffff !important;
}

.high-contrast .tradition-feature-title {
    color: #ffffff !important;
}

.high-contrast .tradition-feature-text {
    color: #ffffff !important;
}

/* Seção Products Highlight */
.high-contrast .products-highlight {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .products-grid {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .product-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .product-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.high-contrast .product-card-content {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .product-category {
    color: #ffffff !important;
}

.high-contrast .product-title {
    color: #ffffff !important;
}

.high-contrast .product-description {
    color: #ffffff !important;
}

.high-contrast .product-features {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .product-feature {
    color: #ffffff !important;
}

.high-contrast .product-feature i {
    color: #ffffff !important;
}

.high-contrast .product-badge {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #ffffff !important;
}

/* Seção Contact CTA */
.high-contrast .contact-cta {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .contact-cta-header {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .contact-cta-title {
    color: #ffffff !important;
}

.high-contrast .contact-cta-subtitle {
    color: #ffffff !important;
}

.high-contrast .contact-cta-cards {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .contact-cta-card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast .contact-cta-card:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.high-contrast .contact-cta-card-title {
    color: #ffffff !important;
}

.high-contrast .contact-cta-card-description {
    color: #ffffff !important;
}

/* Container e conteúdo geral */
.high-contrast .container {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.high-contrast .content {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Títulos e textos */
.high-contrast h1,
.high-contrast h2,
.high-contrast h3,
.high-contrast h4,
.high-contrast h5,
.high-contrast h6 {
    color: #ffffff !important;
}

.high-contrast p {
    color: #ffffff !important;
}

.high-contrast a {
    color: #ffffff !important;
}

.high-contrast a:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
    background-color: #333333 !important;
}

/* Formulários */
.high-contrast input,
.high-contrast textarea,
.high-contrast select {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

.high-contrast input:focus,
.high-contrast textarea:focus,
.high-contrast select:focus {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    outline: none !important;
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}

body {
    font-family: var(--font-family);
    font-size: var(--font-size-base);
    line-height: 1.6;
    color: var(--gray-800);
    background-color: var(--white);
    transition: background-color var(--transition-normal), color var(--transition-normal);
    padding-top: 120px; /* Espaçamento para compensar o header fixo */
}

/* ===== CONTAINER E LAYOUT ===== */

.content{width: 95%;}

/* Container específico para carousel */
.carousel.container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Garantir que o carousel ocupe toda a largura da tela */
.carousel .content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ===== CAROUSEL ===== */
.carousel {
    overflow: hidden;
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0;
    padding: 0;
}

.carousel .content {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

.carousel .owl-carousel {
    width: 100%;
    margin: 0;
    padding: 0;
}

.carousel .owl-carousel .owl-stage {
    width: 100%;
}

.carousel .owl-carousel .owl-item {
    width: 100%;
}

.carousel .owl-carousel .owl-item img {
    width: 100%;
    height: auto;
    display: block;
}

.carousel .owl-carousel .owl-item picture {
    width: 100%;
    display: block;
}

.carousel .owl-carousel .owl-item picture img {
    width: 100%;
    height: auto;
    display: block;
}

/* Garantir que o carousel seja exibido */
.carousel .owl-carousel.owl-loaded {
    display: block !important;
}

.carousel .owl-carousel.owl-loading {
    display: block !important;
    opacity: 0;
}

/* Garantir que o carousel não seja sobreposto pelo header */
.carousel {
    position: relative;
    z-index: 1;
    margin-top: 0;
    padding-top: 0;
    clear: both;
}

/* Garantir que o carousel fique logo após o header */
.carousel::before {
    content: '';
    display: block;
    height: 0;
    margin: 0;
    padding: 0;
}


.carousel:hover .owl-theme .owl-nav .owl-prev {
    left: 0;
}

.carousel:hover .owl-theme .owl-nav .owl-next {
    right: 0;
}

.carousel .owl-theme .owl-nav {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -30px;
}

.carousel .owl-theme .owl-nav .owl-prev,
.carousel .owl-theme .owl-nav .owl-next {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    position: absolute;
    margin: 0;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 0;
    transition: background-color 0.2s ease-in-out;
}

.carousel .owl-theme .owl-nav .owl-prev {
    left: -60px;
    transition: left 0.2s ease-in-out;
}

.carousel .owl-theme .owl-nav .owl-next {
    right: -60px;
    transition: right 0.2s ease-in-out;
}

.carousel .owl-theme .owl-nav .owl-prev:hover,
.carousel .owl-theme .owl-nav .owl-next:hover {
    background-color: rgba(0, 0, 0, 0.9);
}

.carousel .owl-theme .owl-nav .owl-prev i,
.carousel .owl-theme .owl-nav .owl-next i {
    font-size: 3em;
    color: #ffffff;
}

.carousel .owl-theme .owl-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

.carousel .owl-theme .owl-dots .owl-dot {
    display: inline-block;
    margin: 0 5px;
}

.carousel .owl-theme .owl-dots .owl-dot span {
    display: block;
    width: 12px;
    height: 12px;
    margin: 0;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.carousel .owl-theme .owl-dots .owl-dot.active span,
.carousel .owl-theme .owl-dots .owl-dot:hover span {
    background-color: var(--primary-color);
    transform: scale(1.2);
}

/* ===== EFEITOS DE TRANSIÇÃO DO CAROUSEL ===== */
/* Reset e configurações base para evitar conflitos */
.carousel .owl-carousel {
    display: block !important;
    opacity: 1 !important;
}

.carousel .owl-carousel .owl-stage-outer {
    overflow: hidden;
    position: relative;
}

.carousel .owl-carousel .owl-stage {
    position: relative;
    transition: transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-transition: -webkit-transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -moz-transition: -moz-transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -ms-transition: -ms-transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.carousel .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    transition: all 0.3s ease-in-out;
}

.carousel .owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: auto;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.carousel .owl-carousel .owl-item:hover img {
    transform: scale(1.02);
}

/* ===== ANIMAÇÕES PERSONALIZADAS PARA OWL CAROUSEL ===== */
@keyframes owlFadeIn {
    0% {
        opacity: 0;
        transform: scale(1.05);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes owlFadeOut {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0.95);
    }
}

/* Aplicar animações personalizadas */
.carousel .owl-carousel .owl-item.animated.owl-animated-in {
    animation: owlFadeIn 1.5s ease-in-out;
}

.carousel .owl-carousel .owl-item.animated.owl-animated-out {
    animation: owlFadeOut 1.5s ease-in-out;
}

/* Efeito de fade suave para transições */
.carousel .owl-carousel .owl-item.fadeOut {
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.carousel .owl-carousel .owl-item.fadeIn {
    opacity: 1;
    transition: opacity 1.5s ease-in-out;
}

/* Efeito de loading suave */
.carousel .owl-carousel.owl-loading .owl-item {
    opacity: 0.7;
    transition: opacity 0.5s ease-in-out;
}

/* Garantir que o carousel seja exibido corretamente */
.carousel .owl-carousel.owl-loaded {
    display: block !important;
    opacity: 1 !important;
}

/* Melhorar a performance das transições */
.carousel .owl-carousel .owl-stage-outer {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/* Forçar hardware acceleration */
.carousel .owl-carousel .owl-item img {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform, opacity;
}

/* ===== CORREÇÕES ESPECÍFICAS PARA CONFLITOS ===== */
/* Sobrescrever estilos do owl.theme.default.css */
.carousel .owl-carousel .owl-item {
    opacity: 1 !important;
    visibility: visible !important;
}

.carousel .owl-carousel .owl-item.active {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Garantir que as animações funcionem */
.carousel .owl-carousel .owl-item.animated {
    animation-fill-mode: both;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;
}

/* Efeitos específicos para fade */
.carousel .owl-carousel .owl-item.fadeOut {
    animation: owlFadeOut 1.5s ease-in-out forwards;
}

.carousel .owl-carousel .owl-item.fadeIn {
    animation: owlFadeIn 1.5s ease-in-out forwards;
}

/* Garantir que o carousel seja visível */
.carousel .owl-carousel {
    visibility: visible !important;
    opacity: 1 !important;
}

.carousel .owl-carousel.owl-loaded {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* Melhorar a qualidade das transições */
.carousel .owl-carousel .owl-stage {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
}

/* Owl Carousel Base Styles */
.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 1;
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden;
}

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
}

.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
    display: none;
}

.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next {
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
}

.owl-carousel.owl-loaded {
    display: block;
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block;
}

.owl-carousel.owl-hidden {
    opacity: 0;
}

.owl-carousel.owl-refresh .owl-item {
    visibility: hidden;
}

.owl-carousel.owl-drag .owl-item {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.owl-carousel.owl-grab {
    cursor: move;
    cursor: grab;
}

.owl-carousel.owl-rtl {
    direction: rtl;
}

.owl-carousel.owl-rtl .owl-item {
    float: right;
}

.no-js .owl-carousel {
    display: block;
}

.owl-carousel .owl-video-wrapper {
    position: relative;
    height: 100%;
    background: #000;
}

.owl-carousel .owl-video-play-icon {
    position: absolute;
    height: 80px;
    width: 80px;
    left: 50%;
    top: 50%;
    margin-left: -40px;
    margin-top: -40px;
    background: url("owl.video.play.png") no-repeat;
    cursor: pointer;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    transition: transform 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
    -webkit-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.owl-carousel .owl-video-playing .owl-video-play-icon,
.owl-carousel .owl-video-playing .owl-video-tn {
    display: none;
}

.owl-carousel .owl-video-tn {
    opacity: 0;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: opacity 400ms ease;
}

.owl-carousel .owl-video-frame {
    position: relative;
    z-index: 1;
    height: 100%;
    width: 100%;
}

/* Clear fix */
.clear {
    clear: both;
}

/* Grid de produtos */
.produtos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-2xl);
}

@media (max-width: 768px) {
    .produtos-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: var(--spacing-xl);
    }
}

@media (max-width: 480px) {
    .produtos-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

.container-fluid {
    width: 100%;
    padding: 0 var(--spacing-md);
}

/* ===== TIPOGRAFIA ===== */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: var(--spacing-md);
    color: var(--gray-900);
}

h1 { font-size: var(--font-size-4xl); }
h2 { 
    font-size: 3rem; 
    color: var(--primary-color);
}
h3 { font-size: var(--font-size-2xl); }
h4 { font-size: var(--font-size-xl); }
h5 { font-size: var(--font-size-lg); }
h6 { font-size: var(--font-size-base); }

p {
    margin-bottom: var(--spacing-md);
    color: var(--gray-600);
}

a {
    color: var(--primary-color);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--primary-dark);
}

/* ===== BOTÕES ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--spacing-sm) var(--spacing-lg);
    border: none;
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-fast);
    gap: var(--spacing-sm);
}

.btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
}

.btn-primary:hover {
    background-color: var(--primary-dark);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-secondary {
    background-color: var(--secondary-color);
    color: var(--white);
}

.btn-secondary:hover {
    background-color: var(--secondary-dark);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-outline {
    background-color: transparent;
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
}

.btn-outline:hover {
    background-color: var(--primary-color);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-lg {
    padding: var(--spacing-md) var(--spacing-xl);
    font-size: var(--font-size-lg);
}

.btn-sm {
    padding: var(--spacing-xs) var(--spacing-md);
    font-size: var(--font-size-sm);
}

/* ===== HEADER ===== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: var(--white);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
}

.header.scrolled {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
}

/* ===== NOVO HEADER FORMAT ===== */
.top-bar {
    background-color: var(--gray-100);
    padding: var(--spacing-sm) 0;
    font-size: var(--font-size-sm);
    border-top: 3px solid var(--primary-color);
    margin: 0;
    width: 100%;
    max-width: 100%;
}

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

/* O header agora usa o container padrão como o footer */

.contact-info {
    display: flex;
    gap: var(--spacing-lg);
}

.contact-item {
    color: var(--gray-600);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    transition: color var(--transition-fast);
}

.contact-item:hover {
    color: var(--gray-800);
}

.top-bar-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.social-links {
    display: flex;
    gap: var(--spacing-sm);
}

.social-links a {
    color: var(--gray-600);
    text-decoration: none;
    padding: var(--spacing-xs);
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast);
}

.social-links a:hover {
    color: var(--gray-800);
    background-color: var(--gray-200);
}

.contrast-toggle {
    background: none;
    border: none;
    color: var(--gray-600);
    cursor: pointer;
    padding: var(--spacing-xs);
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast);
}

.contrast-toggle:hover {
    color: var(--gray-800);
    background-color: var(--gray-200);
}

.language-selector select {
    background: none;
    border: none;
    color: var(--gray-600);
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.language-selector select:focus {
    outline: none;
    color: var(--gray-800);
}

.main-nav {
    background-color: var(--white);
    padding: var(--spacing-md) 0;
    border-bottom: 1px solid var(--gray-200);
}

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

.logo-img {
    height: 70px;
    width: auto;
}

.nav-menu {
    display: flex;
    align-items: center;
}

.nav-list {
    display: flex;
    list-style: none;
    gap: var(--spacing-2xl); /* Aumenta o espaçamento entre itens */
    margin: 0;
    padding: 0;
    margin-left: var(--spacing-xl); /* Adiciona margem esquerda maior */
}

.nav-item {
    position: relative;
}

.nav-link {
    color: var(--gray-700);
    font-weight: 500;
    padding: var(--spacing-sm) var(--spacing-xl); /* Aumenta padding horizontal */
    border-radius: var(--border-radius-md);
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.nav-link:hover {
    color: var(--primary-color);
    background-color: var(--gray-100);
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: var(--white);
    box-shadow: var(--shadow-lg);
    border-radius: var(--border-radius-md);
    min-width: 250px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all var(--transition-normal);
    list-style: none;
    padding: var(--spacing-md) 0;
    z-index: 1001;
}

.nav-item:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-menu li {
    position: relative;
}

.dropdown-menu a {
    display: block;
    padding: var(--spacing-sm) var(--spacing-xl); /* Aumenta padding horizontal */
    color: var(--gray-700);
    transition: all var(--transition-fast);
    margin-left: var(--spacing-md); /* Adiciona margem esquerda */
}

.dropdown-menu a:hover {
    background-color: var(--gray-50);
    color: var(--primary-color);
}

.sub-dropdown {
    position: absolute;
    left: 100%;
    top: 0;
    background-color: var(--white);
    box-shadow: var(--shadow-lg);
    border-radius: var(--border-radius-md);
    min-width: 250px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-10px);
    transition: all var(--transition-normal);
    list-style: none;
    padding: var(--spacing-md) 0;
}

.dropdown-item-with-sub:hover .sub-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.header-actions-mobile {
    display: none;
}

.mobile-menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--spacing-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mobile-menu-toggle span {
    width: 25px;
    height: 3px;
    background-color: var(--gray-700);
    transition: all var(--transition-fast);
}

/* ===== MOBILE MENU ===== */
.mobile-menu {
    position: fixed;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100vh;
    background-color: var(--white);
    z-index: 2000;
    transition: left var(--transition-normal);
    overflow-y: auto;
}

.mobile-menu.active {
    left: 0;
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-lg);
    border-bottom: 1px solid var(--gray-200);
}

.mobile-menu-close {
    background: none;
    border: none;
    font-size: var(--font-size-xl);
    cursor: pointer;
    color: var(--gray-700);
}

.mobile-nav-menu {
    list-style: none;
    padding: 0;
}

.mobile-nav-item {
    border-bottom: 1px solid var(--gray-200);
}

.mobile-nav-link {
    display: block;
    padding: var(--spacing-lg) var(--spacing-xl); /* Aumenta padding horizontal */
    color: var(--gray-700);
    font-weight: 500;
    transition: background-color var(--transition-fast);
}

.mobile-nav-link:hover {
    background-color: var(--gray-50);
    color: var(--primary-color);
}

.mobile-submenu {
    list-style: none;
    background-color: var(--gray-50);
    padding-left: var(--spacing-xl); /* Aumenta padding esquerdo */
}

.mobile-submenu a {
    display: block;
    padding: var(--spacing-md) var(--spacing-xl); /* Aumenta padding horizontal */
    color: var(--gray-600);
    border-bottom: 1px solid var(--gray-200);
    margin-left: var(--spacing-md); /* Adiciona margem esquerda */
}

.mobile-submenu a:hover {
    color: var(--primary-color);
    background-color: var(--white);
}

/* ===== HERO SECTION (REMOVIDO) ===== */

/* Responsividade para carousel */
@media (max-width: 768px) {
    body {
        padding-top: 110px; /* Margem menor para mobile */
    }
    
    .carousel .owl-theme .owl-dots {
        bottom: 15px;
    }
    
    .carousel .owl-theme .owl-dots .owl-dot span {
        width: 10px;
        height: 10px;
    }
}

@media (max-width: 480px) {
    body {
        padding-top: 100px; /* Margem ainda menor para telas muito pequenas */
    }
    
    .carousel .owl-theme .owl-dots {
        bottom: 10px;
    }
    
    .carousel .owl-theme .owl-dots .owl-dot {
        margin: 0 3px;
    }
    
    .carousel .owl-theme .owl-dots .owl-dot span {
        width: 8px;
        height: 8px;
    }
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.hero-slide-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    margin: 0;
    padding: 0;
    z-index: 0;
    animation: heroImageZoom 8s ease-in-out infinite;
}

/* Animação de zoom sutil para as imagens dos slides */
@keyframes heroImageZoom {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

/* Pausa a animação quando o slide não está ativo */
.hero-slide:not(.active) .hero-slide-image {
    animation-play-state: paused;
}

/* Imagens responsivas do slider */
.hero-slide-desktop {
    display: block;
}

.hero-slide-tablet {
    display: none;
}

.hero-slide-mobile {
    display: none;
}

/* Otimização para imagens 1920x600 (proporção 16:5) */
.hero-slide-image {
    /* Aumenta o tamanho da imagem de forma moderada */
    width: 100%;
    height: 105%; /* Aumenta a altura em apenas 5% */
    /* Garante que a imagem seja exibida completamente */
    object-fit: contain;
    object-position: center; /* Centraliza a imagem para evitar cortes */
    /* Centraliza horizontalmente e ajusta posição */
    left: 50%;
    top: 25px; /* Sobe um pouco para melhor posicionamento */
    transform: translateX(-50%) scale(1.02); /* Centraliza e adiciona zoom bem sutil de 2% */
}

/* Tablet */
@media (max-width: 1024px) {
    .hero-slide-desktop {
        display: none;
    }
    
    .hero-slide-tablet {
        display: block;
    }
    
    .hero-slide-mobile {
        display: none;
    }
    
    /* Ajuste para tablet - aumenta moderadamente */
    .hero-slide-image {
        width: 100%;
        height: 103%; /* Aumenta a altura em apenas 3% */
        object-fit: contain;
        object-position: center; /* Centraliza para evitar cortes */
        top: 20px; /* Sobe um pouco para melhor posicionamento */
        transform: translateX(-50%) scale(1.01); /* Centraliza e adiciona zoom bem sutil de 1% */
    }
}

/* Mobile */
@media (max-width: 768px) {
    .hero-slide-desktop {
        display: none;
    }
    
    .hero-slide-tablet {
        display: none;
    }
    
    .hero-slide-mobile {
        display: block;
    }
    
    /* Ajuste para mobile - aumenta moderadamente */
    .hero-slide-image {
        width: 100%;
        height: 102%; /* Aumenta a altura em apenas 2% */
        object-fit: contain;
        object-position: center; /* Centraliza para evitar cortes */
        top: 15px; /* Sobe um pouco para melhor posicionamento */
        transform: translateX(-50%) scale(1.005); /* Centraliza e adiciona zoom bem sutil de 0.5% */
    }
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent; /* Removido gradiente escuro */
    z-index: 1;
    opacity: 0; /* Overlay completamente transparente */
    transition: opacity var(--transition-normal) ease-in-out;
    display: none; /* Oculta completamente o overlay */
}

/* Overlay removido - imagem exibida sem camada escura */
.hero-slide.fade-in .hero-overlay {
    display: none; /* Overlay sempre oculto */
}

.hero-slide.fade-out .hero-overlay {
    display: none; /* Overlay sempre oculto */
}

/* Garante que o overlay permaneça oculto */
.hero-slide.active .hero-overlay {
    display: none;
}

@keyframes overlayFadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes overlayFadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    padding: 0 var(--spacing-lg);
    animation: contentSlideIn 0.8s ease-out 0.3s both;
}

@keyframes contentSlideIn {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-text {
    color: var(--white);
}

.hero-title {
    margin-bottom: var(--spacing-xl);
}

.hero-title-main {
    display: block;
    font-size: clamp(3rem, 6vw, var(--font-size-5xl));
    font-weight: 700;
    margin-bottom: var(--spacing-md);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
    line-height: 1.2;
    color: var(--white);
    animation: titleSlideIn 0.8s ease-out 0.4s both;
}

@keyframes titleSlideIn {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-title-sub {
    display: block;
    font-size: clamp(1.25rem, 2.5vw, var(--font-size-2xl));
    font-weight: 400;
    opacity: 0.95;
    color: var(--white);
    margin-bottom: var(--spacing-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    animation: subtitleSlideIn 0.8s ease-out 0.5s both;
}

@keyframes subtitleSlideIn {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 0.95;
        transform: translateY(0);
    }
}

.hero-description {
    font-size: clamp(1rem, 1.5vw, var(--font-size-lg));
    line-height: 1.7;
    margin-bottom: var(--spacing-2xl);
    opacity: 0.95;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    color: var(--white);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    animation: descriptionSlideIn 0.8s ease-out 0.6s both;
}

@keyframes descriptionSlideIn {
    0% {
        opacity: 0;
        transform: translateY(25px);
    }
    100% {
        opacity: 0.95;
        transform: translateY(0);
    }
}



.hero-buttons {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    justify-content: center;
}

.hero-buttons .btn {
    min-width: 200px;
    padding: var(--spacing-md) var(--spacing-xl);
    font-size: var(--font-size-base);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: var(--border-radius-lg);
    transition: all var(--transition-normal) cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: var(--shadow-lg);
    transform: translateY(0);
    animation: buttonSlideIn 0.6s ease-out 0.5s both;
}

@keyframes buttonSlideIn {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-buttons .btn:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-xl);
    transition: all var(--transition-normal) cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-buttons .btn:active {
    transform: translateY(-1px);
    transition: transform 0.1s ease-out;
}

.hero-buttons .btn-primary {
    background: var(--primary-color);
    border: 2px solid var(--primary-color);
    color: var(--white);
}

.hero-buttons .btn-primary:hover {
    background: var(--primary-dark);
    border-color: var(--primary-dark);
}





.hero-scroll-indicator {
    position: absolute;
    bottom: var(--spacing-2xl);
    left: 50%;
    transform: translateX(-50%);
    color: var(--white);
    text-align: center;
    z-index: 2;
    animation: bounce 2s infinite;
    opacity: 0;
    animation: scrollIndicatorFadeIn 1s ease-out 1s both, bounce 2s infinite 2s;
}

@keyframes scrollIndicatorFadeIn {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.hero-scroll-indicator span {
    display: block;
    font-size: var(--font-size-sm);
    margin-bottom: var(--spacing-xs);
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.hero-scroll-indicator i {
    font-size: var(--font-size-lg);
    color: var(--primary-light);
}

/* Hero Slider Styles */
.hero-slider {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Previne overflow durante transições */
}

.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.02);
    transition: opacity var(--transition-slow) ease-in-out;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-slide.active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    z-index: 2;
}

/* Efeito de fade in/out simplificado */
.hero-slide.fade-in {
    animation: slideFadeIn var(--transition-slow) ease-in-out forwards;
}

.hero-slide.fade-out {
    animation: slideFadeOut var(--transition-slow) ease-in-out forwards;
}

/* Classe para controle de transição */
.hero-slide.transitioning {
    pointer-events: none;
}

/* Animações simplificadas */
@keyframes slideFadeIn {
    0% {
        opacity: 0;
        transform: scale(1.02);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes slideFadeOut {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0.98);
    }
}

/* Efeito de overlay durante transições */
.hero-slide.fade-in .hero-overlay {
    opacity: 1; /* Mantém sempre visível */
    transition: opacity var(--transition-slow) ease-in-out;
}

.hero-slide.fade-out .hero-overlay {
    opacity: 1; /* Mantém sempre visível */
    transition: opacity var(--transition-slow) ease-in-out;
}



/* Hero Slider Controls */
.hero-slider-controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 10;
    pointer-events: none;
}

.hero-slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, 0.15);
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    color: var(--white);
    font-size: var(--font-size-xl);
    cursor: pointer;
    transition: all var(--transition-normal) cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.8;
}

.hero-slider-btn:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
    opacity: 1;
}

.hero-slider-btn:active {
    transform: translateY(-50%) scale(0.95);
    transition: transform 0.1s ease-out;
}

.hero-slider-prev {
    left: var(--spacing-2xl);
}

.hero-slider-next {
    right: var(--spacing-2xl);
}

/* Hero Slider Indicators */
.hero-slider-indicators {
    position: absolute;
    bottom: var(--spacing-3xl);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: var(--spacing-md);
    z-index: 10;
}

.hero-slider-indicator {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    border: 2px solid rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all var(--transition-normal) cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    transform: scale(1);
}

.hero-slider-indicator:hover {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(255, 255, 255, 0.7);
    transform: scale(1.2);
}

.hero-slider-indicator.active {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(0, 166, 81, 0.5);
    animation: indicatorPulse 2s ease-in-out infinite;
    z-index: 2;
}

@keyframes indicatorPulse {
    0%, 100% {
        box-shadow: 0 0 20px rgba(0, 166, 81, 0.5);
    }
    50% {
        box-shadow: 0 0 30px rgba(0, 166, 81, 0.8);
    }
}

@keyframes indicatorActivate {
    0% {
        transform: scale(0.8);
        opacity: 0.5;
    }
    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }
    100% {
        transform: scale(1.1);
        opacity: 1;
    }
}

.hero-slider-indicator::before {
    content: '';
    position: absolute;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    opacity: 0;
    transition: opacity var(--transition-normal);
}

.hero-slider-indicator:hover::before {
    opacity: 1;
}



@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); }
    40% { transform: translateX(-50%) translateY(-10px); }
    60% { transform: translateX(-50%) translateY(-5px); }
}

/* Estilos removidos - duplicados e não utilizados */

/* ===== SECTIONS ===== */
.section-title {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
    position: relative;
    font-size: 3rem;
    color: var(--primary-color);
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    border-radius: 2px;
}

/* ===== VIDEO SECTION ===== */
.video-section {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.background-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: 1;
    object-fit: cover;
}

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

/* Responsividade para seção de vídeo */
@media (max-width: 1024px) {
    .video-section {
        height: 80vh;
        min-height: 500px;
    }
}

@media (max-width: 768px) {
    .video-section {
        height: 70vh;
        min-height: 400px;
    }
}

@media (max-width: 480px) {
    .video-section {
        height: 60vh;
        min-height: 350px;
    }
}

/* ===== SOLUTIONS SECTION ===== */
.solutions {
    padding: var(--spacing-2xl) 0;
    background-color: var(--gray-100);
}

/* Grid de imagens para soluções */
.solutions-image-grid {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-xl);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    overflow-x: hidden;
    padding: 0 var(--spacing-2xl);
}

/* Container dos banners */
.banners {
    width: 100%;
    display: flex;
    flex-wrap: nowrap !important;
    gap: var(--spacing-lg);
    justify-content: center;
    padding: var(--spacing-lg) 0;
    overflow-x: hidden;
    align-items: stretch;
}

/* Correção específica para hospedagem - garantir distribuição uniforme */
.banners .solution-image-card.bnr.banners_item {
    flex: 0 0 30%;
    max-width: 30%;
    min-width: 200px;
    margin: 0;
    display: flex;
    flex-direction: column;
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.banners .solution-image-card.bnr.banners_item:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.12);
}

.banners > div {
    display: flex;
    flex-wrap: nowrap !important;
    gap: var(--spacing-md);
    width: 100%;
    align-items: stretch;
    justify-content: space-between;
}

/* Correção específica para hospedagem - garantir que o container funcione corretamente */
.banners.container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
}

/* Forçar que as imagens sejam exibidas corretamente */
.banners .solution-image-card .solution-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.banners .clear {
    display: none !important;
}

/* Estilos específicos para banners com classes box */
.banners .solution-image-card {
    flex: 0 0 auto;
    margin: 0;
    
    min-width: 280px;
    max-width: 450px;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

/* Correção específica para hospedagem - garantir que as imagens não sejam cortadas */
.banners .solution-image-card .solution-image-container {
    position: relative;
    width: 100%;
    height: 286px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0;
    background-color: var(--gray-50);
    flex: 1;
    padding: var(--spacing-xs);
}

.banners .solution-image-card .solution-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform var(--transition-normal);
    display: block;
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xs);
}

/* Tamanhos dos banners baseados nas classes box - UMA LINHA APENAS */
.banners .box1 {
    flex: 0 0 100%;
    max-width: 100%;
    
    min-width: 100%;
    margin: 0;
}

.banners .box2 {
    flex: 0 0 30%;
    max-width: 30%;
    min-width: 180px;
    /* min-height: 400px; */
    margin: 0;
}

.banners .box3 {
    flex: 0 0 30%;
    max-width: 30%;
    min-width: 180px;
    /* min-height: 400px; */
    margin: 0;
}

.banners .box4 {
    flex: 0 0 30%;
    max-width: 30%;
    min-width: 180px;
    /* min-height: 400px; */
    margin: 0;
}

.banners .box5 {
    flex: 0 0 16%;
    max-width: 16%;
    min-width: 180px;
    /* min-height: 400px; */
    margin: 0;
}

/* Card de imagem de solução */
.solution-image-card {
    background: transparent;
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
    position: relative;
}

.solution-image-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
}

/* Container da imagem */
.solution-image-container {
    position: relative;
    width: 100%;
    height: 286px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-radius-xl);
    background-color: var(--gray-50);
    padding: var(--spacing-xs);
}

/* Imagem da solução */
.solution-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform var(--transition-normal);
    display: block;
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xs);
}

.solution-image-card:hover .solution-image {
    transform: scale(1.02);
}

/* Overlay com conteúdo */
.solution-image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity var(--transition-normal);
    border-radius: 0;
}

.solution-image-card:hover .solution-image-overlay {
    opacity: 1;
}

/* Conteúdo do overlay */
.solution-image-content {
    text-align: center;
    color: var(--white);
    padding: var(--spacing-lg);
}

/* Título da solução */
.solution-image-title {
    font-size: var(--font-size-xl);
    font-weight: 700;
    margin-bottom: var(--spacing-md);
    color: var(--white);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Container do preço */
.solution-image-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: var(--spacing-lg);
}

/* Label do preço */
.price-label {
    font-size: var(--font-size-sm);
    color: var(--white);
    opacity: 0.9;
    margin-bottom: var(--spacing-xs);
}

/* Valor do preço */
.price-value {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--primary-color);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    margin-bottom: var(--spacing-xs);
}

/* Método de pagamento */
.price-method {
    font-size: var(--font-size-sm);
    color: var(--white);
    opacity: 0.9;
}

/* Botão de compra */
.solution-image-btn {
    background: var(--primary-color);
    color: var(--white);
    border: none;
    padding: var(--spacing-md) var(--spacing-xl);
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-base);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--transition-normal);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.solution-image-btn:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* Responsividade para soluções com imagens */
@media (max-width: 1024px) {
    .solutions-image-grid {
        gap: var(--spacing-lg);
        padding: 0 var(--spacing-lg);
    }
    
    .banners {
        gap: var(--spacing-lg);
    }
    
    /* Correção específica para hospedagem em tablets */
    .banners .solution-image-card.bnr.banners_item {
        flex: 0 0 30%;
        min-width: 180px;
        border-radius: var(--border-radius-lg);
    }
    
    .banners .solution-image-card .solution-image-container {
        height: 250px;
        padding: var(--spacing-xs);
    }
    
    .banners .solution-image-card {
        min-width: 260px;
        min-height: 350px;
        margin: 0;
        flex-shrink: 0;
    }
    
    .banners .box1 {
        flex: 0 0 100%;
        margin: 0;
        min-height: 350px;
    }
    
    .banners .box2 {
        flex: 0 0 30%;
        min-width: 200px;
        min-height: 350px;
    }
    
    .banners .box3 {
        flex: 0 0 30%;
        min-width: 200px;
        min-height: 350px;
    }
    
    .banners .box4 {
        flex: 0 0 30%;
        min-width: 200px;
        min-height: 350px;
    }
    
    .banners .box5 {
        flex: 0 0 16%;
        min-width: 150px;
        min-height: 350px;
    }
    
    .solution-image-container {
        height: 250px;
        border-radius: var(--border-radius-xl);
    }
}

@media (max-width: 768px) {
    .solutions-image-grid {
        gap: var(--spacing-md);
        margin-top: var(--spacing-lg);
        padding: 0 var(--spacing-md);
    }
    
    .banners {
        gap: var(--spacing-md);
        padding: var(--spacing-md) 0;
    }
    
    /* Correção específica para hospedagem em mobile */
    .banners .solution-image-card.bnr.banners_item {
        flex: 0 0 30%;
        min-width: 160px;
        border-radius: var(--border-radius-md);
    }
    
    .banners .solution-image-card .solution-image-container {
        height: 200px;
        padding: var(--spacing-xs);
    }
    
    .banners .solution-image-card {
        min-width: 220px;
        min-height: 300px;
        margin: 0;
        flex-shrink: 0;
    }
    
    .banners .box1 {
        flex: 0 0 100%;
        min-height: 300px;
        min-width: 100%;
        margin: 0;
    }
    
    .banners .box2 {
        flex: 0 0 30%;
        min-width: 160px;
        min-height: 300px;
    }
    
    .banners .box3 {
        flex: 0 0 30%;
        min-width: 160px;
        min-height: 300px;
    }
    
    .banners .box4 {
        flex: 0 0 30%;
        min-width: 160px;
        min-height: 300px;
    }
    
    .banners .box5 {
        flex: 0 0 16%;
        min-width: 140px;
        min-height: 300px;
    }
    
    .solution-image-container {
        height: 200px;
        border-radius: var(--border-radius-xl);
    }
    
    .solution-image-title {
        font-size: var(--font-size-lg);
    }
    
    .price-value {
        font-size: var(--font-size-2xl);
    }
    
    .solution-image-btn {
        padding: var(--spacing-sm) var(--spacing-lg);
        font-size: var(--font-size-sm);
    }
}

@media (max-width: 480px) {
    .solutions-image-grid {
        gap: var(--spacing-sm);
        margin-top: var(--spacing-md);
        padding: 0 var(--spacing-sm);
    }
    
    .banners {
        gap: var(--spacing-sm);
        padding: var(--spacing-sm) 0;
    }
    
    /* Correção específica para hospedagem em telas pequenas */
    .banners .solution-image-card.bnr.banners_item {
        flex: 0 0 30%;
        min-width: 130px;
        border-radius: var(--border-radius-sm);
    }
    
    .banners .solution-image-card .solution-image-container {
        height: 150px;
        padding: var(--spacing-xs);
    }
    
    .banners .solution-image-card {
        min-width: 180px;
        min-height: 220px;
        margin: 0;
        flex-shrink: 0;
    }
    
    .banners .box1 {
        flex: 0 0 100%;
        min-height: 220px;
        min-width: 100%;
        margin: 0;
    }
    
    .banners .box2 {
        flex: 0 0 30%;
        min-width: 130px;
        min-height: 220px;
    }
    
    .banners .box3 {
        flex: 0 0 30%;
        min-width: 130px;
        min-height: 220px;
    }
    
    .banners .box4 {
        flex: 0 0 30%;
        min-width: 130px;
        min-height: 220px;
    }
    
    .banners .box5 {
        flex: 0 0 16%;
        min-width: 130px;
        min-height: 220px;
    }
    
    .solution-image-container {
        height: 150px;
        border-radius: var(--border-radius-xl);
    }
    
    .solution-image {
        max-height: none;
    }
    
    .banners .box2 {
        min-width: 100px;
    }
    
    .banners .box3 {
        min-width: 100px;
    }
    
    .banners .box4 {
        min-width: 100px;
    }
    
    .banners .box5 {
        min-width: 120px;
    }
    
    .solution-image-container {
        height: 200px;
        border-radius: var(--border-radius-xl);
    }
    
    .solution-image-title {
        font-size: var(--font-size-base);
    }
    
    .price-value {
        font-size: var(--font-size-xl);
    }
    
    .solution-image-btn {
        padding: var(--spacing-xs) var(--spacing-md);
        font-size: var(--font-size-xs);
    }
}

.section-header {
    text-align: center;
    margin-bottom: var(--spacing-2xl);
}

.section-title {
    font-size: 3rem;
    margin-bottom: var(--spacing-md);
    color: var(--primary-color);
}

.section-subtitle {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.solutions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-xl);
}

.solution-card {
    background-color: var(--white);
    border-radius: var(--border-radius-xl);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    overflow: hidden;
    position: relative;
}

.solution-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
}

.solution-card-header {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    padding: var(--spacing-xl);
    text-align: center;
    position: relative;
}

.solution-icon {
    width: 80px;
    height: 80px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-md);
    color: var(--white);
    font-size: var(--font-size-2xl);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.3);
}

.solution-badge {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    background: var(--white);
    color: var(--primary-color);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.solution-card-content {
    padding: var(--spacing-xl);
}

.solution-title {
    font-size: var(--font-size-xl);
    margin-bottom: var(--spacing-md);
    color: var(--gray-900);
    text-align: center;
}

.solution-description {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
    text-align: center;
}

.solution-features {
    list-style: none;
    margin-bottom: var(--spacing-lg);
    padding: 0;
}

.solution-features li {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    color: var(--gray-700);
    margin-bottom: var(--spacing-sm);
    font-size: var(--font-size-sm);
}

.solution-features i {
    color: var(--success);
    font-size: var(--font-size-base);
}

.solution-link {
    color: var(--primary-color);
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    transition: all var(--transition-fast);
    text-decoration: none;
}

.solution-link:hover {
    color: var(--primary-dark);
    gap: var(--spacing-sm);
}

/* ===== STATS SECTION ===== */
.stats {
    padding: var(--spacing-3xl) 0;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-2xl);
    text-align: center;
}

.stat-item {
    padding: var(--spacing-lg);
    position: relative;
    transition: all var(--transition-normal);
}

.stat-item:hover {
    transform: translateY(-5px);
}

.stat-icon {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-lg);
    font-size: var(--font-size-2xl);
    color: var(--white);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    transition: all var(--transition-normal);
}

.stat-item:hover .stat-icon {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.4);
    transform: scale(1.1);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

.stat-number {
    font-size: var(--font-size-4xl);
    font-weight: 700;
    margin-bottom: var(--spacing-sm);
    color: var(--white);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.stat-label {
    font-size: var(--font-size-lg);
    color: var(--gray-100);
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Estatísticas do Catálogo */
.download-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    margin: var(--spacing-xl) 0;
}

.download-stats .stat-item {
    text-align: center;
    padding: var(--spacing-md);
    background: rgba(255, 255, 255, 0.05);
    border-radius: var(--border-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all var(--transition-normal);
}

.download-stats .stat-item:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.download-stats .stat-icon {
    width: 60px;
    height: 60px;
    background: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-md);
    font-size: var(--font-size-xl);
    color: var(--white);
}

/* ===== NOVA SEÇÃO DE ESTATÍSTICAS - NÚMEROS QUE FALAM POR SI ===== */
.stats-new {
    padding: var(--spacing-3xl) 0;
    background: #f8faf8;
    position: relative;
    color: var(--gray-800);
}

.stats-header {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
    position: relative;
    z-index: 1;
}

.stats-title {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-lg);
    line-height: 1.2;
}

.stats-subtitle {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

.stats-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-2xl);
    position: relative;
    z-index: 1;
}

.stat-card {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-2xl);
    text-align: center;
    box-shadow: 0 8px 32px rgba(0, 166, 81, 0.2);
    transition: all var(--transition-normal);
    border: 2px solid rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
    color: var(--white);
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-light) 100%);
}

.stat-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(0, 166, 81, 0.3);
    border-color: var(--white);
    background: linear-gradient(135deg, var(--primary-light) 0%, var(--primary-color) 100%);
}

.stat-card-icon {
    width: 80px;
    height: 80px;
    background: var(--white);
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: var(--border-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xl);
    font-size: var(--font-size-2xl);
    color: var(--primary-color);
    transition: all var(--transition-normal);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.stat-card:hover .stat-card-icon {
    background: var(--white);
    transform: scale(1.05);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    border-color: var(--white);
    color: var(--primary-dark);
}

.stat-card-number {
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--white);
    margin-bottom: var(--spacing-md);
    line-height: 1.1;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.stat-card-label {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--white);
    margin-bottom: var(--spacing-sm);
    line-height: 1.3;
}

.stat-card-description {
    font-size: var(--font-size-base);
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.5;
}

.download-stats .stat-item:hover .stat-icon {
    background: var(--primary-dark);
    transform: scale(1.1);
}

/* Responsividade para stats-new */
@media (max-width: 768px) {
    .stats-new {
        padding: var(--spacing-2xl) 0;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: var(--font-size-base);
        padding: 0 var(--spacing-md);
    }
    
    .stats-cards {
        grid-template-columns: 1fr;
        gap: var(--spacing-xl);
        padding: 0 var(--spacing-md);
    }
    
    .stat-card {
        padding: var(--spacing-xl);
    }
    
    .stat-card-icon {
        width: 70px;
        height: 70px;
        font-size: var(--font-size-xl);
    }
    
    .stat-card-number {
        font-size: var(--font-size-3xl);
    }
}

@media (max-width: 480px) {
    .stats-title {
        font-size: 2rem;
    }
    
    .stats-subtitle {
        font-size: var(--font-size-sm);
    }
    
    .stat-card {
        padding: var(--spacing-lg);
    }
    
    .stat-card-icon {
        width: 60px;
        height: 60px;
        font-size: var(--font-size-lg);
    }
    
    .stat-card-number {
        font-size: var(--font-size-2xl);
    }
}

.download-stats .stat-number {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--white);
    display: block;
    margin-bottom: var(--spacing-xs);
}

.download-stats .stat-label {
    font-size: var(--font-size-sm);
    color: var(--gray-200);
    font-weight: 400;
    text-shadow: none;
}

/* ===== PRODUCTS HIGHLIGHT ===== */
.products-highlight {
    padding: var(--spacing-3xl) 0;
    background-color: var(--white);
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-2xl);
}

.product-card {
    background-color: var(--white);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
}

.product-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: var(--primary-color);
}

.product-card-image {
    position: relative;
    height: 280px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--gray-50);
    border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
}

.product-image {
    width: 100%;
    height: 100%;
    max-height: 280px;
    object-fit: fill;
    object-position: center;
    transition: transform var(--transition-normal);
    border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
}

.product-card:hover .product-image {
    transform: scale(1.05);
}

/* Responsividade para cards de produtos */
@media (max-width: 768px) {
    .products-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: var(--spacing-lg);
    }
    
    .product-card-image {
        height: 250px;
        border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
    }
    
    .product-image {
        max-height: 250px;
        border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
    }
}

@media (max-width: 480px) {
    .products-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }
    
    .product-card-image {
        height: 220px;
        border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
    }
    
    .product-image {
        max-height: 220px;
        border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
    }
}

.product-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    transition: opacity var(--transition-normal);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
}

.product-card:hover .product-overlay {
    opacity: 1;
}

.product-actions {
    display: flex;
    gap: var(--spacing-sm);
}

.product-action-btn {
    width: 45px;
    height: 45px;
    background: var(--white);
    border: none;
    border-radius: 50%;
    color: var(--gray-700);
    cursor: pointer;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-action-btn:hover {
    background: var(--primary-color);
    color: var(--white);
    transform: scale(1.1);
}

.product-badge {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--white);
}

.product-badge-featured {
    background: var(--primary-color);
}

.product-badge-new {
    background: var(--success);
}

.product-badge-popular {
    background: var(--warning);
}

.product-card-content {
    padding: var(--spacing-xl);
}

.product-category {
    color: var(--primary-color);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: var(--spacing-sm);
}

.product-title {
    font-size: var(--font-size-xl);
    margin-bottom: var(--spacing-md);
    color: var(--gray-900);
    line-height: 1.3;
}

.product-description {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
}

.product-features {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

.product-feature {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    color: var(--gray-700);
    font-size: var(--font-size-sm);
    background: var(--gray-100);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-md);
}

.product-feature i {
    color: var(--success);
    font-size: var(--font-size-xs);
}

.product-card-footer {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.products-cta {
    text-align: center;
}

/* Estilos específicos para botões nos cards de produtos em destaque */
.product-card-footer .btn {
    flex: 1;
    min-width: 120px;
    text-align: center;
    font-weight: 600;
    transition: all var(--transition-fast);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-sm);
}

.product-card-footer .btn-primary {
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    border: 2px solid var(--primary-color) !important;
}

.product-card-footer .btn-primary:hover {
    background-color: var(--primary-dark) !important;
    color: var(--white) !important;
    border-color: var(--primary-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.product-card-footer .btn-outline {
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 2px solid var(--primary-color) !important;
}

.product-card-footer .btn-outline:hover {
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

/* Responsividade para botões dos cards de produtos */
@media (max-width: 768px) {
    .product-card-footer {
        flex-direction: column;
    }
    
    .product-card-footer .btn {
        min-width: auto;
        width: 100%;
        margin-bottom: var(--spacing-sm);
    }
    
    .product-card-footer .btn:last-child {
        margin-bottom: 0;
    }
}

@media (max-width: 480px) {
    .product-card-footer .btn {
        font-size: var(--font-size-xs);
        padding: var(--spacing-xs) var(--spacing-sm);
    }
}



/* ===== NOVA SEÇÃO DE CONTATOS CTA ===== */
.contact-cta {
    padding: var(--spacing-4xl) 0;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    position: relative;
    overflow: hidden;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.contact-cta-header {
    text-align: center;
    margin-bottom: var(--spacing-4xl);
    color: var(--white);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.contact-cta-title {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: var(--spacing-xl);
    line-height: 1.2;
    color: var(--white);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.contact-cta-subtitle {
    font-size: var(--font-size-lg);
    opacity: 0.9;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto;
    color: var(--white);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.contact-cta-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-2xl);
    margin-bottom: var(--spacing-4xl);
    min-height: 0;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.contact-cta-card {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border-radius: var(--border-radius-2xl);
    padding: var(--spacing-3xl);
    text-align: center;
    color: var(--white);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: all var(--transition-normal);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 400px;
    box-sizing: border-box;
}

.contact-cta-card:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
}

.contact-cta-icon {
    width: 80px;
    height: 80px;
    background: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xl);
    color: var(--primary-color);
    font-size: var(--font-size-2xl);
}

.contact-cta-card-title {
    font-size: var(--font-size-xl);
    font-weight: 700;
    margin-bottom: var(--spacing-md);
    line-height: 1.3;
    color: var(--white);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
}

.contact-cta-card-description {
    font-size: var(--font-size-base);
    opacity: 0.9;
    line-height: 1.5;
    margin-bottom: var(--spacing-xl);
    color: var(--white);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
}

.contact-cta-btn {
    display: inline-block;
    background: var(--white);
    color: var(--primary-color) !important;
    padding: var(--spacing-md) var(--spacing-xl);
    border-radius: var(--border-radius-lg);
    text-decoration: none;
    font-weight: 600;
    font-size: var(--font-size-base);
    transition: all var(--transition-normal);
    border: 2px solid transparent;
}

.contact-cta-btn:hover {
    background: transparent;
    color: var(--white) !important;
    border-color: var(--white);
    transform: translateY(-2px);
}

.contact-cta-main-action {
    text-align: center;
}

.contact-cta-main-btn {
    display: inline-block;
    background: var(--white);
    color: var(--primary-color) !important;
    padding: var(--spacing-lg) var(--spacing-2xl);
    border-radius: var(--border-radius-lg);
    text-decoration: none;
    font-weight: 700;
    font-size: var(--font-size-lg);
    transition: all var(--transition-normal);
    border: 2px solid transparent;
    width: auto;
    max-width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.contact-cta-main-btn:hover {
    background: transparent;
    color: var(--white) !important;
    border-color: var(--white);
    transform: translateY(-2px);
}

/* Sobrescrever regras globais para a seção de contatos */
.contact-cta p {
    color: var(--white);
}

/* Links gerais na seção de contatos (exceto botões) */
.contact-cta a:not(.contact-cta-btn):not(.contact-cta-main-btn) {
    color: var(--white);
}

.contact-cta h1,
.contact-cta h2,
.contact-cta h3,
.contact-cta h4,
.contact-cta h5,
.contact-cta h6 {
    color: var(--white);
}

/* Sobrescrever o tamanho dos h2 na seção de contatos para manter o tamanho original */
.contact-cta h2 {
    font-size: 3rem;
}

/* Garantir que os botões da seção de contatos tenham as cores corretas */
.contact-cta .contact-cta-btn {
    background: var(--white) !important;
    color: var(--primary-color) !important;
    border: 2px solid transparent !important;
}

.contact-cta .contact-cta-btn:hover {
    background: transparent !important;
    color: var(--white) !important;
    border: 2px solid var(--white) !important;
}

.contact-cta .contact-cta-main-btn {
    background: var(--white) !important;
    color: var(--primary-color) !important;
    border: 2px solid transparent !important;
}

.contact-cta .contact-cta-main-btn:hover {
    background: transparent !important;
    color: var(--white) !important;
    border: 2px solid var(--white) !important;
}

/* ===== ESTILOS PARA LOGOS DE CERTIFICAÇÕES ===== */
.certification-logo-container {
    width: 300px;
    height: 300px;
    min-width: 120px;
    min-height: 120px;
    max-width: 100%;
    background: var(--white);
    border-radius: var(--border-radius-xl);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xl);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-lg);
    transition: all var(--transition-normal);
    flex-shrink: 0;
}

.certification-logo-container:hover {
    transform: scale(1.05);
    box-shadow: var(--shadow-xl);
}

.certification-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: var(--border-radius-lg);
    background-color: var(--white);
    max-width: 100%;
    max-height: 100%;
    aspect-ratio: 1;
}





/* ===== FOOTER ===== */
.footer {
    background-color: #f9fafb;
    color: var(--gray-700);
    padding: var(--spacing-3xl) 0 var(--spacing-lg);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-content {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-main {
    grid-column: 1;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-logo img {
    height: 50px;
    margin-bottom: var(--spacing-lg);
    max-width: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.footer-description {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-contact {
    margin-bottom: var(--spacing-lg);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-contact-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
    color: var(--gray-600);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-contact-item i {
    color: var(--primary-color);
    width: 20px;
    flex-shrink: 0;
}

.footer-contact-item span {
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
	font-size: 12px;
}

.social-links {
    display: flex;
    gap: var(--spacing-sm);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    flex-wrap: wrap;
}

.social-link {
    width: 45px;
    height: 45px;
    background-color: var(--gray-200);
    color: var(--gray-600);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-fast);
    border: 2px solid transparent;
    flex-shrink: 0;
    box-sizing: border-box;
}

.social-link:hover {
    background-color: var(--primary-color);
    color: var(--white);
    transform: translateY(-3px);
    border-color: var(--primary-light);
    box-shadow: 0 5px 15px rgba(0, 166, 81, 0.3);
}

.footer-section {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
}

.footer-section h3 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-base);
    font-weight: 600;
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-links li {
    margin-bottom: var(--spacing-sm);
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-links a {
    color: var(--gray-600);
    transition: all var(--transition-fast);
    text-decoration: none;
    display: block;
    padding: var(--spacing-sm) 0;
    font-size: var(--font-size-sm);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-links a:hover {
    color: var(--primary-color);
    transform: translateX(5px);
}

.footer-bottom {
    border-top: 1px solid var(--gray-300);
    padding-top: var(--spacing-lg);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-info {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-info p {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-link {
    color: var(--gray-600);
    text-decoration: none;
    font-size: var(--font-size-sm);
    transition: color var(--transition-fast);
    width: auto;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    box-sizing: border-box;
}

.footer-link:hover {
    color: var(--primary-color);
}

.footer-divider {
    color: var(--gray-500);
    margin: 0 var(--spacing-sm);
    flex-shrink: 0;
}

/* ===== UTILITY BUTTONS ===== */
.whatsapp-button {
    position: fixed;
    bottom: 80px;
    right: 20px;
    z-index: 1000;
}

.whatsapp-button a {
    width: 60px;
    height: 60px;
    background-color: #25d366;
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-2xl);
    box-shadow: var(--shadow-lg);
    transition: all var(--transition-fast);
}

.whatsapp-button a:hover {
    transform: scale(1.1);
    box-shadow: var(--shadow-xl);
}

.back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background-color: var(--primary-color);
    color: var(--white);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-lg);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-fast);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background-color: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* Removendo duplicata - o header usa o container padrão */

.nav-menu {
    display: flex;
    list-style: none;
    gap: var(--spacing-xl);
    margin: 0;
    padding: 0;
}

.nav-menu li {
    position: relative;
}

.nav-menu a {
    color: var(--gray-700);
    font-weight: 100;
    padding: var(--spacing-sm) 0;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    transition: color var(--transition-fast);
    text-decoration: none;
}

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

.nav-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--spacing-sm);
    flex-direction: column;
    gap: 4px;
}

.mobile-menu-toggle span {
    width: 25px;
    height: 3px;
    background-color: var(--gray-700);
    transition: all var(--transition-fast);
}

.skip-link {
    position: absolute;
    top: -40px;
    left: 6px;
    background: var(--primary-color);
    color: var(--white);
    padding: 8px;
    text-decoration: none;
    border-radius: var(--border-radius-sm);
    z-index: 1001;
    transition: top var(--transition-fast);
}

.skip-link:focus {
    top: 6px;
}

/* ===== SEÇÕES ESPECÍFICAS ===== */
/* Removido regra duplicada do .hero - já definida acima */

.hero-actions {
    display: flex;
    gap: var(--spacing-md);
    justify-content: center;
    flex-wrap: wrap;
}

.section {
    padding: var(--spacing-3xl) 0;
}

.cta-section{
	background: var(--primary-color);
}

.section-header {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
}

.section-title {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
}

.section-subtitle {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    max-width: 600px;
    margin: 0 auto;
}

/* Botões */
.btn {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-md) var(--spacing-xl);
    border-radius: var(--border-radius-md);
    font-weight: 500;
    text-decoration: none;
    transition: all var(--transition-fast);
    border: none;
    cursor: pointer;
    font-size: var(--font-size-base);
}

.btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
}

.btn-primary:hover {
    background-color: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}



.btn-large {
    padding: var(--spacing-lg) var(--spacing-2xl);
    font-size: var(--font-size-lg);
}

/* Grids */
.categorias-grid,
.produtos-grid,
.artigos-grid,
.categorias-catalogo,
.destaques-grid,
.info-grid,
.equipe-grid,
.numeros-grid,
.valores-grid,
.timeline,
.newsletter-content {
    display: grid;
    gap: var(--spacing-xl);
}

.categorias-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.produtos-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.artigos-grid {
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
}

.categorias-catalogo {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.destaques-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.info-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.equipe-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.numeros-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.valores-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.newsletter-content {
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-3xl);
}

/* Cards */
.categoria-card,
.produto-card,
.artigo-card,
.categoria-detalhada,
.destaque-card,
.info-card,
.membro-card,
.valor-card {
    background-color: var(--white);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
}

.categoria-card:hover,
.produto-card:hover,
.artigo-card:hover,
.categoria-detalhada:hover,
.destaque-card:hover,
.info-card:hover,
.membro-card:hover,
.valor-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-xl);
}

/* Footer */
.footer {
    background-color: #f9fafb;
    color: var(--gray-700);
    padding: var(--spacing-3xl) 0 var(--spacing-lg);
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--spacing-2xl);
    margin-bottom: var(--spacing-2xl);
}

.footer-section h4 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-lg);
}

.footer-section ul {
    list-style: none;
    padding: 0;
}

.footer-section ul li {
    margin-bottom: var(--spacing-sm);
}

.footer-section ul li a {
    color: var(--gray-600);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.footer-section ul li a:hover {
    color: var(--primary-color);
}

.footer-bottom {
    border-top: 1px solid var(--gray-300);
    padding-top: var(--spacing-lg);
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-md);
}

.footer-links-horizontal {
    display: flex;
    gap: var(--spacing-lg);
}

.footer-links-horizontal a {
    color: var(--gray-600);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.footer-links-horizontal a:hover {
    color: var(--primary-color);
}

/* WhatsApp Button */
.whatsapp-button {
    position: fixed;
    bottom: 80px;
    right: 20px;
    background-color: #25d366;
    color: var(--white);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: var(--shadow-lg);
    transition: all var(--transition-fast);
    z-index: 1000;
}

.whatsapp-button:hover {
    transform: scale(1.1);
    box-shadow: var(--shadow-xl);
}

/* Back to Top Button */
.back-to-top {
    position: fixed;
    bottom: 90px;
    right: 20px;
    background-color: var(--primary-color);
    color: var(--white);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-fast);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
}

.back-to-top:hover {
    background-color: var(--primary-dark);
    transform: translateY(-2px);
}

/* Formulários */
.form-group {
    margin-bottom: var(--spacing-lg);
}

.form-group label {
    display: block;
    margin-bottom: var(--spacing-sm);
    font-weight: 500;
    color: var(--gray-700);
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 100%;
    padding: var(--spacing-md);
    border: 1px solid var(--gray-300);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-base);
    transition: border-color var(--transition-fast);
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 166, 81, 0.1);
}

/* ===== NOVA SEÇÃO - TRADIÇÃO E CERTIFICAÇÕES ===== */
.tradition-certifications {
    padding: var(--spacing-4xl) 0;
    background-color: var(--white);
    position: relative;
}

/* A seção agora usa o container padrão como header, footer e demais seções */

.tradition-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-4xl);
    align-items: start;
}

.tradition-text {
    padding-right: var(--spacing-2xl);
}

.tradition-title {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-2xl);
    line-height: 1.2;
}

.tradition-paragraphs {
    margin-bottom: var(--spacing-3xl);
}

.tradition-paragraph {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.7;
}

.tradition-features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xl);
}

.tradition-feature {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
}

.tradition-feature-icon {
    width: 48px;
    height: 48px;
    border: 2px solid var(--primary-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color);
    font-size: var(--font-size-lg);
    flex-shrink: 0;
    background-color: var(--white);
}

.tradition-feature-content {
    flex: 1;
    min-width: 0;
}

.tradition-feature-title {
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--gray-900);
    margin-bottom: var(--spacing-xs);
    line-height: 1.3;
}

.tradition-feature-text {
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    line-height: 1.5;
}

.certifications-box {
    background: #D9D9D9;
    border-radius: var(--border-radius-2xl);
    padding: var(--spacing-3xl);
    color: var(--gray-800);
    position: relative;
    box-shadow: var(--shadow-xl);
}

.certifications-title {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    margin-bottom: var(--spacing-2xl);
    text-align: center;
}

.certifications-list {
    margin-bottom: var(--spacing-3xl);
}

.certification-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-base);
    font-weight: 500;
}

.certification-item i {
    color: var(--white);
    font-size: var(--font-size-lg);
    flex-shrink: 0;
}

.production-stats {
    text-align: center;
    margin-bottom: var(--spacing-2xl);
}

.production-number {
    font-size: var(--font-size-5xl);
    font-weight: 700;
    margin-bottom: var(--spacing-sm);
    line-height: 1;
    color: var(--primary-color);
}

.production-text {
    font-size: var(--font-size-base);
    opacity: 0.9;
    line-height: 1.4;
    color: var(--gray-700);
}

.coverage-badge {
    position: absolute;
    bottom: -20px;
    right: -20px;
    background: var(--white);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-md) var(--spacing-lg);
    box-shadow: var(--shadow-lg);
    text-align: center;
    min-width: 120px;
}

.coverage-main {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-xs);
}

.coverage-sub {
    font-size: var(--font-size-sm);
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Estilos para a imagem do produto na seção de certificações */
.product-image-container {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
}

.product-showcase-image {
    width: 100%;
    max-width: 400px;
    height: auto;
    border-radius: 0;
    box-shadow: none;
    transition: transform var(--transition-normal);
    object-fit: contain;
}

.product-showcase-image:hover {
    transform: scale(1.05);
}

/* ===== ANIMAÇÕES ===== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

.animate-fade-in-left {
    animation: fadeInLeft 0.6s ease-out;
}

.animate-fade-in-right {
    animation: fadeInRight 0.6s ease-out;
}

/* ===== UTILITIES ===== */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: var(--spacing-xs); }
.mb-2 { margin-bottom: var(--spacing-sm); }
.mb-3 { margin-bottom: var(--spacing-md); }
.mb-4 { margin-bottom: var(--spacing-lg); }
.mb-5 { margin-bottom: var(--spacing-xl); }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: var(--spacing-xs); }
.mt-2 { margin-top: var(--spacing-sm); }
.mt-3 { margin-top: var(--spacing-md); }
.mt-4 { margin-top: var(--spacing-lg); }
.mt-5 { margin-top: var(--spacing-xl); }

.p-0 { padding: 0; }
.p-1 { padding: var(--spacing-xs); }
.p-2 { padding: var(--spacing-sm); }
.p-3 { padding: var(--spacing-md); }
.p-4 { padding: var(--spacing-lg); }
.p-5 { padding: var(--spacing-xl); }

.d-none { display: none; }
.d-block { display: block; }
.d-flex { display: flex; }
.d-grid { display: grid; }

.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }

.align-center { align-items: center; }
.align-start { align-items: flex-start; }
.align-end { align-items: flex-end; }

.w-full { width: 100%; }
.h-full { height: 100%; }

.rounded { border-radius: var(--border-radius-md); }
.rounded-lg { border-radius: var(--border-radius-lg); }
.rounded-full { border-radius: 50%; }

.shadow { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }

/* ===== EFEITO TYPING PARA TÍTULOS H2 ===== */
.typing-effect {
    position: relative;
    overflow: hidden;
}

.typing-effect::after {
    content: '';
    position: absolute;
    right: -4px;
    top: 0;
    height: 100%;
    width: 2px;
    background-color: var(--primary-color);
    animation: blink 1s infinite;
}

.typing-effect.typing-active {
    animation: typing 2s steps(40, end);
}

.typing-effect.typing-complete::after {
    display: none;
}

@keyframes typing {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}

@keyframes blink {
    0%, 50% {
        opacity: 1;
    }
    51%, 100% {
        opacity: 0;
    }
}

/* Classe para títulos h2 que terão o efeito de typing */
h2.typing-title {
    white-space: nowrap;
    overflow: hidden;
    width: 0;
    transition: width 0.1s ease;
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Melhorias específicas para títulos typing-title em seções com background verde */
.cta-produtos h2.typing-title {
    color: var(--white) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    font-weight: 700 !important;
}

.cta-produtos h2.typing-title.typing-active {
    color: var(--white) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

h2.typing-title.typing-active {
    animation: typingAnimation 2s ease-in-out forwards;
}

@keyframes typingAnimation {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

/* Responsividade para o efeito de typing */
@media (max-width: 768px) {
    h2.typing-title {
        white-space: normal;
        width: 100%;
        animation: none;
        overflow-wrap: break-word;
        word-wrap: break-word;
        word-break: break-word;
    }
    
    .typing-effect::after {
        display: none;
    }
    
    /* Melhorias responsivas para CTA em tablets */
    .cta-produtos h2.typing-title {
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
        font-weight: 700 !important;
    }
    
    .cta-produtos .btn-primary,
    .cta-produtos .btn-outline {
        font-size: var(--font-size-base) !important;
        padding: var(--spacing-sm) var(--spacing-lg) !important;
    }
}

/* Responsividade adicional para telas muito pequenas */
@media (max-width: 480px) {
    h2.typing-title {
        white-space: normal;
        width: 100%;
        animation: none;
        overflow-wrap: break-word;
        word-wrap: break-word;
        word-break: break-word;
        font-size: 1.75rem;
    }
    
    /* Melhorias responsivas para CTA em mobile */
    .cta-produtos h2.typing-title {
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
        font-weight: 700 !important;
        font-size: 1.5rem !important;
    }
    
    .cta-produtos .btn-primary,
    .cta-produtos .btn-outline {
        font-size: var(--font-size-sm) !important;
        padding: var(--spacing-xs) var(--spacing-md) !important;
        width: 100% !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .cta-options {
        flex-direction: column !important;
        align-items: center !important;
    }
}

.tradition-title.typing-title {
    white-space: normal;
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    animation: none;
}

@media (max-width: 768px) {
    .tradition-title.typing-title {
        white-space: normal;
        width: 100%;
        animation: none;
        overflow-wrap: break-word;
        word-wrap: break-word;
        word-break: break-word;
    }
}

@media (max-width: 480px) {
    .tradition-title.typing-title {
        white-space: normal;
        width: 100%;
        animation: none;
        overflow-wrap: break-word;
        word-wrap: break-word;
        word-break: break-word;
        font-size: 1.75rem;
    }
}

.checkbox-label input[type="checkbox"] {
    width: auto;
    margin: 0;
    margin-top: 2px;
}

/* ===== PÁGINA DE CONTATO ===== */

/* Hero específico para contato */
.hero-contatos {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-contatos .hero-title-main,
.hero-contatos .hero-title-sub,
.hero-contatos .hero-description {
    color: var(--white);
}

/* ===== HERO COM BACKGROUND VERDE PARA OUTRAS PÁGINAS ===== */

/* Hero específico para treinamentos */
.hero-treinamentos {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-treinamentos .hero-title-main,
.hero-treinamentos .hero-title-sub,
.hero-treinamentos .hero-description {
    color: var(--white);
}

/* Hero específico para blog */
.hero-blog {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-blog .hero-title-main,
.hero-blog .hero-title-sub,
.hero-blog .hero-description {
    color: var(--white);
}

/* Hero específico para catálogo */
.hero-catalogo {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-catalogo .hero-title-main,
.hero-catalogo .hero-title-sub,
.hero-catalogo .hero-description {
    color: var(--white);
}

/* Hero específico para produtos */
.hero-produtos {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-produtos .hero-title-main,
.hero-produtos .hero-title-sub,
.hero-produtos .hero-description {
    color: var(--white);
}

/* Hero específico para empresa */
.hero-empresa {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

/* ===== SEÇÃO HISTÓRIA ===== */
.historia-section {
    padding: var(--spacing-3xl) 0;
    background-color: var(--white);
}

.historia-content {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: var(--spacing-3xl);
    align-items: start;
}

.historia-text {
    max-width: 800px;
}

.historia-intro {
    font-size: var(--font-size-lg);
    line-height: 1.7;
    color: var(--gray-600);
    margin-bottom: var(--spacing-2xl);
}

/* Timeline */
.timeline {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
}

.timeline-item {
    display: flex;
    gap: var(--spacing-lg);
    position: relative;
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: 80px;
    top: 0;
    bottom: -20px;
    width: 2px;
    background: var(--primary-color);
}

.timeline-year {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--primary-color);
    min-width: 80px;
    text-align: center;
    padding: var(--spacing-sm) 0;
}

.timeline-content {
    flex: 1;
    padding-left: var(--spacing-lg);
}

.timeline-content h3 {
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--gray-800);
    margin-bottom: var(--spacing-sm);
}

.timeline-content p {
    color: var(--gray-600);
    line-height: 1.6;
}

/* Estatísticas */
.historia-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-lg);
}

.stat-card {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
    padding: var(--spacing-xl);
    border-radius: var(--border-radius-lg);
    text-align: center;
    box-shadow: var(--shadow-lg);
}

.stat-icon {
    font-size: 2rem;
    margin-bottom: var(--spacing-md);
    opacity: 0.9;
}

.stat-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: var(--spacing-sm);
}

.stat-label {
    font-size: var(--font-size-sm);
    opacity: 0.9;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ===== SEÇÃO DEPOIMENTOS ===== */
.depoimentos-section {
    padding: var(--spacing-3xl) 0;
    background-color: var(--gray-50);
}

.depoimentos-slider {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-2xl);
}

.depoimento-card {
    background-color: var(--white);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
}

.depoimento-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-xl);
    border-color: var(--primary-color);
}

.depoimento-content {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.depoimento-texto {
    position: relative;
}

.depoimento-texto i {
    font-size: 3rem;
    color: var(--primary-color);
    opacity: 0.3;
    position: absolute;
    top: -10px;
    left: -10px;
}

.depoimento-texto p {
    font-size: var(--font-size-lg);
    line-height: 1.7;
    color: var(--gray-700);
    font-style: italic;
    padding-left: var(--spacing-lg);
    margin: 0;
}

.depoimento-autor {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--gray-200);
}

.depoimento-autor img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
}

.autor-info h4 {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--gray-800);
    margin: 0 0 var(--spacing-xs) 0;
}

.autor-info p {
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    margin: 0;
}



.hero-empresa .hero-title-main,
.hero-empresa .hero-title-sub,
.hero-empresa .hero-description {
    color: var(--white);
}

/* Hero específico para política de privacidade */
.hero-politica {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-politica .hero-title-main,
.hero-politica .hero-title-sub,
.hero-politica .hero-description {
    color: var(--white);
}

/* Hero específico para trabalhe conosco */
.hero-trabalhe {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-trabalhe .hero-title-main,
.hero-trabalhe .hero-title-sub,
.hero-trabalhe .hero-description {
    color: var(--white);
}

/* Hero específico para racks padrão 19 */
.hero-racks-padrao {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-racks-padrao .hero-title-main,
.hero-racks-padrao .hero-title-sub,
.hero-racks-padrao .hero-description {
    color: var(--white);
}

/* Hero específico para racks padrão 19 (página específica) */
.hero-racks-padrao-19 {
    color: var(--white);
}

.hero-racks-padrao-19 .hero-title-main,
.hero-racks-padrao-19 .hero-title-sub,
.hero-racks-padrao-19 .hero-description {
    color: var(--white);
}

/* Hero específico para acessórios 19 */
.hero-acessorios {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-acessorios .hero-title-main,
.hero-acessorios .hero-title-sub,
.hero-acessorios .hero-description {
    color: var(--white);
}

/* Hero específico para caixas metálicas */
.hero-caixas {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-caixas .hero-title-main,
.hero-caixas .hero-title-sub,
.hero-caixas .hero-description {
    color: var(--white);
}

/* Hero específico para racks economic */
.hero-racks-economic {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-racks-economic .hero-title-main,
.hero-racks-economic .hero-title-sub,
.hero-racks-economic .hero-description {
    color: var(--white);
}

/* Hero específico para rack piso 19 */
.hero-rack-piso {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-rack-piso .hero-title-main,
.hero-rack-piso .hero-title-sub,
.hero-rack-piso .hero-description {
    color: var(--white);
}

/* Hero específico para rack parede 19 */
.hero-rack-parede {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-rack-parede .hero-title-main,
.hero-rack-parede .hero-title-sub,
.hero-rack-parede .hero-description {
    color: var(--white);
}

/* Hero específico para bandeja fixa */
.hero-bandeja-fixa {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-bandeja-fixa .hero-title-main,
.hero-bandeja-fixa .hero-title-sub,
.hero-bandeja-fixa .hero-description {
    color: var(--white);
}

/* Hero específico para bandeja móvel */
.hero-bandeja-movel {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-bandeja-movel .hero-title-main,
.hero-bandeja-movel .hero-title-sub,
.hero-bandeja-movel .hero-description {
    color: var(--white);
}

/* Hero específico para frente falsa */
.hero-frente-falsa {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-frente-falsa .hero-title-main,
.hero-frente-falsa .hero-title-sub,
.hero-frente-falsa .hero-description {
    color: var(--white);
}

/* Hero específico para kit cooler */
.hero-kit-cooler {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-kit-cooler .hero-title-main,
.hero-kit-cooler .hero-title-sub,
.hero-kit-cooler .hero-description {
    color: var(--white);
}

/* Hero específico para kit porca gaiola */
.hero-kit-porca {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-kit-porca .hero-title-main,
.hero-kit-porca .hero-title-sub,
.hero-kit-porca .hero-description {
    color: var(--white);
}

/* Hero específico para kit rodízio */
.hero-kit-rodizio {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-kit-rodizio .hero-title-main,
.hero-kit-rodizio .hero-title-sub,
.hero-kit-rodizio .hero-description {
    color: var(--white);
}

/* Hero específico para organizadores de cabos */
.hero-organizadores {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-organizadores .hero-title-main,
.hero-organizadores .hero-title-sub,
.hero-organizadores .hero-description {
    color: var(--white);
}

/* Hero específico para réguas de tomada */
.hero-reguas {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-reguas .hero-title-main,
.hero-reguas .hero-title-sub,
.hero-reguas .hero-description {
    color: var(--white);
}

/* Hero específico para caixa horizontal */
.hero-caixa-horizontal {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-caixa-horizontal .hero-title-main,
.hero-caixa-horizontal .hero-title-sub,
.hero-caixa-horizontal .hero-description {
    color: var(--white);
}

/* Hero específico para caixa vertical */
.hero-caixa-vertical {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-caixa-vertical .hero-title-main,
.hero-caixa-vertical .hero-title-sub,
.hero-caixa-vertical .hero-description {
    color: var(--white);
}

/* Hero específico para caixa customizada */
.hero-caixa-customizada {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-caixa-customizada .hero-title-main,
.hero-caixa-customizada .hero-title-sub,
.hero-caixa-customizada .hero-description {
    color: var(--white);
}

/* Hero específico para economic convencional */
.hero-economic-convencional {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-economic-convencional .hero-title-main,
.hero-economic-convencional .hero-title-sub,
.hero-economic-convencional .hero-description {
    color: var(--white);
}

/* Hero específico para economic plus */
.hero-economic-plus {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-economic-plus .hero-title-main,
.hero-economic-plus .hero-title-sub,
.hero-economic-plus .hero-description {
    color: var(--white);
}

/* Hero específico para economic ventilada */
.hero-economic-ventilada {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.hero-economic-ventilada .hero-title-main,
.hero-economic-ventilada .hero-title-sub,
.hero-economic-ventilada .hero-description {
    color: var(--white);
}

/* Seção de Informações de Contato */
.informacoes-contato {
    background-color: var(--gray-50);
}

.contato-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-3xl);
}

.contato-card {
    background: var(--white);
    padding: var(--spacing-2xl);
    border-radius: var(--border-radius-xl);
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
    position: relative;
    overflow: hidden;
}

.contato-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
    border-color: var(--primary-color);
}

.contato-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--primary-light));
    transform: scaleX(0);
    transition: transform var(--transition-normal);
}

.contato-card:hover::before {
    transform: scaleX(1);
}

.contato-icon {
    width: 80px;
    height: 80px;
    background: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xl);
    color: var(--white);
    font-size: var(--font-size-2xl);
    position: relative;
    z-index: 1;
}

.contato-icon::after {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    background: var(--primary-light);
    border-radius: 50%;
    z-index: -1;
    opacity: 0.3;
    transition: all var(--transition-normal);
}

.contato-card:hover .contato-icon::after {
    opacity: 0.6;
    transform: scale(1.1);
}

.contato-card h3 {
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
}

.contato-card p {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
}

.contato-detalhes {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.contato-detalhes a,
.contato-detalhes span {
    color: var(--gray-700);
    text-decoration: none;
    font-weight: 500;
    transition: color var(--transition-fast);
}

.contato-detalhes a:hover {
    color: var(--primary-color);
}

/* Seção do Formulário */
.formulario-section {
    background-color: var(--white);
}

.formulario-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-4xl);
    align-items: start;
}

.formulario-info h2 {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-lg);
}

.formulario-info p {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    margin-bottom: var(--spacing-2xl);
    line-height: 1.6;
}

.tipos-contato h3 {
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: var(--spacing-lg);
}

.tipos-contato ul {
    list-style: none;
    padding: 0;
}

.tipos-contato li {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
    color: var(--gray-700);
    font-size: var(--font-size-base);
}

.tipos-contato i {
    color: var(--primary-color);
    font-size: var(--font-size-sm);
}

/* Formulário */
.formulario-form {
    background: var(--gray-50);
    padding: var(--spacing-3xl);
    border-radius: var(--border-radius-xl);
    border: 1px solid var(--gray-200);
}

.form-contato {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
}

.form-group {
    margin-bottom: 0;
}

.form-group label {
    display: block;
    margin-bottom: var(--spacing-sm);
    font-weight: 600;
    color: var(--gray-700);
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 100%;
    padding: var(--spacing-md);
    border: 2px solid var(--gray-300);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-base);
    transition: all var(--transition-fast);
    background-color: var(--white);
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 166, 81, 0.1);
}

.form-group textarea {
    resize: vertical;
    min-height: 120px;
}

/* Estado focused dos campos */
.form-group.focused label {
    color: var(--primary-color);
    font-weight: 700;
}

.form-group.focused input,
.form-group.focused textarea,
.form-group.focused select {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 166, 81, 0.1);
}

/* Botão de envio */
.formulario-form .btn {
    width: 100%;
    justify-content: center;
    padding: var(--spacing-lg) var(--spacing-2xl);
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin-top: var(--spacing-lg);
    transition: all var(--transition-normal);
}

.formulario-form .btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* Responsividade para formulário */
@media (max-width: 1023px) {
    .formulario-content {
        grid-template-columns: 1fr;
        gap: var(--spacing-3xl);
    }
    
    .form-row {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }
    
    .contato-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: var(--spacing-xl);
    }
}

@media (max-width: 767px) {
    .contato-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
    
    .formulario-form {
        padding: var(--spacing-2xl);
    }
    
    .formulario-info h2 {
        font-size: 2.5rem;
    }
}

@media (max-width: 480px) {
    .contato-card {
        padding: var(--spacing-xl);
    }
    
    .formulario-form {
        padding: var(--spacing-xl);
    }
    
    .formulario-info h2 {
        font-size: 2rem;
    }
}

/* ===== PÁGINA DE TREINAMENTOS ===== */

/* Seção de Cursos */
.cursos-section {
    background-color: var(--white);
}

.cursos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-3xl);
    margin-top: var(--spacing-3xl);
}

.curso-card {
    background: var(--white);
    border-radius: var(--border-radius-2xl);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
    position: relative;
}

.curso-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: var(--primary-color);
}

.curso-image {
    position: relative;
    height: 250px;
    overflow: hidden;
}

.curso-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

.curso-card:hover .curso-image img {
    transform: scale(1.05);
}

.curso-badge {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    background: var(--primary-color);
    color: var(--white);
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: var(--border-radius-full);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.curso-content {
    padding: var(--spacing-2xl);
}

.curso-content h3 {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
    line-height: 1.3;
}

.curso-content p {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
    font-size: var(--font-size-base);
}

.curso-info {
    display: flex;
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-md);
    background: var(--gray-50);
    border-radius: var(--border-radius-md);
}

.curso-duracao,
.curso-nivel {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    color: var(--gray-700);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.curso-duracao i,
.curso-nivel i {
    color: var(--primary-color);
    font-size: var(--font-size-base);
}

.curso-topicos {
    margin-bottom: var(--spacing-xl);
}

.curso-topicos h4 {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
}

.curso-topicos ul {
    list-style: none;
    padding: 0;
}

.curso-topicos li {
    position: relative;
    padding-left: var(--spacing-lg);
    margin-bottom: var(--spacing-sm);
    color: var(--gray-700);
    font-size: var(--font-size-sm);
    line-height: 1.5;
}

.curso-topicos li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--primary-color);
    font-weight: bold;
    font-size: var(--font-size-sm);
}

.curso-card .btn {
    width: 100%;
    justify-content: center;
    padding: var(--spacing-md) var(--spacing-xl);
    font-weight: 600;
}

/* Seção de Vantagens */
.vantagens-treinamentos {
    background-color: var(--gray-50);
}

.vantagens-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-4xl);
    align-items: center;
}

.vantagens-text h2 {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-lg);
    line-height: 1.2;
}

.vantagens-text p {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    margin-bottom: var(--spacing-2xl);
    line-height: 1.6;
}

.vantagens-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
}

.vantagem-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-lg);
}

.vantagem-icon {
    width: 60px;
    height: 60px;
    background: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

.vantagem-content h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: var(--spacing-sm);
}

.vantagem-content p {
    color: var(--gray-600);
    line-height: 1.6;
    font-size: var(--font-size-base);
}

.vantagens-image {
    text-align: center;
}

.vantagens-image img {
    width: 100%;
    max-width: 500px;
    height: auto;
    border-radius: var(--border-radius-xl);
    box-shadow: var(--shadow-lg);
}

/* Responsividade para treinamentos */
@media (max-width: 1023px) {
    .cursos-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: var(--spacing-2xl);
    }
    
    .vantagens-content {
        grid-template-columns: 1fr;
        gap: var(--spacing-3xl);
        text-align: center;
    }
    
    .vantagem-item {
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .cursos-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-xl);
    }
    
    .curso-content {
        padding: var(--spacing-xl);
    }
    
    .curso-info {
        flex-direction: column;
        gap: var(--spacing-md);
        text-align: center;
    }
    
    .vantagens-text h2 {
        font-size: 2.5rem;
    }
    
    .vantagem-item {
        flex-direction: column;
        text-align: center;
        gap: var(--spacing-md);
    }
}

@media (max-width: 480px) {
    .curso-content {
        padding: var(--spacing-lg);
    }
    
    .vantagens-text h2 {
        font-size: 2rem;
    }
    
    .vantagem-icon {
        width: 50px;
        height: 50px;
        font-size: var(--font-size-lg);
    }
}

/* ===== ESTILOS PARA PÁGINA DE PRODUTOS ===== */

/* Hero Section para Produtos */
.hero {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.hero-slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

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

.hero-background {
    position: relative;
    width: 100%;
    height: 100%;
}

.hero-slide-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.4) 100%);
}

.hero-content {
    position: relative;
    z-index: 2;
    color: var(--white);
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.hero-title {
    margin-bottom: var(--spacing-lg);
}

.hero-title-main {
    display: block;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    margin-bottom: var(--spacing-sm);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.hero-title-sub {
    display: block;
    font-size: var(--font-size-xl);
    font-weight: 400;
    opacity: 0.9;
}

.hero-description {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-2xl);
    opacity: 0.9;
    line-height: 1.6;
}

.hero-buttons {
    display: flex;
    gap: var(--spacing-lg);
    justify-content: center;
    flex-wrap: wrap;
}

/* Filtros de Produtos */
.filtros-produtos {
    background-color: var(--gray-50);
    padding: var(--spacing-3xl) 0;
}

.filtros-content {
    text-align: center;
}

.filtros-content h2 {
    font-size: var(--font-size-2xl);
    color: var(--gray-800);
    margin-bottom: var(--spacing-xl);
}

.filtros-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-lg);
    max-width: 800px;
    margin: 0 auto;
}

.filtro-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.filtro-item label {
    font-weight: 500;
    color: var(--gray-700);
    margin-bottom: var(--spacing-sm);
}

.filtro-item select {
    width: 100%;
    padding: var(--spacing-md);
    border: 2px solid var(--gray-300);
    border-radius: var(--border-radius-md);
    background-color: var(--white);
    font-size: var(--font-size-base);
    transition: border-color var(--transition-fast);
}

.filtro-item select:focus {
    outline: none;
    border-color: var(--primary-color);
}

.filtros-form .btn {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: var(--spacing-lg);
}

/* Categorias de Produtos */
.categorias-produtos {
    padding: var(--spacing-4xl) 0;
}

.section-header {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
}

.section-title {
    font-size: var(--font-size-3xl);
    color: var(--gray-800);
    margin-bottom: var(--spacing-md);
}

.section-subtitle {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    max-width: 600px;
    margin: 0 auto;
}

.categorias-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-2xl);
}

.categoria-card {
    position: relative;
    overflow: hidden;
    border-radius: var(--border-radius-lg);
    background-color: var(--white);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
}

.categoria-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-xl);
}

.categoria-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.categoria-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

.categoria-card:hover .categoria-image img {
    transform: scale(1.1);
}

.categoria-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%);
    opacity: 0;
    transition: opacity var(--transition-normal);
    display: flex;
    align-items: center;
    justify-content: center;
}

.categoria-card:hover .categoria-overlay {
    opacity: 1;
}

.categoria-info {
    text-align: center;
    color: var(--white);
    padding: var(--spacing-lg);
}

.categoria-info h3 {
    font-size: var(--font-size-xl);
    margin-bottom: var(--spacing-sm);
}

.categoria-info p {
    margin-bottom: var(--spacing-lg);
    opacity: 0.9;
}

.categoria-content {
    padding: var(--spacing-xl);
}

.categoria-content h3 {
    font-size: var(--font-size-lg);
    color: var(--gray-800);
    margin-bottom: var(--spacing-sm);
}

.categoria-content p {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
}

.categoria-features {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.feature {
    background-color: var(--primary-color);
    color: var(--white);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-full);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

/* Seções de Produtos */
.produtos-section {
    padding: var(--spacing-4xl) 0;
}

.produtos-section.section-gray {
    background-color: var(--gray-50);
}

.produtos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-3xl);
}

.produto-card {
    background-color: var(--white);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.produto-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-xl);
}

.produto-image {
    position: relative;
    height: 250px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--gray-50);
}

.produto-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform var(--transition-normal);
    max-height: 230px;
}

.produto-card:hover .produto-image img {
    transform: scale(1.05);
}

.produto-badge {
    position: absolute;
    top: var(--spacing-sm);
    right: var(--spacing-sm);
    background-color: var(--primary-color);
    color: var(--white);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-full);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.produto-content {
    padding: var(--spacing-xl);
    flex: 1;
    display: flex;
    flex-direction: column;
}

.produto-content h3 {
    font-size: var(--font-size-lg);
    color: var(--gray-800);
    margin-bottom: var(--spacing-sm);
}

.produto-content p {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
}

.produto-specs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
}

.spec {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    color: var(--gray-700);
    font-size: var(--font-size-sm);
}

.spec i {
    color: var(--primary-color);
    width: 16px;
}

.produto-actions {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
    margin-top: auto;
}

/* CTA Section */
.cta-produtos {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
    text-align: center;
    padding: var(--spacing-4xl) 0;
}

.cta-content h2 {
    font-size: var(--font-size-3xl);
    margin-bottom: var(--spacing-lg);
}

.cta-content p {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-2xl);
    opacity: 0.9;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.cta-options {
    display: flex;
    gap: var(--spacing-lg);
    justify-content: center;
    margin-bottom: var(--spacing-3xl);
    flex-wrap: wrap;
}

.cta-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-2xl);
    max-width: 800px;
    margin: 0 auto;
}

.stat {
    text-align: center;
}

.stat-number {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    margin-bottom: var(--spacing-sm);
}

.stat-label {
    font-size: var(--font-size-base);
    opacity: 0.9;
}

/* Modal */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.modal-content {
    background-color: var(--white);
    margin: 5% auto;
    padding: var(--spacing-2xl);
    border-radius: var(--border-radius-lg);
    width: 90%;
    max-width: 800px;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
}

.modal-close {
    position: absolute;
    top: var(--spacing-lg);
    right: var(--spacing-xl);
    font-size: var(--font-size-2xl);
    cursor: pointer;
    color: var(--gray-600);
    transition: color var(--transition-fast);
}

.modal-close:hover {
    color: var(--gray-800);
}

.produto-detalhes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-2xl);
}

.produto-detalhes-image img {
    width: 100%;
    height: auto;
    border-radius: var(--border-radius-md);
}

.produto-detalhes-info h2 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-md);
}

.produto-detalhes-info h3 {
    color: var(--gray-700);
    margin: var(--spacing-lg) 0 var(--spacing-md);
}

.produto-detalhes-info ul {
    list-style: none;
    padding: 0;
    margin-bottom: var(--spacing-xl);
}

.produto-detalhes-info li {
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--gray-200);
    color: var(--gray-600);
}

.produto-detalhes-info li:before {
    content: "✓";
    color: var(--primary-color);
    font-weight: bold;
    margin-right: var(--spacing-sm);
}

.produto-detalhes-actions {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
}

/* Responsividade para Produtos */
@media (max-width: 1023px) {
    .hero-title-main {
        font-size: var(--font-size-2xl);
    }
    
    .hero-title-sub {
        font-size: var(--font-size-lg);
    }
    
    .hero-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .filtros-form {
        grid-template-columns: 1fr;
    }
    
    .categorias-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
    
    .produtos-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
    
    .cta-options {
        flex-direction: column;
        align-items: center;
    }
    
    .produto-detalhes {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .hero {
        min-height: 400px;
    }
    
    .hero-title-main {
        font-size: var(--font-size-xl);
    }
    
    .hero-description {
        font-size: var(--font-size-base);
    }
    
    .filtros-produtos {
        padding: var(--spacing-2xl) 0;
    }
    
    .categorias-produtos,
    .produtos-section {
        padding: var(--spacing-2xl) 0;
    }
    
    .categorias-grid {
        grid-template-columns: 1fr;
    }
    
    .produtos-grid {
        grid-template-columns: 1fr;
    }
    
    .cta-stats {
        grid-template-columns: 1fr;
    }
    
    .modal-content {
        margin: 10% auto;
        padding: var(--spacing-xl);
        width: 95%;
    }
}

@media (max-width: 480px) {
    .hero {
        min-height: 350px;
    }
    
    .hero-title-main {
        font-size: var(--font-size-lg);
    }
    
    .hero-title-sub {
        font-size: var(--font-size-base);
    }
    
    .hero-description {
        font-size: var(--font-size-sm);
    }
    
    .filtros-content h2 {
        font-size: var(--font-size-xl);
    }
    
    .section-title {
        font-size: var(--font-size-xl);
    }
    
    .section-subtitle {
        font-size: var(--font-size-base);
    }
    
    .categoria-content,
    .produto-content {
        padding: var(--spacing-lg);
    }
    
    .produto-specs {
        grid-template-columns: 1fr;
    }
    
    .produto-actions {
        flex-direction: column;
    }
    
    .cta-options {
        flex-direction: column;
        align-items: center;
    }
    
    .cta-options .btn {
        width: 100%;
        max-width: 300px;
    }
}

/* ===== ESTILOS PARA PÁGINA DE BLOG ===== */

/* Seção do Blog */
.blog-section {
    padding: var(--spacing-4xl) 0;
    background-color: var(--white);
}

/* Filtros do Blog */
.blog-filters {
    display: flex;
    justify-content: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-3xl);
    flex-wrap: wrap;
}

.filter-btn {
    padding: var(--spacing-md) var(--spacing-xl);
    border: 2px solid var(--gray-300);
    background-color: var(--white);
    color: var(--gray-700);
    border-radius: var(--border-radius-lg);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
    font-size: var(--font-size-base);
}

.filter-btn:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
    background-color: var(--gray-50);
}

.filter-btn.active {
    background-color: var(--primary-color);
    color: var(--white);
    border-color: var(--primary-color);
}

/* Grid de Artigos */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-2xl);
    margin-bottom: var(--spacing-3xl);
}

/* Cards de Artigos */
.blog-card {
    background-color: var(--white);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.blog-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: var(--primary-color);
}

.blog-image {
    position: relative;
    height: 250px;
    overflow: hidden;
}

.blog-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

.blog-card:hover .blog-image img {
    transform: scale(1.05);
}

.blog-category {
    position: absolute;
    top: var(--spacing-md);
    left: var(--spacing-md);
    background-color: var(--primary-color);
    color: var(--white);
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.blog-content {
    padding: var(--spacing-xl);
    display: flex;
    flex-direction: column;
    flex: 1;
}

.blog-meta {
    display: flex;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-sm);
    color: var(--gray-500);
    flex-wrap: wrap;
}

.blog-date,
.blog-time {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.blog-date i,
.blog-time i {
    color: var(--primary-color);
    font-size: var(--font-size-xs);
}

.blog-title {
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--gray-900);
    margin-bottom: var(--spacing-md);
    line-height: 1.3;
    flex: 1;
}

.blog-excerpt {
    color: var(--gray-600);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
    flex: 1;
}

.blog-tags {
    display: flex;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
    flex-wrap: wrap;
}

.tag {
    background-color: var(--gray-100);
    color: var(--gray-700);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-full);
    font-size: var(--font-size-xs);
    font-weight: 500;
    transition: all var(--transition-fast);
}

.tag:hover {
    background-color: var(--primary-color);
    color: var(--white);
}

.blog-card .btn {
    margin-top: auto;
    align-self: flex-start;
}

/* Paginação */
.blog-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-md);
    margin-top: var(--spacing-3xl);
}

.pagination-btn {
    padding: var(--spacing-md) var(--spacing-lg);
    border: 2px solid var(--gray-300);
    background-color: var(--white);
    color: var(--gray-700);
    border-radius: var(--border-radius-md);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.pagination-btn:hover:not(:disabled) {
    border-color: var(--primary-color);
    color: var(--primary-color);
    background-color: var(--gray-50);
}

.pagination-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.pagination-numbers {
    display: flex;
    gap: var(--spacing-sm);
}

.pagination-number {
    width: 45px;
    height: 45px;
    border: 2px solid var(--gray-300);
    background-color: var(--white);
    color: var(--gray-700);
    border-radius: var(--border-radius-md);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination-number:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.pagination-number.active {
    background-color: var(--primary-color);
    color: var(--white);
    border-color: var(--primary-color);
}

.pagination-dots {
    display: flex;
    align-items: center;
    color: var(--gray-500);
    font-weight: 500;
}

/* Seção Newsletter */
.newsletter-section {
    padding: var(--spacing-4xl) 0;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
}

.newsletter-content {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.newsletter-content h2 {
    color: var(--white);
    margin-bottom: var(--spacing-lg);
}

.newsletter-content p {
    color: var(--white);
    opacity: 0.9;
    margin-bottom: var(--spacing-2xl);
    font-size: var(--font-size-lg);
}

.newsletter-form {
    margin-bottom: var(--spacing-lg);
}

.newsletter-form .form-group {
    display: flex;
    gap: var(--spacing-md);
    max-width: 500px;
    margin: 0 auto;
    flex-wrap: wrap;
}

.newsletter-form input[type="email"] {
    flex: 1;
    min-width: 250px;
    padding: var(--spacing-lg);
    border: 2px solid transparent;
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-base);
    background-color: var(--white);
    color: var(--gray-800);
}

.newsletter-form input[type="email"]:focus {
    outline: none;
    border-color: var(--white);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2);
}

.newsletter-form .btn {
    background-color: var(--white);
    color: var(--primary-color);
    border: 2px solid var(--white);
    padding: var(--spacing-lg) var(--spacing-xl);
    font-weight: 600;
    white-space: nowrap;
}

.newsletter-form .btn:hover {
    background-color: transparent;
    color: var(--white);
    border-color: var(--white);
}

.newsletter-terms {
    color: var(--white);
    opacity: 0.8;
    font-size: var(--font-size-sm);
}

/* Responsividade para Blog */
@media (max-width: 1023px) {
    .blog-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: var(--spacing-xl);
    }
    
    .blog-filters {
        gap: var(--spacing-sm);
    }
    
    .filter-btn {
        padding: var(--spacing-sm) var(--spacing-lg);
        font-size: var(--font-size-sm);
    }
    
    .newsletter-form .form-group {
        flex-direction: column;
        align-items: center;
    }
    
    .newsletter-form input[type="email"] {
        min-width: 100%;
        max-width: 400px;
    }
}

@media (max-width: 767px) {
    .blog-section {
        padding: var(--spacing-2xl) 0;
    }
    
    .blog-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
    
    .blog-filters {
        flex-direction: column;
        align-items: center;
        gap: var(--spacing-sm);
    }
    
    .filter-btn {
        width: 200px;
        justify-content: center;
    }
    
    .blog-meta {
        flex-direction: column;
        gap: var(--spacing-sm);
        align-items: flex-start;
    }
    
    .blog-pagination {
        flex-direction: column;
        gap: var(--spacing-md);
    }
    
    .pagination-numbers {
        order: -1;
    }
    
    .newsletter-content h2 {
        font-size: 2rem;
    }
    
    .newsletter-content p {
        font-size: var(--font-size-base);
    }
}

@media (max-width: 480px) {
    .blog-card {
        margin: 0 var(--spacing-sm);
    }
    
    .blog-content {
        padding: var(--spacing-lg);
    }
    
    .blog-title {
        font-size: var(--font-size-lg);
    }
    
    .filter-btn {
        width: 100%;
        max-width: 250px;
    }
    
    .newsletter-form input[type="email"] {
        padding: var(--spacing-md);
    }
    
    .newsletter-form .btn {
        padding: var(--spacing-md) var(--spacing-lg);
        font-size: var(--font-size-sm);
    }
}

/* ===== ESTILOS PARA PÁGINA DE CATÁLOGO ===== */

/* Seção de Catálogos */
.catalogos-section {
    padding: var(--spacing-4xl) 0;
    background-color: var(--white);
}

/* Grid de Catálogos */
.catalogos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
    margin-top: var(--spacing-3xl);
}

/* Cards de Catálogo */
.catalogo-card {
    background-color: var(--white);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    border: 1px solid var(--gray-200);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.catalogo-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: var(--primary-color);
}

.catalogo-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.catalogo-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

.catalogo-card:hover .catalogo-image img {
    transform: scale(1.05);
}

.catalogo-image-text {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--white);
    text-align: center;
    padding: var(--spacing-md);
    background: var(--primary-color);
    transition: all var(--transition-normal);
    border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
}

.catalogo-card:hover .catalogo-image-text {
    background: var(--primary-dark);
    transform: scale(1.02);
}

.catalogo-badge {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    background-color: var(--primary-dark);
    color: var(--white);
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    z-index: 2;
}

.catalogo-content {
    padding: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    flex: 1;
    background-color: var(--white);
    border-radius: 0 0 var(--border-radius-xl) var(--border-radius-xl);
}

.catalogo-content h3 {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--gray-900);
    margin-bottom: var(--spacing-sm);
    line-height: 1.3;
}

.catalogo-content p {
    color: var(--gray-600);
    margin-bottom: var(--spacing-md);
    line-height: 1.5;
    flex: 1;
    font-size: var(--font-size-sm);
}

/* Informações do Catálogo */
.catalogo-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-md);
    background-color: var(--gray-50);
    border-radius: var(--border-radius-md);
}

.catalogo-detail {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    color: var(--gray-700);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.catalogo-detail i {
    color: var(--primary-color);
    font-size: var(--font-size-base);
    width: 16px;
    flex-shrink: 0;
}

/* Características do Catálogo */
.catalogo-features {
    margin-bottom: var(--spacing-lg);
}

.catalogo-features h4 {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: var(--spacing-sm);
    margin-top: var(--spacing-md);
}

.catalogo-features ul {
    list-style: none;
    padding: 0;
}

.catalogo-features li {
    color: var(--gray-700);
    margin-bottom: var(--spacing-xs);
    font-size: var(--font-size-xs);
    line-height: 1.4;
    display: flex;
    align-items: center;
}

.catalogo-features li::before {
    content: "✓";
    color: var(--primary-color);
    font-weight: bold;
    margin-right: var(--spacing-xs);
    font-size: var(--font-size-sm);
}

.catalogo-card .btn {
    margin-top: auto;
    align-self: center;
    width: 100%;
    justify-content: center;
    background-color: var(--primary-color);
    color: var(--white);
    border: none;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--border-radius-md);
    font-weight: 600;
    font-size: var(--font-size-sm);
    transition: all var(--transition-normal);
}

.catalogo-card .btn:hover {
    background-color: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 166, 81, 0.3);
}

/* Seção de Catálogo Personalizado */
.catalogo-personalizado {
    padding: var(--spacing-4xl) 0;
    background-color: var(--gray-50);
}

.catalogo-personalizado-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-4xl);
    align-items: start;
}

.catalogo-info-text h2 {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-lg);
    line-height: 1.2;
}

.catalogo-info-text p {
    font-size: var(--font-size-lg);
    color: var(--gray-600);
    margin-bottom: var(--spacing-2xl);
    line-height: 1.6;
}

/* Vantagens da Personalização */
.vantagens-personalizacao {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
}

.vantagem-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-lg);
}

.vantagem-icon {
    width: 60px;
    height: 60px;
    background: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

.vantagem-content h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: var(--spacing-sm);
}

.vantagem-content p {
    color: var(--gray-600);
    line-height: 1.6;
    font-size: var(--font-size-base);
}

/* Formulário de Catálogo Personalizado */
.form-personalizado {
    background: var(--white);
    padding: var(--spacing-3xl);
    border-radius: var(--border-radius-xl);
    border: 1px solid var(--gray-200);
    box-shadow: var(--shadow-md);
}

.form-personalizado h3 {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-xl);
    text-align: center;
}

.form-catalogo {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.form-catalogo .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
}

.form-catalogo .form-group {
    margin-bottom: 0;
}

.form-catalogo .form-group label {
    display: block;
    margin-bottom: var(--spacing-sm);
    font-weight: 600;
    color: var(--gray-700);
}

.form-catalogo .form-group input,
.form-catalogo .form-group select,
.form-catalogo .form-group textarea {
    width: 100%;
    padding: var(--spacing-md);
    border: 2px solid var(--gray-300);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-base);
    transition: all var(--transition-fast);
    background-color: var(--white);
}

.form-catalogo .form-group input:focus,
.form-catalogo .form-group select:focus,
.form-catalogo .form-group textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 166, 81, 0.1);
}

.form-catalogo .form-group textarea {
    resize: vertical;
    min-height: 120px;
}

.form-catalogo .btn {
    width: 100%;
    justify-content: center;
    padding: var(--spacing-lg) var(--spacing-2xl);
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin-top: var(--spacing-lg);
}

/* Responsividade para Catálogo */
@media (max-width: 1200px) {
    .catalogos-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-lg);
    }
}

@media (max-width: 1023px) {
    .catalogos-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-lg);
    }
    
    .catalogo-personalizado-content {
        grid-template-columns: 1fr;
        gap: var(--spacing-3xl);
    }
    
    .form-catalogo .form-row {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }
}

@media (max-width: 767px) {
    .catalogos-section {
        padding: var(--spacing-2xl) 0;
    }
    
    .catalogos-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
    
    .catalogo-card {
        margin: 0 var(--spacing-sm);
    }
    
    .catalogo-content {
        padding: var(--spacing-lg);
    }
    
    .catalogo-info {
        grid-template-columns: 1fr;
        gap: var(--spacing-sm);
    }
    
    .catalogo-personalizado {
        padding: var(--spacing-2xl) 0;
    }
    
    .catalogo-info-text h2 {
        font-size: 2.5rem;
    }
    
    .form-personalizado {
        padding: var(--spacing-2xl);
    }
    
    .vantagem-item {
        flex-direction: column;
        text-align: center;
        gap: var(--spacing-md);
    }
}

@media (max-width: 480px) {
    .catalogo-card {
        margin: 0;
    }
    
    .catalogo-content {
        padding: var(--spacing-md);
    }
    
    .catalogo-info-text h2 {
        font-size: 2rem;
    }
    
    .form-personalizado {
        padding: var(--spacing-xl);
    }
    
    .vantagem-icon {
        width: 50px;
        height: 50px;
        font-size: var(--font-size-lg);
    }
}

/* ===== ESTILOS ESPECÍFICOS PARA PÁGINA DE PRODUTOS - ALTA PRIORIDADE ===== */

/* Filtros de Produtos - Estilos Específicos */
.filtros-produtos {
    background-color: var(--gray-50) !important;
    padding: var(--spacing-3xl) 0 !important;
}

.filtros-content {
    text-align: center !important;
}

.filtros-content h2 {
    font-size: var(--font-size-2xl) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-xl) !important;
}

.filtros-form {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: var(--spacing-lg) !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.filtro-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.filtro-item label {
    font-weight: 500 !important;
    color: var(--gray-700) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.filtro-item select {
    width: 100% !important;
    padding: var(--spacing-md) !important;
    border: 2px solid var(--gray-300) !important;
    border-radius: var(--border-radius-md) !important;
    background-color: var(--white) !important;
    font-size: var(--font-size-base) !important;
    transition: border-color var(--transition-fast) !important;
}

.filtro-item select:focus {
    outline: none !important;
    border-color: var(--primary-color) !important;
}

/* Categorias de Produtos - Estilos Específicos */
.categorias-produtos {
    padding: var(--spacing-4xl) 0 !important;
}

.categorias-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
}

.categoria-card {
    position: relative !important;
    overflow: hidden !important;
    border-radius: var(--border-radius-lg) !important;
    background-color: var(--white) !important;
    box-shadow: var(--shadow-md) !important;
    transition: all var(--transition-normal) !important;
}

.categoria-card:hover {
    transform: translateY(-10px) !important;
    box-shadow: var(--shadow-xl) !important;
}

.categoria-image {
    position: relative !important;
    height: 200px !important;
    overflow: hidden !important;
}

.categoria-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform var(--transition-normal) !important;
}

.categoria-card:hover .categoria-image img {
    transform: scale(1.1) !important;
}

.categoria-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%) !important;
    opacity: 0 !important;
    transition: opacity var(--transition-normal) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.categoria-card:hover .categoria-overlay {
    opacity: 1 !important;
}

.categoria-info {
    text-align: center !important;
    color: var(--white) !important;
    padding: var(--spacing-lg) !important;
}

.categoria-info h3 {
    font-size: var(--font-size-xl) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.categoria-info p {
    margin-bottom: var(--spacing-lg) !important;
    opacity: 0.9 !important;
}

.categoria-content {
    padding: var(--spacing-xl) !important;
}

.categoria-content h3 {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.categoria-content p {
    color: var(--gray-600) !important;
    margin-bottom: var(--spacing-lg) !important;
    line-height: 1.6 !important;
}

.categoria-features {
    display: flex !important;
    gap: var(--spacing-sm) !important;
    flex-wrap: wrap !important;
}

.feature {
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    padding: var(--spacing-xs) var(--spacing-sm) !important;
    border-radius: var(--border-radius-full) !important;
    font-size: var(--font-size-sm) !important;
    font-weight: 500 !important;
}

/* Seções de Produtos - Estilos Específicos */
.produtos-section {
    padding: var(--spacing-4xl) 0 !important;
}

.produtos-section.section-gray {
    background-color: var(--gray-50) !important;
}

.produtos-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
    margin-top: var(--spacing-3xl) !important;
}

.produto-card {
    background-color: var(--white) !important;
    border-radius: var(--border-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-md) !important;
    transition: all var(--transition-normal) !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.produto-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--shadow-xl) !important;
}

.produto-image {
    position: relative !important;
    height: 250px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: var(--gray-50) !important;
}

.produto-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    transition: transform var(--transition-normal) !important;
    max-height: 230px !important;
}

.produto-card:hover .produto-image img {
    transform: scale(1.05) !important;
}

.produto-badge {
    position: absolute !important;
    top: var(--spacing-sm) !important;
    right: var(--spacing-sm) !important;
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    padding: var(--spacing-xs) var(--spacing-sm) !important;
    border-radius: var(--border-radius-full) !important;
    font-size: var(--font-size-sm) !important;
    font-weight: 500 !important;
}

.produto-content {
    padding: var(--spacing-xl) !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

.produto-content h3 {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.produto-content p {
    color: var(--gray-600) !important;
    margin-bottom: var(--spacing-lg) !important;
    line-height: 1.6 !important;
}

.produto-specs {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: var(--spacing-md) !important;
    margin-bottom: var(--spacing-xl) !important;
}

.spec {
    display: flex !important;
    align-items: center !important;
    gap: var(--spacing-sm) !important;
    color: var(--gray-700) !important;
    font-size: var(--font-size-sm) !important;
}

.spec i {
    color: var(--primary-color) !important;
    width: 16px !important;
}

.produto-actions {
    display: flex !important;
    gap: var(--spacing-sm) !important;
    flex-wrap: wrap !important;
    margin-top: auto !important;
}

/* CTA Section - Estilos Específicos */
.cta-produtos {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%) !important;
    color: var(--white) !important;
    text-align: center !important;
    padding: var(--spacing-4xl) 0 !important;
}

.cta-content h2 {
    font-size: var(--font-size-3xl) !important;
    margin-bottom: var(--spacing-lg) !important;
    color: var(--white) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    font-weight: 700 !important;
}

.cta-content p {
    font-size: var(--font-size-lg) !important;
    margin-bottom: var(--spacing-2xl) !important;
    color: var(--white) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
    max-width: 600px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    opacity: 1 !important;
}

.cta-options {
    display: flex !important;
    gap: var(--spacing-lg) !important;
    justify-content: center !important;
    margin-bottom: var(--spacing-3xl) !important;
    flex-wrap: wrap !important;
}

/* Melhorias específicas para botões na seção CTA */
.cta-produtos .btn-primary {
    background-color: var(--white) !important;
    color: var(--primary-color) !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    border: 2px solid var(--white) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
}

.cta-produtos .btn-primary:hover {
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    border-color: var(--white) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}

.cta-produtos .btn-outline {
    background-color: transparent !important;
    color: var(--white) !important;
    border: 2px solid var(--white) !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.cta-produtos .btn-outline:hover {
    background-color: var(--white) !important;
    color: var(--primary-color) !important;
    text-shadow: none !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}

.cta-stats {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.stat {
    text-align: center !important;
}

.stat-number {
    font-size: var(--font-size-3xl) !important;
    font-weight: 700 !important;
    margin-bottom: var(--spacing-sm) !important;
    color: var(--white) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

.stat-label {
    font-size: var(--font-size-base) !important;
    color: var(--white) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
    opacity: 1 !important;
}

/* Estilos adicionais para garantir contraste na seção CTA */
.cta-produtos h1,
.cta-produtos h2,
.cta-produtos h3,
.cta-produtos h4,
.cta-produtos h5,
.cta-produtos h6,
.cta-produtos p,
.cta-produtos span,
.cta-produtos div:not(.product-card-footer),
.cta-produtos .stat-number,
.cta-produtos .stat-label {
    color: var(--white) !important;
}

.cta-produtos .cta-content {
    position: relative;
    z-index: 2;
}

.cta-produtos .cta-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.1);
    z-index: -1;
    border-radius: var(--border-radius-lg);
}

/* Melhorias para ícones na seção CTA */
.cta-produtos .btn i {
    color: inherit !important;
    text-shadow: none !important;
}

/* Melhorias para links na seção CTA */
.cta-produtos a:not(.btn) {
    color: var(--white) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

.cta-produtos a:not(.btn):hover {
    color: var(--primary-light) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Modal - Estilos Específicos */
.modal {
    display: none !important;
    position: fixed !important;
    z-index: 1000 !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.modal-content {
    background-color: var(--white) !important;
    margin: 5% auto !important;
    padding: var(--spacing-2xl) !important;
    border-radius: var(--border-radius-lg) !important;
    width: 90% !important;
    max-width: 800px !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
    position: relative !important;
}

.modal-close {
    position: absolute !important;
    top: var(--spacing-lg) !important;
    right: var(--spacing-xl) !important;
    font-size: var(--font-size-2xl) !important;
    cursor: pointer !important;
    color: var(--gray-600) !important;
    transition: color var(--transition-fast) !important;
}

.modal-close:hover {
    color: var(--gray-800) !important;
}

.produto-detalhes {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--spacing-2xl) !important;
}

.produto-detalhes-image img {
    width: 100% !important;
    height: auto !important;
    border-radius: var(--border-radius-md) !important;
}

.produto-detalhes-info h2 {
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-md) !important;
}

.produto-detalhes-info h3 {
    color: var(--gray-700) !important;
    margin: var(--spacing-lg) 0 var(--spacing-md) !important;
}

.produto-detalhes-info ul {
    list-style: none !important;
    padding: 0 !important;
    margin-bottom: var(--spacing-xl) !important;
}

.produto-detalhes-info li {
    padding: var(--spacing-sm) 0 !important;
    border-bottom: 1px solid var(--gray-200) !important;
    color: var(--gray-600) !important;
}

.produto-detalhes-info li:before {
    content: "✓" !important;
    color: var(--primary-color) !important;
    font-weight: bold !important;
    margin-right: var(--spacing-sm) !important;
}

.produto-detalhes-actions {
    display: flex !important;
    gap: var(--spacing-md) !important;
    flex-wrap: wrap !important;
}

/* Responsividade para Produtos - Estilos Específicos */
@media (max-width: 1023px) {
    .filtros-form {
        grid-template-columns: 1fr !important;
    }
    
    .categorias-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    }
    
    .produtos-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    }
    
    .cta-options {
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .produto-detalhes {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 767px) {
    .filtros-produtos {
        padding: var(--spacing-2xl) 0 !important;
    }
    
    .categorias-produtos,
    .produtos-section {
        padding: var(--spacing-2xl) 0 !important;
    }
    
    .categorias-grid {
        grid-template-columns: 1fr !important;
    }
    
    .produtos-grid {
        grid-template-columns: 1fr !important;
    }
    
    .cta-stats {
        grid-template-columns: 1fr !important;
    }
    
    .modal-content {
        margin: 10% auto !important;
        padding: var(--spacing-xl) !important;
        width: 95% !important;
    }
}

@media (max-width: 480px) {
    .filtros-content h2 {
        font-size: var(--font-size-xl) !important;
    }
    
    .categoria-content,
    .produto-content {
        padding: var(--spacing-lg) !important;
    }
    
    .produto-specs {
        grid-template-columns: 1fr !important;
    }
    
    .produto-actions {
        flex-direction: column !important;
    }
    
    .cta-options {
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .cta-options .btn {
        width: 100% !important;
        max-width: 300px !important;
    }
}

/* ===== ESTILOS ESPECÍFICOS PARA PÁGINAS INSTITUCIONAIS - ALTA PRIORIDADE ===== */

/* ===== PÁGINA POLÍTICA DE PRIVACIDADE ===== */

/* Seção de Política */
.politica-section {
    padding: var(--spacing-4xl) 0 !important;
    background-color: var(--white) !important;
}

.politica-content {
    max-width: 900px !important;
    margin: 0 auto !important;
}

.politica-intro {
    text-align: center !important;
    margin-bottom: var(--spacing-4xl) !important;
}

.politica-intro h2 {
    font-size: var(--font-size-3xl) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.politica-data {
    color: var(--gray-500) !important;
    font-size: var(--font-size-sm) !important;
    margin-bottom: var(--spacing-lg) !important;
}

.politica-intro p {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-600) !important;
    line-height: 1.7 !important;
}

.politica-secoes {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--spacing-3xl) !important;
}

.politica-secao {
    background-color: var(--gray-50) !important;
    padding: var(--spacing-2xl) !important;
    border-radius: var(--border-radius-lg) !important;
    border-left: 4px solid var(--primary-color) !important;
}

.politica-secao h3 {
    font-size: var(--font-size-xl) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-lg) !important;
    display: flex !important;
    align-items: center !important;
    gap: var(--spacing-md) !important;
}

.politica-secao h3 i {
    color: var(--primary-color) !important;
    width: 24px !important;
}

.politica-secao p {
    color: var(--gray-700) !important;
    line-height: 1.6 !important;
    margin-bottom: var(--spacing-md) !important;
}

.politica-secao ul {
    list-style: none !important;
    padding: 0 !important;
}

.politica-secao li {
    padding: var(--spacing-sm) 0 !important;
    border-bottom: 1px solid var(--gray-200) !important;
    color: var(--gray-700) !important;
    line-height: 1.6 !important;
}

.politica-secao li:last-child {
    border-bottom: none !important;
}

.politica-secao li strong {
    color: var(--primary-color) !important;
}

.contato-privacidade {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: var(--spacing-lg) !important;
    margin-top: var(--spacing-lg) !important;
}

.contato-item {
    display: flex !important;
    align-items: flex-start !important;
    gap: var(--spacing-md) !important;
    padding: var(--spacing-lg) !important;
    background-color: var(--white) !important;
    border-radius: var(--border-radius-md) !important;
    box-shadow: var(--shadow-sm) !important;
}

.contato-item i {
    color: var(--primary-color) !important;
    font-size: var(--font-size-lg) !important;
    margin-top: 2px !important;
}

.contato-item strong {
    color: var(--gray-800) !important;
    display: block !important;
    margin-bottom: var(--spacing-xs) !important;
}

.contato-item a {
    color: var(--primary-color) !important;
    text-decoration: none !important;
}

.contato-item a:hover {
    text-decoration: underline !important;
}

/* ===== PÁGINA TRABALHE CONOSCO ===== */

/* Seção de Benefícios */
.beneficios-section {
    padding: var(--spacing-4xl) 0 !important;
    background-color: var(--gray-50) !important;
}

.beneficios-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
    margin-top: var(--spacing-3xl) !important;
}

.beneficio-card {
    background-color: var(--white) !important;
    padding: var(--spacing-2xl) !important;
    border-radius: var(--border-radius-lg) !important;
    text-align: center !important;
    box-shadow: var(--shadow-md) !important;
    transition: all var(--transition-normal) !important;
}

.beneficio-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--shadow-xl) !important;
}

.beneficio-icon {
    width: 80px !important;
    height: 80px !important;
    background-color: var(--primary-color) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto var(--spacing-lg) !important;
}

.beneficio-icon i {
    font-size: var(--font-size-2xl) !important;
    color: var(--white) !important;
}

.beneficio-card h3 {
    font-size: var(--font-size-xl) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-lg) !important;
}

.beneficio-card p {
    color: var(--gray-600) !important;
    line-height: 1.7 !important;
}

/* Seção de Cultura */
.cultura-section {
    padding: var(--spacing-4xl) 0 !important;
    background-color: var(--white) !important;
}

.cultura-content {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--spacing-4xl) !important;
    align-items: center !important;
}

.cultura-text h2 {
    font-size: var(--font-size-3xl) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-lg) !important;
}

.cultura-text p {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-600) !important;
    line-height: 1.7 !important;
    margin-bottom: var(--spacing-3xl) !important;
}

.valores-cultura {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--spacing-xl) !important;
}

.valor-item h4 {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
    display: flex !important;
    align-items: center !important;
    gap: var(--spacing-sm) !important;
}

.valor-item h4 i {
    color: var(--primary-color) !important;
    width: 20px !important;
}

.valor-item p {
    color: var(--gray-600) !important;
    line-height: 1.6 !important;
    font-size: var(--font-size-base) !important;
}

.cultura-image {
    text-align: center !important;
}

.cultura-image img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: var(--border-radius-lg) !important;
    box-shadow: var(--shadow-lg) !important;
}

/* Seção de Vagas */
.vagas-section {
    padding: var(--spacing-4xl) 0 !important;
    background-color: var(--gray-50) !important;
}

.vagas-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
    margin-top: var(--spacing-3xl) !important;
}

.vaga-card {
    background-color: var(--white) !important;
    padding: var(--spacing-2xl) !important;
    border-radius: var(--border-radius-lg) !important;
    box-shadow: var(--shadow-md) !important;
    transition: all var(--transition-normal) !important;
}

.vaga-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--shadow-lg) !important;
}

.vaga-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: var(--spacing-lg) !important;
}

.vaga-header h3 {
    font-size: var(--font-size-xl) !important;
    color: var(--gray-800) !important;
}

.vaga-tipo {
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    padding: var(--spacing-xs) var(--spacing-sm) !important;
    border-radius: var(--border-radius-full) !important;
    font-size: var(--font-size-sm) !important;
    font-weight: 500 !important;
}

.vaga-info {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: var(--spacing-md) !important;
    margin-bottom: var(--spacing-lg) !important;
}

.vaga-detalhe {
    display: flex !important;
    align-items: center !important;
    gap: var(--spacing-sm) !important;
    color: var(--gray-600) !important;
    font-size: var(--font-size-sm) !important;
}

.vaga-detalhe i {
    color: var(--primary-color) !important;
    width: 16px !important;
}

.vaga-descricao {
    margin-bottom: var(--spacing-xl) !important;
    display: none !important;
}

.vaga-descricao h4 {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
    margin-top: var(--spacing-lg) !important;
}

.vaga-descricao ul {
    list-style: none !important;
    padding: 0 !important;
}

.vaga-descricao li {
    padding: var(--spacing-xs) 0 !important;
    color: var(--gray-600) !important;
    line-height: 1.6 !important;
    position: relative !important;
    padding-left: var(--spacing-md) !important;
}

.vaga-descricao li::before {
    content: "•" !important;
    color: var(--primary-color) !important;
    position: absolute !important;
    left: 0 !important;
}

.vaga-actions {
    display: flex !important;
    gap: var(--spacing-sm) !important;
    flex-wrap: wrap !important;
}

/* Seção de Processo */
.processo-section {
    padding: var(--spacing-4xl) 0 !important;
    background-color: var(--white) !important;
}

.processo-timeline {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: var(--spacing-2xl) !important;
    margin-top: var(--spacing-3xl) !important;
}

.processo-item {
    text-align: center !important;
    position: relative !important;
}

.processo-numero {
    width: 60px !important;
    height: 60px !important;
    background-color: var(--primary-color) !important;
    color: var(--white) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: var(--font-size-xl) !important;
    font-weight: 700 !important;
    margin: 0 auto var(--spacing-lg) !important;
}

.processo-content h3 {
    font-size: var(--font-size-lg) !important;
    color: var(--gray-800) !important;
    margin-bottom: var(--spacing-sm) !important;
}

.processo-content p {
    color: var(--gray-600) !important;
    line-height: 1.6 !important;
}

/* Responsividade para Páginas Institucionais */
@media (max-width: 1023px) {
    .cultura-content {
        grid-template-columns: 1fr !important;
        gap: var(--spacing-3xl) !important;
    }
    
    .valores-cultura {
        grid-template-columns: 1fr !important;
    }
    
    .beneficios-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    }
    
    .vagas-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    }
    
    .processo-timeline {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
    }
    
    .contato-privacidade {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 767px) {
    .politica-section,
    .beneficios-section,
    .cultura-section,
    .vagas-section,
    .processo-section {
        padding: var(--spacing-2xl) 0 !important;
    }
    
    .politica-secao {
        padding: var(--spacing-xl) !important;
    }
    
    .beneficios-grid {
        grid-template-columns: 1fr !important;
    }
    
    .vagas-grid {
        grid-template-columns: 1fr !important;
    }
    
    .processo-timeline {
        grid-template-columns: 1fr !important;
    }
    
    .vaga-info {
        grid-template-columns: 1fr !important;
    }
    
    .vaga-actions {
        flex-direction: column !important;
    }
    
    .vaga-actions .btn {
        width: 100% !important;
    }
}

@media (max-width: 480px) {
    .politica-intro h2 {
        font-size: var(--font-size-2xl) !important;
    }
    
    .cultura-text h2 {
        font-size: var(--font-size-2xl) !important;
    }
    
    .beneficio-card,
    .vaga-card {
        padding: var(--spacing-xl) !important;
    }
    
    .contato-item {
        flex-direction: column !important;
        text-align: center !important;
    }
}

/* ===== RESPONSIVIDADE PARA HERÓIS COM BACKGROUND VERDE ===== */

@media (max-width: 1023px) {
    .hero-treinamentos,
    .hero-blog,
    .hero-catalogo,
    .hero-produtos,
    .hero-empresa,
    .hero-politica,
    .hero-trabalhe,
    .hero-racks-padrao,
    .hero-acessorios,
    .hero-caixas,
    .hero-racks-economic,
    .hero-rack-piso,
    .hero-rack-parede,
    .hero-bandeja-fixa,
    .hero-bandeja-movel,
    .hero-frente-falsa,
    .hero-kit-cooler,
    .hero-kit-porca,
    .hero-kit-rodizio,
    .hero-organizadores,
    .hero-reguas,
    .hero-caixa-horizontal,
    .hero-caixa-vertical,
    .hero-caixa-customizada,
    .hero-economic-convencional,
    .hero-economic-plus,
    .hero-economic-ventilada {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%) !important;
    }
    
    .hero-treinamentos .hero-title-main,
    .hero-blog .hero-title-main,
    .hero-catalogo .hero-title-main,
    .hero-produtos .hero-title-main,
    .hero-empresa .hero-title-main,
    .hero-politica .hero-title-main,
    .hero-trabalhe .hero-title-main,
    .hero-racks-padrao .hero-title-main,
    .hero-acessorios .hero-title-main,
    .hero-caixas .hero-title-main,
    .hero-racks-economic .hero-title-main,
    .hero-rack-piso .hero-title-main,
    .hero-rack-parede .hero-title-main,
    .hero-bandeja-fixa .hero-title-main,
    .hero-bandeja-movel .hero-title-main,
    .hero-frente-falsa .hero-title-main,
    .hero-kit-cooler .hero-title-main,
    .hero-kit-porca .hero-title-main,
    .hero-kit-rodizio .hero-title-main,
    .hero-organizadores .hero-title-main,
    .hero-reguas .hero-title-main,
    .hero-caixa-horizontal .hero-title-main,
    .hero-caixa-vertical .hero-title-main,
    .hero-caixa-customizada .hero-title-main,
    .hero-economic-convencional .hero-title-main,
    .hero-economic-plus .hero-title-main,
    .hero-economic-ventilada .hero-title-main {
        font-size: 2.5rem !important;
    }
    
    .hero-treinamentos .hero-title-sub,
    .hero-blog .hero-title-sub,
    .hero-catalogo .hero-title-sub,
    .hero-produtos .hero-title-sub,
    .hero-empresa .hero-title-sub,
    .hero-politica .hero-title-sub,
    .hero-trabalhe .hero-title-sub,
    .hero-racks-padrao .hero-title-sub,
    .hero-acessorios .hero-title-sub,
    .hero-caixas .hero-title-sub,
    .hero-racks-economic .hero-title-sub,
    .hero-rack-piso .hero-title-sub,
    .hero-rack-parede .hero-title-sub,
    .hero-bandeja-fixa .hero-title-sub,
    .hero-bandeja-movel .hero-title-sub,
    .hero-frente-falsa .hero-title-sub,
    .hero-kit-cooler .hero-title-sub,
    .hero-kit-porca .hero-title-sub,
    .hero-kit-rodizio .hero-title-sub,
    .hero-organizadores .hero-title-sub,
    .hero-reguas .hero-title-sub,
    .hero-caixa-horizontal .hero-title-sub,
    .hero-caixa-vertical .hero-title-sub,
    .hero-caixa-customizada .hero-title-sub,
    .hero-economic-convencional .hero-title-sub,
    .hero-economic-plus .hero-title-sub,
    .hero-economic-ventilada .hero-title-sub {
        font-size: 1.25rem !important;
    }
}

@media (max-width: 767px) {
    .hero-treinamentos,
    .hero-blog,
    .hero-catalogo,
    .hero-produtos,
    .hero-empresa,
    .hero-politica,
    .hero-trabalhe,
    .hero-racks-padrao,
    .hero-acessorios,
    .hero-caixas,
    .hero-racks-economic,
    .hero-rack-piso,
    .hero-rack-parede,
    .hero-bandeja-fixa,
    .hero-bandeja-movel,
    .hero-frente-falsa,
    .hero-kit-cooler,
    .hero-kit-porca,
    .hero-kit-rodizio,
    .hero-organizadores,
    .hero-reguas,
    .hero-caixa-horizontal,
    .hero-caixa-vertical,
    .hero-caixa-customizada,
    .hero-economic-convencional,
    .hero-economic-plus,
    .hero-economic-ventilada {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%) !important;
        height: 400px !important;
    }
    
    .hero-treinamentos .hero-title-main,
    .hero-blog .hero-title-main,
    .hero-catalogo .hero-title-main,
    .hero-produtos .hero-title-main,
    .hero-empresa .hero-title-main,
    .hero-politica .hero-title-main,
    .hero-trabalhe .hero-title-main,
    .hero-racks-padrao .hero-title-main,
    .hero-acessorios .hero-title-main,
    .hero-caixas .hero-title-main,
    .hero-racks-economic .hero-title-main,
    .hero-rack-piso .hero-title-main,
    .hero-rack-parede .hero-title-main,
    .hero-bandeja-fixa .hero-title-main,
    .hero-bandeja-movel .hero-title-main,
    .hero-frente-falsa .hero-title-main,
    .hero-kit-cooler .hero-title-main,
    .hero-kit-porca .hero-title-main,
    .hero-kit-rodizio .hero-title-main,
    .hero-organizadores .hero-title-main,
    .hero-reguas .hero-title-main,
    .hero-caixa-horizontal .hero-title-main,
    .hero-caixa-vertical .hero-title-main,
    .hero-caixa-customizada .hero-title-main,
    .hero-economic-convencional .hero-title-main,
    .hero-economic-plus .hero-title-main,
    .hero-economic-ventilada .hero-title-main {
        font-size: 2rem !important;
    }
    
    .hero-treinamentos .hero-title-sub,
    .hero-blog .hero-title-sub,
    .hero-catalogo .hero-title-sub,
    .hero-produtos .hero-title-sub,
    .hero-empresa .hero-title-sub,
    .hero-politica .hero-title-sub,
    .hero-trabalhe .hero-title-sub,
    .hero-racks-padrao .hero-title-sub,
    .hero-acessorios .hero-title-sub,
    .hero-caixas .hero-title-sub,
    .hero-racks-economic .hero-title-sub,
    .hero-rack-piso .hero-title-sub,
    .hero-rack-parede .hero-title-sub,
    .hero-bandeja-fixa .hero-title-sub,
    .hero-bandeja-movel .hero-title-sub,
    .hero-frente-falsa .hero-title-sub,
    .hero-kit-cooler .hero-title-sub,
    .hero-kit-porca .hero-title-sub,
    .hero-kit-rodizio .hero-title-sub,
    .hero-organizadores .hero-title-sub,
    .hero-reguas .hero-title-sub,
    .hero-caixa-horizontal .hero-title-sub,
    .hero-caixa-vertical .hero-title-sub,
    .hero-caixa-customizada .hero-title-sub,
    .hero-economic-convencional .hero-title-sub,
    .hero-economic-plus .hero-title-sub,
    .hero-economic-ventilada .hero-title-sub {
        font-size: 1.1rem !important;
    }
    
    .hero-treinamentos .hero-description,
    .hero-blog .hero-description,
    .hero-catalogo .hero-description,
    .hero-produtos .hero-description,
    .hero-empresa .hero-description,
    .hero-politica .hero-description,
    .hero-trabalhe .hero-description,
    .hero-racks-padrao .hero-description,
    .hero-acessorios .hero-description,
    .hero-caixas .hero-description,
    .hero-racks-economic .hero-description,
    .hero-rack-piso .hero-description,
    .hero-rack-parede .hero-description,
    .hero-bandeja-fixa .hero-description,
    .hero-bandeja-movel .hero-description,
    .hero-frente-falsa .hero-description,
    .hero-kit-cooler .hero-description,
    .hero-kit-porca .hero-description,
    .hero-kit-rodizio .hero-description,
    .hero-organizadores .hero-description,
    .hero-reguas .hero-description,
    .hero-caixa-horizontal .hero-description,
    .hero-caixa-vertical .hero-description,
    .hero-caixa-customizada .hero-description,
    .hero-economic-convencional .hero-description,
    .hero-economic-plus .hero-description,
    .hero-economic-ventilada .hero-description {
        font-size: 0.9rem !important;
    }
}

@media (max-width: 480px) {
    .hero-treinamentos,
    .hero-blog,
    .hero-catalogo,
    .hero-produtos,
    .hero-empresa,
    .hero-politica,
    .hero-trabalhe,
    .hero-racks-padrao,
    .hero-acessorios,
    .hero-caixas,
    .hero-racks-economic,
    .hero-rack-piso,
    .hero-rack-parede,
    .hero-bandeja-fixa,
    .hero-bandeja-movel,
    .hero-frente-falsa,
    .hero-kit-cooler,
    .hero-kit-porca,
    .hero-kit-rodizio,
    .hero-organizadores,
    .hero-reguas,
    .hero-caixa-horizontal,
    .hero-caixa-vertical,
    .hero-caixa-customizada,
    .hero-economic-convencional,
    .hero-economic-plus,
    .hero-economic-ventilada {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%) !important;
        height: 350px !important;
    }
    
    .hero-treinamentos .hero-title-main,
    .hero-blog .hero-title-main,
    .hero-catalogo .hero-title-main,
    .hero-produtos .hero-title-main,
    .hero-empresa .hero-title-main,
    .hero-politica .hero-title-main,
    .hero-trabalhe .hero-title-main,
    .hero-racks-padrao .hero-title-main,
    .hero-acessorios .hero-title-main,
    .hero-caixas .hero-title-main,
    .hero-racks-economic .hero-title-main,
    .hero-rack-piso .hero-title-main,
    .hero-rack-parede .hero-title-main,
    .hero-bandeja-fixa .hero-title-main,
    .hero-bandeja-movel .hero-title-main,
    .hero-frente-falsa .hero-title-main,
    .hero-kit-cooler .hero-title-main,
    .hero-kit-porca .hero-title-main,
    .hero-kit-rodizio .hero-title-main,
    .hero-organizadores .hero-title-main,
    .hero-reguas .hero-title-main,
    .hero-caixa-horizontal .hero-title-main,
    .hero-caixa-vertical .hero-title-main,
    .hero-caixa-customizada .hero-title-main,
    .hero-economic-convencional .hero-title-main,
    .hero-economic-plus .hero-title-main,
    .hero-economic-ventilada .hero-title-main {
        font-size: 1.75rem !important;
    }
    
    .hero-treinamentos .hero-title-sub,
    .hero-blog .hero-title-sub,
    .hero-catalogo .hero-title-sub,
    .hero-produtos .hero-title-sub,
    .hero-empresa .hero-title-sub,
    .hero-politica .hero-title-sub,
    .hero-trabalhe .hero-title-sub,
    .hero-racks-padrao .hero-title-sub,
    .hero-acessorios .hero-title-sub,
    .hero-caixas .hero-title-sub,
    .hero-racks-economic .hero-title-sub,
    .hero-rack-piso .hero-title-sub,
    .hero-rack-parede .hero-title-sub,
    .hero-bandeja-fixa .hero-title-sub,
    .hero-bandeja-movel .hero-title-sub,
    .hero-frente-falsa .hero-title-sub,
    .hero-kit-cooler .hero-title-sub,
    .hero-kit-porca .hero-title-sub,
    .hero-kit-rodizio .hero-title-sub,
    .hero-organizadores .hero-title-sub,
    .hero-reguas .hero-title-sub,
    .hero-caixa-horizontal .hero-title-sub,
    .hero-caixa-vertical .hero-title-sub,
    .hero-caixa-customizada .hero-title-sub,
    .hero-economic-convencional .hero-title-sub,
    .hero-economic-plus .hero-title-sub,
    .hero-economic-ventilada .hero-title-sub {
        font-size: 1rem !important;
    }
    
    .hero-treinamentos .hero-description,
    .hero-blog .hero-description,
    .hero-catalogo .hero-description,
    .hero-produtos .hero-description,
    .hero-empresa .hero-description,
    .hero-politica .hero-description,
    .hero-trabalhe .hero-description,
    .hero-racks-padrao .hero-description,
    .hero-acessorios .hero-description,
    .hero-caixas .hero-description,
    .hero-racks-economic .hero-description,
    .hero-rack-piso .hero-description,
    .hero-rack-parede .hero-description,
    .hero-bandeja-fixa .hero-description,
    .hero-bandeja-movel .hero-description,
    .hero-frente-falsa .hero-description,
    .hero-kit-cooler .hero-description,
    .hero-kit-porca .hero-description,
    .hero-kit-rodizio .hero-description,
    .hero-organizadores .hero-description,
    .hero-reguas .hero-description,
    .hero-caixa-horizontal .hero-description,
    .hero-caixa-vertical .hero-description,
    .hero-caixa-customizada .hero-description,
    .hero-economic-convencional .hero-description,
    .hero-economic-plus .hero-description,
    .hero-economic-ventilada .hero-description {
        font-size: 0.85rem !important;
    }
}

/* ===== HERO SECTION REMOVIDO ===== */


/* ===== HERO BANNER FIXO PARA PÁGINAS NÃO-INDEX ===== */
.hero:not(.hero-index) {
    position: relative;
    height: 500px;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.hero:not(.hero-index) .hero-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.hero:not(.hero-index) .hero-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.hero:not(.hero-index) .hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 100%);
    z-index: 2;
}

.hero:not(.hero-index) .hero-content {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    text-align: center;
}

.hero:not(.hero-index) .hero-text {
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.hero:not(.hero-index) .hero-title {
    margin-bottom: var(--spacing-lg);
    color: var(--white);
}

.hero:not(.hero-index) .hero-title-main {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.hero:not(.hero-index) .hero-title-sub {
    display: block;
    font-size: 1.25rem;
    font-weight: 400;
    opacity: 0.9;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.hero:not(.hero-index) .hero-description {
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: var(--spacing-lg);
    color: var(--white);
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.hero:not(.hero-index) .hero-buttons {
    display: flex;
    gap: var(--spacing-md);
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsividade para banners fixos */
@media (max-width: 768px) {
    .hero:not(.hero-index) {
        height: 400px;
    }
    
    .hero:not(.hero-index) .hero-title-main {
        font-size: 2rem;
    }
    
    .hero:not(.hero-index) .hero-title-sub {
        font-size: 1.1rem;
    }
    
    .hero:not(.hero-index) .hero-description {
        font-size: 1rem;
    }
    
    .hero:not(.hero-index) .hero-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    /* Responsividade específica para empresa */
    .hero-empresa {
        height: 400px;
    }
    
    .hero-empresa .hero-content {
        padding: 0 1rem;
    }
    
    .hero-empresa .hero-title-main {
        font-size: 2rem;
    }
    
    .hero-empresa .hero-title-sub {
        font-size: 1.1rem;
    }
    
    .hero-empresa .hero-description {
        font-size: 1rem;
    }
    
    .hero-empresa .hero-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    /* Responsividade para história */
    .historia-content {
        grid-template-columns: 1fr;
        gap: var(--spacing-2xl);
    }
    
    .historia-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Responsividade para depoimentos */
    .depoimentos-slider {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
    
    .depoimento-card {
        padding: var(--spacing-lg);
    }
}

@media (max-width: 480px) {
    .hero:not(.hero-index) {
        height: 350px;
    }
    
    .hero:not(.hero-index) .hero-title-main {
        font-size: 1.75rem;
    }
    
    .hero:not(.hero-index) .hero-title-sub {
        font-size: 1rem;
    }
    
    .hero:not(.hero-index) .hero-description {
        font-size: 0.9rem;
    }
    
    /* Responsividade específica para empresa */
    .hero-empresa {
        height: 350px;
    }
    
    .hero-empresa .hero-content {
        padding: 0 0.5rem;
    }
    
    .hero-empresa .hero-title-main {
        font-size: 1.75rem;
    }
    
    .hero-empresa .hero-title-sub {
        font-size: 1rem;
    }
    
    .hero-empresa .hero-description {
        font-size: 0.9rem;
    }
    
    /* Responsividade para história */
    .historia-stats {
        grid-template-columns: 1fr;
    }
}

/* ===== ESTILIZAÇÃO ESPECÍFICA PARA RACKS-PADRAO-19.HTML ===== */

/* Seção de introdução */
.introducao-section {
    padding: var(--spacing-3xl) 0;
    background-color: var(--white);
}

.introducao-content {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: var(--spacing-3xl);
    align-items: start;
}

.introducao-text h3 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-xl);
}

.introducao-text ul {
    list-style: none;
    padding: 0;
}

.introducao-text li {
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--gray-200);
    color: var(--gray-600);
}

.introducao-text li:last-child {
    border-bottom: none;
}

.introducao-text strong {
    color: var(--gray-800);
}

.introducao-image img {
    width: 100%;
    height: auto;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-lg);
}

/* Seção de especificações */
.especificacoes-section {
    padding: var(--spacing-3xl) 0;
    background-color: var(--gray-50);
}

.especificacoes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-2xl);
}

.especificacao-item {
    background: var(--white);
    padding: var(--spacing-2xl);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-md);
    text-align: center;
    transition: transform var(--transition-normal);
}

.especificacao-item:hover {
    transform: translateY(-5px);
}

.especificacao-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto var(--spacing-lg);
    background: linear-gradient(135deg, var(--primary-color), var(--primary-light));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: 2rem;
}

.especificacao-item h3 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-lg);
}

.especificacao-item p {
    color: var(--gray-600);
    line-height: 1.6;
}

/* Seção de aplicações */
.aplicacoes-section {
    padding: var(--spacing-3xl) 0;
    background-color: var(--white);
}

.aplicacoes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-2xl);
    margin-top: var(--spacing-2xl);
}

.aplicacao-card {
    background: var(--white);
    padding: var(--spacing-2xl);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-md);
    text-align: center;
    border: 2px solid transparent;
    transition: all var(--transition-normal);
}

.aplicacao-card:hover {
    border-color: var(--primary-color);
    transform: translateY(-5px);
}

.aplicacao-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto var(--spacing-lg);
    background: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: 1.5rem;
}

.aplicacao-card h3 {
    color: var(--gray-800);
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-lg);
}

.aplicacao-card p {
    color: var(--gray-600);
    line-height: 1.6;
}

/* Responsividade para racks-padrao-19 */
@media (max-width: 768px) {
    .introducao-content {
        grid-template-columns: 1fr;
        gap: var(--spacing-2xl);
    }
    
    .especificacoes-grid {
        grid-template-columns: 1fr;
    }
    
    .aplicacoes-grid {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

/* ===== ESTILIZAÇÃO ESPECÍFICA PARA BREADCRUMB EM RACKS-PADRAO-19.HTML ===== */

/* Garantir que o breadcrumb seja visível e bem posicionado */
.hero-racks-padrao-19 + .breadcrumb {
    position: relative;
    z-index: 10;
    margin-top: 0;
}

/* Ajustar espaçamento entre hero e breadcrumb */
.hero-racks-padrao-19 + .breadcrumb .container {
    padding: var(--spacing-md) var(--spacing-lg);
}

/* Melhorar visibilidade do breadcrumb */
.hero-racks-padrao-19 + .breadcrumb {
    background-color: var(--white);
    border-bottom: 2px solid var(--gray-200);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ===== BREADCRUMB ===== */

.breadcrumb {
    background-color: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
    padding: var(--spacing-md) 0;
}

.breadcrumb .container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
}

.breadcrumb-list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--font-size-sm);
}

.breadcrumb-list li {
    display: flex;
    align-items: center;
    color: var(--gray-600);
}

.breadcrumb-list li:not(:last-child)::after {
    content: '/';
    margin: 0 var(--spacing-sm);
    color: var(--gray-400);
}

.breadcrumb-list a {
    color: var(--primary-color);
    text-decoration: none;
    transition: color var(--transition-normal);
}

.breadcrumb-list a:hover {
    color: var(--primary-dark);
    text-decoration: underline;
}

.breadcrumb-list li:last-child {
    color: var(--gray-800);
    font-weight: 500;
}

/* Responsividade do breadcrumb */
@media (max-width: 768px) {
    .breadcrumb {
        padding: var(--spacing-sm) 0;
    }
    
    .breadcrumb .container {
        padding: 0 var(--spacing-md);
    }
    
    .breadcrumb-list {
        font-size: var(--font-size-xs);
    }
    
    .breadcrumb-list li:not(:last-child)::after {
        margin: 0 var(--spacing-xs);
    }
}

/* ===== SEÇÃO MISSÃO, VISÃO E VALORES - BACKGROUND VERDE ===== */

.valores-section {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: var(--white);
    padding: var(--spacing-4xl) 0;
    position: relative;
}

.valores-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%);
    pointer-events: none;
}

.valores-section .section-header {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
    position: relative;
    z-index: 1;
}

.valores-section .section-title {
    color: var(--white);
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: var(--spacing-lg);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.valores-section .section-subtitle {
    color: var(--white);
    font-size: var(--font-size-lg);
    opacity: 0.95;
    max-width: 600px;
    margin: 0 auto;
}

.valores-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-2xl);
    position: relative;
    z-index: 1;
}

.valor-card {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--border-radius-xl);
    padding: var(--spacing-2xl);
    text-align: center;
    transition: all var(--transition-normal);
    position: relative;
    overflow: hidden;
}

.valor-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--white) 0%, rgba(255, 255, 255, 0.7) 100%);
}

.valor-card:hover {
    transform: translateY(-8px);
    background: rgba(255, 255, 255, 0.15);
    border-color: var(--white);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2);
}

.valor-icon {
    width: 80px;
    height: 80px;
    background: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xl);
    font-size: var(--font-size-2xl);
    color: var(--primary-color);
    transition: all var(--transition-normal);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.valor-card:hover .valor-icon {
    transform: scale(1.1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    background: var(--primary-light);
    color: var(--white);
}

.valor-card h3 {
    color: var(--white);
    font-size: var(--font-size-xl);
    font-weight: 600;
    margin-bottom: var(--spacing-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.valor-card p {
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
    margin-bottom: var(--spacing-md);
}

.valor-card ul {
    list-style: none;
    padding: 0;
    text-align: left;
}

.valor-card li {
    color: rgba(255, 255, 255, 0.9);
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    line-height: 1.5;
}

.valor-card li:last-child {
    border-bottom: none;
}

.valor-card strong {
    color: var(--white);
    font-weight: 600;
}

/* Responsividade para valores-section */
@media (max-width: 768px) {
    .valores-section {
        padding: var(--spacing-3xl) 0;
    }
    
    .valores-section .section-title {
        font-size: 2.5rem;
    }
    
    .valores-section .section-subtitle {
        font-size: var(--font-size-base);
        padding: 0 var(--spacing-md);
    }
    
    .valores-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-xl);
        padding: 0 var(--spacing-md);
    }
    
    .valor-card {
        padding: var(--spacing-xl);
    }
    
    .valor-icon {
        width: 70px;
        height: 70px;
        font-size: var(--font-size-xl);
    }
}

@media (max-width: 480px) {
    .valores-section .section-title {
        font-size: 2rem;
    }
    
    .valores-section .section-subtitle {
        font-size: var(--font-size-sm);
    }
    
    .valor-card {
        padding: var(--spacing-lg);
    }
    
    .valor-icon {
        width: 60px;
        height: 60px;
        font-size: var(--font-size-lg);
    }
}





/*
PRODUCTS
*/
.products .content{padding: 30px 0;}

/*products => heading*/
.products .products_heading{margin-bottom: 10px;}
.products .products_heading h1{    font-size: 1.6em;
                                   color: #1b1a1b;
                                   font-weight: 300;
                                   text-transform: uppercase;
                                   text-align: center;
                                   position: relative;
}
.products .products_heading h1:before{content: ""; display: block; width: 100%; height: 1px; position: absolute; top: 50%; margin-top: 0.5px; background-color: #c1c0c1; z-index: -1;}
.products .products_heading h1 > span{background-color: #ffffff; padding: 0 20px;}
.products .products_heading h1 span span{color: #747375; font-weight: bold;}

/*products => item*/
.products .products_item{border: 1px solid #f4f4f4; text-align: center; padding: 10px 10px 20px 10px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.05); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.05); -o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.05); box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);}
.products .products_item:hover .products_item_image img{-webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05);}

/*products => item => image*/
.products .products_item .products_item_image{margin-bottom: 15px; position: relative; min-height: 300px; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.products .products_item .products_item_image img{width: 100% !important; height: auto !important; max-width: 100%; max-height: 280px; object-fit: contain; -webkit-transition: transform 0.3s ease-in-out; -moz-transition: transform 0.3s ease-in-out; -ms-transition: transform 0.3s ease-in-out; -o-transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;}

/*products => item => image => new*/
.products .products_item .products_item_image .new_product{width: 100px; height: 100px; line-height: 160px; position: absolute; top: -50px; right: -50px; background-color: #c40808; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
.products .products_item .products_item_image .new_product p{-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
.products .products_item .products_item_image .new_product p a{display: block; width: 100%; height: 100%; font-size: 0.8125em; color: #ffffff; font-weight: bold; text-transform: uppercase; text-decoration: none;}

/*products => item => image => wishlist*/
.products .products_item .products_item_image .actions_wishlist{right: 10px; bottom: 10px; -webkit-transition: bottom 0.4s ease-in-out; -moz-transition: bottom 0.4s ease-in-out; -ms-transition: bottom 0.4s ease-in-out; -o-transition: bottom 0.4s ease-in-out; transition: bottom 0.4s ease-in-out;}

/*products => item => image => browsing history*/
.browsing_history .browsing_history_remove{text-align: center; margin-bottom: 10px}
.browsing_history .browsing_history_remove span{display: inline-block; font-size: 0.7em; color: #666666; font-weight: bold; background-color: #eeeeee; padding: 7px 12px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); -webkit-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out; -moz-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out; -ms-transition: background-color 0.3s ease-in-out; -o-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out; transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out; cursor: pointer;}
.browsing_history .browsing_history_remove span:hover{color: #ffffff; background-color: #c40808;}

/*products => item => image => close*/
.products .products_item .products_item_image .products_close{-webkit-display: -webkit-box; -webkit-display: -webkit-flex; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -webkit-box-pack: center; -moz-justify-content: center; -moz-flex-pack: center; -ms-justify-content: center; -ms-flex-pack: center; -o-justify-content: center; justify-content: center; -webkit-align-items: center; -webkit-box-align: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-align: center; -o-align-items: center; align-items: center; width: 40px; height: 40px; position: absolute; top: 5px; right: 5px; background-color: #f1f1f1; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .2); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .2); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, .2); -o-box-shadow: 0 0 5px rgba(0, 0, 0, .2); box-shadow: 0 0 5px rgba(0, 0, 0, .2); -webkit-transition: transform 0.3s ease-in-out; -moz-transition: transform 0.3s ease-in-out; -ms-transition: transform 0.3s ease-in-out; -o-transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;}
.products .products_item .products_item_image .products_close:hover{-webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05);}
.products .products_item .products_item_image .products_close span{font-size: 1.875em; color: #c40808; text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); cursor: pointer;}

/*products => item => image => discount*/
.products .products_item .products_item_image .discount_product{min-width: 70px; height: 40px; line-height: 40px; position: absolute; top: 70%; left: 0; margin-top: -20px; background-color: #c40808;}
.products .products_item .products_item_image .discount_product p a{display: block; width: 100%; height: 100%; font-size: 0.75em; color: #ffffff; font-weight: bold; text-transform: uppercase; text-decoration: none;}
.products .products_item .products_item_image .discount_product p a i{font-size: 50px; color: #ffffff; position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -25px;}

/*products => item => image => actions*/
.products .products_item .products_item_image .btn_actions{-webkit-display: -webkit-box; -webkit-display: -webkit-flex; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: center; -webkit-box-align: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-align: center; -o-align-items: center; align-items: center; width: 100%; height: 40px; position: absolute; bottom: -40px; padding: 10px 5px; opacity: 0; -webkit-transition: bottom 0.4s ease-in-out, opacity 0.5s ease-in-out; -moz-transition: bottom 0.4s ease-in-out, opacity 0.5s ease-in-out; -ms-transition: bottom 0.4s ease-in-out, opacity 0.5s ease-in-out; -o-transition: bottom 0.4s ease-in-out, opacity 0.5s ease-in-out; transition: bottom 0.4s ease-in-out, opacity 0.5s ease-in-out;}
.products .products_item:hover .products_item_image .btn_actions{bottom: 10px; opacity: 1;}
.products .products_item:hover .products_item_image .actions_wishlist{bottom: 60px;}
.products .products_item .products_item_image .btn_actions li{flex-grow: 1; width: 47%; padding: 0 1.5%;}
.products .products_item .products_item_image .btn_actions li a{display: block; font-size: 0.8125em; color: #ffffff; font-weight: bold; text-decoration: none; text-transform: uppercase; padding: 10px 5px; -webkit-transition: background-color 0.3s ease-in-out; -moz-transition: background-color 0.3s ease-in-out; -ms-transition: background-color 0.3s ease-in-out; -o-transition: background-color 0.3s ease-in-out; transition: background-color 0.3s ease-in-out;}
.products .products_item .products_item_image .btn_actions li a.view_product{background-color: rgba(0, 0, 0, 0.7); border: 1px solid #ffffff;}
.products .products_item .products_item_image .btn_actions li a.view_product:hover{background-color: rgba(0, 0, 0, 0.9);}
.products .products_item .products_item_image .btn_actions li a.purchase_product{background-color: #c40808;}
.products .products_item .products_item_image .btn_actions li a.purchase_product:hover{background-color: #ff36a4;}
.products .products_item .products_item_image .btn_actions li a i{margin-right: 5px;}

/*products => item => title*/
.products .products_item .products_item_title{margin-bottom: 20px;}
.products .products_item .products_item_title a{font-size: 0.9375em; color: #111111; font-weight: 600; text-decoration: none;}

/*products => item => price*/
.products .products_item .products_item_price a{font-size: 1em; color: #c40808; font-weight: 600; text-decoration: none;}
.products .products_item .products_item_price span.old_price{display: block; font-size: 0.75em; color: #f23550; text-decoration: line-through;}
.products .products_item .products_item_price span.installment{display: block; font-size: 0.8125rem; color: #111111;}

/*products => carousel*/
.products .owl-nav{width: 100%; position: absolute; top: 35%;}
.products .owl-nav .owl-prev, .products .owl-nav .owl-next{display: inline-block; width: 35px; height: 35px; line-height: 35px; font-size: 2em; color: #c40808; text-align: center; background-color: #f8f8f8; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -webkit-transition: background-color 0.2s ease-out, color 0.2s ease-out; -moz-transition: background-color 0.2s ease-out, color 0.2s ease-out; -ms-transition: background-color 0.2s ease-out, color 0.2s ease-out; -o-transition: background-color 0.2s ease-out, color 0.2s ease-out; transition: background-color 0.2s ease-out, color 0.2s ease-out;}
.products .owl-nav .owl-prev{position: absolute; left: 0;}
.products .owl-nav .owl-next{position: absolute; right: 0;}
.products .owl-nav .owl-prev:hover, .products .owl-nav .owl-next:hover{background-color: #c40808; color: #ffffff;}

/*products => paginator*/
.products .paginator{margin-top: 40px;}
.products .paginator a, .products .paginator span{font-size: 0.8em; color: #c40808; font-weight: bold; text-shadow: none; background-color: transparent; border: 1px solid #c40808;}
.products .paginator a:hover, .products .paginator span.active{cursor: pointer; background-color: transparent; color: #469aa8; border-color: #469aa8;}

/*products => modal*/
.products_modal{-webkit-display: -webkit-box; -webkit-display: -webkit-flex; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -webkit-box-pack: center; -moz-justify-content: center; -moz-flex-pack: center; -ms-justify-content: center; -ms-flex-pack: center; -o-justify-content: center; justify-content: center; -webkit-align-items: center; -webkit-box-align: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-align: center; -o-align-items: center; align-items: center; width: 100vw; height: calc(100vh - 96px); position: fixed; background-color: rgba(0, 0, 0, 0.7); z-index: 998;}
.products_modal .products_modal_content{display: none; width: 90%; height: 90%; position: relative; background-color: #ffffff;}

.products_modal .products_modal_content .product{max-height: calc(100% - 45px); overflow-y: auto; border-top: 10px solid #ffffff; border-bottom: 10px solid #ffffff;}
.products_modal .products_modal_content .product::-webkit-scrollbar{width: 5px; background-color: #ffffff;}
.products_modal .products_modal_content .product::-webkit-scrollbar-thumb{background-color: transparent; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;}
.products_modal .products_modal_content .product .content{width: 95%; padding: 0;}

.products_modal .products_modal_content .products_modal_content_close.modal_pdt_mobile{background-color: #c40808; padding: 10px; text-align: center;}
.products_modal .products_modal_content .products_modal_content_close.modal_pdt_mobile span{display: inline-block; font-size: 0.8em; color: #c40808; font-weight: bold; text-decoration: none; text-transform: uppercase; background-color: #ffffff; padding: 5px 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;}
.products_modal .products_modal_content .products_modal_content_close.modal_pdt_mobile span:hover{cursor: pointer;}

.products_modal .products_modal_content .products_modal_content_close.modal_pdt_desktop{display: none; -webkit-justify-content: center; -webkit-box-pack: center; -moz-justify-content: center; -moz-flex-pack: center; -ms-justify-content: center; -ms-flex-pack: center; -o-justify-content: center; justify-content: center; -webkit-align-items: center; -webkit-box-align: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-align: center; -o-align-items: center; align-items: center; width: 40px; height: 40px; position: absolute; top: -20px; left: -20px; background-color: #f1f1f1; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transition: transform 0.3s ease-in-out; -moz-transition: transform 0.3s ease-in-out; -ms-transition: transform 0.3s ease-in-out; -o-transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;}
.products_modal .products_modal_content .products_modal_content_close.modal_pdt_desktop:hover{-webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); cursor: pointer;}
.products_modal .products_modal_content .products_modal_content_close.modal_pdt_desktop i{font-size: 1.875em; color: #c40808;}


/*
CATEGORIES
*/
.categories .content{padding: 50px 0;}

/*
PRODUCT
*/
.product .content{padding: 30px 0;}

/*product => images*/
.product .product_image{position: relative; margin-bottom: 10px;}
.product .product_image .product_image_focus{margin-bottom: 5px;}
.product .product_image .product_image_gallery{max-width: 100%; max-height: 100%; overflow-x: auto; white-space: nowrap; padding-bottom: 5px;}
.product .product_image .product_image_gallery::-webkit-scrollbar{width: 5px; height: 5px; background-color: #ffffff;}
.product .product_image .product_image_gallery::-webkit-scrollbar-thumb{background-color: transparent; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;}
.product .product_image .product_image_gallery img{display: inline-block; width: 60px; margin-right: 5px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);}
.product .product_image .product_image_gallery img:last-child{margin-right: 0;}
.product .product_image .product_image_gallery img:hover{cursor: pointer;}

/*product => images => wishlist*/
.product .product_image .actions_wishlist{top: 10px; right: 10px;}

/*product => info*/
.product .product_info{padding-top: 10px;}

/*product => info => heading*/
.product .product_info .product_info_heading{margin-bottom: 10px; line-height: 25px;}
.product .product_info .product_info_heading h1{font-size: 1.2em; color: #333333; font-weight: 400;}

/*product => info => countdown*/
.product .product_info .countdown{max-width: 300px;}

/*product => info => rating*/
.product .product_info .product_info_rating{margin-bottom: 10px;}
.product .product_info .product_info_rating li{display: inline-block; font-size: 0.8em; color: #fed384;}

/*product => info => price*/
.product .product_info .product_info_price{margin-bottom: 10px;}
.product .product_info .product_info_price .old_price{font-size: 0.9em;}
.product .product_info .product_info_price .old_price span{font-weight: 600; text-decoration: line-through;}
.product .product_info .product_info_price .price_heading{-webkit-display: -webkit-box; -webkit-display: -webkit-flex; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: center; -webkit-box-align: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-align: center; -o-align-items: center; align-items: center; line-height: 15px; margin-bottom: 5px;}
.product .product_info .product_info_price .price_heading .by{font-size: 0.7em; color: #000000; text-transform: uppercase; margin-right: 5px;}
.product .product_info .product_info_price .price_heading .by span{font-size: 1.375em; color: #c40808; font-weight: bold;}
.product .product_info .product_info_price .price_heading .price{font-size: 2.5em; color: #c40808; font-weight: bold;}
.product .product_info .product_info_price p.discount{font-size: 0.875em; color: #000000; font-weight: 600;}
.product .product_info .product_info_price p.discount > span{font-size: 0.8125em; color: #3f172c; font-weight: 400;}
.product .product_info .product_info_price p.discount > span span{font-size: 1em; color: #c40808; font-weight: bold;}

/*product => description*/
.product .product_footer .content{padding: 20px 0;}
.product .product_footer ul{margin-bottom: 30px; background-color: #f9f9f9; padding: 10px; text-align: center; -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05); -ms-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05); -o-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05); box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);}
.product .product_footer ul li{display: inline-block;}
.product .product_footer ul li a{display: block; font-size: 0.8125em; color: #3e3c40; font-weight: bold; text-transform: uppercase; text-decoration: none; background-color: transparent; padding: 10px 11px; border: 1px solid #3e3c40; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px;}
.product .product_footer ul li a.wc_active{color: #ffffff; background-color: #3e3c40;}

.product .product_footer .product_footer_description{max-height: 100px; overflow-y: auto; padding-right: 10px;}
.product .product_footer .product_footer_description::-webkit-scrollbar{width: 10px; background-color: #ffffff;}
.product .product_footer .product_footer_description::-webkit-scrollbar-thumb{background-color: transparent; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -ms-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -o-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;}
.product .product_footer .product_footer_description p{font-size: 0.875em; color: #222222; line-height: 25px;}
.product .product_footer .product_footer_description p:not(:last-child){margin-bottom: 10px;}
.product .product_footer .product_footer_description p span{display: block; color: #111111; font-weight: 600;}

.product .product_footer .product_footer_reviews textarea{resize: none;}
.product .product_footer .product_footer_reviews select{background-size: auto 60%;}



/*
MEDIA QUERIES - PRODUCTS
*/

/*400px and 545px*/
@media (min-width: 20em) and (max-width: 34em){
     /*
     PRODUCTS
     */
     .products .products_wrap{width: 85%; margin: 0 auto;}
 }


 /*500px*/
@media (min-width: 31.25em){

    /*
    PRODUCTS
    */
    .products .products_wrap{width: 80%;}

    /*
    PRODUCT
    */

    /*product => images*/
    .product .product_image{display: inline-block; width: 49%; margin: 1% 2% 1% 0; vertical-align: top; margin-bottom: 10px;}

    /*product => info*/
    .product .product_info{display: inline-block; width: 49%; margin: 1% 0 1% 0; vertical-align: top;}
}

/*550px*/
@media (min-width: 34.375em){
    /*
    PRODUCTS
    */
    .products .products_wrap{width: 100%;}

    /*products => modal*/
    .products_modal{height: calc(100vh - 51px);}

}

/*850px*/
@media (min-width: 53.125em) {

    /*
    PRODUCTS
    */

    /*products => carousel*/
    .products .owl-nav{display: block; width: 75px; background-color: #ffffff; top: -37px; right: 0; text-align: right;}
    .products .owl-nav .owl-prev, .products .owl-nav .owl-next{display: inline-block; width: 30px; height: 30px; line-height: 30px; font-size: 1.875em; color: #c40808; text-align: center; background-color: #f8f8f8; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); -o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);}
    .products .owl-nav .owl-prev{position: initial; margin-right: 5px;}
    .products .owl-nav .owl-next{position: initial;}

}

/*992px*/
@media (min-width: 62em){
        /*
    PRODUCTS
    */

    /*products => modal*/
    .products_modal{height: 100vh;}

    .products_modal .products_modal_content .product{max-height: 100%;}
    .products_modal .products_modal_content .product::-webkit-scrollbar{width: 10px;}

    .products_modal .products_modal_content .products_modal_content_close.modal_pdt_mobile{display: none;}
    .products_modal .products_modal_content .products_modal_content_close.modal_pdt_desktop{-webkit-display: -webkit-box; -webkit-display: -webkit-flex; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex;}

    /*
    PRODUCT
    */

    /*product => info*/
    .product .product_info .product_info_heading h1{font-size: 1.5em; font-weight: 400; text-transform: uppercase;}

    /*product => description*/
    .product .product_footer .product_footer_description{max-height: none; overflow-y: visible; padding-right: 0;}
}

/*1200px*/
@media (min-width: 75em){

    /*
    PRODUCTS
    */

    /*products => modal*/
    .products_modal .products_modal_content .product .content{width: 90%;}

    /*
    PRODUCT
    */

    /*product => images*/
    .product .product_image{width: calc(49% + 75px); margin: 1% 2% 1% 0;}

    /*product => info*/
    .product .product_info{width: calc(49% - 75px); margin: 1% 0 1% 0;}

    /*product => images*/
    .product .product_image{position: relative;}
    .product .product_image .product_image_focus{margin-bottom: 0; padding-left: 75px;}
    .product .product_image .product_image_gallery{position: absolute; top: 0; left: 0; padding: 10px; border-right: 2px solid #ffffff; background-color: #ffffff;}
    .product .product_image .product_image_gallery img{display: block; width: 70px; margin-right: 0; margin-bottom: 5px;}
    .product .product_image .product_image_gallery img:last-child{margin-bottom: 0;}
}

/*Hacks CSS*/
_:-ms-lang(x), .products .products_item .products_item_title{line-height: 27px;}
_:-ms-lang(x), .products .products_item .products_item_title a{font-size: 0.55em; color: #333333; line-height: 0;}


.product_info p{
    padding-bottom: 10px;
}
.product_info .cod_prod{
    font-weight: 400;
    letter-spacing: 1.2px;
    font-size: 1.1em;
    color: #860707;
    border-bottom: 2px solid red;
    margin-bottom: 10px;
}

.product .content {
    padding: 80px 0;
}

/* ===== ESTILOS ESPECÍFICOS PARA PRODUTO.PHP ===== */

/* Layout principal do produto */
.product .content {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xl);
    align-items: flex-start;
    padding: var(--spacing-3xl) 0;
}

.product .product_image {
    flex: 0 0 45%;
    max-width: 500px;
    position: relative;
}

.product .product_info {
    flex: 1;
    min-width: 300px;
    padding-left: var(--spacing-xl);
}

/* Breadcrumbs do produto */
.product_breadcrumbs {
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-sm);
    color: var(--gray-600);
}

.product_breadcrumbs a {
    color: var(--primary-color);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.product_breadcrumbs a:hover {
    color: var(--primary-dark);
}

.product_breadcrumbs .crumb {
    color: var(--gray-400);
    margin: 0 var(--spacing-xs);
}

.product_breadcrumbs .current {
    color: var(--gray-700);
    font-weight: 600;
}

/* Título e subtítulo do produto */
.product_title {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--gray-900);
    margin-bottom: var(--spacing-md);
    line-height: 1.2;
    text-transform: uppercase;
}

.product_subtitle {
    font-size: var(--font-size-lg);
    color: var(--gray-700);
    margin-bottom: var(--spacing-2xl);
    line-height: 1.6;
}

/* Detalhes do produto */
.product_details {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xl);
}

/* Metadados do produto */
.product_meta {
    display: flex;
    gap: var(--spacing-xl);
    flex-wrap: wrap;
    padding: var(--spacing-lg);
    background-color: var(--gray-50);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--gray-200);
}

.meta_item {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.meta_label {
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    font-weight: 600;
    text-transform: uppercase;
}

.meta_value {
    font-size: var(--font-size-base);
    color: var(--gray-800);
    font-weight: 700;
}

/* Especificações técnicas */
.product_specs h3 {
    font-size: var(--font-size-xl);
    color: var(--gray-800);
    margin-bottom: var(--spacing-lg);
    font-weight: 600;
}

.specs_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-lg);
}

.spec_item {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background-color: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    transition: all var(--transition-fast);
}

.spec_item:hover {
    border-color: var(--primary-color);
    box-shadow: var(--shadow-md);
}

.spec_item i {
    font-size: var(--font-size-xl);
    color: var(--primary-color);
    width: 24px;
    text-align: center;
}

.spec_content {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.spec_label {
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    font-weight: 600;
    text-transform: uppercase;
}

.spec_value {
    font-size: var(--font-size-base);
    color: var(--gray-800);
    font-weight: 700;
}

/* Aplicações */
.product_applications h3 {
    font-size: var(--font-size-xl);
    color: var(--gray-800);
    margin-bottom: var(--spacing-lg);
    font-weight: 600;
}

.applications_list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.application_tag {
    background-color: var(--primary-color);
    color: var(--white);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--border-radius-full);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
}

/* Benefícios */
.product_benefits h3 {
    font-size: var(--font-size-xl);
    color: var(--gray-800);
    margin-bottom: var(--spacing-lg);
    font-weight: 600;
}

.benefits_list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.benefits_list li {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md);
    background-color: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-md);
    transition: all var(--transition-fast);
}

.benefits_list li:hover {
    border-color: var(--success);
    background-color: var(--gray-50);
}

.benefits_list i {
    color: var(--success);
    font-size: var(--font-size-lg);
    width: 20px;
    text-align: center;
}

/* Botões de ação */
.product_actions {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    margin-top: var(--spacing-xl);
}

.product_actions .btn {
    flex: 1;
    min-width: 180px;
    justify-content: center;
    text-align: center;
    font-weight: 600;
    transition: all var(--transition-fast);
}

.product_actions .btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
    border: 2px solid var(--primary-color);
    box-shadow: 0 2px 8px rgba(0, 166, 81, 0.2);
}

.product_actions .btn-primary:hover {
    background-color: var(--primary-dark);
    color: var(--white);
    border-color: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 166, 81, 0.3);
}

.product_actions .btn-outline {
    background-color: transparent;
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
    font-weight: 600;
}

.product_actions .btn-outline:hover {
    background-color: var(--primary-color);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 166, 81, 0.3);
}

.product_actions .btn-secondary {
    background-color: var(--gray-600);
    color: var(--white);
    border: 2px solid var(--gray-600);
    font-weight: 600;
}

.product_actions .btn-secondary:hover {
    background-color: var(--gray-700);
    color: var(--white);
    border-color: var(--gray-700);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

/* Informações de contato */
.product_contact {
    margin-top: var(--spacing-xl);
    padding: var(--spacing-xl);
    background-color: var(--gray-50);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--gray-200);
}

.contact_info {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.contact_item {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.contact_item i {
    font-size: var(--font-size-lg);
    color: var(--primary-color);
    width: 20px;
    text-align: center;
}

.contact_item div {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.contact_label {
    font-size: var(--font-size-sm);
    color: var(--gray-600);
    font-weight: 600;
    text-transform: uppercase;
}

.contact_value {
    font-size: var(--font-size-base);
    color: var(--gray-800);
    font-weight: 700;
}

/* Responsividade para produto.php */
@media (max-width: 768px) {
    .product .content {
        flex-direction: column;
        gap: var(--spacing-xl);
        padding: var(--spacing-2xl) 0;
    }
    
    .product .product_image {
        flex: 0 0 auto;
        max-width: 100%;
        margin-bottom: var(--spacing-lg);
    }
    
    .product .product_info {
        flex: 1;
        padding-left: 0;
        min-width: auto;
    }
    
    .product_actions {
        flex-direction: column;
    }
    
    .product_actions .btn {
        min-width: auto;
        width: 100%;
    }
    
    .specs_grid {
        grid-template-columns: 1fr;
    }
    
    .product_meta {
        flex-direction: column;
        gap: var(--spacing-md);
    }
}

@media (max-width: 480px) {
    .product .content {
        padding: var(--spacing-xl) 0;
        gap: var(--spacing-lg);
    }
    
    .product_title {
        font-size: var(--font-size-2xl);
    }
    
    .product_subtitle {
        font-size: var(--font-size-base);
    }
    
    .contact_info {
        gap: var(--spacing-md);
    }
}

/* ===== STATS COM IMAGENS - LAYOUT ORIGINAL ===== */
.stats-new {
    padding: var(--spacing-3xl) 0;
    background: #f8faf8;
    position: relative;
    color: var(--gray-800);
}

.stats-header {
    text-align: center;
    margin-bottom: var(--spacing-3xl);
}

.stats-title {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
    line-height: 1.2;
}

.stats-subtitle {
    font-size: 1.2rem;
    color: var(--gray-600);
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

.stats-dynamic-container {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0 !important;
    min-height: 400px;
    width: 100%;
    overflow-x: auto;
    margin: 0 !important;
    padding: 0 !important;
}

.stats-images-row {
    display: flex;
    gap: 0 !important;
    flex: 1;
    position: relative;
    z-index: 2;
    width: 100%;
    flex-wrap: nowrap;
    margin: 0 !important;
    padding: 0 !important;
}

.stat-image-item {
    position: relative;
    cursor: pointer;
    flex: 1;
    height: 400px;
    overflow: hidden;
    transition: all 0.4s ease;
    border-radius: 0;
    width: 25%;
    flex-shrink: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
}

.stat-image-item:first-child {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.stat-image-item:last-child {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

/* Bordas arredondadas à esquerda para todas as imagens (exceto primeira) */
.stat-image-item:not(:first-child) {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    margin-left: 10px !important;
}

.stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.stat-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: var(--spacing-lg) var(--spacing-md) var(--spacing-md);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.stat-image-label {
    color: white;
    font-size: var(--font-size-lg);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.stat-image-item:hover {
    transform: translateY(-10px);
    z-index: 10;
}

.stat-image-item:hover .stat-image {
    transform: scale(1.1);
}

.stats-expansion-panel {
    width: 400px;
    height: 400px;
    background: #00a651;
    border-radius: 0 12px 12px 0;
    overflow: hidden;
    transition: width 0.4s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    visibility: visible;
    flex-shrink: 0;
    position: relative;
    cursor: default;
    user-select: none;
    pointer-events: auto;
    margin: 0 20px 0 0 !important;
    padding: 0 !important;
    border: none !important;
    transform: translateX(0) !important;
    left: 0 !important;
    top: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.stats-expansion-panel.active {
    width: 400px !important;
    background: #00a651 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10 !important;
}

.stats-expansion-content {
    color: white;
    text-align: center;
    padding: 20px;
    width: 100%;
    opacity: 1;
    transition: opacity 0.3s ease 0.2s;
    pointer-events: none;
    user-select: none;
    position: relative;
    z-index: 1;
}

.stats-expansion-panel.active .stats-expansion-content {
    opacity: 1 !important;
    display: block !important;
}

.stat-expansion-icon {
    font-size: 3rem;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stat-expansion-number {
    font-size: 3.5rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: white;
    line-height: 1;
    display: block;
}

.stat-expansion-label {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stat-expansion-description {
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 20px;
    display: block;
}

.stat-icon {
    font-size: 2.5rem;
    color: var(--primary-color);
    margin-bottom: var(--spacing-md);
}

.stat-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: var(--spacing-sm);
    line-height: 1;
}

.stat-label {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--gray-800);
    margin-bottom: var(--spacing-sm);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stat-description {
    font-size: 1rem;
    color: var(--gray-600);
    line-height: 1.5;
}

/* Responsividade para stats com imagens */
@media (max-width: 768px) {
    .stats-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }
    
    .stat-card {
        flex-direction: column;
        min-height: auto;
    }
    
    .stat-image {
        flex: none;
        height: 150px;
        width: 100%;
    }
    
    .stat-content {
        padding: var(--spacing-lg);
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 1.1rem;
    }
    
    /* ===== LAYOUT MOBILE - Cards Horizontais com Imagem à Esquerda e Área Verde à Direita ===== */
    
    /* Esconder completamente o painel de expansão no mobile */
    .stats-expansion-panel {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }
    
    .stats-expansion-panel.active {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
    }
    
    .stats-expansion-content {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
    
    /* Header mantém padding, mas container dos cards não */
    .stats-header {
        padding: 0 var(--spacing-md);
    }
    
    /* Remove padding do container principal para cards ocuparem 100% */
    .stats-new .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }
    
    /* Container reorganizado para mobile - sem padding lateral */
    /* Proteção contra estilos inline do JavaScript */
    .stats-dynamic-container {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: var(--spacing-md) !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important;
        overflow-x: visible !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .stats-dynamic-container[style] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: var(--spacing-md) !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important;
        overflow-x: visible !important;
        width: 100% !important;
    }
    
    /* Grid vertical para os cards - 100% largura, sem padding */
    .stats-images-row {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--spacing-md) !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        flex-wrap: nowrap !important;
        box-sizing: border-box !important;
    }
    
    .stats-images-row[style] {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--spacing-md) !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        flex-wrap: nowrap !important;
    }
    
    /* Cada card vira um container horizontal - 100% largura */
    /* Proteção contra estilos inline do JavaScript */
    .stat-image-item {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 180px !important;
        border-radius: 0 !important;
        overflow: hidden !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
        background: white !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        cursor: default !important;
        position: relative !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Resetar estilos inline que possam ser aplicados pelo JS */
    .stat-image-item[style] {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 180px !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Wrapper da imagem à esquerda */
    .stat-image-wrapper {
        flex: 0 0 40% !important;
        width: 40% !important;
        min-width: 40% !important;
        max-width: 40% !important;
        height: 180px !important;
        position: relative !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .stat-image {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Overlay da imagem - ajustado para mobile */
    .stat-image-overlay {
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.5) 60%, transparent 100%) !important;
        padding: var(--spacing-sm) var(--spacing-xs) !important;
        border-radius: 0 !important;
        display: flex !important;
        align-items: flex-end !important;
        justify-content: center !important;
        margin: 0 !important;
    }
    
    .stat-image-label {
        font-size: 0.65rem !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.8px !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9) !important;
        color: white !important;
        text-align: center !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }
    
    /* Área verde à direita com informações - visível no mobile */
    .stat-mobile-info {
        flex: 1 !important;
        min-width: 60% !important;
        width: 60% !important;
        background: linear-gradient(135deg, #00a651 0%, #008a44 100%) !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        padding: var(--spacing-lg) var(--spacing-md) !important;
        text-align: center !important;
        color: white !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Ícone */
    .stat-mobile-icon {
        font-size: 2.2rem !important;
        margin-bottom: var(--spacing-sm) !important;
        color: rgba(255, 255, 255, 1) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        line-height: 1 !important;
    }
    
    .stat-mobile-icon i {
        font-size: 2.2rem !important;
        color: rgba(255, 255, 255, 1) !important;
    }
    
    /* Número */
    .stat-mobile-number {
        font-size: 2rem !important;
        font-weight: 700 !important;
        margin-bottom: var(--spacing-xs) !important;
        line-height: 1.2 !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) !important;
        color: white !important;
        text-align: center !important;
        width: 100% !important;
        word-wrap: break-word !important;
    }
    
    /* Label */
    .stat-mobile-label {
        font-size: 0.85rem !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: 1.2px !important;
        margin-bottom: var(--spacing-sm) !important;
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
        color: white !important;
        text-align: center !important;
        width: 100% !important;
        line-height: 1.3 !important;
    }
    
    /* Descrição */
    .stat-mobile-description {
        font-size: 0.75rem !important;
        line-height: 1.5 !important;
        color: rgba(255, 255, 255, 0.95) !important;
        max-width: 100% !important;
        text-align: center !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        word-wrap: break-word !important;
    }
    
    /* Remove estado ativo no mobile (todos cards sempre visíveis) */
    .stat-image-item.active {
        border-radius: 0 !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
    }
}

@media (max-width: 480px) {
    .stats-title {
        font-size: 2rem;
    }
    
    .stat-icon {
        font-size: 2rem;
    }
    
    .stat-number {
        font-size: 2rem;
    }
    
    .stat-label {
        font-size: 1rem;
    }
    
    .stat-description {
        font-size: 0.9rem;
    }
    
    /* Ajustes para mobile pequeno - Cards Horizontais */
    .stats-new .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Garantir que painel de expansão não apareça */
    .stats-expansion-panel {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }
    
    .stats-expansion-panel.active {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
    }
    
    .stats-expansion-content {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
    
    .stat-image-item {
        min-height: 160px !important;
        border-radius: 0 !important;
    }
    
    .stat-image-item.active {
        border-radius: 0 !important;
    }
    
    .stat-image-wrapper {
        height: 160px !important;
        flex: 0 0 40% !important;
    }
    
    .stat-mobile-info {
        padding: var(--spacing-md) var(--spacing-sm) !important;
    }
    
    .stat-mobile-icon {
        font-size: 1.8rem !important;
        margin-bottom: var(--spacing-xs) !important;
    }
    
    .stat-mobile-icon i {
        font-size: 1.8rem !important;
    }
    
    .stat-mobile-number {
        font-size: 1.6rem !important;
        margin-bottom: var(--spacing-xs) !important;
    }
    
    .stat-mobile-label {
        font-size: 0.75rem !important;
        margin-bottom: var(--spacing-xs) !important;
        letter-spacing: 1px !important;
    }
    
    .stat-mobile-description {
        font-size: 0.7rem !important;
        line-height: 1.4 !important;
    }
}

/* Linha horizontal de imagens */
.stats-images-row {
    display: flex;
    gap: 20px; /* Espaço entre as imagens */
    flex: 1;
    position: relative;
    z-index: 2;
    width: 100%;
    flex-wrap: nowrap;
    align-items: flex-start; /* Alinha no topo */
}

/* Wrapper da imagem - funciona no desktop também */
.stat-image-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
}

/* Esconder área mobile-info no desktop */
.stat-mobile-info {
    display: none;
}

.stat-image-item {
    position: relative;
    cursor: pointer;
    flex: 1;
    height: 400px; /* Aumentado de 300px para 400px */
    overflow: hidden;
    transition: all 0.4s ease;
    border-radius: 12px; /* Bordas arredondadas em todas as imagens */
    width: 25%;
    flex-shrink: 0;
    margin: 0 !important; /* Remove qualquer margem */
    padding: 0 !important; /* Remove qualquer padding */
    border: none !important; /* Remove qualquer borda */
    box-sizing: border-box !important; /* Inclui bordas no cálculo */
}

/* Quando a imagem está ativa (expandida), remove bordas do lado direito */
.stat-image-item.active {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}


.stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.stat-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: var(--spacing-lg) var(--spacing-md) var(--spacing-md);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.stat-image-label {
    color: white;
    font-size: var(--font-size-lg);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Efeito hover nas imagens - REMOVIDO para evitar mudança de tamanho */
.stat-image-item:hover {
    /* Sem transform para manter tamanho consistente */
    z-index: 10;
}

.stat-image-item:hover .stat-image {
    /* Sem scale para manter tamanho consistente */
}

/* Painel de expansão que aparece inline - ZERO GAP ABSOLUTO */
.stats-expansion-panel {
    width: 0;
    height: 400px; /* Ajustado para corresponder à altura das imagens */
    background: #00a651;
    border-radius: 0; /* Sem bordas por padrão */
    overflow: hidden;
    transition: width 0.4s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    visibility: hidden;
    flex-shrink: 0;
    position: relative;
    cursor: default;
    user-select: none;
    pointer-events: auto;
    margin: 0 !important; /* Remove TODAS as margens */
    padding: 0 !important; /* Remove TODOS os paddings */
    border: none !important; /* Remove TODAS as bordas */
    transform: translateX(0) !important; /* Remove qualquer transformação */
    left: 0 !important; /* Posiciona exatamente ao lado */
    top: 0 !important; /* Alinha no topo */
    outline: none !important; /* Remove outline */
    box-shadow: none !important; /* Remove sombra */
    box-sizing: border-box !important; /* Inclui bordas no cálculo */
}

/* Quando ativa, tem bordas arredondadas apenas no lado direito */
.stats-expansion-panel.active {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-left: none !important;
    border-right: none !important;
    transform: translateX(0) !important;
}

/* MÁXIMA PROXIMIDADE - imagem e área verde completamente coladas */
.stat-image-item.active + .stats-expansion-panel {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    transform: translateX(0) !important;
    left: 0 !important;
    top: 0 !important;
    position: relative !important;
    width: 400px !important;
    height: 400px !important;
    background: #00a651 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Forçar MÁXIMA PROXIMIDADE entre elementos */
.stat-image-item.active {
    margin-right: 0 !important;
    padding-right: 0 !important;
    border-right: none !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* Garantir que o container não adicione espaços */
.stats-images-row > * {
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Forçar proximidade máxima no flexbox */
.stats-images-row {
    align-items: flex-start !important;
    gap: 20px !important;
}

/* Remover qualquer espaço entre elementos adjacentes */
.stat-image-item + .stats-expansion-panel {
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: none !important;
}

/* PROTEÇÃO MÁXIMA - área verde sem efeitos */
.stats-expansion-panel:hover {
    background: #00a651 !important;
    opacity: 1 !important;
    transform: none !important;
}

.stats-expansion-panel:hover .stats-expansion-content {
    opacity: 1 !important;
    transform: none !important;
    display: block !important;
    visibility: visible !important;
}

/* PROTEÇÃO MÁXIMA do conteúdo dentro da área verde */
.stats-expansion-content {
    color: white !important;
    text-align: center !important;
    padding: 20px !important;
    width: 100% !important;
    opacity: 1 !important;
    transition: none !important;
    pointer-events: none !important;
    user-select: none !important;
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 1 !important;
}

/* PROTEÇÃO ABSOLUTA - conteúdo nunca desaparece */
.stats-expansion-panel.active .stats-expansion-content {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    color: white !important;
}

/* PROTEÇÃO dos elementos específicos */
.stats-expansion-content .stat-expansion-icon,
.stats-expansion-content .stat-expansion-number,
.stats-expansion-content .stat-expansion-label,
.stats-expansion-content .stat-expansion-description {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    color: white !important;
}

.stats-expansion-panel.active {
    width: 400px !important;
    background: #00a651 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10 !important;
}

.stats-expansion-content {
    color: white;
    text-align: center;
    padding: 20px;
    width: 100%;
    opacity: 0;
    transition: opacity 0.3s ease 0.2s;
    pointer-events: none;
    user-select: none;
    /* Proteção contra conteúdo inesperado */
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* Proteção adicional - esconder qualquer texto não esperado */
.stats-expansion-content:empty::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
}

.stats-expansion-panel.active .stats-expansion-content {
    opacity: 1 !important;
    display: block !important;
}

/* Conteúdo específico para cada estatística */
.stats-expansion-item {
    display: none;
}

.stats-expansion-item.active {
    display: block;
}

.stat-expansion-icon {
    font-size: 3rem;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stat-expansion-number {
    font-size: 3.5rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: white;
    line-height: 1;
    display: block;
}

.stat-expansion-label {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stat-expansion-description {
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 20px;
    display: block;
}

.stat-expansion-features {
    list-style: none;
    text-align: left;
    max-width: 350px;
    margin: 0 auto;
    display: block;
}

.stat-expansion-features li {
    padding: 8px 0;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.9);
    position: relative;
    padding-left: 20px;
    display: block;
}

.stat-expansion-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: white;
    font-weight: bold;
    font-size: 1.2rem;
}

/* Responsividade para stats-dynamic horizontal */
@media (max-width: 1200px) {
    .stats-expansion-panel.active {
        width: 350px;
    }
}

@media (max-width: 1024px) {
    .stats-dynamic-container {
        flex-direction: column;
        gap: 20px;
    }
    
    .stats-images-row {
        flex-direction: column;
        gap: 10px;
    }
    
           .stat-image-item {
               height: 250px; /* Ajustado para manter proporção */
               border-radius: 12px;
           }
    
    .stat-image-item:first-child {
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }
    
    .stat-image-item:last-child {
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }
    
           .stats-expansion-panel {
               display: none !important;
               visibility: hidden !important;
               opacity: 0 !important;
           }
    
    .stats-expansion-panel.active {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .stats-dynamic {
        padding: 40px 0;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 16px;
        padding: 0 20px;
    }
    
    .stats-images-row {
        gap: 5px;
    }
    
           .stat-image-item {
               height: 180px; /* Ajustado para mobile */
           }
    
    .stats-expansion-panel {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
        pointer-events: none !important;
    }
    
    .stats-expansion-panel.active {
        display: none !important;
    }
    
    .stat-expansion-number {
        font-size: 2.5rem;
    }
    
    .stat-expansion-label {
        font-size: 1.2rem;
    }
}

@media (max-width: 480px) {
    .stats-title {
        font-size: 2rem;
    }
    
           .stat-image-item {
               height: 150px; /* Ajustado para mobile pequeno */
           }
    
    .stats-expansion-panel {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
        pointer-events: none !important;
    }
    
    .stats-expansion-panel.active {
        display: none !important;
    }
    
    .stat-expansion-number {
        font-size: 2rem;
    }
    
    .stat-expansion-features {
        max-width: 100%;
    }
}




/* ===== LAYOUT MOBILE ===== */
.stats-mobile-layout {
    display: none;
}

.stats-mobile-card {
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.stats-mobile-image {
    flex: 1;
    position: relative;
    height: 200px;
    overflow: hidden;
}

.mobile-stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mobile-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: 15px 10px 10px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.mobile-image-label {
    color: white;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.stats-mobile-panel {
    flex: 1;
    background: #00a651;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
}

.stats-mobile-content {
    color: white;
    text-align: center;
    padding: 20px;
    width: 100%;
}

.stats-mobile-content .stat-expansion-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stats-mobile-content .stat-expansion-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: white;
    line-height: 1;
    display: block;
}

.stats-mobile-content .stat-expansion-label {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stats-mobile-content .stat-expansion-description {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 15px;
    display: block;
}

.stats-mobile-nav {
    display: flex;
    gap: 8px;
    width: 100%;
}

.mobile-nav-btn {
    flex: 1;
    padding: 12px 8px;
    border: 2px solid #00a651;
    background: #00a651;
    color: white;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.mobile-nav-btn.active {
    background: white;
    color: #00a651;
    border-color: #00a651;
}

.mobile-nav-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

.mobile-nav-btn.active:hover {
    background: white;
    color: #00a651;
}

/* Responsividade Mobile */
@media (max-width: 768px) {
    .stats-desktop-layout {
        display: none;
    }
    
    .stats-mobile-layout {
        display: block;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .stats-mobile-card {
        flex-direction: column;
    }
    
    .stats-mobile-image,
    .stats-mobile-panel {
        height: 150px;
    }
    
    .stats-mobile-content .stat-expansion-icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }
    
    .stats-mobile-content .stat-expansion-number {
        font-size: 2rem;
        margin-bottom: 5px;
    }
    
    .stats-mobile-content .stat-expansion-label {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .stats-mobile-content .stat-expansion-description {
        font-size: 12px;
        margin-bottom: 10px;
    }
    
    .mobile-nav-btn {
        padding: 10px 6px;
        font-size: 11px;
    }
    
    .stats-title {
        font-size: 2rem;
    }
    
    .stats-subtitle {
        font-size: 1rem;
    }
}



/* ===== LAYOUT MOBILE SIMPLIFICADO ===== */
.stats-mobile-layout {
    display: none;
}

.stats-mobile-item {
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background: white;
}

.stats-mobile-image {
    flex: 1;
    position: relative;
    height: 200px;
    overflow: hidden;
}

.mobile-stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mobile-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: 15px 10px 10px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.mobile-image-label {
    color: white;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.stats-mobile-panel {
    flex: 1;
    background: #00a651;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
}

.stats-mobile-content {
    color: white;
    text-align: center;
    padding: 20px;
    width: 100%;
}

.stats-mobile-content .stat-expansion-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stats-mobile-content .stat-expansion-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: white;
    line-height: 1;
    display: block;
}

.stats-mobile-content .stat-expansion-label {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stats-mobile-content .stat-expansion-description {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 15px;
    display: block;
}

/* Responsividade Mobile */
@media (max-width: 768px) {
    .stats-desktop-layout {
        display: none;
    }
    
    .stats-mobile-layout {
        display: block;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .stats-mobile-item {
        flex-direction: column;
    }
    
    .stats-mobile-image,
    .stats-mobile-panel {
        height: 150px;
    }
    
    .stats-mobile-content .stat-expansion-icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }
    
    .stats-mobile-content .stat-expansion-number {
        font-size: 2rem;
        margin-bottom: 5px;
    }
    
    .stats-mobile-content .stat-expansion-label {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .stats-mobile-content .stat-expansion-description {
        font-size: 12px;
        margin-bottom: 10px;
    }
    
    .stats-title {
        font-size: 2rem;
    }
    
    .stats-subtitle {
        font-size: 1rem;
    }
}



/* ===== LAYOUT MOBILE VERTICAL ===== */
.stats-mobile-layout {
    display: none;
}

.stats-mobile-item {
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background: white;
    min-height: 200px;
}

.stats-mobile-image {
    flex: 1;
    position: relative;
    height: 200px;
    overflow: hidden;
}

.mobile-stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mobile-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: 15px 10px 10px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.mobile-image-label {
    color: white;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.stats-mobile-panel {
    flex: 1;
    background: #00a651;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    padding: 20px;
}

.stats-mobile-content {
    color: white;
    text-align: center;
    width: 100%;
}

.stats-mobile-content .stat-expansion-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stats-mobile-content .stat-expansion-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: white;
    line-height: 1;
    display: block;
}

.stats-mobile-content .stat-expansion-label {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stats-mobile-content .stat-expansion-description {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 15px;
    display: block;
}

/* Responsividade Mobile */
@media (max-width: 768px) {
    .stats-desktop-layout {
        display: none;
    }
    
    .stats-mobile-layout {
        display: block;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .stats-mobile-item {
        flex-direction: column;
        min-height: auto;
    }
    
    .stats-mobile-image,
    .stats-mobile-panel {
        height: 150px;
    }
    
    .stats-mobile-content .stat-expansion-icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }
    
    .stats-mobile-content .stat-expansion-number {
        font-size: 2rem;
        margin-bottom: 5px;
    }
    
    .stats-mobile-content .stat-expansion-label {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .stats-mobile-content .stat-expansion-description {
        font-size: 12px;
        margin-bottom: 10px;
    }
    
    .stats-title {
        font-size: 2rem;
    }
    
    .stats-subtitle {
        font-size: 1rem;
    }
}



/* ===== LAYOUT MOBILE VERTICAL ===== */
.stats-mobile-layout {
    display: none;
}

.stats-mobile-item {
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background: white;
    min-height: 200px;
}

.stats-mobile-image {
    flex: 1;
    position: relative;
    height: 200px;
    overflow: hidden;
}

.mobile-stat-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mobile-image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: 15px 10px 10px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.mobile-image-label {
    color: white;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.stats-mobile-panel {
    flex: 1;
    background: #00a651;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    padding: 20px;
}

.stats-mobile-content {
    color: white;
    text-align: center;
    width: 100%;
}

.stats-mobile-content .stat-expansion-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, 0.9);
    display: block;
}

.stats-mobile-content .stat-expansion-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: white;
    line-height: 1;
    display: block;
}

.stats-mobile-content .stat-expansion-label {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
    display: block;
}

.stats-mobile-content .stat-expansion-description {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 15px;
    display: block;
}

/* Responsividade Mobile */
@media (max-width: 768px) {
    .stats-desktop-layout {
        display: none;
    }
    
    .stats-mobile-layout {
        display: block;
    }
    
    .stats-title {
        font-size: 2.5rem;
    }
    
    .stats-subtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .stats-mobile-item {
        flex-direction: column;
        min-height: auto;
    }
    
    .stats-mobile-image,
    .stats-mobile-panel {
        height: 150px;
    }
    
    .stats-mobile-content .stat-expansion-icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }
    
    .stats-mobile-content .stat-expansion-number {
        font-size: 2rem;
        margin-bottom: 5px;
    }
    
    .stats-mobile-content .stat-expansion-label {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .stats-mobile-content .stat-expansion-description {
        font-size: 12px;
        margin-bottom: 10px;
    }
    
    .stats-title {
        font-size: 2rem;
    }
    
    .stats-subtitle {
        font-size: 1rem;
    }
}