/* Mereo 4 Holdings — site styles
   Extracted verbatim from the production build, asset URLs localized. */

/* ══ CORE DESIGN SYSTEM (Elementor global kit, post-5) ══ */
/* ============================================================
   MEREO 4 — GLOBAL ELEMENTOR CSS
   Paste into: Elementor → Site Settings → Custom CSS

   Fonts:  Rajdhani (body/labels) + Oswald (display headings)
   Colors: #faa31b gold · #ffffff white · #000000 black · #f0f0f0 light grey
   ============================================================ */

/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&family=Rajdhani:wght@300;400;500;600;700&display=swap');

/* ── CSS Variables ── */
:root {
  --m4-gold:        #faa31b;
  --m4-gold-bright: #fbb640;
  --m4-gold-dim:    rgba(250,163,27,0.15);
  --m4-black:       #000000;
  --m4-near-black:  #0d0d0d;
  --m4-dark:        #141414;
  --m4-dark-mid:    #1c1c1c;
  --m4-dark-light:  #262626;
  --m4-grey:        #555555;
  --m4-mid-grey:    #888888;
  --m4-light-grey:  #c0c0c0;
  --m4-off-white:   #f0f0f0;
  --m4-white:       #ffffff;
}

/* ── Page Background ── */
body,
.elementor-page,
.elementor-template-full-width .elementor-section-wrap {
  background-color: var(--m4-black) !important;
  color: var(--m4-off-white);
}

/* ── Remove default Elementor padding ── */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1200px;
}
.elementor-widget-html { width: 100%; }

/* ── Global Font Defaults ── */
body,
p,
li,
dd,
dt,
span,
div {
  font-family: 'Rajdhani', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  color: var(--m4-white);
}

/* ── Elementor Heading Widget ── */
.elementor-widget-heading .elementor-heading-title {
  font-family: 'Oswald', sans-serif;
  color: var(--m4-white);
  text-transform: uppercase;
}
.elementor-widget-heading .elementor-heading-title em {
  font-style: italic;
  color: var(--m4-gold);
  font-weight: 300;
}

/* ── Elementor Text Widget ── */
.elementor-widget-text-editor,
.elementor-widget-text-editor p {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 400;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--m4-light-grey);
}

/* ── Links ── */
a { color: var(--m4-gold); transition: color 0.2s; }
a:hover { color: var(--m4-gold-bright); }

/* ── Buttons ── */
.elementor-button,
.elementor-button-wrapper .elementor-button {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  transition: all 0.25s !important;
}

/* Primary button (gold fill) */
.elementor-button.elementor-button-primary,
.elementor-button[style*="background-color: #faa31b"],
.elementor-button[style*="background-color:#faa31b"] {
  background-color: var(--m4-gold) !important;
  color: var(--m4-black) !important;
  border: 2px solid var(--m4-gold) !important;
}
.elementor-button.elementor-button-primary:hover {
  background-color: transparent !important;
  color: var(--m4-gold) !important;
}

/* Outline button */
.elementor-button.elementor-button-ghost,
.elementor-button.m4-btn-outline {
  background: transparent !important;
  color: var(--m4-light-grey) !important;
  border: 2px solid rgba(192,192,192,0.3) !important;
}
.elementor-button.elementor-button-ghost:hover {
  border-color: var(--m4-white) !important;
  color: var(--m4-white) !important;
}

/* ── Section Labels (small gold eyebrow text) ── */
.m4-label,
.elementor-widget-heading[data-widget_type="heading.default"] .elementor-heading-title.elementor-size-small {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--m4-gold);
}

/* ── Section / Row Backgrounds ── */
/* Dark sections */
.elementor-section.m4-section-dark,
.elementor-section.m4-bg-black {
  background-color: var(--m4-black) !important;
}
.elementor-section.m4-section-near-black,
.elementor-section.m4-bg-dark {
  background-color: var(--m4-near-black) !important;
}

/* Gold top border on sections */
.elementor-section.m4-border-gold-top {
  border-top: 3px solid var(--m4-gold) !important;
}
.elementor-section.m4-border-gold-bottom {
  border-bottom: 1px solid rgba(250,163,27,0.12) !important;
}

/* ── Navigation (HTML widget) ── */
.m4-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 48px; height: 72px;
  background: rgba(0,0,0,0.97);
  border-bottom: 2px solid var(--m4-gold);
  backdrop-filter: blur(8px);
}
.m4-nav-logo {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 1.5rem; letter-spacing: 0.12em;
  color: var(--m4-white); text-decoration: none;
}
.m4-nav-logo span { color: var(--m4-gold); }
.m4-nav-links { display: flex; gap: 36px; list-style: none; margin: 0; padding: 0; }
.m4-nav-links a {
  font-family: 'Rajdhani', sans-serif; font-weight: 600;
  font-size: 0.9rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--m4-light-grey); text-decoration: none; transition: color 0.2s;
}
.m4-nav-links a:hover { color: var(--m4-gold); }
.m4-nav-cta {
  font-family: 'Rajdhani', sans-serif; font-weight: 700;
  font-size: 0.85rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--m4-black); background: var(--m4-gold);
  padding: 10px 24px; text-decoration: none;
  border: 2px solid var(--m4-gold); transition: all 0.2s;
}
.m4-nav-cta:hover { background: transparent; color: var(--m4-gold); }

/* ── Hero Section ── */
.m4-hero {
  position: relative; height: 100vh; min-height: 680px;
  display: flex; align-items: flex-end; padding-bottom: 100px; overflow: hidden;
}
.m4-hero-bg {
  position: absolute; inset: 0;
  background:
    linear-gradient(160deg, rgba(0,0,0,0.90) 0%, rgba(20,20,20,0.65) 50%, rgba(0,0,0,0.95) 100%),
    repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(255,255,255,0.006) 3px, rgba(255,255,255,0.006) 4px),
    radial-gradient(ellipse at 70% 40%, #1c1c1c 0%, #000000 70%);
}
.m4-hero-bg::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    radial-gradient(ellipse 220px 150px at 15% 30%, rgba(250,163,27,0.07) 0%, transparent 70%),
    radial-gradient(ellipse 300px 200px at 75% 65%, rgba(20,20,20,0.6) 0%, transparent 70%),
    radial-gradient(ellipse 160px 260px at 45% 80%, rgba(0,0,0,0.8) 0%, transparent 70%);
}
.m4-hero-bg::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,1) 0%, transparent 45%);
}
.m4-hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(250,163,27,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(250,163,27,0.05) 1px, transparent 1px);
  background-size: 80px 80px;
}
.m4-hero-content {
  position: relative; z-index: 2;
  max-width: 1200px; margin: 0 auto; padding: 0 48px; width: 100%;
}
.m4-hero-eyebrow {
  font-family: 'Rajdhani', sans-serif; font-weight: 600;
  font-size: 0.85rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--m4-gold); margin-bottom: 20px;
  display: flex; align-items: center; gap: 16px;
}
.m4-hero-eyebrow::before { content: ''; display: block; width: 48px; height: 2px; background: var(--m4-gold); }
.m4-hero-title {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: clamp(3rem, 7vw, 6.5rem); line-height: 0.9;
  text-transform: uppercase; letter-spacing: -0.02em;
  color: var(--m4-white); margin-bottom: 32px;
}
.m4-hero-title em { font-style: normal; color: var(--m4-gold); display: block; }
.m4-hero-sub {
  font-family: 'Rajdhani', sans-serif; font-weight: 400; font-size: 1.15rem;
  color: var(--m4-light-grey); max-width: 520px; line-height: 1.65; margin-bottom: 44px;
}
.m4-hero-actions { display: flex; gap: 16px; align-items: center; }
.m4-btn-primary {
  font-family: 'Rajdhani', sans-serif; font-weight: 700;
  font-size: 0.9rem; letter-spacing: 0.18em; text-transform: uppercase;
  background: var(--m4-gold); color: var(--m4-black);
  padding: 14px 40px; text-decoration: none;
  border: 2px solid var(--m4-gold); transition: all 0.25s; display: inline-block;
}
.m4-btn-primary:hover { background: transparent; color: var(--m4-gold); }
.m4-btn-outline {
  font-family: 'Rajdhani', sans-serif; font-weight: 600;
  font-size: 0.9rem; letter-spacing: 0.18em; text-transform: uppercase;
  background: transparent; color: var(--m4-light-grey);
  padding: 14px 40px; text-decoration: none;
  border: 2px solid rgba(192,192,192,0.3); transition: all 0.25s; display: inline-block;
}
.m4-btn-outline:hover { border-color: var(--m4-white); color: var(--m4-white); }
.m4-hero-stats {
  position: absolute; bottom: 0; right: 0; z-index: 2;
  display: flex; border-top: 2px solid var(--m4-gold); border-left: 2px solid var(--m4-gold);
}
.m4-stat-item {
  padding: 20px 40px; background: rgba(0,0,0,0.96);
  border-right: 1px solid rgba(250,163,27,0.18); text-align: center;
}
.m4-stat-item:last-child { border-right: none; }
.m4-stat-num { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 2rem; color: var(--m4-gold); display: block; }
.m4-stat-label { font-family: 'Rajdhani', sans-serif; font-weight: 600; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--m4-mid-grey); display: block; margin-top: 4px; }

/* ── Shared Section Helpers ── */
.m4-section { padding: 100px 0; }
.m4-container { max-width: 1200px; margin: 0 auto; padding: 0 48px; }
.m4-section-label {
  font-family: 'Rajdhani', sans-serif; font-weight: 700;
  font-size: 0.8rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--m4-gold); margin-bottom: 16px;
  display: flex; align-items: center; gap: 12px;
}
.m4-section-label::before { content: ''; display: block; width: 32px; height: 2px; background: var(--m4-gold); }
.m4-section-title {
  font-family: 'Oswald', sans-serif; font-weight: 600;
  font-size: clamp(2rem, 4vw, 3.2rem); text-transform: uppercase;
  letter-spacing: 0.03em; color: var(--m4-white); line-height: 1.05;
}
.m4-section-title em { font-style: italic; color: var(--m4-gold); font-weight: 300; }

/* ── Corner Bracket Decorations ── */
.m4-corner-tl, .m4-corner-br { position: absolute; width: 40px; height: 40px; border-color: var(--m4-gold); border-style: solid; }
.m4-corner-tl { top: 12px; left: 12px; border-width: 2px 0 0 2px; }
.m4-corner-br { bottom: 12px; right: 12px; border-width: 0 2px 2px 0; }

/* ── About Section ── */
.m4-about { background: var(--m4-near-black); border-top: 3px solid var(--m4-gold); border-bottom: 1px solid rgba(250,163,27,0.1); }
.m4-about-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.m4-about-text p { font-family: 'Rajdhani', sans-serif; font-weight: 400; font-size: 1.05rem; line-height: 1.75; color: var(--m4-light-grey); margin-top: 24px; }
.m4-about-def { background: rgba(250,163,27,0.06); border-left: 3px solid var(--m4-gold); padding: 24px 28px; margin-top: 32px; }
.m4-def-word { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 1.4rem; color: var(--m4-gold); letter-spacing: 0.1em; }
.m4-def-body { font-family: 'Rajdhani', sans-serif; font-size: 1rem; color: var(--m4-mid-grey); margin-top: 8px; line-height: 1.6; }
.m4-camo-box {
  height: 400px;
  background: radial-gradient(ellipse 120px 80px at 20% 20%, rgba(40,40,40,0.9) 0%, transparent 60%),
    radial-gradient(ellipse 160px 100px at 80% 50%, rgba(28,28,28,0.8) 0%, transparent 60%),
    radial-gradient(ellipse 80px 140px at 50% 80%, rgba(10,10,10,0.9) 0%, transparent 60%);
  background-color: var(--m4-dark-mid);
  border: 1px solid rgba(250,163,27,0.18);
  display: flex; align-items: center; justify-content: center; position: relative;
}

/* ── Service Cards ── */
.m4-services { background: var(--m4-black); position: relative; }
.m4-services::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--m4-gold) 0%, transparent 100%); }
.m4-service-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; }
.m4-service-card { background: var(--m4-near-black); padding: 48px 40px; position: relative; overflow: hidden; transition: transform 0.3s; cursor: pointer; }
.m4-service-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--m4-gold); transform: scaleY(0); transform-origin: bottom; transition: transform 0.3s; }
.m4-service-card:hover::before { transform: scaleY(1); }
.m4-service-card:hover { transform: translateX(4px); }
.m4-card-num { font-family: 'Oswald', sans-serif; font-size: 4rem; font-weight: 700; color: rgba(250,163,27,0.08); line-height: 1; margin-bottom: 16px; }
.m4-card-title { font-family: 'Rajdhani', sans-serif; font-weight: 700; font-size: 1.3rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--m4-white); margin-bottom: 16px; }
.m4-card-body { font-family: 'Rajdhani', sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.7; color: var(--m4-mid-grey); }
.m4-card-list { list-style: none; margin-top: 20px; padding: 0; }
.m4-card-list li { font-family: 'Rajdhani', sans-serif; font-size: 0.95rem; font-weight: 500; color: var(--m4-light-grey); padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; gap: 10px; }
.m4-card-list li::before { content: '▸'; color: var(--m4-gold); font-size: 0.65rem; flex-shrink: 0; }
.m4-card-list li:last-child { border-bottom: none; }

/* ── Platform Tags ── */
.m4-platforms { background: var(--m4-near-black); border-top: 1px solid rgba(250,163,27,0.1); }
.m4-platforms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; }
.m4-platform-tag { background: rgba(255,255,255,0.025); border: 1px solid rgba(250,163,27,0.12); padding: 18px 20px; font-family: 'Rajdhani', sans-serif; font-size: 0.95rem; font-weight: 500; color: var(--m4-light-grey); transition: all 0.2s; }
.m4-platform-tag:hover { border-color: var(--m4-gold); background: rgba(250,163,27,0.05); color: var(--m4-white); }
.m4-platform-tag span { display: block; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--m4-gold); margin-bottom: 6px; }

/* ── Leadership Cards ── */
.m4-leadership { background: var(--m4-black); }
.m4-leaders-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-top: 56px; }
.m4-leader-card { background: var(--m4-near-black); padding: 48px 40px; position: relative; overflow: hidden; }
.m4-leader-card::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(to bottom, var(--m4-gold), transparent); opacity: 0.45; }
.m4-rank-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.m4-rank-pip { width: 8px; height: 8px; background: var(--m4-gold); transform: rotate(45deg); display: inline-block; }
.m4-rank-title { font-family: 'Rajdhani', sans-serif; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: var(--m4-gold); }
.m4-leader-name { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 1.8rem; letter-spacing: 0.03em; color: var(--m4-white); margin-bottom: 6px; }
.m4-leader-role { font-family: 'Rajdhani', sans-serif; font-size: 0.88rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--m4-mid-grey); margin-bottom: 24px; }
.m4-leader-bio { font-family: 'Rajdhani', sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.75; color: var(--m4-light-grey); }

/* ── News Cards ── */
.m4-news { background: var(--m4-near-black); border-top: 1px solid rgba(250,163,27,0.1); }
.m4-news-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 2px; margin-top: 56px; }
.m4-news-card { background: var(--m4-black); padding: 36px 32px; cursor: pointer; transition: background 0.2s; text-decoration: none; display: block; }
.m4-news-card:hover { background: rgba(250,163,27,0.04); }
.m4-news-date { font-family: 'Rajdhani', sans-serif; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: var(--m4-gold); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.m4-news-date::before { content: ''; display: block; width: 20px; height: 1px; background: var(--m4-gold); }
.m4-news-headline { font-family: 'Oswald', sans-serif; font-weight: 500; font-size: 1.1rem; letter-spacing: 0.03em; color: var(--m4-white); line-height: 1.3; margin-bottom: 16px; }
.m4-news-card.m4-featured .m4-news-headline { font-size: 1.5rem; }
.m4-news-excerpt { font-family: 'Rajdhani', sans-serif; font-size: 0.95rem; font-weight: 400; color: var(--m4-mid-grey); line-height: 1.65; }
.m4-news-more { font-family: 'Rajdhani', sans-serif; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--m4-gold); margin-top: 20px; display: flex; align-items: center; gap: 8px; }
.m4-news-more::after { content: '→'; transition: transform 0.2s; }
.m4-news-card:hover .m4-news-more::after { transform: translateX(4px); }

/* ── Locations ── */
.m4-locations { background: var(--m4-black); position: relative; overflow: hidden; }
.m4-locations::before { content: 'WORLDWIDE'; position: absolute; font-family: 'Oswald', sans-serif; font-size: 14rem; font-weight: 700; color: rgba(255,255,255,0.015); top: 50%; right: -2%; transform: translateY(-50%); pointer-events: none; white-space: nowrap; }
.m4-locations-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.m4-locations-map { background: var(--m4-near-black); border: 1px solid rgba(250,163,27,0.18); height: 380px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.m4-map-dot { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--m4-gold); box-shadow: 0 0 0 3px rgba(250,163,27,0.2); }
.m4-map-dot::after { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid var(--m4-gold); animation: m4-ping 2s ease-out infinite; opacity: 0; }
@keyframes m4-ping { 0% { transform: scale(1); opacity: 0.6; } 100% { transform: scale(2.5); opacity: 0; } }
.m4-location-item { display: flex; gap: 16px; align-items: flex-start; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.m4-location-item:first-child { padding-top: 0; }
.m4-location-bullet { width: 6px; height: 6px; background: var(--m4-gold); transform: rotate(45deg); margin-top: 7px; flex-shrink: 0; }
.m4-location-name { font-family: 'Rajdhani', sans-serif; font-size: 1rem; font-weight: 600; letter-spacing: 0.06em; color: var(--m4-light-grey); }
.m4-location-country { font-family: 'Rajdhani', sans-serif; font-size: 0.85rem; color: var(--m4-mid-grey); margin-top: 2px; }

/* ── Contact ── */
.m4-contact { background: var(--m4-near-black); border-top: 3px solid var(--m4-gold); }
.m4-contact-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.m4-contact-info dt { font-family: 'Rajdhani', sans-serif; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: var(--m4-gold); margin-top: 28px; margin-bottom: 6px; }
.m4-contact-info dt:first-child { margin-top: 0; }
.m4-contact-info dd { font-family: 'Rajdhani', sans-serif; font-weight: 400; color: var(--m4-light-grey); font-size: 1rem; line-height: 1.6; margin: 0; }
.m4-contact-info a { color: var(--m4-light-grey); text-decoration: none; }
.m4-contact-info a:hover { color: var(--m4-gold); }
.m4-cert-strip { margin-top: 40px; padding-top: 32px; border-top: 1px solid rgba(250,163,27,0.1); }
.m4-cert-label { font-family: 'Rajdhani', sans-serif; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: var(--m4-mid-grey); margin-bottom: 16px; }
.m4-cert-badges { display: flex; flex-wrap: wrap; gap: 12px; }
.m4-cert-badge { font-family: 'Rajdhani', sans-serif; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em; color: var(--m4-light-grey); background: rgba(255,255,255,0.03); border: 1px solid rgba(250,163,27,0.18); padding: 8px 14px; }
.m4-quality { background: rgba(0,0,0,0.5); border-left: 3px solid var(--m4-gold); padding: 32px 28px; }
.m4-quality h3 { font-family: 'Rajdhani', sans-serif; font-weight: 700; font-size: 1.1rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--m4-gold); margin-bottom: 16px; }
.m4-quality p { font-family: 'Rajdhani', sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.75; color: var(--m4-light-grey); }
.m4-employment { margin-top: 32px; padding: 28px; background: rgba(250,163,27,0.04); border: 1px solid rgba(250,163,27,0.16); }
.m4-employment h3 { font-family: 'Rajdhani', sans-serif; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--m4-white); margin-bottom: 10px; }
.m4-employment p { font-family: 'Rajdhani', sans-serif; font-size: 0.95rem; font-weight: 400; color: var(--m4-mid-grey); line-height: 1.65; }
.m4-employment a { color: var(--m4-gold); }

/* ── Footer ── */
.m4-footer { background: var(--m4-black); border-top: 1px solid rgba(250,163,27,0.12); padding: 40px 0; }
.m4-footer-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
.m4-footer-logo { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 1.2rem; letter-spacing: 0.12em; color: var(--m4-white); }
.m4-footer-logo span { color: var(--m4-gold); }
.m4-footer-copy { font-family: 'Rajdhani', sans-serif; font-size: 0.85rem; font-weight: 500; color: var(--m4-mid-grey); }
.m4-footer-links { display: flex; gap: 24px; }
.m4-footer-links a { font-family: 'Rajdhani', sans-serif; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--m4-mid-grey); text-decoration: none; }
.m4-footer-links a:hover { color: var(--m4-gold); }

/* ── Animations ── */
@keyframes m4-fadeUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
.m4-animate-up { animation: m4-fadeUp 0.6s ease both; }
.m4-delay-1 { animation-delay: 0.2s; }
.m4-delay-2 { animation-delay: 0.4s; }
.m4-delay-3 { animation-delay: 0.6s; }
.m4-delay-4 { animation-delay: 0.8s; }

/* ── Smooth Scroll ── */
html { scroll-behavior: smooth; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .m4-about-inner, .m4-contact-inner, .m4-locations-inner { grid-template-columns: 1fr; gap: 48px; }
  .m4-service-cards, .m4-leaders-grid { grid-template-columns: 1fr; }
  .m4-news-grid { grid-template-columns: 1fr; }
  .m4-platforms-grid { grid-template-columns: repeat(2, 1fr); }
  .m4-hero-stats { position: static; margin-top: 40px; flex-wrap: wrap; border: 1px solid var(--m4-gold); }
  .m4-hero { align-items: flex-start; padding-top: 100px; height: auto; min-height: 100vh; }
}
@media (max-width: 768px) {
  .m4-nav { padding: 0 20px; }
  .m4-nav-links { display: none; }
  .m4-container { padding: 0 20px; }
  .m4-section { padding: 64px 0; }
  .m4-platforms-grid { grid-template-columns: 1fr; }
  .m4-hero-stats { display: none; }
  .m4-footer-inner { flex-direction: column; align-items: flex-start; }
}

/* ══ HOMEPAGE OVERRIDES (post-485) ══ */
.m4-nav-logo img {
  height: 40px; /* adjust as needed */
  width: auto;
  display: block;
}

.m4-hero-title {
  margin: 0;
  line-height: 0.9; /* tighten vertical spacing */
}

.m4-hero-title em {
  font-style: normal; /* remove italic spacing differences */
  display: inline-block; /* prevents weird inline spacing */
}

@media (max-width: 768px) {
  /* Hide video */
  .m4-hero-video {
    display: none;
  }

  /* Use image instead */
  .m4-hero-video-wrap {
    background: url("../img/hero-poster.jpg") center center / cover no-repeat;
  }

  /* Remove the fallback pseudo-element */
  .m4-hero-video-wrap::after {
    display: none;
  }
}

.m4-about {
  position: relative;
  background: url('../img/soldier.jpg') no-repeat center center/cover;
  padding: 100px 0;
}

/* Optional overlay for readability */
.m4-about::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5); /* dark overlay */
}

.m4-about-inner {
  position: relative;
  z-index: 2; /* keeps content above overlay */
  display: flex;
  justify-content: flex-end; /* pushes content right */
}

.m4-about-text {
  max-width: 600px;
  color: #fff; /* important for readability on image */
  text-align: left;
}

.m4-leader-header {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.m4-headshot {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 50%; /* optional: makes it circular */
}

.m4-leader-text {
  flex: 1;
}

.m4-map-dot {
  cursor: default;
}

.m4-location-name {
  line-height: 1.3;
}

.m4-location-country {
  line-height: 1.5;
  opacity: 0.82;
}

.m4-location-bullet {
  width: 8px;
  height: 8px;
  margin-top: 8px;
  border-radius: 50%;
  background: #ffb000;
  box-shadow: 0 0 10px rgba(255,176,0,0.35);
  flex: 0 0 8px;
}

.m4-locations-map {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
}

.m4-footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.m4-footer-logo a {
  display: inline-flex;
  align-items: center;
}

.m4-footer-logo img {
  height: 40px; /* match nav logo size */
  width: auto;
  display: block;
}

.m4-footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  gap: 8px;
}

.m4-footer-links {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* ══ INLINE SECTION STYLES ══ */
/* ── inline block [3] ── */
500;600;700&family=Rajdhani:wght@400;600;700&display=swap');

/* ── Stats: always full-width at bottom, never hidden ── */
.m4-hero .m4-hero-stats {
  position: relative !important;
  bottom: auto !important;
  right: auto !important;
  width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  border-top: 2px solid #faa31b !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  margin-top: auto !important;
}

/* ── Tablet + Mobile layout ── */
@media (max-width: 1024px) {
  .m4-hero {
    flex-direction: column !important;
    height: auto !important;
    min-height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .m4-hero .m4-hero-content {
    flex: 0 0 auto !important;
    padding: 100px 40px 40px !important;
  }
  .m4-hero .m4-hero-stats {
    display: flex !important;
    margin-top: 0 !important;
  }
  .m4-hero .m4-stat-item {
    flex: 1 1 0 !important;
    padding: 20px 10px !important;
  }
}

/* ── Mobile: tighten padding, FORCE display (overrides display:none) ── */
@media (max-width: 768px) {
  .m4-hero .m4-hero-stats {
    display: flex !important;
  }
  .m4-hero .m4-hero-content {
    padding: 100px 24px 32px !important;
  }
  .m4-hero .m4-stat-item {
    padding: 16px 8px !important;
  }
}

/* — Gold section dividers — */
.m4-services,
.m4-platforms,
.m4-leadership,
.m4-locations {
  border-top: 3px solid #faa31b;
}
/* — Fix double gold lines — */
.m4-about {
  border-bottom: none !important;
}
.m4-platforms {
  border-top: 3px solid #faa31b !important;
}

/* — Grey text → white for readability — */
.m4-hero-sub,
.m4-btn-outline,
.m4-platform-tag,
.m4-leader-bio,
.m4-location-name,
.m4-cert-badge,
.m4-stat-label,
.m4-def-body,
.m4-card-body,
.m4-leader-role,
.m4-location-country,
.m4-cert-label,
.m4-footer-copy,
.m4n-exc {
  color: #ffffff !important;
}

/* — Employment box: match quality policy card style — */
.m4-employment {
  background-color: rgba(0, 0, 0, 0.5) !important;
  border: none !important;
  border-left: 3px solid #faa31b !important;
}
.m4-employment p,
.m4-employment * {
  color: #ffffff !important;
}
.m4-employment a {
  color: #faa31b !important;
}
.m4-employment h3 { color: #faa31b !important; }
/*# sourceURL=global-styles-inline-css */

/* ── inline block [10] ── */
@media(max-width:768px){
  .m4-nav-links{display:none!important}
  .m4-nav-cta{display:none!important}
  .m4-hamburger{display:flex!important}
  .m4-mobile-menu.open{transform:translateX(0)}
}
.m4-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;cursor:pointer;flex-shrink:0;background:none;border:none;padding:0}
.m4-hamburger span{display:block;width:24px;height:2px;background:#faa31b;transition:all .3s ease;transform-origin:center}
.m4-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.m4-hamburger.open span:nth-child(2){opacity:0}
.m4-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.m4-mobile-menu{position:fixed;top:72px;left:0;right:0;bottom:0;background:rgba(0,0,0,.98);z-index:9998;transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column;padding:40px 32px}
.m4-mobile-menu a{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:.14em;text-transform:uppercase;color:#c0c0c0;text-decoration:none;padding:20px 0;border-bottom:1px solid rgba(250,163,27,.12);transition:color .2s}
.m4-mobile-menu a:hover{color:#faa31b}

/* ── inline block [11] ── */
/* ── Video wrap ── */
.m4-hero-video-wrap {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

/* ── Video ── */
.m4-hero-video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
}

/* ── Overlay ── */
.m4-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(160deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.45) 50%, rgba(0, 0, 0, 0.80) 100%),
    linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, transparent 40%);
}

/* ── Grid ── */
.m4-hero-grid {
  position: absolute;
  inset: 0;
  z-index: 2;
  background-image:
    linear-gradient(rgba(250, 163, 27, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(250, 163, 27, 0.05) 1px, transparent 1px);
  background-size: 80px 80px;
}

/* ── Content layering ── */
.m4-hero-content {
  position: relative;
  z-index: 3;
}

.m4-hero-stats {
  position: relative;
  z-index: 3;
}

/* ── Remove old bg ── */
.m4-hero-bg {
  display: none;
}

/* ── Mobile fallback ── */
@media (max-width: 768px) {
  .m4-hero-video {
    display: none;
  }

  .m4-hero-video-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #141414;
  }
}

/* ── inline block [12] ── */
.m4-locations-top {
  display: grid;
  grid-template-columns: minmax(320px, 460px) minmax(0, 1fr);
  gap: 60px;
  align-items: center;
}

.m4-locations-intro {
  font-weight: 300;
  color: var(--tan);
  margin-top: 20px;
  margin-bottom: 0;
  line-height: 1.8;
}

.m4-locations-map,
.m4-map-frame,
.m4-map-image {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

.m4-locations-map {
  width: 100%;
}

.m4-map-frame {
  position: relative;
  width: 100%;
}

.m4-map-image {
  display: block;
  width: 100%;
  height: auto;
}

.m4-map-markers {
  position: absolute;
  inset: 0;
}

.m4-map-dot {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ffb000;
  border: 2px solid #ffb000;
  box-shadow:
    0 0 0 3px rgba(255,176,0,0.14),
    0 0 10px rgba(255,176,0,0.55),
    0 0 18px rgba(255,176,0,0.28);
}

.m4-map-dot::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,176,0,0.4);
  animation: pulse 2.2s infinite;
}

@keyframes pulse {
  0% {
    transform: scale(0.7);
    opacity: 0.85;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

.m4-location-list-grid {
  margin-top: 70px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 48px;
  row-gap: 0;
}

.m4-location-list-grid .m4-location-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.m4-map-grid,
.m4-corner-tl,
.m4-corner-br,
.m4-map-caption {
  display: none !important;
}

@media (max-width: 980px) {
  .m4-locations-top {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .m4-location-list-grid {
    grid-template-columns: 1fr;
    margin-top: 48px;
  }
}

/* ── inline block [13] ── */
.m4n-section{background:#0d0d0d;padding:100px 0;border-top:1px solid rgba(250,163,27,.12)}
.m4n-inner{max-width:1200px;margin:0 auto;padding:0 48px}
.m4n-label{font-family:Rajdhani,sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.32em;text-transform:uppercase;color:#faa31b;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.m4n-label::before{content:"";display:block;width:32px;height:2px;background:#faa31b}
.m4n-title{font-family:Oswald,sans-serif;font-weight:600;font-size:clamp(2rem,4vw,3rem);text-transform:uppercase;color:#fff;margin-bottom:56px}
.m4n-title em{font-style:italic;color:#faa31b;font-weight:300}
.m4n-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px;margin-bottom:48px}
.m4n-item{background:#0d0d0d;transition:background .2s}
.m4n-item:hover{background:rgba(250,163,27,.04)}
.m4n-body{padding:28px 24px;display:flex;flex-direction:column;align-items:flex-start;min-height:320px}
.m4n-badge{align-self:flex-start;display:inline-block;background:#faa31b;color:#000;font-family:Rajdhani,sans-serif;font-weight:700;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;padding:4px 10px;margin-bottom:14px;text-decoration:none}
.m4n-dt{width:100%;font-family:Rajdhani,sans-serif;font-weight:700;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:#faa31b;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.m4n-dt::before{content:"";display:block;width:20px;height:1px;background:#faa31b;flex-shrink:0}
.m4n-ttl{width:100%;font-family:Oswald,sans-serif;font-weight:500;font-size:1.1rem;color:#fff;line-height:1.3;margin-bottom:12px;letter-spacing:.08em;text-transform:uppercase}
.m4n-exc{width:100%;font-family:Rajdhani,sans-serif;font-size:.95rem;color:#888;line-height:1.65;margin-bottom:18px;flex:1}
.m4n-push{flex:1;width:100%}
.m4n-rd{width:100%;font-family:Rajdhani,sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#faa31b;display:flex;align-items:center;gap:6px;text-decoration:none}
.m4n-rd::after{content:"\2192"}
.m4n-loading{grid-column:1/-1;display:flex;justify-content:center;gap:8px;padding:60px}
.m4n-loading span{width:8px;height:8px;background:#faa31b;border-radius:50%;animation:m4pulse 1.2s ease-in-out infinite}
.m4n-loading span:nth-child(2){animation-delay:.2s}
.m4n-loading span:nth-child(3){animation-delay:.4s}
@keyframes m4pulse{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
.m4n-footer{text-align:center}
.m4n-all{font-family:Rajdhani,sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:#000;background:#faa31b;padding:14px 40px;text-decoration:none;border:2px solid #faa31b;display:inline-block;transition:all .25s}
.m4n-all:hover{background:transparent;color:#faa31b}
@media(max-width:1024px){.m4n-grid{grid-template-columns:1fr}}
@media(max-width:768px){.m4n-inner{padding:0 20px}.m4n-section{padding:64px 0}}

/* ══════════════════════════════════════════════════════════════════
   NEWS INDEX + ARTICLE PAGES
   Added for the static rebuild. The live WordPress site had no design
   for these — they rendered as stock Twenty Twenty-Five. Built from
   the existing --m4-* tokens so they match the homepage system.
   ══════════════════════════════════════════════════════════════════ */

.m4-subpage { background: var(--m4-near-black); }

/* clear the fixed nav */
.m4-subpage .m4n-section,
.m4-subpage .m4-article { padding-top: 140px; }

/* ── news index header ── */
.m4-page-head .m4n-title { margin-bottom: 8px; }
.m4-page-intro {
  font-family: Rajdhani, sans-serif;
  font-size: 1.05rem;
  color: var(--m4-mid-grey);
  max-width: 640px;
  line-height: 1.7;
  margin-bottom: 8px;
}

/* ── thumbnails on cards ── */
.m4n-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--m4-dark);
  border-bottom: 2px solid var(--m4-gold);
}
.m4n-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.m4n-item:hover .m4n-thumb img { transform: scale(1.04); }

/* ── article ── */
.m4-article { background: var(--m4-near-black); padding-bottom: 100px; }
.m4-article-inner { max-width: 820px; margin: 0 auto; padding: 0 48px; }
.m4-back {
  display: inline-block;
  font-family: Rajdhani, sans-serif;
  font-weight: 700; font-size: .75rem;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--m4-gold); text-decoration: none;
  margin-bottom: 28px;
}
.m4-back:hover { color: var(--m4-gold-bright); }

.m4-badge-static {
  display: inline-block;
  background: var(--m4-gold); color: var(--m4-black);
  font-family: Rajdhani, sans-serif;
  font-weight: 700; font-size: .62rem;
  letter-spacing: .2em; text-transform: uppercase;
  padding: 4px 10px; margin-bottom: 14px;
}

.m4-article-title {
  font-family: Oswald, sans-serif;
  font-weight: 600;
  font-size: clamp(1.8rem, 3.4vw, 2.9rem);
  line-height: 1.15; letter-spacing: .02em;
  text-transform: uppercase; color: var(--m4-white);
  margin: 8px 0 36px;
}

.m4-article-hero { max-width: 1100px; margin: 0 auto 48px; padding: 0 48px; }
.m4-article-hero img { width: 100%; display: block; border-top: 2px solid var(--m4-gold); }

.m4-article-body p {
  font-family: Rajdhani, sans-serif;
  font-size: 1.08rem; font-weight: 400;
  line-height: 1.85; color: var(--m4-light-grey);
  margin-bottom: 22px;
}
.m4-article-body a { color: var(--m4-gold); }
.m4-article-body h2, .m4-article-body h3 {
  font-family: Oswald, sans-serif;
  text-transform: uppercase; letter-spacing: .04em;
  color: var(--m4-white); margin: 36px 0 14px;
}
.m4-article-body ul, .m4-article-body ol {
  color: var(--m4-light-grey);
  font-family: Rajdhani, sans-serif;
  line-height: 1.8; margin: 0 0 22px 20px;
}

/* ── pager ── */
.m4-pager {
  display: flex; justify-content: space-between; gap: 16px;
  margin-top: 56px; padding-top: 28px;
  border-top: 1px solid var(--m4-gold-dim);
}
.m4-pager-link {
  font-family: Rajdhani, sans-serif;
  font-weight: 700; font-size: .78rem;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--m4-gold); text-decoration: none;
}
.m4-pager-link:hover { color: var(--m4-gold-bright); }

@media (max-width: 768px) {
  .m4-subpage .m4n-section,
  .m4-subpage .m4-article { padding-top: 110px; }
  .m4-article-inner, .m4-article-hero { padding: 0 20px; }
  .m4-article-hero { margin-bottom: 32px; }
}

/* ── knockout logo spacing ──────────────────────────────────────────
   logo-m4-alt.png is a transparent knockout with no baked-in padding
   (the old logo-m4.png had a dark box that faked the separation), so
   the nav and footer need an explicit gap. */
.m4-nav { gap: 32px; }
.m4-nav-logo { flex: 0 0 auto; }
.m4-footer-inner { gap: 32px; }

/* ══════════════════════════════════════════════════════════════════
   CLIENT REVISIONS — round 1
   ══════════════════════════════════════════════════════════════════ */

/* ── Hero: never hide the headline on short laptop viewports ──────────
   Was: height:100vh + align-items:flex-end + padding-bottom:100px +
   overflow:hidden, under a 74px fixed nav. On any viewport shorter than
   ~780px the bottom-anchored content rode up under the nav and was
   clipped, with no way to scroll to it ("Contractor" cut off).
   Now the hero grows with its content and is anchored from the top. */
.m4-hero {
  display: flex;
  flex-direction: column;   /* content stacked above the stats bar */
  align-items: stretch;
  justify-content: flex-start;
  height: auto;
  min-height: 100vh;
  padding-top: 132px;       /* clears the 74px fixed nav */
  padding-bottom: 0;
}
.m4-hero .m4-hero-content { padding-top: 0; padding-bottom: 48px; }
/* stats stay a full-width bar pinned to the bottom of the hero */
.m4-hero .m4-hero-stats {
  margin-top: auto !important;
  align-self: stretch;
}

/* ── Capabilities: 5 placeholder cards, no body copy yet ──────────── */
.m4-service-cards-5 { grid-template-columns: repeat(3, 1fr); }
.m4-service-cards-5 .m4-service-card {
  min-height: 190px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  cursor: default;
}
.m4-service-cards-5 .m4-card-title { margin-bottom: 0; }

@media (max-width: 1024px) {
  .m4-service-cards-5 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .m4-service-cards-5 { grid-template-columns: 1fr; }
  .m4-service-cards-5 .m4-service-card { min-height: 0; padding: 32px 24px; }
  .m4-hero { padding-top: 96px; }
}

/* ── Leadership roster: 7 people, name + title only ────────────────── */
.m4-leaders-roster { grid-template-columns: repeat(3, 1fr); }
.m4-leaders-roster .m4-leader-card { padding: 32px 28px; }
.m4-leaders-roster .m4-leader-header { align-items: center; }
/* Dark disc behind every avatar (client's call). Note the portraits are
   cut-outs on a transparent background, shot against white, so the darker
   suits and shoulders blend into the disc — that is expected here.
   box-sizing is set explicitly because the stylesheet has no global
   border-box reset; without it the 1px ring made the photo circles 2px
   smaller than the monogram ones. */
.m4-leaders-roster .m4-headshot {
  width: 88px;
  height: 88px;
  flex: 0 0 88px;
  box-sizing: border-box;
  background: var(--m4-dark-light);
  border: 1px solid var(--m4-gold-dim);
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 42%;   /* keeps the face off the top of the circle */
}
.m4-leaders-roster .m4-leader-name { font-size: 1.35rem; margin-bottom: 4px; }
.m4-leaders-roster .m4-leader-role {
  font-family: Rajdhani, sans-serif;
  font-size: .82rem;
  line-height: 1.45;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--m4-gold);
}
.m4-leaders-roster .m4-rank-bar { margin-bottom: 10px; gap: 6px; }

/* placeholder monogram until a headshot is supplied */
.m4-headshot-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--m4-dark-light);
  font-family: Oswald, sans-serif;
  font-weight: 600;
  font-size: 1.55rem;
  letter-spacing: .04em;
  color: var(--m4-gold);
  user-select: none;
}

@media (max-width: 1024px) { .m4-leaders-roster { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 680px)  { .m4-leaders-roster { grid-template-columns: 1fr; } }

/* ── AS9100D badge links to the certificate PDF ───────────────────── */
.m4-cert-badge-link {
  text-decoration: none;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.m4-cert-badge-link::after {
  content: " ↗";
  font-size: .85em;
  opacity: .7;
}
.m4-cert-badge-link:hover {
  background: var(--m4-gold);
  border-color: var(--m4-gold);
  color: var(--m4-black);
}

/* ── Hero stats bar: solid black across its full width ───────────────
   Only the individual .m4-stat-item blocks carried a background, so the
   empty stretch to the right of the last stat was transparent and the
   hero grid and video showed through it. */
.m4-hero .m4-hero-stats { background: #000; }
.m4-hero .m4-stat-item  { background: #000; }

/* ── World map image ─────────────────────────────────────────────────
   .m4-map-image had no CSS rule at all, so the <img> collapsed to zero
   height. Being loading="lazy", a zero-height image never intersects the
   viewport, so the browser never fetched it — the map never appeared.
   aspect-ratio reserves the correct box (1800x710) before the file loads. */
.m4-map-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1800 / 710;
  object-fit: contain;
}

/* ── border-box reset ────────────────────────────────────────────────
   The original hand-built page had `*{box-sizing:border-box}`; it was lost
   when the CSS was ported into Elementor, and nothing in the production
   stylesheet declares box-sizing at all. Without it any element combining
   width:100% with padding overflows its parent — it clipped the hero copy
   on phones and made the leadership avatars mismatch. Measured impact of
   adding it back: worst overflow 40px -> 2px, total page height +5px. */
*, *::before, *::after { box-sizing: border-box; }

/* ── Anchor offset for the fixed nav ─────────────────────────────────
   The nav is position:fixed at 72px tall, so an in-page jump landed the
   target's first 72px underneath it. scroll-margin-top reserves that
   space (plus a little breathing room) when scrolling to an anchor. */
[id] { scroll-margin-top: 92px; }
@media (max-width: 768px) { [id] { scroll-margin-top: 80px; } }