body { font-family: 'Georgia', serif; margin: 0; padding: 0; color: #333; background: #f9f9f9; }
header { background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1); position: fixed; width: 100%; top: 0; z-index: 100; }
nav { display: flex; justify-content: space-between; align-items: center; padding: 1rem 2rem; }
.logo { font-size: 1.5rem; font-weight: bold; }
ul { list-style: none; display: flex; gap: 2rem; }
a { text-decoration: none; color: #333; }
.cart-icon { cursor: pointer; font-size: 1.2rem; position: relative; }
.cart-modal { display: none; position: absolute; right: 2rem; top: 100%; background: #fff; border: 1px solid #ccc; padding: 1rem; width: 300px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); z-index: 150; }
.cart-modal ul { list-style: none; padding: 0; }
.cart-modal li { display: flex; justify-content: space-between; margin-bottom: 0.5rem; }
.hero { background: url('hero-bg.jpg') center/cover; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #fff; padding-top: 80px; }
.btn { background: #d4af37; color: #fff; padding: 0.5rem 1rem; border: none; cursor: pointer; }
.products { padding: 4rem 2rem; text-align: center; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; }
.product-card { background: #fff; padding: 1rem; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); cursor: pointer; transition: transform 0.3s; }
.product-card:hover { transform: scale(1.05); }
.product-card img { width: 100%; height: 200px; object-fit: cover; }
.rating { color: #d4af37; font-size: 1.1rem; margin: 0.5rem 0; }
.product-card button { margin: 0.25rem; }
.about, .contact { padding: 4rem 2rem; text-align: center; }
form { display: flex; flex-direction: column; gap: 1rem; max-width: 400px; margin: 0 auto; }
input, textarea { padding: 0.5rem; border: 1px solid #ccc; border-radius: 4px; }
footer { background: #333; color: #fff; text-align: center; padding: 1rem; }
.social-links { margin-top: 0.5rem; }
.social-links a { color: #d4af37; margin: 0 0.5rem; }
.modal { display: none; position: fixed; z-index: 200; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); }
.modal-content { background: #fff; margin: 15% auto; padding: 2rem; width: 80%; max-width: 500px; border-radius: 8px; }
.close { float: right; font-size: 2rem; cursor: pointer; }
#search-bar { width: 100%; max-width: 400px; padding: 0.5rem; margin-bottom: 2rem; border: 1px solid #ccc; border-radius: 4px; font-size: 1rem; }
.testimonials { padding: 4rem 2rem; text-align: center; background: #fafafa; }
.testimonial-slider { display: flex; overflow: hidden; width: 100%; position: relative; }
.testimonial { min-width: 100%; transition: transform 1s ease; display: flex; flex-direction: column; align-items: center; }
.testimonial img { width: 80px; height: 80px; border-radius: 50%; margin-bottom: 1rem; }
.testimonial p { font-style: italic; max-width: 400px; }
.testimonial cite { margin-top: 0.5rem; font-weight: bold; }
@keyframes slide {
    0% { transform: translateX(0); }
    33% { transform: translateX(-100%); }
    66% { transform: translateX(-200%); }
    100% { transform: translateX(0); }
}
.testimonial-slider { animation: slide 9s infinite; }
.newsletter { background: #f0f0f0; padding: 4rem 2rem; text-align: center; }
.newsletter form { display: flex; justify-content: center; gap: 1rem; margin-top: 1rem; }
.newsletter input { padding: 0.5rem; border: 1px solid #ccc; border-radius: 4px; width: 250px; }
.newsletter button { background: #d4af37; color: #fff; padding: 0.5rem 1rem; border: none; cursor: pointer; }
#login-btn { background: #d4af37; color: #fff; padding: 0.5rem 1rem; border: none; cursor: pointer; margin-left: 1rem; }