/* Meso Story tokens: generated from tokens/design-tokens.json by _build/build.py. Edit the JSON, not this file.
   Fonts: <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Figtree:wght@400;500;700&family=IBM+Plex+Mono:wght@500&display=swap"> */

:root, [data-theme="light"] {
  color-scheme: light;
  --surface: #fff6e4;
  --surface-raised: #ffffff;
  --line: #e8dcc4;
  --ink: #1b2440;
  --ink-muted: #5a6178;
  --gold: #ffc738;
  --gold-rim: #f39a1b;
  --on-gold: #1b2440;
  --gold-text: #93500a;
  --sprout: #2db36f;
  --sprout-text: #1d7a4a;
  --sky: #3c8cf0;
  --sky-text: #1f62c4;
  --berry: #e5486a;
  --berry-text: #b42346;
  --focus: #1f62c4;
  --shadow-pop: 0 3px 0 #1b2440;
  --shadow-soft: 0 8px 24px rgba(27,36,64,0.14);
}
[data-theme="dark"] {
  color-scheme: dark;
  --surface: #121829;
  --surface-raised: #1e2747;
  --line: #2e3961;
  --ink: #fff6e4;
  --ink-muted: #a9b0c8;
  --gold: #ffc738;
  --gold-rim: #f39a1b;
  --on-gold: #1b2440;
  --gold-text: #ffc738;
  --sprout: #4cc887;
  --sprout-text: #4cc887;
  --sky: #7db4fa;
  --sky-text: #7db4fa;
  --berry: #ff8fa6;
  --berry-text: #ff8fa6;
  --focus: #7db4fa;
  --shadow-pop: 0 3px 0 #05070d;
  --shadow-soft: 0 8px 24px rgba(0,0,0,0.45);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface: #121829;
    --surface-raised: #1e2747;
    --line: #2e3961;
    --ink: #fff6e4;
    --ink-muted: #a9b0c8;
    --gold: #ffc738;
    --gold-rim: #f39a1b;
    --on-gold: #1b2440;
    --gold-text: #ffc738;
    --sprout: #4cc887;
    --sprout-text: #4cc887;
    --sky: #7db4fa;
    --sky-text: #7db4fa;
    --berry: #ff8fa6;
    --berry-text: #ff8fa6;
    --focus: #7db4fa;
    --shadow-pop: 0 3px 0 #05070d;
    --shadow-soft: 0 8px 24px rgba(0,0,0,0.45);
  }
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --stroke-bold: 2px;
  --stroke-hair: 1px;
  --font-display: "Fredoka", "Nunito", "Segoe UI", system-ui, sans-serif;
  --font-body: "Figtree", "Segoe UI", system-ui, sans-serif;
  --font-data: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* raw palette, for illustration only: UI uses the names above */
  --meso-ink: #1B2440;
  --meso-night: #121829;
  --meso-night-2: #1E2747;
  --meso-cream: #FFF6E4;
  --meso-gold: #FFC738;
  --meso-gold-rim: #F39A1B;
  --meso-gold-deep: #B5650A;
  --meso-shine: #FFF8DC;
  --meso-sprout: #2DB36F;
  --meso-sky: #3C8CF0;
  --meso-berry: #E5486A;
  --meso-white: #FFFFFF;
}

.meso-hero { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 600; }
.meso-heading-1 { font-family: var(--font-display); font-size: 40px; line-height: 46px; font-weight: 600; }
.meso-heading-2 { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 600; }
.meso-heading-3 { font-family: var(--font-display); font-size: 20px; line-height: 26px; font-weight: 600; }
.meso-body-lg { font-family: var(--font-body); font-size: 18px; line-height: 28px; font-weight: 400; }
.meso-body { font-family: var(--font-body); font-size: 16px; line-height: 24px; font-weight: 400; }
.meso-body-sm { font-family: var(--font-body); font-size: 14px; line-height: 20px; font-weight: 400; }
.meso-label { font-family: var(--font-body); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.06em; }
.meso-price-lg { font-family: var(--font-data); font-size: 24px; line-height: 28px; font-weight: 500; }
.meso-price { font-family: var(--font-data); font-size: 16px; line-height: 22px; font-weight: 500; }
.meso-meta { font-family: var(--font-data); font-size: 12px; line-height: 16px; font-weight: 500; }

/* Meso Story web kit: components.
   Needs the tokens first (tokens/tokens.css), or link web/kit/meso-story.css, which bundles both.
   Every class starts with meso-. Icons: <svg class="meso-icon"><use href="icons.svg#meso-i-NAME"/></svg> */

/* ---- Base ------------------------------------------------------------ */
:where(html) { -webkit-text-size-adjust: 100%; }
:where(body) {
  margin: 0; background: var(--surface); color: var(--ink);
  font-family: var(--font-body); font-size: 16px; line-height: 24px;
  -webkit-font-smoothing: antialiased;
}
:where(h1, h2, h3, h4) { margin: 0; font-family: var(--font-display); font-weight: 600; }
:where(p) { margin: 0; }
:where(a) { color: var(--sky-text); text-underline-offset: 3px; }
:where(:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Swap light/dark artwork (logos) with the theme */
[data-theme="light"] .meso-only-dark, [data-theme="dark"] .meso-only-light { display: none !important; }
@media (prefers-color-scheme: light) { :root:not([data-theme]) .meso-only-dark { display: none !important; } }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .meso-only-light { display: none !important; } }

/* ---- Layout ---------------------------------------------------------- */
.meso-container { box-sizing: border-box; width: 100%; max-width: 1120px; margin-inline: auto; padding-inline: var(--space-4); }
.meso-section { padding-block: var(--space-8); }
.meso-stack { display: flex; flex-direction: column; gap: var(--space-4); }
.meso-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.meso-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
@media (min-width: 720px) {
  .meso-container { padding-inline: var(--space-6); }
  .meso-section { padding-block: var(--space-12); }
  .meso-grid { gap: var(--space-6); }
}
.meso-eyebrow { font: 700 12px/16px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.meso-lead { max-width: 60ch; font-size: 18px; line-height: 28px; color: var(--ink-muted); }
.meso-muted { color: var(--ink-muted); }
.meso-data { font-family: var(--font-data); font-weight: 500; font-variant-numeric: tabular-nums; }
.meso-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- Icon ------------------------------------------------------------ */
.meso-icon {
  flex: none; width: 24px; height: 24px; vertical-align: -6px;
  fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.meso-icon--20 { width: 20px; height: 20px; stroke-width: 2.4; vertical-align: -4px; }
.meso-icon--16 { width: 16px; height: 16px; stroke-width: 2.6; vertical-align: -3px; }

/* ---- Button ---------------------------------------------------------- */
.meso-btn {
  --_bg: var(--surface-raised); --_fg: var(--ink); --_bd: var(--ink);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  box-sizing: border-box; min-height: 44px; padding: 0 var(--space-4);
  border: var(--stroke-bold) solid var(--_bd); border-radius: var(--radius-md);
  background: var(--_bg); color: var(--_fg); box-shadow: var(--shadow-pop);
  font: 700 16px/20px var(--font-body); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: transform 80ms ease-out, box-shadow 80ms ease-out, background-color 120ms;
}
.meso-btn:hover { background: color-mix(in srgb, var(--_bg) 88%, var(--_fg)); }
.meso-btn:active { transform: translateY(3px); box-shadow: none; }
.meso-btn .meso-icon { width: 20px; height: 20px; stroke-width: 2.4; }
.meso-btn--primary { --_bg: var(--gold); --_fg: var(--on-gold); }
.meso-btn--primary:hover { background: color-mix(in srgb, var(--gold) 80%, #ffffff); }
.meso-btn--danger { --_fg: var(--berry-text); --_bd: var(--berry-text); }
.meso-btn--ghost { --_bd: transparent; background: transparent; box-shadow: none; }
.meso-btn--ghost:hover { background: color-mix(in srgb, var(--ink) 8%, transparent); }
.meso-btn--sm { min-height: 36px; padding: 0 var(--space-3); font-size: 14px; }
.meso-btn--icon { width: 44px; padding: 0; }
.meso-btn--sm.meso-btn--icon { width: 36px; }
.meso-btn:disabled, .meso-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

/* ---- Field ----------------------------------------------------------- */
.meso-field { display: grid; gap: 6px; }
.meso-field__label { font-size: 14px; line-height: 20px; font-weight: 700; }
.meso-field__hint { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.meso-field__error { display: flex; align-items: center; gap: var(--space-1); font-size: 14px; line-height: 20px; color: var(--berry-text); }
.meso-input, .meso-select select {
  box-sizing: border-box; width: 100%; min-height: 44px; margin: 0; padding: 0 var(--space-3);
  border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-md);
  background: var(--surface-raised); color: var(--ink); font: 400 16px/24px var(--font-body);
}
.meso-input::placeholder { color: var(--ink-muted); opacity: 1; }
.meso-input[aria-invalid="true"] { border-color: var(--berry-text); }
.meso-input--data { font-family: var(--font-data); font-weight: 500; font-variant-numeric: tabular-nums; }
textarea.meso-input { min-height: 96px; padding-block: 10px; resize: vertical; }
.meso-input-icon, .meso-input-unit, .meso-select { position: relative; display: block; }
.meso-input-icon > .meso-icon, .meso-select > .meso-icon {
  position: absolute; top: 50%; transform: translateY(-50%); pointer-events: none;
  width: 20px; height: 20px; stroke-width: 2.4;
}
.meso-input-icon > .meso-icon { left: 12px; color: var(--ink-muted); }
.meso-input-icon > .meso-input { padding-left: 42px; }
.meso-input-unit > .meso-input { padding-right: 72px; }
.meso-input-unit > span {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%); pointer-events: none;
  font: 500 14px/20px var(--font-data); color: var(--ink-muted);
}
.meso-select select { appearance: none; padding-right: 44px; cursor: pointer; }
.meso-select > .meso-icon { right: 12px; }

/* ---- Chip and tag ---------------------------------------------------- */
.meso-chip {
  display: inline-flex; align-items: center; gap: 6px; box-sizing: border-box; min-height: 32px; padding: 0 14px;
  border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-pill);
  background: var(--surface-raised); color: var(--ink); font: 500 14px/20px var(--font-body); cursor: pointer;
}
.meso-chip .meso-icon { width: 16px; height: 16px; stroke-width: 2.6; }
.meso-chip:hover { background: color-mix(in srgb, var(--surface-raised) 88%, var(--ink)); }
.meso-chip[aria-pressed="true"] { background: var(--ink); color: var(--surface); }
.meso-tag {
  display: inline-flex; align-items: center; gap: var(--space-1); padding: 2px var(--space-2);
  border: var(--stroke-hair) solid var(--line); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--ink-muted); font: 500 12px/16px var(--font-data);
}

/* ---- Status pill: always an icon and words, never color alone -------- */
.meso-status {
  --_c: var(--ink-muted);
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 7px;
  border: var(--stroke-hair) solid var(--_c); border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--_c) 10%, var(--surface-raised)); color: var(--_c);
  font: 500 12px/16px var(--font-data); white-space: nowrap;
}
.meso-status .meso-icon { width: 16px; height: 16px; stroke-width: 2.6; }
.meso-status--fresh { --_c: var(--sprout-text); }
.meso-status--aging { --_c: var(--ink); border-color: var(--gold-rim); background: color-mix(in srgb, var(--gold-rim) 18%, var(--surface-raised)); }
.meso-status--stale { --_c: var(--berry-text); }

/* ---- Card ------------------------------------------------------------ */
.meso-card {
  box-sizing: border-box; padding: var(--space-4);
  border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-lg);
  background: var(--surface-raised); color: var(--ink); box-shadow: var(--shadow-pop);
}
.meso-card--flat { border: var(--stroke-hair) solid var(--line); box-shadow: none; }
.meso-card:where(a) { display: block; text-decoration: none; transition: transform 80ms ease-out, box-shadow 80ms ease-out; }
.meso-card:where(a):active { transform: translateY(3px); box-shadow: none; }
@media (min-width: 720px) { .meso-card { padding: var(--space-6); } }

/* ---- Item card: one price with its kind, world and age --------------- */
.meso-item { display: grid; gap: var(--space-3); }
.meso-item__head { display: flex; align-items: flex-start; gap: var(--space-3); }
.meso-item__thumb {
  flex: none; display: grid; place-items: center; width: 48px; height: 48px;
  border: var(--stroke-hair) solid var(--line); border-radius: var(--radius-md);
  background: var(--surface); color: var(--ink-muted);
}
.meso-item__title { flex: 1; min-width: 0; }
.meso-item__name { font: 600 20px/26px var(--font-display); }
.meso-item__sub, .meso-item__kind { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.meso-item__price { display: flex; align-items: baseline; gap: 6px; font-family: var(--font-data); font-weight: 500; font-variant-numeric: tabular-nums; }
.meso-item__value { font-size: 24px; line-height: 28px; }
.meso-item__unit { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.meso-item__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2);
  padding-top: var(--space-3); border-top: var(--stroke-hair) solid var(--line);
  font: 500 12px/16px var(--font-data); color: var(--ink-muted);
}

/* ---- Tool card ------------------------------------------------------- */
.meso-tool {
  --_accent: var(--gold-text);
  display: grid; grid-template-columns: auto 1fr; column-gap: var(--space-4); row-gap: var(--space-1);
  align-content: start; color: var(--ink); text-decoration: none;
}
.meso-tool__icon { grid-row: span 3; width: 64px; height: 64px; }
.meso-tool__name { font: 600 20px/26px var(--font-display); }
.meso-tool__desc { color: var(--ink-muted); }
.meso-tool__link { display: inline-flex; align-items: center; gap: var(--space-1); margin-top: var(--space-2); font-weight: 700; color: var(--_accent); }
.meso-tool__link .meso-icon { width: 20px; height: 20px; stroke-width: 2.4; }
.meso-tool--tracker { --_accent: var(--sky-text); }
.meso-tool--farmers { --_accent: var(--sprout-text); }
.meso-tool--planner { --_accent: var(--gold-text); }

/* ---- Alert: full outline in the state color, text stays ink --------- */
.meso-alert {
  --_c: var(--sky-text);
  display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-3) var(--space-4);
  border: var(--stroke-bold) solid var(--_c); border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--_c) 8%, var(--surface-raised)); color: var(--ink);
}
.meso-alert > .meso-icon { color: var(--_c); }
.meso-alert__title { font-weight: 700; }
.meso-alert--success { --_c: var(--sprout-text); }
.meso-alert--warn { --_c: var(--gold-text); }
.meso-alert--error { --_c: var(--berry-text); }

/* ---- Table ----------------------------------------------------------- */
.meso-table-wrap {
  min-width: 0; max-width: 100%; overflow-x: auto;
  border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-lg);
  background: var(--surface-raised);
}
.meso-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 20px; }
.meso-table caption { padding: var(--space-3) var(--space-4) 0; text-align: left; font: 600 20px/26px var(--font-display); }
.meso-table th {
  padding: 10px var(--space-4); text-align: left; white-space: nowrap;
  border-bottom: var(--stroke-bold) solid var(--ink);
  font: 700 12px/16px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted);
}
.meso-table td { padding: var(--space-3) var(--space-4); border-bottom: var(--stroke-hair) solid var(--line); vertical-align: middle; }
.meso-table tbody tr:last-child td { border-bottom: 0; }
.meso-table tbody tr:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); }
.meso-table .meso-num { text-align: right; white-space: nowrap; font-family: var(--font-data); font-weight: 500; font-variant-numeric: tabular-nums; }

/* ---- Steps: numbered coins ------------------------------------------ */
.meso-steps {
  display: grid; gap: var(--space-6); margin: 0; padding: 0; list-style: none; counter-reset: meso-step;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}
.meso-steps > li { display: grid; gap: var(--space-2); align-content: start; counter-increment: meso-step; }
.meso-steps > li::before {
  content: counter(meso-step); display: grid; place-items: center; box-sizing: border-box; width: 48px; height: 48px;
  border: var(--stroke-bold) solid var(--ink); border-radius: 50%;
  background: var(--gold); color: var(--on-gold); box-shadow: inset 0 0 0 4px var(--gold-rim);
  font: 600 20px/1 var(--font-display);
}
.meso-steps h3 { font: 600 20px/26px var(--font-display); }
.meso-steps p { color: var(--ink-muted); }

/* ---- Band: one gold call to action per page ------------------------- */
.meso-band {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4) var(--space-6);
  padding: var(--space-6); border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-lg);
  background: var(--gold); color: var(--on-gold); box-shadow: var(--shadow-pop);
}
.meso-band :focus-visible { outline-color: var(--on-gold); }
.meso-band h2 { font: 600 28px/34px var(--font-display); }
.meso-band p { max-width: 52ch; }
@media (min-width: 720px) { .meso-band { padding: var(--space-8) var(--space-12); } }

/* ---- Header ---------------------------------------------------------- */
.meso-header {
  position: sticky; top: 0; z-index: 10;
  border-bottom: var(--stroke-hair) solid var(--line);
  background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(8px);
}
.meso-header__inner { position: relative; display: flex; align-items: center; gap: var(--space-3); min-height: 64px; }
.meso-header__brand { display: inline-flex; flex: none; }
.meso-header__brand img { display: block; width: auto; height: 36px; }
.meso-header__nav { display: flex; gap: var(--space-1); margin-left: auto; }
.meso-header__nav a { padding: 8px 12px; border-radius: var(--radius-md); color: var(--ink); font-weight: 500; text-decoration: none; }
.meso-header__nav a:hover { background: color-mix(in srgb, var(--ink) 8%, transparent); }
.meso-header__nav a[aria-current="page"] { text-decoration: underline 2px; text-underline-offset: 8px; }
.meso-header__menu { display: none; }
@media (max-width: 760px) {
  .meso-header__brand img { height: 30px; }
  .meso-header__nav { display: none; }
  .meso-header__cta { margin-left: auto; }
  .meso-header__menu { display: inline-flex; }
  .meso-header[data-open] .meso-header__nav {
    position: absolute; top: 100%; left: 0; right: 0; display: grid; gap: 0; padding: var(--space-2);
    border: var(--stroke-bold) solid var(--ink); border-radius: var(--radius-lg);
    background: var(--surface-raised); box-shadow: var(--shadow-soft);
  }
  .meso-header[data-open] .meso-header__nav a { padding: 12px; }
}

/* ---- Footer ---------------------------------------------------------- */
.meso-footer { padding-block: var(--space-8); border-top: var(--stroke-hair) solid var(--line); }
.meso-footer__inner { display: grid; gap: var(--space-6); }
.meso-footer__top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-6) var(--space-12); }
.meso-footer__brand img { display: block; width: auto; height: 32px; }
.meso-footer__cols { display: flex; flex-wrap: wrap; gap: var(--space-6) var(--space-12); }
.meso-footer__col { display: grid; gap: var(--space-2); align-content: start; }
.meso-footer__col h2 { font: 700 12px/16px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.meso-footer__col a { color: var(--ink); font-size: 14px; line-height: 20px; text-decoration: none; }
.meso-footer__col a:hover { text-decoration: underline; }
.meso-footer__legal {
  max-width: 72ch; padding-top: var(--space-4); border-top: var(--stroke-hair) solid var(--line);
  font-size: 14px; line-height: 20px; color: var(--ink-muted);
}

@media (prefers-reduced-motion: reduce) {
  .meso-btn, .meso-card:where(a) { transition: none; }
  .meso-btn:active, .meso-card:where(a):active { transform: none; }
}


.legal-main { padding-block: var(--space-10, 48px) var(--space-12, 64px); }
.legal { max-width: 46rem; margin-inline: auto; line-height: 1.65; }
.legal h1 { margin: 0 0 var(--space-2, 8px); }
.legal h2 { margin: var(--space-8, 32px) 0 var(--space-3, 12px); font-size: 1.3rem; }
.legal p, .legal ul, .legal ol, .legal .meso-table-wrap { margin: 0 0 var(--space-4, 16px); }
.legal ul, .legal ol { padding-left: 1.4em; }
.legal li { margin-bottom: var(--space-2, 8px); }
.legal a { text-decoration: underline; text-underline-offset: 2px; }
.legal code { font-size: .92em; }
.legal-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.legal-top img { height: 36px; width: auto; display: block; }
.legal-nav { display: flex; gap: 16px; flex-wrap: wrap; }
.blog-meta { color: var(--ink-muted); font-size: .92rem; margin-bottom: var(--space-2, 8px); }
.blog-lead { font-size: 1.1rem; color: var(--ink-muted); }
.blog-cover, .blog-card img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; border-radius: var(--radius-lg, 16px); border: 1px solid var(--line); margin: var(--space-4, 16px) 0; }
.blog-card { display: grid; gap: var(--space-3, 12px); padding: var(--space-4, 16px) 0; border-bottom: 1px solid var(--line); }
.blog-card h2 { margin: 0; font-size: 1.35rem; }
.blog-card h2 a, .blog-card a { text-decoration: none; }
@media (min-width: 720px) { .blog-card { grid-template-columns: 280px 1fr; align-items: center; } .blog-card img { margin: 0; } }
.blog-post blockquote { margin: 0 0 16px; padding: 8px 16px; border-left: 4px solid var(--gold); background: var(--surface); border-radius: 8px; }
.blog-post hr { border: 0; border-top: 1px solid var(--line); margin: 32px 0; }
.blog-cta { margin-top: 24px; font-weight: 600; }