/* ============================================================
   BRAND SITE CHROME — public header & footer for brand pages.
   Uses brand CSS variables set by Platform.applyBrand().
   ============================================================ */
.bs-wrap{ max-width:1120px; margin:0 auto; padding:0 40px; }
@media(max-width:680px){ .bs-wrap{ padding:0 22px; } }

/* header */
#site-header{ position:sticky; top:0; z-index:60; background:color-mix(in srgb, var(--mist) 86%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
#site-header .bs-wrap{ display:flex; align-items:center; gap:22px; height:64px; }
.bs-brand{ display:flex; align-items:center; gap:11px; text-decoration:none; flex:0 1 auto; min-width:0; }
.bs-brand img.bs-icon{ height:36px; width:auto; max-width:46px; display:block; flex:none; }
.bs-brand img.bs-lock{ height:34px; width:auto; max-width:230px; display:block; }
.bs-brand .bs-mono{ width:34px; height:34px; border-radius:9px; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:800; flex:none; }
.bs-brand .bs-name{ font-family:var(--font-display); font-weight:800; font-size:15px; color:var(--navy); letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bs-nav{ display:flex; gap:22px; margin-left:8px; min-width:0; }
.bs-nav a:focus-visible, .bs-btn:focus-visible, .b-btn:focus-visible, .bs-brand:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; border-radius:6px; }
.bs-nav a{ font-family:var(--font-display); font-size:13.5px; font-weight:600; color:var(--text-muted); text-decoration:none; display:inline-flex; align-items:center; gap:5px; }
.bs-nav a:hover{ color:var(--primary); }
.bs-nav a.on{ color:var(--primary); }
.bs-nav .lock{ font-size:10px; opacity:.6; }
.bs-actions{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.bs-btn{ font-family:var(--font-display); font-weight:700; font-size:13px; color:#fff; background:var(--primary); border-radius:9px; padding:9px 16px; text-decoration:none; border:0; cursor:pointer; }
.bs-btn:hover{ background:var(--secondary); }
.bs-btn.ghost{ background:transparent; color:var(--primary); border:1px solid var(--line-strong); }
.bs-btn.ghost:hover{ background:var(--cloud); }
@media(max-width:760px){ .bs-nav{ display:none; } }

/* footer */
#site-footer{ background:var(--navy); color:var(--steel-300); padding:42px 0; margin-top:0; }
#site-footer .bs-wrap{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.bs-flogo{ height:42px; width:auto; max-width:230px; opacity:.95; }
.bs-fmeta{ line-height:1.5; }
.bs-fbrand{ font-family:var(--font-display); font-weight:800; color:#fff; font-size:15px; }
.bs-frights{ font-size:12.5px; color:var(--steel-400); margin-top:2px; }
.bs-fcredit{ margin-left:auto; font-size:12.5px; color:var(--steel-400); max-width:340px; text-align:right; }
.bs-fcredit a{ color:var(--steel-200); text-decoration:none; }
@media(max-width:680px){ .bs-fcredit{ margin-left:0; text-align:left; width:100%; } }

/* shared buttons used on brand content pages */
.b-btn{ font-family:var(--font-display); font-weight:700; font-size:14px; border-radius:10px; padding:11px 18px; border:1px solid var(--line-strong); background:#fff; color:var(--navy); cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; }
.b-btn:hover{ border-color:var(--primary); }
.b-btn.primary{ background:var(--primary); color:#fff; border-color:var(--primary); }
.b-btn.primary:hover{ background:var(--secondary); }

/* sign-in gate overlay (for private pages reached without session — fallback) */
.gate{ position:fixed; inset:0; background:var(--mist); display:flex; align-items:center; justify-content:center; z-index:200; }

/* ===== unified document hero (shared across guidelines / message&tone / logos / clear-space) ===== */
.bs-hero{ display:block; background:var(--navy); color:var(--mist); position:relative; overflow:hidden; padding:84px 0 70px; }
.bs-hero .bs-wrap{ position:relative; z-index:2; }
.bs-hero-wm{ position:absolute; right:-110px; top:50%; transform:translateY(-50%); width:500px; z-index:1; }
.bs-hero-crest{ height:96px; width:auto; display:block; margin-bottom:30px; }
.bs-hero-title{ font-family:var(--font-display); font-weight:800; font-size:58px; line-height:1; color:#fff; letter-spacing:-.01em; margin:0; }
.bs-hero-sub{ font-family:var(--font-display); font-weight:600; font-size:22px; color:var(--steel-300); margin-top:16px; }
.bs-hero-meta{ margin-top:38px; display:flex; gap:46px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,.16); padding-top:22px; }
.bs-hero-meta span{ display:block; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--steel-400); margin-bottom:5px; }
.bs-hero-meta b{ font-family:var(--font-display); font-weight:600; font-size:15px; color:var(--mist); }
@media(max-width:680px){ .bs-hero-title{ font-size:42px; } }

/* print fallback for the shared chrome (content pages may also hide it) */
@media print{
  #site-header{ position:static; background:#fff; border-bottom:1px solid #ccc; -webkit-backdrop-filter:none; backdrop-filter:none; }
  #site-header .bs-actions, #site-header .bs-nav{ display:none; }
  #site-footer{ background:#fff; color:#333; padding:20px 0; }
  #site-footer .bs-fbrand{ color:#000; }
  #site-footer .bs-fcredit a{ color:#333; }
  .bs-hero{ background:#fff; color:#000; padding:24px 0; }
  .bs-hero-wm{ display:none; }
  .bs-hero-title, .bs-hero-sub, .bs-hero-meta b{ color:#000; }
  .bs-hero-meta span{ color:#555; }
}
