/* ============================================================
   Wensum — public site stylesheet: content, blocks, buttons, forms, news.
   The page frame core draws (top bar, header, menu, footer, search) is
   Wensum default's, in assets/themes/wensum/wensum.css (October 2026).
   Font: chosen in Settings > Typography, self-hosted from assets/fonts
   (default Figtree). @font-face is written into the page head.
   Colours are CSS vars overridden from Settings > Colours:
   --navy = dark, --yellow = primary, --teal = secondary (names kept for
   compatibility with saved settings).
   ============================================================ */

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
img, video { display: block; max-width: 100%; }
svg { overflow: visible; }
a { color: inherit; }
ul, ol { list-style: none; }
button { cursor: pointer; font: inherit; }
input, textarea, select { font: inherit; }

/* ── Custom properties ── */
:root {
  /* Brand colours — overridden dynamically from CMS Settings > Colours */
  --navy:        #16181d;
  --yellow:      #f0ad8a;
  --yellow-dk:   #e8926b;
  --yellow-lt:   #fcf1eb;
  --teal:        #a93c15;
  --teal-dk:     #83300f;
  --teal-lt:     #f8ece6;

  /* Neutrals */
  --text:        #1d2026;
  --muted:       #5a606b;   
  --border:      #e5e3df;
  --bg:          #ffffff;
  --white:       #ffffff;
  --light:       #f6f4f1;

  /* Typography */
  --font:        'Figtree', 'Figtree Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* Top strip and footer. Dark by default; set from the dark colour. */
  --chrome-bg:   var(--navy);
  --chrome-fg:   #ffffff;
  --chrome-soft: rgba(255,255,255,.72);
  --chrome-line: rgba(255,255,255,.14);
  --base-size:   17px;
  --line:        1.8;

  /* Spacing */
  --max-w:       1140px;
  --gap:         24px;

  /* Shadows */
  --shadow-sm:   0 1px 4px rgba(0,0,0,.06);
  --shadow-md:   0 4px 16px rgba(0,0,0,.09);
  --shadow-lg:   0 8px 32px rgba(0,0,0,.12);

  /* Radius */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;

  /* Transitions */
  --ease:        .18s ease;

  /* Navigation typography — overridden dynamically from CMS settings */
  --nav-size:      13px;
  --nav-weight:    600;
  --nav-transform: uppercase;
  --nav-spacing:   0.06em;
  --nav-sub-size:  11.5px;

  /* Heading sizes — overridden dynamically from CMS settings */
  --h1-size:       44px;
  --h2-size:       30px;
  --h3-size:       22px;
  --h4-size:       18px;
  --hero-size:     44px;

  /* Snippet / card text sizes — overridden dynamically from CMS settings */
  --card-text:     14px;
  --card-text-lg:  15px;
  --caption-size:  13px;
  --label-size:    11px;

  /* Buttons, forms & chrome — overridden dynamically from CMS settings */
  --btn-size:      15px;
  --btn-size-sm:   14px;
  --form-label:    14px;
  --form-input:    15px;
  --footer-size:   14px;
  --topbar-size:   13px;

  /* Snippet component titles — overridden dynamically from CMS settings */
  --sn-section-title:  18px;
  --sn-callout-title:  17px;
  --sn-dark-title:     20px;
  --sn-feature-title:  15px;
  --sn-story-title:    18px;
  --sn-cta-title:      22px;
  --sn-snippet-hero:   28px;
  --sn-snippet-sub:    16px;

  /* Body content extras — overridden dynamically from CMS settings */
  --body-blockquote:   18px;
  --body-table:        16px;
}

/* Override inline font-size:14px / 15px in CMS-managed content blocks.
   !important is necessary because these are hardcoded inline styles. */
.kc-body *[style*="font-size:14px"]  { font-size: var(--card-text,    14px) !important; }
.kc-body *[style*="font-size:15px"]  { font-size: var(--card-text-lg, 15px) !important; }
.kc-body figcaption                  { font-size: var(--caption-size,  13px); }

/* ── Plugin colours (October 2026). Plugins take these eight from the site's theme (docs/plugins.md); Wensum's
   theme sets them from Settings › Look and feel. A site theme sets the same names in its own stylesheet. ── */
:root {
  --wsm-accent: var(--teal); --wsm-on-accent: var(--white); --wsm-text: var(--text); --wsm-muted: var(--muted);
  --wsm-line: var(--border); --wsm-surface: var(--white); --wsm-soft: var(--light); --wsm-radius: var(--radius-md);
}

/* ── Accessibility ── */
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

/* ── Base ── */
html { font-size: var(--base-size); scroll-behavior: smooth; }

body {
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: var(--line);
  -webkit-font-smoothing: antialiased;
}

/* ── Skip link (accessibility) ── */
.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 9999;
  padding: 10px 18px;
  background: var(--teal);
  color: var(--white);
  font-weight: 600;
  font-size: 14px;
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  text-decoration: none;
  transition: top var(--ease);
}
.skip-link:focus { top: 0; outline: 3px solid var(--yellow); outline-offset: 2px; }
/* Skip-link target: programmatically focusable but no visible focus ring on the region itself */
.kc-main:focus { outline: none; }

/* ── Focus styles ── */
:focus-visible {
  outline: 3px solid var(--teal);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── Container ── */
.kc-container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--gap);
}

/* Contact CTA button in header */
.kc-btn-cta {
  display: inline-flex;
  align-items: center;
  padding: 10px 22px;
  background: var(--yellow);
  color: var(--text);
  font-size: var(--btn-size-sm);
  font-weight: 700;
  text-decoration: none;
  border-radius: 50px;
  white-space: nowrap;
  transition: background var(--ease), transform var(--ease), box-shadow var(--ease);
  box-shadow: 0 2px 6px rgba(0,0,0,.10);
}
.kc-btn-cta:hover {
  background: var(--yellow-dk, var(--yellow-dk));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.14);
}

/* ============================================================
   PAGE HERO BANNER
   Each inner page gets a title strip so users are never
   dropped into content without a visual anchor.
   ============================================================ */
.kc-page-hero {
  background: var(--light);
  border-bottom: 3px solid var(--yellow);
  padding: 52px var(--gap) 44px;
}
.kc-page-hero-inner {
  max-width: var(--max-w);
  margin: 0 auto;
}
.kc-page-hero h1 {
  font-size: clamp(22px, 4vw, var(--hero-size, 44px));
  font-weight: 700;
  line-height: 1.15;
  color: var(--text);
  margin: 0;
}
.kc-page-hero p {
  margin-top: 12px;
  font-size: 18px;
  color: var(--muted);
  max-width: 640px;
  line-height: 1.65;
}

@media (max-width: 640px) {
  .kc-page-hero { padding: 36px var(--gap) 30px; }
}

/* ── Image hero variant ────────────────────────────────────────────────── */
.kc-page-hero--image {
  position: relative;
  min-height: 280px;
  border-bottom: 3px solid var(--yellow);
  padding: 0;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

/* Responsive hero image — replaces CSS background-image so srcset works. */
.kc-page-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* object-position is set inline from the admin image-position setting */
  display: block;
}

.kc-page-hero-overlay {
  position: absolute;
  inset: 0;
  /* A shade under the title (core 1.0.179): white words on a pale picture were as low as 1.4:1 */
  background: linear-gradient(to top, rgba(0,0,0,.66) 0%, rgba(0,0,0,.5) 55%, rgba(0,0,0,.12) 100%);
}
.kc-page-hero--image .kc-page-hero-inner {
  position: relative;
  z-index: 1;
  padding: 32px var(--gap) 36px;
  width: 100%;
}
.kc-page-hero--image h1 {
  color: #fff;
  text-shadow: 0 1px 4px rgba(0,0,0,0.45);
}
.kc-page-hero--image p {
  color: rgba(255,255,255,0.88);
}

.kc-breadcrumb {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 10px;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.kc-breadcrumb a {
  color: var(--teal);
  text-decoration: none;
  background-image: linear-gradient(var(--yellow), var(--yellow));
  background-position: left bottom 1px;
  background-repeat: no-repeat;
  background-size: 0% 1.5px;
  transition: color .2s ease, background-size .26s ease;
  padding-bottom: 1px;
}
.kc-breadcrumb a:hover { color: var(--teal-dk); background-size: 100% 1.5px; }
.kc-breadcrumb-sep { opacity: .4; }

/* ============================================================
   MAIN CONTENT
   ============================================================ */
.kc-main {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 40px var(--gap) 72px;
  min-height: 60vh;
}

/* Inner pages: constrain reading width to ~760px for comfort.
   Sidebar layout pages can override this. */
.kc-page-body {
  max-width: 760px;
}

/* Full-viewport layout — homepage and full-bleed pages. No max-width or
   padding so each section manages its own container. */
.kc-main--full {
  max-width: none;
  padding: 0;
}

/* ── Page + section sidebar layout ─────────────────────────────────────── */
.kc-page-with-sidebar {
  display: grid;
  /* minmax(0, …) lets the content column shrink below its intrinsic
     min-content width — wide content (e.g. carousels) would otherwise
     blow the grid out and push the sidebar off screen */
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 48px;
  align-items: start;
}
.kc-body--wide {
  max-width: none; /* let grid control width */
}

/* Section nav sidebar */
.kc-section-nav {
  position: sticky;
  top: 24px;
}
.kc-section-nav__heading {
  display: block;
  font-size: var(--label-size);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
  padding: 0 0 10px 0;
  margin-bottom: 4px;
  border-bottom: 2px solid var(--yellow);
  text-decoration: none;
}
.kc-section-nav__heading:hover { color: var(--teal); }
.kc-section-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.kc-section-nav ul li { margin: 0; padding: 0; }
.kc-section-nav__link {
  display: block;
  padding: 8px 12px;
  font-size: var(--nav-side-size, 14px);
  color: var(--text);
  text-decoration: none;
  border-left: 3px solid transparent;
  border-radius: 0 6px 6px 0;
  transition: background var(--ease), border-color var(--ease), color var(--ease);
  line-height: 1.4;
  background-image: none; /* override body link hover */
}
.kc-section-nav__link:hover {
  background: var(--yellow-lt);
  border-left-color: var(--yellow);
  color: var(--text);
  background-size: unset;
}
.kc-section-nav__link--active {
  background: var(--yellow-lt);
  border-left-color: var(--yellow);
  font-weight: 600;
  color: var(--text);
}

/* Sidebar nav links — rendered by build_section_sidebar()
   White bordered card; divider rows; arrow + link slide right on hover;
   active row is a full-width yellow pill */
.kc-section-nav {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 24px;
}
.kc-snav-head {
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text);
  margin: 0 0 8px;
}
.kc-snav-head a {
  color: inherit;
  text-decoration: none;
}
.kc-snav-head a:hover {
  color: var(--teal);
}
.kc-snav-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.kc-snav-list li {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--light);
}
.kc-snav-list li:last-child {
  border-bottom: none;
}
.kc-snav-link {
  display: flex;
  align-items: center;
  padding: 14px 0;
  font-size: 15px;
  font-weight: 500;
  color: var(--muted);
  text-decoration: none;
  line-height: 1.4;
  background-image: none; /* override body link hover */
  transition: color .2s ease, padding-left .2s ease;
}
.kc-snav-link:hover:not(.kc-snav-active) {
  color: var(--teal);
  padding-left: 4px;
  background-size: unset;
}
.kc-snav-arrow {
  display: inline-block;
  flex-shrink: 0;
  margin-right: 8px;
  transition: transform .2s ease;
}
.kc-snav-link:hover .kc-snav-arrow {
  transform: translateX(4px);
}
.kc-snav-active {
  background: var(--yellow);
  color: var(--text);
  font-weight: 700;
  padding: 14px 16px;
  margin: 4px -16px;
  border-radius: 6px;
}

@media (max-width: 860px) {
  .kc-page-with-sidebar {
    grid-template-columns: minmax(0, 1fr);
  }
  .kc-section-nav {
    display: none; /* hidden on mobile — too cluttered on small screens */
  }
}

/* Hide broken images gracefully */
img:not([src]), img[src=""] { display: none; }
img { color: transparent; } /* hides alt text on broken images */

/* ── Snippet component classes (.kc-sn-*) ──────────────────────────────────
   All HTML snippets must use these classes instead of inline styles.
   Changing a value here updates every page that uses the component.
   ─────────────────────────────────────────────────────────────────────────── */

/* Client story card (stacked: image on top, text below) */
.kc-sn-story-card {
  background: var(--kc-t-soft, #f9f9f7);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 36px;
}
.kc-sn-story-card__img {
  width: 100%;
  height: 280px;
  overflow: hidden;
}
.kc-sn-story-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.kc-sn-story-card__body { padding: 28px 28px 24px; }
.kc-sn-story-card__badge-teal {
  display: inline-block;
  background: var(--teal);
  color: var(--kc-t-on-secondary, #fff);
  font-size: var(--label-size);
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 6px;
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.kc-sn-story-card__badge-yellow {
  display: inline-block;
  background: var(--yellow);
  color: var(--kc-t-on-primary, var(--navy));
  font-size: var(--label-size);
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 6px;
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.kc-sn-story-card__title,
.kc-body .kc-sn-story-card__title {
  margin: 0 0 10px;
  font-size: var(--sn-story-title, 18px);
  font-weight: 700;
  color: var(--kc-t-heading, var(--navy));
  line-height: 1.3;
}
.kc-sn-story-card__text,
.kc-body .kc-sn-story-card__text {
  margin: 0 0 12px;
  font-size: var(--card-text, 14px);
  color: var(--kc-t-muted, #555);
  line-height: 1.75;
}
.kc-sn-story-card__text:last-child { margin-bottom: 0; }

/* Row variant (image left, text right) */
.kc-sn-story-card--row {
  background: var(--kc-t-card, #fff);
  border: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
}
.kc-sn-story-card--row .kc-sn-story-card__img {
  flex: 0 0 240px;
  width: 240px;
  height: 200px;
}
.kc-sn-story-card--row .kc-sn-story-card__body {
  flex: 1;
  min-width: 200px;
  padding: 24px;
}
.kc-sn-story-card--row .kc-sn-story-card__title { font-size: 16px; }

/* Hero block */
.kc-sn-hero {
  background: var(--navy);
  border-radius: 16px;
  padding: 40px 44px;
  margin-bottom: 48px;
  position: relative;
  overflow: hidden;
}
.kc-sn-hero::before {
  content: '';
  position: absolute;
  top: -50px; right: -50px;
  width: 260px; height: 260px;
  background: radial-gradient(circle, color-mix(in srgb, var(--kc-t-glow, #0d7680) 55%, transparent) 0%, transparent 70%);
  border-radius: 50%;
  animation: kc-float-slow 14s ease-in-out infinite alternate;
}
.kc-sn-hero::after {
  content: '';
  position: absolute;
  bottom: -30px; right: 100px;
  width: 120px; height: 120px;
  background: color-mix(in srgb, var(--kc-t-glow2, #fbce3e) 14%, transparent);
  border-radius: 50%;
  animation: kc-float-fast 9s ease-in-out infinite alternate-reverse;
}
@keyframes kc-float-slow {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(-12px, 16px) scale(1.06); }
  100% { transform: translate(8px, -10px) scale(.96); }
}
@keyframes kc-float-fast {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(10px, -14px) scale(1.1); }
  100% { transform: translate(-8px, 8px) scale(.92); }
}
@media (prefers-reduced-motion: reduce) {
  .kc-sn-hero::before, .kc-sn-hero::after { animation: none; }
}
.kc-sn-hero__inner { position: relative; }
.kc-sn-hero__badge {
  display: inline-block;
  padding: 5px 14px;
  background: var(--yellow);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  color: var(--kc-t-on-primary, var(--text));
  letter-spacing: .6px;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.kc-sn-hero__title,
.kc-sn-hero .kc-sn-hero__title,
.kc-body .kc-sn-hero__title {
  font-size: var(--sn-snippet-hero, 28px);
  font-weight: 800;
  color: #fff;
  margin: 0 0 14px;
  line-height: 1.25;
}
.kc-sn-hero__sub,
.kc-sn-hero .kc-sn-hero__sub,
.kc-body .kc-sn-hero__sub {
  font-size: var(--sn-snippet-sub, 16px);
  color: rgba(255,255,255,.8);
  line-height: 1.7;
  margin: 0;
  max-width: 520px;
}

/* Two-col intro (text + image) */
.kc-sn-intro {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: 36px;
  margin-bottom: 48px;
  align-items: center;
}
.kc-sn-intro__img {
  width: 100%;
  border-radius: 14px;
  display: block;
  object-fit: cover;
  max-height: 320px;
}

/* Section heading used between snippet sections */
.kc-sn-section-title {
  font-size: var(--sn-section-title, 18px);
  font-weight: 700;
  color: var(--kc-t-heading, var(--navy));
  margin: 0 0 16px;
}
/* Let the yellow accent bar hang into the left gutter so the heading text lines
   up with the paragraphs, cards and callouts beneath it. Without this the 14px
   padding pushed section headings ~17px to the right of the body content, so
   things like the "How to Ask" cards looked shifted left of their heading. */
.kc-body h2.kc-sn-section-title {
  padding-left: 0;
  border-left: none;
  position: relative;
}
.kc-body h2.kc-sn-section-title::before {
  content: "";
  position: absolute;
  left: -17px;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--yellow);
}

/* Photo grid (3-up) */
.kc-sn-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  gap: 14px;
  margin-bottom: 48px;
}
.kc-sn-photo-grid figure {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
}
.kc-sn-photo-grid img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}

/* Dark navy panel */
.kc-sn-dark-panel {
  background: var(--navy);
  border-radius: 16px;
  padding: 36px 40px;
  margin-bottom: 48px;
}
.kc-sn-dark-panel__title { font-size: var(--sn-dark-title, 20px); font-weight: 700; margin: 0 0 14px; }
.kc-sn-dark-panel .kc-sn-dark-panel__title,
.kc-body .kc-sn-dark-panel__title { color: var(--yellow); border: none; padding: 0; }
.kc-sn-dark-panel__text { font-size: var(--card-text-lg, 15px); line-height: 1.75; margin: 0 0 14px; }
.kc-sn-dark-panel__text:last-child { margin-bottom: 0; }
.kc-body .kc-sn-dark-panel__text { color: rgba(255,255,255,.85); }

/* Icon card grid */
.kc-sn-icon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 12px;
  margin-bottom: 48px;
}
.kc-sn-icon-grid--col {
  grid-template-columns: 1fr;
  margin-bottom: 0;
}
.kc-sn-icon-card {
  background: var(--kc-t-card, #fff);
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.kc-sn-icon-card__icon {
  width: 36px;
  height: 36px;
  background: var(--teal);
  color: var(--kc-t-on-secondary, #fff);   /* icons are drawn in the text colour: white on the coloured square (1.18.0) */
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.kc-sn-icon-card__icon--navy { background: var(--navy); }
.kc-sn-icon-card__label {
  font-size: 14px;
  font-weight: 600;
  color: var(--kc-t-heading, var(--navy));
}
.kc-sn-icon-card__sub {
  font-size: 12px;
  color: var(--kc-t-muted, #666);
  line-height: 1.5;
  margin-top: 2px;
}

/* Photo — full-width rounded image */
.kc-sn-photo {
  width: 100%;
  border-radius: 14px;
  display: block;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

/* Feature card (teal top stripe) */
.kc-sn-feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.kc-sn-feature-card {
  background: var(--kc-t-card, #fff);
  border-radius: 14px;
  border: 1px solid var(--border);
  overflow: hidden;
}
.kc-sn-feature-card__stripe {
  height: 6px;
  background: var(--teal);
}
.kc-sn-feature-card__body { padding: 22px 24px; }
.kc-sn-feature-card__icon-wrap {
  width: 38px;
  height: 38px;
  background: var(--teal-lt);
  color: var(--kc-t-heading);   /* unset (so inherited) unless a theme sets it (core 1.0.78) */
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
}
/* Icon hover micro-interaction (from the card-animation reference) */
.kc-sn-feature-card:hover .kc-sn-feature-card__icon-wrap,
a.kc-sn-service-card:hover .kc-sn-feature-card__icon-wrap {
  transform: scale(1.1) rotate(4deg);
}
.kc-sn-feature-card__title,
.kc-sn-feature-card .kc-sn-feature-card__title,
.kc-body .kc-sn-feature-card__title {
  font-size: var(--sn-feature-title, 15px);
  font-weight: 700;
  color: var(--kc-t-heading, var(--navy));
  margin: 0 0 8px;
}
.kc-sn-feature-card__text {
  font-size: var(--card-text, 14px);
  color: var(--kc-t-muted, #555);
  line-height: 1.7;
  margin: 0;
}
.kc-sn-feature-card__list {
  margin: 10px 0 0;
  padding-left: 18px;
  font-size: 13px;
  color: var(--kc-t-muted, #555);
  line-height: 1.9;
}

/* Feature card icon alias (shorthand for __icon-wrap) */
.kc-sn-feature-card__icon { width:38px;height:38px;background:var(--teal-lt);border-radius:9px;display:flex;align-items:center;justify-content:center;margin-bottom:12px; }

/* Feature card — yellow variants */
.kc-sn-feature-card__stripe--yellow { background: var(--yellow); }
.kc-sn-feature-card__icon-wrap--yellow,
.kc-sn-feature-card__icon--yellow { background: var(--yellow-lt); }

/* Service card link (clickable feature card) */
a.kc-sn-service-card {
  display: block;
  background: var(--kc-t-card, #fff);
  border-radius: 14px;
  border: 1px solid var(--border);
  overflow: hidden;
  text-decoration: none;
  transition: box-shadow .2s, border-color .2s;
}
a.kc-sn-service-card:hover {
  box-shadow: 0 6px 24px rgba(0,0,0,.09);
  border-color: var(--border);
}

/* Inline "Learn more" link inside cards */
.kc-sn-link {
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--teal);
}
.kc-sn-link--yellow { color: var(--yellow-dk); }

/* Callout title */
.kc-sn-callout__title,
.kc-sn-callout .kc-sn-callout__title,
.kc-body .kc-sn-callout__title {
  font-size: var(--sn-callout-title, 17px);
  font-weight: 700;
  color: var(--teal);
  margin: 0 0 10px;
  border: none;
  padding: 0;
}

/* Teal left-border callout */
.kc-sn-callout {
  background: var(--teal-lt);
  border-left: 4px solid var(--teal);
  border-radius: 0 14px 14px 0;
  padding: 22px 28px;
  margin-bottom: 48px;
}
.kc-sn-callout p {
  font-size: var(--card-text-lg, 15px);
  line-height: 1.75;
  color: var(--kc-t-text, #444);
  margin: 0 0 10px;
}
.kc-sn-callout p:last-child { margin-bottom: 0; }
.kc-sn-callout__credit {
  font-size: var(--caption-size);
  font-weight: 700;
  color: var(--teal);
}

/* Testimonial */
.kc-sn-testimonial {
  background: var(--kc-t-soft, #f9f9f7);
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 28px 32px;
  margin-bottom: 48px;
  position: relative;
}
.kc-sn-testimonial::before {
  content: '\201C';
  font-size: 52px;
  line-height: 1;
  color: var(--teal);
  opacity: .2;
  position: absolute;
  top: 16px; left: 24px;
  font-family: Georgia, serif;
}
.kc-sn-testimonial blockquote { margin: 0; padding: 0; }
.kc-sn-testimonial__quote,
.kc-body .kc-sn-testimonial__quote {
  font-size: var(--card-text-lg, 15px);
  line-height: 1.8;
  color: var(--kc-t-text, #333);
  margin: 0 0 16px;
  padding-top: 14px;
  position: relative;
  z-index: 1;
}
.kc-sn-testimonial__byline {
  display: flex;
  align-items: center;
  gap: 10px;
}
.kc-sn-testimonial__avatar {
  width: 38px;
  height: 38px;
  background: var(--teal);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--kc-t-on-secondary, #fff);
}
.kc-sn-testimonial__name {
  font-size: 14px;
  font-weight: 700;
  color: var(--kc-t-heading, var(--navy));
}
.kc-sn-testimonial__role {
  font-weight: 400;
  color: var(--kc-t-muted, #666);
}

/* Testimonial grid (side-by-side pair) */
.kc-sn-testimonial-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px, 100%), 1fr));gap:24px;margin-bottom:48px; }
.kc-sn-testimonial-grid .kc-sn-testimonial { margin-bottom:0; }

/* Navy CTA block */
.kc-sn-cta {
  background: var(--yellow);
  border-radius: 16px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.kc-sn-cta__title,
.kc-body .kc-sn-cta__title {
  font-size: var(--sn-cta-title, 22px);
  font-weight: 700;
  color: var(--kc-t-heading, var(--navy));
  margin: 0 0 10px;
}
.kc-sn-cta__sub,
.kc-body .kc-sn-cta__sub {
  font-size: var(--card-text-lg, 15px);
  color: var(--kc-t-heading, var(--navy));
  margin: 0 0 26px;
  line-height: 1.6;
}
.kc-sn-cta__sub--icon-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 0;
}
.kc-sn-cta__buttons {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}
/* CTA buttons reuse .kc-hp-btn / .kc-hp-btn--dark / .kc-hp-btn--outline-dark from homepage styles */

/* ============================================================
   RICH BODY CONTENT
   ============================================================ */

/* Headings — clear scale with distinct weights */
.kc-body h1 {
  font-size: clamp(22px, 4vw, var(--h1-size, 44px));
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.02em;
  margin: 0 0 24px;
  color: var(--text);
}
.kc-body h2 {
  font-size: clamp(17px, 3vw, var(--h2-size, 30px));
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.01em;
  margin: 48px 0 14px;
  color: var(--text);
  padding-left: 14px;
  border-left: 3px solid var(--yellow);
}
.kc-body h2:first-child { margin-top: 0; }
.kc-body h3 {
  font-size: clamp(15px, 2.5vw, var(--h3-size, 22px));
  font-weight: 600;
  line-height: 1.3;
  margin: 32px 0 10px;
  color: var(--text);
}
.kc-body h3:first-child { margin-top: 0; }
.kc-body h4 {
  font-size: var(--h4-size, 18px);
  font-weight: 600;
  margin: 24px 0 8px;
  color: var(--text);
}

/* Body text */
.kc-body p {
  margin-bottom: 20px;
  line-height: var(--line);
  color: var(--text);
}
.kc-body p:last-child { margin-bottom: 0; }

/* Strong inline — slightly warmer so it reads as emphasis not alarm */
.kc-body strong { font-weight: 700; color: var(--text); }

/* Lists */
.kc-body ul, .kc-body ol {
  margin: 0 0 20px 0;
  padding-left: 0;
}
.kc-body ul li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding-left: 0;
  margin-bottom: 10px;
  line-height: 1.7;
}
.kc-body ol li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 10px;
  line-height: 1.7;
}
.kc-body ul li::before {
  content: "✓";
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  width: 20px;
  height: 20px;
  background: var(--yellow);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  color: var(--text);
  margin-top: 3px;
  flex-shrink: 0;
}
.kc-body ol { counter-reset: list; }
.kc-body ol li { padding-left: 28px; }
.kc-body ol li::before {
  content: counter(list) '.';
  counter-increment: list;
  position: absolute;
  left: 0;
  color: var(--teal);
  font-weight: 700;
  font-size: 15px;
}

/* Links in body — animated underline slides in from left on hover */
/* Exclude button-style links (.kc-hp-btn, .kc-sc-vac-apply, .kc-sn-cta__btn,
   quiz result CTAs). NOTE: each :not(class) ADDS specificity — overriding
   this rule from outside is a losing game; button-style links must be
   excluded HERE. */
.kc-body a:not(.kc-hp-btn):not(.kc-sc-vac-apply):not(.kc-sn-cta__btn):not(.kc-quiz-result__go):not(.kc-quiz-result__read):not(.kc-reviews-cta):not(.cce-btn):not(.kc-sn-form-callus__num):not(.kc-sn-btn) {
  color: var(--teal);
  text-decoration: none;
  background-image: linear-gradient(var(--yellow), var(--yellow));
  background-position: left bottom 1px;
  background-repeat: no-repeat;
  background-size: 0% 2px;
  transition: color .22s ease, background-size .28s ease;
  padding-bottom: 1px;
}
.kc-body a:not(.kc-hp-btn):not(.kc-sc-vac-apply):not(.kc-sn-cta__btn):not(.kc-quiz-result__go):not(.kc-quiz-result__read):not(.kc-reviews-cta):not(.cce-btn):not(.kc-sn-form-callus__num):not(.kc-sn-btn):hover {
  color: var(--teal-dk);
  background-size: 100% 2px;
}

/* Blockquotes — testimonials are a key trust signal.
   Large, elegant, not straining to read. */
.kc-body blockquote {
  margin: 36px 0;
  padding: 28px 32px;
  border-left: 5px solid var(--yellow);
  background: var(--yellow-lt);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
  font-size: var(--body-blockquote, 18px);  /* slightly larger — quotes should feel prominent */
  font-weight: 400;        /* NOT bold italic — reads naturally */
  font-style: italic;
  line-height: 1.75;
  color: var(--text);
}
.kc-body blockquote p { margin-bottom: 0; line-height: 1.75; font-style: italic; }
.kc-body blockquote cite {
  display: block;
  margin-top: 12px;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .02em;
}

/* Images */
.kc-body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  margin: 4px 0;
}
.kc-body figure { margin: 28px 0; }
.kc-body figcaption {
  font-size: 14px;
  color: var(--muted);
  margin-top: 10px;
  text-align: center;
  font-style: italic;
}

.kc-body hr {
  border: none;
  border-top: 2px solid var(--border);
  margin: 48px 0;
}

/* Tables */
.kc-body table { width: 100%; border-collapse: collapse; margin: 28px 0; font-size: var(--body-table, 16px); background: transparent; }
.kc-body th, .kc-body td {
  padding: 14px 18px;
  border: 1px solid var(--border);
  text-align: left;
  line-height: 1.5;
  background: transparent;
}
.kc-body th {
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
}
/* Borderless table */
.kc-body table[border="0"] th,
.kc-body table[border="0"] td { border: none; }

/* ── Content columns (from Gutenberg/page builder) ── */
.columns {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
  margin: 28px 0;
}
.column {
  flex: 1 1 260px;
  min-width: 0;
}
.column > *:first-child { margin-top: 0; }
.column > *:last-child  { margin-bottom: 0; }

@media (max-width: 640px) {
  .columns { flex-direction: column; gap: 20px; }
  .column  { flex-basis: 100% !important; }
}

/* ============================================================
   BLOG POST
   ============================================================ */
.kc-post {
  max-width: none;
}
.kc-post-hero {
  width: 100%;
  border-radius: var(--radius-lg);
  margin-bottom: 32px;
  max-height: 460px;
  object-fit: cover;
}
.kc-post h1 {
  font-size: clamp(24px, 4vw, calc(var(--h1-size) - 6px));
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 14px;
}
.kc-post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: var(--caption-size);
  color: var(--muted);
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
}

/* ============================================================
   POST BODY — WORDPRESS COMPATIBILITY & MEDIA EMBEDS
   ============================================================ */

/* Responsive video embed wrapper (Vimeo / YouTube) */
.kc-embed-wrap {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: var(--radius-lg);
  margin: 28px 0;
  background: #000;
}
.kc-embed-wrap iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}

/* WordPress image alignment classes */
.kc-body .alignleft  { float: left;  margin: 4px 28px 16px 0; max-width: 50%; }
.kc-body .alignright { float: right; margin: 4px 0 16px 28px; max-width: 50%; }
.kc-body .aligncenter, .kc-body .alignnone { display: block; margin: 24px auto; }
.kc-body .alignfull  { width: 100%; margin: 24px 0; }

/* WordPress caption */
.kc-body .wp-caption       { max-width: 100%; }
.kc-body .wp-caption img   { display: block; width: 100%; }
.kc-body .wp-caption-text  { font-size: var(--caption-size); color: var(--muted); font-style: italic; margin-top: 6px; text-align: center; }

/* Figure / figcaption (native HTML5) */
.kc-body figure            { margin: 28px 0; }
.kc-body figcaption        { font-size: 13px; color: var(--muted); font-style: italic; margin-top: 8px; text-align: center; }

/* Gutenberg block resets — strip block wrappers, keep content */
.kc-body .wp-block-image   { margin: 28px 0; }
.kc-body .wp-block-image img { width: 100%; height: auto; border-radius: var(--radius); }
.kc-body .wp-block-quote,
.kc-body .wp-block-pullquote {
  border-left: 4px solid var(--accent);
  background: var(--yellow-lt);
  padding: .8em 1.4em;
  margin: 1.4em 0;
  border-radius: 0 var(--radius) var(--radius) 0;
}
.kc-body .wp-block-separator {
  border: none;
  border-top: 1px solid var(--border);
  margin: 32px 0;
}
.kc-body .wp-block-columns { display: flex; gap: 28px; flex-wrap: wrap; margin: 24px 0; }
.kc-body .wp-block-column  { flex: 1; min-width: 200px; }
.kc-body [class*="wp-block-"] > p:last-child { margin-bottom: 0; }

/* Clearfix after floated images */
.kc-post-body::after { content: ''; display: table; clear: both; }

/* ============================================================
   POST PREV / NEXT NAV
   ============================================================ */
.kc-post-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--border);
}

.kc-post-nav__link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: var(--off-white, #f9f9f7);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 12px);
  text-decoration: none;
  color: var(--text);
  font-size: 17px;
  transition: background var(--ease), border-color var(--ease), transform var(--ease);
}
.kc-post-nav__link:hover {
  background: var(--teal-light, var(--teal-lt));
  border-color: var(--teal);
  transform: translateY(-2px);
}
.kc-post-nav__link--next { justify-content: flex-end; text-align: right; }

.kc-post-nav__icon {
  flex-shrink: 0;
  color: var(--teal);
  width: 26px;
  height: 26px;
}
.kc-post-nav__label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--teal);
  display: block;
  margin-bottom: 4px;
}
.kc-post-nav__title {
  font-size: 17px;
  font-weight: 600;
  color: var(--navy, var(--navy));
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 600px) {
  .kc-post-nav { grid-template-columns: 1fr; }
  .kc-post-nav > span:empty { display: none; }
  .kc-post-nav__link--next { flex-direction: row-reverse; text-align: left; justify-content: flex-start; }
}

/* ============================================================
   NEWS CARD GRID
   ============================================================ */
.kc-news-page > h1 {
  font-size: clamp(26px, 4vw, calc(var(--h1-size) - 4px));
  font-weight: 700;
  margin-bottom: 36px;
}

.kc-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 28px;
  margin-bottom: 48px;
}

.kc-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow var(--ease), transform var(--ease);
}
.kc-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
}

.kc-card-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
  transition: opacity var(--ease);
}
.kc-card:hover .kc-card-img { opacity: .92; }

.kc-card-date-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--yellow);
  height: 110px;
  text-decoration: none;
  color: var(--text);
  transition: background var(--ease);
}
.kc-card:hover .kc-card-date-block { background: var(--yellow-dk); }
.kc-card-day  { font-size: 42px; font-weight: 800; line-height: 1; }
.kc-card-mon  { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin-top: 2px; }

.kc-card-body {
  padding: 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.kc-card-title {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  margin: 0;
}
.kc-card-title a {
  color: var(--text);
  text-decoration: none;
  transition: color var(--ease);
}
.kc-card-title a:hover { color: var(--teal); }

.kc-card-body .kc-post-meta { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.kc-card-body p {
  font-size: var(--card-text);
  color: var(--muted);
  line-height: 1.65;
  margin: 0;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.kc-read-more {
  font-size: 13px;
  font-weight: 600;
  color: var(--teal);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: auto;
  transition: gap var(--ease);
}
.kc-read-more:hover { gap: 8px; }

/* Pagination */
.kc-pager {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin-top: 28px;
}
.kc-pager-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 36px;
  padding: 8px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  text-decoration: none;
  background: var(--white);
  transition: background var(--ease), border-color var(--ease);
}
.kc-pager-btn:hover { background: #fafaf8; border-color: #d9ddd4; }
.kc-pager-active,
.kc-pager-active:hover { background: var(--yellow); border-color: var(--yellow-dk); color: #1a1a1a; font-weight: 700; }
.kc-pager-gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  padding: 0 2px;
  color: #aaa;
  font-weight: 600;
  user-select: none;
}

/* ============================================================
   CATEGORY BADGE
   ============================================================ */
.kc-category {
  display: inline-block;
  background: var(--yellow);
  color: var(--text);
  font-size: var(--label-size);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 3px 10px;
  border-radius: 99px;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.kc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 30px;
  background: var(--yellow);
  color: var(--text);
  font-family: var(--font);
  font-size: var(--btn-size);
  font-weight: 700;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--radius-sm);
  transition: background var(--ease), transform var(--ease), box-shadow var(--ease);
  cursor: pointer;
  white-space: nowrap;
}
.kc-btn:hover {
  background: var(--yellow-dk);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.kc-btn:active { transform: translateY(0); }

.kc-btn--teal {
  background: var(--teal);
  color: var(--white);
}
.kc-btn--teal:hover { background: var(--teal-dk); }

.kc-btn--dark {
  background: var(--text);
  color: var(--white);
  border-color: var(--text);
}
.kc-btn--dark:hover { background: #333; border-color: #333; }

.kc-btn--ghost {
  background: transparent;
  color: var(--text);
  border-color: rgba(0,0,0,.3);
}
.kc-btn--ghost:hover { border-color: var(--text); }

.kc-btn--outline {
  background: transparent;
  border-color: var(--text);
  color: var(--text);
}
.kc-btn--outline:hover {
  background: var(--text);
  color: var(--white);
}

/* ============================================================
   DESIGN SYSTEM — global components shared with the homepage.
   Use these on any inner page; no .kc-hp scope required.
   ============================================================ */

/* Eyebrow label */
.kc-eyebrow {
  display: block;
  font-size: var(--label-size);
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 14px;
}
.kc-eyebrow--teal { color: var(--teal); }

/* Section wrappers — for full-width inner-page sections */
.kc-section         { padding: 80px 0; background: var(--white); }
.kc-section--light  { background: var(--light); }
.kc-section--yellow { background: var(--yellow); border-top: 3px solid var(--yellow-dk); }

/* Centred section heading block */
.kc-section-head            { text-align: center; margin: 0 auto 48px; max-width: 640px; }
.kc-section-head h2         { font-size: clamp(22px, 2.4vw, calc(var(--h2-size) + 4px)); font-weight: 700; color: var(--text); margin: 0 0 14px; line-height: 1.25; padding-left: 0; border-left: none; }
.kc-section-head p          { font-size: var(--base-size); color: var(--muted); line-height: 1.65; margin: 0; }

/* "More" link */
.kc-more-link       { font-size: var(--card-text-lg); font-weight: 600; color: var(--teal); text-decoration: none; }
.kc-more-link:hover { text-decoration: underline; }

/* Checklist with yellow tick bullets */
.kc-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.kc-checklist li {
  font-size: var(--card-text-lg);
  color: var(--text);
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.5;
}
.kc-checklist li::before {
  content: "✓";
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  width: 20px;
  height: 20px;
  background: var(--yellow);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  color: var(--text);
  margin-top: 2px;
  flex-shrink: 0;
}

/* Video embed with yellow bottom accent */
.kc-video-wrap { border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-lg); background: #000; }
.kc-video-wrap::after { content: ""; display: block; height: 4px; background: var(--yellow); }
.kc-video-wrap video { width: 100%; display: block; aspect-ratio: 16/9; object-fit: cover; }

/* Split layout — image + text two-column */
.kc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.kc-split__image { border-radius: var(--radius-md); overflow: hidden; }
.kc-split__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 860px) {
  .kc-split { grid-template-columns: 1fr; gap: 36px; }
  .kc-split__image { aspect-ratio: 16/9; }
}

/* Stat / trust bar */
.kc-trust-bar { background: var(--light); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.kc-trust-bar__inner { display: flex; justify-content: center; flex-wrap: wrap; max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gap); }
.kc-trust-item { padding: 20px 32px; text-align: center; border-right: 1px solid var(--border); flex: 1; min-width: 130px; }
.kc-trust-item:last-child { border-right: none; }
.kc-trust-item strong { display: block; font-size: var(--card-text-lg); font-weight: 700; color: var(--text); margin-bottom: 3px; }
.kc-trust-item span   { display: block; font-size: var(--label-size); color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
@media (max-width: 560px) {
  .kc-trust-bar__inner { flex-direction: column; }
  .kc-trust-item { border-right: none; border-bottom: 1px solid var(--border); }
  .kc-trust-item:last-child { border-bottom: none; }
}

/* ============================================================
   FORMS
   ============================================================ */
.kc-form { display: flex; flex-direction: column; gap: 18px; }
.kc-form-group { display: flex; flex-direction: column; gap: 6px; }
.kc-form label { font-size: var(--form-label); font-weight: 600; color: var(--text); }
.kc-form input,
.kc-form textarea,
.kc-form select {
  padding: 11px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: var(--form-input);
  color: var(--text);
  background: var(--white);
  transition: border-color var(--ease), box-shadow var(--ease);
  width: 100%;
}
.kc-form input:focus,
.kc-form textarea:focus,
.kc-form select:focus {
  outline: none;
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(13, 118, 128,.15);
}
.kc-form textarea { min-height: 120px; resize: vertical; }

/* ============================================================
   UTILITIES
   ============================================================ */
.kc-text-center { text-align: center; }
.kc-text-muted  { color: var(--muted); }
.kc-mt-0 { margin-top: 0 !important; }
.kc-mb-0 { margin-bottom: 0 !important; }

/* Callout / info box */
.kc-callout {
  background: var(--teal-lt);
  border-left: 4px solid var(--teal);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  padding: 18px 22px;
  margin: 24px 0;
  font-size: var(--card-text-lg);
}
.kc-callout p.kc-callout__cite,
.kc-body .kc-callout p.kc-callout__cite { font-size: 13px; color: var(--kc-t-muted, #6b7b80); margin: 6px 0 0; }   /* was an inline style (core 1.0.78) */

/* ============================================================
   HOMEPAGE TEMPLATE  (.kc-hp)
   Layout-specific rules for the homepage sections.
   Generic components (eyebrow, checklist, video-wrap, etc.)
   now live in DESIGN SYSTEM above and work everywhere.
   ============================================================ */

/* Shared container */
.kc-hp-container { max-width: var(--max-w); margin: 0 auto; padding: 0 32px; }

/* ── Hero ─────────────────────────────────────────────── */
.kc-hp-hero {
  display: grid;
  grid-template-columns: 45fr 55fr;
  min-height: 320px;
}

.kc-hp-hero__content {
  background: var(--yellow);
  padding: 40px 48px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
}
.kc-hp-hero__content > * { width: 100%; max-width: 540px; }
.kc-hp-hero__content h1 { font-size: clamp(28px, 3vw, calc(var(--hero-size) - 2px)); font-weight: 700; line-height: 1.2; color: var(--text); margin: 0 0 20px; }
.kc-hp-hero__sub        { font-size: var(--base-size); line-height: 1.65; color: var(--kc-t-hero-sub, rgba(0,0,0,.62)); margin: 0 0 24px; max-width: 440px; }
.kc-hp-hero__ctas       { display: flex; flex-wrap: nowrap; align-items: center; gap: 12px; margin-bottom: 20px; }

/* Eyebrow (alias — use .kc-eyebrow on new content) */
.kc-hp-eyebrow       { font-size: var(--label-size); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 0 0 16px; }
.kc-hp-eyebrow--teal { color: var(--teal); }
/* Hero eyebrow sits on the yellow band — navy for a WCAG-safe ~7.7:1 (grey failed at 3.1:1) */
.kc-hp-hero .kc-hp-eyebrow { color: var(--kc-t-heading, var(--navy)); }

/* Buttons (alias — use .kc-btn--dark / .kc-btn--ghost on new content) */
.kc-hp-btn               { display: inline-flex; align-items: center; justify-content: center; font-size: var(--card-text-lg); font-weight: 600; padding: 13px 26px; border-radius: 5px; text-decoration: none; transition: background .18s, border-color .18s; border: 2px solid transparent; line-height: 1; text-align: center; }
.kc-hp-btn--dark         { background: var(--text); color: var(--kc-t-card, #fff); border-color: var(--text); }
.kc-hp-btn--dark:hover   { background: #333; border-color: #333; }
.kc-hp-btn--ghost        { background: transparent; color: var(--text); border-color: var(--kc-t-ghost-line, rgba(0,0,0,.3)); }
.kc-hp-btn--ghost:hover  { border-color: var(--text); }
.kc-hp-btn--outline-dark { background: transparent; color: var(--text); border-color: rgba(0,0,0,.35); }
.kc-hp-btn--outline-dark:hover { background: rgba(0,0,0,.06); }
/* .kc-hp-btn inside .kc-body: excluded from .kc-body a:not(.kc-hp-btn) so inherits base styles cleanly */

/* Hero trust signals */
.kc-hp-hero__trust { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 20px; }
.kc-hp-hero__trust li { font-size: var(--caption-size); color: var(--kc-t-hero-sub, rgba(0,0,0,.70)); padding-left: 17px; position: relative; }
.kc-hp-hero__trust li::before { content: "✓"; position: absolute; left: 0; font-weight: 700; color: var(--text); }

/* Hero image */
.kc-hp-hero__image { overflow: hidden; min-height: 320px; }
.kc-hp-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
/* Reserve hero image height on desktop to prevent load-time layout shift (CLS) */
@media (min-width: 861px) { .kc-hp-hero__image { aspect-ratio: 3 / 2; } }

/* ── Trust bar ─────────────────────────────────────────── */
.kc-hp-trust-bar { background: var(--light); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.kc-hp-trust-bar__inner { display: flex; justify-content: center; flex-wrap: wrap; }
.kc-hp-trust-item { padding: 20px 32px; text-align: center; border-right: 1px solid var(--border); flex: 1; min-width: 130px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.kc-hp-trust-item:last-child { border-right: none; }
.kc-hp-trust-item strong { display: block; font-size: var(--card-text-lg); font-weight: 700; color: var(--text); margin-bottom: 3px; }
.kc-hp-trust-item span   { display: block; font-size: var(--label-size); color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
/* Logo panel — trust item containing only an image gets a rounded white card */
.kc-hp-trust-item--logo,
.kc-hp-trust-item:has(> img) {
  padding: 14px 32px;
}
.kc-hp-trust-item--logo img,
.kc-hp-trust-item:has(> img) > img {
  display: block;
  /* !important overrides inline height/width attrs on old content that break
     the aspect ratio (Lighthouse flagged the CQC logo squashed). object-fit
     keeps it undistorted even if forced dimensions remain in the markup. */
  height: auto !important;
  width: auto !important;
  max-height: 90px;
  max-width: 100%;
  object-fit: contain;
  border-radius: 12px;
  background: var(--kc-t-card, #fff);
  padding: 10px 18px;
  box-shadow: 0 1px 6px rgba(0,0,0,.10), 0 0 0 1px rgba(0,0,0,.05);
}

/* Soft CTA — gentle, low-pressure prompt for between homepage sections */
.kc-hp-soft-cta          { background: var(--light); padding: 56px 0; }
.kc-hp-soft-cta__inner   { max-width: var(--max-w); margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "title button" "text button"; align-items: start; column-gap: 48px; row-gap: 6px; text-align: left; }
.kc-hp-soft-cta__title   { grid-area: title; font-size: var(--h3-size); font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0; }
.kc-hp-soft-cta__text    { grid-area: text; font-size: var(--card-text-lg); color: var(--kc-t-text, #444); line-height: 1.7; margin: 0; max-width: 560px; }
.kc-hp-soft-cta__actions { grid-area: button; align-self: center; justify-self: center; display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.kc-hp-soft-cta__btn     { white-space: nowrap; display: block; text-align: center; background: var(--navy); color: #fff; font-weight: 700; font-size: 15px; padding: 13px 32px; border-radius: 10px; text-decoration: none; transition: opacity .2s, background .2s; }
.kc-hp-soft-cta__btn:hover { opacity: .9; }
.kc-hp-soft-cta__btn--ghost { background: transparent; color: var(--navy); border: 1.5px solid var(--navy); padding: 11.5px 32px; }
.kc-hp-soft-cta__btn--ghost:hover { background: rgba(26,58,74,.06); opacity: 1; }
@media (max-width: 640px) { .kc-hp-soft-cta { padding: 40px 0; } .kc-hp-soft-cta__inner { grid-template-columns: 1fr; grid-template-areas: "title" "text" "button"; text-align: center; justify-items: center; row-gap: 10px; padding: 0 20px; } .kc-hp-soft-cta__actions { margin-top: 8px; } }

/* ── Section wrappers ──────────────────────────────────── */
.kc-hp-section        { padding: 80px 0; }
.kc-hp-section--white { background: #fff; }
.kc-hp-section--light { background: var(--light); }

.kc-hp-section-head            { text-align: center; margin: 0 auto 48px; max-width: 640px; }
.kc-hp-section-head .kc-hp-eyebrow { margin: 0 0 12px; }
.kc-hp-section-head h2         { font-size: clamp(22px, 2vw, var(--h2-size)); font-weight: 700; color: var(--text); margin: 0 0 14px; line-height: 1.3; padding-left: 0; border-left: none; }
.kc-hp-section-head p          { font-size: var(--base-size); font-weight: 400; color: var(--muted); line-height: 1.65; margin: 0; }

.kc-hp-more-link       { font-size: var(--card-text-lg); font-weight: 600; color: var(--teal); text-decoration: none; }
.kc-hp-more-link:hover { text-decoration: underline; }

/* ── Services grid ─────────────────────────────────────── */
.kc-hp-svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.kc-hp-svc-grid--2 { grid-template-columns: repeat(2, 1fr); }
/* When used inside page bodies (e.g. home-care-options), give the grid
   section spacing and stop the body link-hover effect on card links */
.kc-body .kc-hp-svc-grid { margin: 24px 0 48px; }
.kc-body a.kc-hp-svc-card { background-image: none; }
.kc-body a.kc-hp-svc-card:hover { background-size: unset; }

.kc-hp-svc-card { display: block; background: var(--kc-t-card, #fff); border: 1px solid var(--border); border-top: 3px solid var(--yellow); border-radius: 8px; padding: 28px 24px; text-decoration: none; color: inherit; transition: box-shadow .2s, transform .15s; }
.kc-hp-svc-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); }

.kc-hp-svc-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--yellow); border-radius: 10px; margin-bottom: 16px; color: var(--kc-t-on-primary, var(--text)); transition: transform .3s cubic-bezier(.34, 1.56, .64, 1); }
.kc-hp-svc-card:hover .kc-hp-svc-icon { transform: scale(1.1) rotate(4deg); }
.kc-hp-svc-card h2,
.kc-hp-svc-card h3,
.kc-hp-svc-card h4 { font-size: var(--sn-feature-title); font-weight: 700; color: var(--text); margin: 0 0 8px; line-height: 1.3; padding-left: 0; border-left: none; }
.kc-hp-svc-card ul { margin: 0 0 16px; padding-left: 18px; font-size: var(--card-text); color: var(--muted); line-height: 1.7; }
.kc-hp-svc-card ul li { margin: 0; }
.kc-hp-svc-card p  { font-size: var(--card-text); color: var(--muted); line-height: 1.6; margin: 0 0 16px; }
.kc-hp-svc-link    { font-size: var(--caption-size); font-weight: 600; color: var(--teal); }

/* ── About split ───────────────────────────────────────── */
.kc-hp-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.kc-hp-split__image { border-radius: 10px; overflow: hidden; aspect-ratio: 4/5; }
.kc-hp-split__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kc-hp-split__text h2  { font-size: clamp(22px, 2vw, var(--h2-size)); font-weight: 700; color: var(--text); margin: 0 0 16px; line-height: 1.3; padding-left: 0; border-left: none; }
.kc-hp-split__text > p { font-size: var(--sn-snippet-sub); line-height: 1.7; color: var(--muted); margin: 0 0 24px; }
.kc-hp-split__text > .kc-hp-split__btn { margin-top: 28px; }   /* the button under a home page story (core 1.0.171) */

/* Checklist alias — use .kc-checklist on new content */
.kc-hp-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.kc-hp-checklist li { font-size: var(--card-text-lg); color: var(--text); display: flex; align-items: flex-start; gap: 10px; line-height: 1.5; }
.kc-hp-checklist li::before { content: "✓"; display: flex; align-items: center; justify-content: center; min-width: 20px; width: 20px; height: 20px; background: var(--yellow); border-radius: 50%; font-size: var(--label-size); font-weight: 700; color: var(--kc-t-on-primary, var(--text)); margin-top: 2px; flex-shrink: 0; }

/* ── Video feature ─────────────────────────────────────── */
.kc-hp-video-feature { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.kc-hp-video-feature--alt .kc-hp-video-feature__media { order: -1; }
.kc-hp-video-feature__text h2  { font-size: clamp(22px, 2vw, var(--h2-size)); font-weight: 700; color: var(--text); margin: 0 0 16px; line-height: 1.3; padding-left: 0; border-left: none; }
.kc-hp-video-feature__text p   { font-size: var(--sn-snippet-sub); line-height: 1.7; color: var(--muted); margin: 0 0 14px; }
.kc-hp-video-feature__text p:last-child { margin-bottom: 0; }

/* Video wrap alias — use .kc-video-wrap on new content */
.kc-hp-video-wrap { border-radius: 10px; overflow: hidden; box-shadow: 0 8px 40px rgba(0,0,0,.1); background: #000; }
.kc-hp-video-wrap::after { content: ""; display: block; height: 4px; background: var(--yellow); }
.kc-hp-video-wrap video  { width: 100%; display: block; aspect-ratio: 16/9; object-fit: cover; }

/* ── Specialist care chips ─────────────────────────────── */
.kc-hp-spec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 820px; margin: 0 auto; }
.kc-hp-spec-item { display: block; padding: 14px 18px; background: var(--light); border: 1px solid var(--border); border-left: 3px solid var(--yellow); border-radius: 6px; font-size: var(--card-text-lg); font-weight: 500; color: var(--text); text-decoration: none; transition: background .15s; }
.kc-hp-spec-item:hover { background: var(--yellow-lt); }

/* ── CTA band ──────────────────────────────────────────── */
.kc-hp-cta-band { background: var(--yellow); border-top: 4px solid var(--yellow-dk); padding: 72px 0; text-align: center; }
.kc-hp-cta-band h2   { font-size: clamp(24px, 2.4vw, calc(var(--h2-size) + 6px)); font-weight: 700; color: var(--text); margin: 0 0 14px; line-height: 1.2; padding-left: 0; border-left: none; }
.kc-hp-cta-band p    { font-size: var(--base-size); color: rgba(0,0,0,.6); max-width: 520px; margin: 0 auto 32px; line-height: 1.65; }
.kc-hp-cta-band__btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 1100px) {
  .kc-hp-svc-grid { grid-template-columns: repeat(2, 1fr); }
  .kc-hp-hero__content { padding: 56px 40px 56px 32px; }
}
@media (max-width: 860px) {
  .kc-hp-hero { grid-template-columns: 1fr; }
  .kc-hp-hero__image { min-height: 300px; order: -1; }
  .kc-hp-hero__content { padding: 48px 24px 40px; }
  .kc-hp-hero__ctas { flex-direction: column; align-items: stretch; }
  .kc-hp-split,
  .kc-hp-video-feature { grid-template-columns: 1fr; gap: 36px; }
  .kc-hp-video-feature--alt .kc-hp-video-feature__media { order: 0; }
  .kc-hp-split__image { aspect-ratio: 16/9; }
  .kc-hp-spec-grid { grid-template-columns: repeat(2, 1fr); }
  .kc-hp-trust-item { padding: 10px 10px; }
}
@media (max-width: 560px) {
  .kc-hp-container { padding: 0 20px; }
  .kc-hp-svc-grid  { grid-template-columns: 1fr; }
  .kc-hp-spec-grid { grid-template-columns: 1fr; }
  .kc-hp-trust-bar__inner { flex-direction: column; }
  .kc-hp-trust-item { border-right: none; border-bottom: 1px solid var(--border); padding: 14px 24px; min-width: unset; }
  .kc-hp-trust-item:last-child { border-bottom: none; }
  .kc-hp-section { padding: 56px 0; }
  .kc-hp-cta-band { padding: 56px 0; }
  .kc-hp-cta-band__btns { flex-direction: column; align-items: stretch; }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
  .kc-card:hover { transform: none; }
  .kc-btn:hover  { transform: none; }
}

/* ============================================================
   ACCORDION  (.kc-accordion)
   Usage: wrap items in <div class="kc-accordion">, each item
   is <div class="kc-acc-item [kc-acc-open]">, with a
   <button class="kc-acc-trigger"> and <div class="kc-acc-panel">
   ============================================================ */
.kc-accordion {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 820px;
}
.kc-acc-item {
  border: 1px solid var(--kc-t-line, #e4e4e0);
  border-radius: 12px;
  overflow: hidden;
  background: var(--kc-t-card, #fff);
  transition: box-shadow .2s;
}
.kc-acc-item:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
}
.kc-acc-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  background: none;
  border: none;
  text-align: left;
  font-family: inherit;
  font-size: var(--card-text-lg);
  font-weight: 600;
  color: var(--navy, var(--navy));
  cursor: pointer;
  line-height: 1.4;
  transition: background .15s;
}
.kc-acc-trigger:hover {
  background: var(--kc-t-soft, #f9f9f7);
}
.kc-acc-item.kc-acc-open .kc-acc-trigger {
  color: var(--teal, var(--teal));
  background: var(--teal-lt);
}
.kc-acc-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid currentColor;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .25s, background .15s, color .15s;
  color: var(--teal, var(--teal));
}
.kc-acc-item.kc-acc-open .kc-acc-icon {
  transform: rotate(45deg);
  background: var(--teal, var(--teal));
  color: var(--kc-t-on-secondary, #fff);
}
.kc-acc-icon svg { display: block; }
.kc-acc-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.kc-acc-item.kc-acc-open .kc-acc-panel {
  max-height: 2000px;
}
.kc-acc-body {
  padding: 0 24px 22px;
  color: var(--kc-t-text, #444);
  line-height: 1.75;
  font-size: var(--card-text-lg);
}
.kc-acc-body p { margin: 0 0 12px; }
.kc-acc-body p:last-child { margin-bottom: 0; }
.kc-acc-body ul, .kc-acc-body ol { padding-left: 20px; margin: 0 0 12px; }
.kc-acc-body li { margin-bottom: 6px; }
.kc-acc-body strong { color: var(--kc-t-heading, var(--navy)); }

/* ── .kc-sn-map — Static Maps image (maps.googleapis.com/maps/api/staticmap)
   Applied to <img> tags; no JS required
   ─────────────────────────────────────────────────────────────────────────── */
.kc-sn-map {
  width: 100%;
  height: 220px;
  display: block;
  object-fit: cover;
  background: var(--border);
}
.kc-sn-map--sm {
  height: 150px;
  border-radius: 6px;
  margin-bottom: 12px;
}

/* ── [post] shortcode card ──────────────────────────────────────────────────
   Rendered by render_shortcode_post() — thumbnail + title link
   ─────────────────────────────────────────────────────────────────────────── */
.kc-post-card {
  display: inline-block;
  max-width: 320px;
  border-radius: 8px;
  border: 1px solid var(--border);
  overflow: hidden;
  text-decoration: none;
  vertical-align: top;
}
.kc-post-card__img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}
.kc-post-card__body {
  padding: 12px 14px 14px;
  background: #f9f9f7;
}
.kc-post-card__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.4;
}
.kc-body .kc-post-card__title { color: var(--navy); }

/* ── Story card reverse (image on right) ────────────────────────────────────── */
.kc-sn-story-card--reverse { flex-direction: row-reverse; }

/* ── Pledge card (yellow square icon + title + text) ───────────────────────── */
.kc-sn-pledge-card { background: var(--kc-t-soft, #f9f9f7); border-radius: 14px; padding: 28px 24px; }
.kc-sn-pledge-card__icon {
  width: 48px; height: 48px;
  background: var(--yellow); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.kc-sn-pledge-card__title { font-size: var(--base-size); font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0 0 10px; }
.kc-sn-pledge-card__text  { font-size: var(--card-text); color: var(--kc-t-muted, #555); line-height: 1.7; margin: 0; }

/* ── Birdie pill badges (SCHEDULE / CARE PLAN / NOTES etc) ─────────────────── */
.kc-sn-pill-badge {
  display: inline-block;
  background: var(--yellow); color: var(--kc-t-on-primary, var(--navy));
  font-weight: 700; font-size: 12px;
  padding: 3px 10px; border-radius: 999px;
  white-space: nowrap; flex-shrink: 0; margin-top: 2px;
}

/* ── Callout modifiers ───────────────────────────────────────────────────────
   Yellow variant + navy/dark panel
   ─────────────────────────────────────────────────────────────────────────── */
.kc-sn-callout--yellow {
  background: var(--yellow-lt);
  border-left-color: var(--yellow);
}
.kc-sn-callout--yellow .kc-sn-callout__title { color: var(--kc-t-heading, var(--navy)); }
.kc-sn-callout--yellow p { color: var(--kc-t-heading, var(--navy)); }

/* Navy documentary / feature panel */
.kc-sn-navy-panel {
  background: var(--navy);
  border-radius: 14px;
  padding: 32px;
  margin-bottom: 40px;
  color: #fff;
}
.kc-sn-navy-panel__title,
.kc-sn-navy-panel .kc-sn-navy-panel__title { font-size: 22px; color: var(--yellow); margin: 0 0 12px; border: none; padding: 0; }
.kc-sn-navy-panel__text,
.kc-sn-navy-panel .kc-sn-navy-panel__text  { font-size: 16px; line-height: 1.7; color: var(--border); margin: 0 0 16px; }
.kc-sn-navy-panel ul { font-size: var(--card-text-lg); line-height: 1.8; color: var(--border); margin: 0; padding-left: 20px; }
.kc-sn-navy-panel li strong { color: #fff; }

/* Simple tile (title + description, no icon) */
.kc-sn-tile { background: var(--teal-lt); border-radius: 12px; padding: 18px 20px; }
.kc-sn-tile__title { font-weight: 700; color: var(--teal); margin-bottom: 6px; font-size: var(--card-text-lg); }
.kc-sn-tile__text  { font-size: var(--card-text); line-height: 1.6; color: var(--kc-t-text, #333); margin: 0; }

/* ── Numbered steps ─────────────────────────────────────────────────────────
   Used by free-consultation and similar process pages
   ─────────────────────────────────────────────────────────────────────────── */
.kc-sn-steps { display: flex; flex-direction: column; gap: 20px; margin-bottom: 40px; }
.kc-sn-step  { display: flex; gap: 20px; align-items: flex-start; }
.kc-sn-step__num {
  flex-shrink: 0;
  width: 48px; height: 48px;
  background: var(--yellow);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 800; color: var(--kc-t-on-primary, var(--navy));
}
.kc-sn-step__title { font-size: var(--base-size); font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0 0 6px; }
.kc-sn-step__text  { font-size: var(--step-text, 15px); color: var(--kc-t-text, #444); line-height: 1.7; margin: 0; }

/* ── Pricing cards ──────────────────────────────────────────────────────────
   Used by home-care-costs and why-choose
   ─────────────────────────────────────────────────────────────────────────── */
.kc-sn-price-card {
  background: var(--kc-t-soft, #f9f9f7);
  border-radius: 14px;
  padding: 28px;
  text-align: center;
}
.kc-sn-price-card--featured { background: var(--teal); }
.kc-sn-price-card__label {
  font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; color: var(--teal); margin-bottom: 8px;
}
.kc-sn-price-card--featured .kc-sn-price-card__label { color: var(--border); }
.kc-sn-price-card__desc  { font-size: var(--caption-size); color: var(--kc-t-muted, #666); margin-bottom: 18px; line-height: 1.5; }
.kc-sn-price-card--featured .kc-sn-price-card__desc  { color: var(--border); }
.kc-sn-price-card__amount { font-size: 42px; font-weight: 800; color: var(--kc-t-heading, var(--navy)); line-height: 1; }
.kc-sn-price-card--featured .kc-sn-price-card__amount { color: var(--kc-t-on-secondary, #fff); }
.kc-sn-price-card__btn { display: inline-block; margin-top: 16px; padding: 10px 20px; border-radius: 10px; background: var(--navy); color: #fff !important; font-weight: 700; font-size: var(--btn-size, 15px); text-decoration: none !important; }   /* !important: over the body text's link colour */
.kc-sn-price-card__btn:hover { opacity: .9; }
.kc-sn-testimonial__avatar--photo { padding: 0; overflow: hidden; background: none; }
.kc-sn-testimonial__photo { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.kc-sn-testimonial__stars { color: var(--yellow-dk); font-size: 18px; letter-spacing: 2px; line-height: 1; margin: -4px 0 14px; }
.kc-sn-price-card--featured .kc-sn-price-card__btn { background: var(--kc-t-card, #fff); color: var(--teal) !important; }
.kc-sn-price-card__period { font-size: var(--caption-size); color: var(--kc-t-muted, #6f6f6f); margin-top: 4px; } /* WCAG AA contrast */
.kc-sn-price-card--featured .kc-sn-price-card__period { color: var(--border); }

/* ── Photo trio (3-col photo grid) ─────────────────────────────────────────── */
.kc-sn-photo-trio {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 40px;
}
.kc-sn-photo-trio figure { margin: 0; border-radius: 12px; overflow: hidden; }
.kc-sn-photo-trio img    { width: 100%; height: 160px; object-fit: cover; display: block; }
.kc-sn-photo-trio figcaption { padding: 8px 10px; font-size: 12px; color: var(--kc-t-muted, #666); background: var(--kc-t-soft, #f9f9f7); }

/* ── Partner / section badge (e.g. "SALT PARTNERSHIPS") ────────────────────── */
.kc-sn-partner-badge {
  display: inline-block;
  background: var(--teal); color: var(--kc-t-on-secondary, #fff);
  font-size: var(--label-size); font-weight: 700;
  padding: 4px 10px; border-radius: 6px;
  margin-bottom: 12px; letter-spacing: .5px; text-transform: uppercase;
}

/* ── Check list (✓ items on tinted cards) ───────────────────────────────────── */
.kc-sn-check-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 12px; margin-bottom: 40px;
  list-style: none; padding: 0; margin-left: 0;
}
/* Suppress the .kc-body ul li tick on check-list items (they have their own icons) */
.kc-sn-check-list li,
.kc-body .kc-sn-check-list li { padding-left: 0; margin-bottom: 0; }
.kc-sn-check-list li::before,
.kc-body .kc-sn-check-list li::before,
.kc-sn-check-list--dark li::before,
.kc-body .kc-sn-check-list--dark li::before { content: none; display: none; }
.kc-sn-check-item {
  display: flex; gap: 10px; align-items: flex-start;
  background: var(--kc-t-soft, #f9f9f7); border-radius: 12px; padding: 16px 18px;
}
.kc-sn-check-item--teal { background: var(--teal-lt); }
/* Wide variant — for sentence-length items (the Care Guides). The default
   minmax(200px) grid squeezes full sentences into skinny towers. */
.kc-sn-check-list--wide { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); }
.kc-sn-check-item__icon { color: var(--teal); flex-shrink: 0; margin-top: 1px; }
.kc-sn-check-item__text { font-size: var(--card-text-lg); color: var(--kc-t-text, #333); line-height: 1.5; }

/* ── Affiliation cards (logo + title + text) ────────────────────────────────── */
.kc-sn-affil-card {
  background: var(--kc-t-card, #fff); border: 1px solid var(--border);
  border-radius: 14px; padding: 28px 24px;
  display: flex; flex-direction: column; gap: 16px;
}
.kc-sn-affil-card__logo  { height: 60px; width: auto; max-width: 180px; object-fit: contain; display: block; }
.kc-sn-affil-card__title { font-size: 16px; font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0 0 8px; }
.kc-sn-affil-card__text  { font-size: var(--card-text); color: var(--kc-t-muted, #555); line-height: 1.65; margin: 0; }

/* ── CQC featured panel ─────────────────────────────────────────────────────── */
.kc-sn-cqc-panel {
  display: flex; gap: 36px; align-items: center;
  background: var(--teal-lt); border: 2px solid var(--teal);
  border-radius: 16px; padding: 32px 36px; margin-bottom: 32px; flex-wrap: wrap;
}
.kc-sn-cqc-panel__logo   { width: 180px; height: auto; display: block; flex-shrink: 0; }
.kc-sn-cqc-panel__body   { flex: 1; min-width: 220px; }
.kc-sn-cqc-panel__title  { font-size: 20px; font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0 0 8px; }
.kc-sn-cqc-panel__text   { font-size: var(--card-text-lg); color: var(--kc-t-text, #444); margin: 0 0 14px; }
.kc-sn-cqc-panel__badges { display: flex; flex-wrap: wrap; gap: 8px; }
.kc-sn-cqc-badge {
  background: var(--teal); color: var(--kc-t-on-secondary, #fff);
  padding: 4px 14px; border-radius: 999px;
  font-size: 13px; font-weight: 600;
}

/* ── FAQ Accordion ──────────────────────────────────────────────────────────── */
.kc-accordion { display: flex; flex-direction: column; gap: 10px; margin-bottom: 40px; }
.kc-acc-item  { border-radius: 14px; overflow: hidden; }
.kc-acc-trigger {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 22px; border: none; text-align: left; font-family: inherit;
  font-size: var(--card-text-lg); font-weight: 700; cursor: pointer; line-height: 1.4;
  background: var(--yellow); color: var(--kc-t-on-primary, var(--navy)); border-radius: 14px;
  transition: background .2s, border-radius .15s;
}
.kc-acc-item.kc-acc-open .kc-acc-trigger { border-radius: 14px 14px 0 0; }
.kc-acc-icon {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%;
  background: var(--kc-t-card, #fff); display: flex; align-items: center; justify-content: center;
  transition: transform .25s; box-shadow: 0 1px 4px rgba(0,0,0,.12);
}
.kc-acc-item.kc-acc-open .kc-acc-icon { transform: rotate(45deg); }
.kc-acc-panel { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
/* Full-width accordion for wide layouts (e.g. location landing pages) —
   overrides the default 820px reading-width cap. */
.kc-accordion--full { max-width: none; }
.kc-acc-body {
  background: var(--kc-t-card, #fff); border: 2px solid var(--yellow); border-top: none;
  border-radius: 0 0 14px 14px; padding: 20px 22px;
  font-size: var(--card-text-lg); color: var(--kc-t-text, #444); line-height: 1.75;
}
.kc-acc-body p { margin: 0 0 10px; }
.kc-acc-body p:last-child { margin: 0; }
.kc-acc-body ul, .kc-acc-body ol { padding-left: 20px; margin: 0 0 10px; }
.kc-acc-body li  { margin-bottom: 6px; }
.kc-acc-body a   { color: var(--teal); }
.kc-acc-body strong { color: var(--kc-t-heading, var(--navy)); }

/* ── Contact form ───────────────────────────────────────────────────────────── */
.kc-sn-contact-form { background: #f9f9f7; border-radius: 16px; padding: 36px 40px; }
.kc-sn-form-row {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 20px; margin-bottom: 20px;
}
.kc-sn-form-group  { margin-bottom: 20px; }
.kc-sn-form-label  { display: block; font-size: var(--form-label); font-weight: 600; margin-bottom: 6px; color: var(--kc-t-heading, var(--navy)); }
.kc-required       { color: #c00; }
.kc-sn-form-input,
.kc-sn-form-select,
.kc-sn-form-textarea {
  width: 100%; padding: 12px 16px;
  border: 1px solid var(--kc-t-line, #ddd); border-radius: 10px;
  font-size: var(--form-input); background: var(--kc-t-card, #fff); color: var(--kc-t-text, FieldText); box-sizing: border-box; font-family: inherit;
}
.kc-sn-form-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}
.kc-sn-form-textarea   { resize: vertical; }
.kc-sn-form-privacy    { font-size: var(--caption-size); color: var(--kc-t-muted, #555); line-height: 1.65; margin-bottom: 14px; }
.kc-sn-form-checkbox   { display: flex; align-items: flex-start; gap: 10px; font-size: var(--form-label); cursor: pointer; margin-bottom: 24px; }
.kc-sn-form-checkbox input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--teal); flex-shrink: 0; }
.kc-sn-form-msg        { display: none; padding: 12px 16px; border-radius: 8px; font-size: var(--form-label); margin-bottom: 16px; }
.kc-sn-form-submit {
  width: 100%; padding: 14px;
  background: var(--yellow); border: none; border-radius: 10px;
  font-size: calc(var(--btn-size) + 1px); font-weight: 700; cursor: pointer; color: var(--kc-t-on-primary, var(--text));
  transition: opacity .2s; font-family: inherit;
}
.kc-sn-form-submit:hover { opacity: .9; }

/* ============================================================
   CAREERS — NEW COMPONENT CLASSES
   ============================================================ */

/* Image hero (photo + gradient overlay) */
.kc-sn-img-hero { position:relative;border-radius:16px;overflow:hidden;margin-bottom:48px; }
.kc-sn-img-hero img { width:100%;max-height:420px;object-fit:cover;display:block;object-position:center top; }
.kc-sn-img-hero__overlay { position:absolute;inset:0;background:linear-gradient(to top,color-mix(in srgb, var(--kc-t-shade, #1a3a4a) 82%, transparent) 40%,color-mix(in srgb, var(--kc-t-shade, #1a3a4a) 15%, transparent) 100%);display:flex;align-items:flex-end;padding:36px; }
.kc-sn-img-hero__title,
.kc-sn-img-hero .kc-sn-img-hero__title,
.kc-sn-img-hero__overlay .kc-sn-img-hero__title,
.kc-body .kc-sn-img-hero__title { font-size:clamp(22px,4vw,34px);font-weight:800;color:#fff;margin:0 0 4px;line-height:1.15;border:none;padding:0; }
.kc-sn-img-hero__title--accent,
.kc-sn-img-hero .kc-sn-img-hero__title--accent,
.kc-sn-img-hero__overlay .kc-sn-img-hero__title--accent { color:var(--yellow); }

/* 2-col photo duo */
.kc-sn-photo-duo { display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:48px; }
.kc-sn-photo-duo figure { margin:0;border-radius:12px;overflow:hidden; }
.kc-sn-photo-duo img { width:100%;height:260px;object-fit:cover;display:block; }
.kc-sn-photo-duo figcaption { font-size:var(--caption-size);color:var(--kc-t-muted, #666);padding:10px 14px;background:var(--kc-t-soft, #f9f9f7); }
.kc-sn-cta--navy { background:var(--navy); }
.kc-sn-cta--navy .kc-sn-cta__title,
.kc-body .kc-sn-cta--navy .kc-sn-cta__title { color:#fff; }
.kc-sn-cta--navy .kc-sn-cta__sub,
.kc-body .kc-sn-cta--navy .kc-sn-cta__sub { color:rgba(255,255,255,.8); }

/* CTA action buttons */
.kc-sn-cta__btn { display:inline-flex;align-items:center;gap:8px;padding:13px 30px;border-radius:10px;font-weight:700;font-size:var(--btn-size);text-decoration:none;background:var(--navy);color:#fff;transition:opacity .2s; }
.kc-sn-cta__btn:hover { opacity:.88; }
.kc-sn-cta__btn--ghost { background:transparent;border:2px solid rgba(0,0,0,.2);color:var(--kc-t-heading, var(--navy)); }
.kc-sn-cta--navy .kc-sn-cta__btn { background:var(--yellow);color:var(--kc-t-on-primary, var(--text)); }
.kc-sn-cta--navy .kc-sn-cta__btn--ghost { background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff; }

/* Check list on dark (navy) background */
.kc-sn-check-list--dark { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px, 100%), 1fr));gap:12px;list-style:none;margin:0;padding:0; }
.kc-sn-check-list--dark li { display:flex;gap:12px;align-items:flex-start; }
.kc-sn-check-list--dark .kc-sn-check-item__text { font-size:var(--card-text-lg);color:var(--border);line-height:1.5; }
.kc-sn-check-list--dark small { font-size: var(--caption-size);color:var(--muted);display:block;margin-top:14px; }

/* Sub-link grid (larger link cards) */
.kc-sn-sublink-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px, 100%), 1fr));gap:12px; }
.kc-sn-sublink-grid a { display:block;background:var(--kc-t-soft, #f9f9f7);border-radius:10px;padding:16px 18px;text-decoration:none;color:var(--teal);font-weight:600;font-size: var(--card-text);border:1px solid var(--border); }

/* Utility inline buttons (for use inside callouts, panels) */
.kc-sn-btn { display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:8px;font-weight:700;font-size:var(--btn-size-sm);text-decoration:none; }
.kc-sn-btn--teal { background:var(--teal);color:var(--kc-t-on-secondary, #fff); }
.kc-sn-btn--navy { background:var(--navy);color:#fff; }
.kc-sn-btn--yellow { background:var(--yellow);color:var(--kc-t-on-primary, var(--text)); }
.kc-sn-btn--ghost-teal { background:var(--kc-t-card, #fff);color:var(--teal);border:2px solid var(--teal); }
.kc-sn-btn--ghost-navy { background:var(--kc-t-card, #fff);color:var(--navy);border:2px solid var(--navy); }
.kc-sn-btn--ghost-light { background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25); }
.kc-sn-btn--lg { padding:14px 32px;font-size:var(--btn-size);border-radius:10px; }

/* Profile card (Meet Our CareGivers) */
.kc-sn-profile-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px, 100%), 1fr));gap:24px;margin-bottom:56px; }
.kc-sn-profile-card { display:flex;flex-direction:column;border-radius:14px;overflow:hidden;background:var(--kc-t-soft, #f9f9f7);border:1px solid var(--border);text-decoration:none;color:inherit; }
.kc-sn-profile-card__img { height:240px;overflow:hidden;background:var(--teal-lt); }
.kc-sn-profile-card__img img { width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .3s; }
.kc-sn-profile-card:hover .kc-sn-profile-card__img img { transform:scale(1.03); }
.kc-sn-profile-card__body { padding:18px 20px;flex:1;display:flex;flex-direction:column; }
.kc-sn-profile-card__role { font-size:var(--label-size);font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.7px;margin-bottom:6px; }
.kc-sn-profile-card__name,
.kc-body .kc-sn-profile-card__name { font-size: var(--h4-size);font-weight:700;color:var(--kc-t-heading, var(--navy));margin:0 0 8px;border:none;padding:0; }
.kc-sn-profile-card__text { font-size: var(--caption-size);color:var(--kc-t-muted, #666);line-height:1.65;margin:0 0 14px;flex:1; }
.kc-sn-profile-card__link { font-size: var(--caption-size);font-weight:600;color:var(--teal); }

/* Stats banner (navy strip with headline stats) */
.kc-sn-stats-banner { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px, 100%), 1fr));background:var(--navy);border-radius:14px;overflow:hidden;margin-bottom:48px; }
.kc-sn-stats-banner__item { padding:22px 24px;border-right:1px solid rgba(255,255,255,.1);text-align:center; }
.kc-sn-stats-banner__item:last-child { border-right:none; }
.kc-sn-stats-banner__value { font-size:26px;font-weight:800;color:var(--yellow);margin-bottom:4px; }
.kc-sn-stats-banner__label { font-size: var(--caption-size);color:rgba(255,255,255,.7); }

/* FAQ <details> accordion (careers — CSS-only, no JS) */
.kc-faq { display:flex;flex-direction:column;gap:12px;margin-bottom:48px; }
.kc-faq-item { background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden; }
.kc-faq-item summary { padding:18px 22px;font-size:var(--card-text-lg);font-weight:700;color:var(--navy);cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px; }
.kc-faq-item summary::-webkit-details-marker { display:none; }
.kc-faq-item__body { padding:18px 22px 20px;font-size:var(--card-text);line-height:1.75;color:#555;border-top:1px solid var(--light); }

/* Full-width photo (no caption, used in employer-of-the-year) */
.kc-sn-photo-full { border-radius:16px;overflow:hidden;margin-bottom:48px; }
.kc-sn-photo-full img { width:100%;height:420px;object-fit:cover;object-position:center;display:block; }

/* Portrait photo trio (aspect-ratio: 3/4) */
.kc-sn-photo-trio--portrait figure { aspect-ratio:3/4; }
.kc-sn-photo-trio--portrait img { width:100%;height:100%;object-fit:cover;object-position:top;display:block; }

/* ============================================================
   SHORTCODES — classes for PHP-rendered shortcode output
   ============================================================ */

/* Form wrapper card */
.kc-sn-form-wrap { background:var(--kc-t-soft, #f9f9f7); border-radius:16px; padding:36px 40px; }
/* Intro + "call us" side by side above the form, so there is less to scroll past to reach it. Falls back to one column when narrow or if only one is present. */
.kc-sn-form-top { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:20px; align-items:stretch; margin-bottom:28px; }
.kc-sn-form-top > .kc-sn-form-intro, .kc-sn-form-top > .kc-sn-form-callus { margin-bottom:0; }
.kc-sn-form-top > .kc-sn-form-callus { display:flex; flex-direction:column; justify-content:center; }

/* Form intro callout (teal-left-border panel above form fields) */
.kc-sn-form-intro { margin-bottom:28px; padding:20px 24px; background:var(--teal-lt); border-radius:12px; border-left:4px solid var(--teal); }
.kc-sn-form-intro__title    { font-size:var(--h4-size); font-weight:700; color:var(--kc-t-heading, var(--navy)); margin:0 0 4px; }
.kc-sn-form-intro__subtitle { font-size:var(--h4-size); font-weight:700; color:var(--kc-t-heading, var(--navy)); margin:0 0 12px; }
.kc-sn-form-intro__body     { font-size:var(--card-text-lg); color:var(--kc-t-text, #333); line-height:1.65; margin:0 0 10px; }
.kc-sn-form-intro__small    { font-size:var(--caption-size); color:var(--kc-t-muted, #555); line-height:1.6; margin:0; }

/* "Rather call us?" block above the contact form */
.kc-sn-form-callus          { text-align:center; margin-bottom:28px; padding:18px 22px; background:var(--kc-t-card, #fff); border:1px solid var(--border); border-radius:12px; }
.kc-sn-form-callus__title   { display:flex; align-items:center; justify-content:center; gap:8px; font-weight:700; color:var(--kc-t-heading, var(--navy)); font-size:var(--card-text-lg); margin:0 0 12px; }
.kc-sn-form-callus__ico     { color:var(--teal); flex-shrink:0; }
.kc-sn-form-callus__nums    { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.kc-sn-form-callus__num     { display:inline-flex; flex-direction:column; align-items:center; gap:1px; background:var(--yellow,var(--yellow)); border-radius:12px; padding:9px 26px; text-decoration:none; transition:background .15s; }
.kc-sn-form-callus a.kc-sn-form-callus__num { color:var(--kc-t-heading, var(--navy)); }
.kc-sn-form-callus__num:hover { background:var(--yellow-dk,var(--yellow-dk)); }
.kc-sn-form-callus__digits  { font-size:20px; font-weight:800; letter-spacing:.01em; line-height:1.2; }
.kc-sn-form-callus__area    { font-size:12px; font-weight:600; color:var(--text); }
.kc-sn-form-callus__note    { font-size:var(--caption-size); color:var(--muted); margin:14px 0 0; }
.kc-sn-form-callus a.kc-sn-form-callus__note-link, .kc-sn-form-callus__note a { color:var(--teal); font-weight:600; }

/* Essential requirements block (bordered white box) */
.kc-sn-form-reqs           { margin-bottom:20px; padding:18px 20px; background:var(--kc-t-card, #fff); border:1px solid var(--kc-t-line, #e0e0e0); border-radius:10px; }
.kc-sn-form-reqs__title    { font-size:var(--form-label); font-weight:600; color:var(--kc-t-heading, var(--navy)); margin:0 0 14px; }

/* Compact checkbox option (inline preference groups) */
.kc-sn-form-check-opt       { display:flex; align-items:center; gap:8px; font-size:var(--form-label); cursor:pointer; margin-bottom:8px; }
.kc-sn-form-check-opt input { width:16px; height:16px; accent-color:var(--teal); flex-shrink:0; }
/* Horizontal flex row for a small group of checkboxes */
.kc-sn-form-check-row { display:flex; flex-wrap:wrap; gap:20px; }

/* 2-col grid for checkbox preference groups */
.kc-sn-form-check-2col { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:28px; }

/* Fine print below form */
.kc-sn-form-small { font-size:12px; color:var(--kc-t-muted, #777); line-height:1.6; margin-bottom:24px; }

/* Message state modifiers */
.kc-sn-form-msg--error   { display:block; background:#fef2f2; color:#b91c1c; }
/* A problem shown under its own box (core 1.0.186) */
#kc-contact-form p.kc-sn-form-err, .kc-sn-form-err { margin: 6px 0 0; color: #b91c1c; font-size: var(--form-label); }
.kc-sn-form-input[aria-invalid="true"], .kc-sn-form-textarea[aria-invalid="true"], .kc-sn-form-select[aria-invalid="true"] { border-color: #b91c1c; }
.kc-sn-form-msg--success { display:block; background:#f0fdf4; color:#15803d; }

/* Form success replacement state */
.kc-sn-form-success        { text-align:center; padding:48px 20px; }
.kc-sn-form-success__icon  { display:block; margin:0 auto 16px; }
.kc-sn-form-success__title { font-size:21px; font-weight:700; color:var(--kc-t-heading, var(--navy)); margin:0 0 10px; }
.kc-sn-form-success__text  { color:#555; font-size:var(--card-text-lg); line-height:1.6; margin:0; }

/* ── Related posts under news articles ─────────────────────── */
.kc-related {
  max-width: var(--max-w);
  margin: 44px auto 56px;
  padding: 0 20px;
}
.kc-related__heading {
  font-size: 20px;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 6px;
}
.kc-related__heading::after {
  content: '';
  display: block;
  width: 36px;
  height: 3px;
  background: var(--yellow);
  border-radius: 2px;
  margin-top: 8px;
}
.kc-related__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--gap);
  margin-top: 18px;
}
.kc-related__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  transition: box-shadow var(--ease), transform var(--ease);
}
.kc-related__card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.kc-related__img {
  width: 100%;
  height: auto;               /* width/height attributes must not force the pixel height */
  aspect-ratio: 16 / 10 !important;
  object-fit: cover;
  display: block;
}
.kc-related__img--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--teal-lt);
  color: var(--teal);
}
.kc-related__body {
  display: block;
  padding: 14px 16px 16px;
}
.kc-related__date {
  display: block;
  font-size: var(--caption-size);
  color: var(--muted);
  margin-bottom: 4px;
}
.kc-related__title {
  display: block;
  font-size: var(--card-text-lg);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
}
.kc-related__card:hover .kc-related__title { color: var(--teal); }
/* A hint under a form question, such as "For example, Margaret, aged 82" (core 1.0.72) */
.kc-sn-form-hint { font-size: var(--caption-size, 13px); color: var(--muted); margin: 6px 2px 0; }
/* A line or two about the post under its title, in the [news] grid (core 1.0.72) */
.kc-related__excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
  margin: 6px 0 0; font-size: var(--card-text, .9rem); line-height: 1.5; color: var(--muted); }

/* Idle state (no query entered yet) */
.kc-search-idle {
  text-align: center;
  padding: 28px 20px;
  color: #aaa;
  font-size: 14px;
  line-height: 1.7;
}

/* Lock body scroll when overlay open */
body.kc-search-open { overflow: hidden; }

/* ─────────────────────────────────────────────────────────────
   Care quiz  ([care-quiz] shortcode — logic in site.js)
───────────────────────────────────────────────────────────── */
.kc-quiz {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 36px 40px 32px;
  margin-bottom: 48px;
}
.kc-quiz-badge {
  display: inline-block;
  padding: 5px 14px;
  background: var(--yellow);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: .6px;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.kc-quiz-title { font-size: 24px; font-weight: 800; color: var(--navy); margin: 0 0 10px; line-height: 1.25; }
.kc-quiz-sub   { font-size: var(--card-text-lg); color: #666; line-height: 1.7; margin: 0 0 22px; }
.kc-quiz-progress {
  height: 6px;
  background: var(--teal-lt);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 26px;
}
.kc-quiz-progress__bar {
  height: 100%;
  width: 0;
  background: var(--teal);
  border-radius: 3px;
  transition: width .25s ease;
}
.kc-quiz-q    { font-size: var(--h4-size); font-weight: 700; color: var(--navy); margin: 0 0 6px; }
.kc-quiz-note { font-size: var(--caption-size); color: #888; margin: 0 0 14px; }
.kc-quiz-opts {
  /* Two tidy columns at full width, stacking on narrow screens */
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 14px 0 22px;
}
@media (max-width: 680px) {
  .kc-quiz-opts { grid-template-columns: 1fr; }
}
.kc-quiz-opt {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: left;
  padding: 14px 16px;
  background: #f9f9f7;
  border: 2px solid var(--border);
  border-radius: 12px;
  font-size: 15px;
  color: #444;
  line-height: 1.5;
  cursor: pointer;
  font-family: inherit;
  transition: border-color .12s, background .12s;
}
.kc-quiz-opt:hover { border-color: var(--teal); background: #fff; }
.kc-quiz-opt--on   { border-color: var(--teal); background: var(--teal-lt); color: var(--navy); font-weight: 600; }
.kc-quiz-opt__check {
  flex-shrink: 0;
  width: 20px; height: 20px;
  border: 2px solid var(--border);
  border-radius: 50%;
  background: #fff;
  position: relative;
}
.kc-quiz-opt--on .kc-quiz-opt__check { border-color: var(--teal); background: var(--teal); }
.kc-quiz-opt--on .kc-quiz-opt__check::after {
  content: '';
  position: absolute;
  left: 5px; top: 2px;
  width: 5px; height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.kc-quiz-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.kc-quiz-back {
  background: none;
  border: none;
  color: #666;
  font-size: 14px;
  cursor: pointer;
  padding: 10px 6px;
  font-family: inherit;
}
.kc-quiz-back:hover { color: var(--navy); }
.kc-quiz-hint { font-size: var(--caption-size); color: #aaa; }
.kc-quiz-next {
  padding: 12px 26px;
  background: var(--yellow);
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  cursor: pointer;
  font-family: inherit;
}
.kc-quiz-next:hover { background: var(--yellow-dk); }
.kc-quiz-next:disabled { opacity: .45; cursor: not-allowed; }
.kc-quiz-result__kicker {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--teal);
  margin: 0 0 8px;
}
.kc-quiz-result__title { font-size: 26px; font-weight: 800; color: var(--navy); margin: 0 0 10px; }
.kc-quiz-result__blurb { font-size: var(--card-text-lg); color: #444; line-height: 1.75; margin: 0 0 20px; }
.kc-quiz-result__ctas  { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.kc-quiz-result__go {
  display: inline-block;
  padding: 13px 26px;
  background: var(--yellow);
  color: var(--text);
  font-weight: 700;
  font-size: 15px;
  border-radius: 10px;
  text-decoration: none;
}
.kc-quiz-result__go:hover { background: var(--yellow-dk); }
.kc-quiz-result__read {
  display: inline-block;
  padding: 13px 26px;
  background: var(--teal-lt);
  color: var(--teal);
  font-weight: 700;
  font-size: 15px;
  border-radius: 10px;
  text-decoration: none;
  border: 1px solid var(--border);
}
.kc-quiz-result__urgency { font-size: var(--card-text); color: #666; margin: 0 0 6px; }
.kc-quiz-result__also    { font-size: var(--card-text); color: #666; margin: 0 0 14px; }
.kc-quiz-result__also a  { color: var(--teal); font-weight: 600; }
.kc-quiz-result__guides {
  background: var(--teal-lt);
  border-radius: 12px;
  padding: 18px 22px;
  margin: 0 0 16px;
}
.kc-quiz-result__guides-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--teal);
  margin: 0 0 10px;
}
.kc-quiz-result__guides ul { list-style: none; margin: 0; padding: 0; }
.kc-quiz-result__guides li,
.kc-body .kc-quiz-result__guides li {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
  padding-left: 0;
  margin-bottom: 8px;
}
.kc-quiz-result__guides li::before,
.kc-body .kc-quiz-result__guides li::before { content: none; display: none; }
.kc-quiz-result__guides li:last-child { margin-bottom: 0; }
.kc-quiz-result__guides a { color: var(--teal); font-weight: 700; }
.kc-quiz-result__small   { font-size: 12px; color: #999; line-height: 1.7; margin: 0; border-top: 1px solid #f0f0ec; padding-top: 14px; }
.kc-quiz-restart {
  background: none;
  border: none;
  color: var(--teal);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  font-family: inherit;
  text-decoration: underline;
}
/* The quiz renders inside .kc-body, whose animated-underline link rule
   (.kc-body a:not(...)) outguns the CTA classes — it re-colours the text,
   adds the gradient underline, and crushes padding-bottom to 1px. Same
   neutralising pattern as .kc-hp-svc-card. */
.kc-body a.kc-quiz-result__go,
.kc-body a.kc-quiz-result__read {
  background-image: none;
  padding-bottom: 13px;
}
.kc-body a.kc-quiz-result__go        { color: var(--text); }
.kc-body a.kc-quiz-result__go:hover  { color: var(--text); background-size: unset; }
.kc-body a.kc-quiz-result__read:hover { color: var(--teal-dk); background-size: unset; }
@media (max-width: 600px) {
  .kc-quiz { padding: 24px 20px; }
  .kc-quiz-title { font-size: 20px; }
} 
/* ── Dropdown link descriptions ─────────────────────────────────────────
   Optional small line under a menu link, set per item in
   Admin → Navigation. Rendered by nav_link_inner() in index.php. */
.kc-dd-label { display: block; }
.kc-dd-desc {
  display: block;
  white-space: normal;
  max-width: 250px;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.45;
  color: var(--muted);
}

@media (max-width: 960px) {
  .kc-dd-desc { font-size: 11px; max-width: none; }
}

/* ── Printable guides ───────────────────────────────────────────────────
   Guide pages (under /care-guides in the nav) get a "Print this guide"
   button — kc_print_elements() in index.php — and every page prints
   ink-friendly: chrome hidden, navy blocks flattened to black-on-white. */
.kc-print-bar { display: flex; justify-content: flex-end; margin: 0 0 18px; }
/* Print button in the section sidebar: full-width, sits under the heading */
.kc-snav-print { margin: 0 0 14px; }
.kc-snav-print .kc-print-btn { width: 100%; justify-content: center; }
.kc-print-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 16px;
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: inherit; font-size: 14px; font-weight: 600;
  color: var(--navy); cursor: pointer;
  transition: background var(--ease), border-color var(--ease);
}
.kc-print-btn:hover { background: var(--yellow); border-color: var(--yellow); }
.kc-print-footer { display: none; }

@page { margin: 16mm; }

@media print {
  /* Site chrome, interactive and sticky elements: gone */
  .kc-topbar, .kc-header, .kc-footer, .kc-section-nav, .kc-print-bar,
  #kc-admin-bar, #kc-cookie-banner, #kc-cc-bar, #kc-cc-panel, #kc-cc-float, #kc-chat-btn, #kc-chat-fab, #kc-chat-panel,
  #kc-search-overlay, #kc-brochure-modal,
  .kc-burger, .kc-nav-close, .kc-sn-cta, .kc-quiz { display: none !important; }

  body { background: #fff !important; color: #000; }
  .kc-main { padding: 0; max-width: none; }
  .kc-page-with-sidebar { display: block; }
  .kc-page-body { max-width: none !important; }

  /* Page hero: keep the title, drop the artwork */
  .kc-page-hero, .kc-page-hero--image { background: none !important; min-height: 0; padding: 0 0 4mm; }
  .kc-page-hero__bg, .kc-page-hero-overlay { display: none !important; }
  .kc-page-hero h1 { color: #000 !important; text-shadow: none; }

  /* Snippet blocks: flatten to black-on-white */
  .kc-sn-hero { background: none !important; padding: 0 0 4mm; }
  .kc-sn-hero::before, .kc-sn-hero::after { display: none !important; }
  .kc-sn-hero__title { color: #000 !important; }
  .kc-sn-hero__sub   { color: #333 !important; }
  .kc-sn-hero__badge { background: none !important; border: 1px solid #000; color: #000 !important; }
  .kc-sn-navy-panel, .kc-sn-navy-box, .kc-sn-stats-banner { background: none !important; border: 1px solid #999; }
  .kc-sn-navy-panel *, .kc-sn-navy-box *, .kc-sn-stats-banner * { color: #000 !important; }

  /* Keep cards and steps whole across page breaks */
  .kc-sn-callout, .kc-sn-feature-card, .kc-sn-step, .kc-sn-check-item,
  .kc-acc-item, .kc-faq-item { break-inside: avoid; }

  /* FAQ accordions: print every answer expanded */
  .kc-acc-panel { max-height: none !important; display: block !important; }
  .kc-faq-item[open], .kc-faq-item { display: block; }
  .kc-faq-item .kc-faq-item__body { display: block !important; }

  /* Links: plain black underline, no gradient effects */
  .kc-body a { color: #000 !important; background: none !important; text-decoration: underline; }

  .kc-print-footer {
    display: block;
    margin-top: 10mm; padding-top: 3mm;
    border-top: 1px solid #000;
    font-size: 11px; color: #000;
  }
}

/* ── Branded print letterhead ───────────────────────────────────────────
   Emitted by kc_print_elements() on guide pages: logo + contact line
   over a yellow brand rule. Hidden on screen, shown only on paper. */
.kc-print-head { display: none; }

@media print {
  .kc-print-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 5mm;
    margin-bottom: 7mm;
    border-bottom: 3px solid var(--yellow);
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  /* .kc-body img (specificity 0,1,1) beats a single class — must out-specify it */
  .kc-body .kc-print-head__logo { height: 40px; width: auto; max-width: 200px; border-radius: 0; margin: 0; }
  .kc-print-head__name {
    font-size: 24px; font-weight: 800; letter-spacing: .04em;
    color: var(--navy);
  }
  .kc-print-head__contact {
    font-size: 12px; font-weight: 600; line-height: 1.6;
    color: var(--navy); text-align: right;
  }

  /* Brand the type: navy headings rather than flat black */
  .kc-page-hero h1, .kc-sn-hero__title,
  .kc-body h1, .kc-body h2, .kc-body h3,
  .kc-sn-section-title { color: var(--navy) !important; }
  .kc-sn-hero__badge { border-color: var(--navy); color: var(--navy) !important; }

  /* Teal accents survive via borders (backgrounds don't print) */
  .kc-sn-callout { border-left: 4px solid var(--teal); }

  /* Footer joins the letterhead: yellow rule, navy text */
  .kc-print-footer {
    border-top: 3px solid var(--yellow) !important;
    color: var(--navy) !important;
    font-weight: 600;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

@media print {
  /* The letterhead must be the first thing on the page — when present,
     drop the page-title hero above it (the guide's own styled title
     inside the content serves as the heading). */
  body:has(.kc-print-head) .kc-page-hero { display: none !important; }
}

/* ===== Block builder (compiled post/page blocks) ===== */
.kc-blk { margin: 0 0 34px; }
.kc-blk:last-child { margin-bottom: 0; }
.kc-blk-fullimg img { max-width: 100%; height: auto; border-radius: 14px; display: block; margin: 0 auto; }
/* Full-width image with its own shape on phones (core 1.0.78) */
@media (max-width: 640px) {
  .kc-blk-fullimg--mcrop img { width: 100%; aspect-ratio: var(--kc-m-ar) !important; object-fit: cover; object-position: var(--kc-m-focus, 50% 50%); }
}
.kc-blk-btnwrap--center { text-align: center; }
.kc-blk-imgtext { display: grid; gap: 30px; align-items: center; }
.kc-blk-imgtext--vtop { align-items: start; }
.kc-blk-imgtext--vmiddle { align-items: center; }
.kc-blk-imgtext--vbottom { align-items: end; }
.kc-blk-imgtext__media img { max-width: 100%; height: auto; border-radius: 14px; display: block; }
.kc-blk-imgtext--half { grid-template-columns: 1fr 1fr; }
.kc-blk-imgtext--third { grid-template-columns: 1fr 2fr; }
.kc-blk-imgtext--half.kc-blk-imgtext--right .kc-blk-imgtext__media { order: 2; }
.kc-blk-imgtext--third.kc-blk-imgtext--right { grid-template-columns: 2fr 1fr; }
.kc-blk-imgtext--third.kc-blk-imgtext--right .kc-blk-imgtext__media { order: 2; }
.kc-blk-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.kc-blk-gallery--grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.kc-blk-gallery--grid .kc-blk-gallery__item { flex: 1 1 170px; max-width: 220px; }
.kc-blk-gallery--grid .kc-blk-gallery__item img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 10px; display: block; }
/* Gallery lightbox: click a gallery image to view it larger, click anywhere (or Esc) to close */
.kc-blk-gallery img { cursor: zoom-in; }

/* External links (added automatically to links pointing off-site) get a small
   "opens in a new tab" icon so people know before they click. */
.kc-extlink::after {
  content: "";
  display: inline-block;
  width: .72em;
  height: .72em;
  margin-left: .28em;
  vertical-align: -0.05em;
  background-color: currentColor;
  opacity: .7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2.4'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6'/%3E%3Cpolyline%20points='15%203%2021%203%2021%209'/%3E%3Cline%20x1='10'%20y1='14'%20x2='21'%20y2='3'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2.4'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6'/%3E%3Cpolyline%20points='15%203%2021%203%2021%209'/%3E%3Cline%20x1='10'%20y1='14'%20x2='21'%20y2='3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kc-extlink:has(img)::after { content: none; }
.kc-lightbox { position: fixed; inset: 0; z-index: 9600; background: rgba(0,0,0,.85); display: none; align-items: center; justify-content: center; padding: 24px; cursor: zoom-out; }
.kc-lightbox.kc-lightbox--on { display: flex; }
.kc-lightbox img { max-width: 100%; max-height: 100%; border-radius: 8px; box-shadow: 0 12px 48px rgba(0,0,0,.55); }
.kc-blk-gallery--masonry { column-count: 3; column-gap: 12px; }
.kc-blk-gallery--masonry .kc-blk-gallery__item { break-inside: avoid; margin-bottom: 12px; }
.kc-blk-gallery--masonry .kc-blk-gallery__item img { width: 100%; height: auto; border-radius: 10px; display: block; }
@media (max-width: 760px) { .kc-blk-gallery--masonry { column-count: 2; } }
.kc-blk-video__frame { position: relative; padding-top: 56.25%; border-radius: 14px; overflow: hidden; background: #000; }
.kc-blk-video__frame iframe, .kc-blk-video__frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.kc-blk-file { display: inline-flex; align-items: center; gap: 14px; background: var(--teal-lt); border: 1px solid var(--border); border-radius: 12px; padding: 16px 20px; text-decoration: none; color: var(--navy); }
.kc-blk-file:hover { background: var(--yellow-lt); }
.kc-blk-file__ic { width: 40px; height: 40px; border-radius: 10px; background: var(--teal); color: var(--kc-t-on-secondary, #fff); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.kc-blk-file__t { display: flex; flex-direction: column; } .kc-blk-file__t strong { font-size: 15px; } .kc-blk-file__t small { font-size: 12px; color: var(--muted); }
hr.kc-blk-hr { border: 0; border-top: 1px solid var(--border); }
@media (max-width: 640px) {
  .kc-blk-imgtext, .kc-blk-imgtext--half, .kc-blk-imgtext--third,
  .kc-blk-imgtext--third.kc-blk-imgtext--right, .kc-blk-cols { grid-template-columns: 1fr; }
  .kc-blk-imgtext--right .kc-blk-imgtext__media { order: 0 !important; }
}

/* ===== Post tag chips (link to /news/tag/{slug}) ===== */
.kc-post-tags { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:6px 0 30px; }
.kc-post-tags__label { font-size:13px; font-weight:700; color:var(--navy); margin-right:2px; }
.kc-tag-chip { display:inline-block; padding:5px 12px; background:var(--teal-lt); border:1px solid var(--border); border-radius:999px; font-size:13px; font-weight:600; color:var(--teal); text-decoration:none; transition:background .15s, border-color .15s, color .15s; }
.kc-tag-chip:hover, .kc-tag-chip:focus { background:var(--teal); border-color:var(--teal); color:#fff; }

/* ===== Smart 404 suggestions ===== */
.kc-404-suggest { max-width:520px; margin:36px auto 0; text-align:left; }
.kc-404-suggest > h2 { font-size:16px; font-weight:700; color:var(--navy); margin:0 0 14px; text-align:center; }
.kc-404-list { list-style:none; margin:0 0 18px; padding:0; display:flex; flex-direction:column; gap:8px; }
.kc-404-list li { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#f9f9f7; border:1px solid var(--border); border-radius:10px; padding:11px 14px; }
.kc-404-list a { color:var(--teal); font-weight:600; text-decoration:none; }
.kc-404-list a:hover { text-decoration:underline; }

/* ============================================================
   DELIGHT — gentle micro-interactions
   ============================================================ */

/* Card lift: bring the card families that had no hover up to the same soft
   rise the service cards already use, so every card feels responsive. */
.kc-sn-icon-card,
.kc-sn-trait-card { transition: box-shadow .2s ease, transform .15s ease; }
.kc-sn-icon-card:hover,
.kc-sn-trait-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); }

/* Form success: a warm rise-in with the tick popping, shared by every form. */
@keyframes kc-success-rise {
  from { opacity: 0; transform: translateY(10px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
@keyframes kc-success-pop {
  from { transform: scale(.85); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}
.kc-sn-form-success { animation: kc-success-rise .5s ease backwards; }
.kc-sn-form-success__icon { animation: kc-success-pop .45s ease-out .1s backwards; transform-origin: center; }

@media (prefers-reduced-motion: reduce) {
  .kc-sn-icon-card:hover,
.kc-sn-trait-card:hover { transform: none; }
  .kc-sn-form-success,
.kc-sn-form-success__icon { animation: none; }
}
.kc-404-type { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); background:var(--border); border-radius:999px; padding:2px 9px; flex-shrink:0; }
.kc-404-search-wrap { text-align:center; margin:0; }
.kc-404-search { color:var(--teal); font-weight:600; text-decoration:none; }
.kc-404-search:hover { text-decoration:underline; }

/* ===== Branded 404 fallback ===== */
.kc-404-body { padding-top:6px; }
.kc-404-eyebrow { font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--teal); margin:0 0 10px; }
.kc-404-lead { font-size:18px; color:#505050; margin:0 0 26px; }

/* Keep 404 suggestions clean inside .kc-body — no tick bullets or heading accent bar */
.kc-body .kc-404-suggest h2 { padding-left:0; border-left:0; margin:0 0 14px; text-align:center; }
.kc-body .kc-404-list { margin:0 0 18px; }
.kc-body .kc-404-list li { display:flex; align-items:center; gap:12px; padding-left:0; margin-bottom:8px; }
.kc-body .kc-404-list li::before { content:none; display:none; }

/* 404 fallback — centre the content column and show a large 404 numeral */
.kc-404-body { max-width:640px; margin-left:auto; margin-right:auto; }
.kc-404-code { font-size:clamp(72px, 14vw, 132px); font-weight:800; line-height:1; letter-spacing:-.03em; color:var(--navy); margin:0 0 6px; }

/* ---------------------------------------------------------------------------
   Section blocks and the icon library (core 1.13.0)
   Icons come from config/icons.php ([icon name="x"] in content, kc_icon() in PHP).
   They are sized in em and take currentColor, so they follow the text beside them.
   Colours here are the site's colour settings (--navy dark, --yellow primary,
   --teal secondary), so every block follows the theme.
   --------------------------------------------------------------------------- */
.kc-body .kc-sn-feature-card__ticks {list-style: none; margin: 12px 0 0; padding: 0;}
.kc-body .kc-sn-feature-card__ticks li {display: block; position: relative; padding-left: 26px; margin-bottom: 7px; font-size: var(--card-text, 14px); color: var(--muted); line-height: 1.5;}
.kc-body .kc-sn-feature-card__ticks li:last-child {margin-bottom: 0;}
.kc-body .kc-sn-feature-card__ticks li::before {content: ""; position: absolute; left: 0; top: 1px; width: 17px; height: 17px; background: var(--yellow); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/contain no-repeat;}
.kc-sn-iconnote {display: flex; align-items: center; gap: 18px; flex-wrap: wrap; background: var(--light); border: 1px solid var(--border); border-radius: 14px; padding: 24px 28px; margin-bottom: 40px;}
.kc-sn-iconnote--yellow {background: var(--yellow-lt); border-color: var(--yellow);}
.kc-sn-iconnote__icon {width: 46px; height: 46px; background: var(--yellow); border-radius: 11px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--kc-t-on-primary, var(--navy));}
.kc-sn-iconnote__body {flex: 1; min-width: min(220px, 100%);}
/* An icon the library doesn't have draws nothing, so its empty tile is left out (core 1.0.134) */
.kc-sn-iconnote__icon:empty {display: none;}
.kc-body .kc-sn-iconnote__title {font-size: var(--card-text-lg, 15px); font-weight: 700; color: var(--kc-t-heading, var(--navy)); margin: 0 0 4px; border: none; padding: 0; line-height: 1.3;}
.kc-sn-iconnote__text {font-size: var(--card-text, 14px); color: var(--muted); line-height: 1.6; margin: 0;}
.kc-body .kc-sn-iconnote__text a {color: var(--teal); font-weight: 600;}
.kc-sn-imgtext {position:relative;container-type:inline-size;border-radius:14px;overflow:hidden;margin-bottom:48px;line-height:0;}
.kc-sn-imgtext--r16-9 {aspect-ratio:16/9;}
.kc-sn-imgtext--r3-2 {aspect-ratio:3/2;}
.kc-sn-imgtext--r4-3 {aspect-ratio:4/3;}
.kc-sn-imgtext--r1-1 {aspect-ratio:1/1;}
.kc-sn-imgtext__img {display:block;width:100%;height:100%;object-fit:cover;}
.kc-sn-imgtext--r16-9 .kc-sn-imgtext__img,
.kc-sn-imgtext--r3-2  .kc-sn-imgtext__img,
.kc-sn-imgtext--r4-3  .kc-sn-imgtext__img,
.kc-sn-imgtext--r1-1  .kc-sn-imgtext__img {position:absolute; left:50%; top:50%; width:auto; height:auto; min-width:100%; min-height:100%; max-width:none; object-fit:fill; transform-origin:center; transform:translate(-50%,-50%);}
.kc-sn-imgtext__layer {position:absolute;transform:translate(-50%,-50%);max-width:none;margin:0;font-weight:800;line-height:1.15;text-align:center;white-space:nowrap;font-size:24px;}
.kc-sn-imgtext__layer--white {color:#fff;}
.kc-sn-imgtext__layer--navy {color:var(--navy);}
.kc-sn-imgtext__layer--yellow {color:var(--yellow);}
.kc-sn-imgtext__layer--dark {color:var(--text);}
.kc-sn-imgtext__layer--band-navy,.kc-sn-imgtext__layer--band-yellow,.kc-sn-imgtext__layer--band-white,.kc-sn-imgtext__layer--band-dark {padding:.28em .62em;border-radius:6px;}
.kc-sn-imgtext__layer--band-navy {background:var(--navy);}
.kc-sn-imgtext__layer--band-yellow {background:var(--yellow);}
.kc-sn-imgtext__layer--band-white {background:#fff;}
.kc-sn-imgtext__layer--band-dark {background:var(--text);}
.kc-sn-imgtext__band {position:absolute;transform:translate(-50%,-50%);}
.kc-sn-imgtext__band--navy {background:var(--navy);}
.kc-sn-imgtext__band--yellow {background:var(--yellow);}
.kc-sn-imgtext__band--white {background:#fff;}
.kc-sn-imgtext__band--dark {background:var(--text);}
.kc-sn-imgtext__layer a {color:inherit;text-decoration:underline;text-underline-offset:.12em;background-image:none !important;padding-bottom:0 !important;}
.kc-sn-imgtext__layer a:hover {opacity:.82;}
.kc-sn-imgtext__imglayer {position:absolute;transform:translate(-50%,-50%);height:auto;}
.kc-blk-short {max-width: 300px; margin: 0 auto 34px;}
.kc-short-card {display: block; position: relative; width: 100%; aspect-ratio: 9 / 16; padding: 0; border: 0; border-radius: 16px; overflow: hidden; cursor: pointer; background: #000;}
.kc-short-poster {width: 100%; height: 100%; object-fit: cover; display: block;}
.kc-short-play {position: absolute; inset: 0; margin: auto; width: 62px; height: 62px; border-radius: 50%; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; transition: background .15s, transform .15s;}
.kc-short-card:hover .kc-short-play {background: var(--teal); transform: scale(1.06);}
.kc-short-play svg {width: 30px; height: 30px; color: #fff; margin-left: 3px;}
.kc-short-card iframe {position: absolute; inset: 0; width: 100%; height: 100%; border: 0;}
.kc-blk-short figcaption {text-align: center;}
.kc-ic {width: 1em; height: 1em; flex: 0 0 auto; vertical-align: -0.125em; stroke: currentColor;}
.kc-ic--filled {stroke: none; fill: currentColor;}
.kc-ic--sm {width: .85em; height: .85em;}
.kc-ic--lg {width: 1.4em; height: 1.4em;}
.kc-ic--xl {width: 2em; height: 2em;}
.kc-ic--before {margin-right: .45em;}
.kc-ic--after {margin-left: .35em;}
.kc-hp-svc-icon .kc-ic {width: 28px; height: 28px;}
.kc-sn-icon-card__icon .kc-ic {width: 18px; height: 18px;}
.kc-sn-check-item__icon .kc-ic {width: 13px; height: 13px;}
.kc-sn-feature-card__icon-wrap .kc-ic {width: 18px; height: 18px;}
.kc-blk-imgtext--crop .kc-blk-imgtext__media img {width: 100%; max-height: 320px; object-fit: cover;}

/* Call to action at the end of a news post (core 1.14.0, from Kingsway Care) */
.kc-post-cta { display: flex; align-items: center; justify-content: space-between; gap: 16px 20px; flex-wrap: wrap; background: var(--teal-lt); border-left: 4px solid var(--teal); border-radius: 0 var(--radius-md) var(--radius-md) 0; padding: 18px 22px; margin: 28px 0 8px; }
.kc-post-cta__text { min-width: 0; flex: 1 1 260px; }
.kc-post-cta__head { font-size: calc(var(--base-size) * 1.05); font-weight: 700; color: var(--navy); margin: 0 0 3px; }
.kc-post-cta__sub { font-size: var(--card-text-lg, 15px); color: var(--muted); line-height: 1.5; margin: 0; }
.kc-post-cta__btn { display: inline-block; padding: 11px 24px; background: var(--yellow); color: var(--text); font-weight: 700; font-size: var(--btn-size, 15px); border-radius: var(--radius-md); text-decoration: none; white-space: nowrap; transition: background .15s, transform .08s; }
.kc-post-cta__btn:hover { background: var(--yellow-dk); }
.kc-post-cta__btn:active { transform: scale(.97); }
.kc-post-cta__btn:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .kc-post-cta__btn { transition: none; } .kc-post-cta__btn:active { transform: none; } }

/* ── Fixes from the October 2026 usability test (core 1.0.79) ─────────────────────────────────────────────────
   The Homepage hero placed inside an ordinary page (Kingsway Care's only hero is on its home page, straight inside
   .kc-main--full, so none of this reaches it): the page's list ticks stayed on the hero's points and cut them off, the
   photo kept a 3:2 box that pushed past the column, and the heading is an H2 there (the page title is the H1). */
:not(.kc-main--full) > .kc-hp-hero { grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); }
:not(.kc-main--full) > .kc-hp-hero .kc-hp-hero__image { aspect-ratio: auto; min-height: 0; min-width: 0; }
.kc-page-body .kc-hp-hero__trust li { display: block; padding-left: 17px; margin: 0; line-height: inherit; }
.kc-page-body .kc-hp-hero__trust li::before { content: "✓"; position: absolute; left: 0; display: inline; min-width: 0; width: auto; height: auto;
  margin: 0; background: none; border-radius: 0; font-size: inherit; color: var(--text); }
.kc-page-body .kc-hp-hero__content h2.kc-hp-hero__title { font-size: clamp(28px, 3vw, calc(var(--hero-size) - 2px)); font-weight: 700; line-height: 1.2;
  color: var(--text); margin: 0 0 20px; padding: 0; border: 0; }
.kc-page-body .kc-hp-hero__content h2.kc-hp-hero__title::before { content: none; }
@media (max-width: 860px) { :not(.kc-main--full) > .kc-hp-hero { grid-template-columns: 1fr; } :not(.kc-main--full) > .kc-hp-hero .kc-hp-hero__image { min-height: 240px; } }
/* Opening hours with no hours set in Business details: nothing on the site, rather than a heading on its own */
.kc-blk-hours:not(:has(> :not(h2))) { display: none; }

/* ── Block refinements (core 1.0.79), only on html.kc-v2: Wensum's own look and themes with design names
   (kc_blocks_v2 in config/theme.php). Older themes, Kingsway Care's among them, never get the class. ── */
/* One gap between blocks */
:where(html.kc-v2) .kc-page-body > :is(.kc-blk, [class*="kc-sn-"], .kc-accordion, .kc-callout, .kc-hp-svc-grid):not(.kc-sn-section-title) { margin-top: 0; margin-bottom: 48px; }
:where(html.kc-v2) .kc-page-body > :is(.kc-blk, [class*="kc-sn-"], .kc-accordion, .kc-callout, .kc-hp-svc-grid):not(.kc-sn-section-title):last-child { margin-bottom: 0; }
/* Buttons side by side in one Button block */
:where(html.kc-v2) .kc-blk-btnwrap { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
:where(html.kc-v2) .kc-blk-btnwrap--center { justify-content: center; }
/* Gallery: every photo the same square, filling the row; two across on a phone */
:where(html.kc-v2) .kc-blk-gallery--grid .kc-blk-gallery__item { flex: 1 1 140px; max-width: none; }
:where(html.kc-v2) .kc-blk-gallery--grid .kc-blk-gallery__item img { aspect-ratio: 1 / 1 !important; height: auto; }
/* Story card side by side: the photo goes full width above the words on a phone */
@media (max-width: 640px) { :where(html.kc-v2) .kc-sn-story-card--row .kc-sn-story-card__img { flex: 0 0 100%; width: 100%; } }
/* No accent bar beside a centred call-to-action heading */
:where(html.kc-v2) .kc-sn-cta .kc-sn-cta__title { border-left: 0; padding-left: 0; }
:where(html.kc-v2) .kc-sn-cta .kc-sn-cta__title::before { content: none; }
/* Credits that read clearly (4.5:1 or better) */
:where(html.kc-v2) :is(.kc-body .kc-callout, .kc-callout) p.kc-callout__cite { color: var(--kc-t-muted, #56656a); }
:where(html.kc-v2) :is(.kc-sn-navy-panel, .kc-sn-dark-panel) .kc-sn-callout__credit { color: var(--yellow); }
/* A customer's words as large as a quote's */
:where(html.kc-v2) .kc-sn-testimonial .kc-sn-testimonial__quote { font-size: 17px; line-height: 1.7; }

/* ── Page cards (core 1.0.82) ─────────────────────────────
   A card for each chosen page. The title is the card's one link; its ::after covers the card, so the whole
   card can be clicked while a screen reader hears only the title. */
.kc-sn-pagecards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 24px 0 32px; }
.kc-sn-pagecards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kc-sn-pagecards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kc-sn-pagecard { position: relative; display: flex; flex-direction: column; background: var(--kc-t-card, #fff); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; transition: box-shadow .2s, transform .15s; }
.kc-sn-pagecard:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); }
.kc-sn-pagecard:focus-within { outline: 3px solid var(--teal); outline-offset: 2px; }
.kc-sn-pagecard__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--kc-t-soft, #f9f9f7); }
.kc-sn-pagecard__media picture { display: contents; }
.kc-sn-pagecard__media img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; border-radius: 0 !important; box-shadow: none; }   /* the card rounds its corners; a theme's rounded pictures would leave gaps */
.kc-sn-pagecards--icon .kc-sn-pagecard__media { width: 64px; height: 64px; aspect-ratio: auto; margin: 24px 24px 0; background: none; }
.kc-sn-pagecards--icon .kc-sn-pagecard__media img { object-fit: contain; }
.kc-sn-pagecard__body { display: flex; flex-direction: column; flex: 1; padding: 20px 24px 24px; }
.kc-sn-pagecard__title { font-size: var(--sn-feature-title); font-weight: 700; line-height: 1.3; margin: 0 0 8px; padding: 0; border: 0; color: var(--kc-t-heading, var(--text)); }
.kc-sn-pagecards .kc-sn-pagecard__title a { color: var(--kc-t-heading, var(--text)); text-decoration: none; background-image: none; }
.kc-sn-pagecard__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.kc-sn-pagecard__title a:focus { outline: none; }
.kc-sn-pagecard__text { font-size: var(--card-text); color: var(--kc-t-muted, var(--muted)); line-height: 1.6; margin: 0 0 16px; }
.kc-sn-pagecard__more { margin-top: auto; font-size: var(--caption-size); font-weight: 600; color: var(--teal); }
@media (max-width: 900px) { .kc-sn-pagecards--3, .kc-sn-pagecards--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .kc-sn-pagecards { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .kc-sn-pagecard { transition: none; } .kc-sn-pagecard:hover { transform: none; } }

/* "Last updated" at the foot of a page (core 1.0.111) */
.kc-updated { margin: 32px 0 0; padding-top: 16px; border-top: 1px solid var(--kc-t-rule, rgba(0,0,0,.1)); font-size: var(--caption-size, 13px); color: var(--kc-t-muted, var(--muted)); }

/* ── One of your pages as the holding page (core 1.0.115) ───────────────────
   No menus, search or header button (they would lead to pages that are closed), and the preview password box. */
.kc-holding .kc-burger, .kc-holding .kc-nav, .kc-holding .kc-nav-close, .kc-holding .kc-search-trigger,
.kc-holding .kc-header-cta, .kc-holding .kc-topbar-btn, .kc-holding .kc-footer-nav, .kc-holding .kc-footer-col:has(.kc-footer-nav) { display: none !important; }
.kc-holding-pw { margin: 40px 0 0; padding-top: 20px; border-top: 1px solid var(--border, #d9d9d9); max-width: 46ch; }
.kc-holding-pw label { display: block; font-weight: 600; margin-bottom: 10px; }
.kc-holding-pw__row { display: flex; flex-wrap: wrap; gap: 8px; }
.kc-holding-pw input { font: inherit; min-height: 44px; padding: 0 14px; width: 240px; max-width: 100%; border: 1px solid var(--border, #c9c9c9); border-radius: 4px; background: #fff; color: inherit; }
.kc-holding-pw button { font: inherit; font-weight: 600; min-height: 44px; padding: 0 18px; border: 1.5px solid currentColor; border-radius: 4px; background: transparent; color: inherit; cursor: pointer; }
.kc-holding-pw__err { color: #a12a1f; margin: 10px 0 0; }

/* Card grids follow the width of their column (core 1.0.129). A column of Wensum's own sections is measured, and a
   grid with a set number of cards drops to two across, then one, when its column is narrow, as it already did when
   the window was. A theme with sections of its own measures its columns as the kc-col container while they sit side
   by side. The grids that fit as many as there is room for never ask for more than the width there is (min(..., 100%)).
   Review fix (1.0.132): the container is named, so another container on the page (a theme's main) doesn't count, and
   a column is only measured while the columns sit side by side; on a phone the window's own rules decide, as before. */
@media (min-width: 761px) { .kc-band__col { container: kc-col / inline-size; } }
@container kc-col (max-width: 760px) {
  .kc-hp-svc-grid, .kc-sn-pagecards, .kc-sn-pagecards--4, .kc-sn-photo-trio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container kc-col (max-width: 440px) {
  .kc-hp-svc-grid, .kc-hp-svc-grid--2, .kc-sn-pagecards, .kc-sn-pagecards--2, .kc-sn-pagecards--4, .kc-sn-photo-trio, .kc-sn-photo-duo { grid-template-columns: minmax(0, 1fr); }
}

/* Column widths in Wensum's own sections (core 1.0.130): the first or the last column twice the width of the others.
   One column on a phone, as always. */
.kc-band__cols.kc-band__cols--wide-left.kc-band__cols--n2 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.kc-band__cols.kc-band__cols--wide-right.kc-band__cols--n2 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.kc-band__cols.kc-band__cols--wide-left.kc-band__cols--n3 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
.kc-band__cols.kc-band__cols--wide-right.kc-band__cols--n3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
.kc-band__cols.kc-band__cols--wide-left.kc-band__cols--n4 { grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); }
.kc-band__cols.kc-band__cols--wide-right.kc-band__cols--n4 { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 2fr); }
@media (max-width: 760px) {
  .kc-band__cols.kc-band__cols--wide-left, .kc-band__cols.kc-band__cols--wide-right { grid-template-columns: 1fr; }
}

/* ── Block styles for home pages made of ordinary blocks (core 1.0.172) ───────────────────────────────────────────
   Each is a Style the person picks in Easy Blocks; the first look of each block is unchanged. They match the example
   packs' home page sections, so a pack's home page can be built from ordinary blocks in full-width Sections. */
/* Facts and figures: a light strip with lines between the figures. Straight under a Home page banner (not in a
   Section) it runs across the whole page. */
.kc-sn-stats-banner--strip { display: block; background: var(--light); border-radius: 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-bottom: 48px; }
.kc-sn-stats-banner--strip .kc-sn-stats-banner__row { display: flex; justify-content: center; flex-wrap: wrap; }
.kc-sn-stats-banner--strip .kc-sn-stats-banner__item { padding: 20px 32px; flex: 1; min-width: 130px; border-right: 1px solid var(--border); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.kc-sn-stats-banner--strip .kc-sn-stats-banner__item:last-child { border-right: none; }
.kc-sn-stats-banner--strip .kc-sn-stats-banner__value { font-size: var(--card-text-lg); font-weight: 700; color: var(--text); margin-bottom: 3px; }
.kc-sn-stats-banner--strip .kc-sn-stats-banner__label { font-size: var(--label-size); color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.kc-main--full > .kc-sn-stats-banner--strip { margin: 0; }
.kc-main--full > .kc-sn-stats-banner--strip .kc-sn-stats-banner__row { max-width: var(--max-w); margin: 0 auto; padding: 0 32px; }
@media (max-width: 900px) { .kc-sn-stats-banner--strip .kc-sn-stats-banner__item { padding: 10px; } }
@media (max-width: 560px) {
  .kc-main--full > .kc-sn-stats-banner--strip .kc-sn-stats-banner__row { padding: 0 20px; }
  .kc-sn-stats-banner--strip .kc-sn-stats-banner__row { flex-direction: column; }
  .kc-sn-stats-banner--strip .kc-sn-stats-banner__item { border-right: none; border-bottom: 1px solid var(--border); padding: 14px 24px; }
  .kc-sn-stats-banner--strip .kc-sn-stats-banner__item:last-child { border-bottom: none; }
}
/* Page heading, plain and centred: a small line, the heading and the words, with no box */
.kc-sn-hero--plain { background: none; border-radius: 0; padding: 0; overflow: visible; text-align: center; max-width: 640px; margin: 0 auto 48px; }
.kc-sn-hero--plain::before, .kc-sn-hero--plain::after { content: none; }
.kc-sn-hero--plain .kc-sn-hero__badge { display: block; padding: 0; background: none; border-radius: 0; font-size: var(--base-size); font-weight: 400; color: var(--muted); margin: 0 0 12px; }   /* the home page's small line (kc-hp-eyebrow), as a section heading draws it */
.kc-sn-hero--plain .kc-sn-hero__title, .kc-body .kc-sn-hero--plain .kc-sn-hero__title { font-size: clamp(22px, 2vw, var(--h2-size)); font-weight: 700; color: var(--text); margin: 0 0 14px; line-height: 1.3; padding-left: 0; border-left: none; }
.kc-sn-hero--plain .kc-sn-hero__sub, .kc-body .kc-sn-hero--plain .kc-sn-hero__sub { font-size: var(--base-size); color: var(--muted); line-height: 1.65; max-width: none; }
/* Tick list, plain: one under another, a tick in a circle of the main colour */
.kc-sn-check-list--plain { display: flex; flex-direction: column; gap: 10px; margin-bottom: 0; }
.kc-sn-check-list--plain .kc-sn-check-item { background: none; border-radius: 0; padding: 0; }
.kc-sn-check-list--plain .kc-sn-check-item__icon { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; min-width: 20px; border-radius: 50%; background: var(--yellow); color: var(--kc-t-on-primary, var(--text)); margin-top: 2px; }
.kc-sn-check-list--plain .kc-sn-check-item__icon .kc-ic, .kc-sn-check-list--plain .kc-sn-check-item__icon svg { width: 12px; height: 12px; }
.kc-sn-check-list--plain .kc-sn-check-item__text { color: var(--text); }
/* Call to action, no box: for a section that already has the colour */
.kc-sn-cta--plain .kc-sn-cta__btn { padding: 13px 26px; line-height: 1.2; font-weight: 600; }
.kc-sn-cta--plain .kc-sn-cta__btn--ghost { background: transparent; color: var(--text); border: 1px solid rgba(0,0,0,.35); }
.kc-sn-cta--plain { background: none; border-radius: 0; padding: 0; }
.kc-sn-cta--plain .kc-sn-cta__title, .kc-body .kc-sn-cta--plain .kc-sn-cta__title { font-size: clamp(24px, 2.4vw, calc(var(--h2-size) + 6px)); color: var(--text); margin: 0 0 14px; line-height: 1.2; }
.kc-sn-cta--plain .kc-sn-cta__sub, .kc-body .kc-sn-cta--plain .kc-sn-cta__sub { font-size: var(--base-size); color: rgba(0,0,0,.6); max-width: 520px; margin: 0 auto 32px; line-height: 1.65; }
/* Text: a small line above the title, drawn as the home page's (kc-hp-eyebrow); the title under it as a home page's */
p.kc-blk-eyebrow { font-size: var(--sn-snippet-sub); color: var(--muted); margin: 0 0 24px; }
.kc-blk-eyebrow ~ p, .kc-body .kc-blk-eyebrow ~ p { color: var(--muted); margin: 0 0 24px; }   /* the words under it, as a home page's story */
.kc-sn-check-list--plain + .kc-blk-btnwrap { margin-top: 28px; }
.kc-blk-eyebrow + h2, .kc-body .kc-blk-eyebrow + h2 { font-size: clamp(22px, 2vw, var(--h2-size)); font-weight: 700; line-height: 1.3; margin: 0 0 16px; padding-left: 0; border-left: none; }
/* A Section in the main colour, with its darker line along the top when it runs across the page */
.kc-band--main { background: var(--yellow); padding: clamp(20px, 4vw, 40px); border-radius: var(--wsm-radius, 10px); }
.kc-main--full > .kc-band--main.kc-band--full { border-top: 4px solid var(--yellow-dk); }
