/* 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}
}

/* company-rows */
/* ==========================================================================
   Company Rows — text one side, bordered logo tile (.logo-tile) the other;
   even rows swap sides. Below 820px every row stacks with the tile first.
   ========================================================================== */

.m-company-rows__intro{max-width:70ch;margin-bottom:clamp(32px, 3vw, 40px)}

.m-company-rows__row{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--gap);align-items:center}
.m-company-rows__row+.m-company-rows__row{margin-top:clamp(32px, 3vw, 40px)}
.m-company-rows__row:nth-child(odd) .m-company-rows__text{padding-right:clamp(0px, 8vw, 96px)}
.m-company-rows__row:nth-child(even) .m-company-rows__text{order:2;padding-left:clamp(0px, 8vw, 96px)}

.m-company-rows__title{margin-bottom:1.25rem}
.m-company-rows__link{margin-top:1.5rem}

.m-company-rows__tile{aspect-ratio:544 / 400;border-radius:var(--radius-card);padding:15%}
.m-company-rows__tile img{max-height:100%;max-width:100%}

@media (max-width: 820px){
  .m-company-rows__row{grid-template-columns:minmax(0, 1fr);gap:24px}
  .m-company-rows__row:nth-child(odd) .m-company-rows__text{padding-right:0}
  .m-company-rows__row:nth-child(even) .m-company-rows__text{order:0;padding-left:0}
  .m-company-rows__tile{aspect-ratio:16 / 9;order:-1}
}

/* news-cards */
/* ==========================================================================
   News Cards — "Get the latest from the Group". Card styles are shared
   (.news-card in shared.css); only the module-specific rules live here.
   On the grey surface the cards turn white.
   ========================================================================== */

.m-news-cards__head{margin-bottom:clamp(24px, 3vw, 40px)}
.m-news-cards__empty{padding:clamp(24px, 2.25vw, 32px);background:var(--grey-50);border-radius:var(--radius-card);color:var(--ink-muted)}

.m-news-cards__head{align-items:flex-end}
.m-news-cards__eyebrow{margin:0 0 .5rem;font-weight:400}
.m-news-cards__eyebrow:empty{display:none}
.m-news-cards.surface-grey .news-card,
.m-news-cards.surface-grey .m-news-cards__empty{background:var(--white)}