*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

  /* ── SYSTEM FONT FALLBACKS — match web fonts closely ── */
  /* Used when Bebas Neue hasn't loaded yet */
  body {
    font-family: 'Barlow', system-ui, -apple-system, sans-serif;
  }
  .hero-headline, .section-title, .post-title,
  [style*="Bebas Neue"], .cap-title, .diff-title,
  .logo-primary, .stat-value {
    font-family: 'Bebas Neue', 'Arial Black', 'Impact', sans-serif;
  }
  nav, .nav-links, .breadcrumb, .section-label,
  .page-hero-label, .btn-primary, .btn-ghost,
  .field label, .cert-title, .equip-name {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  }:root {
  --black: #0d0f0d; --dark: #141614; --panel: #1a1d1a; --steel: #222522;
  --odg: #119474; --odg-bright: #17b08a; --odg-dim: #0a5a46;
  --white: #f0f2ec; --off-white: #d4d8cc; --gray-light: #b0b8a8;
  --gray-mid: #7a8270; --gray-border: #2a2e28;
  --nav-bg: rgba(13,15,13,0.96); --body-bg: #0d0f0d;
}
html.light {
  --black: #ffffff;
  --dark: #f5f6f3;
  --panel: #ffffff;
  --steel: #eef0eb;
  --odg: #119474;
  --odg-bright: #0a7a5e;
  --odg-dim: #d4efe8;
  --white: #111412;
  --off-white: #2a2e28;
  --gray-light: #3a3f3c;
  --gray-mid: #5a6258;
  --gray-border: #c8d0c4;
  --nav-bg: rgba(255,255,255,0.97);
  --body-bg: #f2f4ef;
}
html { scroll-behavior: smooth; }
body { background: var(--body-bg); color: var(--white); font-family: 'Barlow', sans-serif; font-weight: 300; overflow-x: hidden; transition: background 0.4s, color 0.4s; }

/* ── NAV ── */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; display: flex; align-items: center; justify-content: space-between; padding: 0 52px; height: 70px; background: var(--nav-bg); backdrop-filter: blur(14px); border-bottom: 1px solid var(--gray-border); transition: background 0.4s; }
html.light nav { box-shadow: 0 1px 12px rgba(0,0,0,0.07); }
.logo { display: flex; align-items: center; gap: 13px; text-decoration: none; }
.logo-mark { width: 40px; height: 40px; background: var(--odg); clip-path: polygon(0 0, 80% 0, 100% 20%, 100% 100%, 20% 100%, 0 80%); display: flex; align-items: center; justify-content: center; font-family: 'Bebas Neue', sans-serif; font-size: 14px; letter-spacing: 1px; color: white; flex-shrink: 0; }
.logo-primary { font-family: 'Bebas Neue', sans-serif; font-size: 26px; letter-spacing: 5px; color: var(--white); }
.logo-sub { font-family: 'Barlow Condensed', sans-serif; font-size: 9px; letter-spacing: 3px; color: var(--odg-bright); text-transform: uppercase; margin-top: 3px; }
html.light .logo-sub { color: var(--odg); }
.logo-text { display: flex; flex-direction: column; line-height: 1; }
.nav-links { display: flex; gap: 32px; list-style: none; align-items: center; }
.nav-links li { position: relative; }
.nav-links a { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--gray-light); text-decoration: none; transition: color 0.2s; }
.nav-links a:hover { color: var(--white); }
html.light .nav-links a { color: #3a3f3c; }
html.light .nav-links a:hover { color: #111412; }
.nav-cta { background: var(--odg) !important; color: white !important; padding: 9px 22px; clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%); }

/* ── DROPDOWNS ── */
.dropdown-menu { position: absolute; top: calc(100% + 1px); left: 0; background: rgba(10,12,10,0.98); backdrop-filter: blur(16px); border: 1px solid var(--gray-border); border-top: 2px solid var(--odg); min-width: 240px; z-index: 200; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 0.2s, transform 0.2s, visibility 0.2s; padding: 8px 0; }
html.light .dropdown-menu { background: #ffffff; border-color: #c8d0c4; box-shadow: 0 8px 24px rgba(0,0,0,0.12); }
.nav-links li:hover .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dropdown-menu a { display: flex; align-items: center; gap: 10px; padding: 10px 20px; font-family: 'Barlow Condensed', sans-serif; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--gray-light) !important; }
html.light .dropdown-menu a { color: #3a3f3c !important; }
.dropdown-menu a:hover { background: rgba(17,148,116,0.08); color: var(--white) !important; }
html.light .dropdown-menu a:hover { background: rgba(17,148,116,0.08); color: #111412 !important; }
.dropdown-menu a::before { content: ''; display: block; width: 4px; height: 4px; background: var(--odg); clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); flex-shrink: 0; }
.has-dropdown > a::after { content: '▾'; font-size: 9px; margin-left: 4px; color: var(--odg); }

/* ── MODE TOGGLE ── */
.mode-toggle { display: flex; align-items: center; gap: 8px; background: var(--panel); border: 1px solid var(--gray-border); padding: 7px 14px; cursor: pointer; font-family: 'Barlow Condensed', sans-serif; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--gray-light); transition: all 0.2s; flex-shrink: 0; }
.mode-toggle:hover { border-color: var(--odg); }
html.light .mode-toggle { color: #3a3f3c; border-color: #c8d0c4; }
.toggle-icon { font-size: 13px; }

/* ── PAGE HERO ── */
.page-hero { padding: 140px 52px 80px; border-bottom: 1px solid var(--gray-border); position: relative; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent, transparent 72px, rgba(255,255,255,0.015) 72px, rgba(255,255,255,0.015) 73px), repeating-linear-gradient(90deg, transparent, transparent 72px, rgba(255,255,255,0.015) 72px, rgba(255,255,255,0.015) 73px); }
html.light .page-hero { background: linear-gradient(135deg, #f2f4ef 0%, #e6f2ed 100%); }
.page-hero-label { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--odg-bright); margin-bottom: 14px; display: flex; align-items: center; gap: 12px; position: relative; }
.page-hero-label::before { content: ''; display: block; width: 22px; height: 1px; background: var(--odg-bright); }
html.light .page-hero-label { color: var(--odg); }
html.light .page-hero-label::before { background: var(--odg); }
.page-hero h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(52px, 7vw, 96px); line-height: 0.92; letter-spacing: 2px; color: var(--white); max-width: 800px; position: relative; }
html.light .page-hero h1 { color: #111412; }
.page-hero h1 span { color: var(--odg); }
.page-hero p { font-size: 15px; color: var(--gray-light); max-width: 560px; line-height: 1.75; margin-top: 24px; position: relative; }
html.light .page-hero p { color: #3a3f3c; }

/* ── BREADCRUMB ── */
.breadcrumb { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--gray-mid); margin-bottom: 24px; display: flex; align-items: center; gap: 8px; position: relative; }
.breadcrumb a { color: var(--odg); text-decoration: none; }
html.light .breadcrumb a { color: #0a7a5e; font-weight: 500; }
html.light .breadcrumb { color: #5a6258; }
.breadcrumb span { color: var(--gray-mid); }

/* ── SECTIONS ── */
.section { padding: 80px 52px; }
.section-alt { background: var(--panel); border-top: 1px solid var(--gray-border); border-bottom: 1px solid var(--gray-border); }
.section-label { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--odg-bright); margin-bottom: 14px; display: flex; align-items: center; gap: 12px; }
.section-label::before { content: ''; display: block; width: 22px; height: 1px; background: var(--odg-bright); }
html.light .section-label { color: var(--odg); }
html.light .section-label::before { background: var(--odg); }
.section-title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(38px, 4.5vw, 60px); letter-spacing: 2px; line-height: 1; color: var(--white); margin-bottom: 48px; }
html.light .section-title { color: #111412; }

/* ── CARDS ── */
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--gray-border); border: 1px solid var(--gray-border); }
.card { background: var(--panel); padding: 36px 32px; position: relative; overflow: hidden; transition: background 0.25s; text-decoration: none; display: block; }
html.light .card { background: #ffffff; box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.card::after { content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 0; background: var(--odg); transition: width 0.3s; }
.card:hover { background: var(--steel); }
html.light .card:hover { background: #f0f7f4; }
.card:hover::after { width: 100%; }
.card-num { font-family: 'Bebas Neue', sans-serif; font-size: 12px; letter-spacing: 3px; color: var(--odg-bright); margin-bottom: 16px; opacity: 0.7; }
html.light .card-num { color: var(--odg); opacity: 1; }
.card-title { font-family: 'Barlow Condensed', sans-serif; font-size: 20px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--white); margin-bottom: 10px; }
html.light .card-title { color: #111412; }
.card-desc { font-size: 13px; color: var(--gray-light); line-height: 1.7; }
html.light .card-desc { color: #3a3f3c; }
.card-arrow { position: absolute; bottom: 20px; right: 24px; font-family: 'Barlow Condensed', sans-serif; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--odg); opacity: 0; transition: opacity 0.2s; }
.card:hover .card-arrow { opacity: 1; }

/* ── TAGS ── */
.tag { font-family: 'Barlow Condensed', sans-serif; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gray-mid); background: rgba(255,255,255,0.03); border: 1px solid var(--gray-border); padding: 4px 9px; }
html.light .tag { color: #111412; background: rgba(17,148,116,0.06); border-color: #b0c8c0; }
.tag-row { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 16px; }

/* ── BUTTONS ── */
.btn-primary { background: var(--odg); color: white; padding: 14px 36px; font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; text-decoration: none; display: inline-block; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); transition: background 0.2s; }
.btn-primary:hover { background: var(--odg-bright); }
.btn-ghost { color: var(--gray-light); font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; text-decoration: none; border: 1px solid var(--gray-border); padding: 14px 24px; display: inline-flex; align-items: center; gap: 8px; transition: color 0.2s, border-color 0.2s; }
.btn-ghost:hover { color: var(--white); border-color: var(--gray-mid); }
html.light .btn-ghost { color: #3a3f3c; border-color: #a0aca8; }
html.light .btn-ghost:hover { color: #111412; border-color: #3a3f3c; }

/* ── SPEC TABLE ── */
.spec-table { width: 100%; border-collapse: collapse; }
.spec-table tr { border-bottom: 1px solid var(--gray-border); }
html.light .spec-table tr { border-bottom-color: #c8d0c4; }
.spec-table td { padding: 14px 16px; font-size: 13px; }
.spec-table td:first-child { font-family: 'Barlow Condensed', sans-serif; font-weight: 600; letter-spacing: 0.5px; color: var(--white); width: 40%; }
html.light .spec-table td:first-child { color: #111412; }
.spec-table td:last-child { color: var(--gray-light); }
html.light .spec-table td:last-child { color: #3a3f3c; }

/* ── FOOTER ── */
footer { padding: 48px 52px 0; border-top: 1px solid var(--gray-border); display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; }
.footer-bottom { margin-top: 40px; padding: 20px 52px; border-top: 1px solid var(--gray-border); display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p, .footer-ut { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 1px; color: var(--gray-mid); }
.footer-col-title { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--odg-bright); margin-bottom: 18px; }
.footer-links { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.footer-links a { font-size: 12px; color: var(--gray-mid); text-decoration: none; transition: color 0.2s; }
.footer-links a:hover { color: var(--white); }

/* Light mode footer — green background, white text */
html.light footer { background: var(--odg); border-top-color: #0d7a5e; }
html.light footer .logo-primary { color: #ffffff; }
html.light footer .logo-sub { color: rgba(255,255,255,0.6); }
html.light footer p { color: rgba(255,255,255,0.65); }
html.light .footer-col-title { color: rgba(255,255,255,0.5); }
html.light .footer-links a { color: rgba(255,255,255,0.7); }
html.light .footer-links a:hover { color: #ffffff; }
html.light .footer-bottom { background: #0a6e52; border-top-color: rgba(255,255,255,0.12); }
html.light .footer-bottom p, html.light .footer-ut { color: rgba(255,255,255,0.55); }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

/* ── Hide mobile elements on desktop by default ── */
.mobile-menu-btn { display: none; }
.mobile-nav {
  display: none;
  position: fixed; top: 60px; left: 0; right: 0; bottom: 0;
  background: rgba(10,12,10,0.98);
  backdrop-filter: blur(16px);
  z-index: 99; overflow-y: auto;
  padding: 24px 20px 40px;
  flex-direction: column; gap: 0;
}
.mobile-nav.open { display: flex; }
html.light .mobile-nav { background: rgba(255,255,255,0.98); }

/* ════════════════════════════════════════
   MOBILE RESPONSIVE — Tablet (≤1024px)
════════════════════════════════════════ */
@media (max-width: 1024px) {
  nav { padding: 0 28px; }
  .nav-links { gap: 20px; }
  .nav-links a { font-size: 11px; letter-spacing: 2px; }
  .section { padding: 64px 28px; }
  .page-hero { padding: 120px 28px 64px; }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  footer { padding: 48px 28px 0; grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-bottom { padding: 20px 28px; }
}

/* ════════════════════════════════════════
   MOBILE RESPONSIVE — Phone (≤768px)
════════════════════════════════════════ */


/* ════════════════════════════════════════
   MOBILE RESPONSIVE — Small Phone (≤480px)
════════════════════════════════════════ */
@media (max-width: 480px) {
  .page-hero { padding: 90px 16px 44px; }
  .page-hero h1 { font-size: clamp(42px, 13vw, 64px); }
  .section { padding: 44px 16px; }
  nav { padding: 0 16px; }
  footer { padding: 36px 16px 0; }
  .footer-bottom { padding: 14px 16px; }
  .btn-primary, .btn-ghost { width: 100%; text-align: center; justify-content: center; }
}

/* ── LIGHT MODE — GREEN BACKGROUND TEXT CONTRAST FIX ── */
html.light .card-desc { color: #1a1d18; font-weight: 400; }
html.light .card-title { color: #0a0d0a; font-weight: 700; }
html.light .card:hover .card-title { color: #0a0d0a; }
html.light .tag { color: #0a0d0a; font-weight: 500; }
/* Market cards hover state - green bg needs white text */
html.light .card:hover .card-desc { color: #1a1d18; }

/* ── PHONE NUMBER CALLOUT - NOT BLUE ── */
a[href^="tel:"] {
  color: var(--off-white) !important;
  text-decoration: none !important;
}
html.light a[href^="tel:"] {
  color: #1a1d18 !important;
  background: rgba(17,148,116,0.07);
  border: 1px solid #b0c8c0;
  padding: 4px 12px;
  display: inline-block;
}

/* ── BOLDER MOBILE TYPOGRAPHY ── */


/* ═══════════════════════════════════════════════
   MOBILE OVERHAUL — comprehensive fix
   ═══════════════════════════════════════════════ */

@media (max-width: 768px) {

  /* ── NAV ── */
  nav {
    padding: 0 16px;
    height: 58px;
  }
  .logo-mark { width: 34px; height: 34px; font-size: 13px; }
  .logo-primary { font-size: 15px; }
  .logo-sub { display: none; }
  .mode-toggle .toggle-label { display: none; }
  .mode-toggle { padding: 6px 10px; font-size: 13px; }

  /* ── HERO ── */
  .hero { padding: 90px 18px 52px; min-height: auto; }
  .hero-headline { font-size: clamp(44px, 13vw, 68px); line-height: 0.92; letter-spacing: 0; }
  .hero-sub { font-size: 13px; line-height: 1.7; max-width: 100%; margin-top: 14px; }
  .hero-actions { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 24px; }
  .btn-primary, .btn-ghost { width: 100%; text-align: center; justify-content: center; padding: 14px 20px; font-size: 11px; }
  .hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 36px; padding-top: 28px; }
  .stat { padding: 14px 12px; }
  .stat-value { font-size: 22px; }
  .stat-label { font-size: 8px; letter-spacing: 1.5px; }
  .hero-scroll-img { display: none; }
  .hero-itar { font-size: 8px; padding: 5px 10px; margin-bottom: 18px; }
  .hero-eyebrow { font-size: 10px; }

  /* ── MARQUEE ── */
  .marquee-item { font-size: 9px; padding: 0 14px; }
  .marquee-item::before { margin-right: 14px; }

  /* ── SECTIONS ── */
  .section, .section-alt { padding: 44px 18px; }
  .section-label { font-size: 9px; letter-spacing: 2.5px; margin-bottom: 10px; }
  .section-title { font-size: clamp(28px, 8vw, 44px); margin-bottom: 20px; line-height: 1.0; }

  /* ── CAPABILITIES GRID ── */
  .cap-grid { grid-template-columns: 1fr; gap: 1px; }
  .cap-card { padding: 24px 18px; }
  .cap-title { font-size: 18px; }
  .cap-desc { font-size: 13px; }
  .cap-icon { font-size: 22px; margin-bottom: 10px; }

  /* ── PERFORMANCE BANNER ── */
  .perf-banner {
    flex-direction: column;
    gap: 20px;
    padding: 24px 18px;
    margin: 0;
  }
  .perf-banner > div { width: 100%; }

  /* ── EQUIPMENT ── */
  .equip-layout { grid-template-columns: 1fr; gap: 32px; }
  .equip-stats { grid-template-columns: repeat(2,1fr); gap: 1px; }
  .equip-stat-cell { padding: 14px 12px; }
  .equip-stat-val { font-size: 20px; }
  .equip-category-title { font-size: 11px; }
  .equip-cell { padding: 14px 16px; }
  .equip-name { font-size: 13px; }
  .equip-spec { font-size: 11px; }
  .size-row { padding: 16px; gap: 12px; flex-wrap: wrap; }
  .size-label { font-size: 11px; }
  .size-val { font-size: 18px; }
  .size-unit { font-size: 9px; }

  /* ── DOWNLOAD BUTTON IN EQUIPMENT ── */
  #equipment > div:first-child { flex-direction: column; align-items: flex-start; gap: 12px; }

  /* ── MATERIALS GRID ── */
  .mat-grid { grid-template-columns: 1fr 1fr; gap: 1px; }
  .mat-cell { padding: 14px 12px; }
  .mat-name { font-size: 12px; }
  .mat-grade { font-size: 10px; }

  /* ── MARKETS / SPLIT LAYOUT ── */
  .split-layout { grid-template-columns: 1fr; gap: 32px; }
  .market-item-header { font-size: 13px; padding: 14px 16px; }
  .market-sub { padding: 12px 16px; }
  .sub-tag { font-size: 9px; padding: 3px 8px; }

  /* ── DIFFERENTIATORS ── */
  .diff-grid { grid-template-columns: 1fr; gap: 1px; }
  .diff-item { padding: 22px 18px; }
  .diff-title { font-size: 14px; }
  .diff-desc { font-size: 12px; }

  /* ── AFFILIATE BANNER ── */
  
  
  
  .affiliate-services {
    border-left: none;
    padding-left: 0;
    border-top: 1px solid rgba(255,255,255,0.15);
    padding-top: 0;
    grid-template-columns: 1fr !important;
  }

  /* ── IDs BAR ── */
  .ids-bar { padding: 20px 18px; }
  .ids-group { flex-direction: column; gap: 16px; }
  .id-block { min-width: unset; width: 100%; }
  .id-val { font-size: 13px; }
  .id-key { font-size: 8px; }

  /* ── CERTS SECTION ── */
  .certs-panel { padding: 24px 18px; }
  .cert-row { padding: 14px 0; gap: 12px; }
  .cert-title { font-size: 12px; }
  .cert-sub { font-size: 10px; }

  /* ── TRUST SIGNALS ── */
  .trust-grid, [style*="grid-template-columns:repeat(4"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 1px !important;
  }

  /* ── GALLERY ── */
  .gallery-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 3px;
  }
  .gallery-item-wide { grid-column: span 1; }
  .gallery-item-tall { grid-row: span 1; }
  .gallery-item img { height: 160px; }

  /* ── RFQ ── */
  .rfq-layout { grid-template-columns: 1fr; gap: 32px; }
  .rfq-info h2 { font-size: 36px; }
  .rfq-info p { font-size: 13px; }
  .contact-row { font-size: 13px; padding: 12px 0; }
  .form-row { grid-template-columns: 1fr !important; }
  .field label { font-size: 9px; }
  .field input, .field select, .field textarea { font-size: 13px; padding: 10px 12px; }

  /* ── MAP ── */
  .map-wrap { grid-template-columns: 1fr; }
  .map-info { padding: 24px 18px; }
  .map-frame { height: 260px; }

  /* ── FOOTER ── */
  footer { grid-template-columns: 1fr 1fr; gap: 28px; padding: 36px 18px 0; }
  .footer-col-title { font-size: 9px; }
  .footer-links li { font-size: 12px; }
  .footer-bottom { padding: 14px 18px; flex-direction: column; gap: 6px; text-align: center; font-size: 10px; }

  /* ── EMAIL POPUP ── */
  #emailPopup { width: calc(100vw - 32px); right: 16px; bottom: -320px; }

  /* ── BLOG CARDS ── */
  .blog-grid { grid-template-columns: 1fr; }
  .blog-card { flex-direction: column; }
  .blog-featured { flex-direction: column; }

}

/* ── VERY SMALL SCREENS ── */
@media (max-width: 390px) {
  .hero-headline { font-size: 38px; }
  .hero-stats { grid-template-columns: 1fr 1fr; }
  .stat-value { font-size: 20px; }
  .mat-grid { grid-template-columns: 1fr; }
  .diff-grid { grid-template-columns: 1fr; }
  footer { grid-template-columns: 1fr; }
}


/* ═══════════════════════════════════════════════
   LIGHT MODE — comprehensive fix
   All green-on-green eliminated
   ═══════════════════════════════════════════════ */

/* ── NAV light mode ── */
html.light nav { background: #ffffff; border-bottom: 1px solid #dde5d8; }
html.light .nav-links a { color: #1a2418; font-weight: 500; }
html.light .nav-links a:hover { color: #0d7a5e; }
html.light .nav-cta { background: var(--odg) !important; color: white !important; }
html.light .logo-primary { color: #0a0d0a; }
html.light .logo-sub { color: #4a5245; }
html.light .mode-toggle { background: #f0f4ee; border-color: #c8d0c4; color: #1a2418; }

/* ── DROPDOWN light mode ── */
html.light .dropdown-menu { background: #ffffff; border: 1px solid #dde5d8; border-top: 2px solid var(--odg); }
html.light .dropdown-menu a { color: #1a2418 !important; font-weight: 500; }
html.light .dropdown-menu a:hover { background: #f0f7f4; color: #0d7a5e !important; }

/* ── MOBILE NAV light mode ── */
html.light .mobile-nav { background: #ffffff; border-bottom: 1px solid #dde5d8; }
html.light .mobile-nav-link { color: #1a2418; font-weight: 600; }
html.light .mobile-nav-sub { background: #f5f8f4; border-left: 2px solid var(--odg); }
html.light .mobile-nav-sub a { color: #1a2418 !important; font-weight: 500; }
html.light .mobile-nav-cta { background: var(--odg); color: white; }

/* ── HERO light mode ── */
html.light .hero { background: linear-gradient(135deg, #eef2eb 0%, #e4f0eb 100%); }
html.light .hero-headline { color: #080b08; }
html.light .hero-sub { color: #1e2a1e; }
html.light .hero-itar { background: rgba(17,148,116,0.08); border-color: rgba(17,148,116,0.3); color: #0a5e46; }
html.light .stat { background: rgba(255,255,255,0.7); border: 1px solid #dde5d8; }
html.light .stat-value { color: #0a0d0a; }
html.light .stat-label { color: #4a5245; }

/* ── MARQUEE light mode ── */
html.light .marquee-track { background: #1a2418; }
html.light .marquee-item { color: rgba(255,255,255,0.85) !important; }
html.light .marquee-item::before { background: rgba(255,255,255,0.3); }

/* ── SECTION labels light mode ── */
html.light .section-label { color: #0a5e46; font-weight: 600; }
html.light .section-title { color: #080b08; }
html.light .section { background: #f8faf6; }
html.light .section-alt { background: #eef4ef !important; }
html.light .section-alt .section-title { color: #080b08 !important; }
html.light .section-alt .section-label { color: #0a5e46 !important; }
html.light .section-alt p { color: #1a2418 !important; }

/* ── CAPABILITY CARDS light mode ── */
html.light .cap-card { background: #ffffff; border-color: #dde5d8; }
html.light .cap-card:hover { background: #f0f7f4; border-color: var(--odg); }
html.light .cap-title { color: #080b08; }
html.light .cap-desc { color: #2a3228 !important; }

/* ── PERFORMANCE BANNER light mode ── */
html.light .perf-banner { background: #1a2418; border-color: #1a2418; }
html.light .perf-banner * { color: rgba(255,255,255,0.9) !important; }
html.light .perf-item-name { color: #ffffff !important; font-weight: 600; }
html.light .perf-item-sub { color: rgba(255,255,255,0.65) !important; }

/* ── EQUIPMENT light mode ── */
html.light .section-alt .equip-cell { background: #ffffff !important; border: 1px solid #dde5d8; }
html.light .section-alt .equip-cell:hover { background: #f0f7f4 !important; }
html.light .section-alt .equip-name { color: #080b08 !important; font-weight: 700; }
html.light .section-alt .equip-spec { color: #2a3228 !important; }
html.light .section-alt .equip-category-title { color: #4a5245 !important; border-color: #dde5d8 !important; }
html.light .section-alt .equip-stat-cell { background: rgba(255,255,255,0.8) !important; border: 1px solid #dde5d8; }
html.light .section-alt .equip-stat-val { color: #080b08 !important; }
html.light .section-alt .equip-stat-label { color: #4a5245 !important; }
html.light .section-alt .section-title { color: #080b08 !important; }
html.light .section-alt .section-label { color: #0a5e46 !important; }

/* ── MATERIALS GRID light mode ── */
html.light .mat-cell { background: #ffffff; border: 1px solid #dde5d8; }
html.light .mat-cell:hover { background: #f0f7f4; border-color: var(--odg); }
html.light .mat-name { color: #080b08 !important; }
html.light .mat-grade { color: #2a3228 !important; }
html.light .mat-flag { color: var(--odg); }

/* ── MARKETS / SPLIT LAYOUT light mode ── */
html.light .market-item-header { color: #080b08; font-weight: 600; }
html.light .market-item:hover .market-item-header { background: #f0f7f4; color: #0a5e46; }
html.light .market-sub { background: #f5f8f4; }
html.light .sub-tag { background: rgba(17,148,116,0.08); color: #0a5e46; border-color: rgba(17,148,116,0.2); }
html.light .mdot { background: var(--odg); }

/* ── CERTS light mode ── */
html.light .certs-panel { background: #ffffff; border: 1px solid #dde5d8; }
html.light .cert-row { border-bottom-color: #dde5d8; }
html.light .cert-icon { background: rgba(17,148,116,0.08); }
html.light .cert-title { color: #080b08; font-weight: 700; }
html.light .cert-sub { color: #2a3228; }
html.light .cert-pdf-link { color: var(--odg) !important; border-color: var(--odg); }

/* ── DIFFERENTIATORS light mode ── */
html.light .diff-item { background: #ffffff; border: 1px solid #dde5d8; }
html.light .diff-item:hover { background: #f0f7f4; border-color: var(--odg); }
html.light .diff-icon { background: rgba(17,148,116,0.08); border-color: rgba(17,148,116,0.2); }
html.light .diff-title { color: #080b08 !important; font-weight: 700; }
html.light .diff-desc { color: #2a3228 !important; }

/* ── AFFILIATE BANNER light mode ── */
html.light .affiliate-banner { background: #1a2418 !important; border-color: #1a2418; }
html.light .affiliate-banner * { color: rgba(255,255,255,0.88); }
html.light .affiliate-banner h3 { color: #ffffff !important; }
html.light .affiliate-banner p { color: rgba(255,255,255,0.8) !important; }
html.light .affiliate-banner a[href*="unitedtech"] { background: white; color: var(--odg); }
html.light .affiliate-services > div { background: rgba(0,0,0,0.2) !important; }

/* ── IDs BAR light mode ── */
html.light .ids-bar { background: #f0f4ee; border-color: #dde5d8; }
html.light .id-val { color: #080b08 !important; font-weight: 700; }
html.light .id-key { color: #4a5245 !important; }
html.light .ids-bar-label { color: var(--odg); font-weight: 600; }

/* ── RFQ light mode — override section-alt green ── */
html.light section#rfq,
html.light .section-alt#rfq { background: #1a2e24 !important; }
html.light #rfq .section-label { color: rgba(255,255,255,0.6) !important; }
html.light #rfq .section-title { color: #ffffff !important; }
html.light #rfq .rfq-info p { color: rgba(255,255,255,0.85) !important; font-weight: 400; }
html.light #rfq .contact-row { color: rgba(255,255,255,0.9) !important; border-bottom-color: rgba(255,255,255,0.12) !important; font-weight: 500; }
html.light #rfq .field label { color: rgba(255,255,255,0.75) !important; font-weight: 700 !important; }
html.light #rfq .field input,
html.light #rfq .field select,
html.light #rfq .field textarea { background: rgba(255,255,255,0.1) !important; border-color: rgba(255,255,255,0.25) !important; color: #ffffff !important; }
html.light #rfq .field input::placeholder,
html.light #rfq .field textarea::placeholder { color: rgba(255,255,255,0.4) !important; }
html.light #rfq .field select option { color: #1a1d18; background: #ffffff; }
html.light #rfq button[type="submit"] { background: var(--odg); color: white; }

/* ── GALLERY light mode ── */
html.light .gallery-item { background: #dde5d8; }

/* ── MAP light mode ── */
html.light .map-info { background: #ffffff; border: 1px solid #dde5d8; }
html.light .map-info h3 { color: #080b08; }
html.light .map-info p { color: #2a3228; }

/* ── FOOTER light mode ── */
html.light footer { background: #1a2418 !important; border-color: #253020; }
html.light footer * { color: rgba(255,255,255,0.85); }
html.light .footer-col-title { color: rgba(255,255,255,0.5) !important; }
html.light .footer-links a { color: rgba(255,255,255,0.8) !important; }
html.light .footer-links a:hover { color: #ffffff !important; }
html.light .footer-bottom { background: #111810; }
html.light .footer-bottom p { color: rgba(255,255,255,0.5); }

/* ── TRUST SECTION light mode ── */
html.light .trust-section { background: #ffffff; }
html.light .trust-section > div > div { background: #ffffff !important; border: 1px solid #dde5d8; }
html.light .trust-section > div > div:hover { background: #f0f7f4 !important; }
html.light .trust-section [style*="color:var(--white)"] { color: #080b08 !important; }
html.light .trust-section [style*="color:var(--gray-light)"] { color: #2a3228 !important; }

/* ── BLOG cards light mode ── */
html.light .blog-card { background: #ffffff; border-color: #dde5d8; }
html.light .blog-card:hover { background: #f5f8f4; border-color: var(--odg); }
html.light .blog-title { color: #080b08; font-weight: 700; }
html.light .blog-excerpt { color: #2a3228; }
html.light .blog-date { color: #6a7265; }
html.light .blog-category { color: var(--odg); background: rgba(17,148,116,0.08); }
html.light .blog-read-more { color: var(--odg); }

/* ── PAGE HERO on sub-pages light mode ── */
html.light .page-hero { background: linear-gradient(135deg, #eef2eb 0%, #e2ede7 100%); }
html.light .page-hero h1 { color: #080b08; }
html.light .page-hero h1 span { color: var(--odg); }
html.light .page-hero p { color: #2a3228; }
html.light .breadcrumb { color: #4a5245; }
html.light .breadcrumb a { color: var(--odg); font-weight: 600; }
html.light .page-hero-label { color: #0a5e46; }

/* ── CAPABILITY detail pages light mode ── */
html.light .spec-table { border-color: #dde5d8; }
html.light .spec-table tr { border-bottom-color: #dde5d8; }
html.light .spec-table td:first-child { color: #080b08; font-weight: 700; background: #f5f8f4; }
html.light .spec-table td:last-child { color: #2a3228; }
html.light .highlight-stat { background: #ffffff; border: 1px solid #dde5d8; }
html.light .highlight-val { color: #080b08; font-weight: 700; }
html.light .highlight-lbl { color: #4a5245; }

/* ── MARKET detail pages light mode ── */
html.light .mil-spec-cell { background: #ffffff !important; border-bottom: 1px solid #dde5d8; }
html.light .mil-spec-cell:hover { background: #f0f7f4 !important; }
html.light .mil-spec-cell div:first-child { color: #0a5e46; }
html.light .mil-spec-cell p { color: #2a3228; }

/* ── TAGS light mode ── */
html.light .tag { background: rgba(17,148,116,0.07); color: #0a5e46; border-color: rgba(17,148,116,0.2); font-weight: 600; }

/* ── SECTION-ALT used outside RFQ ── */
html.light .section-alt:not(#rfq) { background: #eef4ef !important; }
html.light .section-alt:not(#rfq) .section-title { color: #080b08 !important; }
html.light .section-alt:not(#rfq) .section-label { color: #0a5e46 !important; }
html.light .section-alt:not(#rfq) p { color: #1a2418 !important; }


/* ── BLUEPRINT HERO — text always white regardless of mode ── */
.blueprint-hero .breadcrumb,
.blueprint-hero .breadcrumb a,
.blueprint-hero .page-hero-label,
.blueprint-hero h1,
.blueprint-hero h1 span,
.blueprint-hero p {
  color: #ffffff !important;
}
.blueprint-hero .breadcrumb a:hover { color: rgba(255,255,255,0.75) !important; }
html.light .blueprint-hero .breadcrumb { color: rgba(255,255,255,0.7) !important; }
html.light .blueprint-hero .breadcrumb a { color: rgba(255,255,255,0.7) !important; }
html.light .blueprint-hero .page-hero-label { color: rgba(255,255,255,0.65) !important; }
html.light .blueprint-hero h1 { color: #ffffff !important; }
html.light .blueprint-hero h1 span { color: #7effd8 !important; }
html.light .blueprint-hero p { color: rgba(255,255,255,0.88) !important; }
html.light .blueprint-hero .tag { background: rgba(255,255,255,0.15) !important; color: #ffffff !important; border-color: rgba(255,255,255,0.3) !important; }

/* ══ MOBILE OVERFLOW FIXES ══ */
@media (max-width: 768px) {
  html, body { max-width: 100vw; overflow-x: hidden; }

  /* Affiliate banner — remove min-width that causes overflow */
  
  

  /* Hero glow — hide on mobile, causes overflow */
  .hero-glow { display: none; }

  /* Hero SVG accent — contained */
  .hero > div[style*="position:absolute"][style*="width:50%"] { display: none; }

  /* Sections — ensure no horizontal scroll */
  .section, .section-alt { padding-left: 18px !important; padding-right: 18px !important; overflow-x: hidden; }

  /* Performance banner — constrain */
  .perf-banner { margin: 0 !important; overflow-x: hidden; }
  .perf-clients { gap: 20px !important; }
  .perf-client { font-size: 18px !important; }

  /* IDs bar — constrain */
  .ids-bar { padding: 16px 18px !important; overflow-x: hidden; }
  .ids-group { gap: 16px !important; flex-wrap: wrap !important; }

  /* Map section — constrain */
  .map-section { padding: 0 18px 60px !important; overflow-x: hidden; }

  /* Gallery section — constrain */
  .gallery-section { padding: 0 18px 60px !important; overflow-x: hidden; }

  /* RFQ section — constrain */
  .rfq-layout > div { min-width: 0 !important; }

  /* Equipment section */
  .equip-layout > div { min-width: 0 !important; }
  .equip-cell { word-break: break-word; }

  /* Cap cards */
  .cap-grid { overflow-x: hidden; }
  .cap-card { min-width: 0 !important; }

  /* Stat values — allow wrapping */
  .stat-value { font-size: 22px !important; word-break: break-word; }
  .hero-stats { gap: 16px !important; flex-wrap: wrap !important; }

  /* Trust section 4-col → 2-col on mobile */
  .trust-section > div > div,
  [style*="grid-template-columns:repeat(4"] { 
    grid-template-columns: 1fr 1fr !important; 
  }

  /* Email popup — full width safe */
  #emailPopup { 
    width: calc(100vw - 32px) !important; 
    right: 16px !important; 
    left: 16px !important;
  }

  /* Remove any fixed widths on inline elements */
  [style*="max-width: 560px"],
  [style*="max-width: 520px"],
  [style*="max-width: 480px"],
  [style*="max-width: 460px"] { max-width: 100% !important; }

  /* Affiliate services grid — single column */
  .affiliate-services { 
    grid-template-columns: 1fr !important; 
    display: flex !important;
    flex-direction: column !important;
  }

  /* Blog grid */
  .blog-grid { grid-template-columns: 1fr !important; }
  .blog-featured { grid-template-columns: 1fr !important; flex-direction: column !important; }

  /* Tables */
  .spec-table { width: 100%; table-layout: fixed; }
  .spec-table td { word-break: break-word; font-size: 11px; }

  /* Market detail pages */
  .mil-specs-grid { grid-template-columns: 1fr !important; }
  .capability-split { grid-template-columns: 1fr !important; }
  .cap-detail-grid { grid-template-columns: 1fr !important; }
  .photo-strip { grid-template-columns: 1fr !important; }
  .lockup-row { flex-direction: column !important; }

  /* Blueprint hero */
  .blueprint-hero { padding: 100px 18px 48px !important; }
}

@media (max-width: 480px) {
  nav { padding: 0 12px; }
  .hero { padding: 80px 14px 44px !important; }
  .section, .section-alt { padding-left: 14px !important; padding-right: 14px !important; }
  .stat-value { font-size: 19px !important; }
  .hero-headline { font-size: clamp(36px, 12vw, 56px) !important; }
  .affiliate-banner { padding: 24px 14px !important; }
  .ids-bar { padding: 14px !important; }
}



  .affiliate-banner > div {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .affiliate-banner h3 { font-size: 32px !important; }
  .affiliate-banner p { max-width: 100% !important; font-size: 12px !important; }
  .affiliate-services {
    width: 100% !important;
    min-width: 0 !important;
  }
  .affiliate-services > div {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .affiliate-banner a[href*="unitedtech"] {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    display: flex !important;
  }
}

/* ══ AFFILIATE BANNER ══ */
.affiliate-banner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 48px;
  align-items: flex-start;
}
.affiliate-banner > div:first-child { flex: 1; min-width: 0; }
.affiliate-banner .affiliate-services { flex: 1.2; min-width: 0; }

@media (max-width: 900px) {
  .affiliate-banner {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    gap: 28px !important;
    padding: 28px 18px !important;
    margin: 0 !important;
  }
  .affiliate-banner > div:first-child,
  .affiliate-banner .affiliate-services {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .affiliate-banner h3 { font-size: 30px !important; }
  .affiliate-banner p { max-width: 100% !important; }
  .affiliate-banner a[href*="unitedtech"] {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* 2026 J&S final-revision global updates */
.brand-logo-img{display:block;width:auto;height:54px;max-width:330px;object-fit:contain}.footer-brand-logo{height:auto;max-width:260px;width:100%}@media(max-width:900px){.brand-logo-img{height:44px;max-width:220px}}
html.light body{background:#eef1ed}html.light .section-alt{background:#e2e8e3}html.light .card,html.light .cap-card,html.light .equip-cell,html.light .mat-cell,html.light .diff-item,html.light .rfq-form{background:#fff;border-color:#bcc8c0}html.light .page-hero{background:#f8faf8}html.light nav{background:#111814}
.rfq-success{display:none;padding:32px;border:1px solid rgba(17,148,116,.45);background:rgba(17,148,116,.09);text-align:center}.rfq-success.show{display:block}.rfq-success h3{font-family:'Bebas Neue',sans-serif;font-size:34px;letter-spacing:1px;color:var(--white);margin-bottom:8px}html.light .rfq-success h3{color:#101713}.rfq-success p{color:var(--gray-light)}html.light .rfq-success p{color:#27322c}
.blog-share{display:flex;gap:10px;flex-wrap:wrap;margin:32px 0}.blog-share a,.blog-share button{border:1px solid var(--gray-border);background:var(--panel);color:var(--off-white);padding:10px 14px;font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;text-decoration:none;cursor:pointer}html.light .blog-share a,html.light .blog-share button{background:#fff;color:#172019;border-color:#b8c5bc}


/* === 2026 REV 2 OVERRIDES === */
.brand-logo-img{height:46px!important;max-width:285px!important;width:auto!important;object-fit:contain!important}
.brand-logo-light{display:none!important}
html.light .brand-logo-dark{display:none!important}
html.light .brand-logo-light{display:block!important}
nav{background:rgba(13,15,13,.97)!important}
html.light nav{background:#ffffff!important;border-bottom-color:#cfd5cf!important;box-shadow:0 2px 14px rgba(0,0,0,.09)!important}
html.light .nav-links a{color:#202622!important}
html.light .nav-links a:hover{color:#087056!important}
html.light .mode-toggle{background:#f5f7f4!important;color:#202622!important}
html.light body{background:#f4f5f2!important}
html.light .section-alt{background:#ecefeb!important}
html.light .card,html.light .cap-card,html.light .diff-card,html.light .equip-cell,html.light .mat-cell{background:#ffffff!important;border-color:#d6dcd5!important;box-shadow:0 3px 14px rgba(15,25,18,.06)!important}
html.light .card:hover,html.light .cap-card:hover,html.light .diff-card:hover,html.light .equip-cell:hover,html.light .mat-cell:hover{background:#f7f9f7!important}
html.light .section-title,html.light .card-title,html.light .cap-title,html.light .diff-title,html.light .equip-name,html.light .mat-name{color:#172019!important}
html.light .section-label,html.light .card-num,html.light .cap-num{color:#0a7057!important}
html.light .card-desc,html.light .cap-desc,html.light .diff-desc,html.light .equip-spec,html.light .mat-note{color:#303a33!important}
html.light .tag{background:#f0f3f0!important;color:#243028!important;border-color:#cbd3cc!important}
html.light .perf-banner,html.light .ids-bar,html.light .affiliate-banner{background:#ffffff!important;color:#172019!important;border-color:#d1d8d1!important;box-shadow:0 3px 14px rgba(15,25,18,.06)!important}
html.light .perf-banner p,html.light .perf-banner span,html.light .ids-bar-label,html.light .id-key,html.light .id-val{color:#172019!important;background:transparent!important}
html.light .certs-panel{background:#ffffff!important;border-color:#d1d8d1!important}
html.light .certs-header{color:#425047!important;border-bottom-color:#d1d8d1!important}
html.light .cert-row{border-bottom-color:#e1e5e1!important}
html.light .cert-row:hover{background:#f4f7f4!important}
html.light .cert-icon{background:#eef2ef!important;border-color:#ccd5ce!important}
html.light .cert-title{color:#172019!important}
html.light .cert-sub{color:#4a554d!important}
html.light .market-item{color:#172019!important;background:#ffffff!important;border-color:#d8ddd8!important}
html.light .market-item-header{color:#172019!important;border-bottom-color:#e0e5e0!important}
html.light .market-item:hover .market-item-header{background:#edf3ef!important}
html.light .market-sub{background:#f5f7f5!important;color:#172019!important}
.cert-pdf-link{display:inline-flex!important;align-items:center!important;gap:7px!important;padding:9px 14px!important;background:var(--odg)!important;color:#fff!important;border:1px solid var(--odg)!important;text-decoration:none!important;font-family:'Barlow Condensed',sans-serif!important;font-size:10px!important;letter-spacing:1.8px!important;text-transform:uppercase!important;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)!important}
.cert-pdf-link:hover{background:var(--odg-bright)!important;color:#fff!important}
.gallery-item{cursor:pointer}
.gallery-lightbox{position:fixed;inset:0;background:rgba(4,8,6,.94);z-index:9999;display:none;align-items:center;justify-content:center;padding:40px}
.gallery-lightbox.open{display:flex}
.gallery-lightbox img{max-width:min(92vw,1500px);max-height:82vh;object-fit:contain;box-shadow:0 18px 60px rgba(0,0,0,.5)}
.gallery-lightbox-caption{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:#fff;font-family:'Barlow Condensed',sans-serif;letter-spacing:1.6px;text-transform:uppercase;text-align:center;max-width:80vw}
.gallery-lightbox-close,.gallery-lightbox-prev,.gallery-lightbox-next{position:absolute;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.35);color:#fff;cursor:pointer;font-size:30px;line-height:1;width:52px;height:52px;display:flex;align-items:center;justify-content:center}
.gallery-lightbox-close{top:18px;right:18px}.gallery-lightbox-prev{left:18px;top:50%;transform:translateY(-50%)}.gallery-lightbox-next{right:18px;top:50%;transform:translateY(-50%)}
@media(max-width:900px){.brand-logo-img{height:38px!important;max-width:205px!important}.gallery-lightbox{padding:18px}.gallery-lightbox-prev,.gallery-lightbox-next{width:42px;height:42px;font-size:24px}.gallery-lightbox-prev{left:6px}.gallery-lightbox-next{right:6px}}


/* === 2026 REV 3 CORRECTIONS === */
.logo{min-width:280px!important;gap:12px!important;overflow:visible!important}.brand-crest{display:block!important;width:58px!important;height:58px!important;object-fit:contain!important;flex:0 0 58px!important}.brand-copy{display:flex!important;flex-direction:column!important;line-height:.92!important;white-space:nowrap!important}.brand-name{font-family:'Bebas Neue',sans-serif!important;font-size:31px!important;letter-spacing:2.2px!important;color:#fff!important}.brand-tagline{font-family:'Barlow Condensed',sans-serif!important;font-size:9px!important;letter-spacing:2.2px!important;text-transform:uppercase!important;color:var(--odg-bright)!important;margin-top:5px!important}html.light .brand-name{color:#111814!important}html.light .brand-tagline{color:#087056!important}
@media(max-width:1180px){.logo{min-width:205px!important}.brand-crest{width:48px!important;height:48px!important;flex-basis:48px!important}.brand-name{font-size:25px!important}.brand-tagline{font-size:8px!important}.nav-links{gap:20px!important}}@media(max-width:900px){.logo{min-width:0!important}.brand-crest{width:50px!important;height:50px!important;flex-basis:50px!important}.brand-copy{display:none!important}}
/* Neutral light mode: green is an accent, not the background. */
html.light body{background:#f3f4f1!important;color:#1c231f!important}html.light .section,html.light section.section{background:#f7f8f5!important}html.light .section-alt,html.light section.section-alt,html.light #equipment{background:#e9ece8!important;color:#1c231f!important}html.light #equipment .section-title,html.light #equipment .section-label,html.light #equipment p{color:#1c231f!important}html.light #equipment .equip-highlight{background:#fff!important;border-left-color:#087056!important}html.light #equipment .equip-highlight p{color:#27302b!important}html.light #equipment .equip-category-title{color:#4d5751!important;border-color:#cbd1cc!important}html.light #equipment .equip-list{background:#cfd5d0!important}html.light #equipment .equip-cell{background:#fff!important;border-color:#cfd5d0!important}html.light #equipment .equip-cell:hover{background:#f5f7f4!important}html.light #equipment .equip-name{color:#111713!important}html.light #equipment .equip-spec{color:#354039!important}html.light #equipment .equip-stats{background:#cfd5d0!important}html.light #equipment .equip-stat-cell{background:#fff!important;border:0!important}html.light #equipment .equip-stat-val{color:#111713!important}html.light #equipment .equip-stat-label{color:#4a554e!important}
html.light .perf-banner{background:#202822!important;border-color:#202822!important}html.light .perf-banner h3,html.light .perf-banner p,html.light .perf-banner span,html.light .perf-banner div{background:transparent!important;color:#fff!important}html.light .hero-stats{background:#ecefeb!important;border-color:#ccd2cd!important}html.light .stat{background:transparent!important;border:0!important}html.light .stat-value{color:#111713!important}html.light .stat-label{color:#465149!important}
html.light .ids-bar{background:#e6e9e5!important}html.light .ids-bar *{background:transparent!important;color:#1c231f!important}
html.light .cap-grid,html.light .equip-layout,html.light .split-layout{background:transparent!important}html.light .cap-card,html.light .mat-cell,html.light .diff-item,html.light .market-item,html.light .certs-panel{background:#fff!important;border-color:#d0d5d1!important}
/* Home gallery preview */
.gallery-preview-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}.gallery-preview-heading .section-title{margin-bottom:0}.gallery-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.gallery-preview-item{position:relative;display:block;overflow:hidden;height:250px;border:1px solid var(--gray-border);text-decoration:none}.gallery-preview-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s,filter .25s}.gallery-preview-item:hover img{transform:scale(1.035);filter:brightness(.72)}.gallery-preview-item span{position:absolute;left:0;right:0;bottom:0;padding:38px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.88));color:#fff;font-family:'Barlow Condensed',sans-serif;font-size:11px;letter-spacing:1.7px;text-transform:uppercase}.gallery-view-all{white-space:nowrap}@media(max-width:900px){.gallery-preview-grid{grid-template-columns:1fr 1fr}.gallery-preview-heading{align-items:flex-start;flex-direction:column}.gallery-preview-item{height:200px}}@media(max-width:560px){.gallery-preview-grid{grid-template-columns:1fr}}
/* Branded CTAs override old inline white boxes. */
section[style*="background:var(--odg)"]>a[href*="#rfq"],section[style*="background: var(--odg)"]>a[href*="#rfq"]{background:#0b1712!important;color:#fff!important;border:1px solid rgba(255,255,255,.35)!important;padding:16px 34px!important;text-decoration:none!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.btn-primary,.nav-cta{background:var(--odg)!important;color:#fff!important;text-decoration:none!important}.btn-primary:hover,.nav-cta:hover{background:#0b765b!important;color:#fff!important}

/* === REV 3.1 HEADER LOGO HOTFIX === */
nav .site-brand{display:flex!important;align-items:center!important;flex:0 0 auto!important;width:290px!important;min-width:290px!important;height:70px!important;overflow:hidden!important;line-height:0!important}
nav .site-brand-logo{display:block!important;width:100%!important;max-width:290px!important;height:54px!important;max-height:54px!important;object-fit:contain!important;object-position:left center!important;position:static!important;transform:none!important;margin:0!important;padding:0!important}
nav .site-brand-logo-light{display:none!important}
html.light nav .site-brand-logo-dark{display:none!important}
html.light nav .site-brand-logo-light{display:block!important}
@media(max-width:1240px){nav .site-brand{width:225px!important;min-width:225px!important}nav .site-brand-logo{max-width:225px!important;height:46px!important;max-height:46px!important}}
@media(max-width:900px){nav .site-brand{width:58px!important;min-width:58px!important;height:64px!important}nav .site-brand-logo{width:54px!important;max-width:54px!important;height:54px!important;max-height:54px!important;object-fit:cover!important;object-position:left center!important}}


/* === REV 4 QA CORRECTIONS === */
/* One logo only; preserve room for navigation and CTA. */
nav .site-brand{display:flex!important;align-items:center!important;flex:0 0 280px!important;width:280px!important;min-width:280px!important;height:70px!important;overflow:hidden!important;line-height:0!important}
nav .site-brand-logo{display:block!important;width:276px!important;max-width:276px!important;height:58px!important;max-height:58px!important;object-fit:contain!important;object-position:left center!important;position:static!important;transform:none!important;margin:0!important;padding:0!important}
html.light nav{background:#111814!important;border-bottom-color:#273229!important;box-shadow:none!important}
html.light .nav-links a{color:#eef2ed!important}
html.light .nav-links a:hover{color:#17b08a!important}
html.light .mode-toggle{background:#182019!important;color:#eef2ed!important;border-color:#344039!important}
@media(max-width:1240px){nav .site-brand{flex-basis:220px!important;width:220px!important;min-width:220px!important}nav .site-brand-logo{width:216px!important;max-width:216px!important;height:48px!important;max-height:48px!important}.nav-links{gap:18px!important}}
@media(max-width:900px){nav .site-brand{flex-basis:58px!important;width:58px!important;min-width:58px!important;height:64px!important}nav .site-brand-logo{width:54px!important;max-width:54px!important;height:54px!important;max-height:54px!important;object-fit:cover!important;object-position:left center!important}}
/* Prevent any white text-box artifacts in light-mode stat/cert banners. */
html.light .hero-stats,html.light .hero-stats *,html.light .stat,html.light .stat *,html.light .ids-bar,html.light .ids-bar *,html.light .perf-banner,html.light .perf-banner *{box-shadow:none!important}
html.light .hero-stats .stat,html.light .hero-stats .stat-value,html.light .hero-stats .stat-label,html.light .hero-stats span,html.light .ids-bar span,html.light .perf-banner span{background:transparent!important}


/* ═══════════════════════════════════════════════
   FINAL QA PASS — theme, navigation, footer, CTAs
   ═══════════════════════════════════════════════ */
/* Navigation intentionally remains dark in both themes for consistent branding. */
html.light nav{background:rgba(13,15,13,.98)!important;border-bottom-color:#2a332e!important;box-shadow:0 2px 14px rgba(0,0,0,.18)!important}
html.light nav .site-brand-logo-dark{display:block!important;visibility:visible!important;opacity:1!important}
html.light nav .site-brand-logo-light{display:none!important}
html.light nav .nav-links>a,html.light nav .nav-links li>a{color:#e6ebe5!important}
html.light nav .nav-links li>a:hover{color:#17b08a!important}
html.light nav .mode-toggle{background:#17201b!important;border-color:#38453e!important;color:#eef2ed!important}

/* Light-mode dropdown readability. */
html.light .dropdown-menu{background:#fff!important;border-color:#b9c5bf!important;box-shadow:0 12px 30px rgba(0,0,0,.16)!important}
html.light .dropdown-menu a{color:#17201b!important;background:transparent!important;font-weight:600!important}
html.light .dropdown-menu a:hover{color:#075d49!important;background:#e8f4f0!important}

/* Light-mode foreground text: never use washed-out white/gray on pale sections. */
html.light main .section-title,html.light main .page-hero h1,html.light main h1,html.light main h2,html.light main h3{color:#101512!important}
html.light main p,html.light main li,html.light main .card-desc,html.light main .breadcrumb,html.light main .rfq-info,html.light main .contact-row span{color:#26332d!important}
html.light main .section-label,html.light main .page-hero-label,html.light main .field label{color:#076b53!important}
html.light #rfq{background:#eef2ed!important}
html.light #rfq .section-title{color:#101512!important}
html.light #rfq .section-label{color:#076b53!important}
html.light #rfq input,html.light #rfq select,html.light #rfq textarea{background:#fff!important;color:#101512!important;border-color:#aebbb4!important}
html.light #rfq input::placeholder,html.light #rfq textarea::placeholder{color:#65736b!important;opacity:1!important}

/* Preserve deliberate dark/green panels in light mode. */
html.light .highlight-bar{background:#119474!important}
html.light .highlight-stat{background:transparent!important;border:0!important;box-shadow:none!important}
html.light .highlight-val,html.light .highlight-lbl{background:transparent!important;color:#fff!important;box-shadow:none!important}
html.light .highlight-val{font-weight:700!important}
html.light .highlight-lbl{opacity:.88!important}

/* Certificate controls always render as branded buttons, never visited-link purple. */
a.cert-pdf-link,a.cert-pdf-link:link,a.cert-pdf-link:visited,a.cert-pdf-link:hover,a.cert-pdf-link:active{display:inline-flex!important;align-items:center!important;gap:7px!important;padding:10px 15px!important;background:#119474!important;color:#fff!important;border:1px solid #119474!important;text-decoration:none!important;font-family:'Barlow Condensed',sans-serif!important;font-size:10px!important;letter-spacing:1.8px!important;text-transform:uppercase!important;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)!important}
a.cert-pdf-link:hover{background:#17b08a!important;border-color:#17b08a!important}

/* Footer remains a continuous dark branded block in either theme. */
footer,html.light footer{background:#0d120f!important;border-top-color:#273129!important;color:#eef2ed!important;padding-bottom:48px!important}
.footer-bottom,html.light .footer-bottom{background:#0a0e0c!important;border-top-color:#273129!important;color:#aeb8b1!important;margin-top:0!important}
footer p,html.light footer p,footer .footer-links a,html.light footer .footer-links a{color:#b9c3bc!important}
footer .footer-col-title,html.light footer .footer-col-title{color:#17b08a!important}
footer .footer-address,html.light footer .footer-address{color:#eef2ed!important}
.footer-logo-link{display:inline-block;max-width:290px;text-decoration:none}
.footer-brand-logo{display:block!important;width:100%!important;max-width:290px!important;height:auto!important;visibility:visible!important;opacity:1!important}

/* Remove accidental pale strips immediately around the footer. */
body,html.light body{margin:0!important}
footer+ .footer-bottom{margin-bottom:0!important}

/* Gallery uses the exact same header dimensions and typography as the rest of the site. */
.gallery-page nav,.gallery-page-item{font-size:inherit}
@media(max-width:900px){.footer-logo-link,.footer-brand-logo{max-width:235px!important}}


/* FINAL RELEASE POLISH — consistent navigation and light-mode readability */
nav .nav-links a,
html.light nav .nav-links a {
  color: #aeb8b1 !important;
}
nav .nav-links a:hover,
html.light nav .nav-links a:hover,
nav .nav-links a.is-active,
html.light nav .nav-links a.is-active {
  color: #17b08a !important;
}
nav .nav-links a.is-active::after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  margin-top: 6px;
  background: #17b08a;
}
html.light main .equip-category-title,
html.light main .category-title,
html.light main .subsection-title,
html.light main .section-subtitle,
html.light main .section-label,
html.light main .page-hero-label,
html.light main .footer-col-title {
  color: #101512 !important;
}
html.light main .section-label::before,
html.light main .page-hero-label::before {
  background: #0a7057 !important;
}
html.light .dropdown-menu a,
html.light nav .dropdown-menu a {
  color: #26302a !important;
}
html.light .dropdown-menu a:hover,
html.light nav .dropdown-menu a:hover {
  color: #087056 !important;
  background: #eef3ef !important;
}


/* ════════════════════════════════════════
   PRE-LAUNCH STRUCTURAL CONSOLIDATION
════════════════════════════════════════ */
.site-nav { overflow: visible; }
.site-brand { flex: 0 0 auto; min-width: 230px; max-width: 360px; }
.site-brand-logo { width: min(300px, 21vw); height: 58px; object-fit: contain; object-position: left center; display:block; }
.nav-links > li > a { color: #aeb6b1 !important; }
.nav-links > li > a:hover, .nav-links > li > a.is-active { color: var(--odg-bright) !important; }
.nav-links .nav-cta, html.light .nav-links .nav-cta { color:#fff !important; background:var(--odg) !important; }
.nav-links .nav-cta:hover { background:var(--odg-bright) !important; }
.dropdown-menu a { color:#aeb6b1 !important; }
html.light .dropdown-menu { background:#101612 !important; }
html.light .dropdown-menu a { color:#aeb6b1 !important; }
.dropdown-menu a:hover { color:var(--odg-bright) !important; background:rgba(17,148,116,.10); }
footer, html.light footer { background:#0a0f0c; color:#d7ddd9; }
.footer-brand-logo { width:min(360px,100%); height:auto; display:block; }
.footer-brand p, .footer-address { color:#9ea9a3 !important; }
.footer-social { display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }
.footer-social a { color:#c7d0cb; border:1px solid #39443e; padding:8px 12px; text-decoration:none; font-family:'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:2px; font-size:10px; }
.footer-social a:hover { color:#fff; border-color:var(--odg); }
.footer-links a { position:relative; z-index:2; color:#aeb6b1; }
.footer-links a:hover { color:var(--odg-bright); }
.footer-bottom, html.light .footer-bottom { background:#070b09; }
.footer-bottom p, .footer-ut, html.light .footer-bottom p, html.light .footer-ut { color:#8e9a94 !important; }
footer, .footer-bottom { position:relative; z-index:5; }
html.light .section-label, html.light [class*="subhead"], html.light .equipment-group-title { color:#151a17 !important; }
html.light .section-label::before { background:#151a17; }

/* Equipment page */
.equipment-page-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.equipment-card { background:var(--panel); border:1px solid var(--gray-border); overflow:hidden; }
.equipment-card img { width:100%; height:230px; object-fit:cover; display:block; }
.equipment-card div { padding:24px; }
.equipment-card h2 { font-family:'Bebas Neue',sans-serif; color:var(--white); font-size:30px; letter-spacing:1.5px; margin-bottom:10px; }
.equipment-card p { color:var(--gray-light); font-size:13px; line-height:1.7; }
html.light .equipment-card { background:#fff; border-color:#ccd5d0; }
html.light .equipment-card h2 { color:#111412; }
html.light .equipment-card p { color:#303733; }
.equipment-document { display:grid; grid-template-columns:1fr 1.1fr; gap:56px; align-items:center; }
.equipment-document p, .equipment-cta p { color:var(--gray-light); line-height:1.8; max-width:680px; }
html.light .equipment-document p, html.light .equipment-cta p { color:#303733; }
.document-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; }
.equipment-pdf-preview { min-height:560px; border:1px solid var(--gray-border); background:#fff; }
.equipment-pdf-preview iframe { width:100%; height:560px; border:0; display:block; }
.equipment-cta { display:flex; justify-content:space-between; gap:32px; align-items:center; }

@media(max-width:1100px){.site-brand{min-width:190px}.site-brand-logo{width:210px}.equipment-page-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.site-brand{min-width:0}.site-brand-logo{width:190px;height:48px}.equipment-page-grid{grid-template-columns:1fr}.equipment-document{grid-template-columns:1fr}.equipment-pdf-preview{display:none}.equipment-cta{align-items:flex-start;flex-direction:column}}


/* ═══════════════════════════════════════════════
   FINAL PRE-LAUNCH CORRECTION PASS
   Light-mode continuity, unified gallery nav, equipment navigation
   ═══════════════════════════════════════════════ */

/* Keep the scrolling credential band green in both themes. */
html.light .marquee-wrap{
  background:#119474!important;
  border-top:1px solid #0b765b!important;
  border-bottom:1px solid #0b765b!important;
}
html.light .marquee-item{color:#f7fbf9!important;font-weight:600!important;}

/* Critical-applications accordion: strong, readable light-mode states. */
html.light #industries .market-list{background:#d8dfda!important;border-color:#b9c5bf!important;}
html.light #industries .market-item{background:#ffffff!important;border-bottom:1px solid #cbd4cf!important;}
html.light #industries .market-item-header{
  background:rgba(255,255,255,.96)!important;
  color:#101512!important;
  font-weight:700!important;
  text-shadow:none!important;
}
html.light #industries .market-item:hover .market-item-header,
html.light #industries .market-item.open .market-item-header{
  background:rgba(245,249,247,.96)!important;
  color:#075d49!important;
}
html.light #industries .market-sub{
  background:rgba(248,251,249,.96)!important;
  border-top:1px solid #cbd4cf!important;
}
html.light #industries .sub-tag{
  background:#e5f3ee!important;
  border-color:#a7cfc2!important;
  color:#075d49!important;
  font-weight:600!important;
}
html.light #industries .market-arrow{color:#075d49!important;}

/* United Technical affiliate section stays readable and maintains its layout. */
html.light .affiliate-banner{
  background:#ffffff!important;
  border:1px solid #c6d0ca!important;
  box-shadow:0 8px 30px rgba(15,28,20,.08)!important;
}
html.light .affiliate-banner,
html.light .affiliate-banner *{color:#26332d!important;text-shadow:none!important;}
html.light .affiliate-banner h3{color:#101512!important;}
html.light .affiliate-banner [style*="color:var(--odg-bright)"],
html.light .affiliate-banner [style*="color: var(--odg-bright)"]{color:#075d49!important;}
html.light .affiliate-banner .affiliate-services{border-left-color:#c6d0ca!important;}
html.light .affiliate-banner .affiliate-services>div,
html.light .affiliate-banner [style*="background:rgba(0,0,0"]{
  background:#edf4f0!important;
  border:1px solid #d1ddd7!important;
}
html.light .affiliate-banner a[href*="unitedtech"]{
  background:#119474!important;
  color:#ffffff!important;
  border-color:#119474!important;
}

/* RFQ is a true light panel in light mode — no dark green or white-on-white fields. */
html.light #rfq,
html.light section#rfq,
html.light .rfq-section,
html.light .section-alt#rfq{
  background:#eef2ed!important;
  color:#101512!important;
}
html.light #rfq .rfq-layout,
html.light #rfq .rfq-info,
html.light #rfq .rfq-form{color:#101512!important;}
html.light #rfq h2,
html.light #rfq .section-title{color:#101512!important;}
html.light #rfq .section-label,
html.light #rfq .field label{color:#075d49!important;}
html.light #rfq p,
html.light #rfq .contact-row,
html.light #rfq .contact-row span,
html.light #rfq a{color:#26332d!important;}
html.light #rfq .contact-row{border-bottom-color:#c5d0ca!important;}
html.light #rfq input,
html.light #rfq select,
html.light #rfq textarea{
  background:#ffffff!important;
  color:#101512!important;
  border:1px solid #aebbb4!important;
  box-shadow:none!important;
}
html.light #rfq input::placeholder,
html.light #rfq textarea::placeholder{color:#66736c!important;opacity:1!important;}
html.light #rfq select option{background:#ffffff!important;color:#101512!important;}
html.light #rfq button[type="submit"]{background:#119474!important;color:#ffffff!important;}

/* Dropdowns must always be legible in light mode. */
html.light nav .dropdown-menu{background:#ffffff!important;border-color:#b9c5bf!important;}
html.light nav .dropdown-menu a{color:#26332d!important;background:#ffffff!important;font-weight:600!important;}
html.light nav .dropdown-menu a:hover,
html.light nav .dropdown-menu a.is-active{color:#075d49!important;background:#e7f3ef!important;}

/* Footer breathing room between company statement and address. */
.footer-brand>p:first-of-type{margin-bottom:18px!important;}
.footer-address{margin-top:0!important;}

/* Equipment cards are now navigation controls. */
a.equipment-card{display:block;text-decoration:none;color:inherit;transition:transform .2s,border-color .2s,box-shadow .2s;}
a.equipment-card:hover{transform:translateY(-3px);border-color:#119474;box-shadow:0 12px 28px rgba(0,0,0,.16);}
a.equipment-card:focus-visible{outline:3px solid #17b08a;outline-offset:3px;}
.equipment-card .equipment-card-action{display:inline-block;margin-top:14px;font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#17b08a;}
html.light .equipment-card .equipment-card-action{color:#075d49;}
.equipment-detail-section{scroll-margin-top:92px;}
.equipment-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.equipment-detail{background:var(--panel);border:1px solid var(--gray-border);padding:25px;}
.equipment-detail h3{font-family:'Barlow Condensed',sans-serif;font-size:20px;text-transform:uppercase;letter-spacing:.7px;color:var(--white);margin-bottom:8px;}
.equipment-detail p{color:var(--gray-light);font-size:13px;line-height:1.65;}
.equipment-detail .detail-meta{margin-top:10px;color:var(--odg-bright);font-family:'Barlow Condensed',sans-serif;font-size:11px;letter-spacing:1px;text-transform:uppercase;}
html.light .equipment-detail{background:#ffffff;border-color:#c9d3ce;}
html.light .equipment-detail h3{color:#101512!important;}
html.light .equipment-detail p{color:#26332d!important;}
html.light .equipment-detail .detail-meta{color:#075d49!important;}
@media(max-width:800px){.equipment-detail-grid{grid-template-columns:1fr;}}


/* Final minor QA corrections */
html.light #equipment .equip-category-title,
html.light #equipment .equipment-group-title,
html.light #equipment .section-label,
html.light #equipment h3 {
  color:#111713 !important;
}
html.light .certs-panel {
  background:#39453f !important;
  border-color:#2f3934 !important;
}
html.light .certs-header {
  color:#dce9e3 !important;
  border-bottom-color:rgba(255,255,255,.16) !important;
}
html.light .cert-row {
  border-bottom-color:rgba(255,255,255,.14) !important;
}
html.light .cert-row:hover {
  background:rgba(255,255,255,.06) !important;
}
html.light .cert-icon {
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.20) !important;
}
html.light .cert-title {
  color:#ffffff !important;
}
html.light .cert-sub {
  color:#d5ddd8 !important;
}


/* Final mobile and touch interaction hardening */
html,body{width:100%;max-width:100%;overflow-x:hidden!important;overscroll-behavior-x:none;}
body,*{box-sizing:border-box;}
img,video,svg,canvas,iframe{max-width:100%;}
.has-dropdown.touch-open>.dropdown-menu{opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;}
.market-item.open .market-sub{display:flex!important;}
.market-item.open .market-arrow{transform:rotate(180deg);}
@media (hover:none),(pointer:coarse){
  .has-dropdown:hover>.dropdown-menu{opacity:0;visibility:hidden;pointer-events:none;}
  .has-dropdown.touch-open>.dropdown-menu{opacity:1!important;visibility:visible!important;pointer-events:auto!important;}
}
@media(max-width:900px){
  html,body,main,nav,header,section,footer{width:100%;max-width:100%;overflow-x:clip;}
  body *{min-width:0;}
  .site-nav,.nav-inner{left:0;right:0;width:100%;max-width:100%;}
  .mobile-nav{left:0!important;right:0!important;width:100%!important;max-width:100vw!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;}
  .mobile-nav-link,.mobile-menu-btn{touch-action:manipulation;}
  .page-hero,.section,.map-section{padding-left:20px!important;padding-right:20px!important;}
  .split-layout,.rfq-layout,.affiliate-banner,.map-wrap,[style*="grid-template-columns:1fr 1fr"],[style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr!important;}
  table{width:100%;max-width:100%;table-layout:fixed;}
  td,th{overflow-wrap:anywhere;}
}


/* Final mobile header control lock — keep theme and hamburger usable after navigation */
@media (max-width: 900px) {
  nav.site-nav,
  .site-nav {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px 42px !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: 58px !important;
    padding: 0 12px !important;
    overflow: visible !important;
  }
  nav.site-nav .site-brand,
  .site-nav .site-brand {
    grid-column: 1 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    height: 58px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
  }
  nav.site-nav .site-brand-logo,
  .site-nav .site-brand-logo {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: 42px !important;
    max-height: 42px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
  nav.site-nav .nav-links,
  .site-nav .nav-links {
    display: none !important;
  }
  nav.site-nav .mode-toggle,
  .site-nav .mode-toggle {
    grid-column: 2 !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    flex: none !important;
  }
  nav.site-nav .mode-toggle .toggle-label,
  .site-nav .mode-toggle .toggle-label {
    display: none !important;
  }
  nav.site-nav .mobile-menu-btn,
  .site-nav .mobile-menu-btn {
    grid-column: 3 !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 8px 9px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border: 1px solid var(--gray-border) !important;
    background: transparent !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    flex: none !important;
    z-index: 1002 !important;
  }
  nav.site-nav .mobile-menu-btn span,
  .site-nav .mobile-menu-btn span {
    display: block !important;
    width: 21px !important;
    height: 2px !important;
    min-height: 2px !important;
    background: #eef2ed !important;
    border-radius: 2px !important;
    transition: transform .25s ease, opacity .2s ease !important;
    pointer-events: none !important;
  }
  html.light nav.site-nav .mobile-menu-btn span,
  html.light .site-nav .mobile-menu-btn span {
    background: #eef2ed !important;
  }
  nav.site-nav .mobile-menu-btn.open span:nth-child(1),
  .site-nav .mobile-menu-btn.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg) !important;
  }
  nav.site-nav .mobile-menu-btn.open span:nth-child(2),
  .site-nav .mobile-menu-btn.open span:nth-child(2) {
    opacity: 0 !important;
  }
  nav.site-nav .mobile-menu-btn.open span:nth-child(3),
  .site-nav .mobile-menu-btn.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg) !important;
  }
  nav.site-nav .mobile-nav,
  .site-nav .mobile-nav {
    grid-column: 1 / -1 !important;
    position: fixed !important;
    top: 58px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    max-height: calc(100dvh - 58px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 1000 !important;
  }
}


/* ═══════════════════════════════════════════════════════════════════
   SITE NAVIGATION SYSTEM — single source of truth
   ───────────────────────────────────────────────────────────────────
   The mobile-nav component was previously defined only inline in
   index.html, so every shared.css page rendered it unstyled:
   submenus could not collapse (no display rule) and links fell back
   to the browser default blue. Everything the nav needs now lives
   here so all pages resolve identically.

   Breakpoint: the desktop nav needs ~950px of horizontal room, so the
   hamburger takes over at <=1024px (was 900px, which left 901-949px
   rendering a colliding desktop nav).
   ═══════════════════════════════════════════════════════════════════ */

/* ── Mobile nav shell ── */
.mobile-nav {
  flex-direction: column;
  gap: 0;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* ── Rows ── */
.mobile-nav-item { border-bottom: 1px solid var(--gray-border); width: 100%; }

.mobile-nav-link {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; box-sizing: border-box;
  padding: 15px 4px; margin: 0;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gray-light); text-decoration: none;
  background: none; border: none; border-bottom: 1px solid var(--gray-border);
  text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none;
  touch-action: manipulation;
}
.mobile-nav-item > .mobile-nav-link,
.mobile-nav-parent-row .mobile-nav-link { border-bottom: 0; }
.mobile-nav-link:hover,
.mobile-nav-link:focus-visible { color: var(--odg-bright); }

/* Parent row: full-width link + separate submenu toggle */
.mobile-nav-parent-row {
  display: grid; grid-template-columns: minmax(0, 1fr) 54px;
  align-items: stretch; width: 100%;
}
.mobile-nav-sub-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 54px; min-width: 54px; padding: 0; margin: 0;
  background: none; border: 0; border-left: 1px solid var(--gray-border);
  color: var(--odg-bright); cursor: pointer;
  -webkit-appearance: none; appearance: none; touch-action: manipulation;
}
.mobile-nav-sub-toggle:hover { background: rgba(17,148,116,0.10); }
.mobile-nav-arrow {
  font-size: 11px; line-height: 1; color: var(--odg-bright);
  transition: transform 0.25s; pointer-events: none;
}
.mobile-nav-sub-toggle.open .mobile-nav-arrow,
.mobile-nav-arrow.open { transform: rotate(180deg); }

/* ── Submenu: collapsed by default ── */
.mobile-nav-sub {
  display: none;
  flex-direction: column; gap: 0;
  padding: 4px 0 12px 18px; width: 100%; box-sizing: border-box;
}
.mobile-nav-sub.open { display: flex; }
.mobile-nav-sub a {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 6px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--gray-mid); text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  touch-action: manipulation;
}
.mobile-nav-sub a::before { content: '\203A'; color: var(--odg); font-size: 14px; }
.mobile-nav-sub a:last-child { border-bottom: 0; }
.mobile-nav-sub a:hover,
.mobile-nav-sub a:focus-visible { color: var(--odg-bright); }

.mobile-nav-cta {
  display: block; width: 100%; box-sizing: border-box;
  margin-top: 24px; padding: 16px; text-align: center;
  background: var(--odg); color: #fff; text-decoration: none;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px; letter-spacing: 2.5px; text-transform: uppercase;
}
.mobile-nav-cta:hover { background: var(--odg-bright); color: #fff; }

/* ── Light mode ── */
html.light .mobile-nav-link { color: #1a2418; }
html.light .mobile-nav-sub { background: #f5f8f4; border-left: 2px solid var(--odg); }
html.light .mobile-nav-sub a { color: #2a3328; border-bottom-color: rgba(0,0,0,0.06); }
html.light .mobile-nav-sub a:hover,
html.light .mobile-nav-sub a:focus-visible { color: #075d49; }
html.light .mobile-nav-cta { background: var(--odg); color: #fff; }

/* ── Keyboard accessibility ── */
.mobile-nav a:focus-visible,
.mobile-nav button:focus-visible,
.nav-links a:focus-visible,
.dropdown-menu a:focus-visible,
.mobile-menu-btn:focus-visible,
.mode-toggle:focus-visible {
  outline: 2px solid var(--odg-bright); outline-offset: 2px;
}
/* Desktop dropdowns must open for keyboard users, not hover only */
.nav-links li.has-dropdown:focus-within > .dropdown-menu {
  opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto;
}

/* ── Mobile/tablet header: hamburger mode at <=1024px ── */
@media (max-width: 1024px) {
  nav.site-nav, .site-nav {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px 42px !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important; max-width: 100vw !important;
    height: 58px !important; padding: 0 14px !important;
    overflow: visible !important;
  }
  nav.site-nav .site-brand, .site-nav .site-brand {
    grid-column: 1 !important;
    min-width: 0 !important; max-width: 100% !important; width: 100% !important;
    height: 58px !important; overflow: hidden !important;
    display: flex !important; align-items: center !important;
  }
  nav.site-nav .site-brand-logo, .site-nav .site-brand-logo {
    display: block !important; width: auto !important; max-width: 100% !important;
    height: 42px !important; max-height: 42px !important;
    object-fit: contain !important; object-position: left center !important;
  }
  nav.site-nav .nav-links, .site-nav .nav-links { display: none !important; }
  nav.site-nav .mode-toggle, .site-nav .mode-toggle {
    grid-column: 2 !important; margin: 0 !important; padding: 0 !important;
    width: 42px !important; min-width: 42px !important; max-width: 42px !important;
    height: 38px !important;
    display: inline-flex !important; align-items: center !important;
    justify-content: center !important; overflow: hidden !important; flex: none !important;
  }
  nav.site-nav .mode-toggle .toggle-label, .site-nav .mode-toggle .toggle-label { display: none !important; }
  nav.site-nav .mobile-menu-btn, .site-nav .mobile-menu-btn {
    grid-column: 3 !important; margin: 0 !important; padding: 8px 9px !important;
    width: 42px !important; min-width: 42px !important; max-width: 42px !important;
    height: 38px !important;
    display: inline-flex !important; flex-direction: column !important;
    align-items: center !important; justify-content: center !important; gap: 5px !important;
    border: 1px solid var(--gray-border) !important; background: transparent !important;
    cursor: pointer !important; touch-action: manipulation !important;
    flex: none !important; z-index: 1002 !important;
  }
  nav.site-nav .mobile-menu-btn span, .site-nav .mobile-menu-btn span {
    display: block !important; width: 21px !important;
    height: 2px !important; min-height: 2px !important;
    background: var(--white) !important; border-radius: 2px !important;
    transition: transform .25s ease, opacity .2s ease !important;
    pointer-events: none !important;
  }
  nav.site-nav .mobile-menu-btn.open span:nth-child(1), .site-nav .mobile-menu-btn.open span:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; }
  nav.site-nav .mobile-menu-btn.open span:nth-child(2), .site-nav .mobile-menu-btn.open span:nth-child(2) { opacity: 0 !important; }
  nav.site-nav .mobile-menu-btn.open span:nth-child(3), .site-nav .mobile-menu-btn.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }

  nav.site-nav .mobile-nav, .site-nav .mobile-nav {
    grid-column: 1 / -1 !important;
    position: fixed !important;
    top: 58px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    width: 100vw !important; max-width: 100vw !important;
    height: auto !important;
    max-height: calc(100dvh - 58px) !important;
    overflow-y: auto !important; overflow-x: hidden !important;
    padding: 12px 18px 40px !important;
    z-index: 1000 !important;
    align-content: flex-start !important;
  }
}

/* ── Desktop: full nav only, mobile layer fully out of the way ── */
@media (min-width: 1025px) {
  nav.site-nav .nav-links, .site-nav .nav-links { display: flex !important; }
  nav.site-nav .mobile-menu-btn, .site-nav .mobile-menu-btn { display: none !important; }
  nav.site-nav .mobile-nav, .site-nav .mobile-nav { display: none !important; }
}


/* ═══════════════════════════════════════════════════════════════════
   NAVIGATION — DEVICE FIXES (follow-up to the centralisation commit)
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. Mobile menu height collapse ──
   nav.site-nav carries backdrop-filter, which makes it the CONTAINING BLOCK
   for position:fixed descendants. .mobile-nav's top/bottom then resolved
   against the 58px nav box instead of the viewport, collapsing the menu to a
   ~52px scrolling strip. Pages carrying the inline #final-mobile-nav-layout-fix
   block masked this with position:absolute; equipment.html and gallery.html
   never had that block, so they collapsed.
   Dropping backdrop-filter at hamburger widths removes the trap at its source
   (--nav-bg is already 96-97% opaque, so the blur is not visible anyway).
   The explicit viewport-unit height is belt-and-braces: it keeps the menu
   correct even if some future ancestor re-creates a containing block. */
@media (max-width: 1024px) {
  nav.site-nav, .site-nav {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: var(--nav-bg) !important;
  }
  nav.site-nav .mobile-nav, .site-nav .mobile-nav {
    position: fixed !important;
    top: 58px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    height: auto !important;
    min-height: calc(100vh - 58px) !important;
    min-height: calc(100dvh - 58px) !important;
    max-height: calc(100vh - 58px) !important;
    max-height: calc(100dvh - 58px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }
}

/* ── 2. Tablet-landscape touch dropdowns ──
   The CSS suppressed hover-opening under (hover:none) OR (pointer:coarse),
   but site.js only set .touch-open under (hover:none). On a tablet reporting
   hover:hover + pointer:coarse (iPadOS desktop-class Safari, Android tablets
   with a pointer) nothing opened the menu except :focus-within, and focus is
   released as soon as a finger goes down on a submenu item — so the menu
   closed before the tap could land.
   html.is-touch is now set from real pointerdown events, so it reflects the
   input actually being used rather than an advertised media capability. */
html.is-touch .nav-links li.has-dropdown:hover > .dropdown-menu {
  opacity: 0; visibility: hidden; pointer-events: none;
}
/* .touch-open is the authoritative open state and must outrank hover/focus. */
.nav-links li.has-dropdown.touch-open > .dropdown-menu,
html.is-touch .nav-links li.has-dropdown.touch-open > .dropdown-menu {
  opacity: 1 !important; visibility: visible !important;
  transform: translateY(0) !important; pointer-events: auto !important;
}
/* Remove the double-tap delay and keep taps from being treated as gestures. */
.nav-links a, .dropdown-menu a, .has-dropdown > a { touch-action: manipulation; }
/* Comfortable tap targets for coarse pointers. */
@media (pointer: coarse) {
  .dropdown-menu { min-width: 260px; padding: 6px 0; }
  .dropdown-menu a { padding: 14px 20px; }
}


/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE NAVIGATION FIT — intermediate desktop widths
   ═══════════════════════════════════════════════════════════════════
   The desktop nav is a flex row: .site-brand (fixed basis, no shrink),
   ul.nav-links (the only shrinkable item) and .mode-toggle (no shrink).
   When the row ran out of room the ul shrank, the "Request Quote" label
   wrapped onto a second line and was clipped by the 70px bar. Two bands
   failed: 1181–1235px (before the old 1180px step engaged) and
   1025–1049px (the 1180px step alone was not enough down to the 1025px
   mobile handover). The brand/gap step now engages at 1240px, a second
   step tightens spacing below 1100px, and the guards below stop any
   nav item from being squeezed at all. The mobile handover stays at
   1024px, unchanged. */

/* Structural guards: nav items size to their content, never squeezed. */
.nav-links > li { flex-shrink: 0; }
.nav-cta { white-space: nowrap; flex-shrink: 0; }

/* Second desktop step: tighten spacing before the 1025px mobile handover. */
@media (min-width: 1025px) and (max-width: 1100px) {
  nav .site-brand {
    flex-basis: 196px !important; width: 196px !important; min-width: 196px !important;
  }
  nav .site-brand-logo { width: 192px !important; max-width: 192px !important; }
  .nav-links { gap: 12px !important; }
  .nav-links > li > a { letter-spacing: 1.8px !important; }
}


/* ═══════════════════════════════════════════════════════════════════
   GHOST BUTTON ON A PERMANENTLY DARK BACKGROUND
   ═══════════════════════════════════════════════════════════════════
   html.light remaps --white to #111412, so any token-driven ghost button
   turns near-black. That is correct on a light page, but heroes that stay
   dark in BOTH themes (the blueprint hero, the About archive hero) then
   render an invisible button. This is the button-level companion to the
   "BLUEPRINT HERO — text always white" block above.

   Pair with a layout class (.btn-ghost, .about-btn) which supplies
   padding and type; this modifier owns colour, border and states only.
   !important matches the light-mode override convention used throughout
   this file. */
.btn-ghost-on-dark,
html.light .btn-ghost-on-dark {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.42) !important;
  transition: color .2s, border-color .2s, background-color .2s;
}
.btn-ghost-on-dark:hover,
html.light .btn-ghost-on-dark:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.78) !important;
}
.btn-ghost-on-dark:focus-visible,
html.light .btn-ghost-on-dark:focus-visible {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: #ffffff !important;
  /* White ring in both themes: the backdrop is a dark photograph either way. */
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
.btn-ghost-on-dark:active,
html.light .btn-ghost-on-dark:active {
  color: #ffffff !important;
  background: rgba(17, 148, 116, 0.42) !important;
  border-color: var(--odg-bright) !important;
}
