/* Believers IAS brand palette (from logo) */
:root {
  --brand-primary: #315878;   /* dark slate blue */
  --brand-primary-dark: #1e3a52;
  --brand-primary-light: #4a789e;
  --brand-accent: #e68d49;    /* terracotta orange */
  --brand-accent-dark: #c56e35;
  --brand-muted: #a8a8a8;     /* tagline grey */
  --brand-soft: #e8f0f5;      /* soft blue tint (was mint) */
  --brand-ink: #242c34;
  --background: #ffffff;
  --foreground: #1a2b3c;
  --primary: var(--brand-primary);
  --accent: var(--brand-primary);
  --gold: var(--brand-accent);
}

/* Believers IAS — minimal header: logo left, Enroll Now right */
header > .hidden.border-b {
  display: none !important;
}
header .sticky > .section-wrap {
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
header nav {
  display: none !important;
}
header .site-logo,
header img[alt*="Believers"] {
  display: block;
  height: 2.5rem !important;
  width: auto !important;
  max-width: min(200px, 58vw);
  object-fit: contain;
  object-position: left center;
}
@media (min-width: 640px) {
  header .site-logo,
  header img[alt*="Believers"] {
    height: 2.75rem !important;
    max-width: 240px;
  }
}
@media (min-width: 768px) {
  header .site-logo,
  header img[alt*="Believers"] {
    height: 3rem !important;
    max-width: 260px;
  }
}
header .section-wrap > a.group {
  flex: 0 1 auto;
  min-width: 0;
  max-width: none;
}
header .section-wrap > .flex.items-center {
  flex-shrink: 0;
}
header .section-wrap .school-btn.inline-flex {
  white-space: nowrap;
}

/* -------------------------------------------------------------------------- */
/* Mobile spacing + reveal fallback                                           */
/* Scroll-reveal leaves opacity-0 content taking space when JS is slow/fails. */
/* -------------------------------------------------------------------------- */

/* Always show reveal blocks after a short delay if JS never flips them */
.transition-all.duration-700.opacity-0.translate-y-10,
.transition-all.opacity-0.translate-y-10 {
  animation: reveal-fallback 0.45s ease forwards;
  animation-delay: 0.35s;
}
@keyframes reveal-fallback {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
/* Once JS marks them visible, don't fight the animation */
.transition-all.duration-700.opacity-100,
.transition-all.opacity-100 {
  animation: none;
}

@media (max-width: 767px) {
  /* Disable scroll-reveal hide state on phones — content must be visible */
  .transition-all.duration-700.opacity-0.translate-y-10,
  .transition-all.opacity-0.translate-y-10 {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }

  /* Tighter section rhythm */
  .section-pad-airy {
    padding-top: 0.875rem !important;
    padding-bottom: 0.875rem !important;
  }
  .section-pad-normal {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
  }
  .section-pad-tight {
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
  }
  .section-gap {
    margin-top: 0.75rem !important;
  }
  .section-gap-sm {
    margin-top: 0.5rem !important;
  }

  /* Hero: less air under CTAs / between blocks */
  #hero-main {
    padding-top: 0.5rem !important;
  }
  #hero-main > .section-wrap {
    padding-bottom: 1rem !important;
  }
  #hero-main .grid.gap-6 {
    gap: 1rem !important;
  }
  #hero-main .mt-6 {
    margin-top: 0.875rem !important;
  }
  #hero-main .mb-5 {
    margin-bottom: 0.75rem !important;
  }
  #hero-main .sm\:mt-7 {
    margin-top: 0.875rem !important;
  }

  /* Enquiry form sits above content on mobile (order-1) — keep it compact */
  #enquiry-form .p-6 {
    padding: 1rem !important;
  }
  #enquiry-form .px-6.py-5 {
    padding: 0.875rem 1rem !important;
  }
  #enquiry-form .mb-5 {
    margin-bottom: 0.75rem !important;
  }
  #enquiry-form .space-y-4 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 0.75rem !important;
  }

  /* Why / programme carousels — less top gap before cards */
  #why-wish .section-title,
  #promise .section-title,
  #programmes .section-title,
  #safety .section-title,
  #classrooms .section-title,
  #gallery .section-title,
  #location .section-title,
  #faq .section-title {
    margin-top: 0.5rem !important;
  }

  /* Sticky bottom bar already reserved on body — don't double-stack section air */
  body {
    padding-bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}


/* Static mode: collapse unused WebGL background shell */
.pointer-events-none.fixed.inset-0.-z-10 {
  display: none !important;
}
