/* Jaipur Beverage Hub – premium black & gold theme on top of Bootstrap 5 */
/* =====================================================================
   Theme tokens – dark (default) and light. Toggle sets data-theme on <html>.
   ===================================================================== */
:root, [data-theme="dark"] {
  --bg: #101010; --bg-2: #191613; --card: #211C18; --card-2: #251f1a; --bg-deep: #0b0a08;
  --border: #393128; --muted: #B8B0A4; --text: #e9e3d8; --text-2: #d8d1c5; --heading: #ffffff;
  --input-bg: #14110e; --placeholder: #7d756a;
  --header-bg: rgba(16,16,16,.92); --header-solid: rgba(10,9,7,.97); --drawer-a: #1b1611; --drawer-b: #100e0b;
  --ph-a: #2b2218; --ph-b: #14100c;
  --gold: #D5AD62; --gold-2: #B88B3D; --success: #299D57;
  color-scheme: dark;
}
[data-theme="light"] {
  --bg: #faf6ee; --bg-2: #f3ecdd; --card: #ffffff; --card-2: #fcf9f3; --bg-deep: #eee4cf;
  --border: #e2d6bd; --muted: #76694f; --text: #2d251a; --text-2: #4a3e2d; --heading: #1c1610;
  --input-bg: #ffffff; --placeholder: #a2977f;
  --header-bg: rgba(250,246,238,.92); --header-solid: rgba(250,246,238,.97); --drawer-a: #fbf7ee; --drawer-b: #f1e8d4;
  --ph-a: #efe3c8; --ph-b: #e2d2ad;
  --gold: #A97618; --gold-2: #8C5F12; --success: #1f8a4c;
  color-scheme: light;
}
/* Surfaces that stay dark in both themes (cinematic hero, footer, image overlays, badges). */
[data-theme="light"] :is(.hero, .site-footer, .cta-band, .explore-banner, .cat-card, .shop-cover, .float-chip, .hero-art, .badge-verified, .badge-featured, .back-top, .shop-card .thumb .quick) {
  --bg: #101010; --bg-2: #191613; --card: #211C18; --card-2: #251f1a; --bg-deep: #0b0a08;
  --border: #393128; --muted: #B8B0A4; --text: #e9e3d8; --text-2: #d8d1c5; --heading: #ffffff;
  --input-bg: #14110e; --placeholder: #7d756a; --gold: #D5AD62; --gold-2: #B88B3D;
  --bs-body-color: #e9e3d8; --bs-border-color: #393128; --bs-link-color-rgb: 213,173,98;
  color: var(--text);
}
:root {
  --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--border);
  --bs-emphasis-color: var(--heading); --bs-secondary-color: var(--muted); --bs-tertiary-bg: var(--bg-2);
  --bs-link-color: var(--gold); --bs-link-hover-color: #ecca8a; --bs-link-color-rgb: 213,173,98; --bs-link-hover-color-rgb: 236,202,138;
  --bs-primary: var(--gold); --bs-primary-rgb: 213,173,98;
  --bs-body-font-family: 'Inter', system-ui, sans-serif;
  --radius: 14px;
}
[data-theme="light"] { --bs-link-color-rgb: 169,118,24; --bs-link-hover-color-rgb: 140,95,18; --bs-link-hover-color: #8C5F12; }
html { scroll-behavior: smooth; }
body { background: var(--bg); font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,.font-serif { font-family: 'Playfair Display', Georgia, serif; color: var(--heading); letter-spacing: .2px; }
a { text-decoration: none; transition: color .2s; }
.text-gold { color: var(--gold) !important; }
.text-muted, .text-secondary { color: var(--muted) !important; }
::selection { background: var(--gold-2); color: #000; }

/* Buttons */
.btn { border-radius: 10px; font-weight: 600; transition: all .25s; }
.btn-gold { background: linear-gradient(180deg, var(--gold), var(--gold-2)); color: #1a1209; border: 0; box-shadow: 0 6px 18px rgba(184,139,61,.25); }
.btn-gold:hover, .btn-gold:focus { color: #000; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(184,139,61,.4); background: linear-gradient(180deg, #e6c27c, var(--gold)); }
.btn-outline-gold { color: var(--gold); border: 1px solid var(--gold-2); background: transparent; }
.btn-outline-gold:hover { background: var(--gold); color: #1a1209; border-color: var(--gold); }
.btn-dark-soft { background: var(--card); color: var(--heading); border: 1px solid var(--border); }
.btn-dark-soft:hover { border-color: var(--gold-2); color: var(--gold); }

/* Forms */
.form-control, .form-select { background-color: var(--input-bg); border: 1px solid var(--border); color: var(--heading); border-radius: 10px; }
.form-control:focus, .form-select:focus { background-color: var(--input-bg); color: var(--heading); border-color: var(--gold-2); box-shadow: 0 0 0 .2rem rgba(213,173,98,.18); }
.form-control::placeholder { color: var(--placeholder); }
.form-select { --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23D5AD62' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
.form-check-input { background-color: var(--input-bg); border-color: #5a4d3a; }
.form-check-input:checked { background-color: var(--gold-2); border-color: var(--gold); }
.form-label { color: var(--muted); font-size: .85rem; }
.invalid-feedback { display: block; }
.form-control.is-invalid, .form-select.is-invalid { border-color: #dc5b5b; background-image: none; }

/* Header */
.site-header { position: sticky; top: 0; z-index: 1030; background: var(--header-bg); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); }
.site-header .navbar { padding: .55rem 0; }
.brand { display: flex; align-items: center; gap: .65rem; color: var(--gold); }
.brand .brand-mark { font-size: 1.9rem; color: var(--gold); line-height: 1; }
.brand .brand-logo { width: 46px; height: 46px; object-fit: contain; flex: none; filter: drop-shadow(0 2px 8px rgba(213,173,98,.25)); }
.brand .brand-name { font-family: 'Playfair Display', serif; font-weight: 300; font-size: 69px; letter-spacing: .5px; color: var(--gold); line-height: 1.05; display: block; }
.brand small { display: block; font-size: .46rem; letter-spacing: 2.0px; color: var(--muted); text-transform: uppercase; }
.site-header .nav-link { color: var(--text); font-size: .9rem; padding: .5rem .9rem !important; border-radius: 8px; }
.site-header .nav-link:hover { color: var(--gold); }
.site-header .nav-link.active { background: linear-gradient(180deg, var(--gold), var(--gold-2)); color: #1a1209; font-weight: 600; }
.dropdown-menu { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: .5rem; }
.dropdown-item { color: var(--text); border-radius: 8px; font-size: .9rem; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--card); color: var(--gold); }
.city-select { background: var(--bg-2); border: 1px solid var(--border); color: var(--heading); border-radius: 10px; font-size: .88rem; padding: .4rem .8rem; }
.icon-btn { background: transparent; border: 0; color: var(--heading); font-size: 1.2rem; padding: .4rem .6rem; }
.icon-btn:hover { color: var(--gold); }
.navbar-toggler { border-color: var(--border); }
[data-theme="dark"] .navbar-toggler-icon { filter: invert(1); }

/* Hero */
.hero { position: relative; overflow: hidden; padding: 4.5rem 0 4rem; background:
  radial-gradient(900px 400px at 85% 20%, rgba(184,139,61,.28), transparent 60%),
  radial-gradient(600px 300px at 10% 100%, rgba(184,139,61,.12), transparent 60%), linear-gradient(180deg, var(--bg-deep), var(--bg)); border-bottom: 1px solid var(--border); }
.hero .eyebrow { display: flex; align-items: center; gap: .9rem; color: var(--gold); letter-spacing: 3px; font-size: .75rem; text-transform: uppercase; margin-bottom: 1.2rem; }
.hero .eyebrow::before, .hero .eyebrow::after { content: ''; height: 1px; width: 44px; background: var(--gold-2); }
.hero .eyebrow::after { display: none; }
.hero h1 { font-size: clamp(2.3rem, 5.4vw, 4rem); line-height: 1.08; font-weight: 700; }
.hero h1 span { color: var(--gold); }
.hero p.lead { color: var(--muted); max-width: 520px; font-size: 1.05rem; }
.hero-art { position: relative; border-radius: 22px; overflow: hidden; border: 1px solid var(--border); box-shadow: 0 30px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(213,173,98,.12); max-width: 380px; margin-left: auto; }
.hero-art img { width: 100%; display: block; }
.hero-art::after { content: ''; position: absolute; inset: 0; box-shadow: inset 0 0 60px rgba(0,0,0,.5); pointer-events: none; }
.search-pill { display: flex; align-items: center; background: #f6f1e8; border-radius: 999px; padding: .3rem .3rem .3rem 1.1rem; max-width: 560px; border: 1px solid var(--gold-2); position: relative; }
.search-pill i { color: var(--gold-2); }
.search-pill input { border: 0; background: transparent; flex: 1; padding: .6rem .8rem; color: #222; outline: 0; font-size: .95rem; min-width: 0; }
.search-pill .btn { border-radius: 999px; padding: .65rem 1.8rem; }
.suggest-box { position: absolute; top: calc(100% + 8px); left: 0; right: 0; background: var(--bg-2); border: 1px solid var(--border); border-radius: 14px; z-index: 50; overflow: hidden; display: none; box-shadow: 0 18px 40px rgba(0,0,0,.6); }
.suggest-box a { display: block; padding: .65rem 1rem; color: var(--heading); font-size: .9rem; border-bottom: 1px solid var(--border); }
.suggest-box a:last-child { border: 0; }
.suggest-box a:hover { background: var(--card); color: var(--gold); }
.suggest-box small { color: var(--muted); display: block; }

/* Sections */
.section { padding: 2.4rem 0; }
.section-title { display: flex; align-items: center; gap: .9rem; margin-bottom: 1.3rem; }
.section-title::before { content: ''; width: 34px; height: 1px; background: var(--gold-2); }
.section-title h2 { font-size: 1.5rem; margin: 0; }
.section-title .view-all { margin-left: auto; font-size: .82rem; color: var(--gold); white-space: nowrap; }
.page-head { padding: 3rem 0 1.6rem; background: linear-gradient(180deg, var(--bg-deep), var(--bg)); border-bottom: 1px solid var(--border); }
.page-head h1 { font-size: clamp(1.8rem, 4vw, 2.7rem); }
.breadcrumb { --bs-breadcrumb-divider-color: var(--muted); font-size: .82rem; margin-bottom: .6rem; }
.breadcrumb-item.active { color: var(--muted); }

/* Cards */
.card-dark { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: transform .3s, border-color .3s, box-shadow .3s; height: 100%; }
.card-dark:hover { transform: translateY(-5px); border-color: var(--gold-2); box-shadow: 0 18px 38px rgba(0,0,0,.5), 0 0 0 1px rgba(213,173,98,.15); }
.cat-card { position: relative; display: block; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); aspect-ratio: 16/9; background: var(--card); }
.cat-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; opacity: .8; }
.cat-card:hover img { transform: scale(1.07); }
.cat-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,8,6,.92), rgba(10,8,6,.15) 70%); }
.cat-card .cat-body { position: absolute; left: 1rem; right: 1rem; bottom: .9rem; z-index: 2; display: flex; align-items: center; gap: .8rem; }
.cat-icon { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--gold); color: var(--gold); display: grid; place-items: center; font-size: 1.25rem; background: rgba(0,0,0,.45); flex: none; }
.cat-card h3 { font-size: 1.25rem; margin: 0; }
.cat-card small { color: var(--gold); font-size: .78rem; }
.shop-card .thumb { position: relative; aspect-ratio: 16/10; background: var(--input-bg); overflow: hidden; }
.shop-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.shop-card:hover .thumb img { transform: scale(1.06); }
.badge-verified { position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,.72); color: var(--heading); border: 1px solid rgba(41,157,87,.6); border-radius: 999px; font-size: .72rem; padding: .25rem .6rem; }
.badge-verified i { color: var(--success); }
.badge-featured { position: absolute; top: 10px; left: 10px; background: linear-gradient(180deg, var(--gold), var(--gold-2)); color: #1a1209; border-radius: 999px; font-size: .7rem; font-weight: 700; padding: .25rem .6rem; }
.shop-card .body { padding: 1rem; }
.shop-card h3 { font-size: 1.05rem; margin: 0 0 .15rem; font-family: 'Inter', sans-serif; font-weight: 600; }
.shop-card h3 a { color: var(--heading); }
.shop-card h3 a:hover { color: var(--gold); }
.chip { display: inline-block; font-size: .7rem; color: var(--gold); border: 1px solid var(--border); border-radius: 999px; padding: .15rem .6rem; margin: 0 .25rem .25rem 0; background: rgba(213,173,98,.06); }
.rating { color: var(--gold); font-weight: 600; font-size: .85rem; }
.rating small { color: var(--muted); font-weight: 400; }
.rating.none { color: var(--muted); font-weight: 400; font-style: italic; }
.brand-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 1.2rem .8rem; gap: .6rem; color: var(--heading); }
.brand-tile img { height: 56px; width: auto; max-width: 100%; object-fit: contain; filter: grayscale(.2); }
.brand-tile span { font-weight: 600; font-size: .9rem; letter-spacing: .5px; }
.brand-tile small { color: var(--muted); font-size: .72rem; }
.area-tile { display: flex; justify-content: space-between; align-items: center; padding: .85rem 1.1rem; color: var(--heading); }
.area-tile i { color: var(--gold); }

/* Filter sidebar */
.filter-box { background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.2rem; }
.filter-box h5 { font-family: 'Playfair Display', serif; font-size: 1.15rem; display: flex; align-items: center; gap: .5rem; }
.filter-group { border-top: 1px solid var(--border); padding: .9rem 0; }
.filter-group .g-title { font-size: .85rem; font-weight: 600; color: var(--heading); margin-bottom: .55rem; display: flex; gap: .45rem; align-items: center; }
.filter-group .g-title i { color: var(--gold); }
.filter-group .form-check { margin-bottom: .3rem; font-size: .88rem; color: var(--text-2); }
.offcanvas { background: var(--bg-2); color: var(--heading); }
[data-theme="dark"] .btn-close { filter: invert(1); }
.loading { opacity: .45; pointer-events: none; transition: opacity .2s; }

/* Pagination */
.pagination { --bs-pagination-bg: var(--card); --bs-pagination-border-color: var(--border); --bs-pagination-color: var(--heading); --bs-pagination-hover-bg: var(--bg-2); --bs-pagination-hover-color: var(--gold); --bs-pagination-hover-border-color: var(--gold-2); --bs-pagination-active-bg: var(--gold-2); --bs-pagination-active-border-color: var(--gold); --bs-pagination-active-color: #111; --bs-pagination-disabled-bg: var(--bg-2); --bs-pagination-disabled-border-color: var(--border); --bs-pagination-focus-bg: var(--bg-2); --bs-pagination-focus-color: var(--gold); --bs-pagination-focus-box-shadow: none; }

/* Banner strip */
.explore-banner { position: relative; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); min-height: 150px; background: linear-gradient(100deg, rgba(10,8,6,.2), rgba(10,8,6,.94) 55%), url('../img/hero-art.jpg') left center/cover; display: flex; align-items: center; justify-content: flex-end; padding: 1.5rem 2rem; height: 100%; }
.explore-banner h3 { font-size: 1.6rem; }
.brand-strip { background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.1rem 1.4rem; height: 100%; }

/* Shop details */
.shop-cover { position: relative; height: 340px; border-radius: 18px; overflow: hidden; border: 1px solid var(--border); background: var(--input-bg); }
.shop-cover img { width: 100%; height: 100%; object-fit: cover; }
.shop-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,8,6,.85), transparent 55%); }
.shop-logo { width: 96px; height: 96px; border-radius: 18px; border: 2px solid var(--gold-2); background: var(--card); object-fit: cover; margin-top: -48px; position: relative; z-index: 3; box-shadow: 0 10px 25px rgba(0,0,0,.5); }
.info-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.3rem; }
.info-list { list-style: none; padding: 0; margin: 0; }
.info-list li { display: flex; gap: .8rem; padding: .6rem 0; border-bottom: 1px solid var(--border); font-size: .92rem; }
.info-list li:last-child { border: 0; }
.info-list i { color: var(--gold); margin-top: .15rem; }
.hours-table td { padding: .35rem 0; font-size: .9rem; border: 0; background: transparent; color: var(--text-2); }
.hours-table tr.today td { color: var(--gold); font-weight: 600; }
.gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 12px; border: 1px solid var(--border); cursor: zoom-in; transition: transform .3s; }
.gallery img:hover { transform: scale(1.03); }
.star-input { display: inline-flex; flex-direction: row-reverse; gap: .2rem; }
.star-input input { display: none; }
.star-input label { font-size: 1.6rem; color: #4a4036; cursor: pointer; transition: color .15s; }
.star-input input:checked ~ label, .star-input label:hover, .star-input label:hover ~ label { color: var(--gold); }
.review { border-bottom: 1px solid var(--border); padding: 1rem 0; }
.review:last-child { border: 0; }
.legal-note { background: rgba(213,173,98,.07); border: 1px solid var(--border); border-radius: 12px; padding: .8rem 1rem; font-size: .82rem; color: var(--muted); }
.table-dark-lite { --bs-table-bg: transparent; --bs-table-color: var(--text); --bs-table-border-color: var(--border); }
.prose { color: var(--text-2); line-height: 1.8; }
.prose h2, .prose h3 { margin-top: 1.6rem; }

/* Footer */
.site-footer { background: var(--bg-deep); border-top: 1px solid var(--border); margin-top: 3rem; padding-top: 2.5rem; }
.site-footer h6 { font-family: 'Inter', sans-serif; color: var(--heading); font-size: .95rem; margin-bottom: .9rem; }
.site-footer a { color: var(--muted); font-size: .88rem; display: block; padding: .18rem 0; }
.site-footer a:hover { color: var(--gold); }
.site-footer .social a { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--border); border-radius: 50%; margin-right: .4rem; color: var(--gold); }
.footer-bottom { border-top: 1px solid var(--border); margin-top: 2rem; padding: 1rem 0; font-size: .78rem; color: var(--muted); }

/* Age gate */
.age-gate .modal-content { background: linear-gradient(180deg, #f9f3e7, #efe5d0); color: #2a2118; border: 2px solid var(--gold-2); border-radius: 18px; text-align: center; padding: 1rem; }
.age-gate h3 { color: #2a2118; }
.age-gate .badge-age { width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--gold-2); display: inline-grid; place-items: center; font-weight: 700; color: var(--gold-2); font-size: 1.15rem; font-family: 'Playfair Display', serif; }
.age-gate p { color: #5a4d3a; font-size: .9rem; }
.age-denied { position: fixed; inset: 0; background: var(--bg-deep); z-index: 3000; display: none; place-items: center; text-align: center; padding: 2rem; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s, transform .7s; }
.reveal.in { opacity: 1; transform: none; }

@media (max-width: 991px) {
  .hero { padding: 3rem 0 2.5rem; }
  .shop-cover { height: 240px; }
  .explore-banner { justify-content: flex-start; background: linear-gradient(0deg, rgba(10,8,6,.95), rgba(10,8,6,.5)), url('../img/hero-art.jpg') left center/cover; }
}
@media (max-width: 575px) { .section { padding: 1.6rem 0; } .search-pill .btn { padding: .6rem 1.1rem; } }

/* =====================================================================
   Front-end enhancement layer
   ===================================================================== */
:root { --jali: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23D5AD62' stroke-opacity='.07' stroke-width='1'%3E%3Cpath d='M30 2 58 30 30 58 2 30z'/%3E%3Ccircle cx='30' cy='30' r='9'/%3E%3Cpath d='M30 12v36M12 30h36'/%3E%3C/g%3E%3C/svg%3E"); }
.site-header { transition: padding .25s, background .25s, box-shadow .25s; }
.site-header.scrolled { box-shadow: 0 10px 30px rgba(0,0,0,.25); background: var(--header-solid); }
.site-header.scrolled .navbar { padding: .3rem 0; }
.brand .brand-logo { transition: transform .35s; }
.brand:hover .brand-logo { transform: rotate(-4deg) scale(1.06); }

/* Hero – cinematic */
.hero { padding: 5.5rem 0 5rem; background:
  radial-gradient(700px 420px at 82% 30%, rgba(213,173,98,.30), transparent 62%),
  radial-gradient(500px 300px at 5% 95%, rgba(184,139,61,.16), transparent 62%),
  var(--jali), linear-gradient(180deg, #0b0907 0%, #12100c 70%, var(--bg) 100%); }
.hero::before { content: ''; position: absolute; width: 520px; height: 520px; right: -120px; top: -160px; border-radius: 50%; border: 1px solid rgba(213,173,98,.18); box-shadow: 0 0 0 60px rgba(213,173,98,.03), 0 0 0 120px rgba(213,173,98,.02); pointer-events: none; }
.hero h1 span { background: linear-gradient(100deg, #f0d79b, var(--gold) 40%, #a77a2f 70%, #f0d79b); background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 6s linear infinite; }
@keyframes shimmer { to { background-position: -220% center; } }
.hero-art { max-width: 400px; transform: rotate(1.5deg); transition: transform .6s; }
.hero-art:hover { transform: rotate(0) scale(1.02); }
.float-chip { position: absolute; z-index: 5; display: flex; align-items: center; gap: .55rem; background: rgba(16,14,11,.88); backdrop-filter: blur(8px); border: 1px solid var(--gold-2); border-radius: 14px; padding: .6rem .9rem; font-size: .8rem; box-shadow: 0 14px 30px rgba(0,0,0,.5); animation: floaty 5s ease-in-out infinite; }
.float-chip i { color: var(--gold); font-size: 1.2rem; }
.float-chip strong { display: block; color: var(--heading); font-size: .85rem; line-height: 1.1; }
.float-chip small { color: var(--muted); font-size: .7rem; }
.float-chip.c1 { left: -28px; bottom: 56px; } .float-chip.c2 { right: -10px; top: 40px; animation-delay: -2.2s; }
@keyframes floaty { 50% { transform: translateY(-9px); } }
.hero-stats { display: flex; gap: 2.2rem; margin-top: 2.2rem; flex-wrap: wrap; }
.hero-stats .num { font-family: 'Playfair Display', serif; font-size: 1.9rem; font-weight: 700; color: var(--gold); line-height: 1; }
.hero-stats small { color: var(--muted); font-size: .75rem; letter-spacing: .5px; text-transform: uppercase; }
.search-pill { box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 0 0 4px rgba(213,173,98,.12); }

/* Trust band */
.trust-band { background: linear-gradient(180deg, var(--bg-2), var(--input-bg)); border-block: 1px solid var(--border); padding: 1.1rem 0; }
.trust-item { display: flex; align-items: center; gap: .8rem; font-size: .85rem; color: var(--text-2); }
.trust-item i { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--gold-2); color: var(--gold); font-size: 1.1rem; flex: none; background: rgba(213,173,98,.07); }
.trust-item strong { display: block; color: var(--heading); font-size: .88rem; }

/* Section heading ornament */
.section-title h2 { position: relative; }
.section-title::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--border), transparent); order: 2; }
.section-title .view-all { order: 3; margin-left: 0; }
.section-title .view-all:hover { letter-spacing: .3px; }

/* Placeholders that feel designed, not empty */
.ph { position: relative; width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; background:
  var(--jali), radial-gradient(circle at 30% 20%, rgba(213,173,98,.22), transparent 55%), linear-gradient(135deg, var(--ph-a), var(--ph-b)); }
.ph::after { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(213,173,98,.18); border-radius: 10px; pointer-events: none; }
.ph .mono { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 3.2rem; line-height: 1; background: linear-gradient(180deg, #f0d79b, #a77a2f); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: 0 6px 24px rgba(213,173,98,.25); }
.ph .glyph { position: absolute; right: 14px; bottom: 10px; font-size: 1.4rem; color: rgba(213,173,98,.35); }
.cat-ph { position: absolute; inset: 0; display: grid; place-items: center; background: var(--jali), radial-gradient(circle at 70% 20%, var(--c1, rgba(213,173,98,.35)), transparent 60%), linear-gradient(135deg, var(--c2, #2b2218), #120f0b); }
.cat-ph > i { font-size: 4.6rem; color: rgba(255,255,255,.1); transform: translate(18%, -14%) rotate(-12deg); }
.cat-card:nth-child(6n+1) .cat-ph, .col-6:nth-child(6n+1) .cat-ph { --c1: rgba(214,138,40,.45); --c2: #3a2410; }
.col-6:nth-child(6n+2) .cat-ph { --c1: rgba(150,40,60,.45); --c2: #301119; }
.col-6:nth-child(6n+3) .cat-ph { --c1: rgba(230,190,70,.4); --c2: #3a3010; }
.col-6:nth-child(6n+4) .cat-ph { --c1: rgba(170,190,200,.3); --c2: #1c242b; }
.col-6:nth-child(6n+5) .cat-ph { --c1: rgba(190,95,40,.45); --c2: #331a0c; }
.col-6:nth-child(6n) .cat-ph { --c1: rgba(70,130,100,.4); --c2: #12261d; }
.brand-mono { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--gold-2); font-family: 'Playfair Display', serif; font-weight: 700; color: var(--gold); background: radial-gradient(circle at 30% 25%, rgba(213,173,98,.22), transparent 70%); }

/* Cards – richer hover */
.card-dark { background: linear-gradient(180deg, var(--card-2), var(--card)); }
.card-dark:hover { box-shadow: 0 22px 44px rgba(0,0,0,.55), 0 0 0 1px rgba(213,173,98,.25), 0 0 40px rgba(213,173,98,.08); }
.shop-card .thumb::after { content: ''; position: absolute; inset: auto 0 0 0; height: 45%; background: linear-gradient(0deg, rgba(20,16,12,.85), transparent); pointer-events: none; }
.shop-card .thumb .quick { position: absolute; left: 50%; bottom: 12px; transform: translate(-50%, 14px); opacity: 0; transition: all .3s; z-index: 3; white-space: nowrap; font-size: .75rem; padding: .3rem .9rem; border-radius: 999px; background: var(--gold); color: #1a1209; font-weight: 600; }
.shop-card:hover .thumb .quick { opacity: 1; transform: translate(-50%, 0); }
.badge-verified, .badge-featured { z-index: 3; }
.cat-card { transition: transform .35s, border-color .35s, box-shadow .35s; }
.cat-card:hover { transform: translateY(-4px); border-color: var(--gold-2); box-shadow: 0 18px 36px rgba(0,0,0,.5); }
.cat-card img { position: relative; z-index: 0; }
.cat-card .cat-icon { transition: all .3s; } .cat-card:hover .cat-icon { background: var(--gold); color: #1a1209; }

/* How it works */
.steps { position: relative; }
.step { text-align: center; padding: 1.6rem 1.2rem; position: relative; }
.step .n { width: 64px; height: 64px; margin: 0 auto 1rem; border-radius: 50%; display: grid; place-items: center; font-size: 1.6rem; color: var(--gold); border: 1px solid var(--gold-2); background: radial-gradient(circle at 30% 25%, rgba(213,173,98,.22), rgba(213,173,98,.03)); box-shadow: 0 0 0 8px rgba(213,173,98,.05); }
.step h4 { font-size: 1.1rem; font-family: 'Inter', sans-serif; font-weight: 600; }
.step p { color: var(--muted); font-size: .88rem; margin: 0; }
@media (min-width: 768px) { .steps .col-md-4:not(:last-child) .step::after { content: ''; position: absolute; top: 56px; right: -18%; width: 36%; border-top: 1px dashed var(--gold-2); opacity: .45; } }

/* CTA band */
.cta-band { position: relative; border-radius: 22px; overflow: hidden; border: 1px solid var(--gold-2); padding: 2.6rem; background:
  radial-gradient(500px 220px at 90% 0%, rgba(213,173,98,.28), transparent 65%), var(--jali), linear-gradient(120deg, #1d1710, #0f0d0a); }
.cta-band h3 { font-size: clamp(1.4rem, 3vw, 2rem); }

/* Footer polish */
.site-footer { background: var(--jali), var(--bg-deep); position: relative; }
.site-footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-2), transparent); }
.back-top { position: fixed; right: 18px; bottom: 18px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--gold-2); background: rgba(16,14,11,.92); color: var(--gold); display: grid; place-items: center; z-index: 1020; opacity: 0; transform: translateY(14px); pointer-events: none; transition: all .3s; }
.back-top.show { opacity: 1; transform: none; pointer-events: auto; }
.back-top:hover { background: var(--gold); color: #1a1209; }

/* Page head with pattern + shop cover placeholder */
.page-head { background: var(--jali), radial-gradient(600px 200px at 90% 0%, rgba(213,173,98,.14), transparent 70%), linear-gradient(180deg, var(--bg-deep), var(--bg)); }
.shop-cover .ph .mono { font-size: 6rem; }
.reveal { transition-delay: calc(var(--i, 0) * 70ms); }
@media (max-width: 991px) { .hero-stats { gap: 1.4rem; } .float-chip { display: none; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } .reveal { opacity: 1; transform: none; } }

/* =====================================================================
   Motion layer
   ===================================================================== */
@keyframes pageIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes drift { 0% { transform: translate(0,0) scale(1); } 50% { transform: translate(-60px,40px) scale(1.15); } 100% { transform: translate(0,0) scale(1); } }
@keyframes rise { 0% { transform: translateY(20px) scale(.6); opacity: 0; } 15% { opacity: var(--o, .7); } 100% { transform: translateY(-110vh) scale(1); opacity: 0; } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes kenburns { from { transform: scale(1); } to { transform: scale(1.09) translate(-1.5%, -1%); } }
@keyframes pulseRing { 0% { box-shadow: 0 0 0 0 rgba(213,173,98,.45); } 100% { box-shadow: 0 0 0 16px rgba(213,173,98,0); } }
@keyframes shine { to { transform: translateX(260%) skewX(-20deg); } }
@keyframes popIn { 0% { transform: scale(.6); opacity: 0; } 70% { transform: scale(1.06); } 100% { transform: scale(1); opacity: 1; } }

body { animation: pageIn .6s ease both; }
.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 2000; background: linear-gradient(90deg, var(--gold-2), #f3dc9d, var(--gold-2)); box-shadow: 0 0 12px rgba(213,173,98,.7); }

/* Hero entrance + atmosphere */
.hero .col-lg-7 > * { animation: fadeUp .9s cubic-bezier(.2,.7,.2,1) both; }
.hero .col-lg-7 > *:nth-child(1) { animation-delay: .05s; } .hero .col-lg-7 > *:nth-child(2) { animation-delay: .15s; }
.hero .col-lg-7 > *:nth-child(3) { animation-delay: .28s; } .hero .col-lg-7 > *:nth-child(4) { animation-delay: .4s; }
.hero .col-lg-7 > *:nth-child(5) { animation-delay: .52s; } .hero .col-lg-7 > *:nth-child(6) { animation-delay: .64s; }
.hero .hero-art-wrap { animation: popIn 1s .35s cubic-bezier(.2,.8,.2,1) both; }
.hero::after { content: ''; position: absolute; width: 480px; height: 480px; left: -120px; bottom: -200px; border-radius: 50%; background: radial-gradient(circle, rgba(213,173,98,.22), transparent 65%); filter: blur(30px); animation: drift 14s ease-in-out infinite; pointer-events: none; }
.hero-sparks { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.spark { position: absolute; bottom: -20px; border-radius: 50%; background: radial-gradient(circle, #ffe9b0, rgba(213,173,98,0) 70%); animation: rise linear infinite; }
.hero-art-wrap, .parallax { transition: transform .25s ease-out; will-change: transform; }
.float-chip { transition: transform .25s ease-out; }
.search-pill { transition: box-shadow .3s, transform .3s; }
.search-pill:focus-within { transform: translateY(-2px); box-shadow: 0 22px 46px rgba(0,0,0,.5), 0 0 0 4px rgba(213,173,98,.35); }
.eyebrow::before { transform-origin: left; animation: lineGrow 1s .2s both; }
@keyframes lineGrow { from { transform: scaleX(0); } to { transform: none; } }

/* Nav underline */
.site-header .nav-link { position: relative; }
.site-header .nav-link:not(.active):not(.dropdown-toggle)::after { content: ''; position: absolute; left: 50%; bottom: 3px; width: 0; height: 2px; background: var(--gold); border-radius: 2px; transition: all .3s; transform: translateX(-50%); }
.site-header .nav-link:not(.active):not(.dropdown-toggle):hover::after { width: 55%; }

/* Buttons: shine sweep + press */
.btn-gold { position: relative; overflow: hidden; }
.btn-gold::after { content: ''; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); transform: skewX(-20deg); }
.btn-gold:hover::after { animation: shine .9s; }
.btn:active { transform: scale(.97); }
.btn-gold.pulse { animation: pulseRing 2s infinite; }

/* Reveal variants */
.reveal-left { transform: translateX(-34px); } .reveal-right { transform: translateX(34px); } .reveal-zoom { transform: scale(.93); }
.reveal-left.in, .reveal-right.in, .reveal-zoom.in { transform: none; }
.section-title.reveal::after { transform: scaleX(0); transform-origin: left; transition: transform 1.1s .35s ease; }
.section-title.reveal.in::after { transform: none; }

/* Cards: tilt + cursor spotlight */
.card-dark, .cat-card, .brand-tile { position: relative; }
.card-dark::before, .cat-card::before { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transition: opacity .3s; background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(213,173,98,.18), transparent 60%); }
.card-dark:hover::before, .cat-card:hover::before { opacity: 1; }
.cat-card .cat-body { z-index: 3; }
.tilting { transition: transform .08s ease-out, border-color .3s, box-shadow .3s !important; transform-style: preserve-3d; }
.rating i { display: inline-block; transition: transform .4s; } .shop-card:hover .rating i { transform: rotate(72deg) scale(1.2); }

/* Brand marquee */
.marquee { overflow: hidden; border-block: 1px solid var(--border); background: linear-gradient(180deg, var(--input-bg), var(--bg-2)); padding: 1.2rem 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track { display: flex; gap: 3.2rem; width: max-content; animation: marquee 32s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee a { display: flex; align-items: center; gap: .8rem; color: var(--text-2); font-family: 'Playfair Display', serif; font-size: 1.2rem; white-space: nowrap; opacity: .75; transition: all .3s; }
.marquee a:hover { color: var(--gold); opacity: 1; transform: scale(1.06); }
.marquee .brand-mono { width: 38px; height: 38px; font-size: .85rem; } .marquee img { height: 34px; width: auto; }
.marquee .dot { color: var(--gold-2); font-size: .6rem; opacity: .6; align-self: center; }

/* Steps + area tiles + banner */
.step .n { transition: transform .4s, box-shadow .4s; } .step:hover .n { transform: translateY(-6px) rotate(-6deg); box-shadow: 0 0 0 10px rgba(213,173,98,.1), 0 14px 28px rgba(0,0,0,.4); }
.step .n i { transition: transform .4s; } .step:hover .n i { transform: scale(1.18); }
.area-tile { transition: transform .3s, padding .3s; } .area-tile:hover { padding-left: 1.5rem; } .area-tile i { transition: transform .3s; } .area-tile:hover i { transform: scale(1.3) translateY(-2px); }
.explore-banner { background-size: 115%; transition: background-size 1.2s; } .explore-banner:hover { background-size: 130%; }
.cta-band::before { content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -60px; top: -80px; border: 1px solid rgba(213,173,98,.25); animation: pulseRing 3.5s infinite; }
.trust-item i { transition: transform .4s, background .3s; } .trust-item:hover i { transform: rotateY(180deg); background: rgba(213,173,98,.2); }

/* Shop detail */
.shop-cover img { animation: kenburns 20s ease-in-out infinite alternate; }
.shop-logo { animation: popIn .8s .2s both; }
.gallery img { transition: transform .4s, box-shadow .4s, filter .4s; filter: saturate(.9); } .gallery img:hover { filter: none; box-shadow: 0 14px 30px rgba(0,0,0,.5); }
.info-card { transition: border-color .3s, transform .3s; } .info-card:hover { border-color: rgba(213,173,98,.4); }

/* Footer social + links */
.site-footer .social a { transition: all .3s; } .site-footer .social a:hover { background: var(--gold); color: #1a1209; transform: translateY(-3px) rotate(8deg); }
.site-footer a:hover { padding-left: 4px; }
.back-top.show { animation: pulseRing 2.6s infinite; }

/* =====================================================================
   Select2 – dark / gold theme
   ===================================================================== */
.select2-container { font-size: .9rem; max-width: 100%; }
.d-flex > .select2-container { flex: 0 1 auto; width: auto !important; min-width: 150px; }
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple { background: var(--input-bg); border: 1px solid var(--border); border-radius: 10px; color: var(--heading); transition: border-color .2s, box-shadow .2s; }
.select2-container--default .select2-selection--single { height: calc(2.25rem + 2px); display: flex; align-items: center; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--heading); line-height: 1.5; padding: 0 2rem 0 .75rem; width: 100%; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--placeholder); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 100%; top: 0; right: 8px; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--gold) transparent transparent; }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent var(--gold); }
.select2-selection.sel-sm { height: calc(1.5em + .5rem + 2px) !important; font-size: .875rem; border-radius: 8px; }
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple { border-color: var(--gold-2); box-shadow: 0 0 0 .2rem rgba(213,173,98,.18); }
.select2-container--default.select2-container--disabled .select2-selection--single { opacity: .6; }
.is-invalid + .select2-container .select2-selection { border-color: #dc5b5b !important; }

.select2-container--default .select2-selection--multiple { min-height: calc(2.25rem + 2px); padding: 2px 6px; }
.select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 0; }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background: rgba(213,173,98,.12); border: 1px solid var(--gold-2); color: var(--gold); border-radius: 999px; padding: 1px 10px 1px 4px; margin: 4px 5px 0 0; font-size: .8rem; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: var(--gold); border: 0; background: transparent; margin-right: 4px; font-weight: 700; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: var(--heading); background: transparent; }
.select2-container--default .select2-search--inline .select2-search__field { color: var(--heading); margin-top: 6px; }
.select2-container--default .select2-search--inline .select2-search__field::placeholder { color: var(--placeholder); }

.select2-dropdown { background: var(--bg-2); border: 1px solid var(--gold-2); border-radius: 12px; overflow: hidden; box-shadow: 0 18px 40px rgba(0,0,0,.65); z-index: 2100; animation: fadeUp .18s ease both; }
.select2-container--open .select2-dropdown--below { margin-top: 4px; } .select2-container--open .select2-dropdown--above { margin-bottom: 4px; }
.select2-container--default .select2-search--dropdown { padding: .5rem; }
.select2-container--default .select2-search--dropdown .select2-search__field { background: var(--input-bg); border: 1px solid var(--border); color: var(--heading); border-radius: 8px; padding: .4rem .7rem; outline: 0; }
.select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--gold-2); }
.select2-results__option { color: var(--text); padding: .5rem .85rem; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: rgba(213,173,98,.18); color: var(--gold); }
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option--selected { background: var(--card); color: var(--gold); font-weight: 600; }
.select2-container--default .select2-results__option--disabled, .select2-container--default .select2-results__option[aria-disabled=true] { color: var(--placeholder); }
.select2-results__message { color: var(--muted); }
.select2-results > .select2-results__options { max-height: 260px; }

/* header city picker + hero filters */
.site-header .select2-container { min-width: 150px; }
.site-header .select2-container--default .select2-selection--single { background: var(--bg-2); height: 38px; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--muted); }

/* Form polish: file inputs + switch knobs */
.form-control[type="file"]::file-selector-button { background: linear-gradient(180deg, var(--gold), var(--gold-2)); color: #1a1209; border: 0; font-weight: 600; margin-right: .75rem; padding: .45rem .9rem; border-radius: 8px 0 0 8px; }
.form-control[type="file"]:hover:not(:disabled):not([readonly])::file-selector-button { background: #e6c27c; }
.form-control[type="file"] { padding: 0 .75rem 0 0; color: var(--muted); line-height: 2.1; overflow: hidden; }
.form-switch .form-check-input:not(:checked) { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23B8B0A4'/%3e%3c/svg%3e"); background-color: var(--input-bg); }
.form-switch .form-check-input:checked { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%231a1209'/%3e%3c/svg%3e"); background-color: var(--gold-2); border-color: var(--gold); }
.sidebar .brand .brand-name { font-size: .86rem; white-space: nowrap; letter-spacing: .2px; }
.sidebar .brand .brand-logo { width: 44px; height: 44px; }

/* Rich-text content on static pages */
.prose { font-size: 1rem; } .prose p { margin-bottom: 1.05rem; } .prose a { text-decoration: underline; text-underline-offset: 3px; }
.prose ul, .prose ol { padding-left: 1.4rem; margin-bottom: 1.1rem; } .prose li { margin-bottom: .35rem; } .prose li::marker { color: var(--gold-2); }
.prose h2 { font-size: 1.6rem; } .prose h3 { font-size: 1.3rem; } .prose h4 { font-size: 1.1rem; }
.prose blockquote { border-left: 3px solid var(--gold-2); background: rgba(213,173,98,.06); padding: .9rem 1.2rem; border-radius: 0 12px 12px 0; color: var(--muted); margin: 1.3rem 0; }
.prose hr { border-color: var(--border); opacity: 1; margin: 1.8rem 0; }
.prose table { width: 100%; border-collapse: collapse; margin: 1.2rem 0; } .prose th, .prose td { border: 1px solid var(--border); padding: .55rem .8rem; } .prose th { background: var(--bg-2); color: var(--heading); }
.prose img { max-width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--border); }

/* Mobile navigation drawer (slides in from the side) */
@keyframes slideInRight { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
@media (max-width: 991.98px) {
  .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--header-solid); } /* backdrop-filter would trap the fixed drawer inside the header */
  #mainNav.offcanvas { --bs-offcanvas-width: min(86vw, 340px); background: linear-gradient(180deg, var(--drawer-a), var(--drawer-b)); border-left: 1px solid var(--gold-2); color: var(--heading); box-shadow: -20px 0 50px rgba(0,0,0,.6); }
  #mainNav .offcanvas-header { border-bottom: 1px solid var(--border); padding: 1rem 1.2rem; }
  #mainNav .offcanvas-body { padding: 1rem 1.2rem 1.4rem; display: flex; flex-direction: column; }
  #mainNav .navbar-nav { width: 100%; margin: 0 !important; }
  #mainNav .navbar-nav .nav-link { display: flex; align-items: center; gap: .8rem; padding: .9rem .4rem !important; border-bottom: 1px solid var(--border); border-radius: 0; font-size: 1rem; }
  #mainNav .navbar-nav .nav-link i { color: var(--gold-2); font-size: 1.1rem; width: 22px; }
  #mainNav .navbar-nav .nav-link.active { background: transparent; color: var(--gold); font-weight: 600; box-shadow: inset 3px 0 0 var(--gold); padding-left: .9rem !important; }
  #mainNav .navbar-nav .dropdown-toggle::after { margin-left: auto; }
  #mainNav .dropdown-menu { background: rgba(255,255,255,.03); border: 0; border-left: 2px solid var(--gold-2); border-radius: 0; margin: 0 0 .4rem .6rem; }
  #mainNav .nav-tools .select2-container, #mainNav .nav-tools .city-select { width: 100% !important; }
  #mainNav.show .navbar-nav > li { animation: slideInRight .45s cubic-bezier(.2,.7,.2,1) both; }
  #mainNav.show .navbar-nav > li:nth-child(2) { animation-delay: .05s; } #mainNav.show .navbar-nav > li:nth-child(3) { animation-delay: .1s; }
  #mainNav.show .navbar-nav > li:nth-child(4) { animation-delay: .15s; } #mainNav.show .navbar-nav > li:nth-child(5) { animation-delay: .2s; }
  #mainNav.show .navbar-nav > li:nth-child(6) { animation-delay: .25s; } #mainNav.show .navbar-nav > li:nth-child(7) { animation-delay: .3s; }
  .offcanvas-backdrop.show { opacity: .7; backdrop-filter: blur(3px); }
}

/* Off-screen start positions of reveal animations must never widen the page */
html, body { max-width: 100%; }
body { overflow-x: clip; }
main { overflow-x: clip; }

/* Nested categories */
.cat-card .cat-sub { font-size: .7rem; color: var(--muted); margin-top: 2px; max-width: 210px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dropdown-item.nav-sub { padding-left: 1.6rem; font-size: .84rem; color: var(--muted); position: relative; }
.dropdown-item.nav-sub::before { content: '›'; position: absolute; left: .85rem; color: var(--gold-2); }


/* Day / night toggle */
.theme-toggle { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); background: var(--bg-2); color: var(--gold); display: inline-grid; place-items: center; overflow: hidden; padding: 0; transition: border-color .3s, transform .3s, background .3s; }
.theme-toggle:hover { border-color: var(--gold-2); transform: rotate(18deg); }
.theme-toggle i { position: absolute; font-size: 1.05rem; transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .3s; }
[data-theme="dark"] .theme-toggle .bi-moon-stars-fill { transform: translateY(120%) rotate(90deg); opacity: 0; }
[data-theme="light"] .theme-toggle .bi-sun-fill { transform: translateY(-120%) rotate(-90deg); opacity: 0; }
html.theme-anim, html.theme-anim *, html.theme-anim *::before, html.theme-anim *::after { transition: background-color .35s, color .35s, border-color .35s, box-shadow .35s !important; }

/* Light-mode refinements */
[data-theme="light"] .card-dark { box-shadow: 0 4px 16px rgba(120,90,30,.08); }
[data-theme="light"] .card-dark:hover { box-shadow: 0 18px 38px rgba(120,90,30,.18), 0 0 0 1px rgba(169,118,24,.3); }
[data-theme="light"] .filter-box, [data-theme="light"] .info-card, [data-theme="light"] .brand-strip { box-shadow: 0 2px 10px rgba(120,90,30,.06); }
[data-theme="light"] .page-head { background: var(--jali), radial-gradient(600px 200px at 90% 0%, rgba(169,118,24,.12), transparent 70%), linear-gradient(180deg, #f1e7d1, var(--bg)); }
[data-theme="light"] .trust-band, [data-theme="light"] .marquee { background: linear-gradient(180deg, var(--bg-2), var(--card)); }
[data-theme="light"] .site-header { box-shadow: 0 1px 0 var(--border); }
[data-theme="light"] .search-pill { box-shadow: 0 14px 34px rgba(0,0,0,.35), 0 0 0 4px rgba(213,173,98,.18); }
[data-theme="light"] .select2-dropdown, [data-theme="light"] .dropdown-menu { box-shadow: 0 16px 36px rgba(120,90,30,.2); }
[data-theme="light"] .btn-gold { color: #fff; text-shadow: 0 1px 0 rgba(0,0,0,.15); }
[data-theme="light"] .btn-gold:hover, [data-theme="light"] .btn-gold:focus { color: #fff; }
[data-theme="light"] .hero .btn-gold, [data-theme="light"] .cta-band .btn-gold, [data-theme="light"] .site-footer .btn-gold { color: #1a1209; text-shadow: none; }
[data-theme="light"] .btn-outline-gold { color: var(--gold-2); border-color: var(--gold); } [data-theme="light"] .btn-outline-gold:hover { color: #fff; background: var(--gold); }
[data-theme="light"] .hero .btn-outline-gold { color: #D5AD62; border-color: #B88B3D; }
[data-theme="light"] .chip { background: rgba(169,118,24,.08); }
[data-theme="light"] .cat-card .cat-sub { color: #B8B0A4; }
[data-theme="light"] #mainNav .dropdown-menu { background: rgba(0,0,0,.03); }
[data-theme="light"] .brand .brand-name { color: var(--gold-2); }
[data-theme="light"] .site-footer .brand .brand-name { color: #D5AD62; }
[data-theme="light"] .scroll-progress { box-shadow: none; }
[data-theme="light"] .shop-card .thumb::after { background: linear-gradient(0deg, rgba(90,60,10,.28), transparent); }

/* Price list + brand pages */
.price-table thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .8px; color: var(--muted); font-weight: 600; border-bottom: 1px solid var(--border); white-space: nowrap; padding: .85rem 1rem; background: var(--bg-2); }
.price-table td { padding: .75rem 1rem; border-color: var(--border); } .price-table tbody tr { transition: background .2s; } .price-table tbody tr:hover { background: rgba(213,173,98,.07); }
.price-tag { display: inline-block; font-weight: 700; color: var(--gold); background: rgba(213,173,98,.1); border: 1px solid var(--gold-2); border-radius: 999px; padding: .15rem .7rem; white-space: nowrap; }
.thumb-xs { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; border: 1px solid var(--border); background: var(--input-bg); flex: none; }
.brand-group { margin-bottom: 2.4rem; }
.brand-group-head { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; align-items: center; padding-bottom: .8rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); position: relative; }
.brand-group-head::after { content: ''; position: absolute; left: 0; bottom: -1px; width: 70px; height: 2px; background: linear-gradient(90deg, var(--gold), transparent); }
.brand-group-head h2 a { color: var(--heading); } .brand-group-head h2 a:hover { color: var(--gold); }
.brand-tile small { line-height: 1.3; }
.brand-hero-logo { width: 96px; height: 96px; border-radius: 20px; display: grid; place-items: center; background: var(--card); border: 1px solid var(--gold-2); flex: none; box-shadow: 0 10px 26px rgba(0,0,0,.25); overflow: hidden; }
.brand-hero-logo img { max-width: 78%; max-height: 78%; object-fit: contain; } .brand-hero-logo .brand-mono { width: 64px; height: 64px; font-size: 1.4rem; }
.brand-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 1rem; }
.brand-stats > div { text-align: center; } .brand-stats strong { display: block; font-family: 'Playfair Display', serif; font-size: 1.25rem; color: var(--gold); line-height: 1.2; } .brand-stats small { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .6px; }
.btn-dark-soft.btn-sm { padding: .3rem .8rem; }
@media (min-width: 992px) and (max-width: 1199.98px) { .site-header .nav-link { font-size: .82rem; padding: .45rem .55rem !important; } .site-header .brand small { display: none; } }
@media (min-width: 992px) { .row-cols-lg-8 > * { flex: 0 0 auto; width: 12.5%; } }

/* Keep the 8-item menu on one line */
@media (min-width: 992px) {
  .site-header .nav-link { white-space: nowrap; }
  .site-header .navbar-nav { flex-wrap: nowrap; }
}
@media (min-width: 1200px) {
  .site-header .nav-link { padding: .5rem .6rem !important; }
  .site-header .nav-tools { gap: .4rem !important; }
  .site-header .select2-container, .site-header .city-select { min-width: 128px; }
  .site-header .brand .brand-name { font-size: 1.12rem; }
}
@media (min-width: 992px) and (max-width: 1199.98px) { .site-header .nav-link { padding: .45rem .5rem !important; } .site-header .select2-container, .site-header .city-select { min-width: 110px; } .site-header .brand .brand-name { font-size: 1rem; } }
@media (min-width: 992px) and (max-width: 1199.98px) { .site-header .navbar > .container > .brand > span { display: none; } }