/* =========================================================
   JHALANI ELECTRONICS ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â DARK LUXURY STYLESHEET (v4)
   Palette extracted from the brand crest: charcoal black + gold.
   ========================================================= */
:root{
  --bg:#0c0e11;
  --bg-alt:#15181c;
  --bg-alt2:#1d2126;
  --bg-card:#16191d;
  --border:rgba(255,255,255,0.08);
  --border-strong:rgba(201,162,39,0.4);
  --gold:#c9a227;
  --gold-light:#e8c468;
  --gold-dark:#8a6d1f;
  --gold-soft:rgba(201,162,39,0.12);
  --ink:#eae7de;
  --text-muted:#9a9488;
  --success:#4caf6d;
  --danger:#e0574a;
  --radius-sm:4px;
  --radius:8px;
  --radius-lg:14px;
  --shadow-sm:0 2px 10px rgba(0,0,0,0.35);
  --shadow:0 12px 34px rgba(0,0,0,0.45);
  --shadow-hover:0 20px 46px rgba(0,0,0,0.55);
  --shadow-gold:0 8px 24px rgba(201,162,39,0.25);
  --ease:cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%;}

body{
  font-family:'Inter','Poppins','Segoe UI',Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100%;
  width:100%;
  position:relative;
}

h1,h2,h3,h4,h5,h6{font-family:'Poppins',sans-serif; font-weight:600; color:var(--ink); letter-spacing:-0.01em;}
.font-display{font-family:'Fraunces','Playfair Display',serif; font-weight:600;}

a{text-decoration:none; color:inherit; transition:color .2s var(--ease);}
a:hover{color:var(--gold-light);}

.container-xl{max-width:1280px; margin:0 auto; padding:0 20px;}

::-webkit-scrollbar{width:8px; height:8px;}
::-webkit-scrollbar-track{background:var(--bg-alt);}
::-webkit-scrollbar-thumb{background:var(--gold-dark); border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:var(--gold);}

/* ---------------- SCROLL REVEAL ---------------- */
[data-animate]{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
[data-animate].in-view{opacity:1; transform:translateY(0);}
.stagger > *{transition-delay:calc(var(--i, 0) * 70ms);}

/* ---------------- TOPBAR ---------------- */
.topbar{background:#000; color:#b8ac8a; font-size:12.5px; padding:9px 0; letter-spacing:.2px; border-bottom:1px solid var(--border);}
.topbar a{color:#b8ac8a;}
.topbar a:hover{color:var(--gold-light);}
.topbar .divider{opacity:.3; margin:0 10px;}
.topbar-social{gap:8px; margin-left:10px;}
.topbar-social a{
  width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-size:12px; color:#fff; transition:.2s var(--ease);
}
.topbar-social a.social-fb{background:#1877F2;}
.topbar-social a.social-ig{background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);}
.topbar-social a.social-yt{background:#FF0000;}
.topbar-social a.social-wa{background:#25D366;}
.topbar-social a:hover{transform:translateY(-2px) scale(1.08); filter:brightness(1.1);}

/* ---------------- HEADER ---------------- */
.main-header{background:var(--bg-alt); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:1000;}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:18px 0; gap:32px; flex-wrap:wrap;}

.brand-logo{display:flex; align-items:center; gap:14px; font-weight:700; font-size:22px; color:var(--ink);}
.brand-logo img.brand-logo-img{max-height:64px; max-width:230px; object-fit:contain;}
.brand-logo .logo-badge{
  background:linear-gradient(160deg,#1d2126,#0c0e11); color:var(--gold); width:46px; height:46px; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center; font-family:'Fraunces','Playfair Display',serif; font-size:19px; font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.15);
}
.brand-logo small{display:block; font-size:10.5px; font-weight:400; color:var(--text-muted); letter-spacing:.6px; text-transform:uppercase; margin-top:2px;}
.brand-logo span > span.brand-name{color:var(--gold-light); font-family:'Fraunces','Playfair Display',serif; font-weight:600; font-size:21px;}

.search-box{flex:1; max-width:480px; position:relative;}
.search-box input{
  width:100%; padding:12px 48px 12px 18px; border-radius:2px; border:1px solid var(--border);
  outline:none; font-size:13.5px; background:var(--bg); color:var(--ink); transition:.2s var(--ease);
}
.search-box input::placeholder{color:var(--text-muted);}
.search-box input:focus{border-color:var(--gold);}
.search-box button{
  position:absolute; right:0; top:0; bottom:0; background:transparent; color:var(--gold); border:none; width:44px; cursor:pointer;
}
.search-box button:hover{color:var(--gold-light);}

.header-actions{display:flex; align-items:center; gap:26px;}
.header-action-item{display:flex; align-items:center; gap:8px; position:relative; font-size:13px; color:var(--ink);}
.header-action-item i{font-size:21px; color:var(--gold);}
.header-action-item:hover i{color:var(--gold-light);}
.header-action-item .label{color:var(--text-muted); font-size:11px; display:block;}
.header-action-item .value{font-weight:600; font-size:12.5px; color:var(--ink);}
.cart-badge{
  position:absolute; top:-8px; left:14px; background:var(--gold); color:#0c0e11;
  font-size:10.5px; width:17px; height:17px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700;
}

/* ---------------- NAVBAR ---------------- */
.main-nav{background:#000; border-top:1px solid var(--border);}
.main-nav .nav-inner{display:flex; align-items:center; gap:2px;}
.main-nav a.nav-link{color:#c9c4b8; padding:13px 18px; font-weight:500; font-size:13.5px; letter-spacing:.2px; display:inline-block; border-bottom:2px solid transparent;}
.main-nav a.nav-link:hover, .main-nav a.nav-link.active{color:var(--gold-light); border-bottom-color:var(--gold);}
.main-nav .nav-link.marriage{color:var(--gold); font-weight:600;}

/* ---------------- HERO ---------------- */
.hero-carousel{border:1px solid var(--border); overflow:hidden;}
.hero-carousel-full{
  border:none; border-bottom:1px solid var(--border); margin-top:0;
  width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw;
}
.hero-carousel .carousel-indicators{margin-bottom:20px;}
.hero-carousel .carousel-indicators button{width:26px; height:3px; background:rgba(255,255,255,.25); border:none; opacity:1;}
.hero-carousel .carousel-indicators button.active{background:var(--gold);}
.hero-carousel .carousel-control-prev, .hero-carousel .carousel-control-next{width:56px; opacity:0; transition:.25s;}
.hero-carousel:hover .carousel-control-prev, .hero-carousel:hover .carousel-control-next{opacity:1;}
.hero-carousel .carousel-control-prev-icon, .hero-carousel .carousel-control-next-icon{background-color:rgba(0,0,0,.55); padding:18px; background-size:40%; border:1px solid var(--border-strong);}
.hero-eyebrow{color:var(--gold); font-size:12px; font-weight:600; letter-spacing:3px; text-transform:uppercase;}
.hero-slide{
  display:block;
  width:100%;
  position:relative;
  padding-top:28.57%; /* ~21:6 wide-banner ratio, works in every browser */
  background-color:var(--bg-alt);
  overflow:hidden;
}
.hero-slide img{
  position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; object-fit:cover; display:block;
}
@supports (aspect-ratio: 21/6) {
  .hero-slide{ aspect-ratio:20/8; padding-top:0; height:auto; }
}


.btn-accent{
  background:var(--gold); color:#0c0e11; border:1px solid var(--gold); padding:13px 30px;
  border-radius:2px; font-weight:700; font-size:13.5px; letter-spacing:.3px; display:inline-flex; align-items:center; gap:8px; transition:.25s var(--ease);
}
.btn-accent:hover{background:transparent; color:var(--gold-light); border-color:var(--gold-light);}
.hero-content .btn-accent{background:transparent; border-color:rgba(201,162,39,.6); color:var(--gold-light);}
.hero-content .btn-accent:hover{background:var(--gold); border-color:var(--gold); color:#0c0e11;}
.btn-outline-light2{border:1px solid rgba(255,255,255,.35); color:#fff; padding:12px 26px; border-radius:2px; font-weight:600; font-size:13.5px; transition:.25s var(--ease);}
.btn-outline-light2:hover{background:var(--gold); color:#0c0e11; border-color:var(--gold);}
.btn-primary-custom{background:var(--gold); color:#0c0e11; border:1px solid var(--gold); padding:12px 24px; border-radius:2px; font-weight:700; font-size:13.5px; transition:.25s var(--ease);}
.btn-primary-custom:hover{background:transparent; color:var(--gold-light);}

/* ---------------- SECTION TITLES ---------------- */
.section{padding:64px 0;}
.section-title{text-align:center; margin-bottom:42px;}
.section-title span.eyebrow{color:var(--gold); font-weight:600; letter-spacing:3px; font-size:11.5px; text-transform:uppercase;}
.section-title h2{font-family:'Fraunces','Playfair Display',serif; font-size:32px; font-weight:600; margin-top:10px; color:var(--ink);}
.section-title p{color:var(--text-muted); max-width:560px; margin:12px auto 0; font-size:14.5px;}

/* ---------------- FEATURE STRIP ---------------- */
.feature-strip{background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-sm);}
.feature-item{display:flex; align-items:center; gap:14px; padding:26px 22px; position:relative;}
.feature-item:not(:last-child)::after{content:''; position:absolute; right:0; top:22%; bottom:22%; width:1px; background:var(--border);}
.feature-item i{font-size:26px; color:var(--gold);}
.feature-item h6{margin:0; font-size:13.5px; font-weight:700; color:var(--ink);}
.feature-item p{margin:0; font-size:11.5px; color:var(--text-muted);}

/* ---------------- CATEGORY CIRCLES ---------------- */
.cat-circle{display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center;}
.cat-circle .circle-wrap{
  width:100%;
  aspect-ratio:1/1;
  border-radius: 25px;
  overflow:hidden;
  background:var(--bg-alt2);
  border:1px solid var(--border);
  position:relative;
  transition:.35s var(--ease);
}
.cat-circle:hover .circle-wrap{border-color:var(--gold); box-shadow:var(--shadow-gold);}
.cat-circle:hover .circle-wrap > div{transform:scale(1.08);}
.cat-circle .circle-inner{position:absolute;top:0;left:0;right:0;bottom:0;background-size: contain;background-position:center;transition:transform .5s var(--ease);filter:brightness(0.92);}
.cat-circle h5{font-size:14.5px; font-weight:600; margin:0; color:var(--ink);}

.cat-card{background:var(--bg-card); border:1px solid var(--border); overflow:hidden; transition:.3s var(--ease); display:block; height:100%;}
.cat-card:hover{border-color:var(--gold); box-shadow:var(--shadow-gold);}
.cat-card .cat-img{height:170px; background-size:cover; background-position:center; position:relative;}
.cat-card .cat-img::after{content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,.7));}
.cat-card .cat-body{padding:18px; text-align:center;}
.cat-card .cat-body h5{margin:0 0 4px; font-size:15.5px; color:var(--ink);}
.cat-card .cat-body p{color:var(--text-muted); font-size:12px; margin:0;}
.cat-card .cat-icon{position:absolute; bottom:10px; left:12px; z-index:2; color:#0c0e11; background:var(--gold); width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:17px;}

/* ---------------- PRODUCT CARDS ---------------- */
.product-card{
  background:var(--bg-card); border:1px solid var(--border); overflow:hidden; transition:.3s var(--ease);
  height:100%; display:flex; flex-direction:column; position:relative;
}
.product-card:hover{border-color:var(--gold); box-shadow:var(--shadow-hover); transform:translateY(-4px);}
.product-card .img-wrap{height: 250px;display:flex;align-items:center;justify-content:center;background:var(--bg-alt2);position:relative;overflow:hidden;}
.product-card .img-wrap img{max-height: 100%;max-width: 100%;object-fit: cover;transition:transform .4s var(--ease);}
.product-card:hover .img-wrap img{transform:scale(1.06);}
.badge-tag{position:absolute; top:12px; left:12px; z-index:2; font-size:10.5px; font-weight:700; padding:4px 10px; border-radius:2px; color:#0c0e11; letter-spacing:.4px; text-transform:uppercase;}
.badge-new{background:var(--success); color:#08130d;}
.badge-sale{background:var(--danger); color:#fff;}
.badge-featured{background:var(--gold);}
.product-body{padding:18px; display:flex; flex-direction:column; flex:1;}
.product-body .cat-label{font-size:10.5px; color:var(--gold); text-transform:uppercase; font-weight:700; letter-spacing:.6px;}
.product-body h5{font-size:14.5px; font-weight:600; margin:7px 0; min-height:40px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.product-body h5 a{color:var(--ink);}
.product-body h5 a:hover{color:var(--gold-light);}
.price-row{display:flex; align-items:center; gap:9px; margin:9px 0;}
.price-now{font-size:17px; font-weight:700; color:var(--gold-light);}
.price-old{font-size:12.5px; color:#65605a; text-decoration:line-through;}
.stars{color:var(--gold); font-size:12px;}
.btn-add-cart{
  margin-top:auto; background:transparent; color:var(--gold); border:1px solid var(--gold); padding:10px; border-radius:2px;
  font-weight:600; font-size:12.5px; letter-spacing:.3px; display:flex; align-items:center; justify-content:center; gap:7px; width:100%; transition:.25s var(--ease);
}
.btn-add-cart:hover{background:var(--gold); color:#0c0e11;}

/* ---------------- SPLIT PROMO BANNER ---------------- */
.split-banner{display:flex;align-items:stretch;border:1px solid var(--border);background:var(--bg-card);overflow:hidden;min-height: 310px;}
.split-banner.reverse{flex-direction:row-reverse;}
.split-banner .split-img{flex:1 1 50%;background-size:cover;background-position:center;min-height: 310px;background-color:var(--bg-alt2);}
.split-banner .split-text{flex:1 1 50%; display:flex; flex-direction:column; justify-content:center; padding:48px 56px;}
.split-banner .split-text span.eyebrow{color:var(--gold); font-weight:600; letter-spacing:2.5px; font-size:11px; text-transform:uppercase; margin-bottom:12px; display:block;}
.split-banner .split-text h3{font-family:'Fraunces','Playfair Display',serif; font-size:28px; font-weight:600; margin-bottom:12px; color:var(--ink);}
.split-banner .split-text p{color:var(--text-muted); font-size:14px; margin-bottom:22px;}
.split-banner .split-text .btn-primary-custom{align-self:flex-start;}

.mid-banner{position:relative; overflow:hidden; min-height:220px; background-size:cover; background-position:center; background-color:var(--bg-alt2); display:flex; align-items:center; border:1px solid var(--border);}
.mid-banner-overlay{position:relative; z-index:2; color:#fff; padding:36px 48px; max-width:520px; background:linear-gradient(90deg, rgba(6,7,9,.92) 0%, rgba(6,7,9,.4) 75%, transparent 100%); width:100%; height:100%; display:flex; flex-direction:column; justify-content:center;}
.mid-banner-overlay h3{font-family:'Fraunces','Playfair Display',serif; color:#fff; font-size:24px; margin-bottom:8px;}
.mid-banner-overlay p{opacity:.8; margin-bottom:16px; font-size:13.5px;}
.mid-banner-overlay .btn-accent{align-self:flex-start; padding:10px 24px; font-size:12.5px;}

/* ---------------- WISHLIST HEART ---------------- */
.btn-wishlist{position:absolute; top:12px; right:12px; z-index:3; width:34px; height:34px; border-radius:50%; background:var(--bg-alt2); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-size:15px; transition:.2s var(--ease);}
.btn-wishlist:hover{color:var(--danger); border-color:var(--danger);}
.btn-wishlist.active{color:var(--danger); border-color:var(--danger);}

/* ---------------- MARRIAGE PACKAGE BANNER ---------------- */
.marriage-banner{background:linear-gradient(135deg,#15181c,#0c0e11); border:1px solid var(--border-strong); color:#fff; padding:54px; position:relative;}
.marriage-banner h2{font-family:'Fraunces','Playfair Display',serif; color:#fff; font-size:30px; font-weight:600;}
.marriage-banner p{color:#c9c4b8;}

/* ---------------- FOOTER ---------------- */
footer{background:#000; color:#a39d8f; margin-top:70px; border-top:1px solid var(--border);}
footer .footer-top{padding:60px 0 26px;}
footer h5{color:var(--gold-light); font-size:14.5px; margin-bottom:20px; font-weight:600; letter-spacing:.3px; font-family:'Fraunces','Playfair Display',serif;}
footer ul{list-style:none; padding:0; margin:0;}
footer ul li{margin-bottom:11px;}
footer ul li a{color:#8b8576; font-size:13.5px;}
footer ul li a:hover{color:var(--gold-light);}
footer p{color:#8b8576; font-size:13.5px;}
.footer-bottom{border-top:1px solid var(--border); padding:18px 0; font-size:12.5px; text-align:center; color:#5f594d;}
.social-icons a{width:36px; height:36px; border-radius:50%; border:1px solid var(--border); display:inline-flex; align-items:center; justify-content:center; margin-right:8px; color:var(--gold-light); transition:.2s var(--ease);}
.social-icons a:hover{background:var(--gold); border-color:var(--gold); color:#0c0e11;}

/* ---------------- BREADCRUMB / PAGE HEADER ---------------- */
.page-header{background:linear-gradient(135deg,#15181c,#0c0e11); color:#fff; padding:34px 0; border-bottom:1px solid var(--border);}
.page-header h1{font-family:'Fraunces','Playfair Display',serif; color:#fff; font-size:27px; margin:0; font-weight:600;}
.page-header .breadcrumb-nav a{color:#8b8576;}
.page-header .breadcrumb-nav a:hover{color:var(--gold-light);}
.page-header .breadcrumb-nav span{color:var(--gold-light);}

/* ---------------- FILTERS SIDEBAR ---------------- */
.filter-box{background:var(--bg-card); border:1px solid var(--border); padding:22px; margin-bottom:20px;}
.filter-box h6{font-size:12.5px; text-transform:uppercase; letter-spacing:.8px; margin-bottom:15px; color:var(--gold-light); font-weight:700;}
.filter-box .form-check{margin-bottom:9px; font-size:13.5px; color:var(--ink);}
.filter-box .form-check-input{background-color:var(--bg-alt2); border-color:var(--border);}
.filter-box .form-check-input:checked{background-color:var(--gold); border-color:var(--gold);}
.filter-box a{color:var(--ink);}
.filter-box a:hover{color:var(--gold-light);}
.filter-box .text-primary{color:var(--gold-light) !important;}

/* ---------------- FORMS ---------------- */
.form-card{background:var(--bg-card); border:1px solid var(--border); padding:36px;}
.form-control, .form-select{border-radius:2px; padding:11px 14px; border:1px solid var(--border); font-size:13.5px; background:var(--bg-alt2); color:var(--ink);}
.form-control::placeholder{color:var(--text-muted);}
.form-control:focus, .form-select:focus{border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,39,.12); background:var(--bg-alt2); color:var(--ink);}
.form-select option{background:var(--bg-alt2); color:var(--ink);}
label{font-weight:600; font-size:12.5px; margin-bottom:6px; color:var(--gold-light); text-transform:uppercase; letter-spacing:.3px;}

/* ---------------- CART / CHECKOUT ---------------- */
.cart-table th{font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);font-weight:700;background: #000;border-bottom:1px solid var(--border);}
.cart-table td{vertical-align:middle;padding:15px 8px;background: #000;border-bottom:1px solid var(--border);color:var(--ink);}
.cart-table a.fw-semibold{color:var(--ink);}
.qty-box{display:flex; align-items:center; border:1px solid var(--border); width:106px;}
.qty-box button{width:32px; height:36px; border:none; background:var(--bg-alt2); font-weight:700; color:var(--ink);}
.qty-box button:hover{background:var(--gold); color:#0c0e11;}
.qty-box input{width:42px; border:none; text-align:center; font-weight:600; background:var(--bg-card); color:var(--ink);}

.btn-remove{color:var(--danger); background:none; border:none; font-size:17px;}

.badge-soft{background:var(--gold-soft); color:var(--gold-light); padding:5px 12px; border-radius:2px; font-size:11.5px; font-weight:700;}
.sticky-summary{position:sticky; top:100px;}

.floating-whatsapp{position:fixed; bottom:24px; right:24px; background:#25D366; color:#fff; width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:27px; box-shadow:0 6px 20px rgba(37,211,102,.4); z-index:1500;}
.floating-whatsapp:hover{color:#fff; transform:scale(1.08);}

/* misc bootstrap overrides for dark theme */
.bg-white{background:var(--bg-card) !important;}
.text-dark{color:var(--ink) !important;}
.text-muted{color:var(--text-muted) !important;}
.shadow-sm{box-shadow:var(--shadow-sm) !important;}
.border-bottom{border-color:var(--border) !important;}
.table{color:var(--ink);/* background: #000; */}
.nav-tabs{border-color:var(--border);}
.nav-tabs .nav-link{color:var(--text-muted); border-color:transparent;}
.nav-tabs .nav-link.active{color:var(--gold-light); background:var(--bg-card); border-color:var(--border) var(--border) var(--bg-card);}
.tab-content{background:var(--bg-card); color:var(--ink);}
.modal-content{background:var(--bg-card); color:var(--ink);}
.dropdown-menu{background:var(--bg-alt2); border-color:var(--border);}
.alert{border-radius:2px;}
.pagination .page-link{background:var(--bg-card); border-color:var(--border); color:var(--ink);}
.pagination .page-item.active .page-link{background:var(--gold); border-color:var(--gold); color:#0c0e11;}
.breadcrumb-nav{color:var(--text-muted);}

@media (max-width:991px){
  .main-nav{display:none;}
  .main-nav.show-mobile{display:block;}
  .main-nav.show-mobile .nav-inner{flex-direction:column; align-items:flex-start;}
  .hero-content{padding:0 32px;}
  .hero-content h2{font-size:30px;}
  .split-banner, .split-banner.reverse{flex-direction:column;}
  .split-banner .split-text{padding:36px;}

  /* Category page: filters sidebar mobile pr side-drawer ban jata h, "Filters" button click pr slide-in hota h */
  #filterSidebar{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:85%;
    max-width:340px;
    background:var(--bg);
    z-index:2001;
    overflow-y:auto;
    padding:20px;
    margin:0;
    box-shadow:var(--shadow);
    transform:translateX(-100%);
    transition:transform .3s var(--ease);
    opacity:1; /* data-animate ka default opacity override, drawer khud transform se control hota h */
  }
  #filterSidebar.show{
    transform:translateX(0);
  }
  .filter-backdrop{
    display:none;
    position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:2000;
  }
  .filter-backdrop.show{display:block;}
  body.filter-drawer-open{overflow:hidden;}

  .filter-drawer-header{
    display:flex; align-items:center; justify-content:space-between;
    padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid var(--border);
    font-family:'Fraunces','Playfair Display',serif; font-size:18px; font-weight:600; color:var(--gold-light);
  }
  .filter-close-btn{
    background:transparent; border:none; color:var(--ink); font-size:18px; width:32px; height:32px;
    display:flex; align-items:center; justify-content:center; border-radius:50%;
  }
  .filter-close-btn:hover{background:var(--bg-alt2); color:var(--gold-light);}
}
@media (max-width:576px){
  .brand-logo{font-size:18px;}
  .hero-content h2{font-size:24px;}
}