/* ==========================================================================
   danielellis.co.uk — site styles
   Sections mirror the component list in inc/components.php.
   Change design decisions in TOKENS only; components use the variables.
   ========================================================================== */

/* ---------------------------------------------------------------- TOKENS */
:root {
  /* Typography (kept from the original Sinatra theme settings) */
  --font-body: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  --font-heading: Times, Georgia, serif;
  --fs-base: 0.9375rem;      /* 15px */
  --lh-base: 1.733;
  --fs-h1: 2.375rem;
  --fs-h2: 1.875rem;
  --fs-h3: 1.625rem;
  --fs-h4: 1.25rem;
  --fs-h5: 1rem;
  --fs-small: 0.8125rem;
  --fs-lead: 1.125rem;
  --fw-heading: 600;

  /* Colour */
  --c-text: #30373e;
  --c-heading: #23282d;
  --c-muted: #5d656d;
  --c-accent: #3857f1;
  --c-accent-hover: #2440d6;
  --c-accent-soft: #eef1fe;
  --c-bg: #ffffff;
  --c-bg-muted: #f5f6f8;
  --c-border: #e3e6ea;
  --c-header-bg: #0a0a0a;
  --c-header-text: #ffffff;
  --c-header-muted: rgba(255,255,255,.62);
  --c-footer-bg: #23282d;
  --c-footer-text: #9ba1a7;
  --c-footer-strong: #ffffff;
  --c-overlay: rgba(45,45,45,.86);
  --c-success: #1e7d4f;
  --c-success-bg: #e8f6ee;
  --c-error: #b42318;
  --c-error-bg: #fdecea;

  /* Space & shape */
  --space-1: .25rem;  --space-2: .5rem;  --space-3: .75rem; --space-4: 1rem;
  --space-5: 1.5rem;  --space-6: 2rem;   --space-7: 3rem;   --space-8: 4.5rem;
  --radius: 4px;
  --radius-lg: 8px;
  --shadow: 0 1px 2px rgba(16,24,40,.05), 0 4px 16px rgba(16,24,40,.06);
  --w-wide: 1200px;
  --w-prose: 760px;
  --gutter: clamp(1rem, 4vw, 2rem);
}

/* ---------------------------------------------------------------- BASE */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; scroll-padding-top: 5rem; }
body {
  margin: 0; font-family: var(--font-body); font-size: var(--fs-base); line-height: var(--lh-base);
  color: var(--c-text); background: var(--c-bg); -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: var(--fw-heading); color: var(--c-heading); margin: 0 0 .6em; }
h1 { font-size: var(--fs-h1); line-height: 1.1; }
h2 { font-size: var(--fs-h2); line-height: 1.25; }
h3 { font-size: var(--fs-h3); line-height: 1.25; }
h4 { font-size: var(--fs-h4); line-height: 1.5; }
h5 { font-size: var(--fs-h5); line-height: 1.5; }
p, ul, ol, figure, address { margin: 0 0 1em; }
address { font-style: normal; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--c-accent); text-underline-offset: .15em; }
a:hover { color: var(--c-accent-hover); }
:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 2px; }
::selection { background: var(--c-accent); color: #fff; }
main:focus { outline: none; }
.c-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.c-skip-link { position: absolute; left: var(--space-4); top: -3rem; z-index: 100; background: #fff; color: var(--c-heading); padding: var(--space-2) var(--space-4); border-radius: var(--radius); }
.c-skip-link:focus { top: var(--space-4); }

/* ---------------------------------------------------------------- CONTAINER */
.c-container { width: 100%; margin-inline: auto; padding-inline: var(--gutter); }
.c-container--wide { max-width: calc(var(--w-wide) + 2 * var(--gutter)); }
.c-container--prose { max-width: calc(var(--w-prose) + 2 * var(--gutter)); }

/* ---------------------------------------------------------------- SITE HEADER */
.c-site-header { position: sticky; top: 0; z-index: 50; background: var(--c-header-bg); color: var(--c-header-text); }
.c-site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); min-height: 4.25rem; }
.c-site-header__brand { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: 1.5rem; color: var(--c-header-text); text-decoration: none; letter-spacing: .01em; }
.c-site-header__brand:hover { color: var(--c-header-text); opacity: .85; }
.c-site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: var(--space-5); }
.c-site-nav a { color: var(--c-header-text); text-decoration: none; font-size: .9375rem; padding: var(--space-2) 0; border-bottom: 2px solid transparent; }
.c-site-nav a:hover { color: var(--c-header-text); border-bottom-color: var(--c-header-muted); }
.c-site-nav a[aria-current="page"] { border-bottom-color: var(--c-accent); }
.c-site-nav__cta a { background: var(--c-accent); padding: var(--space-2) var(--space-4); border-radius: var(--radius); border: 0; font-weight: 500; }
.c-site-nav__cta a:hover, .c-site-nav__cta a[aria-current="page"] { background: var(--c-accent-hover); }
.c-site-header__toggle { display: none; background: none; border: 0; padding: var(--space-3); margin-right: calc(-1 * var(--space-3)); cursor: pointer; color: inherit; }
.c-site-header__toggle-bar, .c-site-header__toggle-bar::before, .c-site-header__toggle-bar::after { display: block; width: 22px; height: 2px; background: currentColor; position: relative; transition: transform .2s; }
.c-site-header__toggle-bar::before, .c-site-header__toggle-bar::after { content: ""; position: absolute; left: 0; }
.c-site-header__toggle-bar::before { top: -7px; } .c-site-header__toggle-bar::after { top: 7px; }
.c-site-header__toggle[aria-expanded="true"] .c-site-header__toggle-bar { background: transparent; }
.c-site-header__toggle[aria-expanded="true"] .c-site-header__toggle-bar::before { transform: translateY(7px) rotate(45deg); }
.c-site-header__toggle[aria-expanded="true"] .c-site-header__toggle-bar::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
  .c-site-header__toggle { display: block; }
  .c-site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--c-header-bg); border-top: 1px solid rgba(255,255,255,.1); padding: var(--space-3) var(--gutter) var(--space-5); }
  .c-site-nav.is-open { display: block; }
  .c-site-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
  .c-site-nav li a { display: block; padding: var(--space-3) 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .c-site-nav li a[aria-current="page"] { border-bottom-color: rgba(255,255,255,.08); color: #9fb0ff; }
  .c-site-nav__cta { margin-top: var(--space-4); }
  .c-site-nav__cta a { text-align: center; padding: var(--space-3); }
  .no-js .c-site-nav { display: block; position: static; }
}

/* Dropdown groups (e.g. Services) */
.c-site-nav__group { position: relative; }
.c-site-nav__parent { background: none; border: 0; border-bottom: 2px solid transparent; padding: var(--space-2) 0; font: inherit; font-size: .9375rem; color: var(--c-header-text); cursor: pointer; display: inline-flex; align-items: center; gap: .4rem; }
.c-site-nav__parent:hover { border-bottom-color: var(--c-header-muted); }
.c-site-nav__parent.is-current { border-bottom-color: var(--c-accent); }
.c-site-nav__caret { display: inline-block; flex-shrink: 0; width: .4rem; height: .4rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .15s; }
.c-site-nav__parent[aria-expanded="true"] .c-site-nav__caret { transform: translateY(2px) rotate(225deg); }

@media (min-width: 961px) {
  .c-site-nav__sub { display: none !important; position: absolute; top: calc(100% + .6rem); left: -1rem; min-width: 15rem; background: #fff; border-radius: var(--radius-lg); box-shadow: 0 12px 32px rgba(0,0,0,.18); padding: var(--space-2) 0 !important; flex-direction: column; align-items: stretch !important; gap: 0 !important; }
  .c-site-nav__sub::before { content: ""; position: absolute; left: 0; right: 0; top: -.6rem; height: .6rem; }  /* hover bridge */
  .c-site-nav__group:hover .c-site-nav__sub,
  .c-site-nav__parent[aria-expanded="true"] + .c-site-nav__sub { display: flex !important; }
  .c-site-nav__sub a { display: block; color: var(--c-heading); padding: var(--space-2) var(--space-5); border: 0; white-space: nowrap; }
  .c-site-nav__sub a:hover { background: var(--c-bg-muted); color: var(--c-accent); }
  .c-site-nav__sub a[aria-current="page"] { color: var(--c-accent); font-weight: 600; }
}
@media (max-width: 960px) {
  .c-site-nav__parent { display: block; width: 100%; text-align: left; padding: var(--space-3) 0 var(--space-1); border-bottom: 0; color: var(--c-header-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: 2px; cursor: default; }
  .c-site-nav__parent:hover, .c-site-nav__parent.is-current { border-bottom-color: transparent; }
  .c-site-nav__caret { display: none; }
  .c-site-nav__sub { padding-left: var(--space-4) !important; }
}

/* ---------------------------------------------------------------- SITE FOOTER */
.c-site-footer { background: var(--c-footer-bg); color: var(--c-footer-text); padding-block: var(--space-7) var(--space-5); margin-top: var(--space-8); font-size: .9375rem; }
.c-site-footer a, .c-site-footer__linkbutton { color: var(--c-footer-text); }
.c-site-footer a:hover, .c-site-footer__linkbutton:hover { color: var(--c-footer-strong); }
.c-site-footer .c-contact__heading { color: var(--c-footer-strong); }
.c-site-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); border-top: 1px solid rgba(255,255,255,.1); margin-top: var(--space-6); padding-top: var(--space-5); font-size: var(--fs-small); }
.c-site-footer__bottom p { margin: 0; }
.c-site-footer__links { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-5); }
.c-site-footer__linkbutton { background: none; border: 0; padding: 0; font: inherit; text-decoration: underline; text-underline-offset: .15em; cursor: pointer; }
main + .c-site-footer { margin-top: 0; }

/* ---------------------------------------------------------------- SECTION */
.c-section { padding-block: var(--space-7); }
.c-section--default + .c-section--default { padding-top: 0; }
.c-section--muted { background: var(--c-bg-muted); }
.c-section--muted + .c-section--muted { padding-top: 0; }
.c-section--dark { background: var(--c-footer-bg); color: #d6dadf; }
.c-section--dark h2, .c-section--dark h3 { color: #fff; }
main > :last-child.c-section--default { padding-bottom: var(--space-8); }

/* ---------------------------------------------------------------- PAGE TITLE */
.c-page-title { padding-block: var(--space-7) var(--space-6); border-bottom: 1px solid var(--c-border); margin-bottom: var(--space-7); }
.c-page-title__eyebrow { text-transform: uppercase; letter-spacing: 2px; font-size: .6875rem; font-weight: 600; color: var(--c-muted); margin-bottom: var(--space-3); }
.c-page-title__eyebrow a { color: inherit; text-decoration: none; }
.c-page-title__heading { margin-bottom: 0; max-width: 22ch; max-width: min(100%, 26em); }
.c-page-title__lead { font-size: var(--fs-lead); color: var(--c-muted); margin: var(--space-4) 0 0; max-width: 46em; font-style: italic; }
.c-page-title + .c-section { padding-top: 0; }

/* ---------------------------------------------------------------- HERO */
.c-hero { position: relative; display: grid; align-items: center; min-height: clamp(320px, 46vh, 460px); color: #fff; overflow: hidden; background: #111; }
.c-hero__media, .c-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,20,20,.88) 0%, var(--c-overlay) 50%, rgba(45,45,45,.55) 100%); }
.c-hero__inner { position: relative; z-index: 1; padding-block: var(--space-8); }
.c-hero__title { color: #fff; font-size: clamp(2.25rem, 5vw, 3.25rem); margin-bottom: var(--space-4); }
.c-hero__strapline { font-style: italic; font-size: var(--fs-lead); color: rgba(255,255,255,.85); margin: 0; letter-spacing: .01em; }
.c-hero + .c-section { padding-top: var(--space-7); }

/* ---------------------------------------------------------------- COLUMNS */
.c-columns { display: grid; gap: var(--space-6) var(--space-7); grid-template-columns: 1fr; margin-bottom: var(--space-5); }
@media (min-width: 720px) { .c-columns--2, .c-columns--4 { grid-template-columns: repeat(2, 1fr); } .c-columns--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .c-columns--4 { grid-template-columns: repeat(4, 1fr); } }
.c-columns__col > :last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------- DIVIDER */
.c-divider { border: 0; border-top: 1px solid var(--c-border); margin: var(--space-7) 0; }

/* ---------------------------------------------------------------- LEAD */
.c-lead { font-size: var(--fs-lead); line-height: 1.65; color: var(--c-heading); max-width: 46em; }

/* ---------------------------------------------------------------- PROSE */
.c-prose { max-width: var(--w-prose); }
.c-prose h2 { margin-top: 1.6em; }
.c-prose h3 { font-size: var(--fs-h4); margin-top: 1.5em; margin-bottom: .4em; line-height: 1.4; }
.c-prose h2:first-child, .c-prose h3:first-child { margin-top: 0; }
.c-prose ul, .c-prose ol { padding-left: 1.4em; }
.c-prose li { margin-bottom: .45em; }
.c-prose li > ul, .c-prose li > ol { margin-top: .45em; }
.c-prose ol > li::marker { font-weight: 600; color: var(--c-heading); }
.c-prose > :last-child { margin-bottom: 0; }
.c-columns .c-prose, .c-card .c-prose { max-width: none; }

/* ---------------------------------------------------------------- CALLOUT */
.c-callout { border-left: 3px solid var(--c-accent); background: var(--c-accent-soft); padding: var(--space-4) var(--space-5); border-radius: 0 var(--radius) var(--radius) 0; margin: 0 0 var(--space-5); max-width: var(--w-prose); }
.c-callout__title { font-weight: 600; color: var(--c-heading); margin-bottom: var(--space-2); }
.c-callout__body > :last-child { margin-bottom: 0; }
.c-callout--quote { background: none; border-left-color: var(--c-heading); font-family: var(--font-heading); font-size: 1.25rem; font-style: italic; color: var(--c-heading); }

/* ---------------------------------------------------------------- BUTTON */
.c-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); font: 500 .9375rem/1.3 var(--font-body); padding: .75rem 1.25rem; border-radius: var(--radius); border: 1px solid transparent; text-decoration: none; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; text-align: center; }
.c-button--primary { background: var(--c-accent); color: #fff; }
.c-button--primary:hover { background: var(--c-accent-hover); color: #fff; }
.c-button--secondary { background: var(--c-heading); color: #fff; }
.c-button--secondary:hover { background: #3e4750; color: #fff; }
.c-button--outline { background: transparent; color: var(--c-heading); border-color: currentColor; }
.c-button--outline:hover { color: var(--c-accent); }

/* ---------------------------------------------------------------- BUTTON GROUP */
.c-button-group { margin-bottom: var(--space-6); }
.c-button-group__label { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--fs-h4); color: var(--c-heading); margin-bottom: var(--space-3); }
.c-button-group__row { display: grid; grid-template-columns: repeat(auto-fill, minmax(max(15rem, calc((100% - 2 * var(--space-3)) / 3)), 1fr)); gap: var(--space-3); }   /* every button the same size, max 3 per row */
.c-button-group__row .c-button { width: 100%; min-height: 3.25rem; }

/* ---------------------------------------------------------------- CTA BAND */
.c-cta-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); background: var(--c-heading); color: #d6dadf; padding: var(--space-6) var(--space-6); border-radius: var(--radius-lg); }
.c-cta-band__title { color: #fff; margin-bottom: var(--space-2); font-size: var(--fs-h3); }
.c-cta-band__text { margin: 0; max-width: 40em; }
.c-cta-band__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.c-cta-band .c-button--outline { color: #fff; }
.c-cta-band .c-button--outline:hover { color: #c7d0ff; }

/* ---------------------------------------------------------------- CARD */
.c-card { border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-5) var(--space-4); background: #fff; height: 100%; display: flex; flex-direction: column; border-top: 3px solid var(--c-accent); }
.c-card__title { font-size: var(--fs-h3); margin-bottom: var(--space-3); }
.c-columns--4 .c-card__title { font-size: var(--fs-h4); line-height: 1.3; }   /* smaller titles in 4-up grids */
.c-card__body > :last-child { margin-bottom: 0; }
.c-card__body { flex: 1; }
.c-card__link { margin: var(--space-4) 0 0; font-weight: 500; }
.c-card__link a { text-decoration: none; }

/* ---------------------------------------------------------------- FEATURE ROW */
.c-feature-row { display: grid; gap: var(--space-5) var(--space-7); align-items: center; padding-block: var(--space-6); }
.c-feature-row + .c-feature-row { border-top: 1px solid var(--c-border); }
.c-feature-row__media img { width: 100%; max-width: 260px; margin-inline: auto; }
.c-feature-row__title { font-size: var(--fs-h3); }
@media (min-width: 760px) {
  .c-feature-row { grid-template-columns: 2fr 3fr; }
  .c-feature-row--flip .c-feature-row__media { order: 2; }
}

/* ---------------------------------------------------------------- PRICE CARDS */
.c-price-cards { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.c-price-card { border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: var(--space-6) var(--space-5); background: #fff; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.c-price-card__name { font-size: var(--fs-h4); margin-bottom: var(--space-2); }
.c-price-card__price { font-family: var(--font-heading); font-size: 2.25rem; font-weight: var(--fw-heading); color: var(--c-heading); line-height: 1.1; margin-bottom: var(--space-5); }
.c-price-card__price span { font-family: var(--font-body); font-size: .875rem; font-weight: 400; color: var(--c-muted); }
.c-price-card:has(.c-price-card__note) .c-price-card__price { margin-bottom: var(--space-1); }
.c-price-card__note { font-size: var(--fs-small); color: var(--c-muted); margin: 0 0 var(--space-5); }
.c-price-card__features { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--c-border); }
.c-price-card__features li { padding: var(--space-2) 0 var(--space-2) 1.5rem; border-bottom: 1px solid var(--c-border); position: relative; }
.c-price-card__features li::before { content: "✓"; position: absolute; left: 0; color: var(--c-accent); font-weight: 700; }

/* ---------------------------------------------------------------- ACCORDION */
.c-accordion { border-top: 1px solid var(--c-border); max-width: var(--w-prose); margin-bottom: var(--space-6); }
.c-accordion__item { border-bottom: 1px solid var(--c-border); }
.c-accordion__summary { cursor: pointer; list-style: none; padding: var(--space-4) 2rem var(--space-4) 0; font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--fs-h4); color: var(--c-heading); position: relative; }
.c-accordion__summary::-webkit-details-marker { display: none; }
.c-accordion__summary::after { content: "+"; position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); font-family: var(--font-body); font-weight: 300; font-size: 1.5rem; color: var(--c-accent); }
.c-accordion__item[open] > .c-accordion__summary::after { content: "–"; }
.c-accordion__summary:hover { color: var(--c-accent); }
.c-accordion__body { padding: 0 0 var(--space-5); }

/* ---------------------------------------------------------------- DATA TABLE */
.c-table-wrap { overflow-x: auto; margin-bottom: var(--space-6); max-width: var(--w-prose); }
.c-table { border-collapse: collapse; width: 100%; font-size: .9375rem; }
.c-table caption { text-align: left; font-weight: 600; color: var(--c-heading); padding-bottom: var(--space-2); }
.c-table th { text-align: left; font-weight: 600; color: var(--c-heading); background: var(--c-bg-muted); }
.c-table th, .c-table td { padding: .6rem .85rem; border-bottom: 1px solid var(--c-border); vertical-align: top; }

/* ---------------------------------------------------------------- FIGURE */
.c-figure { margin: 0 0 var(--space-6); }
.c-figure img { border-radius: var(--radius); }
.c-figure--narrow { max-width: 420px; }
.c-figure--wide { max-width: var(--w-prose); }
.c-figure--centre { max-width: 560px; margin-inline: auto; }
.c-figure figcaption { font-size: var(--fs-small); color: var(--c-muted); margin-top: var(--space-2); }

/* ---------------------------------------------------------------- AUDIO */
.c-audio { margin: 0 0 var(--space-6); max-width: var(--w-prose); padding: var(--space-4) var(--space-5); border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-bg-muted); }
.c-audio__label { font-weight: 600; color: var(--c-heading); margin-bottom: var(--space-3); }
.c-audio audio { width: 100%; }

/* ---------------------------------------------------------------- EMBED */
.c-embed { max-width: var(--w-prose); margin: 0 auto var(--space-6); }
.c-embed iframe { width: 100%; height: var(--embed-h, 900px); border: 0; display: block; }

/* ---------------------------------------------------------------- LINK LIST */
.c-link-list { list-style: none; padding: 0; margin: 0 0 var(--space-6); max-width: var(--w-prose); }
.c-link-list li { padding: var(--space-4) 0; border-bottom: 1px solid var(--c-border); }
.c-link-list li:first-child { border-top: 1px solid var(--c-border); }
.c-link-list a { font-weight: 600; font-size: 1.0625rem; }
.c-link-list__desc { display: block; color: var(--c-text); margin-top: var(--space-1); }

/* ---------------------------------------------------------------- STATS */
.c-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--space-5); margin: 0 0 var(--space-6); }
.c-stats__item { display: flex; flex-direction: column-reverse; justify-content: flex-end; border-left: 3px solid var(--c-accent); padding-left: var(--space-4); }
.c-stats__figure { margin: 0; font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: 2.75rem; line-height: 1.05; color: var(--c-heading); }
.c-stats__label { font-size: .875rem; color: var(--c-muted); margin-top: var(--space-1); }
.c-section--dark .c-stats__figure { color: #fff; }
.c-section--dark .c-stats__label { color: #b7bdc4; }

/* ---------------------------------------------------------------- POST LIST */
.c-post-list { list-style: none; padding: 0; margin: 0 0 var(--space-6); max-width: var(--w-prose); }
.c-post-list__item { padding: var(--space-5) 0; border-bottom: 1px solid var(--c-border); }
.c-post-list__item:first-child { padding-top: 0; }
.c-post-list__title { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: 1.5rem; line-height: 1.3; color: var(--c-heading); text-decoration: none; }
.c-post-list__title:hover { color: var(--c-accent); }
.c-post-list__summary { margin: var(--space-2) 0 0; }
.c-post-list__meta { margin: var(--space-2) 0 0; font-size: var(--fs-small); color: var(--c-muted); display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.c-post-list__topic { background: var(--c-bg-muted); border-radius: 99px; padding: 0 .6rem; }
.c-post-list__empty { color: var(--c-muted); }

/* ---------------------------------------------------------------- TOPIC TAGS */
.c-topic-tags { list-style: none; padding: 0; margin: 0 0 var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-2); }
.c-topic-tags a { display: inline-block; padding: .3rem .9rem; border: 1px solid var(--c-border); border-radius: 99px; text-decoration: none; color: var(--c-heading); font-size: .875rem; }
.c-topic-tags a:hover { border-color: var(--c-accent); color: var(--c-accent); }
.c-topic-tags a[aria-current="page"] { background: var(--c-heading); border-color: var(--c-heading); color: #fff; }

/* ---------------------------------------------------------------- ARTICLE META */
.c-article-meta { font-size: var(--fs-small); color: var(--c-muted); margin: var(--space-4) 0 0; }
.c-article-meta a { color: inherit; }

/* ---------------------------------------------------------------- RESOURCE HEADER */
.c-resource-header__back { font-size: var(--fs-small); margin-bottom: var(--space-4); }
.c-resource-header__back a { color: var(--c-muted); }
.c-resource-header__download { margin: var(--space-5) 0 0; }

/* ---------------------------------------------------------------- RESOURCE LIST */
.c-resource-list { max-width: var(--w-prose); margin-bottom: var(--space-7); }
.c-resource-list__heading { font-size: var(--fs-h3); padding-bottom: var(--space-2); border-bottom: 1px solid var(--c-border); }
.c-resource-list__items { list-style: none; padding: 0; margin: 0; }
.c-resource-list__item { padding: var(--space-4) 0; border-bottom: 1px solid var(--c-border); }
.c-resource-list__title { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: 1.375rem; color: var(--c-heading); text-decoration: none; }
.c-resource-list__title:hover { color: var(--c-accent); }
.c-resource-list__pdf { display: inline-block; margin-left: var(--space-2); font-size: var(--fs-small); font-weight: 500; padding: .1rem .55rem; border: 1px solid var(--c-border); border-radius: 99px; text-decoration: none; vertical-align: .2em; }
.c-resource-list__pdf:hover { border-color: var(--c-accent); }
.c-resource-list__summary { margin: var(--space-1) 0 0; }

/* ---------------------------------------------------------------- FORM FIELD */
.c-form { max-width: 560px; }
.c-form__row { display: grid; gap: 0 var(--space-4); }
@media (min-width: 540px) { .c-form__row { grid-template-columns: 1fr 1fr; } }
.c-field { margin-bottom: var(--space-4); }
.c-field__label { display: block; font-weight: 600; color: var(--c-heading); margin-bottom: var(--space-1); font-size: .9375rem; }
.c-field__label span[aria-hidden] { color: var(--c-error); }
.c-field__optional { font-weight: 400; color: var(--c-muted); font-size: var(--fs-small); }
.c-field__input { width: 100%; font: inherit; color: var(--c-text); padding: .65rem .8rem; border: 1px solid #c9ced4; border-radius: var(--radius); background: #fff; }
.c-field__input:focus { border-color: var(--c-accent); outline: 2px solid var(--c-accent-soft); outline-offset: 0; }
.c-field--error .c-field__input { border-color: var(--c-error); }
.c-field__error { color: var(--c-error); font-size: var(--fs-small); margin: var(--space-1) 0 0; }
.c-form__hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.c-form__note { font-size: var(--fs-small); color: var(--c-muted); }

/* ---------------------------------------------------------------- NOTICE */
.c-notice { padding: var(--space-4) var(--space-5); border-radius: var(--radius); margin-bottom: var(--space-5); max-width: var(--w-prose); border-left: 3px solid; }
.c-notice--success { background: var(--c-success-bg); color: var(--c-success); }
.c-notice--error { background: var(--c-error-bg); color: var(--c-error); }
.c-notice--info { background: var(--c-accent-soft); color: var(--c-heading); border-color: var(--c-accent); }

/* ---------------------------------------------------------------- CONTACT */
.c-contact { display: grid; gap: var(--space-5) var(--space-7); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.c-contact__heading { font-size: var(--fs-h4); margin-bottom: var(--space-2); }
.c-contact p, .c-contact address { margin: 0; }

/* ---------------------------------------------------------------- COOKIE CONSENT */
.c-consent { position: fixed; z-index: 60; left: var(--space-4); right: var(--space-4); bottom: var(--space-4); max-width: 30rem; background: #fff; color: var(--c-text); border-radius: var(--radius-lg); box-shadow: 0 10px 40px rgba(0,0,0,.25); border: 1px solid var(--c-border); }
.c-consent[hidden] { display: none; }
.c-consent__inner { padding: var(--space-5); }
.c-consent__title { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--fs-h4); color: var(--c-heading); margin-bottom: var(--space-2); }
.c-consent__text { font-size: .875rem; }
.c-consent__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.c-consent__actions .c-button { flex: 1; }

/* ---------------------------------------------------------------- STYLE GUIDE (styleguide page only) */
.c-sg-item { border: 1px dashed var(--c-border); border-radius: var(--radius-lg); padding: var(--space-5); margin-bottom: var(--space-6); }
.c-sg-item__name { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8125rem; color: var(--c-accent); margin-bottom: var(--space-1); }
.c-sg-item__desc { font-size: var(--fs-small); color: var(--c-muted); margin-bottom: var(--space-4); }
.c-sg-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--space-3); }
.c-sg-swatch { border: 1px solid var(--c-border); border-radius: var(--radius); overflow: hidden; font-size: .75rem; }
.c-sg-swatch span { display: block; height: 3.5rem; }
.c-sg-swatch code { display: block; padding: var(--space-2); }

/* ---------------------------------------------------------------- PRINT */
@media print {
  .c-site-header, .c-site-footer, .c-consent, .c-cta-band { display: none !important; }
  body { font-size: 11pt; }
  a { color: inherit; }
}

/* ---------------------------------------------------------------- FLOW SPACING (between components) */
.c-prose + .c-accordion, .c-prose + .c-table-wrap, .c-prose + .c-link-list, .c-prose + .c-callout, .c-prose + .c-columns { margin-top: var(--space-5); }
.c-prose + .c-cta-band { margin-top: var(--space-6); }
.c-cta-band:not(:last-child) { margin-bottom: var(--space-7); }