/* HouseChalk type.
 *
 * TWO BRANDS, ONE SET OF ROLES (October 2026). The HouseChalk app sets every
 * word in Figtree and gets its hierarchy from WEIGHT: titles, block titles,
 * figures and section heads are 800, body stays 400. The consulting portal
 * (`data-hc-brand="consulting"` on any ancestor) sets the DISPLAY roles in
 * Fraunces at 600 and leaves everything you read or press in Figtree.
 *
 * COMPONENTS NAME A ROLE, NEVER A FACE OR A WEIGHT. A screen title reads
 * --title-*, a card or block title --block-*, a large number --figure-*, a
 * section head --section-*. The brand layer below re-points those roles; no
 * component knows which brand it is in. If a component sets fontWeight 800 on
 * a title directly, the consulting brand cannot reach it — that is a bug.
 *
 * THE DISPLAY FACE IS FOR DISPLAY ROLES ONLY. Fraunces never sets body copy, a
 * button, a field, a chip or a row name. --font-display is for the four roles
 * above and the coach's quoted words; everything else is --font-body.
 *
 * AS TYPE GETS LARGER IT GETS TIGHTER. Nothing above --text-lg is set without
 * a negative track.
 *
 * THE OLD RULE — "a title is regular weight; only the phrase that matters goes
 * to 800" — no longer holds in the app: an 800 title has no heavier step for
 * the phrase. Emphasis inside an app title is now carried by word choice. The
 * consulting brand keeps it (600 title, 800 phrase).
 */
:root{
  --font-display:"Figtree","DM Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --font-body:"Figtree","DM Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,monospace;

  --text-3xl:42px;  /* the arrival title — a screen with one thing on it */
  --text-2xl:33px;  /* the screen title (app) */
  --text-xl:27px;   /* a sheet's or blocking state's title */
  --text-lg:21px;   /* the block title — cards and bare blocks alike */
  --text-md:18px;   /* a lead sentence, an option name */
  --text-base:16px; /* body */
  --text-sm:15px;   /* a supporting sentence */
  --text-xs:13.5px; /* metadata */
  --text-2xs:12px;  /* chips, the eyebrow */
  --text-3xs:11px;

  --leading-display:1.04;
  --leading-tight:1.14;
  --leading-snug:1.28;
  --leading-meta:1.35;    /* the short line that is not prose — a timestamp, a source,
                            the working under a figure. One to three lines that
                            want air between them without reading as a paragraph.
                            Without this rung metadata took --leading-body and
                            sat looser than the sentence it was annotating. */
  --leading-body:1.55;
  --leading-relaxed:1.62;

  --tracking-display:-0.03em;  /* --text-2xl and above */
  --tracking-title:-0.02em;    /* --text-lg and --text-xl */
  --tracking-eyebrow:0.13em;
  --tracking-smallcaps:0.1em;  /* the 11px label under a figure. NOT the eyebrow:
                                  the eyebrow is 12px/0.13em in accent ink and
                                  names a SECTION; this labels a NUMBER. One step
                                  for both made the hero plate read as three
                                  sections. */

  --weight-regular:400;
  --weight-medium:500;
  --weight-semibold:600;
  --weight-bold:800;           /* app display roles and in-sentence emphasis */
  /* ---- Roles. App defaults: Figtree, hierarchy by weight. ---- */
  --display-variation:normal;   /* font-variation-settings for display roles */
  --title-family:var(--font-display);
  --title-size:var(--text-2xl);       /* the screen title — 33 */
  --title-size-hero:var(--text-3xl);  /* the arrival title — 42 */
  --title-weight:800;
  --title-strong:800;                 /* a phrase inside the title */
  --title-track:-0.035em;
  --title-leading:1.06;
  --block-family:var(--font-display);
  --block-size:var(--text-lg);        /* a card or bare block's title — 21 */
  --block-weight:800;
  --block-track:-0.02em;
  --figure-family:var(--font-display);
  --figure-weight:800;
  --figure-track:-0.035em;
  --section-family:var(--font-body);
  --section-size:17px;
  --section-weight:800;
  --section-track:-0.01em;
  --section-case:none;
}

/* ---- The consulting brand: Fraunces display, softened, at 600. ---- */
[data-hc-brand="consulting"]{
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --display-variation:"SOFT" 60, "WONK" 0;
  /* The role families are re-declared here, not inherited: a custom property
     holding var(--font-display) resolves where it is DECLARED, so the :root
     copies would still say Figtree inside this subtree. */
  --title-family:var(--font-display);
  --block-family:var(--font-display);
  --figure-family:var(--font-display);
  --title-size:32px;
  --title-weight:600;
  --title-strong:800;
  --title-track:-0.015em;
  --title-leading:1.1;
  --block-weight:600;
  --block-track:-0.005em;
  --figure-weight:600;
  --figure-track:-0.02em;
  --section-family:var(--font-display);
  --section-size:18px;
  --section-weight:600;
  --section-track:-0.01em;
}

/* A phrase inside a title (ScreenHead, HeroPlate, BlockingState) takes the
   brand's strong weight. In the app the title is already 800, so this changes
   nothing; in the consulting brand it lifts the phrase from 600 to 800. */
[data-hc-title] strong,[data-hc-title] b{font-weight:var(--title-strong)}

/* Public intro frames use a compact identity and booking-specific title roles. */
[data-hc-brand="consulting"] {
  --intro-heading-size:24px;
  --intro-phone-heading-size:22px;
  --intro-phone-identity-size:26px;
  --intro-label-size:13px;
  --intro-phone-reading-size:14px;
}