/* ============================================================
   BHCR parent-hub identity layer — elevated / corporate.
   Loads on top of the shared site.css (design tokens + fonts).
   Locked DARK palette + mono-white logo + SOLID buttons.
   ============================================================ */
:root {
  --bhcr-green: #3E9B63;
  --bhcr-green-bright: #78C143;
  --bhcr-blue: #3EB2E1;
  --bhcr-bg: #060A12;        /* base — deeper than Eco-Kold navy */
  --bhcr-surface: #0D141E;   /* raised cards */
  --bhcr-surface-2: #090F18; /* alt bands */
  --bhcr-deep: #03060B;      /* footer / trust */
  --bhcr-line: rgba(255,255,255,0.07);
}
body { background: var(--bhcr-bg); color: var(--on-dark); }
.nav .logo img, .b-foot .logo img { filter: brightness(0) invert(1); }   /* mono white */

/* Nav */
.nav { padding: 14px var(--gutter-d); background: rgba(3,6,11,0.9); backdrop-filter: blur(12px); border-bottom: 1px solid var(--bhcr-line); position: sticky; top: 0; z-index: 100; }
.nav-inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 32px; max-width: var(--max); margin: 0 auto; }
.nav .logo img { height: 44px; width: auto; display: block; }
.nav-links { display: flex; gap: 4px; justify-self: center; list-style: none; margin: 0; padding: 0; }
.nav-links a { color: var(--on-dark-muted); text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 16px; border-radius: 8px; transition: color .2s, background .2s; }
.nav-links a:hover, .nav-links a.is-active { color: var(--on-dark); background: rgba(255,255,255,0.05); }
.nav-cta-wrap { display: flex; align-items: center; gap: 14px; }

/* Hamburger + in-menu CTA — hidden on desktop, shown under the breakpoint */
.b-hamburger { display: none; }
.nav-cta-mobile { display: none; }
.b-hamburger span { display: block; height: 2px; width: 100%; background: var(--on-dark); border-radius: 2px; transition: transform .25s ease, opacity .2s ease; }

/* Buttons — SOLID (gradient dropped per review) */
.btn { display: inline-flex; align-items: center; gap: 8px; font-family: 'Inter',sans-serif; font-weight: 600; font-size: 14px; padding: 11px 20px; border-radius: 999px; text-decoration: none; cursor: pointer; transition: transform .15s, box-shadow .2s, background .2s; border: 1px solid transparent; }
.btn-primary { background: var(--bhcr-blue); color: #04121c; box-shadow: 0 8px 24px rgba(62,178,225,0.20); }
.btn-primary:hover { transform: translateY(-1px); background: #58C6F0; box-shadow: 0 12px 32px rgba(62,178,225,0.30); }
.btn-ghost { background: transparent; border-color: var(--hairline-on-dark-2); color: var(--on-dark); }
.btn-ghost:hover { border-color: var(--on-dark-muted); background: rgba(255,255,255,0.04); }

.wrap { max-width: var(--max); margin: 0 auto; padding-left: var(--gutter-d); padding-right: var(--gutter-d); }
/* Gradient kept for TEXT accents only (wordmark, stat) — not buttons */
.grad { background: linear-gradient(120deg, var(--bhcr-green-bright), var(--bhcr-blue)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.eyebrow { font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--bhcr-blue); font-weight: 600; }

/* Hero */
.b-hero { position: relative; overflow: hidden; padding: clamp(72px,10vw,140px) 0 clamp(56px,7vw,96px); }
.b-hero::after { content:''; position:absolute; top:-160px; right:-160px; width:620px; height:620px; border-radius:50%;
  background: radial-gradient(circle at 50% 50%, rgba(62,178,225,0.16), rgba(62,155,99,0.10) 45%, transparent 70%); pointer-events:none; }
.b-hero .eyebrow { margin-bottom: 20px; }
.b-hero h1 { font-family:'Inter',sans-serif; font-weight:800; font-size: clamp(40px,6vw,80px); line-height:1.03; letter-spacing:-0.03em; max-width: 18ch; margin-bottom: 24px; }
.b-hero .lede { font-size: clamp(17px,1.6vw,21px); line-height:1.6; color: var(--on-dark-dim); max-width: 60ch; margin-bottom: 36px; }
.b-actions { display:flex; gap:14px; flex-wrap:wrap; margin-bottom: 56px; }
.b-stats { display:grid; grid-template-columns: repeat(4,1fr); gap:1px; background: var(--bhcr-line); border:1px solid var(--bhcr-line); border-radius:14px; overflow:hidden; max-width: 820px; }
.b-stats > div { background: var(--bhcr-surface-2); padding: 22px 24px; }
.b-stats .n { font-size: 34px; font-weight:800; letter-spacing:-0.02em; line-height:1; margin-bottom:8px; }
.b-stats .l { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color: var(--on-dark-muted); line-height:1.4; }

/* Section scaffolding */
.sec { padding: clamp(64px,8vw,110px) 0; }
.sec.alt { background: var(--bhcr-surface-2); border-top:1px solid var(--bhcr-line); border-bottom:1px solid var(--bhcr-line); }
.sec-head { margin-bottom: 48px; max-width: 64ch; }
.sec-head .eyebrow { display:block; margin-bottom: 14px; }
.sec-head h2 { font-size: clamp(28px,3.4vw,44px); font-weight:800; letter-spacing:-0.022em; line-height:1.08; }
.sec-head p { font-size:16px; line-height:1.65; color: var(--on-dark-dim); margin-top:16px; }

/* Portfolio / brand cards */
.brands { display:grid; grid-template-columns: repeat(2,1fr); gap: 20px; max-width: 900px; }
.brand { display:flex; flex-direction:column; background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012)); border:1px solid var(--bhcr-line); border-radius:16px; padding: 32px; transition: transform .2s, border-color .2s; }
.brand:hover { transform: translateY(-3px); border-color: rgba(62,178,225,0.4); }
.brand .tag { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color: var(--bhcr-blue); font-weight:600; margin-bottom: 16px; }
.brand .name { font-size: 28px; font-weight:800; letter-spacing:-0.02em; margin-bottom: 8px; }
.brand .role { font-size:13px; color: var(--on-dark-muted); margin-bottom: 16px; font-weight:500; }
.brand .desc { font-size:15px; line-height:1.6; color: var(--on-dark-dim); flex:1; margin-bottom: 22px; }
.brand .go { font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.04em; color: var(--on-dark); text-decoration:none; font-weight:600; display:inline-flex; align-items:center; gap:6px; border-bottom:1px solid var(--hairline-on-dark-2); padding-bottom:3px; align-self:flex-start; transition: color .2s, border-color .2s; }
.brand .go:hover { color: var(--bhcr-blue); border-color: var(--bhcr-blue); }
.brand.flagship { border-color: rgba(62,178,225,0.35); background: linear-gradient(180deg, rgba(62,178,225,0.08), rgba(62,155,99,0.03)); }
.brand.flagship .role { color: var(--bhcr-green-bright); }

/* Why / POV + generic feature grid */
.why-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.why-card { padding-top:22px; border-top: 1px solid var(--bhcr-line); }
.why-card .big { font-size: 44px; font-weight:800; letter-spacing:-0.02em; color: var(--on-dark); line-height:1; margin-bottom:12px; }
.why-card .big .u { font-size:0.5em; color: var(--on-dark-muted); }
.why-card h3 { font-size:18px; font-weight:700; color:var(--on-dark); margin-bottom:8px; letter-spacing:-0.01em; }
.why-card p { font-size:14px; line-height:1.6; color: var(--on-dark-dim); }

/* Blend chips (Eco-Kold page) */
.blends { display:flex; flex-wrap:wrap; gap:10px; }
.blend { font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.04em; color:var(--on-dark); background: var(--bhcr-surface); border:1px solid var(--bhcr-line); border-radius:999px; padding:9px 15px; }
.blend b { color: var(--bhcr-blue); font-weight:600; }

/* Trust band */
.trust { background: var(--bhcr-deep); border-top:1px solid var(--bhcr-line); border-bottom:1px solid var(--bhcr-line); padding: 44px 0; }
.trust .lab { display:block; text-align:center; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color: var(--on-dark-muted); margin-bottom: 28px; }
.trust-logos { display:flex; gap: 40px; flex-wrap:wrap; align-items:center; justify-content:center; }
.trust-logos img { height: 42px; width:auto; filter: grayscale(100%) brightness(0) invert(0.82); opacity:0.85; transition: opacity .2s, filter .2s; }
.trust-logos img:hover { opacity:1; filter: none; }

/* CTA band */
.partner { padding: clamp(64px,8vw,110px) 0; text-align:center; }
.partner .box { max-width: 760px; margin: 0 auto; }
.partner h2 { font-size: clamp(28px,3.4vw,46px); font-weight:800; letter-spacing:-0.022em; margin-bottom: 18px; }
.partner p { font-size:17px; line-height:1.6; color: var(--on-dark-dim); margin-bottom: 32px; }

/* Footer */
.b-foot { background: var(--bhcr-deep); border-top:1px solid var(--bhcr-line); padding: 72px 0 36px; position:relative; }
.b-foot::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background: linear-gradient(90deg, transparent, rgba(62,155,99,0.4) 30%, rgba(62,178,225,0.5) 50%, rgba(62,155,99,0.4) 70%, transparent); }
.b-foot-grid { display:grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; padding-bottom: 40px; border-bottom:1px solid var(--bhcr-line); }
.b-foot .logo img { height: 50px; margin-bottom: 18px; }
.b-foot .blurb { font-size:14px; line-height:1.65; color: var(--on-dark-dim); max-width: 40ch; }
.b-foot h4 { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color: var(--bhcr-blue); font-weight:600; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--bhcr-line); }
.b-foot ul { list-style:none; margin:0; padding:0; }
.b-foot li { margin-bottom:10px; font-size:14px; }
.b-foot a { color: var(--on-dark-muted); text-decoration:none; transition: color .2s; }
.b-foot a:hover { color: var(--bhcr-blue); }
.b-foot-bottom { margin-top: 28px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color: var(--on-dark-muted); }

/* Footer legal — site-wide availability / safety / trademark line (all pages) */
.foot-legal { font-size:11.5px; line-height:1.65; color: var(--on-dark-muted); max-width: 96ch; margin: 4px 0 24px; padding-top:24px; border-top:1px solid var(--bhcr-line); }

/* Regulatory note block — labeled, out of any table (per chart Regulatory Notes model) */
.reg-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:1px; background: var(--bhcr-line); border:1px solid var(--bhcr-line); border-radius:14px; overflow:hidden; }
.reg-card { background: var(--bhcr-surface-2); padding:26px 28px; }
.reg-card .k { font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color: var(--bhcr-blue); font-weight:600; margin-bottom:12px; }
.reg-card p { font-size:13.5px; line-height:1.65; color: var(--on-dark-dim); }
.reg-card p + p { margin-top:10px; }

/* ============================================================
   Nav wordmark lockup — crisp text mark in the nav (replaces the
   stacked raster crest, which went muddy at 44px in mono). The
   full crest mark stays in the footer where it has room.
   ============================================================ */
.nav .logo.bl-lockup { display:inline-flex; align-items:flex-start; gap:1px; line-height:1; text-decoration:none; }
.bl-lockup .bl-mark { font-family:'Inter',sans-serif; font-weight:800; font-size:26px; letter-spacing:-0.02em; color:var(--on-dark); }
.bl-lockup .bl-hq { font-family:'Inter',sans-serif; font-weight:700; font-size:12px; line-height:1; letter-spacing:0.01em; color:var(--bhcr-blue); margin-top:3px; }
.bl-lockup:hover .bl-mark { color:#fff; }

/* Generic dark prose */
.prose p { font-size:16px; line-height:1.75; color:var(--on-dark-dim); max-width:68ch; margin-bottom:18px; }
.prose p:last-child { margin-bottom:0; }
.prose p strong { color:var(--on-dark); font-weight:600; }
.prose .lead { font-size: clamp(18px,1.8vw,22px); line-height:1.6; color:var(--on-dark); max-width:60ch; }

/* Company — capability cards (2×2, text not numbers) */
.caps { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.cap { background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012)); border:1px solid var(--bhcr-line); border-radius:14px; padding:26px 28px; }
.cap .k { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--bhcr-blue); font-weight:600; margin-bottom:12px; }
.cap h3 { font-size:18px; font-weight:700; letter-spacing:-0.01em; margin-bottom:8px; color:var(--on-dark); }
.cap p { font-size:14px; line-height:1.6; color:var(--on-dark-dim); }

/* Company — split intro (lede left, support right) */
.split { display:grid; grid-template-columns: 1.1fr 1fr; gap:56px; align-items:start; }

/* ============================================================
   Contact page — dark form + info column
   ============================================================ */
.b-contact { padding: clamp(8px,2vw,24px) 0 clamp(56px,7vw,96px); }
.contact-cols { display:grid; grid-template-columns: 1.15fr 1fr; gap:40px; align-items:start; }
.form-card { background: var(--bhcr-surface); border:1px solid var(--bhcr-line); border-radius:18px; padding: clamp(28px,3.5vw,40px); }
.form-card .eyebrow { display:block; margin-bottom:10px; }
.form-card h2 { font-size: clamp(22px,2.4vw,30px); font-weight:800; letter-spacing:-0.02em; margin-bottom:8px; line-height:1.1; }
.form-card .sub { font-size:14px; color:var(--on-dark-dim); margin-bottom:26px; line-height:1.55; }
.fg { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.fg .full { grid-column:1/-1; }
.fld label { display:block; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--on-dark-muted); margin-bottom:6px; }
.fld label .req { color:var(--bhcr-blue); margin-left:3px; }
.fld input, .fld select, .fld textarea {
  width:100%; padding:11px 13px; font-family:'Inter',sans-serif; font-size:14px; color:var(--on-dark);
  background: var(--bhcr-bg); border:1px solid var(--hairline-on-dark-2); border-radius:8px; outline:none;
  transition: border-color .2s, box-shadow .2s;
}
.fld textarea { resize:vertical; min-height:110px; line-height:1.5; }
.fld input:focus, .fld select:focus, .fld textarea:focus { border-color:var(--bhcr-blue); box-shadow:0 0 0 3px rgba(62,178,225,0.18); }
.fld input::placeholder, .fld textarea::placeholder { color:var(--on-dark-muted); }
.fld select {
  appearance:none; -webkit-appearance:none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%237E8CA0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat; background-position: right 13px center; padding-right:34px;
}
.form-foot { grid-column:1/-1; display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:8px; padding-top:22px; border-top:1px solid var(--bhcr-line); }
.form-foot .note { font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--on-dark-muted); letter-spacing:0.02em; }

.info-col { display:flex; flex-direction:column; gap:18px; }
.info-card { background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)); border:1px solid var(--bhcr-line); border-radius:14px; padding:24px 26px; }
.info-card h3 { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--bhcr-blue); font-weight:600; margin-bottom:12px; }
.info-card .org { font-size:16px; font-weight:700; color:var(--on-dark); margin-bottom:12px; letter-spacing:-0.01em; }
.info-card dl { display:grid; grid-template-columns:70px 1fr; gap:8px 12px; font-size:13px; line-height:1.5; margin:0; }
.info-card dt { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--on-dark-muted); padding-top:2px; }
.info-card dd { color:var(--on-dark-dim); margin:0; }
.info-card a { color:var(--on-dark); text-decoration:none; border-bottom:1px solid var(--hairline-on-dark-2); transition:color .2s,border-color .2s; }
.info-card a:hover { color:var(--bhcr-blue); border-color:var(--bhcr-blue); }
.info-card.route { border-color: rgba(62,178,225,0.35); background: linear-gradient(180deg, rgba(62,178,225,0.09), rgba(62,155,99,0.03)); }
.info-card.route p { font-size:14px; color:var(--on-dark-dim); line-height:1.6; margin-bottom:18px; }

@media (max-width: 1024px) {
  /* Layout stacks */
  .brands, .why-grid, .b-stats, .caps, .split, .contact-cols, .fg, .reg-grid { grid-template-columns: 1fr; }
  .split { gap:32px; }
  .b-foot-grid { grid-template-columns: 1fr 1fr; gap:32px; }
  .b-stats, .brands { max-width:none; }

  /* Mobile nav. site.css already turns .nav-links into a fixed flyout when
     .is-menu-open and hides it otherwise — but themes it LIGHT for Eco-Kold.
     We show our hamburger + re-theme that flyout DARK (rules load after
     site.css, so equal-specificity selectors win on source order). */
  .nav-cta-wrap .btn-primary { display: none; }            /* hide bar CTA → it moves into the menu */
  .nav-links { display: none; }                            /* closed: hide inline links (site.css re-shows w/ !important when open) */
  .b-hamburger {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 40px; padding: 0 9px; background: transparent;
    border: 1px solid var(--hairline-on-dark-2); border-radius: 10px; cursor: pointer;
  }
  .b-hamburger:hover { border-color: var(--on-dark-muted); }
  .nav.is-menu-open .b-hamburger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav.is-menu-open .b-hamburger span:nth-child(2) { opacity: 0; }
  .nav.is-menu-open .b-hamburger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* Re-theme the open flyout dark (solid — no hero bleed-through) */
  .nav.is-menu-open .nav-links {
    background: #070B12;
    border-top-color: var(--bhcr-line); border-bottom-color: var(--bhcr-line);
    box-shadow: 0 24px 48px rgba(0,0,0,0.5);
  }
  .nav.is-menu-open .nav-links > li { border-top-color: var(--bhcr-line); }
  .nav.is-menu-open .nav-links > li > a { color: var(--on-dark-muted); }
  .nav.is-menu-open .nav-links > li > a:hover,
  .nav.is-menu-open .nav-links > li > a:focus { background: rgba(255,255,255,0.05); color: var(--on-dark); }
  .nav.is-menu-open .nav-links > li.is-active > a { background: rgba(255,255,255,0.06); color: var(--on-dark); }

  /* In-menu CTA → full-width pill */
  .nav-cta-mobile { display: block; }
  .nav.is-menu-open .nav-links > li.nav-cta-mobile { border-top: 1px solid var(--bhcr-line); padding: 16px 24px 18px; }
  .nav.is-menu-open .nav-links > li.nav-cta-mobile > a {
    display: flex; align-items: center; justify-content: center; width: 100%;
    padding: 13px 20px; font-size: 15px; border-radius: 999px; font-weight: 600;
    background: var(--bhcr-blue); color: #04121c;
  }
  .nav.is-menu-open .nav-links > li.nav-cta-mobile > a:hover { background: #58C6F0; color: #04121c; }
}
@media (max-width: 560px) { .b-foot-grid { grid-template-columns: 1fr; } }

/* ============================================================
   GTranslate — dark theme for the BHCR nav. Overrides site.css's
   light Eco-Kold styling (loads later → equal-specificity !important wins).
   ============================================================ */
.gtranslate_wrapper .gt_switcher .gt_selected a {
  border-color: var(--hairline-on-dark-2) !important;
  color: var(--on-dark-muted) !important;
}
.gtranslate_wrapper .gt_switcher .gt_selected a:hover,
.gtranslate_wrapper .gt_switcher .gt_selected a.open {
  border-color: var(--bhcr-blue) !important;
  background: rgba(255,255,255,0.05) !important;
  color: var(--on-dark) !important;
}
.gtranslate_wrapper .gt_switcher .gt_selected a img,
.gtranslate_wrapper .gt_switcher .gt_option a img {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.14) !important;
}
.gtranslate_wrapper .gt_switcher .gt_option {
  background: #0D141E !important;
  border-color: var(--bhcr-line) !important;
  box-shadow: 0 24px 48px rgba(0,0,0,0.5) !important;
}
.gtranslate_wrapper .gt_switcher .gt_option a { color: var(--on-dark-dim) !important; }
.gtranslate_wrapper .gt_switcher .gt_option a:hover {
  background: rgba(255,255,255,0.06) !important;
  color: var(--on-dark) !important;
}
.gtranslate_wrapper .gt_switcher .gt_option a.gt_current { background: rgba(255,255,255,0.06) !important; }
@media (max-width: 1024px) {
  .nav.is-menu-open .nav-links > .gt-mobile-li {
    background: #070B12 !important;
    border-top-color: var(--bhcr-line) !important;
  }
}
