/* ==========================================================================
   BOSS SWEETS — "LUXE" DIRECTION
   Modern luxury confectioner: a dark cocoa header and hero, warm ivory pages,
   alternating dark feature bands, a high-contrast Bodoni serif with italic
   gold accents, a clean Source Sans body, product tiles without card chrome,
   pill buttons with an arrow. Loaded after elegant.css and builds on it.
   ========================================================================== */
:root {
  --lx-dark: #140A0B;        /* header, feature bands, footer */
  --lx-dark-2: #1E1113;      /* panels on dark */
  --lx-ivory: #FAF7F2;       /* page */
  --lx-sand: #F2EBE1;        /* quiet alternate band */
  --lx-text: #1C1715;        /* headings + body on ivory */
  --lx-muted: #6F6660;
  --lx-gold: #C8AB70;        /* accents on dark */
  --lx-gold-ink: #94743A;    /* gold that reads on ivory */
  --lx-cream: #F4EEE6;       /* text on dark */
  --lx-red: #EC1C24;         /* logo + main call to action */
  --lx-serif: 'Bodoni Moda', 'Tiro Bangla', Georgia, serif;
  --lx-sans: 'Source Sans 3', 'Hind Siliguri', system-ui, sans-serif;

  /* hand the elegance layer the new palette and type */
  --e-ivory: var(--lx-ivory);
  --e-paper: #FFFFFF;
  --e-ink: var(--lx-text);
  --e-muted: var(--lx-muted);
  --e-maroon: var(--lx-text);
  --e-maroon-deep: var(--lx-dark);
  --e-gold: var(--lx-gold-ink);
  --e-gold-line: rgba(148, 116, 58, .35);
  --e-line: rgba(28, 23, 21, .10);
  --e-shadow: none;
  --f-display: var(--lx-serif);
  --f-body: var(--lx-sans);
  --ticker-height: 0px;
}

/* the top ticker moves into the hero strip */
.royal-announcement-bar { display: none !important; }

h1, h2, h3, .section-title, .menu-page-title, .story-page-title, .instagram-title, .flanking-mobile-title, .insta-center-title {
  font-family: var(--lx-serif) !important; font-weight: 400 !important; letter-spacing: -.01em !important; color: var(--lx-text);
}
h1 em, h2 em, .section-title em, .instagram-title em, .flanking-mobile-title em { font-style: italic; color: var(--lx-gold-ink) !important; -webkit-text-fill-color: currentColor !important; }
.section-eyebrow { letter-spacing: .32em !important; font-size: .7rem !important; font-weight: 600 !important; color: var(--lx-gold-ink) !important; }
.section-eyebrow::before, .section-eyebrow::after { display: none !important; }
.section-title, .instagram-title, .flanking-mobile-title { font-size: clamp(2.1rem, 4.4vw, 3.4rem) !important; line-height: 1.08 !important; }
.section-header, .instagram-header { position: relative; }
.section-header::after, .instagram-header::after, .flanking-mobile-header::after {
  content: ''; display: block; width: 150px; height: 1px; margin: 26px auto 0;
  background: linear-gradient(90deg, transparent, var(--lx-gold), transparent);
}
.section-description, .instagram-subtitle, .flanking-mobile-sub { font: 400 1.02rem/1.7 var(--lx-sans) !important; color: var(--lx-muted) !important; }
.royal-sector-divider { display: none !important; }

/* ---- buttons: pills, small caps, arrow chip ------------------------------ */
.btn-primary-luxury, .btn-secondary-luxury, .hero-btn {
  font: 600 .72rem/1 var(--lx-sans) !important; letter-spacing: .16em !important; text-transform: uppercase;
  border-radius: 999px !important; padding: 15px 24px !important;
}
.btn-primary-luxury { background: var(--lx-text) !important; border-color: var(--lx-text) !important; color: var(--lx-cream) !important; }
.btn-secondary-luxury { color: var(--lx-text) !important; border-color: rgba(28, 23, 21, .35) !important; }
.btn-secondary-luxury:hover { background: var(--lx-text) !important; color: var(--lx-cream) !important; }

/* ==========================================================================
   HEADER — dark glass bar
   ========================================================================== */
html body .navbar, html body .navbar:hover, html body .navbar.scrolled {
  top: 0 !important;
  height: 72px !important;
  background: rgba(20, 10, 11, .9) !important;
  border-bottom: 1px solid rgba(200, 171, 112, .16) !important;
}
html body .navbar.scrolled { background: rgba(20, 10, 11, .96) !important; }
html body .navbar .nav-link { color: rgba(244, 238, 230, .78) !important; font: 600 .74rem/1 var(--lx-sans) !important; letter-spacing: .16em !important; }
html body .navbar .nav-link:hover, html body .navbar .nav-link.active { color: var(--lx-cream) !important; }
.nav-link::after { background: var(--lx-gold) !important; }
.nav-hotline-pill, .navbar .menu-item-inquire { border-color: rgba(200, 171, 112, .6) !important; color: var(--lx-cream) !important; font-family: var(--lx-sans) !important; }
.nav-hotline-pill:hover { background: var(--lx-gold) !important; color: var(--lx-dark) !important; border-color: var(--lx-gold) !important; }
.navbar .bs-logo { --logo-h: 34px; box-shadow: none !important; }
.nav-mobile-toggle { border-color: rgba(244, 238, 230, .25) !important; }
.nav-mobile-toggle span { background: var(--lx-cream) !important; }
.mobile-nav-drawer { background: var(--lx-dark) !important; }
.mobile-nav-item { color: var(--lx-cream) !important; border-color: rgba(244, 238, 230, .1) !important; font-family: var(--lx-serif) !important; }
.mobile-nav-close { color: var(--lx-cream) !important; }
.mobile-nav-footer, .mobile-nav-footer * { color: rgba(244, 238, 230, .7) !important; }
/* pages without the full-screen film start below the bar */

/* ==========================================================================
   HERO — the photo film stays; the words sit bottom-left like a cover
   ========================================================================== */
.scroll-prompt-bottom, .mobile-signatures-peek-pill, .scroll-indicator-track { display: none !important; }
.hero-grade {
  background:
    linear-gradient(90deg, rgba(14, 6, 7, .78) 0%, rgba(14, 6, 7, .38) 42%, transparent 70%),
    linear-gradient(0deg, rgba(14, 6, 7, .85) 0%, rgba(14, 6, 7, .2) 34%, transparent 55%),
    linear-gradient(180deg, rgba(14, 6, 7, .5) 0%, transparent 18%) !important;
}
.scrolly-section .canvas-vignette-overlay { display: none !important; }
.hero-title {
  top: auto !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  margin: 0 !important; padding: 0 !important; text-align: left !important; pointer-events: auto !important;
}
.hero-title::before { display: none !important; }
.hero-copyblock { padding: 0 5vw 34px; max-width: 980px; }
.hero-eyebrow { margin: 0 0 18px; font: 600 .7rem/1.4 var(--lx-sans); letter-spacing: .34em; text-transform: uppercase; color: var(--lx-gold); }
.hero-headline { margin: 0; font: 400 clamp(2.6rem, 5.6vw, 4.6rem)/1.04 var(--lx-serif) !important; color: var(--lx-cream) !important; letter-spacing: -.015em !important; }
.hero-headline em { color: var(--lx-gold) !important; }
.hero-bn { margin: 14px 0 0; font: 400 1.35rem/1.3 'Tiro Bangla', var(--lx-serif); color: rgba(244, 238, 230, .85); }
.hero-copy { margin: 14px 0 0; max-width: 46ch; font: 400 1.02rem/1.65 var(--lx-sans); color: rgba(244, 238, 230, .72); }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-btn { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; transition: background-color .2s, color .2s, border-color .2s; }
.hero-btn-primary { background: var(--lx-red); color: #fff; padding: 8px 8px 8px 24px !important; }
.hero-btn-primary:hover { background: #C8121A; }
.hero-btn-arrow { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
.hero-btn-arrow svg { width: 16px; height: 16px; }
.hero-btn-ghost { color: var(--lx-cream); border: 1px solid rgba(244, 238, 230, .45); background: rgba(20, 10, 11, .25); }
.hero-btn-ghost:hover { background: var(--lx-cream); color: var(--lx-dark); }
.hero-strip {
  list-style: none; margin: 0; padding: 14px 5vw; display: flex; gap: 10px 34px; flex-wrap: wrap;
  border-top: 1px solid rgba(200, 171, 112, .22); background: rgba(14, 6, 7, .55);
}
.hero-strip li { font: 600 .66rem/1.4 var(--lx-sans); letter-spacing: .22em; text-transform: uppercase; color: rgba(244, 238, 230, .8); display: flex; align-items: center; gap: 34px; }
.hero-strip li + li::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--lx-gold); margin-left: -20px; margin-right: -14px; }

/* ==========================================================================
   SIGNATURES — product tiles, no card chrome
   ========================================================================== */
.flanking-track-container {
  display: block !important; margin-top: 0 !important; position: relative !important; z-index: 5 !important;
  pointer-events: auto !important; background: var(--lx-ivory) !important; border: 0 !important;
  padding: clamp(64px, 9vw, 120px) 5vw clamp(56px, 7vw, 96px) !important;
}
.flanking-mobile-header { display: block !important; text-align: center; margin: 0 auto 48px !important; max-width: 720px; }
.flanking-mobile-title { margin: 14px 0 12px !important; }
.flanking-cards-shelf {
  display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 26px !important;
  overflow: visible !important; padding: 0 !important; max-width: 1240px; margin: 0 auto;
}
.flanking-column { display: contents !important; }
.flanking-food-card {
  width: auto !important; flex: none !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important;
  display: flex !important; flex-direction: column; text-decoration: none; transform: none !important;
}
.flanking-card-img-wrap { aspect-ratio: 4 / 5; height: auto !important; border-radius: 10px !important; background: var(--lx-sand); }
.flanking-card-img-wrap img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.flanking-food-card:hover .flanking-card-img-wrap img { transform: scale(1.04); }
.flanking-card-details { display: flex; flex-direction: column-reverse; padding: 16px 2px 0 !important; gap: 4px; }
.flanking-card-title { font: 600 1.06rem/1.3 var(--lx-sans) !important; color: var(--lx-text) !important; letter-spacing: 0 !important; margin: 0 !important; }
.flanking-card-title .menu-bangla-name { display: inline !important; font: 400 .98rem/1.3 'Tiro Bangla', serif !important; color: var(--lx-muted) !important; }
.flanking-card-tag { font: 400 .9rem/1.4 var(--lx-sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--lx-muted) !important; }
.sig-all {
  background: var(--lx-dark) !important; border-radius: 10px !important; aspect-ratio: 4 / 5; padding: 28px !important;
  justify-content: flex-end; gap: 10px; color: var(--lx-cream);
}
.sig-all-k { font: 600 .68rem/1 var(--lx-sans); letter-spacing: .3em; text-transform: uppercase; color: var(--lx-gold); }
.sig-all-t { font: 400 1.9rem/1.1 var(--lx-serif); color: var(--lx-cream); }
.sig-all .hero-btn-arrow { background: var(--lx-red); color: #fff; margin-top: 8px; }
.flanking-swipe-hint { display: none !important; }

/* ==========================================================================
   GALLERY — dark feature band
   ========================================================================== */
.slideshow-section { background: var(--lx-dark) !important; padding-block: clamp(72px, 9vw, 120px) !important; }
.slideshow-section::before, .slideshow-section::after { display: none !important; }
.slideshow-section .section-title { color: var(--lx-cream) !important; }
.slideshow-section .section-title em { color: var(--lx-gold) !important; }
.slideshow-section .section-eyebrow { color: var(--lx-gold) !important; }
.slideshow-section .section-description { color: rgba(244, 238, 230, .66) !important; }
.slideshow-section .slideshow-wrapper { background: var(--lx-dark-2) !important; border-color: rgba(200, 171, 112, .18) !important; border-radius: 14px !important; }
.slideshow-section .slideshow-caption .btn-secondary-luxury { border-color: var(--lx-gold) !important; color: var(--lx-gold) !important; }
.slideshow-section .slideshow-dot { background: rgba(244, 238, 230, .25) !important; }
.slideshow-section .slideshow-dot.active { background: var(--lx-gold) !important; }

/* ==========================================================================
   INGREDIENTS — open columns with hairlines instead of boxed cards
   ========================================================================== */
#ingredients { background: var(--lx-ivory) !important; }
#ingredients .ingredient-card { background: transparent !important; border: 0 !important; border-top: 1px solid rgba(148, 116, 58, .4) !important; border-radius: 0 !important; box-shadow: none !important; padding: 26px 4px 0 !important; text-align: left !important; }
#ingredients .ingredient-icon-wrapper { width: 44px !important; height: 44px !important; border-radius: 50% !important; margin: 0 0 18px !important; }
#ingredients .ingredient-name { font: 400 1.7rem/1.15 var(--lx-serif) !important; }

/* reviews */
.press-grid { margin-top: 10px; }
.press-card { background: transparent !important; border: 0 !important; border-left: 1px solid rgba(148, 116, 58, .45) !important; border-radius: 0 !important; box-shadow: none !important; padding: 6px 0 6px 26px !important; text-align: left !important; }
.press-quote { font: italic 400 1.22rem/1.55 var(--lx-serif) !important; color: var(--lx-text) !important; }
.press-publication { color: var(--lx-gold-ink) !important; }
section.editorial-section:has(.press-grid) { background: var(--lx-sand) !important; padding-block: clamp(64px, 8vw, 110px) !important; }

/* instagram */
.instagram-section { background: var(--lx-ivory) !important; }
.insta-post { border-radius: 10px !important; box-shadow: none !important; }

/* ==========================================================================
   INNER PAGES — dark title band, tiles below
   ========================================================================== */
.menu-page-hero, .branches-page-hero, .story-page-hero {
  background: var(--lx-dark) !important; border: 0 !important; padding-top: clamp(56px, 8vw, 96px) !important; padding-bottom: clamp(48px, 6vw, 72px) !important;
}
.menu-page-hero::before, .branches-page-hero::before, .story-page-hero::before, .branches-page-hero::after { display: none !important; }
.menu-page-title, .story-page-title, .branches-page-hero h1, .branches-page-hero h2 { color: var(--lx-cream) !important; font-size: clamp(2.4rem, 5vw, 4rem) !important; }
.menu-page-subtitle, .story-page-subtitle, .branches-page-hero p { color: rgba(244, 238, 230, .7) !important; }
.menu-page-hero .section-eyebrow, .branches-page-hero .section-eyebrow, .story-page-hero .section-eyebrow { color: var(--lx-gold) !important; }
.menu-search-box { background: rgba(244, 238, 230, .06) !important; border-color: rgba(244, 238, 230, .2) !important; }
.menu-search-input { color: var(--lx-cream) !important; font-family: var(--lx-sans) !important; }
.menu-search-input::placeholder { color: rgba(244, 238, 230, .5) !important; }
.menu-search-icon { color: var(--lx-gold) !important; }
.menu-filter-btn, .branch-filter-btn { border-color: rgba(244, 238, 230, .2) !important; color: rgba(244, 238, 230, .82) !important; font-family: var(--lx-sans) !important; font-weight: 600 !important; }
.menu-filter-btn.active, .menu-filter-btn:hover, .branch-filter-btn.active, .branch-filter-btn:hover { background: var(--lx-cream) !important; color: var(--lx-dark) !important; border-color: var(--lx-cream) !important; }
.menu-item-counter, .branch-item-counter, #branchItemCounter { color: rgba(244, 238, 230, .6) !important; }
.story-page-hero .profile-meta-pill, .story-page-hero .story-metric-card { background: transparent !important; border-color: rgba(200, 171, 112, .3) !important; color: var(--lx-cream) !important; }
.story-page-hero .story-metric-number { color: var(--lx-gold) !important; }
.story-page-hero .story-metric-label { color: rgba(244, 238, 230, .65) !important; }
.story-page-hero p, .story-page-hero li { color: rgba(244, 238, 230, .72) !important; }

/* menu tiles */
.menu-item-card { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
.menu-item-thumb-wrap { border-radius: 10px !important; overflow: hidden; }
.menu-item-body { padding: 16px 2px 0 !important; }
.menu-item-category { font-size: .64rem !important; }
.menu-item-title { font: 600 1.1rem/1.3 var(--lx-sans) !important; color: var(--lx-text) !important; }
.menu-item-title .menu-bangla-name { display: inline !important; font: 400 1rem/1.3 'Tiro Bangla', serif !important; }
.menu-item-footer { border-top: 1px solid var(--e-line) !important; }
.menu-item-price { font: 400 1.35rem/1 var(--lx-serif) !important; color: var(--lx-text) !important; }
.menu-item-badge, .branch-badge { background: rgba(20, 10, 11, .72) !important; color: var(--lx-cream) !important; }

/* branch tiles */
.branch-card { background: #FFFFFF !important; border: 1px solid var(--e-line) !important; box-shadow: none !important; border-radius: 12px !important; }
.branch-title { font: 400 1.45rem/1.2 var(--lx-serif) !important; color: var(--lx-text) !important; }
.branch-map-btn { background: var(--lx-text) !important; border-color: var(--lx-text) !important; color: var(--lx-cream) !important; }
.branch-call-btn { border-color: rgba(28, 23, 21, .25) !important; color: var(--lx-text) !important; }

/* story cards */
.official-service-card, .product-cat-card, .client-card, .story-metric-card { box-shadow: none !important; border-radius: 12px !important; }
.official-commitment-card { background: var(--lx-dark) !important; border-radius: 16px !important; }
.official-commitment-card .commitment-slogan-text, .official-commitment-card h2 { color: var(--lx-cream) !important; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer { background: var(--lx-dark) !important; border-top: 0 !important; }
.site-footer .footer-column h4, .site-footer .footer-newsletter h4 { color: var(--lx-gold) !important; letter-spacing: .28em !important; }
.site-footer .btn-primary-luxury { border-color: var(--lx-gold) !important; color: var(--lx-cream) !important; background: transparent !important; }
.site-footer .btn-primary-luxury:hover { background: var(--lx-gold) !important; color: var(--lx-dark) !important; }

/* ==========================================================================
   TABLETS + PHONES
   ========================================================================== */
@media (max-width: 1100px) {
  .flanking-cards-shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .navbar { height: 62px !important; }
  .navbar .bs-logo { --logo-h: 28px; }
  .hero-copyblock { padding: 0 20px 22px; }
  .hero-eyebrow { font-size: .62rem; letter-spacing: .26em; margin-bottom: 14px; }
  .hero-headline { font-size: clamp(2rem, 9vw, 2.6rem) !important; }
  .hero-headline em { text-shadow: 0 2px 18px rgba(0, 0, 0, .55); }
  .hero-grade { background:
      linear-gradient(0deg, rgba(14, 6, 7, .94) 0%, rgba(14, 6, 7, .8) 40%, rgba(14, 6, 7, .2) 66%, transparent 78%),
      linear-gradient(180deg, rgba(14, 6, 7, .45) 0%, transparent 14%) !important; }
  .hero-copy { font-size: .95rem; }
  .hero-ctas { margin-top: 22px; }
  .hero-btn { padding: 13px 18px !important; }
  .hero-btn-primary { padding: 6px 6px 6px 18px !important; }
  .hero-strip { display: none; }
  .hero-title { bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important; } /* clear the bottom tab bar */

  .flanking-track-container { padding: 64px 0 56px !important; }
  .flanking-mobile-header { padding-inline: 20px; margin-bottom: 30px !important; }
  .flanking-cards-shelf {
    display: flex !important; overflow-x: auto !important; scroll-snap-type: x mandatory; gap: 16px !important;
    padding: 0 20px 6px !important; scrollbar-width: none;
  }
  .flanking-cards-shelf::-webkit-scrollbar { display: none; }
  .flanking-food-card { flex: 0 0 68% !important; scroll-snap-align: start; }
  .sig-all { flex: 0 0 68% !important; }

  .press-card { padding-left: 18px !important; }

  .m-tabbar { background: rgba(20, 10, 11, .97) !important; border-top: 1px solid rgba(200, 171, 112, .2) !important; }
  .m-tab { color: rgba(244, 238, 230, .6) !important; }
  .m-tab.is-current { color: var(--lx-gold) !important; }
  .m-tab.is-current::before { background: var(--lx-gold) !important; }
  .m-tab-orb { background: var(--lx-red) !important; border-color: var(--lx-dark) !important; }
  .m-tab-order { color: var(--lx-cream) !important; }
}

/* ---- header: beat the legacy hover rules so links stay readable on dark ---- */
html body .navbar .nav-link, html body .navbar:hover .nav-link, html body .navbar .nav-link:visited {
  color: rgba(244, 238, 230, .78) !important; background: none !important; font-weight: 600 !important;
}
html body .navbar .nav-link:hover, html body .navbar:hover .nav-link:hover, html body .navbar .nav-link.active, html body .navbar:hover .nav-link.active {
  color: var(--lx-cream) !important; background: none !important;
}
html body .navbar .menu-item-inquire.nav-hotline-pill, html body .navbar:hover .menu-item-inquire.nav-hotline-pill {
  background: transparent !important; border: 1px solid rgba(200, 171, 112, .6) !important; box-shadow: none !important; transform: none !important;
}
html body .navbar .menu-item-inquire.nav-hotline-pill span, html body .navbar:hover .menu-item-inquire.nav-hotline-pill span { color: var(--lx-cream) !important; }
html body .navbar .menu-item-inquire.nav-hotline-pill:hover { background: var(--lx-gold) !important; }
html body .navbar .menu-item-inquire.nav-hotline-pill:hover span { color: var(--lx-dark) !important; }

/* inner pages already sit below the bar; the ticker is gone on phones too */
@media (max-width: 900px) { :root { --ticker-height: 0px; } }

/* search field on the dark title band */
.menu-search-box, .branches-page-hero .menu-search-box { background: rgba(244, 238, 230, .06) !important; }
.menu-search-input, .menu-search-box input { background: transparent !important; color: var(--lx-cream) !important; border: 0 !important; box-shadow: none !important; }
.menu-search-clear { color: var(--lx-cream) !important; }
