/*
  brand-2026.css: the shared layer of the look-only restyle of 2026-11 (Jose, 2026-11-11: "Apply the redesign to the
  whole pages except by the blogs and the PDFs"; words never change). The plan: docs/rebrand/v2/restyle-2026-11
  (PLAN.md 1.3 to 1.6, CRITIQUE.md, DECISIONS.md, which wins).

  Loaded on every restyled page but /leadership-default and the two utility pages (the download link page and the
  letters screens), after the page's old stylesheets and before its family sheet (service-pages-2026.css or
  site-2026.css), its own *-2026.css and site-chrome.css, which stays last (src/rebrand/v2/restyle-2026.ts
  restyleSheetsFor). The renderers put the scope class b26 on <body> (the guides' 404, which does not own its <body>:
  on a wrapper <div>), and every rule here sits under it, so nothing reaches a page without it: the home, the guides
  and /methods never carry it.

  - The tokens: the brief's block word for word (docs/rebrand/v2/home-2026-11/package/BRIEF.md, "Copy into
    brand-2026.css"), declared on .b26, not :root; the home's other values under --b26- names.
  - The old stylesheets' font and layout variables point to the brief's, so every old rule draws in Funnel Display and
    Albert Sans at 1,200 px (Anton, Fraunces and Inter Tight are never downloaded). Their color variables are each
    family sheet's (PLAN 1.5).
  - The base: the bone page, the text color, Albert Sans 17 px; the blue selection; the 3 px focus ring inside <main>,
    in the color --b26-focus names (blue; a dark band sets it to white for everything inside it).
  - Emphasis in running text: weight 600, the text's own color, never italic (DECISIONS 6). A heading's em keeps the
    heading's weight; its orange phrase is the family sheet's.
  - The book buttons inside the page (.b26 #main a.cta-call): the home's orange main button with midnight words, at
    (1,2,1), which beats every rule of the later site-chrome.css; #main keeps it off the chrome's two buttons, which sit
    outside <main>. Their arrow is hidden, as the home's buttons have none, but on /apply's phone bar (.apx-sticky),
    whose arrow turns to show where the calendar is (DECISIONS 6).
  It declares no font and loads no other file (the fonts are site-chrome.css's), and it uses no shadow, no gradient, no
  capitals and no important flag.
*/

/* The brief's tokens, word for word, on the scope class */
.b26 {
  --bone: #FBFAF6;
  --white: #FFFFFF;
  --midnight: #0B1020;
  --text: #2B3245;
  --text-muted: #565E70;
  --border: #E4E2DC;
  --divider: #DCD9D1;
  --orange: #FF6B2C;
  --orange-text: #E8551A;
  --blue: #2D5BFF;
  --on-dark: #C9D0E0;
  --on-dark-muted: #A9B3CC;
  --font-heading: 'Funnel Display', 'Albert Sans', system-ui, sans-serif;
  --font-body: 'Albert Sans', system-ui, sans-serif;
  --radius: 8px;
  --content-width: 1200px;
}

/* The home's values the brief does not name (PLAN 1.4) */
.b26 {
  --b26-orange-hover: #F25A1A;
  --b26-on-blue: #EEF2FF;
  --b26-rule-dark: rgba(255, 255, 255, 0.18);
  --b26-rule-dark-strong: rgba(255, 255, 255, 0.22);
  --b26-rule-blue: rgba(255, 255, 255, 0.6);
  --b26-field-border: #D9D6CE;
  --b26-soon-border: #B9B5AC;
  --b26-red-tag: #C51D43;
  --b26-px: clamp(20px, 5vw, 64px);
  --b26-section-y: clamp(72px, 8vw, 112px);
  --b26-section-y-lg: clamp(80px, 9vw, 128px);
  --b26-max: calc(var(--content-width) + 2 * var(--b26-px));
  --b26-h1: clamp(42px, 4.6vw, 66px);
  --b26-h2: clamp(34px, 3.6vw, 52px);
  --b26-h2-band: clamp(36px, 4vw, 58px);
  --b26-h3: clamp(22px, 1.9vw, 26px);
  --b26-h3-lg: clamp(28px, 2.8vw, 40px);
  --b26-lead: clamp(18px, 1.5vw, 21px);
  --b26-quote: clamp(24px, 2.4vw, 34px);
  --b26-num: clamp(48px, 5vw, 72px);
  --b26-stat: clamp(40px, 3.4vw, 48px);
  --b26-bar-w: 48px;
  --b26-bar-h: 6px;
  /* The focus ring's color on the surface it sits on: blue on bone and white; a midnight or blue band sets it white */
  --b26-focus: var(--blue);
}

/* The old stylesheets' fonts and layout (styles.css and service-pages.css name the same variables) */
.b26 {
  --display: var(--font-heading);
  --serif: var(--font-body);
  --sans: var(--font-body);
  --max: var(--b26-max);
  --px: var(--b26-px);
  --pad-x: var(--b26-px);
  --py: var(--b26-section-y);
  --pad-y: var(--b26-section-y);
  --r: var(--radius);
}

/* The page (at 0,1,0 it beats the old sheets' body rule) */
.b26 {
  background: var(--bone);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

.b26 ::selection {
  background: var(--blue);
  color: var(--white);
}

.b26 #main :focus-visible {
  outline: 3px solid var(--b26-focus);
  outline-offset: 3px;
}

/* Emphasis in running text: weight 600, its text's color (never midnight on midnight or blue), not italic (DECISIONS 6).
   At 0,1,0, so a family rule for a heading's phrase wins; a heading's em keeps the heading's weight. */
.b26 :where(#main em) {
  font-style: normal;
  font-weight: 600;
  color: inherit;
}

.b26 :where(#main :is(h1, h2, h3, h4, h5, h6) em) {
  font-weight: inherit;
}

/* The book buttons inside the page: the home's main button (orange, midnight words, 8 px corners, 56 px tall) */
.b26 #main a.cta-call {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 28px;
  border: 0;
  border-radius: var(--radius);
  background: var(--orange);
  color: var(--midnight);
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: normal;
  text-transform: none;
  text-decoration: none;
  transform: none;
}

.b26 #main a.cta-call:hover {
  background: var(--b26-orange-hover);
  color: var(--midnight);
}

.b26 #main a.cta-call.btn-sm {
  min-height: 48px;
  padding: 0 22px;
  font-size: 16px;
}

/* No arrow, as on the home; /apply's phone bar keeps its arrow, which turns to show where the calendar is */
.b26 #main a.cta-call svg {
  display: none;
}

.b26 #main .apx-sticky a.cta-call svg {
  display: block;
}