/* Home — hero variant B: hero A's dark stage, laid out in two columns.
   Loaded only by index-hero-b.html, on top of home.css (.hero styles apply). */
.hb-grid{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  gap:clamp(28px,5vw,64px);align-items:center}
.hb-logo{width:min(340px,78%);height:auto;margin-bottom:clamp(20px,3vw,32px);
  color:var(--paper);--mark-counter:var(--ink-950)}
.hero-b h1{font-size:clamp(2.3rem,5.6vw,3.9rem);letter-spacing:-.035em;margin-bottom:16px}
.hero-b .hb-copy > p{color:rgba(255,255,255,.86);font-size:1.05rem;max-width:36ch;
  margin-bottom:clamp(22px,3vw,30px)}
.hb-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(24px,3.5vw,34px)}
.hb-tags .svc-tag{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.34);
  color:var(--paper);--mark-counter:var(--ink-950)}
.hb-stage-wrap .stage{margin:0;max-width:none}
.hero-b .hero-line{margin:26px 0 0;text-align:left;max-width:none;
  color:rgba(255,255,255,.72);font-size:clamp(1.05rem,2.1vw,1.35rem)}
.hero-b .hero-line em{color:var(--white)}
@media(max-width:900px){
  .hb-grid{grid-template-columns:1fr}
  .hb-logo{width:min(280px,70%);margin-left:auto;margin-right:auto}
  .hb-copy{text-align:center}
  .hero-b .hero-line{text-align:center}
  .hb-copy > p{margin-left:auto;margin-right:auto}
  .hb-tags{justify-content:center}
}
