/**
 * Miatrys Domain Scholarly — Static Pages CSS (Slice 2.1.x)
 *
 * Scoped CSS for pillar pages emitted by PE_Scholarly_Pillar_Page_Renderer.
 * Plugin-owned per Owner directive 2026-05-16; conditionally enqueued by
 * PE_Scholarly_Static_Pages_Styles on pages with _pe_scholarly_static_page meta
 * per Architect Disposition #2 ratification (architect-f34-slice-2-1-design-
 * review-v1.md §Disposition #2).
 *
 * SLICE 2.1.x changes from Slice 2.1 baseline (1.0.181):
 *   - Pillar intro: replaced separate intro paragraph + jump-list with
 *     consolidated intro+nav block (Marketing+UX disposition 2026-05-15)
 *   - Post-item rhythm: tightened padding from 0.9rem/1.05rem to 0.7rem/0.85rem
 *     and separator padding from 1rem to 0.85rem for scholarly-dense feel
 *     (Marketing+UX disposition 2026-05-17, §4)
 *   - Date placement: moved date from below title to prepended inline with
 *     title via flexbox post-header group; date is now OUTSIDE the <h3>
 *     element for clean SEO/heading semantics (Marketing+UX disposition
 *     2026-05-17, §3 — Coding AI disposition selected date-outside-h3 path)
 *   - Title weight: explicit font-weight 400 to override browser h3 defaults
 *     (Marketing+UX disposition 2026-05-17, §6)
 *   - Title size: explicit font-size 1rem to override browser h3 defaults
 *     and maintain dense-list character (Marketing+UX disposition 2026-05-17, §5)
 *
 * Browser support: modern browsers (Chrome 111+, Firefox 113+, Safari 16.2+
 * for color-mix). The two-line border pattern provides an rgba fallback for
 * older browsers.
 */

/* ============================================================
   PILLAR INTRO + CATEGORY NAV (CONSOLIDATED)
   Slice 2.1.x: single semantic block at top of pillar page.
   Lead sentence (canonical shared) + per-category nav with middot separators.
   ============================================================ */
.pe-scholarly-pillar-intro {
  margin-block: 0 2.25rem;
  /* SLICE 2.1.x.y: max-width constraint moved from parent to .pe-scholarly-pillar-category-nav
     specifically (Marketing+UX disposition 2026-05-17 v2 §4). Lead sentence now uses full
     available width to prevent "language:" widow; category nav retains 900px constraint
     for readable wrap behavior across viewports. */
}

.pe-scholarly-pillar-intro__lead {
  margin: 0;
  line-height: 1.6;
  opacity: 0.9;
}

.pe-scholarly-pillar-category-nav {
  max-width: 900px;
  margin-block: 0.35rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.7rem;
  line-height: 1.7;
}

.pe-scholarly-pillar-category-nav a {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

/* Middot separators emitted by renderer as <span aria-hidden="true">·</span>
 * between category links. Subdued opacity matches the visual treatment of
 * the date separator below (consistent separator-style across the surface). */
.pe-scholarly-pillar-category-nav span[aria-hidden="true"] {
  opacity: 0.55;
}

/* ============================================================
   CATEGORY HEADING ROW (Architect heading-semantics ruling 2026-05-17)
   ============================================================
   Per Architect ruling, each category section now emits as:
     <div class="pe-scholarly-category-heading-row">  ← flex container
       <h2 class="pe-scholarly-category-heading">     ← clean heading
         <a>Category Name</a>
       </h2>
       <p class="pe-scholarly-category-rss-row">      ← RSS affordance (sibling, NOT child of h2)
         <span>·</span> <a>SVG + "RSS"</a>
       </p>
     </div>

   Architectural rationale:
   - h2 textContent is exactly the category name (clean for SEO/AI-crawler heading-text extraction)
   - RSS affordance is reachable via Tab navigation but NOT part of heading-navigation
   - RSS row sizing inherits from body-text root (rem) instead of heading scale (em)

   The flex container with align-items: baseline + flex-wrap: wrap pairs the
   heading and RSS row inline on wide viewports and lets RSS row wrap to the
   next line cleanly when horizontal space is constrained. */
.pe-scholarly-category-heading-row {
  margin-top: 2.75rem;
  margin-bottom: 0.85rem;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0;
}

/* The h2 itself: no margins (parent group handles spacing). Provides spacing
 * hook for category transitions per UX re-disposition 2026-05-16. */
.pe-scholarly-category-heading {
  margin: 0;
}

/* The RSS row paragraph — sibling of h2 inside the heading-row group.
 *
 * CRITICAL: font-size uses rem (body-text-relative) NOT em (heading-inherited).
 * This is the architectural fix for the "RSS rendering at heading scale"
 * defect that surfaced during v1.0.185 spot-check. Inside h2 (which is ~2rem),
 * em-based child sizing inherits from heading scale; sibling-of-h2 with rem
 * sizing escapes that inheritance entirely. */
.pe-scholarly-category-rss-row {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1;
}

/* RSS separator middot — sits between the heading (above, visually) and the
 * RSS link (after the middot in the paragraph flow). */
.pe-scholarly-rss-separator {
  margin-inline: 0.35rem;
  color: currentColor;
  opacity: 0.55;
}

/* RSS link is an inline-flex anchor containing the SVG icon + visible label.
 * Inline-flex keeps icon and label visually paired and vertically aligned.
 *
 * Note: font-size declaration removed — the surrounding paragraph
 * (.pe-scholarly-category-rss-row) provides the rem-based scale. The link
 * inherits naturally from the paragraph context. */
.pe-scholarly-rss-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-left: 0.35rem;
  opacity: 0.65;
  color: currentColor;
  text-decoration: none;
  vertical-align: baseline;
}
.pe-scholarly-rss-link:hover,
.pe-scholarly-rss-link:focus {
  opacity: 1;
}

/* RSS icon — inline SVG sized relative to the surrounding link's font-size
 * (which is now body-relative rem via the parent paragraph, not heading em).
 * `fill: currentColor` lets the icon inherit theme text color in both
 * light and dark themes without needing separate asset variants. */
.pe-scholarly-rss-icon {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  fill: currentColor;
}

/* RSS label — visible "RSS" text alongside the icon. Stylable hook for
 * future treatment; currently inherits all visual properties from the
 * surrounding anchor. */
.pe-scholarly-rss-label {
  /* visible text alongside the icon — inherits from .pe-scholarly-rss-link */
}

/* ============================================================
   POST-ITEM RHYTHM + DATE+TITLE HEADER + INTER-ITEM SEPARATOR
   Slice 2.1.x density tuning: ~20-25% reduction from prior values.
   Slice 2.1.x.y: further tightening of inter-article spacing per
   Marketing+UX disposition 2026-05-17 v2 §2 — bottom padding from
   0.85rem to 0.65rem; separator padding-top from 0.85rem to 0.65rem.
   Resulting inter-article gap drops from ~1.7rem to ~1.3rem.
   Inter-item separators preserved (UX disposition 2026-05-17).
   ============================================================ */
.pe-scholarly-post-item {
  margin: 0;
  padding-block: 0.7rem 0.65rem;
}

/* Post header group — wraps wp:post-date + wp:post-title as siblings,
 * rendering them inline via flexbox. Date is OUTSIDE the <h3> per
 * Coding AI disposition on §3 SEO/heading-semantics question. */
.pe-scholarly-post-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.1rem 0.35rem;
  margin: 0 0 0.35rem;
}

/* Date span — appears first (prepended), subdued visual weight, never wraps
 * to its own line independent of title (whitespace-nowrap prevents date
 * breaking mid-string; wrapping happens between date and title via flexbox). */
.pe-scholarly-post-header .wp-block-post-date {
  color: currentColor;
  opacity: 0.68;
  font-size: 0.9em;
  font-weight: 400;
  white-space: nowrap;
  margin: 0;
}
.pe-scholarly-post-header .wp-block-post-date time {
  text-decoration: none;
  color: inherit;
}

/* Middot separator between date and title — emitted as ::after pseudo-element
 * on the DATE side (not title side) so the middot stays inseparable from the
 * date when the title is long enough to wrap to a new line.
 *
 * Slice 2.1.x.z (2026-05-17): post-deploy spot-check on v1.0.183 surfaced
 * a flex-layout issue where long titles wrapping to a new line would push
 * the standalone middot pseudo-element onto its own intermediate line,
 * producing three-line layouts (date / · / wrapped title) instead of the
 * intended two-line layouts (date · title-start / title-continuation).
 *
 * Root cause: the prior ::before on title made the middot a separate flex-
 * adjacent inline element. When the title wraps, the middot has nowhere to
 * sit visually and lands alone on its own flex line.
 *
 * Fix: move the middot to ::after on the date element. The date <div> has
 * white-space: nowrap, so the middot inherits that context and stays glued
 * to the date as `April 15, 2026·` — a single inseparable visual unit. The
 * flex container now has only two real children (date+middot, title); long
 * titles wrap cleanly to the next line without orphaning the separator.
 *
 * Visual result is identical to the prior pattern when title fits on one
 * line; correct multi-line behavior when title wraps. No renderer or yaml
 * change required. */
.pe-scholarly-post-header .wp-block-post-date::after {
  content: "·";
  margin-left: 0.35rem;
  opacity: 0.55;
  font-weight: 400;
}

/* Post title — explicit overrides for browser h3 defaults to maintain
 * dense-list character. Title at body-text size, tight line-height.
 *
 * Slice 2.1.x.y: font-weight bumped from 400 to 600 (Marketing+UX
 * disposition 2026-05-17 v2 §3) — provides modest weight contrast that
 * gives titles "eye-stop" affordance during quick scanning while preserving
 * scholarly-dense character. Weight contrast (not size) chosen because
 * size bump would expand vertical rhythm; weight contrast at same size
 * keeps articles compact. Editorial intent is modest contrast — not
 * declarative. Range 500-700 acceptable; eyeball at rendered scale.
 * Important: must override theme's default h3 sizing. */
.pe-scholarly-post-header .wp-block-post-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 600;
}
.pe-scholarly-post-header .wp-block-post-title a {
  font-weight: 600;
}

/* Post excerpt — within the post-item but outside the header group.
 * Tight rhythm; no top margin (header group already supplies bottom margin). */
.pe-scholarly-post-item .wp-block-post-excerpt {
  margin: 0;
}
.pe-scholarly-post-item .wp-block-post-excerpt__excerpt {
  margin: 0;
  line-height: 1.5;
}

/* Inter-item separator on every post except the first within a query.
 *
 * Two-rule pattern per Architect §3.4: rgba fallback first (older browsers),
 * color-mix-based rule second (cascades over fallback in modern browsers).
 * Avoids binding scholarly static-page styling to dark-theme assumption.
 *
 * Slice 2.1.x: padding-top tightened from 1rem to 0.85rem matching new
 * post-item padding rhythm.
 * Slice 2.1.x.y: further tightened from 0.85rem to 0.65rem per Marketing+UX
 * disposition 2026-05-17 v2 §2 — inter-article gap reduces with the
 * post-item bottom padding reduction. Separator visibility unchanged. */
.wp-block-post-template > li + li .pe-scholarly-post-item {
  border-top: 1px solid rgba(127, 127, 127, 0.25);
  border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent);
  padding-top: 0.65rem;
}

/* ============================================================
   CONTINUATION LINK
   ============================================================ */
.pe-scholarly-continuation-link {
  margin-top: 0.85rem;
  margin-bottom: 2.75rem;
}
.pe-scholarly-continuation-link a {
  font-weight: 500;
}

/* ============================================================
   MOBILE CONSTRAINTS
   Marketing/UX accessibility-first defaults; small font sizes scale to
   readable defaults on narrow viewports.
   ============================================================ */
@media (max-width: 600px) {
  .pe-scholarly-pillar-intro__lead {
    font-size: 1rem;
    line-height: 1.6;
  }
  .pe-scholarly-pillar-category-nav {
    gap: 0.45rem 0.75rem;
    line-height: 1.9;
  }
  /* On narrow viewports, allow the date and title to stack if needed —
   * flex-wrap on .pe-scholarly-post-header already handles this; explicit
   * line-height for readability. */
  .pe-scholarly-post-header {
    line-height: 1.5;
  }
}