/* Eden Solutions · blog: the article page, after the "Cum înființez un SRL" guide (artifact approved by the owner, 2026-11-06).
   Article pages use Miere more often than the rest of the site: the progress honeycomb, the ticks, the step numbers,
   the rule under the title and the closing button (owner's decision, 2026-11-06). Everything is scoped under .post
   so the rest of the site is untouched. Light mode only, like the rest of the site. The Onest font comes from styles.css. */

.post {
  --b-navy: #0A2342;
  --b-blue: #1F4E8C;
  --b-sky: #BFD4EE;
  --b-bg: #F2F6FB;
  --b-surface: #FDFEFF;
  --b-surface-2: #E8F0FA;
  --b-fg: #0A2342;
  --b-muted: #44546A;
  --b-line: #D5E1F0;
  --b-gold: #D9A441;
  --b-gold-ink: #7A5A12;
  --b-gold-soft: #FBF3E0;
  --b-hero-fg: #F2F6FB;
  --b-hero-muted: #C9D9EE;
  --b-step--1: 0.875rem;
  --b-step-0: 1.0625rem;
  --b-step-1: 1.25rem;
  --b-step-2: 1.625rem;
  --b-step-3: clamp(1.9rem, 4.2vw, 2.9rem);
  --b-radius: 14px;
  --b-hex: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  --b-top: var(--bar-h, 0px);

  background: var(--b-bg); color: var(--b-fg);
  font-family: var(--font, "Onest", Arial, sans-serif); font-size: var(--b-step-0); line-height: 1.6;
}
.post *, .post *::before, .post *::after { box-sizing: border-box; }
/* Hidden variant lists and messages stay hidden, however specific their display rule */
.post [hidden] { display: none !important; }
.post a { color: var(--b-blue); text-underline-offset: 3px; }
.post a:focus-visible, .post button:focus-visible, .post input:focus-visible, .post summary:focus-visible, .post label:focus-within { outline: 3px solid var(--b-gold); outline-offset: 2px; border-radius: 6px; }
.post h1, .post h2, .post h3 { text-wrap: balance; line-height: 1.2; margin: 0; letter-spacing: 0; }
.post p { margin: 0; }
.post .wrap { max-width: 1120px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* Article hero. Its colours come from the palette chosen in the settings (data-palette on .post); Navy Eden by default */
.post .b-hero {
  --h-bg: var(--b-navy); --h-fg: #F2F6FB; --h-muted: #C9D9EE; --h-accent: var(--b-gold); --h-rule: var(--b-gold);
  --h-line: rgba(191, 212, 238, 0.28); --h-cell: #C9D9EE; --h-cell-o: 0.16;
  background: var(--h-bg); color: var(--h-fg); position: relative; overflow: hidden;
}
/* Albastru Încredere: the primary blue as background; a lighter Miere so it stays readable on blue */
.post[data-palette="blue"] .b-hero { --h-bg: #1F4E8C; --h-fg: #FFFFFF; --h-muted: #DCE7F6; --h-accent: #F2CD7E; --h-rule: #F2CD7E; --h-line: rgba(255, 255, 255, 0.3); --h-cell: #DCE7F6; }
/* Ceață: light hero, Navy Eden text; the eyebrow in dark Miere (Miere is never text on a light ground) */
.post[data-palette="mist"] .b-hero { --h-bg: #E3ECF8; --h-fg: #0A2342; --h-muted: #44546A; --h-accent: #7A5A12; --h-rule: #D9A441; --h-line: #BFD4EE; --h-cell: #1F4E8C; --h-cell-o: 0.12; }
/* Miere: warm, light hero */
.post[data-palette="honey"] .b-hero { --h-bg: #FBF1DA; --h-fg: #0A2342; --h-muted: #4F4A3E; --h-accent: #7A5A12; --h-rule: #D9A441; --h-line: #E8D3A2; --h-cell: #C8912F; --h-cell-o: 0.2; }
.post .b-hero .wrap { padding-block: 40px 44px; display: grid; gap: 28px; position: relative; z-index: 1; }
/* Brand-book honeycomb: outlined cells, a quiet background */
.post .comb-bg { position: absolute; right: -40px; top: 50%; transform: translateY(-50%); width: min(520px, 60vw); height: auto; pointer-events: none; z-index: 0; }
.post .comb-bg .cell { fill: none; stroke: var(--h-cell); stroke-width: 1.5; opacity: var(--h-cell-o); }
.post .comb-bg .cell.honey { fill: var(--h-rule); stroke: var(--h-rule); opacity: 0.22; }
.post .comb-bg .cell.filling { animation: post-fill-cell 4s ease-in-out infinite alternate; }
@keyframes post-fill-cell { from { fill: transparent; } to { fill: var(--h-rule); } }
.post .eyebrow { font-size: var(--b-step--1); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--h-accent); }
.post .b-hero h1 { font-size: var(--b-step-3); font-weight: 700; max-width: 22ch; color: var(--h-fg); }
.post .b-hero h1 .sub { color: var(--h-muted); font-weight: 500; }
.post .gold-rule { width: 96px; height: 4px; background: var(--h-rule); border-radius: 2px; }
.post .answer { max-width: 68ch; font-size: var(--b-step-1); color: var(--h-muted); }
.post .answer b, .post .answer strong { color: var(--h-fg); }
.post .figures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; max-width: 760px; }
.post .figure { border: 1px solid var(--h-line); border-radius: var(--b-radius); padding: 16px 18px; display: grid; gap: 2px; }
.post .figure strong { font-size: var(--b-step-2); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--h-fg); }
.post .figure span { font-size: var(--b-step--1); color: var(--h-muted); }
.post .byline { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: var(--b-step--1); color: var(--h-muted); }
.post .byline .who { display: flex; align-items: center; gap: 12px; }
.post .byline b { color: var(--h-fg); font-weight: 600; }
.post .mono { width: 46px; height: 46px; flex: none; border-radius: 50%; background: var(--h-bg); border: 3px solid var(--h-rule); display: grid; place-items: center; font-weight: 700; font-size: 0.95rem; color: var(--h-fg); }
.post .mono--img { object-fit: cover; background: var(--white); }
/* Publication dates: their own line under the author, small and quiet */
.post .meta-dates { margin-top: -12px; font-size: 0.8125rem; letter-spacing: 0.02em; color: var(--h-muted); opacity: 0.8; font-variant-numeric: tabular-nums; }

/* Article and sidebar */
.post .layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; padding-block: 48px 64px; align-items: start; }
.post .layout--single { grid-template-columns: minmax(0, 1fr); }
.post .layout--single .article { margin-inline: auto; }
/* One column that may shrink to the screen: an auto track would grow to the widest block's minimum (the SRL guide ran 456px wide on a 390px phone) */
.post .article { display: grid; grid-template-columns: minmax(0, 1fr); gap: 56px; min-width: 0; max-width: 72ch; }
.post .intro { display: grid; gap: 18px; }
.post .side { position: sticky; top: calc(var(--b-top) + 24px); display: grid; gap: 16px; }

/* Progress */
.post .progress-card { background: var(--b-surface); border: 1px solid var(--b-line); border-radius: var(--b-radius); padding: 20px; display: grid; gap: 14px; }
.post .progress-card h2 { font-size: var(--b-step-0); font-weight: 700; }
.post .b-bar { height: 8px; background: var(--b-surface-2); border-radius: 999px; overflow: hidden; }
.post .b-bar i { display: block; height: 100%; width: 0; background: var(--b-gold); border-radius: 999px; transition: width 0.35s ease; }
.post .count { font-size: var(--b-step--1); color: var(--b-muted); font-variant-numeric: tabular-nums; }
.post .toc { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.post .toc a { display: flex; justify-content: space-between; gap: 8px; text-decoration: none; color: var(--b-fg); padding: 6px 8px; border-radius: 8px; font-size: var(--b-step--1); }
.post .toc a:hover { background: var(--b-surface-2); }
.post .toc a.done { color: var(--b-muted); }
/* The section being read (blog.js marks it as the page scrolls): a Miere bar and a tinted row */
.post .toc a[aria-current="location"] { background: var(--b-surface-2); box-shadow: inset 3px 0 0 var(--b-gold); color: var(--b-fg); font-weight: 600; }
.post .toc a.done .tick { color: var(--b-gold-ink); }
.post .tick { font-variant-numeric: tabular-nums; color: var(--b-muted); }
.post .comb { display: flex; flex-wrap: wrap; gap: 3px 2px; }
.post .comb i { width: 20px; height: 23px; clip-path: var(--b-hex); background: var(--b-line); position: relative; transition: background 0.3s; }
.post .comb i::before { content: ""; position: absolute; inset: 2px; clip-path: var(--b-hex); background: var(--b-surface); transition: background 0.3s; }
.post .comb i.on, .post .comb i.on::before { background: var(--b-gold); }
.post .comb-label { font-size: var(--b-step--1); color: var(--b-muted); }
.post .done-msg { font-size: var(--b-step--1); font-weight: 600; color: var(--b-gold-ink); background: var(--b-gold-soft); border-radius: 10px; padding: 10px 12px; }
.post .reset { justify-self: start; background: none; border: 0; padding: 0; color: var(--b-muted); font: inherit; font-size: var(--b-step--1); text-decoration: underline; cursor: pointer; }

/* Progress strip on phones */
.post .strip { display: none; position: sticky; top: var(--b-top); z-index: 5; background: var(--b-surface); border-bottom: 1px solid var(--b-line); }
.post .strip .wrap { padding-block: 10px; display: flex; align-items: center; gap: 12px; }
.post .strip .b-bar { flex: 1; }

/* Sections */
.post section { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; scroll-margin-top: calc(var(--b-top) + 72px); }
.post .sec-head { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.post .step-hex { position: relative; width: 52px; height: 52px; }
.post .step-hex svg { width: 100%; height: 100%; display: block; }
.post .step-hex b { position: absolute; inset: 0; display: grid; place-items: center; color: var(--b-hero-fg); font-weight: 700; font-size: 1.15rem; }
.post .step-hex.full polygon { fill: var(--b-gold); stroke: var(--b-gold); }
.post .step-hex.full b { color: var(--b-navy); }
.post section h2 { font-size: var(--b-step-2); font-weight: 700; }
.post section h3 { font-size: var(--b-step-1); font-weight: 700; }
.post .lead { color: var(--b-muted); }
.post .article .b-list, .post .article ul:not([class]), .post .article ol:not([class]) { margin: 0; padding-left: 1.3em; list-style: disc; display: grid; gap: 6px; }

/* Article images */
.post .b-figure { margin: 0; display: grid; gap: 8px; }
.post .b-figure img { display: block; width: 100%; height: auto; border-radius: var(--b-radius); border: 1px solid var(--b-line); }
.post .b-figure figcaption { font-size: var(--b-step--1); color: var(--b-muted); }

/* Checklist: every tick is a honeycomb cell (outer hexagon = outline, inner = fill) */
.post .checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.post .checklist li { background: var(--b-surface); border: 1px solid var(--b-line); border-radius: 12px; transition: border-color 0.2s, background 0.2s; }
.post .checklist label, .post .checklist .ck { display: grid; grid-template-columns: 26px 1fr; gap: 14px; padding: 14px 16px; cursor: pointer; }
.post .checklist input { appearance: none; position: relative; width: 24px; height: 27px; margin: 1px 0 0; display: grid; place-items: center; cursor: pointer; background: var(--b-blue); clip-path: var(--b-hex); border: 0; }
.post .checklist input::before { content: ""; position: absolute; inset: 2.5px; clip-path: var(--b-hex); background: var(--b-surface); transition: background 0.2s; }
.post .checklist input::after { content: ""; position: relative; width: 6px; height: 11px; border: solid var(--b-navy); border-width: 0 3px 3px 0; transform: rotate(45deg) translate(-1px, -1px); opacity: 0; }
.post .checklist input:checked, .post .checklist input:checked::before { background: var(--b-gold); }
.post .checklist input:checked::after { opacity: 1; }
.post .checklist li:has(input:checked) { background: var(--b-surface-2); border-color: var(--b-sky); }
.post .checklist li:has(input:checked) .item-title { text-decoration: line-through; text-decoration-color: var(--b-gold); text-decoration-thickness: 2px; }
.post .item-title { font-weight: 600; }
.post .item-body { display: block; color: var(--b-muted); font-size: 0.97rem; margin-top: 2px; }

/* Variant switch (for example online / in person) */
.post .variants { display: grid; gap: 18px; }
.post .switch { justify-self: start; display: inline-flex; flex-wrap: wrap; background: var(--b-surface-2); border-radius: 999px; padding: 4px; gap: 4px; border: 1px solid var(--b-line); }
.post .switch button { border: 0; background: none; font: inherit; font-weight: 600; color: var(--b-muted); padding: 8px 18px; border-radius: 999px; cursor: pointer; }
.post .switch button[aria-pressed="true"] { background: var(--b-blue); color: var(--b-bg); }
.post .note { background: var(--b-surface); border: 1px solid var(--b-line); border-left: 4px solid var(--b-gold); border-radius: 10px; padding: 14px 16px; display: grid; gap: 10px; }

/* Fee calculator */
.post .calc { background: var(--b-surface); border: 1px solid var(--b-line); border-radius: var(--b-radius); overflow: hidden; }
.post .calc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 260px; }
.post .calc-form { padding: 22px; display: grid; gap: 18px; min-width: 0; }
.post .b-field { display: grid; gap: 8px; border: 0; padding: 0; margin: 0; min-width: 0; }
.post .b-field legend { font-weight: 600; padding: 0; margin-bottom: 8px; }
.post .b-field legend small { font-weight: 400; color: var(--b-muted); font-size: var(--b-step--1); }
.post .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.post .chip { position: relative; }
.post .chip[hidden] { display: none; }
.post .chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; margin: 0; }
.post .chip span { display: inline-flex; gap: 6px; align-items: baseline; border: 1px solid var(--b-line); background: var(--b-bg); border-radius: 999px; padding: 7px 14px; font-size: 0.95rem; font-variant-numeric: tabular-nums; }
.post .chip span em { font-style: normal; color: var(--b-muted); font-size: var(--b-step--1); }
.post .chip input:checked + span { border-color: var(--b-blue); background: var(--b-blue); color: var(--b-bg); }
.post .chip input:checked + span em { color: var(--b-bg); opacity: 0.85; }
.post .chip input:focus-visible + span { outline: 3px solid var(--b-gold); outline-offset: 2px; }
.post .toggle { display: flex; gap: 10px; align-items: flex-start; font-size: 0.95rem; cursor: pointer; }
.post .toggle input { width: 18px; height: 18px; margin-top: 4px; accent-color: var(--b-blue); }
.post .calc-total { background: var(--b-navy); color: var(--b-hero-fg); padding: 22px; display: grid; gap: 12px; align-content: start; position: relative; overflow: hidden; }
.post .calc-total > * { position: relative; z-index: 1; }
.post .calc-total .comb-corner, .post .b-cta .comb-corner { position: absolute; right: -18px; bottom: -14px; width: 150px; height: auto; z-index: 0; pointer-events: none; }
.post .comb-corner .cell { fill: none; stroke: var(--b-hero-muted); stroke-width: 1.5; opacity: 0.18; }
.post .comb-corner .cell.honey { fill: var(--b-gold); stroke: var(--b-gold); opacity: 0.3; }
.post .calc-total .b-label { font-size: var(--b-step--1); letter-spacing: 0.12em; text-transform: uppercase; color: var(--b-gold); font-weight: 600; }
.post .calc-total .sum { font-size: 2.6rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.post .calc-total ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--b-step--1); color: var(--b-hero-muted); }
.post .calc-total li { display: flex; justify-content: space-between; gap: 10px; font-variant-numeric: tabular-nums; }
.post .calc-total .days { font-size: var(--b-step--1); color: var(--b-hero-muted); border-top: 1px solid rgba(191, 212, 238, 0.25); padding-top: 10px; }

/* Section rule: three hexagons, the middle one filled */
.post .section-rule { display: flex; gap: 6px; align-items: center; }
.post .section-rule svg { width: 14px; height: 16px; }
.post .section-rule svg polygon { fill: none; stroke: var(--b-sky); stroke-width: 10; }
.post .section-rule svg.honey polygon { fill: var(--b-gold); stroke: var(--b-gold); }

/* Tables. Every two-column table has the same proportions, so the second column starts at the same place in each one;
   a column of amounts (class "num", decided in render.mjs) is aligned right, its heading too. Wider tables keep their
   columns on wide screens and become one card per row on phones, each value under its column's heading (data-label). */
.post .table-scroll { overflow-x: auto; border: 1px solid var(--b-line); border-radius: 12px; background: var(--b-surface); }
.post table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.post table[data-cols="2"] { table-layout: fixed; }
.post table[data-cols="2"] th:first-child { width: 64%; }
.post table:not([data-cols="2"]) { min-width: 520px; }
.post th, .post td { text-align: left; padding: 12px 16px; vertical-align: top; border-top: 1px solid var(--b-line); overflow-wrap: break-word; }
.post thead th { border-top: 0; background: var(--b-surface-2); font-weight: 600; font-size: var(--b-step--1); letter-spacing: 0.04em; }
.post th.num, .post td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* A site price never breaks across lines (its thousands separator is a no-break space too) */
.post .b-price { white-space: nowrap; }

/* Common mistakes */
.post .mistakes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.post .mistake { background: var(--b-surface); border: 1px solid var(--b-line); border-radius: 12px; }
.post .mistake summary, .post .b-faq summary, .post .ed-sum { list-style: none; cursor: pointer; padding: 16px 18px; font-weight: 600; display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.post .mistake summary::-webkit-details-marker, .post .b-faq summary::-webkit-details-marker { display: none; }
.post .mistake summary::after, .post .b-faq summary::after { content: "+"; color: var(--b-gold-ink); font-weight: 700; font-size: 1.25rem; line-height: 1; }
.post .mistake[open] summary::after, .post .b-faq details[open] summary::after { content: "−"; }
.post .mistake .body { padding: 0 18px 16px; display: grid; gap: 8px; font-size: 0.95rem; }
.post .mistake .body p span { display: block; font-size: var(--b-step--1); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--b-muted); }

/* Journey */
.post .journey { list-style: none; margin: 0; padding: 0; display: grid; }
.post .journey li { display: grid; grid-template-columns: 28px 1fr; gap: 16px; position: relative; padding-bottom: 20px; }
.post .journey li::before { content: ""; position: absolute; left: 13px; top: 32px; bottom: 0; width: 2px; background: var(--b-line); }
.post .journey li:last-child::before { display: none; }
.post .journey .dot { position: relative; width: 28px; height: 32px; clip-path: var(--b-hex); background: var(--b-blue); display: grid; place-items: center; }
.post .journey .dot::before { content: ""; position: absolute; inset: 2.5px; clip-path: var(--b-hex); background: var(--b-surface); }
.post .journey .dot::after { content: ""; position: relative; width: 12px; height: 14px; clip-path: var(--b-hex); background: var(--b-gold); }
.post .journey b { display: block; }
.post .journey p { color: var(--b-muted); }

/* Closing band */
.post .b-cta { background: var(--b-navy); color: var(--b-hero-fg); border-radius: 18px; padding: 28px; display: grid; gap: 14px; position: relative; overflow: hidden; }
.post .b-cta > *:not(.comb-corner) { position: relative; z-index: 1; }
.post .b-cta .comb-corner { width: 220px; }
.post .b-cta h3 { color: var(--b-hero-fg); }
.post .b-cta p { color: var(--b-hero-muted); }
.post .b-cta .b-btn { justify-self: start; background: var(--b-gold); color: var(--b-navy); border: 0; border-radius: 999px; padding: 12px 22px; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.post .b-cta .b-btn:hover { background: #C8912F; }
.post .b-cta .tagline { color: var(--b-hero-fg); font-weight: 600; }
.post .b-cta a:not(.b-btn) { color: #F0D49A; }

/* FAQ */
.post .b-faq { display: grid; gap: 8px; }
.post .b-faq details, .post .b-faq .ed-det { background: var(--b-surface); border: 1px solid var(--b-line); border-radius: 12px; }
.post .b-faq details > :not(summary), .post .b-faq .ed-det > :not(.ed-sum) { padding: 0 18px 16px; color: var(--b-muted); }

.post .limits { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.post .limits li { padding: 14px 16px; background: var(--b-surface); border: 1px solid var(--b-line); border-radius: 12px; }
.post .sources { font-size: var(--b-step--1); color: var(--b-muted); display: grid; gap: 8px; }
.post .sources ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }

@media (max-width: 960px) {
  .post .layout { grid-template-columns: minmax(0, 1fr); }
  .post .side { display: none; }
  .post .strip { display: block; }
  .post .calc-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .post .figures { grid-template-columns: minmax(0, 1fr); }
  .post .mistakes { grid-template-columns: minmax(0, 1fr); }
  .post .b-hero .wrap { padding-block: 36px 32px; }
  .post th, .post td { padding: 10px 12px; }
  /* Wide tables as cards: the header row stays for screen readers only; in the editor they keep their columns (and scroll) */
  .post:not(.is-editing) table:not([data-cols="2"]) { min-width: 0; }
  .post:not(.is-editing) table:not([data-cols="2"]) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  /* The table itself becomes a block too: a table box would still grow to the width of its unwrapped content */
  .post:not(.is-editing) table:not([data-cols="2"]),
  .post:not(.is-editing) table:not([data-cols="2"]) :is(tbody, tr, td) { display: block; }
  .post:not(.is-editing) table:not([data-cols="2"]) tr { padding: 10px 14px; border-top: 1px solid var(--b-line); }
  .post:not(.is-editing) table:not([data-cols="2"]) tr:first-child { border-top: 0; }
  .post:not(.is-editing) table:not([data-cols="2"]) td { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 2px 12px; padding: 4px 0; border-top: 0; text-align: left; }
  .post:not(.is-editing) table:not([data-cols="2"]) td::before { content: attr(data-label); font-size: var(--b-step--1); font-weight: 600; color: var(--b-muted); }
  .post:not(.is-editing) table:not([data-cols="2"]) td:first-child { font-weight: 600; }
}
@media (prefers-reduced-motion: reduce) {
  .post *, .post *::before, .post *::after { transition: none !important; animation: none !important; }
}

/* Blog index: one card per article, newest first */
.post .blog-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.post .blog-card a { display: grid; gap: 8px; padding: 22px 24px; border: 1px solid var(--b-line); border-left: 4px solid var(--b-gold); border-radius: var(--b-radius); background: var(--b-surface); color: var(--b-fg); text-decoration: none; transition: border-color 0.2s, box-shadow 0.2s; }
.post .blog-card a:hover { border-color: var(--b-sky); border-left-color: var(--b-gold); box-shadow: 0 16px 32px -24px rgba(10, 35, 66, 0.45); }
.post .blog-card__meta { font-size: var(--b-step--1); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--b-muted); }
.post .blog-card__title { font-size: var(--b-step-1); font-weight: 700; line-height: 1.25; }
.post .blog-card__summary { color: var(--b-muted); }
.post .blog-card__more { font-weight: 600; color: var(--b-blue); }