/* Enable Exercise — theme stylesheet. Built from three parts, in order: (1) the Modernist design-system tokens and component classes, with its Google Fonts @import removed (Archivo is served by theme.json fontFace); (2) the Enable Exercise site layer, verbatim; (3) the WordPress adaptation block. Edit the source parts in design-src/ and rebuild; do not hand-edit parts 1 and 2. */

/* ═══ Part 1: Modernist tokens and components (design-src/modernist-styles.css, minus @import) ═══ */
/* Modernist — design-system tokens and component classes. This file is the source of truth for the system's look; retune it here and see readme.md. */

:root {
  --color-bg: #f3f2f2;
  --color-surface: #eae9e9;
  --color-text: #201e1d;
  --color-accent: #ec3013;
  --color-accent-2: #e15b47;
  --color-divider: color-mix(in srgb, #201e1d 40%, transparent);

  /* Tonal ramps — generated in OKLCH on one shared lightness scale, so the
     same step of any role matches the others in visual value. */
  --color-neutral-100: #f8f4f4;
  --color-neutral-200: #eae7e7;
  --color-neutral-300: #d7d3d3;
  --color-neutral-400: #bab6b6;
  --color-neutral-500: #9b9797;
  --color-neutral-600: #7d7979;
  --color-neutral-700: #605d5d;
  --color-neutral-800: #444141;
  --color-neutral-900: #2d2b2b;

  --color-accent-100: #fff2ef;
  --color-accent-200: #ffe0d9;
  --color-accent-300: #ffc4b8;
  --color-accent-400: #ff9783;
  --color-accent-500: #ff563c;
  --color-accent-600: #dd2b0f;
  --color-accent-700: #ae1800;
  --color-accent-800: #7c1405;
  --color-accent-900: #4d170e;

  --color-accent-2-100: #fff2ef;
  --color-accent-2-200: #ffe0da;
  --color-accent-2-300: #ffc4b9;
  --color-accent-2-400: #ff9784;
  --color-accent-2-500: #ef6853;
  --color-accent-2-600: #c94b39;
  --color-accent-2-700: #9e3526;
  --color-accent-2-800: #71261b;
  --color-accent-2-900: #471d16;

  --font-heading: "Archivo", system-ui, sans-serif;
  --font-heading-weight: 800;
  --font-body: "Archivo", system-ui, sans-serif;

  --space-1: 4.0px;
  --space-2: 8.0px;
  --space-3: 12.0px;
  --space-4: 16.0px;
  --space-6: 24.0px;
  --space-8: 32.0px;

  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;

  /* Elevation — derived from the ground: soft ink-tinted shadows on a
     light theme, a hairline edge + ambient darkness on a dark one. */
  --shadow-sm: 0 1px 2px color-mix(in srgb, #2d2b2b 14%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #2d2b2b 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #2d2b2b 22%, transparent);
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
}
h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: var(--font-heading-weight); }

.grayscale{filter:grayscale(1) contrast(1.08)}

/* ══════════════════════════════════════════════════════════════════════════
   Components — built with the tokens above. Plain CSS
   on plain HTML: no JavaScript, no build step. Each class is documented in
   readme.md and demonstrated in foundations/ and components/.
   ══════════════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-size: 15px; line-height: 1.55; font-weight: 400; }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  line-height: 1.12; letter-spacing: -0.015em; margin: 0 0 var(--space-2);
}
h1 { font-size: 42px; }
h2 { font-size: 32px; }
h3 { font-size: 25px; }
h4 { font-size: 20px; }
h5 { font-size: 16px; }
h6 { font-size: 13px; }
h6 { letter-spacing: 0.08em; text-transform: uppercase; }
p { margin: 0 0 var(--space-3); }
a { color: var(--color-accent); text-underline-offset: 3px; }
img { display: block; max-width: 100%; }
figure { margin: 0; }
figcaption {
  font-size: 11px; margin-top: var(--space-1);
  color: color-mix(in srgb, var(--color-text) 55%, transparent);
}
.text-muted { color: color-mix(in srgb, var(--color-text) 55%, transparent); }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
::selection { background: color-mix(in srgb, var(--color-accent) 30%, transparent); }

/* — rules — */
.hr {
  height: 2px; border: 0; margin: var(--space-4) 0;
  background: var(--color-divider);
}

/* — buttons — */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; text-decoration: none;
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  font-size: 14px; line-height: 1.2; color: var(--color-text); /* matches the .input's 14px —
     the pair sits side by side in sign-up rows */
  background: transparent; border: 1px solid transparent;
  padding: var(--space-2) calc(var(--space-3) * 1.2);
  border-radius: var(--radius-md);
}
.btn svg { display: block; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.btn-primary { background: var(--color-accent); color: var(--color-bg); }
.btn-primary:hover { background: var(--color-accent-600); }
.btn-primary:active { background: var(--color-accent-700); }
.btn-secondary { border-color: var(--color-divider); }
.btn-secondary:hover { background: color-mix(in srgb, var(--color-text) 7%, transparent); }
.btn-secondary:active { background: color-mix(in srgb, var(--color-text) 14%, transparent); }
.btn-ghost { color: var(--color-accent); padding-inline: var(--space-1); }
.btn-ghost:hover { background: color-mix(in srgb, var(--color-accent) 10%, transparent); }
.btn-ghost:active { background: color-mix(in srgb, var(--color-accent) 18%, transparent); }
.btn-icon { width: 36px; height: 36px; padding: 0; }
.btn-block { width: 100%; margin-top: var(--space-2); justify-content: flex-start; text-align: left; }

/* — forms — */
.field > label {
  display: block; font-size: 12px; margin-bottom: 5px;
  color: color-mix(in srgb, var(--color-text) 70%, transparent);
}
.input {
  width: 100%; min-height: 36px; padding: 6px 10px; font: inherit;
  font-size: 14px; color: var(--color-text); caret-color: var(--color-accent);
  background: var(--color-surface);
  border: 1px solid var(--color-divider); border-radius: var(--radius-md);
}
.input:hover { border-color: color-mix(in srgb, var(--color-text) 45%, transparent); }
.input:focus-visible { border-color: var(--color-accent); outline-offset: 0; }
textarea.input { min-height: 90px; resize: vertical; }
.radio { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; }
.radio input, .seg-opt input {
  position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none;
}
.radio .dot {
  width: 16px; height: 16px; flex: none; border-radius: 50%;
  border: 1.5px solid var(--color-divider);
}
.radio:hover .dot { border-color: var(--color-accent); }
.radio input:checked + .dot {
  border-color: var(--color-accent); background: var(--color-accent);
  box-shadow: inset 0 0 0 4px var(--color-bg);
}
.radio input:focus-visible + .dot { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.seg {
  display: inline-flex; overflow: hidden;
  border: 1px solid var(--color-divider); border-radius: var(--radius-md);
}
.seg-opt {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px; font-size: 13px; cursor: pointer;
}
.seg-opt + .seg-opt { border-left: 1px solid var(--color-divider); }
.seg-opt:has(input:checked) { background: var(--color-accent); color: var(--color-bg); }
.seg-opt:not(:has(input:checked)):hover { background: color-mix(in srgb, var(--color-text) 7%, transparent); }
.seg-opt:has(input:focus-visible) { outline: 2px solid var(--color-accent); outline-offset: -2px; }

/* — cards — */
.card {
  display: flex; flex-direction: column; gap: var(--space-2);
  padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-surface);
}
.card-kicker { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-accent); }
.card-title {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  font-size: 17px; line-height: 1.2;
}
.card-body { margin: 0; font-size: 13px; opacity: 0.8; flex: 1; }
.card-meta {
  display: flex; align-items: center; gap: 6px; font-size: 11px;
  color: color-mix(in srgb, var(--color-text) 50%, transparent);
}
.elev-sm { box-shadow: var(--shadow-sm); }
.elev-md { box-shadow: var(--shadow-md); }
.elev-lg { box-shadow: var(--shadow-lg); }

/* — tags — */
.tag {
  display: inline-flex; align-items: center; font-size: 11px;
  letter-spacing: 0.02em; padding: 3px 10px;
  border-radius: calc(var(--radius-md) * 0.75);
}
.tag-accent { background: var(--color-accent-100); color: var(--color-accent-800); }
.tag-accent-2 { background: var(--color-accent-2-100); color: var(--color-accent-2-800); }
.tag-neutral { background: var(--color-neutral-100); color: var(--color-neutral-800); }
.tag-outline { border: 1px solid var(--color-accent); color: var(--color-accent); }

/* — navigation — */
.nav {
  display: flex; align-items: center; gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border-bottom: 2px solid var(--color-divider);
}
.nav-brand {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  font-size: 18px; margin-right: auto;
}
.nav a { color: inherit; text-decoration: none; font-size: 14px; }
.nav a:hover, .nav a[aria-current='page'] { color: var(--color-accent); }

/* — tables — */
.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th {
  text-align: left; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: color-mix(in srgb, var(--color-text) 60%, transparent);
  padding: var(--space-2); border-bottom: 2px solid var(--color-divider);
}
.table td {
  padding: var(--space-2);
  border-bottom: 1px solid var(--color-divider);
}
.table tbody tr:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }

/* — dialog — */
.dialog-backdrop {
  position: fixed; inset: 0; display: grid; place-items: center;
  padding: var(--space-4);
  background: color-mix(in srgb, var(--color-neutral-900) 50%, transparent);
}
.dialog {
  width: min(440px, 100%); display: flex; flex-direction: column; gap: var(--space-3);
  padding: var(--space-4); border-radius: var(--radius-lg);
  background: var(--color-surface); box-shadow: var(--shadow-lg);
}
.dialog-title {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  font-size: 20px;
}
.dialog-body { font-size: 14px; opacity: 0.85; }
.dialog-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-2); }


/* ═══ Part 2: Enable Exercise site layer (design-src/ee.css, verbatim) ═══ */
/* Enable Exercise — site layer over the Modernist tokens. Brand red replaces the system accent; type and controls are scaled up for WCAG AA (18px body, 48px targets). */
/* Round 3: white hero, then beige / white / beige; one dark band per page only for "how we work"; footer dark. Red roles: buttons and links, large numerals, red rules under headings and statements, one bold red gesture per page (.red). Eyebrows and bullets are ink. */
:root{--color-accent:#D80000;--color-accent-600:#b80000;--color-accent-700:#940000;--color-accent-800:#6a0000;--color-text:#221E1B;--color-divider:#221E1B;--color-bg:#F7F3EC;--color-surface:#EFE8DC;--color-neutral-200:#EDE6DA;--color-neutral-300:#DCD3C6;--color-neutral-400:#B8AFA3;--color-neutral-700:#635C56;--color-neutral-800:#45403B;--on-accent:#F7F3EC;--beige:#EDE5D8}
/* Canonical: any text sitting on brand red is the cream ground (--on-accent), never black or pure white. */
.ee .grayscale,.ee .grayscale *{filter:none}
html{scroll-behavior:smooth}
body{margin:0;font-size:18px;line-height:1.55;text-wrap:pretty;background:#fff;color:var(--color-text)}
.ee{container-type:inline-size;background:#fff;color:var(--color-text);font-size:18px;line-height:1.55;min-width:0}
.ee h1{font-size:clamp(44px,5.4cqi,68px);line-height:1.02;letter-spacing:-0.025em;margin:0}
.ee h2{font-size:clamp(30px,3.2cqi,40px);line-height:1.08;letter-spacing:-0.015em;margin:0}
.ee h3{font-size:24px;line-height:1.2;margin:0}
.ee h4{font-size:20px;line-height:1.25;margin:0}
.ee p{margin:0}
.ee ul{margin:0;padding:0;list-style:none}
.ee a{color:var(--color-text)}
.ee a:hover{color:var(--color-accent-700)}
/* Display scale: hero and statement lines */
.display{font-family:var(--font-heading);font-weight:800;font-size:clamp(52px,7.2cqi,96px);line-height:.98;letter-spacing:-0.03em;margin:0}
.stmt{font-family:var(--font-heading);font-weight:800;font-size:clamp(40px,6cqi,84px);line-height:1;letter-spacing:-0.028em;margin:0;text-wrap:balance}
.red{color:var(--color-accent)}
.rrule{display:block;width:72px;height:4px;background:var(--color-accent);border:0;margin:0}
.sechead{display:grid;gap:0}
span.kicker{display:none}
.sechead::after{content:"";display:block;width:56px;height:4px;background:var(--color-accent);margin-top:18px}
.quote{display:grid;gap:24px;margin:0;padding:0}
.quote p{font-family:var(--font-heading);font-weight:800;font-size:clamp(32px,4.6cqi,64px);line-height:1.06;letter-spacing:-0.022em;text-wrap:balance}
.quote cite{font-style:normal;font-size:17px;font-weight:600}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px;box-sizing:border-box;width:100%}
@container (min-width:900px){.wrap{padding-left:56px;padding-right:56px}}
.sec{padding-top:58px;padding-bottom:58px}
.rule{height:2px;background:var(--color-divider);border:0;margin:0}
.kicker{display:block;font-size:14px;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text);font-weight:600;margin:0 0 14px}
.navlink{display:flex;align-items:center;gap:4px;min-height:48px;padding:0 9px;font:600 16px/1.2 var(--font-heading);white-space:nowrap;text-decoration:none;color:inherit;background:none;border:0;border-bottom:3px solid transparent;cursor:pointer}
.navlink:hover{color:var(--color-accent-700)}
.navlink:focus-visible{outline:3px solid var(--color-accent);outline-offset:-3px}
.menulink{display:flex;align-items:center;min-height:40px;font-size:17px;font-weight:500;text-decoration:none;color:inherit}
.menulink:hover{color:var(--color-accent-700);text-decoration:underline}
.need{display:inline-block;border:2px dashed var(--color-accent);background:#fff;color:var(--color-accent-700);font-size:15px;font-weight:600;line-height:1.35;padding:6px 10px}
.tscroll{overflow-x:auto}.tscroll .table{min-width:560px}
.lede{font-size:21px;line-height:1.5;max-width:60ch}
.measure{max-width:62ch}
.small{font-size:16px;line-height:1.5}
.muted{color:var(--color-neutral-700)}
.grid{display:grid;gap:24px}
/* Canonical: every layout child may shrink below its content width, so long words, buttons and tables never widen a column */
.grid>*,.split>*,.split-l>*,.split-r>*,.split-rev>*,.imgled>*,.herodom>*,.ctaband>*,.step>*,.frow>*{min-width:0}
.ee h1,.ee h2,.ee h3,.stmt,.display,.quote p,.bignum{overflow-wrap:break-word}
/* Homepage video hero: full-bleed muted loop, poster on mobile and for reduced motion, text left on a dark scrim */
.herovid{position:relative;min-height:max(520px,calc(100vh - 82px - 2px - 172px));display:grid;align-items:stretch;overflow:hidden;background:#000}
.herovid>.photo,.herovid>video,.herovid>.scrim{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.herovid>video{object-fit:cover}
.herovid>.scrim{background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.66) 50%,rgba(0,0,0,.3) 100%)}
.herovid>.wrap{position:relative;z-index:1}
.herovid .display{font-size:56px}
@media (prefers-reduced-motion:reduce){.herovid>video{display:none}}
.classtable td:last-child,.classtable th:last-child{white-space:normal}
/* Mobile tables: stack each row as label/value pairs instead of sideways scroll */
@container (max-width:640px){.tscroll .table{min-width:0;width:100%}.table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.table tr{display:grid;gap:6px;padding:14px 0;border-top:2px solid var(--color-divider)}.table td{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px;padding:0;border:0}.table td::before{content:attr(data-label);font-size:14px;font-weight:600;color:var(--color-neutral-800)}.table td:first-child{grid-template-columns:minmax(0,1fr);font-weight:700}.table td:first-child::before{display:none}}
.tscroll{max-width:100%;min-width:0}
/* Canonical cell alignment: in any .grid, plain content cells (title + body) share row tracks via subgrid, so titles sit on one row and bodies start on one row across the band. Links, tiles, cards, photos and form fields are exempt; .nosub opts a grid out. */
.grid:not(.nosub)>div:not(.photo):not(.field),.grid:not(.nosub)>article:not(.door-cta),.grid:not(.nosub)>li,.grid:not(.nosub)>a.person,.grid:not(.nosub)>a.tile{display:grid;grid-template-rows:subgrid;grid-row:span 3;align-content:start}
.grid:not(.nosub)>a.tile{justify-content:stretch;gap:12px}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.c6{grid-template-columns:repeat(6,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:40px 56px;align-items:start}
.split-l{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split-r{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:32px 64px}
.split-r>:first-child{position:sticky;top:24px}
.split-rev{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:32px 64px}
.split-rev>:first-child{order:2;position:sticky;top:24px}
/* Canonical: text beside an image always starts at the image's top edge */
.split[style*="align-items:end"],.split-l[style*="align-items:end"]{align-items:start!important}
.imgled>div:not(.photo){align-content:start}
.imgled{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:32px 48px;align-items:start}
.imgled>.photo{aspect-ratio:3/2}
/* Hero on the homepage: image is the dominant element (62% of width) */
.herodom{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,8fr);gap:32px 48px;align-items:start}
/* Panels — full-bleed backgrounds; dark panels remap the tokens so every component inside flips automatically */
.pnl{width:100%}
.pnl-white{background:#fff}
.pnl-grey,.pnl-grey2,.pnl-sand,.pnl-beige{background:var(--beige);--color-surface:#F7F3EC;--color-neutral-200:#F7F3EC;--color-bg:var(--beige)}
.pnl-dark,.pnl-black{color:#fff;--color-text:#fff;--color-divider:#fff;--color-surface:#1A1715;--color-neutral-700:#D9D0C5;--color-neutral-800:#EDE6DA;--color-accent-700:#FFB4AC;--color-bg:#000}
.pnl-dark{background:#000}
.pnl-black{background:#000;--color-bg:#000;--color-surface:#1A1715}
.pnl-dark .tile:hover,.pnl-black .tile:hover,.pnl-dark .tab:hover,.pnl-black .tab:hover{background:#2A2624}
.pnl-dark a.door,.pnl-black a.door,.pnl-dark .door-cta,.pnl-black .door-cta{--color-text:#221E1B;color:#221E1B;--color-divider:#221E1B;--color-neutral-700:#635C56;--color-neutral-800:#45403B;--color-accent-700:#940000;border-color:#fff}
.pnl-dark .step-n,.pnl-black .step-n{color:#FF8A7A}
.pnl-dark .red{color:#FF8A7A}
.pnl-dark .rrule,.pnl-dark .sechead::after{background:#FF8A7A}
.pnl-dark :focus-visible,.pnl-black :focus-visible{outline-color:#fff}
.pnl-dark .input,.pnl-black .input{color:#161414}
.pnl-dark .btn-secondary:hover,.pnl-black .btn-secondary:hover{background:rgba(255,255,255,.15)}
.pnl-dark .table td,.pnl-black .table td,.pnl-dark .table th,.pnl-black .table th{border-color:#4A4441}
.desk{display:flex}.mob{display:none}img.desk{display:block}
.hdesk{display:flex}.hmob{display:none}img.hdesk{display:block}
@container (max-width:1060px){.hdesk,img.hdesk{display:none}.hmob{display:flex}img.hmob{display:block}}
.btn{min-height:48px;font-size:17px;padding:12px 20px;justify-content:center;text-align:center;gap:10px;white-space:normal;max-width:100%;box-sizing:border-box}
.ee .btn:not(.btn-ghost){justify-content:center;text-align:center}
.btn>svg{flex:none}
.ee .btn-primary,.ee .btn-primary:hover,.ee .btn-primary:active,.ee a.btn-primary{color:#F7F3EC}
.btn-secondary{border:2px solid var(--color-text)}
.btn-ghost{color:var(--color-accent-700)}
.input{min-height:52px;font-size:18px;padding:12px 14px;background:#fff;border:2px solid var(--color-neutral-700);color:var(--color-text)}
.input:hover{border-color:var(--color-text)}
.input:focus-visible{border-color:var(--color-accent);outline-offset:2px}
textarea.input{min-height:130px}
.field>label{font-size:16px;line-height:1.3;color:var(--color-text);margin-bottom:6px;font-weight:600}
.seg{border:2px solid var(--color-text);display:grid;grid-template-columns:1fr 1fr;width:100%;background:#fff}
.seg-opt{font-size:17px;font-weight:600;padding:12px 16px;min-height:52px;justify-content:flex-start}
.seg-opt+.seg-opt{border-left:2px solid var(--color-text)}
.seg-opt:has(input:checked){color:var(--on-accent)}
.tile{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:20px;min-height:150px;background:var(--color-surface);border-top:2px solid var(--color-text);text-decoration:none;color:inherit}
.tile:hover{background:var(--color-neutral-200);border-top-color:var(--color-accent);color:inherit}
.tile:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}
/* Doors: outlined only when clickable (a.door) or one of the two homepage doors (.door-cta). Plain .door is unboxed content. */
.door{display:flex;flex-direction:column;gap:20px;padding:0;background:none;border:0}
a.door,.door-cta{padding:28px;background:#fff;border:2px solid var(--color-text)}
a.door:hover{border-color:var(--color-accent);color:inherit}
a.door:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}
.check{display:grid;gap:12px}
.check li{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;line-height:1.45}
.check li::before{content:"";width:12px;height:12px;margin-top:9px;background:var(--color-text)}
.frow{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px 40px;padding:28px 0;align-items:start}
.frow+.frow{border-top:2px solid var(--color-divider)}
.tabs{display:flex;gap:0;border-bottom:0;flex-wrap:wrap}
.tab{font:600 17px/1.2 var(--font-heading);padding:14px 20px;min-height:52px;background:none;border:0;border-bottom:4px solid transparent;margin-bottom:0;cursor:pointer;color:var(--color-text)}
.tab:hover{background:var(--color-neutral-200)}
.tab[aria-selected="true"]{border-bottom-color:var(--color-accent);color:var(--color-accent-700)}
.tab:focus-visible{outline:3px solid var(--color-accent);outline-offset:-3px}
.step{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px 24px;padding:24px 0;border-top:2px solid var(--color-divider)}
.step-n{font:800 40px/1 var(--font-heading);color:var(--color-accent);font-feature-settings:"tnum" 1;letter-spacing:-0.02em}
.bignum{display:block;font-family:var(--font-heading);font-weight:800;font-size:clamp(40px,4.4cqi,58px);line-height:1;height:1em;letter-spacing:-0.03em;color:var(--color-accent);font-variant-numeric:tabular-nums;min-width:0}
.photo{aspect-ratio:4/3;background:var(--color-surface);position:relative}
.photo image-slot{position:absolute;inset:0;width:100%;height:100%}
.sq{aspect-ratio:1}
.portrait{aspect-ratio:4/5}
.person{display:grid;gap:10px;align-content:start;text-decoration:none;color:inherit}
.person>.photo{width:100%}
.person .pname{font-weight:700;line-height:1.25;display:block}
.person .pname span{display:block}
.person:hover{color:inherit;text-decoration:underline}
.card{background:#fff;border:2px solid var(--color-text);padding:20px;gap:12px}
a.card:hover{border-color:var(--color-accent)}
.card-kicker{font-size:14px;color:var(--color-text);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.card-title{font-size:22px}
.card-body{font-size:17px;opacity:1;color:var(--color-neutral-800)}
.card-meta{font-size:16px;color:var(--color-neutral-700)}
.table{font-size:17px;background:transparent}.table th{font-size:14px;color:var(--color-neutral-800)}.table td,.table th{padding:14px 12px}
/* Compact call-to-action band (every page except Contact and the two hubs, which carry the full form) */
.ctaband{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 48px;align-items:center}
.poster{background:var(--color-accent);color:var(--on-accent)}
.poster h2{font-size:40px;line-height:1.06}
.poster .btn-secondary{border-color:var(--on-accent);color:var(--on-accent)}
.poster .btn-secondary:hover{background:rgba(247,243,236,.15)}
.skip{position:absolute;left:8px;top:-60px;background:var(--color-text);color:#fff;padding:12px 16px;font-weight:600;z-index:10}
.skip:focus{top:8px}
@container (max-width:980px){.c4,.c6{grid-template-columns:repeat(2,minmax(0,1fr))}.c3{grid-template-columns:repeat(2,minmax(0,1fr))}.split,.split-l,.split-r,.split-rev,.imgled,.herodom,.ctaband{grid-template-columns:minmax(0,1fr)}.split-r>:first-child{position:static}.split-rev>:first-child{order:0;position:static}}
@container (max-width:640px){.ee h3{font-size:22px}.lede{font-size:19px}.c2,.c3,.c4{grid-template-columns:minmax(0,1fr)}.c6{grid-template-columns:repeat(2,minmax(0,1fr))}.desk,img.desk{display:none}.mob{display:flex}img.mob{display:block}.sec{padding-top:38px;padding-bottom:38px}.wrap{padding-left:20px;padding-right:20px}a.door,.door-cta{padding:22px}.door-cta>.btn{align-self:stretch!important;justify-content:center;text-align:center}.frow{grid-template-columns:minmax(0,1fr)}.tabs{flex-direction:column;border-bottom:0}.tab{text-align:left;border-bottom:2px solid var(--color-divider);border-left:4px solid transparent;margin:0}.tab[aria-selected="true"]{border-left-color:var(--color-accent);border-bottom-color:var(--color-divider)}.poster h2{font-size:30px}.ctas>.btn{width:100%}.ee h1{font-size:clamp(32px,9.6cqi,40px)}.stmt{font-size:clamp(30px,8.6cqi,36px)}.display,.herovid .display{font-size:clamp(32px,9.2cqi,38px)}.herovid .ctas>.btn{flex:1 1 0;min-width:0!important;justify-content:center;text-align:center}.herovid .lede{max-width:none}.herovid .wrap>div:last-child{grid-template-columns:minmax(0,1fr);gap:0}
/* Mobile buttons: solid and outlined buttons fill the column; the CTA band pairs Enquire / Call with the number beneath */
main .btn-primary,main .btn-secondary,#enquire-form .btn-primary,#enquire-form .btn-secondary{width:100%;justify-content:center;text-align:center}
.ctaband>div:last-child{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ctaband>div:last-child>.btn-primary{grid-column:1/-1;margin-left:0!important}
.ctaband>div:last-child>a[href^="tel"]:last-child{grid-column:1/-1;text-align:center;padding-left:0}.herovid{min-height:calc(100svh - 82px);min-height:calc(100dvh - 82px)}.herovid>.wrap{padding-top:48px!important;padding-bottom:40px!important;gap:32px!important;min-height:inherit!important;align-content:space-between!important}.herovid .display{font-size:44px}.herovid h1{min-height:4.1em!important}.herovid>.wrap>div>div,.herovid>.wrap>div{max-width:none!important}.herovid .herobtns{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important}.herovid .herobtns .btn{width:100%;justify-content:center;min-height:48px!important}.herovid>.wrap>div:last-child{grid-template-columns:minmax(0,1fr)!important}.herovid .vidbtn{display:none}.herovid .need{display:none}.herovid>.photo,.herovid>.scrim{display:none}.quote p{font-size:clamp(28px,8.4cqi,32px)}.bignum{font-size:36px}.ctaband a[href^="tel"]:last-child{white-space:normal}.step{grid-template-columns:56px minmax(0,1fr)}.step-n{font-size:30px}.imgled>.photo{aspect-ratio:4/3}}

/* ═══ Part 3: WordPress adaptation ═══ */

/* ══════════════════════════════════════════════════════════════════════════
   WordPress adaptation — Enable Exercise block theme.
   Maps WordPress block markup onto the design classes above and neutralises
   the core defaults that fight the design. No new colours or sizes: every
   value here traces to modernist-styles.css or ee.css; the inline sizes from
   the design components (the header's 18px chevron, the 16px 22px 18px
   dropdown padding, the 56px accordion rows) are cited where used. The design
   scoping is unchanged: each component root (header, main, footer, mobile bar)
   is its own .ee container; body never carries .ee. This block is written to
   print after the core block styles (functions.php declares the dependency)
   and every selector carries enough specificity to win on its own, with no forced precedence.
   ══════════════════════════════════════════════════════════════════════════ */

/* — Site-level resets — */
.wp-site-blocks{padding:0}
.wp-site-blocks>*{margin-block-start:0;margin-block-end:0}
.wp-block-group.ee,.ee .wp-block-group{padding:0}
/* Full-bleed panels and rules stay full width even if a template gives <main> a constrained layout */
main.ee>.pnl,main.ee>.rule{max-width:none}
.ee .herovid>.photo,.ee .herovid>video,.ee .herovid>.scrim{max-width:none}
/* — Component roots, from the design files — */
/* Site Header.dc.html: <header class="ee"> is the positioning context for .skip and the dropdowns, above the page (z-index 5), with the 2px rule beneath the bar */
header.ee{position:relative;border-bottom:2px solid var(--color-divider);background:#fff;z-index:5}
/* The header bar (the design's .wrap row); WordPress generates the same flex layout for the group, this is the fallback */
.ee .ee-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:80px}
/* Mobile Bar.dc.html: the part's root sticks to the bottom of the viewport (the templates put .ee-mobile-bar on the template-part wrapper) */
.ee-mobile-bar{position:sticky;bottom:0;z-index:5}
/* Hero headline lines (Homepage.dc.html: each typed line is a block at least one line tall; ee.js types into .line) */
.ee .herovid .line{display:block;min-height:1em}

/* Editor-authored page content keeps the grid rhythm (24px, the .grid gap) between blocks and real bullets */
.ee .wp-block-post-content>*+*{margin-block-start:24px}
.ee .wp-block-post-content ul:not(.check),.ee .wp-block-post-content ol{padding-left:24px;list-style:revert}

/* — Core buttons = .btn — */
.ee .wp-block-buttons{display:flex;flex-wrap:wrap;gap:8px}
.ee .wp-block-button{margin:0;max-width:100%}
.ee .wp-block-button__link{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  cursor:pointer;text-decoration:none;
  font-family:var(--font-heading);font-weight:var(--font-heading-weight);
  font-size:17px;line-height:1.2;color:var(--color-text);
  background:transparent;border:1px solid transparent;border-radius:0;
  min-height:48px;padding:12px 20px;text-align:center;white-space:normal;max-width:100%;box-sizing:border-box
}
.ee .wp-block-button__link svg{display:block;flex:none}
.ee .wp-block-button__link:disabled{opacity:.45;cursor:not-allowed}
/* default style = .btn-primary (cream on brand red; hover 600, pressed 700) */
.ee .wp-block-button:not(.is-style-outline)>.wp-block-button__link{background:var(--color-accent);color:#F7F3EC}
.ee .wp-block-button:not(.is-style-outline)>.wp-block-button__link:hover{background:var(--color-accent-600);color:#F7F3EC}
.ee .wp-block-button:not(.is-style-outline)>.wp-block-button__link:active{background:var(--color-accent-700);color:#F7F3EC}
/* outline style = .btn-secondary (2px ink border; flips to white in dark panels through --color-text) */
.ee .wp-block-button.is-style-outline>.wp-block-button__link{background:transparent;color:var(--color-text);border:2px solid var(--color-text);padding:12px 20px}
.ee .wp-block-button.is-style-outline>.wp-block-button__link:hover{background:color-mix(in srgb,var(--color-text) 7%,transparent)}
.ee .wp-block-button.is-style-outline>.wp-block-button__link:active{background:color-mix(in srgb,var(--color-text) 14%,transparent)}
.ee.pnl-dark .wp-block-button.is-style-outline>.wp-block-button__link:hover,.ee .pnl-dark .wp-block-button.is-style-outline>.wp-block-button__link:hover,
.ee.pnl-black .wp-block-button.is-style-outline>.wp-block-button__link:hover,.ee .pnl-black .wp-block-button.is-style-outline>.wp-block-button__link:hover{background:rgba(255,255,255,.15)}
@container (max-width:640px){main .wp-block-button,main .wp-block-button__link{width:100%}}

/* — Core navigation = the design header — */
/* parts/header.html groups the navigation and the button clusters in .ee-bar-right: a flex row, 16px apart (the header bar's gap) */
.ee .ee-bar-right{display:flex;align-items:center;gap:16px;min-width:0}
.ee .wp-block-navigation{font-family:var(--font-heading);gap:2px}
.ee .wp-block-navigation a{color:inherit;text-decoration:none}
.ee .wp-block-navigation .wp-block-navigation__container{display:flex;align-items:center;flex-wrap:nowrap;gap:2px;margin:0;padding:0;list-style:none}
/* Top-level item = .navlink (the li is the 48px box; the link or toggle inside inherits it) */
.ee .wp-block-navigation .wp-block-navigation__container>.wp-block-navigation-item{
  display:flex;align-items:center;gap:0;position:relative;margin:0;
  min-height:48px;padding:0 9px;font:600 16px/1.2 var(--font-heading);white-space:nowrap;
  border-bottom:3px solid transparent;cursor:pointer
}
.ee .wp-block-navigation .wp-block-navigation__container>.wp-block-navigation-item:hover{color:var(--color-accent-700)}
.ee .wp-block-navigation .wp-block-navigation__container>.wp-block-navigation-item.current-menu-item,
.ee .wp-block-navigation .wp-block-navigation__container>.wp-block-navigation-item.current-menu-ancestor{border-bottom-color:var(--color-accent)}
.ee .wp-block-navigation .wp-block-navigation__container>.wp-block-navigation-item>.wp-block-navigation-item__content{
  display:flex;align-items:center;min-height:48px;margin:0;padding:0;
  font:inherit;color:inherit;text-decoration:none;background:none;border:0;cursor:pointer
}
.ee .wp-block-navigation .wp-block-navigation-item__content:focus-visible,
.ee .wp-block-navigation .wp-block-navigation-submenu__toggle:focus-visible{outline:3px solid var(--color-accent);outline-offset:-3px}
/* Open-on-click toggle: the 18px chevron sits in the button's right padding (4px gap + 18px chevron) so it stays inside the click target */
.ee .wp-block-navigation .wp-block-navigation-item.open-on-click>.wp-block-navigation-submenu__toggle{padding:0 22px 0 0}
.ee .wp-block-navigation .wp-block-navigation-item.open-on-click>.wp-block-navigation-submenu__toggle+.wp-block-navigation__submenu-icon{margin-left:-18px;pointer-events:none}
.ee .wp-block-navigation .wp-block-navigation__submenu-icon{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:18px;height:18px;margin:0 0 0 4px;padding:0;border:0;background:none;color:inherit;line-height:0
}
.ee .wp-block-navigation .wp-block-navigation__submenu-icon svg{display:block;width:18px;height:18px;margin:0;stroke:currentColor;fill:none}
/* Core draws the chevron on a 12-unit viewBox; 1.1 there renders as the design's 2.2 on its 24-unit viewBox */
.ee .wp-block-navigation .wp-block-navigation__submenu-icon svg path{stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.ee .wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"]+.wp-block-navigation__submenu-icon svg,
.ee .wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"]>svg{transform:rotate(180deg)}

/* Dropdown = the design's white panel: 2px divider border, no radius, no shadow, 16px 22px 18px padding, columns at least 230px wide, 2px between rows */
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container{
  position:absolute;top:100%;left:0;right:auto;margin-top:-2px;z-index:6;
  background:#fff;color:var(--color-text);border:2px solid var(--color-divider);border-radius:0;box-shadow:none;
  padding:16px 22px 18px;display:grid;grid-template-columns:auto;gap:2px;align-content:start;
  font:400 17px/1.55 var(--font-body);white-space:nowrap;cursor:auto
}
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item{
  display:block;margin:0;padding:0;min-height:0;border:0;position:static;white-space:nowrap
}
/* Submenu item = .menulink (the 230px minimum column width sits on the link so long links can still widen the column) */
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content{
  display:flex;align-items:center;min-width:230px;min-height:40px;margin:0;padding:0;
  font-size:17px;font-weight:500;line-height:1.55;text-decoration:none;color:inherit;background:none;border:0
}
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content:hover{color:var(--color-accent-700);text-decoration:underline}
/* Services: the first five items (services) down column one, items six onward (the seven conditions) down column two, a 2px divider between (design: columns 36px apart, column two with a 2px left rule and 36px padding) */
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container.ee-menu-2col,
.ee .wp-block-navigation .has-child.ee-menu-2col>.wp-block-navigation__submenu-container{
  grid-auto-flow:column;grid-template-rows:repeat(7,auto);
  grid-template-columns:auto 2px auto;column-gap:36px
}
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container.ee-menu-2col>.wp-block-navigation-item:nth-child(n+6),
.ee .wp-block-navigation .has-child.ee-menu-2col>.wp-block-navigation__submenu-container>.wp-block-navigation-item:nth-child(n+6){grid-column:3}
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container.ee-menu-2col::before,
.ee .wp-block-navigation .has-child.ee-menu-2col>.wp-block-navigation__submenu-container::before{
  content:"";display:block;grid-column:2;grid-row:1/-1;background:var(--color-divider)
}
/* Funding: "Fee schedule" sits under a 2px rule (design: a 2px span with 10px margins) */
.ee .wp-block-navigation .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item.ee-menu-tail{
  border-top:2px solid var(--color-divider);margin-top:10px;padding-top:10px
}

/* Hamburger and close = .btn.btn-secondary, 48px square (the design's mobile cluster) */
.ee .wp-block-navigation__responsive-container-open,
.ee .wp-block-navigation__responsive-container-close{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:48px;min-height:48px;padding:0;margin:0;
  background:transparent;color:var(--color-text);border:2px solid var(--color-text);border-radius:0;cursor:pointer
}
.ee .wp-block-navigation__responsive-container-open:hover,
.ee .wp-block-navigation__responsive-container-close:hover{background:color-mix(in srgb,var(--color-text) 7%,transparent)}
.ee .wp-block-navigation__responsive-container-open svg,
.ee .wp-block-navigation__responsive-container-close svg{display:block;width:24px;height:24px;fill:currentColor}

/* The header switches to the hamburger at the same container width as .hdesk / .hmob (1060px), not core's 600px */
@container (max-width:1060px){
  .ee .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none}
  .ee .wp-block-navigation__responsive-container-open:not(.always-shown){display:inline-flex}
}
@container (min-width:1061px){
  .ee .wp-block-navigation{margin-left:auto}
  .ee .wp-block-navigation__responsive-container-open:not(.always-shown){display:none}
  .ee .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:block;width:100%;position:relative;z-index:auto}
}

/* Mobile overlay = a full-height white sheet (the design's mobile sheet: white, 2px rules, groups stacked as accordions) */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open{
  position:fixed;inset:0;display:flex;flex-direction:column;
  padding:0;background:#fff;color:var(--color-text);overflow:auto;z-index:100000
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close{width:100%;max-width:none;margin:0;flex:1 0 auto;display:flex;flex-direction:column}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog{position:relative;flex:1 0 auto;display:flex;flex-direction:column}
/* Close button where the hamburger was: (80px bar - 48px button) / 2 from the top, the .wrap gutter from the right */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close{display:inline-flex;position:absolute;top:16px;right:24px;z-index:2}
@container (max-width:640px){.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close{right:20px}}
/* Content starts under the header line (80px bar + 2px rule = 82px, the height ee.css subtracts for the hero) */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  flex:1 0 auto;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;
  padding:82px 0 0;overflow:visible;text-align:left
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
  display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:0;width:100%;flex:1 0 auto;
  border-top:2px solid var(--color-divider);white-space:normal
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container:has(>.wp-block-buttons),
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container:has(>.wp-block-navigation-item>.wp-block-buttons){display:flex;flex-direction:column;align-items:stretch}
/* Group row = the design's accordion button: 56px, 20px side padding, 600 19px, 2px rule beneath */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item{
  display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:0;min-height:56px;padding:0;margin:0;position:static;
  font:600 19px/1.2 var(--font-heading);white-space:normal;
  border:0;border-bottom:2px solid var(--color-divider);cursor:auto
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item:hover{color:inherit}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item>.wp-block-navigation-item__content{
  flex:1 1 auto;display:flex;align-items:center;min-height:56px;padding:0 20px;margin:0;
  font:inherit;text-align:left;color:inherit;background:none;border:0;cursor:pointer
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item>.wp-block-navigation-item__content:hover{color:var(--color-accent-700)}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.open-on-click>.wp-block-navigation-submenu__toggle{padding:0 20px}
/* The accordion chevron: 20px, inside the 20px gutter at the right, rotates when open */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon{
  display:inline-flex;width:20px;height:20px;margin:0 20px 0 0;flex:none
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.open-on-click>.wp-block-navigation-submenu__toggle+.wp-block-navigation__submenu-icon{margin-left:-40px;pointer-events:none}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon svg{width:20px;height:20px}
/* Accordion panel: in flow, no border, 20px gutter, 14px below; collapsed until its toggle is expanded (core toggles aria-expanded on click) */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation__submenu-container{
  position:static;flex-basis:100%;width:100%;min-width:0;height:auto;opacity:1;visibility:visible;overflow:visible;
  margin:0;padding:0 20px 14px;border:0;background:transparent;color:inherit;box-shadow:none;
  display:grid;grid-auto-flow:row;grid-template-rows:none;grid-template-columns:minmax(0,1fr);gap:2px;
  font:400 17px/1.55 var(--font-body);white-space:normal;text-align:left
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation-submenu__toggle[aria-expanded="false"]~.wp-block-navigation__submenu-container{display:none}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation__submenu-container::before{display:none}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item{
  display:block;min-width:0;min-height:0;padding:0;margin:0;border:0;white-space:normal;font:inherit;grid-column:auto
}
/* Sheet items = .menulink at 44px (design: min-height 44px in the flat list) */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content{
  min-width:0;min-height:44px;padding:0;font-size:17px;font-weight:500;line-height:1.55
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation__submenu-container>.wp-block-navigation-item.ee-menu-tail{
  border-top:2px solid var(--color-divider);margin-top:6px;padding-top:6px
}
/* Call / Book at the bottom of the sheet: parts/header.html places a core/buttons block (Call outline = .btn-secondary, Book = .btn-primary) inside the navigation. It renders only in the sheet (design: 16px 20px 20px, two columns, 12px gap, 2px rule above). Core may print the block as a direct child of the list, wrapped in an li, or after the list; all three are covered. */
.ee .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-buttons,
.ee .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item:has(>.wp-block-buttons){display:none}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item:has(>.wp-block-buttons){display:block;min-height:0;padding:0;margin:auto 0 0;border:0;font:inherit}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-buttons{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;
  margin:auto 0 0;padding:16px 20px 20px;border-top:2px solid var(--color-divider)
}
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-buttons .wp-block-button,
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-buttons .wp-block-button__link{width:100%;margin:0}

/* — Photo placeholders: the design's image-slot becomes <figure class="photo grayscale"> — */
/* Kept at type+class specificity (0,1,1) so the design's own .herovid>.photo rules (absolute in the hero, hidden under 640px) still win */
figure.photo{
  display:grid;place-items:center;min-height:240px;margin:0;padding:24px;
  background:var(--beige);text-align:center
}
/* The placeholder note: 14px, muted (Neutral 700 stays ink-toned because the box is always beige) */
figure.photo>*{margin:0;font-size:14px;line-height:1.35;color:#635C56;max-width:60ch}
figure.photo>img{max-width:100%}

/* — Hero H1 on narrow viewports: the JS adds .is-mobile so no word breaks mid-word — */
.ee h1.display.is-mobile{font-size:clamp(34px,11.5vw,44px)}

/* — Hero pause button: hidden while the video has no source (the JS sets [hidden]) — */
.ee .vidbtn[hidden]{display:none}

/* — Fixes from the first render on staging (22 Sep) — */
/* Core's items-justified-right rule (five classes) anchors every dropdown to the right edge of its item, which pushes the wide Services panel off the left of the viewport; the design anchors panels to the item's left edge */
.ee .wp-block-navigation.items-justified-right .wp-block-navigation__container .has-child>.wp-block-navigation__submenu-container,
.ee .wp-block-navigation .wp-block-navigation__container .has-child>.wp-block-navigation__submenu-container{left:0;right:auto}
/* Global styles' link colour (:root :where(a)) prints after the design layer and turned the skip link's text ink-on-ink */
.ee .skip{color:#fff}
/* Mobile sheet accordion: core expands every submenu while its overlay is open, so ee.js owns the state with data-ee-open */
.ee .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child[data-ee-open="false"]>.wp-block-navigation__submenu-container{display:none}
