/* Preview-only visual language: one architectural diagram, one icon family. */
:root {
  --bc-visual-ink: #edf3e8;
  --bc-visual-muted: #b8cbb8;
  --bc-visual-line: #5c795b;
  --bc-visual-accent: #b9dd9f;
  --bc-visual-panel: #1b2d21;
  --bc-visual-core: #2b4230;
  --bc-visual-module: #1e3325;
}
html[data-theme="light"] {
  --bc-visual-ink: #203626;
  --bc-visual-muted: #47654d;
  --bc-visual-line: #8aa580;
  --bc-visual-accent: #447931;
  --bc-visual-panel: #f7faf2;
  --bc-visual-core: #e2efd8;
  --bc-visual-module: #f7faf2;
}
.bc-symbol { display:block; width:32px; height:32px; flex:none; }
#root .hero.entry-preview.bc-visual-hero {
  display:grid; grid-template-columns:minmax(0,1.28fr) minmax(360px,1fr);
  align-items:center; gap:clamp(32px,4vw,80px); min-height:680px;
  padding:150px max(28px,calc((100vw - 1360px)/2)) 76px;
}
#root .hero.entry-preview.bc-visual-hero .hero-content { width:auto; min-width:0; max-width:none; }
#root .hero.entry-preview.bc-visual-hero h1 { font-size:clamp(48px,4.5vw,72px); line-height:1.04; }
#root .hero.entry-preview.bc-visual-hero .ambient { display:none; }
.bc-architecture-visual { position:relative; z-index:1; margin:0; width:100%; max-width:550px; justify-self:end; }
.bc-architecture-visual figcaption { display:flex; justify-content:space-between; gap:20px; margin:0 22px 12px; padding-bottom:14px; border-bottom:1px solid var(--bc-visual-line); font:600 11px/1.5 var(--ui-font); letter-spacing:.12em; text-transform:uppercase; color:var(--bc-visual-muted); }
.bc-architecture-visual>svg { width:100%; height:auto; overflow:visible; display:block; }
.bc-architecture-visual svg text { font-family:var(--ui-font); fill:var(--bc-visual-ink); }
.bc-diagram-panel { fill:var(--bc-visual-panel); stroke:var(--bc-visual-line); }
.bc-diagram-core { fill:var(--bc-visual-core); stroke:var(--bc-visual-accent); stroke-width:1.5; }
.bc-diagram-module { fill:var(--bc-visual-module); stroke:var(--bc-visual-line); }
.bc-diagram-rail { fill:none; stroke:var(--bc-visual-line); stroke-width:1.25; }
.bc-diagram-connector { fill:none; stroke:var(--bc-visual-accent); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.bc-diagram-joint { fill:var(--bc-visual-accent); }
.bc-diagram-divider { stroke:var(--bc-visual-line); stroke-width:1; }
.bc-architecture-visual .bc-diagram-number { font-size:12px; letter-spacing:.06em; fill:var(--bc-visual-muted); }
.bc-diagram-title { font-size:24px; font-weight:500; letter-spacing:-.6px; }
.bc-architecture-visual .bc-diagram-subtitle { font-size:14px; fill:var(--bc-visual-muted); }
.bc-diagram-module-label { font-size:13px; text-anchor:middle; font-weight:500; }
.bc-diagram-guardrails { margin:-4px 22px 0; display:flex; align-items:center; justify-content:center; gap:9px; color:var(--bc-visual-ink); font:500 12px/1.5 var(--ui-font); text-align:center; }
.bc-diagram-guardrails .bc-symbol { width:21px; height:21px; color:var(--bc-visual-accent); }
#root .service-card .service-icon.bc-service-symbol { display:flex; justify-content:center; align-items:center; width:60px; height:60px; margin-bottom:26px; border:1px solid var(--bc-visual-line); background:var(--bc-visual-panel); color:var(--bc-visual-accent); border-radius:3px; }
#root .service-card .service-icon.bc-service-symbol .bc-symbol { width:36px; height:36px; }
.bc-mobile-architecture { display:none; }
@media (min-width:701px) and (max-width:1050px) {
  #root .hero.entry-preview.bc-visual-hero { grid-template-columns:minmax(0,1fr); gap:42px; padding-inline:40px; min-height:0; }
  #root .hero.entry-preview.bc-visual-hero .hero-content { max-width:700px; }
  #root .hero.entry-preview.bc-visual-hero h1 { font-size:clamp(45px,6vw,60px); }
  .bc-architecture-visual { max-width:520px; justify-self:center; }
}
@media (max-width:700px) {
  .mobile-home .bc-mobile-architecture { display:block; margin:24px 0 0; padding:17px 0 12px; border-top:1px solid var(--mb-line); border-bottom:1px solid var(--mb-line); }
  .bc-mobile-stages { display:grid; grid-template-columns:1fr 16px 1.3fr 16px 1fr; gap:3px; align-items:center; }
  .bc-mobile-stages>div { display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0; }
  .bc-mobile-stages .bc-symbol { width:27px; height:27px; color:var(--mb-accent); }
  .bc-mobile-stages>div>span { font:500 12px/1.3 var(--ui-font); text-align:center; color:var(--mb-ink); }
  .bc-stage-arrow { color:var(--mb-accent); align-self:start; line-height:27px; }
  .mobile-home .bc-mobile-architecture figcaption { font:400 11px/1.4 var(--ui-font); color:var(--mb-muted); text-align:center; margin-top:13px; }
  .mobile-home .mb-number.bc-mobile-service-symbol { align-self:flex-start; padding:0; margin-top:1px; }
  .bc-mobile-service-symbol .bc-symbol { width:26px; height:26px; }
  .mobile-home .mb-service>summary { gap:12px; }
}
@media (prefers-reduced-motion:reduce) { .bc-architecture-visual * { animation:none!important; transition:none!important; } }