/* ==========================================================================
   page-methodology.css — Styles for the /methodology/ (How I work) page.
   Conditionally enqueued via inc/setup.php on is_page('methodology').
   ========================================================================== */

.methodology-hero {
  padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(2rem, 4vw, 3rem);
  border-bottom: 1px solid var(--color-border);
}

.methodology-hero__inner {
  max-width: 64ch;
}

.methodology-hero .eyebrow {
  display: inline-block;
  font-family: "Sora", sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-gold-text);
  margin-bottom: 0.75rem;
}

.methodology-hero h1 {
  font-size: var(--fs-display);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.04;
  margin: 0 0 0.85rem;
  text-wrap: balance;
}

.methodology-hero__lead {
  margin: 0;
  color: var(--color-muted);
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.15rem);
  line-height: 1.55;
  max-width: 60ch;
}

.methodology-body {
  padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);
}

/* No container max-width — text and figures manage their own width below.
   This is the single-article.css pattern applied to pages. */

/* Text blocks stay at a comfortable reading width */
.methodology-body__inner .entry-content > :where(p, ul, ol, h2, h3, h4, h5, h6, blockquote, .wp-block-quote, pre, .wp-block-code, .wp-block-preformatted) {
  max-width: 72ch;
}

/* Images, diagrams, and HTML blocks extend to full container width */
.methodology-body__inner .entry-content > :where(figure, .wp-block-image, .wp-block-html, .wp-block-table, .alignfull, .alignwide) {
  max-width: 100%;
}