/* ==========================================================================
   Dr. Bendapudi Prabhakar Rao & Bendapudi Swatantra Lakshmi Charitable Trust
   Unified Brand Palette, Heritage Typography & Header Aesthetics
   ========================================================================== */

:root {
  /* Approved Brand Palette */
  --color-primary-maroon: #B52F28;
  --color-deep-maroon: #6D0D03;
  --color-heritage-brown: #49271A;
  --color-antique-gold: #E2AD4E;
  --color-light-gold: #F4D378;
  --color-warm-ivory: #EEE8C9;
  --color-warm-white: #FFFDF7;
  --color-primary-text: #2E211A;
  --color-secondary-text: #65584D;

  /* Tailwind CSS Theme Variable Overrides */
  --color-ivory: #FFFDF7 !important;
  --color-cream: #EEE8C9 !important;
  --color-navy-light: #B52F28 !important;
  --color-navy: #6D0D03 !important;
  --color-gold: #E2AD4E !important;
  --color-gold-hover: #D19B3D !important;
}

/* ==========================================================================
   1. UNIVERSAL TYPOGRAPHY: Plus Jakarta Sans
   STRICT SYSTEM REQUIREMENT: NO OTHER FONT SHOULD BE USED ACROSS THE WHOLE PROJECT
   ========================================================================== */

*, *::before, *::after,
html, body, h1, h2, h3, h4, h5, h6,
p, span, button, input, select, textarea, div, a, label,
h1 *, h2 *, h3 *, h4 *, h5 *, h6 *,
.font-serif, .font-serif-title, .font-sans, .font-mono,
#root, #root * {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

/* Background canvas */
#root-app-viewport {
  background-color: var(--color-warm-white) !important;
  color: var(--color-primary-text) !important;
}

/* ==========================================================================
   2. HEADER & WIDE LOGO BRAND STYLING
   ========================================================================== */

/* Main Header Container */
#root #main-header {
  background-color: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

#main-header,
.site-main-header {
  background-color: #6D0D03 !important;
  background: #6D0D03 !important;
}

/* 1. Permanent Institutional Top Bar: PURE WHITE */
#permanent-top-bar {
  background-color: #FFFFFF !important;
  color: var(--color-deep-maroon) !important;
  border-bottom: 1px solid rgba(226, 173, 78, 0.35) !important;
}

#permanent-top-bar a,
.site-top-bar a {
  text-decoration: none !important;
  color: var(--color-deep-maroon) !important;
}

#permanent-top-bar a:hover,
.site-top-bar a:hover {
  text-decoration: none !important;
  color: var(--color-primary-maroon) !important;
}

#permanent-top-bar a[href*="wa.me"],
.site-top-bar a[href*="wa.me"] {
  color: #25D366 !important;
}

#permanent-top-bar a[href*="wa.me"]:hover,
.site-top-bar a[href*="wa.me"]:hover {
  color: #1EBE5D !important;
}

#permanent-top-bar a svg,
.site-top-bar a svg {
  text-decoration: none !important;
}

#permanent-top-bar svg,
.site-top-bar svg {
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  max-width: 14px !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* Strictly suppress duplicate dark red / React "Updates" marquee tickers */
.animate-marquee:not(#site-ticker-bar .animate-marquee),
div:has(> div > div > .animate-marquee):not(#site-ticker-bar),
div:has(> div > .animate-marquee):not(#site-ticker-bar) {
  display: none !important;
}

/* 2. Red Navigation Menu Bar */
#main-header div:has(#desktop-nav),
#main-header .bg-\[\#0A1128\] {
  background-color: var(--color-deep-maroon) !important;
  border-bottom: 2px solid rgba(226, 173, 78, 0.4) !important;
  overflow: hidden !important;
}

#main-header div:has(#desktop-nav) > div {
  max-width: 100% !important;
  height: 108px !important;
  padding-left: clamp(1rem, 2.5vw, 2.5rem) !important;
  padding-right: clamp(1rem, 2.5vw, 2.5rem) !important;
  box-sizing: border-box !important;
}

/* Big Logo inside the Red Menu Bar: 96px height */
#nav-menu-logo,
#nav-menu-logo img {
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

#nav-menu-logo img {
  height: 96px !important;
  width: auto !important;
  max-width: 520px !important;
  object-fit: contain !important;
}

/* Zero space-x margin leakage & Reduced Spacing between Navigation Items */
#desktop-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  flex-shrink: 1 !important;
}

#desktop-nav > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#desktop-nav button[id^="nav-"] {
  padding: 5px 7px !important;
  font-size: 10.5px !important;
  letter-spacing: 0.04em !important;
  color: rgba(255, 253, 247, 0.9) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

#desktop-nav button[id^="nav-"]:hover {
  color: var(--color-light-gold) !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Active navigation item: NO dark red background block, purely gold text and gold underline/border */
#desktop-nav button[id^="nav-"].text-gold,
#desktop-nav button[id^="nav-"]:focus,
#desktop-nav button[id^="nav-"]:active {
  color: var(--color-light-gold) !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Track Application CTA inside the Menu */
#desktop-track-cta {
  border: 1.5px solid var(--color-antique-gold) !important;
  background-color: transparent !important;
  color: var(--color-warm-white) !important;
  padding: 5px 12px !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  transition: all 0.2s ease !important;
  margin-left: 8px !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

#desktop-track-cta:hover {
  background-color: var(--color-antique-gold) !important;
  color: var(--color-deep-maroon) !important;
}

#desktop-track-cta:hover svg {
  color: var(--color-deep-maroon) !important;
}

/* Header Spacer beneath fixed header */
#main-header + div {
  display: none !important;
  height: 0px !important;
  min-height: 0px !important;
  max-height: 0px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Hide separate middle logo bar on Desktop (min-width: 1024px) */
@media (min-width: 1024px) {
  #main-header > div:has(#brand-logo) {
    display: none !important;
  }
}

/* Mobile Header with Red Background */
@media (max-width: 1023px) {
  #main-header > div:has(#brand-logo) {
    background-color: var(--color-deep-maroon) !important;
  }
  #brand-logo img {
    content: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/W_Logo.png') !important;
    height: 52px !important;
    width: auto !important;
    max-width: 280px !important;
    object-fit: contain !important;
  }
  #brand-logo > div:last-child {
    display: none !important;
  }
  #mobile-menu-toggle {
    color: var(--color-light-gold) !important;
  }
}

/* DISABLE ALL LOGO HOVER ANIMATIONS GLOBALLY */
#brand-logo, #brand-logo *, #brand-logo:hover, #brand-logo:hover *,
#nav-menu-logo, #nav-menu-logo *, #nav-menu-logo:hover, #nav-menu-logo:hover *,
img[alt*="Trust Logo"], img[alt*="Trust Logo"]:hover,
header img, header img:hover,
footer img, footer img:hover,
aside img, aside img:hover,
.group-hover\:scale-105, .group-hover\:scale-105:hover,
.hover\:scale-105, .hover\:scale-105:hover {
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

/* Footer Big W_Logo: Prominent, Stretched & Fit above Dedicated Paragraph */
footer img[alt="Trust Logo"] {
  content: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/W_Logo.png') !important;
  height: 96px !important;
  max-height: 96px !important;
  width: auto !important;
  max-width: 520px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

footer .rounded-full:has(img[alt="Trust Logo"]),
footer div:has(> img[alt="Trust Logo"]) {
  width: 100% !important;
  max-width: 520px !important;
  height: auto !important;
  border-radius: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 6px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Hide duplicate text block between footer logo and Dedicated paragraph */
footer div:has(> img[alt="Trust Logo"]) + div.space-y-3,
footer .rounded-full:has(img[alt="Trust Logo"]) + div.space-y-3 {
  display: none !important;
}

/* Secondary Desktop Navigation Bar (Bar below logo) */
#main-header > div.bg-\[\#0A1128\],
#main-header div.bg-\[\#0A1128\].hidden.lg\:block {
  background-color: var(--color-deep-maroon) !important;
  border-top: 1px solid rgba(226, 173, 78, 0.3) !important;
  border-bottom: 2px solid var(--color-antique-gold) !important;
}

#main-header nav#desktop-nav button {
  color: var(--color-warm-white) !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  font-size: 11px !important;
  padding: 0.5rem 0.85rem !important;
  transition: all 0.2s ease !important;
  border-radius: 4px !important;
}

#main-header nav#desktop-nav button:hover,
#main-header nav#desktop-nav button.text-gold {
  color: var(--color-light-gold) !important;
  background-color: rgba(73, 39, 26, 0.45) !important;
}

/* ==========================================================================
   3. FOOTER WIDE LOGO BRANDING
   ========================================================================== */

footer,
footer.bg-\[\#0A1128\],
footer.bg-navy {
  background-color: var(--color-deep-maroon) !important;
  border-top: 3px solid var(--color-antique-gold) !important;
  color: var(--color-warm-white) !important;
}

/* Wide logo in Footer */
footer .flex.items-center.space-x-3 > div:first-child,
footer .w-16.h-16.rounded-full {
  width: auto !important;
  height: 58px !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

footer .w-16.h-16.rounded-full > div {
  border-radius: 0 !important;
  overflow: visible !important;
}

footer .flex.items-center.space-x-3 img,
footer .w-16.h-16.rounded-full img {
  content: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/W_Logo.png') !important;
  height: 56px !important;
  width: auto !important;
  max-width: 320px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Remove redundant HTML text logo next to wide logo in footer */
footer .flex.items-center.space-x-3 > div:last-child {
  display: none !important;
}

footer a,
footer button {
  color: var(--color-warm-ivory) !important;
  transition: color 0.15s ease-in-out !important;
}

footer a:hover,
footer button:hover {
  color: var(--color-light-gold) !important;
}

footer .text-gold,
footer h3,
footer h4 {
  color: var(--color-antique-gold) !important;
}

/* ==========================================================================
   4. HOMEPAGE HERO — TEMPLE BACKGROUND & ORIGINAL CONTENT PRESERVATION
   ========================================================================== */

#home-section > section:first-of-type {
  background-image: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png') !important;
  background-size: cover !important;
  background-position: center right !important;
  background-repeat: no-repeat !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Subtle Readability Overlay: Preserves the temple on right and text on left */
#home-section > section:first-of-type::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    to right,
    rgba(255, 253, 247, 0.96) 0%,
    rgba(255, 253, 247, 0.88) 45%,
    rgba(255, 253, 247, 0.42) 72%,
    rgba(109, 13, 3, 0.16) 100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

#home-section > section:first-of-type > div {
  position: relative !important;
  z-index: 2 !important;
}

/* Left Hero Typography */
#home-section > section:first-of-type h1 {
  color: var(--color-deep-maroon) !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
}

#home-section > section:first-of-type .lg\:col-span-7 p {
  color: var(--color-primary-text) !important;
  line-height: 1.7 !important;
}

/* Founders Card Container - Shift leftwards so the carved temple pillar (sthambham) on the right is neatly visible */
#home-section > section:first-of-type .lg\:col-span-5 {
  justify-content: center !important;
  padding-right: clamp(1.5rem, 5vw, 5rem) !important;
}

#home-section > section:first-of-type .lg\:col-span-5 > div:last-child {
  margin-right: clamp(1rem, 3.5vw, 4rem) !important;
  box-shadow: 0 24px 50px -10px rgba(109, 13, 3, 0.45), 0 0 0 2px rgba(226, 173, 78, 0.6) !important;
  border-radius: 16px !important;
  border: 2px solid var(--color-antique-gold) !important;
  background: #FFFFFF !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* Founders Card Inner Plaque Colors: Rich Deep Maroon */
#home-section > section:first-of-type .lg\:col-span-5 .bg-\[\#0A1128\],
#home-section > section:first-of-type .lg\:col-span-5 [class*="bg-\[\#0A1128\]"] {
  background-color: var(--color-deep-maroon) !important;
  border-color: rgba(226, 173, 78, 0.45) !important;
}

/* Fix Founders & Chairman, Co-founder color: NEVER black! Luminous Warm Ivory and Gold */
#home-section > section:first-of-type .lg\:col-span-5 p {
  line-height: 1.35 !important;
}

#home-section > section:first-of-type .lg\:col-span-5 p.text-gold,
#home-section > section:first-of-type .lg\:col-span-5 .text-gold {
  color: var(--color-light-gold) !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
}

#home-section > section:first-of-type .lg\:col-span-5 p[class*="text-white"],
#home-section > section:first-of-type .lg\:col-span-5 .text-white\/50,
#home-section > section:first-of-type .lg\:col-span-5 .text-white\/60,
#home-section > section:first-of-type .lg\:col-span-5 .text-white {
  color: var(--color-warm-ivory) !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}

/* Prominent highlight on Registered Number */
.trust-regd-highlight {
  background: linear-gradient(135deg, rgba(244, 211, 120, 0.95), rgba(226, 173, 78, 0.95)) !important;
  color: #6D0D03 !important;
  font-weight: 800 !important;
  border: 1.5px solid #6D0D03 !important;
  box-shadow: 0 2px 8px rgba(109, 13, 3, 0.25) !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  letter-spacing: 0.05em !important;
}

/* ==========================================================================
   5. BRAND COLOR UTILITIES (Map #0A1128 & Navy to Deep Maroon)
   ========================================================================== */

.bg-\[\#0A1128\],
.bg-\[\#0a1128\],
.bg-navy {
  background-color: var(--color-deep-maroon) !important;
}

.bg-\[\#0A1128\]\/95,
.bg-navy\/95 {
  background-color: rgba(109, 13, 3, 0.95) !important;
}

.bg-\[\#0A1128\]\/80,
.bg-navy\/80 {
  background-color: rgba(109, 13, 3, 0.85) !important;
}

.bg-\[\#0A1128\]\/20,
.bg-navy\/15 {
  background-color: rgba(109, 13, 3, 0.20) !important;
}

.bg-\[\#0A1128\]\/5 {
  background-color: rgba(109, 13, 3, 0.05) !important;
}

.bg-\[\#070E20\] {
  background-color: var(--color-heritage-brown) !important;
}

.text-\[\#0A1128\],
.text-\[\#0a1128\] {
  color: var(--color-deep-maroon) !important;
}

.text-navy {
  color: var(--color-deep-maroon) !important;
}

.border-\[\#0A1128\],
.border-\[\#0a1128\],
.border-navy {
  border-color: var(--color-deep-maroon) !important;
}

/* Gold Accents */
.border-gold {
  border-color: var(--color-antique-gold) !important;
}

.text-gold {
  color: var(--color-antique-gold) !important;
}

.bg-gold {
  background-color: var(--color-antique-gold) !important;
}

/* Buttons in Original Layout */
button.bg-gold,
a.bg-gold {
  background-color: var(--color-antique-gold) !important;
  color: var(--color-deep-maroon) !important;
  font-weight: 700 !important;
}

button.bg-gold:hover,
a.bg-gold:hover {
  background-color: var(--color-light-gold) !important;
}

/* Floating Action Button: Request Support */
button[aria-label="Request Support"],
button.fixed.bottom-6.right-6,
button.fixed.bottom-8.right-8 {
  background-color: var(--color-primary-maroon) !important;
  border: 2px solid var(--color-antique-gold) !important;
  color: var(--color-warm-white) !important;
  box-shadow: 0 8px 24px rgba(109, 13, 3, 0.45) !important;
  z-index: 40 !important;
}

button[aria-label="Request Support"]:hover,
button.fixed.bottom-6.right-6:hover {
  background-color: var(--color-deep-maroon) !important;
  border-color: var(--color-light-gold) !important;
}

button[aria-label="Request Support"] span {
  background-color: var(--color-deep-maroon) !important;
  border: 1px solid var(--color-antique-gold) !important;
  color: var(--color-warm-white) !important;
}

/* Replace non-brand blues, teals, cyans */
.text-teal,
.text-teal-400,
.text-teal-500,
.text-teal-600 {
  color: var(--color-antique-gold) !important;
}

.bg-teal,
.bg-teal-50,
.bg-teal-100 {
  background-color: var(--color-warm-ivory) !important;
}

.text-blue-600,
.text-blue-700,
.text-blue-800,
.text-indigo-600 {
  color: var(--color-deep-maroon) !important;
}

.bg-blue-50,
.bg-indigo-50,
.bg-purple-50,
.bg-pink-50,
.bg-emerald-50 {
  background-color: rgba(238, 232, 201, 0.35) !important;
}

.text-sky-400,
.text-indigo-400,
.text-fuchsia-400,
.text-cyan-400,
.text-emerald-400 {
  color: var(--color-antique-gold) !important;
}

.bg-sky-500\/10,
.bg-emerald-500\/10,
.bg-indigo-500\/10,
.bg-fuchsia-500\/10,
.bg-teal-500\/10,
.bg-cyan-500\/10 {
  background-color: rgba(226, 173, 78, 0.12) !important;
}

.border-teal,
.border-emerald-200,
.border-blue-100,
.border-indigo-100 {
  border-color: #D8C49A !important;
}

/* ==========================================================================
   6. CONTACT US SECTION BRAND STYLING
   ========================================================================== */

#contact-us-section {
  color: var(--color-primary-text) !important;
}

#contact-us-section > div:first-of-type {
  background: linear-gradient(135deg, var(--color-deep-maroon) 0%, var(--color-primary-maroon) 100%) !important;
  border: 2px solid var(--color-antique-gold) !important;
}

#contact-us-section .lg\:col-span-5 {
  border: 1px solid rgba(226, 173, 78, 0.35) !important;
  background-color: var(--color-warm-white) !important;
}

#contact-us-section .lg\:col-span-5 .p-2.bg-cream {
  background-color: var(--color-deep-maroon) !important;
  border: 1px solid var(--color-antique-gold) !important;
}

#contact-us-section .lg\:col-span-5 .p-2.bg-cream svg {
  color: var(--color-light-gold) !important;
}

#contact-us-section .lg\:col-span-5 h3,
#contact-us-section .lg\:col-span-5 h4 {
  color: var(--color-deep-maroon) !important;
}

#contact-us-section .lg\:col-span-5 p {
  color: var(--color-secondary-text) !important;
}

#contact-us-section .lg\:col-span-7 {
  border: 1px solid rgba(226, 173, 78, 0.35) !important;
  background-color: var(--color-warm-white) !important;
}

#contact-us-section input,
#contact-us-section select,
#contact-us-section textarea {
  border: 1.5px solid #6D0D03 !important;
  background-color: #FFFFFF !important;
  color: #1A120B !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
}

#contact-us-section input::placeholder,
#contact-us-section textarea::placeholder {
  color: #65584D !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

#contact-us-section input:focus,
#contact-us-section select:focus,
#contact-us-section textarea:focus {
  border-color: #6D0D03 !important;
  box-shadow: 0 0 0 3px rgba(109, 13, 3, 0.2) !important;
  outline: none !important;
  background-color: #FFFFFF !important;
}

#contact-us-section label {
  color: #49271A !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

#contact-us-section .peer:focus ~ label,
#contact-us-section .peer:not(:placeholder-shown) ~ label {
  color: var(--color-deep-maroon) !important;
  background-color: #FFFFFF !important;
  font-weight: 800 !important;
}

#contact-form-submit-btn {
  background-color: var(--color-primary-maroon) !important;
  color: var(--color-warm-white) !important;
  border: 1.5px solid var(--color-antique-gold) !important;
  font-weight: 700 !important;
  transition: all 0.2s ease !important;
}

#contact-form-submit-btn:hover {
  background-color: var(--color-deep-maroon) !important;
  color: var(--color-light-gold) !important;
}

/* Selection Highlight */
::selection {
  background-color: rgba(226, 173, 78, 0.35) !important;
  color: var(--color-deep-maroon) !important;
}

/* ==========================================================================
   7. RESPONSIVENESS (MOBILE, TABLET & DESKTOP)
   ========================================================================== */

@media (max-width: 768px) {
  #brand-logo div:first-child {
    height: 52px !important;
  }
  
  #brand-logo img {
    height: 48px !important;
    max-width: 250px !important;
  }
  
  #home-section > section:first-of-type {
    padding-top: 2rem !important;
    padding-bottom: 3.5rem !important;
    background-position: 75% center !important;
  }
  
  #home-section > section:first-of-type::before {
    background: rgba(255, 253, 247, 0.94) !important;
  }

  button[aria-label="Request Support"] {
    bottom: 1.25rem !important;
    right: 1.25rem !important;
    padding: 0.85rem !important;
  }
}

/* ==========================================================================
   8. ADMINISTRATIVE DASHBOARD & OFFICER LOGIN BRAND STYLING
   ========================================================================== */

/* Universal Dashboard Typography */
#admin-management-portal,
#administrative-workstation,
#root-admin-viewport {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

/* Officer Login Screen: Streamlined, Minimalist, Centered & Highly Attractive */
#admin-management-portal:not(:has(#administrative-workstation)) {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: radial-gradient(circle at 50% 25%, #FFFDF7 0%, #F5ECE0 100%) !important;
  padding: 2rem 1rem !important;
}

/* Hide the cluttered left marketing panel completely */
#admin-management-portal:not(:has(#administrative-workstation)) .lg\:col-span-5 {
  display: none !important;
}

/* Center the grid layout as a single neat column */
#admin-management-portal:not(:has(#administrative-workstation)) .grid {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 480px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* High-End Dignified Card */
#admin-management-portal:not(:has(#administrative-workstation)) .lg\:col-span-7 {
  width: 100% !important;
  max-width: 460px !important;
  height: auto !important;
  min-height: auto !important;
  background: #FFFFFF !important;
  border-radius: 24px !important;
  border: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  box-shadow: 0 20px 48px -10px rgba(109, 13, 3, 0.16), 0 4px 16px rgba(0, 0, 0, 0.04) !important;
  padding: 2.5rem 2.25rem !important;
  margin: 0 auto !important;
}

/* Hide unneeded clutter boxes like "SECURE ACCESS" disclaimer */
#admin-management-portal:not(:has(#administrative-workstation)) .bg-emerald-50,
#admin-management-portal:not(:has(#administrative-workstation)) .border-emerald-100 {
  display: none !important;
}

/* Sacred Seal Emblem in Login Header */
#admin-management-portal:not(:has(#administrative-workstation)) .w-14.h-14,
#admin-management-portal:not(:has(#administrative-workstation)) .w-16.h-16 {
  width: 76px !important;
  height: 76px !important;
  border-radius: 9999px !important;
  border: 2.5px solid #E2AD4E !important;
  box-shadow: 0 4px 18px rgba(109, 13, 3, 0.28) !important;
  background: #FFFFFF !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 auto 1rem auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) .w-14.h-14 img,
#admin-management-portal:not(:has(#administrative-workstation)) .w-16.h-16 img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 9999px !important;
  display: block !important;
}

/* Typography */
#admin-management-portal:not(:has(#administrative-workstation)) h2 {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  color: #6D0D03 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 0.25rem !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) p {
  color: #65584D !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
}

/* Gold Accent Underline */
#admin-management-portal:not(:has(#administrative-workstation)) .h-0\.5 {
  background: linear-gradient(90deg, transparent, #E2AD4E, transparent) !important;
  height: 2px !important;
  margin: 0.75rem auto 1.25rem auto !important;
}

/* Form Input Enhancements */
#admin-management-portal:not(:has(#administrative-workstation)) input[type="email"],
#admin-management-portal:not(:has(#administrative-workstation)) input[type="password"] {
  background-color: #FFFDF7 !important;
  border: 1.5px solid #E5DEC6 !important;
  color: #2E211A !important;
  font-size: 0.875rem !important;
  border-radius: 12px !important;
  padding: 0.85rem 1rem 0.85rem 2.75rem !important;
  transition: all 0.2s ease !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) input[type="email"]:focus,
#admin-management-portal:not(:has(#administrative-workstation)) input[type="password"]:focus {
  border-color: #E2AD4E !important;
  box-shadow: 0 0 0 3.5px rgba(226, 173, 78, 0.2) !important;
  outline: none !important;
  background-color: #FFFFFF !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) label {
  color: #49271A !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 0.35rem !important;
}

/* Submit Action Button */
#admin-management-portal:not(:has(#administrative-workstation)) button[type="submit"] {
  background: linear-gradient(135deg, #6D0D03 0%, #B52F28 100%) !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 12px !important;
  padding: 0.9rem 1.5rem !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  box-shadow: 0 4px 16px rgba(109, 13, 3, 0.25) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  width: 100% !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) button[type="submit"]:hover {
  background: linear-gradient(135deg, #B52F28 0%, #6D0D03 100%) !important;
  color: #F4D378 !important;
  transform: translateY(-1.5px) !important;
  box-shadow: 0 6px 20px rgba(109, 13, 3, 0.35) !important;
}

/* Return to Public Portal Link */
#admin-management-portal:not(:has(#administrative-workstation)) a {
  color: #6D0D03 !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  transition: color 0.2s ease !important;
}

#admin-management-portal:not(:has(#administrative-workstation)) a:hover {
  color: #E2AD4E !important;
  text-decoration: underline !important;
}


/* Dashboard Sidebar Styling */
#administrative-workstation aside {
  background-color: var(--color-deep-maroon) !important;
  border-right: 2px solid rgba(226, 173, 78, 0.3) !important;
}

/* Dashboard Sidebar Inactive Buttons: Clear Warm White text */
#administrative-workstation aside button {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  color: #FFFDF7 !important;
  border-radius: 12px !important;
  transition: all 0.2s ease !important;
}

#administrative-workstation aside button span {
  color: #FFFDF7 !important;
  font-weight: 600 !important;
}

#administrative-workstation aside button svg {
  color: var(--color-light-gold) !important;
}

#administrative-workstation aside button:hover {
  background-color: rgba(226, 173, 78, 0.18) !important;
  color: #FFFFFF !important;
}

#administrative-workstation aside button:hover span {
  color: #FFFFFF !important;
}

/* Dashboard Sidebar Active Button: Antique Gold with Deep Maroon Text */
#administrative-workstation aside button.bg-white\/10 {
  background-color: var(--color-antique-gold) !important;
  color: var(--color-deep-maroon) !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
}

#administrative-workstation aside button.bg-white\/10 svg,
#administrative-workstation aside button.bg-white\/10 span {
  color: var(--color-deep-maroon) !important;
  font-weight: 800 !important;
}

/* Dashboard Top Header Bar */
#administrative-workstation header,
#administrative-workstation div:has(> button[title="Toggle Sidebar"]) {
  background-color: #FFFFFF !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.35) !important;
}

#administrative-workstation header h2,
#administrative-workstation header h3 {
  color: var(--color-deep-maroon) !important;
  font-weight: 800 !important;
}

/* Dashboard Main Content Area */
#administrative-workstation main {
  background-color: #FAF8F5 !important;
}

/* Stat Cards & Content Cards */
#administrative-workstation .bg-white {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(226, 173, 78, 0.28) !important;
  box-shadow: 0 2px 8px rgba(109, 13, 3, 0.04) !important;
  border-radius: 16px !important;
}

/* Primary Action Buttons in Dashboard */
#administrative-workstation button.bg-blue-600,
#administrative-workstation button.bg-indigo-600,
#administrative-workstation button.bg-navy {
  background-color: var(--color-deep-maroon) !important;
  color: #FFFFFF !important;
  border: 1px solid var(--color-antique-gold) !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 6px rgba(109, 13, 3, 0.2) !important;
}

#administrative-workstation button.bg-blue-600:hover,
#administrative-workstation button.bg-indigo-600:hover,
#administrative-workstation button.bg-navy:hover {
  background-color: var(--color-primary-maroon) !important;
  color: var(--color-light-gold) !important;
}

/* AI Sparkles Icon Suppression */
.animate-icon-pulse,
svg.animate-icon-pulse,
svg.lucide-sparkles,
svg[data-icon="sparkles"] {
  display: none !important;
}

/* Unified Page & Module Alignment: Clean Symmetrical Width without Squeezing */
#root-app-viewport > main {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#root-app-viewport > main > div {
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Align section containers cleanly */
#home-section,
#about-section,
#services-section,
#activities-section,
#stories-section,
#gallery-section,
#forms-section {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Ensure inner container widths expand forward nicely to match header boundaries */
#root-app-viewport .max-w-7xl,
#root-app-viewport .max-w-6xl {
  max-width: 1540px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(1rem, 2.5vw, 2.5rem) !important;
  padding-right: clamp(1rem, 2.5vw, 2.5rem) !important;
}

/* Dashboard Sidebar Non-Destructive Logo and Collapse Styling */
#administrative-workstation aside {
  background-color: var(--color-deep-maroon) !important;
}

#administrative-workstation aside > div:first-child {
  background: var(--color-deep-maroon) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* When expanded (w-72), show the wide logo and hide redundant text */
#administrative-workstation aside.w-72 > div:first-child .rounded-full {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 72px !important;
  border-radius: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#administrative-workstation aside.w-72 > div:first-child img {
  content: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/W_Logo.png') !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 68px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  display: block !important;
}

#administrative-workstation aside.w-72 > div:first-child .text-left {
  display: none !important;
}

/* When collapsed (w-20), show the circular sacred seal emblem */
#administrative-workstation aside.w-20 > div:first-child .rounded-full {
  width: 44px !important;
  height: 44px !important;
  border-radius: 9999px !important;
  border: 1.5px solid var(--color-antique-gold) !important;
  background: #FFFFFF !important;
  padding: 2px !important;
}

#administrative-workstation aside.w-20 > div:first-child img {
  content: url('https://ik.imagekit.io/bpctrust/bendapudi/branding/new_logo.jpg') !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 9999px !important;
}

/* ==========================================================================
   FOOTER 5-COLUMN GRID & SINGLE-LINE COPYRIGHT
   ========================================================================== */

@media (min-width: 1024px) {
  #trust-footer .grid {
    grid-template-columns: 1.35fr 1fr 1fr 1.15fr 0.95fr !important;
    gap: 2rem !important;
  }
}

@media (min-width: 640px) and (max-width: 1023px) {
  #trust-footer .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2.25rem !important;
  }
}

#trust-footer > div > div:last-child,
#trust-footer .border-t {
  border-top: 1px solid rgba(226, 173, 78, 0.3) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 0.85rem !important;
  padding-top: 1.75rem !important;
}

#trust-footer > div > div:last-child > div:first-child {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  gap: 16px !important;
}

#trust-footer > div > div:last-child > div:last-child {
  text-align: center !important;
  width: 100% !important;
  font-size: 12px !important;
  color: rgba(255, 253, 247, 0.7) !important;
}


/* ==========================================================================
   LEGACY FOUNDERS (#about-section) BRAND UNIFICATION
   ========================================================================== */

#about-section .bg-navy {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

#about-section .text-navy {
  color: #6D0D03 !important;
}

#about-section .text-navy-light {
  color: #2E211A !important;
}

#about-section a[href*="prabhakar-rao"],
#about-section a[href*="swatantra-lakshmi"],
#about-section .founder-profile-cta a {
  background-color: #6D0D03 !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  transition: all 0.25s ease !important;
}

#about-section a[href*="prabhakar-rao"]:hover,
#about-section a[href*="swatantra-lakshmi"]:hover,
#about-section .founder-profile-cta a:hover {
  background-color: #B52F28 !important;
  border-color: #F4D378 !important;
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   REQUEST SUPPORT (#forms-portal) & CONTACT US (#contact-us-section)
   STANDARDIZED INSTITUTIONAL PAGE HEADERS
   ========================================================================== */

#forms-portal > div:first-child,
#contact-us-section > div:first-child,
#forms-portal .bg-gradient-to-r,
#contact-us-section .bg-gradient-to-r {
  background: linear-gradient(135deg, #6D0D03 0%, #B52F28 60%, #49271A 100%) !important;
  border: 2px solid #E2AD4E !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(109, 13, 3, 0.25) !important;
  color: #FFFDF7 !important;
}

#forms-portal > div:first-child h1,
#contact-us-section > div:first-child h1 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  letter-spacing: -0.01em !important;
}

#forms-portal > div:first-child span,
#contact-us-section > div:first-child span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.15em !important;
}

#forms-portal > div:first-child p,
#contact-us-section > div:first-child p {
  color: #EEE8C9 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  line-height: 1.6 !important;
}

/* Remove decorative blur spheres that had navy tint */
#forms-portal .bg-navy-light\/20,
#contact-us-section .bg-navy-light\/20 {
  background-color: rgba(226, 173, 78, 0.15) !important;
}

/* ==========================================================================
   OUR SERVICES (#activities-section) BRAND PALETTE & FONT REVIEW
   100% Elimination of Blue / Navy Colors
   ========================================================================== */

/* 1. Services Top Banner */
#activities-section > div:first-child,
#activities-section .bg-\[\#6D0D03\] {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

#activities-section > div:first-child span.text-\[\#E2AD4E\] {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.25em !important;
}

#activities-section > div:first-child h1 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

#activities-section > div:first-child h1.text-\[\#E2AD4E\] {
  color: #F4D378 !important;
}

#activities-section > div:first-child p {
  color: #EEE8C9 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}

/* 2. Service Image Gradient Overlays (Replaces Navy Blue) */
#activities-section div[style*="rgba(10,17,40"],
#activities-section div[style*="rgba(10, 17, 40"] {
  background: linear-gradient(to right, rgba(109, 13, 3, 0.65) 0%, transparent 100%) !important;
}

/* 3. Service 01, Service 02 Badges */
#activities-section div[class*="rounded-full"][class*="uppercase"] {
  background: #6D0D03 !important;
  color: #FFFDF7 !important;
  border: 1px solid #E2AD4E !important;
  box-shadow: 0 4px 12px rgba(109, 13, 3, 0.3) !important;
}

/* 4. Service Icons */
#activities-section .w-12.h-12.rounded-2xl {
  background: #6D0D03 !important;
  border: 1.5px solid #E2AD4E !important;
  box-shadow: 0 4px 14px rgba(109, 13, 3, 0.25) !important;
}

#activities-section .w-12.h-12.rounded-2xl svg {
  color: #E2AD4E !important;
}

/* 5. Service Titles & Headings in Cards (NOT bottom banner) */
#activities-section .bg-white h2,
#activities-section .bg-white h3 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

/* 6. Service Descriptions & Text in Cards (High contrast dark brown, NEVER white) */
#activities-section .bg-white p,
#activities-section .bg-white p.text-sm,
#activities-section .bg-white li,
#activities-section .bg-white .text-\[\#243446\] {
  color: #2E211A !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  font-weight: 450 !important;
}

/* 7. Checklist Checkmark Icons */
#activities-section .bg-white ul li svg {
  color: #B52F28 !important;
}

/* 8. Card Summary and Apply CTA */
#activities-section .bg-white .border-t p,
#activities-section .bg-white p.max-w-xs {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  color: #65584D !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  line-height: 1.5 !important;
}

#activities-section .bg-white .border-t button,
#activities-section .bg-white button:has(svg) {
  color: #B52F28 !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
}

#activities-section .bg-white .border-t button:hover {
  color: #E2AD4E !important;
}

/* 9. Bottom Support CTA Card in Services */
#activities-section .bg-\[\#6D0D03\]:last-child,
#activities-section > div:last-child {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-top: 2px solid #E2AD4E !important;
}


/* ==========================================================================
   UNIFIED LEFT-ALIGNED HERO HEADERS FOR STANDALONE PAGES
   (Legacy Founders, Impact & Stories, Gallery, Request Support, Contact Us, Services)
   Strictly scoped to standalone pages - NEVER applied to embedded modules on #home-section
   ========================================================================== */

#about-section:not(#home-section *) > div:first-child,
#stories-section:not(#home-section *) > div:first-child,
#gallery-section:not(#home-section *) > div:first-child,
#forms-portal:not(#home-section *) > div:first-child,
#contact-us-section:not(#home-section *) > div:first-child,
#activities-section > div:first-child {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
  text-align: left !important;
}

#about-section:not(#home-section *) > div:first-child .max-w-4xl,
#about-section:not(#home-section *) > div:first-child .max-w-2xl,
#stories-section:not(#home-section *) > div:first-child .max-w-4xl,
#stories-section:not(#home-section *) > div:first-child .max-w-2xl,
#gallery-section:not(#home-section *) > div:first-child .max-w-4xl,
#gallery-section:not(#home-section *) > div:first-child .max-w-2xl,
#forms-portal:not(#home-section *) > div:first-child .max-w-4xl,
#forms-portal:not(#home-section *) > div:first-child .max-w-2xl,
#contact-us-section:not(#home-section *) > div:first-child .max-w-4xl,
#contact-us-section:not(#home-section *) > div:first-child .max-w-2xl {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

#about-section:not(#home-section *) > div:first-child h1,
#stories-section:not(#home-section *) > div:first-child h1,
#gallery-section:not(#home-section *) > div:first-child h1,
#forms-portal:not(#home-section *) > div:first-child h1,
#contact-us-section:not(#home-section *) > div:first-child h1,
#activities-section > div:first-child h1 {
  text-align: left !important;
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

#about-section:not(#home-section *) > div:first-child span,
#stories-section:not(#home-section *) > div:first-child span,
#gallery-section:not(#home-section *) > div:first-child span,
#forms-portal:not(#home-section *) > div:first-child span,
#contact-us-section:not(#home-section *) > div:first-child span,
#activities-section > div:first-child span {
  text-align: left !important;
  color: #E2AD4E !important;
}

#about-section:not(#home-section *) > div:first-child p,
#stories-section:not(#home-section *) > div:first-child p,
#gallery-section:not(#home-section *) > div:first-child p,
#forms-portal:not(#home-section *) > div:first-child p,
#contact-us-section:not(#home-section *) > div:first-child p,
#activities-section > div:first-child p {
  text-align: left !important;
  margin-left: 0 !important;
  color: #EEE8C9 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}

/* Ensure board member cards and images are explicitly pointer and hover interactive */
#about-section .grid .group,
#about-section .grid .heritage-card,
#about-section .rounded-full img {
  cursor: pointer !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

#about-section .grid .group:hover,
#about-section .grid .heritage-card:hover {
  transform: translateY(-4px) !important;
}

/* Hide separate board member links and CTAs */
#desktop-board-members-link,
#all-board-members-cta,
.member-page-cta {
  display: none !important;
}

/* ==========================================================================
   TRUST BOARD MEMBERS: BORDERLESS, SLEEK & ATTRACTIVE CARDS
   ========================================================================== */
#about-section .grid .group,
#about-section .grid a[href*="profile"],
#about-section .grid .heritage-card,
#about-section .grid .rounded-card {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0.85rem 0.6rem !important;
  border-radius: 18px !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
}

#about-section .grid .group:hover,
#about-section .grid a[href*="profile"]:hover,
#about-section .grid .heritage-card:hover {
  transform: translateY(-8px) !important;
  background: rgba(255, 255, 255, 0.65) !important;
  box-shadow: 0 20px 35px -10px rgba(109, 13, 3, 0.12), 0 0 0 1px rgba(226, 173, 78, 0.35) !important;
}

/* Golden Halo Concentric Portrait Rings */
#about-section .grid .group .rounded-full,
#about-section .grid a[href*="profile"] .rounded-full {
  border: 3px solid #E2AD4E !important;
  box-shadow: 0 10px 24px -4px rgba(109, 13, 3, 0.22), 0 0 0 4px rgba(226, 173, 78, 0.2) !important;
  transition: all 0.35s ease !important;
}

#about-section .grid .group:hover .rounded-full,
#about-section .grid a[href*="profile"]:hover .rounded-full {
  border-color: #F4D378 !important;
  box-shadow: 0 14px 30px -4px rgba(109, 13, 3, 0.32), 0 0 0 7px rgba(226, 173, 78, 0.4) !important;
  transform: scale(1.05) !important;
}

/* Board Member Name - Deep Maroon, Sharp, Elegant */
#about-section .grid .group h4,
#about-section .grid a[href*="profile"] h4 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  margin-top: 0.4rem !important;
  margin-bottom: 0.25rem !important;
  transition: color 0.25s ease !important;
}

#about-section .grid .group:hover h4,
#about-section .grid a[href*="profile"]:hover h4 {
  color: #B52F28 !important;
}

/* Board Member Role & Qualifications Pill */
#about-section .grid .group p,
#about-section .grid a[href*="profile"] p {
  color: #65584D !important;
  font-weight: 700 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#about-section .grid .group span,
#about-section .grid a[href*="profile"] span {
  background: rgba(226, 173, 78, 0.15) !important;
  color: #6D0D03 !important;
  border: 1px solid rgba(226, 173, 78, 0.45) !important;
  font-weight: 700 !important;
  font-size: 0.72rem !important;
  padding: 0.2rem 0.75rem !important;
  border-radius: 9999px !important;
  display: inline-block !important;
  margin-top: 0.4rem !important;
}

/* Generous Breathing Space Before Footer Section */
#about-section {
  padding-bottom: 7.5rem !important;
  margin-bottom: 0 !important;
}

#about-section > div:last-child {
  margin-bottom: 5.5rem !important;
  padding-bottom: 2rem !important;
}


/* Kicker gold bar/dash across all page headers */
.kicker-gold-bar {
  display: inline-block !important;
  width: 32px !important;
  height: 2.5px !important;
  background-color: #E2AD4E !important;
  margin-right: 10px !important;
  vertical-align: middle !important;
  border-radius: 2px !important;
}

/* Our Services (#activities-section) banner & CTA contrast enforcement */
#activities-section > div:first-child {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

#activities-section > div:first-child p,
#activities-section > div:first-child .text-white\/60 {
  color: #FFFDF7 !important;
  opacity: 0.95 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 15.5px !important;
  line-height: 1.7 !important;
}

#activities-section > div:first-child span.text-\[\#E2AD4E\] {
  color: #E2AD4E !important;
  font-weight: 800 !important;
}

#activities-section > div:first-child .text-white\/40,
#activities-section > div:first-child span[class*="text-white"] {
  color: #EEE8C9 !important;
  opacity: 0.9 !important;
  font-weight: 700 !important;
}

/* Top Banner Right CTA Card styling (ONLY in first child!) */
#activities-section > div:first-child .max-w-xs {
  background: rgba(73, 39, 26, 0.75) !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 24px !important;
  box-shadow: 0 10px 30px rgba(109, 13, 3, 0.35) !important;
  padding: 1.75rem !important;
}

#activities-section > div:first-child .max-w-xs p {
  color: #EEE8C9 !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
}

#activities-section > div:first-child .max-w-xs button:first-of-type {
  background-color: #E2AD4E !important;
  color: #6D0D03 !important;
  border: 1.5px solid #F4D378 !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 16px rgba(226, 173, 78, 0.35) !important;
}

#activities-section > div:first-child .max-w-xs button:first-of-type span {
  color: #6D0D03 !important;
  font-weight: 800 !important;
}

#activities-section > div:first-child .max-w-xs button:first-of-type svg {
  color: #6D0D03 !important;
}

#activities-section > div:first-child .max-w-xs button:last-of-type {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  font-weight: 700 !important;
}

#activities-section > div:first-child .max-w-xs button:last-of-type:hover {
  background-color: rgba(226, 173, 78, 0.2) !important;
  border-color: #F4D378 !important;
  color: #FFFDF7 !important;
}

/* Bottom CTA in Our Services - Luminous Contrast */
#activities-section > div:last-child,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type,
#activities-section .relative.bg-\[\#0A1128\],
#activities-section .relative.bg-navy {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-top: 2px solid #E2AD4E !important;
}

#activities-section > div:last-child h2,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type h2 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

#activities-section > div:last-child h2 span,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type h2 span {
  color: #F4D378 !important;
}

#activities-section > div:last-child p,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type p {
  color: #FFFDF7 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
}

#activities-section > div:last-child button:first-of-type,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type button:first-of-type {
  background-color: #E2AD4E !important;
  color: #6D0D03 !important;
  border: 1.5px solid #F4D378 !important;
  font-weight: 800 !important;
  box-shadow: 0 6px 20px rgba(226, 173, 78, 0.4) !important;
}

#activities-section > div:last-child button:first-of-type span,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type button:first-of-type span {
  color: #6D0D03 !important;
  font-weight: 800 !important;
}

#activities-section > div:last-child button:first-of-type svg,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type button:first-of-type svg {
  color: #6D0D03 !important;
}

#activities-section > div:last-child button:last-of-type,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type button:last-of-type {
  background: transparent !important;
  border: 1.5px solid rgba(244, 211, 120, 0.8) !important;
  color: #FFFDF7 !important;
  font-weight: 700 !important;
}

#activities-section > div:last-child button:last-of-type:hover,
#activities-section .relative.bg-\[\#6D0D03\]:last-of-type button:last-of-type:hover {
  background: rgba(226, 173, 78, 0.15) !important;
  border-color: #E2AD4E !important;
  color: #F4D378 !important;
}

/* Request Support Horizontal Divider Removal */
#forms-portal .grid .absolute.top-1\/2,
#forms-portal .grid .absolute[class*="top-1/2"],
#forms-section .grid .absolute.top-1\/2,
#forms-section .grid .absolute[class*="top-1/2"] {
  display: none !important;
}

/* Hide center gold dividers below headings across all pages */
#about-section .w-16.h-1,
#stories-section .w-16.h-1,
#gallery-section .w-16.h-1,
#forms-portal .w-16.h-1,
#contact-us-section .w-16.h-1,
.w-24.h-1.bg-gold.mx-auto,
.w-16.h-1.bg-\[\#E2AD4E\].mx-auto,
.w-16.h-1.bg-gold.mx-auto {
  display: none !important;
}


/* ==========================================================================
   HOMEPAGE COHESIVE BRAND FLOW & SECTION HARMONY
   Eliminating harsh white/gold separation borders, fixing Success Stories & Gallery
   ========================================================================== */

/* 1. Hero Section - Full width, seamless transition into Our Impact */
#home-section > section:first-of-type {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: none !important;
  border-bottom: none !important;
  padding-bottom: 3.5rem !important;
  box-shadow: none !important;
}

/* 2. Our Impact Section - Seamless Deep Maroon, no white border above */
#home-section > section:nth-of-type(2) {
  width: 100% !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  margin-top: 0 !important;
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

#home-section > section:nth-of-type(2) span.text-gold {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.2em !important;
}

#home-section > section:nth-of-type(2) h2 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

/* 3. How We Help - Soft Warm Ivory Canvas (#FAF8F5), smooth flow */
#home-section > section:nth-of-type(3) {
  background-color: #FAF8F5 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

#home-section > section:nth-of-type(3) span.text-teal,
#home-section > section:nth-of-type(3) span.text-gold {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.25em !important;
}

#home-section > section:nth-of-type(3) h2 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

#home-section > section:nth-of-type(3) p.text-navy-light {
  color: #49271A !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
}

/* 4. Success Stories on Homepage - Warm Ivory Canvas, Bold Maroon Title, High Contrast Cards */
#home-section #stories-section {
  background-color: #FAF8F5 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding-top: 2rem !important;
  padding-bottom: 5rem !important;
  text-align: center !important;
}

#home-section #stories-section > div:first-child {
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Success Stories Heading: Deep Maroon #6D0D03 (Bold, crisp, 100% visible) */
#home-section #stories-section h2,
#home-section #stories-section h2.text-navy {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: clamp(2.2rem, 4vw, 3rem) !important;
  font-weight: 800 !important;
  text-align: center !important;
  margin-bottom: 0.5rem !important;
}

#home-section #stories-section span.text-teal,
#home-section #stories-section span.text-gold {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.25em !important;
  text-align: center !important;
  display: block !important;
}

/* 3 Story Cards on Homepage: Clean, High Contrast, Uniform */
#home-section #stories-section .grid > div {
  background-color: #FFFFFF !important;
  border: 1.5px solid rgba(226, 173, 78, 0.35) !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 30px rgba(109, 13, 3, 0.08) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  overflow: hidden !important;
}

#home-section #stories-section .grid > div:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 40px rgba(109, 13, 3, 0.15) !important;
  border-color: #E2AD4E !important;
}

#home-section #stories-section .grid > div span.text-gold {
  color: #B52F28 !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
  font-size: 11px !important;
}

#home-section #stories-section .grid > div h3,
#home-section #stories-section .grid > div h3.text-navy {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.22rem !important;
  line-height: 1.4 !important;
}

#home-section #stories-section .grid > div p,
#home-section #stories-section .grid > div p.text-navy-light\/80 {
  color: #2E211A !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  font-weight: 450 !important;
}

#home-section #stories-section .grid > div .border-t {
  border-top: 1px solid rgba(226, 173, 78, 0.25) !important;
}

#home-section #stories-section .grid > div .border-t span {
  color: #49271A !important;
  font-weight: 700 !important;
}

#home-section #stories-section .grid > div .border-t button {
  color: #B52F28 !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
}

#home-section #stories-section .grid > div .border-t button:hover {
  color: #E2AD4E !important;
}

/* 5. Photo Gallery on Homepage - Seamless Deep Maroon showcase, no divider border */
#home-section #gallery-section {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding-top: 4.5rem !important;
  padding-bottom: 5.5rem !important;
  text-align: center !important;
}

#home-section #gallery-section > div:first-child {
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#home-section #gallery-section h2 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: clamp(2.2rem, 4vw, 3rem) !important;
  font-weight: 800 !important;
  text-align: center !important;
}

#home-section #gallery-section span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.25em !important;
  text-align: center !important;
}

/* 6. Contact Us on Homepage - Smooth Warm Ivory Canvas, clean plaque */
#home-section #contact-us-section {
  background-color: #FAF8F5 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding-top: 4.5rem !important;
  padding-bottom: 6rem !important;
}

#home-section #contact-us-section > div:first-child {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border: 2px solid #E2AD4E !important;
  border-radius: 24px !important;
  box-shadow: 0 16px 40px rgba(109, 13, 3, 0.22) !important;
}

/* Remove all harsh divider borders cutting across home modules */
#home-section .border-t.border-gold\/10,
#home-section .border-t.border-white\/10,
#home-section #stories-section .border-t.border-gold\/10,
#home-section #gallery-section .border-t.border-gold\/10,
#home-section .fade-in-up.border-t,
#home-section .border-t.border-gold\/20 {
  border-top: none !important;
}



/* ==========================================================================
   HOMEPAGE SECTION HARMONIZATION & BRAND BACKGROUNDS
   Seamless, high-contrast, beautiful alternating rhythm
   ========================================================================== */

/* 1. Global Home Section Base */
#home-section {
  background-color: #FAF5EA !important;
  overflow-x: hidden !important;
  width: 100% !important;
}

#home-section section,
#home-section #stories-section,
#home-section #gallery-section,
#home-section #contact-us-section {
  border-top: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Ensure all animated items on homepage are fully visible immediately */
#home-section [data-sr],
#home-section .reveal-scroll,
#home-section .fade-in-up,
#home-section .group {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* 2. SECTION 1: HERO - RESTORE PREVIOUS TEMPLE BACKGROUND IMAGE */
#home-section > section:nth-of-type(1) {
  position: relative !important;
  background-image: linear-gradient(to right, rgba(255, 253, 247, 0.94) 0%, rgba(255, 253, 247, 0.82) 42%, rgba(255, 253, 247, 0.38) 70%, rgba(109, 13, 3, 0.15) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png?tr=w-1600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-bottom: 2px solid rgba(226, 173, 78, 0.4) !important;
  padding-top: 2rem !important;
  padding-bottom: 5rem !important;
}

/* 3. SECTION 2: OUR IMPACT (DEEP MAROON) */
#home-section > section:nth-of-type(2) {
  background: linear-gradient(135deg, #6D0D03 0%, #520B02 50%, #49271A 100%) !important;
  border: none !important;
  padding-top: 5rem !important;
  padding-bottom: 5.5rem !important;
  margin: 0 !important;
}

#home-section > section:nth-of-type(2) span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

#home-section > section:nth-of-type(2) h2 {
  color: #FFFFFF !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

/* 4. SECTION 3: HOW WE HELP / ACTIVITIES (WARM ROYAL CREAM) */
#home-section > section:nth-of-type(3) {
  background: linear-gradient(180deg, #FAF5EA 0%, #F5ECE0 50%, #FAF5EA 100%) !important;
  border: none !important;
  padding-top: 5.5rem !important;
  padding-bottom: 5.5rem !important;
  margin: 0 !important;
}

#home-section > section:nth-of-type(3) span {
  color: #C59336 !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

#home-section > section:nth-of-type(3) h2 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

#home-section > section:nth-of-type(3) p.text-navy-light {
  color: #49271A !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
}

#home-section > section:nth-of-type(3) .bg-white {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(226, 173, 78, 0.25) !important;
  box-shadow: 0 8px 24px rgba(73, 39, 26, 0.08) !important;
  border-radius: 16px !important;
}

#home-section > section:nth-of-type(3) .bg-white h3 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
}

#home-section > section:nth-of-type(3) .bg-white p {
  color: #2E211A !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

#home-section > section:nth-of-type(3) .bg-white button {
  color: #C59336 !important;
  font-weight: 800 !important;
}

#home-section > section:nth-of-type(3) .bg-white button:hover {
  color: #6D0D03 !important;
}

/* 5. SECTION 4: SUCCESS STORIES (DEEP MAROON) */
#home-section #stories-section {
  background: linear-gradient(135deg, #5A0B02 0%, #6D0D03 50%, #49271A 100%) !important;
  border: none !important;
  border-top: none !important;
  padding-top: 5.5rem !important;
  padding-bottom: 5.5rem !important;
  margin: 0 !important;
  display: flex !important;
  visibility: visible !important;
}

#home-section #stories-section > div:first-child {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#home-section #stories-section span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

#home-section #stories-section h2,
#home-section #stories-section .text-navy,
#home-section #stories-section h2.text-navy {
  color: #FFFFFF !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

#home-section #stories-section p {
  color: #EEE8C9 !important;
}

/* Hide the old single solid gold bar so only the diamond divider appears */
#home-section #stories-section .w-16.h-1.bg-gold {
  display: none !important;
}

/* Success Stories Posts: ALIGN ALL TEXT COPYS TO LEFT */
#home-section #stories-section .grid > div {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(226, 173, 78, 0.35) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22) !important;
  border-radius: 16px !important;
  text-align: left !important;
}

#home-section #stories-section .grid > div * {
  text-align: left !important;
}

#home-section #stories-section .grid > div h3,
#home-section #stories-section .grid > div h4 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
}

#home-section #stories-section .grid > div p {
  color: #2E211A !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

#home-section #stories-section .grid > div span {
  text-align: left !important;
}

#home-section #stories-section .grid > div button,
#home-section #stories-section .grid > div a {
  align-self: flex-start !important;
  text-align: left !important;
}

/* 6. SECTION 5: PHOTO GALLERY (WARM ROYAL CREAM) */
#home-section #gallery-section {
  background: linear-gradient(180deg, #FDFBF7 0%, #F5EFE0 50%, #FAF5EA 100%) !important;
  border: none !important;
  border-top: none !important;
  padding-top: 5.5rem !important;
  padding-bottom: 5.5rem !important;
  margin: 0 !important;
  display: flex !important;
  visibility: visible !important;
}

#home-section #gallery-section > div {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Hide the old single solid gold bar in gallery */
#home-section #gallery-section .w-16.h-1.bg-gold {
  display: none !important;
}

#home-section #gallery-section span {
  color: #C59336 !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

#home-section #gallery-section h2 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

#home-section #gallery-section p {
  color: #49271A !important;
}

#home-section #gallery-section img {
  border: 2px solid rgba(226, 173, 78, 0.4) !important;
  box-shadow: 0 10px 28px rgba(73, 39, 26, 0.12) !important;
  border-radius: 16px !important;
}

/* 7. SECTION 6: CONTACT THE TRUST OFFICE (FULL WIDTH DEEP MAROON) */
#home-section #contact-us-section {
  background: linear-gradient(135deg, #6D0D03 0%, #520B02 50%, #49271A 100%) !important;
  border: none !important;
  border-top: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-top: 5.5rem !important;
  padding-bottom: 6rem !important;
  margin: 0 !important;
  display: block !important;
  visibility: visible !important;
}

#home-section #contact-us-section > div:first-child {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 3rem !important;
  text-align: center !important;
}

#home-section #contact-us-section > div:first-child .relative.z-10 {
  text-align: center !important;
}

#home-section #contact-us-section span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

#home-section #contact-us-section h1,
#home-section #contact-us-section h2 {
  color: #FFFFFF !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 800 !important;
  text-align: center !important;
}

#home-section #contact-us-section > div:first-child p {
  color: #EEE8C9 !important;
  text-align: center !important;
  max-width: 650px !important;
  margin: 8px auto 0 auto !important;
}

/* Contact Cards inside homepage Contact Section */
#home-section #contact-us-section .grid > div,
#home-section #contact-us-section .bg-white {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(226, 173, 78, 0.35) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.25) !important;
  border-radius: 16px !important;
}

#home-section #contact-us-section .bg-white h2,
#home-section #contact-us-section .bg-white h3,
#home-section #contact-us-section .bg-white h4 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
}

#home-section #contact-us-section .bg-white p,
#home-section #contact-us-section .bg-white span {
  color: #2E211A !important;
}

#home-section #contact-us-section input,
#home-section #contact-us-section textarea,
#home-section #contact-us-section select {
  background-color: #FFFDF7 !important;
  color: #2E211A !important;
  border: 1px solid rgba(73, 39, 26, 0.25) !important;
  border-radius: 8px !important;
}

#home-section #contact-us-section button[type="submit"],
#home-section #contact-us-section button:has(svg) {
  background-color: #6D0D03 !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  font-weight: 700 !important;
}

#home-section #contact-us-section button[type="submit"]:hover {
  background-color: #B52F28 !important;
}

/* 8. UNIFIED DIAMOND DIVIDER */
.trust-diamond-divider {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 14px auto !important;
  width: 128px !important;
}

.trust-diamond-divider .dia-line {
  height: 1px !important;
  flex-grow: 1 !important;
  background-color: rgba(226, 173, 78, 0.55) !important;
}

.trust-diamond-divider .dia-dot {
  width: 6.5px !important;
  height: 6.5px !important;
  transform: rotate(45deg) !important;
  background-color: #E2AD4E !important;
  flex-shrink: 0 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.15) !important;
}


/* ==========================================================================
   STANDALONE PAGES FULL-WIDTH HEADERS (REQUEST SUPPORT, CONTACT US, ETC.)
   Matches Our Services & Impact Pages Exactly: Full width, no white gaps
   ========================================================================== */

#forms-portal,
body:has(#forms-portal) #forms-portal,
#contact-us-section:not(#home-section *),
body:has(#contact-us-section:not(#home-section *)) #contact-us-section {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #FAF5EA !important;
}

/* Transform the top card into full-width edge-to-edge banner */
#forms-portal > div:first-child,
#contact-us-section:not(#home-section *) > div:first-child {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  box-shadow: none !important;
}

#forms-portal > div:first-child > div,
#contact-us-section:not(#home-section *) > div:first-child > div {
  max-width: 1600px !important;
  margin: 0 auto !important;
  padding-left: clamp(1rem, 3vw, 3rem) !important;
  padding-right: clamp(1rem, 3vw, 3rem) !important;
  text-align: left !important;
}

#forms-portal > div:first-child h1,
#contact-us-section:not(#home-section *) > div:first-child h1 {
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: clamp(2.25rem, 4.5vw, 3.75rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  text-align: left !important;
}

#forms-portal > div:first-child span,
#contact-us-section:not(#home-section *) > div:first-child span {
  color: #E2AD4E !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.22em !important;
  text-align: left !important;
}

#forms-portal > div:first-child p,
#contact-us-section:not(#home-section *) > div:first-child p {
  color: #EEE8C9 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
  max-width: 720px !important;
  margin-top: 10px !important;
  text-align: left !important;
}

/* Body container below banner */
#forms-portal > div:not(:first-child),
#contact-us-section:not(#home-section *) > div:not(:first-child) {
  max-width: 1600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(1rem, 3vw, 3rem) !important;
  padding-right: clamp(1rem, 3vw, 3rem) !important;
  padding-top: 2.5rem !important;
  padding-bottom: 5rem !important;
}

/* Hide center bottom gold bars on standalone page banners (user requested dash before title instead!) */
.bg-navy .w-24.h-1.bg-gold,
.bg-navy .w-16.h-1.bg-gold,
#stories-section > div:first-child .w-24.h-1.bg-gold,
#about-section > div:first-child .w-24.h-1.bg-gold,
#gallery-section > div:first-child .w-16.h-1.bg-gold,
#gallery-section > div:first-child .w-24.h-1.bg-gold {
  display: none !important;
}

/* Subtle background image/texture for all standalone page banners */
#about-section > div:first-child,
#activities-section > div:first-child,
#stories-section:not(#home-section *) > div:first-child,
#gallery-section:not(#home-section *) > div:first-child,
#forms-portal > div:first-child,
#contact-us-section:not(#home-section *) > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.96) 0%, rgba(73, 39, 26, 0.98) 100%), url('https://www.transparenttextures.com/patterns/stardust.png') !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

/* Photo Gallery Text on Photos: HIGH VISIBILITY & ALIGNED TO LEFT */
#gallery-section .relative.group,
#gallery-section .rounded-card,
#gallery-section .overflow-hidden {
  text-align: left !important;
}

#gallery-section .absolute.inset-0,
#gallery-section .group-hover:opacity-100,
#gallery-section .opacity-0 {
  text-align: left !important;
}

#gallery-section p,
#gallery-section span,
#gallery-section h3,
#gallery-section h4 {
  text-align: left !important;
  color: #FFFDF7 !important;
}

/* Proportional padding for Success Stories & Photo Gallery on Homepage (same clean rhythm as How We Help) */
#home-section #stories-section {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

#home-section #gallery-section {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}


/* ==========================================================================
   HOMEPAGE: HARMONIZED 4-COLUMN RHYTHM FOR HOW WE HELP, SUCCESS STORIES & GALLERY
   All 3 welfare showcase sections match in container, compact card height, and left-alignment
   ========================================================================== */

#home-section #stories-section,
#home-section #gallery-section {
  padding-top: 4.5rem !important;
  padding-bottom: 5rem !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#home-section #stories-section > div,
#home-section #gallery-section > div {
  max-width: 1600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

@media (min-width: 640px) {
  #home-section #stories-section > div,
  #home-section #gallery-section > div {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }
}

@media (min-width: 1024px) {
  #home-section #stories-section > div,
  #home-section #gallery-section > div {
    padding-left: 4rem !important;
    padding-right: 4rem !important;
  }
}

/* 4-column responsive grid on homepage strictly matching How We Help */
#home-section #stories-section .grid,
#home-section #gallery-section .grid {
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  gap: 1.5rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 640px) {
  #home-section #stories-section .grid,
  #home-section #gallery-section .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
  }
}

@media (min-width: 1024px) {
  #home-section #stories-section .grid,
  #home-section #gallery-section .grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 2rem !important;
  }
}

/* Cards strictly matching How We Help size and structure */
#home-section #stories-section .grid > div,
#home-section #gallery-section .grid > div {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  background-color: #FFFFFF !important;
  border-radius: 16px !important;
  border: 1px solid rgba(226, 173, 78, 0.28) !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(73, 39, 26, 0.08) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
  text-align: left !important;
  height: 100% !important;
  box-sizing: border-box !important;
}

#home-section #stories-section .grid > div:hover,
#home-section #gallery-section .grid > div:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 32px rgba(109, 13, 3, 0.15) !important;
  border-color: #E2AD4E !important;
}

/* Card image container strictly bounded to 200px (aspect 4/3) with NO background gap */
#home-section #stories-section .grid > div > div:first-child,
#home-section #gallery-section .grid > div > div:first-child {
  position: relative !important;
  width: 100% !important;
  height: 200px !important;
  max-height: 200px !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
  background-color: #0A1128 !important;
  border-top-left-radius: 15px !important;
  border-top-right-radius: 15px !important;
  box-sizing: border-box !important;
}

#home-section #stories-section .grid > div img,
#home-section #gallery-section .grid > div img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  border-top-left-radius: 15px !important;
  border-top-right-radius: 15px !important;
  transition: transform 0.6s ease !important;
}

#home-section #stories-section .grid > div:hover img,
#home-section #gallery-section .grid > div:hover img {
  transform: scale(1.05) !important;
}

/* Card body padding and layout strictly matching How We Help p-6 (1.5rem) */
#home-section #stories-section .grid > div .p-6,
#home-section #stories-section .grid > div .p-8,
#home-section #stories-section .grid > div > div:last-child,
#home-section #gallery-section .grid > div .p-6,
#home-section #gallery-section .grid > div > div:last-child {
  padding: 1.5rem !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  justify-content: space-between !important;
  text-align: left !important;
  background-color: #FFFFFF !important;
  box-sizing: border-box !important;
}

/* Typography inside homepage cards - High contrast, left-aligned */
#home-section #stories-section .grid > div h3,
#home-section #stories-section .grid > div h4,
#home-section #gallery-section .grid > div h3,
#home-section #gallery-section .grid > div h4 {
  color: #6D0D03 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.4rem !important;
}

#home-section #stories-section .grid > div p,
#home-section #gallery-section .grid > div p {
  color: #2E211A !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 0.85rem !important;
  line-height: 1.55 !important;
  text-align: left !important;
}

#home-section #stories-section .grid > div span,
#home-section #gallery-section .grid > div span {
  text-align: left !important;
}

#home-section #stories-section .grid > div span.text-gold,
#home-section #gallery-section .grid > div span.text-gold,
#home-section #gallery-section .grid > div span:first-child {
  color: #C59336 !important;
  font-weight: 800 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

/* Call to action links in cards */
#home-section #stories-section .grid > div button,
#home-section #stories-section .grid > div a,
#home-section #gallery-section .grid > div button,
#home-section #gallery-section .grid > div a {
  color: #C59336 !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  text-align: left !important;
  display: inline-flex !important;
  align-items: center !important;
  margin-top: 0.75rem !important;
  cursor: pointer !important;
}

#home-section #stories-section .grid > div button:hover,
#home-section #gallery-section .grid > div button:hover {
  color: #6D0D03 !important;
}


/* ==========================================================================
   ENHANCED BRAND COLORS & REFINED BORDERS FOR ALL PAGES
   ========================================================================== */

/* 1. OUR SERVICES TOP BANNER: Brand Deep Maroon with Temple Hero BG Image */
#activities-section > div:first-child,
#activities-section .bg-\[\#0A1128\],
#activities-section .relative.w-full.bg-\[\#6D0D03\] {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.95) 0%, rgba(73, 39, 26, 0.97) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png?tr=w-1600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
}

#activities-section > div:first-child .bg-gradient-to-b {
  background: transparent !important;
}

/* Fix Service 02: Dignity for Destitute Senior Citizens - Brand Colors Only */
#activities-section div[style*="#0F766E"],
#activities-section span[style*="#0F766E"],
#activities-section button[style*="#0F766E"],
#activities-section svg[style*="#0F766E"] {
  background-color: var(--color-deep-maroon) !important;
  color: var(--color-antique-gold) !important;
  border-color: var(--color-antique-gold) !important;
}

#activities-section .text-\[\#0F766E\] {
  color: var(--color-antique-gold) !important;
}

/* 2. GALLERY STANDALONE PAGE: Warm Royal Cream Background & High-Contrast Cards */
#gallery-section:not(#home-section *) {
  background: linear-gradient(180deg, #FAF5EA 0%, #F5ECE0 50%, #FAF5EA 100%) !important;
  color: #2E211A !important;
}

#gallery-section:not(#home-section *) > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.96) 0%, rgba(73, 39, 26, 0.98) 100%), url('https://www.transparenttextures.com/patterns/stardust.png') !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

/* Gallery Filter Tabs Container on Warm Royal Cream */
#gallery-section:not(#home-section *) .flex.flex-wrap.justify-center {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(226, 173, 78, 0.3) !important;
  border-radius: 9999px !important;
  padding: 8px 16px !important;
  max-width: 950px !important;
  margin: 2rem auto !important;
  box-shadow: 0 4px 16px rgba(73, 39, 26, 0.06) !important;
}

/* Inactive Gallery Filter Buttons: Clear White Pill with Deep Maroon Text */
#gallery-section:not(#home-section *) button.border-white\/20,
#gallery-section:not(#home-section *) button:not(.bg-gold) {
  background-color: #FFFFFF !important;
  color: #6D0D03 !important;
  border: 1px solid rgba(226, 173, 78, 0.3) !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  padding: 7px 16px !important;
  border-radius: 9999px !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.03) !important;
}

#gallery-section:not(#home-section *) button.border-white\/20:hover,
#gallery-section:not(#home-section *) button:not(.bg-gold):hover {
  background-color: rgba(226, 173, 78, 0.15) !important;
  color: #6D0D03 !important;
  border-color: #E2AD4E !important;
}

/* Active Gallery Filter Button: Deep Maroon Gradient with Antique Gold Border */
#gallery-section:not(#home-section *) button.bg-gold,
#gallery-section:not(#home-section *) button[class*="bg-gold"] {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(109, 13, 3, 0.25) !important;
  padding: 7px 18px !important;
  border-radius: 9999px !important;
}

/* Gallery Photo Cards on Warm Royal Cream */
#gallery-section:not(#home-section *) .grid > div {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(226, 173, 78, 0.28) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(73, 39, 26, 0.08) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
}

#gallery-section:not(#home-section *) .grid > div:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 32px rgba(109, 13, 3, 0.16) !important;
  border-color: #E2AD4E !important;
}

/* 3. REQUEST SUPPORT PAGE: Attractive Brand Gold & Maroon Icons */
#forms-portal .w-14.h-14,
#forms-portal .w-14.h-14.bg-navy {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border: 2px solid #E2AD4E !important;
  border-radius: 9999px !important;
  box-shadow: 0 8px 20px rgba(109, 13, 3, 0.25) !important;
  color: #E2AD4E !important;
}

#forms-portal .w-14.h-14 svg,
#forms-portal .w-14.h-14 * {
  color: #E2AD4E !important;
  stroke: #E2AD4E !important;
}

#forms-portal button[id^="select-category-"].bg-navy {
  background: linear-gradient(135deg, #6D0D03 0%, #49271A 100%) !important;
  border: 1.5px solid #E2AD4E !important;
  box-shadow: 0 4px 12px rgba(109, 13, 3, 0.25) !important;
}

#forms-portal button[id^="select-category-"] svg {
  color: #E2AD4E !important;
  stroke: #E2AD4E !important;
}

/* All standalone banners: Refined 1.5px gold accent border */
#about-section:not(#home-section *) > div:first-child,
#stories-section:not(#home-section *) > div:first-child,
#gallery-section:not(#home-section *) > div:first-child,
#forms-portal:not(#home-section *) > div:first-child,
#contact-us-section:not(#home-section *) > div:first-child,
#activities-section > div:first-child {
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}


/* ==========================================================================
   OUR SERVICES BANNER STANDARDIZATION (Same alignment, padding & container as other pages)
   ========================================================================== */

#activities-section > div:first-child {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.95) 0%, rgba(73, 39, 26, 0.97) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png?tr=w-1600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
  box-sizing: border-box !important;
}

#activities-section > div:first-child > div.max-w-\[1400px\],
#activities-section > div:first-child > div.relative.z-10,
#activities-section > div:first-child > div {
  max-width: 1600px !important;
  margin: 0 auto !important;
  padding-left: clamp(1rem, 3vw, 3rem) !important;
  padding-right: clamp(1rem, 3vw, 3rem) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  text-align: left !important;
}

#activities-section > div:first-child h1 {
  font-size: clamp(2.25rem, 4.5vw, 3.75rem) !important;
  line-height: 1.15 !important;
  color: #FFFDF7 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  text-align: left !important;
}

#activities-section > div:first-child span.text-\[11px\] {
  color: #E2AD4E !important;
  letter-spacing: 0.22em !important;
  text-align: left !important;
}

#activities-section > div:first-child p {
  color: #EEE8C9 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
  max-width: 720px !important;
  margin-top: 10px !important;
  text-align: left !important;
}

/* Service 02 Badge & Accents: Strictly Brand Deep Maroon & Gold */
#activities-section div[style*="rgb(15, 118, 110)"],
#activities-section span[style*="rgb(15, 118, 110)"],
#activities-section button[style*="rgb(15, 118, 110)"],
#activities-section svg[style*="rgb(15, 118, 110)"] {
  background-color: #6D0D03 !important;
  color: #E2AD4E !important;
  border-color: #E2AD4E !important;
}


/* ==========================================================================
   TOP MENU STICKY & ELIMINATE UNWANTED WHITE SPACE GAP BELOW HEADER
   ========================================================================== */
header#main-header,
.site-main-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  margin-bottom: 0 !important;
}

#main-header + div {
  display: none !important;
  height: 0px !important;
  min-height: 0px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#home-section,
#activities-section,
#forms-portal,
#gallery-section,
#about-section,
#stories-section,
#contact-section,
#track-portal {
  margin-top: 0 !important;
}

/* ==========================================================================
   EXACTLY ONE DEDICATED GOLD DASH BEFORE PAGE KICKERS
   ========================================================================== */
.kicker-single-dash,
#activities-section .kicker-single-dash,
#activities-section .w-8.h-\[2px\],
#activities-section .w-8 {
  display: inline-block !important;
  width: 32px !important;
  height: 2.5px !important;
  background-color: #E2AD4E !important;
  margin-right: 12px !important;
  vertical-align: middle !important;
  border-radius: 2px !important;
  flex-shrink: 0 !important;
}

/* Strictly eliminate duplicate pseudo-elements & stat dashes */
[id$="-section"] > div:first-child span::before,
#activities-section span::before,
#stories-section span::before,
#about-section span::before,
#gallery-section span::before,
#forms-portal span::before,
#contact-us-section span::before,
#track-portal span::before,
.text-\[\#C9A227\]::before,
.text-3xl::before {
  content: none !important;
  display: none !important;
}

/* ==========================================================================
   STANDALONE PAGE HEADERS WITH SUITABLE BRAND BACKGROUND IMAGES
   ========================================================================== */

/* 1. OUR SERVICES (#activities-section): Sunrise Temple Hero */
#activities-section > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png?tr=w-1600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
}

/* 2. IMPACT & STORIES (#stories-section): Sponsoring Students & Youth Aid */
#stories-section:not(#home-section *) > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/stories/scroll_img_1.jpg?tr=w-600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
}

/* 3. GALLERY (#gallery-section): Temple Restoration & Photographic Archive */
#gallery-section:not(#home-section *) > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/stories/scroll_img_4.jpg?tr=w-600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
}

/* 4. REQUEST SUPPORT (#forms-portal): Medical Surgery & Healthcare Relief */
#forms-portal > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/stories/medical_surgery.jpg?tr=w-600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
}

/* 5. CONTACT US (#contact-us-section): Golden Sunrise Temple */
#contact-us-section > div:first-child,
#contact-section:not(#home-section *) > div:first-child {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/branding/temple_hero.png?tr=w-1600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
}

/* 6. TRACK PORTAL (#track-portal-header): Community Heritage & Verification */
#track-portal-header {
  background: linear-gradient(135deg, rgba(109, 13, 3, 0.94) 0%, rgba(73, 39, 26, 0.96) 100%), url('https://ik.imagekit.io/bpctrust/bendapudi/stories/community_heritage.jpg?tr=w-600,q-85,f-auto') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-bottom: 1.5px solid rgba(226, 173, 78, 0.45) !important;
  padding: 4.5rem 1.5rem 4rem 1.5rem !important;
  color: #FFFFFF !important;
}

/* Standalone Track Portal Body */
#track-portal {
  background: #FAF5EA !important;
  min-height: 80vh !important;
  padding-bottom: 5rem !important;
}

/* ==========================================================================
   UNIFIED LUXURY BRAND CTAs - ATTRACTIVE HOVER & STRICTLY NO BLACK TEXT
   ========================================================================== */
.btn-primary, button.btn-primary, a.btn-primary,
.cta-btn-primary, [class*="btn-primary"] {
  background: linear-gradient(135deg, #6D0D03 0%, #8E1508 100%) !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(109, 13, 3, 0.25) !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-primary:hover, button.btn-primary:hover, a.btn-primary:hover,
.cta-btn-primary:hover, [class*="btn-primary"]:hover {
  background: linear-gradient(135deg, #E2AD4E 0%, #F4D378 100%) !important;
  color: #6D0D03 !important; /* STRICT: NEVER BLACK TEXT */
  border-color: #B52F28 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(226, 173, 78, 0.45) !important;
}

.btn-secondary, button.btn-secondary, a.btn-secondary,
.btn-outline, button.btn-outline, a.btn-outline,
.btn-outline-gold, button.btn-outline-gold, a.btn-outline-gold,
.cta-btn-outline, [class*="btn-outline"] {
  background: #FFFFFF !important;
  color: #6D0D03 !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-secondary:hover, button.btn-secondary:hover, a.btn-secondary:hover,
.btn-outline:hover, button.btn-outline:hover, a.btn-outline:hover,
.btn-outline-gold:hover, button.btn-outline-gold:hover, a.btn-outline-gold:hover,
.cta-btn-outline:hover, [class*="btn-outline"]:hover {
  background: #6D0D03 !important;
  color: #FFFDF7 !important; /* STRICT: NEVER BLACK TEXT */
  border-color: #E2AD4E !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(109, 13, 3, 0.25) !important;
}

#track-application-btn {
  background: #FFFFFF !important;
  color: #6D0D03 !important;
  border: 1.5px solid #E2AD4E !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(109, 13, 3, 0.08) !important;
  transition: all 0.25s ease !important;
}
#track-application-btn:hover {
  background: #6D0D03 !important;
  color: #FFFDF7 !important;
  border-color: #E2AD4E !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(109, 13, 3, 0.25) !important;
}
#track-application-btn:hover * {
  color: #FFFDF7 !important;
}


/* ==========================================================================
   PERMANENT FIX: ELIMINATE WHITE BORDER / GAP BELOW TOP MENU
   ========================================================================== */
header#main-header,
.site-main-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  background-color: #6D0D03 !important; /* Solid Maroon - impossible to leak white */
  border-bottom: 2px solid rgba(226, 173, 78, 0.45) !important;
  box-shadow: 0 4px 20px rgba(109, 13, 3, 0.35) !important;
  margin: 0 !important;
  padding: 0 !important;
  outline: none !important;
}

#main-header + div {
  display: none !important;
  height: 0px !important;
  min-height: 0px !important;
  max-height: 0px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Ensure no section has a top margin or top border leaking white */
#home-section,
#activities-section,
#about-section,
#stories-section,
#gallery-section,
#forms-portal,
#contact-us-section,
#contact-section,
#track-portal {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

#home-section > section:first-of-type,
#activities-section > div:first-child,
#about-section > div:first-child,
#stories-section > div:first-child,
#gallery-section > div:first-child,
#forms-portal > div:first-child,
#contact-us-section > div:first-child,
#contact-section > div:first-child,
#track-portal-header {
  margin-top: 0 !important;
  border-top: none !important;
  outline: none !important;
}


/* ==========================================================================
   DASHBOARD SIDEMENU SCROLLBAR REMOVAL & UNIFIED NAVIGATION STYLES
   ========================================================================== */

/* Completely hide scroll bar in dashboard sidemenu across all browsers */
#dashboard-sidemenu,
aside .overflow-y-auto,
.no-scrollbar {
  -ms-overflow-style: none !important; /* IE and Edge */
  scrollbar-width: none !important; /* Firefox */
}

#dashboard-sidemenu::-webkit-scrollbar,
aside .overflow-y-auto::-webkit-scrollbar,
.no-scrollbar::-webkit-scrollbar {
  display: none !important;
  width: 0px !important;
  height: 0px !important;
  background: transparent !important;
}

/* Nav Item Links - Radiant Gold on Hover, Never Black */
.site-desktop-nav a.nav-item-link {
  transition: color 0.2s ease, background-color 0.2s ease !important;
}
.site-desktop-nav a.nav-item-link:hover {
  color: #E2AD4E !important;
}

/* Track Application CTA Button - Deep Maroon Text on Gold Background on Hover, Never Black */
.site-desktop-nav a.cta-track-btn:hover,
#desktop-track-cta:hover {
  background-color: #E2AD4E !important;
  color: #6D0D03 !important;
  border-color: #E2AD4E !important;
}
.site-desktop-nav a.cta-track-btn:hover svg,
#desktop-track-cta:hover svg {
  color: #6D0D03 !important;
  stroke: #6D0D03 !important;
}

/* Ensure Top Credential Bar Stays Permanently Sticky and Visible */
.site-top-bar,
#permanent-top-bar {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}


/* ==========================================================================
   UNIFIED PAGE HEADER SPACING & HORIZONTAL ALIGNMENT
   ========================================================================== */

/* Outer Banner Containers - Equal 4.5rem top, 4rem bottom across all sections */
#activities-section > div:first-child,
#about-section:not(#home-section *) > div:first-child,
#stories-section:not(#home-section *) > div:first-child,
#gallery-section:not(#home-section *) > div:first-child,
#forms-portal > div:first-child,
#contact-us-section > div:first-child,
#contact-section:not(#home-section *) > div:first-child,
#track-portal-header {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 4.5rem 0 4rem 0 !important;
  box-sizing: border-box !important;
}

/* Inner Content Containers - Identical max-width 1400px and horizontal padding */
#activities-section > div:first-child > div.relative.z-10,
#about-section:not(#home-section *) > div:first-child > div.relative.z-10,
#stories-section:not(#home-section *) > div:first-child > div.relative.z-10,
#gallery-section:not(#home-section *) > div:first-child > div.relative.z-10,
#forms-portal > div:first-child > div.relative.z-10,
#contact-us-section > div:first-child > div.relative.z-10,
#track-portal-header > div.relative.z-10,
.site-page-header-inner {
  max-width: 1400px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(1.5rem, 5vw, 4rem) !important;
  padding-right: clamp(1.5rem, 5vw, 4rem) !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

/* Stat numbers and labels in activities-section - clean styling without dashes */
#activities-section .text-3xl,
#activities-section .text-\[\#C9A227\] {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  color: #E2AD4E !important;
}


/* ==========================================================================
   UNIFIED HORIZONTAL SPACING ACROSS ALL SECTIONS (IDENTICAL TO HOW WE HELP)
   ========================================================================== */

#home-section > section > div,
#home-section #stories-section > div,
#home-section #gallery-section > div,
#home-section #contact-us-section > div,
#home-section #contact-section > div,
#about-section > div.max-w-\[1600px\],
#about-section > div:last-child,
#activities-section .max-w-\[1600px\],
#stories-section .max-w-\[1600px\],
#gallery-section .max-w-\[1600px\],
#forms-portal .max-w-\[1600px\],
#contact-us-section .max-w-\[1600px\],
.unified-section-container {
  max-width: 1600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem !important; /* px-4 = 16px */
  padding-right: 1rem !important; /* px-4 = 16px */
  box-sizing: border-box !important;
}

@media (min-width: 640px) {
  #home-section > section > div,
  #home-section #stories-section > div,
  #home-section #gallery-section > div,
  #home-section #contact-us-section > div,
  #home-section #contact-section > div,
  #about-section > div.max-w-\[1600px\],
  #about-section > div:last-child,
  #activities-section .max-w-\[1600px\],
  #stories-section .max-w-\[1600px\],
  #gallery-section .max-w-\[1600px\],
  #forms-portal .max-w-\[1600px\],
  #contact-us-section .max-w-\[1600px\],
  .unified-section-container {
    padding-left: 2rem !important; /* sm:px-8 = 32px */
    padding-right: 2rem !important; /* sm:px-8 = 32px */
  }
}

@media (min-width: 1024px) {
  #home-section > section > div,
  #home-section #stories-section > div,
  #home-section #gallery-section > div,
  #home-section #contact-us-section > div,
  #home-section #contact-section > div,
  #about-section > div.max-w-\[1600px\],
  #about-section > div:last-child,
  #activities-section .max-w-\[1600px\],
  #stories-section .max-w-\[1600px\],
  #gallery-section .max-w-\[1600px\],
  #forms-portal .max-w-\[1600px\],
  #contact-us-section .max-w-\[1600px\],
  .unified-section-container {
    padding-left: 4rem !important; /* lg:px-16 = 64px */
    padding-right: 4rem !important; /* lg:px-16 = 64px */
  }
}

/* Eliminate top black borders on founder cards, hero cards & about section */
#about-section,
#about-section > div,
#about-section .bg-white,
.heritage-card,
.founder-card,
#founders .heritage-card,
.rounded-card {
  border-top-color: rgba(226, 173, 78, 0.35) !important;
}

/* Founder Profile CTA Buttons - Deep Maroon with Gold Border, Never Black */
a[href*="profile.html?id=founder-rao"],
a[href*="profile.html?id=founder-lakshmi"] {
  background-color: #6D0D03 !important;
  color: #FFFDF7 !important;
  border: 1.5px solid #E2AD4E !important;
  box-shadow: 0 4px 14px rgba(109, 13, 3, 0.25) !important;
  transition: all 0.25s ease !important;
}

a[href*="profile.html?id=founder-rao"]:hover,
a[href*="profile.html?id=founder-lakshmi"]:hover {
  background-color: #B52F28 !important;
  border-color: #F4D378 !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}


/* ==========================================================================
   HOMEPAGE CTA BUTTONS & WHATSAPP VIBRANT GREEN ACCENTS
   ========================================================================== */

/* WhatsApp Link in Top Institutional Bar - Always Vibrant Green */
.site-top-bar a[href*="wa.me"],
#permanent-top-bar a[href*="wa.me"],
.top-bar a[href*="wa.me"],
.site-top-bar a[href*="wa.me"] span,
#permanent-top-bar a[href*="wa.me"] span,
.top-bar a[href*="wa.me"] span {
  color: #25D366 !important;
  font-weight: 800 !important;
}

.site-top-bar a[href*="wa.me"] svg,
#permanent-top-bar a[href*="wa.me"] svg,
.top-bar a[href*="wa.me"] svg {
  color: #25D366 !important;
  fill: #25D366 !important;
}

/* Success Stories Homepage Cards - Compact Size Strictly Matching How We Help */
#home-section #stories-section .grid > div > div:first-child {
  height: 200px !important;
  max-height: 200px !important;
  aspect-ratio: 4 / 3 !important;
  width: 100% !important;
  position: relative !important;
  overflow: hidden !important;
}

#home-section #stories-section .grid > div img {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
  border-top-left-radius: 15px !important;
  border-top-right-radius: 15px !important;
}

#home-section #stories-section .grid > div .p-6,
#home-section #stories-section .grid > div .p-8,
#home-section #stories-section .grid > div > div:last-child {
  padding: 1.5rem !important;
}

#home-section #stories-section .grid > div h3,
#home-section #stories-section .grid > div h4 {
  font-size: 1.05rem !important;
  line-height: 1.35 !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.35rem !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 2.8rem !important;
}

#home-section #stories-section .grid > div p {
  font-size: 0.85rem !important;
  line-height: 1.55 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 3.9rem !important;
}

/* Explore All Success Stories & Gallery CTA Buttons - Crisp Contrast & Visible Text */
.stories-explore-main-btn,
.gallery-explore-main-btn {
  background-color: #6D0D03 !important;
  color: #FFFDF7 !important;
  border: 2px solid #E2AD4E !important;
  border-radius: 9999px !important;
  padding: 0.85rem 2.2rem !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 16px rgba(109, 13, 3, 0.25) !important;
  transition: all 0.25s ease !important;
}

.stories-explore-main-btn:hover,
.gallery-explore-main-btn:hover {
  background-color: #E2AD4E !important;
  color: #6D0D03 !important;
  border-color: #E2AD4E !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(226, 173, 78, 0.4) !important;
}

.stories-explore-main-btn:hover span,
.gallery-explore-main-btn:hover span {
  color: #6D0D03 !important;
}

/* Track Application Portal Edge-to-Edge Institutional Styling */
#track-portal {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Ensure Trust Guidance & Verification Badge SVG Icons Are NEVER Black */
#support-guidance-card svg,
#track-guidance-cards svg,
.trust-guidance-badge svg,
#track-portal-header svg,
#forms-portal #support-guidance-card svg,
#track-portal #track-guidance-cards svg {
  stroke: #E2AD4E !important;
  color: #E2AD4E !important;
}

/* Ensure complete removal of top founder profile CTA and border */
.founder-profile-cta-rao,
.founder-profile-cta-lakshmi {
  display: none !important;
}

/* Instant paint on page load & refresh: eliminates blank screen */
[data-sr],
[data-sr-delay],
.reveal-scroll,
.fade-in {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
  visibility: visible !important;
}

/* Impact & Stories - Generous bottom breathing room for cards above footer */
#stories-section {
  padding-bottom: 7rem !important;
}

#stories-section .grid {
  margin-bottom: 4rem !important;
  padding-bottom: 2rem !important;
}

/* ==========================================================================
   MOBILE RESPONSIVENESS & SOLID OPAQUE DRAWER (STRICT ZERO COLLISION)
   ========================================================================== */
#main-header {
  position: relative !important;
  width: 100% !important;
  background-color: #6D0D03 !important;
}

#main-header > div:first-child,
.site-header-inner {
  height: 108px;
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 2.5vw, 2.5rem);
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}

@media (max-width: 1080px) {
  .site-desktop-nav, #desktop-nav {
    display: none !important;
  }
  .site-mobile-btn, #site-mobile-menu-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #main-header > div:first-child,
  .site-header-inner {
    height: 72px !important;
    padding: 0 1rem !important;
  }
  #nav-menu-logo img {
    height: 52px !important;
    max-height: 52px !important;
    max-width: 250px !important;
  }
}

@media (max-width: 640px) {
  #main-header > div:first-child,
  .site-header-inner {
    height: 64px !important;
    padding: 0 0.85rem !important;
  }
  #nav-menu-logo img {
    height: 44px !important;
    max-height: 44px !important;
    max-width: 200px !important;
  }
}

/* 100% Solid Opaque Mobile Drawer Menu (No hero collision) */
#site-mobile-drawer {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: auto !important;
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
  background-color: #6D0D03 !important;
  background: #6D0D03 !important;
  border-top: 1.5px solid #E2AD4E !important;
  border-bottom: 3px solid #E2AD4E !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.75) !important;
  z-index: 99999 !important;
  padding: 1.25rem 1.5rem 1.75rem 1.5rem !important;
  box-sizing: border-box !important;
  flex-direction: column !important;
  gap: 8px !important;
}

#site-mobile-drawer a {
  padding: 10px 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #FFFDF7 !important;
  border-bottom: 1px solid rgba(226, 173, 78, 0.25) !important;
  display: block !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

#site-mobile-drawer a:hover,
#site-mobile-drawer a:focus {
  color: #F4D378 !important;
  padding-left: 8px !important;
}

#site-mobile-drawer a:last-child {
  border-bottom: none !important;
  color: #E2AD4E !important;
  font-weight: 800 !important;
  margin-top: 4px !important;
}

/* Institutional Top Bar Mobile Responsiveness */
@media (max-width: 768px) {
  #permanent-top-bar {
    padding: 6px 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  #permanent-top-bar > div {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 100% !important;
    text-align: center !important;
    padding: 0 !important;
  }
  #permanent-top-bar > div > div:first-child {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 10.5px !important;
    width: 100% !important;
  }
  #permanent-top-bar > div > div:last-child {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 2px 0 0 0 !important;
    font-size: 10.5px !important;
    width: 100% !important;
  }
}

@media (max-width: 480px) {
  #permanent-top-bar .topbar-hours,
  #permanent-top-bar .topbar-sep-hours {
    display: none !important;
  }
}

/* Bulletins Marquee Ticker Mobile Polish */
#site-ticker-bar {
  width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
#site-ticker-bar > div {
  width: 100% !important;
  box-sizing: border-box !important;
}
@media (max-width: 640px) {
  #site-ticker-bar {
    padding: 0.35rem 0 !important;
  }
  #site-ticker-bar > div {
    gap: 0.5rem !important;
    padding: 0 0.75rem !important;
  }
  #site-ticker-bar > div > div:first-child {
    font-size: 0.7rem !important;
    padding: 0.2rem 0.5rem !important;
  }
}

/* Floating Action Button (FAB) Mobile Optimization */
@media (max-width: 640px) {
  button[aria-label="Request Support"],
  .fixed.bottom-6.right-6 {
    bottom: 1rem !important;
    right: 1rem !important;
    padding: 0.75rem !important;
    transform: scale(0.9) !important;
  }
}

/* Form Portal & Support Cards Mobile Spacing & Clean Wrap */
@media (max-width: 640px) {
  #forms-portal, #track-portal, #home-section, #stories-section, #gallery-section {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    box-sizing: border-box !important;
  }
  #support-guidance-card > div,
  .who-can-apply-card {
    padding: 1.25rem 1rem !important;
  }
}

/* Mobile Responsive Header, Top Bar & 100% Solid Heritage Drawer */
#site-sticky-header-wrapper {
  position: sticky !important;
  top: 0 !important;
  z-index: 999999 !important;
  width: 100% !important;
}

@media (max-width: 768px) {
  .topbar-hours,
  .topbar-sep-hours {
    display: none !important;
  }
}

@media (max-width: 640px) {
  #permanent-top-bar {
    padding: 5px 8px !important;
    font-size: 10px !important;
  }
  #permanent-top-bar > div {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 3px !important;
    padding: 0 !important;
  }
  .topbar-left-group {
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 10px !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
  }
  .topbar-right-group {
    margin: 1px auto 0 auto !important;
    font-size: 10px !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }
  /* Trust Bulletins: Mobile Version hides text, keeps bell icon */
  .ticker-label-text {
    display: none !important;
  }
  #site-ticker-bar .ticker-badge {
    padding: 0.25rem 0.55rem !important;
    gap: 0 !important;
    justify-content: center !important;
  }
  #site-ticker-bar .ticker-badge svg {
    width: 14px !important;
    height: 14px !important;
  }
  #site-ticker-bar {
    padding: 0.35rem 0 !important;
  }
  #site-ticker-bar > div {
    gap: 0.65rem !important;
    padding: 0 0.75rem !important;
  }
}

@media (max-width: 440px) {
  .topbar-email-full {
    display: none !important;
  }
  .topbar-email-short {
    display: inline !important;
  }
  .topbar-wa-full {
    display: none !important;
  }
  .topbar-wa-short {
    display: inline !important;
  }
  .topbar-left-group {
    gap: 6px !important;
    font-size: 9.5px !important;
  }
  .topbar-right-group {
    font-size: 9.5px !important;
  }
  #permanent-top-bar {
    padding: 4px 6px !important;
  }
}

/* 100% Solid Opaque Heritage Mobile Drawer Menu */
#site-mobile-drawer {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  background-color: #6D0D03 !important;
  background: #6D0D03 !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-top: 2px solid #E2AD4E !important;
  border-bottom: 3px solid #E2AD4E !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.95), 0 10px 20px rgba(109, 13, 3, 0.8) !important;
  z-index: 9999999 !important;
  padding: 1.25rem 1.5rem 2rem 1.5rem !important;
  box-sizing: border-box !important;
  flex-direction: column !important;
  gap: 8px !important;
}

#site-mobile-drawer a {
  padding: 11px 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #FFFDF7 !important;
  border-bottom: 1px solid rgba(226, 173, 78, 0.25) !important;
  display: block !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
}

#site-mobile-drawer a:hover,
#site-mobile-drawer a:focus {
  color: #F4D378 !important;
  padding-left: 8px !important;
}

#site-mobile-drawer a:last-child {
  border-bottom: none !important;
  color: #E2AD4E !important;
  font-weight: 800 !important;
  margin-top: 6px !important;
}

/* ==========================================================================
   Mobile Version Header Logo Size Optimization (Noticeably Bigger)
   ========================================================================== */
@media (max-width: 640px) {
  #main-header > div:first-child,
  .site-header-inner {
    height: 74px !important;
    padding: 0 0.85rem !important;
  }
  #nav-menu-logo img {
    height: 58px !important;
    max-height: 58px !important;
    max-width: 270px !important;
    width: auto !important;
    object-fit: contain !important;
  }
}
@media (max-width: 440px) {
  #main-header > div:first-child,
  .site-header-inner {
    height: 70px !important;
  }
  #nav-menu-logo img {
    height: 54px !important;
    max-height: 54px !important;
    max-width: 240px !important;
  }
}

@media (max-width: 640px) {
  .topbar-right-group {
    margin: 3px auto 1px auto !important;
    font-size: 10px !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 2.5px 10px !important;
    background: rgba(109, 13, 3, 0.05) !important;
    border: 1px solid rgba(226, 173, 78, 0.45) !important;
    border-radius: 9999px !important;
    letter-spacing: 0.03em !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 440px) {
  .topbar-right-group {
    font-size: 9px !important;
    padding: 2px 8px !important;
  }
}

/* ==========================================================================
   Home Page Founder & Co-Founder Photo Cards Full Mobile Responsiveness
   ========================================================================== */
@media (max-width: 768px) {
  /* Founder cards container: prevent overflow, adjust padding */
  #about-section [data-sr="fade-left"],
  #about-section [data-sr="fade-right"],
  div[data-sr="fade-left"],
  div[data-sr="fade-right"],
  div:has(> div > div > img[alt*="Prabhakara Rao" i]),
  div:has(> div > div > img[alt*="Swatantra Lakshmi" i]) {
    padding: 1.25rem 1rem !important;
    gap: 1.25rem !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 24px rgba(73, 39, 26, 0.12) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  /* Photo frame container: center and keep within 260px */
  #about-section [data-sr="fade-left"] > div:first-child,
  #about-section [data-sr="fade-right"] > div:first-child,
  div[data-sr="fade-left"] > div:first-child,
  div[data-sr="fade-right"] > div:first-child,
  div:has(> div > img[alt*="Prabhakara Rao" i]),
  div:has(> div > img[alt*="Swatantra Lakshmi" i]) {
    width: 100% !important;
    max-width: 250px !important;
    margin: 0 auto !important;
    flex-shrink: 0 !important;
  }

  /* Photo frame aspect ratio container */
  #about-section [class*="aspect-"],
  div:has(> img[alt*="Prabhakara Rao" i]),
  div:has(> img[alt*="Swatantra Lakshmi" i]),
  div[data-sr="fade-left"] [class*="aspect-"],
  div[data-sr="fade-right"] [class*="aspect-"] {
    max-width: 240px !important;
    max-height: 310px !important;
    margin: 0 auto !important;
    padding: 8px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }

  /* Keep gold corner accents inside bounding box without extending offscreen */
  #about-section [class*="-top-3"],
  div[data-sr="fade-left"] [class*="-top-3"],
  div[data-sr="fade-right"] [class*="-top-3"] {
    top: -4px !important;
  }
  #about-section [class*="-bottom-3"],
  div[data-sr="fade-left"] [class*="-bottom-3"],
  div[data-sr="fade-right"] [class*="-bottom-3"] {
    bottom: -4px !important;
  }
  #about-section [class*="-left-3"],
  div[data-sr="fade-left"] [class*="-left-3"],
  div[data-sr="fade-right"] [class*="-left-3"] {
    left: -4px !important;
  }
  #about-section [class*="-right-3"],
  div[data-sr="fade-left"] [class*="-right-3"],
  div[data-sr="fade-right"] [class*="-right-3"] {
    right: -4px !important;
  }
  #about-section [class*="w-16"][class*="h-16"],
  div[data-sr="fade-left"] [class*="w-16"][class*="h-16"],
  div[data-sr="fade-right"] [class*="w-16"][class*="h-16"] {
    width: 24px !important;
    height: 24px !important;
  }

  /* Images inside founder cards */
  #about-section img[alt*="Prabhakara Rao" i],
  #about-section img[alt*="Swatantra Lakshmi" i],
  img[alt*="Prabhakara Rao" i],
  img[alt*="Swatantra Lakshmi" i] {
    width: 100% !important;
    height: 100% !important;
    max-height: 290px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
  }

  /* Headings & typography */
  div[data-sr="fade-left"] h2,
  div[data-sr="fade-right"] h2 {
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
  }
  div[data-sr="fade-left"] h2 span,
  div[data-sr="fade-right"] h2 span {
    font-size: 1rem !important;
  }

  /* Quote block */
  div[data-sr="fade-left"] blockquote,
  div[data-sr="fade-right"] blockquote {
    padding-left: 0.75rem !important;
    padding-right: 0.5rem !important;
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
    margin: 0.75rem 0 !important;
  }

  /* Stats / key facts row: stack cleanly */
  div[data-sr="fade-left"] .flex.items-center.gap-6,
  div[data-sr="fade-right"] .flex.items-center.gap-6,
  div[data-sr="fade-left"] [class*="gap-6 pt-4 border-t"],
  div[data-sr="fade-right"] [class*="gap-6 pt-4 border-t"],
  #about-section [class*="gap-6 pt-4 border-t"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.65rem !important;
  }
  div[data-sr="fade-left"] .w-px.h-8,
  div[data-sr="fade-right"] .w-px.h-8,
  #about-section .w-px.h-8 {
    display: none !important;
  }

  /* CTA Button: full-width, centered */
  div[data-sr="fade-left"] a[href*="profile"],
  div[data-sr="fade-right"] a[href*="profile"],
  #about-section a[href*="profile"] {
    display: flex !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.75rem 1rem !important;
    font-size: 11px !important;
    white-space: normal !important;
    box-sizing: border-box !important;
    line-height: 1.35 !important;
  }
}

/* ==========================================================================
   Admin Login Page & Dashboard Full Mobile Responsiveness
   ========================================================================== */
@media (max-width: 1024px) {
  /* Hide bulky left promo banner on admin portal on mobile & tablet so login card is front and center */
  #admin-management-portal .grid-cols-1.lg\:grid-cols-12 > .lg\:col-span-5,
  #admin-management-portal .lg\:col-span-5:has(img[alt="Trust Logo"]),
  #admin-management-portal .lg\:col-span-5:has(h1) {
    display: none !important;
  }
  #admin-management-portal .lg\:col-span-7 {
    width: 100% !important;
    max-width: 480px !important;
    margin: 0 auto !important;
    height: auto !important;
    min-height: auto !important;
  }
}

@media (max-width: 640px) {
  #admin-management-portal .lg\:col-span-7 {
    padding: 1.75rem 1.25rem !important;
    border-radius: 20px !important;
  }

  /* Form inputs & buttons in login view */
  .lg\:col-span-7 input[type="email"],
  .lg\:col-span-7 input[type="password"],
  .lg\:col-span-7 input[type="text"] {
    padding: 0.75rem 1rem !important;
    font-size: 13.5px !important;
  }
  .lg\:col-span-7 button[type="submit"] {
    padding: 0.85rem 1rem !important;
    font-size: 12.5px !important;
  }

  /* Forgot password row */
  .lg\:col-span-7 .flex.justify-between.items-center {
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
  }

  /* 6-digit OTP input boxes on mobile */
  input[id^="otp-input-"] {
    width: 38px !important;
    height: 48px !important;
    font-size: 18px !important;
    margin: 0 2px !important;
  }

  /* Dashboard tables & queues: horizontal touch scroll without breaking page width */
  .admin-dashboard table,
  #admin-dashboard table,
  .overflow-x-auto,
  table:has(th) {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
  }

  /* Action buttons row */
  .admin-actions,
  div:has(> button[title="Refresh"]):has(> button[title="Logout"]) {
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
  }

  /* Admin header action bars on mobile */
  .admin-dashboard .flex.justify-between.items-center,
  #admin-dashboard .flex.justify-between.items-center {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.75rem !important;
  }

  /* Admin modals: keep within viewport with smooth scrolling */
  div.fixed.inset-0.z-50 > div.bg-white,
  div.fixed.inset-0.z-50 > div[class*="max-w-"],
  div.fixed.inset-0.z-50 > div:has(button:has(svg)) {
    max-width: 95vw !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    margin: auto !important;
    border-radius: 16px !important;
  }
}

/* ==========================================================================
   General Mobile Polish across All Pages (Hero, Welfare, Stories, Profiles, Forms)
   ========================================================================== */
@media (max-width: 640px) {
  /* Grid layouts collapse to single column without overflow */
  div[style*="minmax(320px"],
  div[style*="minmax(300px"],
  div[style*="minmax(250px"] {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  /* ==========================================================================
     Senior Mobile Layout & Typography Harmonizer (Matches Image 1)
     ========================================================================== */
  /* Hero Section Container */
  .hero-section,
  #home-section {
    min-height: auto !important;
    padding: 1.25rem 0 1.25rem 0 !important;
  }
  .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  /* Hero Typography: Left-aligned, compact & perfectly proportioned */
  #home-section .lg\:col-span-7,
  .hero-content {
    text-align: left !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }

  #home-section h1,
  .hero-content h1,
  #home h1 {
    font-size: clamp(1.22rem, 5vw, 1.42rem) !important;
    line-height: 1.24 !important;
    letter-spacing: -0.015em !important;
    text-align: left !important;
    color: #6D0D03 !important;
    margin-top: 0.35rem !important;
    margin-bottom: 0.5rem !important;
    font-weight: 800 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }

  /* Trust Registration Badge */
  #home-section .inline-flex,
  .hero-content .inline-flex {
    font-size: 0.74rem !important;
    padding: 3px 9px !important;
    margin-bottom: 0.35rem !important;
    text-align: left !important;
  }

  /* Hero Description Paragraph */
  #home-section p,
  .hero-content p {
    font-size: 0.86rem !important;
    line-height: 1.45 !important;
    text-align: left !important;
    color: #49271A !important;
    margin-top: 0.25rem !important;
    margin-bottom: 0.85rem !important;
  }

  /* Hero CTA Buttons */
  #home-section .flex.flex-wrap,
  .hero-content .flex.flex-wrap {
    justify-content: flex-start !important;
    gap: 0.5rem !important;
    width: 100% !important;
  }

  #home-section .flex.flex-wrap a,
  #home-section .flex.flex-wrap button,
  .hero-content .flex.flex-wrap a,
  .hero-content .flex.flex-wrap button {
    font-size: 0.8rem !important;
    padding: 7px 12px !important;
    white-space: nowrap !important;
  }

  /* Hero Founders Card (Dr. BSRC & Smt. Swatantra Lakshmi) - Responsive & Clear */
  .hero-founders-wrapper > div,
  .rounded-card:has(img[alt*="Legacy Founders" i]),
  #home-section .lg\:col-span-5 > div {
    max-width: 510px !important;
    width: 100% !important;
    margin: 0.75rem auto 0 auto !important;
    overflow: hidden !important;
    border-radius: 20px !important;
  }
  .hero-founders-wrapper img,
  img[alt*="Legacy Founders" i] {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: top center !important;
  }

  /* Impact Statistics: 2-Column Grid on Mobile (Matching Image 1) */
  .grid-cols-2,
  div:has(> .grid-cols-4):has([class*="text-"]) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
  }

  /* Profile Pages (dr-bsrc-prabhakar-rao, smt-b-swatantra-lakshmi, etc.) */
  .profile-hero {
    grid-template-columns: 1fr !important;
    border-radius: 14px !important;
    margin-bottom: 1.75rem !important;
  }
  .profile-photo-col {
    border-right: none !important;
    border-bottom: 2px solid rgba(226, 173, 78, 0.4) !important;
    padding: 1.5rem 1rem !important;
  }
  .profile-photo-wrapper {
    max-width: 220px !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 13 / 16 !important;
    margin: 0 auto 1rem auto !important;
  }
  .profile-intro-col {
    padding: 1.5rem 1rem !important;
  }
  .profile-name {
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
  }

  /* Global form control responsiveness (Application form, Tracking form, Contact form) */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="password"],
  select,
  textarea {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ==========================================================================
   GLOBAL COMPACT TRUST BULLETINS BAR (REDUCED TOP HEIGHT FOR ALL PAGES)
   ========================================================================== */
#site-ticker-bar {
  padding: 3px 0 !important;
  min-height: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
#site-ticker-bar > div {
  gap: 0.75rem !important;
  display: flex !important;
  align-items: center !important;
}
#site-ticker-bar .ticker-badge {
  padding: 2px 8px !important;
  height: 21px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
#site-ticker-bar .ticker-badge svg {
  width: 11px !important;
  height: 11px !important;
}
#site-ticker-bar .marquee-content,
#site-ticker-bar #ticker-updates-container {
  line-height: 21px !important;
  font-size: 11.5px !important;
}
#site-ticker-bar .marquee-content a,
#site-ticker-bar #ticker-updates-container a {
  font-size: 11.5px !important;
  line-height: 21px !important;
}
#site-ticker-bar .marquee-content svg,
#site-ticker-bar #ticker-updates-container svg {
  width: 11px !important;
  height: 11px !important;
}

/* ==========================================================================
   HOME PAGE CONTACT SECTION: SIDE-BY-SIDE ON DESKTOP & RESPONSIVE ON MOBILE
   ========================================================================== */
#contact-us-section,
#contact-section,
#contact {
  background: linear-gradient(135deg, #6D0D03 0%, #520B02 50%, #49271A 100%) !important;
  color: #FFFDF7 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Desktop Side-by-Side Layout (min-width: 992px) */
@media (min-width: 992px) {
  #contact-us-section .grid.items-start,
  #contact-us-section > div > .grid,
  #contact-us-section .grid:not(form .grid):not(.grid-cols-2),
  #contact-section .grid:not(form .grid):not(.grid-cols-2),
  #contact .grid:not(form .grid):not(.grid-cols-2) {
    display: grid !important;
    grid-template-columns: minmax(360px, 5fr) minmax(460px, 7fr) !important;
    gap: 2.25rem !important;
    align-items: stretch !important;
    max-width: 1320px !important;
    margin: 2.5rem auto 0 auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Left Card: Contact the Trust Office & Helplines */
  #contact-us-section [class*="col-span-5"],
  #contact-section [class*="col-span-5"],
  #contact [class*="col-span-5"] {
    grid-column: 1 / 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(226, 173, 78, 0.45) !important;
    border-radius: 20px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22) !important;
    padding: 2.25rem 2rem !important;
    box-sizing: border-box !important;
    color: #2E211A !important;
  }

  /* Right Card: Send an Official Message Form */
  #contact-us-section [class*="col-span-7"],
  #contact-section [class*="col-span-7"],
  #contact [class*="col-span-7"] {
    grid-column: 2 / 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(226, 173, 78, 0.45) !important;
    border-radius: 20px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22) !important;
    padding: 2.25rem 2rem !important;
    box-sizing: border-box !important;
    color: #2E211A !important;
  }
}

/* Mobile & Tablet Stacking Layout (max-width: 991px) */
@media (max-width: 991px) {
  #contact-us-section .grid.items-start,
  #contact-us-section > div > .grid,
  #contact-us-section .grid:not(form .grid):not(.grid-cols-2),
  #contact-section .grid:not(form .grid):not(.grid-cols-2),
  #contact .grid:not(form .grid):not(.grid-cols-2) {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 1.75rem auto 0 auto !important;
    padding: 0 0.5rem !important;
    box-sizing: border-box !important;
  }

  #contact-us-section [class*="col-span-5"],
  #contact-section [class*="col-span-5"],
  #contact [class*="col-span-5"],
  #contact-us-section [class*="col-span-7"],
  #contact-section [class*="col-span-7"],
  #contact [class*="col-span-7"] {
    width: 100% !important;
    max-width: 100% !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(226, 173, 78, 0.4) !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2) !important;
    padding: 1.5rem 1.25rem !important;
    box-sizing: border-box !important;
    color: #2E211A !important;
  }

  #contact-us-section form .grid,
  #contact-section form .grid,
  #contact form .grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.25rem !important;
  }
}

/* Enhanced Form Inputs & Brand Aesthetics for Contact Form */
#contact-us-section input,
#contact-us-section select,
#contact-us-section textarea,
#contact-section input,
#contact-section select,
#contact-section textarea,
#contact input,
#contact select,
#contact textarea {
  background: #FFFDF7 !important;
  border: 1.5px solid #EEE8C9 !important;
  border-radius: 10px !important;
  color: #2E211A !important;
  font-size: 13.5px !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}
#contact-us-section input:focus,
#contact-us-section select:focus,
#contact-us-section textarea:focus,
#contact-section input:focus,
#contact-section select:focus,
#contact-section textarea:focus,
#contact input:focus,
#contact select:focus,
#contact textarea:focus {
  border-color: #B52F28 !important;
  box-shadow: 0 0 0 3px rgba(181, 47, 40, 0.15) !important;
  background: #FFFFFF !important;
}
#contact-us-section button[type="submit"],
#contact-section button[type="submit"],
#contact button[type="submit"] {
  background: linear-gradient(135deg, #6D0D03 0%, #B52F28 100%) !important;
  border: 1.5px solid #E2AD4E !important;
  color: #FFFDF7 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 0.75rem 2rem !important;
  border-radius: 9999px !important;
  cursor: pointer !important;
  box-shadow: 0 6px 18px rgba(109, 13, 3, 0.3) !important;
  transition: all 0.25s ease !important;
}
#contact-us-section button[type="submit"]:hover,
#contact-section button[type="submit"]:hover,
#contact button[type="submit"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(181, 47, 40, 0.45) !important;
  border-color: #F4D378 !important;
}

/* ==========================================================================
   ADMIN GATEWAYS & NOTIFICATIONS HUB: FULL WIDTH (ELIMINATE EMPTY WHITE SIDES)
   ========================================================================== */
#panel-smtp,
div#panel-smtp,
.admin-gateway-hub-container,
#panel-smtp > div,
div:has(> #panel-smtp) {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

#panel-smtp .admin-gateway-hub-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  box-sizing: border-box !important;
}

#panel-smtp .admin-gateway-hub-container > div {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Zero-delay immediate page loading & Anti-White-Screen Protections */
#admin-skeleton-loader {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  pointer-events: none !important;
}

#panel-dashboard,
#panel-submitted,
#panel-processed,
#panel-contact,
#panel-cms,
#panel-smtp,
#panel-admins,
#panel-activity-logs,
#panel-notifications,
#panel-profile {
  opacity: 1 !important;
  visibility: visible !important;
}