/* ==========================================================================
   Banthi Bhojanam event (Oct 25, 2026) — loaded ONLY by banthi-bojanam/index.html.
   Every rule is prefixed with a bb- class (or keyed off .bb-bar), so no other
   page or global style is affected. Colours come from brand.css tokens; the
   maroon bar reuses the site's existing .announce treatment.
   ========================================================================== */

/* ---- Sticky maroon booking bar (sits above the sticky header) ---- */
.bb-bar{--bb-bar-h:48px;position:sticky;top:0;z-index:51;background:var(--dsb-maroon);color:var(--dsb-cream);font-size:14px;font-family:var(--font-body)}
.bb-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--bb-bar-h)}
.bb-bar p{margin:0;display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap;overflow:hidden}
.bb-bar strong{color:var(--dsb-yellow);font-weight:700}
.bb-bar__sep{opacity:.6}
.bb-bar__cta{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:36px;padding:0 18px;border-radius:999px;background:var(--dsb-yellow);color:var(--dsb-maroon);font-weight:700;font-size:14px;transition:background-color .2s}
.bb-bar__cta:hover{background:#ffc233;color:var(--dsb-maroon)}
.bb-bar__cta:focus-visible{outline-color:var(--dsb-cream)}
/* The site header is already sticky at top:0; on this page it docks under the bar. */
.bb-bar ~ .header{top:48px}
@media (max-width:640px){.bb-bar__more{display:none}}
@media (max-width:360px){.bb-bar strong{display:none}.bb-bar p .bb-bar__sep:first-of-type{display:none}}

/* Anchor targets clear the bar + scrolled header (48 + 75) with breathing room. */
#book,#event-details{scroll-margin-top:136px}

/* ---- Event hero (keeps .page-hero so shared hero behaviour still applies) ---- */
.page-hero.bb-hero{background:var(--dsb-maroon);padding:clamp(32px,6vw,72px) 0 clamp(36px,6vw,72px)}
.bb-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,64px);align-items:center}
.bb-hero h1{color:var(--dsb-yellow)}
.bb-hero h1 .script{color:#fff}
.bb-hero p.sub{color:#EFDFC9}
.bb-facts{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px}
.bb-facts li{display:flex;align-items:center;gap:8px;font-weight:600;font-size:clamp(15px,1.5vw,17px);color:#fff}
.bb-facts svg{width:20px;height:20px;flex-shrink:0;color:var(--dsb-yellow)}
.bb-hero__ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.bb-hero__ctas .btn svg{width:20px;height:20px}
.bb-hero__media{margin:0;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/5;max-height:520px;box-shadow:0 24px 48px -28px rgba(0,0,0,.6);justify-self:end;width:100%;max-width:420px}
.bb-hero__media img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){
  .bb-hero__grid{grid-template-columns:1fr}
  .bb-hero__media{justify-self:stretch;max-width:none;aspect-ratio:16/10;max-height:300px;border-radius:var(--radius-md)}
}
@media (max-width:520px){
  .bb-hero h1{font-size:34px}
  .bb-hero .kicker{margin-bottom:10px}
  .bb-facts{margin-top:16px;gap:8px}
  .bb-facts li{width:100%}
  .bb-hero__ctas{margin-top:20px}
  .bb-hero__ctas .btn{flex:1 1 100%}
  .bb-hero p.sub{font-size:16px}
}

/* ---- Event details ---- */
.bb-details .section-head{margin-bottom:28px}
.bb-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.bb-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);padding:26px;display:flex;flex-direction:column;gap:6px}
.bb-card h3{font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--dsb-maroon);font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:6px}
.bb-card h3 svg{width:20px;height:20px;color:var(--dsb-maroon)}
.bb-card p{margin:0;color:var(--ink)}
.bb-card .bb-strong{font-size:19px;font-weight:700}
.bb-card .bb-muted{color:var(--muted);font-size:15px}
.bb-card a{font-weight:600;margin-top:6px;display:inline-flex;align-items:center;min-height:40px}
.bb-details__cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:28px}
.bb-details__cta p{margin:0;color:var(--muted)}
.bb-btn-maroon{background:var(--dsb-maroon);color:var(--dsb-cream)}
.bb-btn-maroon:hover{background:#6B2D27;color:#fff}
.bb-btn-maroon svg{width:20px;height:20px}
@media (max-width:860px){.bb-cards{grid-template-columns:1fr}.bb-card{padding:20px}}
@media (max-width:520px){.bb-details__cta .btn{width:100%}}

/* ---- Booking section: Jotform + preserved fallback form ---- */
.bb-jotform{background:#fff;border:1px solid var(--line);border-radius:28px;padding:clamp(6px,1.5vw,16px);min-height:540px;overflow:hidden}
.bb-jotform iframe{display:block;width:100%;min-width:100%;border:0}
.bb-jotform__loading{margin:0;padding:24px;color:var(--muted);text-align:center}
.bb-jotform.is-ready .bb-jotform__loading{display:none}
.bb-jotform.is-failed{display:none}
.bb-fallback[hidden]{display:none}
.bb-book-note{margin:22px 0 0;padding:16px 18px;border-radius:var(--radius-sm);background:#fff;border:1px solid var(--line);font-size:15px;color:var(--ink)}
.bb-book-note strong{color:var(--dsb-maroon)}
@media (max-width:560px){.bb-jotform{border-radius:20px;padding:4px}}
/* Keep the primary CTAs clear of the site's fixed social icons on phones/tablets. */
@media (max-width:760px){.bb-hero__ctas{padding-right:52px}}
/* Booking intro stays pinned beside the (long) Jotform on wider screens. */
@media (min-width:901px){#book .cater > .reveal{position:sticky;top:140px}}
