@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--primary:#1a1a1a;--accent:#c9a84c;--accent-hover:#b8963e;--bg:#fff;--bg-light:#f5f5f5;--text:#333;--text-light:#777;--border:#e0e0e0;--danger:#c0392b;--star:#f1c40f;--shadow:0 2px 12px rgba(0,0,0,0.08);--radius:4px;--transition:all .3s ease}
html{scroll-behavior:smooth}
body{font-family:'Montserrat',sans-serif;color:var(--text);background:var(--bg);line-height:1.6;overflow-x:hidden}
a{text-decoration:none;color:inherit;transition:var(--transition)}a:hover{color:var(--accent)}
ul{list-style:none}img{max-width:100%;display:block}
button{cursor:pointer;font-family:inherit;border:none;outline:none;transition:var(--transition)}
input{font-family:inherit;outline:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* ANNOUNCEMENT */
.announcement-bar{background:var(--primary);color:#fff;text-align:center;padding:8px 15px;font-size:12px;font-weight:500;letter-spacing:.5px;text-transform:uppercase}
.announcement-bar span{color:var(--accent);font-weight:700}

/* HEADER */
.header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.header-main{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;max-width:1200px;margin:0 auto}
.logo img{height:40px;width:auto}
.header-icons{display:flex;align-items:center;gap:18px}
.header-icons button{background:none;border:none;position:relative;color:var(--primary);display:flex;align-items:center;justify-content:center}
.header-icons button svg{width:22px;height:22px}
.header-icons button:hover{color:var(--accent)}
.cart-count{position:absolute;top:-6px;right:-8px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center}

/* NAV */
.nav{background:#fff;border-bottom:1px solid var(--border);overflow-x:auto}
.nav::-webkit-scrollbar{display:none}
.nav-list{display:flex;align-items:center;justify-content:center;gap:0;max-width:1200px;margin:0 auto;padding:0 20px;white-space:nowrap}
.nav-list li a{display:flex;align-items:center;gap:4px;padding:12px 16px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text)}
.nav-list li a:hover{color:var(--accent)}
.nav-list li a svg{width:10px;height:10px}

/* BANNER SLIDER */
.hero-banner{width:100%;position:relative;overflow:hidden;background:var(--bg-light)}
.banner-slide{display:none;width:100%;animation:fadeIn .8s}
.banner-slide.active{display:block}
.banner-slide img{width:100%;height:300px;display:block;object-fit:cover}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.banner-dots{display:flex;justify-content:center;gap:8px;padding:12px 0;background:#fff}
.banner-dots .dot{width:10px;height:10px;border-radius:50%;background:var(--border);cursor:pointer}
.banner-dots .dot.active{background:var(--primary)}

/* SECTION TITLES */
.section-title{text-align:center;margin:50px 0 10px;font-size:22px;font-weight:700;color:var(--primary)}
.section-subtitle{text-align:center;font-size:13px;color:var(--text-light);margin-bottom:30px}
.section-line{width:40px;height:2px;background:var(--primary);margin:12px auto 30px}

/* PRODUCT CAROUSEL */
.products-section{padding:20px 0 40px}
.carousel-wrapper{position:relative;max-width:1100px;margin:0 auto;padding:0 20px;overflow:hidden}
.carousel-track{display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:16px}
.carousel-btn{display:none}
.carousel-dots{display:none}

/* PRODUCT CARD */
.product-card{background:#fff;border-radius:var(--radius);overflow:hidden;position:relative;text-align:center;cursor:pointer;transition:var(--transition)}
.product-card:hover{box-shadow:var(--shadow)}
.product-card .badge{position:absolute;top:10px;left:10px;background:var(--primary);color:#fff;font-size:10px;font-weight:700;padding:4px 8px;border-radius:3px;z-index:2;text-transform:uppercase}
.product-card .wishlist-btn{position:absolute;top:10px;right:10px;background:none;z-index:2;color:var(--text-light)}
.product-card .wishlist-btn:hover{color:var(--danger)}
.product-card .wishlist-btn svg{width:20px;height:20px}
.product-img-wrapper{width:100%;height:180px;overflow:hidden;background:var(--bg-light);display:flex;align-items:center;justify-content:center}
.product-img-wrapper img{width:75%;height:75%;object-fit:contain;transition:transform .3s ease}
.product-card:hover .product-img-wrapper img{transform:scale(1.05)}
.product-info{padding:15px 10px 20px}
.product-info .product-name{font-size:13px;font-weight:500;color:var(--text);margin-bottom:6px;line-height:1.4;min-height:36px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-info .stars{display:flex;justify-content:center;gap:2px;margin-bottom:8px}
.product-info .stars svg{width:14px;height:14px;fill:var(--star)}
.product-info .old-price{font-size:12px;color:var(--text-light);text-decoration:line-through;margin-bottom:2px}
.product-info .price{font-size:16px;font-weight:700;color:var(--primary);margin-bottom:4px}
.product-info .installments{font-size:11px;color:var(--text-light);margin-bottom:10px}
.product-info .category-tag{font-size:11px;color:var(--accent);font-weight:600;cursor:pointer}
.product-card .add-to-cart-btn{width:calc(100% - 20px);margin:0 10px 15px;padding:10px;background:var(--primary);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border-radius:var(--radius);opacity:0;transform:translateY(10px);transition:var(--transition)}
.product-card:hover .add-to-cart-btn{opacity:1;transform:translateY(0)}
.product-card .add-to-cart-btn:hover{background:var(--accent)}

/* VIP BANNER */
.vip-banner{background:var(--primary);padding:40px 20px;display:flex;align-items:center;justify-content:space-between;margin:40px 0;flex-wrap:wrap;gap:20px}
.vip-banner .vip-text h3{font-family:'Playfair Display',serif;font-style:italic;font-size:26px;color:#fff;margin-bottom:6px}
.vip-banner .vip-text p{font-size:12px;color:rgba(255,255,255,.7);letter-spacing:1px;text-transform:uppercase}
.vip-banner .vip-btn{padding:12px 30px;background:transparent;border:2px solid #fff;color:#fff;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px}
.vip-banner .vip-btn:hover{background:#fff;color:var(--primary)}

/* TESTIMONIALS */
.testimonials-section{padding:50px 0}
.testimonials-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1200px;margin:0 auto;padding:0 20px}
.testimonial-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:25px 20px;text-align:center}
.testimonial-card .t-product{font-size:13px;font-weight:700;color:var(--primary);margin-bottom:15px;min-height:38px}
.testimonial-card .t-text{font-size:13px;color:var(--text-light);line-height:1.6;margin-bottom:20px;min-height:60px}
.testimonial-card .t-author{font-size:14px;font-weight:700;color:var(--primary);margin-bottom:6px}
.testimonial-card .t-stars{display:flex;justify-content:center;gap:2px}
.testimonial-card .t-stars svg{width:16px;height:16px;fill:var(--star)}

/* NEWSLETTER */
.newsletter-section{padding:50px 20px;text-align:center;border-top:1px solid var(--border)}
.newsletter-section .mail-icon{margin-bottom:15px}
.newsletter-section .mail-icon svg{width:32px;height:32px;color:var(--text-light)}
.newsletter-section h3{font-size:22px;font-weight:800;color:var(--primary);margin-bottom:4px}
.newsletter-section .nl-sub{font-size:13px;color:var(--text-light);margin-bottom:25px}
.newsletter-form{display:flex;justify-content:center;gap:10px;max-width:500px;margin:0 auto}
.newsletter-form input{flex:1;padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius);font-size:13px}
.newsletter-form input:focus{border-color:var(--accent)}
.newsletter-form button{padding:12px 25px;background:var(--primary);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border-radius:var(--radius)}
.newsletter-form button:hover{background:var(--accent)}

/* FOOTER */
.footer{background:var(--bg-light);padding:50px 0 0}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:40px;max-width:1200px;margin:0 auto;padding:0 20px 40px}
.footer-logo img{height:35px;margin-bottom:20px}
.footer-social{display:flex;gap:14px}
.footer-social a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--text)}
.footer-social a:hover{color:var(--accent)}
.footer-social a svg{width:20px;height:20px}
.footer h4{font-size:14px;font-weight:700;color:var(--primary);margin-bottom:18px;text-transform:uppercase;letter-spacing:.5px}
.footer ul li{margin-bottom:10px}
.footer ul li a{font-size:13px;color:var(--text-light)}
.footer ul li a:hover{color:var(--accent)}
.footer .contact-info{font-size:13px;color:var(--text-light);line-height:1.8}
.footer-bottom{border-top:1px solid var(--border);padding:25px 20px;max-width:1200px;margin:0 auto}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}
.payment-methods h5,.security-badges h5{font-size:13px;font-weight:700;color:var(--primary);margin-bottom:10px}
.payment-icons{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.payment-icons .pay-icon{width:42px;height:26px;background:#fff;border:1px solid var(--border);border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700;color:var(--text-light)}
.footer-copyright{text-align:center;padding:20px;font-size:11px;color:var(--text-light);border-top:1px solid var(--border)}

/* CART */
.cart-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:999;opacity:0;visibility:hidden;transition:var(--transition)}
.cart-overlay.active{opacity:1;visibility:visible}
.cart-sidebar{position:fixed;top:0;right:-420px;width:400px;max-width:90vw;height:100%;background:#fff;z-index:1000;transition:right .35s ease;display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(0,0,0,.15)}
.cart-sidebar.active{right:0}
.cart-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border)}
.cart-header h3{font-size:16px;font-weight:600}
.cart-close{background:none;font-size:22px;color:var(--text)}.cart-close:hover{color:var(--danger)}
.cart-shipping-bar{padding:15px 20px;border-bottom:1px solid var(--border);font-size:13px;color:var(--text)}
.cart-shipping-bar strong{color:var(--primary)}
.shipping-progress{width:100%;height:4px;background:var(--border);border-radius:2px;margin-top:8px;overflow:hidden}
.shipping-progress-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .3s ease}
.shipping-icon{margin-top:6px;font-size:16px}
.cart-body{flex:1;overflow-y:auto;padding:20px}
.cart-empty{text-align:center;padding:60px 20px}
.cart-empty h4{font-size:18px;font-weight:500;margin-bottom:10px;color:var(--primary)}
.cart-empty p{font-size:13px;color:var(--text-light);margin-bottom:20px;line-height:1.6}
.cart-empty .browse-btn{padding:12px 24px;background:var(--primary);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border-radius:var(--radius)}
.cart-empty .browse-btn:hover{background:var(--accent)}
.cart-item{display:flex;gap:15px;padding:15px 0;border-bottom:1px solid var(--border)}
.cart-item-img{width:70px;height:70px;border-radius:var(--radius);overflow:hidden;background:var(--bg-light);flex-shrink:0}
.cart-item-img img{width:100%;height:100%;object-fit:contain}
.cart-item-info{flex:1}
.cart-item-info .ci-name{font-size:13px;font-weight:500;margin-bottom:5px}
.cart-item-info .ci-price{font-size:14px;font-weight:700;color:var(--primary);margin-bottom:8px}
.cart-item-qty{display:flex;align-items:center}
.cart-item-qty button{width:28px;height:28px;border:1px solid var(--border);background:#fff;font-size:14px;display:flex;align-items:center;justify-content:center}
.cart-item-qty button:hover{background:var(--bg-light)}
.cart-item-qty span{width:36px;height:28px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600}
.cart-item-remove{background:none;color:var(--text-light);font-size:18px;align-self:flex-start}.cart-item-remove:hover{color:var(--danger)}
.cart-footer{border-top:1px solid var(--border);padding:20px}
.cart-total{display:flex;justify-content:space-between;font-size:16px;font-weight:700;margin-bottom:15px}
.cart-checkout-btn{width:100%;padding:14px;background:var(--accent);color:#fff;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border-radius:var(--radius)}
.cart-checkout-btn:hover{background:var(--accent-hover)}

/* WHATSAPP FLOAT */
.whatsapp-float{position:fixed;bottom:25px;right:25px;width:56px;height:56px;background:#25d366;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:90;box-shadow:0 4px 12px rgba(0,0,0,.2);transition:transform .3s}
.whatsapp-float:hover{transform:scale(1.1);color:#fff}
.whatsapp-float svg{width:28px;height:28px;fill:#fff}

/* RESPONSIVE */
@media(max-width:1024px){.carousel-track{grid-template-columns:repeat(3,1fr)}.testimonials-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.carousel-track{grid-template-columns:repeat(2,1fr)}.vip-banner{flex-direction:column;text-align:center;padding:30px 20px}.testimonials-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.newsletter-form{flex-direction:column}.nav-list{justify-content:flex-start}.header-main{padding:10px 15px}.logo img{height:30px}}
@media(max-width:480px){.carousel-track{grid-template-columns:repeat(2,1fr)}.footer-bottom-inner{flex-direction:column;align-items:flex-start}}
