/** Shopify CDN: Minification failed

Line 53:123 Unexpected ";"

**/
/* ==========================================================================
AMC-BLOG.CSS
"Field Notes" — shared styling for the blog index and dispatch (article)
pages. Built 6 Jul 2026, replacing the stock Dawn blog/article styling
per AMC directive to match the "DO NOT USE" draft theme's organization
and display, rebuilt fully in canon tokens (Codex Phase 0 decision —
structure/UX ported, styling re-authored; no raw hex carried over).

Loaded by: sections/main-blog.liquid and sections/main-article-dispatch.liquid.
Scope: banner, card grid, pagination, empty state, dispatch masthead +
meta card, related posts (reuses the card classes), CTA band (rendered
via snippets/amc-blog-cta.liquid so the markup is single-sourced), and
the standardized body-content classes (.amc-blog__callout) editors use
inside an article's own rich-text content for disclaimer / TL;DR boxes.

RULES THIS FILE FOLLOWS:
- Every color/font/spacing value is a var() from amc-tokens.css. Zero raw hex.
- Mobile-first. Breakpoints: 480 / 768 / 992 / 1200 only (Codex §0.1.4).
- Root wrapper classes: .amc-blog (index) and .amc-blog.amc-dispatch
  (dispatch) both load this one file; shared components (banner strip,
  card, cta) live under the amc-blog__ prefix so they render identically
  on both page types. Dispatch-only elements use amc-dispatch__.

STANDARDIZED BODY-CONTENT CLASSES (AMC decision, 6 Jul 2026): existing
dispatches hand-roll a disclaimer/TL;DR box via a per-article inline
<style> block, which is why appearance drifts between posts. New posts
should instead wrap that content in .amc-blog__callout (see markup
below) — no <style> tag needed. Retrofitting the existing 11 published
dispatches to drop their inline styles is optional future work, not
part of this build.

Usage inside an article's content (typed directly in the post editor):
  <div class="amc-blog__callout">
    <span class="amc-blog__calloutLabel">TL;DR</span>
    <ul><li>First point</li><li>Second point</li></ul>
  </div>
========================================================================== */

.amc-blog { background: var(--paper); color: var(--ink); font-family: var(--font); }
.amc-blog .wrap { max-width: var(--container); margin: 0 auto; padding: 0 var(--sp-5); box-sizing: border-box; }

.amc-blog__eyebrow {
  display: block; font-family: var(--font); text-transform: uppercase;
  font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-track);
  font-size: var(--eyebrow-size); color: var(--eyebrow); margin: 0 0 var(--sp-3);
}

/* D1 1 Aug 2026: title banner now canonical amc-page-banner (snippet + amc-chrome.css). */ Blog-index banner rules retired; dispatch masthead below is a locked-canon exception (title left, meta tile right).

/* ---- Card grid (index + related posts) ------------------------------------ */
.amc-blog__section { padding: var(--sp-7) 0; }
.amc-blog__grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); }
.amc-blog__card { display: block; color: inherit; text-decoration: none; }
.amc-blog__cardCover { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius); background: var(--surface-dark); }
.amc-blog__cardCover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.amc-blog__cardCats { position: absolute; top: var(--sp-3); right: var(--sp-3); display: flex; flex-direction: column; align-items: flex-end; gap: var(--sp-1); }
.amc-blog__cardCat {
  background: color-mix(in srgb, var(--banner) 82%, transparent); color: var(--white);
  font-family: var(--font); font-size: var(--fs-xs); /* 18 Jul 2026 — was raw 1.088rem (10.9px); token floor per D10 audit */ font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; padding: 3px 9px; border-radius: 999px;
}
.amc-blog__cardTitle {
  position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: var(--sp-4);
  font-family: var(--head); font-weight: 700; color: var(--white);
  /* 18 Jul 2026, AMC order: card titles moved from UnitedSans/uppercase to
     the fieldwork face (--head), mixed case, matching the product-page H1;
     size stepped to --fs-lg for fieldwork's wider set. White preserved. */
  font-size: var(--fs-lg); line-height: 1.25;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--banner) 88%, transparent) 70%);
}
.amc-blog__cardBody { padding: var(--sp-4) 0 0; }
.amc-blog__cardMeta { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-sm); color: var(--ink-soft); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 var(--sp-2); }
.amc-blog__cardMeta .dot { width: 3px; height: 3px; border-radius: 999px; background: var(--ink-soft); flex-shrink: 0; }
.amc-blog__cardExcerpt { color: var(--ink-soft); font-size: var(--fs-sm); line-height: 1.55; margin: 0 0 var(--sp-3); }
.amc-blog__cardMore { display: inline-block; font-weight: 700; font-size: var(--fs-sm); color: var(--green-deep); text-decoration: none; border-bottom: 2px solid var(--green); }
.amc-blog__card:hover .amc-blog__cardMore { color: var(--green); }
.amc-blog__card:hover .amc-blog__cardTitle { color: var(--eyebrow); }

.amc-blog__empty { text-align: center; color: var(--ink-soft); padding: var(--sp-7) 0; font-size: var(--fs-lg); }
.amc-blog__pager { margin-top: var(--sp-6); display: flex; justify-content: center; }

/* ---- Standardized body-content callout / TL;DR box ------------------------ */
.amc-blog__callout { background: var(--green-tint); border: 1px solid var(--green-tint-border); border-radius: var(--radius); padding: var(--sp-5); margin: var(--sp-5) 0; }
.amc-blog__callout > :first-child { margin-top: 0; }
.amc-blog__callout > :last-child { margin-bottom: 0; }
.amc-blog__calloutLabel {
  display: block; font-family: var(--font); text-transform: uppercase;
  font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-track);
  font-size: var(--eyebrow-size); color: var(--green-deep); margin: 0 0 var(--sp-2);
}
.amc-blog__callout ul, .amc-blog__callout ol { margin: var(--sp-2) 0 0; padding-left: 1.2em; }
.amc-blog__callout li { margin: 0 0 var(--sp-1); }
.amc-blog__callout li::marker { color: var(--green); }

/* ---- CTA band (rendered by snippets/amc-blog-cta.liquid) ------------------ */
.amc-blog__cta { background: var(--ocean); padding: var(--sp-7) 0; text-align: center; }
.amc-blog__cta .amc-blog__eyebrow { color: var(--eyebrow); }
.amc-blog__ctaH2 { font-family: var(--display); text-transform: uppercase; font-weight: 700; color: var(--white); margin: 0 0 var(--sp-3); font-size: var(--fs-h2); }
.amc-blog__ctaText { color: var(--muted-on-dark); font-size: var(--fs-lg); max-width: 56ch; margin: 0 auto var(--sp-5); }
.amc-blog__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
  border-radius: var(--radius); padding: 14px 26px; font-weight: 700; font-family: var(--font);
  text-transform: uppercase; letter-spacing: .04em; /* B2 rule 1 (19 Jul 2026): buttons ALL CAPS sitewide */
  font-size: var(--fs-body); text-decoration: none; white-space: nowrap; transition: var(--transition);
  border: 2px solid transparent; cursor: pointer;
}
.amc-blog__btn--onlight { background: var(--green); color: var(--white); border-color: var(--green); }
.amc-blog__btn--onlight:hover { background: var(--green-deep); border-color: var(--green-deep); }

/* ---- Dispatch masthead ----------------------------------------------------- */
.amc-dispatch__banner { position: relative; background: var(--banner); overflow: hidden; padding: 0; }
.amc-dispatch__banner .amc-blog__eyebrow { color: var(--eyebrow-banner); } /* 1 Aug 2026 D1 — mint eyebrows on dark banners */
.amc-blog .amc-dispatch__bannerIn { padding: var(--sp-6) 0 var(--sp-7); display: grid; grid-template-columns: 1fr; gap: var(--sp-5); }
.amc-dispatch__title { font-family: var(--display); text-transform: uppercase; font-weight: 700; line-height: 1.02; color: var(--white); margin: var(--sp-2) 0 0; font-size: var(--fs-banner-title); /* 1 Aug 2026 D1 — single sitewide banner-title token */ }
.amc-dispatch__sub { color: var(--muted-on-dark); font-size: var(--fs-lg); line-height: 1.5; margin: var(--sp-3) 0 0; max-width: 56ch; }
.amc-dispatch__meta { background: var(--green-tint); border: 1px solid var(--green-tint-border); border-radius: var(--radius); padding: var(--sp-4) var(--sp-5); align-self: start; }
.amc-dispatch__metaRow { display: flex; gap: var(--sp-2); font-size: var(--fs-sm); padding: var(--sp-2) 0; border-top: 1px solid var(--green-tint-border); }
.amc-dispatch__metaRow:first-child { border-top: 0; padding-top: 0; }
.amc-dispatch__metaRow b { color: var(--ink-soft); font-weight: 700; min-width: 7.2rem; flex-shrink: 0; }
.amc-dispatch__metaRow span { color: var(--ink); }

/* ---- Dispatch body — article.content renders as-is inside .wrap ---------- */
.amc-dispatch__body { padding: 0; /* 19 Jul 2026 AMC ruling — bands own all vertical space; the old sp-7 padding painted bare paper strips below the banner and above Keep Reading */ font-size: var(--fs-body); line-height: 1.6; /* 18 Jul 2026 — D10/Lindsay #188: body declared no size and inherited Dawn's ~15px base; canon 18px restored */ }
.amc-dispatch__body img { max-width: 100%; border-radius: var(--radius); }

/* ---- (18 Jul 2026, end of day) The interim "dispatch content rescue" block
   that lived here is RETIRED: all 11 dispatches were converted to the
   canonical system (pilot + Family A + Family B sweeps) and no article
   carries embedded <style> blocks or inline styles anymore. Rules the
   canonical markup still needs (prose/mint-tile type sizes) were folded
   into the canonical section below. */
.amc-dispatch__body .prose p,
.amc-dispatch__body .prose li { font-size: var(--fs-body); }
.amc-dispatch__body .mint-tile p { font-size: var(--fs-body); }
.amc-dispatch__body .mint-tile .quote { font-size: var(--fs-lg); }
.amc-dispatch__body .mint-tile h2 { font-family: var(--head); font-size: var(--fs-h3); text-transform: uppercase; letter-spacing: .03em; color: var(--ocean); margin: 0 0 var(--sp-3); }
/* (18 Jul 2026, end of day) The transitional .l-sources/.sources/.src rules
   that lived here are RETIRED — the Academy pilot conversion re-marked that
   block as the canonical .disclaimer + .lbl--src tile. */

/* ---- CANONICAL DISPATCH CONTENT SYSTEM V2 (18 Jul 2026) ---------------------
   One layout for ALL dispatch article content, theme-owned, tokens only.
   V2 (AMC rulings D-1..D-4, Dispatch Homogenization Plan V1): the full
   16-pattern superset of the three legacy per-article styling families
   found in the 11-article survey — Family A (l-article/a-body, 8 posts),
   Family B (nl-* system, 2 posts), Family C (Academy). Articles are being
   converted to THESE canonical class names and their embedded <style>
   blocks stripped (ruling D-1); the fn-cover one-off is retired (D-2).
   Scoped under .amc-dispatch__body — never leaks outside articles. Higher
   specificity than embedded single-class rules, so it wins during the
   transition while legacy markup still exists.

   CANONICAL AUTHOR VOCABULARY (see docs/AMC_Dispatch_Author_Template.html):
   .sec (+.sec--alt) > .wrap > .prose/.narrow · .lede · .media-grid
   (+.media-grid--img-left) · .fig (+.fig--video) · .callout · .mint-tile /
   .intro-tile · .pull-quote · .steps · .check-grid · .fact-list · .faq ·
   .refs · .disclaimer (+.lbl) */

/* -- structure: full-bleed sections, contained content, reading column -- */
.amc-dispatch__body .wrap { max-width: var(--container); margin-left: auto; margin-right: auto; padding-left: var(--sp-5); padding-right: var(--sp-5); box-sizing: border-box; }
.amc-dispatch__body .sec { padding: var(--sp-6) 0; }
.amc-dispatch__body .sec--alt { background: var(--white); } /* alternating band; full-bleed now that the template no longer double-wraps content */
/* 18 Jul 2026 — eyebrow typography was MISSING from V2 (found in AMC live
   inspection: eyebrows rendered as plain body text). Canon eyebrow tokens;
   the .sec-scoped selector out-specifies the embedded `.sec .eyebrow` tie. */
.amc-dispatch__body .eyebrow,
.amc-dispatch__body .sec .eyebrow,
.amc-dispatch__body .mint-tile .eyebrow {
  display: block; font-family: var(--font); text-transform: uppercase;
  font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-track);
  font-size: var(--eyebrow-size); color: var(--eyebrow); margin: 0 0 var(--sp-2);
}
.amc-dispatch__body .narrow,
.amc-dispatch__body .prose { max-width: 76rem; margin-left: auto; margin-right: auto; } /* 760px reading column — the canonical article measure */

/* -- prose -- */
.amc-dispatch__body .prose p { margin-bottom: var(--sp-4); }
.amc-dispatch__body .prose h2 { font-family: var(--display); text-transform: uppercase; font-weight: 700; color: var(--ocean); font-size: var(--fs-h3); line-height: 1.1; margin: var(--sp-6) 0 var(--sp-3); }
.amc-dispatch__body .prose h3 { font-family: var(--font); font-weight: 700; color: var(--ocean); font-size: var(--fs-lg); margin: var(--sp-5) 0 var(--sp-2); }
.amc-dispatch__body .prose h2:first-child, .amc-dispatch__body .prose h3:first-child { margin-top: 0; }
.amc-dispatch__body .prose a { color: var(--green-deep); font-weight: 700; }
.amc-dispatch__body .prose a:hover { color: var(--green); }
.amc-dispatch__body .prose ul, .amc-dispatch__body .prose ol { margin: 0 0 var(--sp-4); padding-left: 1.2em; }
.amc-dispatch__body .prose li { margin: 0 0 var(--sp-2); }
.amc-dispatch__body .prose li::marker { color: var(--green); }
.amc-dispatch__body .lede,
.amc-dispatch__body .prose p.lede { font-size: var(--fs-lg); color: var(--ink-soft); margin-bottom: var(--sp-4); } /* second selector outranks the .prose p size rule (survey: lede was collapsing to body size) */

/* -- media grid: text beside image; image-first markup renders image left -- */
.amc-dispatch__body .media-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); align-items: start; }

/* -- figure card (absorbs legacy .nl-figure / .a-figure / .nl-video) -- */
.amc-dispatch__body .fig,
.amc-dispatch__body .nl-figure { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--sp-4); margin: var(--sp-5) 0; }
.amc-dispatch__body .fig img, .amc-dispatch__body .fig video,
.amc-dispatch__body .nl-figure img { display: block; width: 100%; height: auto; padding: 0; border-radius: var(--radius); }
.amc-dispatch__body .fig figcaption,
.amc-dispatch__body .nl-figure .ph { font-size: var(--fs-sm); color: var(--ink-soft); padding: var(--sp-3) var(--sp-1) 0; line-height: 1.45; }
.amc-dispatch__body .media-grid .fig, .amc-dispatch__body .media-grid .nl-figure { margin: 0; }

/* -- callout (absorbs legacy .a-callout / .nl-callout) -- */
.amc-dispatch__body .callout { background: var(--white); border: 1px solid var(--line); border-left: 4px solid var(--green); border-radius: var(--radius); padding: var(--sp-4) var(--sp-5); margin: var(--sp-5) 0; font-size: var(--fs-body); line-height: 1.55; }
.amc-dispatch__body .callout > :first-child { margin-top: 0; }
.amc-dispatch__body .callout > :last-child { margin-bottom: 0; }
.amc-dispatch__body .callout strong { color: var(--green-deep); }

/* -- mint tile / intro tile -- */
.amc-dispatch__body .mint-tile,
.amc-dispatch__body .intro-tile { background: var(--green-tint); border: 1px solid var(--green-tint-border); border-left: 4px solid var(--green); border-radius: var(--radius); padding: var(--sp-5); margin: var(--sp-5) auto; max-width: 76rem; box-sizing: border-box; }
.amc-dispatch__body .mint-tile h3,
.amc-dispatch__body .intro-tile h3 { font-family: var(--font); text-transform: uppercase; font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-track); font-size: var(--eyebrow-size); color: var(--green-deep); margin: 0 0 var(--sp-3); }
.amc-dispatch__body .mint-tile ul, .amc-dispatch__body .intro-tile ul { list-style: none; margin: 0; padding: 0; }
.amc-dispatch__body .mint-tile li, .amc-dispatch__body .intro-tile li { font-size: var(--fs-sm); position: relative; padding-left: var(--sp-5); margin: 0 0 var(--sp-2); }
.amc-dispatch__body .mint-tile li::before, .amc-dispatch__body .intro-tile li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--emerald); font-weight: 800; }

/* -- pull quote (absorbs legacy .nl-quote / bare blockquote / .quote) -- */
.amc-dispatch__body .pull-quote,
.amc-dispatch__body blockquote { border-left: 4px solid var(--emerald); margin: var(--sp-5) 0; padding: var(--sp-2) 0 var(--sp-2) var(--sp-5); }
.amc-dispatch__body .pull-quote p,
.amc-dispatch__body blockquote p { font-size: var(--fs-lg); font-style: italic; color: var(--ocean); line-height: 1.5; margin: 0 0 var(--sp-2); }
.amc-dispatch__body .pull-quote cite,
.amc-dispatch__body blockquote cite { font-size: var(--fs-sm); font-style: normal; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft); }

/* -- numbered steps: badge owns its own gutter (fixes Academy overlap) -- */
.amc-dispatch__body .steps { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); padding: 0; margin: var(--sp-5) 0; list-style: none; counter-reset: amc-step; }
.amc-dispatch__body .steps li { counter-increment: amc-step; position: relative; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--sp-4) var(--sp-5) var(--sp-4) 58px; }
.amc-dispatch__body .steps li::before { content: counter(amc-step); position: absolute; left: var(--sp-4); top: var(--sp-4); width: 26px; height: 26px; border-radius: 999px; background: var(--green); color: var(--white); font-size: var(--fs-sm); font-weight: 800; display: flex; align-items: center; justify-content: center; }
.amc-dispatch__body .steps li h3 { font-size: var(--fs-body); color: var(--ocean); margin: 0 0 var(--sp-1); }
.amc-dispatch__body .steps li p { font-size: var(--fs-sm); margin: 0; }

/* -- checklist grid (absorbs legacy .check-grid) -- */
.amc-dispatch__body .check-grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-3); padding: 0; margin: var(--sp-5) 0; list-style: none; }
.amc-dispatch__body .check-grid li { position: relative; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--sp-3) var(--sp-4) var(--sp-3) 40px; font-size: var(--fs-sm); }
.amc-dispatch__body .check-grid li::before { content: "✓"; position: absolute; left: var(--sp-4); top: var(--sp-3); color: var(--emerald); font-weight: 800; }
.amc-dispatch__body .check-grid li svg { display: none; } /* 18 Jul 2026 AMC ruling: canonical ::before ✓ (emerald, 800) is the house check; legacy articles carry their own inline <svg> check which doubled it. Conversions strip the SVGs; this rule guards the transition AND any future paste-in. */

/* -- fact list (absorbs legacy .jfacts / .nl-list) -- */
.amc-dispatch__body .fact-list { list-style: none; margin: var(--sp-4) 0; padding: 0; }
.amc-dispatch__body .fact-list li { font-size: var(--fs-sm); padding: var(--sp-2) 0; border-bottom: 1px solid var(--line); }
.amc-dispatch__body .fact-list li:last-child { border-bottom: 0; }
.amc-dispatch__body .fact-list li b { color: var(--ocean); }

/* -- FAQ (details/summary; 3 articles + all future posts) -- */
.amc-dispatch__body .faq { border-top: 1px solid var(--line); margin: var(--sp-4) 0 0; }
.amc-dispatch__body .faq details { border-bottom: 1px solid var(--line); }
.amc-dispatch__body .faq summary { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); cursor: pointer; list-style: none; padding: var(--sp-4) 0; font-size: var(--fs-body); font-weight: 700; color: var(--ocean); }
.amc-dispatch__body .faq summary::-webkit-details-marker { display: none; }
.amc-dispatch__body .faq summary::after { content: "+"; color: var(--green); font-size: var(--fs-h3); font-weight: 400; line-height: 1; flex-shrink: 0; }
.amc-dispatch__body .faq details[open] summary::after { content: "−"; }
.amc-dispatch__body .faq .body { padding: 0 0 var(--sp-4); font-size: var(--fs-sm); color: var(--ink-soft); line-height: 1.55; }
.amc-dispatch__body .faq .body a { color: var(--green-deep); font-weight: 700; }

/* -- references / sources / disclaimer TILES ---------------------------------
   18 Jul 2026 AMC ruling (approved render): closing elements are TILES in the
   mint-tile family, not section bands — white (--white) box, 1px --ink border,
   --radius corners, --ink (black) text, green-deep title. Absorbs legacy
   .a-refs / .nl-refs / .nl-sources / .l-sources. CONTENT CANON: reference
   lists use AMA format (Author AB. Title. Journal. Year;vol(iss):pages.). */
.amc-dispatch__body .refs,
.amc-dispatch__body .disclaimer { background: var(--white); border: 1px solid var(--ink); border-radius: var(--radius); padding: var(--sp-5); margin: var(--sp-5) auto 0; max-width: 76rem; box-sizing: border-box; }
.amc-dispatch__body .refs h2, .amc-dispatch__body .refs h3 { font-family: var(--font); text-transform: uppercase; font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-track); font-size: var(--eyebrow-size); color: var(--green-deep); margin: 0 0 var(--sp-2); }
.amc-dispatch__body .refs ol, .amc-dispatch__body .refs ul { margin: 0; padding-left: 1.4em; }
.amc-dispatch__body .refs li { font-size: var(--fs-sm); color: var(--ink); margin: 0 0 var(--sp-2); line-height: 1.5; }
.amc-dispatch__body .refs a { color: var(--green-deep); font-weight: 700; overflow-wrap: anywhere; }
.amc-dispatch__body .disclaimer { font-size: var(--fs-sm); color: var(--ink); line-height: 1.55; }
.amc-dispatch__body .disclaimer p { margin: 0; }
.amc-dispatch__body .disclaimer .lbl { display: block; font-size: var(--eyebrow-size); text-transform: uppercase; letter-spacing: var(--eyebrow-track); font-weight: var(--eyebrow-weight); color: var(--red); margin: 0 0 var(--sp-2); }
.amc-dispatch__body .disclaimer .lbl--src { color: var(--green-deep); } /* red label = medical-legal warning; green-deep = source & attribution */

/* -- 19 Jul 2026 AMC rulings (Shopify Blog Generator project) ----------------
   Colors re-affirmed as-is (--banner #09262B, --green #007748, heading/body
   ink split). Structural canon extensions adopted by founder ruling: */
.amc-dispatch__body .sec--mint { background: var(--paper-mint); } /* third band tint, SECTION TEMPLATE */
.amc-dispatch__body .refs ol li::marker { color: var(--green); font-weight: 800; } /* green AMA numbering, REFERENCE SECTION */
.amc-dispatch__body .fig--video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius); display: block; } /* YouTube embeds size correctly inside .fig--video */

/* ============ BREAKPOINT: 768px — canonical dispatch two-up ============ */
@media (min-width: 768px) {
  .amc-dispatch__body .media-grid { grid-template-columns: 1fr 1fr; }
  .amc-dispatch__body .media-grid--img-left > :first-child { order: 0; } /* image-first markup is the norm; modifier reserved for text-first legacy markup during conversion */
  .amc-dispatch__body .media-grid--img-left > :last-child { order: -1; }
  .amc-dispatch__body .steps { grid-template-columns: 1fr 1fr; }
  .amc-dispatch__body .check-grid { grid-template-columns: 1fr 1fr; }
}

/* ---- Related posts --------------------------------------------------------- */
.amc-blog__crossHead { text-align: center; margin: 0 0 var(--sp-6); }
.amc-blog__crossHead h2 { font-family: var(--display); text-transform: uppercase; font-weight: 700; color: var(--ocean); margin: var(--sp-2) 0 0; font-size: var(--fs-h2); }

/* ================= BREAKPOINT: 480px — small phone ======================= */
@media (min-width: 480px) {
  .amc-blog__cardTitle { font-size: var(--fs-lg); } /* 18 Jul 2026 — follows the fieldwork card-title change */
}

/* ================= BREAKPOINT: 768px — tablet ============================= */
@media (min-width: 768px) {
  .amc-blog__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ================= BREAKPOINT: 992px — desktop ============================= */
@media (min-width: 992px) {
  .amc-blog__grid { grid-template-columns: repeat(3, 1fr); }
  .amc-blog .amc-dispatch__bannerIn { grid-template-columns: 1.6fr 1fr; align-items: start; }
}
