/* ── BSX Design System ─────────────────────────── */
:root {
  /* Brand */
  --bsx-navy: #0a2540;
  --bsx-navy-light: #1C3366;
  --bsx-accent: #4fc3f7;
  --bsx-accent-hover: #39b0e8;
  --bsx-green: #10B981;
  --bsx-gold: #F59E0B;

  /* Text */
  --bsx-text: #1a1a1a;
  --bsx-text-muted: #64748B;
  --bsx-text-light: rgba(255,255,255,0.55);
  --bsx-white: #fff;

  /* Surfaces */
  --bsx-bg-muted: #f8fafc;
  --bsx-bg-glass: rgba(255,255,255,0.05);
  --bsx-bg-glass-hover: rgba(255,255,255,0.1);
  --bsx-border-light: #E2E8F0;
  --bsx-border-glass: rgba(255,255,255,0.1);

  /* Shadows */
  --bsx-shadow-sm: 0 2px 8px rgba(0,0,0,0.1);
  --bsx-shadow-md: 0 8px 24px rgba(0,0,0,0.25);
  --bsx-shadow-lg: 0 12px 40px rgba(0,0,0,0.3);

  /* Typography */
  --bsx-font: 'Plus Jakarta Sans', sans-serif;

  /* Radii */
  --bsx-radius-sm: 8px;
  --bsx-radius-md: 12px;
  --bsx-radius-lg: 16px;
  --bsx-radius-xl: 20px;

  /* Transitions */
  --bsx-ease: 0.3s ease;
}

/* ── Full-page sections ──────────────────────── */
/* Each section fills exactly one visible viewport minus the fixed header. */
.bsx-section {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: calc(100svh - var(--bsx-header-h, 74px));
  min-height: calc(100vh - var(--bsx-header-h, 74px)); /* fallback */
}

/* Hero already manages its own viewport height */
.bsx-section--hero {
  min-height: 0;
}

/* Inner sections stretch to fill the flex wrapper */
.bsx-section > section {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Offset for fixed header when scrolling to section */
.bsx-section[id] {
  scroll-margin-top: var(--bsx-header-h, 74px);
}

/* ── Scroll arrow ────────────────────────────── */
.bsx-scroll-arrow {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  opacity: 0.5;
  transition: opacity var(--bsx-ease);
  -webkit-tap-highlight-color: transparent;
}

.bsx-scroll-arrow:hover {
  opacity: 1;
}

.bsx-scroll-arrow svg {
  width: 24px;
  height: 24px;
  animation: bsx-bounce 2s ease infinite;
}

/* Light arrow for dark backgrounds */
.bsx-scroll-arrow--light svg {
  color: rgba(255, 255, 255, 0.7);
}

/* Dark arrow for light backgrounds */
.bsx-scroll-arrow--dark svg {
  color: var(--bsx-navy);
}

@keyframes bsx-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(6px); }
}

/* Slightly smaller arrows on desktop */
@media (min-width: 1024px) {
  .bsx-scroll-arrow {
    opacity: 0.35;
  }
  .bsx-scroll-arrow:hover {
    opacity: 0.8;
  }
}

/* ── Elementor Section/Column Reset ──────────── */
/* Remove default padding from old-style sections wrapping BSX shortcodes */
.elementor-section.elementor-section-full_width > .elementor-container,
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 100% !important;
}
.elementor-section.elementor-section-full_width > .elementor-container > .elementor-column > .elementor-widget-wrap,
.elementor-section.elementor-section-boxed > .elementor-container > .elementor-column > .elementor-widget-wrap {
  padding: 0;
}
.elementor-section.elementor-section-full_width,
.elementor-section.elementor-section-boxed {
  padding: 0;
  margin: 0;
}