/* Different Wisdom Inc. — shared website styles */
/* v14.5.26 (0.88, section 3): the three approved brand colours are set once, here (Purple #5B3AA5, Blue #5867E5, Fuchsia #F54C9E);
   every other use refers to them (var(--purple), var(--blue), var(--fuchsia)). Darker shades are hover/pressed states only. */
:root {
  --purple: #5b3aa5;
  --purple-dark: #3d2477;
  --blue: #5867e5;
  --fuchsia: #f54c9e;
  --fuchsia-dark: #e94391;   /* hover state of Fuchsia buttons (was written out in place) */
  --ink: #242133;
  --muted: #625e70;
  --line: #e2deea;
  --soft: #f7f6fa;
  --page-inset: clamp(1.25rem, 5.64vw, 7rem);
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  font-synthesis: none;
  -webkit-text-size-adjust: 100%;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 6rem; }
body { margin: 0; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--purple); text-underline-offset: .24em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--blue); outline-offset: 5px;
}
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 550; }
h1 { font-size: clamp(2.75rem, 5.7vw, 5.4rem); line-height: 1.04; letter-spacing: -.046em; margin-bottom: 1.75rem; text-wrap: balance; }
h2 { font-size: clamp(2rem, 3.55vw, 3.35rem); line-height: 1.12; letter-spacing: -.038em; margin-bottom: 1.5rem; text-wrap: balance; }
h3 { font-size: 1.45rem; line-height: 1.22; letter-spacing: -.022em; margin-bottom: .75rem; }
p, li { font-size: 1.0625rem; line-height: 1.75; }
p { margin-bottom: 1.25rem; }
small { font-size: inherit; }
strong { font-weight: 650; }
.container { width: min(100% - (2 * var(--page-inset)), 1180px); margin-inline: auto; }
.section { padding-block: clamp(4rem, 7vw, 7rem); }
.section-small { padding-block: 3rem; }
.soft { background: var(--soft); }
.eyebrow { color: var(--purple); font-size: .78rem; font-weight: 650; line-height: 1.4; letter-spacing: .13em; text-transform: uppercase; margin-bottom: 1.5rem; }
.lead { font-size: clamp(1.18rem, 1.8vw, 1.42rem); line-height: 1.6; color: var(--muted); max-width: 43rem; }
.muted { color: var(--muted); }
.text-link { display: inline-flex; align-items: center; gap: .7rem; min-height: 44px; font-size: 1rem; font-weight: 550; }
.arrow { font-size: 1.35em; line-height: 1; }
.button { min-height: 50px; padding: .88rem 1.45rem; display: inline-flex; align-items: center; justify-content: center; gap: 1.15rem; background: var(--purple); border: 1px solid var(--purple); color: #fff; font-size: .98rem; line-height: 1.4; font-weight: 550; text-decoration: none; border-radius: 3px; }
.button:hover { background: var(--purple-dark); border-color: var(--purple-dark); }
.button-light { background: #fff; color: var(--purple); border-color: #fff; }
.button-light:hover { background: #efebf7; border-color: #efebf7; }
.button-outline { background: transparent; color: var(--purple); }
.button-outline:hover { color: #fff; }
.skip-link { position: absolute; left: 1rem; top: -6rem; z-index: 100; background: #fff; padding: .8rem 1rem; }
.skip-link:focus { top: 1rem; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Shared navigation remains usable when JavaScript is disabled. */
.site-header { background: #fff; position: relative; z-index: 20; border-bottom: 1px solid var(--line); }
.header-inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { width: 208px; flex: 0 0 208px; display: block; }
.brand img { width: 100%; }
.nav-links { display: flex; align-items: center; gap: clamp(1.2rem, 2.5vw, 2.5rem); list-style: none; padding: 0; margin: 0; }
.nav-links a { color: var(--ink); font-size: .95rem; line-height: 1.3; min-height: 44px; display: flex; align-items: center; position: relative; text-decoration: none; white-space: nowrap; }
.nav-links a:hover, .nav-links a.active { color: var(--purple); }
.nav-links a.active::after { content: ''; height: 2px; position: absolute; bottom: 3px; left: 0; right: 0; background: var(--purple); }
.nav-links .nav-contact { color: var(--purple); }
.menu-toggle { display: none; align-items: center; gap: .65rem; min-height: 44px; padding: .5rem 0 .5rem .8rem; border: 0; color: var(--purple); background: transparent; cursor: pointer; }
.menu-toggle svg { width: 22px; height: 22px; }

/* Preserve the established full-height Orion homepage composition. */
.home-shell { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; }
.home-shell .site-header { border-bottom: 0; }
.home-shell main { display: flex; flex: 1; }
.home-hero { position: relative; isolation: isolate; flex: 1; display: grid; place-items: center; min-height: 440px; overflow: hidden; background-color: #11151c; background-image: url('../images/DW-homepage_Orion_v4.jpg'); background-image: image-set(url('../images/DW-homepage_Orion_v4.webp') type('image/webp'), url('../images/DW-homepage_Orion_v4.jpg') type('image/jpeg')); background-size: cover; background-position: center 69%; }
.home-hero h1 { position: relative; z-index: 2; margin: 0; padding: 1.5rem; color: #fff; font-size: clamp(2.7rem, 4.685vw, 6rem); line-height: 1.15; font-weight: 400; letter-spacing: -.025em; text-align: center; text-shadow: 0 1px 6px rgb(0 0 0 / 12%); }
.home-hero h1 strong { font-weight: 700; }
.hero-hills { position: absolute; z-index: 1; width: max(110%, 56rem); max-width: none; height: auto; left: 50%; bottom: min(-24vw, -12.22rem); transform: translateX(-45.455%) scaleX(-1); pointer-events: none; user-select: none; }
.clip-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Interior pages: quiet, readable editorial layouts. */
.site-shell { height: 100vh; height: 100dvh; display: flex; flex-direction: column; overflow: hidden; }
.site-shell > .site-header, .site-shell > footer { flex: none; }
.content-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior-y: contain; scroll-padding-top: 2rem; }
.content-scroll:focus-visible { outline: 3px solid var(--blue); outline-offset: -3px; }
.page-hero { padding-block: clamp(3.75rem, 7vw, 7.25rem) clamp(3.5rem, 6vw, 6rem); border-bottom: 1px solid var(--line); }
.page-hero h1 { max-width: 58rem; }
.page-hero .lead { margin-bottom: 0; }
.hero-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .8fr); gap: clamp(2.5rem, 5vw, 6rem); align-items: center; }
.hero-split h1 { font-size: clamp(2.75rem, 4.7vw, 4.6rem); }
.hero-split .button { margin-top: 1rem; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2.5rem; }
.section-head h2 { margin-bottom: 0; max-width: 45rem; }
.split { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.2fr); gap: clamp(2rem, 7vw, 7rem); align-items: start; }
.split > div > :last-child { margin-bottom: 0; }
.section-intro { max-width: 42rem; margin-bottom: 3rem; }
.section-intro p { color: var(--muted); }
.jump-links { display: flex; flex-wrap: wrap; gap: .3rem 2rem; padding-block: 1.1rem; }
.jump-links a { font-size: .95rem; min-height: 44px; display: inline-flex; align-items: center; gap: .65rem; }
.jump-links-wrap { border-bottom: 1px solid var(--line); }
.section-number { display: block; font-size: .8rem; color: var(--purple); font-weight: 600; letter-spacing: .12em; margin-bottom: 1.5rem; }
.service-item { padding-block: 1.75rem; border-top: 1px solid var(--line); }
.service-item:first-child { padding-top: 0; border-top: 0; }
.service-item:last-child { padding-bottom: 0; }
.service-item p { margin-bottom: 0; color: var(--muted); }
.service-item .text-link { margin-top: .8rem; }
.process-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.process-step { border-top: 1px solid var(--purple); padding-top: 1.5rem; }
.process-step .section-number { margin-bottom: 2.5rem; }
.process-step p { color: var(--muted); }
.principle { border-left: 3px solid var(--purple); padding: .25rem 0 .25rem 1.75rem; margin: 1rem 0; }
.principle p { font-size: clamp(1.5rem, 2.6vw, 2.25rem); line-height: 1.4; letter-spacing: -.02em; }
.principle p:last-child { margin: 0; }
.value-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem 4.5rem; }
.value { border-top: 1px solid var(--line); padding-top: 1.8rem; }
.value h3 { color: var(--purple); }
.value p { color: var(--muted); margin-bottom: 0; }
.word-line { color: var(--purple); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: 1.4; letter-spacing: -.025em; margin-bottom: 1.25rem; }
.word-line span { display: inline-block; }
.people-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.people-pair .portrait { aspect-ratio: 4 / 4.3; }
.support-section { border-top: 1px solid var(--line); }
.cta-band { background: var(--purple); color: #fff; padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.cta-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3rem; }
.cta-band h2 { max-width: 43rem; }
.cta-band p { color: #f2edfc; max-width: 42rem; margin-bottom: 0; }
.cta-band .eyebrow { color: #eee6ff; margin-bottom: 1rem; }

/* Team directory and full biographies. No fabricated portrait photography. */
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.3rem 2rem; }
.team-grid.preview-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.team-card { min-width: 0; }
.team-card > a { display: block; text-decoration: none; color: var(--ink); }
.portrait { position: relative; overflow: hidden; background: #ede9f5; aspect-ratio: 4 / 4.65; margin-bottom: 1.2rem; }
.portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% var(--portrait-y, 32%); }
.portrait.initials { display: grid; place-items: center; color: var(--purple); background: #efebf6; font-size: clamp(3rem, 6vw, 5.5rem); font-weight: 400; letter-spacing: -.065em; }
.team-card :is(h2, h3) { margin-bottom: .4rem; font-size: 1.3rem; }
.team-card p { font-size: .95rem; line-height: 1.6; color: var(--muted); margin-bottom: .7rem; }
.team-card .profile-link { color: var(--purple); display: inline-flex; align-items: center; gap: .65rem; font-size: .9rem; min-height: 32px; border-bottom: 1px solid transparent; }
.team-card a:hover .profile-link { border-color: var(--purple); }
.team-note { border-top: 1px solid var(--line); padding-top: 1.7rem; margin-top: 3.5rem; color: var(--muted); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: .65rem; color: var(--muted); font-size: .9rem; margin-bottom: 2.3rem; }
.breadcrumb a { min-height: 32px; display: inline-flex; align-items: center; }
.profile-page { padding-block: 3rem 6rem; }
.profile-layout { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.2fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.profile-photo { position: sticky; top: 2rem; }
.profile-photo .portrait { margin-bottom: 0; aspect-ratio: 4 / 5; }
.profile-copy h1 { font-size: clamp(2.7rem, 4.8vw, 4.5rem); margin-bottom: 1rem; }
.profile-role { color: var(--purple); font-size: 1.05rem; line-height: 1.6; margin-bottom: 2.5rem; }
.profile-bio { border-top: 1px solid var(--line); padding-top: 2rem; }
.profile-bio p { color: #454151; font-size: 1.06rem; line-height: 1.85; }
.profile-bio p:first-child { color: var(--ink); font-size: 1.18rem; line-height: 1.7; }
.profile-copy .button { margin-top: .75rem; }

/* Contact links open a real email draft; the site never pretends to submit it. */
.contact-panel { background: var(--purple); color: #fff; padding: clamp(2rem, 4vw, 3.5rem); }
.contact-panel .eyebrow { color: #f1eafb; }
.contact-panel h2 { font-size: clamp(2.3rem, 3.5vw, 3.3rem); }
.contact-panel p { color: #eee8f8; }
.contact-panel a:not(.button) { color: #fff; overflow-wrap: anywhere; }
.contact-panel .button { width: 100%; margin-top: 1.25rem; }
.contact-panel .contact-email { font-size: 1.1rem; margin-top: 1.5rem; margin-bottom: 0; }
.contact-types { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; }
.contact-type { border-top: 1px solid var(--line); padding-top: 2rem; }
.contact-type p { color: var(--muted); }
.faq-list { border-top: 1px solid var(--line); }
.faq { border-bottom: 1px solid var(--line); padding-block: 1.1rem; }
.faq summary { cursor: pointer; padding: .5rem 2.5rem .5rem 0; position: relative; list-style: none; font-size: 1.12rem; font-weight: 550; line-height: 1.5; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: .25rem; top: .3rem; color: var(--purple); font-size: 1.5rem; font-weight: 400; }
.faq[open] summary::after { content: '−'; }
.faq p { color: var(--muted); padding-right: 2rem; margin: .6rem 0 .5rem; }

/* English and French marks are used as supplied on a white background. */
.footer-main { padding-block: 3.25rem; border-top: 1px solid var(--line); background: #fff; }
.footer-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; }
.footer-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 1.8rem; margin-bottom: 1.5rem; }
.footer-logos img { width: 156px; height: auto; }
.footer-logos .french-logo { width: 128px; }
.footer-description { font-size: .94rem; color: var(--muted); max-width: 24rem; margin-bottom: .65rem; }
.footer-heading { color: var(--ink); font-size: .88rem; font-weight: 650; margin-bottom: .75rem; }
.footer-list { list-style: none; padding: 0; margin: 0; }
.footer-list li { font-size: .94rem; line-height: 1.4; }
.footer-list a { color: var(--muted); display: inline-flex; align-items: center; min-height: 36px; text-decoration: none; overflow-wrap: anywhere; }
.footer-list a:hover { color: var(--purple); text-decoration: underline; }
.footer-bottom { background: var(--purple); color: #fff; }
/* 54px × 1.4: extra depth sits below the About link and copyright. */
.footer-bottom-inner { min-height: 75.6px; padding-block: 5px; display: flex; align-items: flex-start; align-content: flex-start; justify-content: space-between; flex-wrap: wrap; gap: .2rem 1.5rem; }
.footer-about { color: #fff; display: inline-flex; align-items: center; min-height: 44px; font-size: 1.1rem; text-decoration: none; }
.footer-about:hover { text-decoration: underline; }
.footer-copyright { margin: 0; font-size: .8rem; line-height: 1.6; padding-block: .55rem; }

@media (max-width: 980px) {
  .nav-links { gap: 1.2rem; }
  .brand { width: 183px; flex-basis: 183px; }
  .team-grid.preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-layout { grid-template-columns: 1.3fr 1fr; }
  .footer-layout > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 840px) {
  .header-inner { min-height: 80px; flex-wrap: wrap; gap: 0 1rem; padding-block: 12px; }
  .site-nav { flex: 0 0 100%; }
  .nav-links { justify-content: space-between; flex-wrap: wrap; gap: .3rem 1.5rem; padding-top: .6rem; }
  .js .menu-toggle { display: inline-flex; }
  .js .site-nav:not([data-open='true']) { display: none; }
  .js .site-nav[data-open='true'] { display: block; }
  .js .site-shell .site-nav { position: absolute; top: 100%; left: 0; right: 0; padding: 0 var(--page-inset) 1rem; max-height: calc(100vh - 160px); max-height: calc(100dvh - 160px); overflow-y: auto; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 12px 18px rgb(36 33 51 / 8%); }
  .js .nav-links { flex-direction: column; align-items: stretch; padding-top: 1rem; }
  .js .nav-links a { min-height: 48px; }
  .js .nav-links a.active::after { right: auto; width: 28px; bottom: 4px; }
  .hero-split, .split { grid-template-columns: 1fr; gap: 2.5rem; }
  .hero-split > :last-child { max-width: 36rem; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-grid { gap: 1.5rem; }
  .cta-inner { grid-template-columns: 1fr; gap: 2rem; }
  .cta-inner .button { justify-self: start; }
  .contact-types { gap: 2rem; }
  .profile-layout { grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); gap: 2rem; }
  .profile-copy h1 { font-size: 2.75rem; }
}
@media (max-width: 600px) {
  h1 { font-size: clamp(2.65rem, 10.8vw, 3.75rem); }
  h2 { font-size: 2.1rem; }
  p, li { font-size: 1rem; }
  .lead { font-size: 1.18rem; }
  .page-hero { padding-block: 3.5rem; }
  .section-head { align-items: start; flex-direction: column; gap: 1rem; }
  .process-grid, .value-grid, .contact-types, .profile-layout { grid-template-columns: 1fr; }
  .process-step .section-number { margin-bottom: 1.5rem; }
  .value-grid { gap: 2rem; }
  .home-hero { min-height: 400px; background-position: 50% 62%; }
  .home-hero h1 { font-size: clamp(2.5rem, 8.5vw, 3.5rem); padding-inline: 1rem; }
  .home-hero h1 strong { display: block; }
  .team-grid { gap: 2.5rem 1rem; }
  .team-card :is(h2, h3) { font-size: 1.1rem; }
  .team-card p { font-size: .875rem; }
  .team-card .profile-link { font-size: .875rem; }
  .portrait { aspect-ratio: 4 / 5; }
  .people-pair { gap: 1rem; }
  .profile-page { padding-top: 2rem; }
  .profile-photo { position: static; max-width: 26rem; }
  .profile-photo .portrait { aspect-ratio: 4 / 4.4; }
  .profile-copy h1 { font-size: 3rem; }
  .profile-bio p { font-size: 1.02rem; }
  .footer-layout { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom-inner { align-items: start; flex-direction: column; justify-content: flex-start; padding-block: 4px 7px; gap: 0; }
  .footer-copyright { padding-block: 0; }
  .contact-panel { padding: 2rem; }
}
@media (max-width: 370px) {
  .team-grid { grid-template-columns: 1fr; }
  .team-grid.preview-grid { grid-template-columns: 1fr; }
  .footer-layout { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: no-preference) {
  .button, .nav-links a { transition: background-color .15s ease, color .15s ease; }
}

/* v14: brand colours, consolidated team, and shared footer. */
:root { --blue-dark: #424fba; }
.button, .text-link { background: var(--blue); border: 1px solid var(--blue); color: #fff; }
.text-link { padding: .88rem 1.45rem; min-height: 50px; border-radius: 3px; line-height: 1.4; text-align: center; justify-content: center; text-decoration: none; }
.button:hover, .text-link:hover { background: var(--blue-dark); border-color: var(--blue-dark); color: #fff; }
.button-light { background: #fff; border-color: #fff; color: var(--blue); }
.button-light:hover { background: #f0f2ff; border-color: #f0f2ff; color: var(--blue-dark); }
.nav-links .nav-contact { padding: .6rem 1.1rem; background: var(--blue); color: #fff; border-radius: 3px; }
.nav-links .nav-contact:hover { background: var(--blue-dark); color: #fff; }
.nav-links .nav-contact.active::after { background: #fff; left: 1.1rem; right: 1.1rem; bottom: 5px; }
.cta-band, .contact-panel { background: var(--blue); }
.cta-band p, .cta-band .eyebrow, .contact-panel p, .contact-panel .eyebrow { color: #fff; }
.cta-band p + p { margin-top: .8rem; }
.cta-band p a { color: #fff; }
.contact-panel .button { background: var(--blue); border-color: #fff; color: #fff; }
.contact-panel .button:hover { background: var(--blue-dark); }
.about-hero { padding-block: clamp(3rem, 5vw, 5rem); }
.about-intro { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2.5rem, 5vw, 5rem); align-items: center; }
.about-intro h1 { font-size: clamp(2.75rem, 4.7vw, 4.6rem); }
.about-photo { margin: 0; width: min(100%, 360px); justify-self: end; }
.about-photo img { width: 100%; height: auto; }
.team-card .profile-link { min-height: 44px; padding: .55rem .9rem; background: var(--blue); color: #fff; border: 1px solid var(--blue); border-radius: 3px; line-height: 1.4; }
.team-card a:hover .profile-link { background: var(--blue-dark); border-color: var(--blue-dark); }
.breadcrumb { align-items: center; line-height: 1.4; }
.profile-bio strong { font-weight: 700; }
.profile-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 3rem; }
.profile-actions .button { padding-inline: 1rem; text-align: center; }
.button-fuchsia { background: var(--fuchsia); border-color: var(--fuchsia); color: #24102c; font-weight: 650; }
.button-fuchsia:hover { background: var(--fuchsia-dark); border-color: var(--fuchsia-dark); color: #24102c; }
.footer-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.footer-layout > :first-child { grid-column: auto; }
.footer-logos { align-items: end; gap: 2rem; margin-bottom: 1.25rem; }
.footer-logos img, .footer-logos .french-logo { width: auto; height: 128px; max-width: 45%; object-fit: contain; }
.footer-description { max-width: none; margin-bottom: 0; }
.footer-address { font-style: normal; font-size: .94rem; margin-bottom: .75rem; }
.footer-main p, .footer-main li, .footer-address { line-height: 1.2; }
.footer-list li + li { margin-top: .75rem; }
.footer-list a { color: var(--blue); min-height: 32px; }
.footer-list .button { color: #fff; min-height: 44px; text-align: center; justify-content: center; }
.footer-list .button:hover { color: #fff; text-decoration: none; }
.footer-bottom-inner { justify-content: flex-end; }
@media (max-width: 840px) {
  .about-intro { grid-template-columns: 1fr; }
  .about-photo { width: min(100%, 30rem); justify-self: center; }
  .footer-layout { gap: 2rem; }
}
@media (max-width: 600px) {
  .profile-actions { grid-template-columns: 1fr; }
  .footer-layout { grid-template-columns: 1fr; }
  .footer-bottom-inner { justify-content: flex-start; }
  .about-intro h1 { font-size: clamp(2.65rem, 10.8vw, 3.75rem); }
}
@media (max-width: 370px) {
  .brand { width: 170px; flex-basis: 170px; }
}
/* v14.2: requested brand controls, values layout and compact biography navigation. */
.button-fuchsia, .jump-links .button, .team-card .profile-link {
  background: var(--fuchsia); border-color: var(--fuchsia); color: #fff;
}
.button:hover, .button:focus-visible, .text-link:hover, .text-link:focus-visible,
.nav-links .nav-contact:hover, .nav-links .nav-contact:focus-visible,
.contact-panel .button:hover, .team-card a:hover .profile-link,
.team-card a:focus-visible .profile-link {
  background: var(--purple); border-color: var(--purple); color: #fff;
}
.values-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem 4.5rem; align-items: center; margin-bottom: 3rem; }
.values-intro .section-intro { max-width: none; margin-bottom: 0; }
.values-photo { margin: 0; }
.values-photo img { width: 100%; height: auto; }
.jump-links { gap: .75rem; }
.jump-links .button { flex: 1; padding: .7rem 1rem; text-align: center; }
.service-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.service-heading h3 { margin: 0; }
.service-heading .button { flex: 0 0 auto; min-height: 44px; padding: .65rem 1rem; margin: 0; }
.profile-copy .profile-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .65rem; margin-top: 2rem; }
.profile-copy .profile-actions .button { min-height: 44px; padding: .6rem .8rem; margin: 0; font-size: .88rem; gap: .4rem; }
.profile-copy .profile-actions .linkedin-button { width: 44px; height: 44px; padding: 0; flex: 0 0 44px; background: var(--blue); border-color: var(--blue); color: #fff; }
.linkedin-button svg { width: 23px; height: 23px; fill: currentColor; }
.profile-copy .profile-actions .linkedin-button:not(:disabled):hover { background: var(--purple); border-color: var(--purple); }
.linkedin-button:disabled { cursor: default; opacity: .65; }
.footer-layout { grid-template-columns: minmax(0, .78fr) minmax(0, 1.2fr); gap: clamp(2rem, 7vw, 7rem); align-items: center; }
.footer-logos { flex-wrap: nowrap; gap: clamp(1rem, 2vw, 2rem); margin: 0; align-items: center; }
.footer-logos img, .footer-logos .french-logo { height: clamp(130px, 12vw, 160px); width: auto; max-width: none; object-fit: contain; }
.footer-contact { text-align: left; min-width: 0; }
.footer-contact p, .footer-contact address { font-size: .98rem; line-height: 1.3; margin: 0; font-style: normal; }
.footer-contact a { overflow-wrap: anywhere; }
.footer-company { font-weight: 650; }
@media (max-width: 840px) {
 .footer-layout { grid-template-columns: 1fr; gap: 2rem; }
 .values-intro { gap: 2rem; }
}
@media (max-width: 600px) {
 .values-intro { grid-template-columns: 1fr; }
 .jump-links { flex-direction: column; }
 .service-heading { align-items: flex-start; flex-wrap: wrap; }
 .profile-copy .profile-actions { justify-content: flex-start; }
 .footer-logos img, .footer-logos .french-logo { height: clamp(108px, 30vw, 140px); }
}
.home-shell main { flex: none; min-height: max(440px, calc(100svh - 164px)); }
/* v14.3: portal access, disabled draft menu item and aligned biography actions. */
.nav-links .nav-disabled { display: flex; align-items: center; min-height: 44px; font-size: .95rem; line-height: 1.3; color: #888591; cursor: default; }
.nav-links { gap: clamp(.85rem, 1.7vw, 1.8rem); }
.profile-copy .profile-actions { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .65rem; }
.profile-action-centre { display: flex; justify-content: center; align-items: center; gap: .45rem; min-width: 0; }
.profile-action-centre .button { white-space: normal; }
/* The complete original photograph must remain visible at every viewport. */
.profile-photo .portrait:not(.initials) { aspect-ratio: auto; overflow: visible; background: transparent; }
.profile-photo .portrait img { width: 100%; height: auto; object-fit: contain; }
/* Align artwork ascenders at y=0 and capital-letter baselines at y=160. */
.footer-logos { --logo-letter-height: clamp(125px, 12vw, 160px); align-items: flex-start; }
.footer-logos img { height: calc(var(--logo-letter-height) * 602 / 550); width: auto; max-width: none; }
.footer-logos img.french-logo { height: calc(var(--logo-letter-height) * 612 / 552); width: auto; max-width: none; }
.portal-content { padding-block: clamp(2.5rem, 5vw, 5rem); }
.portal-content > h1 { font-size: clamp(2.8rem, 5vw, 4.5rem); }
.portal-content > p { max-width: 65rem; }
.portal-content h2 { font-size: clamp(1.6rem, 3vw, 2.5rem); margin-top: 2.5rem; }
.portal-card { display: grid; grid-template-columns: minmax(180px, .6fr) minmax(0, 1.6fr); align-items: center; gap: 2rem; padding: 2rem; background: var(--soft); border: 1px solid var(--line); margin-block: 2rem; }
.portal-card__caption { line-height: 1.7; }
.portal-subnav { display: flex; flex-wrap: wrap; gap: 1.5rem; padding-block: 1rem; border-bottom: 1px solid var(--line); }
.portal-subnav a { min-height: 44px; display: inline-flex; align-items: center; }
.portal-content table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.portal-content td, .portal-content th { padding: 1rem; border: 1px solid var(--line); vertical-align: top; line-height: 1.6; overflow-wrap: anywhere; }
.portal-change-log { color: #fff; margin-right: auto; padding-block: .55rem; font-size: .8rem; }
@media (min-width: 841px) and (max-width: 1100px) { .brand { width: 170px; flex-basis: 170px; } .header-inner { gap: 1rem; } .nav-links a, .nav-links .nav-disabled { font-size: .84rem; } }
@media (max-width: 840px) { .nav-links .nav-disabled { padding-block: .4rem; } }
@media (max-width: 600px) {
 .profile-copy .profile-actions { grid-template-columns: auto minmax(0, 1fr) auto; gap: .35rem; }
 .profile-copy .profile-actions .button { padding: .55rem .55rem; font-size: .78rem; }
 .profile-action-centre { gap: .35rem; }
 .profile-copy .profile-actions .linkedin-button { width: 40px; flex-basis: 40px; padding: 0; }
 .footer-logos { --logo-letter-height: clamp(108px, 29vw, 135px); }
 .portal-card { grid-template-columns: 1fr; gap: 1rem; padding: 1.25rem; }
 .portal-content table { display: block; overflow-x: auto; }
 .portal-content td, .portal-content th { min-width: 190px; }
}
/* dev1: centred copyright with independent portal change-log link. */
.footer-bottom-inner { position: relative; display: flex; justify-content: center; align-items: flex-start; }
.footer-copyright { width: 100%; text-align: center; margin-inline: auto; }
.portal-change-log { position: absolute; left: 0; top: 5px; margin: 0; }
@media (max-width: 840px) {
 .footer-bottom-inner { flex-direction: column; align-items: center; gap: .15rem; }
 .portal-change-log { position: static; align-self: center; padding-block: .2rem; }
}
/* v14.4: tighter footer, white Contact label on the Contact page itself. */
.nav-links a.nav-contact.active { color: #fff; }
.footer-main { padding-block: 1.5rem; }
.footer-bottom-inner { min-height: 44px; padding-block: 0; align-items: center; }
.footer-copyright { padding-block: .6rem; }
.portal-change-log { top: 0; bottom: 0; display: flex; align-items: center; padding-block: 0; }
@media (max-width: 840px) {
 .footer-main { padding-block: 1.25rem; }
 .portal-change-log { position: static; padding-block: .2rem; }
}
@media (max-width: 600px) {
 .footer-copyright { padding-block: .45rem; }
}
/* v14.4.1: Pay It Forward height matches the blue "Put us to work for you personally" band on desktop. */
#pay-it-forward { padding-block: max(2.5rem, calc(clamp(3.5rem, 6vw, 5.5rem) - max(12px, min(5vw - 52.5px, 22px)))); }
/* v14.4.2: biography button rows - Previous/Next (and booking) above the biography, link buttons below. */
.profile-role { margin-bottom: 1.5rem; }
.profile-nav { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: stretch; gap: .65rem; padding-block: 1rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.profile-nav + .profile-bio { border-top: 0; }
.profile-nav-centre { display: flex; justify-content: center; align-items: stretch; min-width: 0; }
.profile-copy .profile-nav .button, .profile-copy .profile-links .button { min-height: 44px; margin: 0; padding: .6rem .9rem; font-size: .88rem; line-height: 1.25; gap: .45rem; border-radius: 3px; }
.profile-copy .profile-nav .booking-button { background: var(--blue); border-color: var(--blue); color: #fff; white-space: normal; text-align: center; }
.profile-links { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: stretch; gap: .5rem; margin-top: 2rem; }
.profile-copy .profile-links .button { height: 44px; }
.profile-copy .profile-links .social-button { background: #fff; border: 1px solid var(--line); padding-inline: .8rem; }
.profile-copy .profile-links .social-button:hover, .profile-copy .profile-links .social-button:focus-visible { background: #fff; border-color: var(--purple); }
.social-button img { display: block; width: auto; height: 22px; }
.social-instagram img { height: 26px; }
.profile-copy .profile-links .social-apple { background: #b73ceb; border-color: #b73ceb; }
.profile-copy .profile-links .social-apple:hover, .profile-copy .profile-links .social-apple:focus-visible { background: var(--purple); border-color: var(--purple); }
.social-apple img { height: 19px; }
.profile-copy .profile-links .website-button { background: var(--blue); border-color: var(--blue); color: #fff; }
.website-button svg { width: 18px; height: 18px; flex: 0 0 18px; }
.profile-copy .profile-links .linkedin-button { width: 44px; flex: 0 0 44px; padding: 0; background: var(--blue); border-color: var(--blue); color: #fff; }
@media (max-width: 600px) {
 .profile-nav { gap: .35rem; }
 .profile-copy .profile-nav .button { padding: .5rem .55rem; font-size: .78rem; }
 .profile-copy .profile-nav .booking-button { font-size: .74rem; }
 .profile-copy .profile-links .button { font-size: .8rem; padding-inline: .7rem; }
}
/* v14.4.3: names sized to the text column so the longest (Catherine Stagg-Macey) fits on one line, all names the same size;
   booking button turns purple on hover; larger Instagram wordmark. */
.profile-copy { container-type: inline-size; }
.profile-copy h1 { font-size: min(4.5rem, 8.4cqi); }
.profile-copy .profile-nav .booking-button:hover, .profile-copy .profile-nav .booking-button:focus-visible { background: var(--purple); border-color: var(--purple); color: #fff; }
.social-instagram img { height: 28px; }
.booking-button .nowrap { white-space: nowrap; }
/* v14.4.4: Instagram logo redrawn so the icon spans the wordmark's cap height (like YouTube); the image is padded at the top
   by the depth of the g so the icon sits centred in the button. Shown at 30px high = 15px icon, matching the YouTube icon. */
.social-instagram img { height: 30px; }
/* v14.4.5: biography lower button row. Button text is the biography text size; every logo is drawn on a frame whose
   middle half is the cap height, and shown at twice the cap height, so capitals and baselines line up across text and logos.
   Icons are the cap height (top of the capitals to the baseline); descenders hang below. Hover: purple, white logo. */
.profile-copy .profile-links .button { font-size: 1.06rem; padding-inline: .85rem; }
.profile-copy .profile-links .social-button { min-width: 6.4em; padding-inline: .8rem; }
.profile-links .logo-wrap { display: block; flex: none; }
.profile-links .logo { display: inline-block; vertical-align: baseline; width: auto; height: 1.43em; height: 2cap; margin-block: -.358em; margin-block: -.5cap; overflow: visible; }
.profile-copy .profile-links .website-button .globe svg { display: inline-block; width: .875em; height: .875em; width: 1.22cap; height: 1.22cap; vertical-align: -.08em; vertical-align: -.112cap; }
.profile-copy .profile-links .social-apple { background: #fff; border-color: var(--line); }
.social-youtube .lg-a { fill: #ff0000; } .social-youtube .lg-b { fill: #fff; } .social-youtube .lg-w { fill: #282828; }
.social-spotify .lg-a, .social-spotify .lg-w { fill: #1ed760; }
.social-linkedin .lg-a, .social-linkedin .lg-w { fill: var(--blue); }
.social-instagram .lg-a { fill: url(#ig-grad); } .social-instagram .lg-b { fill: #fff; } .social-instagram .lg-w { fill: #285c83; }
.social-apple .lg-a, .social-apple .lg-w { fill: #9933cc; }
.profile-copy .profile-links .button:hover, .profile-copy .profile-links .button:focus-visible { background: var(--purple); border-color: var(--purple); color: #fff; }
.profile-links .button:hover .lg-a, .profile-links .button:hover .lg-w, .profile-links .button:focus-visible .lg-a, .profile-links .button:focus-visible .lg-w { fill: #fff; }
.profile-links .button:hover .lg-b, .profile-links .button:focus-visible .lg-b { fill: var(--purple); }
@media (max-width: 600px) {
 .profile-copy .profile-links .button { font-size: 1.02rem; padding-inline: .75rem; }
}
/* v14.4.6: biography lower row - every button except Start a conversation is one width with less space at the sides;
   Website is a white button with blue var(--blue) text and globe in normal weight. Contact panel: two stacked buttons. */
.profile-copy .profile-links .social-button, .profile-copy .profile-links .website-button { min-width: 5.9em; padding-inline: .3em; justify-content: center; }
.profile-copy .profile-links .website-button { background: #fff; border-color: var(--line); color: var(--blue); font-weight: 400; gap: .35em; }
.contact-panel .button { text-align: center; }
.contact-panel .button + .button { margin-top: .75rem; }
/* v14.4.7: footer line breaks after "inc." on phones only; no underline under the Contact button label. */
.nav-links .nav-contact::after, .nav-links .nav-contact.active::after { content: none; display: none; }
@media (max-width: 600px) { .footer-copyright .rights { display: block; } }
@media (max-width: 350px) { .footer-copyright { font-size: .7rem; } }
/* v14.4.7: Our Why - second sentence is its own paragraph, with space between. */
.about-intro .lead + .lead { margin-top: 1.25rem; }
/* v14.4.9: What We Do overview and nine service pages (change list 0.60).
   Family colours: 1 and 3 purple, 2 fuchsia, used for bars, numbers and soft washes only; text never sits on fuchsia. */
.fam-purple { --fc: var(--purple); --fw: rgba(91, 58, 165, .07); }
.fam-pink { --fc: var(--fuchsia); --fw: rgba(245, 76, 158, .09); }
.svc-num { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 2rem; height: 2rem; border-radius: 50%; background: var(--fc); color: #fff; font-size: .95rem; font-weight: 700; line-height: 1; }
.svc-num.fam-pink { color: var(--ink); }
.svc-num-sm { width: 1.6rem; height: 1.6rem; font-size: .8rem; }
.svc-btn { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 48px; padding: .65rem 1rem; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--fc); border-radius: 3px; color: var(--ink); font-size: 1.02rem; font-weight: 600; line-height: 1.3; text-decoration: none; }
.svc-btn span { color: var(--purple); font-size: 1.3rem; line-height: 1; }
.svc-btn:hover, .svc-btn:focus-visible { background: var(--purple); border-color: var(--purple); color: #fff; }
.svc-btn:hover span, .svc-btn:focus-visible span { color: #fff; }
.photo-ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; aspect-ratio: 3 / 2; padding: 1.25rem; border: 2px dashed rgba(91, 58, 165, .45); border-radius: 3px; background: rgba(91, 58, 165, .04); color: var(--purple); text-align: center; }
.photo-ph span { font-size: 1.4rem; font-weight: 650; letter-spacing: .02em; }
.photo-ph small { max-width: 26rem; color: var(--muted); font-size: .88rem; line-height: 1.45; }
/* Overview: map of nine */
.svc-map-section { padding-bottom: clamp(3rem, 5vw, 4.5rem); }
.svc-map-line { color: var(--muted); max-width: 44rem; margin-bottom: 1.75rem; font-size: 1.08rem; }
.svc-map { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.svc-fam { background: var(--fw); border-top: 4px solid var(--fc); padding: 1.1rem 1rem 1.2rem; }
.svc-fam summary { display: flex; align-items: center; gap: .65rem; list-style: none; cursor: default; font-weight: 650; font-size: 1.02rem; line-height: 1.3; min-height: 2.6rem; margin-bottom: .9rem; }
.svc-fam summary::-webkit-details-marker { display: none; }
.svc-fam-list { display: flex; flex-direction: column; gap: .6rem; }
.svc-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin: 1.1rem 0 0; color: var(--muted); font-size: .88rem; }
.svc-legend span { display: inline-flex; align-items: center; gap: .45rem; }
.svc-legend .sw { display: inline-block; width: .85rem; height: .85rem; border-radius: 2px; background: var(--fc); }
/* Overview: family sections */
.svc-family { background: var(--fw); padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.svc-family-inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.svc-family.flip .photo-ph { order: 2; }
.svc-family .eyebrow { margin-bottom: .9rem; }
.svc-family-head { display: flex; align-items: center; gap: .85rem; margin-bottom: 1rem; }
.svc-family-head h2 { margin: 0; font-size: clamp(1.7rem, 2.8vw, 2.5rem); }
.svc-family-intro { color: var(--muted); font-size: 1.1rem; line-height: 1.6; max-width: 40rem; margin-bottom: 1.6rem; }
.svc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.svc-card p { margin: .55rem .1rem 0; color: var(--muted); font-size: .95rem; line-height: 1.5; }
/* Overview: helper and how-we-work line */
.svc-helper h2 { margin-bottom: .75rem; }
.svc-helper-note { color: var(--muted); max-width: 42rem; }
.svc-helper-form fieldset { border: 0; padding: 0; margin: 0 0 1.2rem; }
.svc-helper-form legend { font-weight: 650; margin-bottom: .6rem; }
.svc-pills { display: flex; flex-wrap: wrap; gap: .5rem; }
.svc-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.svc-pill span { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; cursor: pointer; font-size: .97rem; }
.svc-pill input:checked + span { background: var(--purple); border-color: var(--purple); color: #fff; }
.svc-pill input:focus-visible + span { outline: 3px solid var(--blue); outline-offset: 3px; }
.svc-pill span:hover { border-color: var(--purple); }
.svc-helper-result:not(:empty) { margin-top: 1.5rem; padding: 1.25rem; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--purple); max-width: 46rem; }
.svc-helper-result p { margin-bottom: .75rem; }
.svc-helper-result .svc-btn { max-width: 24rem; margin-bottom: .6rem; }
html:not(.js) .svc-helper { display: none; }
.svc-howline { text-align: center; }
.svc-howline .word-line { margin-bottom: .5rem; }
.svc-howline p:last-child { color: var(--muted); margin: 0; }
.cta-actions { display: flex; flex-direction: column; gap: .75rem; max-width: 24rem; }
.cta-actions .button { text-align: center; white-space: normal; }
/* Service pages */
.svc-page { padding-top: clamp(2rem, 4vw, 3rem); }
.svc-hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.svc-marker { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem; }
.svc-marker .eyebrow { margin: 0; }
.svc-hero h1 { font-size: clamp(2.6rem, 5vw, 4.4rem); margin-bottom: 1rem; }
.svc-promise { color: var(--purple); font-size: clamp(1.35rem, 2.2vw, 1.8rem); line-height: 1.35; letter-spacing: -.015em; margin-bottom: 1rem; }
.svc-nav { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem; margin-top: 2rem; padding-block: 1rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.svc-step-btn { min-height: 52px; padding: .45rem 1rem; flex-direction: column; align-items: flex-start; gap: 0; line-height: 1.25; text-align: left; }
.svc-step-btn[rel="next"] { align-items: flex-end; text-align: right; }
.svc-step-dir { font-size: .78rem; font-weight: 500; }
.svc-step-name { font-size: .98rem; font-weight: 650; }
.svc-mini { display: flex; justify-content: center; flex-wrap: wrap; gap: .8rem; }
.svc-sq-group { display: inline-flex; gap: .3rem; }
.svc-sq { width: 18px; height: 18px; border: 2px solid var(--fc); border-radius: 3px; background: #fff; }
.svc-sq.is-current { background: var(--fc); }
.svc-sq:hover, .svc-sq:focus-visible { background: var(--purple); border-color: var(--purple); }
.svc-section { padding-block: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); }
.svc-section h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); margin-bottom: 1rem; }
.svc-approach { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.svc-approach p { color: var(--muted); font-size: 1.06rem; line-height: 1.75; }
.svc-epigraph { margin: 1.5rem 0 0; padding-left: 1rem; border-left: 3px solid var(--fc); }
.svc-epigraph p { color: var(--ink); font-style: italic; font-size: 1.1rem; margin-bottom: .25rem; }
.svc-epigraph footer { color: var(--muted); font-size: .88rem; }
.svc-diagram { margin: 0; }
.svc-diagram svg { display: block; width: 100%; height: auto; max-width: 560px; margin-inline: auto; }
.svc-diagram figcaption { color: var(--muted); font-size: .9rem; text-align: center; margin-top: .5rem; }
.svc-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); }
.svc-changes, .svc-steps { margin: 0; padding-left: 1.2rem; }
.svc-changes li, .svc-steps li { margin-bottom: .6rem; line-height: 1.6; }
.svc-changes li::marker { color: var(--fc); }
.svc-steps li::marker { color: var(--purple); font-weight: 700; }
.svc-story { display: grid; gap: .3rem; max-width: 46rem; padding: 1.25rem 1.4rem; border: 1px solid var(--line); border-left: 4px solid var(--fc); background: #fff; color: var(--ink); text-decoration: none; position: relative; }
.svc-story span { color: var(--muted); }
.svc-story-link { padding-right: 3rem; }
.svc-story-go { position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); color: var(--purple) !important; font-size: 1.6rem; }
.svc-story-link:hover, .svc-story-link:focus-visible { background: var(--purple); border-color: var(--purple); color: #fff; }
.svc-story-link:hover span, .svc-story-link:focus-visible span { color: #fff !important; }
.svc-story-ph { border-style: dashed; border-left-style: solid; background: rgba(91, 58, 165, .04); }
.svc-leaders { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 1.1rem 1rem; }
.svc-leaders a { display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; color: var(--ink); font-size: .92rem; font-weight: 550; line-height: 1.3; text-decoration: none; }
.svc-face { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; background: #ece8f4; display: flex; align-items: center; justify-content: center; color: var(--purple); font-weight: 650; font-size: 1.3rem; }
.svc-leaders a:hover span, .svc-leaders a:focus-visible span { color: var(--purple); text-decoration: underline; }
.svc-related p { margin-bottom: .5rem; }
.svc-payfwd { border-bottom: 0; }
.svc-payfwd p { color: var(--muted); max-width: 52rem; }
.svc-print { min-height: 44px; padding: 0; border: 0; background: none; color: var(--purple); font: inherit; font-weight: 550; text-decoration: underline; text-underline-offset: .24em; cursor: pointer; }
html:not(.js) .svc-print-line { display: none; }
.svc-phonebar { display: none; }
.svc-page > .container { padding-bottom: clamp(1rem, 3vw, 2rem); }
@media (max-width: 980px) {
 .svc-cards { grid-template-columns: 1fr; }
 .svc-family-inner { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); }
}
@media (max-width: 840px) {
 .svc-map { grid-template-columns: 1fr; }
 .svc-family-inner, .svc-hero, .svc-approach, .svc-two { grid-template-columns: 1fr; }
 .svc-family.flip .photo-ph { order: 0; }
 .svc-fam summary { cursor: pointer; padding-right: 2rem; position: relative; margin-bottom: 0; }
 .svc-fam[open] summary { margin-bottom: .9rem; }
 .svc-fam summary::after { content: '+'; position: absolute; right: .2rem; color: var(--purple); font-size: 1.5rem; font-weight: 400; }
 .svc-fam[open] summary::after { content: '\2212'; }
}
@media (max-width: 600px) {
 .svc-nav { display: none; }
 .svc-phonebar { position: sticky; bottom: 0; z-index: 5; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .5rem; padding: .5rem .75rem; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 14px rgba(36, 33, 51, .06); }
 .svc-phonebar a { display: flex; align-items: center; gap: .45rem; min-height: 48px; color: var(--ink); font-size: .85rem; font-weight: 600; line-height: 1.2; text-decoration: none; }
 .svc-phonebar a[rel="next"] { justify-content: flex-end; text-align: right; }
 .svc-pb-arrow { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #d6d1e3; color: var(--purple); font-size: 1.2rem; }
 .svc-pb-all { flex-direction: column; justify-content: center; gap: .15rem !important; color: var(--purple) !important; font-size: .75rem !important; padding-inline: .5rem; }
 .svc-pb-grid { width: 18px; height: 18px; background: linear-gradient(90deg, transparent 33%, #fff 33%, #fff 40%, transparent 40%, transparent 60%, #fff 60%, #fff 67%, transparent 67%), linear-gradient(0deg, transparent 33%, #fff 33%, #fff 40%, transparent 40%, transparent 60%, #fff 60%, #fff 67%, transparent 67%), var(--purple); border-radius: 2px; }
 .svc-leaders { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
 .svc-face { width: 72px; height: 72px; }
}
/* Pink buttons: dark text on fuchsia for readability (4.8 to 1); hover stays white on purple. */
.button-fuchsia, .jump-links .button, .team-card .profile-link { color: var(--ink); }
.button-fuchsia:hover, .button-fuchsia:focus-visible, .team-card a:hover .profile-link, .team-card a:focus-visible .profile-link { color: #fff; }
/* Footer: the nine services, one click from every page. */
.footer-layout { grid-template-columns: minmax(0, .78fr) minmax(0, .9fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.footer-services .footer-heading { margin-bottom: .5rem; }
.footer-services .footer-heading a { color: var(--ink); text-decoration: none; }
.footer-services ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 1.5rem; }
.footer-services li { break-inside: avoid; font-size: .94rem; line-height: 1.3; }
.footer-services li a { display: inline-flex; align-items: center; min-height: 32px; color: var(--blue); text-decoration: none; }
.footer-services li a:hover { color: var(--purple); text-decoration: underline; }
@media (max-width: 840px) { .footer-layout { grid-template-columns: 1fr; gap: 2rem; } }
/* Biographies: services each person leads. */
.profile-services { margin-top: 1.5rem; color: var(--muted); font-size: .98rem; line-height: 1.7; }
.profile-services strong { color: var(--ink); }
/* Print: a clean one-page summary of a service. */
@media print {
 .site-shell { height: auto; display: block; overflow: visible; }
 .content-scroll { overflow: visible; }
 .site-header, .footer-main, footer, .svc-nav, .svc-phonebar, .photo-ph, .svc-helper, .svc-print-line, .cta-band .cta-actions, .skip-link, .svc-leaders img, .svc-face { display: none !important; }
 .svc-hero, .svc-approach, .svc-two { grid-template-columns: 1fr; }
 .svc-section { padding-block: .8rem; break-inside: avoid; }
 .svc-leaders { display: block; }
 .svc-leaders li { display: inline; }
 .svc-leaders li + li::before { content: ', '; }
 .cta-band { background: none !important; color: #000; padding: .5rem 0; }
 .cta-band p, .cta-band h2, .cta-band .eyebrow { color: #000 !important; }
 .cta-band .container::after { content: 'Info@DifferentWisdom.com  -  differentwisdom.com'; display: block; margin-top: .5rem; }
 details.faq > p { display: block; }
 a { color: #000; text-decoration: none; }
}
.svc-family.flip .svc-family-inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr); }
.svc-map-section { padding-top: clamp(2.5rem, 4vw, 3.5rem); }
.svc-helper-form .button { background: var(--purple); border-color: var(--purple); color: #fff; }
.svc-helper-form .button:hover, .svc-helper-form .button:focus-visible { background: var(--purple-dark); border-color: var(--purple-dark); }
.footer-layout { grid-template-columns: auto minmax(15rem, 1fr) minmax(0, 1fr); gap: 2.5rem clamp(2rem, 4vw, 4rem); }
@media (max-width: 1180px) { .footer-layout { grid-template-columns: auto minmax(0, 1fr); } .footer-services { grid-column: 1 / -1; } }
@media (max-width: 980px) { .svc-family.flip .svc-family-inner { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); } }
@media (max-width: 840px) { .footer-layout { grid-template-columns: 1fr; } .svc-family.flip .svc-family-inner { grid-template-columns: 1fr; } }
/* v14.4.9 print: keep a service page to about one page. */
@media print {
 @page { margin: 1.6cm; }
 body { font-size: 10.5pt; }
 .breadcrumb, .svc-diagram, .svc-epigraph, .svc-story, .svc-story + *, .svc-related, .svc-payfwd, .faq-list, .svc-section:has(.svc-story), .svc-section:has(.faq-list) { display: none !important; }
 .svc-page { padding-top: 0; }
 .svc-hero h1 { font-size: 24pt; margin-bottom: .2rem; }
 .svc-promise { font-size: 14pt; margin-bottom: .3rem; }
 .svc-hero .lead, .svc-approach p { font-size: 10.5pt; line-height: 1.45; color: #222; }
 .svc-section { padding-block: .35rem; border: 0; break-inside: auto; }
 .svc-section h2 { font-size: 13pt; margin-bottom: .3rem; }
 .svc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
 .svc-changes li, .svc-steps li { margin-bottom: .15rem; line-height: 1.35; }
 .svc-leaders li { display: inline; font-size: 10pt; }
 .svc-leaders a { display: inline; }
 .cta-band { padding: .3rem 0 0; }
 .cta-band h2 { font-size: 13pt; margin-bottom: .2rem; }
 .cta-band .eyebrow { display: none; }
}
@media print {
 @page { margin: 1.3cm; }
 body { font-size: 10pt; }
 .svc-page > .container { padding-bottom: 0; }
 .svc-section { padding-block: .2rem; }
 .svc-approach p { margin-bottom: .4rem; }
 .cta-band, .cta-band .container { padding-block: 0; margin: 0; }
 .content-scroll > * { break-after: auto; }
}
@media (max-width: 1180px) { .footer-services ul { columns: 3; max-width: 44rem; } }
@media (max-width: 600px) { .footer-services ul { columns: 2; } }
/* v14.4.10 (change list 0.61) */
/* Pink buttons: white text again, in bold (see the accessibility note in the change list). */
.button-fuchsia, .jump-links .button, .team-card .profile-link { color: #fff; font-weight: 700; }
/* Family 3: a deeper purple wash, to tell it apart from family 1. */
.fam-purple-deep { --fc: var(--purple); --fw: rgba(91, 58, 165, .14); }
.br-desk { display: inline; }
@media (max-width: 840px) { .br-desk { display: none; } }
/* Service cards: the one-line description starts under the first letter of the service name. */
.svc-card p { margin: .55rem 0 0; padding-left: calc(4px + 1rem); }
/* Service pages: nine labelled blocks, in order, grouped by family; the current page is purple with white text. */
.svc-blocks { display: flex; gap: .75rem; margin-top: 2rem; padding-block: 1rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.svc-block-group { display: flex; flex: 1 1 0; gap: .35rem; min-width: 0; }
.svc-block { flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center; min-height: 58px; padding: .45rem .4rem; background: var(--fw); border-top: 3px solid var(--fc); border-radius: 3px; color: var(--ink); font-size: .82rem; font-weight: 600; line-height: 1.2; text-align: center; text-decoration: none; overflow-wrap: anywhere; }
.svc-block:hover, .svc-block:focus-visible, .svc-block.is-current { background: var(--purple); border-top-color: var(--purple); color: #fff; }
@media (max-width: 980px) {
 .svc-blocks { flex-direction: column; gap: .4rem; }
 .svc-block { min-height: 48px; font-size: .85rem; overflow-wrap: normal; }
}
@media print { .svc-blocks { display: none !important; } }
/* Service pages: the nine-block navigation sits at the same height on every page (desktop), set by the tallest
   introduction (Decision Intelligence) at each screen width, allowing for the wider Mac font.
   Re-measure these values if any introduction changes. */
@media (min-width: 841px) and (max-width: 900.98px) { .svc-hero { min-height: 424px; } }
@media (min-width: 901px) and (max-width: 960.98px) { .svc-hero { min-height: 424px; } }
@media (min-width: 961px) and (max-width: 990.98px) { .svc-hero { min-height: 398px; } }
@media (min-width: 991px) and (max-width: 1050.98px) { .svc-hero { min-height: 403px; } }
@media (min-width: 1051px) and (max-width: 1100.98px) { .svc-hero { min-height: 417px; } }
@media (min-width: 1101px) and (max-width: 1150.98px) { .svc-hero { min-height: 431px; } }
@media (min-width: 1151px) and (max-width: 1200.98px) { .svc-hero { min-height: 445px; } }
@media (min-width: 1201px) and (max-width: 1250.98px) { .svc-hero { min-height: 447px; } }
@media (min-width: 1251px) and (max-width: 1300.98px) { .svc-hero { min-height: 430px; } }
@media (min-width: 1301px) and (max-width: 1350.98px) { .svc-hero { min-height: 433px; } }
@media (min-width: 1351px) and (max-width: 1410.98px) { .svc-hero { min-height: 437px; } }
@media (min-width: 1411px) { .svc-hero { min-height: 437px; } }

/* v14.4.11: arrow-key hint under the nine-block band (desktop with a mouse only) */
.svc-keys-hint { display: none; margin: .5rem 0 0; color: var(--muted); font-size: .78rem; text-align: right; }
@media (min-width: 981px) and (hover: hover) and (pointer: fine) { .js .svc-keys-hint { display: block; } }
.svc-keys-hint kbd { display: inline-block; min-width: 1.6em; padding: 0 .3em; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 3px; background: #fff; color: var(--ink); font-family: inherit; font-size: .75rem; line-height: 1.4; text-align: center; }

/* v14.4.11: "?" beside a quotation, and the explanation window it opens */
.quote-why { display: none; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; margin-left: .5rem; padding: 0; border: 1px solid var(--muted); border-radius: 50%; background: transparent; color: var(--muted); font-family: inherit; font-size: .78rem; font-weight: 600; font-style: normal; line-height: 1; vertical-align: middle; cursor: pointer; }
.js .quote-why { display: inline-flex; }
.quote-why[hidden] { display: none !important; }
.quote-why:hover, .quote-why:focus-visible { border-color: var(--purple); background: rgba(91, 58, 165, .08); color: var(--purple); }
.quote-why:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }
.quote-dialog { width: min(32rem, calc(100vw - 2rem)); max-height: min(75vh, 36rem); padding: 0; border: 0; border-top: 4px solid var(--fc, var(--purple)); border-radius: 6px; background: #fff; color: var(--ink); box-shadow: 0 18px 50px rgba(36, 33, 51, .28); overflow: hidden; }
.quote-dialog[open] { display: flex; flex-direction: column; }
.quote-dialog::backdrop { background: rgba(36, 33, 51, .45); }
.quote-dialog-body { overflow-y: auto; padding: 1.6rem 1.6rem 1.2rem; overscroll-behavior: contain; }
.quote-dialog h2 { margin: 0 2.4rem .9rem 0; color: var(--purple); font-size: 1.3rem; line-height: 1.3; }
.quote-dialog p { margin: 0 0 .85rem; color: var(--ink); font-size: .95rem; line-height: 1.6; }
.quote-dialog .quote-dialog-note { margin-top: 1.1rem; padding-top: .8rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .85rem; }
.quote-dialog-note span[lang] { font-style: italic; }
.quote-dialog-close { position: absolute; top: .5rem; right: .5rem; width: 2.25rem; height: 2.25rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.quote-dialog-close:hover, .quote-dialog-close:focus-visible { background: rgba(91, 58, 165, .1); color: var(--purple); }
.quote-dialog-close:focus-visible { outline: 2px solid var(--purple); outline-offset: 1px; }
@media print { .quote-why, .quote-dialog, .svc-keys-hint { display: none !important; } }

/* v14.4.11: phone menu button shows the icon only; "Menu" / "Close" stays for screen readers */
.menu-toggle [data-menu-label] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.menu-toggle { justify-content: flex-end; min-width: 44px; padding: .5rem 0; }

/* v14.4.11: more white space between the three families in the nine-block band. One line from 1141 pixels wide;
   narrower windows use three rows of three, as on tablets and phones, so long names such as "Development" never break. */
@media (min-width: 1141px) {
  .svc-blocks { gap: clamp(1.25rem, 2.8vw, 2.75rem); }
  .svc-block { padding-inline: .3rem; }
}
@media (min-width: 981px) and (max-width: 1140.98px) {
  .svc-blocks { flex-direction: column; gap: .4rem; }
  .svc-block { min-height: 48px; font-size: .85rem; overflow-wrap: normal; }
}

/* v14.4.12: phone menu - half the white space between the links */
@media (max-width: 840px) {
  .js .nav-links { gap: 0; }
  .js .nav-links a { min-height: 36px; }
  .js .nav-links .nav-disabled { min-height: 36px; padding-block: 0; }
}

/* v14.4.12: biographies on a phone - eyebrow, name, role and Previous / Next above the photo */
@media (max-width: 600px) {
  .profile-layout { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .profile-copy { display: contents; }
  .profile-copy > * { order: 3; }
  .profile-copy > .eyebrow, .profile-copy > h1, .profile-copy > .profile-role, .profile-copy > .profile-nav { order: 1; }
  .profile-photo { order: 2; margin-top: 1.5rem; }
  .profile-photo + .profile-copy > .profile-bio, .profile-copy > .profile-bio { margin-top: 1.5rem; }
}

/* v14.4.12: Leadership tree-ring photo diagram */
.svc-diagram svg.svc-tree { max-width: 460px; }

/* ===================== v14.5 - Phase 1 restructure (2026-10-19) ===================== */
/* Home: short introductory copy and three links under the heading */
.home-hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; padding-bottom: clamp(5rem, 14vh, 10rem); }
.home-hero-inner h1 { padding-bottom: .75rem; }
.home-hero-copy { max-width: 38rem; padding: 0 1.5rem; color: #fff; }
.home-hero-copy p { margin: 0 0 .55rem; font-size: clamp(1.02rem, 1.35vw, 1.22rem); line-height: 1.55; text-shadow: 0 1px 8px rgb(0 0 0 / 45%); }
.home-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.1rem; }
.home-links a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1.1rem; border: 1px solid rgb(255 255 255 / 75%); border-radius: 3px; background: rgb(17 21 28 / 40%); color: #fff; font-size: .95rem; font-weight: 600; text-decoration: none; }
.home-links a:hover, .home-links a:focus-visible { background: var(--purple); border-color: var(--purple); color: #fff; }

/* Ways We Help: opening copy and the "Nine ways we can help" introduction */
.ways-intro { max-width: 46rem; }
.ways-intro p { color: var(--muted); font-size: 1.05rem; line-height: 1.7; }
.svc-map-intro { max-width: 46rem; margin-bottom: 2.25rem; }
.svc-map-intro h2 { margin-bottom: 1rem; }
.svc-map-intro p { color: var(--muted); line-height: 1.7; }

/* Practice pages: second opening paragraph below the band, prose sections, rosters, Our Approach link */
.svc-intro-more { max-width: 46rem; margin-top: 2rem; }
.svc-intro-more .lead { margin: 0; }
.svc-prose { max-width: 46rem; }
.svc-two p { line-height: 1.7; }
.svc-roster-title { margin: 1.5rem 0 .9rem; font-size: 1.1rem; }
.svc-roster-title:first-of-type { margin-top: .5rem; }
.svc-related .svc-approach-link { margin-top: .9rem; }

/* Footer: links to the main pages under the nine areas */
.footer-services ul.footer-pages { columns: auto; display: flex; flex-wrap: wrap; gap: 0 1.25rem; margin-top: .75rem; padding-top: .6rem; border-top: 1px solid var(--line); }

/* Our Approach */
.approach-hero h1 { max-width: 18ch; }
.approach-hero .lead { max-width: 46rem; }
.approach-section p { line-height: 1.7; }

/* Six-item main menu: the menu button now takes over up to 1000 pixels wide (the six items need about 1000 pixels on a Mac),
   and the smaller menu text runs up to 1180 pixels. Rules copied from the phone menu above. */
@media (min-width: 841px) and (max-width: 1120px) {
  .header-inner { min-height: 80px; flex-wrap: wrap; gap: 0 1rem; padding-block: 12px; }
  .site-nav { flex: 0 0 100%; }
  .nav-links { justify-content: space-between; flex-wrap: wrap; gap: .3rem 1.5rem; padding-top: .6rem; }
  .js .menu-toggle { display: inline-flex; }
  .js .site-nav:not([data-open='true']) { display: none; }
  .js .site-nav[data-open='true'] { display: block; }
  .js .site-shell .site-nav { position: absolute; top: 100%; left: 0; right: 0; padding: 0 var(--page-inset) 1rem; max-height: calc(100vh - 160px); max-height: calc(100dvh - 160px); overflow-y: auto; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 12px 18px rgb(36 33 51 / 8%); }
  .js .nav-links { flex-direction: column; align-items: stretch; padding-top: 1rem; gap: 0; }
  .js .nav-links a { min-height: 36px; font-size: .95rem; }
  .js .nav-links a.active::after { right: auto; width: 28px; bottom: 4px; }
}
@media (min-width: 1101px) and (max-width: 1260px) { .brand { width: 170px; flex-basis: 170px; } .header-inner { gap: 1rem; } .nav-links a { font-size: .84rem; } }
.approach-hero .lead + .lead { margin-top: 1rem; }
.ways-intro { margin-top: 1.5rem; }

/* v14.5: print - the new practice-page parts in the compact one-page summary */
@media print {
  .home-links, .svc-approach-link { display: none !important; }
  .svc-intro-more { margin-top: .25rem; max-width: none; }
  .svc-prose { max-width: none; }
  .svc-hero .lead, .svc-approach p, .svc-intro-more .lead, .svc-prose p, .svc-two p { font-size: 10pt; line-height: 1.38; color: #222; margin-bottom: .3rem; }
  .svc-roster-title { font-size: 10.5pt; margin: .25rem 0 .1rem; }
  .cta-band p { font-size: 10pt; margin: 0; }
  .cta-band .container::after { margin-top: .25rem; }
}

/* v14.5.1 (change list 0.65): photo placeholders beside the opening text (Our Approach, Ways We Help,
   Situational Assessments) and beside "Our people" on About Us */
.hero-photo-split, .people-intro-split { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.hero-photo-split .hero-photo { margin-top: .4rem; }
.people-intro-split { margin-bottom: 2.5rem; }
.people-intro-split .team-intro { margin-bottom: 0; }
@media (max-width: 840px) { .hero-photo-split, .people-intro-split { grid-template-columns: 1fr; } }
/* v14.5.1: Home - wider copy so each line Andrew set (0.65) fits on one line on a computer */
.home-hero-copy { max-width: 52rem; }

/* ===================== v14.5.2 - site search (Pagefind) ===================== */
.site-search { display: flex; align-items: center; flex: none; }
.site-search-btn { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: .45rem .85rem; border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--ink); font-size: .95rem; line-height: 1.2; text-decoration: none; white-space: nowrap; }
.site-search-icon { color: var(--purple); flex: none; }
.site-search-btn:hover, .site-search-btn:focus-visible { border-color: var(--purple); color: var(--purple); }
.site-search-btn:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }
/* the search window in the site's colours and type
   (html:root outranks the search window's own :root defaults, which load later) */
html:root {
  --pf-font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --pf-text: #242133; --pf-text-secondary: #4a4659; --pf-text-muted: #625e70;
  --pf-background: #fff; --pf-border: #e2deea; --pf-border-focus: var(--purple); --pf-hover: rgba(91, 58, 165, .07);
  --pf-mark: var(--purple); --pf-outline-focus: var(--purple); --pf-outline-width: 2px; --pf-outline-offset: 2px;
  --pf-border-radius: 4px; --pf-input-height: 44px; --pf-input-font-size: 17px; --pf-summary-font-size: 14px;
  --pf-result-title-font-size: 17px; --pf-result-excerpt-font-size: 15px;
  --pf-modal-backdrop: rgba(36, 33, 51, .45); --pf-modal-max-width: 42rem; --pf-modal-top: 10vh;
}
@media print { .site-search { display: none !important; } }
/* All pages list */
.all-pages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 3rem; }
.all-pages h2 { font-size: 1.35rem; margin-bottom: .75rem; }
.all-pages h3 { font-size: 1rem; margin: 1.1rem 0 .4rem; color: var(--purple); }
.all-pages ul { list-style: none; margin: 0; padding: 0; }
.all-pages li a { display: inline-flex; align-items: center; min-height: 36px; color: var(--blue); }
@media (max-width: 840px) { .all-pages { grid-template-columns: 1fr; } }
/* make room for the Search button beside the six-item menu: the menu button now runs up to 1120 pixels,
   and the smaller menu text up to 1260 pixels (measured with an allowance for the wider Mac font) */
@media (min-width: 1121px) {
  .header-inner { gap: 1rem; }
  .nav-links { gap: clamp(.75rem, 1.25vw, 1.5rem); }
  .site-search-btn { padding: .45rem .7rem; }
}
@media (max-width: 1120px) {
  .site-search { order: 1; margin-left: auto; }
  .menu-toggle { order: 2; }
  .site-nav { order: 3; }
  .header-inner > .brand { order: 0; }
}
/* phones: logo, Search and the menu button stay on one line */
@media (max-width: 429px) {
  .header-inner { column-gap: .5rem; }
  .brand { width: 160px; flex-basis: 160px; }
  .site-search-btn { gap: .35rem; padding: .45rem .6rem; font-size: .9rem; }
}
/* very narrow phones (under 360 pixels): the magnifying glass alone; screen readers still hear "Search" */
@media (max-width: 359px) {
  .site-search-btn { justify-content: center; min-width: 44px; padding: .45rem; }
  .site-search-btn span { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
}
/* v14.5.3 (0.66): About Us "Our people" - the intro sits in the team grid; on desktop (four columns) it takes three
   columns and Andrew Bartley's card the fourth, so the twelve other cards fill three full rows. Phones and tablets
   keep the intro above the cards, as before. */
.people-grid .people-intro { grid-column: 1 / -1; }
.people-grid .people-intro .team-intro { margin-bottom: 0; }
@media (min-width: 981px) { .people-grid .people-intro { grid-column: 1 / span 3; } }
/* All pages: each family keeps its "A time to ..." label, as on Ways We Help */
.all-pages .eyebrow { margin: 1.4rem 0 .2rem; }
.all-pages .eyebrow + h3 { margin-top: 0; }
/* v14.5.4 About Us: "People are more important than what they do." stands as its own paragraph,
   in ordinary body text, with a little more space after it */
.about-conviction { margin-bottom: 2rem; }
/* v14.5.10: room between two opening paragraphs below the band (Decision Intelligence has two there) */
.svc-intro-more .lead + .lead { margin-top: 1rem; }
@media print { .svc-intro-more .lead + .lead { margin-top: .3rem; } }
/* v14.5.11 search options (chosen 2026-10-19)
   B: each result shows up to three lines of its excerpt, so the matching words can be seen before choosing */
pagefind-modal .pf-result-excerpt, pagefind-modal .pf-heading-excerpt { white-space: normal !important; display: -webkit-box !important; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* D: small headshots beside biography results, in the photos' own 4:5 shape so nothing is cropped */
html:root { --pf-image-width: 48px; --pf-image-height: 60px; }
/* A2: the matched words on the page a result opens, in a soft tint of the site's pink */
mark.pagefind-highlight { background: rgba(245, 76, 158, .25); color: inherit; padding: 0 .08em; border-radius: 2px; }
@media print { mark.pagefind-highlight { background: none; padding: 0; } }
/* v14.5.13 (change list 0.75): pages marked svc-print-faqs (Training) print their questions and answers.
   The other practice pages keep the compact one-page summary without questions. */
@media print {
  .svc-print-faqs .svc-section:has(.faq-list), .svc-print-faqs .faq-list { display: block !important; }
  .svc-print-faqs .faq { padding-block: .35rem; break-inside: avoid; }
  .svc-print-faqs .faq summary { padding: 0; font-size: 10.5pt; font-weight: 650; }
  .svc-print-faqs .faq summary::after { display: none; }
  .svc-print-faqs .faq p { font-size: 10pt; line-height: 1.38; color: #222; margin: .15rem 0 .25rem; padding-right: 0; }
  .svc-print-faqs details.faq::details-content { content-visibility: visible; display: block; }
}
/* v14.5.14 (change list 0.76): a short subheading under each practice heading (Coaching & Mentoring), and practitioner
   groups by practice (Individual Coaching, Systems Coaching, Mentoring), each with Practice Leads or Practice Team */
.svc-subhead { margin: -.35rem 0 1rem; font-size: clamp(1.1rem, 1.5vw, 1.25rem); font-weight: 400; line-height: 1.4; color: var(--purple); }
.svc-roster-group { margin: 2.25rem 0 .2rem; font-size: 1.3rem; }
.svc-roster-group:first-of-type { margin-top: .5rem; }
h4.svc-roster-title { margin: .35rem 0 .8rem; font-size: 1rem; font-weight: 600; color: var(--purple); }
@media print {
  .svc-subhead { font-size: 10.5pt; margin: 0 0 .15rem; }
  .svc-roster-group { font-size: 11pt; margin: .35rem 0 .05rem; }
  h4.svc-roster-title { font-size: 10pt; margin: .05rem 0 .05rem; }
}

/* v14.5.17 (Client Portal, 2026-10-22): a "Coming soon" stand-in for a portal button, a quiet second button, button
   rows, the sign-in help page, and the private portal map. */
.button.button-soon, .button.button-soon:hover { flex-direction: column; gap: .15rem; background: #ebe9f0; border: 1px dashed #b9b3c8; color: #575366; cursor: default; text-align: center; }
.button-soon__note { font-size: .74rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.button.button-quiet { background: #fff; border-color: var(--blue); color: var(--blue); }
.button.button-quiet:hover { background: #f0f2ff; border-color: var(--blue-dark); color: var(--blue-dark); }
.portal-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-block: 2rem; }
.portal-card .portal-actions { flex-direction: column; align-items: stretch; margin: 0; }
.signin-help > h1 { font-size: clamp(2.2rem, 4.5vw, 3.6rem); }
.signin-help > p { max-width: 46rem; }
.portal-map h3 { margin: 2rem 0 .6rem; font-size: 1.15rem; }
.portal-map ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.portal-map li { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) 7.5rem; gap: .4rem 1.5rem; align-items: baseline; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.portal-map .portal-status { justify-self: end; }
.portal-map__title { font-weight: 600; }
.portal-map__text { color: var(--muted); line-height: 1.55; }
.portal-status { font-size: .74rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); white-space: nowrap; }
.portal-status.is-soon { color: var(--muted); }
@media (max-width: 760px) {
  .portal-map li { grid-template-columns: 1fr; gap: .25rem; }
  .portal-map .portal-status { justify-self: start; }
  .portal-actions .button { flex: 1 1 100%; }
}
@media print {
  .portal-actions { display: none; }
}

/* v14.5.19 (change list 0.80): the Yoga & Retreats page (yoga.html), and the "Explore more of Andrew's work" button
   on Andrew's biography. Built from the existing tokens, borders, and spacing. */
.yoga-page { padding-top: clamp(2rem, 4vw, 3rem); }
.yoga-page > .container { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.yoga-hero { max-width: 46rem; padding-bottom: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); }
.yoga-hero h1 { font-size: clamp(2.6rem, 5vw, 4.4rem); margin-bottom: 1rem; }
.yoga-hero .lead { margin: 0; }
.yoga-hero .lead + .lead { margin-top: 1rem; }
.yoga-notice { max-width: 46rem; padding: 1.25rem 1.5rem; background: var(--soft); border: 1px solid var(--line); }
.yoga-notice p { margin: 0 0 .6rem; }
.yoga-notice p:last-child { margin-bottom: 0; }
.yoga-listing { padding: 1.25rem 1.5rem; background: var(--soft); border: 1px solid var(--line); margin-bottom: 1rem; }
.yoga-listing h3 { font-size: 1.2rem; margin-bottom: .6rem; }
.yoga-listing dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: .6rem 1.5rem; margin: 0; }
.yoga-listing dt { font-size: .74rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--purple); }
.yoga-listing dd { margin: .1rem 0 0; }
.yoga-offerings { margin-top: 1.5rem; gap: clamp(1rem, 3vw, 2rem); }
.yoga-offering { padding: clamp(1.25rem, 2.5vw, 2rem); background: var(--soft); border: 1px solid var(--line); }
.yoga-offering h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); margin-bottom: .75rem; }
.yoga-offering p { line-height: 1.7; }
.yoga-offering p:last-child { margin-bottom: 0; }
.yoga-note { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2rem); align-items: start; max-width: 52rem; padding-left: 1.25rem; border-left: 3px solid var(--purple); }
.yoga-note-photo { margin: 0; }
.yoga-note-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 3px; }
.yoga-note-text p { font-size: 1.08rem; line-height: 1.75; }
.yoga-note-text p:last-child { margin-bottom: 0; }
.yoga-stay h3 { font-size: 1.15rem; margin: 0 0 .5rem; }
.yoga-stay p { max-width: 46rem; }
.profile-more { margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.profile-more h2 { font-size: 1rem; font-weight: 600; letter-spacing: 0; line-height: 1.4; margin: 0 0 .75rem; }
/* v14.5.20 (0.82, section 3.2): the Yoga & Retreats button uses the biography's own outlined button style (as the
   Website button: same height, padding, type, and right alignment as LinkedIn and YouTube); no arrow. On hover it
   keeps a light background, so the purple monogram stays visible. */
.profile-copy .profile-more .profile-links { margin-top: 0; }
.profile-copy .profile-links .profile-more-button { gap: .45em; padding-inline: .8rem; }
.profile-copy .profile-links .profile-more-button:hover, .profile-copy .profile-links .profile-more-button:focus-visible { background: #f3f0fa; border-color: var(--purple); color: var(--blue); }
.profile-more-mark { width: auto; height: 1.43em; height: 2cap; flex: none; }
@media (max-width: 600px) {
  .yoga-note { grid-template-columns: 1fr; padding-left: 1rem; }
  .yoga-note-photo { max-width: 8rem; }
}

/* v14.5.20 (handoff 0.82): Yoga page without the two dividing lines at the end; Acknowledgements & Resources page. */
.yoga-page .yoga-questions, .yoga-page .yoga-stay { border-bottom: 0; }
.ack-page { padding-top: clamp(2rem, 4vw, 3rem); --fc: var(--purple); }
.ack-page > .container { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.ack-hero { padding-bottom: clamp(1rem, 2vw, 1.5rem); border-bottom: 1px solid var(--line); }
.ack-hero h1 { font-size: clamp(2.4rem, 5vw, 4.2rem); margin-bottom: .5rem; }
.ack-thanks { margin: 0 0 1rem; padding-left: 1.2rem; }
.ack-thanks li { margin-bottom: .6rem; line-height: 1.65; }
.ack-quote { margin: 1.25rem 0 1.5rem; }
.ack-quote p { line-height: 1.6; }
.ack-quote footer { margin-top: .5rem; font-size: .92rem; }
.ack-index ol { list-style: none; margin: 0 0 .5rem; padding: 0; columns: 2 17rem; column-gap: 2.5rem; }
.ack-index li { break-inside: avoid; }
.ack-index a { display: inline-flex; align-items: center; gap: .55rem; min-height: 34px; }
.ack-num { font-variant-numeric: tabular-nums; color: var(--purple); font-weight: 650; font-size: .85em; }
.ack-cat { padding-top: clamp(1.5rem, 3vw, 2.25rem); }
.ack-cat h3 { font-size: clamp(1.2rem, 2vw, 1.45rem); margin-bottom: .8rem; }
.ack-count { color: var(--muted); font-weight: 400; font-size: .85em; }
.ack-refs { list-style: none; margin: 0; padding: 0; max-width: 52rem; }
.ack-refs li { padding-left: 2rem; text-indent: -2rem; margin-bottom: .65rem; line-height: 1.6; overflow-wrap: anywhere; }
.dev-only { display: inline-block; margin-left: .4rem; padding: .1rem .5rem; border: 1px dashed #c8a94a; border-radius: 3px; background: #fff8e5; color: #5c4a12; font-size: .7rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; vertical-align: middle; }
/* v14.5.20 (0.82, section 3.1): the footer's Ways We Help list sizes its columns to the names, so "Organizational
   Retreats" stays on one line (same column order as before); a single column on phones narrower than 400px. */
.footer-services ul:not(.footer-pages) { columns: auto; display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); grid-template-rows: repeat(5, auto); grid-auto-flow: column; column-gap: 1.75rem; }
@media (max-width: 1180px) and (min-width: 601px) { .footer-services ul:not(.footer-pages) { grid-template-columns: repeat(3, minmax(0, max-content)); grid-template-rows: repeat(3, auto); } }
@media (max-width: 399px) { .footer-services ul:not(.footer-pages) { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; } }
@media (min-width: 1181px) { .footer-layout { grid-template-columns: auto minmax(15rem, 1fr) minmax(22rem, 1fr); } }
/* v14.5.21 (handoff 0.83) ------------------------------------------------------------------------------------
   Acknowledgements & Resources: two group headings, then one row per category. A populated category is a button in
   its H3 (styled like the site's question accordions: full-width row, purple + / -) that opens its list of citations.
   Lists start closed (site.js); without JavaScript they stay open. In-development categories are plain headings. */
.ack-resources { margin-top: clamp(1rem, 2vw, 1.5rem); }
.ack-tools { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; margin: 0 0 -1rem; padding-top: 1rem; }
.ack-tools[hidden] { display: none; }
.ack-all { min-height: 40px; padding: .45rem .9rem; border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--blue); font: inherit; font-size: .9rem; line-height: 1.25; cursor: pointer; }
.ack-all:hover, .ack-all:focus-visible { background: #f3f0fa; border-color: var(--purple); }
.ack-group > h2 { margin-bottom: 1rem; }
.ack-group .ack-cat { padding-top: 0; border-bottom: 1px solid var(--line); }
.ack-group h2 + .ack-cat { border-top: 1px solid var(--line); }
.ack-group .ack-cat h3 { margin: 0; font-size: clamp(1.08rem, 1.6vw, 1.22rem); font-weight: 550; line-height: 1.45; }
.ack-toggle { display: block; width: 100%; min-height: 52px; margin: 0; padding: .85rem 2.5rem .85rem 0; position: relative; border: 0; border-radius: 0; background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.ack-toggle:hover .ack-name { color: var(--purple); }
.ack-toggle .ack-chev { position: absolute; right: .25rem; top: .55rem; }
.ack-toggle .ack-chev::before { content: '+'; color: var(--purple); font-size: 1.5rem; font-weight: 400; line-height: 1; }
.ack-toggle[aria-expanded="true"] .ack-chev::before { content: '\2212'; }
.ack-cat-empty h3 { padding: .85rem 0; color: var(--muted); }
.ack-cat .ack-num { margin-right: .3rem; }
.ack-cat-empty .dev-only { margin-left: .3rem; }
.ack-panel { padding: 0; }   /* no padding here, so a closed list takes no space */
.ack-panel .ack-refs { padding: .1rem 0 1.25rem; }
.ack-panel .ack-refs li:last-child { margin-bottom: 0; }
/* Teaching at Western: the Yoga page's template (hero, prose, two cards per row) */
.taw-page { padding-top: clamp(2rem, 4vw, 3rem); }
.taw-page > .container { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.taw-hero { max-width: 46rem; padding-bottom: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); }
.taw-hero h1 { font-size: clamp(2.6rem, 5vw, 4.4rem); margin-bottom: 1rem; }
.taw-hero .lead { margin: 0; }
.taw-hero .lead + .lead { margin-top: 1rem; }
.taw-intro p { max-width: 46rem; }
.taw-courses { gap: clamp(1rem, 3vw, 2rem); padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.taw-course { display: flex; flex-direction: column; padding: clamp(1.25rem, 2.5vw, 2rem); background: var(--soft); border: 1px solid var(--line); }
.taw-course h2 { font-size: clamp(1.25rem, 2vw, 1.5rem); line-height: 1.3; margin-bottom: .75rem; }
.taw-course p { line-height: 1.7; }
.taw-question { color: var(--ink); }
.taw-question strong { font-weight: 600; }
.taw-course .taw-link { margin: auto 0 0; padding-top: .25rem; }
.taw-link a { font-weight: 550; }
@media (max-width: 760px) { .taw-courses { grid-template-columns: 1fr; } }
/* Andrew's biography: Leadership Courses and Yoga & Retreats side by side at the same width (the wider of the two),
   aligned right like the controls below; on phones one above the other, still the same width and aligned right. */
.profile-copy .profile-more .profile-more-links { display: grid; grid-template-columns: repeat(2, 1fr); width: max-content; max-width: 100%; margin-left: auto; }
.profile-copy .profile-more-links .profile-more-button { justify-content: center; white-space: nowrap; }
@media (max-width: 600px) { .profile-copy .profile-more .profile-more-links { grid-template-columns: 1fr; } }
@media print {
  .ack-panel[hidden] { display: block !important; content-visibility: visible !important; }
  .ack-tools, .ack-toggle .ack-chev { display: none !important; }
  .ack-toggle { min-height: 0; padding: .35rem 0; }
  .ack-page .ack-quote, .ack-page .ack-quote footer { display: block !important; }   /* print rules for practice pages and the site footer hid the quotation and its attribution (v14.5.20) */
  .taw-courses { display: block; }
  .taw-course { break-inside: avoid; margin-bottom: .6rem; background: none; }
}
/* v14.5.24 (handoff 0.86) ------------------------------------------------------------------------------------
   Opening photo placeholders on Yoga & Retreats and Teaching at Western: the text keeps its width, the placeholder sits
   beside it on computers and below it on phones (the site's usual hero-photo-split). */
.yoga-hero.has-photo, .taw-hero.has-photo { max-width: none; }
.yoga-hero.has-photo .hero-photo-split > div:first-child, .taw-hero.has-photo .hero-photo-split > div:first-child { max-width: 46rem; }
/* Acknowledgements: Photo 3 inside Personal Thanks, right of the text on computers, under the heading on phones */
.ack-thanks-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(14rem, 19rem); grid-template-areas: "text photo"; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.ack-thanks-split .ack-thanks-text { grid-area: text; }
.ack-thanks-split .ack-thanks-photo { grid-area: photo; margin-top: .3rem; }
.ack-thanks-text > :last-child { margin-bottom: 0; }
@media (max-width: 760px) { .ack-thanks-split { grid-template-columns: 1fr; grid-template-areas: "photo" "text"; } .ack-thanks-split .ack-thanks-photo { max-width: 24rem; } }
/* Resources: the usual page-hero, then About These Resources with the Newton reflection in one softly shaded box */
.res-about p { max-width: 46rem; }
.res-callout { max-width: 46rem; margin: 1.25rem 0 1.5rem; padding: clamp(1.1rem, 2.5vw, 1.6rem) clamp(1.1rem, 3vw, 1.9rem); background: var(--soft); border: 1px solid var(--line); border-left: 4px solid var(--purple); border-radius: 3px; }
.res-callout .res-quote { margin: 0; }
.res-callout .res-quote p { color: var(--ink); font-size: 1.08rem; line-height: 1.65; margin: 0; }
.res-callout .res-attribution { margin: .55rem 0 1rem; font-size: .94rem; color: var(--muted); }
.res-callout > p:last-child { margin-bottom: 0; }
.res-page .ack-resources { margin-top: 0; }
/* About Us: the people section keeps its eyebrow, heading, two paragraphs and "Meet our team" link (cards removed) */
#team .people-grid:not(:has(.team-card)) { display: block; }
@media print { .res-callout { background: none; break-inside: avoid; } }
/* ===== v14.5.25 (update 0.87): photographs, the team montage, Our Team cards, "All 9" ===== */
/* (Also v14.5.25: the phone menu rule above reads ".js .site-nav:not([data-open='true'])", was "[data-open='false']", so the
   menu is folded from the first paint now that each page marks itself as scripted in its head.) */
/* A placed photograph keeps its own proportions. Each figure carries --ph-ratio (width / height); the figure is as wide
   as its column allows without the photograph passing --ph-max in height, and the image fills the figure at its own
   ratio: no crop, no stretch, no letterbox. width and height on the img reserve the space, so nothing moves as it loads. */
.site-photo { --ph-max: min(72vh, 36rem); display: block; margin: 0; width: min(100%, calc(var(--ph-max) * var(--ph-ratio, 1.5))); }
.site-photo img { display: block; width: 100%; height: auto; border-radius: 3px; }
.photo-credit { margin: .45rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.4; letter-spacing: .01em; font-style: italic; text-align: right; }   /* 0.88: italic, right-aligned at the photo's edge */
.hero-photo-split > .site-photo, .svc-hero > .site-photo { justify-self: end; margin-top: .4rem; }
/* practice pages: at most 23rem tall on computers, so the opening keeps the same height from practice to practice and the
   band of nine practice buttons under it stays in place when moving between them */
.svc-hero > .site-photo { --ph-max: min(62vh, 23rem); }
.svc-family-inner > .site-photo { --ph-max: min(62vh, 28rem); justify-self: center; }
.svc-family.flip .site-photo { order: 2; }
.ack-thanks-split > .site-photo { --ph-max: min(72vh, 34rem); justify-self: end; }
.yoga-note { grid-template-columns: 12rem minmax(0, 1fr); }
.yoga-note > .site-photo { --ph-max: 24rem; }
.yoga-note > .site-photo img { aspect-ratio: auto; object-fit: fill; }
@media (max-width: 840px) {
  .hero-photo-split > .site-photo, .svc-hero > .site-photo { --ph-max: min(62vh, 30rem); justify-self: start; }
  .svc-family-inner > .site-photo { justify-self: start; }
  .svc-family.flip .site-photo { order: 0; }
}
@media (max-width: 760px) { .ack-thanks-split > .site-photo { --ph-max: min(62vh, 30rem); justify-self: start; max-width: none; } }
@media (max-width: 600px) { .yoga-note { grid-template-columns: 1fr; } .yoga-note > .site-photo { max-width: 10rem; } }
/* Situational Assessments: Photo 49 beside the introduction of "A fuller picture of what matters" */
.intro-photo-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; margin-bottom: 3rem; }
.intro-photo-split .section-intro { margin-bottom: 0; }
.intro-photo-split > .site-photo { --ph-max: min(62vh, 26rem); justify-self: end; }
@media (max-width: 840px) { .intro-photo-split { grid-template-columns: 1fr; gap: 1.75rem; } .intro-photo-split > .site-photo { justify-self: start; } }
/* Biographies: the feature photo keeps its own proportions (as before) and, if very tall, is narrowed so that all of it
   fits on the screen (--ph-ratio on the portrait). Replacing a feature photo: change src, srcset, width, height, alt. */
.profile-photo .portrait:not(.initials) { width: min(100%, calc((100vh - 4rem) * var(--ph-ratio, 1))); margin-inline: auto; }
@media (max-width: 840px) { .profile-photo .portrait:not(.initials) { width: min(100%, calc(75vh * var(--ph-ratio, 1))); margin-inline: 0; } }
/* About Us, Our people: the 4 x 3 team montage is one link to Our Team ("Meet our team"), with a visible button under it */
.people-montage-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.people-montage-split .team-intro { margin-bottom: 0; }
.team-montage { display: grid; justify-items: start; gap: 1.4rem; }
.team-montage-link.site-photo { --ph-max: 30rem; border-radius: 3px; }
.team-montage-link img { transition: opacity .2s ease, box-shadow .2s ease; }
.team-montage-link:hover img { opacity: .9; box-shadow: 0 10px 26px rgb(36 33 51 / 16%); }
.team-montage-link:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.team-montage .team-more { margin: 0; }
.team-montage .team-more .button { min-height: 54px; padding-inline: 1.8rem; font-size: 1.08rem; }
@media (max-width: 840px) { .people-montage-split { grid-template-columns: 1fr; } }
/* Our Team (v14.5.26, 0.88): four across on computers; all thirteen cards identical (Andrew first, labelled Principal, not
   enlarged). Every directory portrait is exactly 4:5, the shape of the photographs themselves, so whole heads show (no crop). */
@media (min-width: 981px) { .team-grid.team-directory { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem 1.6rem; } }
.team-directory .portrait { aspect-ratio: 4 / 5; }
/* Ways We Help: "All 9" on a practice page arrives at the 3 x 3 grid; the practice the visitor came from stays marked */
#all-nine { scroll-margin-top: 1.5rem; }
#all-nine:focus { outline: none; }
#all-nine:focus-visible { outline: 3px solid var(--blue); outline-offset: 6px; }
.svc-btn.is-from { background: var(--purple); border-color: var(--purple); color: #fff; box-shadow: 0 0 0 3px rgb(91 58 165 / 25%); }
.svc-btn.is-from span { color: #fff; }
/* 320px check: the one-word heading "Acknowledgements" was wider than a 320px screen (sideways scrolling since v14.5.24) */
@media (max-width: 400px) { .ack-hero h1 { font-size: min(2.4rem, 9.6vw); } }
@media print {
  .svc-page .site-photo { display: none !important; }
  .site-photo { --ph-max: 3.5in; break-inside: avoid; }
}
/* ===== v14.5.26 (update 0.88) ===== */
/* Footer navigation (0.88, section 2.2): exactly two columns of ten links, same spacing in both. Ways We Help (black bold
   heading, still a link to the overview): the nine practices in Blue, then All pages in Purple. Explore (black bold heading):
   ten site pages in Blue. Side by side down to 521px; stacked (Ways We Help first) on narrower phones. */
.footer-services.footer-two { display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); column-gap: clamp(2rem, 4vw, 3.5rem); row-gap: 1.25rem; align-items: start; }
.footer-two .footer-col ul, .footer-two ul:not(.footer-pages) { display: block; columns: auto; grid-template-columns: none; grid-template-rows: none; margin: 0; padding: 0; list-style: none; }
.footer-two .footer-heading { margin: 0 0 .35rem; min-height: 32px; display: flex; align-items: center; font-size: .94rem; font-weight: 700; color: var(--ink); }
.footer-two .footer-heading a { color: var(--ink); font-weight: 700; text-decoration: none; }
.footer-two .footer-heading a:hover { color: var(--ink); text-decoration: underline; }
.footer-two li a { white-space: nowrap; }
.footer-two li.footer-all a { color: var(--purple); }
.footer-two li.footer-all a:hover { color: var(--purple); }
@media (max-width: 520px) { .footer-services.footer-two { grid-template-columns: 1fr; } }
/* Footer logos are links to the home page (0.88, section 2.1) */
.footer-logo-link { display: inline-flex; border-radius: 3px; }
/* Land Acknowledgement (0.88, section 1.3): DEVELOPMENT-ONLY layout preview. Lorem ipsum text with a visible preview label and a
   3:2 image placeholder: placeholder to the right of the text on computers, above it on tablets and phones. */
.ack-land-preview { margin-top: .25rem; padding: clamp(1rem, 2.5vw, 1.5rem); border: 2px dashed #c8a94a; border-radius: 4px; background: #fffdf6; }
.dev-preview-label { display: inline-block; margin: 0 0 1rem; padding: .3rem .65rem; border: 1px solid #c8a94a; border-radius: 3px; background: #fff8e5; color: #5c4a12; font-size: .85rem; font-weight: 650; letter-spacing: .02em; }
.ack-page .ack-land { max-width: 64rem; }   /* wider than ordinary prose, so the text keeps a readable measure beside the image */
.ack-land-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); grid-template-areas: "text photo"; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.ack-land-text { grid-area: text; }
.ack-land-text p:last-child { margin-bottom: 0; }
.ack-land-photo-pending { grid-area: photo; aspect-ratio: 3 / 2; display: grid; place-items: center; padding: 1rem; background: #efeef3; border: 1px solid var(--line); border-radius: 3px; color: #575366; font-size: .9rem; line-height: 1.4; text-align: center; }
@media (max-width: 1024px) { .ack-land-split { grid-template-columns: 1fr; grid-template-areas: "photo" "text"; } .ack-land-photo-pending { width: min(100%, 30rem); } }
.anchor-alias { display: block; }

/* ---------------- v14.5.27 (instruction 0.90, 2026-11-01) ---------------- */
/* Device classes (0.90 sections 3 and 6): phone up to 599 px wide; tablet 600 to 1024 px, portrait or landscape by its shape;
   desktop 1025 px and wider. "Side by side" (Photo 32, Land Acknowledgement): desktop, or landscape at 960 px and wider.
   The <source media> queries in the pages use exactly these queries. */
/* Art-directed photographs: the browser shows the approved composition for the device (picture/source); the figure's
   --ph-ratio follows it, and the image keeps that exact ratio, so space is reserved before it loads and nothing is cropped. */
.site-photo picture { display: block; }
.site-photo.art img { aspect-ratio: var(--ph-ratio); object-fit: fill; }
.site-photo.art-dev { --ph-ratio: var(--r-desk); }
@media (min-width: 600px) and (max-width: 1024.98px) and (orientation: landscape) { .site-photo.art-dev { --ph-ratio: var(--r-tl); } }
@media (min-width: 600px) and (max-width: 1024.98px) and (orientation: portrait) { .site-photo.art-dev { --ph-ratio: var(--r-tp); } }
@media (max-width: 599.98px) { .site-photo.art-dev { --ph-ratio: var(--r-ph); } }
.site-photo.art-side { --ph-ratio: var(--r-stack); }
@media (min-width: 1025px), (min-width: 960px) and (orientation: landscape) { .site-photo.art-side { --ph-ratio: var(--r-side); } }

/* Personal Thanks (Photo 32). Stacked: heading, the opening paragraph, the square photo, then the rest of the text.
   Side by side: the long vertical photo to the right of all the text, at the width the photo had before (about 246 px),
   so the text column is unchanged; the photo is longer. */
.ack-thanks-split { grid-template-columns: minmax(0, 1fr); grid-template-areas: "open" "photo" "text"; row-gap: 0; }
.ack-thanks-split .ack-thanks-open { grid-area: open; }
.ack-thanks-split > .site-photo { grid-area: photo; --ph-max: min(62vh, 30rem); width: min(100%, calc(var(--ph-max) * var(--ph-ratio))); max-width: none; justify-self: start; margin: .2rem 0 1.5rem; }
@media (min-width: 1025px), (min-width: 960px) and (orientation: landscape) {
  .ack-thanks-split { grid-template-columns: minmax(0, 1fr) minmax(14rem, 19rem); grid-template-areas: "open photo" "text photo"; grid-template-rows: auto 1fr; }
  .ack-thanks-split > .site-photo { width: min(100%, 15.35rem); justify-self: end; margin: .3rem 0 0; }
}

/* Land Acknowledgement: the approved photo, then the labelled development-only placeholder text. Stacked (portrait tablet,
   phone): the wide photo under the heading, the text under it. Side by side: the tall photo to the right of the text. */
.ack-land-split { grid-template-columns: minmax(0, 1fr); grid-template-areas: "photo" "text"; gap: 1.5rem; }
.ack-land-split > .site-photo { grid-area: photo; --ph-max: 30rem; width: min(100%, 30rem); }
.ack-land-split > .ack-land-preview { grid-area: text; margin-top: 0; }
@media (min-width: 1025px), (min-width: 960px) and (orientation: landscape) {
  .ack-land-split { grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); grid-template-areas: "text photo"; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
  .ack-land-split > .site-photo { width: 100%; }
}

/* Our Team (0.90 section 4.1): heading and introduction in the first row of the grid, beside Andrew's card (first three of four
   columns on desktops, 1024 px included); the twelve associates in three rows of four. Every row is the same height, so the
   distance from row to row is the same. No dividing line (decision A). Narrower screens: the heading on top, then the cards. */
.team-directory .team-intro { grid-column: 1 / -1; align-self: start; }
.team-directory .team-intro .lead { margin-bottom: 0; }
@media (min-width: 981px) { .team-grid.team-directory { grid-auto-rows: 1fr; } .team-directory .team-intro { grid-column: span 3; } }

/* Ways We Help family sections (0.90 section 4.2). In the page: eyebrow and heading, then the photo, then the text and links.
   Desktops and tablets look as before: photo beside the text, the text block centred against the photo; photo above the text
   when stacked (840 px and narrower). Phones only (up to 599 px): eyebrow and heading, photo and caption, then the text. */
.svc-family-inner { grid-template-rows: 1fr auto auto 1fr; grid-template-areas: "photo ." "photo top" "photo copy" "photo ."; row-gap: 0; }
.svc-family.flip .svc-family-inner { grid-template-areas: ". photo" "top photo" "copy photo" ". photo"; }
.svc-family-inner > .site-photo { grid-area: photo; align-self: center; }
.svc-family-inner > .svc-family-top { grid-area: top; }
.svc-family-inner > .svc-family-copy { grid-area: copy; }
@media (max-width: 840px) {
  .svc-family-inner, .svc-family.flip .svc-family-inner { grid-template-rows: none; grid-template-areas: "photo" "top" "copy"; }
  .svc-family-inner > .site-photo { align-self: start; margin-bottom: clamp(2rem, 5vw, 4.5rem); }
}
@media (max-width: 599.98px) {
  .svc-family-inner, .svc-family.flip .svc-family-inner { grid-template-areas: "top" "photo" "copy"; }
  .svc-family-inner > .site-photo { margin-bottom: 1.75rem; }
}

/* ---------------- v14.5.28 (instruction 0.91, 2026-11-01) ---------------- */
:root { --purple-line: rgba(91, 58, 165, .22); }   /* a restrained tint of brand Purple for thin separators */
/* 2.1 Questions end cleanly: the last question's own line is the only line before "Explore related work" */
.svc-faqs { border-bottom: 0; padding-bottom: 0; }
/* 2.2 Explore related work: two columns on desktops and tablets, stacked on phones; Our Approach below as a quieter link */
.svc-related { border-bottom: 0; }
.svc-related > h2 { margin-bottom: 1.25rem; }
.svc-related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem clamp(2rem, 5vw, 4rem); max-width: 52rem; }
.svc-related-label { margin: 0 0 .65rem; color: var(--muted); font-size: .78rem; font-weight: 650; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; }
.svc-related-links { list-style: none; margin: 0; padding: 0; }
.svc-related-links li { margin: 0 0 .5rem; line-height: 1.45; }
.svc-related-links a { color: var(--purple); }
.svc-related .svc-approach-link { max-width: 52rem; margin: 1.6rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--purple-line); font-size: .95rem; }
@media (max-width: 599.98px) { .svc-related-grid { grid-template-columns: minmax(0, 1fr); } }
/* 3 Pay It Forward on practice pages: white section, one fine purple-tinted rule above; the summary, then the disclosure
   button, which swaps the summary for the two paragraphs (same page). Without JavaScript the two paragraphs show. */
.svc-pif { border-top: 1px solid var(--purple-line); border-bottom: 0; }
.svc-pif-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1.25rem clamp(2rem, 5vw, 4rem); align-items: start; }
.svc-pif .eyebrow { margin-bottom: .65rem; }
.svc-pif-head h2 { margin: 0; }
.svc-pif-body p { max-width: 40rem; }
.svc-pif-more p:last-child { margin-bottom: .6rem; }
.js .svc-pif-more { display: none; }
.js .svc-pif.is-open .svc-pif-more { display: block; }
.js .svc-pif.is-open .svc-pif-summary { display: none; }
html:not(.js) .svc-pif-summary, html:not(.js) .svc-pif-toggle { display: none; }
.svc-pif-toggle { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; padding: 0; border: 0; background: none; color: var(--purple); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: .24em; text-decoration-thickness: 1px; cursor: pointer; }
.svc-pif-toggle:hover { text-decoration-thickness: 2px; }
.svc-pif-chev { width: .5rem; height: .5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-.15rem) rotate(45deg); }
.svc-pif-toggle[aria-expanded="true"] .svc-pif-chev { transform: translateY(.15rem) rotate(-135deg); }
@media (max-width: 599.98px) { .svc-pif-grid { grid-template-columns: minmax(0, 1fr); } }
.svc-page > .container > .svc-print-line { margin: 0; padding-bottom: clamp(2rem, 4vw, 3rem); }
/* 4 the resources question on five practice pages: the complete list, hanging indents, then one link */
.faq .svc-refs { list-style: none; margin: .7rem 0 .5rem; padding: 0 2rem 0 0; max-width: 46rem; }
.faq .svc-refs li { padding-left: 1.6rem; text-indent: -1.6rem; margin-bottom: .6rem; color: var(--muted); line-height: 1.55; overflow-wrap: anywhere; }
.faq .svc-refs-more { margin: 1rem 0 .4rem; }
.faq .svc-refs-more a { font-weight: 600; }
/* 4.1 Resources page: purple-tinted separators; a clear purple focus ring for keyboard users; after a practice page's link
   lands on a category, a quiet purple mark instead of the ring until a key is pressed (site.js) */
.ack-group .ack-cat { border-bottom-color: var(--purple-line); }
.ack-group h2 + .ack-cat { border-top-color: var(--purple-line); }
.ack-toggle:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; border-radius: 2px; }
.ack-toggle.is-arrived:focus-visible { outline-color: transparent; box-shadow: inset 4px 0 0 var(--purple); }
.ack-panel .ack-refs { padding: .2rem 0 1.4rem; }
.ack-panel .ack-refs li { margin-bottom: .7rem; }
/* the printed page artwork exists only for printing (css/print-practice.css) */
.print-art { display: none; }

/* ===== v14.5.30 (instruction 0.92, 2026-11-01): progressive disclosure and page hierarchy ===== */
/* 1 Disclosure rows (practice pages, Acknowledgements, Our Approach): the heading stays a heading; site.js puts a button
   inside it that opens and closes the section below (aria-expanded). Same look as the Resources categories: dark
   heading text, thin purple-tinted lines, a brand-Purple + when closed and minus when open at the right, a purple ring
   for keyboard focus only. Several rows may be open at once. No animation. Without JavaScript every section shows open. */
.dsc-btn { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0;
  background: none; color: inherit; font: inherit; letter-spacing: inherit; line-height: inherit; text-align: left; text-wrap: inherit; cursor: pointer; }
.dsc-label { min-width: 0; }
.dsc-sign { flex: none; width: 1.25rem; text-align: center; }
.dsc-sign::before { content: '+'; color: var(--purple); font-size: 1.5rem; font-weight: 400; line-height: 1; letter-spacing: 0; }
.dsc.is-open .dsc-sign::before { content: '\2212'; }
.dsc-btn:hover .dsc-label { color: var(--purple); }
.dsc-btn:focus { outline: none; }
.dsc-btn:focus-visible { outline: 2px solid var(--purple); outline-offset: 4px; border-radius: 2px; }
/* a closed section takes no space; before the script has run, closed sections are already closed (no jump) */
.js .dsc[data-dsc="closed"]:not(.dsc-ready) .dsc-panel { display: none; }

/* 3 Practice pages: "What this can strengthen" and "What the work may involve" as two full-width rows, text kept to a
   readable width; then "Questions (N)" as one row. */
.svc-what, .svc-faqs.dsc { padding-block: 0; border-bottom: 1px solid var(--purple-line); }
.svc-what .dsc-head, .svc-faqs.dsc .dsc-head { margin: 0; padding-block: clamp(1rem, 2vw, 1.35rem); }
.svc-what .dsc-panel { max-width: 46rem; }
.svc-what.is-open .dsc-panel, .svc-what:not(.dsc-ready) .dsc-panel { padding-bottom: clamp(1.25rem, 2.5vw, 1.75rem); }
.svc-what .dsc-panel p { line-height: 1.7; }
.svc-what .dsc-panel > :last-child { margin-bottom: 0; }
.svc-faqs.dsc.is-open, .svc-faqs.dsc:not(.dsc-ready) { border-bottom: 0; }
.svc-faqs.dsc.is-open .dsc-panel, .svc-faqs.dsc:not(.dsc-ready) .dsc-panel { padding-bottom: 0; }

/* 2 Acknowledgements: three closed rows under the Land Acknowledgement, a thin line between rows, compact spacing; the
   text inside keeps its width and the Personal Thanks photograph keeps its placement. */
.ack-page .ack-row { max-width: none; padding-block: 0; border-bottom: 1px solid var(--purple-line); }
.ack-page .ack-land + .ack-row { border-top: 1px solid var(--purple-line); }
.ack-page .ack-row .dsc-head { margin: 0; padding-block: clamp(1rem, 2vw, 1.35rem); }
.ack-page .ack-row .dsc-panel { max-width: 46rem; }
.ack-page .ack-row.is-open .dsc-panel, .ack-page .ack-row:not(.dsc-ready) .dsc-panel { padding-bottom: clamp(1.25rem, 2.5vw, 1.75rem); }
.ack-page .ack-row .dsc-panel > :last-child { margin-bottom: 0; }
.ack-page .ack-land { border-bottom: 0; }

/* 4 Our Approach: four bands, alternately white and soft tint as before; heading left and text right when open on wide
   screens, stacked on narrow ones; a closed band shows only its heading, with the sign at the band's right edge, and
   the whole row opens it. */
.approach-section.dsc .container { position: relative; }
.approach-section.dsc .dsc-head { margin: 0; padding-right: 2.5rem; }
.approach-section.dsc .dsc-btn { display: block; position: static; }
.approach-section.dsc .dsc-sign { position: absolute; right: 0; top: calc((1.12 * clamp(2rem, 3.55vw, 3.35rem) - 1.5rem) / 2); line-height: 1; }
.approach-section.dsc.dsc-ready:not(.is-open) { padding-block: clamp(1.6rem, 3vw, 2.4rem); }
.approach-section.dsc.dsc-ready:not(.is-open) .dsc-btn::after { content: ''; position: absolute; inset: -1rem 0; }
.js .approach-section.dsc[data-dsc="closed"]:not(.dsc-ready) { padding-block: clamp(1.6rem, 3vw, 2.4rem); }
@media (min-width: 841px) { .approach-section.dsc .dsc-panel { padding-right: 2.5rem; } }   /* the text never runs under the sign */

/* 5 Ways We Help: the 3 x 3 grid straight under "Nine ways we can help.", the three paragraphs under the grid at a
   readable width; family tints from the brand colours (Andrew, 0.92 decision A): purple #F3EFF9, fuchsia #FFF0F6, blue
   #F0F2FF with brand blue #5867E5 for Learning, Coaching, and Retreats, on the grid and on its band only (the strips on
   the practice pages are unchanged); a restrained top line in each family's brand colour and white space between the
   bands; the service names in the bands are plain links with their descriptions below. */
.svc-map-section .svc-map-head { margin-bottom: 1.25rem; }
.svc-map-section .svc-map-head h2 { margin-bottom: 0; }
.svc-map-section .svc-map-after { margin: clamp(1.75rem, 3vw, 2.5rem) 0 0; }
.svc-map-section .svc-map-after p:last-child { margin-bottom: 0; }
.svc-map .fam-purple, .svc-family.fam-purple, .svc-family.fam-purple .fam-purple { --fw: #F3EFF9; }
.svc-map .fam-pink, .svc-family.fam-pink, .svc-family.fam-pink .fam-pink { --fw: #FFF0F6; }
.svc-map .fam-purple-deep, .svc-family.fam-purple-deep, .svc-family.fam-purple-deep .fam-purple-deep { --fc: #5867E5; --fw: #F0F2FF; }
.svc-family { border-top: 4px solid var(--fc); }
.svc-family.fam-pink { border-top-color: #F54C9E; }
.svc-family + .svc-family { margin-top: clamp(1.75rem, 3.5vw, 3rem); }
.svc-cards { gap: 1.1rem 1.5rem; }
.svc-card .svc-name { display: inline-flex; align-items: baseline; gap: .35rem; color: var(--purple); font-size: 1.06rem; font-weight: 650; line-height: 1.35;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
.svc-card .svc-name span { font-size: 1.15rem; line-height: 1; text-decoration: none; }
.svc-card .svc-name:hover { color: var(--purple-dark); }
.svc-card .svc-name:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; border-radius: 2px; }
.svc-card p { margin: .3rem 0 0; padding-left: 0; }

/* 6 Resources: the first paragraph of About These Resources, then a purple "Read more" / "Show less" with a chevron that
   opens the rest of the introduction in place; Expand All and Collapse All act on the categories only. */
html:not(.js) .res-more-ctl { display: none; }
.res-more-ctl { margin: .1rem 0 1rem; min-height: 44px; }
.res-more-btn { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; padding: .3rem 0; border: 0; background: none; color: var(--purple);
  font: inherit; font-weight: 600; cursor: pointer; }
.res-more-chev { display: inline-block; width: .5rem; height: .5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: translateY(-.15rem) rotate(45deg); }
.res-more-btn[aria-expanded="true"] .res-more-chev { transform: translateY(.1rem) rotate(-135deg); }
.res-more-btn:hover .res-more-label { text-decoration: underline; text-underline-offset: .2em; }
.res-more-btn:focus { outline: none; }
.res-more-btn:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; border-radius: 2px; }
.js .res-more:not(.res-ready) { display: none; }

/* Printing and saving as PDF: every section prints open, without the controls (0.92 section 1) */
@media print {
  .dsc-panel, .dsc-panel[hidden], .res-more, .res-more[hidden] { display: block !important; content-visibility: visible !important; }
  .approach-section .dsc-panel { display: block !important; }
  .dsc-sign, .res-more-ctl, .svc-fam summary::after { display: none !important; }
  .dsc-btn { color: inherit; }
  /* Ways We Help grid: all three groups print open. Chrome applies the phone layout while printing (the page is narrower than
     841 pixels), and the v14.4.9 phone rule then closes groups 2 and 3 after beforeprint has opened them. */
  .svc-fam::details-content { display: block !important; content-visibility: visible !important; }
  .svc-fam summary { margin-bottom: .9rem !important; }
}

/* ===== v14.5.32 (instruction cycle 0.93 Revision-02, 2026-11-02) ===== */
/* Item 4: every real disclosure uses one thin chevron on the LEFT of its heading: DW purple #5B3AA5, about 17 px high,
   about 12 px before the title; pointing right when closed, down when open. It replaces the old +/- signs. The whole
   heading stripe is the button (Item 9). No animation. */
:root { --chev-box: .72rem; --chev-line: 1.5px; }
.dsc-btn { justify-content: flex-start; align-items: flex-start; gap: .75rem; }
.dsc-sign { order: -1; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.1rem; height: 1.3em; height: 1lh; text-align: left; }
.dsc-sign::before, .dsc.is-open .dsc-sign::before { content: ''; display: block; width: var(--chev-box); height: var(--chev-box); border-right: var(--chev-line) solid #5B3AA5;
  border-bottom: var(--chev-line) solid #5B3AA5; font-size: 0; transform: translateX(-.14rem) rotate(-45deg); }
.dsc.is-open .dsc-sign::before { transform: translateY(-.18rem) rotate(45deg); }
/* Our Approach: the chevron moves from the band's right edge to the left of the heading */
.approach-section.dsc .dsc-head { padding-right: 0; }
.approach-section.dsc .dsc-btn { display: flex; }
.approach-section.dsc .dsc-sign { position: static; top: auto; line-height: inherit; }
@media (min-width: 841px) { .approach-section.dsc .dsc-panel { padding-right: 0; } }
/* Item 9 on Our Approach: closed, the whole band toggles (as before); open, the whole heading column toggles too */
.approach-section.dsc.dsc-ready.is-open .dsc-head { position: relative; align-self: stretch; }
.approach-section.dsc.dsc-ready.is-open .dsc-btn::after { content: ''; position: absolute; inset: 0; }

/* Questions: each question keeps its own disclosure; the chevron sits left of the question */
.faq summary { padding: .5rem 0 .5rem 1.85rem; }
.faq summary::after, .faq[open] summary::after { content: none; }
.faq summary::before { content: ''; position: absolute; left: .25rem; top: calc(.5rem + .75em - .36rem); width: var(--chev-box); height: var(--chev-box);
  border-right: var(--chev-line) solid #5B3AA5; border-bottom: var(--chev-line) solid #5B3AA5; transform: rotate(-45deg); }
.faq[open] > summary::before { transform: translateY(-.18rem) rotate(45deg); }

/* Resources category lists */
.ack-toggle { padding-left: 1.85rem; padding-right: 0; }
.ack-toggle .ack-chev { right: auto; left: .25rem; top: calc(.85rem + .65em - .36rem); width: var(--chev-box); height: var(--chev-box); }
.ack-toggle .ack-chev::before, .ack-toggle[aria-expanded="true"] .ack-chev::before { content: ''; display: block; width: var(--chev-box); height: var(--chev-box);
  border-right: var(--chev-line) solid #5B3AA5; border-bottom: var(--chev-line) solid #5B3AA5; font-size: 0; transform: rotate(-45deg); }
.ack-toggle[aria-expanded="true"] .ack-chev::before { transform: translateY(-.18rem) rotate(45deg); }

/* Resources "Read more" / "Show less" and the practice pages' "How we pay it forward": the chevron before the words */
.res-more-btn, .svc-pif-toggle { gap: .75rem; }
.res-more-chev, .svc-pif-chev { order: -1; flex: none; width: var(--chev-box); height: var(--chev-box); border-right-width: var(--chev-line); border-bottom-width: var(--chev-line);
  border-right-color: #5B3AA5; border-bottom-color: #5B3AA5; transform: translateX(-.1rem) rotate(-45deg); }
.res-more-btn[aria-expanded="true"] .res-more-chev, .svc-pif-toggle[aria-expanded="true"] .svc-pif-chev { transform: translateY(-.18rem) rotate(45deg); }

/* Ways We Help 3 x 3 grid on phones, where its families open and close */
.svc-fam summary::after { content: none !important; }
@media (max-width: 840px) {
  .svc-fam summary { padding-right: 0; }
  .svc-fam summary::before { content: ''; order: -1; flex: none; width: var(--chev-box); height: var(--chev-box); margin: 0 .2rem 0 .15rem;
    border-right: var(--chev-line) solid #5B3AA5; border-bottom: var(--chev-line) solid #5B3AA5; transform: rotate(-45deg); }
  .svc-fam[open] summary::before { transform: translateY(-.18rem) rotate(45deg); }
}

/* Item 3: Ways We Help 3 x 3 grid. Each tile is already one whole-tile link (title and arrow; there is no description
   or empty box in this grid). Between 841 and 1100 px wide the three columns are narrow enough that some names take two
   lines, which made tiles in the same row different heights; there every tile now takes the two-line height, and each
   family heading the three-line height, so the three tiles in each row are the same size and level with each other
   whatever the font. The three family panels are equal in height. Unchanged at other widths. */
@media (min-width: 841px) { .svc-map { align-items: stretch; } }
@media (min-width: 841px) and (max-width: 1100px) { .svc-map .svc-btn { min-height: 4.1rem; } .svc-map .svc-fam summary { min-height: 4rem; } }

/* Item 5: "People behind this work" is a disclosure row like the two "What" rows; the gallery inside is unchanged */
.svc-people { padding-block: 0; border-bottom: 1px solid var(--purple-line); }
.svc-people .dsc-head { margin: 0; padding-block: clamp(1rem, 2vw, 1.35rem); }
.svc-people.is-open .dsc-panel, .svc-people:not(.dsc-ready) .dsc-panel { padding-bottom: clamp(1.25rem, 2.5vw, 1.75rem); }

/* Item 2: "Explore the ways we help": a quieter, compact version of the Ways We Help 3 x 3 navigator, always visible.
   Three family columns (same order, names and tints), stacked in the same order on phones. The current service is a
   solid DW purple box with white text, marked as the current page (aria-current, and "(this page)" for screen readers);
   the other eight are ordinary underlined links. */
.svc-explore { padding-block: clamp(1.75rem, 3vw, 2.4rem) clamp(1.5rem, 2.5vw, 2rem); border-bottom: 0; }
.svc-explore > h2 { font-size: clamp(1.3rem, 2.1vw, 1.6rem); margin: 0 0 1rem; }
.svc-explore-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
@media (max-width: 599.98px) { .svc-explore-grid { grid-template-columns: minmax(0, 1fr); } }
.svc-explore-fam { --fw: #F3EFF9; --fc: #5B3AA5; background: var(--fw); border-top: 3px solid var(--fc); padding: .75rem .8rem .8rem; }
.svc-explore-fam.fam-pink { --fw: #FFF0F6; --fc: #F54C9E; }
.svc-explore-fam.fam-purple-deep { --fw: #F0F2FF; --fc: #5867E5; }
.svc-explore-family { margin: 0 0 .45rem; font-size: .9rem; font-weight: 650; line-height: 1.3; color: var(--ink); }
.svc-explore ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.svc-explore li a, .svc-explore-current { display: flex; align-items: center; min-height: 40px; padding: .35rem .55rem; border-radius: 3px; font-size: .95rem; line-height: 1.3; }
.svc-explore li a { color: var(--ink); text-decoration: underline; text-decoration-color: rgb(91 58 165 / 45%); text-underline-offset: .2em; }
.svc-explore li a:hover { background: #fff; color: #5B3AA5; text-decoration-color: currentColor; }
.svc-explore li a:focus-visible { outline: 2px solid #5B3AA5; outline-offset: 1px; }
.svc-explore-current { background: #5B3AA5; color: #fff; font-weight: 650; cursor: default; }
.svc-explore + .svc-pif { margin-top: 0; }

/* Item 1: the print utility for the nine practice pages, in the shared footer under the address block. A quiet,
   underlined text control with a small fine-line printer icon to its left (the icon is a TRIAL for the owner's DTP
   review). On wide screens (three footer columns, 1181 px and wider) it sits at the foot of the address column, level
   with the last row of the footer's Ways We Help and Explore columns, while the address block stays exactly where it is
   on every other page (centred in the row); narrower, it simply follows the address. Only the nine practice pages
   carry it (class has-print on their footer-contact); every other page's footer is unchanged. */
.footer-contact .footer-print { margin: 0; padding-top: .9rem; }
@media (min-width: 1181px) {
  .footer-contact.has-print { align-self: stretch; display: flex; flex-direction: column; justify-content: center; position: relative; }
  .footer-contact.has-print .footer-print { position: absolute; left: 0; bottom: 0; padding-top: 0; }
}
.footer-print-btn { display: inline-flex; align-items: center; gap: .4rem; min-height: 32px; padding: 0; border: 0; background: none; color: #5a5468; font: inherit;
  font-size: .84rem; line-height: 1.3; text-align: left; cursor: pointer; }
.footer-print-label { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.footer-print-icon { flex: none; width: 1rem; height: 1rem; }
.footer-print-btn:hover { color: #5B3AA5; }
.footer-print-btn:focus { outline: none; }
.footer-print-btn:focus-visible { outline: 2px solid #5B3AA5; outline-offset: 3px; border-radius: 2px; }
html:not(.js) .footer-print { display: none; }

/* Item 6: the Rilke quotation on Leadership in a softly shaded box (Leadership tint), keeping its thin fuchsia line */
.svc-epigraph.svc-epigraph-tint { background: #FFF0F6; border-left: 3px solid #F54C9E; padding: 1rem 1.25rem; border-radius: 0 3px 3px 0; }
.svc-epigraph.svc-epigraph-tint p:last-child { margin-bottom: .25rem; }

/* Item 8: Resources "Expand all" / "Collapse all", a little quieter */
.ack-all { min-height: 36px; padding: .3rem .75rem; font-size: .84rem; color: #5B3AA5; border-color: #d9d2ea; }

/* Print: the navigator, the footer utility and every chevron stay off paper; every section prints open */
@media print {
  .svc-explore, .footer-print, .dsc-sign, .faq summary::before, .svc-fam summary::before { display: none !important; }
  .svc-people .dsc-panel { display: block !important; }
  .faq summary { padding-left: 0 !important; }
  .ack-toggle { padding-left: 0 !important; }
}

/* Client Portals page: with the button into the protected folder gone (Bill's change of 2026-11-02), the access note
   fills the box as one column instead of sitting in the button's old column */
.portal-card.portal-card-note { grid-template-columns: minmax(0, 1fr); }
.portal-card-note .portal-card__caption { max-width: 46rem; }

/* ===== v14.5.34 (instruction cycle 0.95, 2026-11-03) ===== */
/* Section 2: on every accordion the WHOLE heading stripe opens it when closed and closes it when open, with the same click
   or tap. The heading's own button (or the question's summary) is stretched over the stripe with an invisible layer, so
   there is no second handler and nothing to bubble; keyboard, focus ring, aria-expanded, chevrons, colours, spacing and
   starting states are unchanged. The opened content (and its links) is never a target. Screen only: printing unchanged. */
@media screen {
  /* practice-page rows, Acknowledgements rows: the heading with its padding */
  .dsc.dsc-ready:not(.approach-section) .dsc-head { position: relative; }
  .dsc.dsc-ready:not(.approach-section) .dsc-btn::after { content: ''; position: absolute; inset: 0; }
  /* questions: the question with the space above it; closed, also the space below it */
  details.faq > summary { position: relative; }
  details.faq > summary::after, details.faq[open] > summary::after { content: ''; position: absolute; left: 0; right: 0; top: -1.1rem; bottom: -1.1rem; font-size: 0; }
  details.faq[open] > summary::after { bottom: 0; }
  /* Our Approach bands. Closed: the whole band. Open: the band above the text, the heading column and the space beside it
     down to the end of the text (side by side), or the band above the text, the heading and the space under it (stacked). */
  .approach-section.dsc.dsc-ready { overflow: clip; }
  .approach-section.dsc.dsc-ready:not(.is-open) { position: relative; }
  .approach-section.dsc.dsc-ready .container, .approach-section.dsc.dsc-ready .dsc-head, .approach-section.dsc.dsc-ready:not(.is-open) .split > div:first-child { position: static; }
  .approach-section.dsc.dsc-ready:not(.is-open) .dsc-btn::after { inset: 0; }
  .approach-section.dsc.dsc-ready.is-open .split > div:first-child { position: relative; align-self: stretch; }
  .approach-section.dsc.dsc-ready.is-open .dsc-btn::after { inset: auto; top: calc(-1 * clamp(4rem, 7vw, 7rem)); bottom: 0; left: -100vw; right: calc(-1 * clamp(2rem, 7vw, 7rem)); }
  .approach-section.dsc.dsc-ready.is-open .dsc-btn::before { content: ''; position: absolute; top: calc(-1 * clamp(4rem, 7vw, 7rem)); height: clamp(4rem, 7vw, 7rem); left: -100vw; right: -100vw; }
}
@media screen and (max-width: 840px) {
  .approach-section.dsc.dsc-ready.is-open .dsc-btn::after { right: -100vw; bottom: -2.5rem; }
  .approach-section.dsc.dsc-ready.is-open .dsc-btn::before { content: none; }
  /* Ways We Help 3 x 3 groups on phones and narrow tablets: the group heading with the group's padding */
  details.svc-fam > summary { position: relative; }
  details.svc-fam > summary::after { content: '' !important; position: absolute; top: -1.1rem; left: -1rem; right: -1rem; bottom: -1.2rem; }
  details.svc-fam[open] > summary::after { bottom: 0; }
}

/* Section 3: Ways We Help, the nine service tiles in the three family bands. Each tile is ONE link around the title, the
   description and the space around them; a plain rectangle without a border; the three tiles of a family are the same
   size (equal rows); title and description keep their look; a quiet hover and a purple keyboard ring. Tiles are WHITE on
   the tinted family bands (owner's decision of 2026-11-03, option B: the bands already use the three family tints). */
.svc-family .svc-cards { grid-auto-rows: 1fr; gap: 1rem; }
.svc-family.fam-purple { --tile: #FFFFFF; } .svc-family.fam-pink { --tile: #FFFFFF; } .svc-family.fam-purple-deep { --tile: #FFFFFF; }
a.svc-card { display: block; padding: 1rem 1.1rem 1.1rem; background: var(--tile); border: 0; border-radius: 0; color: inherit; text-decoration: none; }
a.svc-card .svc-name { display: inline-flex; align-items: baseline; gap: .35rem; color: var(--purple); font-size: 1.06rem; font-weight: 650; line-height: 1.35;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
a.svc-card .svc-name span { font-size: 1.15rem; line-height: 1; text-decoration: none; }
a.svc-card p { margin: .3rem 0 0; padding-left: 0; color: var(--muted); font-size: .95rem; line-height: 1.5; }
a.svc-card:hover .svc-name { color: var(--purple-dark); text-decoration-thickness: 2px; }
a.svc-card:focus { outline: none; }
a.svc-card:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }
@media print { a.svc-card { background: none; padding: 0 0 .5rem; } }