:root {
  --colour-bg: #f7f4ef;
  --colour-text: #1f1f1d;
  --colour-muted: #5e5a54;
  --colour-accent: #b05c46;
  --colour-border: #ddd6cc;
  --colour-surface: #efe9e1;
  --colour-surface-strong: #e8dfd3;
  --colour-button-text: #f7f4ef;
  --font-heading: "Instrument Serif", Georgia, serif;
  --font-body: "IBM Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --container: 1120px;
  --copy-wide: 800px;
  --copy: 680px;
  --copy-narrow: 560px;
  --space-xs: .5rem;
  --space-s: .75rem;
  --space-m: 1rem;
  --space-l: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;
  --radius-small: .25rem;
  --radius-medium: .45rem;
}
@media (prefers-color-scheme: dark) {
  :root {
    --colour-bg: #11110f;
    --colour-text: #ede8df;
    --colour-muted: #bdb5aa;
    --colour-accent: #d48972;
    --colour-border: #34312c;
    --colour-surface: #1b1a17;
    --colour-surface-strong: #24221e;
    --colour-button-text: #11110f;
  }
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--colour-bg);
  color: var(--colour-text);
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.72;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration-color: var(--colour-accent); text-decoration-thickness: .08em; text-underline-offset: .22em; }
a:hover { color: var(--colour-accent); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid var(--colour-accent); outline-offset: 4px; }
h1,h2,h3,h4,p,ul,blockquote { margin-top: 0; }
p:last-child, ul:last-child, blockquote:last-child { margin-bottom: 0; }
ul { padding-left: 1.1rem; }
li + li { margin-top: .35rem; }
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { left:1rem; top:1rem; width:auto; height:auto; padding:.75rem 1rem; background:var(--colour-bg); border:1px solid var(--colour-border); z-index:10; }
.site-header { border-bottom: 1px solid var(--colour-border); }
.header-inner { width:min(100% - 2rem,var(--container)); min-height:5rem; margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--space-xl); padding-block:var(--space-m); }
.site-identity { display:inline-flex; flex-direction:column; gap:.05rem; text-decoration:none; }
.site-identity strong { font-size:1rem; font-weight:600; letter-spacing:.01em; }
.site-identity span { color:var(--colour-muted); font-size:.86rem; }
.main-nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:clamp(1rem,3vw,2rem); font-size:.95rem; }
.main-nav a { text-decoration:none; color:var(--colour-muted); }
.main-nav a[aria-current="page"], .main-nav a:hover { color:var(--colour-text); }
main { overflow:hidden; }
.container { width:min(100% - 2rem,var(--container)); margin-inline:auto; }
.essay-container { width:min(100% - 2rem,760px); margin-inline:auto; }
.hero { padding-block:clamp(5rem,11vw,8rem) clamp(5rem,11vw,8.5rem); }
.hero--home { padding-block:clamp(6rem,13vw,8.75rem) clamp(6rem,13vw,9.5rem); }
.eyebrow { margin-bottom:var(--space-l); color:var(--colour-accent); font-size:.78rem; font-weight:600; letter-spacing:.08em; line-height:1.4; text-transform:uppercase; }
h1, .display-heading { font-family:var(--font-heading); font-size:clamp(3.25rem,7.5vw,6.45rem); font-weight:400; letter-spacing:-.018em; line-height:1.055; }
.hero h1 { max-width:920px; margin-bottom:calc(var(--space-xl) + .25rem); }
.hero-copy { max-width:var(--copy-wide); color:var(--colour-muted); font-size:clamp(1.12rem,1.8vw,1.32rem); line-height:1.6; }
.hero-copy p + p { margin-top:var(--space-l); }
.section { padding-block:var(--space-5xl); }
.section--compact { padding-block:var(--space-4xl); }
.section--surface { background:var(--colour-surface); border-block:1px solid var(--colour-border); }
.section-heading { max-width:var(--copy-wide); margin-bottom:var(--space-3xl); }
.section-heading--centred { margin-inline:auto; text-align:center; }
.section-heading--centred p { margin-inline:auto; }
.section-heading h2, .contact-panel h2, .working-style h2 { margin-bottom:calc(var(--space-l) + .15rem); font-family:var(--font-heading); font-size:clamp(2.45rem,5vw,4.5rem); font-weight:400; letter-spacing:-.01em; line-height:1.12; }
.section-heading p, .contact-panel p { max-width:var(--copy); color:var(--colour-muted); font-size:clamp(1.06rem,1.7vw,1.22rem); line-height:1.62; }
.section-heading p + p { margin-top:var(--space-l); }
.grid-2, .grid-3, .grid-4 { display:grid; gap:var(--space-l); }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.card { padding:clamp(1.35rem,3vw,1.9rem); background:color-mix(in srgb,var(--colour-bg) 48%,var(--colour-surface)); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.card--line { padding-top:var(--space-l); border-top:1px solid var(--colour-border); }
.card h3, .card--line h3 { margin-bottom:var(--space-s); font-size:1.08rem; font-weight:600; line-height:1.25; }
.card p, .card--line p, .muted { color:var(--colour-muted); }
.button-row { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-m); margin-top:calc(var(--space-xl) + .35rem); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:2.85rem; padding:.7rem 1.15rem; border:1px solid var(--colour-accent); border-radius:var(--radius-small); font-size:.96rem; font-weight:500; line-height:1.2; text-decoration:none; transition:color .18s ease, background .18s ease, transform .18s ease; }
.button--primary { background:var(--colour-accent); color:var(--colour-button-text); }
.button--secondary { background:transparent; color:var(--colour-text); }
.button:hover { transform:translateY(-1px); }
.programme-list { display:grid; gap:var(--space-4xl); }
.programme-card { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:clamp(2rem,6vw,5rem); align-items:start; padding-top:var(--space-2xl); border-top:1px solid var(--colour-border); }
.programme-card h3, .programme-header h2 { margin-bottom:var(--space-l); font-family:var(--font-heading); font-size:clamp(2.55rem,5vw,4.8rem); font-weight:400; letter-spacing:-.004em; line-height:1.1; }
.programme-kicker { margin-bottom:var(--space-l); color:var(--colour-text); font-weight:600; line-height:1.5; }
.programme-body { max-width:640px; }
.programme-body p + p { margin-top:var(--space-l); }
.programme-includes, .connected-note { margin-top:var(--space-xl); padding-top:var(--space-l); border-top:1px solid var(--colour-border); color:var(--colour-muted); font-size:.96rem; line-height:1.55; }
.programme-includes strong, .connected-note h4, .service-detail h4 { display:block; margin-bottom:var(--space-s); color:var(--colour-text); font-size:.78rem; font-weight:600; letter-spacing:.08em; line-height:1.35; text-transform:uppercase; }
.programme { padding-block:var(--space-5xl); border-top:1px solid var(--colour-border); }
.programme:first-of-type { border-top:0; }
.programme-header { max-width:720px; margin-bottom:var(--space-3xl); }
.programme-subheading { max-width:620px; margin-bottom:0; color:var(--colour-text); font-weight:600; line-height:1.5; }
.pattern-block, .note-card { max-width:760px; margin-bottom:var(--space-3xl); padding:1.5rem 1.75rem; background:var(--colour-surface); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.pattern-block h3 { margin-bottom:var(--space-l); font-size:.82rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.pattern-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem 1.4rem; margin:0; padding:0; list-style:none; color:var(--colour-muted); font-size:.98rem; line-height:1.5; }
.pattern-list li { position:relative; margin:0; padding-left:1rem; }
.pattern-list li::before { content:""; position:absolute; top:.72em; left:0; width:.32rem; height:.32rem; border-radius:999px; background:var(--colour-accent); }
.service-list { display:grid; gap:var(--space-l); }
.service-card { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(1.5rem,5vw,4rem); padding:clamp(1.5rem,3vw,2.25rem); background:color-mix(in srgb,var(--colour-surface) 55%,transparent); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.service-card h3 { margin-bottom:var(--space-s); font-family:var(--font-heading); font-size:clamp(2rem,3vw,3rem); font-weight:400; letter-spacing:-.001em; line-height:1.18; }
.price { display:inline-flex; margin-bottom:var(--space-l); color:var(--colour-accent); font-size:.9rem; font-weight:600; }
.service-purpose { max-width:440px; color:var(--colour-muted); line-height:1.55; }
.service-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-l); }
.service-detail ul, .connected-note ul { color:var(--colour-muted); font-size:.96rem; line-height:1.55; }
.about-grid, .contact-layout, .working-style, .infrastructure-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(2rem,7vw,6rem); align-items:start; }
.pull-line { max-width:580px; font-family:var(--font-heading); font-size:clamp(2.35rem,4.4vw,4.25rem); font-weight:400; letter-spacing:-.012em; line-height:1.1; }
.essay { padding-bottom:var(--space-5xl); }
.essay-body { max-width:var(--copy); }
.essay-body p { margin-bottom:calc(var(--space-xl) - .1rem); }
.essay-break { margin-block:calc(var(--space-3xl) - .5rem); border:0; border-top:1px solid var(--colour-border); }
.pull-quote { margin-block:calc(var(--space-4xl) - 1rem); padding-left:var(--space-xl); border-left:2px solid var(--colour-accent); }
.pull-quote blockquote { margin:0; font-family:var(--font-heading); font-size:clamp(2rem,4vw,3.3rem); font-weight:400; letter-spacing:-.01em; line-height:1.14; }
.contact-panel { max-width:780px; }
.contact-method { margin-top:var(--space-2xl); padding-top:var(--space-xl); border-top:1px solid var(--colour-border); }
.contact-method h3 { margin-bottom:var(--space-s); font-size:.82rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.site-footer { padding-block:var(--space-3xl); border-top:1px solid var(--colour-border); color:var(--colour-muted); font-size:.94rem; }
.footer-grid { width:min(100% - 2rem,var(--container)); margin-inline:auto; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:var(--space-2xl); }
.footer-brand strong { display:block; margin-bottom:.1rem; color:var(--colour-text); font-weight:600; }
.footer-brand .site-address { display:block; margin-bottom:var(--space-m); }
.footer-links { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.75rem 1.5rem; }
.footer-links a { text-decoration:none; }
.copyright { grid-column:1/-1; margin-top:var(--space-l); padding-top:var(--space-l); border-top:1px solid var(--colour-border); }
@media (max-width:980px) { .grid-3,.grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); } .programme-card,.service-card,.about-grid,.contact-layout,.working-style,.infrastructure-grid { grid-template-columns:1fr; } .service-detail-grid { grid-template-columns:1fr; } }
@media (max-width:900px) { .header-inner { align-items:flex-start; flex-direction:column; gap:var(--space-m); } .main-nav { justify-content:flex-start; } .footer-grid { grid-template-columns:1fr; } .footer-links { justify-content:flex-start; } }
@media (max-width:640px) { body { font-size:1rem; line-height:1.72; } .section,.programme { padding-block:var(--space-4xl); } .hero,.hero--home { padding-block:var(--space-3xl) var(--space-4xl); } h1,.display-heading,.hero h1 { font-size:clamp(2.85rem,15vw,4.1rem); letter-spacing:-.012em; line-height:1.08; } .grid-2,.grid-3,.grid-4,.pattern-list { grid-template-columns:1fr; } .button-row { align-items:stretch; flex-direction:column; } .button { width:100%; } .main-nav { gap:.85rem 1.15rem; font-size:.92rem; } .pattern-block,.service-card,.note-card { padding:var(--space-l); } .pull-quote { padding-left:var(--space-l); } }
/* Legacy prototype class support retained for implementation safety. */
.hero-text, .hero-intro, .intro-copy { max-width: var(--copy-wide); color: var(--colour-muted); font-size: clamp(1.12rem,1.8vw,1.32rem); line-height: 1.6; }
.hero-text p + p, .hero-intro p + p, .intro-copy p + p, .programme-intro p + p { margin-top: var(--space-l); }
.problem-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-l); max-width:1040px; margin-inline:auto; }
.problem-card { padding:clamp(1.35rem,3vw,1.9rem); background:color-mix(in srgb,var(--colour-bg) 48%,var(--colour-surface)); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.problem-card h3, .process-card h3, .working-point h3 { margin-bottom:var(--space-s); font-size:1.08rem; font-weight:600; line-height:1.25; }
.problem-card p, .process-card p, .programme-intro p, .about-copy, .working-style p, .document-item span { color:var(--colour-muted); }
.process-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-l); }
.process-card, .working-point { padding-top:var(--space-l); border-top:1px solid var(--colour-border); }
.service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-2xl) clamp(2rem,6vw,5rem); max-width:1000px; margin-left:auto; }
.service-intro { max-width:780px; margin-inline:auto; margin-bottom:var(--space-4xl); padding:clamp(2rem,5vw,3rem); text-align:center; background:color-mix(in srgb,var(--colour-bg) 52%,var(--colour-surface)); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.service-intro h2 { margin-bottom:calc(var(--space-l) + .15rem); font-family:var(--font-heading); font-size:clamp(2.55rem,5vw,4.5rem); font-weight:400; line-height:1.1; }
.service-intro p { max-width:var(--copy); margin-inline:auto; color:var(--colour-muted); font-size:clamp(1.06rem,1.7vw,1.22rem); line-height:1.62; }
.about-copy { max-width:var(--copy-narrow); padding-top:clamp(3.2rem,6vw,5.2rem); }
.about-copy p + p { margin-top:var(--space-l); }
.programme-intro { max-width:620px; margin-top:calc(var(--space-l) + .35rem); }
.document-list, .working-points { display:grid; gap:var(--space-m); }
.document-item { padding:var(--space-l); background:var(--colour-bg); border:1px solid var(--colour-border); border-radius:var(--radius-medium); }
.document-item strong { display:block; margin-bottom:.25rem; color:var(--colour-text); font-weight:600; }
.section--quiet { padding-block:var(--space-4xl) var(--space-5xl); }
.section-heading--compact { margin-bottom:var(--space-2xl); }
@media (max-width:980px) { .problem-grid,.process-grid,.service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:none; margin-left:0; } .about-copy { padding-top:0; } }
@media (max-width:640px) { .problem-grid,.process-grid,.service-grid { grid-template-columns:1fr; } }

/* Common Starting Points cards: centre each card as a single editorial unit.
   These selectors intentionally outrank the small per-page compatibility styles. */
.section.common-starting-points .service-grid {
  max-width: 1000px;
  margin-inline: auto;
}

.section.common-starting-points .service-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
}

.section.common-starting-points .service-card h3 {
  max-width: 100%;
  margin-inline: auto;
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: balance;
}

.section.common-starting-points .service-card p {
  max-width: 34rem;
  margin-inline: auto;
}