/* Bringmal Global Theme Tokens */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&display=swap');

/* Prevent horizontal scrolling on mobile */
html {
  overflow-x: clip;
  max-width: 100%;
}

body {
  overflow-x: clip;
  max-width: 100%;
}

:root {
  /* Backgrounds */
  --bm-color-bg-primary: #0A0A0A; /* Charcoal Black */
  --bm-color-bg-primary-alt: #000000; /* Deep Black alternative */
  --bm-color-bg-secondary: #1C1C1E; /* Dark Grey for sections */

  /* Text */
  --bm-color-headline:#ffffff; /* White*/
  --bm-color-text-primary: #F5F5F5; /* Warm White */
  --bm-color-text-secondary: #C0C0C0; /* Cool Silver */

  /* Accents */
  --bm-color-accent: #007BFF; /* Electric Blue */
  --bm-color-accent-strong: #00BFFF; /* Stronger Electric Blue */
  --bm-color-accent-hover: #0056B3; /* Darker blue for hover */


  /* Common radii, spacing, and durations */
  --bm-radius-sm: 6px;
  --bm-radius-md: 10px;
  --bm-radius-lg: 16px;

  --bm-space-1: 0.25rem;
  --bm-space-2: 0.5rem;
  --bm-space-3: 0.75rem;
  --bm-space-4: 1rem;
  --bm-space-6: 1.5rem;
  --bm-space-8: 2.5rem;
  --bm-space-9: 5rem;


  --bm-shadow-soft: 0 4px 20px rgba(0,0,0,0.25);
  --bm-transition-fast: 150ms ease;
  --bm-transition: 250ms ease;
  /* Layout */
  --bm-section-padding-inline: var(--bm-space-2);
  --bm-content-max-width: 1200px; /* wider global line length */
  --bm-content-wide-extra: 200px; /* extra width for alignwide */
}

/* Base page colors (opt-in by body class) */
body.bm-theme-dark {
  background-color: var(--bm-color-bg-primary);
  color: var(--bm-color-text-primary);
  font-size: 16px; /* smaller base content size */
  line-height: 1.6;
}

/* Global content container width: reduce giant side gutters on large screens */
.wp-site-blocks,
.wp-block-post-content,
.entry-content {
  max-width: var(--bm-content-max-width);
  margin-left: auto;
  margin-right: auto;
}



/* Global block spacing - add vertical margin between all blocks */
.wp-site-blocks > *,
.wp-block-post-content > *,
.entry-content > *,
.wp-block-group > * {
  margin-top: var(--bm-space-9) !important;
  margin-bottom: var(--bm-space-9) !important;
}

/* Exclude header-navigation from global spacing */
.header-navigation,
nav.header-navigation {
  margin-top: var(--bm-space-2) !important;
  margin-bottom: var(--bm-space-2) !important;
}

/* Remove top margin from block immediately after header */
.header-navigation + *,
nav.header-navigation + * {
  margin-top: 0 !important;
}

/* Remove top margin from first block and bottom margin from last block */
.wp-site-blocks > *:first-child,
.wp-block-post-content > *:first-child,
.entry-content > *:first-child,
.wp-block-group > *:first-child {
  margin-top: 0 !important;
}

.wp-site-blocks > *:last-child,
.wp-block-post-content > *:last-child,
.entry-content > *:last-child,
.wp-block-group > *:last-child {
  margin-bottom: var(--bm-space-8) !important;
}

/* Optional: tighter gaps on small screens */
@media (max-width: 640px) {
  :root { --bm-block-gap: 1em; }
}

/* Ensure immediate children also receive compact side padding and centering */
.wp-site-blocks > *:not(.alignfull),
.wp-block-post-content > *:not(.alignfull),
.entry-content > *:not(.alignfull) {
  max-width: var(--bm-content-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--bm-section-padding-inline);
  padding-right: var(--bm-section-padding-inline);
  box-sizing: border-box;
}

/* Wider content for alignwide blocks */
.alignwide,
.wp-block[data-align="wide"] {
  max-width: calc(var(--bm-content-max-width) + var(--bm-content-wide-extra));
}

/* Full-bleed for alignfull blocks */
.alignfull,
.wp-block[data-align="full"] {
  max-width: none;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

/* Typography (dark theme scoped) */
body.bm-theme-dark {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 400; /* Regular for body */
}
body.bm-theme-dark h1,
body.bm-theme-dark h2 {
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700; /* Bold */
  color: var(--bm-color-text-primary);
}
/* Make headlines significantly larger (responsive) */
body.bm-theme-dark h1 {
  font-size: clamp(2.25rem, 2.5vw + 1.25rem, 3.5rem);
  line-height: 1.2;
}
body.bm-theme-dark h2 {
  font-size: clamp(1.75rem, 2vw + 1rem, 2.75rem);
  line-height: 1.25;
}
body.bm-theme-dark p,
body.bm-theme-dark li {
  color: var(--bm-color-text-primary);
}
/* Accents for keywords, dates, places */
.accent,
.keyword,
.accent-text {
  color: var(--bm-color-accent) !important;
}

/* Utility background helpers */
.bg-primary {
  background-color: var(--bm-color-bg-primary) !important;
}
.bg-primary-alt {
  background-color: var(--bm-color-bg-primary-alt) !important;
}
.bg-secondary {
  background-color: var(--bm-color-bg-secondary) !important;
}

/* Utility text helpers */

.headline,
.headline a,
.headline strong,
.headline em {
  color: var(--bm-color-headline) !important;
}
.text-primary {
  color: var(--bm-color-text-primary) !important;
}
.text-secondary {
  color: var(--bm-color-text-secondary) !important;
}
.electric-blue {
  color: var(--bm-color-accent) !important;
}
.electirc-clue-strong {
  color: var(--bm-color-accent-strong) !important;
}
.text-highlight {
  color: var(--bm-color-highlight) !important;
}

/* Accent button helper (CTA). Use accent variables, hover elevates to strong) */
.btn-accent {
  display: inline-flex;
  align-items: center;
  gap: var(--bm-space-2);
  background: var(--bm-color-accent);
  color: #fff;
  padding: var(--bm-space-3) var(--bm-space-6);
  border-radius: var(--bm-radius-md);
  text-decoration: none;
  transition: transform var(--bm-transition-fast), background-color var(--bm-transition);
}
.btn-accent:hover,
.btn-accent:focus {
  background: var(--bm-color-accent-strong);
  transform: translateY(-1px);
}

/* Primary Button (Apply, Secure Spot) */
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: var(--bm-space-2);
  background: var(--bm-color-accent);
  color: #ffffff;
  padding: var(--bm-space-3) var(--bm-space-6);
  border-radius: var(--bm-radius-md);
  border: 1px solid transparent;
  text-decoration: none;
  transition: transform var(--bm-transition-fast), background-color var(--bm-transition);
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--bm-color-accent-hover);
  transform: translateY(-1px);
}

/* Secondary Button (Watch Video, Learn More) */
.btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: var(--bm-space-2);
  background: transparent;
  color: var(--bm-color-accent);
  padding: var(--bm-space-3) var(--bm-space-6);
  border-radius: var(--bm-radius-md);
  border: 1px solid var(--bm-color-accent);
  text-decoration: none;
  transition: transform var(--bm-transition-fast), background-color var(--bm-transition), color var(--bm-transition);
}
.btn-secondary:hover,
.btn-secondary:focus {
  background: var(--bm-color-accent);
  color: #ffffff;
  transform: translateY(-1px);
}

/* Highlighted separators (not buttons) */
.hr-highlight {
  border: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--bm-color-highlight), transparent);
  opacity: 0.7;
}

/* Cards/sections on dark surfaces */
.surface-secondary {
  background: var(--bm-color-bg-secondary);
  color: var(--bm-color-text-primary);
  border-radius: var(--bm-radius-lg);
  box-shadow: var(--bm-shadow-soft);
}

/* Link styles aligned with accent */
.link-accent {
  color: var(--bm-color-accent);
  text-decoration: none;
  transition: color var(--bm-transition);
}
.link-accent:hover,
.link-accent:focus {
  color: var(--bm-color-accent-strong);
  text-decoration: underline;
}

/* Smooth scroll for anchor links */
html {
  scroll-behavior: smooth;
}

/* Offset for sticky header when jumping to anchors */
[id] {
  scroll-margin-top: 100px;
}

/* Check List style */
ul.list-checks {
  list-style: none;
  padding-left: 0; /* remove default indent */
  margin-left: 0;
}

ul.list-checks li {
  position: relative;
  padding-left: 1.6em; /* space for the check */
}

ul.list-checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 1em;
  height: 1em;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23007BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}