/* ══════════════════════════════════════════════════════════════════════════
   UI-OVERRIDES.CSS: SRA DESIGN POLISH & ACCESSIBILITY SPECIFICATION
   Universal visual polish layer across shriramjiastro.in
   Linked LAST on every page. Rollback = remove one line.
   ══════════════════════════════════════════════════════════════════════════ */

/* 1. PALETTE DEFINITIONS & CARD BACKGROUND VARIABLES */
:root {
  --card-bg: #FFFFFF;
  --theme-bg: #FCFBF7;
  --theme-surface: #FFFFFF;
  --theme-text: #1E293B;
  --theme-muted: #64748B;
  --theme-gold: #C5A059;
  --theme-good: #10B981;
  --theme-bad: #EF4444;
  --font-display: 'Cinzel', 'Rozha One', 'Tiro Devanagari Hindi', serif;
  --font-body: 'Plus Jakarta Sans', 'Noto Sans Devanagari', system-ui, -apple-system, sans-serif;
}

[data-theme="night"] {
  --card-bg: #140A2B !important;
  --theme-bg: #0B0716 !important;
  --theme-surface: #140A2B !important;
  --theme-text: #F3EEFF !important;
  --theme-muted: #B9ABD6 !important;
  --theme-gold: #E8C766 !important;
  --theme-good: #4ADE80 !important;
  --theme-bad: #F87171 !important;

  /* Global Framework Theme Sync */
  --bg: #0B0716 !important;
  --bg2: #140A2B !important;
  --card: #140A2B !important;
  --card2: #1D103A !important;
  --text: #F3EEFF !important;
  --muted: #B9ABD6 !important;
  --heading-color: #F3EEFF !important;
  --gold: #E8C766 !important;
  --gold-dark: #E8C766 !important;
  --gold2: #F1D98D !important;
  --gold-border: rgba(232, 199, 102, 0.25) !important;
  --gold-dim: rgba(232, 199, 102, 0.12) !important;
  --green: #4ADE80 !important;
  --red: #F87171 !important;
}

/* 2. NIGHT-MODE CONTRAST (>= 4.5:1) AND TINTED COMPONENT RECTIFICATION */
[data-theme="night"] body {
  background-color: #0B0716 !important;
  color: #F3EEFF !important;
}

[data-theme="night"] #social-hub,
[data-theme="night"] #desktopPanchangSection,
[data-theme="night"] .seo-authority-block,
[data-theme="night"] .app-glass-panel,
[data-theme="night"] .boxed-card,
[data-theme="night"] .report-card,
[data-theme="night"] .social-block,
[data-theme="night"] .app-service-card,
[data-theme="night"] .scarcity-matrix-card,
[data-theme="night"] .panchang-card,
[data-theme="night"] .panchang-limb-box,
[data-theme="night"] .daily-panchang-table,
[data-theme="night"] .sra-master-ecosystem,
[data-theme="night"] .sra-master-ecosystem div[style*="background:#fff"],
[data-theme="night"] .sra-master-ecosystem div[style*="background: #fff"],
[data-theme="night"] .hero,
[data-theme="night"] .calendar-card,
[data-theme="night"] .intake-card,
[data-theme="night"] .cal-slot,
[data-theme="night"] .slide-nav-btn,
[data-theme="night"] .btn-lang,
[data-theme="night"] .modal,
[data-theme="night"] #modalMobileOtp > div {
  background: #140A2B !important;
  background-color: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.22) !important;
  color: #F3EEFF !important;
}

/* Global Form Controls in Night Mode */
[data-theme="night"] input,
[data-theme="night"] select,
[data-theme="night"] textarea,
[data-theme="night"] .form-control {
  background-color: #0B0716 !important;
  color: #F3EEFF !important;
  border-color: rgba(232, 199, 102, 0.3) !important;
}

/* Report-card prices & discounts */
[data-theme="night"] .report-price-now {
  color: #E8C766 !important;
  font-weight: 800 !important;
}
[data-theme="night"] .report-price-old {
  color: #B9ABD6 !important;
  opacity: 0.8 !important;
}
[data-theme="night"] .report-discount-tag {
  background: rgba(74, 222, 128, 0.18) !important;
  color: #4ADE80 !important;
  border: 1px solid rgba(74, 222, 128, 0.45) !important;
  font-weight: 700 !important;
}
[data-theme="night"] .report-card-badge {
  color: #FFFFFF !important;
}
[data-theme="night"] .report-card-title,
[data-theme="night"] .block-title {
  color: #F3EEFF !important;
}
[data-theme="night"] .report-card-desc,
[data-theme="night"] .block-sub {
  color: #B9ABD6 !important;
}

/* YouTube & Instagram Outline Buttons */
[data-theme="night"] .social-btn.yt-btn {
  background: rgba(255, 107, 107, 0.12) !important;
  border: 1px solid rgba(255, 107, 107, 0.45) !important;
  color: #FF7B7B !important;
}
[data-theme="night"] .social-btn.yt-btn:hover {
  background: #E11D48 !important;
  color: #FFFFFF !important;
}
[data-theme="night"] .social-btn.insta-btn {
  background: rgba(244, 114, 182, 0.12) !important;
  border: 1px solid rgba(244, 114, 182, 0.45) !important;
  color: #F472B6 !important;
}
[data-theme="night"] .social-btn.insta-btn:hover {
  background: #D946EF !important;
  color: #FFFFFF !important;
}

/* Sacred Protocol / Scarcity Small Lines */
[data-theme="night"] div[style*="var(--gold-dark)"],
[data-theme="night"] span[style*="var(--gold-dark)"] {
  color: #E8C766 !important;
}
[data-theme="night"] div[style*="var(--green)"],
[data-theme="night"] span[style*="var(--green)"] {
  color: #4ADE80 !important;
}
[data-theme="night"] div[style*="var(--muted)"],
[data-theme="night"] p[style*="var(--muted)"],
[data-theme="night"] span[style*="var(--muted)"] {
  color: #B9ABD6 !important;
}

/* Avakahada Last-Cell & Classical Strong Highlights */
[data-theme="night"] #avakahadaTable strong,
[data-theme="night"] .avakahada-table strong,
[data-theme="night"] strong[style*="var(--primary"],
[data-theme="night"] strong[style*="#7C1305"] {
  color: #E8C766 !important;
}
[data-theme="night"] #avakahadaTable td,
[data-theme="night"] .avakahada-table td {
  color: #F3EEFF !important;
  border-bottom: 1px solid rgba(232, 199, 102, 0.15) !important;
}

/* Panchang Tinted Tiles: Abhijit / Choghadiya / Rahu Kalam */
[data-theme="night"] .muhurta-item {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.2) !important;
  color: #F3EEFF !important;
}
[data-theme="night"] .muhurta-item-name {
  color: #F3EEFF !important;
}
[data-theme="night"] .muhurta-item-time {
  color: #E8C766 !important;
}
[data-theme="night"] .muhurta-item[style*="#10b981"],
[data-theme="night"] .muhurta-item[style*="16,185,129"] {
  border: 1.5px solid rgba(74, 222, 128, 0.5) !important;
  background: rgba(74, 222, 128, 0.12) !important;
}
[data-theme="night"] .muhurta-item[style*="#10b981"] .muhurta-item-name,
[data-theme="night"] .muhurta-item[style*="16,185,129"] .muhurta-item-name {
  color: #4ADE80 !important;
}
[data-theme="night"] .muhurta-item[style*="#ef4444"],
[data-theme="night"] .muhurta-item[style*="239,68,68"] {
  border: 1.5px solid rgba(248, 113, 113, 0.5) !important;
  background: rgba(248, 113, 113, 0.12) !important;
}
[data-theme="night"] .muhurta-item[style*="#ef4444"] .muhurta-item-name,
[data-theme="night"] .muhurta-item[style*="239,68,68"] .muhurta-item-name {
  color: #F87171 !important;
}
[data-theme="night"] .badge-vishti-alert {
  background: rgba(248, 113, 113, 0.18) !important;
  color: #F87171 !important;
  border: 1px solid rgba(248, 113, 113, 0.45) !important;
}
[data-theme="night"] .badge-limb-good {
  background: rgba(74, 222, 128, 0.18) !important;
  color: #4ADE80 !important;
  border: 1px solid rgba(74, 222, 128, 0.45) !important;
}
[data-theme="night"] .badge-limb-warn {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #FCD34D !important;
  border: 1px solid rgba(245, 158, 11, 0.45) !important;
}
[data-theme="night"] .panchang-limb-box[style*="#fff5f5"],
[data-theme="night"] .panchang-limb-box[style*="fff5f5"] {
  background: rgba(248, 113, 113, 0.15) !important;
  border-color: #F87171 !important;
}
[data-theme="night"] .quick-chip-btn {
  background: #140A2B !important;
  color: #F3EEFF !important;
  border-color: rgba(232, 199, 102, 0.3) !important;
}
[data-theme="night"] .quick-chip-btn.active {
  background: #E8C766 !important;
  color: #0B0716 !important;
}

/* 3. FEWER BOXES & UNIFIED HIERARCHY */
.boxed-card .boxed-inner-tray,
.report-card > div > div[style*="border:"],
.scarcity-matrix-card div[style*="background: var(--bg2)"],
.app-glass-panel div[style*="border: 1px solid"] {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.muhurta-item {
  border-radius: 10px !important;
  box-shadow: none !important;
}
.avakahada-table tr,
.daily-panchang-table tr {
  border-bottom: 1px solid rgba(212, 175, 55, 0.15) !important;
}

/* 4. TYPOGRAPHY DISCIPLINE (2 FONTS, MIN 12PX, DEVANAGARI >= 14PX) */
body, input, select, textarea, button {
  font-family: var(--font-body) !important;
}

h1, h2, h3, h4, h5, h6,
.brand-title, .drawer-brand-title, .page-hero-title, .section-title {
  font-family: var(--font-display) !important;
  text-transform: none !important;
  letter-spacing: 0.25px !important;
}

/* Floor minimum text size to 12px */
small, .badge, .sub, .card-sub, .block-sub, .theme-label, .drawer-sub-hint {
  font-size: max(12px, 0.75rem) !important;
}

/* Devanagari body text >= 14px */
:lang(hi), [lang="hi"], [lang="hi"] p, [lang="hi"] span, [lang="hi"] div,
.hindi-text, [data-i18n*="_desc"], [data-i18n*="_sub"] {
  font-size: max(14px, 0.875rem) !important;
  line-height: 1.6 !important;
}

/* 5. MOBILE POLISH & TOUCH ERGONOMICS */
@media screen and (max-width: 768px) {
  /* Prevent iOS Safari auto-zoom on input focus */
  input[type="text"],
  input[type="number"],
  input[type="tel"],
  input[type="email"],
  input[type="password"],
  input[type="date"],
  input[type="time"],
  select,
  textarea {
    font-size: 16px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Phone input container safety */
  .mfield, .mfield > div, form div[style*="display:flex"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  input#inMobileNum, input#preOrderPhoneInput, input#reg_phone {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Tap targets floor >= 44px */
  button,
  .btn,
  .btn-nav,
  .v-btn,
  .modal-btn,
  .lang-pill-btn,
  .theme-toggle-container,
  .hamburger,
  .drawer-close-btn,
  .modal-close,
  .app-tab-chip {
    min-height: 44px !important;
    min-width: 44px !important;
  }

  /* Viewport Units & Keyboard Safe Modals */
  .modal-overlay {
    height: 100vh;
    height: 100dvh !important;
    align-items: flex-start !important;
    padding-top: max(20px, env(safe-area-inset-top)) !important;
    padding-bottom: max(20px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .modal, #modalMobileOtp > div {
    max-height: calc(100dvh - 36px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    margin-top: 10px !important;
    margin-bottom: 20px !important;
  }

  /* Backdrop blur prefix */
  .modal-overlay, .nav-drawer-backdrop, .app-glass-panel {
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
  }
}

/* 6. DRAWER SHADOW BLEED PROTECTION & MOBILE SCROLLING FIX */
.nav-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 320px !important;
  max-width: 88vw !important;
  height: 100% !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateX(100%) !important;
  transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.32s ease !important;
  box-sizing: border-box !important;
}
.nav-drawer.open {
  box-shadow: -10px 0 35px rgba(0, 0, 0, 0.45) !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
}
.drawer-header {
  flex-shrink: 0 !important;
}
.drawer-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
}
.drawer-accordion-group {
  flex-shrink: 0 !important;
  overflow: hidden !important;
}
.drawer-accordion-panel {
  max-height: 360px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
}
.drawer-footer {
  flex-shrink: 0 !important;
}
.drawer-body::-webkit-scrollbar,
.drawer-accordion-panel::-webkit-scrollbar {
  width: 5px !important;
}
.drawer-body::-webkit-scrollbar-track,
.drawer-accordion-panel::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.12) !important;
  border-radius: 4px !important;
}
.drawer-body::-webkit-scrollbar-thumb,
.drawer-accordion-panel::-webkit-scrollbar-thumb {
  background: var(--gold, #d4af37) !important;
  border-radius: 4px !important;
}
.drawer-body,
.drawer-accordion-panel {
  scrollbar-width: thin !important;
  scrollbar-color: var(--gold, #d4af37) rgba(0, 0, 0, 0.12) !important;
}

/* 7. DESKTOP HEADER & CONTAINER CONSTRAINTS (~1366px - 1920px) */
@media (min-width: 1025px) and (max-width: 1400px) {
  nav {
    padding: 0 16px !important;
    gap: 8px !important;
  }
  .nav-links {
    gap: 8px !important;
  }
  .nav-links a {
    font-size: 11px !important;
    padding: 4px 6px !important;
  }
  .nav-btns {
    gap: 6px !important;
  }
  .btn-nav-app-download .nav-app-label {
    display: none !important;
  }
  .btn-nav-app-download {
    padding: 6px 10px !important;
  }
  .nav-vip-consult-pill {
    padding: 4px 8px !important;
    font-size: 11px !important;
  }
}

/* Cap width ~1200-1320px */
.section-wrap,
.hero-content,
.social-hub-container,
.main-container,
#mainContent > div,
.footer-wrap {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Prose max-width <= 75ch */
p, .article-body, .seo-authority-block p, .benchmark-desc {
  max-width: 75ch !important;
}

/* 8. TABLET 700-1023px: 3-COLUMN TILE GRID */
@media (min-width: 700px) and (max-width: 1023px) {
  .app-services-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 14px !important;
  }
  .upcoming-reports-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
  .social-hub-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 9. ACCESSIBILITY: FOCUS-VISIBLE RING & PREFERS-REDUCED-MOTION */
:focus-visible {
  outline: 2px solid var(--gold, #E8C766) !important;
  outline-offset: 3px !important;
}

@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* 10. PHASE 2: ACCESSIBLE COLLAPSIBLE ACCORDIONS (<details>/<summary>) */
details.ui-collapsible {
  border: 1px solid var(--gold-border, rgba(212, 175, 55, 0.25)) !important;
  border-radius: 14px !important;
  background: var(--card, #ffffff) !important;
  margin-bottom: 20px !important;
  overflow: hidden !important;
  transition: all 0.25s ease !important;
}

[data-theme="night"] details.ui-collapsible {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.25) !important;
}

details.ui-collapsible > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 48px !important;
  padding: 14px 20px !important;
  cursor: pointer !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  color: var(--heading-color) !important;
  user-select: none !important;
  list-style: none !important;
  background: var(--bg2, rgba(212, 175, 55, 0.05)) !important;
  transition: background 0.2s ease !important;
}

[data-theme="night"] details.ui-collapsible > summary {
  background: rgba(232, 199, 102, 0.08) !important;
  color: #F3EEFF !important;
}

details.ui-collapsible > summary::-webkit-details-marker {
  display: none !important;
}

details.ui-collapsible > summary::after {
  content: "▾" !important;
  font-size: 20px !important;
  color: var(--gold, #c5a059) !important;
  transition: transform 0.25s ease !important;
  min-width: 24px !important;
  text-align: right !important;
  line-height: 1 !important;
}

details.ui-collapsible[open] > summary::after {
  transform: rotate(180deg) !important;
}

details.ui-collapsible > summary:hover {
  background: var(--gold-dim, rgba(212, 175, 55, 0.12)) !important;
}

details.ui-collapsible .collapsible-content {
  padding: 16px 20px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   11. LUXURY EDITORIAL HOMEPAGE DESIGN & AESTHETIC POLISH
   Master visual layer for shriramjiastro.in homepage
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 11.1 NAVIGATION BAR GLASSMORPHISM & ALIGNMENT ── */
nav {
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  transition: background 0.3s ease, border-color 0.3s ease !important;
}

[data-theme="day"] nav,
:root nav {
  background: rgba(253, 251, 247, 0.94) !important;
  border-bottom: 1px solid rgba(197, 160, 89, 0.28) !important;
  box-shadow: 0 4px 20px rgba(74, 14, 23, 0.03) !important;
}

[data-theme="night"] nav {
  background: rgba(9, 5, 20, 0.95) !important;
  border-bottom: 1px solid rgba(232, 199, 102, 0.2) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.45) !important;
}

.brand-title {
  letter-spacing: 1.5px !important;
}

.nav-links a,
.nav-links button {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.nav-links a:hover,
.nav-links button:hover {
  transform: translateY(-1px) !important;
}

/* Compact Nav Calculator Chips */
.nav-links a[href*="manglik-dosh-calculator"] span:last-child,
.nav-links a[href*="dhan-yoga-calculator"] span:last-child {
  font-size: 11px !important;
  letter-spacing: 0.5px !important;
}

/* Dropdown Menu Polish */
.nav-dropdown-menu {
  border-radius: 14px !important;
  border: 1px solid var(--gold-border, rgba(197, 160, 89, 0.3)) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.12) !important;
  padding: 8px !important;
}

[data-theme="day"] .nav-dropdown-menu,
:root .nav-dropdown-menu {
  background: rgba(255, 253, 249, 0.98) !important;
}

[data-theme="night"] .nav-dropdown-menu {
  background: rgba(20, 10, 38, 0.98) !important;
  border-color: rgba(232, 199, 102, 0.25) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.55) !important;
}

.nav-dropdown-item {
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  transition: all 0.18s ease !important;
}

.nav-dropdown-item:hover {
  background: var(--gold-dim, rgba(197, 160, 89, 0.12)) !important;
}

/* ── 11.2 HERO SECTION: ROYAL TEMPLE MASTHEAD ── */
.hero {
  position: relative !important;
  padding: 60px 20px 48px !important;
  text-align: center !important;
  overflow: hidden !important;
}

[data-theme="day"] .hero,
:root .hero {
  background: radial-gradient(ellipse 90% 60% at 50% 0%, rgba(197, 160, 89, 0.12) 0%, rgba(253, 251, 247, 0) 100%), var(--bg, #FDFBF7) !important;
}

[data-theme="night"] .hero {
  background: radial-gradient(ellipse 90% 60% at 50% 0%, rgba(201, 168, 76, 0.14) 0%, rgba(9, 5, 20, 0) 100%), var(--bg, #090514) !important;
}

.hero-inner {
  max-width: 1060px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Sacred Protocol Pill Badge */
.protocol-banner-hero {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 20px !important;
  background: var(--gold-dim, rgba(197, 160, 89, 0.08)) !important;
  border: 1px solid var(--gold-border, rgba(197, 160, 89, 0.35)) !important;
  border-radius: 999px !important;
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1.6px !important;
  text-transform: uppercase !important;
  color: var(--gold-dark, #8C6D2B) !important;
  margin-bottom: 24px !important;
  box-shadow: 0 2px 14px rgba(197, 160, 89, 0.1) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

[data-theme="night"] .protocol-banner-hero {
  color: #E8C766 !important;
  border-color: rgba(232, 199, 102, 0.35) !important;
  background: rgba(232, 199, 102, 0.1) !important;
  box-shadow: 0 2px 16px rgba(232, 199, 102, 0.12) !important;
}

/* Main Display Title */
.hero h1 {
  font-family: 'Cinzel', serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px !important;
  color: var(--heading-color) !important;
  margin-bottom: 18px !important;
  line-height: 1.25 !important;
}

.hero h1 span {
  font-family: 'Cinzel', serif !important;
  letter-spacing: 1.2px !important;
  display: block !important;
  font-weight: 800 !important;
}

/* Hero Subtitle */
.hero-sub {
  font-family: var(--font-body) !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: var(--muted) !important;
  max-width: 780px !important;
  margin: 0 auto 34px !important;
  font-weight: 400 !important;
}

[data-theme="night"] .hero-sub {
  color: #B9ABD6 !important;
}

/* Sacred Oath Decree Plaque */
.hero-oath-card {
  position: relative !important;
  border: 1px solid var(--gold-border) !important;
  border-radius: 18px !important;
  padding: 24px 32px !important;
  max-width: 860px !important;
  margin: 0 auto 38px !important;
  text-align: left !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 8px 30px rgba(197, 160, 89, 0.08) !important;
}

[data-theme="day"] .hero-oath-card,
:root .hero-oath-card {
  background: linear-gradient(135deg, rgba(197, 160, 89, 0.08) 0%, rgba(255, 255, 255, 0.95) 100%) !important;
}

[data-theme="night"] .hero-oath-card {
  background: linear-gradient(135deg, rgba(232, 199, 102, 0.08) 0%, rgba(20, 10, 36, 0.95) 100%) !important;
  border-color: rgba(232, 199, 102, 0.28) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
}

.hero-oath-title {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  color: var(--gold-dark) !important;
  margin-bottom: 8px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

[data-theme="night"] .hero-oath-title {
  color: #E8C766 !important;
}

.hero-oath-desc {
  font-family: 'Plus Jakarta Sans', -apple-system, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: var(--text) !important;
  font-style: normal !important;
}

[data-theme="night"] .hero-oath-desc {
  color: #EDE8F7 !important;
}

/* Hero CTA Button Suite */
.hero-ctas {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 14px !important;
  margin-bottom: 38px !important;
}

.btn-hero {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  padding: 14px 24px !important;
  border-radius: 12px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 1px solid var(--gold-border) !important;
  background: var(--card) !important;
  color: var(--heading-color) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}

.btn-hero:hover {
  transform: translateY(-2px) !important;
  border-color: var(--gold) !important;
  background: var(--gold-dim) !important;
  color: var(--heading-color) !important;
  box-shadow: 0 8px 24px rgba(197, 160, 89, 0.2) !important;
}

.btn-hero.highlight {
  background: linear-gradient(135deg, #C5A059 0%, #9E7A20 100%) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 6px 24px rgba(158, 122, 32, 0.35) !important;
}

.btn-hero.highlight:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 30px rgba(158, 122, 32, 0.45) !important;
  opacity: 0.96 !important;
}

[data-theme="night"] .btn-hero.highlight {
  background: linear-gradient(135deg, #E8C766 0%, #B38728 100%) !important;
  color: #07040D !important;
  font-weight: 800 !important;
  box-shadow: 0 6px 24px rgba(232, 199, 102, 0.3) !important;
}

/* Zodiac Celestial Ticker */
.zodiac-ticker {
  border-top: 1px solid var(--gold-border) !important;
  border-bottom: 1px solid var(--gold-border) !important;
  padding: 14px 0 !important;
}

.ticker-item {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  color: var(--muted) !important;
}

/* ── 11.3 HARMONIZED SERVICES TILES (MOBILE & DESKTOP) ── */
.mobile-service-grid,
.mobile-app-quick-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  margin-bottom: 24px !important;
}

@media (min-width: 768px) {
  .mobile-app-quick-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
    margin-bottom: 32px !important;
  }
}

.app-service-card,
.app-quick-tile {
  background: var(--card) !important;
  border: 1px solid var(--card-border, rgba(197, 160, 89, 0.25)) !important;
  border-radius: 16px !important;
  padding: 16px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
  overflow: hidden !important;
}

.app-service-card:hover,
.app-quick-tile:hover {
  transform: translateY(-3px) !important;
  border-color: var(--gold) !important;
  box-shadow: 0 10px 28px rgba(197, 160, 89, 0.16) !important;
}

.app-service-card:active,
.app-quick-tile:active {
  transform: scale(0.98) !important;
}

[data-theme="night"] .app-service-card,
[data-theme="night"] .app-quick-tile {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.2) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

[data-theme="night"] .app-service-card:hover,
[data-theme="night"] .app-quick-tile:hover {
  border-color: rgba(232, 199, 102, 0.5) !important;
  box-shadow: 0 10px 30px rgba(232, 199, 102, 0.15) !important;
}

.card-glyph,
.app-quick-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  background: var(--gold-dim, rgba(197, 160, 89, 0.1)) !important;
  border: 1px solid var(--gold-border, rgba(197, 160, 89, 0.3)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
  margin-bottom: 10px !important;
}

[data-theme="night"] .card-glyph,
[data-theme="night"] .app-quick-icon {
  background: rgba(232, 199, 102, 0.12) !important;
  border-color: rgba(232, 199, 102, 0.25) !important;
}

.card-title,
.app-quick-title {
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  line-height: 1.35 !important;
  margin-bottom: 4px !important;
}

[data-theme="night"] .card-title,
[data-theme="night"] .app-quick-title {
  color: #F3EEFF !important;
}

.card-sub,
.app-quick-sub {
  font-size: 12px !important;
  color: var(--muted) !important;
  line-height: 1.4 !important;
}

[data-theme="night"] .card-sub,
[data-theme="night"] .app-quick-sub {
  color: #B9ABD6 !important;
}

.card-badge {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
  padding: 3px 8px !important;
  border-radius: 20px !important;
  border: 1px solid var(--gold-border) !important;
  background: var(--gold-dim) !important;
  color: var(--gold-dark) !important;
}

[data-theme="night"] .card-badge {
  background: rgba(232, 199, 102, 0.12) !important;
  color: #E8C766 !important;
  border-color: rgba(232, 199, 102, 0.3) !important;
}

/* ── 11.4 CELESTIAL OBSERVATORY DEDICATED PANCHANG (WRAPPED & ULTRA-SOPHISTICATED) ── */
#desktopPanchangSection {
  padding: 56px 0 !important;
  position: relative !important;
}

.panchang-card {
  border-radius: 16px !important;
  border: 1px solid var(--gold-border, rgba(197, 160, 89, 0.3)) !important;
  background: var(--card-bg, #ffffff) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04) !important;
  padding: 20px !important;
  margin-bottom: 24px !important;
}

@media (max-width: 600px) {
  .panchang-card {
    padding: 14px !important;
    border-radius: 14px !important;
  }
}

[data-theme="night"] .panchang-card {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.2) !important;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.45) !important;
}

/* Category Segment Nav (Wrapped Navigation Bar) */
.panchang-segment-nav {
  display: flex !important;
  gap: 6px !important;
  background: var(--bg2, #f5efe6) !important;
  padding: 4px !important;
  border-radius: 10px !important;
  border: 1px solid var(--border, rgba(197, 160, 89, 0.22)) !important;
  margin: 16px 0 14px 0 !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
}

.panchang-segment-nav::-webkit-scrollbar {
  display: none !important;
}

.panchang-seg-btn {
  flex: 1 !important;
  min-width: max-content !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--text-muted, #78716c) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
  text-align: center !important;
}

.panchang-seg-btn.active {
  background: var(--card, #ffffff) !important;
  color: var(--heading-color, #2c1a0e) !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
}

[data-theme="night"] .panchang-segment-nav {
  background: #0d071b !important;
  border-color: rgba(232, 199, 102, 0.16) !important;
}

[data-theme="night"] .panchang-seg-btn {
  color: #b9abd6 !important;
}

[data-theme="night"] .panchang-seg-btn.active {
  background: #1f113d !important;
  color: #F3EEFF !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

/* Panels */
.panchang-section-panel {
  animation: panchangFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes panchangFadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Wrapped Accordion Items (Progressive On-Demand Revelation) */
.panchang-grid-wrapped {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.panchang-wrapped-item {
  background: var(--card, #ffffff) !important;
  border: 1px solid var(--border, rgba(197, 160, 89, 0.2)) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  cursor: pointer !important;
}

.panchang-wrapped-item:hover {
  border-color: var(--gold, #C5A059) !important;
}

.panchang-wrapped-item.is-open {
  border-color: var(--gold, #C5A059) !important;
  box-shadow: 0 4px 14px rgba(197, 160, 89, 0.1) !important;
}

[data-theme="night"] .panchang-wrapped-item {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.16) !important;
}

[data-theme="night"] .panchang-wrapped-item:hover,
[data-theme="night"] .panchang-wrapped-item.is-open {
  border-color: rgba(232, 199, 102, 0.4) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

.panchang-wrapped-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 11px 14px !important;
  gap: 12px !important;
  user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

.panchang-item-label {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--gold-dark, #8C6D2B) !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  margin-bottom: 2px !important;
}

[data-theme="night"] .panchang-item-label {
  color: #E8C766 !important;
}

.panchang-item-value {
  font-family: 'Rozha One', 'Tiro Devanagari Hindi', serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  line-height: 1.3 !important;
}

[data-theme="night"] .panchang-item-value {
  color: #F3EEFF !important;
}

.panchang-item-meta {
  font-size: 12px !important;
  color: var(--muted, #78716c) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  text-align: right !important;
}

[data-theme="night"] .panchang-item-meta {
  color: #b9abd6 !important;
}

.panchang-chevron {
  font-size: 11px !important;
  color: var(--muted, #78716c) !important;
  transition: transform 0.2s ease !important;
  display: inline-block !important;
}

.panchang-wrapped-item.is-open .panchang-chevron {
  transform: rotate(180deg) !important;
}

/* Expandable Drawer inside wrapped items */
.panchang-drawer {
  display: none !important;
  padding: 12px 14px !important;
  border-top: 1px solid var(--border-subtle, rgba(197, 160, 89, 0.15)) !important;
  background: var(--bg2, #faf7f2) !important;
  font-size: 12.5px !important;
  color: var(--text) !important;
  animation: panchangFadeIn 0.2s ease !important;
}

.panchang-wrapped-item.is-open .panchang-drawer {
  display: block !important;
}

[data-theme="night"] .panchang-drawer {
  background: #0d071d !important;
  border-color: rgba(232, 199, 102, 0.12) !important;
  color: #F3EEFF !important;
}

.panchang-drawer-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important;
  gap: 10px 14px !important;
}

.drawer-cell {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.drawer-lbl {
  font-size: 10.5px !important;
  color: var(--muted, #78716c) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
}

[data-theme="night"] .drawer-lbl {
  color: #b9abd6 !important;
}

.drawer-val {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--heading-color) !important;
}

[data-theme="night"] .drawer-val {
  color: #F3EEFF !important;
}

/* Status Pills (Minimal, Hairline, Calm) */
.panchang-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  border: 1px solid currentColor !important;
  background: transparent !important;
  line-height: 1.4 !important;
}

.panchang-status-pill.shubh {
  color: #2e6f40 !important;
  border-color: rgba(46, 111, 64, 0.35) !important;
}

.panchang-status-pill.varjya {
  color: #8e2818 !important;
  border-color: rgba(142, 40, 24, 0.35) !important;
}

.panchang-status-pill.saumya {
  color: var(--muted, #78716c) !important;
  border-color: rgba(120, 113, 108, 0.3) !important;
}

[data-theme="night"] .panchang-status-pill.shubh {
  color: #4ade80 !important;
  border-color: rgba(74, 222, 128, 0.35) !important;
}

[data-theme="night"] .panchang-status-pill.varjya {
  color: #f87171 !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
}

[data-theme="night"] .panchang-status-pill.saumya {
  color: #b9abd6 !important;
  border-color: rgba(185, 171, 214, 0.25) !important;
}

/* Solar & Lunar Clean Rows */
.panchang-data-table-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.panchang-data-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 10px 14px !important;
  background: var(--card, #ffffff) !important;
  border: 1px solid var(--border, rgba(197, 160, 89, 0.18)) !important;
  border-radius: 8px !important;
  font-size: 13px !important;
}

[data-theme="night"] .panchang-data-row {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.16) !important;
}

.data-row-lbl {
  color: var(--muted, #78716c) !important;
  font-weight: 500 !important;
}

[data-theme="night"] .data-row-lbl {
  color: #b9abd6 !important;
}

.data-row-val {
  color: var(--heading-color) !important;
  font-weight: 700 !important;
  font-family: 'Rozha One', 'Tiro Devanagari Hindi', serif !important;
  font-size: 14px !important;
}

[data-theme="night"] .data-row-val {
  color: #F3EEFF !important;
}

/* Clean Avakahada Table */
.panchang-avakahada-clean-tbl {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid var(--border, rgba(197, 160, 89, 0.22)) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  font-size: 12.5px !important;
  background: var(--card, #ffffff) !important;
}

.panchang-avakahada-clean-tbl td {
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--border-subtle, rgba(197, 160, 89, 0.12)) !important;
}

.panchang-avakahada-clean-tbl tr:last-child td {
  border-bottom: none !important;
}

.panchang-avakahada-clean-tbl .av-lbl {
  font-weight: 600 !important;
  color: var(--muted, #78716c) !important;
  width: 22% !important;
  background: var(--bg2, #faf7f2) !important;
  border-right: 1px solid var(--border-subtle, rgba(197, 160, 89, 0.12)) !important;
}

.panchang-avakahada-clean-tbl .av-val {
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  width: 28% !important;
}

[data-theme="night"] .panchang-avakahada-clean-tbl {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.16) !important;
}

[data-theme="night"] .panchang-avakahada-clean-tbl .av-lbl {
  background: #0d071d !important;
  color: #b9abd6 !important;
  border-color: rgba(232, 199, 102, 0.12) !important;
}

[data-theme="night"] .panchang-avakahada-clean-tbl .av-val {
  color: #F3EEFF !important;
  border-color: rgba(232, 199, 102, 0.12) !important;
}

/* Quick chip buttons in date pickers */
.quick-chip-btn {
  padding: 7px 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border: 1px solid var(--gold-border) !important;
  background: var(--card) !important;
  color: var(--text) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.quick-chip-btn:hover {
  background: var(--gold-dim) !important;
  border-color: var(--gold) !important;
}

.quick-chip-btn.active {
  background: var(--heading-color) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
}

[data-theme="night"] .quick-chip-btn.active {
  background: #E8C766 !important;
  color: #07040D !important;
}

/* ── 11.5 360 PLATFORM PILLARS (SERVICES SECTION) ── */
#services {
  padding: 64px 0 !important;
}

.platform-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 28px !important;
}

@media (max-width: 860px) {
  .platform-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

.pillar-card {
  background: var(--card) !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 20px !important;
  padding: 32px 28px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
  overflow: hidden !important;
}

.pillar-card:hover {
  transform: translateY(-4px) !important;
  border-color: var(--gold) !important;
  box-shadow: 0 16px 40px rgba(197, 160, 89, 0.16) !important;
}

[data-theme="night"] .pillar-card {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.22) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="night"] .pillar-card:hover {
  border-color: rgba(232, 199, 102, 0.45) !important;
  box-shadow: 0 16px 44px rgba(232, 199, 102, 0.16) !important;
}

.pillar-pill-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: var(--gold-dim) !important;
  border: 1px solid var(--gold-border) !important;
  color: var(--gold-dark) !important;
  padding: 5px 12px !important;
  border-radius: 20px !important;
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  margin-bottom: 16px !important;
  align-self: flex-start !important;
}

[data-theme="night"] .pillar-pill-label {
  color: #E8C766 !important;
  border-color: rgba(232, 199, 102, 0.3) !important;
  background: rgba(232, 199, 102, 0.12) !important;
}

.pillar-title {
  font-family: 'Cinzel', 'Rozha One', serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  margin-bottom: 10px !important;
  line-height: 1.3 !important;
}

[data-theme="night"] .pillar-title {
  color: #F3EEFF !important;
}

.pillar-desc {
  font-size: 14px !important;
  color: var(--muted) !important;
  line-height: 1.65 !important;
  margin-bottom: 20px !important;
}

[data-theme="night"] .pillar-desc {
  color: #B9ABD6 !important;
}

.pillar-features {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 24px !important;
  font-size: 13.5px !important;
  color: var(--text) !important;
  background: var(--gold-dim) !important;
  border: 1px solid var(--gold-border) !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
}

[data-theme="night"] .pillar-features {
  background: rgba(232, 199, 102, 0.05) !important;
  border-color: rgba(232, 199, 102, 0.18) !important;
  color: #EDE8F7 !important;
}

.pillar-feat-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  border-bottom: 1px dashed rgba(197, 160, 89, 0.2) !important;
  padding-bottom: 8px !important;
}

.pillar-feat-item:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

.pillar-btn {
  width: 100% !important;
  padding: 14px !important;
  background: var(--gold-dim) !important;
  border: 1px solid var(--gold-border) !important;
  border-radius: 12px !important;
  color: var(--heading-color) !important;
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  text-decoration: none !important;
  text-align: center !important;
  transition: all 0.25s ease !important;
  display: inline-block !important;
}

.pillar-btn:hover {
  background: linear-gradient(135deg, var(--gold2), var(--gold-dark)) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(197, 160, 89, 0.25) !important;
}

[data-theme="night"] .pillar-btn {
  color: #F3EEFF !important;
  border-color: rgba(232, 199, 102, 0.3) !important;
  background: rgba(232, 199, 102, 0.1) !important;
}

[data-theme="night"] .pillar-btn:hover {
  background: linear-gradient(135deg, #E8C766, #9E7A20) !important;
  color: #07040D !important;
}

/* ── 11.6 SPECIALIZED REPORTS CATALOG ── */
#upcoming-reports {
  padding: 64px 0 !important;
}

.upcoming-reports-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 24px !important;
  margin-top: 28px !important;
}

.report-card {
  background: var(--card) !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 18px !important;
  padding: 26px 22px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  cursor: pointer !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
}

.report-card:hover {
  border-color: var(--gold) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 14px 36px rgba(197, 160, 89, 0.18) !important;
}

[data-theme="night"] .report-card {
  background: #140A2B !important;
  border-color: rgba(232, 199, 102, 0.22) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="night"] .report-card:hover {
  border-color: rgba(232, 199, 102, 0.5) !important;
  box-shadow: 0 14px 40px rgba(232, 199, 102, 0.2) !important;
}

.report-card-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  align-self: flex-start !important;
  background: rgba(185, 28, 28, 0.1) !important;
  border: 1px solid rgba(185, 28, 28, 0.28) !important;
  color: var(--red) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  margin-bottom: 14px !important;
  text-transform: uppercase !important;
}

[data-theme="night"] .report-card-badge {
  background: rgba(248, 113, 113, 0.15) !important;
  border-color: rgba(248, 113, 113, 0.4) !important;
  color: #F87171 !important;
}

.report-card-title {
  font-family: var(--font-body) !important;
  font-size: 17.5px !important;
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  margin-bottom: 8px !important;
  line-height: 1.35 !important;
}

.report-card-desc {
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.6 !important;
  margin-bottom: 20px !important;
}

.report-card-price-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}

.report-price-now {
  font-family: 'Cinzel', 'Outfit', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: var(--gold-dark) !important;
}

.report-price-old {
  font-size: 13.5px !important;
  color: var(--muted) !important;
  text-decoration: line-through !important;
}

.report-btn-preorder {
  width: 100% !important;
  padding: 12px 16px !important;
  background: linear-gradient(135deg, var(--gold2), var(--gold-dark)) !important;
  border: none !important;
  border-radius: 10px !important;
  color: #FFFFFF !important;
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 15px rgba(180, 130, 30, 0.25) !important;
}

.report-btn-preorder:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(180, 130, 30, 0.35) !important;
  opacity: 0.96 !important;
}

[data-theme="night"] .report-btn-preorder {
  background: linear-gradient(135deg, #E8C766, #9E7A20) !important;
  color: #07040D !important;
}

/* ── 11.7 SECTION HEADERS & ROYAL ORNAMENTATION ── */
.section-header {
  text-align: center !important;
  margin-bottom: 36px !important;
  position: relative !important;
}

.ornament-line {
  width: 48px !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, var(--gold), transparent) !important;
  margin: 0 auto 12px !important;
}

.section-header h2 {
  font-family: 'Rozha One', 'Cinzel', serif !important;
  font-size: clamp(24px, 3.2vw, 36px) !important;
  font-weight: 700 !important;
  color: var(--heading-color) !important;
  line-height: 1.3 !important;
  margin-bottom: 10px !important;
  letter-spacing: 0.25px !important;
}

[data-theme="night"] .section-header h2 {
  color: #F8F4FF !important;
}

.section-header p {
  font-size: 15px !important;
  color: var(--muted) !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  line-height: 1.6 !important;
}

[data-theme="night"] .section-header p {
  color: #B9ABD6 !important;
}

/* ── 11.8 GLOBAL FOOTER AESTHETIC POLISH ── */
footer,
.site-global-footer {
  background: var(--footer-bg, #FAF6EF) !important;
  border-top: 1px solid var(--gold-border) !important;
  padding: 56px 20px 28px !important;
}

[data-theme="night"] footer,
[data-theme="night"] .site-global-footer {
  background: #05030A !important;
  border-color: rgba(232, 199, 102, 0.18) !important;
}

.footer-heading {
  font-family: var(--font-display, 'Cinzel', serif) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--gold-dark) !important;
  margin-bottom: 16px !important;
}

[data-theme="night"] .footer-heading {
  color: #E8C766 !important;
}

.footer-links a {
  font-size: 13px !important;
  color: var(--muted) !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
  display: inline-block !important;
}

.footer-links a:hover {
  color: var(--gold-dark) !important;
  transform: translateX(3px) !important;
}

[data-theme="night"] .footer-links a:hover {
  color: #E8C766 !important;
}

.footer-bottom {
  border-top: 1px solid var(--gold-border) !important;
  padding-top: 24px !important;
  margin-top: 36px !important;
  font-size: 12px !important;
  color: var(--muted) !important;
  display: flex !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

[data-theme="night"] .footer-bottom {
  border-color: rgba(232, 199, 102, 0.15) !important;
  color: #8C7FA5 !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   SRA SACRED SURYA-SWASTIKA VEDIC LOADER (ROTATING SUN & STATIONARY SWASTIKA)
   ══════════════════════════════════════════════════════════════════════════ */
@keyframes sraSuryaRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes sraSolarHaloPulse {
  0%, 100% {
    transform: scale(0.95);
    opacity: 0.55;
  }
  50% {
    transform: scale(1.08);
    opacity: 0.95;
  }
}

@keyframes sraSolarLoaderBreathe {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 18px rgba(245, 158, 11, 0.45));
  }
  50% {
    transform: scale(1.03);
    filter: drop-shadow(0 0 32px rgba(245, 158, 11, 0.75));
  }
}

.sra-sacred-loader-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999999;
  background: radial-gradient(circle at center, rgba(30, 15, 8, 0.92) 0%, rgba(15, 23, 42, 0.97) 100%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-family: 'Noto Sans Devanagari', 'Cinzel', system-ui, sans-serif;
  text-align: center;
  padding: 24px;
  box-sizing: border-box;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}

.sra-sacred-loader-overlay.sra-loader-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.sra-surya-loader-graphic {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  animation: sraSolarLoaderBreathe 4s ease-in-out infinite;
  margin-bottom: 22px;
}

.sra-solar-halo {
  transform-origin: 100px 100px;
  animation: sraSolarHaloPulse 3.2s ease-in-out infinite;
}

/* Background Sun Rays rotate slowly, smoothly & elegantly (16s cycle) */
.sra-surya-rotating-rays {
  transform-origin: 100px 100px;
  animation: sraSuryaRotate 16s linear infinite;
  will-change: transform;
}

/* Central Solar Disc and Auspicious Swastika remain steady, upright and stationary */
.sra-swastika-stationary-core {
  transform-origin: 100px 100px;
  transform: none !important;
  pointer-events: none;
}

.sra-loader-title {
  font-size: 19px;
  font-weight: 800;
  color: #fef08a;
  letter-spacing: 0.6px;
  margin: 0 0 6px 0;
  font-family: 'Noto Sans Devanagari', 'Cinzel', serif;
  text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.sra-loader-subtitle {
  font-size: 13.5px;
  color: #cbd5e1;
  max-width: 440px;
  line-height: 1.5;
  margin: 0;
  text-shadow: 0 1px 4px rgba(0,0,0,0.4);
}

.sra-loader-progress-bar {
  width: 150px;
  height: 3px;
  background: rgba(255,255,255,0.15);
  border-radius: 3px;
  margin: 16px auto 0;
  overflow: hidden;
  position: relative;
}

.sra-loader-progress-line {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 45%;
  background: linear-gradient(90deg, transparent, #f59e0b, #fef08a, transparent);
  animation: sraLoaderLineGlow 1.8s ease-in-out infinite;
}

@keyframes sraLoaderLineGlow {
  0% { left: -45%; }
  100% { left: 145%; }
}

/* ══════════════════════════════════════════════════════════════════════════
   SRA INDEX LIVING & MOVING ELEMENTS (MEGA REPORT & VALUE PROP TYPEWRITER)
   ══════════════════════════════════════════════════════════════════════════ */
.mega-parashara-featured-card {
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
  background: linear-gradient(135deg, rgba(124,19,5,0.08) 0%, rgba(180,83,9,0.14) 50%, rgba(124,19,5,0.06) 100%) !important;
  border: 2px solid var(--gold) !important;
  border-radius: 20px !important;
  padding: 28px !important;
  box-shadow: 0 12px 35px rgba(0,0,0,0.08), 0 0 20px rgba(212,175,55,0.18) !important;
  animation: sraMegaCardGlow 4.5s ease-in-out infinite;
}

@keyframes sraMegaCardGlow {
  0%, 100% {
    box-shadow: 0 12px 35px rgba(0,0,0,0.08), 0 0 18px rgba(212,175,55,0.18);
    border-color: var(--gold);
  }
  50% {
    box-shadow: 0 14px 42px rgba(124,19,5,0.16), 0 0 34px rgba(245,158,11,0.38);
    border-color: #f59e0b;
  }
}

/* Moving Light Beam / Shimmer across Mega Card */
.mega-parashara-featured-card::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -60%;
  width: 45%;
  height: 200%;
  background: linear-gradient(
    60deg,
    transparent 0%,
    rgba(255, 255, 255, 0.02) 35%,
    rgba(254, 240, 138, 0.18) 50%,
    rgba(255, 255, 255, 0.02) 65%,
    transparent 100%
  );
  transform: rotate(25deg);
  pointer-events: none;
  animation: sraShimmerPass 6s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes sraShimmerPass {
  0% {
    left: -60%;
  }
  32%, 100% {
    left: 140%;
  }
}

/* Flashing Beacon on Flagship Badge */
.sra-flagship-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #7c1305, #b45309);
  color: #fff;
  font-size: 11.5px;
  font-weight: 800;
  padding: 5px 14px;
  border-radius: 20px;
  text-transform: uppercase;
  margin-bottom: 10px;
  position: relative;
  box-shadow: 0 4px 14px rgba(124,19,5,0.35);
  letter-spacing: 0.5px;
}

.sra-live-beacon {
  width: 8px;
  height: 8px;
  background-color: #ef4444;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  box-shadow: 0 0 8px #ef4444;
  flex-shrink: 0;
}

.sra-live-beacon::after {
  content: '';
  position: absolute;
  top: -4px;
  left: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #ef4444;
  animation: sraBeaconWave 1.6s ease-out infinite;
}

@keyframes sraBeaconWave {
  0% {
    transform: scale(0.5);
    opacity: 1;
  }
  100% {
    transform: scale(2.2);
    opacity: 0;
  }
}

/* Typewriter Container & Flashing Cursor */
.sra-typewriter-container {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0 12px;
  font-size: 13.5px;
  font-family: 'Noto Sans Devanagari', system-ui, sans-serif;
  font-weight: 700;
  color: var(--heading-color);
  background: rgba(180, 83, 9, 0.08);
  border: 1.5px solid rgba(212, 175, 55, 0.45);
  border-left: 4px solid #d97706;
  padding: 7px 14px;
  border-radius: 10px;
  max-width: 100%;
  box-sizing: border-box;
  box-shadow: 0 2px 10px rgba(180,83,9,0.06);
}

.sra-typewriter-cursor {
  display: inline-block;
  color: #d97706;
  font-weight: 900;
  margin-left: 2px;
  animation: sraCursorBlink 0.75s step-start infinite;
}

@keyframes sraCursorBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* Radiant Sheen on Mega Report CTA Button */
.sra-btn-mega-radiant {
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.sra-btn-mega-radiant:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(124,19,5,0.4) !important;
}

.sra-btn-mega-radiant::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -60%;
  width: 45%;
  height: 200%;
  background: linear-gradient(60deg, transparent, rgba(255,255,255,0.45), transparent);
  transform: rotate(25deg);
  animation: sraBtnSheen 3.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  pointer-events: none;
}

@keyframes sraBtnSheen {
  0% { left: -60%; }
  35%, 100% { left: 140%; }
}

/* Live Badge Soft Pulsing */
.report-card-badge,
.report-discount-tag {
  animation: sraBadgeLivePulse 2.8s ease-in-out infinite;
}

@keyframes sraBadgeLivePulse {
  0%, 100% {
    transform: scale(1);
    filter: brightness(1);
  }
  50% {
    transform: scale(1.04);
    filter: brightness(1.12);
  }
}