
        * { scrollbar-width: thin; scrollbar-color: #16a34a #f0fdf4; }
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #f0fdf4; }
        ::-webkit-scrollbar-thumb { background: #16a34a; border-radius: 4px; }

        .hero-slide { min-width: 100%; flex-shrink: 0; }
        .mega-menu { opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.3s ease; }
        .mega-menu.active { opacity: 1; visibility: visible; transform: translateY(0); }
        .category-card:hover .category-img { transform: scale(1.08); }
        .product-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgba(0,0,0,0.1); }
        .brand-card:hover .brand-img { transform: scale(1.05); }
        .blog-card:hover .blog-img { transform: scale(1.06); }
        .nav-item:hover .nav-indicator { width: 100%; }
        .fade-up { opacity: 0; transform: translateY(30px); transition: all 0.6s ease; }
        .fade-up.visible { opacity: 1; transform: translateY(0); }

        @keyframes float {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-8px); }
        }
        .float-anim { animation: float 3s ease-in-out infinite; }

        @keyframes pulse-ring {
            0% { transform: scale(1); opacity: 0.6; }
            100% { transform: scale(1.5); opacity: 0; }
        }
        .whatsapp-pulse::before {
            content: '';
            position: absolute;
            inset: 0;
            border-radius: 50%;
            background: #22c55e;
            animation: pulse-ring 1.5s ease-out infinite;
            z-index: -1;
        }

        @keyframes slideIn {
            from { transform: translateX(100%); opacity: 0; }
            to { transform: translateX(0); opacity: 1; }
        }
        .slide-in { animation: slideIn 0.3s ease forwards; }

        .leaf-pattern {
            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 5c5 10 15 15 25 15-10 5-15 15-25 25-5-10-15-15-25-15 10-5 15-15 25-25z' fill='%2322c55e08'/%3E%3C/svg%3E");
        }

        .gradient-text {
            background: linear-gradient(135deg, #166534, #22c55e);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .mobile-menu { transform: translateX(-100%); transition: transform 0.3s ease; }
        .mobile-menu.open { transform: translateX(0); }
        .mobile-overlay { opacity: 0; visibility: hidden; transition: all 0.3s ease; }
        .mobile-overlay.open { opacity: 1; visibility: visible; }

        .toast {
            animation: toastIn 0.4s ease, toastOut 0.4s ease 2.6s forwards;
        }
        @keyframes toastIn {
            from { transform: translateY(100px); opacity: 0; }
            to { transform: translateY(0); opacity: 1; }
        }
        @keyframes toastOut {
            from { transform: translateY(0); opacity: 1; }
            to { transform: translateY(100px); opacity: 0; }
        }

        /* ===== Atacarejo Animation ===== */
        @keyframes tickerScroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }
        .atacarejo-ticker {
            animation: tickerScroll 25s linear infinite;
        }
        .atacarejo-ticker:hover {
            animation-play-state: paused;
        }

        @keyframes floatProduct {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            25% { transform: translateY(-12px) rotate(2deg); }
            50% { transform: translateY(-6px) rotate(-1deg); }
            75% { transform: translateY(-14px) rotate(1deg); }
        }
        .float-product-1 { animation: floatProduct 4s ease-in-out infinite; }
        .float-product-2 { animation: floatProduct 5s ease-in-out infinite 0.5s; }
        .float-product-3 { animation: floatProduct 4.5s ease-in-out infinite 1s; }
        .float-product-4 { animation: floatProduct 5.5s ease-in-out infinite 1.5s; }
        .float-product-5 { animation: floatProduct 4.2s ease-in-out infinite 0.8s; }
        .float-product-6 { animation: floatProduct 5.2s ease-in-out infinite 1.2s; }

        @keyframes pulsePrice {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.08); }
        }
        .pulse-price { animation: pulsePrice 2s ease-in-out infinite; }

        @keyframes shimmer {
            0% { background-position: -200% center; }
            100% { background-position: 200% center; }
        }
        .shimmer-text {
            background: linear-gradient(90deg, #0a1929 0%, #63b3ed 25%, #0a1929 50%, #63b3ed 75%, #0a1929 100%);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
        }

        .shimmer-text-green {
            background: linear-gradient(90deg, #14532d 0%, #4ade80 25%, #14532d 50%, #4ade80 75%, #14532d 100%);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
        }

        @keyframes badgeBounce {
            0%, 100% { transform: rotate(-3deg) scale(1); }
            50% { transform: rotate(3deg) scale(1.1); }
        }
        .badge-bounce { animation: badgeBounce 2s ease-in-out infinite; }

        @keyframes scaleIn {
            0% { transform: scale(0.8); opacity: 0; }
            100% { transform: scale(1); opacity: 1; }
        }
        .scale-in { animation: scaleIn 0.5s ease forwards; }

        /* ===== Atacarejo Enhanced Effects ===== */
        @keyframes sparkle {
            0%, 100% { opacity: 0; transform: scale(0) rotate(0deg); }
            50% { opacity: 1; transform: scale(1) rotate(180deg); }
        }
        .sparkle-dot {
            position: absolute;
            width: 5px;
            height: 5px;
            background: white;
            border-radius: 50%;
            animation: sparkle 2.5s ease-in-out infinite;
            pointer-events: none;
            z-index: 5;
        }

        @keyframes cardShine {
            0% { transform: translateX(-150%) skewX(-20deg); }
            100% { transform: translateX(250%) skewX(-20deg); }
        }

        @keyframes glowPulse {
            0%, 100% { box-shadow: 0 0 12px rgba(99, 179, 237, 0.15), inset 0 1px 0 rgba(255,255,255,0.05); }
            50% { box-shadow: 0 0 28px rgba(99, 179, 237, 0.35), 0 0 56px rgba(99, 179, 237, 0.1), inset 0 1px 0 rgba(255,255,255,0.1); }
        }

        @keyframes borderGlow {
            0%, 100% { border-color: rgba(99, 179, 237, 0.15); }
            50% { border-color: rgba(147, 197, 253, 0.5); }
        }

        @keyframes priceGlow {
            0%, 100% { text-shadow: 0 0 6px rgba(147, 197, 253, 0.3); }
            50% { text-shadow: 0 0 18px rgba(147, 197, 253, 0.7), 0 0 36px rgba(96, 165, 250, 0.3); }
        }

        @keyframes ctaRing {
            0% { box-shadow: 0 0 0 0 rgba(26, 54, 93, 0.5); }
            70% { box-shadow: 0 0 0 14px rgba(26, 54, 93, 0); }
100% { box-shadow: 0 0 0 0 rgba(26, 54, 93, 0); }
        }

        @keyframes urgencyPulse {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.7; transform: scale(1.05); }
        }

        @keyframes economyFlash {
            0%, 100% { background-position: 0% center; }
            50% { background-position: 100% center; }
        }

        .atac-card-enhanced {
            animation: glowPulse 3s ease-in-out infinite, borderGlow 3s ease-in-out infinite !important;
            position: relative;
            overflow: hidden;
        }
        .atac-card-enhanced::after {
            content: '';
            position: absolute;
            top: 0;
            left: -150%;
            width: 60%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
            animation: cardShine 5s ease-in-out infinite;
            pointer-events: none;
        }
        .atac-card-enhanced:hover {
            transform: translateY(-8px) scale(1.06) !important;
            box-shadow: 0 0 40px rgba(99, 179, 237, 0.45), 0 0 80px rgba(99, 179, 237, 0.15) !important;
            border-color: rgba(147, 197, 253, 0.5) !important;
        }
        .atac-card-enhanced > span.inline-block {
            font-size: 11px !important;
            padding: 3px 8px !important;
            animation: badgeBounce 1.2s ease-in-out infinite !important;
        }

        .atac-price-glow {
            animation: priceGlow 2.5s ease-in-out infinite !important;
        }

        .atac-cta-ring {
            animation: ctaRing 2s ease-in-out infinite !important;
        }

        .atac-urgency {
            animation: urgencyPulse 1.5s ease-in-out infinite;
        }

        .atac-economy-flash {
            background: linear-gradient(90deg, #fbbf24, #f59e0b, #fbbf24);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: economyFlash 2s linear infinite;
        }

        /* Conta Button Animation */
        @keyframes contaGlow {
            0%, 100% { box-shadow: 0 0 5px rgba(22, 163, 74, 0.3), 0 0 15px rgba(22, 163, 74, 0.1); }
            50% { box-shadow: 0 0 10px rgba(22, 163, 74, 0.5), 0 0 25px rgba(22, 163, 74, 0.2), 0 0 40px rgba(22, 163, 74, 0.1); }
        }
        
        @keyframes contaShimmer {
            0% { background-position: -200% center; }
            100% { background-position: 200% center; }
        }
        .conta-btn {
            animation: contaGlow 2.5s ease-in-out infinite;
            position: relative;
            overflow: hidden;
        }
        .conta-btn::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            animation: contaShimmer 3s ease-in-out infinite;
        }
        .conta-btn:hover::before {
            animation-play-state: paused;
        }
        .conta-tooltip {
            position: absolute;
            top: calc(100% + 8px);
            left: 50%;
            transform: translateX(-50%);
            white-space: nowrap;
            z-index: 60;
            animation: contaTooltipFloat 3s ease-in-out infinite;
        }
        .conta-tooltip::after {
            content: '';
            position: absolute;
            top: -4px;
            left: 50%;
            transform: translateX(-50%) rotate(45deg);
            width: 8px;
            height: 8px;
            background: #14532d;
            border-radius: 1px;
        }
        .conta-btn:hover .conta-tooltip {
            animation: none;
            transform: translateX(-50%) scale(1.05);
        }

        @keyframes contaTooltipFloat {
            0%, 100% { transform: translateX(-50%) translateY(0); }
            50% { transform: translateX(-50%) translateY(-5px); }
        }

        @keyframes contaTextShimmer {
            0% { background-position: 0% center; }
            100% { background-position: 200% center; }
        }

        .conta-vantagens-text {
            background: linear-gradient(90deg, #fbbf24, #fde68a, #f59e0b, #fde68a, #fbbf24);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: contaTextShimmer 3s linear infinite;
        }
        
        @keyframes badgePop {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.15); }
        }
        .conta-badge {
            animation: badgePop 1.5s ease-in-out infinite;
        }
    