/* =====================================================================
   Imported posts and recipes (her old Wix blog) · the AD label, facts, intro, notes, hashtags, plain posts, the archive
   index and the "browse as a list" fallback under the recipe grid. Linked after recipe.css / site.css only on those pages.
   ===================================================================== */

/* ---------- AD label: a small outlined pill by the title; the disclosure itself stays in her text ---------- */
.ad-flag { margin: 0; }
.ad-label { display: inline-block; padding: .22em .8em .18em; border: 1.5px solid var(--kitchen); border-radius: 999px; background: var(--marble); font: 600 .75rem/1.2 var(--sans); letter-spacing: .18em; color: var(--kitchen); }   /* 12.1:1 */

/* ---------- Hero: her date and her own "Serves 4 / Cooking - 30 minutes" lines ---------- */
.r-date { margin: 0; font: 600 .75rem/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
.r-facts { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 0; padding: 0; font: 500 1rem/1.4 var(--sans); color: var(--kitchen); }
.r-facts li + li { position: relative; }
.r-facts.print-only { margin-top: 8px; }
.r-story { display: grid; gap: 1.05em; max-width: 40rem; margin-top: clamp(28px, 4vw, 52px); font: 400 clamp(1.0625rem, 1rem + .3vw, 1.1875rem)/1.7 var(--serif); color: var(--ink); overflow-wrap: anywhere; }
.r-story p { margin: 0; }
.r-story a, .r-method a, .r-ing a, .r-notes a, .r-hashtags a, .post__text a { color: var(--kitchen); text-underline-offset: .18em; }

/* ---------- Recipe card ---------- */
.r-card__grid.r-card__grid--solo { grid-template-columns: minmax(0, 46rem); }
.ing-list + .ing-list { margin-top: 24px; }   /* her blank line between two lists with no title */
.r-ing__label { margin: 6px 0 0; font: 500 .9375rem/1.4 var(--sans); color: var(--ink-soft); }
.ing__t { overflow-wrap: anywhere; }
.method-head { margin: 30px 0 0; font: 600 .75rem/1.3 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--kitchen); }
.r-method > h3 + .method-head { margin-top: 18px; }
.method-head + .method { margin-top: 14px; }
.r-method .method p, .r-notes p { overflow-wrap: anywhere; }
.r-notes { display: grid; gap: 12px; margin-top: 32px; font: 400 1.0625rem/1.7 var(--serif); color: var(--ink); }
.r-notes p { margin: 0; }
.r-text { display: grid; gap: 14px; font: 400 1.0625rem/1.75 var(--serif); color: var(--ink); overflow-wrap: anywhere; }   /* a partial parse shown as she wrote it */
.r-text p { margin: 0; }
.r-text .method-head { margin-top: 14px; }
.r-hashtags { margin: 30px 0 0; padding-top: 18px; border-top: 1px solid var(--rim); font: 400 .9375rem/1.65 var(--sans); color: var(--ink-soft); overflow-wrap: anywhere; }   /* 7.2:1 on the card; this line can hold the only #AD, so it is never trimmed */
@media print { .r-hashtags { color: #333; } .ad-label { border-color: #000; color: #000; } }

/* ---------- Plain posts (posts/<slug>.html) ---------- */
.post { padding-block: 18px clamp(48px, 8vw, 96px); }
.post__head { display: grid; gap: 16px; justify-items: start; max-width: 46rem; }
.post h1 { font: 400 clamp(1.9rem, 1.2rem + 2.2vw, 3.1rem)/1.16 var(--serif); letter-spacing: -.012em; }
.post__photo { margin: clamp(24px, 4vw, 40px) 0 0; }
.post__photo .r-photo { max-width: 520px; }
.post__text { display: grid; gap: 1.1em; max-width: 42rem; margin-top: clamp(24px, 4vw, 44px); font: 400 clamp(1.0625rem, 1rem + .3vw, 1.1875rem)/1.75 var(--serif); color: var(--ink); overflow-wrap: anywhere; }
.post__text p { margin: 0; }
.post .r-hashtags { max-width: 42rem; }

/* ---------- The archive index (posts.html) ---------- */
.archive { padding-block: clamp(40px, 7vw, 88px); }
.archive h1 { margin-top: 10px; }
.archive__list { list-style: none; margin: clamp(28px, 4vw, 48px) 0 0; padding: 0; max-width: 52rem; border-top: 1px solid var(--rim); }
.archive__list li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--rim); }
.archive__list time { font: 600 .75rem/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.archive__list a { font: 400 clamp(1.0625rem, 1rem + .3vw, 1.25rem)/1.35 var(--serif); color: var(--kitchen); text-underline-offset: .18em; overflow-wrap: anywhere; }
@media (max-width: 479px) { .archive__list li { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- Recipes index and category pages: the list that works without JavaScript ---------- */
.pager { flex-direction: column; align-items: center; gap: 12px; }
.pager__note { margin: 0; color: var(--ink-soft); font-size: .9375rem; }
.pager__note[hidden], .pager .btn[hidden] { display: none; }
.all-list { margin-top: clamp(40px, 6vw, 72px); border-top: 1px solid var(--rim); padding-top: 20px; }
.all-list summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 44px; font: 500 1rem/1.3 var(--sans); color: var(--kitchen); }
.all-list ul { list-style: none; margin: 16px 0 0; padding: 0; columns: 18rem; column-gap: 32px; }
.all-list li { break-inside: avoid; padding: 7px 0; font: 400 1rem/1.4 var(--sans); }
.all-list a { color: var(--kitchen); text-underline-offset: .18em; }
.all-list li span { color: var(--ink-soft); font-size: .875rem; white-space: nowrap; }