/* B1 — Consulting Room. Same brand, unhurried: a wider measure, long leading,
   portraits given real height, and the practitioner accent carried in brand red
   rather than blue — because in this layout you are choosing a person. */
:root{ --ground:#FFFFFF; --surface:#FFFFFF; --tint:#FBEBE9; --rule:#E8EDF2;
  --r:12px; --r-lg:16px; --sec-y:5.5rem; --shell:1180px; --measure:72ch; }
body{ font-size:17.5px; line-height:1.75; }
.eyebrow{ color:var(--red-d); }
/* No label rail. The section label sits over the heading, and the asymmetry
   comes from the wide measure and the offset media inside prose-grid — which is
   what makes this feel unhurried rather than gridded. */
.sec:not(.hero) > .shell > .sec-in > div{ max-width:none; }
@media (min-width:1000px){
  .prose-grid.has-media{ grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:var(--s5); }
  .sec h2, .sec:not(.hero) h1{ max-width:20ch; }
}
.hero-grid.has-media{ align-items:end; }
.portrait{ aspect-ratio:3/4; background:var(--tint); }
.portrait span{ color:var(--red-d); }
.card .s{ color:var(--red-d); }
.choice{ padding:var(--s4); }
.choice .sub{ color:var(--red-d); }
.choice:hover{ border-color:var(--red); }
.choice .go{ color:var(--red-d); }
.quote{ background:#FCFDFE; }
.quote blockquote{ font-size:1.12rem; line-height:1.6; }
.tags li{ background:var(--tint); color:var(--red-d); }
.notice{ background:var(--tint); }