/* ============================================================================
   FESTIVALS SUB-SITE CSS
   Deploy to: /hindu-festivals/assets/css/festivals.css
   Extends bs-design-system.css — adds ONLY; never redefines shared tokens.
   ============================================================================ */

/* ── Mobile nav (moved from partials/nav_mobile.php's inline <style>) ──
   FOUC FIX: this block used to be an inline <style> tag placed AFTER the
   mobile-nav's markup in the HTML body. External stylesheets (this file) are
   render-blocking — the browser won't paint body content until they load —
   but inline <style> tags in the body are not. On a slow connection the
   browser could paint the fully-expanded, unstyled mobile nav (wrapper, panel,
   every accordion group) before ever reaching that inline tag. Moved here
   verbatim so the hidden-by-default state is guaranteed active before the
   markup can ever paint. Markup itself (partials/nav_mobile.php) unchanged. */
.bsnav-mobile{display:none}
@media (max-width:991px){ .bsnav-mobile{display:block;position:fixed;top:0;left:0;right:0;z-index:1030} }
.bsnav-m-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:linear-gradient(90deg,#2a0a4e,#560694);box-shadow:0 2px 14px rgba(45,10,80,.35)}
.bsnav-m-brand img{height:28px;width:auto;filter:brightness(0) invert(1)}
.bsnav-m-toggle{background:transparent;border:0;width:40px;height:40px;display:flex;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;padding:8px}
.bsnav-m-toggle span{display:block;height:2.5px;width:100%;background:#fff;border-radius:2px;transition:.25s}
.bsnav-m-toggle.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.bsnav-m-toggle.open span:nth-child(2){opacity:0}
.bsnav-m-toggle.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.bsnav-m-panel{display:none;background:#1e0d38;max-height:calc(100vh - 58px);overflow-y:auto;padding:12px 14px 20px;border-top:1px solid rgba(255,255,255,.1)}
.bsnav-m-panel.open{display:block}
.bsnav-m-search{margin-bottom:12px}
.bsnav-m-search input{width:100%;height:40px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);border-radius:12px;padding:0 14px;color:#fff;font-family:inherit}
.bsnav-m-search input::placeholder{color:rgba(255,255,255,.7)}
.bsnav-m-group{border:1px solid rgba(255,255,255,.16);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.05);margin-bottom:8px}
.bsnav-m-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;background:transparent;border:0;color:#fff;font-weight:800;font-size:15px;font-family:inherit;padding:14px 16px;cursor:pointer;text-align:left}
.bsnav-m-head i{font-style:normal;font-size:22px;line-height:1;color:#ffd06b;transition:transform .25s}
.bsnav-m-head.open{color:#ffd06b}
.bsnav-m-head.open i{transform:rotate(45deg)}
.bsnav-m-body{display:none;flex-direction:column;padding:0 8px 8px}
.bsnav-m-body.open{display:flex}
.bsnav-m-body a{color:rgba(255,255,255,.88);font-size:14px;padding:11px 14px;border-radius:10px;text-decoration:none}
.bsnav-m-body a:hover,.bsnav-m-body a:active{background:rgba(255,255,255,.12);color:#fff}
.bsnav-m-all{color:#ffd06b !important;font-weight:800}
.bsnav-m-results{display:none;flex-direction:column;gap:8px;margin-bottom:12px}
.bsnav-m-results.show{display:flex}
.bsnav-m-results a{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:8px 10px;color:#fff;text-decoration:none}
.bsnav-m-results a:active{background:rgba(255,255,255,.16)}
.bsnav-m-results img{width:48px;height:48px;object-fit:cover;border-radius:8px;flex:0 0 auto}
.bsnav-m-results .t{font-size:14px;font-weight:700;line-height:1.3}
.bsnav-m-results .m{font-size:16px;text-align:center;color:rgba(255,255,255,.7);padding:10px}
.bsnav-m-groups.hide{display:none}

/* --- Rotating image hero (keyframes are inline PHP, this is the shell) ------- */
.ev-hero {
  position: relative; min-height: 88vh; color: #fff; overflow: hidden;
  display: flex; flex-direction: column;
  /* keyframes + background-image injected inline via PHP per-event */
  background-size: cover; background-position: center;
  background-attachment: fixed;
}
.ev-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 50%; z-index: 1;
  background: linear-gradient(180deg, transparent, rgba(10,10,18,.85));
  pointer-events: none;
}
@media (max-width: 960px) { .ev-hero { background-attachment: scroll; min-height: 100svh; } }

.ev-hero .container { position: relative; z-index: 2; }

/* Desktop: lay hero-top + main-row-left in left column, card in right column, top-aligned */
@media (min-width: 961px) {
  .ev-hero .container {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    grid-template-areas:
      "top   card"
      "main  card";
    column-gap: 40px;
    align-items: start;
    min-height: 72vh;
    align-content: start;
    padding-top: calc(var(--header-h) + 28px);
    padding-bottom: 40px;
  }
  .ev-hero-top  { grid-area: top; padding-top: 0; }
  .ev-main-row  { grid-area: main; display: block; padding: 0; }
  .ev-quick-card-wrap { grid-area: card; align-self: center; }
}

/* Hero top: breadcrumb + title + meta */
.ev-hero-top { padding-top: calc(var(--header-h) + 14px); }
.ev-bc { font-size: 13px; color: rgba(255,255,255,.55); display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 16px; }
.ev-bc a { color: rgba(255,255,255,.55); }
.ev-bc a:hover { color: #fff; }
.ev-bc .sep { margin: 0 4px; opacity: .4; }

.ev-info-tag { font-size: 13px; color: rgba(255,255,255,.65); letter-spacing: .04em; margin-bottom: 8px; }
.ev-title {
  font-size: clamp(2.2rem, 5.5vw, 3.6rem); font-weight: 900; line-height: 1.15; margin: 0 0 16px;
  text-shadow: 0 2px 18px rgba(0,0,0,.6);
}
.ev-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: 13px; color: rgba(255,255,255,.82); margin-bottom: 16px; }
.ev-meta svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 4px; opacity: .7; }

.gcal-btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25);
  border-radius: 10px; color: #fff; font-size: 13px; padding: 9px 14px;
  transition: background .2s;
}
.gcal-btn:hover { background: rgba(255,255,255,.22); color: #fff; }
.gcal-btn img { width: 17px; height: 17px; }

/* Hero main row: stacks below title on mobile; on desktop it's the left grid column */
.ev-main-row {
  display: grid; grid-template-columns: 1fr; gap: 32px;
  align-items: start; flex: 1; padding: 20px 0 48px;
}

/* ── Unified Quick Card (countdown + info merged, like mockup) ── */
.ev-quick-card {
  background: rgba(24,12,38,.64); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 22px;
  padding: 24px; box-shadow: 0 24px 64px rgba(0,0,0,.26);
}
.ev-quick-card h3 { font-size: 17px; font-weight: 900; color: #ffe4a0; margin-bottom: 14px; }

/* Countdown inside the card */
.ev-cd { text-align: center; margin-bottom: 18px; }
.ev-cd--past { padding: 28px 10px; }
.ev-cd--running { padding: 28px 10px; }
.ev-cd-past-msg { font-size: 1.4rem; font-weight: 800; color: #fff; opacity: .85; }
.ev-cd--running .ev-cd-past-msg { color: var(--gold); opacity: 1; }
.ev-cd-days {
  font-size: clamp(4rem, 9vw, 6rem); font-weight: 900; line-height: 1; color: #fff;
  text-shadow: 0 0 32px rgba(180,80,255,.9), 0 0 80px rgba(140,50,255,.5), 0 2px 4px rgba(0,0,0,.8);
}
.ev-cd-lbl { font-size: 1rem; color: rgba(255,255,255,.72); margin: 4px 0 14px; letter-spacing: .05em; }
.ev-cd-hms { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; max-width: 280px; margin: 0 auto; }
.ev-cd-cell {
  background: rgba(0,0,0,.3); border: 1px solid rgba(160,80,255,.35);
  border-radius: 12px; padding: 10px 4px; backdrop-filter: blur(6px);
}
.ev-cd-num { font-size: 1.4rem; font-weight: 700; color: #fff; text-shadow: 0 0 12px rgba(180,100,255,.7); }
.ev-cd-unit { font-size: 11px; color: rgba(255,255,255,.5); margin-top: 2px; }

/* Info list inside card */
.ev-info-list { display: grid; gap: 8px; color: rgba(255,255,255,.9); font-size: 14px; }
.ev-info-list > div {
  display: flex; justify-content: space-between; gap: 16px;
  border-top: 1px solid rgba(255,255,255,.1); padding-top: 8px;
}
.ev-info-list b { color: #ffe4a0; text-align: right; }

/* Hero text side: CTA row */
.ev-cta-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ev-cta-row .btn { font-size: 14px; }

/* ── Hero date badge (compact teaser, NOT a competing answer) ── */
.ev-hero-badge {
  display: inline-flex; align-items: center; gap: 12px;
  background: rgba(255,255,255,.1); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,228,160,.35); border-left: 4px solid var(--gold);
  border-radius: 14px; padding: 12px 18px; margin-bottom: 18px;
}
.ev-day-progress {
  display: inline-block; background: var(--gold); color: #2a1500; font-weight: 800;
  font-size: 14px; padding: 8px 16px; border-radius: 999px; margin-bottom: 18px;
}
.ev-hero-badge-icon { font-size: 24px; }
.ev-hero-badge-date { display: block; font-size: clamp(16px, 2.4vw, 20px); font-weight: 900; color: #ffe4a0; line-height: 1.2; }
.ev-hero-badge-sub { display: block; font-size: 13px; color: rgba(255,255,255,.8); margin-top: 2px; }

@media (max-width: 960px) {
  .ev-main-row { grid-template-columns: 1fr; padding-bottom: 80px; gap: 20px; }
  .ev-cd-days { font-size: clamp(3.4rem, 16vw, 5rem); }
  /* Mobile: compact countdown card */
  .ev-quick-card { padding: 18px; }
  .ev-cd { margin-bottom: 14px; }
  .ev-cd-lbl { font-size: .9rem; margin: 2px 0 10px; }
  .ev-cd-cell { padding: 8px 4px; }
  .ev-cd-num { font-size: 1.2rem; }
}
@media (max-width: 640px) {
  .ev-hero-top { padding-left: 6px; padding-right: 6px; }
}

/* ── Sticky section nav ── */
.ev-section-nav {
  position: sticky; top: var(--header-h); z-index: 40;
  background: rgba(255,252,248,.92); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--line);
}
.ev-section-nav .container {
  display: flex; gap: 8px; overflow-x: auto; padding: 10px 0;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ev-section-nav .container::-webkit-scrollbar { display: none; }
.ev-section-nav a {
  flex: 0 0 auto; border: 1px solid var(--line); background: var(--paper);
  color: var(--brand-purple); border-radius: 999px; padding: 8px 14px;
  font-weight: 800; font-size: 13px; white-space: nowrap;
}
.ev-section-nav a:hover { background: var(--lav); }

/* ── Quick Answer (Featured-Snippet target) ── */
.ev-answer-wrap { position: relative; z-index: 5; padding: 40px 0 0; }
.ev-answer {
  display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; align-items: stretch;
}
.ev-answer-main {
  background: linear-gradient(135deg, #fff, #fff6ef);
  border: 1px solid rgba(255,208,107,.6); border-radius: var(--radius);
  padding: 28px; box-shadow: 0 22px 60px rgba(42,23,72,.14);
}
.ev-answer-main h2 { font-size: clamp(26px, 3.6vw, 34px); margin-bottom: 10px; }
.ev-answer-main p { color: #5e4b70; font-size: 16px; }
.ev-answer-main strong { color: var(--brand-purple); }
.ev-snippet { font-size: 17px !important; line-height: 1.8; color: #4a3a5e !important; }
.ev-snippet strong { color: var(--brand-purple); font-weight: 800; }

/* ── Next-dates table ── */
.ev-next-dates { margin-bottom: 0; }
.ev-next-table-wrap { overflow-x: auto; border-radius: 18px; border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.ev-next-table { width: 100%; border-collapse: collapse; font-size: 14px; background: var(--paper); }
.ev-next-table th { background: linear-gradient(135deg,#f6eefe,#fff3d1); color: var(--brand-purple); font-weight: 900; padding: 13px 16px; text-align: left; white-space: nowrap; }
.ev-next-table td { padding: 12px 16px; border-top: 1px solid var(--line); vertical-align: middle; }
.ev-next-table tr:hover td { background: rgba(246,238,254,.35); }
.ev-next-table a { color: var(--brand-purple); font-weight: 700; }
.ev-next-table a:hover { color: var(--brand-magenta); }
.ev-days-pill { display: inline-flex; background: #eafaf3; color: #178b5f; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.ev-table-btn { display: inline-flex; background: var(--lav); color: var(--brand-purple); border-radius: 8px; padding: 5px 12px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.ev-table-btn:hover { background: var(--brand-purple); color: #fff; }

/* ── Related festival cards grid ── */
.ev-related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
@media (max-width: 960px) { .ev-related-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .ev-related-grid { grid-template-columns: 1fr; } }
.ev-rel-card { display: flex; gap: 12px; align-items: flex-start; background: var(--paper); border: 1px solid var(--line); border-radius: 18px; padding: 12px; transition: box-shadow .18s, transform .18s; }
.ev-rel-card:hover { box-shadow: 0 8px 28px rgba(86,6,148,.12); transform: translateY(-2px); }
.ev-rel-img { width: 56px; height: 56px; border-radius: 12px; background-size: cover; background-position: center; flex: none; }
.ev-rel-img--placeholder { display: flex; align-items: center; justify-content: center; font-size: 22px; background: var(--lav); }
.ev-rel-body { display: flex; flex-direction: column; min-width: 0; }
.ev-rel-date { font-size: 12px; color: var(--muted); }
.ev-rel-title { font-size: 14px; font-weight: 800; color: var(--deep); margin: 2px 0; line-height: 1.25; }
.ev-rel-tithi { font-size: 12px; color: var(--brand-purple); }

/* ── Utility links row ── */
.ev-utility-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.ev-utility-links a { display: flex; align-items: center; gap: 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 10px 16px; flex: 1 1 180px; }
.ev-utility-links a:hover { border-color: var(--brand-purple); }
.ev-utility-links span { font-size: 20px; flex: none; }
.ev-utility-links b { display: block; font-size: 13px; font-weight: 800; color: var(--deep); }
.ev-utility-links small { font-size: 12px; color: var(--muted); }

/* Shared margin helper */
.mt-32 { margin-top: 32px; }
/* ── Cross-sub-site: Mantras ── */
.ev-mantra-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px,1fr)); gap: 16px; }
.ev-mantra-card { background: linear-gradient(135deg,#fdf6ff,#fff9f0); border: 1px solid rgba(154,5,149,.15); border-left: 4px solid var(--brand-purple); border-radius: var(--radius); padding: 20px; }
.ev-mantra-title { font-size: 16px; font-weight: 900; color: var(--brand-purple); margin-bottom: 10px; }
.ev-mantra-text { font-size: 15px; line-height: 1.7; color: var(--deep); margin-bottom: 8px; white-space: pre-line; }
.ev-mantra-meaning { font-size: 13px; color: var(--muted); font-style: italic; margin-bottom: 12px; }
.ev-mantra-link { font-size: 13px; font-weight: 800; color: var(--brand-purple); }
.ev-mantra-link:hover { color: var(--brand-magenta); }

/* ── Cross-sub-site: Greetings ── */
.ev-greet-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); gap: 14px; }
.ev-greet-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: box-shadow .18s, transform .18s; }
.ev-greet-card:hover { box-shadow: 0 8px 28px rgba(86,6,148,.12); transform: translateY(-2px); }
.ev-greet-card img { width: 100%; height: 160px; object-fit: cover; display: block; }
.ev-greet-placeholder { height: 120px; display: flex; align-items: center; justify-content: center; font-size: 40px; background: linear-gradient(135deg,#f6eefe,#fff3f0); }
.ev-greet-caption { padding: 12px; }
.ev-greet-caption b { display: block; font-size: 14px; font-weight: 800; color: var(--deep); margin-bottom: 4px; }
.ev-greet-caption small { font-size: 12px; color: var(--muted); line-height: 1.5; }
.ev-whatsapp-cta { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.btn-whatsapp { display: inline-flex; align-items: center; gap: 8px; background: #25d366; color: #fff; border-radius: 10px; padding: 10px 18px; font-weight: 800; font-size: 14px; }
.btn-whatsapp:hover { background: #1ebe5d; color: #fff; }

/* ── Cross-sub-site: Facts ── */
/* ── Fact cards — compact horizontal grid (matches the homepage fact style).
   Was a vertical stack of full-width rows, which ate a lot of page height for
   three short facts. Cards are equal-width, scroll horizontally on mobile. ── */
.ev-facts-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px;
}
.ev-fact-card {
  display: block; position: relative;
  background: #fffaf0; border: 1px solid #f5d9a8;
  border-left: 4px solid var(--gold);
  border-radius: 14px; padding: 16px 16px 18px;
  text-decoration: none; transition: transform .15s, box-shadow .15s;
}
a.ev-fact-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(86,6,148,.10); }
.ev-fact-num {
  display: block; font-size: 20px; font-weight: 900;
  color: var(--gold); line-height: 1; margin-bottom: 10px;
}
.ev-fact-text {
  font-size: 13.5px; line-height: 1.75; color: #5e4b70; margin: 0;
}
@media (max-width: 640px) {
  .ev-facts-grid {
    grid-auto-flow: column; grid-auto-columns: 78%;
    grid-template-columns: none;
    overflow-x: auto; scroll-snap-type: x mandatory;
    padding-bottom: 6px; -webkit-overflow-scrolling: touch;
  }
  .ev-fact-card { scroll-snap-align: start; }
}

/* ── Tag Hub pages (/dates/{slug}) ── */
.ev-hero--hub {
  background: linear-gradient(135deg, #2a0a4e 0%, #560694 28%, #7d1b9e 52%, #9A0595 74%, #4a0876 100%);
}
/* soft floating glow accents over the gradient */
.ev-hero--hub::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(60% 50% at 18% 22%, rgba(255,180,80,.18), transparent 60%),
    radial-gradient(50% 45% at 85% 75%, rgba(180,90,255,.22), transparent 60%);
  animation: evHubGlow 12s ease-in-out infinite alternate;
}
@keyframes evHubGlow {
  0%   { opacity: .7; transform: translateY(0); }
  100% { opacity: 1; transform: translateY(-12px); }
}
.ev-hero--hub .container { position: relative; z-index: 2; }
.ev-hero--hub .ev-quick-card { text-align: center; }
.ev-hero-lead { font-size: 15px; line-height: 1.7; color: rgba(255,255,255,.82); max-width: 560px; margin: 12px 0 0; }
.ev-answer-card { background: linear-gradient(135deg,#fff9f1,#fff4fb); border: 1px solid rgba(247,169,31,.3); border-radius: var(--radius); padding: 28px; box-shadow: var(--shadow-soft); }
.ev-answer-card .h2 { margin-bottom: 12px; }
.ev-answer-card p { font-size: 15px; line-height: 1.7; color: var(--deep); margin-bottom: 14px; }
.ev-hub-table { width: 100%; border-collapse: collapse; font-size: 14px; background: var(--paper); border-radius: 14px; overflow: hidden; }
.ev-hub-table th { background: linear-gradient(135deg,#f6eefe,#fff3d1); color: var(--brand-purple); font-weight: 900; padding: 12px 14px; text-align: left; white-space: nowrap; }
.ev-hub-table td { padding: 11px 14px; border-top: 1px solid var(--line); }
.ev-hub-table tr:hover td { background: rgba(246,238,254,.35); }
.ev-hub-table a { color: var(--brand-purple); font-weight: 700; }
.ev-hub-table a:hover { color: var(--brand-magenta); }
.ev-hub-table--full { font-size: 13px; }
.ev-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ev-month-block { margin-bottom: 26px; }
.ev-month-block h3 { font-size: 18px; font-weight: 800; color: var(--deep); margin-bottom: 10px; }
.ev-hub-links { display: grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: 10px; }
.ev-hub-links a { display: flex; align-items: center; gap: 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; transition: .15s; }
.ev-hub-links a:hover { border-color: var(--brand-purple); background: var(--lav); transform: translateY(-2px); }
.ev-hub-links span { font-size: 18px; flex: none; }
.ev-hub-links b { font-size: 14px; font-weight: 800; color: var(--deep); }

/* Quick-nav pills (sticky chip bar under hero) */
.ev-quicknav { position: sticky; top: var(--header-h, 64px); z-index: 40; background: rgba(255,253,249,.92); backdrop-filter: blur(12px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 12px 0; }
.ev-quicknav-row { display: flex; gap: 9px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ev-quicknav-row::-webkit-scrollbar { display: none; }
.ev-pill { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--paper); color: var(--brand-purple); border-radius: 999px; padding: 8px 15px; font-size: 13px; font-weight: 800; transition: .15s; white-space: nowrap; }
.ev-pill:hover, .ev-pill.active { background: linear-gradient(135deg,var(--brand-purple),var(--brand-magenta)); color: #fff; border-color: transparent; }

/* Context chips */
.ev-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.ev-chip { display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border-radius: 999px; background: var(--cream); border: 1px solid rgba(247,169,31,.35); font-weight: 800; font-size: 13px; color: var(--deep); }

/* View toggle (calendar vs timeline) */
.ev-controls-bar { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.ev-viewbtns { display: flex; gap: 8px; }
.ev-viewbtn { border: 1px solid var(--line); background: var(--paper); padding: 8px 14px; border-radius: 999px; font-weight: 800; font-size: 13px; color: var(--muted); cursor: pointer; }
.ev-viewbtn.active { background: linear-gradient(135deg,var(--brand-purple),var(--brand-magenta)); color: #fff; border-color: transparent; }
.ev-view { display: none; }
.ev-view.active { display: block; }

/* Timeline card view */
.ev-tl { display: grid; gap: 12px; }
.ev-tl-card { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow-soft); }
.ev-tl-date { width: 64px; height: 64px; border-radius: 16px; background: linear-gradient(135deg,#fff0c6,#fff); border: 1px solid rgba(247,169,31,.4); display: grid; place-items: center; text-align: center; flex: none; }
.ev-tl-date b { font-size: 22px; line-height: 1; color: #7a4f00; }
.ev-tl-date span { font-size: 10px; font-weight: 800; color: var(--muted); }
.ev-tl-body h3 { font-size: 18px; font-weight: 850; color: var(--deep); margin-bottom: 3px; }
.ev-tl-body p { font-size: 13px; color: var(--muted); }

/* Do / Don't split */
.ev-dodont-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ev-do-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow-soft); }
.ev-do-card h3 { display: flex; gap: 8px; align-items: center; font-size: 20px; font-weight: 850; margin-bottom: 14px; color: var(--brand-purple); }
.ev-do-card ul { list-style: none; display: grid; gap: 9px; }
.ev-do-card li { padding: 10px 12px; border-radius: 12px; background: #fff9ef; border: 1px solid #ffe9bb; font-size: 14px; color: var(--deep); }
.ev-do-card.no li { background: #fff4f6; border-color: #ffd6df; }

/* Source / trust grid */
.ev-source-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 14px; }
.ev-source-card { background: var(--paper); border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; box-shadow: var(--shadow-soft); display:block; transition:.15s; }
a.ev-source-card:hover { border-color:var(--brand-purple); transform:translateY(-2px); }
.ev-source-card b { display: block; color: var(--brand-purple); margin-bottom: 5px; font-size: 14px; }
.ev-source-card span { font-size: 13px; color: var(--muted); }

/* Collapsible table wrapper (show-more) */
.ev-collapse { position: relative; }
.ev-collapse.clipped .ev-collapse-inner { max-height: 360px; overflow-y: hidden; overflow-x: auto; }
.ev-collapse.clipped .ev-collapse-inner::after { content:""; position:absolute; left:0; right:0; bottom:46px; height:80px; background:linear-gradient(transparent,var(--paper)); pointer-events:none; }
.ev-collapse-toggle { display:inline-flex; align-items:center; gap:6px; margin-top:14px; background:var(--lav); color:var(--brand-purple); border:1px solid var(--line); border-radius:999px; padding:9px 18px; font-weight:800; font-size:13px; cursor:pointer; transition:.15s; }
.ev-collapse-toggle:hover { background:var(--brand-purple); color:#fff; border-color:transparent; }

/* Related hubs — 2-col link table (competitor-style coverage) */
.ev-related-table { width:100%; border-collapse:collapse; background:var(--paper); border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); }
.ev-related-table caption { background:#fff3d1; color:var(--brand-purple); font-weight:900; font-size:16px; padding:14px; text-align:center; }
.ev-related-table td { padding:13px 16px; border:1px solid var(--line); width:50%; vertical-align:top; }
.ev-related-table a { color:var(--brand-purple); font-weight:700; font-size:14px; }
.ev-related-table a:hover { color:var(--brand-magenta); text-decoration:underline; }
.ev-related-table tr:hover td { background:rgba(246,238,254,.3); }

/* Month accordion (compact) */
.ev-macc { display:grid; gap:10px; }
.ev-macc-item { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--paper); }
.ev-macc-q { width:100%; border:0; background:transparent; text-align:left; padding:15px 18px; font-weight:850; font-size:15px; color:var(--deep); display:flex; justify-content:space-between; align-items:center; gap:12px; cursor:pointer; }
.ev-macc-q .mk { color:var(--brand-purple); font-size:20px; font-weight:900; transition:.2s; }
.ev-macc-item.open .ev-macc-q { color:var(--brand-purple); }
.ev-macc-item.open .ev-macc-q .mk { transform:rotate(45deg); }
.ev-macc-a { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.ev-macc-item.open .ev-macc-a { max-height:600px; }
.ev-macc-a-inner { padding:0 18px 16px; }

/* Mantra / facts / greetings mini-cards on hub */
.ev-x-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
.ev-x-card { background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:var(--shadow-soft); }
.ev-x-card .lbl { font-size:12px; font-weight:900; color:var(--brand-magenta); text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px; }
.ev-x-card .mantra-sanskrit { font-size:17px; line-height:1.7; color:var(--brand-purple); font-weight:800; margin-bottom:8px; }
.ev-x-card p { font-size:13px; color:var(--muted); line-height:1.6; }
.ev-x-card a.more { display:inline-block; margin-top:10px; font-size:13px; font-weight:800; color:var(--brand-purple); }

/* Back-to-top button */
.ev-top-btn { position:fixed; right:22px; bottom:22px; z-index:60; width:46px; height:46px; border-radius:50%; border:0; background:linear-gradient(135deg,var(--brand-purple),var(--brand-magenta)); color:#fff; font-size:20px; cursor:pointer; box-shadow:0 8px 22px rgba(86,6,148,.35); opacity:0; visibility:hidden; transform:translateY(10px); transition:.25s; }
.ev-top-btn.show { opacity:1; visibility:visible; transform:translateY(0); }
.ev-top-btn:hover { transform:translateY(-3px); }

/* Header image hero overlay (sits over the animated gradient base) */
.ev-hero--img .ev-hero-imgbg { position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.55; }
.ev-hero--img .ev-hero-imgbg-overlay { position:absolute; inset:0; z-index:0; background:linear-gradient(135deg,rgba(20,8,40,.74),rgba(72,4,118,.62)); pointer-events:none; }
.ev-hero--img .container { position:relative; z-index:2; }
.ev-hero--img .ev-quick-card { background:rgba(14,6,28,.82); border-color:rgba(255,255,255,.22); }
.ev-hero-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.btn-outline-light { background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.42); color:#fff; backdrop-filter:blur(8px); }
.btn-outline-light:hover { background:rgba(255,255,255,.3); }

/* Upgraded hub countdown card */
.ev-quick-card--hub { text-align:center; }
.ev-qc-badge { display:inline-block; background:rgba(34,181,115,.22); color:#7CFFB8; border:1px solid rgba(124,255,184,.35); border-radius:999px; padding:5px 14px; font-size:12px; font-weight:900; margin-bottom:12px; }
.ev-qc-title { font-size:22px; font-weight:900; color:#fff; margin-bottom:12px; line-height:1.25; }
.ev-qc-date { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:10px; }
.ev-qc-day { font-size:46px; font-weight:900; color:var(--gold,#ffd06b); line-height:1; }
.ev-qc-mon { text-align:left; font-size:13px; font-weight:700; color:rgba(255,255,255,.85); line-height:1.35; }
.ev-qc-tithi { font-size:13px; color:#ffe4a0; margin-bottom:14px; }
.ev-cd--hub .ev-cd-hms { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.ev-cd--hub .ev-cd-cell { background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:10px 4px; }
.ev-cd--hub .ev-cd-num { font-size:28px; font-weight:900; color:var(--gold,#ffd06b); line-height:1; }
.ev-cd--hub .ev-cd-unit { font-size:10px; color:rgba(255,255,255,.7); margin-top:3px; }
.ev-qc-actions { display:flex; gap:8px; }
.ev-qc-mini { flex:1; text-align:center; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28); border-radius:10px; padding:8px; font-size:12px; font-weight:800; color:#fff; transition:.15s; }
.ev-qc-mini:hover { background:rgba(255,255,255,.28); color:#fff; }
.ev-qc-mini:hover { background:rgba(255,255,255,.2); }

/* Scripture quote band */
.ev-quote-band { background:linear-gradient(135deg,#fff9f1,#fff4fb); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:32px 0; }
.ev-quote { position:relative; max-width:760px; margin:0 auto; text-align:center; padding:0 30px; }
.ev-quote-mark { position:absolute; left:0; top:-10px; font-size:46px; color:var(--brand-magenta); opacity:.4; }
.ev-quote p { font-size:18px; line-height:1.8; color:var(--deep); font-weight:700; font-style:italic; }
.ev-quote cite { display:block; margin-top:10px; font-size:14px; font-weight:800; color:var(--brand-purple); font-style:normal; }

/* Social share */
.ev-share-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-soft); }
.ev-share-row { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.ev-share-label { font-weight:900; color:var(--brand-purple); font-size:14px; }
.ev-share-btn { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:#fff; border-radius:999px; padding:9px 18px; font-size:13px; font-weight:800; color:var(--deep); cursor:pointer; transition:.15s; }
.ev-share-btn:hover { transform:translateY(-2px); }
.ev-share-btn.wa:hover { background:#25D366; color:#fff; border-color:transparent; }
.ev-share-btn.fb:hover { background:#1877F2; color:#fff; border-color:transparent; }
.ev-share-btn.tw:hover { background:#1DA1F2; color:#fff; border-color:transparent; }
.ev-share-btn.tg:hover { background:#0088cc; color:#fff; border-color:transparent; }
.ev-share-btn.cp:hover { background:var(--brand-purple); color:#fff; border-color:transparent; }

/* Video embed */
.ev-video-wrap { position:relative; padding-bottom:56.25%; height:0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-soft); }
.ev-video-wrap iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.ev-video-facade { position:absolute; inset:0; width:100%; height:100%; border:0; padding:0; cursor:pointer; background:#000; }
.ev-video-facade img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.85; }
.ev-video-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:transform .15s; filter:drop-shadow(0 4px 14px rgba(0,0,0,.4)); }
.ev-video-facade:hover .ev-video-play { transform:translate(-50%,-50%) scale(1.08); }

/* Hub responsive */
@media (max-width: 640px) {
  .ev-dodont-grid { grid-template-columns: 1fr; }
  .ev-tl-card { grid-template-columns: 1fr; text-align: center; }
  .ev-related-table td { display:block; width:100%; }
  /* horizontal scroll for wide tables instead of clipping */
  .ev-hub-table { min-width: 540px; }
  .card { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .ev-collapse-inner .card { overflow-x: auto !important; }
}

/* ── Interactive Samagri Checklist ── */
.ev-samagri-progress { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.ev-samagri-bar { flex: 1; height: 8px; background: var(--line); border-radius: 99px; overflow: hidden; }
.ev-samagri-fill { height: 100%; width: 0%; background: linear-gradient(90deg,var(--brand-purple),var(--brand-magenta)); border-radius: 99px; transition: width .3s ease; }
.ev-samagri-count { font-size: 13px; font-weight: 800; color: var(--brand-purple); white-space: nowrap; }
.ev-samagri-list { display: flex; flex-direction: column; gap: 6px; }
.ev-samagri-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; transition: .15s; user-select: none; }
.ev-samagri-item:hover { background: rgba(246,238,254,.3); }
.ev-samagri-item.checked { background: #f0faf4; border-color: #b8e6cc; }
.ev-samagri-item.checked b { text-decoration: line-through; color: var(--muted); }
.ev-samagri-cb { display: none; }
.ev-samagri-check { flex: none; width: 24px; height: 24px; border-radius: 7px; border: 2px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: 14px; color: transparent; transition: .15s; }
.ev-samagri-item.checked .ev-samagri-check { background: #22b573; border-color: #22b573; color: #fff; }
.ev-samagri-body b { display: block; font-size: 14px; font-weight: 800; color: var(--deep); }
.ev-samagri-body small { font-size: 12px; color: var(--muted); }
.ev-samagri-actions { display: flex; gap: 8px; margin-top: 14px; }
.btn-sm { padding: 6px 14px; font-size: 13px; }

/* ── Google Preferred Source CTA ── */
.ev-preferred-card { background: linear-gradient(135deg,#1a0e2e,#2d1654); border-radius: var(--radius); padding: 40px; color: #fff; text-align: center; }
.ev-preferred-icon { font-size: 40px; margin-bottom: 10px; }
.ev-preferred-card h2 { font-size: clamp(20px,3.5vw,26px); font-weight: 900; margin-bottom: 12px; }
.ev-preferred-card p { font-size: 14px; line-height: 1.7; color: rgba(255,255,255,.78); max-width: 640px; margin: 0 auto 24px; }
.ev-preferred-steps { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-bottom: 24px; }
.ev-pref-step { display: flex; align-items: flex-start; gap: 10px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 14px 18px; text-align: left; flex: 1 1 180px; max-width: 240px; }
.ev-pref-num { flex: none; width: 28px; height: 28px; background: var(--brand-magenta); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 14px; }
.ev-pref-step b { display: block; font-size: 13px; font-weight: 800; margin-bottom: 2px; }
.ev-pref-step small { font-size: 12px; color: rgba(255,255,255,.6); line-height: 1.4; }
.btn-gold { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg,#f5c842,#e6a817); color: #1a0e2e; border-radius: 12px; padding: 12px 24px; font-weight: 900; font-size: 15px; }
.btn-gold:hover { background: linear-gradient(135deg,#ffe066,#f5c842); color: #1a0e2e; }

/* ── Auto-locate button ── */
.ev-locate-btn { flex: none; width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: var(--paper); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .15s; }
.ev-locate-btn:hover { border-color: var(--brand-purple); background: var(--lav); }
.ev-locate-btn.locating { animation: evPulse 1s infinite; }
@keyframes evPulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }

.ev-ai-summary {
  background: linear-gradient(135deg, #fff9f1, #fff4fb);
  border: 1px solid rgba(247,169,31,.3); border-radius: var(--radius);
  padding: 28px 32px; box-shadow: var(--shadow-soft);
}
.ev-ai-summary p { font-size: 16px; line-height: 1.85; color: #5e4b70; margin-top: 10px; }
.ev-ai-summary strong { color: var(--brand-purple); }
.ev-mini-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 18px; }
.ev-stat { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 14px; }
.ev-stat small { display: block; color: var(--muted); font-weight: 800; font-size: 12px; }
.ev-stat b { font-size: 17px; color: var(--deep); }

.ev-side-actions { display: flex; flex-direction: column; gap: 10px; }
.ev-action {
  display: flex; align-items: center; gap: 12px; padding: 16px;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-soft); transition: .22s;
}
.ev-action:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.ev-action span { font-size: 26px; flex: none; }
.ev-action b { display: block; font-size: 14px; }
.ev-action small { color: var(--muted); font-size: 12px; }

@media (max-width: 960px) {
  .ev-answer { grid-template-columns: 1fr; }
  .ev-side-actions { flex-direction: row; overflow-x: auto; gap: 10px; }
  .ev-action { min-width: 200px; }
}

/* ── EAV Dashboard (8-card grid) ── */
.ev-dash { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.ev-dash .card { display: flex; flex-direction: column; gap: 4px; }
.ev-dash .card small { color: var(--muted); font-weight: 800; font-size: 12px; }
.ev-dash .card b { font-size: 17px; color: var(--deep); }
.ev-dash .card em { color: var(--brand-magenta); font-style: normal; font-size: 13px; }
@media (max-width: 960px) { .ev-dash { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .ev-dash { grid-template-columns: 1fr; } }

/* ── Panchang Sync section ── */
.ev-panchang { background: linear-gradient(180deg, var(--lav), #fff8ef 60%); }
.ev-sync-top { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; margin-bottom: 24px; }
.ev-sync-hero {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 24px; box-shadow: var(--shadow-soft);
}
.ev-sync-hero h3 { font-size: 18px; margin-bottom: 8px; }
.ev-city-mini { display: flex; gap: 10px; margin: 14px 0; }
.ev-city-mini select {
  border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px;
  font: inherit; background: #fff;
}
.ev-city-mini button {
  border: 0; border-radius: 999px; padding: 8px 16px; font: inherit; font-weight: 800;
  background: linear-gradient(135deg, var(--gold), var(--saffron)); color: #321742; cursor: pointer;
}
.ev-sync-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.ev-sync-item {
  background: rgba(255,255,255,.7); border: 1px solid var(--line); border-radius: 16px; padding: 14px;
}
.ev-sync-item small { display: block; color: var(--muted); font-weight: 800; font-size: 12px; }
.ev-sync-item b { font-size: 15px; color: var(--deep); display: block; }
.ev-sync-item em { color: var(--brand-magenta); font-style: normal; font-size: 12px; }

/* Panchak / Bhadra advisory strip — compact, sits under the main panchang grid.
   Uses the gold warning accent so it reads as "special condition, check before
   auspicious work" without alarming red. */
.ev-special-yog {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
  margin-top: 14px; padding: 12px 14px;
  background: #fff8e8; border: 1px solid #f0d089; border-radius: 12px;
}
.ev-yog-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-weight: 800; font-size: 13px; color: #8a5a00;
  background: #ffefc4; border: 1px solid #f0d089;
  padding: 4px 11px; border-radius: 999px;
}
.ev-yog-pill .bs-ico { width: 15px; height: 15px; }
.ev-yog-note { font-size: 12.5px; color: var(--muted); }

.ev-sync-panel {
  background: linear-gradient(135deg, var(--deep), var(--deep-2));
  border-radius: var(--radius); padding: 24px; color: #fff;
}
.ev-sync-panel h3 { font-size: 16px; color: #ffe4a0; margin-bottom: 14px; }
.ev-sync-panel .ev-sync-grid { grid-template-columns: repeat(2,1fr); }
.ev-sync-panel .ev-sync-item { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.ev-sync-panel .ev-sync-item small { color: rgba(255,255,255,.6); }
.ev-sync-panel .ev-sync-item b { color: #fff; }

@media (max-width: 960px) {
  .ev-sync-top { grid-template-columns: 1fr; }
  .ev-sync-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px) { .ev-sync-grid { grid-template-columns: 1fr; } }

/* Muhurat table */
/* Muhurat table — mockup style: rounded card wrapper + gradient header */
.ev-muhurat-wrap {
  margin-top: 22px; background: var(--paper); border: 1px solid var(--line);
  border-radius: 28px; box-shadow: var(--shadow-soft); padding: 22px;
}
.ev-muhurat-wrap h3 { font-size: clamp(20px, 3vw, 26px); color: var(--deep); margin-bottom: 14px; }
.ev-muhurat-table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  overflow: hidden; border: 1px solid var(--line); border-radius: 20px; font-size: 14px;
}
.ev-muhurat-table th, .ev-muhurat-table td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: left; }
.ev-muhurat-table th { background: linear-gradient(135deg, #f6eefe, #fff3d1); color: var(--brand-purple); font-weight: 900; }
.ev-muhurat-table tr:last-child td { border-bottom: 0; }
.ev-muhurat-table td:last-child { font-weight: 900; }
.ev-muhurat-table tr:hover td { background: rgba(246,238,254,.4); }
.ev-good-tag { display: inline-flex; background: #eafaf3; color: #178b5f; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: 900; }
.ev-warn-tag { display: inline-flex; background: #fff2da; color: #9a5a00; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: 900; }

/* Visual daily timeline (6-slot grid under muhurat table) */
.ev-timeline-visual { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-top: 14px; }
.ev-visual-slot {
  position: relative; min-height: 76px; border: 1px solid var(--line);
  background: linear-gradient(180deg, #fff, #fff8ef); border-radius: 18px;
  padding: 12px; text-align: center; overflow: hidden;
}
.ev-visual-slot::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px;
  background: linear-gradient(90deg, var(--brand-purple), var(--brand-magenta), var(--gold));
}
.ev-visual-slot small { display: block; color: var(--muted); font-weight: 900; font-size: 12px; }
.ev-visual-slot b { display: block; color: var(--deep); font-size: 14px; line-height: 1.25; margin-top: 4px; }
.ev-visual-slot span { display: block; color: var(--brand-purple); font-weight: 900; font-size: 12px; margin-top: 3px; }
@media (max-width: 960px) { .ev-timeline-visual { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .ev-timeline-visual { grid-template-columns: repeat(2, 1fr); } }

/* ── Content section cards ── */
.ev-content-area { display: grid; grid-template-columns: 1fr 340px; gap: 28px; }
@media (max-width: 960px) { .ev-content-area { grid-template-columns: 1fr; } }

.ev-content-card {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px; box-shadow: var(--shadow-soft); margin-bottom: 20px;
}
.ev-content-card h3 { font-size: clamp(22px, 3vw, 28px); margin-bottom: 12px; color: var(--deep); }
.ev-content-card p { color: #5e4b70; margin-bottom: 12px; }
.ev-highlight {
  background: linear-gradient(135deg, #fff6ef, #fef3ff);
  border-left: 4px solid var(--brand-magenta); border-radius: 0 16px 16px 0;
  padding: 16px 20px; margin-top: 16px; font-weight: 600; color: var(--deep);
}

/* Vidhi timeline */
.ev-timeline { display: flex; flex-direction: column; gap: 14px; }
.ev-step { display: flex; gap: 16px; align-items: flex-start; }
.ev-step-num {
  flex: none; width: 38px; height: 38px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand-purple), var(--brand-magenta));
  color: #fff; display: grid; place-items: center; font-weight: 900; font-size: 15px;
}
.ev-step-body b { display: block; margin-bottom: 4px; color: var(--deep); }
.ev-step-body p { margin: 0; color: var(--muted); font-size: 14px; }

/* Samagri table */
.ev-samagri-table { width: 100%; border-collapse: collapse; margin-top: 14px; }
.ev-samagri-table th { background: var(--lav); color: var(--brand-purple); font-weight: 800; text-align: left; padding: 10px 14px; }
.ev-samagri-table td { padding: 10px 14px; border-bottom: 1px solid var(--line); font-size: 14px; }

/* Do / Don't */
.ev-dodont { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ev-do, .ev-dont { border-radius: var(--radius); padding: 22px; }
.ev-do { background: #f0faf5; border: 1px solid #c8eddb; }
.ev-dont { background: #fef2f4; border: 1px solid #f5d0d6; }
.ev-do h4 { color: #178b5f; } .ev-dont h4 { color: #b23850; }
.ev-do ul, .ev-dont ul { padding-left: 18px; margin: 10px 0 0; }
.ev-do li, .ev-dont li { margin-bottom: 6px; font-size: 14px; }
@media (max-width: 640px) { .ev-dodont { grid-template-columns: 1fr; } }

/* Sidebar (sticky) */
.ev-sidebar { position: sticky; top: calc(var(--header-h) + 52px); align-self: start; }
.ev-sidebar .card { margin-bottom: 16px; }

/* ── Related links grid ── */
.ev-related { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.ev-related .card { display: flex; align-items: center; gap: 14px; padding: 18px; }
.ev-related .card .icon { margin-bottom: 0; }
.ev-related .card b { display: block; font-size: 14px; }
.ev-related .card small { color: var(--muted); font-size: 12px; }
@media (max-width: 960px) { .ev-related { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ev-related { grid-template-columns: 1fr; } }

/* ── Trust / E-E-A-T ── */
/* ── Above-the-fold byline strip (dark hero) ── */
.ev-byline {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: 10px 0 16px;
  font-size: 12.5px; line-height: 1.5;
  color: rgba(255,255,255,.62);
}
.ev-byline b { color: rgba(255,255,255,.92); font-weight: 700; }
.ev-byline .bs-ico { width: 13px; height: 13px; color: #6ee7b7; vertical-align: -0.12em; margin-inline-end: 3px; }
.ev-byline-sep { color: rgba(255,255,255,.28); }
@media (max-width: 640px) {
  .ev-byline { font-size: 11.5px; gap: 6px; }
  .ev-byline-sep { display: none; }
  .ev-byline > span { flex: 0 0 100%; }
}

/* ── Unified E-E-A-T card (provenance + why-this-date + contributors + links) ──
   Replaces the former separate .ev-provenance and .ev-contrib blocks, which were
   visually repetitive. One card, four tiers, compact. ── */
.ev-eeat {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 28px;
}
.ev-eeat-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  flex-wrap: wrap; gap: 12px; margin-bottom: 20px;
}
.ev-eeat-head .h2 { font-size: 22px; }
.ev-eeat-verified {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  font-size: 12.5px; font-weight: 800; color: #178b5f;
  background: #e8f7f0; border: 1px solid #b6e3ce;
  padding: 5px 12px; border-radius: 999px;
}
.ev-eeat-verified .bs-ico { width: 14px; height: 14px; }

/* Tier 1 — machine-readable provenance rows */
.ev-eeat-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px 18px;
  padding: 16px 18px; margin-bottom: 16px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
}
.ev-eeat-item { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ev-eeat-label { font-size: 11.5px; font-weight: 800; color: var(--muted); }
.ev-eeat-value { font-size: 14.5px; font-weight: 800; color: var(--deep); }

/* Tier 2 — the "why this date" explanation */
.ev-eeat-why {
  font-size: 14px; line-height: 1.8; color: var(--deep);
  padding-bottom: 18px; margin-bottom: 18px;
  border-bottom: 1px dashed var(--line);
}
.ev-eeat-why a { font-weight: 800; color: var(--brand-purple); white-space: nowrap; }

/* Tier 3 — named contributors, compact inline row */
.ev-eeat-people { margin-bottom: 18px; }
.ev-eeat-people-label {
  display: block; font-size: 11.5px; font-weight: 800;
  color: var(--muted); margin-bottom: 10px;
}
.ev-eeat-people-row { display: flex; flex-wrap: wrap; gap: 10px; }
.ev-eeat-person {
  display: grid; grid-template-columns: auto 1fr; align-items: center;
  column-gap: 10px; row-gap: 0;
  background: #fff; border: 1px solid var(--line);
  border-radius: 12px; padding: 9px 14px 9px 10px;
}
.ev-eeat-person i {
  grid-row: 1 / span 2; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center; font-style: normal;
  background: var(--brand-purple); color: #fff; font-size: 14px; font-weight: 800;
}
.ev-eeat-person em {
  font-style: normal; font-size: 11px; font-weight: 800;
  color: var(--brand-purple); line-height: 1.2;
}
.ev-eeat-person b { font-size: 14px; color: var(--deep); line-height: 1.3; }

/* Tier 4 — policy links */
.ev-eeat-links { display: flex; flex-wrap: wrap; gap: 8px; }
.ev-eeat-links a {
  font-size: 12.5px; font-weight: 800; color: var(--brand-purple);
  background: #fff; border: 1px solid var(--line);
  padding: 7px 13px; border-radius: 999px; text-decoration: none;
}
.ev-eeat-links a:hover { background: var(--lav); border-color: var(--brand-purple); }

@media (max-width: 640px) {
  .ev-eeat { padding: 20px; }
  .ev-eeat-head .h2 { font-size: 19px; }
  .ev-eeat-person { width: 100%; }
}

.ev-trust {
  background: linear-gradient(135deg, var(--deep), var(--deep-2));
  border-radius: var(--radius); padding: 36px; color: #fff; margin-top: 20px;
}
.ev-trust h2 { color: #fff; }
.ev-trust p { color: #b9add8; }
.ev-trust-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 20px; }
.ev-trust-box { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: 18px; display: block; transition: .2s; }
.ev-trust-box:hover { background: rgba(255,255,255,.13); transform: translateY(-2px); }
.ev-trust-box b { display: block; color: #ffe4a0; margin-bottom: 4px; }
.ev-trust-box small { color: #b9add8; }
@media (max-width: 960px) { .ev-trust-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ev-trust-grid { grid-template-columns: 1fr; } }

/* ── Disclaimer ── */
.ev-disclaimer {
  background: var(--cream); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 24px; display: flex; gap: 16px; align-items: flex-start;
}
.ev-disclaimer .mark {
  flex: none; width: 36px; height: 36px; border-radius: 50%;
  background: var(--gold); color: #321742; display: grid; place-items: center;
  font-weight: 900; font-size: 18px;
}
.ev-disclaimer h3 { font-size: 16px; margin-bottom: 6px; }
.ev-disclaimer p { font-size: 13px; color: var(--muted); margin: 0; }

/* ── Article body prose (from DB content blob) ── */
.ev-art { color: #5e4b70; line-height: 1.85; font-size: 15px; }
.ev-art h2, .ev-art h3 { color: var(--deep); margin: 20px 0 8px; font-size: 18px; font-weight: 800;
  border-left: 3px solid var(--brand-magenta); padding-left: 10px; }
.ev-art p { margin-bottom: 12px; }
.ev-art ul, .ev-art ol { padding-left: 20px; margin-bottom: 12px; }
.ev-art li { margin-bottom: 4px; }
.ev-art a { color: var(--brand-magenta); }
.ev-art strong, .ev-art b { color: var(--deep); }

/* ============================================================================
   LISTING PAGES (category + tag) — hero, cards, filters, context
   ============================================================================ */

/* Hero (listing variant: gradient, no rotating images) */
.ev-listing-hero {
  position: relative; overflow: hidden; color: #fff; padding: 0 0 64px;
  background:
    radial-gradient(900px 520px at 18% 12%, rgba(154,5,149,.42), transparent 60%),
    radial-gradient(820px 520px at 84% 8%, rgba(119,173,236,.30), transparent 60%),
    linear-gradient(160deg, var(--deep), var(--deep-2) 55%, var(--deep-3));
}
.ev-listing-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 100px;
  background: linear-gradient(180deg, transparent, var(--cream));
  pointer-events: none;
}
.ev-listing-hero .container { position: relative; z-index: 1; }
.ev-listing-hero-top { padding-top: calc(var(--header-h) + 18px); }
.ev-listing-hero h1 {
  font-size: clamp(32px, 5vw, 52px); font-weight: 900; line-height: 1.15; margin: 12px 0 14px;
}
.ev-listing-hero .lead { color: rgba(255,255,255,.82); font-size: 16px; max-width: 680px; margin-bottom: 20px; }
.ev-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.ev-hero-metrics { display: flex; gap: 18px; }
.ev-metric { text-align: center; }
.ev-metric strong { display: block; font-size: 26px; color: #ffe4a0; }
.ev-metric span { font-size: 12px; color: rgba(255,255,255,.65); }

/* Listing hero: 2-column (text + sidebar card) */
.ev-listing-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 32px; align-items: end; }
@media (max-width: 960px) { .ev-listing-grid { grid-template-columns: 1fr; } }

/* Month / tag summary card (in hero) */
.ev-summary-card {
  background: rgba(24,12,38,.64); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 22px;
  padding: 24px; box-shadow: 0 24px 64px rgba(0,0,0,.26);
}
.ev-summary-card h3 { font-size: 17px; font-weight: 900; color: #ffe4a0; margin-bottom: 14px; }
.ev-summary-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.85); font-size: 14px; }
.ev-summary-row b { color: #ffe4a0; text-align: right; }

/* Context section (month significance / tag meaning) */
.ev-context-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 24px; }
.ev-context-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px; box-shadow: var(--shadow-soft); }
.ev-context-card h3 { font-size: 22px; margin-bottom: 10px; }
.ev-context-card p { color: #5e4b70; }
.ev-context-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ev-context-chip { background: var(--lav); color: var(--brand-purple); border-radius: 999px;
  padding: 6px 14px; font-size: 13px; font-weight: 700; }
.ev-side-info { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 24px; box-shadow: var(--shadow-soft); }
@media (max-width: 960px) { .ev-context-grid { grid-template-columns: 1fr; } }

/* Filter pills */
.ev-controls { position: sticky; top: var(--header-h); z-index: 38;
  background: rgba(255,252,248,.92); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--line); padding: 10px 0; }
.ev-filter-row { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.ev-filter-row::-webkit-scrollbar { display: none; }
.ev-filter-pill {
  flex: 0 0 auto; border: 1px solid var(--line); background: var(--paper);
  color: var(--brand-purple); border-radius: 999px; padding: 7px 14px;
  font-weight: 800; font-size: 13px; cursor: pointer; white-space: nowrap;
}
.ev-filter-pill.active, .ev-filter-pill:hover { background: var(--brand-purple); color: #fff; border-color: var(--brand-purple); }

/* Event card grid */
.ev-list-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 960px) { .ev-list-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ev-list-grid { grid-template-columns: 1fr; } }

.ev-list-card {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; box-shadow: var(--shadow-soft); transition: .22s ease;
}
.ev-list-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: #e0c3f5; }
.ev-list-link { display: block; color: inherit; text-decoration: none; }
.ev-list-img {
  height: 180px; background-size: cover; background-position: center;
  position: relative; display: flex; align-items: flex-start; padding: 12px;
}
.ev-badge {
  display: inline-block; padding: 5px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 800; color: #fff;
}
.ev-badge--upcoming { background: var(--brand-purple); }
.ev-badge--today { background: #178b5f; }
.ev-list-body { padding: 16px 18px 20px; }
.ev-list-body h3 { font-size: 17px; font-weight: 850; margin-bottom: 4px; color: var(--deep); }
.ev-list-cat { font-size: 12px; color: var(--brand-magenta); font-weight: 700; margin-bottom: 6px; }
.ev-list-meta { display: flex; gap: 12px; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.ev-list-tithi { font-size: 13px; color: var(--muted); }

/* Next occurrence card (tag pages) */
.ev-next-card {
  background: rgba(24,12,38,.64); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 22px; padding: 24px;
}
.ev-next-card h3 { color: #ffe4a0; font-size: 17px; font-weight: 900; margin-bottom: 12px; }
.ev-next-cd { display: flex; gap: 10px; margin: 14px 0; }
.ev-next-cd-box {
  flex: 1; text-align: center; border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px; padding: 12px 8px; background: rgba(255,255,255,.06);
}
.ev-next-cd-box strong { display: block; font-size: 28px; color: #fff; }
.ev-next-cd-box span { font-size: 11px; color: rgba(255,255,255,.6); }

/* Load more button */
.ev-load-more-wrap { grid-column: 1 / -1; text-align: center; padding: 20px 0; }
.ev-load-more-btn {
  display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line);
  background: var(--paper); color: var(--brand-purple); border-radius: 999px;
  padding: 12px 28px; font: inherit; font-weight: 800; cursor: pointer; transition: .22s;
}
.ev-load-more-btn:hover { background: var(--lav); }

/* ═══════════ AUTHORITY HUB additions ═══════════ */
/* Quick answer (featured-snippet block) */
.ev-answer{display:flex;gap:16px;align-items:flex-start;padding:22px 26px;border-left:5px solid var(--gold, #f0a500)}
.ev-answer-ic{font-size:30px;line-height:1;flex:0 0 auto;margin-top:2px}
.ev-answer-h{font-size:18px;margin:0 0 6px;color:var(--brand-purple, #560694)}
.ev-answer-p{margin:0;line-height:1.85;color:var(--text, #2a2140);font-size:15.5px}
@media (max-width:640px){.ev-answer{padding:16px 18px;gap:12px}.ev-answer-ic{font-size:24px}}

/* Parana rules */
.ev-parana-card{padding:24px 28px}
.ev-parana-list{margin:0;padding-left:2px;list-style:none;display:flex;flex-direction:column;gap:10px}
.ev-parana-list li{position:relative;padding-left:28px;line-height:1.8;color:var(--text,#2a2140)}
.ev-parana-list li::before{content:"☀️";position:absolute;left:0;top:2px;font-size:15px}
.ev-parana-note{margin-top:16px;padding:12px 16px;background:#fff8e8;border:1px solid #f1dfae;border-radius:12px;font-size:13.5px;color:#7a5a00;line-height:1.7}

/* Featured hub cards (प्रमुख तिथियाँ) */
.ev-feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ev-feat-card{display:block;background:#fff;border:1px solid var(--line,#e9e1f5);border-radius:18px;padding:20px;text-decoration:none;transition:.2s}
.ev-feat-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(86,6,148,.12);border-color:#e0c3f5}
.ev-feat-card h3{margin:0 0 6px;font-size:16px;color:var(--brand-purple,#560694)}
.ev-feat-card p{margin:0 0 10px;font-size:13.5px;line-height:1.6;color:var(--muted,#6f6486)}
.ev-feat-card .more{font-size:13px;font-weight:800;color:var(--brand-magenta,#c026d3)}
@media (max-width:960px){.ev-feat-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.ev-feat-grid{grid-template-columns:1fr}}

/* Topic cluster chips */
.ev-topic-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

/* ── Festival detail: quick-answer compact CTA row (replaces floating side cards) ── */
.ev-answer--single { display: block; }
.ev-answer--single .ev-answer-main { max-width: 860px; margin-inline: auto; }
.ev-answer-ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ev-cta-chip {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); background: #fff; border-radius: 999px;
  padding: 9px 16px; font-size: 13px; font-weight: 800; color: var(--deep);
  transition: transform .15s, box-shadow .15s, border-color .15s; white-space: nowrap;
}
.ev-cta-chip:hover { transform: translateY(-2px); box-shadow: var(--shadow-soft); border-color: #e0c3f5; }
.ev-cta-chip--primary { background: linear-gradient(135deg, var(--gold), #ffd889); border-color: transparent; color: #3a2400; }
@media (max-width: 640px) {
  .ev-answer-ctas { gap: 8px; }
  .ev-cta-chip { flex: 1 1 100%; justify-content: center; white-space: normal; text-align: center; }
}

/* ── Festival detail: hub cluster band ── */
.ev-hub-band-sec { background: var(--lav); }
.ev-hub-band-sec .ev-next-table-wrap { background: var(--paper); }

/* ═══════════════ MONTHLY FESTIVAL HUB (category.php, TYPE C) ═══════════════ */
.ev-listing-hero--hub { padding-bottom: 40px; }
.ev-summary-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; margin-top: 6px; }
.ev-summary-grid2 .ev-summary-row { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.ev-summary-grid2 .ev-summary-row span { font-size: 11px; color: rgba(255,255,255,.6); }
.ev-summary-grid2 .ev-summary-row b { font-size: 14px; color: #fff; }

/* Month nav strip */
.ev-month-nav { background: var(--paper); border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); }
.ev-month-nav-inner { display: flex; gap: 8px; overflow-x: auto; padding: 12px 0; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.ev-month-nav-inner::-webkit-scrollbar { display: none; }
.ev-mn-pill { flex: 0 0 auto; padding: 7px 15px; border-radius: 999px; font-size: 14px; font-weight: 700; color: var(--deep); background: var(--lav); border: 1px solid transparent; white-space: nowrap; transition: .15s; }
.ev-mn-pill:hover { border-color: #e0c3f5; }
.ev-mn-pill.active { background: linear-gradient(135deg, var(--brand-purple), #7d1b9e); color: #fff; }

/* Quick answer card */
.ev-answer-card { background: linear-gradient(135deg,#fff9f1,#fff4fb); border: 1px solid rgba(247,169,31,.3); border-radius: var(--radius); padding: 28px; box-shadow: var(--shadow-soft); }
.ev-answer-card .h2 { margin: 8px 0 12px; }
.ev-answer-card p { font-size: 15.5px; line-height: 1.75; color: var(--deep); }

/* Featured vrats */
.ev-featured-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.ev-feat-card { display: block; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; transition: transform .15s, box-shadow .15s; }
.ev-feat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.ev-feat-date { font-size: 13px; color: var(--muted); margin: 10px 0 6px; }
.ev-feat-card p { font-size: 13.5px; color: var(--deep); margin-bottom: 10px; }
.ev-feat-cta { font-size: 13px; font-weight: 800; color: var(--brand-purple); }

/* Type badges / tags (shared colouring) */
.ev-type-badge { display: inline-block; font-size: 15px; font-weight: 850; color: var(--deep); border-radius: 8px; }
.ev-type-tag { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; color: #fff; }
.ev-type-vrat     { --tc: #7d1b9e; } .ev-type-festival { --tc: #c2410c; }
.ev-type-jayanti  { --tc: #b45309; } .ev-type-diwas    { --tc: #0e7490; }
.ev-type-mela     { --tc: #15803d; }
.ev-type-tag.ev-type-vrat{background:#7d1b9e}.ev-type-tag.ev-type-festival{background:#c2410c}
.ev-type-tag.ev-type-jayanti{background:#b45309}.ev-type-tag.ev-type-diwas{background:#0e7490}
.ev-type-tag.ev-type-mela{background:#15803d}

/* Controls bar */
.ev-controls { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: center; margin-bottom: 22px; position: sticky; top: var(--header-h); z-index: 30; background: rgba(255,252,248,.94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); padding: 12px 0; }
.ev-filter-row { display: flex; flex-wrap: wrap; gap: 8px; }
.ev-chip { padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--deep); background: #fff; border: 1px solid var(--line); cursor: pointer; transition: .15s; }
.ev-chip:hover { border-color: #e0c3f5; }
.ev-chip.active { background: linear-gradient(135deg, var(--brand-purple), #7d1b9e); color: #fff; border-color: transparent; }
.ev-view-row { display: flex; gap: 10px; align-items: center; }
.ev-view-switch { display: inline-flex; background: var(--lav); border-radius: 999px; padding: 3px; }
.ev-vbtn { padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 700; border: none; background: transparent; color: var(--deep); cursor: pointer; }
.ev-vbtn.active, .ev-vbtn.is-active { background: #fff; box-shadow: var(--shadow-soft); color: var(--brand-purple); }
.ev-sort { padding: 7px 12px; border-radius: 10px; border: 1px solid var(--line); font-size: 13px; background: #fff; color: var(--deep); }

/* Festival cards (gradient-header design) */
.ev-fcard { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; transition: transform .15s, box-shadow .15s; }
.ev-fcard:hover { transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.ev-fcard.is-past { opacity: .62; }
.ev-fcard-head { position: relative; display: block; }
.ev-fcard-head img { width: 100%; height: 160px; object-fit: cover; display: block; }
.ev-fcard-head h3 { position: absolute; left: 14px; right: 14px; bottom: 12px; margin: 0; color: #fff; font-size: 19px; text-shadow: 0 2px 10px rgba(0,0,0,.6); }
.ev-fcard-head::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.72)); }
.ev-fcard-head h3, .ev-fcard-badge { z-index: 2; }
.ev-fcard-badge { position: absolute; top: 12px; left: 12px; background: linear-gradient(135deg, var(--brand-purple), #7d1b9e); color: #fff; font-size: 12px; font-weight: 800; padding: 5px 12px; border-radius: 999px; }
.ev-fcard.is-past .ev-fcard-badge { background: #6b7280; }
.ev-fcard-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.ev-fcard-row { display: flex; justify-content: space-between; font-size: 13.5px; gap: 12px; }
.ev-fcard-row span { color: var(--muted); } .ev-fcard-row b { color: var(--deep); text-align: right; }
.ev-fcard-cta { margin-top: 8px; font-size: 13px; text-align: center; }

/* Calendar table */
.ev-cal-table { width: 100%; border-collapse: collapse; background: var(--paper); border-radius: var(--radius); overflow: hidden; }
.ev-cal-table th { background: var(--lav); text-align: right; padding: 12px 14px; font-size: 13px; color: var(--deep); }
.ev-cal-table th:first-child, .ev-cal-table td:first-child { text-align: left; }
.ev-cal-table td { padding: 12px 14px; border-top: 1px solid var(--line); font-size: 13.5px; }
.ev-cal-table td a { color: var(--brand-purple); font-weight: 700; }
.ev-table-btn { display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--lav); font-size: 12px; font-weight: 700; color: var(--deep); }
.ev-noresult { text-align: center; color: var(--muted); padding: 30px; }

/* Do/Don't */
.ev-dodont { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ev-dodont-col { border-radius: var(--radius); padding: 22px; border: 1px solid var(--line); }
.ev-do   { background: linear-gradient(180deg,#f0fdf4,#fff); border-color: #bbf7d0; }
.ev-dont { background: linear-gradient(180deg,#fef2f2,#fff); border-color: #fecaca; }
.ev-dodont-col h3 { margin-bottom: 12px; font-size: 18px; }
.ev-dodont-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.ev-dodont-col li { font-size: 14px; color: var(--deep); padding-left: 22px; position: relative; }
.ev-do li::before   { content: "✓"; position: absolute; left: 0; color: #16a34a; font-weight: 800; }
.ev-dont li::before { content: "✕"; position: absolute; left: 0; color: #dc2626; font-weight: 800; }

/* Hub links */
.ev-hublink-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.ev-hublink { display: flex; flex-direction: column; gap: 4px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; transition: .15s; }
.ev-hublink:hover { transform: translateY(-2px); box-shadow: var(--shadow-soft); border-color: #e0c3f5; }
.ev-hublink b { font-size: 15px; color: var(--deep); } .ev-hublink small { font-size: 12.5px; color: var(--brand-purple); font-weight: 700; }

/* FAQ */
.ev-faq { display: grid; gap: 10px; }
.ev-faq-item { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.ev-faq-item summary { cursor: pointer; padding: 15px 18px; font-weight: 800; font-size: 15px; color: var(--deep); list-style: none; display: flex; justify-content: space-between; align-items: center; }
.ev-faq-item summary::-webkit-details-marker { display: none; }
.ev-faq-item summary::after { content: "+"; font-size: 20px; color: var(--brand-purple); }
.ev-faq-item[open] summary::after { content: "−"; }
.ev-faq-a { padding: 0 18px 16px; font-size: 14px; line-height: 1.7; color: var(--deep); }

/* Ad slot (min-height reserved → protects CLS; AD-COMPLIANCE §5.2) */
.ev-ad-slot { grid-column: 1 / -1; min-height: 100px; }

/* Responsive */
@media (max-width: 960px) {
  .ev-featured-grid, .ev-hublink-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .ev-featured-grid, .ev-hublink-grid, .ev-dodont, .ev-summary-grid2 { grid-template-columns: 1fr; }
  .ev-controls { flex-direction: column; align-items: stretch; }
  .ev-view-row { justify-content: space-between; }
  .ev-cal-table { font-size: 12.5px; }
  .ev-cal-table th, .ev-cal-table td { padding: 9px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .ev-fcard, .ev-feat-card, .ev-hublink { transition: none; }
}

/* ═══════════ CATEGORY HUB — POLISH FIXES ═══════════ */
/* Fix: Quick Stats used a dark-card component (.ev-info-list = white text) on a
   light .ev-side-info card → labels were invisible. Re-tone for light bg. */
.ev-side-info .ev-info-list { color: var(--muted); }
.ev-side-info .ev-info-list > div { border-top-color: var(--line); }
.ev-side-info .ev-info-list b { color: var(--deep); }

/* Fix: quick-answer card spanned full 1120px with 2 sentences → cap + centre */
#quick .ev-answer-card { max-width: 880px; margin-inline: auto; }

/* Polish: colour featured-vrat titles by event type for scan-ability */
.ev-type-badge { color: var(--tc, var(--deep)); }

/* Fix: empty ad slot reserved 100px mid-grid (visible gap before ads are live).
   Collapse while empty; height is reserved again the moment a unit is inserted. */
.ev-ad-slot:empty { min-height: 0; }

/* ═══════════ CATEGORY HUB — BUGFIX PASS ═══════════ */
/* Bug 6 (ROOT CAUSE): the [hidden] attribute was being overridden by
   .ev-list-grid{display:grid}, so cards never hid when switching to table.
   This guard makes [hidden] win for view panels AND filtered items. */
[data-view-panel][hidden] { display: none !important; }
[data-item][hidden] { display: none !important; }

/* Bug 2: breadcrumb sat under the sticky header — give the hero clean top room */
.ev-listing-hero { padding-top: calc(var(--header-h) + 22px); }
.ev-listing-hero .ev-bc { margin-bottom: 18px; }
@media (max-width: 640px) { .ev-listing-hero { padding-top: calc(var(--header-h) + 14px); } }

/* Bug 1: dashboard card alignment — consistent rhythm, no awkward wraps */
.ev-summary-card { align-self: start; }
.ev-summary-card h3 { font-size: 20px; line-height: 1.3; margin-bottom: 14px; }
.ev-summary-grid2 .ev-summary-row { min-height: 46px; justify-content: center; }
.ev-summary-grid2 .ev-summary-row b { line-height: 1.35; }

/* Bug 4: trust cards as links */
.ev-trust-box--link { display: block; transition: transform .15s, background .15s; }
.ev-trust-box--link:hover { transform: translateY(-2px); background: rgba(255,255,255,.08); }
.ev-trust-box--link small { color: #ffe4a0; }

/* Bug 9: consistent section rhythm + card breathing room */
.ev-list-grid { gap: 22px; }
@media (max-width: 640px) {
  .ev-controls { position: static; padding: 0 0 8px; }  /* don't cover content on small screens */
  .ev-fcard-head img { height: 150px; }
}

/* ═══════════ SUMMARY CARD v2 — clean label/value list (alignment fix) ═══════════ */
.ev-summary-list { display: flex; flex-direction: column; margin-top: 6px; }
.ev-summary-list .ev-summary-row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 18px;
  padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.12);
}
.ev-summary-list .ev-summary-row:last-child { border-bottom: none; }
.ev-summary-list .ev-summary-row span { font-size: 12.5px; color: rgba(255,255,255,.62); flex: 0 0 auto; }
.ev-summary-list .ev-summary-row b { font-size: 14.5px; color: #fff; text-align: right; line-height: 1.45; }

/* ═══════════════ FESTIVAL HOME HUB (index.php) ═══════════════ */
/* Quick chip strip (hub shortcuts under hero) */
.ev-quick-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 12px; padding: 18px; }
.ev-quick-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; padding: 14px 8px; border-radius: 16px; border: 1px solid var(--line); background: #fff; transition: transform .15s, box-shadow .15s, border-color .15s; }
.ev-quick-item:hover { transform: translateY(-3px); box-shadow: var(--shadow-soft); border-color: #e0c3f5; }
.ev-quick-icon { width: 42px; height: 42px; border-radius: 13px; background: #fff1d6; display: grid; place-items: center; font-size: 21px; margin-bottom: 5px; }
.ev-quick-item b { font-size: 14px; color: var(--deep); }
.ev-quick-item span:last-child { font-size: 11.5px; color: var(--muted); }

/* Today signals */
.ev-special-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ev-special-card { background: var(--paper); border: 1px solid var(--line); border-radius: 20px; padding: 18px; box-shadow: 0 8px 22px rgba(57,18,91,.06); transition: transform .18s, box-shadow .18s; }
.ev-special-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.ev-special-icon { width: 44px; height: 44px; border-radius: 14px; background: #fff1d6; display: grid; place-items: center; font-size: 22px; margin-bottom: 12px; }
.ev-special-card h3 { font-size: 17px; margin-bottom: 5px; color: var(--deep); }
.ev-special-card p { font-size: 13px; color: var(--muted); line-height: 1.6; }
.ev-special-card a { display: inline-flex; margin-top: 10px; font-weight: 800; font-size: 13px; color: var(--brand-purple); }

/* Current-month dashboard teaser */
.ev-month-teaser { display: grid; grid-template-columns: 1.25fr .75fr; gap: 20px; align-items: stretch; }
.ev-month-teaser-main { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; box-shadow: var(--shadow-soft); }
.ev-month-teaser-main h3 { font-size: 24px; color: var(--deep); margin-bottom: 8px; }
.ev-month-teaser-lead { font-size: 14px; color: var(--muted); line-height: 1.7; margin-bottom: 14px; }
.ev-month-teaser-events { display: grid; gap: 10px; }
.ev-mt-event { display: flex; flex-direction: column; gap: 2px; background: var(--lav); border-radius: 14px; padding: 11px 14px; transition: background .15s; }
.ev-mt-event:hover { background: #efe0ff; }
.ev-mt-event b { font-size: 14.5px; color: var(--deep); }
.ev-mt-event span { font-size: 12.5px; color: var(--muted); }
.ev-month-teaser-side { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow-soft); }
.ev-month-teaser-side h4 { font-size: 15px; color: var(--deep); margin-bottom: 12px; }
.ev-month-pills { display: flex; flex-wrap: wrap; gap: 8px; }

/* Tools band */
.ev-tools-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ev-tools-card { background: linear-gradient(135deg, #2a0a4e, #560694); color: #fff; border-radius: var(--radius); padding: 26px; }
.ev-tools-card h3 { font-size: 19px; margin-bottom: 8px; color: #ffe4a0; }
.ev-tools-card p { font-size: 13.5px; color: rgba(255,255,255,.82); line-height: 1.65; margin-bottom: 14px; }
.ev-tool-list { display: flex; flex-wrap: wrap; gap: 9px; }
.ev-tool { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 8px 14px; font-size: 13px; font-weight: 700; color: #fff; transition: background .15s; }
.ev-tool:hover { background: rgba(255,255,255,.2); }

@media (max-width: 960px) {
  .ev-special-grid { grid-template-columns: 1fr 1fr; }
  .ev-month-teaser, .ev-tools-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .ev-special-grid { grid-template-columns: 1fr; }
  .ev-quick-panel { grid-template-columns: repeat(2, 1fr); }
}

/* ═══════════ HOME HERO gap fix + header home icon ═══════════ */
/* The home template wraps the breadcrumb in .ev-listing-hero-top, which carries
   its own header-h padding — stacking on the section's header-h padding into a
   double gap. Collapse to ONE clearance: section provides it, wrapper adds none. */
.ev-listing-hero--home { padding-top: calc(var(--header-h) + 16px); }
.ev-listing-hero--home .ev-listing-hero-top { padding-top: 0; }
.ev-listing-hero--home .ev-listing-grid { align-items: start; }
.ev-listing-hero--home .ev-bc { margin-bottom: 12px; }
@media (max-width: 640px) { .ev-listing-hero--home { padding-top: calc(var(--header-h) + 10px); } }

/* Header home icon (canonical header, before first nav group) */
.nav-home { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; color: var(--brand-purple); transition: background .15s, color .15s; }
.nav-home:hover { background: var(--lav); color: var(--brand-magenta); }
@media (max-width: 991px) { .nav-home { display: none; } }

/* ═══════════ 404 PAGE ═══════════ */
.ev-404-hero { padding-top: calc(var(--header-h) + 40px); padding-bottom: 56px; text-align: center; }
.ev-404-box { max-width: 720px; margin-inline: auto; }
.ev-404-num { font-size: clamp(96px, 18vw, 190px); font-weight: 900; line-height: 1; letter-spacing: 2px;
  background: linear-gradient(135deg, #ffe4a0, #f6a41f 55%, #ff8fd6); -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 60px rgba(246,164,31,.35); margin-bottom: 10px; }
.ev-404-box h1 { font-size: clamp(26px, 4vw, 40px); font-weight: 900; margin-bottom: 12px; color: #fff; }
.ev-404-box .lead { color: rgba(255,255,255,.82); font-size: 16px; max-width: 560px; margin: 0 auto 18px; }
@media (prefers-reduced-motion: no-preference) {
  .ev-404-num { animation: ev404glow 3.2s ease-in-out infinite; }
  @keyframes ev404glow { 0%,100% { text-shadow: 0 0 40px rgba(246,164,31,.28); } 50% { text-shadow: 0 0 70px rgba(255,143,214,.45); } }
}


/* ═══════════════ MONTH CATEGORY HERO — REAL BANNER + 12-MONTH FX ═══════════════
   Replaces the earlier CSS-gradient/motif system now that real photography
   exists per month (1584×672, uploaded to assets/img/). Layering:
     bg (photo)  →  fx (subtle motion)  →  overlay (legibility gradient)  →  content
   All fx are transform/opacity only, pointer-events:none, aria-hidden, and
   fully disabled under prefers-reduced-motion. Particle counts kept minimal —
   most effects render as ONE element (box-shadow multi-point technique) so
   DOM weight stays negligible regardless of how "busy" the effect looks.
   ══════════════════════════════════════════════════════════════════════ */

.bs-month-hero { position: relative; overflow: hidden; background: var(--deep); }
/* When a photo hero is active, the legacy .ev-listing-hero gradient must not
   paint over/compete with the banner — the photo + overlay handle the bg. */
.ev-listing-hero.bs-month-hero { background: var(--deep); }
.bs-month-hero__bg {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%; object-fit: cover; object-position: center;
}
.bs-month-hero__fx { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.bs-month-hero__overlay {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(100deg, rgba(18,8,36,.86) 0%, rgba(18,8,36,.62) 42%, rgba(18,8,36,.30) 72%, rgba(18,8,36,.12) 100%);
}
.bs-month-hero > .container { position: relative; z-index: 3; }

/* ═══════════════ 12-MONTH HERO FX — spec-exact, CSS-only ═══════════════
   Each particle is an independent element (transform+opacity only). Rain uses
   discrete short streaks (one <i> per drop), NOT a box-shadow line — that was
   the "long vertical lines" bug. All opacities/durations match the brief.
   Layer sits z-1 (above banner z-0, below overlay z-2 / content z-3). */
.bs-month-hero__fx i { position: absolute; display: block; pointer-events: none; will-change: transform, opacity; }

/* ── चैत्र — spring-petals: 6 mango-leaf/petal shapes drift top-right→bottom-left ── */
.bs-fx-petal {
  width: 12px; height: 16px; border-radius: 0 70% 0 70%; top: -6%;
  right: calc(8% + (var(--i) * 15%));
  background: linear-gradient(150deg, #ffc2e0, #ff85bd);
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.2)); opacity: 0;
  animation: bsPetalDrift 21s linear infinite; animation-delay: calc(var(--i) * -3.5s);
}
@keyframes bsPetalDrift {
  0%   { transform: translate(0,-10%) rotate(0deg); opacity: 0; }
  10%  { opacity: .18; }
  90%  { opacity: .18; }
  100% { transform: translate(-160px, 340px) rotate(300deg); opacity: 0; }
}

/* ── वैशाख — ganga-sun-glint: sun shimmer top-right + 2 water-glint lines ── */
.bs-month-hero__fx--sun-water::before {
  content: ""; position: absolute; top: -12%; right: -6%; width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,214,110,.12), transparent 70%);
  animation: bsSunPulse 16s ease-in-out infinite;
}
.bs-month-hero__fx--sun-water .bs-fx-glint,
.bs-month-hero__fx--sun-water i {
  left: 6%; right: 6%; width: auto; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  opacity: .12; animation: bsGlint 16s ease-in-out infinite;
}
/* two glint lines placed via nth-of-type when present; fallback single via ::after */
.bs-month-hero__fx--sun-water::after {
  content: ""; position: absolute; left: 8%; right: 8%; bottom: 26%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  opacity: .12; animation: bsGlint 18s ease-in-out infinite .5s;
}
@keyframes bsSunPulse { 0%,100% { opacity: .5; transform: scale(1); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes bsGlint { 0%,100% { opacity: .06; transform: translateX(-10px); } 50% { opacity: .18; transform: translateX(10px); } }

/* ── ज्येष्ठ — summer-haze: warm golden heat-haze sweeping left→right ── */
.bs-month-hero__fx--heat-haze::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 25%, rgba(255,196,90,.10) 50%, transparent 75%);
  background-size: 240% 240%;
  animation: bsHazeSweep 19s ease-in-out infinite;
}
@keyframes bsHazeSweep { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

/* ── आषाढ़ / श्रावण / भाद्रपद shared drop — SHORT discrete rain streaks ── */
.bs-fx-drop {
  width: 2px; height: 18px; border-radius: 2px; top: -12%;
  right: calc(3% + (var(--i) * 3.6%));
  background: linear-gradient(180deg, transparent, rgba(180,225,255,.9));
  opacity: 0; animation: bsRainDrop 2.3s linear infinite;
  animation-delay: calc(var(--i) * -0.19s);
}
@keyframes bsRainDrop {
  0%   { transform: translateY(0); opacity: 0; }
  10%  { opacity: .2; }
  85%  { opacity: .2; }
  100% { transform: translateY(360px); opacity: 0; }
}
/* आषाढ़ first-rain: slightly faster, tighter to the right edge (12 drops) */
.bs-month-hero__fx--rain-right .bs-fx-drop { animation-duration: 2s; }

/* ── श्रावण — monsoon-bel-rain: rain + 2 slow floating bel leaves ── */
.bs-month-hero__fx--rain-leaves .bs-fx-drop { animation-duration: 2.1s; }
.bs-fx-leaf {
  width: 13px; height: 9px; border-radius: 60% 60% 50% 50%; top: 24%;
  right: calc(10% + (var(--i) * 12%));
  background: linear-gradient(160deg, #74b06d, #4d8a4d);
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.2)); opacity: 0;
  animation: bsBelFloat 18s ease-in-out infinite; animation-delay: calc(var(--i) * -8s);
}
@keyframes bsBelFloat {
  0%   { transform: translate(0,0) rotate(0deg); opacity: 0; }
  15%  { opacity: .18; }
  85%  { opacity: .18; }
  100% { transform: translate(-40px, 90px) rotate(45deg); opacity: 0; }
}

/* ── भाद्रपद — monsoon-festival-glow: 5 golden particles drift UP, post-rain glow ── */
.bs-month-hero__fx--rain-afterglow::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(600px 300px at 80% 60%, rgba(255,196,120,.10), transparent 70%);
}
.bs-fx-festglow {
  width: 5px; height: 5px; border-radius: 50%; bottom: 10%;
  right: calc(8% + (var(--i) * 9%));
  background: rgba(255,208,130,.9); box-shadow: 0 0 6px 1px rgba(255,196,90,.5);
  opacity: 0; animation: bsFestRise 12s ease-in-out infinite; animation-delay: calc(var(--i) * -2.4s);
}
@keyframes bsFestRise {
  0%   { transform: translateY(0); opacity: 0; }
  20%  { opacity: .16; }
  80%  { opacity: .16; }
  100% { transform: translateY(-140px); opacity: 0; }
}

/* ── आश्विन — navratri-sparks: 6 saffron-gold sparks rise on the right ── */
.bs-fx-spark {
  width: 4px; height: 4px; border-radius: 50%; bottom: 8%;
  right: calc(6% + (var(--i) * 8%));
  background: rgba(255,180,60,.95); box-shadow: 0 0 6px 1px rgba(255,170,50,.55);
  opacity: 0; animation: bsSparkRise 10s ease-out infinite; animation-delay: calc(var(--i) * -1.6s);
}
@keyframes bsSparkRise {
  0%   { transform: translateY(0) scale(1); opacity: 0; }
  15%  { opacity: .18; }
  100% { transform: translateY(-180px) scale(.6); opacity: 0; }
}

/* ── कार्तिक — diya-fireflies: 8 warm glow dots twinkle near bottom-right ── */
.bs-fx-firefly {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(255,206,120,.95); box-shadow: 0 0 8px 2px rgba(255,190,90,.5);
  bottom: calc(6% + (var(--i) * 5%)); right: calc(4% + (var(--i) * 7%));
  opacity: 0; animation: bsFirefly 4s ease-in-out infinite; animation-delay: calc(var(--i) * -0.5s);
}
@keyframes bsFirefly {
  0%,100% { opacity: .05; transform: scale(.8) translateY(0); }
  50%     { opacity: .2;  transform: scale(1.15) translateY(-6px); }
}

/* ── मार्गशीर्ष — divine-dust-rays: diagonal golden rays + 6 floating dust ── */
.bs-month-hero__fx--divine-rays::before {
  content: ""; position: absolute; top: -40%; right: -25%; width: 480px; height: 480px;
  background: conic-gradient(from 210deg, transparent 0deg, rgba(255,230,180,.10) 34deg, transparent 78deg, rgba(255,230,180,.07) 150deg, transparent 210deg);
  animation: bsRaysTurn 22s linear infinite;
}
@keyframes bsRaysTurn { to { transform: rotate(360deg); } }
.bs-fx-dust {
  width: 3px; height: 3px; border-radius: 50%; background: rgba(255,240,210,.8);
  top: calc(18% + (var(--i) * 12%)); right: calc(14% + (var(--i) * 11%));
  opacity: 0; animation: bsDustFloat 21s ease-in-out infinite; animation-delay: calc(var(--i) * -3.4s);
}
@keyframes bsDustFloat {
  0%,100% { opacity: .04; transform: translate(0,0); }
  50%     { opacity: .10; transform: translate(-12px,-18px); }
}

/* ── पौष — winter-mist-sun: 3 mist bands drift + warm sun pulse top-right ── */
.bs-fx-mist {
  left: -30%; width: 60%; height: 12px; border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(230,236,248,.5), transparent);
  top: calc(40% + (var(--i) * 16%)); opacity: .12;
  animation: bsMistDrift 24s ease-in-out infinite; animation-delay: calc(var(--i) * -6s);
}
@keyframes bsMistDrift { 0%,100% { transform: translateX(0); opacity: .06; } 50% { transform: translateX(70%); opacity: .12; } }
.bs-month-hero__fx--mist-sun::after {
  content: ""; position: absolute; top: -10%; right: -4%; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,196,110,.12), transparent 70%);
  animation: bsSunPulse 24s ease-in-out infinite;
}

/* ── माघ — moon-mist-water: cold mist bands + moon-glow pulse + water shimmer ── */
.bs-month-hero__fx--mist-moon .bs-fx-mist {
  background: linear-gradient(90deg, transparent, rgba(205,220,245,.5), transparent);
  animation-duration: 22s;
}
.bs-month-hero__fx--mist-moon::before {
  content: ""; position: absolute; top: -6%; right: 5%; width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(220,232,255,.14), transparent 70%);
  animation: bsSunPulse 20s ease-in-out infinite;
}
.bs-month-hero__fx--mist-moon::after {
  content: ""; position: absolute; left: 8%; right: 8%; bottom: 14%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(200,220,255,.4), transparent);
  opacity: .12; animation: bsGlint 20s ease-in-out infinite;
}

/* ── फाल्गुन — holi-color-haze: 4 soft powder-cloud blobs drift at edges ── */
.bs-fx-cloud {
  width: 150px; height: 150px; border-radius: 50%; opacity: .13;
  animation: bsCloudDrift 21s ease-in-out infinite; animation-delay: calc(var(--i) * -5s);
}
.bs-fx-cloud[style*="--i:0"] { background: radial-gradient(circle, #ff8fc4, transparent 70%); top: -8%; left: -4%; }
.bs-fx-cloud[style*="--i:1"] { background: radial-gradient(circle, #ffb84d, transparent 70%); top: -6%; right: -4%; left: auto; }
.bs-fx-cloud[style*="--i:2"] { background: radial-gradient(circle, #b78af0, transparent 70%); bottom: -8%; left: 6%; top: auto; }
.bs-fx-cloud[style*="--i:3"] { background: radial-gradient(circle, #ff9de0, transparent 70%); bottom: -6%; right: 4%; left: auto; top: auto; }
@keyframes bsCloudDrift { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-26px, 14px); } }

/* ── Reduced motion: freeze all fx to a calm static frame ── */
@media (prefers-reduced-motion: reduce) {
  .bs-month-hero__fx i,
  .bs-month-hero__fx::before, .bs-month-hero__fx::after { animation: none !important; }
}

/* ── Mobile: thin particle counts + soften glows (never remove the layer) ── */
@media (max-width: 640px) {
  .bs-fx-petal:nth-of-type(n+4), .bs-fx-drop:nth-of-type(n+8),
  .bs-fx-firefly:nth-of-type(n+5), .bs-fx-spark:nth-of-type(n+4),
  .bs-fx-dust:nth-of-type(n+4), .bs-fx-festglow:nth-of-type(n+4),
  .bs-fx-cloud:nth-of-type(n+3) { display: none; }
  .bs-month-hero__fx--divine-rays::before,
  .bs-month-hero__fx--sun-water::before,
  .bs-month-hero__fx--mist-sun::after { opacity: .6; }
}


   Re-added to this (season) CSS branch: an earlier branch had it but the
   animation work built on a branch that didn't, so the deployed CSS shipped
   icons with NO size rule → they rendered at unconstrained default size
   (huge in headings). This block is the single source of truth for icon size. */

/* Base: inline icons scale to the text they sit beside, but capped so a large
   heading (e.g. do/dont <h3>) can never blow the icon up to card size. */
.bs-ico {
  width: 1em; height: 1em; max-width: 22px; max-height: 22px;
  display: inline-block; vertical-align: -0.14em; flex-shrink: 0;
}

/* Raster illustrated icons (bs_icon 'type'=>'img' entries) — object-fit so the
   128px source WebP scales cleanly at every size below without distortion. */
.bs-ico-img {
  width: 1em; height: 1em; max-width: 22px; max-height: 22px;
  display: inline-block; vertical-align: -0.14em; flex-shrink: 0;
  object-fit: contain;
}

/* Fixed-size icon CIRCLES — the icon should fill a consistent portion of the
   tile regardless of surrounding font-size. Override the em-based sizing.
   Both the SVG (.bs-ico) and raster (.bs-ico-img) icon classes are covered so
   illustrated icons match the home ev-quick-panel / card-grid sizing. */
.ev-quick-icon .bs-ico, .ev-quick-icon .bs-ico-img,
.ev-special-icon .bs-ico, .ev-special-icon .bs-ico-img { width: 22px; height: 22px; max-width: 22px; max-height: 22px; }
.cat-card .ico .bs-ico, .cat-card .ico .bs-ico-img,
.ico .bs-ico, .ico .bs-ico-img { width: 24px; height: 24px; max-width: 24px; max-height: 24px; }

/* Do/Don't headings — icon matched to heading text, not oversized */
.ev-do h3 .bs-ico, .ev-dont h3 .bs-ico,
.ev-do h4 .bs-ico, .ev-dont h4 .bs-ico { width: 18px; height: 18px; vertical-align: -0.16em; margin-inline-end: 4px; }
.ev-do  h3 .bs-ico { color: #178b5f; }
.ev-dont h3 .bs-ico { color: #b23850; }

/* Inline badges / buttons / chips — small, aligned to the label */
.ev-badge .bs-ico, .btn .bs-ico, .ev-cta-chip .bs-ico,
.ev-tool .bs-ico, .ev-hero-badge-icon .bs-ico,
.ev-badge .bs-ico-img, .btn .bs-ico-img, .ev-cta-chip .bs-ico-img,
.ev-tool .bs-ico-img, .ev-hero-badge-icon .bs-ico-img { width: 16px; height: 16px; vertical-align: -0.15em; }
/* Tools-card headings (dark gradient card): icon must match the 19px heading,
   not fall through to the 1em/22px base which reads as oversized here. */
.ev-tools-card h3 .bs-ico { width: 18px; height: 18px; vertical-align: -0.16em; margin-inline-end: 6px; color: #ffe4a0; }
.ev-tool { display: inline-flex; align-items: center; gap: 6px; }
.ev-tool .bs-ico { flex: 0 0 16px; }
.nav-home .bs-ico { width: 20px; height: 20px; }
.ev-preferred-icon .bs-ico { width: 32px; height: 32px; max-width: 32px; max-height: 32px; }
/* Home hero-card diya (dark background, white variant) — larger accent size */
.ev-hero-diya .bs-ico-img { width: 34px; height: 34px; max-width: 34px; max-height: 34px; }

/* Colour: accent circles read purple; icons on dark sections inherit currentColor */
.ev-quick-icon, .ev-special-icon { color: var(--brand-purple); }