/* hero-page */
/* ==========================================================================
   Page Hero — gradient band (surface-gradient has-mark), glass card + photo.
   ========================================================================== */

.m-hero-page{padding-block:clamp(40px, 4vw, 56px)}
.m-hero-page__grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--gap);align-items:stretch}
.m-hero-page__card{
  display:flex;flex-direction:column;justify-content:center;
  min-height:clamp(320px, 28.5vw, 410px);
  padding:clamp(28px, 3vw, 44px) clamp(24px, 2.5vw, 32px);
}
.m-hero-page__title{color:var(--white)}
.m-hero-page__lead{margin:1.5rem 0 0;max-width:34ch}
.m-hero-page__lead:empty{display:none}
.m-hero-page__media{aspect-ratio:544 / 410;background:rgba(255,255,255,.1)}

@media (max-width: 820px){
  .m-hero-page__grid{grid-template-columns:minmax(0, 1fr)}
  .m-hero-page__card{min-height:0}
  .m-hero-page__media{aspect-ratio:16 / 10}
}

/* intro-statement */
/* ==========================================================================
   Intro Statement — split: (eyebrow +) statement heading left, copy right,
   with an optional blue lead line under the heading or atop the copy.
   Stacked: accent heading over a lead line. Optional 4:3 image: split puts the heading
   on its own row and the image left, level with the copy; stacked puts it under the copy.
   ========================================================================== */

.m-intro-statement__grid{
  display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:var(--gap) clamp(32px, 4vw, 48px);align-items:start;
}
.m-intro-statement--split .m-intro-statement__title{max-width:17ch}
.m-intro-statement--large .m-intro-statement__title{max-width:13ch;line-height:1.12}
.m-intro-statement--stacked .m-intro-statement__title{max-width:26ch;margin-bottom:1.25rem}
.m-intro-statement__title:has(.accent:not(:empty)){max-width:none} /* heading + highlight run on one line where the width allows */
.m-intro-statement__lead{max-width:60ch}

.m-intro-statement__eyebrow{margin:0 0 .5rem;color:var(--brand);font-weight:400}
.m-intro-statement__eyebrow:empty{display:none}
.m-intro-statement__lead-line{margin:0 0 1.5rem;font-weight:400}
.m-intro-statement__lead-line:empty{display:none}
.m-intro-statement__head .m-intro-statement__lead-line{margin:1.5rem 0 0;max-width:22ch;font-size:var(--step-h3);font-weight:500;line-height:1.3}

.m-intro-statement__media{aspect-ratio:4 / 3}
.m-intro-statement--stacked .m-intro-statement__media{margin-top:clamp(24px, 3vw, 40px)}
.m-intro-statement__head:has(+ .m-intro-statement__grid--image){margin-bottom:clamp(24px, 3vw, 40px)}
.m-intro-statement--stacked .m-intro-statement__media{max-width:60ch}

@media (max-width: 820px){
  .m-intro-statement__grid{grid-template-columns:minmax(0, 1fr)}
  .m-intro-statement--split .m-intro-statement__title{max-width:none}
}

/* featured-article */
/* ==========================================================================
   Featured Article — grey panel: chip, read time, title, excerpt, button;
   article image on the right. Stacks (image first) below 820px.
   ========================================================================== */

.m-featured-article__panel{
  display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.4fr);
  gap:clamp(24px, 3vw, 48px);align-items:center;
}
.m-featured-article__chip{margin-bottom:1.5rem}
.m-featured-article__meta{margin:0 0 .75rem;color:var(--brand);font-size:var(--step-lead)}
.m-featured-article__title{margin-bottom:1.25rem}
.m-featured-article__title a{color:inherit}
.m-featured-article__title a:hover{color:var(--brand)}
.m-featured-article__excerpt{margin:0}
.m-featured-article__cta{margin-top:2rem}
.m-featured-article__media{display:block;aspect-ratio:604 / 400}
.m-featured-article__empty{padding:clamp(24px, 2.25vw, 32px);background:var(--grey-50);border-radius:var(--radius-card);color:var(--ink-muted)}

@media (max-width: 820px){
  .m-featured-article__panel{grid-template-columns:minmax(0, 1fr)}
  .m-featured-article__media{order:-1;aspect-ratio:16 / 10}
}

/* news-listing */
/* ==========================================================================
   News Listing — article grid (.news-card, shared) + prev / "Page X of Y" / next.
   ========================================================================== */

.m-news-listing__pagination{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:clamp(24px, 3vw, 40px);color:var(--navy);
}
.m-news-listing__pagination .icon-btn[aria-disabled="true"]{opacity:.35;pointer-events:none}
.m-news-listing__page{margin:0;font-size:var(--step-body)}
.m-news-listing__empty{padding:clamp(24px, 2.25vw, 32px);background:var(--grey-50);border-radius:var(--radius-card);color:var(--ink-muted)}