/*
Theme Name: Katelynn Leisher — Editorial Blocksy Child System v69
Theme URI: https://www.katelynnleisher.com
Description: A Blocksy child theme for Katelynn Leisher, LCSW-C. Uses the Vollkorn + Archivo pairing and a calm lavender editorial system for practice pages, specialty cards, WordPress writing, FAQ, and consultation sections.
Author: Katelynn Leisher
Template: blocksy
Version: 2.20.73
Text Domain: katelynn-editorial
*/

/*
 * DESIGN CONTRACT
 * Quiet editorial care: pale lavender fields, plum rules, Archivo for navigation
 * and labels, Vollkorn for reading, and rectangular architectural surfaces.
 * Apple-style refinements provide calm material depth and immediate feedback
 * without changing the approved typefaces, palette, or editorial character.
 * V36 preserves these foundations while rendering the first screen first and
 * easing light hero surfaces into the page. It removes lower-homepage paint
 * deferral after it proved incompatible with reliable desktop long-page
 * composition, and restores the intended approach-grid text placement. It also
 * replaces the draft footer note with a sourced daily reflection and gives
 * crisis support its own spacious, high-legibility sans-serif treatment.
 * Shared templates now use one navigation and footer system through a minimal
 * WordPress document shell, so Writing, articles, and practice pages never
 * emit mismatched Blocksy chrome into the rendered page structure.
 * It also supplies server-rendered discovery metadata without adding
 * client-side requests or unverified profile, review, address, or contact data.
 * Use the classes documented in README.md on WordPress Group blocks.
 */

:root {
  /* Canonical WordPress-first palette: literal colors belong only in this block. */
  --color-paper: #fbfafc;
  --color-paper-soft: #f7f5fa;
  --color-paper-highlight: #fbf8fd;
  --color-paper-warm: #f8f4fb;
  --color-white: #ffffff;
  --color-mist: #f4f1f8;
  --color-mist-deep: #f4eef8;
  --color-lavender: #ece6f5;
  --color-lavender-deep: #ded2ec;
  --color-lavender-shade: #e7e0ee;
  --color-lavender-highlight: #f5eefe;
  --color-lavender-muted: #eee9f5;
  --color-lavender-border: #c8bed4;
  --color-lavender-ink: #30223f;
  --color-lilac-line: #c9b4df;
  --color-lilac-rule: #d9c7e8;
  --color-lilac-note: #e2d6f1;
  --color-plum: #4f356f;
  --color-plum-dark: #38234f;
  --color-plum-footer: #332247;
  --color-plum-hover: #4a3169;
  --color-plum-accent: #5a3b7b;
  --color-ink: #2e2735;
  --color-ink-soft: #564d5d;
  --color-ink-muted: #4e4658;
  --color-line: #dcd4e5;
  --color-line-strong: #c9bdd8;
  --color-focus: #9f7fbd;
  --color-on-plum: #ffffff;
  --color-on-plum-text: #eee7f4;
  --color-on-plum-soft: #dfd4e9;
  --color-on-plum-muted: #d9cee3;
  --color-on-plum-highlight: #faf7fc;
  --color-on-plum-note: #e6dff0;
  --color-on-plum-bright: #f3edf8;
  --color-on-plum-label: #e3d8ee;
  --color-on-plum-quote-border: #d9c8eb;
  --color-on-plum-quote: #f5f1f8;
  --color-on-plum-consult: #e5dced;
  --color-on-plum-link: #e8dff0;
  --color-on-plum-eyebrow: #e1d5ed;
  --color-on-plum-eyebrow-bright: #f0e6f8;
  --color-on-plum-step: #f5eff9;
  --color-on-plum-hero: #f0e8f7;
  --color-on-plum-eyebrow-soft: #eee2f7;
  --color-footer-meta: #cfc2dc;
  --font-body: "Vollkorn", Georgia, serif;
  --font-heading: "Archivo", Arial, sans-serif;
  --radius-control: 0.75rem;
  --layout-container: 1180px;
  --space-gutter: clamp(1.25rem, 4vw, 3rem);
  --space-section: clamp(4rem, 8vw, 7.5rem);
  --motion-standard: cubic-bezier(.22, 1, .36, 1);
}

/* ---------- stable global foundations ---------- */
html { scroll-behavior: smooth; }
body.kl-theme,
body {
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
}

body.kl-theme *, body.kl-theme *::before, body.kl-theme *::after { box-sizing: border-box; }
body.kl-theme img { display: block; max-width: 100%; height: auto; }
body.kl-theme :focus-visible { outline: 2px solid var(--color-plum); outline-offset: 4px; }
body.kl-theme a { color: inherit; }

body.kl-theme h1,
body.kl-theme h2,
body.kl-theme h3,
body.kl-theme h4,
body.kl-theme .entry-content h1,
body.kl-theme .entry-content h2,
body.kl-theme .entry-content h3 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.08;
}

body.kl-theme p,
body.kl-theme li,
body.kl-theme .entry-content { font-family: var(--font-body); }

/* Do not use the legacy global-reset approach. These selectors are scoped so
   Blocksy widgets, WordPress admin bar, forms, and third-party plugins retain
   their native behavior outside the designed content areas. */
.kl-page,
.kl-page .wp-block-group,
.kl-page .wp-block-columns,
.kl-page .wp-block-column { min-width: 0; }

/* ---------- Blocksy header / WordPress menu ---------- */
body.kl-theme #header,
body.kl-theme header.ct-header,
body.kl-theme .ct-header [data-row] {
  background: rgba(251, 250, 252, .92);
  background: color-mix(in srgb, var(--color-paper) 92%, transparent);
  border-color: var(--color-line);
}
body.kl-theme .ct-header [data-row] { min-height: 76px; }
body.kl-theme .ct-header .ct-container { max-width: var(--layout-container); padding-inline: var(--space-gutter); }
body.kl-theme .ct-header .ct-header-text,
body.kl-theme .ct-header .site-title,
body.kl-theme .ct-header .site-title a {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.035em;
}
body.kl-theme .ct-header .site-description {
  color: var(--color-ink-soft);
  font-family: var(--font-heading);
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.kl-theme .ct-header [data-menu] > ul > li > a,
body.kl-theme .ct-header .menu > li > a {
  color: var(--color-ink-soft);
  font-family: var(--font-heading);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .03em;
  text-transform: none;
}
body.kl-theme .ct-header [data-menu] > ul > li > a:hover,
body.kl-theme .ct-header .menu > li.current-menu-item > a { color: var(--color-plum); }
body.kl-theme .ct-header .ct-button,
body.kl-theme .ct-header a.ct-button {
  background: transparent;
  border: 1px solid var(--color-plum);
  border-radius: var(--radius-control);
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .12em;
  min-height: 44px;
  padding: .75rem 1rem;
  text-transform: uppercase;
}
body.kl-theme .ct-header .ct-button:hover { background: var(--color-plum); color: var(--color-white); }

/* ---------- reusable editorial primitives ---------- */
.kl-shell { margin-inline: auto; max-width: var(--layout-container); padding-inline: var(--space-gutter); }
.kl-section { padding-block: var(--space-section); }
.kl-section--mist { background: var(--color-mist); }
.kl-section--lavender { background: var(--color-lavender); }
.kl-section--plum { background: var(--color-plum); color: var(--color-white); }
.kl-section--plum :is(h1,h2,h3,p) { color: inherit; }
.kl-rule-top { border-top: 1px solid var(--color-line); }

.kl-eyebrow,
.kl-page .kl-eyebrow,
.kl-page .wp-block-heading.kl-eyebrow {
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .16em;
  line-height: 1.2;
  margin: 0;
  text-transform: uppercase;
}
.kl-section--plum .kl-eyebrow { color: var(--color-lilac-note); }

.kl-page-title,
.kl-page .kl-page-title,
.kl-page .wp-block-heading.kl-page-title {
  font-size: clamp(2.65rem, 5.7vw, 5.35rem);
  margin: .75rem 0 0;
  max-width: 18ch;
}
.kl-section-intro { color: var(--color-ink-soft); font-size: clamp(1.04rem, 1.5vw, 1.18rem); margin-top: 1.25rem; max-width: 40rem; }
.kl-section--plum .kl-section-intro { color: var(--color-on-plum-note); }

.kl-link,
.kl-page .kl-link {
  align-items: center;
  color: var(--color-plum);
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .84rem;
  font-weight: 500;
  gap: .5rem;
  min-height: 44px;
  text-decoration: underline;
  text-decoration-color: var(--color-lavender-deep);
  text-decoration-thickness: 1px;
  text-underline-offset: 7px;
  transition: color .2s var(--motion-standard), text-decoration-color .2s var(--motion-standard);
}
.kl-link:hover { color: var(--color-plum-dark); text-decoration-color: var(--color-plum); }

.kl-button,
.kl-page .wp-element-button,
.kl-page .wp-block-button__link {
  align-items: center;
  background: var(--color-plum);
  border: 1px solid var(--color-plum);
  border-radius: var(--radius-control);
  color: var(--color-white);
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .77rem;
  font-weight: 600;
  justify-content: center;
  letter-spacing: .02em;
  min-height: 46px;
  padding: .82rem 1.25rem;
  text-decoration: none;
  transition: background .2s var(--motion-standard), color .2s var(--motion-standard), transform .2s var(--motion-standard);
}
.kl-button:hover,
.kl-page .wp-block-button__link:hover { background: var(--color-plum-dark); color: var(--color-white); transform: translateY(-1px); }
.kl-button--outline,
.kl-page .is-style-outline .wp-block-button__link { background: transparent; border-color: var(--color-plum); color: var(--color-plum); }
.kl-button--outline:hover,
.kl-page .is-style-outline .wp-block-button__link:hover { background: var(--color-lavender); color: var(--color-plum-dark); }

/* ---------- hero and page intro ---------- */
.kl-hero,
.kl-page-hero {
  background: linear-gradient(180deg, var(--color-mist) 0%, var(--color-mist) 84%, var(--color-paper) 84%);
  padding: clamp(4.5rem, 9vw, 8.5rem) var(--space-gutter) clamp(4rem, 7vw, 6rem);
}
.kl-hero__grid { align-items: center; display: grid; gap: clamp(2.5rem, 6vw, 5.5rem); grid-template-columns: minmax(0, 1.05fr) minmax(280px, .85fr); margin-inline: auto; max-width: var(--layout-container); }
.kl-hero .kl-page-title { max-width: 11ch; }
.kl-hero__copy { color: var(--color-ink-soft); font-size: clamp(1.04rem, 1.5vw, 1.2rem); max-width: 34rem; }
.kl-hero__image img,
.kl-portrait img { aspect-ratio: 4 / 5; height: 100%; object-fit: cover; width: 100%; }
.kl-hero__image { background: var(--color-lavender-shade); margin: 0; overflow: hidden; }
.kl-page-hero .kl-shell { max-width: var(--layout-container); }
.kl-page-hero .kl-page-title { max-width: 16ch; }

.kl-trustbar { border-block: 1px solid var(--color-line); color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .68rem; letter-spacing: .12em; padding: 1rem var(--space-gutter); text-transform: uppercase; }
.kl-trustbar ul { align-items: center; display: flex; flex-wrap: wrap; gap: .75rem 1.6rem; justify-content: center; list-style: none; margin: 0; padding: 0; }

/* ---------- practice-at-a-glance panel ---------- */
.kl-practice-signature { background: rgba(251, 250, 252, .55); background: color-mix(in srgb, var(--color-paper) 55%, transparent); border-top: 1px solid var(--color-line); padding: 1.35rem var(--space-gutter); }
.kl-practice-signature__inner { margin-inline: auto; max-width: var(--layout-container); }
.kl-practice-signature__title { align-items: center; color: var(--color-plum); display: flex; font-family: var(--font-heading); font-size: .68rem; font-weight: 600; gap: .75rem; letter-spacing: .15em; margin: 0; text-transform: uppercase; }
.kl-practice-signature__title::before { background: var(--color-plum); content: ""; height: 1px; width: 1.75rem; }
.kl-practice-signature__grid { background: var(--color-line); border: 1px solid var(--color-line); display: grid; gap: 1px; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; margin: 1rem 0 0; padding: 0; }
.kl-practice-signature__item { background: rgba(251, 250, 252, .74); background: color-mix(in srgb, var(--color-paper) 74%, transparent); padding: 1rem 1.1rem; }
.kl-practice-signature__item span { display: block; }
.kl-practice-signature__label { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .62rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.kl-practice-signature__value { color: var(--color-ink); font-family: var(--font-heading); font-size: .86rem; font-weight: 500; line-height: 1.35; margin-top: .35rem; }
.kl-practice-signature__item--action { background: var(--color-plum); }
.kl-practice-signature__item--action .kl-practice-signature__label { color: var(--color-on-plum-label); }
.kl-practice-signature__item--action .kl-practice-signature__value { color: var(--color-white); }

/* ---------- recognition list ---------- */
.kl-recognition { padding: var(--space-section) var(--space-gutter); }
.kl-recognition__grid { display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); margin-inline: auto; max-width: var(--layout-container); }
.kl-recognition h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); margin-top: .8rem; }
.kl-recognition__items { list-style: none; margin: 0; padding: 0; }
.kl-recognition__items li { border-top: 1px solid var(--color-line); color: var(--color-ink-soft); padding: 1.1rem 0 1.1rem 1.35rem; position: relative; }
.kl-recognition__items li:last-child { border-bottom: 1px solid var(--color-line); }
.kl-recognition__items li::before { background: var(--color-plum); border-radius: 50%; content: ""; height: 5px; left: 0; position: absolute; top: 1.75rem; width: 5px; }

/* ---------- supplied Areas I Work In page and homepage section ---------- */
.kl-areas,
.services {
  background: var(--color-lavender);
  border-block: 1px solid var(--color-line);
  padding: var(--space-section) var(--space-gutter);
}
.kl-areas__inner { margin-inline: auto; max-width: var(--layout-container); }
.kl-areas__lead { border-left: 2px solid var(--color-plum); max-width: 42rem; padding-left: 1rem; }
.kl-areas__lead h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); margin: .8rem 0 0; }
.kl-areas__lead p { color: var(--color-ink-soft); margin: .75rem 0 0; }
.kl-area-grid { background: var(--color-line); display: grid; gap: 1px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: clamp(2.5rem, 5vw, 4rem); }
.kl-area-card,
.svc {
  background: var(--color-paper);
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: clamp(1.65rem, 3vw, 2.6rem);
  transition: background .25s var(--motion-standard);
}
.kl-area-card:hover,
.svc:hover { background: var(--color-paper-warm); }
.kl-area-card__top { align-items: flex-start; border-bottom: 1px solid var(--color-line); display: flex; gap: 1rem; justify-content: space-between; padding-bottom: 1.25rem; }
.kl-area-index,
.svc-idx { color: var(--color-plum); font-family: var(--font-body); font-size: 1.85rem; line-height: 1; }
.kl-card-kicker { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .58rem; font-weight: 600; letter-spacing: .14em; text-align: right; text-transform: uppercase; }
.kl-area-card h3,
.svc h3 { font-size: clamp(1.28rem, 2.1vw, 1.7rem); margin: 1.35rem 0 0; }
.kl-card-details,
.svc-detail { border-left: 1px solid var(--color-lavender-deep); display: grid; gap: 1.2rem; margin-top: 1.35rem; padding-left: 1rem; }
.kl-card-block p,
.svc-block p { color: var(--color-ink-soft); font-size: .96rem; margin: .3rem 0 0; }
.kl-card-label,
.svc-label { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .59rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.kl-card-block--path .kl-card-label { color: var(--color-plum); }
.kl-card-block--path p { color: var(--color-ink); }
.kl-card-link { margin-top: auto; padding-top: 1.75rem; }

/* supports legacy .svc template markup */
.svc { display: grid; gap: 0; grid-template-columns: 1fr; }
.svc .svc-idx { border-bottom: 1px solid var(--color-line); display: flex; justify-content: space-between; padding-bottom: 1.25rem; }
.svc .svc-detail { grid-template-columns: 1fr; }
.svc .svc-block { border: 0; padding: 0; }

/* ---------- approach and credentials ---------- */
.kl-approach-band,
.approach { background: var(--color-plum); color: var(--color-white); padding: var(--space-section) var(--space-gutter); }
.kl-approach__grid { align-items: start; display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); margin-inline: auto; max-width: var(--layout-container); }
.kl-approach-band :is(h2,h3,p), .approach :is(h2,h3,p) { color: inherit; }
.kl-approach-band h2, .approach h2 { font-size: clamp(2rem, 3.5vw, 3.25rem); margin: .8rem 0 0; }
.kl-approach-band p, .approach p { color: var(--color-on-plum-note); margin-top: 1rem; }
.kl-modalities,
.modalities { display: flex; flex-wrap: wrap; gap: .55rem; list-style: none; margin: 1.65rem 0 0; padding: 0; }
.kl-modalities li,
.modalities li { border: 1px solid rgba(255,255,255,.32); color: var(--color-on-plum-bright); font-family: var(--font-heading); font-size: .72rem; padding: .48rem .75rem; }
.kl-quote { border-left: 2px solid var(--color-on-plum-quote-border); color: var(--color-on-plum-quote); font-family: var(--font-body); font-size: clamp(1.3rem, 2.2vw, 1.8rem); line-height: 1.45; margin: clamp(2rem, 4vw, 3rem) 0 0; padding-left: 1.25rem; }

.kl-credentials,
.creds { background: var(--color-mist); border-block: 1px solid var(--color-line); padding: clamp(3.5rem, 6vw, 5rem) var(--space-gutter); }
.kl-credentials__grid,
.cred-grid { display: grid; gap: 1px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-inline: auto; max-width: var(--layout-container); }
.kl-credential,
.cred { background: var(--color-paper); border-left: 0; padding: 1.5rem; }
.kl-credential strong,
.cred strong { display: block; font-family: var(--font-heading); font-size: .9rem; font-weight: 600; }
.kl-credential span,
.cred span { color: var(--color-ink-soft); display: block; font-size: .9rem; margin-top: .45rem; }

/* ---------- WordPress Writing / Query Loop ---------- */
.kl-writing,
.blog { padding: var(--space-section) var(--space-gutter); }
.kl-writing__inner { margin-inline: auto; max-width: var(--layout-container); }
.kl-writing__head { align-items: end; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; }
.kl-writing__head h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); margin: .8rem 0 0; }
.kl-writing .wp-block-query ul,
.kl-writing .wp-block-post-template,
.post-grid { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 2.5rem 0 0; padding: 0; }
.kl-writing .wp-block-post,
.post { background: var(--color-paper); display: flex; flex-direction: column; min-height: 100%; padding: 1.6rem; }
.kl-writing .wp-block-post-featured-image { margin: -1.6rem -1.6rem 1.4rem; }
.kl-writing .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.kl-writing .wp-block-post-terms,
.post .cat { color: var(--color-plum); font-family: var(--font-heading); font-size: .62rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.kl-writing .wp-block-post-title,
.post h3 { font-size: 1.4rem; margin: .7rem 0 0; }
.kl-writing .wp-block-post-title a { text-decoration: none; }
.kl-writing .wp-block-post-excerpt { color: var(--color-ink-soft); font-size: .95rem; margin-top: .75rem; }
.kl-writing .wp-block-post-date,
.post .meta { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .7rem; margin-top: auto; padding-top: 1.3rem; }
.kl-writing .wp-block-read-more { color: var(--color-plum); font-family: var(--font-heading); font-size: .78rem; margin-top: .75rem; text-decoration: underline; text-underline-offset: 5px; }
.kl-writing .wp-block-post-template > li { margin: 0; }
.kl-writing__empty { background: var(--color-mist); border: 1px solid var(--color-line); margin-top: 2.5rem; max-width: 42rem; padding: clamp(1.35rem, 3vw, 2rem); }
.kl-writing__empty p { color: var(--color-ink-soft); margin: .65rem 0 0; }
.kl-writing__empty .kl-eyebrow { color: var(--color-plum); margin: 0; }

/* ---------- FAQ: native Details block or legacy custom accordion ---------- */
.kl-faq,
.faq { background: var(--color-lavender); border-block: 1px solid var(--color-line); padding: var(--space-section) var(--space-gutter); }
.kl-faq__inner { display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); margin-inline: auto; max-width: var(--layout-container); }
.kl-faq h2, .faq h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); margin: .8rem 0 0; }
.kl-faq .wp-block-details,
.faq-item { border-bottom: 1px solid var(--color-line-strong); margin: 0; padding: 0; }
.kl-faq .wp-block-details:first-child { border-top: 1px solid var(--color-line-strong); }
.kl-faq summary,
.faq-q { align-items: center; color: var(--color-ink); cursor: pointer; display: flex; font-family: var(--font-heading); font-size: 1rem; font-weight: 500; gap: 1rem; justify-content: space-between; list-style: none; min-height: 60px; padding: .9rem 0; }
.kl-faq summary::-webkit-details-marker { display: none; }
.kl-faq summary::after { color: var(--color-plum); content: "+"; font-family: var(--font-body); font-size: 1.6rem; font-weight: 400; line-height: 1; }
.kl-faq details[open] summary::after { content: "–"; }
.kl-faq .wp-block-details > :not(summary),
.faq-a-inner { color: var(--color-ink-soft); margin: 0; padding: 0 2rem 1.5rem 0; }

/* ---------- practice information and consultation ---------- */
.kl-safety,
.safety { padding: clamp(3.5rem, 6vw, 5rem) var(--space-gutter); }
.kl-safety__box,
.safety-box { background: var(--color-mist); border-left: 3px solid var(--color-plum); display: grid; gap: clamp(1.5rem, 4vw, 3.5rem); grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); margin-inline: auto; max-width: var(--layout-container); padding: clamp(1.5rem, 4vw, 3rem); }
.kl-safety h2, .safety-box h2 { font-size: clamp(1.45rem, 2.5vw, 2rem); margin: 0; }
.kl-safety p, .safety-box p { color: var(--color-ink-soft); margin: 0; }

.kl-consultation,
.closing { background: var(--color-plum); color: var(--color-white); padding: var(--space-section) var(--space-gutter); }
.kl-consultation__inner,
.closing-inner { margin-inline: auto; max-width: 44rem; text-align: center; }
.kl-consultation h2, .closing h2 { color: var(--color-white); font-size: clamp(2.15rem, 4.2vw, 4rem); margin: .75rem 0 0; }
.kl-consultation p, .closing p { color: var(--color-on-plum-consult); margin: 1rem auto 0; max-width: 40rem; }
.kl-consultation .wp-block-button__link,
.closing .btn-primary { background: var(--color-white); border-color: var(--color-white); color: var(--color-plum-dark); margin-top: 1.5rem; }
.kl-consultation .wp-block-button__link:hover,
.closing .btn-primary:hover { background: var(--color-lavender); color: var(--color-plum-dark); }
.kl-consultation__steps,
.consult-steps { display: grid; gap: 1px; grid-template-columns: repeat(3, 1fr); list-style: none; margin: 2.2rem 0 0; padding: 0; text-align: left; }
.kl-consultation__steps li,
.consult-steps li { border-top: 1px solid rgba(255,255,255,.34); color: var(--color-on-plum-consult); padding: 1rem; }
.kl-consultation__steps strong,
.consult-steps strong { color: var(--color-white); display: block; font-family: var(--font-heading); font-size: .8rem; margin-bottom: .35rem; }

/* ---------- Blocksy footer ---------- */
body.kl-theme footer,
body.kl-theme #footer { background: var(--color-plum-dark); color: var(--color-on-plum-soft); }
body.kl-theme footer .ct-container { max-width: var(--layout-container); padding-inline: var(--space-gutter); }
body.kl-theme footer :is(h1,h2,h3,h4,h5,h6) { color: var(--color-white); font-family: var(--font-heading); letter-spacing: -.02em; }
body.kl-theme footer a { color: var(--color-on-plum-link); text-decoration: underline; text-decoration-color: rgba(232,223,240,.32); text-underline-offset: 5px; }
body.kl-theme footer a:hover { color: var(--color-white); text-decoration-color: var(--color-white); }
.kl-crisis { border: 1px solid rgba(255,255,255,.25); color: var(--color-on-plum-link); font-family: var(--font-heading); font-size: .78rem; line-height: 1.55; margin-top: 2rem; padding: 1rem 1.2rem; }
.kl-crisis strong { color: var(--color-white); }

/* ---------- WordPress editor refinements ---------- */
.entry-content .wp-block-separator { border-color: var(--color-line); max-width: var(--layout-container); }
.entry-content .wp-block-quote { border-left-color: var(--color-plum); color: var(--color-plum); font-family: var(--font-body); font-size: 1.5rem; }
.entry-content .wp-block-quote cite { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .7rem; font-style: normal; letter-spacing: .1em; text-transform: uppercase; }
.entry-content .wp-block-table table { border-color: var(--color-line); font-family: var(--font-body); }
.entry-content .wp-block-table :is(th, td) { border-color: var(--color-line); }

/* ---------- responsive ---------- */
@media (max-width: 1024px) {
  .kl-hero__grid,
  .kl-recognition__grid,
  .kl-approach__grid,
  .kl-faq__inner,
  .kl-safety__box { grid-template-columns: 1fr; }
  .kl-hero__image { max-width: 520px; }
  .kl-credentials__grid,
  .cred-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kl-writing .wp-block-post-template,
  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1025px) {
  body.kl-theme { font-size: 18px; }
}
@media (max-width: 720px) {
  body.kl-theme { font-size: 16px; }
  .kl-hero,
  .kl-page-hero { padding-top: 3.75rem; }
  .kl-area-grid,
  .kl-writing .wp-block-post-template,
  .post-grid,
  .kl-credentials__grid,
  .cred-grid,
  .kl-consultation__steps,
  .consult-steps { grid-template-columns: 1fr; }
  .kl-trustbar ul { align-items: flex-start; flex-direction: column; gap: .55rem; }
  .kl-hero__image { max-width: 100%; }
  .kl-page-title { font-size: clamp(2.45rem, 13vw, 3.75rem); }
  .kl-card-kicker { max-width: 12ch; }
  .kl-page .wp-block-button { width: 100%; }
  .kl-page .wp-block-button__link { width: 100%; }
  .kl-practice-signature { padding-block: 1.2rem; }
  .kl-practice-signature__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kl-practice-signature__item { padding: .9rem 1rem; }
  .kl-practice-signature__item--action { grid-column: span 2; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* ---------- live custom-homepage compatibility ----------
 * The current WordPress home page stores the approved design as custom HTML.
 * Its original stylesheet lived with the prior theme, so activation of a
 * Blocksy child theme removed its layout rules. These selectors are carefully
 * limited to body.home and restore that existing markup without affecting
 * Gutenberg pages that use the .kl-* system above.
 */
body.home.kl-theme .site-main,
body.home.kl-theme .ct-container-full,
body.home.kl-theme .entry-content,
body.home.kl-theme .entry-content > .masthead,
body.home.kl-theme .entry-content > .mobile-panel,
body.home.kl-theme .entry-content > #main,
body.home.kl-theme .entry-content > .site-foot {
  margin: 0;
  max-width: none;
  padding: 0;
  width: 100%;
}
body.home.kl-theme .entry-content > #main { display: block; }
body.home.kl-theme .entry-content > #main > section { margin: 0; max-width: none; width: 100%; }
body.home.kl-theme .entry-content .shell { margin-inline: auto; max-width: var(--layout-container); padding-inline: var(--space-gutter); width: 100%; }
body.home.kl-theme .entry-content .skip { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
body.home.kl-theme .entry-content .skip:focus { background: var(--color-paper); clip: auto; clip-path: none; color: var(--color-ink); height: auto; left: 1rem; padding: .7rem 1rem; top: 1rem; width: auto; z-index: 1000; }

body.home.kl-theme .entry-content .eyebrow {
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .16em;
  line-height: 1.25;
  margin: 0;
  text-transform: uppercase;
}
body.home.kl-theme .entry-content .btn {
  align-items: center;
  border: 1px solid var(--color-plum);
  border-radius: var(--radius-control);
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .75rem;
  font-weight: 600;
  gap: .65rem;
  justify-content: center;
  letter-spacing: .04em;
  line-height: 1.2;
  min-height: 46px;
  padding: .86rem 1.15rem;
  text-decoration: none;
  transition: background .2s var(--motion-standard), border-color .2s var(--motion-standard), color .2s var(--motion-standard), transform .2s var(--motion-standard);
}
body.home.kl-theme .entry-content .btn:hover { transform: translateY(-1px); }
body.home.kl-theme .entry-content .btn-primary { background: var(--color-plum); color: var(--color-white); }
body.home.kl-theme .entry-content .btn-primary:hover { background: var(--color-plum-dark); border-color: var(--color-plum-dark); color: var(--color-white); }
body.home.kl-theme .entry-content .btn-secondary { background: transparent; color: var(--color-plum); }
body.home.kl-theme .entry-content .btn-secondary:hover { background: var(--color-lavender); color: var(--color-plum-dark); }
body.home.kl-theme .entry-content .arrow { font-size: 1.1em; line-height: 1; }
body.home.kl-theme .entry-content .link-more { color: var(--color-plum); font-family: var(--font-heading); font-size: .78rem; font-weight: 500; text-decoration: underline; text-decoration-color: var(--color-lavender-deep); text-decoration-thickness: 1px; text-underline-offset: 6px; }
body.home.kl-theme .entry-content .link-more:hover { color: var(--color-plum-dark); text-decoration-color: var(--color-plum); }

/* Header and responsive menu */
body.home.kl-theme .entry-content .masthead { background: rgba(251,250,252,.96); border-bottom: 1px solid var(--color-line); position: relative; z-index: 20; }
body.home.kl-theme .entry-content .masthead .shell { align-items: center; display: grid; gap: 1.5rem; grid-template-columns: minmax(178px, 1fr) auto auto; min-height: 76px; }
body.home.kl-theme .entry-content .wordmark { color: var(--color-ink); display: inline-flex; flex-direction: column; font-family: var(--font-heading); font-size: 1rem; font-weight: 600; letter-spacing: -.04em; line-height: 1.05; text-decoration: none; width: fit-content; }
body.home.kl-theme .entry-content .wordmark span { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .6rem; font-weight: 600; letter-spacing: .14em; margin-top: .28rem; text-transform: uppercase; }
body.home.kl-theme .entry-content .masthead nav .nav-list { align-items: center; display: flex; gap: clamp(.8rem, 1.8vw, 1.65rem); list-style: none; margin: 0; padding: 0; }
body.home.kl-theme .entry-content .masthead nav a { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .77rem; font-weight: 500; text-decoration: none; }
body.home.kl-theme .entry-content .masthead nav a:hover { color: var(--color-plum); }
body.home.kl-theme .entry-content .header-actions { align-items: center; display: flex; gap: .75rem; }
body.home.kl-theme .entry-content .header-actions .btn { min-height: 42px; padding: .7rem .88rem; white-space: nowrap; }
body.home.kl-theme .entry-content .menu-toggle { align-items: center; background: transparent; border: 1px solid var(--color-line-strong); border-radius: var(--radius-control); color: var(--color-ink); display: none; font-family: var(--font-heading); font-size: .72rem; gap: .55rem; min-height: 42px; padding: .6rem .75rem; }
body.home.kl-theme .entry-content .bars { display: grid; gap: 3px; width: 15px; }
body.home.kl-theme .entry-content .bars span { background: currentColor; display: block; height: 1px; width: 100%; }
body.home.kl-theme .entry-content .mobile-panel { background: var(--color-paper); border-bottom: 1px solid var(--color-line); display: none; padding: 1.2rem var(--space-gutter) 1.4rem; position: relative; z-index: 19; }
body.home.kl-theme .entry-content .mobile-panel.is-open,
body.home.kl-theme .entry-content .mobile-panel.open { display: grid; gap: 1rem; }
body.home.kl-theme .entry-content .mobile-panel ul { list-style: none; margin: 0; padding: 0; }
body.home.kl-theme .entry-content .mobile-panel li { border-top: 1px solid var(--color-line); margin: 0; padding: .8rem 0; }
body.home.kl-theme .entry-content .mobile-panel a { color: var(--color-ink); font-family: var(--font-heading); font-size: .9rem; text-decoration: none; }
body.home.kl-theme .entry-content .panel-meta { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .72rem; line-height: 1.45; margin: .2rem 0 0; }

/* Hero and recognition */
body.home.kl-theme .entry-content .hero { background: linear-gradient(180deg, var(--color-mist) 0%, var(--color-mist) 68%, var(--color-paper-soft) 84%, var(--color-paper) 100%); padding-block: clamp(4rem, 8vw, 7.2rem) clamp(3.25rem, 6vw, 5.5rem); }
body.home.kl-theme .entry-content .hero-grid { align-items: center; display: grid; gap: clamp(2.75rem, 6vw, 5.75rem); grid-template-columns: minmax(0, 1.04fr) minmax(290px, .78fr); }
body.home.kl-theme .entry-content .hero h1 { font-size: clamp(2.8rem, 5.4vw, 5.2rem); margin: .85rem 0 0; max-width: 11ch; }
body.home.kl-theme .entry-content .hero h1 em { font-family: var(--font-body); font-weight: 500; }
body.home.kl-theme .entry-content .hero-sub { color: var(--color-ink-soft); font-size: clamp(1.04rem, 1.5vw, 1.18rem); margin: 1.35rem 0 0; max-width: 37rem; }
body.home.kl-theme .entry-content .hero-actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 1.75rem; }
body.home.kl-theme .entry-content .portrait-field { align-items: end; background: var(--color-lavender-deep); display: grid; min-height: clamp(350px, 40vw, 540px); overflow: hidden; position: relative; }
body.home.kl-theme .entry-content .calm-canvas { height: 100%; inset: 0; pointer-events: none; position: absolute; width: 100%; }
body.home.kl-theme .entry-content .portrait { align-items: center; background: rgba(251,250,252,.7); border: 1px solid rgba(79,53,111,.22); color: var(--color-plum); display: flex; font-family: var(--font-heading); font-size: .68rem; font-weight: 600; letter-spacing: .13em; line-height: 1.6; margin: var(--space-gutter); min-height: 56%; padding: 1.5rem; position: relative; text-align: center; text-transform: uppercase; }
body.home.kl-theme .entry-content .trustbar { border-block: 1px solid var(--color-line); padding-block: 1.05rem; }
body.home.kl-theme .entry-content .trustbar ul { align-items: center; color: var(--color-ink-soft); display: flex; flex-wrap: wrap; font-family: var(--font-heading); font-size: .66rem; font-weight: 600; gap: .55rem 1.35rem; justify-content: center; letter-spacing: .1em; list-style: none; margin: 0; padding: 0; text-transform: uppercase; }
body.home.kl-theme .entry-content .recognition { padding-block: var(--space-section); }
body.home.kl-theme .entry-content .recog-grid { display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); }
body.home.kl-theme .entry-content .recognition h2 { font-size: clamp(2rem,3.4vw,3.1rem); margin: .8rem 0 0; }
body.home.kl-theme .entry-content .recog-list { list-style: none; margin: 0; padding: 0; }
body.home.kl-theme .entry-content .recog-list li { border-top: 1px solid var(--color-line); color: var(--color-ink-soft); margin: 0; padding: 1.05rem 0 1.05rem 1.35rem; position: relative; }
body.home.kl-theme .entry-content .recog-list li:last-child { border-bottom: 1px solid var(--color-line); }
body.home.kl-theme .entry-content .recog-list li::before { background: var(--color-plum); border-radius: 50%; content: ""; height: 5px; left: 0; position: absolute; top: 1.72rem; width: 5px; }
body.home.kl-theme .entry-content .recog-foot { color: var(--color-ink-soft); font-size: .98rem; margin-top: 1.25rem; }

/* Existing specialty, approach, about, and credential sections */
body.home.kl-theme .entry-content .section-head { max-width: 46rem; }
body.home.kl-theme .entry-content .section-head h2 { font-size: clamp(2.1rem,3.7vw,3.35rem); margin: .75rem 0 0; }
body.home.kl-theme .entry-content .section-head > p:last-child { color: var(--color-ink-soft); font-size: 1.04rem; margin: 1rem 0 0; }
body.home.kl-theme .entry-content .svc-list { background: var(--color-line); display: grid; gap: 1px; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: clamp(2.5rem,5vw,4rem); }
body.home.kl-theme .entry-content .svc { background: var(--color-paper); display: grid; gap: 1.35rem; grid-template-columns: auto minmax(0,1fr); padding: clamp(1.5rem,3vw,2.5rem); }
body.home.kl-theme .entry-content .svc-idx { border: 0; color: var(--color-plum); font-family: var(--font-body); font-size: 1.8rem; line-height: 1; padding: 0; }
body.home.kl-theme .entry-content .svc h3 { font-size: clamp(1.3rem,2.15vw,1.7rem); margin: 0; }
body.home.kl-theme .entry-content .svc-detail { border-left: 1px solid var(--color-lavender-deep); display: grid; gap: 1.15rem; margin-top: 1.25rem; padding-left: 1rem; }
body.home.kl-theme .entry-content .svc-block { border: 0; padding: 0; }
body.home.kl-theme .entry-content .svc-label { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .59rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
body.home.kl-theme .entry-content .svc-block p { color: var(--color-ink-soft); font-size: .95rem; margin: .28rem 0 0; }
body.home.kl-theme .entry-content .svc-block:last-child .svc-label { color: var(--color-plum); }
body.home.kl-theme .entry-content .svc-block:last-child p { color: var(--color-ink); }
body.home.kl-theme .entry-content .approach { overflow: hidden; position: relative; }
body.home.kl-theme .entry-content .approach-grid { position: relative; z-index: 1; }
body.home.kl-theme .entry-content .approach .eyebrow { color: var(--color-on-plum-eyebrow); }
body.home.kl-theme .entry-content .approach h2 { max-width: 13ch; }
body.home.kl-theme .entry-content .approach .subhead { color: var(--color-mist-deep); font-family: var(--font-heading); font-size: .86rem; font-weight: 600; letter-spacing: .08em; margin: 1.5rem 0 0; text-transform: uppercase; }
body.home.kl-theme .entry-content .approach .link-more { color: var(--color-white); text-decoration-color: rgba(255,255,255,.35); }
body.home.kl-theme .entry-content .halo { border: 1px solid rgba(255,255,255,.16); border-radius: 50%; height: 28rem; pointer-events: none; position: absolute; width: 28rem; }
body.home.kl-theme .entry-content .halo-a { right: -12rem; top: -14rem; }
body.home.kl-theme .entry-content .halo-b { bottom: -17rem; left: -12rem; }
body.home.kl-theme .entry-content .about-prev { padding-block: var(--space-section); }
body.home.kl-theme .entry-content .about-grid { align-items: center; display: grid; gap: clamp(2.5rem,6vw,6rem); grid-template-columns: minmax(260px,.82fr) minmax(0,1.18fr); }
body.home.kl-theme .entry-content .about-photo { background: var(--color-lavender); min-height: 420px; overflow: hidden; }
body.home.kl-theme .entry-content .about-photo img { height: 100%; object-fit: cover; width: 100%; }
body.home.kl-theme .entry-content .about-prev h2 { font-size: clamp(2.1rem,3.7vw,3.35rem); margin: .75rem 0 0; }
body.home.kl-theme .entry-content .about-prev p:not(.eyebrow) { color: var(--color-ink-soft); margin: 1rem 0 0; }
body.home.kl-theme .entry-content .about-prev .link-more { display: inline-block; margin-top: 1.2rem; }
body.home.kl-theme .entry-content .creds { padding-block: clamp(3rem,6vw,5rem); }

/* Writing, safety, FAQ, consultation, and custom footer */
body.home.kl-theme .entry-content .blog-head { align-items: end; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; }
body.home.kl-theme .entry-content .blog-head h2 { font-size: clamp(2.1rem,3.7vw,3.35rem); margin: .75rem 0 0; }
body.home.kl-theme .entry-content .post-grid { background: var(--color-line); margin-top: 2.25rem; }
body.home.kl-theme .entry-content .post { background: var(--color-paper); }
body.home.kl-theme .entry-content .post-thumb { aspect-ratio: 16/10; background: var(--color-lavender); margin: -1.6rem -1.6rem 1.35rem; overflow: hidden; }
body.home.kl-theme .entry-content .post-thumb img { height: 100%; object-fit: cover; width: 100%; }
body.home.kl-theme .entry-content .post h3 { font-size: 1.4rem; }
body.home.kl-theme .entry-content .post .link-more { margin-top: .8rem; }
body.home.kl-theme .entry-content .safety-callout { color: var(--color-plum); font-family: var(--font-heading); font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
body.home.kl-theme .entry-content .faq-grid { display: grid; gap: clamp(2.5rem,6vw,6rem); grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); }
body.home.kl-theme .entry-content .faq-grid h2 { font-size: clamp(2.1rem,3.7vw,3.35rem); margin: .75rem 0 0; }
body.home.kl-theme .entry-content .faq-list { border-top: 1px solid var(--color-line-strong); }
body.home.kl-theme .entry-content .faq-item { border-bottom: 1px solid var(--color-line-strong); margin: 0; }
body.home.kl-theme .entry-content .faq-q { background: none; border: 0; color: var(--color-ink); cursor: pointer; display: flex; font-family: var(--font-heading); font-size: 1rem; font-weight: 500; gap: 1rem; justify-content: space-between; padding: 1rem 0; text-align: left; width: 100%; }
body.home.kl-theme .entry-content .faq-plus { color: var(--color-plum); font-family: var(--font-body); font-size: 1.65rem; font-weight: 400; line-height: .9; }
body.home.kl-theme .entry-content .faq-a { color: var(--color-ink-soft); display: none; }
body.home.kl-theme .entry-content .faq-item.is-open .faq-a,
body.home.kl-theme .entry-content .faq-item.open .faq-a { display: block; }
body.home.kl-theme .entry-content .faq-a-inner { margin: 0; padding: 0 2rem 1.4rem 0; }
body.home.kl-theme .entry-content .closing { padding-block: var(--space-section); }
body.home.kl-theme .entry-content .closing-inner { text-align: center; }
body.home.kl-theme .entry-content .closing .eyebrow { color: var(--color-on-plum-eyebrow); }
body.home.kl-theme .entry-content .closing-actions { display: flex; flex-wrap: wrap; gap: .85rem; justify-content: center; margin-top: 1.6rem; }
body.home.kl-theme .entry-content .closing .btn-primary { background: var(--color-white); border-color: var(--color-white); color: var(--color-plum-dark); }
body.home.kl-theme .entry-content .closing .btn-primary:hover { background: var(--color-lavender); color: var(--color-plum-dark); }
body.home.kl-theme .entry-content .closing .btn-secondary { border-color: rgba(255,255,255,.5); color: var(--color-white); }
body.home.kl-theme .entry-content .closing .btn-secondary:hover { background: rgba(255,255,255,.1); color: var(--color-white); }
body.home.kl-theme .entry-content .site-foot { background: var(--color-plum-dark); color: var(--color-on-plum-soft); padding-block: clamp(3.25rem,6vw,5rem) 1.5rem; }
body.home.kl-theme .entry-content .foot-grid { display: grid; gap: 2rem; grid-template-columns: 1.45fr .8fr .8fr; }
body.home.kl-theme .entry-content .site-foot .name { color: var(--color-white); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 600; letter-spacing: -.04em; margin: 0; }
body.home.kl-theme .entry-content .site-foot p { color: var(--color-on-plum-soft); font-size: .94rem; margin: .75rem 0 0; }
body.home.kl-theme .entry-content .site-foot h3 { color: var(--color-white); font-family: var(--font-heading); font-size: .7rem; font-weight: 600; letter-spacing: .13em; margin: 0; text-transform: uppercase; }
body.home.kl-theme .entry-content .site-foot ul { list-style: none; margin: .75rem 0 0; padding: 0; }
body.home.kl-theme .entry-content .site-foot li { margin: .55rem 0; }
body.home.kl-theme .entry-content .site-foot a { color: var(--color-on-plum-link); text-decoration-color: rgba(232,223,240,.3); }
body.home.kl-theme .entry-content .foot-base { border-top: 1px solid rgba(255,255,255,.2); color: var(--color-footer-meta); display: flex; flex-wrap: wrap; font-family: var(--font-heading); font-size: .68rem; gap: .65rem 1rem; justify-content: space-between; margin-top: 2.2rem; padding-top: 1.2rem; }

@media (max-width: 1024px) {
  body.home.kl-theme .entry-content .hero-grid,
  body.home.kl-theme .entry-content .recog-grid,
  body.home.kl-theme .entry-content .about-grid,
  body.home.kl-theme .entry-content .faq-grid { grid-template-columns: 1fr; }
  body.home.kl-theme .entry-content .portrait-field { max-width: 560px; }
  body.home.kl-theme .entry-content .masthead .shell { grid-template-columns: 1fr auto; }
  body.home.kl-theme .entry-content .masthead nav { display: none; }
  body.home.kl-theme .entry-content .menu-toggle { display: inline-flex; }
  body.home.kl-theme .entry-content .header-actions .btn { display: none; }
  body.home.kl-theme .entry-content .foot-grid { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 720px) {
  body.home.kl-theme .entry-content .masthead .shell { min-height: 68px; }
  body.home.kl-theme .entry-content .hero { padding-block: 3.5rem 3rem; }
  body.home.kl-theme .entry-content .hero h1 { font-size: clamp(2.45rem,12vw,3.75rem); }
  body.home.kl-theme .entry-content .hero-actions,
  body.home.kl-theme .entry-content .closing-actions { align-items: stretch; flex-direction: column; }
  body.home.kl-theme .entry-content .hero-actions .btn,
  body.home.kl-theme .entry-content .closing-actions .btn { width: 100%; }
  body.home.kl-theme .entry-content .portrait-field { min-height: 370px; }
  body.home.kl-theme .entry-content .trustbar ul { align-items: flex-start; flex-direction: column; }
  body.home.kl-theme .entry-content .svc-list,
  body.home.kl-theme .entry-content .foot-grid { grid-template-columns: 1fr; }
  body.home.kl-theme .entry-content .svc { padding: 1.45rem; }
  body.home.kl-theme .entry-content .about-photo { min-height: 340px; }
  body.home.kl-theme .entry-content .foot-base { align-items: flex-start; flex-direction: column; }
}

/* ---------- final contrast, rhythm, and FAQ interaction repair ---------- */
body.home.kl-theme .entry-content .portrait { position: relative; z-index: 1; }
body.home.kl-theme .entry-content .portrait img { display: block; height: 100%; max-width: 100%; object-fit: cover; width: 100%; }

body.home.kl-theme .entry-content .faq { background: var(--color-lavender-muted); padding-block: clamp(4.75rem, 8vw, 7.5rem); }
body.home.kl-theme .entry-content .faq-grid { align-items: start; gap: clamp(3rem, 7vw, 7.5rem); }
body.home.kl-theme .entry-content .faq .section-head > p:last-child { color: var(--color-ink-muted); font-size: clamp(1rem, 1.3vw, 1.12rem); line-height: 1.72; margin-top: 1.25rem; max-width: 31rem; }
body.home.kl-theme .entry-content .faq h2 { color: var(--color-lavender-ink); letter-spacing: -.045em; line-height: 1.05; }
body.home.kl-theme .entry-content .faq-list { border-top-color: var(--color-lavender-border); }
body.home.kl-theme .entry-content .faq-item { border-bottom-color: var(--color-lavender-border); }
body.home.kl-theme .entry-content .faq-q {
  align-items: center; background: transparent; border: 0; color: var(--color-lavender-ink); cursor: pointer; display: flex; font-family: var(--font-heading); gap: 1.5rem; justify-content: space-between; min-height: 76px; padding: 1.15rem 0; text-align: left; width: 100%;
}
body.home.kl-theme .entry-content .faq-q h3 { color: inherit; font-family: var(--font-heading); font-size: clamp(1.06rem, 1.7vw, 1.34rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.28; margin: 0; }
body.home.kl-theme .entry-content .faq-q::after { color: var(--color-plum-accent); content: "+"; flex: 0 0 auto; font-family: var(--font-body); font-size: 2rem; font-weight: 400; line-height: 1; }
body.home.kl-theme .entry-content .faq-item:focus-within .faq-q::after { content: "–"; }
body.home.kl-theme .entry-content .faq-q:focus-visible { outline: 3px solid var(--color-focus); outline-offset: -3px; }
body.home.kl-theme .entry-content .faq-a { display: none !important; }
body.home.kl-theme .entry-content .faq-item:focus-within .faq-a { display: block !important; }
body.home.kl-theme .entry-content .faq-a-inner { color: var(--color-ink-muted); font-size: 1rem; line-height: 1.72; margin: 0; max-width: 52rem; padding: 0 3rem 1.65rem 0; }
body.home.kl-theme .entry-content .faq-a-inner p { color: inherit; margin: 0 0 .85rem; }
body.home.kl-theme .entry-content .faq-a-inner p:last-child { margin-bottom: 0; }

body.home.kl-theme .entry-content .approach,
body.home.kl-theme .entry-content .closing { background: var(--color-plum-hover); padding-block: clamp(4.75rem, 8vw, 7.5rem); }
body.home.kl-theme .entry-content .approach-grid { gap: clamp(3rem, 7vw, 7.5rem); }
body.home.kl-theme .entry-content .approach .eyebrow,
body.home.kl-theme .entry-content .closing .eyebrow { color: var(--color-on-plum-eyebrow-bright); }
body.home.kl-theme .entry-content .approach h2,
body.home.kl-theme .entry-content .closing h2 { color: var(--color-white); letter-spacing: -.04em; line-height: 1.08; }
body.home.kl-theme .entry-content .approach .subhead { color: var(--color-on-plum-bright); line-height: 1.45; margin-top: 1.5rem; }
body.home.kl-theme .entry-content .approach p,
body.home.kl-theme .entry-content .closing p { color: var(--color-paper-highlight); font-size: clamp(1.04rem, 1.35vw, 1.17rem); line-height: 1.72; }
body.home.kl-theme .entry-content .approach .modalities { gap: .65rem; margin-top: 1.9rem; }
body.home.kl-theme .entry-content .approach .modalities li { border-color: rgba(255,255,255,.42); color: var(--color-white); font-size: .74rem; padding: .58rem .8rem; }
body.home.kl-theme .entry-content .approach .link-more { color: var(--color-white); display: inline-block; margin-top: 1.35rem; text-decoration-color: rgba(255,255,255,.55); }
body.home.kl-theme .entry-content .closing-inner { max-width: 56rem; }
body.home.kl-theme .entry-content .closing > .shell > .closing-inner > p:not(.eyebrow) { margin-top: 1.35rem; }
body.home.kl-theme .entry-content .consult-steps { gap: 1.5rem; margin-top: 2.65rem; }
body.home.kl-theme .entry-content .consult-steps li { border-top-color: rgba(255,255,255,.4); color: var(--color-on-plum-step); font-size: 1rem; line-height: 1.62; padding: 1.2rem 1.35rem; }
body.home.kl-theme .entry-content .consult-steps strong { color: var(--color-white); font-size: .85rem; letter-spacing: .01em; margin-bottom: .55rem; }
body.home.kl-theme .entry-content .site-foot { background: var(--color-plum-footer); padding-top: clamp(3.75rem, 6vw, 5.75rem); }
body.home.kl-theme .entry-content .site-foot p,
body.home.kl-theme .entry-content .site-foot li { color: var(--color-on-plum-text); line-height: 1.65; }
body.home.kl-theme .entry-content .site-foot a { color: var(--color-white); text-decoration-color: rgba(255,255,255,.48); }
body.home.kl-theme .entry-content .crisis { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.28); color: var(--color-on-plum-highlight); line-height: 1.72; padding: 1.35rem 1.5rem; }
body.home.kl-theme .entry-content .foot-base { color: var(--color-on-plum-muted); line-height: 1.5; }

@media (max-width: 720px) {
  body.home.kl-theme .entry-content .faq { padding-block: 4rem; }
  body.home.kl-theme .entry-content .faq-q { gap: 1rem; min-height: 68px; padding: 1rem 0; }
  body.home.kl-theme .entry-content .faq-q h3 { font-size: 1.05rem; }
  body.home.kl-theme .entry-content .faq-a-inner { font-size: .98rem; padding-right: 0; }
  body.home.kl-theme .entry-content .consult-steps { gap: 1px; margin-top: 2rem; }
  body.home.kl-theme .entry-content .consult-steps li { padding: 1.1rem 0; }
}

/* ---------- reusable editorial subpage system ---------- */
.kl-subpage { background: var(--color-paper); color: var(--color-ink); }
.kl-page-shell { margin-inline: auto; max-width: 1180px; padding-inline: clamp(1.25rem, 4vw, 3rem); }
.kl-subpage .kl-page-hero { background: linear-gradient(180deg, var(--color-lavender) 0%, var(--color-lavender) 68%, var(--color-paper-soft) 88%, var(--color-paper) 100%); border-bottom: 0; padding-block: clamp(4.5rem, 9vw, 8rem); }
.kl-subpage .kl-page-hero h1 { color: var(--color-ink); font-family: var(--font-heading); font-size: clamp(3rem, 7vw, 6.25rem); font-weight: 500; letter-spacing: -.065em; line-height: .96; margin: .7rem 0 0; max-width: 13ch; }
.kl-kicker { color: var(--color-plum); font-family: var(--font-heading); font-size: .72rem; font-weight: 700; letter-spacing: .15em; margin: 0; text-transform: uppercase; }
.kl-page-lede { color: var(--color-ink-soft); font-size: clamp(1.12rem, 2vw, 1.42rem); line-height: 1.6; margin: 1.75rem 0 0; max-width: 48rem; }
.kl-page-content { font-size: clamp(1.05rem, 1.25vw, 1.16rem); line-height: 1.8; padding-block: clamp(3.5rem, 7vw, 6.5rem); }
.kl-page-content > * { max-width: 47rem; }
.kl-page-content h2, .kl-page-content h3 { color: var(--color-ink); font-family: var(--font-heading); letter-spacing: -.04em; line-height: 1.1; margin-top: 2.6em; }
.kl-page-content h2 { font-size: clamp(2rem, 4vw, 3rem); }
.kl-page-content a, .kl-text-link { color: var(--color-plum); text-decoration-color: rgba(79,53,111,.4); text-underline-offset: .18em; }
.kl-subpage .kl-writing-hero { background: var(--color-plum); }
.kl-writing-hero .kl-kicker, .kl-writing-hero h1 { color: var(--color-white); }
.kl-writing-hero .kl-page-lede { color: var(--color-on-plum-hero); }
.kl-subpage .kl-writing-hero .kl-kicker,
.kl-subpage .kl-writing-hero h1 { color: var(--color-white); }
.kl-post-grid { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-block: clamp(3rem, 6vw, 5.5rem); }
.kl-post-card { background: var(--color-paper); border: 1px solid var(--color-line); display: flex; flex-direction: column; }
.kl-post-image img { aspect-ratio: 16/10; display: block; object-fit: cover; width: 100%; }
.kl-post-card-body { display: flex; flex: 1; flex-direction: column; padding: clamp(1.4rem, 2.5vw, 2.1rem); }
.kl-post-meta { color: var(--color-plum); font-family: var(--font-heading); font-size: .7rem; font-weight: 700; letter-spacing: .12em; margin: 0; text-transform: uppercase; }
.kl-post-card h2 { font-family: var(--font-heading); font-size: clamp(1.45rem, 2.3vw, 2rem); letter-spacing: -.045em; line-height: 1.1; margin: 1rem 0; }
.kl-post-card h2 a { color: var(--color-ink); text-decoration: none; }
.kl-post-card p:not(.kl-post-meta) { color: var(--color-ink-soft); line-height: 1.65; margin: 0; }
.kl-post-card .kl-text-link { margin-top: auto; padding-top: 1.5rem; }
.kl-empty-posts { border: 1px solid var(--color-line); grid-column: 1 / -1; padding: clamp(2rem,5vw,4rem); }
.kl-empty-posts h2 { font-family: var(--font-heading); letter-spacing: -.04em; margin: .7rem 0; }
.kl-reading-column { margin-inline: auto; max-width: 47rem; padding-inline: clamp(1.25rem,4vw,3rem); }
.kl-featured-image { margin-bottom: 2.5rem; }
.kl-featured-image img { height: auto; width: 100%; }
.kl-return-link { margin-top: 3rem; }
@media (max-width: 800px) { .kl-post-grid { grid-template-columns: 1fr; } .kl-subpage .kl-page-hero { padding-block: 4rem; } }

/* ---------- homepage-first shared template system ----------
 * The original home hero is the visual source of truth. Secondary templates
 * inherit its split paper/mist composition, framed visual, typography, CTA,
 * and detail-ribbon pattern; the homepage's own custom markup remains intact.
 */
body.kl-theme .ct-header .ct-button,
body.kl-theme .ct-header a.ct-button { background: var(--color-plum); border-color: var(--color-plum); color: var(--color-white); font-size: .75rem; letter-spacing: .02em; text-transform: none; }
body.kl-theme .ct-header .ct-button:hover,
body.kl-theme .ct-header a.ct-button:hover { background: var(--color-plum-dark); color: var(--color-white); }
.kl-homepage-source { background: var(--color-paper); }
.kl-homepage-source .entry-content { margin: 0; max-width: none; padding: 0; }
.kl-reference-page { background: var(--color-paper); color: var(--color-ink); }
.kl-reference-hero { background: linear-gradient(180deg, var(--color-mist) 0%, var(--color-mist) 68%, var(--color-paper-soft) 84%, var(--color-paper) 100%); padding-block: clamp(4.25rem, 8vw, 7.25rem) clamp(3rem, 6vw, 5.25rem); }
.kl-reference-hero__grid { align-items: center; display: grid; gap: clamp(2.75rem, 6vw, 5.75rem); grid-template-columns: minmax(0, 1.04fr) minmax(290px, .78fr); }
.kl-reference-hero__copy { max-width: 42rem; }
.kl-reference-hero .kl-kicker { margin: 0; }
.kl-reference-hero h1 { color: var(--color-ink); font-family: var(--font-heading); font-size: clamp(3rem, 5.45vw, 5.25rem); font-weight: 500; letter-spacing: -.065em; line-height: .98; margin: .78rem 0 0; max-width: 11.5ch; }
.kl-reference-hero h1 em, .kl-writing-index h2 em { font-family: var(--font-body); font-weight: 500; }
.kl-reference-hero__lede { color: var(--color-ink-soft); font-family: var(--font-body); font-size: clamp(1.04rem, 1.5vw, 1.18rem); line-height: 1.7; margin: 1.35rem 0 0; max-width: 37rem; }
.kl-reference-hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.7rem; }
.kl-reference-button { align-items: center; background: var(--color-plum); border: 1px solid var(--color-plum); color: var(--color-white); display: inline-flex; font-family: var(--font-heading); font-size: .76rem; font-weight: 600; gap: .65rem; justify-content: center; letter-spacing: .02em; min-height: 46px; padding: .86rem 1.15rem; text-decoration: none; transition: background .2s var(--motion-standard), border-color .2s var(--motion-standard), color .2s var(--motion-standard), transform .2s var(--motion-standard); }
.kl-reference-button:hover { background: var(--color-plum-dark); border-color: var(--color-plum-dark); color: var(--color-white); transform: translateY(-1px); }
.kl-reference-button--quiet { background: transparent; color: var(--color-plum); }
.kl-reference-button--quiet:hover { background: var(--color-lavender); border-color: var(--color-plum); color: var(--color-plum-dark); }
.kl-reference-hero__visual { align-items: end; background: var(--color-lavender-deep); display: grid; min-height: clamp(340px, 37vw, 505px); overflow: hidden; padding: var(--space-gutter); position: relative; }
.kl-reference-hero__visual::before, .kl-reference-hero__visual::after { border: 1px solid rgba(79,53,111,.14); content: ""; height: 12rem; position: absolute; width: 12rem; }
.kl-reference-hero__visual::before { border-radius: 50%; right: -5rem; top: -5rem; }
.kl-reference-hero__visual::after { border-radius: 50%; bottom: -7rem; left: -5rem; }
.kl-reference-hero__frame { align-items: center; background: rgba(251,250,252,.78); border: 1px solid rgba(79,53,111,.22); display: flex; justify-content: center; min-height: 63%; overflow: hidden; padding: clamp(1.2rem, 3vw, 2rem); position: relative; width: 100%; z-index: 1; }
.kl-reference-hero__frame img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.kl-reference-hero__frame p { color: var(--color-plum); font-family: var(--font-heading); font-size: clamp(1.25rem, 2.2vw, 2rem); font-weight: 500; letter-spacing: -.05em; line-height: 1.05; margin: 0; text-align: center; }
.kl-reference-hero__mark { border: 1px solid rgba(79,53,111,.28); border-radius: 50%; height: 6.5rem; position: absolute; transform: translate(-42%, 42%); width: 6.5rem; }
.kl-reference-hero__visual--writing .kl-reference-hero__frame { align-items: flex-end; justify-content: flex-start; }
.kl-reference-hero__visual--writing .kl-reference-hero__frame::after { border: 1px solid rgba(79,53,111,.2); content: ""; height: 42%; position: absolute; right: 1.4rem; top: 1.4rem; width: 38%; }
.kl-detail-ribbon { background: var(--color-paper); border-block: 1px solid var(--color-line); }
.kl-detail-ribbon__inner { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem 1.35rem; justify-content: center; min-height: 58px; }
.kl-detail-ribbon__inner span { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .64rem; font-weight: 600; letter-spacing: .1em; line-height: 1.35; text-transform: uppercase; }
.kl-reference-page .kl-page-content { font-size: clamp(1.04rem, 1.25vw, 1.14rem); line-height: 1.78; padding-block: clamp(4.25rem, 7vw, 6.75rem); }
.kl-page-flow > :not(#main-content) { margin-inline: auto; max-width: 48rem; }
.kl-page-flow > .skip, .kl-page-flow > .masthead, .kl-page-flow > .mobile-panel, .kl-page-flow > .site-foot, .kl-page-flow #main-content > .page-hero { display: none !important; }
.kl-page-flow #main-content { display: block; }
.kl-page-flow #main-content > section:not(.page-hero), .kl-page-flow #main-content > div:not(.page-hero) { margin-inline: auto; max-width: 52rem; padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.kl-page-flow #main-content > section:not(.page-hero) + section:not(.page-hero), .kl-page-flow #main-content > div:not(.page-hero) + div:not(.page-hero) { border-top: 1px solid var(--color-line); }
.kl-page-flow #main-content h2, .kl-page-flow #main-content h3, .kl-page-flow > h2, .kl-page-flow > h3 { color: var(--color-ink); font-family: var(--font-heading); letter-spacing: -.05em; line-height: 1.08; margin: 0 0 1rem; }
.kl-page-flow #main-content h2, .kl-page-flow > h2 { font-size: clamp(2rem, 3.5vw, 3.25rem); }
.kl-page-flow #main-content h3, .kl-page-flow > h3 { font-size: clamp(1.35rem, 2.2vw, 1.8rem); }
.kl-page-flow #main-content p, .kl-page-flow > p, .kl-page-flow li { color: var(--color-ink-soft); font-family: var(--font-body); line-height: 1.78; }
.kl-page-flow #main-content li + li { margin-top: .6rem; }
.kl-page-flow #main-content .consultation, .kl-page-flow #main-content .closing { background: var(--color-plum); color: var(--color-white); max-width: none; padding-inline: clamp(1.25rem, 4vw, 3rem); position: relative; }
.kl-page-flow #main-content .consultation :is(h2,h3,p), .kl-page-flow #main-content .closing :is(h2,h3,p) { color: inherit; position: relative; }
.kl-page-flow #main-content .consultation a, .kl-page-flow #main-content .closing a { color: var(--color-white); }
.kl-writing-index { padding-block: clamp(4.25rem, 7vw, 6.75rem); }
.kl-writing-index__head { align-items: end; display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; }
.kl-writing-index__head h2 { color: var(--color-ink); font-family: var(--font-heading); font-size: clamp(2rem, 3.6vw, 3.25rem); letter-spacing: -.055em; line-height: 1.02; margin: .75rem 0 0; }
.kl-writing-index__head > p { color: var(--color-ink-soft); font-size: .98rem; line-height: 1.6; margin: 0; max-width: 24rem; }
.kl-writing-index .kl-post-grid { background: var(--color-line); margin-top: clamp(2.25rem, 4vw, 3.5rem); padding: 1px; }
.kl-post-card { background: var(--color-paper); border: 0; min-height: 100%; }
.kl-post-card-body { padding: clamp(1.55rem, 2.7vw, 2.2rem); }
.kl-post-card h3 { color: var(--color-ink); font-family: var(--font-heading); font-size: clamp(1.4rem, 2.2vw, 1.95rem); letter-spacing: -.05em; line-height: 1.08; margin: 1rem 0; }
.kl-post-card h3 a { color: inherit; text-decoration: none; }
.kl-post-card:hover h3 a { color: var(--color-plum); }
.kl-post-card .kl-text-link { margin-top: auto; padding-top: 1.5rem; }
.kl-single-post .kl-reference-hero h1 { max-width: 12ch; }
.kl-single-post .kl-reference-hero__visual--article .kl-reference-hero__frame { min-height: 70%; }
.kl-article-reading { margin-inline: auto; max-width: 50rem; padding: clamp(4.25rem, 7vw, 6.75rem) var(--space-gutter); }
.kl-article-reading > :not(.kl-article-signoff) { max-width: 43rem; }
.kl-article-reading h2, .kl-article-reading h3 { color: var(--color-ink); font-family: var(--font-heading); letter-spacing: -.045em; line-height: 1.1; margin-top: 2.4em; }
.kl-article-reading h2 { font-size: clamp(2rem, 3.5vw, 3rem); }
.kl-article-reading p, .kl-article-reading li { color: var(--color-ink-soft); font-family: var(--font-body); line-height: 1.82; }
.kl-article-reading a { color: var(--color-plum); text-decoration-color: rgba(79,53,111,.4); text-underline-offset: .18em; }
.kl-article-signoff { border-top: 1px solid var(--color-line); margin-top: clamp(3rem, 6vw, 5rem); max-width: 43rem; padding-top: 1.6rem; }
.kl-article-signoff p:not(.kl-kicker) { margin: .7rem 0 1.1rem; }

/* FIRST-SCREEN PERFORMANCE CONTRACT: preserve immediate navigation, CTAs, hero
 * copy, and images. Browser rendering may defer only lower homepage sections. */
@supports (content-visibility: auto) {
  body.home.kl-theme .entry-content :is(.areas, .approach, .about-prev, .creds, .blog, .faq, .safety, .closing, .site-foot) {
    contain-intrinsic-size: auto 920px;
    content-visibility: auto;
  }
}
@media (max-width: 1024px) { .kl-reference-hero__grid { grid-template-columns: 1fr; } .kl-reference-hero__visual { max-width: 560px; } }
@media (max-width: 720px) { .kl-reference-hero { padding-block: 3.5rem 3rem; } .kl-reference-hero h1 { font-size: clamp(2.5rem, 12vw, 3.9rem); } .kl-reference-hero__actions { align-items: stretch; flex-direction: column; } .kl-reference-button { width: 100%; } .kl-reference-hero__visual { min-height: 360px; padding: 1.25rem; width: 100%; } .kl-detail-ribbon__inner { align-items: flex-start; flex-direction: column; gap: .55rem; padding-block: 1rem; } .kl-writing-index__head { align-items: flex-start; flex-direction: column; } }

/* Static practice pages do not inherit Blocksy's header markup in this site,
 * so this mirrors the homepage navigation without touching its custom shell. */
.kl-reference-nav { background: var(--color-paper); border-bottom: 1px solid var(--color-line); }
.kl-reference-nav__inner { align-items: center; display: grid; gap: 1.5rem; grid-template-columns: minmax(165px, 1fr) auto auto; min-height: 76px; }
.kl-reference-nav__brand { color: var(--color-ink); display: inline-flex; flex-direction: column; font-family: var(--font-heading); font-size: 1rem; font-weight: 600; letter-spacing: -.04em; line-height: 1.05; text-decoration: none; width: fit-content; }
.kl-reference-nav__brand span { color: var(--color-ink-soft); font-size: .6rem; font-weight: 600; letter-spacing: .14em; margin-top: .28rem; text-transform: uppercase; }
.kl-reference-nav__links { align-items: center; display: flex; gap: clamp(.8rem, 1.8vw, 1.65rem); list-style: none; margin: 0; padding: 0; }
.kl-reference-nav__links a { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .77rem; font-weight: 500; text-decoration: none; }
.kl-reference-nav__links a:hover { color: var(--color-plum); }
.kl-reference-nav__cta { align-items: center; background: var(--color-plum); border: 1px solid var(--color-plum); color: var(--color-white); display: inline-flex; font-family: var(--font-heading); font-size: .75rem; font-weight: 600; justify-content: center; letter-spacing: .02em; min-height: 42px; padding: .7rem .88rem; text-decoration: none; white-space: nowrap; }
.kl-reference-nav__cta:hover { background: var(--color-plum-dark); color: var(--color-white); }
@media (max-width: 1024px) { .kl-reference-nav__inner { grid-template-columns: 1fr auto; padding-block: .85rem; } .kl-reference-nav__links { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; width: 100%; } }
@media (max-width: 720px) { .kl-reference-nav__inner { gap: .8rem; grid-template-columns: 1fr; } .kl-reference-nav__cta { display: none; } .kl-reference-nav__links { flex-wrap: wrap; gap: .7rem 1rem; justify-content: flex-start; } .kl-reference-nav__links a { font-size: .72rem; } }

/* The old Approach page included a large standalone SVG cycle. It is retained
 * as a meaning-bearing detail, but scaled into the same ruled, editorial rhythm
 * used by the homepage instead of dominating the reading column. */
.kl-reference-page--approach .approach-loop { border-top: 1px solid var(--color-line); margin: clamp(2rem, 4vw, 3.5rem) auto 0; max-width: 52rem; padding-top: .25rem; }
.kl-reference-page--approach .loop-node { align-items: start; border-bottom: 1px solid var(--color-line); display: grid; gap: 1rem; grid-template-columns: 3.4rem minmax(0, 1fr); padding: 1.25rem 0; }
.kl-reference-page--approach .loop-dot { align-items: center; background: var(--color-lavender); border: 1px solid var(--color-lavender-deep); border-radius: 50%; color: var(--color-plum); display: inline-flex; font-family: var(--font-heading); font-size: .67rem; font-weight: 600; height: 2.75rem !important; justify-content: center; letter-spacing: .03em; line-height: 1; text-align: center; width: 2.75rem !important; }
.kl-reference-page--approach .loop-content h3 { color: var(--color-ink); font-family: var(--font-heading); font-size: clamp(1.15rem, 1.8vw, 1.45rem); letter-spacing: -.035em; line-height: 1.15; margin: 0; }
.kl-reference-page--approach .loop-content p { color: var(--color-ink-soft); margin: .45rem 0 0; }
.kl-reference-page--approach .loop-back { align-items: center; color: var(--color-plum); display: flex; font-family: var(--font-heading); font-size: .76rem; font-weight: 600; gap: .7rem; letter-spacing: .03em; padding: 1.15rem 0; }
.kl-reference-page--approach .loop-back svg { display: block !important; flex: 0 0 auto; height: 1.65rem !important; max-height: 1.65rem !important; max-width: 1.65rem !important; stroke: currentColor; width: 1.65rem !important; }
@media (max-width: 720px) { .kl-reference-page--approach .loop-node { grid-template-columns: 2.9rem minmax(0, 1fr); } .kl-reference-page--approach .loop-dot { height: 2.4rem !important; width: 2.4rem !important; } }

/* ---------- visual QA: explicit surface and interactive-state contracts ----------
 * Light surfaces always use ink/plum content. Plum and charcoal surfaces always
 * use white/lilac content. Child elements are named deliberately so legacy
 * typography and Blocksy link defaults cannot leak through button labels. */

/* Light paper, mist, and lavender surfaces */
body.kl-theme .kl-reference-page,
body.kl-theme .kl-homepage-source,
body.home.kl-theme .entry-content { background-color: var(--color-paper); color: var(--color-ink); }
body.kl-theme .kl-reference-page :is(h1,h2,h3,h4,h5,h6),
body.kl-theme .kl-reference-page .kl-kicker,
body.home.kl-theme .entry-content :is(.hero,.recognition,.areas,.about-prev,.blog,.faq,.safety) :is(h1,h2,h3,h4,h5,h6) { color: var(--color-ink); }
body.kl-theme .kl-reference-page :is(p,li) { color: var(--color-ink-soft); }
body.kl-theme .kl-reference-page .kl-kicker,
body.home.kl-theme .entry-content :is(.hero,.recognition,.areas,.about-prev,.blog,.faq,.safety) .eyebrow { color: var(--color-plum); }
body.kl-theme .kl-reference-page :is(a:not(.kl-reference-button):not(.kl-reference-nav__brand):not(.kl-reference-nav__cta)),
body.home.kl-theme .entry-content :is(.hero,.recognition,.areas,.about-prev,.blog,.faq,.safety) .link-more { color: var(--color-plum); }

/* Primary actions on light surfaces: plum fill with guaranteed white label. */
body.kl-theme :is(.kl-reference-button:not(.kl-reference-button--quiet), .kl-reference-nav__cta),
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-primary,
body.kl-theme .ct-header :is(.ct-button,a.ct-button) { background-color: var(--color-plum) !important; border-color: var(--color-plum) !important; color: var(--color-white) !important; }
body.kl-theme :is(.kl-reference-button:not(.kl-reference-button--quiet), .kl-reference-nav__cta) :is(span,strong,em),
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-primary :is(span,strong,em),
body.kl-theme .ct-header :is(.ct-button,a.ct-button) :is(span,strong,em) { color: var(--color-white) !important; }
body.kl-theme :is(.kl-reference-button:not(.kl-reference-button--quiet), .kl-reference-nav__cta):hover,
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-primary:hover,
body.kl-theme .ct-header :is(.ct-button,a.ct-button):hover { background-color: var(--color-plum-dark) !important; border-color: var(--color-plum-dark) !important; color: var(--color-white) !important; }

/* Secondary actions on light surfaces: no fill, dark type, a visible plum rule. */
body.kl-theme .kl-reference-button--quiet,
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-secondary { background-color: transparent !important; border-color: var(--color-plum) !important; color: var(--color-plum) !important; }
body.kl-theme .kl-reference-button--quiet :is(span,strong,em),
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-secondary :is(span,strong,em) { color: var(--color-plum) !important; }
body.kl-theme .kl-reference-button--quiet:hover,
body.home.kl-theme .entry-content :is(.hero,.masthead,.recognition,.areas,.about-prev,.blog,.faq,.safety) .btn-secondary:hover { background-color: var(--color-lavender) !important; border-color: var(--color-plum-dark) !important; color: var(--color-plum-dark) !important; }

/* Dark plum consultation, approach, and footer surfaces. */
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach),
body.home.kl-theme .entry-content :is(.closing,.approach) { background-color: var(--color-plum) !important; color: var(--color-white) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) :is(h1,h2,h3,h4,h5,h6,strong),
body.home.kl-theme .entry-content :is(.closing,.approach) :is(h1,h2,h3,h4,h5,h6,strong) { color: var(--color-white) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) :is(p,li,em,cite),
body.home.kl-theme .entry-content :is(.closing,.approach) :is(p,li,em,cite) { color: var(--color-on-plum-quote) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .eyebrow,
body.home.kl-theme .entry-content :is(.closing,.approach) .eyebrow { color: var(--color-on-plum-eyebrow-soft) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .link-more,
body.home.kl-theme .entry-content :is(.closing,.approach) .link-more { color: var(--color-white) !important; text-decoration-color: rgba(255,255,255,.55) !important; }

/* On dark surfaces primary is a paper button with dark ink; secondary is a white rule. */
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-primary,
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-primary { background-color: var(--color-paper) !important; border-color: var(--color-paper) !important; color: var(--color-plum-dark) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-primary :is(span,strong,em),
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-primary :is(span,strong,em) { color: var(--color-plum-dark) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-primary:hover,
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-primary:hover { background-color: var(--color-lavender) !important; border-color: var(--color-lavender) !important; color: var(--color-plum-dark) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-secondary,
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-secondary { background-color: transparent !important; border-color: rgba(255,255,255,.72) !important; color: var(--color-white) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-secondary :is(span,strong,em),
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-secondary :is(span,strong,em) { color: var(--color-white) !important; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach) .btn-secondary:hover,
body.home.kl-theme .entry-content :is(.closing,.approach) .btn-secondary:hover { background-color: rgba(255,255,255,.12) !important; border-color: var(--color-white) !important; color: var(--color-white) !important; }

/* Legacy static-page closing section retains its content, but now gets the same
 * centered architecture, readable measure, spacing rhythm, and accessible CTAs. */
.kl-page-flow #main-content .closing { margin-inline: calc(50% - 50vw); max-width: 100vw; padding: clamp(4.5rem, 8vw, 7.25rem) var(--space-gutter); text-align: center; }
.kl-page-flow #main-content .closing .closing-inner { margin-inline: auto; max-width: 56rem; }
.kl-page-flow #main-content .closing h2 { font-size: clamp(2.15rem, 4.4vw, 4.35rem); letter-spacing: -.05em; margin: .8rem auto 0; max-width: 18ch; }
.kl-page-flow #main-content .closing > .shell > .closing-inner > p:not(.eyebrow) { font-size: clamp(1.05rem, 1.45vw, 1.22rem); line-height: 1.72; margin: 1.35rem auto 0; max-width: 42rem; }
.kl-page-flow #main-content .closing-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .85rem; justify-content: center; margin-top: 1.75rem; }
.kl-page-flow #main-content .closing .btn { align-items: center; display: inline-flex; font-family: var(--font-heading); font-size: .78rem; font-weight: 600; gap: .65rem; justify-content: center; letter-spacing: .02em; min-height: 48px; padding: .86rem 1.2rem; text-decoration: none; }

/* Stable readable measures and rhythm for content pages and posts. */
.kl-reference-page .kl-page-content > .kl-page-flow > :is(section,div) { padding-block: clamp(2.75rem, 5vw, 4.5rem); }
.kl-reference-page .kl-page-content p + p { margin-top: 1.1rem; }
.kl-reference-page .kl-page-content :is(ul,ol) { padding-left: 1.35rem; }
.kl-writing-index__head > p, .kl-post-card p:not(.kl-post-meta), .kl-article-reading :is(p,li) { color: var(--color-ink-soft); }

/* Footer is a separate darkest surface with a single light content palette. */
body.kl-theme :is(footer,#footer),
body.home.kl-theme .entry-content .site-foot { background-color: var(--color-plum-dark) !important; color: var(--color-on-plum-text) !important; }
body.kl-theme :is(footer,#footer) :is(h1,h2,h3,h4,h5,h6,a,strong),
body.home.kl-theme .entry-content .site-foot :is(.name,h1,h2,h3,h4,h5,h6,a,strong) { color: var(--color-white) !important; }
body.kl-theme :is(footer,#footer) :is(p,li,small),
body.home.kl-theme .entry-content .site-foot :is(p,li,.foot-base) { color: var(--color-on-plum-text) !important; }
body.kl-theme :is(footer,#footer) a:hover,
body.home.kl-theme .entry-content .site-foot a:hover { color: var(--color-lavender-highlight) !important; text-decoration-color: var(--color-lavender-highlight) !important; }

/* Clear, uniform keyboard visibility on every surface. */
body.kl-theme :is(a,button,summary):focus-visible { outline: 3px solid var(--color-focus); outline-offset: 4px; }
body.kl-theme :is(.kl-section--plum,.kl-approach-band,.kl-consultation,.closing,.approach,footer,#footer) :is(a,button,summary):focus-visible { outline-color: var(--color-white); }
@media (max-width: 720px) {
  .kl-page-flow #main-content .closing { margin-inline: 0; max-width: none; padding-block: 4rem; }
  .kl-page-flow #main-content .closing-actions { align-items: stretch; flex-direction: column; }
  .kl-page-flow #main-content .closing .btn { width: 100%; }
}

/* ---------- unified rounded CTA system ----------
 * A single rounded-rectangle geometry applies to primary/secondary actions
 * across the custom homepage, static pages, Writing, post templates, and
 * Blocksy controls. Surface colours remain defined by the v7 contracts above. */
body.kl-theme { --kl-cta-radius: 12px; --kl-cta-height: 52px; --kl-cta-gap: 12px; }

body.kl-theme :is(.kl-button,.wp-element-button,.wp-block-button__link,.btn,.kl-reference-button,.kl-reference-nav__cta,.ct-button,a.ct-button,.menu-toggle) {
  align-items: center !important;
  border-radius: var(--kl-cta-radius) !important;
  box-sizing: border-box !important;
  font-family: var(--font-heading) !important;
  font-size: .86rem !important;
  font-weight: 600 !important;
  justify-content: center !important;
  letter-spacing: .005em !important;
  line-height: 1.2 !important;
  min-height: var(--kl-cta-height) !important;
  padding: .88rem 1.3rem !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: background-color .18s var(--motion-standard), border-color .18s var(--motion-standard), color .18s var(--motion-standard), transform .18s var(--motion-standard) !important;
}
body.kl-theme :is(.kl-button,.wp-element-button,.wp-block-button__link,.btn,.kl-reference-button,.kl-reference-nav__cta,.ct-button,a.ct-button) .arrow { flex: 0 0 auto; margin-left: .3rem; }
body.kl-theme :is(.kl-button,.wp-element-button,.wp-block-button__link,.btn,.kl-reference-button,.kl-reference-nav__cta,.ct-button,a.ct-button):active { transform: translateY(1px) scale(.985) !important; }

/* Header controls deliberately use the same geometry at the compact navigation scale. */
body.kl-theme :is(.kl-reference-nav__cta,.ct-header .ct-button,.ct-header a.ct-button,body.home.kl-theme .entry-content .header-actions .btn,.menu-toggle) {
  border-radius: 10px !important;
  font-size: .75rem !important;
  min-height: 42px !important;
  padding: .65rem .9rem !important;
}

/* Paired CTA groups share equal visual weight and predictable alignment. */
body.home.kl-theme .entry-content :is(.hero-actions,.closing-actions),
.kl-reference-hero__actions,
.kl-page-flow #main-content .closing-actions,
.kl-consultation .wp-block-buttons,
.kl-page .wp-block-buttons {
  align-items: stretch !important;
  display: grid !important;
  gap: var(--kl-cta-gap) !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  margin-top: 1.75rem !important;
  max-width: 48rem;
  width: 100%;
}
body.home.kl-theme .entry-content .hero-actions,
.kl-reference-hero__actions { max-width: 38rem; }
body.home.kl-theme .entry-content .closing-actions,
.kl-page-flow #main-content .closing-actions,
.kl-consultation .wp-block-buttons { margin-inline: auto; }
body.home.kl-theme .entry-content :is(.hero-actions,.closing-actions) > .btn,
.kl-reference-hero__actions > .kl-reference-button,
.kl-page-flow #main-content .closing-actions > .btn,
.kl-consultation .wp-block-buttons > .wp-block-button,
.kl-page .wp-block-buttons > .wp-block-button { display: flex !important; margin: 0 !important; min-width: 0; width: 100% !important; }
.kl-consultation .wp-block-buttons > .wp-block-button > .wp-block-button__link,
.kl-page .wp-block-buttons > .wp-block-button > .wp-block-button__link { display: flex !important; width: 100% !important; }

/* Desktop composition: paired actions align to their content edge or center, never float at arbitrary widths. */
body.home.kl-theme .entry-content .hero-actions,
.kl-reference-hero__actions { justify-self: start; }
body.home.kl-theme .entry-content .closing-actions,
.kl-page-flow #main-content .closing-actions { justify-self: center; }

/* Mobile first: actions become vertical, full-width, and comfortably tappable. */
@media (max-width: 720px) {
  body.kl-theme { --kl-cta-height: 54px; --kl-cta-gap: 10px; }
  body.home.kl-theme .entry-content :is(.hero-actions,.closing-actions),
  .kl-reference-hero__actions,
  .kl-page-flow #main-content .closing-actions,
  .kl-consultation .wp-block-buttons,
  .kl-page .wp-block-buttons { grid-template-columns: minmax(0, 1fr) !important; margin-top: 1.4rem !important; max-width: none; }
  body.kl-theme :is(.kl-button,.wp-element-button,.wp-block-button__link,.btn,.kl-reference-button) { font-size: .9rem !important; padding-inline: 1rem !important; }
  .kl-reference-hero__actions > .kl-reference-button,
  body.home.kl-theme .entry-content :is(.hero-actions,.closing-actions) > .btn,
  .kl-page-flow #main-content .closing-actions > .btn { width: 100% !important; }
  .kl-reference-nav__links { padding-bottom: .15rem; }
}

/* The legacy static pages place their content in an internal #main-content
 * wrapper. Keep narrative sections on the reading measure, while allowing the
 * closing invitation to use the same full editorial width as the shared heroes. */
.kl-page-flow #main-content { max-width: none !important; width: 100% !important; }
.kl-page-flow #main-content > .closing,
.kl-page-flow #main-content section.closing {
  box-sizing: border-box;
  margin-inline: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
.kl-page-flow #main-content > .closing > .shell,
.kl-page-flow #main-content section.closing > .shell { margin-inline: auto; max-width: 56rem; width: 100%; }

/* Break the retained consultation invitation out of the old narrow narrative
 * column, then center it against the same editorial width used by shared
 * heroes. This keeps it intentional on desktop and bounded on small screens. */
.kl-page-flow #main-content > .closing,
.kl-page-flow #main-content section.closing {
  margin-left: 50% !important;
  margin-right: 0 !important;
  max-width: none !important;
  transform: translateX(-50%);
  width: min(calc(100vw - 2rem), 74rem) !important;
}
@media (max-width: 720px) {
  .kl-page-flow #main-content > .closing,
  .kl-page-flow #main-content section.closing {
    width: calc(100vw - 2rem) !important;
  }
}

/* ---------- v11 interaction refinement contract ----------
 * Preserve the lavender/plum editorial identity. Improve only material depth,
 * response, and disclosure clarity: no new palette, typeface, or rebranding. */

/* Header remains the same paper surface, but gains a gentle material layer when
 * it sits over content. The transparent treatment is disabled for users who
 * prefer reduced transparency. */
body.kl-theme :is(#header, header.ct-header, .ct-header [data-row], .kl-reference-nav),
body.home.kl-theme .entry-content .masthead {
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}

/* Every button answers immediately on touch/pointer down. The movement is
 * deliberately restrained—quiet confirmation rather than decorative motion. */
body.kl-theme :is(.kl-button,.wp-element-button,.wp-block-button__link,.btn,.kl-reference-button,.kl-reference-nav__cta,.ct-button,a.ct-button,.menu-toggle):active {
  transform: translateY(1px) scale(.98) !important;
  transition-duration: 100ms !important;
}

/* The retained homepage menu markup uses <i> bars while earlier rules styled
 * <span>. Support both and morph the same three strokes into a clear close
 * affordance whenever the existing aria state reports an open panel. */
body.home.kl-theme .entry-content .bars :is(i,span) {
  background: currentColor;
  display: block;
  height: 1px;
  transform-origin: center;
  transition: opacity 160ms var(--motion-standard), transform 180ms var(--motion-standard);
  width: 100%;
}
body.home.kl-theme .entry-content .menu-toggle[aria-expanded="true"] .bars :nth-child(1) { transform: translateY(4px) rotate(45deg); }
body.home.kl-theme .entry-content .menu-toggle[aria-expanded="true"] .bars :nth-child(2) { opacity: 0; }
body.home.kl-theme .entry-content .menu-toggle[aria-expanded="true"] .bars :nth-child(3) { transform: translateY(-4px) rotate(-45deg); }

/* Keep the working legacy FAQ controller, while tying visible disclosure to
 * its semantic aria state and class state instead of keyboard focus alone.
 * Grid-height animation creates a short, interruptible-looking reveal without
 * moving unrelated page content or introducing a new visual language. */
body.home.kl-theme .entry-content .faq-a {
  display: grid !important;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 260ms var(--motion-standard), opacity 150ms linear;
}
body.home.kl-theme .entry-content .faq-a-inner {
  min-height: 0;
  overflow: hidden;
  padding: 0 3rem 0 0;
  transform: translateY(-.25rem);
  transition: padding-bottom 260ms var(--motion-standard), transform 260ms var(--motion-standard);
}
body.home.kl-theme .entry-content .faq-item:is(.is-open,.open) .faq-a,
body.home.kl-theme .entry-content .faq-q[aria-expanded="true"] + .faq-a {
  grid-template-rows: 1fr;
  opacity: 1;
}
body.home.kl-theme .entry-content .faq-item:is(.is-open,.open) .faq-a-inner,
body.home.kl-theme .entry-content .faq-q[aria-expanded="true"] + .faq-a .faq-a-inner {
  padding-bottom: 1.65rem;
  transform: translateY(0);
}
body.home.kl-theme .entry-content .faq-item:is(.is-open,.open) .faq-q::after,
body.home.kl-theme .entry-content .faq-q[aria-expanded="true"]::after { content: "−"; }

@media (max-width: 720px) {
  body.home.kl-theme .entry-content .faq-a-inner { padding-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  body.home.kl-theme .entry-content .bars :is(i,span),
  body.home.kl-theme .entry-content .faq-a,
  body.home.kl-theme .entry-content .faq-a-inner { transition: none !important; }
}
@media (prefers-reduced-transparency: reduce) {
  body.kl-theme :is(#header, header.ct-header, .ct-header [data-row], .kl-reference-nav),
  body.home.kl-theme .entry-content .masthead {
    background: var(--color-paper) !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* ---------- v12 desktop composition and hierarchy correction ----------
 * Preserve the approved Vollkorn + Archivo pairing, lavender/plum palette,
 * and restrained editorial layout. Correct scale, centering, and image fit
 * only—no new visual language or content is introduced. */

/* The About portrait is no longer forced to cover its landscape picture frame.
 * It retains the complete source composition, centered within the established
 * lavender field, on both the static About hero and homepage About preview. */
.kl-reference-page--about .kl-reference-hero__visual {
  align-items: center;
  aspect-ratio: 1 / 1;
  min-height: 0;
  padding: clamp(1.5rem, 3vw, 2.7rem);
}
.kl-reference-page--about .kl-reference-hero__frame {
  aspect-ratio: 3 / 2;
  min-height: 0;
  padding: 0;
}
.kl-reference-page--about .kl-reference-hero__frame img {
  height: 100%;
  inset: auto;
  object-fit: contain;
  object-position: center;
  position: relative;
  width: 100%;
}
body.home.kl-theme .entry-content .about-photo {
  align-items: center;
  aspect-ratio: 1 / 1;
  display: grid;
  justify-items: center;
  min-height: 0;
  padding: clamp(1.35rem, 3vw, 2.8rem);
}
body.home.kl-theme .entry-content .about-photo img {
  aspect-ratio: 3 / 2;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  width: 100%;
}

/* Center the retained legacy consultation section against the viewport rather
 * than its former narrow narrative wrapper. Its inner reading measure and CTA
 * grid now share a deliberate, centered desktop axis. */
@media (min-width: 721px) {
  .kl-page-flow #main-content > .closing,
  .kl-page-flow #main-content section.closing {
    left: 50%;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 86rem !important;
    transform: translateX(-50%);
    width: min(calc(100vw - 6rem), 86rem) !important;
  }
  .kl-page-flow #main-content > .closing > .shell,
  .kl-page-flow #main-content section.closing > .shell {
    margin-inline: auto !important;
    max-width: 50rem !important;
  }
  .kl-page-flow #main-content .closing .closing-inner,
  .kl-page-flow #main-content .closing-actions {
    margin-inline: auto !important;
  }
  .kl-page-flow #main-content .closing-actions { max-width: 42rem !important; }
}

/* The Approach pathway remains a light, ruled editorial sequence, now with
 * a more deliberate marker scale and loop cue that can be read at desktop. */
@media (min-width: 721px) {
  .kl-reference-page--approach .approach-loop { max-width: 58rem; }
  .kl-reference-page--approach .loop-node {
    gap: 1.35rem;
    grid-template-columns: 4.65rem minmax(0, 1fr);
    padding: 1.6rem 0;
  }
  .kl-reference-page--approach .loop-dot {
    border-width: 1.5px;
    font-size: .76rem;
    height: 3.55rem !important;
    letter-spacing: .045em;
    width: 3.55rem !important;
  }
  .kl-reference-page--approach .loop-content h3 {
    font-size: clamp(1.34rem, 1.75vw, 1.65rem);
    line-height: 1.14;
  }
  .kl-reference-page--approach .loop-content p { font-size: 1.04rem; margin-top: .55rem; }
  .kl-reference-page--approach .loop-back {
    font-size: .88rem;
    gap: .95rem;
    padding: 1.35rem 0;
  }
  .kl-reference-page--approach .loop-back svg {
    height: 2.15rem !important;
    max-height: 2.15rem !important;
    max-width: 2.15rem !important;
    width: 2.15rem !important;
  }
}

/* Expand the title lock-up and menu to the scale of the supplied desktop
 * reference. The compact mobile breakpoint continues to manage its own space. */
@media (min-width: 1025px) {
  body.kl-theme .ct-header [data-row] { min-height: 86px; }
  body.kl-theme .ct-header .ct-header-text,
  body.kl-theme .ct-header .site-title,
  body.kl-theme .ct-header .site-title a { font-size: 1.14rem; }
  body.kl-theme .ct-header .site-description { font-size: .7rem; }
  body.kl-theme .ct-header [data-menu] > ul > li > a,
  body.kl-theme .ct-header .menu > li > a { font-size: .9rem; }
  body.kl-theme .ct-header :is(.ct-button,a.ct-button) {
    font-size: .84rem !important;
    min-height: 50px !important;
    padding-inline: 1.15rem !important;
  }

  .kl-reference-nav__inner {
    gap: clamp(1.9rem, 3vw, 3.3rem);
    grid-template-columns: minmax(220px, 1fr) auto auto;
    min-height: 88px;
  }
  .kl-reference-nav__brand { font-size: 1.18rem; }
  .kl-reference-nav__brand span { font-size: .68rem; letter-spacing: .15em; }
  .kl-reference-nav__links { gap: clamp(1rem, 1.7vw, 1.55rem); }
  .kl-reference-nav__links a { font-size: .91rem; }
  .kl-reference-nav__cta {
    font-size: .84rem !important;
    min-height: 50px !important;
    padding-inline: 1.2rem !important;
  }

  body.home.kl-theme .entry-content .masthead .shell {
    gap: clamp(1.8rem, 3vw, 3.3rem);
    grid-template-columns: minmax(220px, 1fr) auto auto;
    min-height: 88px;
  }
  body.home.kl-theme .entry-content .wordmark { font-size: 1.18rem; }
  body.home.kl-theme .entry-content .wordmark span { font-size: .68rem; }
  body.home.kl-theme .entry-content .masthead nav .nav-list { gap: clamp(1rem, 1.7vw, 1.55rem); }
  body.home.kl-theme .entry-content .masthead nav a { font-size: .9rem; }
  body.home.kl-theme .entry-content .header-actions .btn {
    font-size: .84rem !important;
    min-height: 50px !important;
    padding-inline: 1.15rem !important;
  }
}

@media (max-width: 720px) {
  .kl-reference-page--about .kl-reference-hero__visual,
  body.home.kl-theme .entry-content .about-photo { aspect-ratio: auto; padding: 1.25rem; }
  .kl-page-flow #main-content > .closing,
  .kl-page-flow #main-content section.closing {
    left: auto;
    margin-left: 0 !important;
    transform: none;
  }
}

/* The legacy closing markup sits inside a constrained page-flow wrapper. Give
 * its shell a genuine viewport-centered axis on desktop, then center the
 * readable measure and paired actions on that axis. */
@media (min-width: 721px) {
  .kl-page-flow #main-content > .closing > .shell,
  .kl-page-flow #main-content section.closing > .shell {
    left: calc(50vw - 50%);
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    position: relative;
    transform: none;
    width: 100vw !important;
  }
  .kl-page-flow #main-content .closing .closing-inner {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 50rem !important;
    width: min(calc(100vw - 8rem), 50rem) !important;
  }
  .kl-page-flow #main-content .closing-actions {
    margin-left: auto !important;
    margin-right: auto !important;
    width: min(calc(100vw - 8rem), 42rem) !important;
  }
}

/* ---------- v14 reference-led responsive grid contract ----------
 * The grid is structural, never decorative: preserve the calm homepage-led
 * asymmetry, type pairing, color system, and section compositions while giving
 * every shared template one explicit container, gutter, spacing, and prose rule. */
:root {
  --layout-container-wide: 75rem;
  --kl-grid-gutter: clamp(1.25rem, 4vw, 3rem);
  --kl-grid-gap: clamp(.75rem, 1.7vw, 1.5rem);
  --kl-space-related: clamp(1rem, 1.5vw, 1.5rem);
  --kl-space-group: clamp(2rem, 3.5vw, 3rem);
  --kl-space-section: clamp(4rem, 8vw, 7.5rem);
  --kl-prose-measure: 43rem;
}

/* One shared desktop container with 20px mobile, 24–32px tablet, and 32–48px
 * desktop breathing room. Existing custom homepage shells inherit this rhythm
 * without forcing a visible grid onto editorial content. */
.kl-shell,
.kl-page-shell,
body.kl-theme .ct-header .ct-container {
  max-width: var(--layout-container-wide);
  padding-inline: var(--kl-grid-gutter);
}

/* Keep the original split-page character but express it on a 12-column desktop
 * grid: six columns for narrative, one quiet interval, and five for the image.
 * Tablet and mobile retain the established single-column stacking behavior. */
@media (min-width: 1025px) {
  .kl-reference-hero__grid {
    column-gap: var(--kl-grid-gap);
    grid-template-columns: repeat(12, minmax(0, 1fr));
    row-gap: var(--kl-space-group);
  }
  .kl-reference-hero__copy { grid-column: 1 / span 6; max-width: 42rem; }
  .kl-reference-hero__visual { grid-column: 8 / span 5; }
}

/* Reading remains intentionally narrower than the broader visual framework:
 * 43rem is a calm 600–720px measure at the site’s base type scale. */
.kl-page-content > *,
.kl-page-flow > :not(#main-content),
.kl-page-flow #main-content > section:not(.page-hero):not(.closing):not(.consultation),
.kl-page-flow #main-content > div:not(.page-hero):not(.closing):not(.consultation),
.kl-article-reading > :not(.kl-article-signoff),
.kl-article-signoff {
  max-width: var(--kl-prose-measure);
}
.kl-reference-page .kl-page-content > .kl-page-flow > :is(section,div) {
  padding-block: var(--kl-space-group);
}
.kl-reference-page .kl-page-content p + p { margin-top: var(--kl-space-related); }

/* Shared list/card and archive rhythms use the same restrained token system;
 * editorial rules remain as purposeful separators rather than card chrome. */
.kl-writing-index .kl-post-grid { margin-top: var(--kl-space-group); }
.kl-post-card-body { padding: clamp(1.5rem, 2.6vw, 2.25rem); }
.kl-detail-ribbon__inner { column-gap: var(--kl-grid-gap); }

@media (min-width: 640px) and (max-width: 1024px) {
  :root { --kl-grid-gutter: clamp(1.5rem, 4vw, 2rem); --kl-grid-gap: clamp(1rem, 2vw, 1.25rem); }
}
@media (max-width: 639px) {
  :root { --kl-grid-gutter: 1.25rem; --kl-grid-gap: .75rem; --kl-space-group: 2rem; }
  .kl-page-flow #main-content > section:not(.page-hero):not(.closing):not(.consultation),
  .kl-page-flow #main-content > div:not(.page-hero):not(.closing):not(.consultation) { max-width: 100%; }
}

/* ---------- v18 footer reflection and crisis-support hierarchy ----------
 * The custom homepage footer remains a calm, darkest surface. One concise,
 * server-selected reflection is rendered per date: no client script, motion,
 * late layout shift, or cache-fragmenting randomization is required. */
body.home.kl-theme .entry-content .site-foot .crisis {
  border-left: 2px solid var(--color-lilac-line);
  font-family: var(--font-heading) !important;
  font-size: clamp(.9rem, 1.05vw, 1rem);
  letter-spacing: .005em;
  line-height: 1.78;
  margin-top: clamp(3.5rem, 6vw, 5rem);
  padding: clamp(1.35rem, 2.5vw, 1.75rem) clamp(1.2rem, 3vw, 1.75rem);
}
body.home.kl-theme .entry-content .site-foot .crisis strong {
  color: var(--color-white) !important;
  font-family: var(--font-heading) !important;
  font-size: .76em;
  font-weight: 700;
  letter-spacing: .095em;
  text-transform: uppercase;
}
body.home.kl-theme .entry-content .site-foot .foot-base {
  align-items: flex-start;
  gap: 1rem clamp(1.25rem, 3vw, 2.25rem);
  margin-top: clamp(2.5rem, 4vw, 3.5rem);
}
body.home.kl-theme .entry-content .site-foot .footer-reflection {
  display: grid;
  gap: .35rem;
  margin-left: auto;
  max-width: 34rem;
  text-align: right;
}
body.home.kl-theme .entry-content .site-foot .footer-reflection__quote {
  color: var(--color-on-plum-quote);
  font-family: var(--font-body);
  font-size: .94rem;
  font-style: italic;
  line-height: 1.48;
}
body.home.kl-theme .entry-content .site-foot .footer-reflection__author {
  color: var(--color-lilac-rule);
  font-family: var(--font-heading);
  font-size: .64rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: .095em;
  text-transform: uppercase;
}
@media (max-width: 720px) {
  body.home.kl-theme .entry-content .site-foot .crisis {
    margin-top: 3.25rem;
    padding: 1.25rem;
  }
  body.home.kl-theme .entry-content .site-foot .footer-reflection {
    margin-left: 0;
    max-width: 30rem;
    text-align: left;
  }
}

/* ---------- v19 shared navigation and footer repair ----------
 * Practice pages, Writing, and articles keep WordPress's head/footer hooks for
 * plugin compatibility while hiding only Blocksy's visible chrome. They render
 * the same deliberate route set and crisis footer as the homepage.
 */
body.kl-theme:not(.home) :is(#header, .ct-header) { display: none !important; }
body.kl-theme:not(.home) footer:not(.kl-shared-site-footer) { display: none !important; }

.kl-shared-site-footer {
  background: var(--color-plum-footer);
  color: var(--color-on-plum-text);
  padding-block: clamp(3.75rem, 6vw, 5.75rem) 1.5rem;
}
.kl-shared-site-footer .foot-grid { display: grid; gap: 2rem; grid-template-columns: 1.45fr .8fr .8fr; }
.kl-shared-site-footer .name { color: var(--color-white); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 600; letter-spacing: -.04em; margin: 0; }
.kl-shared-site-footer :is(p, li) { color: var(--color-on-plum-text); font-family: var(--font-body); font-size: .94rem; line-height: 1.65; }
.kl-shared-site-footer p { margin: .75rem 0 0; }
.kl-shared-site-footer h3 { color: var(--color-white); font-family: var(--font-heading); font-size: .7rem; font-weight: 600; letter-spacing: .13em; margin: 0; text-transform: uppercase; }
.kl-shared-site-footer ul { list-style: none; margin: .75rem 0 0; padding: 0; }
.kl-shared-site-footer li { margin: .55rem 0; }
.kl-shared-site-footer a { color: var(--color-white); text-decoration-color: rgba(255,255,255,.48); text-underline-offset: .18em; }
.kl-shared-site-footer a:hover { color: var(--color-lavender-highlight); text-decoration-color: var(--color-lavender-highlight); }
.kl-shared-site-footer .crisis {
  background: rgba(255,255,255,.07);
  border-left: 2px solid var(--color-lilac-line);
  color: var(--color-on-plum-highlight);
  font-family: var(--font-heading) !important;
  font-size: clamp(.9rem, 1.05vw, 1rem);
  letter-spacing: .005em;
  line-height: 1.78;
  margin-top: clamp(3.5rem, 6vw, 5rem);
  padding: clamp(1.35rem, 2.5vw, 1.75rem) clamp(1.2rem, 3vw, 1.75rem);
}
.kl-shared-site-footer .crisis strong { color: var(--color-white); font-family: var(--font-heading); font-size: .76em; font-weight: 700; letter-spacing: .095em; text-transform: uppercase; }
.kl-shared-site-footer .foot-base { align-items: flex-start; border-top: 1px solid rgba(255,255,255,.2); color: var(--color-on-plum-muted); display: flex; flex-wrap: wrap; font-family: var(--font-heading); font-size: .68rem; gap: 1rem clamp(1.25rem, 3vw, 2.25rem); justify-content: space-between; line-height: 1.5; margin-top: clamp(2.5rem, 4vw, 3.5rem); padding-top: 1.2rem; }
.kl-shared-site-footer .footer-reflection { display: grid; gap: .35rem; margin-left: auto; max-width: 34rem; text-align: right; }
.kl-shared-site-footer .footer-reflection__quote { color: var(--color-on-plum-quote); font-family: var(--font-body); font-size: .94rem; font-style: italic; line-height: 1.48; }
.kl-shared-site-footer .footer-reflection__author { color: var(--color-lilac-rule); font-family: var(--font-heading); font-size: .64rem; font-style: normal; font-weight: 600; letter-spacing: .095em; text-transform: uppercase; }
@media (max-width: 1024px) { .kl-shared-site-footer .foot-grid { grid-template-columns: 1.2fr 1fr; } }
@media (max-width: 720px) {
  .kl-shared-site-footer .foot-grid { grid-template-columns: 1fr; }
  .kl-shared-site-footer .crisis { margin-top: 3.25rem; padding: 1.25rem; }
  .kl-shared-site-footer .foot-base { align-items: flex-start; flex-direction: column; }
  .kl-shared-site-footer .footer-reflection { margin-left: 0; max-width: 30rem; text-align: left; }
}

/* ---------- v22 desktop alignment, paint-flow, and responsive-grid correction ----------
 * The former content-visibility rule reserved 920px placeholder bands in long
 * desktop renders. Keep resource/font/image improvements, but paint all
 * homepage sections normally so text and panels occupy their actual positions. */
body.home.kl-theme .entry-content :is(.areas, .approach, .about-prev, .creds, .blog, .faq, .safety, .closing, .site-foot) {
  contain-intrinsic-size: none;
  content-visibility: visible;
}

/* V27 DESKTOP CREDENTIAL RHYTHM: the six existing homepage credentials form
 * two balanced editorial rows of three cards. This targets only the editable
 * homepage legacy grid and leaves the established tablet/mobile stacks intact. */
@media (min-width: 1025px) {
  body.home.kl-theme .entry-content .cred-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  body.home.kl-theme .entry-content .cred-grid > .cred {
    grid-column: span 2;
  }
}

/* The source homepage’s approach markup contains two sibling editorial columns.
 * This explicit grid restores its heading/relationship column and bounded
 * clinical-copy column to the same shared desktop logic as recognition and FAQ. */
body.home.kl-theme .entry-content .approach-grid {
  align-items: start;
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
}

@media (min-width: 1025px) {
  body.home.kl-theme .entry-content .approach-grid { gap: clamp(3.5rem, 7vw, 7.5rem); }
  body.home.kl-theme .entry-content .approach-grid > :first-child { max-width: 27rem; }
  body.home.kl-theme .entry-content .approach-grid > :last-child { max-width: 48rem; padding-top: .2rem; }
  body.home.kl-theme .entry-content .about-grid > :last-child { max-width: 46rem; }
  body.home.kl-theme .entry-content .faq-grid .section-head { max-width: 28rem; }
  body.home.kl-theme .entry-content :is(.safety-box, .foot-grid) { align-items: start; }
}

/* V21's final desktop declaration occurs after the original mobile stack rule.
 * Restore the one-column reading flow whenever the desktop editorial grid is
 * not active, while retaining normal paint flow for every lower homepage band. */
@media (max-width: 1024px) {
  body.home.kl-theme .entry-content .approach-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------- v25 About consultation wide-layout repair ----------
 * The retained About-page `.closing` section lives in a narrow legacy flow.
 * Earlier desktop rules attempted to viewport-center its plum surface with a
 * translateX(-50%) while a later shell rule viewport-shifted its inner content.
 * At very wide screens those two coordinate systems diverged, creating an
 * oversized horizontal canvas and leaving light consultation text on paper.
 * Keep the approved plum panel, light type, and CTA system, but let the panel
 * and its content occupy one centered, bounded layout frame. */
@media (min-width: 721px) {
  .kl-reference-page--about .kl-page-flow #main-content > .closing,
  .kl-reference-page--about .kl-page-flow #main-content section.closing {
    box-sizing: border-box;
    left: auto !important;
    margin-inline: auto !important;
    max-width: var(--layout-container-wide) !important;
    position: relative;
    transform: none !important;
    width: 100% !important;
  }
  .kl-reference-page--about .kl-page-flow #main-content > .closing > .shell,
  .kl-reference-page--about .kl-page-flow #main-content section.closing > .shell {
    left: auto !important;
    margin-inline: auto !important;
    max-width: 50rem !important;
    position: static !important;
    transform: none !important;
    width: min(100%, 50rem) !important;
  }
  .kl-reference-page--about .kl-page-flow #main-content .closing .closing-inner,
  .kl-reference-page--about .kl-page-flow #main-content .closing-actions {
    margin-inline: auto !important;
    width: auto !important;
  }
}

/* ---------- v26 unified homepage footer and subpage overflow repair ----------
 * Every public route now uses the same `site-foot` information architecture and
 * darkest-plum visual contract. The existing custom helper keeps one footer per
 * non-home template, but its output shares the homepage's exact structural
 * classes and type rhythm rather than introducing a second footer language. */
body.kl-theme:not(.home) .kl-shared-site-footer {
  background: var(--color-plum-dark) !important;
  color: var(--color-on-plum-soft);
  padding-block: clamp(3.25rem, 6vw, 5rem) 1.5rem;
}
body.kl-theme:not(.home) .kl-shared-site-footer .foot-grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1.45fr .8fr .8fr;
}
body.kl-theme:not(.home) .kl-shared-site-footer .name {
  color: var(--color-white);
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -.04em;
  margin: 0;
}
body.kl-theme:not(.home) .kl-shared-site-footer p { color: var(--color-on-plum-soft); font-size: .94rem; margin: .75rem 0 0; }
body.kl-theme:not(.home) .kl-shared-site-footer h4 {
  color: var(--color-white);
  font-family: var(--font-heading);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .13em;
  margin: 0;
  text-transform: uppercase;
}
body.kl-theme:not(.home) .kl-shared-site-footer ul { list-style: none; margin: .75rem 0 0; padding: 0; }
body.kl-theme:not(.home) .kl-shared-site-footer li { margin: .55rem 0; }
body.kl-theme:not(.home) .kl-shared-site-footer a { color: var(--color-on-plum-link); text-decoration-color: rgba(232,223,240,.3); }
body.kl-theme:not(.home) .kl-shared-site-footer .crisis {
  background: rgba(255,255,255,.07);
  border-left: 2px solid var(--color-lilac-line);
  color: var(--color-on-plum-highlight);
  font-family: var(--font-heading) !important;
  font-size: clamp(.9rem, 1.05vw, 1rem);
  letter-spacing: .005em;
  line-height: 1.78;
  margin-top: clamp(3.5rem, 6vw, 5rem);
  padding: clamp(1.35rem, 2.5vw, 1.75rem) clamp(1.2rem, 3vw, 1.75rem);
}
body.kl-theme:not(.home) .kl-shared-site-footer .foot-base {
  align-items: flex-start;
  border-top: 1px solid rgba(255,255,255,.2);
  color: var(--color-footer-meta);
  display: flex;
  flex-wrap: wrap;
  font-family: var(--font-heading);
  font-size: .68rem;
  gap: .65rem 1rem;
  justify-content: space-between;
  margin-top: 2.2rem;
  padding-top: 1.2rem;
}
body.kl-theme:not(.home) .kl-shared-site-footer .footer-reflection { display: grid; gap: .35rem; margin-left: auto; max-width: 34rem; text-align: right; }
body.kl-theme:not(.home) .kl-shared-site-footer .footer-reflection__quote { color: var(--color-on-plum-quote); font-family: var(--font-body); font-size: .94rem; font-style: italic; line-height: 1.48; }
body.kl-theme:not(.home) .kl-shared-site-footer .footer-reflection__author { color: var(--color-lilac-rule); font-family: var(--font-heading); font-size: .64rem; font-style: normal; font-weight: 600; letter-spacing: .095em; text-transform: uppercase; }

/* About was repaired in v25. Apply that same normal-flow contract to the
 * remaining practice pages so a legacy `translateX(-50%)` and `100vw` shell
 * cannot widen Approach or Safety at ultra-wide desktop widths. */
@media (min-width: 721px) {
  .kl-reference-page .kl-page-flow #main-content > .closing,
  .kl-reference-page .kl-page-flow #main-content section.closing {
    box-sizing: border-box;
    left: auto !important;
    margin-inline: auto !important;
    max-width: var(--layout-container-wide) !important;
    position: relative;
    transform: none !important;
    width: 100% !important;
  }
  .kl-reference-page .kl-page-flow #main-content > .closing > .shell,
  .kl-reference-page .kl-page-flow #main-content section.closing > .shell {
    left: auto !important;
    margin-inline: auto !important;
    max-width: 50rem !important;
    position: static !important;
    transform: none !important;
    width: min(100%, 50rem) !important;
  }
  .kl-reference-page .kl-page-flow #main-content .closing .closing-inner,
  .kl-reference-page .kl-page-flow #main-content .closing-actions {
    margin-inline: auto !important;
    width: auto !important;
  }
}
.kl-reference-page :is(.kl-page-content, .kl-page-flow, #main-content) { max-inline-size: 100%; min-inline-size: 0; }
.kl-reference-page :is(img, iframe, video, svg) { max-inline-size: 100%; }
@media (max-width: 720px) {
  body.kl-theme:not(.home) .kl-shared-site-footer .foot-grid { grid-template-columns: 1fr; }
  body.kl-theme:not(.home) .kl-shared-site-footer .crisis { margin-top: 3.25rem; padding: 1.25rem; }
  body.kl-theme:not(.home) .kl-shared-site-footer .foot-base { align-items: flex-start; flex-direction: column; }
  body.kl-theme:not(.home) .kl-shared-site-footer .footer-reflection { margin-left: 0; max-width: 30rem; text-align: left; }
}

/* Final v26 footer parity: the custom helper deliberately retains its helper
 * class for one-footer counting, while its visual frame now resolves to the
 * homepage `site-foot` contract instead of a near-match. */
body.kl-theme:not(.home) .kl-shared-site-footer {
  padding-block: clamp(3.75rem, 6vw, 5.75rem) 1.5rem;
}
body.kl-theme:not(.home) .kl-shared-site-footer > .shell {
  margin-inline: auto;
  max-width: var(--layout-container);
  padding-inline: var(--space-gutter);
  width: 100%;
}
body.kl-theme:not(.home) .kl-shared-site-footer :is(p, li) {
  color: var(--color-on-plum-text);
  font-family: var(--font-body);
  line-height: 1.65;
}
body.kl-theme:not(.home) .kl-shared-site-footer h4 {
  color: var(--color-white);
  font-family: var(--font-heading);
  font-size: 25px;
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.08;
  margin: 0 0 17.5px;
  text-transform: none;
}
body.kl-theme:not(.home) .kl-shared-site-footer .foot-base {
  color: var(--color-on-plum-muted);
  gap: 1rem clamp(1.25rem, 3vw, 2.25rem);
  line-height: 1.5;
  margin-top: clamp(2.5rem, 4vw, 3.5rem);
}

/* V29 SEO semantic repair: retained editable practice-page display headings
 * are H2s because the shared hero already supplies the one page H1. Preserve
 * the former display rhythm without changing content or hierarchy below it. */
.kl-reference-page .kl-page-flow h2[data-split] {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.08;
  margin: 0 0 1.375rem;
}


/* V38 shared chrome: exact homepage masthead/mobile-panel markup on non-home routes.
 * Keep the established Vollkorn + Archivo hierarchy, lavender/plum palette, rounded
 * CTA geometry, and responsive spacing while leaving route-specific content alone. */
body:not(.home).kl-theme .masthead { background: rgba(251,250,252,.96); border-bottom: 1px solid var(--color-line); position: relative; z-index: 20; }
body:not(.home).kl-theme .masthead .shell { align-items: center; display: grid; gap: 1.5rem; grid-template-columns: minmax(178px, 1fr) auto auto; min-height: 76px; }
body:not(.home).kl-theme .masthead .wordmark { color: var(--color-ink); display: inline-flex; flex-direction: column; font-family: var(--font-heading); font-size: 1rem; font-weight: 600; letter-spacing: -.04em; line-height: 1.05; text-decoration: none; width: fit-content; }
body:not(.home).kl-theme .masthead .wordmark span { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .6rem; font-weight: 600; letter-spacing: .14em; margin-top: .28rem; text-transform: uppercase; }
body:not(.home).kl-theme .masthead nav .nav-list { align-items: center; display: flex; gap: clamp(.8rem, 1.8vw, 1.65rem); list-style: none; margin: 0; padding: 0; }
body:not(.home).kl-theme .masthead nav a { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .77rem; font-weight: 500; text-decoration: none; }
body:not(.home).kl-theme .masthead nav a:hover { color: var(--color-plum); }
body:not(.home).kl-theme .masthead .header-actions { align-items: center; display: flex; gap: .75rem; }
body:not(.home).kl-theme .masthead .header-actions .btn { min-height: 42px; padding: .7rem .88rem; white-space: nowrap; }
body:not(.home).kl-theme .masthead .menu-toggle { align-items: center; background: transparent; border: 1px solid var(--color-line-strong); border-radius: var(--radius-control); color: var(--color-ink); display: none; font-family: var(--font-heading); font-size: .72rem; gap: .55rem; min-height: 42px; padding: .6rem .75rem; }
body:not(.home).kl-theme .masthead .bars { display: grid; gap: 3px; width: 15px; }
body:not(.home).kl-theme .masthead .bars i { background: currentColor; display: block; height: 1px; width: 100%; }
body:not(.home).kl-theme .mobile-panel { background: var(--color-paper); border-bottom: 1px solid var(--color-line); display: none; padding: 1.2rem var(--space-gutter) 1.4rem; position: relative; z-index: 19; }
body:not(.home).kl-theme .mobile-panel.is-open { display: grid; gap: 1rem; }
body:not(.home).kl-theme .mobile-panel ul { list-style: none; margin: 0; padding: 0; }
body:not(.home).kl-theme .mobile-panel li { border-top: 1px solid var(--color-line); margin: 0; padding: .8rem 0; }
body:not(.home).kl-theme .mobile-panel a { color: var(--color-ink); font-family: var(--font-heading); font-size: .9rem; text-decoration: none; }
body:not(.home).kl-theme .mobile-panel .panel-meta { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .72rem; line-height: 1.45; margin: .2rem 0 0; }
body:not(.home).kl-theme .site-foot { background: var(--color-plum-dark); color: var(--color-on-plum-soft); padding-block: clamp(3.25rem,6vw,5rem) 1.5rem; }
body:not(.home).kl-theme .site-foot .foot-grid { display: grid; gap: 2rem; grid-template-columns: 1.45fr .8fr .8fr; }
body:not(.home).kl-theme .site-foot .name { color: var(--color-white); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 600; letter-spacing: -.04em; margin: 0; }
body:not(.home).kl-theme .site-foot p { color: var(--color-on-plum-soft); font-size: .94rem; margin: .75rem 0 0; }
body:not(.home).kl-theme .site-foot h3 { color: var(--color-white); font-family: var(--font-heading); font-size: .7rem; font-weight: 600; letter-spacing: .13em; margin: 0; text-transform: uppercase; }
body:not(.home).kl-theme .site-foot ul { list-style: none; margin: .75rem 0 0; padding: 0; }
body:not(.home).kl-theme .site-foot li { margin: .55rem 0; }
body:not(.home).kl-theme .site-foot a { color: var(--color-on-plum-link); text-decoration-color: rgba(232,223,240,.3); }
body:not(.home).kl-theme .site-foot a:hover { color: var(--color-white); text-decoration-color: var(--color-white); }
body:not(.home).kl-theme .site-foot .crisis { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.28); color: var(--color-on-plum-highlight); font-family: var(--font-heading); font-size: .78rem; line-height: 1.72; margin-top: 2rem; padding: 1.35rem 1.5rem; }
body:not(.home).kl-theme .site-foot .foot-base { border-top: 1px solid rgba(255,255,255,.2); color: var(--color-on-plum-muted); display: flex; flex-wrap: wrap; font-family: var(--font-heading); font-size: .68rem; gap: .65rem 1rem; justify-content: space-between; margin-top: 2.2rem; padding-top: 1.2rem; }
@media (max-width: 1024px) {
  body:not(.home).kl-theme .masthead .shell { grid-template-columns: 1fr auto; }
  body:not(.home).kl-theme .masthead nav { display: none; }
  body:not(.home).kl-theme .masthead .menu-toggle { display: inline-flex; }
  body:not(.home).kl-theme .masthead .header-actions .btn { display: none; }
  body:not(.home).kl-theme .site-foot .foot-grid { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 720px) {
  body:not(.home).kl-theme .masthead .shell { min-height: 68px; }
  body:not(.home).kl-theme .site-foot { padding-top: clamp(3.75rem, 6vw, 5.75rem); }
  body:not(.home).kl-theme .site-foot p,
  body:not(.home).kl-theme .site-foot li { color: var(--color-on-plum-text); line-height: 1.65; }
  body:not(.home).kl-theme .site-foot a { color: var(--color-white); text-decoration-color: rgba(255,255,255,.48); }
  body:not(.home).kl-theme .site-foot .crisis { margin-top: 2rem; }
}

/* V40 SINGLE SHARED CHROME CONTRACT
 * The homepage now renders the same PHP masthead, mobile panel, and footer as every
 * public route. These final selectors are intentionally route-neutral and override
 * earlier parallel page branches so layout, typography, responsive behavior, and
 * footer hierarchy have one source of truth. */
body.kl-theme .masthead {
  background: rgba(251,250,252,.96);
  border-bottom: 1px solid var(--color-line);
  position: relative;
  z-index: 20;
}
body.kl-theme .masthead .shell {
  align-items: center;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: minmax(178px, 1fr) auto auto;
  min-height: 76px;
}
body.kl-theme .masthead .wordmark {
  color: var(--color-ink);
  display: inline-flex;
  flex-direction: column;
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.04em;
  line-height: 1.05;
  text-decoration: none;
  width: fit-content;
}
body.kl-theme .masthead .wordmark span {
  color: var(--color-ink-soft);
  font-family: var(--font-heading);
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .14em;
  margin-top: .28rem;
  text-transform: uppercase;
}
body.kl-theme .masthead nav .nav-list {
  align-items: center;
  display: flex;
  gap: clamp(.8rem, 1.8vw, 1.65rem);
  list-style: none;
  margin: 0;
  padding: 0;
}
body.kl-theme .masthead nav a {
  color: var(--color-ink-soft);
  align-items: center;
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .77rem;
  font-weight: 500;
  min-height: 24px;
  text-decoration: none;
}
body.kl-theme .masthead nav a:hover { color: var(--color-plum); }
body.kl-theme .masthead .header-actions { align-items: center; display: flex; gap: .75rem; }
body.kl-theme .masthead .header-actions .btn { min-height: 42px; padding: .7rem .88rem; white-space: nowrap; }
body.kl-theme .masthead .menu-toggle {
  align-items: center;
  background: transparent;
  border: 1px solid var(--color-line-strong);
  border-radius: var(--radius-control);
  color: var(--color-ink);
  display: none;
  font-family: var(--font-heading);
  font-size: .72rem;
  gap: .55rem;
  min-height: 42px;
  padding: .6rem .75rem;
}
body.kl-theme .masthead .bars { display: grid; gap: 3px; width: 15px; }
body.kl-theme .masthead .bars i { background: currentColor; display: block; height: 1px; width: 100%; }
body.kl-theme .mobile-panel {
  background: var(--color-paper);
  border-bottom: 1px solid var(--color-line);
  display: none;
  padding: 1.2rem var(--space-gutter) 1.4rem;
  position: relative;
  z-index: 19;
}
body.kl-theme .mobile-panel.is-open,
body.kl-theme .mobile-panel.open { display: grid; gap: 1rem; }
body.kl-theme .mobile-panel ul { list-style: none; margin: 0; padding: 0; }
body.kl-theme .mobile-panel li { border-top: 1px solid var(--color-line); margin: 0; padding: .8rem 0; }
body.kl-theme .mobile-panel a { color: var(--color-ink); font-family: var(--font-heading); font-size: .9rem; text-decoration: none; }
body.kl-theme .mobile-panel .panel-meta { color: var(--color-ink-soft); font-family: var(--font-heading); font-size: .72rem; line-height: 1.45; margin: .2rem 0 0; }
body.kl-theme .site-foot,
body.kl-theme:not(.home) .site-foot {
  background: var(--color-plum-footer);
  color: var(--color-on-plum-soft);
  padding: clamp(3.75rem,6vw,5.75rem) 0 1.5rem;
}
body.kl-theme .site-foot .foot-grid,
body.kl-theme:not(.home) .site-foot .foot-grid { display: grid; gap: 2rem; grid-template-columns: 1.45fr .8fr .8fr; }
body.kl-theme .site-foot .name,
body.kl-theme:not(.home) .site-foot .name { color: var(--color-white); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 600; letter-spacing: -.04em; margin: 0; }
body.kl-theme .site-foot p,
body.kl-theme .site-foot li,
body.kl-theme:not(.home) .site-foot p,
body.kl-theme:not(.home) .site-foot li { color: var(--color-on-plum-text); line-height: 1.65; }
body.kl-theme .site-foot h3,
body.kl-theme:not(.home) .site-foot h3 { color: var(--color-white); font-family: var(--font-heading); font-size: .7rem; font-weight: 600; letter-spacing: .13em; margin: 0; text-transform: uppercase; }
body.kl-theme .site-foot ul,
body.kl-theme:not(.home) .site-foot ul { list-style: none; margin: .75rem 0 0; padding: 0; }
body.kl-theme .site-foot li,
body.kl-theme:not(.home) .site-foot li { margin: .55rem 0; }
body.kl-theme .site-foot a,
body.kl-theme:not(.home) .site-foot a { color: var(--color-white); text-decoration-color: rgba(255,255,255,.48); }
body.kl-theme .site-foot li a,
body.kl-theme:not(.home) .site-foot li a { align-items: center; display: inline-flex; min-height: 24px; }
body.kl-theme .site-foot .crisis,
body.kl-theme:not(.home) .site-foot .crisis {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.28);
  border-left: 2px solid var(--color-lilac-line);
  color: var(--color-on-plum-highlight);
  font-family: var(--font-heading);
  font-size: clamp(.9rem,1.05vw,1rem);
  letter-spacing: .005em;
  line-height: 1.78;
  margin-top: clamp(3.5rem,6vw,5rem);
  padding: clamp(1.35rem,2.5vw,1.75rem) clamp(1.2rem,3vw,1.75rem);
}
body.kl-theme .site-foot .crisis strong,
body.kl-theme:not(.home) .site-foot .crisis strong { color: var(--color-white); font-family: var(--font-heading); font-size: .76em; font-weight: 700; letter-spacing: .095em; text-transform: uppercase; }
body.kl-theme .site-foot .foot-base,
body.kl-theme:not(.home) .site-foot .foot-base { align-items: flex-start; border-top: 1px solid rgba(255,255,255,.2); color: var(--color-on-plum-muted); display: flex; flex-wrap: wrap; font-family: var(--font-heading); font-size: .68rem; gap: 1rem clamp(1.25rem,3vw,2.25rem); justify-content: space-between; line-height: 1.5; margin-top: clamp(2.5rem,4vw,3.5rem); padding-top: 1.2rem; }
body.kl-theme .site-foot .footer-reflection,
body.kl-theme:not(.home) .site-foot .footer-reflection { display: grid; gap: .35rem; margin-left: auto; max-width: 34rem; text-align: right; }
body.kl-theme .site-foot .footer-reflection__quote,
body.kl-theme:not(.home) .site-foot .footer-reflection__quote { color: var(--color-on-plum-quote); font-family: var(--font-body); font-size: .94rem; font-style: italic; line-height: 1.48; }
body.kl-theme .site-foot .footer-reflection__author,
body.kl-theme:not(.home) .site-foot .footer-reflection__author { color: var(--color-lilac-rule); font-family: var(--font-heading); font-size: .64rem; font-style: normal; font-weight: 600; letter-spacing: .095em; text-transform: uppercase; }
@media (max-width: 1024px) {
  body.kl-theme .masthead .shell { grid-template-columns: 1fr auto; }
  body.kl-theme .masthead nav { display: none; }
  body.kl-theme .masthead .menu-toggle { display: inline-flex; }
  body.kl-theme .masthead .header-actions .btn { display: none; }
  body.kl-theme .site-foot .foot-grid,
  body.kl-theme:not(.home) .site-foot .foot-grid { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 720px) {
  body.kl-theme .masthead .shell { min-height: 68px; }
  body.kl-theme .site-foot .foot-grid,
  body.kl-theme:not(.home) .site-foot .foot-grid { grid-template-columns: 1fr; }
  body.kl-theme .site-foot .crisis,
  body.kl-theme:not(.home) .site-foot .crisis { margin-top: 3.25rem; padding: 1.25rem; }
  body.kl-theme .site-foot .foot-base,
  body.kl-theme:not(.home) .site-foot .foot-base { align-items: flex-start; flex-direction: column; }
body.kl-theme .site-foot .footer-reflection,
body.kl-theme:not(.home) .site-foot .footer-reflection { margin-left: 0; max-width: 30rem; text-align: left; }
}

/* V43 REFERENCE-FIRST SHARED FOOTER RECOVERY
 * The screenshot’s dark-plum footer is the public-page source of truth. A legacy
 * non-home selector previously hid the existing shared footer after it rendered.
 * This terminal rule restores the exact same `site-foot` component on About,
 * Writing, static pages, and articles without introducing a parallel footer. */
body.kl-theme footer.site-foot:not(.kl-shared-site-footer) {
  display: block !important;
  visibility: visible;
}

/* V44 REFERENCE-CONSTRAINED EDITORIAL COMPOSITION
 * Design direction: restrained clinical-editorial composition. The original
 * homepage remains the visual authority: paper header, pale-lavender first
 * surface, a single ruled detail band, controlled white reading fields, full
 * plum invitation, and the darkest-plum shared footer. These rules remove the
 * separate non-home gradient and constrained closing-panel behavior without
 * creating a new page system or altering the shared masthead/footer renderer. */
body.kl-theme .kl-reference-page {
  background: var(--color-paper);
}

body.kl-theme .kl-reference-hero {
  background: var(--color-mist);
  border-bottom: 1px solid var(--color-line);
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
}
body.kl-theme .kl-reference-hero__grid {
  align-items: center;
  gap: clamp(2.5rem, 5vw, 4.75rem);
  grid-template-columns: minmax(0, 1.05fr) minmax(18rem, .72fr);
}
body.kl-theme .kl-reference-hero__copy {
  max-width: 38rem;
}
body.kl-theme .kl-reference-hero h1 {
  font-size: clamp(3rem, 5vw, 4.85rem);
  letter-spacing: -.06em;
  line-height: .99;
  max-width: 10.5ch;
}
body.kl-theme .kl-reference-hero__lede {
  max-width: 34rem;
}
body.kl-theme .kl-reference-hero__visual {
  justify-self: end;
  min-height: clamp(20rem, 28vw, 27rem);
  width: min(100%, 29rem);
}
body.kl-theme .kl-reference-hero__frame {
  aspect-ratio: 1 / .86;
  min-height: 0;
}
body.kl-theme .kl-detail-ribbon {
  background: var(--color-paper);
}
body.kl-theme .kl-detail-ribbon__inner {
  min-height: 60px;
}
body.kl-theme .kl-reference-page .kl-page-content,
body.kl-theme .kl-writing-index,
body.kl-theme .kl-article-reading {
  padding-block: clamp(3.75rem, 6vw, 5.75rem);
}
body.kl-theme .kl-page-flow #main-content > section:not(.page-hero),
body.kl-theme .kl-page-flow #main-content > div:not(.page-hero) {
  max-width: 48rem;
  padding-block: clamp(2.25rem, 4vw, 3.75rem);
}
body.kl-theme .kl-writing-index .kl-post-grid {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
}
/* The homepage consultation invitation is full-width plum; all retained static
 * page invitations now use that same clear end-of-page gesture. */
body.kl-theme .kl-page-flow #main-content > .closing,
body.kl-theme .kl-page-flow #main-content section.closing {
  margin-inline: calc(50% - 50vw) !important;
  max-width: 100vw !important;
  transform: none !important;
  width: 100vw !important;
}
body.kl-theme .kl-page-flow #main-content > .closing > .shell,
body.kl-theme .kl-page-flow #main-content section.closing > .shell {
  max-width: 56rem;
}
@media (max-width: 1024px) {
  body.kl-theme .kl-reference-hero__grid { grid-template-columns: 1fr; }
  body.kl-theme .kl-reference-hero__visual { justify-self: start; max-width: 31rem; width: 100%; }
}
@media (max-width: 720px) {
  body.kl-theme .kl-reference-hero { padding-block: 3rem; }
  body.kl-theme .kl-reference-hero__visual { min-height: 20rem; }
  body.kl-theme .kl-page-flow #main-content > .closing,
  body.kl-theme .kl-page-flow #main-content section.closing {
    margin-inline: calc(50% - 50vw) !important;
    width: 100vw !important;
  }
}

/* V46 SHARED CHROME GUTTER RECOVERY
 * The rendered shared masthead and footer keep their full-bleed surfaces, while
 * this direct-child rule restores the original quiet editorial inset for their
 * actual content. It deliberately uses the established container and gutter
 * tokens so desktop, tablet, and mobile share one responsive rhythm. Closing
 * invitation shells are excluded; they retain their separate content contract. */
body.kl-theme :is(header.masthead, footer.site-foot) > .shell {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: var(--layout-container);
  min-width: 0;
  padding-inline: var(--space-gutter);
  width: 100%;
}

/* V47 CONSULTATION ACTION CONTRACT
 * Consultation is the site-wide primary action. On paper and lavender surfaces,
 * it uses the exact hero-primary material: plum fill, white label, 52px height,
 * 12px rectangular control corners, and centered Archivo UI text. The existing
 * inverse treatment on a dark-plum callout remains intact for contrast. */
body.kl-theme :is(
  header.masthead .header-actions .btn-primary,
  .mobile-panel .btn-primary,
  .kl-reference-hero__actions .kl-consultation-action
) {
  align-items: center !important;
  background-color: var(--color-plum) !important;
  border: 1px solid var(--color-plum) !important;
  border-radius: var(--kl-cta-radius) !important;
  color: var(--color-white) !important;
  display: inline-flex !important;
  font-family: var(--font-heading) !important;
  font-size: .86rem !important;
  font-weight: 600 !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  min-height: var(--kl-cta-height) !important;
  padding: .88rem 1.3rem !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap;
}
body.kl-theme :is(
  header.masthead .header-actions .btn-primary,
  .mobile-panel .btn-primary,
  .kl-reference-hero__actions .kl-consultation-action
):hover {
  background-color: var(--color-plum-dark) !important;
  border-color: var(--color-plum-dark) !important;
  color: var(--color-white) !important;
}
body.kl-theme header.masthead .header-actions {
  align-items: center;
  justify-self: end;
}
body.kl-theme header.masthead .header-actions .btn-primary { margin: 0; }
@media (max-width: 1024px) {
  /* The filled action moves into the revealed mobile panel so the wordmark and
   * Menu control retain a calm, uncluttered line at compact widths. */
  body.kl-theme header.masthead .header-actions .btn-primary { display: none !important; }
  body.kl-theme .mobile-panel .btn-primary { width: 100%; }
}

/* V54 WRITING ARCHIVE HOMEPAGE-REFERENCE ALIGNMENT
 * Writing keeps its automatic WordPress loop, but inherits the home page's
 * slower first-screen cadence: paper field, generous split composition, one
 * quiet discovery action alongside the filled consultation action, then a
 * ruled handoff into a readable journal index. This is intentionally scoped to
 * the archive so static pages and single posts retain their own contracts. */
body.kl-theme .kl-reference-hero--writing {
  background: var(--color-paper);
  border-bottom: 0;
  padding-block: clamp(3.75rem, 6vw, 6.25rem) clamp(3rem, 4vw, 4.75rem);
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__grid {
  align-items: center;
  column-gap: clamp(3rem, 8vw, 8.25rem);
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__copy {
  max-width: 41rem;
}
body.kl-theme .kl-reference-hero--writing h1 {
  max-width: 12.5ch;
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__lede {
  max-width: 39rem;
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__visual {
  min-height: clamp(18rem, 25vw, 24rem);
  width: min(100%, 25rem);
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__frame--writing {
  aspect-ratio: 1 / 1;
  min-height: 0;
}
body.kl-theme .kl-reference-hero--writing .kl-reference-hero__actions {
  margin-top: clamp(1.8rem, 3vw, 2.5rem);
}
body.kl-theme .kl-reference-hero--writing .kl-reference-button--quiet {
  background: transparent !important;
  border-color: var(--color-plum) !important;
  color: var(--color-plum) !important;
}
body.kl-theme .kl-reference-hero--writing .kl-reference-button--quiet:hover {
  background: var(--color-lavender) !important;
  color: var(--color-plum-dark) !important;
}
body.kl-theme .kl-writing-archive .kl-detail-ribbon {
  border-bottom: 1px solid var(--color-line);
  border-top: 1px solid var(--color-line);
}
body.kl-theme .kl-writing-index {
  padding-block: clamp(4.5rem, 7vw, 7.25rem);
}
body.kl-theme .kl-writing-index__head {
  align-items: end;
  max-width: 61rem;
}
body.kl-theme .kl-writing-index__head > p {
  max-width: 20rem;
}
body.kl-theme .kl-writing-index .kl-post-grid {
  grid-template-columns: minmax(0, 1fr);
  margin-top: clamp(2rem, 4vw, 3.5rem);
}
body.kl-theme .kl-writing-index .kl-post-card {
  background: var(--color-paper);
}
body.kl-theme .kl-writing-index .kl-post-card-body {
  align-items: start;
  display: grid;
  gap: .3rem clamp(2rem, 5vw, 5.5rem);
  grid-template-columns: minmax(8.5rem, .42fr) minmax(0, 1fr);
  padding: clamp(2rem, 4vw, 3.5rem);
}
body.kl-theme .kl-writing-index .kl-post-meta {
  grid-column: 1;
  grid-row: 1;
  margin: .5rem 0 0;
}
body.kl-theme .kl-writing-index .kl-post-card h3 {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  max-width: 16ch;
}
body.kl-theme .kl-writing-index .kl-post-card-body > p:not(.kl-post-meta) {
  grid-column: 2;
  margin: .8rem 0 0;
  max-width: 44rem;
}
body.kl-theme .kl-writing-index .kl-post-card .kl-text-link {
  grid-column: 2;
  margin-top: .9rem;
  padding-top: 0;
}
@media (max-width: 1024px) {
  body.kl-theme .kl-reference-hero--writing .kl-reference-hero__visual {
    justify-self: start;
    max-width: 27rem;
    width: 100%;
  }
}
@media (max-width: 720px) {
  body.kl-theme .kl-reference-hero--writing {
    padding-block: 3rem;
  }
  body.kl-theme .kl-reference-hero--writing .kl-reference-hero__visual {
    min-height: 20rem;
  }
  body.kl-theme .kl-writing-index {
    padding-block: 3.75rem 4.5rem;
  }
  body.kl-theme .kl-writing-index .kl-post-card-body {
    display: block;
    padding: 1.65rem;
  }
  body.kl-theme .kl-writing-index .kl-post-meta { margin: 0 0 .8rem; }
  body.kl-theme .kl-writing-index .kl-post-card h3 { max-width: none; }
  body.kl-theme .kl-writing-index .kl-post-card-body > p:not(.kl-post-meta) { margin-top: .8rem; }
  body.kl-theme .kl-writing-index .kl-post-card .kl-text-link { display: inline-flex; margin-top: 1.25rem; }
}

/* V50 APPROACH THERAPY-ROOM PHOTO
 * The supplied room image occupies the existing lavender hero visual with a
 * slim editorial border, rather than remaining in the prior compact specimen
 * frame. The original layout, color field, and decorative linework remain. */
body.kl-theme .kl-reference-page--approach .kl-reference-hero__visual {
  align-items: stretch;
  padding: clamp(1rem, 2vw, 1.5rem);
}
body.kl-theme .kl-reference-page--approach .kl-reference-hero__frame {
  align-self: stretch;
  aspect-ratio: auto;
  min-height: 0;
  padding: 0;
}
body.kl-theme .kl-reference-page--approach .kl-reference-hero__frame img {
  display: block;
  height: 100% !important;
  max-width: none;
  object-position: 58% center;
  width: 100% !important;
}
@media (max-width: 720px) {
  body.kl-theme .kl-reference-page--approach .kl-reference-hero__frame img { object-position: center; }
}

/* V52 RETURN-TO-TOP
 * This is intentionally part of the footer's natural reading flow—not a fixed
 * overlay—so it cannot cover content, controls, or the crisis information. */
body.kl-theme .site-foot .site-return-top {
  align-items: center;
  border: 1px solid rgba(255,255,255,.42);
  color: var(--color-white) !important;
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .64rem;
  font-weight: 700;
  gap: .5rem;
  letter-spacing: .095em;
  line-height: 1;
  min-height: 38px;
  padding: .65rem .78rem;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}
body.kl-theme .site-foot .site-return-top:hover {
  background: rgba(255,255,255,.1);
  border-color: var(--color-white);
  color: var(--color-white) !important;
}
body.kl-theme .site-foot .site-return-top span { font-size: 1rem; line-height: 0; }
@media (max-width: 720px) {
  body.kl-theme .site-foot .site-return-top { min-height: 44px; padding-inline: .95rem; }
}

/* V55 HOMEPAGE-FIRST PAGE-SYSTEM CONVERGENCE
 * The public header/footer were already shared. This is the missing body-level
 * contract: Writing, static pages, and articles now use one PHP hero/ribbon
 * primitive whose material, grid, spacing, type hierarchy, button grammar,
 * and visual frame are taken directly from the approved homepage system.
 * Homepage content stays editable in WordPress; this layer deliberately does
 * not rebrand, alter URLs, or touch the native Writing loop. */
body.kl-theme .kl-editorial-page { background: var(--color-paper); }
body.kl-theme .kl-editorial-shell {
  margin-inline: auto;
  max-width: 1180px;
  padding-inline: var(--space-gutter);
}
body.kl-theme .kl-editorial-hero {
  background: var(--color-mist);
  padding-block: clamp(4.75rem, 8vw, 6.4rem) clamp(3.75rem, 6vw, 4.8rem);
}
body.kl-theme .kl-editorial-hero__grid {
  align-items: center;
  column-gap: clamp(2.5rem, 6vw, 5rem);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(18rem, .72fr);
}
body.kl-theme .kl-editorial-hero__copy { max-width: 38rem; }
body.kl-theme .kl-editorial-hero h1 {
  color: var(--color-ink);
  font-size: clamp(3.2rem, 5.4vw, 5.25rem);
  letter-spacing: -.06em;
  line-height: 1.08;
  margin: .55rem 0 0;
  max-width: 10.5ch;
}
body.kl-theme .kl-editorial-hero__lede {
  color: var(--color-ink-soft);
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.68;
  margin: 1.55rem 0 0;
  max-width: 34rem;
}
body.kl-theme .kl-editorial-hero__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.9rem;
}
body.kl-theme .kl-editorial-hero__actions .btn {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 52px;
}
body.kl-theme .kl-editorial-hero__visual {
  justify-self: end;
  width: min(100%, 20rem);
}
body.kl-theme .kl-editorial-hero__frame {
  align-items: flex-end;
  aspect-ratio: 1 / 1;
  background: var(--color-lavender-deep);
  display: flex;
  justify-content: flex-start;
  overflow: hidden;
  padding: clamp(1.35rem, 2.5vw, 2rem);
  position: relative;
}
body.kl-theme .kl-editorial-hero__frame::after {
  border: 1px solid rgba(79,53,111,.2);
  content: "";
  height: 42%;
  position: absolute;
  right: 1.4rem;
  top: 1.4rem;
  width: 38%;
}
body.kl-theme .kl-editorial-hero__frame p {
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.2vw, 2rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: 1.05;
  margin: 0;
  position: relative;
  text-align: left;
  z-index: 1;
}
body.kl-theme .kl-editorial-hero__mark {
  border: 1px solid rgba(79,53,111,.28);
  border-radius: 50%;
  height: 6.5rem;
  left: 46%;
  position: absolute;
  top: 45%;
  transform: translate(-42%, 42%);
  width: 6.5rem;
}
body.kl-theme .kl-editorial-hero__frame img {
  height: 100%;
  max-width: none;
  object-fit: cover;
  position: absolute;
  inset: 0;
  width: 100%;
}
body.kl-theme .kl-editorial-hero--has-image .kl-editorial-hero__frame { padding: 0; }
body.kl-theme .kl-editorial-hero--has-image .kl-editorial-hero__frame::after,
body.kl-theme .kl-editorial-hero--has-image .kl-editorial-hero__mark { display: none; }
body.kl-theme .kl-editorial-page--about .kl-editorial-hero__frame img { object-fit: contain; }
body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__frame { aspect-ratio: .7 / 1; }
body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__frame img { object-position: 58% center; }
body.kl-theme .kl-editorial-ribbon {
  background: var(--color-paper);
  border-block: 1px solid var(--color-line);
}
body.kl-theme .kl-editorial-ribbon__inner {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .7rem 1.45rem;
  justify-content: center;
  min-height: 60px;
  padding-block: .9rem;
}
body.kl-theme .kl-editorial-ribbon span {
  color: var(--color-ink-soft);
  font-family: var(--font-heading);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
body.kl-theme .kl-editorial-content,
body.kl-theme .kl-writing-index,
body.kl-theme .kl-article-reading { padding-block: clamp(4.25rem, 6vw, 6rem); }
body.kl-theme .kl-writing-index__head {
  align-items: end;
  display: flex;
  gap: 1.5rem 3rem;
  justify-content: space-between;
  max-width: 61rem;
}
body.kl-theme .kl-writing-index__head > p { color: var(--color-ink-soft); margin: 0; max-width: 20rem; }
body.kl-theme .kl-writing-index .kl-post-grid { grid-template-columns: minmax(0, 1fr); margin-top: clamp(2rem, 4vw, 3.5rem); }
body.kl-theme .kl-writing-index .kl-post-card { background: var(--color-paper); }
body.kl-theme .kl-writing-index .kl-post-card-body {
  align-items: start;
  display: grid;
  gap: .3rem clamp(2rem, 5vw, 5.5rem);
  grid-template-columns: minmax(8.5rem, .42fr) minmax(0, 1fr);
  padding: clamp(2rem, 4vw, 3.5rem);
}
body.kl-theme .kl-writing-index .kl-post-meta { grid-column: 1; grid-row: 1; margin: .5rem 0 0; }
body.kl-theme .kl-writing-index .kl-post-card h3 { grid-column: 2; grid-row: 1; margin: 0; max-width: 16ch; }
body.kl-theme .kl-writing-index .kl-post-card-body > p:not(.kl-post-meta) { grid-column: 2; margin: .8rem 0 0; max-width: 44rem; }
body.kl-theme .kl-writing-index .kl-post-card .kl-text-link { grid-column: 2; margin-top: .9rem; padding-top: 0; }
body.kl-theme .kl-article-reading { max-width: 52rem; }
@media (max-width: 1024px) {
  body.kl-theme .kl-editorial-hero__grid { grid-template-columns: 1fr; row-gap: 2.5rem; }
  body.kl-theme .kl-editorial-hero__visual { justify-self: start; width: min(100%, 21rem); }
}
@media (max-width: 720px) {
  body.kl-theme .kl-editorial-shell { padding-inline: 20px; }
  body.kl-theme .kl-editorial-hero { padding-block: 3.5rem 3rem; }
  body.kl-theme .kl-editorial-hero h1 { font-size: clamp(2.5rem, 12vw, 3.9rem); }
  body.kl-theme .kl-editorial-hero__actions { align-items: stretch; flex-direction: column; }
  body.kl-theme .kl-editorial-hero__actions .btn { width: 100%; }
  body.kl-theme .kl-editorial-hero__visual { min-height: 0; width: 100%; }
  body.kl-theme .kl-editorial-hero__frame { aspect-ratio: 1 / .82; }
  body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__frame { aspect-ratio: 1 / 1; }
  body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__frame img { object-position: center; }
  body.kl-theme .kl-editorial-ribbon__inner { align-items: flex-start; flex-direction: column; gap: .55rem; justify-content: flex-start; }
  body.kl-theme .kl-writing-index__head { align-items: flex-start; flex-direction: column; }
  body.kl-theme .kl-writing-index .kl-post-card-body { display: block; padding: 1.65rem; }
  body.kl-theme .kl-writing-index .kl-post-meta { margin: 0 0 .8rem; }
  body.kl-theme .kl-writing-index .kl-post-card h3 { max-width: none; }
  body.kl-theme .kl-writing-index .kl-post-card-body > p:not(.kl-post-meta) { margin-top: .8rem; }
  body.kl-theme .kl-writing-index .kl-post-card .kl-text-link { display: inline-flex; margin-top: 1.25rem; }
}

/* V56 CTA INHERITANCE REPAIR
 * The homepage supplies its action colors through home-scoped selectors. v55
 * correctly adopted the homepage geometry but revealed that those color rules
 * do not reach the shared non-home primitive. Make the original primary and
 * secondary button grammar explicit for every editorial hero. */
body.kl-theme .kl-editorial-hero__actions .btn.btn-primary {
  background-color: var(--color-plum) !important;
  border: 1px solid var(--color-plum) !important;
  color: var(--color-white) !important;
}
body.kl-theme .kl-editorial-hero__actions .btn.btn-primary:hover {
  background-color: var(--color-plum-dark) !important;
  border-color: var(--color-plum-dark) !important;
  color: var(--color-white) !important;
}
body.kl-theme .kl-editorial-hero__actions .btn.btn-secondary {
  background-color: transparent !important;
  border: 1px solid var(--color-plum) !important;
  color: var(--color-plum) !important;
}
body.kl-theme .kl-editorial-hero__actions .btn.btn-secondary:hover {
  background-color: var(--color-lavender) !important;
  border-color: var(--color-plum-dark) !important;
  color: var(--color-plum-dark) !important;
}

/* V57 WRITING ARCHIVE — HOMEPAGE WRITINGS FIDELITY
 * Design contract: Writing is the native WordPress archive rendered through
 * the homepage's existing blog / blog-head / post-grid visual language.
 * It deliberately removes the separate archive landing-page hero, Field Notes
 * tile, topic ribbon, paired hero actions, and bordered feature-card pattern.
 * Real posts remain dynamic; no illustrative homepage articles are fabricated. */
body.kl-theme .kl-writing-archive {
  background: var(--color-paper);
}
body.kl-theme .kl-writing-archive .kl-writing-notes {
  background: var(--color-paper);
  padding: var(--space-section) var(--space-gutter);
}
body.kl-theme .kl-writing-archive .blog-head {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  justify-content: space-between;
}
body.kl-theme .kl-writing-archive .blog-head h1 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.1rem, 3.7vw, 3.35rem);
  letter-spacing: -.055em;
  line-height: 1.02;
  margin: .75rem 0 0;
}
body.kl-theme .kl-writing-archive .blog-head .link-more {
  color: var(--color-plum);
  flex: 0 0 auto;
  font-family: var(--font-heading);
  font-size: .78rem;
  margin: 0 0 .35rem;
  text-decoration: none;
  text-underline-offset: 5px;
}
body.kl-theme .kl-writing-archive .blog-head .link-more:hover,
body.kl-theme .kl-writing-archive .post .link-more:hover {
  color: var(--color-plum-dark);
  text-decoration: underline;
}
body.kl-theme .kl-writing-archive .kl-writing-post-grid {
  background: var(--color-line);
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 2.25rem;
}
body.kl-theme .kl-writing-archive .kl-writing-post {
  background: var(--color-paper);
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 1.6rem;
}
body.kl-theme .kl-writing-archive .kl-writing-post .post-thumb {
  aspect-ratio: 16 / 10;
  background: var(--color-lavender);
  display: block;
  margin: -1.6rem -1.6rem 1.35rem;
  overflow: hidden;
}
body.kl-theme .kl-writing-archive .kl-writing-post .post-thumb img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}
body.kl-theme .kl-writing-archive .kl-writing-post .cat {
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .13em;
  margin: 0;
  text-transform: uppercase;
}
body.kl-theme .kl-writing-archive .kl-writing-post h2 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: 1.4rem;
  letter-spacing: -.04em;
  line-height: 1.08;
  margin: .7rem 0 0;
}
body.kl-theme .kl-writing-archive .kl-writing-post h2 a {
  color: inherit;
  text-decoration: none;
}
body.kl-theme .kl-writing-archive .kl-writing-post h2 a:hover { color: var(--color-plum); }
body.kl-theme .kl-writing-archive .kl-writing-post__excerpt {
  color: var(--color-ink-soft);
  font-family: var(--font-body);
  font-size: .95rem;
  line-height: 1.55;
  margin: .75rem 0 0;
}
body.kl-theme .kl-writing-archive .kl-writing-post .meta {
  color: var(--color-plum);
  font-family: var(--font-heading);
  font-size: .78rem;
  margin-top: auto;
  padding-top: 1.3rem;
  text-decoration: none;
  text-underline-offset: 5px;
}
body.kl-theme .kl-writing-archive .kl-writing-empty {
  background: var(--color-paper);
  grid-column: 1 / -1;
  padding: clamp(2rem, 4vw, 3.5rem);
}
body.kl-theme .kl-writing-archive .kl-writing-empty h2 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  margin: .75rem 0 0;
}
body.kl-theme .kl-writing-archive .kl-writing-empty p:not(.eyebrow) { color: var(--color-ink-soft); }
@media (max-width: 1024px) {
  body.kl-theme .kl-writing-archive .kl-writing-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  body.kl-theme .kl-writing-archive .kl-writing-notes { padding-block: clamp(3.75rem, 12vw, 5rem); }
  body.kl-theme .kl-writing-archive .blog-head { align-items: flex-start; flex-direction: column; }
  body.kl-theme .kl-writing-archive .blog-head .link-more { margin-bottom: 0; }
  body.kl-theme .kl-writing-archive .kl-writing-post-grid { grid-template-columns: 1fr; margin-top: 1.8rem; }
  body.kl-theme .kl-writing-archive .kl-writing-post { min-height: 0; }
}

/* V58 SINGLE-POST ARCHIVE STATE
 * The homepage reference presents three genuine entries. The live archive has
 * one real post, and its remaining visual slots must stay absent—not become a
 * large implied lavender article panel. Keep the genuine article at the same
 * proportional desktop column width and expand naturally only when responsive. */
body.kl-theme .kl-writing-archive .kl-writing-post-grid--single {
  grid-template-columns: minmax(0, 1fr);
  max-width: calc((100% - 2px) / 3);
}
@media (max-width: 1024px) {
  body.kl-theme .kl-writing-archive .kl-writing-post-grid--single { max-width: calc((100% - 1px) / 2); }
}
@media (max-width: 720px) {
  body.kl-theme .kl-writing-archive .kl-writing-post-grid--single { max-width: none; }
}

/* HOMEPAGE-FIRST APPROACH — v61
 * Preserve the current Approach copy while applying the homepage's editorial
 * rhythm: ruled modality cells, paper/lavender material changes, and a calm
 * framed use of the existing therapy-room image. */
body.kl-theme .kl-editorial-page--approach .kl-editorial-hero {
  background: var(--color-mist);
}
body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__visual {
  width: min(100%, 22rem);
}
body.kl-theme .kl-editorial-page--approach .kl-editorial-hero__frame {
  box-shadow: 14px 14px 0 rgba(79, 53, 111, .08);
}
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.loop-diagram {
  background: var(--color-mist);
  border-block: 1px solid var(--color-line);
  margin-inline: calc(50% - 50vw) !important;
  max-width: 100vw !important;
  padding-block: clamp(4.5rem, 8vw, 7rem);
  width: 100vw !important;
}
body.kl-theme .kl-editorial-page--approach .loop-diagram > .shell {
  max-width: 1180px;
}
body.kl-theme .kl-editorial-page--approach .loop-wrap {
  border-left: 1px solid var(--color-line);
  border-top: 1px solid var(--color-line);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.kl-theme .kl-editorial-page--approach .loop-node {
  align-items: start;
  border-bottom: 1px solid var(--color-line);
  border-right: 1px solid var(--color-line);
  display: grid;
  gap: 1.15rem;
  grid-template-columns: 2.55rem minmax(0, 1fr);
  padding: clamp(1.65rem, 3vw, 2.35rem);
}
body.kl-theme .kl-editorial-page--approach .loop-dot {
  align-items: center;
  background: var(--color-paper);
  border: 1px solid var(--color-lavender-deep);
  border-radius: 0;
  color: var(--color-plum);
  display: inline-flex;
  font-family: var(--font-heading);
  font-size: .64rem;
  font-weight: 700;
  height: 2.35rem !important;
  justify-content: center;
  letter-spacing: .08em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  width: 2.35rem !important;
}
body.kl-theme .kl-editorial-page--approach .loop-node h3 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  letter-spacing: -.045em;
  line-height: 1.08;
  margin: 0;
}
body.kl-theme .kl-editorial-page--approach .loop-node p {
  color: var(--color-ink-soft);
  line-height: 1.65;
  margin: .65rem 0 0;
}
body.kl-theme .kl-editorial-page--approach .loop-back {
  align-items: center;
  background: var(--color-paper);
  border-bottom: 1px solid var(--color-line);
  border-right: 1px solid var(--color-line);
  color: var(--color-plum);
  display: flex;
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 600;
  gap: .7rem;
  grid-column: 1 / -1;
  letter-spacing: .04em;
  padding: 1.15rem clamp(1.65rem, 3vw, 2.35rem);
}
body.kl-theme .kl-editorial-page--approach .loop-back svg { display: none !important; }
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.prose-section {
  background: var(--color-lavender);
  margin-inline: calc(50% - 50vw) !important;
  max-width: 100vw !important;
  padding-block: clamp(4.5rem, 8vw, 7rem);
  width: 100vw !important;
}
body.kl-theme .kl-editorial-page--approach .prose-section > .shell {
  align-items: start;
  display: grid;
  gap: clamp(2.5rem, 7vw, 7rem);
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  max-width: 1180px;
}
body.kl-theme .kl-editorial-page--approach .section-head h2 {
  color: var(--color-ink);
  font-size: clamp(2.35rem, 4.3vw, 4.25rem);
  letter-spacing: -.065em;
  line-height: 1.03;
  margin: .55rem 0 0;
}
body.kl-theme .kl-editorial-page--approach .recog-list {
  border-bottom: 1px solid rgba(79, 53, 111, .2);
  list-style: none;
  margin: 0;
  padding: 0;
}
body.kl-theme .kl-editorial-page--approach .recog-list li {
  border-top: 1px solid rgba(79, 53, 111, .2);
  color: var(--color-ink-soft);
  line-height: 1.65;
  margin: 0;
  padding: 1.15rem 0 1.15rem 2rem;
  position: relative;
}
body.kl-theme .kl-editorial-page--approach .recog-list li::before {
  color: var(--color-plum);
  content: counter(list-item, decimal-leading-zero);
  font-family: var(--font-heading);
  font-size: .66rem;
  font-weight: 700;
  left: 0;
  letter-spacing: .06em;
  position: absolute;
  top: 1.35rem;
}
body.home.kl-theme .entry-content .approach-grid {
  align-items: start;
}
body.home.kl-theme .entry-content .home-approach-image {
  background: var(--color-lavender-deep);
  border: 1px solid rgba(255,255,255,.28);
  margin: clamp(2rem, 4vw, 3.25rem) 0 0;
  max-width: min(100%, 20.5rem);
  padding: .8rem;
}
body.home.kl-theme .entry-content .home-approach-image img {
  aspect-ratio: 1.18 / 1;
  display: block;
  height: auto;
  object-fit: cover;
  object-position: 58% center;
  width: 100%;
}
@media (max-width: 720px) {
  body.kl-theme .kl-editorial-page--approach .loop-wrap { grid-template-columns: 1fr; }
  body.kl-theme .kl-editorial-page--approach .loop-node { grid-template-columns: 2.35rem minmax(0, 1fr); }
  body.kl-theme .kl-editorial-page--approach .loop-back { grid-column: auto; }
  body.kl-theme .kl-editorial-page--approach .prose-section > .shell { grid-template-columns: 1fr; }
  body.home.kl-theme .entry-content .home-approach-image { margin-inline: 0 auto; max-width: none; }
}

/* V62 STATIC-PAGE FULL-BLEED SAFETY
 * Static page sections are nested inside an editorial content shell. Anchor
 * full-bleed sections from the shell midpoint, not a percentage margin that
 * can resolve against a prior layout context and push the closing panel past
 * the right viewport edge. */
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > :is(.loop-diagram, .prose-section, .closing) {
  box-sizing: border-box;
  left: 50%;
  margin-inline: 0 !important;
  max-width: none !important;
  position: relative;
  right: auto;
  transform: translateX(-50%) !important;
  width: 100vw !important;
}
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > .closing > .shell,
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content section.closing > .shell {
  box-sizing: border-box;
  margin-inline: auto !important;
  max-width: 1180px !important;
  padding-inline: var(--space-gutter);
  width: 100% !important;
}

/* HOMEPAGE-FIRST APPROACH COMPOSITION — v63
 * The existing Approach content remains WordPress-authored. These structural
 * wrappers turn the inherited loop and prose classes into complete editorial
 * sections: a clear paper skills field, a balanced card grid, and a measured
 * lavender reading panel that mirrors the homepage's density and rhythm. */
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.loop-diagram {
  background: var(--color-paper);
  border-block: 0;
  padding-block: clamp(5rem, 9vw, 8.5rem);
}
body.kl-theme .kl-editorial-page--approach .loop-diagram > .shell {
  max-width: 1180px;
  padding-inline: var(--space-gutter);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-section-head {
  align-items: end;
  border-bottom: 1px solid var(--color-line);
  display: grid;
  gap: 1.5rem;
  grid-template-columns: minmax(0, .66fr) minmax(16rem, 1.34fr);
  margin-bottom: clamp(2.1rem, 4vw, 3.6rem);
  padding-bottom: 1.35rem;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-section-head .eyebrow {
  color: var(--color-plum);
  margin: 0;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-section-head h2 {
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.1rem, 4vw, 4rem);
  font-weight: 500;
  letter-spacing: -.06em;
  line-height: 1.02;
  margin: 0;
  max-width: 18ch;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill-grid {
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill {
  background: var(--color-paper);
  border: 0;
  border-bottom: 1px solid var(--color-line);
  border-right: 1px solid var(--color-line);
  gap: 1.25rem;
  min-height: clamp(13.5rem, 19vw, 16.5rem);
  padding: clamp(1.8rem, 3.2vw, 3rem);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill:nth-child(2n) { border-right: 0; }
body.kl-theme .kl-editorial-page--approach .kl-approach-skill:nth-child(n+3) { border-bottom: 0; }
body.kl-theme .kl-editorial-page--approach .kl-approach-skill .loop-dot {
  background: var(--color-lavender);
  border-color: var(--color-plum);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill h3 {
  font-size: clamp(1.5rem, 2.3vw, 2.05rem);
  max-width: 17ch;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill p {
  font-size: 1.01rem;
  max-width: 37ch;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-skill-note {
  background: var(--color-lavender);
  border: 0;
  border-top: 1px solid var(--color-line);
  color: var(--color-plum);
  font-size: .72rem;
  grid-column: 1 / -1;
  justify-content: flex-end;
  min-height: 0;
  padding: 1.1rem clamp(1.8rem, 3.2vw, 3rem);
}
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.kl-approach-reading {
  background: var(--color-lavender);
  border-block: 1px solid rgba(79,53,111,.16);
  padding-block: clamp(5rem, 9vw, 8.5rem);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-reading > .shell {
  align-items: start;
  display: grid;
  gap: clamp(2.75rem, 8vw, 8.5rem);
  grid-template-columns: minmax(15rem, .72fr) minmax(0, 1.28fr);
  max-width: 1180px;
  padding-inline: var(--space-gutter);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-reading__head {
  border-top: 1px solid rgba(79,53,111,.24);
  padding-top: 1.3rem;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-reading__head h2 {
  font-size: clamp(2.3rem, 4.1vw, 4.15rem);
  max-width: 11ch;
}
body.kl-theme .kl-editorial-page--approach .kl-approach-reading__list {
  background: rgba(255,255,255,.36);
  border: 1px solid rgba(79,53,111,.2);
  padding-inline: clamp(1.45rem, 3vw, 2.5rem);
}
body.kl-theme .kl-editorial-page--approach .kl-approach-reading__list li {
  padding-block: clamp(1.2rem, 2vw, 1.65rem);
}
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > .closing { margin-top: 0 !important; }
@media (max-width: 720px) {
  body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.loop-diagram,
  body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.kl-approach-reading { padding-block: 4rem; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-section-head,
  body.kl-theme .kl-editorial-page--approach .kl-approach-reading > .shell { grid-template-columns: 1fr; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-section-head { gap: .8rem; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-skill-grid { grid-template-columns: 1fr; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-skill,
  body.kl-theme .kl-editorial-page--approach .kl-approach-skill:nth-child(2n) { border-bottom: 1px solid var(--color-line); border-right: 0; min-height: 0; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-skill-note { grid-column: auto; justify-content: flex-start; }
  body.kl-theme .kl-editorial-page--approach .kl-approach-reading__head h2 { max-width: 14ch; }
}

/* V65 APPROACH ALIGNMENT — preserve the homepage-led full-bleed composition,
 * but override an older equally specific nested margin rule that was clipping
 * the left-hand skills label and modality badges. */
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.loop-diagram,
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.kl-approach-reading,
body.kl-theme .kl-editorial-page--approach .kl-page-flow #main-content > section.closing {
  margin-inline: 0 !important;
}

/* V68 STATIC-PAGE CLOSING SAFETY
 * About and Safety still inherit a legacy translated closing panel that starts
 * from an internal reading column. Anchor the invitation at that shell's
 * midpoint, as the homepage-led Approach repair does, so the plum section is
 * truly viewport-wide without creating an extra horizontal document canvas. */
body.kl-theme .kl-page-flow #main-content > :is(.closing, section.closing) {
  box-sizing: border-box;
  left: 50%;
  margin-inline: 0 !important;
  max-width: none !important;
  position: relative;
  right: auto;
  transform: translateX(-50%) !important;
  width: 100vw !important;
}
body.kl-theme .kl-page-flow #main-content > .closing > .shell,
body.kl-theme .kl-page-flow #main-content section.closing > .shell {
  box-sizing: border-box;
  margin-inline: auto !important;
  max-width: 1180px !important;
  padding-inline: var(--space-gutter);
  width: 100% !important;
}

/* V69 HOMEPAGE CONTENT-RAIL CONTRACT
 * Design philosophy for every public theme page: the homepage's 1180px
 * editorial rail, paper/lavender/plum material sequence, and generous outer
 * gutter are the shared authority. Page content must never calculate its own
 * horizontal origin from a nested legacy column. Standard page sections,
 * explicit WordPress shells, full-bleed interiors, and future theme-page
 * closing panels all resolve from the same centered rail.
 *
 * The reading measure stays intentional inside that rail; it does not turn
 * narrative copy into a wide text wall. This preserves Vollkorn’s editorial
 * cadence while Archivo headings and the shared chrome retain their compact
 * structural role. */
body.kl-theme {
  --kl-home-rail: 1180px;
  --kl-home-gutter: clamp(1.25rem, 3.8vw, 3rem);
  --kl-home-reading-measure: 46rem;
}
body.kl-theme .kl-editorial-shell,
body.kl-theme .kl-page-flow #main-content > :is(section, div) > .shell,
body.kl-theme .kl-page-flow #main-content > :is(section, div) > .kl-editorial-shell {
  box-sizing: border-box;
  margin-inline: auto !important;
  max-width: var(--kl-home-rail) !important;
  padding-inline: var(--kl-home-gutter);
  width: 100% !important;
}
/* Standard WordPress blocks that do not provide a shell still inherit the
 * homepage rail. Their direct text remains on a calm, editorial measure. */
body.kl-theme .kl-page-flow #main-content > :is(section, div):not(.page-hero):not(.loop-diagram):not(.prose-section):not(.closing):not(.consultation) {
  box-sizing: border-box;
  margin-inline: auto !important;
  max-width: var(--kl-home-rail) !important;
  padding-inline: var(--kl-home-gutter);
  width: 100% !important;
}
body.kl-theme .kl-page-flow #main-content > :is(section, div):not(.page-hero):not(.loop-diagram):not(.prose-section):not(.closing):not(.consultation) > :is(h2, h3, p, ul, ol, blockquote) {
  max-width: var(--kl-home-reading-measure);
}
/* Full-bleed page surfaces retain their intended material but center their
 * interiors on the exact same rail as the editorial hero and shared footer. */
body.kl-theme .kl-page-flow #main-content > :is(.loop-diagram, .prose-section, .consultation, .closing) > .shell {
  box-sizing: border-box;
  margin-inline: auto !important;
  max-width: var(--kl-home-rail) !important;
  padding-inline: var(--kl-home-gutter);
  width: 100% !important;
}
/* Approach is the proof case: its skills field and reading panel begin from
 * the same inner rail as its hero, while retaining their deliberate columns. */
body.kl-theme .kl-editorial-page--approach .loop-diagram > .shell,
body.kl-theme .kl-editorial-page--approach .kl-approach-reading > .shell {
  margin-inline: auto !important;
  max-width: var(--kl-home-rail) !important;
  padding-inline: var(--kl-home-gutter);
  width: 100% !important;
}
@media (max-width: 720px) {
  body.kl-theme { --kl-home-gutter: 20px; }
  body.kl-theme .kl-editorial-shell,
  body.kl-theme .kl-page-flow #main-content > :is(section, div) > .shell,
  body.kl-theme .kl-page-flow #main-content > :is(section, div) > .kl-editorial-shell,
  body.kl-theme .kl-page-flow #main-content > :is(section, div):not(.page-hero):not(.loop-diagram):not(.prose-section):not(.closing):not(.consultation),
  body.kl-theme .kl-page-flow #main-content > :is(.loop-diagram, .prose-section, .consultation, .closing) > .shell {
    padding-inline: var(--kl-home-gutter);
  }
}

/* v69.1 — scrollbar-safe viewport.
   Subpage full-bleed sections size with 100vw, which includes the scrollbar and
   pushed them ~7px past the viewport, producing horizontal scroll on every
   subpage at both desktop and phone widths. Clip (not hidden) avoids creating a
   scroll container, so sticky/anchored behaviour is unaffected. */
html {
  overflow-x: clip;
}

@supports not (overflow-x: clip) {
  html {
    overflow-x: hidden;
  }
}

/* ===== v69.2 layout corrections =====
   The surrounding sheet sets these with !important, so these corrections must
   match that specificity to land. */

/* 1. Approach skill labels: the swatch was a fixed square, so "Somatic" (47px of
   text) spilled outside it while the 3-letter labels fitted. Let the chip grow
   to its content, keeping the square minimum for CBT / DBT / ACT. */
/* 1a. The row is a fixed two-column grid, so a wider chip overflowed its track
   and collided with the heading. Let the label column size to its chip. */
body.kl-theme .kl-editorial-page--approach .loop-node {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

body.kl-theme .kl-editorial-page--approach .loop-node > .loop-dot {
  width: max-content !important;
  min-width: 2.35rem !important;
  flex: 0 0 auto !important;
  padding-inline: 0.55rem !important;
  box-sizing: border-box !important;
}

@media (min-width: 721px) {
  body.kl-theme .kl-editorial-page--approach .loop-node > .loop-dot {
    min-width: 3.55rem !important;
  }
}

/* 2. Approach section head: align-items:end bottom-aligned the eyebrow against a
   three-line heading, dropping it well below the heading it labels. */
body.kl-theme .kl-editorial-page--approach .kl-approach-section-head {
  align-items: start !important;
}

/* 3. Closing CTA: the action row is a fixed two-column grid built for two
   buttons, so a single button sat in the left track and read as misaligned
   inside otherwise centred copy. auto-fit collapses the empty track, leaving
   two-button closings untouched. */
body.kl-theme .kl-page-flow #main-content .closing-actions {
  grid-template-columns: repeat(auto-fit, minmax(0, 20.625rem)) !important;
  justify-content: center !important;
}

/* 4. Editorial hero portrait: object-fit:contain left a hairline of the frame
   surface showing along the edges of the near-square source image. */
body.kl-theme .kl-editorial-hero__frame > img {
  object-fit: cover !important;
}

/* 5. Homepage About portrait: the panel is a 1:1 square, but the image carried
   aspect-ratio 3/2 with object-fit:contain, so a near-square portrait was
   letterboxed into a landscape box and floated with 45px side gaps against
   97px top and bottom. Fill the padded square instead, matching the other
   framed images on the page. */
body.kl-theme .about-photo > img {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* ===== v69.3 — Writings archive brought into the site layout =====
   body.blog was the only context receiving gutter padding on the body itself,
   which inset the header, main and footer by one gutter (so the masthead no
   longer aligned with the content beneath it) and stacked a second gutter on
   top of .shell's own. The archive's .shell also fell outside the scoped
   container rules, so it computed max-width:none and never took the shared
   1180px measure — leaving content hard left with the right side empty. */
body.blog.kl-theme {
  padding: 0 !important;
}

body.blog.kl-theme .kl-editorial-page .shell {
  width: 100%;
  max-width: var(--layout-container);
  margin-inline: auto;
  padding-inline: var(--space-gutter);
}

/* The post card's media slot is an empty div when a post has no featured
   image, rendering as a large blank panel. :empty collapses it now and lets
   it return automatically once a post has an image. */
body.blog.kl-theme .kl-writing-post .post-thumb:empty {
  display: none;
}

/* ===== v69.4 — Article hero: news-style image above the headline =====
   The shared editorial hero puts its visual in a fixed square frame beside
   the copy, which suits About and Approach but crops a 16:9 article cover
   and buries it next to the title. For the --article variant only, stack the
   visual above the copy at full width and let the headline use the wider
   measure it now has. */
body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: clamp(1.5rem, 3vw, 2.25rem) !important;
  align-items: start !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__visual {
  order: -1 !important;
  width: 100% !important;
  max-width: none !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__frame {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  /* Banner, not a full-bleed square: cap the height so the headline stays
     above the fold on a laptop and a phone. */
  max-height: clamp(170px, 34vh, 360px) !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__frame > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__copy {
  max-width: none !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__copy h1 {
  max-width: 22ch !important;
  font-size: clamp(2.1rem, 4.4vw, 3.6rem) !important;
}

body.kl-theme .kl-editorial-hero--article .kl-editorial-hero__lede {
  max-width: 62ch !important;
}


/* ============================================================
   v70.1 — Modality hover / tap cards (home page approach list)
   ============================================================ */
.kl-theme ul.kl-modalities {
	list-style: none;
	margin: 1.4rem 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	position: relative;
}
.kl-theme .kl-modality { position: relative; margin: 0; padding: 0; }
.kl-theme .kl-modality__trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: 'Archivo', system-ui, sans-serif;
	font-size: 0.76rem;
	font-weight: 600;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--color-plum, #4f356f);
	background: var(--color-lavender, #ece6f5);
	border: 1px solid var(--color-lavender-deep, #ded2ec);
	border-radius: 999px;
	padding: 0.5rem 0.95rem;
	cursor: pointer;
	text-align: left;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
.kl-theme .kl-modality__trigger:hover,
.kl-theme .kl-modality.is-open .kl-modality__trigger {
	background: var(--color-plum, #4f356f);
	color: #fbfafc;
	border-color: var(--color-plum, #4f356f);
}
.kl-theme .kl-modality__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.15em;
	height: 1.15em;
	flex: 0 0 auto;
	border: 1px solid currentColor;
	border-radius: 50%;
	font-size: 0.62rem;
	line-height: 1;
	letter-spacing: 0;
	opacity: 0.7;
}
.kl-theme .kl-modality__card {
	position: absolute;
	left: 0;
	top: calc(100% + 0.55rem);
	z-index: 45;
	width: min(23rem, calc(100vw - 2.5rem));
	display: block;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	background: #fbfafc;
	color: #2e2735;
	border: 1px solid var(--color-lavender-deep, #ded2ec);
	border-radius: var(--radius-control, 0.75rem);
	box-shadow: 0 20px 44px -24px rgba(56, 35, 79, 0.6);
	padding: 1rem 1.1rem;
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	font-family: 'Vollkorn', Georgia, serif;
	font-size: 0.95rem;
	line-height: 1.55;
	transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
.kl-theme .kl-modality:hover .kl-modality__card,
.kl-theme .kl-modality:focus-within .kl-modality__card,
.kl-theme .kl-modality.is-open .kl-modality__card {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.kl-theme .kl-modality__name {
	display: block;
	font-family: 'Archivo', system-ui, sans-serif;
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-plum, #4f356f);
	margin-bottom: 0.45rem;
}
.kl-theme .kl-modality__meaning { display: block; }
.kl-theme .kl-modality__path {
	display: block;
	margin-top: 0.7rem;
	padding-top: 0.7rem;
	border-top: 1px solid var(--color-lavender, #ece6f5);
	font-size: 0.9rem;
	color: #564d5d;
}
.kl-theme .kl-modality__path em {
	display: block;
	margin-bottom: 0.25rem;
	font-style: normal;
	font-family: 'Archivo', system-ui, sans-serif;
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-plum, #4f356f);
}
@media (max-width: 720px) {
	.kl-theme .kl-modality { position: static; }
	.kl-theme .kl-modality__card { left: 0; right: 0; width: auto; }
}

/* ============================================================
   v70.2 — Detail ribbon as a dark pill band
   ============================================================ */
.kl-theme .kl-editorial-ribbon {
	background: var(--color-plum-dark, #38234f) !important;
	border: 0 !important;
	color: #f4f1f8 !important;
}
.kl-theme .kl-editorial-ribbon__inner {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0.55rem !important;
	padding-top: 1.15rem !important;
	padding-bottom: 1.15rem !important;
}
.kl-theme .kl-editorial-ribbon__inner > span {
	display: inline-flex;
	align-items: center;
	background: rgba(255, 255, 255, 0.09);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 999px;
	padding: 0.45rem 0.9rem;
	color: #f4f1f8 !important;
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
@media (max-width: 640px) {
	.kl-theme .kl-editorial-ribbon__inner {
		justify-content: flex-start;
		gap: 0.4rem !important;
	}
	.kl-theme .kl-editorial-ribbon__inner > span {
		font-size: 0.62rem;
		padding: 0.38rem 0.7rem;
	}
}

/* ============================================================
   v70.3 — Centred action rows
   ============================================================ */
.kl-theme .closing-actions,
.kl-theme .hero-actions {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 1rem 1.75rem !important;
}
.kl-theme .closing-actions > *,
.kl-theme .hero-actions > * {
	width: auto !important;
	max-width: 100%;
}
@media (max-width: 520px) {
	.kl-theme .closing-actions {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}
	.kl-theme .closing-actions > * { width: 100% !important; }
}

/* ============================================================
   v70.4 — Navigation, focus and motion
   ============================================================ */
html { scroll-behavior: smooth; }
.kl-theme [id] { scroll-margin-top: 6.5rem; }

.kl-theme .masthead {
	position: sticky;
	top: 0;
	background: var(--color-paper, #fbfafc);
	transition: box-shadow 0.25s ease;
}
.kl-theme.admin-bar .masthead { top: 32px; }
@media (max-width: 782px) {
	.kl-theme.admin-bar .masthead { top: 46px; }
}
html.kl-scrolled .kl-theme .masthead {
	box-shadow: 0 12px 32px -26px rgba(56, 35, 79, 0.75);
}

.kl-theme .masthead nav a[aria-current="page"] {
	position: relative;
	color: var(--color-plum, #4f356f);
}
.kl-theme .masthead nav a[aria-current="page"]::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -0.4rem;
	height: 2px;
	border-radius: 2px;
	background: var(--color-plum, #4f356f);
}

.kl-theme a:focus-visible,
.kl-theme button:focus-visible,
.kl-theme [tabindex]:focus-visible {
	outline: 2px solid var(--color-plum, #4f356f);
	outline-offset: 3px;
	border-radius: 0.35rem;
}

.kl-theme .kl-to-top {
	position: fixed;
	right: clamp(1rem, 3vw, 2rem);
	bottom: clamp(1rem, 3vw, 2rem);
	z-index: 60;
	width: 2.85rem;
	height: 2.85rem;
	border: 0;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-plum, #4f356f);
	color: #fbfafc;
	font-size: 1rem;
	cursor: pointer;
	box-shadow: 0 14px 30px -16px rgba(56, 35, 79, 0.8);
	transition: transform 0.2s ease, background 0.2s ease;
}
.kl-theme .kl-to-top:hover {
	transform: translateY(-2px);
	background: var(--color-plum-dark, #38234f);
}
.kl-theme .kl-to-top[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
	.kl-theme *,
	.kl-theme *::before,
	.kl-theme *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
}


/* ============================================================
   v70.5 — Modality pill polish (works on light and dark bands)
   ============================================================ */
.kl-theme ul.kl-modalities > li {
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
}
.kl-theme ul.kl-modalities > li::before,
.kl-theme ul.kl-modalities > li::marker { content: none !important; }

.kl-theme .kl-modality__trigger:hover,
.kl-theme .kl-modality__trigger:focus-visible,
.kl-theme .kl-modality.is-open .kl-modality__trigger {
	background: #fbfafc;
	color: var(--color-plum, #4f356f);
	border-color: #fbfafc;
}
.kl-theme .kl-modality__path em {
	color: var(--color-plum, #4f356f);
	font-weight: 700;
	opacity: 1;
}


/* ============================================================
   v70.6 — Specificity-matched overrides
   (the earlier v70.3 block lost to body.home.kl-theme rules)
   ============================================================ */

/* Sticky masthead on every route. */
body.home.kl-theme .entry-content .masthead,
body:not(.home).kl-theme .masthead,
body.kl-theme .masthead {
	position: sticky;
	top: 0;
	z-index: 30;
	background: var(--color-paper, #fbfafc);
	transition: box-shadow 0.25s ease;
}
body.kl-theme.admin-bar .masthead,
body.home.kl-theme.admin-bar .entry-content .masthead { top: 32px; }
@media (max-width: 782px) {
	body.kl-theme.admin-bar .masthead,
	body.home.kl-theme.admin-bar .entry-content .masthead { top: 46px; }
}
html.kl-scrolled body.kl-theme .masthead {
	box-shadow: 0 12px 32px -26px rgba(56, 35, 79, 0.75);
}

/* Closing CTA row: optically centred, auto-width children. */
body.home.kl-theme .entry-content .closing-actions,
body.kl-theme .entry-content .closing-actions,
.kl-page-flow #main-content .closing-actions,
body.kl-theme .closing .closing-actions {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center !important;
	align-items: center !important;
	grid-template-columns: none !important;
	max-width: none !important;
	width: auto !important;
	gap: 1rem 1.75rem !important;
}
body.home.kl-theme .entry-content .closing-actions > *,
body.kl-theme .entry-content .closing-actions > *,
.kl-page-flow #main-content .closing-actions > *,
body.kl-theme .closing .closing-actions > * {
	width: auto !important;
	max-width: 100%;
	justify-self: center;
}
@media (max-width: 560px) {
	body.home.kl-theme .entry-content .closing-actions,
	body.kl-theme .entry-content .closing-actions,
	.kl-page-flow #main-content .closing-actions,
	body.kl-theme .closing .closing-actions {
		flex-direction: column !important;
		align-items: center !important;
	}
	body.home.kl-theme .entry-content .closing-actions > .btn-primary,
	body.kl-theme .closing .closing-actions > .btn-primary {
		width: 100% !important;
	}
}


/* ============================================================
   v70.7 — Sticky header needs a non-scrolling body; CTA buttons
   need to out-specify the paired-CTA grid rule.
   ============================================================ */

/* overflow-x: clip contains the bleed without making <body> a
   scroll container, which is what was breaking position: sticky. */
body.kl-theme { overflow-x: clip !important; }
@supports not (overflow: clip) {
	body.kl-theme { overflow-x: hidden !important; }
}

body.home.kl-theme .entry-content section.closing .closing-actions > .btn,
body.kl-theme .entry-content section.closing .closing-actions > .btn,
.kl-page-flow #main-content .closing-actions > .btn,
body.kl-theme section.closing .closing-actions > .btn {
	width: auto !important;
	max-width: 100%;
	flex: 0 0 auto !important;
}
@media (max-width: 560px) {
	body.home.kl-theme .entry-content section.closing .closing-actions > .btn-primary,
	body.kl-theme .entry-content section.closing .closing-actions > .btn-primary,
	.kl-page-flow #main-content .closing-actions > .btn-primary,
	body.kl-theme section.closing .closing-actions > .btn-primary {
		width: 100% !important;
	}
}


/* ============================================================
   v70.8 — Home page trust bar as a dark pill band
   (matches the interior-page .kl-editorial-ribbon treatment)
   ============================================================ */
body.home.kl-theme .entry-content section.trustbar,
body.kl-theme section.trustbar {
	background: var(--color-plum-dark, #38234f) !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	color: #f4f1f8 !important;
	padding-top: 1.15rem !important;
	padding-bottom: 1.15rem !important;
}
body.home.kl-theme .entry-content section.trustbar ul,
body.kl-theme section.trustbar ul {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0.55rem !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	color: #f4f1f8 !important;
}
body.home.kl-theme .entry-content section.trustbar ul > li,
body.kl-theme section.trustbar ul > li {
	display: inline-flex !important;
	align-items: center;
	background: rgba(255, 255, 255, 0.09) !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
	border-radius: 999px !important;
	padding: 0.45rem 0.9rem !important;
	margin: 0 !important;
	color: #f4f1f8 !important;
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	list-style: none !important;
}
body.home.kl-theme .entry-content section.trustbar ul > li::before,
body.home.kl-theme .entry-content section.trustbar ul > li::marker,
body.kl-theme section.trustbar ul > li::before,
body.kl-theme section.trustbar ul > li::marker { content: none !important; }

@media (max-width: 640px) {
	body.home.kl-theme .entry-content section.trustbar ul,
	body.kl-theme section.trustbar ul {
		justify-content: flex-start;
		gap: 0.4rem !important;
	}
	body.home.kl-theme .entry-content section.trustbar ul > li,
	body.kl-theme section.trustbar ul > li {
		font-size: 0.62rem;
		padding: 0.38rem 0.7rem !important;
	}
}


/* ============================================================
   v70.9 — Modality cards escape the clipping section, and stop
   inheriting the dark band's light text colour.
   section.approach has overflow:hidden, which was cutting the
   card off; the card is now viewport-positioned by JS instead.
   ============================================================ */
.kl-theme .kl-modality { position: static; }
.kl-theme .kl-modality__card {
	position: fixed !important;
	top: -9999px;
	left: -9999px;
	right: auto !important;
	bottom: auto !important;
	margin: 0 !important;
	z-index: 80 !important;
	width: min(23rem, calc(100vw - 2rem)) !important;
}

/* Card text must not inherit the plum band's light colours. */
body.home.kl-theme .entry-content .kl-modality__card,
body.kl-theme .kl-modality__card { color: #2e2735 !important; }
body.home.kl-theme .entry-content .kl-modality__meaning,
body.kl-theme .kl-modality__meaning { color: #2e2735 !important; }
body.home.kl-theme .entry-content .kl-modality__path,
body.kl-theme .kl-modality__path { color: #564d5d !important; }
body.home.kl-theme .entry-content .kl-modality__name,
body.kl-theme .kl-modality__name { color: var(--color-plum, #4f356f) !important; }
body.home.kl-theme .entry-content .kl-modality__path em,
body.kl-theme .kl-modality__path em {
	color: var(--color-plum, #4f356f) !important;
	font-weight: 700 !important;
	opacity: 1 !important;
}


/* ============================================================
   v70.10 — Both card paragraphs share one text treatment.
   The meaning line was 0.95rem / #2e2735 against the pathway
   line's 0.9rem / #564d5d, which read as two different weights.
   ============================================================ */
body.home.kl-theme .entry-content .kl-modality__meaning,
body.kl-theme .kl-modality__meaning,
.kl-theme .kl-modality__meaning {
	font-size: 0.9rem !important;
	line-height: 1.55 !important;
	font-weight: 400 !important;
	color: #564d5d !important;
}


/* ============================================================
   v70.11 — Writings grid adapts to the number of posts.
   The grid container's background is the divider colour, so a
   fixed 3-column track left an empty lavender block whenever
   the post count was not a multiple of three.
   ============================================================ */
body.kl-theme .kl-writing-archive .kl-writing-post-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
}


/* ============================================================
   v70.12 — Editorial grid for the Writings archive.
   Real gaps replace the 1px hairline trick, and the newest
   post runs as a wide lead story above a 3-up run of the rest.
   ============================================================ */
body.kl-theme .kl-writing-archive .kl-writing-post-grid {
	background: transparent !important;
	border: 0 !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: clamp(2rem, 4vw, 3.25rem) !important;
	align-items: start;
}
body.kl-theme .kl-writing-archive .kl-writing-post {
	background: transparent !important;
	padding: 0 !important;
	border-top: 1px solid var(--color-lavender-deep, #ded2ec);
	padding-top: 1.35rem !important;
}
body.kl-theme .kl-writing-archive .kl-writing-post .post-thumb {
	display: block;
	overflow: hidden;
	border-radius: var(--radius-control, 0.75rem);
	margin-bottom: 1.15rem;
}
body.kl-theme .kl-writing-archive .kl-writing-post .post-thumb img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform 0.5s ease;
}
body.kl-theme .kl-writing-archive .kl-writing-post .post-thumb:hover img {
	transform: scale(1.03);
}

/* Lead story: full width, image beside the text. */
@media (min-width: 861px) {
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: 1.15fr 1fr;
		column-gap: clamp(2rem, 4vw, 3.25rem);
		grid-auto-rows: min-content;
		align-content: center;
		border-top: 0;
		padding-top: 0 !important;
		padding-bottom: clamp(2rem, 4vw, 3.25rem) !important;
		border-bottom: 1px solid var(--color-lavender-deep, #ded2ec);
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb {
		grid-column: 1;
		grid-row: 1 / -1;
		align-self: stretch;
		margin-bottom: 0;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb img {
		height: 100%;
		aspect-ratio: 4 / 3;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > *:not(.post-thumb) {
		grid-column: 2;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child h2 {
		font-size: clamp(1.75rem, 3vw, 2.5rem);
		line-height: 1.15;
	}
}

@media (max-width: 860px) {
	body.kl-theme .kl-writing-archive .kl-writing-post-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 640px) {
	body.kl-theme .kl-writing-archive .kl-writing-post-grid {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 2.25rem !important;
	}
}


/* ============================================================
   v70.13 — Lead story: float the image so the text flows beside
   it. Spanning a grid item across auto rows was stretching the
   eyebrow and pushing the headline down the column.
   ============================================================ */
@media (min-width: 861px) {
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child {
		display: block !important;
		grid-template-columns: none !important;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child::after {
		content: "";
		display: table;
		clear: both;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb {
		float: left;
		width: 52%;
		margin: 0 clamp(2rem, 4vw, 3.25rem) 0.5rem 0;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb img {
		height: auto;
		aspect-ratio: 4 / 3;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .cat {
		margin-top: 0;
	}
}


/* ============================================================
   v71.1 — Uniform card grid for Writings (supersedes the
   lead-story treatment in v70.12 / v70.13). Every post is an
   equal card: image, category, title, meta.
   ============================================================ */
@media (min-width: 861px) {
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child {
		display: flex !important;
		grid-column: auto !important;
		border-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child::after { content: none !important; }
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb {
		float: none !important;
		width: auto !important;
		margin: 0 !important;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child > .post-thumb img {
		aspect-ratio: 16 / 10 !important;
		height: auto !important;
	}
	body.kl-theme .kl-writing-archive .kl-writing-post:first-child h2 {
		font-size: 1.2rem;
		line-height: 1.3;
	}
}

body.kl-theme .kl-writing-archive .kl-writing-post-grid {
	background: transparent !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: clamp(1.5rem, 2.6vw, 2.25rem) !important;
	align-items: stretch;
}

body.kl-theme .kl-writing-archive .kl-writing-post {
	display: flex;
	flex-direction: column;
	background: #ffffff !important;
	border: 1px solid var(--color-lavender-deep, #ded2ec) !important;
	border-radius: var(--radius-control, 0.75rem);
	overflow: hidden;
	padding: 0 !important;
	height: 100%;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}
body.kl-theme .kl-writing-archive .kl-writing-post:hover {
	box-shadow: 0 18px 38px -26px rgba(56, 35, 79, 0.55);
	transform: translateY(-2px);
}
body.kl-theme .kl-writing-archive .kl-writing-post > .post-thumb {
	display: block;
	margin: 0 !important;
	border-radius: 0;
	overflow: hidden;
}
body.kl-theme .kl-writing-archive .kl-writing-post > .post-thumb img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}
body.kl-theme .kl-writing-archive .kl-writing-post > .cat {
	margin: 1.25rem 1.35rem 0.5rem !important;
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-plum, #4f356f) !important;
}
body.kl-theme .kl-writing-archive .kl-writing-post > h2 {
	margin: 0 1.35rem 0.65rem !important;
	font-size: 1.2rem !important;
	line-height: 1.32 !important;
}
body.kl-theme .kl-writing-archive .kl-writing-post > h2 a { text-decoration: none; }
body.kl-theme .kl-writing-archive .kl-writing-post > h2 a:hover { text-decoration: underline; }
body.kl-theme .kl-writing-archive .kl-writing-post__excerpt {
	margin: 0 1.35rem 1rem !important;
	font-size: 0.9rem;
	line-height: 1.55;
	color: #564d5d;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
body.kl-theme .kl-writing-archive .kl-writing-post > .link-more,
body.kl-theme .kl-writing-archive .kl-writing-post > .meta {
	margin: auto 1.35rem 1.35rem !important;
	font-size: 0.8rem;
}

@media (max-width: 860px) {
	body.kl-theme .kl-writing-archive .kl-writing-post-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 600px) {
	body.kl-theme .kl-writing-archive .kl-writing-post-grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}


/* ============================================================
   v71.4 — Article sign-off block: eyebrow on its own line, the
   closing line and the back link side by side beneath it.
   ============================================================ */
.kl-theme .kl-article-signoff {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.1rem 2rem;
	margin-top: clamp(2.5rem, 5vw, 3.75rem);
	padding-top: clamp(1.5rem, 3vw, 2rem);
	border-top: 1px solid var(--color-lavender-deep, #ded2ec);
}
.kl-theme .kl-article-signoff > .eyebrow {
	flex: 0 0 100%;
	margin: 0 !important;
}
.kl-theme .kl-article-signoff > p:not(.eyebrow) {
	flex: 1 1 20rem;
	margin: 0 !important;
	max-width: 34rem;
}
.kl-theme .kl-article-signoff > .kl-text-link {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	white-space: nowrap;
	font-family: 'Archivo', system-ui, sans-serif;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--color-plum, #4f356f);
	text-decoration: none;
	border: 1px solid var(--color-lavender-deep, #ded2ec);
	border-radius: 999px;
	padding: 0.6rem 1.15rem;
	transition: background 0.2s ease, border-color 0.2s ease;
}
.kl-theme .kl-article-signoff > .kl-text-link:hover {
	background: var(--color-lavender, #ece6f5);
	border-color: var(--color-plum, #4f356f);
}
@media (max-width: 560px) {
	.kl-theme .kl-article-signoff { justify-content: flex-start; }
	.kl-theme .kl-article-signoff > p:not(.eyebrow) { flex: 0 0 100%; }
}