@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap";:root{--primary:#d32f2f;--primary-hover:#b71c1c;--secondary:#ffc107;--secondary-light:#ffecb3;--accent:#2e7d32;--dark:#212121;--dark-light:#424242;--light:#fffdf6;--white:#fff;--gray-100:#f5f5f5;--gray-200:#eee;--gray-300:#e0e0e0;--gray-600:#757575;--shadow-sm:0 2px 4px #0000000d;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 10px 25px #0000001f;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--font-sans:"Outfit", sans-serif;--font-serif:"Playfair Display", serif;--transition:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--light);color:var(--dark);-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);color:var(--dark);font-weight:700}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--light)}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--primary-hover)}.btn{font-family:var(--font-sans);cursor:pointer;transition:var(--transition);border:none;border-radius:30px;justify-content:center;align-items:center;gap:8px;padding:10px 24px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background-color:var(--primary);color:var(--white);box-shadow:0 4px 10px #d32f2f4d}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 15px #d32f2f66}.btn-secondary{background-color:var(--secondary);color:var(--dark);box-shadow:0 4px 10px #ffc1074d}.btn-secondary:hover{background-color:#ffa000;transform:translateY(-2px);box-shadow:0 6px 15px #ffc10766}.btn-outline{color:var(--primary);border:2px solid var(--primary);background-color:#0000}.btn-outline:hover{background-color:var(--primary);color:var(--white);transform:translateY(-2px)}.glass{-webkit-backdrop-filter:blur(12px);background:#fffc;border:1px solid #ffffff4d}.glass-dark{-webkit-backdrop-filter:blur(12px);color:var(--white);background:#212121d9;border:1px solid #ffffff12}.hero-banner{background:linear-gradient(135deg,#fff9c4 0%,#fff59d 100%);position:relative;overflow:hidden}.hero-banner:after{content:"";z-index:1;pointer-events:none;background:radial-gradient(circle,#ffc10733 0%,#fff0 70%);border-radius:50%;width:50vw;height:50vw;position:absolute;top:-20%;right:-10%}.grid-container{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:30px;padding:20px 0;display:grid}.product-card{border-radius:var(--radius-md);transition:var(--transition);background:var(--white);box-shadow:var(--shadow-sm);flex-direction:column;height:100%;display:flex;position:relative;overflow:hidden}.product-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}.product-badge{background-color:var(--accent);color:var(--white);z-index:2;border-radius:12px;align-items:center;gap:4px;padding:4px 10px;font-size:.75rem;font-weight:700;display:flex;position:absolute;top:12px;left:12px}.product-image-container{background-color:var(--gray-100);padding-bottom:75%;position:relative;overflow:hidden}.product-image{object-fit:cover;width:100%;height:100%;transition:var(--transition);position:absolute;top:0;left:0}.product-card:hover .product-image{transform:scale(1.05)}.product-info{flex-direction:column;flex-grow:1;padding:20px;display:flex}.product-title{color:var(--dark);margin-bottom:8px;font-size:1.25rem}.product-desc{color:var(--gray-600);flex-grow:1;margin-bottom:15px;font-size:.88rem}.product-price-section{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.product-price{color:var(--primary);font-size:1.3rem;font-weight:700}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade{animation:.4s ease-out forwards fadeIn}@media (width<=768px){.hero-banner{padding:40px 20px}}.spinner{border:4px solid var(--gray-200);border-top:4px solid var(--primary);border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
