/*! * Laddu Gopal Sweets — Premium Ecommerce Frontend * Core stylesheet: variables, base, layout, components, utilities. * Fonts & icon fonts are loaded via CDN tags in each page . */ /* ========================================================= 1. CSS VARIABLES ========================================================= */ :root { --color-primary: #7A1F2B; /* Royal Festive Maroon */ --color-secondary: #4A1018; /* Deep Royal Maroon */ --color-gold: #E8BC55; /* Light Gold */ --color-gold-deep: #D69A18; /* Festive Gold */ --color-cream: #FFF9EA; --color-beige: #F7EBCB; --color-dark: #352023; --color-white: #FFFFFF; --font-heading: 'Playfair Display', 'Cormorant Garamond', Georgia, serif; --font-body: 'Poppins', 'Noto Sans Devanagari', sans-serif; --radius-sm: 8px; --radius-md: 16px; --radius-lg: 28px; --radius-pill: 999px; --shadow-soft: 0 10px 30px rgba(74, 16, 24, 0.08); --shadow-card: 0 12px 32px rgba(122, 31, 43, 0.13); --shadow-hover: 0 20px 45px rgba(74, 16, 24, 0.2); --transition-base: all 0.35s cubic-bezier(0.22, 1, 0.36, 1); --section-pad: 5.5rem; } /* ========================================================= 2. BASE / RESET ========================================================= */ * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { font-family: var(--font-body); color: var(--color-dark); background: var(--color-cream); overflow-x: hidden; line-height: 1.7; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); color: var(--color-secondary); font-weight: 700; line-height: 1.25; } a { text-decoration: none; color: inherit; } img { max-width: 100%; height: auto; display: block; } ul { list-style: none; margin: 0; padding: 0; } ::selection { background: var(--color-gold); color: var(--color-white); } ::-webkit-scrollbar { width: 9px; } ::-webkit-scrollbar-track { background: var(--color-beige); } ::-webkit-scrollbar-thumb { background: var(--color-gold-deep); border-radius: var(--radius-pill); } .text-gold { color: var(--color-gold-deep) !important; } .text-maroon { color: var(--color-primary) !important; } .bg-cream { background: var(--color-cream) !important; } .bg-beige { background: var(--color-beige) !important; } .bg-maroon { background: var(--color-primary) !important; } .bg-burgundy { background: var(--color-secondary) !important; } .section-pad { padding-top: var(--section-pad); padding-bottom: var(--section-pad); } .section-pad-sm { padding-top: 3rem; padding-bottom: 3rem; } /* ========================================================= 3. PRELOADER ========================================================= */ #preloader { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; flex-direction: column; background: var(--color-secondary); transition: opacity 0.5s ease, visibility 0.5s ease; gap: 1rem; } #preloader .preloader-mark { width: 64px; height: 64px; border-radius: 50%; border: 3px solid rgba(214, 164, 55, 0.25); border-top-color: var(--color-gold); animation: spin 0.9s linear infinite; } #preloader span { font-family: var(--font-heading); color: var(--color-cream); letter-spacing: 2px; font-size: 1rem; } .preloader--hide { opacity: 0; visibility: hidden; } @keyframes spin { to { transform: rotate(360deg); } } /* ========================================================= 4. TOP STRIP + TRUST STRIP ========================================================= */ .top-strip { background: var(--color-secondary); color: var(--color-cream); font-size: 0.85rem; padding: 8px 0; overflow: hidden; } .top-strip .marquee-track { display: flex; gap: 3.5rem; white-space: nowrap; animation: marquee 22s linear infinite; } .top-strip .marquee-track span { display: inline-flex; align-items: center; gap: 8px; } @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } .top-strip-links { display: flex; align-items: center; gap: 1.25rem; justify-content: flex-end; } .top-strip-links a { color: var(--color-cream); opacity: 0.9; } .top-strip-links a:hover { color: var(--color-gold); opacity: 1; } .trust-strip { background: var(--color-beige); border-bottom: 1px solid rgba(184, 134, 43, 0.25); padding: 14px 0; } .trust-strip .trust-item { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; font-weight: 500; color: var(--color-secondary); } .trust-strip .trust-item i { color: var(--color-gold-deep); font-size: 1.25rem; } /* ========================================================= 5. HEADER / NAVIGATION ========================================================= */ .site-header { background: var(--color-white); position: sticky; top: 0; z-index: 1030; transition: var(--transition-base); border-bottom: 1px solid rgba(184, 134, 43, 0.15); } .site-header.is-scrolled { box-shadow: var(--shadow-soft); } .brand-logo { display: flex; align-items: center; gap: 10px; } .brand-logo .brand-mark { width: 46px; height: 46px; border-radius: 50%; background: linear-gradient(145deg, var(--color-primary), var(--color-secondary)); display: flex; align-items: center; justify-content: center; color: var(--color-gold); font-family: var(--font-heading); font-size: 1.4rem; font-weight: 700; border: 2px solid var(--color-gold); } .brand-logo .brand-text { font-family: var(--font-heading); font-weight: 700; font-size: 1.35rem; color: var(--color-primary); line-height: 1.1; } .brand-logo .brand-text small { display: block; font-family: var(--font-body); font-size: 0.62rem; letter-spacing: 2px; color: var(--color-gold-deep); font-weight: 600; } .main-nav .nav-link { color: var(--color-dark); font-weight: 500; padding: 1.6rem 0.85rem; position: relative; } .main-nav .nav-link::after { content: ""; position: absolute; left: 50%; bottom: 14px; width: 0; height: 2px; background: var(--color-gold-deep); transition: var(--transition-base); transform: translateX(-50%); } .main-nav .nav-link:hover, .main-nav .nav-link.active { color: var(--color-primary); } .main-nav .nav-link:hover::after, .main-nav .nav-link.active::after { width: 28px; } .mega-menu { border: none; border-radius: var(--radius-md); box-shadow: var(--shadow-hover); padding: 1.5rem; margin-top: 0 !important; } .mega-menu h6 { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-gold-deep); margin-bottom: 0.75rem; } .mega-menu a.dropdown-item { padding: 0.35rem 0; border-radius: 0; } .mega-menu a.dropdown-item:hover { background: transparent; color: var(--color-primary); padding-left: 6px; } .header-actions .icon-btn { width: 42px; height: 42px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--color-beige); color: var(--color-primary); position: relative; transition: var(--transition-base); } .header-actions .icon-btn:hover { background: var(--color-primary); color: var(--color-white); transform: translateY(-2px); } .header-actions .badge-count { position: absolute; top: -4px; right: -4px; background: var(--color-gold-deep); color: var(--color-white); font-size: 0.62rem; width: 18px; height: 18px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .search-inline { max-width: 260px; } .search-inline .form-control { border-radius: var(--radius-pill) 0 0 var(--radius-pill); border-color: var(--color-beige); } .search-inline .btn { border-radius: 0 var(--radius-pill) var(--radius-pill) 0; background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); } .offcanvas-mobile-menu .nav-link { padding: 0.6rem 0; color: var(--color-dark); font-weight: 500; border-bottom: 1px dashed var(--color-beige); } .offcanvas-mobile-menu .nav-link.active, .offcanvas-mobile-menu .nav-link:hover { color: var(--color-primary); } /* ========================================================= 6. BUTTONS ========================================================= */ .btn-brand { background: linear-gradient(135deg, var(--color-primary), var(--color-secondary)); color: var(--color-cream); border: none; border-radius: var(--radius-pill); padding: 0.75rem 1.75rem; font-weight: 600; letter-spacing: 0.3px; transition: var(--transition-base); box-shadow: var(--shadow-card); } .btn-brand:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); color: var(--color-gold); } .btn-gold { background: linear-gradient(135deg, var(--color-gold), var(--color-gold-deep)); color: var(--color-secondary); border: none; border-radius: var(--radius-pill); padding: 0.75rem 1.75rem; font-weight: 600; transition: var(--transition-base); } .btn-gold:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); color: var(--color-dark); } .btn-outline-brand { background: transparent; color: var(--color-primary); border: 1.5px solid var(--color-primary); border-radius: var(--radius-pill); padding: 0.7rem 1.7rem; font-weight: 600; transition: var(--transition-base); } .btn-outline-brand:hover { background: var(--color-primary); color: var(--color-white); transform: translateY(-3px); } .btn-outline-gold { background: transparent; color: var(--color-gold-deep); border: 1.5px solid var(--color-gold-deep); border-radius: var(--radius-pill); padding: 0.6rem 1.4rem; font-weight: 600; transition: var(--transition-base); } .btn-outline-gold:hover { background: var(--color-gold-deep); color: var(--color-white); } .btn-sm-pill { border-radius: var(--radius-pill); padding: 0.4rem 1rem; font-size: 0.85rem; font-weight: 600; } /* ========================================================= 7. SECTION HEADINGS ========================================================= */ .section-heading { text-align: center; max-width: 720px; margin: 0 auto 3rem; } .section-heading .eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--color-gold-deep); font-weight: 600; letter-spacing: 2px; text-transform: uppercase; font-size: 0.78rem; margin-bottom: 0.75rem; } .section-heading .eyebrow::before, .section-heading .eyebrow::after { content: ""; width: 24px; height: 1px; background: var(--color-gold-deep); } .section-heading h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 0.75rem; } .section-heading p { color: #6b5750; } .section-heading.text-start { margin: 0 0 2.5rem; } .section-heading.text-start .eyebrow::after { display: none; } .section-heading.light h2, .section-heading.light p { color: var(--color-cream); } /* ========================================================= 8. HERO SLIDER ========================================================= */ .hero-slider { position: relative; } .hero-slide { min-height: 92vh; display: flex; align-items: center; position: relative; background-color: var(--color-secondary); background-size: cover; background-position: center; } .hero-slide::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(43,10,20,0.86) 30%, rgba(43,10,20,0.35) 75%); } .hero-slide .container { position: relative; z-index: 2; } .hero-slide .eyebrow { color: var(--color-gold); letter-spacing: 3px; text-transform: uppercase; font-weight: 600; font-size: 0.85rem; } .hero-slide h1 { color: var(--color-cream); font-size: clamp(2.4rem, 5vw, 4rem); margin: 0.75rem 0 1.25rem; } .hero-slide p { color: rgba(255,248,234,0.85); max-width: 480px; margin-bottom: 2rem; font-size: 1.05rem; } .hero-slider .carousel-indicators [data-bs-target] { background: var(--color-gold); width: 10px; height: 10px; border-radius: 50%; } .hero-slider .carousel-control-prev, .hero-slider .carousel-control-next { width: 4rem; opacity: 0.85; } .hero-slider .carousel-control-prev-icon, .hero-slider .carousel-control-next-icon { background-color: rgba(214,164,55,0.85); border-radius: 50%; padding: 1.3rem; background-size: 1.1rem; } /* ========================================================= 9. CATEGORY ICONS ========================================================= */ .category-chip { text-align: center; padding: 1.75rem 1rem; border-radius: var(--radius-md); background: var(--color-white); box-shadow: var(--shadow-soft); transition: var(--transition-base); height: 100%; } .category-chip:hover { transform: translateY(-8px); box-shadow: var(--shadow-hover); } .category-chip .cat-icon-wrap { width: 74px; height: 74px; margin: 0 auto 1rem; border-radius: 50%; overflow: hidden; border: 2px solid var(--color-beige); display: flex; align-items: center; justify-content: center; } .category-chip h6 { margin: 0; font-size: 0.95rem; color: var(--color-dark); font-weight: 600; } .category-chip small { color: var(--color-gold-deep); } /* ========================================================= 10. PRODUCT CARDS ========================================================= */ .product-card { background: var(--color-white); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-soft); transition: var(--transition-base); height: 100%; position: relative; border: 1px solid rgba(184,134,43,0.08); } .product-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-hover); } .product-card .product-thumb { position: relative; overflow: hidden; aspect-ratio: 1/1; background: var(--color-beige); } .product-card .product-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; } .product-card:hover .product-thumb img { transform: scale(1.08); } .product-card .badge-discount { position: absolute; top: 12px; left: 12px; background: var(--color-primary); color: var(--color-cream); font-size: 0.72rem; font-weight: 700; padding: 4px 10px; border-radius: var(--radius-pill); } .product-card .badge-veg { position: absolute; top: 12px; right: 12px; width: 20px; height: 20px; border: 2px solid #1e7a34; border-radius: 3px; display: flex; align-items: center; justify-content: center; background: var(--color-white); } .product-card .badge-veg::after { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #1e7a34; } .product-card .product-actions { position: absolute; right: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 8px; opacity: 0; transform: translateX(10px); transition: var(--transition-base); } .product-card:hover .product-actions { opacity: 1; transform: translateX(0); } .product-card .product-actions button, .product-card .product-actions a { width: 38px; height: 38px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); border: none; transition: var(--transition-base); } .product-card .product-actions button:hover, .product-card .product-actions a:hover { background: var(--color-primary); color: var(--color-white); } .product-card .product-actions button.is-active { background: var(--color-primary); color: var(--color-gold); } .product-card .product-body { padding: 1.1rem 1.25rem 1.35rem; } .product-card .product-cat { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-gold-deep); font-weight: 600; } .product-card h6.product-title { font-size: 1.02rem; margin: 0.3rem 0 0.4rem; } .product-card h6.product-title a:hover { color: var(--color-primary); } .star-rating { color: var(--color-gold-deep); font-size: 0.82rem; } .product-card .price-row { display: flex; align-items: baseline; gap: 8px; margin: 0.4rem 0 0.75rem; } .product-card .price-now { font-weight: 700; color: var(--color-primary); font-size: 1.1rem; } .product-card .price-old { text-decoration: line-through; color: #a89189; font-size: 0.88rem; } .product-card .btn-add-cart { width: 100%; } /* Quantity selector */ .qty-selector { display: inline-flex; align-items: center; border: 1.5px solid var(--color-beige); border-radius: var(--radius-pill); overflow: hidden; } .qty-selector button { width: 38px; height: 38px; border: none; background: var(--color-beige); color: var(--color-primary); font-weight: 700; } .qty-selector input { width: 48px; text-align: center; border: none; background: transparent; font-weight: 600; } .qty-selector input:focus { outline: none; } /* ========================================================= 11. OFFER / DEAL BANNERS ========================================================= */ .offer-banner { border-radius: var(--radius-lg); background: linear-gradient(120deg, var(--color-primary), var(--color-secondary)); color: var(--color-cream); padding: 3rem; position: relative; overflow: hidden; } .offer-banner::after { content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(214,164,55,0.35), transparent 70%); top: -80px; right: -60px; } .festive-strip { background: repeating-linear-gradient(135deg, var(--color-gold-deep), var(--color-gold-deep) 12px, var(--color-primary) 12px, var(--color-primary) 24px); color: var(--color-cream); text-align: center; padding: 10px 0; font-weight: 600; letter-spacing: 0.5px; font-size: 0.9rem; } .countdown-box { display: flex; gap: 0.75rem; } .countdown-box .cd-unit { background: rgba(255,255,255,0.12); border: 1px solid rgba(214,164,55,0.4); border-radius: var(--radius-sm); padding: 0.6rem 0.9rem; text-align: center; min-width: 64px; } .countdown-box .cd-unit span { display: block; font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; color: var(--color-gold); } .countdown-box .cd-unit small { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 1px; } /* ========================================================= 12. FEATURE / ICON BLOCKS (why choose us, trust, process) ========================================================= */ .feature-block { text-align: center; padding: 2rem 1.25rem; } .feature-block .feature-icon { width: 84px; height: 84px; margin: 0 auto 1.25rem; border-radius: 50%; background: var(--color-beige); display: flex; align-items: center; justify-content: center; color: var(--color-primary); font-size: 2rem; transition: var(--transition-base); } .feature-block:hover .feature-icon { background: var(--color-primary); color: var(--color-gold); transform: rotateY(180deg); } .feature-block h5 { font-size: 1.1rem; margin-bottom: 0.5rem; } .feature-block p { color: #6b5750; font-size: 0.92rem; margin: 0; } .process-step { text-align: center; position: relative; } .process-step .step-num { width: 56px; height: 56px; border-radius: 50%; background: var(--color-primary); color: var(--color-gold); display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-weight: 700; font-size: 1.3rem; margin: 0 auto 1rem; border: 3px solid var(--color-gold-deep); } /* ========================================================= 13. GIFT BOX / BUILD YOUR OWN ========================================================= */ .giftbox-card { border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-soft); background: var(--color-white); transition: var(--transition-base); } .giftbox-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); } .occasion-card-image { display: block; width: 100%; aspect-ratio: 25 / 18; object-fit: cover; } .process-gallery-image { display: block; width: 100%; aspect-ratio: 7 / 5; object-fit: cover; } .build-box-item { border: 2px solid var(--color-beige); border-radius: var(--radius-md); padding: 1rem; text-align: center; cursor: pointer; transition: var(--transition-base); background: var(--color-white); } .build-box-item.is-selected, .build-box-item:hover { border-color: var(--color-gold-deep); box-shadow: var(--shadow-soft); } .build-box-item img { border-radius: var(--radius-sm); margin-bottom: 0.5rem; } /* ========================================================= 14. TESTIMONIALS ========================================================= */ .testimonial-card { background: var(--color-white); border-radius: var(--radius-md); padding: 2rem; box-shadow: var(--shadow-soft); position: relative; height: 100%; } .testimonial-card i.fa-quote-left { color: var(--color-gold); font-size: 1.6rem; opacity: 0.5; } .testimonial-card p { font-style: italic; color: #5b463f; margin: 1rem 0; } .testimonial-card .reviewer { display: flex; align-items: center; gap: 12px; } .testimonial-card .reviewer img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; } .testimonial-card .reviewer h6 { margin: 0; font-size: 0.95rem; } .testimonial-card .reviewer small { color: var(--color-gold-deep); } /* ========================================================= 15. INSTAGRAM GALLERY ========================================================= */ .insta-item { position: relative; overflow: hidden; border-radius: var(--radius-sm); aspect-ratio: 1/1; } .insta-item img { width: 100%; height: 100%; object-fit: cover; transition: var(--transition-base); } .insta-item::after { content: "\f16d"; font-family: "Font Awesome 6 Brands"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--color-white); font-size: 1.6rem; background: rgba(18,58,37,0.62); opacity: 0; transition: var(--transition-base); } .insta-item:hover::after { opacity: 1; } .insta-item:hover img { transform: scale(1.1); } /* ========================================================= 16. BLOG CARDS ========================================================= */ .blog-card { background: var(--color-white); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-soft); transition: var(--transition-base); height: 100%; } .blog-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-hover); } .blog-card .blog-thumb { aspect-ratio: 16/10; overflow: hidden; } .blog-card .blog-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; } .blog-card:hover .blog-thumb img { transform: scale(1.06); } .blog-card .blog-body { padding: 1.4rem; } .blog-card .blog-meta { font-size: 0.78rem; color: var(--color-gold-deep); display: flex; gap: 1rem; margin-bottom: 0.5rem; } .blog-card h5 { font-size: 1.1rem; } .blog-card h5 a:hover { color: var(--color-primary); } /* ========================================================= 17. BREADCRUMB / PAGE HEADER BANNER ========================================================= */ .page-banner { position: relative; padding: 6rem 0 4rem; text-align: center; color: var(--color-cream); background-color: var(--color-secondary); background-size: cover; background-position: center; } .page-banner::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(9,36,22,0.92), rgba(47,107,60,0.76)); } .page-banner .container { position: relative; z-index: 2; } .page-banner h1 { color: var(--color-cream); font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 0.75rem; } .page-banner .breadcrumb { justify-content: center; margin: 0; background: transparent; } .page-banner .breadcrumb-item, .page-banner .breadcrumb-item a { color: rgba(255,248,234,0.75); } .page-banner .breadcrumb-item.active { color: var(--color-gold); } .page-banner .breadcrumb-item + .breadcrumb-item::before { color: var(--color-gold); content: "\203A"; } /* ========================================================= 18. SIDEBAR FILTERS (shop / category) ========================================================= */ .filter-card { background: var(--color-white); border-radius: var(--radius-md); padding: 1.5rem; box-shadow: var(--shadow-soft); margin-bottom: 1.5rem; } .filter-card h6 { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-primary); margin-bottom: 1rem; border-bottom: 1px solid var(--color-beige); padding-bottom: 0.6rem; } .filter-card .form-check { margin-bottom: 0.5rem; } .filter-card .form-check-input:checked { background-color: var(--color-primary); border-color: var(--color-primary); } .toolbar-shop { background: var(--color-white); border-radius: var(--radius-md); padding: 1rem 1.25rem; box-shadow: var(--shadow-soft); } /* ========================================================= 19. TABS / ACCORDION (product details, FAQ) ========================================================= */ .nav-tabs-brand { border: none; gap: 0.5rem; } .nav-tabs-brand .nav-link { border: none; border-radius: var(--radius-pill); background: var(--color-beige); color: var(--color-dark); font-weight: 600; padding: 0.6rem 1.4rem; } .nav-tabs-brand .nav-link.active { background: var(--color-primary); color: var(--color-cream); } .accordion-brand .accordion-button { font-weight: 600; color: var(--color-secondary); background: var(--color-white); border-radius: var(--radius-sm) !important; } .accordion-brand .accordion-button:not(.collapsed) { background: var(--color-primary); color: var(--color-cream); box-shadow: none; } .accordion-brand .accordion-button:focus { box-shadow: none; border-color: var(--color-gold); } .accordion-brand .accordion-item { border: 1px solid rgba(184,134,43,0.2); border-radius: var(--radius-sm); margin-bottom: 1rem; overflow: hidden; } /* ========================================================= 20. FORMS ========================================================= */ .form-control, .form-select { border: 1.5px solid var(--color-beige); border-radius: var(--radius-sm); padding: 0.7rem 1rem; background: var(--color-white); } .form-control:focus, .form-select:focus { border-color: var(--color-gold-deep); box-shadow: 0 0 0 0.2rem rgba(214,164,55,0.2); } .form-label { font-weight: 600; color: var(--color-secondary); font-size: 0.9rem; } .form-card { background: var(--color-white); border-radius: var(--radius-md); padding: 2rem; box-shadow: var(--shadow-soft); } /* ========================================================= 21. CART / CHECKOUT TABLES ========================================================= */ .cart-table th { border-top: none; color: var(--color-secondary); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.5px; } .cart-table td { vertical-align: middle; } .cart-item-thumb { width: 80px; height: 80px; border-radius: var(--radius-sm); overflow: hidden; } .cart-item-thumb img { width: 100%; height: 100%; object-fit: cover; } .summary-card { background: var(--color-white); border-radius: var(--radius-md); padding: 1.75rem; box-shadow: var(--shadow-soft); position: sticky; top: 100px; } .summary-card .summary-row { display: flex; justify-content: space-between; margin-bottom: 0.75rem; font-size: 0.95rem; } .summary-card .summary-total { font-size: 1.2rem; font-weight: 700; color: var(--color-primary); } .coupon-input { display: flex; gap: 0.5rem; } .payment-option { border: 1.5px solid var(--color-beige); border-radius: var(--radius-sm); padding: 1rem; margin-bottom: 0.75rem; cursor: pointer; transition: var(--transition-base); } .payment-option:hover, .payment-option.is-selected { border-color: var(--color-gold-deep); background: var(--color-beige); } .empty-state { text-align: center; padding: 5rem 1rem; } .empty-state i { font-size: 4rem; color: var(--color-gold-deep); margin-bottom: 1.5rem; } /* ========================================================= 22. ACCOUNT DASHBOARD ========================================================= */ .account-sidebar { background: var(--color-white); border-radius: var(--radius-md); padding: 1.5rem; box-shadow: var(--shadow-soft); } .account-sidebar .nav-link { color: var(--color-dark); border-radius: var(--radius-sm); padding: 0.7rem 1rem; margin-bottom: 0.35rem; font-weight: 500; } .account-sidebar .nav-link.active, .account-sidebar .nav-link:hover { background: var(--color-beige); color: var(--color-primary); } .account-sidebar .nav-link i { width: 22px; } .dashboard-stat { background: var(--color-white); border-radius: var(--radius-md); padding: 1.5rem; box-shadow: var(--shadow-soft); text-align: center; } .dashboard-stat i { font-size: 1.8rem; color: var(--color-gold-deep); margin-bottom: 0.5rem; } /* ========================================================= 23. FOOTER ========================================================= */ .site-footer { background: var(--color-secondary); color: rgba(255,248,234,0.8); } .site-footer h6 { color: var(--color-gold); font-size: 0.95rem; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 1.25rem; } .site-footer a { color: rgba(255,248,234,0.75); } .site-footer a:hover { color: var(--color-gold); } .site-footer .footer-links li { margin-bottom: 0.6rem; } .site-footer .social-icons a { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(214,164,55,0.15); margin-right: 8px; transition: var(--transition-base); } .site-footer .social-icons a:hover { background: var(--color-gold); color: var(--color-secondary); transform: translateY(-3px); } .site-footer .footer-bottom { border-top: 1px solid rgba(214,164,55,0.2); padding: 1.25rem 0; font-size: 0.85rem; } .footer-newsletter .form-control { border-radius: var(--radius-pill) 0 0 var(--radius-pill); border: none; } .footer-newsletter .btn { border-radius: 0 var(--radius-pill) var(--radius-pill) 0; } .payment-icons i { font-size: 1.6rem; margin-right: 10px; color: rgba(255,248,234,0.7); } .app-badges a { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.08); border: 1px solid rgba(214,164,55,0.3); border-radius: var(--radius-sm); padding: 0.5rem 1rem; margin-right: 0.5rem; margin-bottom: 0.5rem; } /* ========================================================= 24. FLOATING BUTTONS ========================================================= */ .float-actions { position: fixed; right: 20px; bottom: 20px; z-index: 1040; display: flex; flex-direction: column; gap: 12px; } .float-actions a, .float-actions button { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-hover); font-size: 1.3rem; border: none; transition: var(--transition-base); } .float-actions .btn-whatsapp { background: #25D366; color: #fff; } .float-actions .btn-call { background: var(--color-primary); color: var(--color-gold); } .float-actions #scrollTopBtn { background: var(--color-gold-deep); color: var(--color-white); opacity: 0; visibility: hidden; transform: translateY(10px); } .float-actions #scrollTopBtn.show { opacity: 1; visibility: visible; transform: translateY(0); } .float-actions a:hover, .float-actions button:hover { transform: translateY(-4px) scale(1.05); } /* ========================================================= 25. REVEAL ANIMATION ========================================================= */ .reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.7s ease, transform 0.7s ease; } .reveal.is-visible { opacity: 1; transform: translateY(0); } .reveal-delay-1.is-visible { transition-delay: 0.1s; } .reveal-delay-2.is-visible { transition-delay: 0.2s; } .reveal-delay-3.is-visible { transition-delay: 0.3s; } .reveal-delay-4.is-visible { transition-delay: 0.4s; } /* ========================================================= 26. MISC / 404 / THANK YOU ========================================================= */ .state-page { min-height: 70vh; display: flex; align-items: center; } .state-page .state-code { font-family: var(--font-heading); font-size: clamp(5rem, 15vw, 10rem); color: var(--color-primary); font-weight: 700; line-height: 1; } .success-icon { width: 96px; height: 96px; border-radius: 50%; background: var(--color-beige); color: #1e7a34; display: flex; align-items: center; justify-content: center; font-size: 3rem; margin: 0 auto 1.5rem; } .map-placeholder { border-radius: var(--radius-md); overflow: hidden; aspect-ratio: 16/9; } .store-hours li { display: flex; justify-content: space-between; padding: 0.5rem 0; border-bottom: 1px dashed var(--color-beige); } .legal-content h2 { font-size: 1.4rem; margin-top: 2rem; } .legal-content h2:first-child { margin-top: 0; } .legal-toc { background: var(--color-white); border-radius: var(--radius-md); padding: 1.5rem; box-shadow: var(--shadow-soft); position: sticky; top: 100px; } .legal-toc a { display: block; padding: 0.35rem 0; font-size: 0.9rem; } .legal-toc a:hover { color: var(--color-primary); } /* ========================================================= 27. RESPONSIVE ========================================================= */ @media (max-width: 991.98px) { .hero-slide { min-height: 70vh; text-align: center; } .hero-slide p { margin-left: auto; margin-right: auto; } .section-heading.text-start { text-align: center !important; } :root { --section-pad: 3.5rem; } .summary-card { position: static; } } @media (max-width: 575.98px) { .page-banner { padding: 4rem 0 2.5rem; } .offer-banner { padding: 2rem; text-align: center; } .float-actions { right: 12px; bottom: 12px; } .float-actions a, .float-actions button { width: 46px; height: 46px; font-size: 1.1rem; } } /* ========================================================= 28. PREMIUM 2026 UI REFRESH ========================================================= */ body { background:#f8fbf6; overflow-x:hidden; } .top-strip { min-height:36px; padding:0; display:block; background:linear-gradient(90deg,#0d2d1c,#2f6b3c 48%,#0d2d1c); border-bottom:1px solid rgba(168,198,134,.3); } .top-strip .container { min-height:36px; } .marquee-wrap { overflow:hidden; max-width:60%; mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); } .top-strip .marquee-track { animation-duration:28s; } .top-strip .marquee-track i { color:#f3c766; } .site-header { background:rgba(248,252,246,.95); border-bottom:1px solid rgba(47,107,60,.1); backdrop-filter:blur(18px); } .site-header.is-scrolled { box-shadow:0 12px 40px rgba(55,14,20,.10); } .header-shell { padding-top:14px; padding-bottom:14px; } .brand-logo { flex:0 0 auto; } .brand-logo .brand-mark { width:52px; height:52px; position:relative; border:1px solid #a8c686; background:radial-gradient(circle at 35% 25%,#f1f8e9,#a8c686 52%,#2f6b3c 54%,#123a25); box-shadow:0 7px 22px rgba(18,58,37,.2),inset 0 0 0 3px rgba(255,255,255,.32); font-size:1.35rem; } .brand-logo .brand-mark::after { content:""; position:absolute; inset:-5px; border:1px solid rgba(184,134,43,.25); border-radius:50%; animation:brandPulse 3s ease-in-out infinite; } @keyframes brandPulse { 50%{transform:scale(1.08);opacity:.35} } .brand-logo .brand-text { font-size:1.38rem; letter-spacing:-.3px; white-space:nowrap; } .main-nav { align-self:stretch; align-items:center; } .main-nav ul { gap:2px; } .main-nav .nav-link { font-size:.82rem; padding:.75rem .52rem; border-radius:10px; } .main-nav .nav-link:hover,.main-nav .nav-link.active { background:#e9f2e4; } .search-inline { max-width:235px; background:#fff; border:1px solid #eadfcf; border-radius:99px; padding:3px; box-shadow:inset 0 1px 3px rgba(71,20,28,.04); } .search-inline input { border:0;background:transparent;padding-left:14px; } .search-inline input:focus { box-shadow:none; } .search-inline button { width:35px;height:35px;border-radius:50%;background:#2f6b3c;color:#fff; } .icon-btn { background:#fff; border-color:#d9e7d4; box-shadow:0 5px 16px rgba(18,58,37,.07); } .icon-btn:hover { transform:translateY(-3px) rotate(-3deg); } .mobile-menu-trigger { width:43px;height:43px;border:1px solid #cfe0c9;border-radius:12px;background:#eef5ea;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 11px; } .mobile-menu-trigger span { display:block;height:2px;background:#2f6b3c;border-radius:2px;transition:.25s; } .mobile-menu-trigger span:nth-child(2){width:70%;} .mobile-quick-nav { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #dce9d7;background:#f2f7ef; } .mobile-quick-nav a { display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 4px;font-size:.72rem;font-weight:600;color:#204c2e;border-right:1px solid #dce9d7; } .mobile-quick-nav i { color:#bd8424; } .offcanvas-mobile-menu { width:min(88vw,380px);background:linear-gradient(180deg,#fbfdf9,#edf5e9); } .offcanvas-mobile-menu .offcanvas-header { border-bottom:1px solid #eadcc4;padding:20px; } .mobile-menu-welcome { padding:15px 17px;margin:2px 0 10px;border-radius:16px;background:linear-gradient(135deg,#2f6b3c,#123a25);color:#fff;display:flex;flex-direction:column; } .mobile-menu-welcome span { color:#eac265;font-size:.69rem;text-transform:uppercase;letter-spacing:1.5px; } .mobile-nav-list .nav-link { padding:12px 14px;border-bottom:1px solid #dce9d7;color:#183d27;font-weight:600; } .mobile-nav-list .nav-link::after { content:"\f054";font-family:"Font Awesome 6 Free";font-weight:900;float:right;color:#c3943b;font-size:.7rem;margin-top:5px; } .mobile-nav-list .nav-link.active { color:#fff;background:#2f6b3c;border-radius:10px; } .hero-slide { min-height:clamp(590px,75vh,780px);background-position:center!important;position:relative; } .hero-slide::before { background:radial-gradient(circle at 18% 50%,rgba(119,21,41,.18),transparent 42%); } .hero-slide::after { content:"";position:absolute;inset:18px;border:1px solid rgba(255,213,113,.32);pointer-events:none; } .hero-slide .eyebrow { display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid rgba(242,199,102,.35);border-radius:99px;background:rgba(41,6,13,.25);backdrop-filter:blur(8px); } .hero-slide h1 { text-wrap:balance;text-shadow:0 3px 20px rgba(0,0,0,.26); } .hero-slider .carousel-control-prev,.hero-slider .carousel-control-next { width:48px;height:48px;top:50%;margin:0 22px;border-radius:50%;background:rgba(48,7,15,.48);backdrop-filter:blur(6px); } .category-chip { padding:12px 8px 16px;border-radius:20px;transition:.35s;background:#fff;border:1px solid #f0e3cc; } .category-chip:hover { transform:translateY(-7px);box-shadow:0 18px 35px rgba(18,58,37,.13);border-color:#8eb47b; } .category-chip .cat-icon-wrap { border:4px solid #fff;box-shadow:0 7px 20px rgba(18,58,37,.14); } .product-card,.blog-card,.testimonial-card { border:1px solid rgba(137,86,33,.12);box-shadow:0 10px 35px rgba(67,23,26,.065); } .product-card .product-thumb img,.blog-thumb img,.insta-item img { filter:saturate(1.04) contrast(1.02); } .offer-banner { background:linear-gradient(125deg,#0d2d1c 0%,#2f6b3c 72%,#79a765 140%);box-shadow:0 28px 65px rgba(18,58,37,.22); } .offer-banner img { box-shadow:0 22px 50px rgba(25,3,8,.35);border:1px solid rgba(255,223,145,.4); } .site-footer { position:relative;overflow:hidden;background:linear-gradient(145deg,#091f14,#123a25 55%,#07180f); } .site-footer>.container { position:relative;z-index:2; } .site-footer h6 { display:flex;align-items:center;gap:9px; } .site-footer h6::before { content:"";width:18px;height:2px;background:#d6a437; } .footer-glow { position:absolute;border-radius:50%;filter:blur(1px);background:radial-gradient(circle,rgba(198,143,41,.16),transparent 68%); } .footer-glow-one { width:430px;height:430px;right:-170px;top:-200px; } .footer-glow-two { width:360px;height:360px;left:-180px;bottom:-190px; } .footer-seal { display:flex;align-items:center;gap:10px;margin-top:18px;padding:11px 13px;border:1px solid rgba(214,164,55,.22);border-radius:12px;background:rgba(255,255,255,.035);max-width:235px; } .footer-seal i { color:#d6a437;font-size:1.55rem; } .footer-seal div { display:flex;flex-direction:column; }.footer-seal strong{color:#fff8ea;font-size:.82rem}.footer-seal small{font-size:.68rem} .trust-strip .trust-item i { width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#fff4d9; } .footer-newsletter { background:#fff;border:1px solid #d1e1cb;padding:5px;border-radius:99px;box-shadow:0 12px 35px rgba(18,58,37,.09); } .footer-newsletter input,.footer-newsletter .btn { border-radius:99px; } @media (max-width:1199.98px){ .brand-logo .brand-text{font-size:1.18rem}.main-nav .nav-link{padding:.7rem .42rem;font-size:.76rem} } @media (max-width:991.98px){ .header-shell{padding:10px 12px}.brand-logo .brand-mark{width:44px;height:44px}.header-actions{gap:5px!important}.icon-btn{width:40px;height:40px} .hero-slide{min-height:620px;text-align:left;background-position:62% center!important}.hero-slide .row{align-items:flex-end;min-height:560px}.hero-slide .col-lg-6{padding:24px;background:linear-gradient(135deg,rgba(9,45,27,.9),rgba(47,107,60,.55));border-radius:22px;backdrop-filter:blur(4px)}.hero-slide p{margin-left:0} } @media (max-width:575.98px){ .top-strip{min-height:30px}.top-strip .container{min-height:30px;padding:0}.marquee-wrap{max-width:100%}.top-strip-links{display:none}.top-strip .marquee-track{font-size:.68rem} .brand-logo .brand-text{font-size:1rem}.brand-logo .brand-text small{font-size:.5rem;letter-spacing:1.1px}.header-actions .icon-btn:nth-child(3){display:none}.header-actions .icon-btn{width:38px;height:38px} .hero-slide{min-height:590px;background-position:66% center!important}.hero-slide::after{inset:9px}.hero-slide .row{min-height:545px;align-items:flex-end}.hero-slide .col-lg-6{margin:0 6px;padding:20px 18px}.hero-slide h1{font-size:2.25rem}.hero-slide p{font-size:.9rem;margin-bottom:1.3rem}.hero-slide .btn{width:100%}.hero-slider .carousel-control-prev,.hero-slider .carousel-control-next{display:none} .section-pad-sm .row.g-3{--bs-gutter-x:.6rem}.category-chip{padding:8px 4px 12px}.category-chip h6{font-size:.76rem}.category-chip small{font-size:.63rem} .product-card .product-body{padding:.85rem}.product-card h6.product-title{font-size:.86rem}.product-card .btn-add-cart{font-size:.76rem;padding:.55rem .35rem} .footer-newsletter{border-radius:16px;flex-direction:column;padding:6px}.footer-newsletter .btn{margin-top:5px}.site-footer{text-align:left}.float-actions{bottom:76px} } @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}} /* Header layout correction: clear utility row + dedicated navigation row */ @media (min-width:992px){ .header-shell>.d-flex{display:grid!important;grid-template-columns:auto minmax(210px,1fr) auto;grid-template-areas:"brand search actions" "nav nav nav";column-gap:24px;row-gap:12px} .header-shell .brand-logo{grid-area:brand} .header-shell .search-inline{grid-area:search;display:flex!important;justify-self:center;width:min(100%,520px);max-width:520px} .header-shell .header-actions{grid-area:actions;justify-self:end} .header-shell .main-nav{grid-area:nav;width:100%;display:flex!important;justify-content:center;border-top:1px solid #efe3cf;padding-top:9px} .header-shell .main-nav>ul{width:100%;justify-content:center;gap:10px} .main-nav .nav-link{padding:.62rem .72rem;font-size:.8rem;white-space:nowrap} .mega-menu{top:calc(100% + 9px)!important} } @media (min-width:1200px){.main-nav .nav-link{font-size:.84rem;padding:.65rem .92rem}.header-shell .main-nav>ul{gap:4px}} /* Footer structure and universal contact actions */ .trust-strip{padding:18px 0;background:linear-gradient(90deg,#dcebd5,#f6faf3 48%,#dcebd5);border-block:1px solid #c6dcbc} .trust-strip .trust-item{height:100%;justify-content:center;padding:8px 12px;border-right:1px solid rgba(47,107,60,.14);font-size:.82rem} .trust-strip .col-md-3:last-child .trust-item{border-right:0} #site-footer>.bg-beige{background:linear-gradient(135deg,#f8fbf5,#e5f0df)!important;border-bottom:1px solid rgba(47,107,60,.12)} .site-footer .row.g-4>[class*="col-"]{position:relative} .site-footer .footer-links li{line-height:1.55;transition:transform .2s ease} .site-footer .footer-links li:has(a):hover{transform:translateX(4px)} .site-footer .footer-links a{position:relative} .site-footer .footer-links a::before{content:"";display:inline-block;width:0;height:1px;background:#d6a437;vertical-align:middle;transition:.25s} .site-footer .footer-links a:hover::before{width:10px;margin-right:6px} .site-footer .payment-icons{display:flex;align-items:center;gap:13px;font-size:1.65rem;color:#d6a437} .site-footer .app-badges a{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border:1px solid rgba(214,164,55,.25);border-radius:10px;margin-left:6px;background:rgba(255,255,255,.04)} .float-actions{right:18px;bottom:18px;gap:10px;align-items:flex-end} .float-actions .float-action{position:relative;overflow:visible} .float-actions .float-action span{position:absolute;right:62px;top:50%;transform:translate(8px,-50%);white-space:nowrap;background:#123a25;color:#f7faf4;border:1px solid rgba(168,198,134,.4);padding:7px 11px;border-radius:8px;font-size:.72rem;font-weight:600;opacity:0;visibility:hidden;transition:.25s;box-shadow:0 8px 24px rgba(9,31,20,.22)} .float-actions .float-action:hover span,.float-actions .float-action:focus span{opacity:1;visibility:visible;transform:translate(0,-50%)} .float-actions .btn-whatsapp,.float-actions .btn-call,.float-actions .btn-enquiry{animation:quickFloat 3s ease-in-out infinite} .float-actions .btn-call{animation-delay:.35s}.float-actions .btn-enquiry{animation-delay:.7s;background:linear-gradient(135deg,#d6a437,#9e6718);color:#fff} .float-actions .btn-enquiry::after,.float-actions .btn-whatsapp::after{content:"";position:absolute;inset:-5px;border:1px solid currentColor;border-radius:50%;opacity:0;animation:quickRing 2.3s ease-out infinite} @keyframes quickFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @keyframes quickRing{0%{transform:scale(.85);opacity:.45}75%,100%{transform:scale(1.28);opacity:0}} .enquiry-modal .modal-content{border:0;border-radius:24px;overflow:hidden;box-shadow:0 30px 90px rgba(44,5,14,.3)} .enquiry-modal-head{position:relative;display:flex;align-items:center;gap:14px;padding:22px 24px;background:linear-gradient(120deg,#123a25,#2f6b3c);color:#fff} .enquiry-modal-head>div:nth-child(2){flex:1}.enquiry-modal-head span{display:block;color:#d8ebc5;font-size:.67rem;letter-spacing:1.7px}.enquiry-modal-head h4{color:#fff;margin:2px 0 0}.enquiry-icon{width:50px;height:50px;border-radius:15px;background:linear-gradient(135deg,#d9ebc8,#82aa6e);display:grid;place-items:center;color:#123a25;font-size:1.2rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)} .enquiry-modal .modal-body{padding:24px}.enquiry-modal .form-label{font-size:.78rem;font-weight:600;color:#183d27}.enquiry-modal .form-control,.enquiry-modal .form-select{border-color:#d3e1ce;border-radius:11px;padding:.72rem .85rem;background:#fbfdf9}.enquiry-modal .form-control:focus,.enquiry-modal .form-select:focus{border-color:#6f9b5b;box-shadow:0 0 0 .2rem rgba(111,155,91,.14)} .enquiry-modal-foot{text-align:center;padding:11px 15px;background:#fff7e8;border-top:1px solid #eadcc3;color:#765b52;font-size:.68rem}.enquiry-modal-foot i{color:#25824b} @media(max-width:767.98px){ .trust-strip .trust-item{justify-content:flex-start;border-right:0;background:rgba(255,255,255,.52);border-radius:12px;padding:9px;font-size:.72rem} .site-footer .row.g-4>[class*="col-"]:not(:first-child){border-top:1px solid rgba(214,164,55,.14);padding-top:22px} .site-footer .app-badges{text-align:left!important}.site-footer .app-badges a{margin:4px 5px 0 0} } @media(max-width:575.98px){ .float-actions{right:10px;bottom:72px;gap:8px}.float-actions a,.float-actions button{width:44px;height:44px}.float-actions .float-action span{display:none} .enquiry-modal .modal-dialog{margin:12px}.enquiry-modal-head{padding:18px}.enquiry-modal .modal-body{padding:18px}.enquiry-icon{width:44px;height:44px} } /* Medium-deep green + light gold master theme */ .top-strip{background:linear-gradient(90deg,#1d402c,#3d7650 48%,#1d402c);border-color:rgba(242,206,114,.32)} .site-header{background:rgba(251,252,247,.96);border-color:rgba(53,107,72,.14)} .site-header.is-scrolled{box-shadow:0 12px 40px rgba(35,77,53,.13)} .brand-logo .brand-mark{border-color:#f2ce72;background:radial-gradient(circle at 35% 25%,#fff9dc,#f2ce72 48%,#3d7650 55%,#234d35);box-shadow:0 7px 22px rgba(35,77,53,.23),inset 0 0 0 3px rgba(255,255,255,.34)} .main-nav .nav-link:hover,.main-nav .nav-link.active{background:#eaf1e9}.search-inline button{background:#356b48}.icon-btn{border-color:#d8e3d7;box-shadow:0 5px 16px rgba(35,77,53,.08)} .mobile-menu-trigger{border-color:#cbdcca;background:#edf4ea}.mobile-menu-trigger span{background:#356b48}.mobile-quick-nav{border-color:#d9e6d7;background:#f2f7ef}.mobile-quick-nav a{color:#2b5940;border-color:#d9e6d7}.offcanvas-mobile-menu{background:linear-gradient(180deg,#fcfdf9,#edf4ea)} .mobile-menu-welcome{background:linear-gradient(135deg,#3d7650,#234d35)}.mobile-nav-list .nav-link{border-color:#d9e6d7;color:#234d35}.mobile-nav-list .nav-link.active{background:#356b48} .offer-banner{background:linear-gradient(125deg,#234d35 0%,#427b54 72%,#e7c162 150%);box-shadow:0 28px 65px rgba(35,77,53,.22)} .site-footer{background:linear-gradient(145deg,#183b28,#28583b 55%,#153321)} .float-actions .float-action span{background:#234d35}.enquiry-modal-head{background:linear-gradient(120deg,#234d35,#427b54)} .trust-strip{background:linear-gradient(90deg,#e2eadb,#fff9e7 48%,#e2eadb);border-color:#cad8c5}#site-footer>.bg-beige{background:linear-gradient(135deg,#f7faf3,#e8efdf)!important;border-color:rgba(53,107,72,.14)} .page-banner::before{background:linear-gradient(120deg,rgba(29,66,44,.93),rgba(53,107,72,.78))} /* Home contact and Google Map */ .home-contact-section{position:relative;overflow:hidden;padding:90px 0 100px;background:linear-gradient(145deg,#f1f6ed,#fffaf0 52%,#e7efe2)} .contact-orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}.contact-orb-one{width:360px;height:360px;left:-170px;top:-150px;background:radial-gradient(circle,rgba(53,107,72,.14),transparent 68%)}.contact-orb-two{width:420px;height:420px;right:-190px;bottom:-210px;background:radial-gradient(circle,rgba(242,206,114,.24),transparent 68%)} .home-contact-head{display:grid;grid-template-columns:minmax(360px,1fr) minmax(300px,520px);align-items:end;gap:45px;margin-bottom:34px}.home-contact-head .eyebrow{display:inline-flex;align-items:center;gap:7px;margin-bottom:8px;color:#c99526;font-size:.72rem;font-weight:700;letter-spacing:1.7px;text-transform:uppercase}.home-contact-head h2{margin:0;font-size:clamp(2.2rem,3.6vw,3.5rem);color:#234d35;text-wrap:balance}.home-contact-head p{margin:0;color:#587060;line-height:1.8} .contact-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.contact-info-card{position:relative;display:flex;align-items:center;gap:14px;min-width:0;padding:20px;border:1px solid rgba(53,107,72,.12);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 12px 35px rgba(35,77,53,.075);transition:.35s;overflow:hidden}.contact-info-card::before{content:"";position:absolute;inset:auto 0 0;height:3px;background:var(--card-color)}.contact-info-card:hover{transform:translateY(-7px);box-shadow:0 22px 42px rgba(35,77,53,.14)}.contact-phone{--card-color:#2f9e62}.contact-email{--card-color:#d39b25}.contact-web{--card-color:#397ec5}.contact-info-card .contact-icon{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--card-color) 12%,white);color:var(--card-color);font-size:1.15rem;transition:.35s}.contact-info-card:hover .contact-icon{transform:rotate(-8deg) scale(1.08);background:var(--card-color);color:#fff}.contact-info-card>div{display:flex;flex-direction:column;min-width:0}.contact-info-card small{color:#809086;font-size:.57rem;font-weight:700;letter-spacing:1.2px}.contact-info-card strong{overflow:hidden;text-overflow:ellipsis;color:#234d35;font-size:.92rem;white-space:nowrap}.contact-info-card em{color:#75867b;font-size:.63rem;font-style:normal}.contact-arrow{margin-left:auto;color:var(--card-color);font-size:.75rem;transition:.3s}.contact-info-card:hover .contact-arrow{transform:translateX(4px)} .contact-map-shell{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.75fr);min-height:500px;border:7px solid #fff;border-radius:28px;background:#fff;box-shadow:0 28px 65px rgba(35,77,53,.14);overflow:hidden}.google-map-wrap{position:relative;min-height:500px;overflow:hidden}.google-map-wrap iframe{width:100%;height:100%;min-height:500px;border:0;filter:saturate(.86) contrast(.95);transition:filter .4s}.google-map-wrap:hover iframe{filter:saturate(1) contrast(1)}.map-badge{position:absolute;left:20px;bottom:20px;display:flex;align-items:center;gap:11px;padding:12px 16px;border-radius:13px;background:rgba(255,255,255,.94);box-shadow:0 12px 30px rgba(30,67,45,.18);backdrop-filter:blur(8px)}.map-badge>i{width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:#356b48;color:#f2ce72}.map-badge div{display:flex;flex-direction:column}.map-badge small{font-size:.55rem;letter-spacing:1.2px;color:#849087}.map-badge strong{color:#234d35;font-size:.82rem} .visit-card{position:relative;padding:42px 34px;background:linear-gradient(155deg,#2d6343,#234d35);color:rgba(255,255,255,.76)}.visit-card::after{content:"ॐ";position:absolute;right:-15px;top:-25px;color:rgba(242,206,114,.07);font-family:serif;font-size:10rem}.visit-card>*{position:relative;z-index:1}.visit-label{color:#f2ce72;font-size:.62rem;font-weight:700;letter-spacing:1.6px}.visit-card h3{margin:8px 0 12px;color:#fff9ea;font-size:2rem}.visit-card>p{font-size:.84rem;line-height:1.75}.visit-card ul{display:grid;gap:12px;margin:25px 0}.visit-card li{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.1)}.visit-card li>i{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:rgba(242,206,114,.12);color:#f2ce72}.visit-card li span{display:flex;flex-direction:column}.visit-card li small{font-size:.58rem;letter-spacing:.8px;color:rgba(255,255,255,.58)}.visit-card li strong{font-size:.76rem;color:#fff}.visit-actions{display:grid;gap:9px}.visit-actions .btn{width:100%;padding:.75rem}.visit-enquiry-btn{border:1px solid rgba(255,255,255,.35);border-radius:99px;color:#fff;background:transparent}.visit-enquiry-btn:hover{background:#fff;color:#356b48} @media(max-width:991.98px){.home-contact-section{padding:65px 0}.home-contact-head{grid-template-columns:1fr;gap:12px}.contact-info-grid{grid-template-columns:1fr}.contact-map-shell{grid-template-columns:1fr}.google-map-wrap,.google-map-wrap iframe{min-height:400px}.visit-card{padding:34px}} @media(max-width:575.98px){.home-contact-section{padding:48px 0}.home-contact-head h2{font-size:2.25rem}.contact-info-card{padding:15px}.contact-info-card .contact-icon{width:42px;height:42px;flex-basis:42px}.contact-info-card strong{font-size:.78rem}.contact-map-shell{border-width:4px;border-radius:20px}.google-map-wrap,.google-map-wrap iframe{min-height:330px}.map-badge{left:12px;bottom:12px;padding:9px 11px}.visit-card{padding:28px 22px}.visit-card h3{font-size:1.7rem}} /* Large Janmashtami campaign banner */ .janmashtami-offer{position:relative;isolation:isolate;min-height:590px;overflow:hidden;background-color:#4b2d02;background-image:linear-gradient(90deg,rgba(43,24,0,.96) 0%,rgba(74,43,1,.86) 38%,rgba(81,44,0,.3) 67%,rgba(43,23,0,.08) 100%),url('../images/Indian_sweets_festive_banner_phoGǪ_202609031340.jpeg');background-size:cover;background-position:center} .janmashtami-offer::before{content:"";position:absolute;inset:18px;z-index:2;border:1px solid rgba(242,206,114,.4);border-radius:4px;pointer-events:none} .janmashtami-offer::after{content:"ॐ";position:absolute;right:4%;top:50%;z-index:1;transform:translateY(-50%);font-family:serif;font-size:clamp(11rem,23vw,22rem);line-height:1;color:rgba(255,224,139,.07);pointer-events:none} .janmashtami-pattern{position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 17% 20%,rgba(242,206,114,.13),transparent 28%),linear-gradient(135deg,transparent 48%,rgba(255,255,255,.025) 49%,transparent 50%);background-size:auto,28px 28px} .min-vh-offer{min-height:590px} .janmashtami-content{position:relative;z-index:3;padding:70px 0;color:rgba(255,249,234,.88)} .festival-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:17px;padding:8px 14px;border:1px solid rgba(242,206,114,.42);border-radius:99px;background:rgba(255,255,255,.07);color:#f4d477;font-size:.72rem;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;backdrop-filter:blur(7px)} .festival-kicker i{font-size:1rem;animation:festivalGlow 2.2s ease-in-out infinite} .janmashtami-content h2{max-width:680px;margin:0 0 16px;color:#fff9ea;font-size:clamp(2.4rem,4.3vw,4.5rem);line-height:1.05;text-wrap:balance;text-shadow:0 5px 24px rgba(23,10,0,.35)} .janmashtami-content>p{max-width:620px;margin:0 0 25px;color:rgba(255,249,234,.82);font-size:1.02rem;line-height:1.75} .festival-offer-row{display:flex;align-items:center;gap:18px;margin-bottom:28px} .festival-discount{display:flex;align-items:center;gap:9px}.festival-discount strong{font-family:var(--font-heading);font-size:3.2rem;line-height:1;color:#f2ce72}.festival-discount span{color:#fff;font-size:.65rem;font-weight:800;letter-spacing:1.4px;line-height:1.45} .coupon-code{position:relative;display:grid;grid-template-columns:auto auto;grid-template-areas:"label icon" "code icon";align-items:center;column-gap:20px;min-width:205px;padding:10px 15px;text-align:left;border:1px dashed rgba(255,238,184,.72);border-radius:12px;background:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(8px);transition:.3s} .coupon-code::before,.coupon-code::after{content:"";position:absolute;left:-7px;width:13px;height:13px;border-radius:50%;background:#4b2d02}.coupon-code::before{top:-7px}.coupon-code::after{bottom:-7px} .coupon-code span{grid-area:label;color:#e8cf92;font-size:.57rem;letter-spacing:1.5px}.coupon-code strong{grid-area:code;font-size:1.05rem;letter-spacing:2px}.coupon-code i{grid-area:icon;color:#f2ce72;font-size:1.15rem}.coupon-code:hover,.coupon-code.is-copied{transform:translateY(-3px);background:rgba(242,206,114,.2);border-color:#f2ce72} .festival-actions{display:flex;flex-wrap:wrap;gap:12px}.festival-actions .btn{font-size:.84rem;padding:.85rem 1.4rem}.festival-outline-btn{border:1px solid rgba(255,249,234,.55);border-radius:99px;color:#fff9ea;background:rgba(255,255,255,.05);backdrop-filter:blur(6px)}.festival-outline-btn:hover{background:#fff9ea;color:#5a3a05;transform:translateY(-3px)} .festival-benefits{display:flex;flex-wrap:wrap;gap:20px;margin-top:25px;padding-top:20px;border-top:1px solid rgba(242,206,114,.22);color:rgba(255,249,234,.72);font-size:.7rem}.festival-benefits i{color:#f2ce72;margin-right:5px} @keyframes festivalGlow{50%{filter:drop-shadow(0 0 7px #f2ce72);transform:scale(1.08)}} @media(max-width:991.98px){.janmashtami-offer{background-position:62% center}.janmashtami-content{max-width:610px;margin-inline:auto;padding-inline:24px}.janmashtami-content::before{content:"";position:absolute;inset:38px 0;z-index:-1;border-radius:24px;background:linear-gradient(135deg,rgba(55,31,0,.88),rgba(106,61,2,.6));backdrop-filter:blur(3px)}} @media(max-width:575.98px){.janmashtami-offer,.min-vh-offer{min-height:650px}.janmashtami-offer{background-position:67% center}.janmashtami-offer::before{inset:9px}.janmashtami-content{padding:55px 18px}.janmashtami-content::before{inset:25px 3px}.janmashtami-content h2{font-size:2.45rem}.janmashtami-content>p{font-size:.88rem;line-height:1.65}.festival-offer-row{align-items:stretch;gap:10px}.festival-discount strong{font-size:2.45rem}.coupon-code{min-width:0;flex:1;column-gap:8px}.festival-actions{display:grid}.festival-actions .btn{width:100%}.festival-benefits{gap:9px 14px;margin-top:20px}.festival-kicker{font-size:.59rem;letter-spacing:1.2px}} /* Premium footer navigation and payment presentation */ .site-footer{padding-top:4.5rem!important} .site-footer .row.g-4{--bs-gutter-x:2.4rem;--bs-gutter-y:2.5rem} .site-footer h6{margin-bottom:1.15rem;font-size:.82rem;letter-spacing:1.35px} .site-footer .footer-links{display:flex;flex-direction:column;gap:3px} .site-footer .footer-links li{margin:0;line-height:1.55;color:rgba(255,249,234,.7)} .site-footer .footer-links li>a{display:flex;align-items:center;gap:10px;padding:6px 8px;margin-left:-8px;border-radius:8px;transition:all .25s ease} .site-footer .footer-links li>a::before{display:none!important} .site-footer .footer-links li>a>i{width:25px;height:25px;flex:0 0 25px;display:inline-grid;place-items:center;border-radius:7px;background:rgba(242,206,114,.1);border:1px solid rgba(242,206,114,.13);color:#efc75e;font-size:.68rem;transition:all .25s ease} .site-footer .footer-links li>a:hover{background:rgba(255,255,255,.045);transform:translateX(4px);color:#fff2bd} .site-footer .footer-links li>a:hover>i{background:#efc75e;color:#5a3a05;border-color:#efc75e;transform:rotate(-6deg) scale(1.06)} .site-footer .col-lg-3:last-child .footer-links li{display:grid;grid-template-columns:25px 1fr;align-items:start;column-gap:7px;padding:6px 0} .site-footer .col-lg-3:last-child .footer-links li>i{width:25px;height:25px;display:grid;place-items:center;margin:0!important;border-radius:7px;background:rgba(242,206,114,.1);font-size:.72rem} .site-footer .col-lg-3:last-child .footer-links li>a{display:inline;padding:0;margin:0;align-self:center} .site-footer .col-lg-3:last-child .footer-links li>a:hover{background:none;transform:none} .footer-payments{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center} .footer-local-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:38px;padding:28px;border:1px solid rgba(232,188,85,.2);border-radius:22px;background:radial-gradient(circle at top right,rgba(232,188,85,.09),transparent 30%),rgba(255,255,255,.025)} .footer-city-group{padding:20px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.018));box-shadow:0 10px 24px rgba(25,2,8,.15);animation:footerCityRise .6s ease both}.footer-city-group:nth-child(3n+2){animation-delay:.08s}.footer-city-group:nth-child(3n){animation-delay:.16s}.footer-city-group h6{margin-bottom:16px;font-size:.88rem}.footer-city-group h6 i{color:#E8BC55;font-size:.9rem}.footer-keyword-links{display:flex;flex-wrap:wrap;gap:9px}.footer-keyword-links a{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;padding:9px 13px;border:1px solid rgba(232,188,85,.25);border-radius:999px;background:rgba(214,154,24,.11);font-size:.8rem;font-weight:500;line-height:1.3;color:#ffe9ad;box-shadow:0 4px 12px rgba(30,3,8,.1);transition:color .28s ease,background .28s ease,border-color .28s ease,transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease}.footer-keyword-links a:nth-child(5n+2){border-color:rgba(109,196,255,.28);background:rgba(45,135,196,.12);color:#ccecff}.footer-keyword-links a:nth-child(5n+3){border-color:rgba(255,128,160,.28);background:rgba(180,49,85,.13);color:#ffd4df}.footer-keyword-links a:nth-child(5n+4){border-color:rgba(118,222,157,.28);background:rgba(47,148,89,.12);color:#d3ffe2}.footer-keyword-links a:nth-child(5n){border-color:rgba(198,148,255,.28);background:rgba(119,68,176,.12);color:#ead7ff}.footer-keyword-links a::after{content:"";position:absolute;z-index:-1;inset:-2px;transform:translateX(-115%) skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);transition:transform .55s ease}.footer-keyword-links a:hover{z-index:2;border-color:#E8BC55;background:linear-gradient(135deg,#D69A18,#7A1F2B);color:#fff;transform:translateY(-4px) scale(1.035);box-shadow:0 10px 22px rgba(214,154,24,.24)}.footer-keyword-links a:hover::after{transform:translateX(115%) skewX(-20deg)} @keyframes footerCityRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}} .footer-keyword-links a{font-size:.9rem;padding:10px 14px} .payment-title{display:inline-flex;align-items:center;gap:8px;color:rgba(255,249,234,.82);font-size:.72rem;font-weight:600;letter-spacing:1.15px;text-transform:uppercase} .payment-title i{color:#72c98c} .site-footer .payment-icons{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:11px;font-size:inherit} .payment-brand{width:68px;height:46px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:10px;background:#fff;box-shadow:0 7px 20px rgba(26,13,0,.2);border:1px solid rgba(255,255,255,.7);transition:transform .25s ease,box-shadow .25s ease} .payment-brand:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(26,13,0,.3)} .payment-brand strong,.payment-brand small{font-family:Arial,sans-serif;line-height:1}.payment-brand.visa strong{color:#1a1f71;font-size:1.15rem;font-style:italic;letter-spacing:-.5px}.payment-brand.mastercard{flex-direction:column;gap:2px}.mc-circles{display:flex}.payment-icons .mc-circles i{display:block;width:17px;height:17px;margin:0;border-radius:50%;background:#eb001b}.payment-icons .mc-circles i+ i{margin-left:-5px;background:#f79e1b;opacity:.92}.payment-brand.mastercard small{color:#231f20;font-size:.48rem;font-weight:700}.payment-brand.gpay strong{color:#3c4043;font-size:1rem;font-weight:600}.payment-brand.gpay b{color:#4285f4;font-size:1.28rem}.payment-brand.upi{gap:6px}.payment-brand.upi strong{color:#176b3a;font-size:1.15rem;font-style:italic;letter-spacing:-1px}.upi-mark{position:relative;width:15px;height:21px;transform:skew(-20deg);border-left:5px solid #f58220;border-right:5px solid #168b43}.payment-brand.paypal strong{color:#009cde;font-size:.92rem;font-style:italic}.payment-brand.paypal b{color:#003087}.payment-brand.cod{color:#207646;flex-direction:column;gap:0}.payment-brand.cod strong{display:grid;place-items:center;width:21px;height:21px;border:2px solid currentColor;border-radius:50%;font-size:.9rem}.payment-brand.cod small{font-size:.54rem;font-weight:800;line-height:1} .footer-payments .app-badges{display:flex;justify-content:center;flex-wrap:wrap;gap:8px} .footer-payments .app-badges a{margin:0;padding:9px 14px;background:rgba(255,255,255,.055);border-color:rgba(242,206,114,.24)} .footer-payments .app-badges a:first-child i{color:#fff}.footer-payments .app-badges a:last-child i{color:#7fcf6a} @media(max-width:991.98px){.site-footer{padding-top:3.5rem!important}.site-footer .row.g-4{--bs-gutter-x:1.5rem}.payment-brand{width:64px;height:43px}} @media(max-width:767.98px){.footer-local-links{grid-template-columns:1fr;gap:24px;padding:22px 18px}} @media(max-width:575.98px){.site-footer{padding-top:2.8rem!important}.site-footer .row.g-4{--bs-gutter-y:1.4rem}.site-footer h6{margin-bottom:.7rem}.site-footer .footer-links li>a{padding:5px 7px}.footer-local-links{margin-top:28px}.footer-city-group{padding:17px 14px}.footer-keyword-links{gap:7px}.footer-keyword-links a{padding:8px 10px;font-size:.74rem}.payment-brand{width:58px;height:40px}.payment-brand i{font-size:1.72rem}.footer-payments{gap:13px}} @media(max-width:575.98px){.footer-keyword-links a{font-size:.8rem;padding:9px 11px}} /* ========================================================= 29. GOLD SIGNATURE THEME ========================================================= */ body{background:#fffaf0} .top-strip{background:linear-gradient(90deg,#4a2e02,#a96e0f 48%,#4a2e02);border-color:rgba(242,206,114,.38)} .site-header{background:rgba(255,250,240,.96);border-color:rgba(180,123,22,.14)} .site-header.is-scrolled{box-shadow:0 12px 40px rgba(90,58,5,.12)} .brand-logo .brand-mark{border-color:#f2ce72;background:radial-gradient(circle at 35% 25%,#fff8d8,#f2ce72 48%,#b47b16 55%,#5a3a05);box-shadow:0 7px 22px rgba(90,58,5,.24),inset 0 0 0 3px rgba(255,255,255,.34)} .main-nav .nav-link:hover,.main-nav .nav-link.active{background:#f8edcf} .search-inline button{background:#b47b16}.icon-btn{border-color:#ead9ad;box-shadow:0 5px 16px rgba(90,58,5,.08)} .mobile-menu-trigger{border-color:#e6d19c;background:#fbf0d2}.mobile-menu-trigger span{background:#9c6710} .mobile-quick-nav{border-color:#eadbb5;background:#fff7e4}.mobile-quick-nav a{color:#6d4608;border-color:#eadbb5} .offcanvas-mobile-menu{background:linear-gradient(180deg,#fffdf8,#f9edcf)} .mobile-menu-welcome{background:linear-gradient(135deg,#b47b16,#5a3a05)} .mobile-nav-list .nav-link{border-color:#eadbb5;color:#5a3a05}.mobile-nav-list .nav-link.active{background:#b47b16} .hero-slide::before{background:radial-gradient(circle at 18% 50%,rgba(180,123,22,.2),transparent 42%)} .hero-slide .eyebrow{background:rgba(67,42,2,.3)} .hero-slider .carousel-control-prev,.hero-slider .carousel-control-next{background:rgba(74,46,2,.55)} .page-banner::before{background:linear-gradient(120deg,rgba(59,38,3,.93),rgba(180,123,22,.78))} .category-chip:hover{box-shadow:0 18px 35px rgba(90,58,5,.14);border-color:#d5ae54}.category-chip .cat-icon-wrap{box-shadow:0 7px 20px rgba(90,58,5,.15)} .offer-banner{background:linear-gradient(125deg,#4a2e02 0%,#b47b16 72%,#f2ce72 140%);box-shadow:0 28px 65px rgba(90,58,5,.24)} .site-footer{background:linear-gradient(145deg,#2f1d01,#5a3a05 55%,#241600)} .footer-newsletter{border-color:#e5d19d;box-shadow:0 12px 35px rgba(90,58,5,.1)} .trust-strip{background:linear-gradient(90deg,#f3dfad,#fff8e7 48%,#f3dfad);border-color:#e5c77c} #site-footer>.bg-beige{background:linear-gradient(135deg,#fffaf0,#f6e5b8)!important;border-color:rgba(180,123,22,.14)} .float-actions .float-action span{background:#5a3a05;border-color:rgba(242,206,114,.42);box-shadow:0 8px 24px rgba(59,38,3,.24)} .float-actions .btn-enquiry{background:linear-gradient(135deg,#efc863,#a96e0f)} .enquiry-modal-head{background:linear-gradient(120deg,#5a3a05,#b47b16)} .enquiry-modal-head span{color:#fff0b8}.enquiry-icon{background:linear-gradient(135deg,#fff1b7,#d6a83c);color:#5a3a05} .enquiry-modal .form-label{color:#5a3a05}.enquiry-modal .form-control,.enquiry-modal .form-select{border-color:#e6d5ab;background:#fffdf7}.enquiry-modal .form-control:focus,.enquiry-modal .form-select:focus{border-color:#c99526;box-shadow:0 0 0 .2rem rgba(201,149,38,.14)} @media(max-width:991.98px){.hero-slide .col-lg-6{background:linear-gradient(135deg,rgba(74,46,2,.91),rgba(180,123,22,.58))}} /* Hero image thumbnails */ .hero-slider .hero-thumbnails{bottom:22px;z-index:5;align-items:center;gap:10px;margin-bottom:0} .hero-slider .hero-thumbnails [data-bs-target]{box-sizing:border-box;width:62px;height:62px;margin:0;border:3px solid rgba(255,255,255,.68);border-radius:50%;overflow:hidden;background:none;opacity:.72;box-shadow:0 8px 24px rgba(40,24,0,.28);transition:all .35s cubic-bezier(.22,1,.36,1)} .hero-slider .hero-thumbnails [data-bs-target] img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease} .hero-slider .hero-thumbnails [data-bs-target]:hover{opacity:1;transform:translateY(-5px)} .hero-slider .hero-thumbnails [data-bs-target]:hover img{transform:scale(1.14)} .hero-slider .hero-thumbnails [data-bs-target].active{width:74px;height:74px;opacity:1;border-color:#f2ce72;box-shadow:0 0 0 4px rgba(242,206,114,.2),0 12px 30px rgba(40,24,0,.36)} /* Large rounded-square category showcase */ .home-categories{position:relative;padding-block:72px;background:radial-gradient(circle at 10% 0,rgba(242,206,114,.22),transparent 34%),#fffaf0;overflow:hidden} .home-categories::before{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(180,123,22,.14);border-radius:50%;right:-85px;top:-100px;box-shadow:0 0 0 24px rgba(180,123,22,.035),0 0 0 48px rgba(180,123,22,.025)} .category-section-head{display:grid;grid-template-columns:1fr minmax(260px,440px) auto;align-items:end;gap:28px;margin-bottom:32px} .category-section-head .eyebrow{display:block;color:var(--color-gold-deep);font-size:.72rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:5px} .category-section-head h2{font-size:clamp(2rem,3vw,2.8rem);margin:0}.category-section-head p{margin:0;color:#705f41;line-height:1.65}.category-section-head>a{white-space:nowrap;font-weight:700;color:var(--color-primary);padding-bottom:5px;border-bottom:1px solid currentColor}.category-section-head>a i{margin-left:7px;transition:transform .25s}.category-section-head>a:hover i{transform:translateX(5px)} .category-grid .category-chip{height:100%;padding:8px 8px 15px;border-radius:26px;background:#fff;border:1px solid #ead8aa;box-shadow:0 12px 30px rgba(90,58,5,.08);overflow:hidden} .category-grid .category-chip:hover{transform:translateY(-9px);box-shadow:0 24px 45px rgba(90,58,5,.17)} .category-grid .cat-icon-wrap{width:100%;aspect-ratio:1;border:0;border-radius:20px;overflow:hidden;box-shadow:none;background:#f7ebcb} .category-grid .cat-icon-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.22,1,.36,1),filter .4s ease} .category-grid .category-chip:hover .cat-icon-wrap img{transform:scale(1.12);filter:saturate(1.1) contrast(1.04)} .category-meta{position:relative;padding:14px 7px 0}.category-meta h6{font-size:1rem;margin:0 0 2px}.category-meta small{color:#8a7653;font-size:.69rem}.category-meta>i{position:absolute;right:5px;top:18px;color:#c99526;font-size:.72rem;transition:transform .3s}.category-chip:hover .category-meta>i{transform:translate(3px,-3px)} /* Consistent image zoom across the complete homepage */ body[data-page="home"] main img{transition:transform .65s cubic-bezier(.22,1,.36,1),filter .4s ease} body[data-page="home"] .product-card:hover .product-thumb img, body[data-page="home"] .blog-card:hover .blog-thumb img, body[data-page="home"] .insta-item:hover img, body[data-page="home"] .giftbox-card:hover img, body[data-page="home"] .image-tile:hover img{transform:scale(1.09);filter:saturate(1.08) contrast(1.04)} body[data-page="home"] .blog-thumb,body[data-page="home"] .insta-item,body[data-page="home"] .giftbox-card{overflow:hidden} body[data-page="home"] .offer-banner img:hover,body[data-page="home"] img.rounded-4:hover{transform:scale(1.035);filter:saturate(1.07)} @media(max-width:991.98px){.category-section-head{grid-template-columns:1fr auto}.category-section-head p{grid-column:1/-1;grid-row:2}.home-categories{padding-block:55px}} @media(max-width:575.98px){ .hero-slider .hero-thumbnails{bottom:12px;gap:7px}.hero-slider .hero-thumbnails [data-bs-target]{width:46px;height:46px;border-width:2px}.hero-slider .hero-thumbnails [data-bs-target].active{width:56px;height:56px} .category-section-head{grid-template-columns:1fr;gap:8px;margin-bottom:23px}.category-section-head p{grid-column:auto;grid-row:auto;font-size:.84rem}.category-section-head>a{display:none}.home-categories{padding-block:42px} .category-grid{--bs-gutter-x:.8rem;--bs-gutter-y:.8rem}.category-grid .category-chip{padding:6px 6px 12px;border-radius:20px}.category-grid .cat-icon-wrap{border-radius:15px}.category-meta{padding:11px 4px 0}.category-meta h6{font-size:.9rem}.category-meta>i{right:2px;top:14px} } /* Final hybrid palette precedence */ .top-strip{background:linear-gradient(90deg,#1d402c,#3d7650 48%,#1d402c)} .site-header{background:rgba(251,252,247,.96);border-color:rgba(53,107,72,.14)} .site-header.is-scrolled{box-shadow:0 12px 40px rgba(35,77,53,.13)} .brand-logo .brand-mark{border-color:#f2ce72;background:radial-gradient(circle at 35% 25%,#fff9dc,#f2ce72 48%,#3d7650 55%,#234d35);box-shadow:0 7px 22px rgba(35,77,53,.23),inset 0 0 0 3px rgba(255,255,255,.34)} .main-nav .nav-link:hover,.main-nav .nav-link.active{background:#eaf1e9}.search-inline button{background:#356b48}.icon-btn{border-color:#d8e3d7;box-shadow:0 5px 16px rgba(35,77,53,.08)} .mobile-menu-trigger{border-color:#cbdcca;background:#edf4ea}.mobile-menu-trigger span{background:#356b48}.mobile-quick-nav{border-color:#d9e6d7;background:#f2f7ef}.mobile-quick-nav a{color:#2b5940;border-color:#d9e6d7}.offcanvas-mobile-menu{background:linear-gradient(180deg,#fcfdf9,#edf4ea)}.mobile-menu-welcome{background:linear-gradient(135deg,#3d7650,#234d35)}.mobile-nav-list .nav-link{border-color:#d9e6d7;color:#234d35}.mobile-nav-list .nav-link.active{background:#356b48} .offer-banner{background:linear-gradient(125deg,#234d35 0%,#427b54 72%,#e7c162 150%);box-shadow:0 28px 65px rgba(35,77,53,.22)} .site-footer{background:linear-gradient(145deg,#183b28,#28583b 55%,#153321)} .float-actions .float-action span{background:#234d35}.enquiry-modal-head{background:linear-gradient(120deg,#234d35,#427b54)} .trust-strip{background:linear-gradient(90deg,#e2eadb,#fff9e7 48%,#e2eadb);border-color:#cad8c5}#site-footer>.bg-beige{background:linear-gradient(135deg,#f7faf3,#e8efdf)!important;border-color:rgba(53,107,72,.14)} .page-banner::before{background:linear-gradient(120deg,rgba(29,66,44,.93),rgba(53,107,72,.78))} @media(max-width:991.98px){.hero-slide .col-lg-6{background:linear-gradient(135deg,rgba(29,66,44,.92),rgba(61,118,80,.6))}} /* Expanded build-your-own sweet box */ .build-box-showcase{position:relative;margin-top:65px;padding:62px 42px 38px;border:1px solid rgba(53,107,72,.12);border-radius:32px;background:radial-gradient(circle at 100% 0,rgba(242,206,114,.24),transparent 28%),linear-gradient(145deg,#f5f8f1,#fffaf0);box-shadow:0 24px 60px rgba(35,77,53,.1);overflow:hidden} .build-box-showcase::before{content:"";position:absolute;left:-75px;bottom:-85px;width:220px;height:220px;border:1px solid rgba(53,107,72,.12);border-radius:50%;box-shadow:0 0 0 25px rgba(53,107,72,.025),0 0 0 50px rgba(53,107,72,.018)} .build-box-showcase .section-heading{position:relative;margin-bottom:35px}.build-box-showcase .section-heading p{max-width:590px;margin-inline:auto} .build-box-grid{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px} .build-box-showcase .build-box-item{position:relative;min-width:0;padding:8px 8px 16px;border:1px solid #dce7d9;border-radius:23px;background:#fff;text-align:left;box-shadow:0 10px 28px rgba(35,77,53,.07);overflow:hidden;animation:sweetCardFloat 4.5s ease-in-out infinite;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s,border-color .3s} .build-box-showcase .build-box-item:nth-child(2n){animation-delay:.6s}.build-box-showcase .build-box-item:nth-child(3n){animation-delay:1.2s}.build-box-showcase .build-box-item:nth-child(4n){animation-delay:1.8s} .build-box-showcase .build-box-item:hover{z-index:2;transform:translateY(-11px) scale(1.025);border-color:#c99526;box-shadow:0 24px 42px rgba(35,77,53,.16);animation-play-state:paused} .build-box-image{position:relative;width:100%;aspect-ratio:1;overflow:hidden;border-radius:17px;background:#eef3ea}.build-box-image img{width:100%;height:100%;margin:0;object-fit:cover;border-radius:0;transition:transform .65s cubic-bezier(.22,1,.36,1),filter .4s}.build-box-item:hover .build-box-image img{transform:scale(1.13);filter:saturate(1.1) contrast(1.04)} .build-check{position:absolute;right:10px;top:10px;width:30px;height:30px;display:grid;place-items:center;border:2px solid rgba(255,255,255,.9);border-radius:50%;background:rgba(35,77,53,.55);color:#fff;font-size:.7rem;opacity:0;transform:scale(.65) rotate(-20deg);transition:.3s;backdrop-filter:blur(5px)} .build-box-item.is-selected{border-color:#c99526;box-shadow:0 0 0 3px rgba(201,149,38,.13),0 18px 38px rgba(35,77,53,.13)}.build-box-item.is-selected .build-check{opacity:1;transform:scale(1) rotate(0);background:#356b48}.build-box-item.is-selected .build-box-image::after{content:"Selected";position:absolute;left:10px;top:10px;padding:5px 9px;border-radius:99px;background:#f2ce72;color:#234d35;font-size:.54rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase} .build-box-meta{display:flex;flex-direction:column;padding:13px 8px 0}.build-box-meta>span{color:#c18e20;font-size:.56rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}.build-box-meta strong{margin:2px 0;color:#234d35;font-family:var(--font-heading);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.build-box-meta small{color:#708077;font-size:.65rem} .build-box-footer{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:32px;padding-top:25px;border-top:1px solid rgba(53,107,72,.12)}.build-box-footer>div{display:flex;flex-wrap:wrap;gap:18px}.build-box-footer span{color:#64776b;font-size:.7rem}.build-box-footer span i{margin-right:5px;color:#c99526}.build-box-footer .btn{white-space:nowrap} @keyframes sweetCardFloat{0%,100%{translate:0 0}50%{translate:0 -5px}} @media(max-width:991.98px){.build-box-showcase{padding:50px 28px 32px}.build-box-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.build-box-footer{align-items:flex-start;flex-direction:column}} @media(max-width:575.98px){.build-box-showcase{margin-top:40px;padding:40px 12px 22px;border-radius:23px}.build-box-showcase .section-heading{margin-bottom:24px;padding-inline:7px}.build-box-grid{gap:11px}.build-box-showcase .build-box-item{padding:6px 6px 12px;border-radius:17px}.build-box-image{border-radius:12px}.build-box-meta{padding:10px 5px 0}.build-box-meta strong{font-size:.87rem}.build-box-meta>span{font-size:.49rem}.build-box-footer{margin:24px 5px 0;padding-top:20px}.build-box-footer>div{gap:8px}.build-box-footer .btn{width:100%}} @media(prefers-reduced-motion:reduce){.build-box-showcase .build-box-item{animation:none}} /* Royal festive maroon palette — final precedence */ .btn-brand,.btn-add-cart{background:#7A1F2B!important;color:#fff9ea!important} .btn-brand:hover,.btn-add-cart:hover{background:#9A2938!important;color:#fff!important;box-shadow:0 14px 30px rgba(122,31,43,.25)} .product-card .price-now,.price-now{color:#7A1F2B!important} .nav-tabs-brand .nav-link.active{background:#7A1F2B!important;color:#fff9ea!important} .nav-tabs-brand .nav-link:not(.active):hover{color:#9A2938;border-color:#9A2938} .star-rating,.star-rating i,[data-rating] i{color:#D69A18!important} .text-gold{color:#D69A18!important} .main-nav .nav-link:hover,.main-nav .nav-link.active{color:#7A1F2B;background:#f8e9e8}.main-nav .nav-link::after{background:#D69A18} .top-strip{background:linear-gradient(90deg,#4A1018,#7A1F2B 48%,#4A1018)} .site-header{background:rgba(255,250,240,.96);border-color:rgba(122,31,43,.13)}.site-header.is-scrolled{box-shadow:0 12px 40px rgba(74,16,24,.13)} .brand-logo .brand-mark{border-color:#D69A18;background:radial-gradient(circle at 35% 25%,#fff3c5,#e8bc55 48%,#7A1F2B 55%,#4A1018);box-shadow:0 7px 22px rgba(74,16,24,.23),inset 0 0 0 3px rgba(255,255,255,.34)} .brand-logo .brand-text,.search-inline button{color:#7A1F2B}.search-inline button{background:#7A1F2B;color:#fff}.search-inline button:hover{background:#9A2938} .icon-btn{border-color:#ead6d4;box-shadow:0 5px 16px rgba(74,16,24,.08)}.header-actions .icon-btn{color:#7A1F2B}.header-actions .icon-btn:hover{background:#9A2938} .mobile-menu-trigger{border-color:#e5cecc;background:#faeeec}.mobile-menu-trigger span{background:#7A1F2B}.mobile-quick-nav{border-color:#ead8d5;background:#fff5ef}.mobile-quick-nav a{color:#7A1F2B;border-color:#ead8d5}.mobile-quick-nav i{color:#D69A18}.offcanvas-mobile-menu{background:linear-gradient(180deg,#fffdf8,#faece9)}.mobile-menu-welcome{background:linear-gradient(135deg,#7A1F2B,#4A1018)}.mobile-nav-list .nav-link{border-color:#ecd9d6;color:#4A1018}.mobile-nav-list .nav-link.active{background:#7A1F2B} .offer-banner{background:linear-gradient(125deg,#4A1018 0%,#7A1F2B 72%,#D69A18 150%);box-shadow:0 28px 65px rgba(74,16,24,.22)} .site-footer{background:linear-gradient(145deg,#350b11,#5c1621 55%,#2b080d)} .float-actions .float-action span{background:#4A1018}.float-actions .btn-call{background:#7A1F2B}.enquiry-modal-head{background:linear-gradient(120deg,#4A1018,#7A1F2B)} .trust-strip{background:linear-gradient(90deg,#f2dfc0,#fff9e7 48%,#f2dfc0);border-color:#e5c98d}#site-footer>.bg-beige{background:linear-gradient(135deg,#fffaf0,#f6e8cb)!important;border-color:rgba(122,31,43,.12)} .page-banner::before{background:linear-gradient(120deg,rgba(74,16,24,.94),rgba(122,31,43,.79))} .contact-info-card strong,.home-contact-head h2,.map-badge strong{color:#7A1F2B}.contact-info-card{border-color:rgba(122,31,43,.11);box-shadow:0 12px 35px rgba(74,16,24,.075)}.contact-info-card:hover{box-shadow:0 22px 42px rgba(74,16,24,.14)}.contact-phone{--card-color:#7A1F2B}.contact-email{--card-color:#D69A18} .map-badge>i{background:#7A1F2B;color:#E8BC55}.visit-card{background:linear-gradient(155deg,#7A1F2B,#4A1018)}.visit-enquiry-btn:hover{color:#7A1F2B} .build-box-showcase{border-color:rgba(122,31,43,.11);box-shadow:0 24px 60px rgba(74,16,24,.1)}.build-box-showcase .build-box-item{border-color:#ead9d6;box-shadow:0 10px 28px rgba(74,16,24,.07)}.build-box-showcase .build-box-item:hover{border-color:#D69A18;box-shadow:0 24px 42px rgba(74,16,24,.16)}.build-box-item.is-selected{border-color:#D69A18;box-shadow:0 0 0 3px rgba(214,154,24,.13),0 18px 38px rgba(74,16,24,.13)}.build-box-item.is-selected .build-check{background:#7A1F2B}.build-box-meta strong{color:#7A1F2B}.build-box-meta>span,.build-box-footer span i{color:#D69A18} @media(max-width:991.98px){.hero-slide .col-lg-6{background:linear-gradient(135deg,rgba(74,16,24,.93),rgba(122,31,43,.62))}} /* Premium unified brand identity */ .brand-logo{gap:12px;isolation:isolate} .brand-logo .brand-mark{width:62px;height:62px;flex:0 0 62px;padding:0;border:0!important;background:transparent!important;border-radius:50%;box-shadow:none!important;color:transparent;overflow:visible} .brand-logo .brand-mark::after{inset:2px;border-color:rgba(214,154,24,.3);animation:logoAura 3.2s ease-in-out infinite} .brand-logo .brand-mark img{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(74,16,24,.18));transition:transform .5s cubic-bezier(.22,1,.36,1),filter .4s} .brand-logo:hover .brand-mark img{transform:rotate(-4deg) scale(1.06);filter:drop-shadow(0 9px 12px rgba(74,16,24,.25))} .brand-logo .brand-text{position:relative;font-family:'Cormorant Garamond','Playfair Display',Georgia,serif;font-size:1.62rem;font-weight:700;line-height:.92;letter-spacing:-.45px;color:#7A1F2B} .brand-logo .brand-text::after{content:"";position:absolute;left:0;bottom:-7px;width:38px;height:1px;background:linear-gradient(90deg,#D69A18,transparent)} .brand-logo .brand-text small{margin-top:7px;font-family:var(--font-body);font-size:.53rem;font-weight:700;line-height:1;letter-spacing:2.15px;color:#B47B16} @keyframes logoAura{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.08);opacity:.12}} .site-footer .brand-logo .brand-mark{width:72px;height:72px;flex-basis:72px}.site-footer .brand-logo .brand-text{font-size:1.7rem!important;color:#FFF9EA!important}.site-footer .brand-logo .brand-text small{color:#E8BC55}.site-footer .brand-logo .brand-text::after{background:linear-gradient(90deg,#E8BC55,transparent);width:52px} @media(max-width:1199.98px){.header-shell .brand-logo .brand-mark{width:56px;height:56px;flex-basis:56px}.header-shell .brand-logo .brand-text{font-size:1.42rem}} @media(max-width:575.98px){.brand-logo{gap:8px}.header-shell .brand-logo .brand-mark,.offcanvas-mobile-menu .brand-logo .brand-mark{width:45px;height:45px;flex-basis:45px}.header-shell .brand-logo .brand-text,.offcanvas-mobile-menu .brand-logo .brand-text{font-size:1.08rem}.brand-logo .brand-text small{font-size:.43rem;letter-spacing:1.25px}.brand-logo .brand-text::after{bottom:-5px;width:28px}.site-footer .brand-logo .brand-mark{width:62px;height:62px;flex-basis:62px}} @media(prefers-reduced-motion:reduce){.brand-logo .brand-mark::after{animation:none}} /* Structured icon navigation + corrected mega menu */ @media(min-width:992px){ .header-shell .main-nav{position:relative;padding-top:10px;padding-bottom:2px;overflow:visible} .header-shell .header-nav-list{justify-content:center!important;gap:3px!important} .header-nav-list>li{position:relative;flex:0 0 auto} .header-nav-list>.mega-parent{position:static} .main-nav .nav-link{display:flex;align-items:center;gap:7px;min-height:43px;padding:.62rem .72rem!important;border:1px solid transparent;border-radius:11px;font-size:.75rem!important;font-weight:600;line-height:1;white-space:nowrap;color:#43282c;transition:color .25s,background .25s,transform .25s,border-color .25s,box-shadow .25s} .main-nav .nav-link .nav-icon{width:17px;color:#D69A18;font-size:.76rem;text-align:center;transition:transform .3s,color .25s} .main-nav .nav-link::after{display:none} .main-nav .nav-link:hover{color:#7A1F2B;background:#fff6ed;border-color:#efd9c4;transform:translateY(-2px)} .main-nav .nav-link:hover .nav-icon{color:#9A2938;transform:translateY(-2px) rotate(-5deg)} .main-nav .nav-link.active{color:#fff!important;background:linear-gradient(135deg,#7A1F2B,#9A2938)!important;border-color:#7A1F2B;box-shadow:0 8px 20px rgba(122,31,43,.19)} .main-nav .nav-link.active .nav-icon{color:#F1C75B} .main-nav .dropdown-toggle::after{display:inline-block!important;margin-left:1px;border-top:.3em solid;border-right:.3em solid transparent;border-left:.3em solid transparent;color:#D69A18;transition:transform .25s} .main-nav .dropdown-toggle.show::after{transform:rotate(180deg)} .main-nav .dropdown-menu{padding:9px;border:1px solid #ead8d5;border-radius:14px;background:rgba(255,253,248,.98);box-shadow:0 24px 60px rgba(74,16,24,.18);backdrop-filter:blur(16px)} .main-nav .dropdown-menu.show{animation:navPanelIn .28s cubic-bezier(.22,1,.36,1)} .main-nav .dropdown-menu:not(.mega-menu){min-width:230px;margin-top:8px!important} .main-nav .dropdown-menu:not(.mega-menu) .dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;font-size:.78rem} .main-nav .dropdown-menu:not(.mega-menu) .dropdown-item i{width:22px;color:#D69A18;text-align:center} .main-nav .mega-menu{position:absolute!important;left:50%!important;right:auto!important;top:calc(100% + 3px)!important;transform:translateX(-50%)!important;width:min(960px,calc(100vw - 48px));min-width:760px;margin:0!important;padding:22px!important;overflow:hidden} .mega-menu::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(#D69A18,#7A1F2B)} .mega-menu .row{position:relative;margin:0;--bs-gutter-x:2rem} .mega-menu .col-3{min-width:0;padding-top:2px} .mega-menu h6{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding-bottom:9px;border-bottom:1px solid #f0e1d5;color:#7A1F2B;font-size:.68rem;letter-spacing:1.15px} .mega-menu h6::before{content:"";width:15px;height:2px;background:#D69A18} .mega-menu a.dropdown-item{display:flex;align-items:center;gap:9px;padding:7px 8px!important;margin:1px 0;border-radius:8px;color:#53383c;font-size:.76rem;line-height:1.35;white-space:normal} .mega-menu a.dropdown-item i{width:20px;flex:0 0 20px;color:#D69A18;text-align:center;font-size:.7rem} .mega-menu a.dropdown-item:hover{padding-left:11px!important;background:#f9ece9;color:#7A1F2B} .mega-menu .col-3:last-child{padding:7px;border-radius:14px;background:#f8eadc} .mega-menu .col-3:last-child img{width:100%;height:135px;object-fit:cover;border-radius:10px!important} @keyframes navPanelIn{from{opacity:0;translate:0 -9px}to{opacity:1;translate:0 0}} } @media(min-width:992px) and (max-width:1199.98px){.main-nav .nav-link{gap:5px;padding:.58rem .48rem!important;font-size:.68rem!important}.main-nav .nav-link .nav-icon{font-size:.68rem}.header-shell .header-nav-list{gap:1px!important}.main-nav .mega-menu{min-width:0;width:calc(100vw - 36px)}} .offcanvas-mobile-menu .offcanvas-body{padding:17px 20px 24px}.mobile-nav-list{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}.mobile-nav-list li{min-width:0}.mobile-nav-list .nav-link{display:flex;align-items:center;gap:10px;height:100%;padding:11px!important;border:1px solid #ecdad7!important;border-radius:11px;color:#4A1018;background:rgba(255,255,255,.72);font-size:.74rem}.mobile-nav-list .nav-link>i{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:8px;background:#fae9e5;color:#D69A18;font-size:.72rem}.mobile-nav-list .nav-link>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mobile-nav-list .nav-link::after{display:none}.mobile-nav-list .nav-link:hover{transform:translateY(-2px);border-color:#D69A18!important}.mobile-nav-list .nav-link.active{color:#fff;background:linear-gradient(135deg,#7A1F2B,#9A2938)}.mobile-nav-list .nav-link.active>i{background:rgba(255,255,255,.14);color:#F1C75B} @media(max-width:380px){.mobile-nav-list{grid-template-columns:1fr}.mobile-nav-list .nav-link{font-size:.78rem}} @media(prefers-reduced-motion:reduce){.main-nav .dropdown-menu.show{animation:none}}