/* Custom Styles */

/* Lucide Icons - Universal Fixes (Desktop e Mobile) */
[data-lucide] {
    display: inline-block;
    vertical-align: middle;
    color: inherit;
}

[data-lucide] svg {
    stroke: currentColor !important;
    fill: none !important;
    width: 100%;
    height: 100%;
    display: block;
    color: inherit;
}

/* Garantir que cores sejam aplicadas corretamente nos ícones - Seletores mais específicos */
i[data-lucide].text-red-500,
i[data-lucide].text-red-500 svg,
.text-red-500 i[data-lucide],
.text-red-500 i[data-lucide] svg {
    stroke: #ef4444 !important;
    color: #ef4444 !important;
}

i[data-lucide].text-orange-500,
i[data-lucide].text-orange-500 svg,
.text-orange-500 i[data-lucide],
.text-orange-500 i[data-lucide] svg {
    stroke: #f97316 !important;
    color: #f97316 !important;
}

i[data-lucide].text-yellow-500,
i[data-lucide].text-yellow-500 svg,
.text-yellow-500 i[data-lucide],
.text-yellow-500 i[data-lucide] svg {
    stroke: #eab308 !important;
    color: #eab308 !important;
}

i[data-lucide].text-amber-500,
i[data-lucide].text-amber-500 svg,
.text-amber-500 i[data-lucide],
.text-amber-500 i[data-lucide] svg {
    stroke: #f59e0b !important;
    color: #f59e0b !important;
}

i[data-lucide].text-white,
i[data-lucide].text-white svg,
.text-white i[data-lucide],
.text-white i[data-lucide] svg {
    stroke: #ffffff !important;
    color: #ffffff !important;
}

/* Forçar ícones brancos nos botões de contato - Regras muito específicas */
#contato i[data-lucide].text-white,
#contato i[data-lucide].text-white svg,
#contato .text-white i[data-lucide],
#contato .text-white i[data-lucide] svg {
    stroke: #ffffff !important;
    color: #ffffff !important;
    fill: none !important;
}

/* Forçar cor branca em todos os elementos SVG internos dos ícones de contato */
#contato i[data-lucide].text-white svg *,
#contato .text-white i[data-lucide] svg * {
    stroke: #ffffff !important;
    fill: none !important;
}

#contato i[data-lucide].text-white svg path,
#contato i[data-lucide].text-white svg line,
#contato i[data-lucide].text-white svg polyline,
#contato i[data-lucide].text-white svg circle,
#contato i[data-lucide].text-white svg rect,
#contato .text-white i[data-lucide] svg path,
#contato .text-white i[data-lucide] svg line,
#contato .text-white i[data-lucide] svg polyline,
#contato .text-white i[data-lucide] svg circle,
#contato .text-white i[data-lucide] svg rect {
    stroke: #ffffff !important;
    fill: none !important;
}

/* Garantir que os ícones de WhatsApp e Email sejam exibidos corretamente */
#contato i[data-lucide="message-circle"],
#contato i[data-lucide="mail"],
#contato i[data-lucide="phone"],
footer i[data-lucide="message-circle"],
footer i[data-lucide="mail"],
footer i[data-lucide="phone"] {
    display: inline-block !important;
    vertical-align: middle !important;
    width: 1em !important;
    height: 1em !important;
}

#contato i[data-lucide="message-circle"] svg,
#contato i[data-lucide="mail"] svg,
#contato i[data-lucide="phone"] svg,
footer i[data-lucide="message-circle"] svg,
footer i[data-lucide="mail"] svg,
footer i[data-lucide="phone"] svg {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

/* Garantir que os ícones dentro dos botões de contato sejam sempre visíveis e brancos */
#contato a[data-action="whatsapp"] i[data-lucide],
#contato a[data-whatsapp-link] i[data-lucide],
#contato a[data-email-link] i[data-lucide] {
    display: inline-block !important;
    vertical-align: middle !important;
    color: #ffffff !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
}

#contato a[data-action="whatsapp"] i[data-lucide] svg,
#contato a[data-whatsapp-link] i[data-lucide] svg,
#contato a[data-email-link] i[data-lucide] svg {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    stroke: #ffffff !important;
    fill: none !important;
    color: #ffffff !important;
}

#contato a[data-action="whatsapp"] i[data-lucide] svg path,
#contato a[data-action="whatsapp"] i[data-lucide] svg line,
#contato a[data-action="whatsapp"] i[data-lucide] svg polyline,
#contato a[data-action="whatsapp"] i[data-lucide] svg circle,
#contato a[data-whatsapp-link] i[data-lucide] svg path,
#contato a[data-whatsapp-link] i[data-lucide] svg line,
#contato a[data-whatsapp-link] i[data-lucide] svg polyline,
#contato a[data-whatsapp-link] i[data-lucide] svg circle,
#contato a[data-email-link] i[data-lucide] svg path,
#contato a[data-email-link] i[data-lucide] svg line,
#contato a[data-email-link] i[data-lucide] svg polyline,
#contato a[data-email-link] i[data-lucide] svg circle {
    stroke: #ffffff !important;
    fill: none !important;
}

/* Garantir layout consistente dos botões de contato em mobile e desktop */
#contato a[data-action="whatsapp"],
#contato a[data-whatsapp-link],
#contato a[data-email-link] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1rem !important;
    padding: 1rem !important;
    border-radius: 1rem !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

#contato a[data-action="whatsapp"] > div:first-child,
#contato a[data-whatsapp-link] > div:first-child,
#contato a[data-email-link] > div:first-child {
    width: 3rem !important;
    height: 3rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0.75rem !important;
    background: rgba(255, 255, 255, 0.2) !important;
    flex-shrink: 0 !important;
}

#contato a[data-action="whatsapp"] > div:last-child,
#contato a[data-whatsapp-link] > div:last-child,
#contato a[data-email-link] > div:last-child {
    text-align: center !important;
    flex: 1 !important;
}

#contato a[data-action="whatsapp"] p,
#contato a[data-whatsapp-link] p,
#contato a[data-email-link] p {
    margin: 0 !important;
    color: #ffffff !important;
}

/* Regras adicionais para ícones dentro de divs com classes de cor */
div.text-red-500 i[data-lucide] svg,
div.text-orange-500 i[data-lucide] svg,
div.text-yellow-500 i[data-lucide] svg,
div.text-amber-500 i[data-lucide] svg,
div.text-white i[data-lucide] svg {
    stroke: currentColor !important;
    color: inherit !important;
}

/* Forçar cores diretamente nos SVGs para garantir compatibilidade (Desktop e Mobile) */
i[data-lucide].text-red-500 svg path,
i[data-lucide].text-red-500 svg line,
i[data-lucide].text-red-500 svg polyline,
i[data-lucide].text-red-500 svg circle,
i[data-lucide].text-red-500 svg rect,
.text-red-500 i[data-lucide] svg path,
.text-red-500 i[data-lucide] svg line,
.text-red-500 i[data-lucide] svg polyline,
.text-red-500 i[data-lucide] svg circle,
.text-red-500 i[data-lucide] svg rect {
    stroke: #ef4444 !important;
}

i[data-lucide].text-orange-500 svg path,
i[data-lucide].text-orange-500 svg line,
i[data-lucide].text-orange-500 svg polyline,
i[data-lucide].text-orange-500 svg circle,
i[data-lucide].text-orange-500 svg rect,
.text-orange-500 i[data-lucide] svg path,
.text-orange-500 i[data-lucide] svg line,
.text-orange-500 i[data-lucide] svg polyline,
.text-orange-500 i[data-lucide] svg circle,
.text-orange-500 i[data-lucide] svg rect {
    stroke: #f97316 !important;
}

i[data-lucide].text-yellow-500 svg path,
i[data-lucide].text-yellow-500 svg line,
i[data-lucide].text-yellow-500 svg polyline,
i[data-lucide].text-yellow-500 svg circle,
i[data-lucide].text-yellow-500 svg rect,
.text-yellow-500 i[data-lucide] svg path,
.text-yellow-500 i[data-lucide] svg line,
.text-yellow-500 i[data-lucide] svg polyline,
.text-yellow-500 i[data-lucide] svg circle,
.text-yellow-500 i[data-lucide] svg rect {
    stroke: #eab308 !important;
}

i[data-lucide].text-amber-500 svg path,
i[data-lucide].text-amber-500 svg line,
i[data-lucide].text-amber-500 svg polyline,
i[data-lucide].text-amber-500 svg circle,
i[data-lucide].text-amber-500 svg rect,
.text-amber-500 i[data-lucide] svg path,
.text-amber-500 i[data-lucide] svg line,
.text-amber-500 i[data-lucide] svg polyline,
.text-amber-500 i[data-lucide] svg circle,
.text-amber-500 i[data-lucide] svg rect {
    stroke: #f59e0b !important;
}

i[data-lucide].text-white svg path,
i[data-lucide].text-white svg line,
i[data-lucide].text-white svg polyline,
i[data-lucide].text-white svg circle,
i[data-lucide].text-white svg rect,
.text-white i[data-lucide] svg path,
.text-white i[data-lucide] svg line,
.text-white i[data-lucide] svg polyline,
.text-white i[data-lucide] svg circle,
.text-white i[data-lucide] svg rect {
    stroke: #ffffff !important;
}

/* Animations */
@-webkit-keyframes float {
    0%, 100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
    50% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@keyframes float {
    0%, 100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
    50% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@-webkit-keyframes pulse-slow {
    0%, 100% {
        opacity: 0.1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        opacity: 0.2;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
}

@keyframes pulse-slow {
    0%, 100% {
        opacity: 0.1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        opacity: 0.2;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
}

@-webkit-keyframes fade-in {
    from {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.animate-float {
    -webkit-animation: float 6s ease-in-out infinite;
    -moz-animation: float 6s ease-in-out infinite;
    -o-animation: float 6s ease-in-out infinite;
    animation: float 6s ease-in-out infinite;
}

.animate-pulse-slow {
    -webkit-animation: pulse-slow 8s ease-in-out infinite;
    -moz-animation: pulse-slow 8s ease-in-out infinite;
    -o-animation: pulse-slow 8s ease-in-out infinite;
    animation: pulse-slow 8s ease-in-out infinite;
}

.animate-pulse-slow-delayed {
    -webkit-animation: pulse-slow 10s ease-in-out infinite 1s;
    -moz-animation: pulse-slow 10s ease-in-out infinite 1s;
    -o-animation: pulse-slow 10s ease-in-out infinite 1s;
    animation: pulse-slow 10s ease-in-out infinite 1s;
}

.animate-fade-in {
    -webkit-animation: fade-in 0.8s ease-out;
    -moz-animation: fade-in 0.8s ease-out;
    -o-animation: fade-in 0.8s ease-out;
    animation: fade-in 0.8s ease-out;
}

.animate-fade-in-delayed {
    -webkit-animation: fade-in 0.8s ease-out 0.2s both;
    -moz-animation: fade-in 0.8s ease-out 0.2s both;
    -o-animation: fade-in 0.8s ease-out 0.2s both;
    animation: fade-in 0.8s ease-out 0.2s both;
}

.animate-fade-in-delayed-2 {
    -webkit-animation: fade-in 0.8s ease-out 0.4s both;
    -moz-animation: fade-in 0.8s ease-out 0.4s both;
    -o-animation: fade-in 0.8s ease-out 0.4s both;
    animation: fade-in 0.8s ease-out 0.4s both;
}

.animate-fade-in-delayed-3 {
    -webkit-animation: fade-in 0.8s ease-out 0.6s both;
    -moz-animation: fade-in 0.8s ease-out 0.6s both;
    -o-animation: fade-in 0.8s ease-out 0.6s both;
    animation: fade-in 0.8s ease-out 0.6s both;
}

/* Navigation Links */
.nav-link {
    position: relative;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.3s;
    color: #ffffff !important;
}

.dark .nav-link {
    color: #ffffff !important;
}

/* Company name "PROSPER" should be orange */
[data-empresa-nome] {
    color: #f59e0b !important;
}

/* Hamburger menu icon should be orange on mobile */
#mobileMenuBtn,
#mobileMenuBtn i,
#mobileMenuBtn svg {
    color: #f59e0b !important;
    fill: none !important;
}

/* Garantir que o ícone do menu seja visível com contorno âmbar */
#mobileMenuBtn i[data-lucide] svg,
#mobileMenuBtn i[data-lucide] svg path,
#mobileMenuBtn i[data-lucide] svg line,
#mobileMenuBtn i[data-lucide] svg polyline {
    stroke: #f59e0b !important;
    color: #f59e0b !important;
    fill: none !important;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: -webkit-linear-gradient(left, #f59e0b, #eab308);
    background: -moz-linear-gradient(left, #f59e0b, #eab308);
    background: -o-linear-gradient(left, #f59e0b, #eab308);
    background: linear-gradient(to right, #f59e0b, #eab308);
    -webkit-transition: width 0.3s ease;
    -moz-transition: width 0.3s ease;
    -o-transition: width 0.3s ease;
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

.nav-link:hover {
    color: #f59e0b;
}

.dark .nav-link:hover {
    color: #fbbf24;
}

.nav-link.active {
    color: #f59e0b;
    font-weight: 600;
}

.nav-link.active::after {
    width: 100%;
}

.nav-link.active::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(245, 158, 11, 0.08);
    border-radius: 0.5rem;
    z-index: -1;
}

/* Mobile Nav Links */
.mobile-nav-link {
    color: #f59e0b !important;
    -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

.dark .mobile-nav-link {
    color: #f59e0b !important;
}

.mobile-nav-link:hover,
.mobile-nav-link:active {
    color: #d97706 !important;
    -webkit-tap-highlight-color: rgba(245, 158, 11, 0.3);
}

.mobile-nav-link.active {
    background: rgba(245, 158, 11, 0.1);
    border-left: 4px solid #f59e0b;
    color: #f59e0b !important;
    -webkit-tap-highlight-color: rgba(245, 158, 11, 0.3);
}

.dark .mobile-nav-link.active {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b !important;
}

/* Safari specific fixes for mobile nav */
@supports (-webkit-touch-callout: none) {
    .mobile-nav-link {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
        touch-action: manipulation;
    }
}

/* Glass Effect */
.glass-card {
    background: rgba(255, 255, 255, 0.95);
    background: rgba(255, 255, 255, 0.8);
    -webkit-backdrop-filter: blur(10px);
    -moz-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

/* Fallback for browsers without backdrop-filter support */
@supports not (backdrop-filter: blur(10px)) {
    .glass-card {
        background: rgba(255, 255, 255, 0.95);
    }
}

.dark .glass-card {
    background: rgba(17, 24, 39, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Smooth Scroll - Cross Browser */
html {
    -webkit-scroll-behavior: smooth;
    -moz-scroll-behavior: smooth;
    -ms-scroll-behavior: smooth;
    scroll-behavior: smooth;
    /* Fix for iOS smooth scrolling */
    -webkit-overflow-scrolling: touch;
}

/* Ensure smooth scroll works on all browsers */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

/* Fallback for browsers that don't support smooth scroll */
@supports not (scroll-behavior: smooth) {
    html {
        scroll-behavior: auto;
    }
}

/* Custom Scrollbar */
/* Webkit browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.dark ::-webkit-scrollbar-track {
    background: #1f2937;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #f59e0b, #eab308);
    border-radius: 10px;
    border: 2px solid #f1f1f1;
    transition: background 0.3s ease;
}

.dark ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #f59e0b, #eab308);
    border: 2px solid #1f2937;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #d97706, #ca8a04);
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #f59e0b #f1f1f1;
}

.dark * {
    scrollbar-color: #f59e0b #1f2937;
}

/* Service Cards - Unified Hover */
#servicos .service-card {
    cursor: pointer;
}

/* Garantir cor padrão do título - maior especificidade para sobrescrever Tailwind */
#servicos .service-card .service-card-title {
    color: #111827 !important;
    transition: color 0.3s ease;
}

/* Título muda de cor quando passar o mouse no card - maior especificidade */
#servicos .service-card:hover .service-card-title {
    color: #f59e0b !important;
}

/* FAQ Animations */
.faq-item {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.faq-item:hover {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.faq-item.open {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
    box-shadow: 0 20px 25px -5px rgba(245, 158, 11, 0.1), 0 10px 10px -5px rgba(245, 158, 11, 0.04);
    border-left: 4px solid #f59e0b;
}

.faq-question {
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    padding-right: 1rem;
}

.faq-question:hover {
    color: #f59e0b;
}

.faq-question i {
    -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-transform-origin: center;
    transform-origin: center;
}

.faq-item.open .faq-question i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    color: #f59e0b;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s,
                -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s,
                padding 0.3s ease;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s,
                transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s,
                padding 0.3s ease;
    padding-top: 0;
    padding-bottom: 0;
}

.faq-item.open .faq-answer {
    max-height: 1000px;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    padding-top: 1rem;
    padding-bottom: 0.5rem;
}

/* Animação de clique no item */
.faq-item:active {
    -webkit-transform: translateY(0px) scale(0.98);
    transform: translateY(0px) scale(0.98);
}

/* Animação de entrada suave para o conteúdo */
.faq-item.open .faq-answer {
    animation: slideDown 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

@-webkit-keyframes slideDown {
    from {
        opacity: 0;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* Efeito de brilho ao abrir */
.faq-item.open::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, #f59e0b, transparent);
    animation: shimmer 0.6s ease-out;
}

@-webkit-keyframes shimmer {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    100% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
}

@keyframes shimmer {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    100% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
}

/* Animação de bounce sutil ao abrir */
@-webkit-keyframes faqBounce {
    0% {
        -webkit-transform: translateY(-2px) scale(1);
        transform: translateY(-2px) scale(1);
    }
    50% {
        -webkit-transform: translateY(-4px) scale(1.01);
        transform: translateY(-4px) scale(1.01);
    }
    100% {
        -webkit-transform: translateY(-2px) scale(1);
        transform: translateY(-2px) scale(1);
    }
}

@keyframes faqBounce {
    0% {
        -webkit-transform: translateY(-2px) scale(1);
        transform: translateY(-2px) scale(1);
    }
    50% {
        -webkit-transform: translateY(-4px) scale(1.01);
        transform: translateY(-4px) scale(1.01);
    }
    100% {
        -webkit-transform: translateY(-2px) scale(1);
        transform: translateY(-2px) scale(1);
    }
}

/* Header Scroll Effect */
header.scrolled {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

/* Header - Desktop and Mobile - Force dark background */
header#header,
#header {
    background: rgba(17, 24, 39, 0.95) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* Override any white background classes from Tailwind */
header#header[class*="bg-white"],
#header[class*="bg-white"],
header#header.bg-white\/80,
#header.bg-white\/80 {
    background: rgba(17, 24, 39, 0.95) !important;
}

/* Nav links should be white on desktop and mobile */
#header .nav-link {
    color: #ffffff !important;
}

/* Company name "PROSPER" should be orange on desktop and mobile */
#header [data-empresa-nome] {
    color: #f59e0b !important;
}

/* iOS Mobile Header Fix - Force dark background */
@media (max-width: 1024px) {
    header#header,
    #header {
        background: rgba(17, 24, 39, 0.95) !important;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
    
    /* Override any white background classes from Tailwind */
    header#header[class*="bg-white"],
    #header[class*="bg-white"] {
        background: rgba(17, 24, 39, 0.95) !important;
    }
    
    /* Nav links should be white */
    #header .nav-link {
        color: #ffffff !important;
    }
    
    /* Company name "PROSPER" should be orange */
    #header [data-empresa-nome] {
        color: #f59e0b !important;
    }
    
    /* Menu button icon (hamburger) should be orange */
    #header #mobileMenuBtn,
    #header #mobileMenuBtn i,
    #header #mobileMenuBtn svg {
        color: #f59e0b !important;
        fill: none !important;
    }
    
    /* Garantir que o ícone do menu seja visível com contorno âmbar */
    #header #mobileMenuBtn i[data-lucide] svg,
    #header #mobileMenuBtn i[data-lucide] svg path,
    #header #mobileMenuBtn i[data-lucide] svg line,
    #header #mobileMenuBtn i[data-lucide] svg polyline {
        stroke: #f59e0b !important;
        color: #f59e0b !important;
        fill: none !important;
    }
    
    /* Mobile menu background */
    #header #mobileMenu {
        background: rgba(17, 24, 39, 0.98) !important;
        border-top-color: rgba(255, 255, 255, 0.1) !important;
    }
    
    /* Text inside mobile menu should be orange for navigation links */
    #header #mobileMenu .mobile-nav-link {
        color: #f59e0b !important;
    }
}

/* Additional iOS Safari specific fix */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 1024px) {
        header#header,
        #header {
            background: rgba(17, 24, 39, 0.95) !important;
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
        }
        
        /* Nav links should be white */
        #header .nav-link {
            color: #ffffff !important;
        }
        
        /* Company name "PROSPER" should be orange */
        #header [data-empresa-nome] {
            color: #f59e0b !important;
        }
        
        /* Menu button icon (hamburger) should be orange */
        #header #mobileMenuBtn,
        #header #mobileMenuBtn i,
        #header #mobileMenuBtn svg {
            color: #f59e0b !important;
            fill: none !important;
        }
        
        /* Garantir que o ícone do menu seja visível com contorno âmbar */
        #header #mobileMenuBtn i[data-lucide] svg,
        #header #mobileMenuBtn i[data-lucide] svg path,
        #header #mobileMenuBtn i[data-lucide] svg line,
        #header #mobileMenuBtn i[data-lucide] svg polyline {
            stroke: #f59e0b !important;
            color: #f59e0b !important;
            fill: none !important;
        }
        
        /* Text inside mobile menu should be orange for navigation links */
        #header #mobileMenu .mobile-nav-link {
            color: #f59e0b !important;
        }
    }
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .animate-fade-in,
    .animate-fade-in-delayed,
    .animate-fade-in-delayed-2,
    .animate-fade-in-delayed-3 {
        animation: none;
    }
}

/* Scroll Animations */
.fade-in-on-scroll {
    opacity: 0;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease;
    -moz-transition: opacity 0.6s ease, -moz-transform 0.6s ease;
    -o-transition: opacity 0.6s ease, -o-transform 0.6s ease;
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-on-scroll.visible {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .animate-float,
    .animate-pulse-slow,
    .animate-pulse-slow-delayed,
    .animate-fade-in,
    .animate-fade-in-delayed,
    .animate-fade-in-delayed-2,
    .animate-fade-in-delayed-3 {
        animation: none !important;
    }
    
    .fade-in-on-scroll {
        opacity: 1;
        transform: none;
    }
    
    html {
        scroll-behavior: auto;
    }
}

/* Contact Section - Desktop: Card branco */
@media (min-width: 641px) {
    /* Forçar card branco no desktop */
    #contato .bg-white\/80,
    #contato .dark\:bg-gray-800\/80,
    #contato [class*="bg-white"],
    #contato [class*="bg-gray-800"] {
        background: #ffffff !important;
        background-color: #ffffff !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    
    /* Fix text colors - garantir texto escuro no desktop */
    #contato h2,
    #contato h3 {
        color: #111827 !important;
    }
    
    #contato p,
    #contato span {
        color: #374151 !important;
    }
    
    /* Force dark text for better readability */
    #contato .text-gray-600,
    #contato .text-gray-400,
    #contato .dark\:text-gray-400 {
        color: #374151 !important;
    }
}

/* Contact Section Mobile Improvements */
@media (max-width: 640px) {
    /* Forçar card branco no mobile (iOS e Android) */
    #contato .bg-white\/80,
    #contato .dark\:bg-gray-800\/80,
    #contato [class*="bg-white"],
    #contato [class*="bg-gray-800"] {
        background: #ffffff !important;
        background-color: #ffffff !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    
    /* Fix text colors - garantir texto escuro */
    #contato h2,
    #contato h3 {
        color: #111827 !important;
    }
    
    #contato p,
    #contato span {
        color: #374151 !important;
    }
    
    /* Force dark text for better readability */
    #contato .text-gray-600,
    #contato .text-gray-400,
    #contato .dark\:text-gray-400 {
        color: #374151 !important;
    }
    
    /* Garantir que os botões de contato mantenham suas cores e aparência */
    #contato a[data-action="whatsapp"],
    #contato a[data-whatsapp-link] {
        background: #25D366 !important;
        background-color: #25D366 !important;
    }
    
    #contato a[data-action="whatsapp"]:hover,
    #contato a[data-whatsapp-link]:hover {
        background: #20BA5A !important;
        background-color: #20BA5A !important;
    }
    
    #contato a[data-email-link] {
        background: #4285F4 !important;
        background-color: #4285F4 !important;
    }
    
    #contato a[data-email-link]:hover {
        background: #357AE8 !important;
        background-color: #357AE8 !important;
    }
    
    /* Garantir que o texto dentro dos botões seja branco */
    #contato a[data-action="whatsapp"] *,
    #contato a[data-whatsapp-link] *,
    #contato a[data-email-link] * {
        color: #ffffff !important;
    }
    
    /* Garantir que os ícones dentro dos botões sejam brancos e visíveis */
    #contato a[data-action="whatsapp"] i[data-lucide],
    #contato a[data-whatsapp-link] i[data-lucide],
    #contato a[data-email-link] i[data-lucide] {
        color: #ffffff !important;
        display: inline-block !important;
    }
    
    #contato a[data-action="whatsapp"] i[data-lucide] svg,
    #contato a[data-whatsapp-link] i[data-lucide] svg,
    #contato a[data-email-link] i[data-lucide] svg {
        stroke: #ffffff !important;
        fill: none !important;
        display: block !important;
    }
    
    /* But keep links and buttons with their original colors */
    #contato a[href^="https://wa.me"],
    #contato a[href^="mailto"],
    #contato a[href^="tel:"] {
        color: #ffffff !important;
    }
    
    #contato a {
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.2);
        touch-action: manipulation;
    }
    
    #contato a:active {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    
    #contato .rounded-xl {
        border-radius: 0.75rem;
    }
    
    #contato h2 {
        line-height: 1.2;
        color: #111827 !important;
    }
    
    #contato h3 {
        color: #111827 !important;
    }
}

/* iOS and Android - Contact Section Fixes */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 1024px) {
        /* Forçar card branco no iOS */
        #contato .bg-white\/80,
        #contato .dark\:bg-gray-800\/80,
        #contato [class*="bg-white"],
        #contato [class*="bg-gray-800"] {
            background: #ffffff !important;
            background-color: #ffffff !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
        }
        
        /* Fix text colors - garantir texto escuro */
        #contato h2,
        #contato h3,
        #contato p {
            color: #111827 !important;
        }
        
        /* Force dark text */
        #contato .text-gray-600,
        #contato .text-gray-400,
        #contato .dark\:text-gray-400 {
            color: #374151 !important;
        }
        
        /* Garantir que os botões de contato mantenham suas cores no iOS */
        #contato a[data-action="whatsapp"],
        #contato a[data-whatsapp-link] {
            background: #25D366 !important;
            background-color: #25D366 !important;
        }
        
        #contato a[data-email-link] {
            background: #4285F4 !important;
            background-color: #4285F4 !important;
        }
        
        /* Garantir que os ícones sejam brancos e visíveis no iOS */
        #contato a[data-action="whatsapp"] i[data-lucide] svg,
        #contato a[data-whatsapp-link] i[data-lucide] svg,
        #contato a[data-email-link] i[data-lucide] svg {
            stroke: #ffffff !important;
            fill: none !important;
        }
    }
}

/* Android Chrome - Contact Section Fixes */
@supports (-webkit-appearance: none) and (not (-webkit-touch-callout: none)) {
    @media (max-width: 1024px) {
        /* Forçar card branco no Android */
        #contato .bg-white\/80,
        #contato .dark\:bg-gray-800\/80,
        #contato [class*="bg-white"],
        #contato [class*="bg-gray-800"] {
            background: #ffffff !important;
            background-color: #ffffff !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
        }
        
        /* Fix text colors - garantir texto escuro */
        #contato h2,
        #contato h3,
        #contato p {
            color: #111827 !important;
        }
        
        /* Force dark text */
        #contato .text-gray-600,
        #contato .text-gray-400,
        #contato .dark\:text-gray-400 {
            color: #374151 !important;
        }
        
        /* Garantir que os botões de contato mantenham suas cores no Android */
        #contato a[data-action="whatsapp"],
        #contato a[data-whatsapp-link] {
            background: #25D366 !important;
            background-color: #25D366 !important;
        }
        
        #contato a[data-email-link] {
            background: #4285F4 !important;
            background-color: #4285F4 !important;
        }
        
        /* Garantir que os ícones sejam brancos e visíveis no Android */
        #contato a[data-action="whatsapp"] i[data-lucide] svg,
        #contato a[data-whatsapp-link] i[data-lucide] svg,
        #contato a[data-email-link] i[data-lucide] svg {
            stroke: #ffffff !important;
            fill: none !important;
        }
    }
}

/* Ensure text doesn't overflow on very small screens */
@media (max-width: 375px) {
    #contato p {
        font-size: 0.875rem;
    }
    
    #contato h3 {
        font-size: 1.125rem;
    }
}

/* Backdrop filter fallbacks */
@supports not (backdrop-filter: blur(10px)) {
    header.bg-white\/80,
    header.bg-gray-900\/80 {
        background: rgba(255, 255, 255, 0.95) !important;
    }
    
    .dark header.bg-gray-900\/80 {
        background: rgba(17, 24, 39, 0.95) !important;
    }
    
    .bg-white\/80,
    .bg-gray-800\/80 {
        background: rgba(255, 255, 255, 0.95) !important;
    }
    
    .dark .bg-gray-800\/80 {
        background: rgba(31, 41, 55, 0.95) !important;
    }
}

/* Additional browser compatibility fixes */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Fix for flexbox in older browsers */
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

/* Fix for transform in older browsers */
.transform,
[class*="transform"] {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/* Fix for transition in older browsers */
.transition-all,
[class*="transition"] {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* Safari iOS specific fixes */
@supports (-webkit-touch-callout: none) {
    button,
    a {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
        touch-action: manipulation;
    }
    
    .mobile-nav-link,
    .nav-link {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
    }
    
    /* Fix for backdrop-filter on iOS Safari */
    header,
    #header {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background: rgba(17, 24, 39, 0.95) !important;
    }
    
    /* Force dark background for header on iOS */
    @media (max-width: 1024px) {
        header,
        #header {
            background: rgba(17, 24, 39, 0.95) !important;
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
        }
        
        /* Ensure text is visible on dark background */
        header .text-gray-900,
        #header .text-gray-900 {
            color: #ffffff !important;
        }
        
        /* Logo and text should be visible */
        header button,
        #header button {
            color: #ffffff;
        }
        
        /* Hamburger menu icon */
        header i[data-lucide],
        #header i[data-lucide] {
            color: #ffffff !important;
        }
    }
    
    /* Fix for smooth scrolling on iOS */
    html {
        -webkit-overflow-scrolling: touch;
    }
}

/* Additional mobile header fixes - removed duplicate rules, using universal rules above */

/* ============================================
   CROSS-BROWSER & CROSS-DEVICE COMPATIBILITY
   ============================================ */

/* Universal Reset for Consistent Rendering */
*,
*::before,
*::after {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Prevent horizontal scroll globally */
html {
    overflow-x: hidden;
    width: 100%;
    max-width: 100vw;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* Fix for iOS Safari viewport height */
    height: 100%;
    height: -webkit-fill-available;
}

body {
    overflow-x: hidden;
    width: 100%;
    max-width: 100vw;
    position: relative;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    /* Prevent text selection issues on mobile */
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    /* Fix font rendering */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* iOS Safari Specific Fixes */
@supports (-webkit-touch-callout: none) {
    /* Fix for iOS viewport units */
    html {
        height: -webkit-fill-available;
    }
    
    body {
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    
    /* Fix for safe area insets (iPhone X and newer) */
    #header {
        padding-top: env(safe-area-inset-top);
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
    
    /* Fix for backdrop-filter on iOS */
    header,
    #header {
        -webkit-backdrop-filter: blur(10px);
        -moz-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
    
    /* Fix for sticky positioning on iOS */
    .fixed {
        position: -webkit-sticky;
        position: sticky;
    }
    
    /* Fix for smooth scrolling on iOS */
    html {
        -webkit-overflow-scrolling: touch;
    }
    
    /* Fix for input zoom on iOS */
    input,
    textarea,
    select {
        font-size: 16px !important;
    }
    
    /* Fix for button tap highlight */
    button,
    a {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
    }
}

/* Android Chrome Specific Fixes */
@supports (-webkit-appearance: none) and (not (-webkit-touch-callout: none)) {
    /* Android specific adjustments */
    html {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        text-size-adjust: 100%;
        height: 100%;
        height: -webkit-fill-available;
    }
    
    body {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        text-size-adjust: 100%;
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    
    /* Fix for Android Chrome address bar */
    @media (max-width: 1024px) {
        html {
            height: -webkit-fill-available;
        }
        
        body {
            min-height: -webkit-fill-available;
        }
    }
    
    /* Fix for Android tap highlight */
    button,
    a {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
        touch-action: manipulation;
    }
    
    /* Fix for Lucide icons on Android - Usar as mesmas regras do desktop */
    /* As regras universais já aplicam, apenas garantir que funcionem no Android */
    [data-lucide] svg {
        stroke: currentColor !important;
        fill: none !important;
    }
}

/* Universal Mobile Fixes - iPhone and Android */
@media (max-width: 1024px) {
    /* Prevent text size adjustment on mobile */
    html {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        text-size-adjust: 100%;
        font-size: 16px;
        /* Fix viewport height for mobile browsers */
        height: 100%;
        height: -webkit-fill-available;
    }
    
    body {
        overflow-x: hidden;
        width: 100%;
        max-width: 100vw;
        min-height: 100vh;
        min-height: -webkit-fill-available;
        /* Prevent pull-to-refresh on mobile */
        overscroll-behavior-y: contain;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Fix for tap highlights - consistent for iOS and Android */
    a,
    button {
        -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
        touch-action: manipulation;
        min-height: 44px;
        min-width: 44px;
        /* Prevent text selection on buttons */
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    /* Fix for smooth scrolling on mobile */
    html {
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }
    
    /* Ensure consistent font rendering */
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
    }
    
    /* Container fixes */
    .container {
        width: 100%;
        max-width: 100%;
        padding-left: 1rem;
        padding-right: 1rem;
        /* Add safe area padding for notched devices */
        padding-left: calc(1rem + env(safe-area-inset-left));
        padding-right: calc(1rem + env(safe-area-inset-right));
    }
    
    /* Prevent horizontal scroll */
    * {
        max-width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    /* Text sizing for mobile - consistent across devices */
    h1 {
        font-size: 2rem !important;
        line-height: 1.2 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    h2 {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    h3 {
        font-size: 1.5rem !important;
        line-height: 1.4 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    p {
        font-size: 1rem !important;
        line-height: 1.6 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    /* Button sizing - consistent touch targets */
    button {
        padding: 0.75rem 1.5rem !important;
        font-size: 0.875rem !important;
        /* Ensure buttons are easily tappable */
        min-height: 44px;
        min-width: 44px;
    }
    
    /* Section padding */
    section {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
        /* Add safe area padding */
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
    
    /* Card spacing */
    .rounded-2xl,
    .rounded-3xl {
        padding: 1rem !important;
        margin-bottom: 1rem !important;
    }
    
    /* Grid adjustments */
    .grid {
        gap: 1rem !important;
    }
    
    /* Header adjustments for mobile */
    #header {
        /* Ensure header respects safe area */
        padding-top: calc(0.5rem + env(safe-area-inset-top));
        padding-left: calc(1rem + env(safe-area-inset-left));
        padding-right: calc(1rem + env(safe-area-inset-right));
    }
    
    /* Hero section adjustments */
    #hero {
        /* Account for header height and safe area */
        padding-top: calc(12rem + env(safe-area-inset-top));
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
}

/* Small Mobile Devices (iPhone SE, etc) */
@media (max-width: 375px) {
    html {
        font-size: 14px;
    }
    
    h1 {
        font-size: 1.75rem !important;
    }
    
    h2 {
        font-size: 1.5rem !important;
    }
    
    h3 {
        font-size: 1.25rem !important;
    }
    
    .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    section {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }
    
    button {
        padding: 0.625rem 1.25rem !important;
        font-size: 0.8125rem !important;
    }
}

/* Medium Mobile Devices */
@media (min-width: 376px) and (max-width: 768px) {
    html {
        font-size: 15px;
    }
    
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Desktop Browser Compatibility */
@media (min-width: 1025px) {
    /* Chrome, Edge, Firefox, Safari Desktop */
    * {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    
    /* Fix for backdrop-filter on desktop */
    header,
    #header {
        -webkit-backdrop-filter: blur(10px);
        -moz-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
    
    /* Ensure consistent rendering across desktop browsers */
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
    }
    
    /* Fix for Chrome/Edge */
    @supports (-webkit-appearance: none) {
        * {
            -webkit-font-smoothing: antialiased;
        }
    }
    
    /* Fix for Firefox */
    @-moz-document url-prefix() {
        * {
            -moz-osx-font-smoothing: grayscale;
        }
    }
    
    /* Fix for Safari Desktop */
    @supports (-webkit-touch-callout: none) {
        * {
            -webkit-font-smoothing: antialiased;
        }
    }
}

/* Firefox Specific Fixes */
@-moz-document url-prefix() {
    /* Firefox specific adjustments */
    * {
        scrollbar-width: thin;
        scrollbar-color: #f59e0b #f1f1f1;
    }
    
    .dark * {
        scrollbar-color: #f59e0b #1f2937;
    }
    
    /* Fix for backdrop-filter in Firefox */
    header,
    #header {
        background: rgba(17, 24, 39, 0.98) !important;
    }
    
    /* Fix for font rendering */
    body {
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Edge Specific Fixes */
@supports (-ms-ime-align: auto) {
    /* Edge Legacy specific adjustments */
    body {
        -ms-overflow-style: -ms-autohiding-scrollbar;
    }
}

/* Edge Chromium Fixes */
@supports (-webkit-appearance: none) and (not (-moz-appearance: none)) {
    /* Edge Chromium uses Chromium engine, similar to Chrome */
    * {
        -webkit-font-smoothing: antialiased;
    }
}

/* Universal Header Consistency */
header#header,
#header {
    /* Force consistent background across all devices */
    background: rgba(17, 24, 39, 0.95) !important;
    -webkit-backdrop-filter: blur(10px);
    -moz-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    /* Fix for iOS safe area */
    padding-top: env(safe-area-inset-top);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    /* Ensure consistent positioning */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    /* Prevent layout shift */
    will-change: transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Universal Text Colors */
#header .nav-link {
    color: #ffffff !important;
}

#header [data-empresa-nome] {
    color: #f59e0b !important;
}

/* Universal Button Fixes */
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: transparent;
    cursor: pointer;
}

/* Universal Input Fixes */
input,
textarea,
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

/* Universal Image Fixes */
img {
    max-width: 100%;
    height: auto;
    display: block;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    /* Prevent image selection on mobile */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* Fix for image loading and rendering */
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    image-rendering: optimize-quality;
    /* Prevent layout shift */
    object-fit: contain;
    /* Fix for iOS image rendering */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    /* Ensure images load properly on all devices */
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    /* Fix for Android image rendering */
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Image loading states */
img[loading="lazy"] {
    opacity: 0;
    transition: opacity 0.3s;
}

img[loading="lazy"].loaded {
    opacity: 1;
}

/* Fallback for browsers that don't support loading attribute */
img:not([loading]) {
    opacity: 1;
}

/* Universal Link Fixes */
a {
    text-decoration: none;
    color: inherit;
    -webkit-tap-highlight-color: rgba(245, 158, 11, 0.2);
}

/* Universal Flexbox Fixes */
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

/* Universal Grid Fixes */
.grid {
    display: -webkit-grid;
    display: -moz-grid;
    display: -ms-grid;
    display: grid;
}

/* Universal Transform Fixes */
[class*="transform"],
[class*="translate"],
[class*="scale"],
[class*="rotate"] {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Universal Transition Fixes */
[class*="transition"] {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* Universal Border Radius Fixes */
[class*="rounded"] {
    -webkit-border-radius: inherit;
    -moz-border-radius: inherit;
    border-radius: inherit;
}

/* Universal Box Shadow Fixes */
[class*="shadow"] {
    -webkit-box-shadow: inherit;
    -moz-box-shadow: inherit;
    box-shadow: inherit;
}

/* Universal Opacity Fixes */
[class*="opacity"] {
    -webkit-opacity: inherit;
    -moz-opacity: inherit;
    opacity: inherit;
    filter: alpha(opacity=100);
}

/* Universal Gradient Fixes */
[class*="gradient"] {
    background: -webkit-linear-gradient(inherit);
    background: -moz-linear-gradient(inherit);
    background: -o-linear-gradient(inherit);
    background: linear-gradient(inherit);
}

/* Mobile Text Size Increases */
@media (max-width: 640px) {
    /* FAQ Questions - Increase font size */
    .faq-question {
        font-size: 1.25rem !important;
        line-height: 1.5 !important;
    }
    
    .faq-question span {
        font-size: 1.25rem !important;
        font-weight: 600 !important;
    }
    
    /* FAQ Answers */
    .faq-answer {
        font-size: 1.0625rem !important;
        line-height: 1.7 !important;
    }
    
    /* Services Section Titles */
    #servicos h3 {
        font-size: 1.5rem !important;
        line-height: 1.4 !important;
        font-weight: 700 !important;
    }
    
    #servicos p {
        font-size: 1.0625rem !important;
        line-height: 1.7 !important;
    }
    
    #servicos ul {
        font-size: 1rem !important;
        line-height: 1.6 !important;
    }
    
    #servicos ul li {
        font-size: 1rem !important;
    }
    
    /* Regulation Section */
    #regulamentacao h2 {
        font-size: 2rem !important;
        line-height: 1.3 !important;
        font-weight: 700 !important;
    }
    
    #regulamentacao h3 {
        font-size: 1.5rem !important;
        line-height: 1.4 !important;
        font-weight: 700 !important;
    }
    
    #regulamentacao p {
        font-size: 1.0625rem !important;
        line-height: 1.7 !important;
    }
    
    /* Prazo section - Make it bigger */
    #regulamentacao .bg-gradient-to-r {
        padding: 2rem 1.5rem !important;
    }
    
    #regulamentacao .bg-gradient-to-r h3 {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
        font-weight: 700 !important;
        margin-bottom: 1rem !important;
    }
    
    #regulamentacao .bg-gradient-to-r p {
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        margin-bottom: 1rem !important;
    }
    
    #regulamentacao .bg-gradient-to-r p.text-base {
        font-size: 1rem !important;
        line-height: 1.6 !important;
    }
}

/* Mobile Responsive Overrides */
@media (max-width: 640px) {
    /* Prevent horizontal scroll */
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
        position: relative;
        /* Prevent pull-to-refresh */
        overscroll-behavior-y: contain;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Fix for scroll on mobile - better approach */
    body {
        position: relative;
        width: 100%;
        min-height: 100vh;
        min-height: -webkit-fill-available;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Ensure smooth scrolling works */
    html {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Hero section adjustments */
    #hero {
        min-height: auto !important;
        padding-top: 12rem !important;
        padding-bottom: 2rem !important;
    }
    
    #hero h1 {
        font-size: 1.75rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1rem !important;
        word-wrap: break-word;
    }
    
    #hero p {
        font-size: 0.9375rem !important;
        margin-bottom: 1rem !important;
        padding: 0 0.5rem;
        word-wrap: break-word;
    }
    
    #hero button {
        width: 100%;
        max-width: 100%;
        padding: 0.75rem 1rem !important;
        font-size: 0.875rem !important;
    }
    
    /* Section titles */
    section {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    
    section h2 {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
        margin-bottom: 1rem !important;
        word-wrap: break-word;
        padding: 0 0.5rem;
    }
    
    section h3 {
        font-size: 1.25rem !important;
        line-height: 1.4 !important;
    }
    
    /* Cards */
    .rounded-2xl,
    .rounded-3xl {
        padding: 1rem !important;
        margin-bottom: 1rem !important;
    }
    
    /* Grid gaps */
    .grid {
        gap: 1rem !important;
    }
    
    /* Container padding */
    .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Images */
    img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* Logo background in hero */
    #hero .absolute img {
        max-width: 80vw !important;
        max-height: 80vh !important;
    }
    
    /* Text content */
    p, span, li {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    /* Buttons and links */
    a, button {
        word-wrap: break-word;
        white-space: normal;
    }
    
    /* Contact section */
    #contato h2 {
        font-size: 1.5rem !important;
        line-height: 1.2 !important;
        padding: 0 0.5rem;
    }
    
    /* Footer */
    footer {
        padding: 1.5rem 1rem !important;
    }
    
    footer .grid {
        gap: 1.5rem !important;
    }
}

/* Very Small Screens */
@media (max-width: 375px) {
    #hero h1 {
        font-size: 1.5rem !important;
    }
    
    section h2 {
        font-size: 1.25rem !important;
    }
    
    .container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
    
    section {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }
}

/* Print Styles */
@media print {
    * {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    
    a,
    a:visited {
        text-decoration: underline;
}

    header,
    footer,
    nav,
    aside {
        display: none;
    }
}