/* Client's 2 October checklist takes precedence over the September Figma. */

/* Shared article layout, with the interview guest separate from its author. */
.story--sidebar .story__title { max-width: 100%; }
.story__guest { margin: 24px 0 0; font: 500 16px/1.5 var(--v2-font); }
.story__guest + .story__meta { margin-top: 16px; }
.story--sidebar .story__body { overflow-wrap: anywhere; }
.story--sidebar .story__body ul > li::before { top: 18px; }

/* All newsletter placements use the home-page copy, type and email control.
   Narrow sidebars and dialogs adapt the same component to the available width. */
.newsletter-section { width: 100%; padding-block: 48px; background: #fff; }
.v2-subscribe, .story__sidebar .v2-subscribe--card { box-sizing: border-box; font-family: var(--v2-font); background: #fff; }
.v2-subscribe--card, .story__sidebar .v2-subscribe--card {
  float: none; clear: none; width: 100%; max-width: none; min-height: 0;
  margin: 0; padding: 32px 20px;
}
.v2-subscribe--card .v2-subscribe__title,
.story__sidebar .v2-subscribe__title { font-size: 32px; line-height: 1.2; letter-spacing: -.045em; }
.v2-subscribe--card .v2-subscribe__text,
.story__sidebar .v2-subscribe__text { max-width: none; min-height: 0; margin: 16px 0 0; font: 400 16px/1.5 var(--v2-font); }
.v2-subscribe--card .v2-subscribe__form,
.story__sidebar .v2-subscribe__form { width: 100%; height: 52px; margin: 28px auto 0; }
.v2-subscribe--card .v2-subscribe__input,
.story__sidebar .v2-subscribe__input { width: calc(100% - 52px); height: 52px; background: #fff; }
.v2-subscribe--card .v2-subscribe__button,
.story__sidebar .v2-subscribe__button { width: 52px; height: 52px; top: 0; }
.v2-subscribe--card .v2-subscribe__consent,
.story__sidebar .v2-subscribe__consent { width: 100%; max-width: none; margin: 18px 0 0; font: 400 12px/1.6 var(--v2-font); }
.v2-subscribe__consent > span { display: inline; }
.v2-subscribe__consent .v2-subscribe__opt-out { display: block; }
.v2-subscribe--card .v2-subscribe__success { margin-top: 28px; }
.v2-subscribe--card .subscribe-success__title { font-family: var(--v2-font); }
.modal__window--form { background: #fff; max-width: min(600px, calc(100vw - 32px)); }

/* Image boxes scale proportionally at every viewport and browser zoom level. */
.insight-card .insight-card__cover,
.insight-card.big .insight-card__cover,
.insight-card.preview .insight-card__cover,
.insight-lead__media, .related-card__media,
.story--sidebar .story__cover {
  display: block; height: auto; min-height: 0; aspect-ratio: 16 / 9;
  flex-shrink: 0; overflow: hidden;
}
.insight-card__image, .insight-lead__image, .related-card__image,
.story__cover .story__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.story__body img, .article-content img { max-width: 100%; height: auto; }
.news__cover, .news--small .news__cover, .event-card__cover {
  height: auto; min-height: 0; aspect-ratio: 16 / 9; align-self: flex-start;
}
.news__image, .event-card__image { width: 100%; height: 100%; object-fit: cover; }
.vision-card__cover, .vision-card.big .vision-card__cover { height: auto; min-height: 0; aspect-ratio: 2 / 3; }
.vision-card__image { width: 100%; height: 100%; object-fit: contain; }

/* The same heading alignment and container on both Vision pages. */
.vision-page--aligned { padding: 64px 0 80px; gap: 48px; font-family: var(--v2-font); }
.vision-page__header .page-header, .visions-page__header .page-header {
  padding: 0; align-items: flex-start; text-align: left;
}
.vision-page__header .page-header__info, .visions-page__header .page-header__info {
  width: 100%; max-width: 100%; align-items: flex-start; text-align: left;
}
.vision-page__header .page-header__title, .visions-page__header .page-header__title {
  font: 500 clamp(32px, 3.125vw, 48px)/1.2 var(--v2-font); letter-spacing: -.04em; text-align: left;
}
.vision-page__header .page-header__description, .visions-page__header .page-header__description {
  max-width: 820px; font: 400 18px/1.5 var(--v2-font); text-align: left;
}
.vision-page--aligned .vision-page__main {
  min-height: 0; padding: 0; margin-inline: auto; margin-block: 0;
  background: none; display: block;
}
.vision-page--aligned .vision-page__main-item { width: 100%; margin: 0; }
.vision-page--aligned .vision-card.big {
  display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  max-width: none; width: 100%; padding: 32px; gap: 48px; align-items: start;
}
.vision-page--aligned .vision-card.big .vision-card__cover { width: 100%; }
.vision-page--aligned .vision-card.big .vision-card__body { min-width: 0; padding: 0; }
.vision-page--aligned .vision-card.big .vision-card__details { order: 0; padding-top: 0; }
.vision-page--aligned .vision-page__news { margin-top: 0; }
.visions-v2 .vision-card__title { min-height: 2.6em; text-align: left; }

/* Adverts keep their uploaded proportions; each placement supports a stack. */
.sidebar-banners { display: grid; gap: 24px; flex: 0 0 374px; width: 374px; align-content: start; align-self: flex-start; }
.sidebar-banners .sidebar-banner, .story__sidebar .sidebar-banner { position: static; width: 100%; height: auto; background: transparent; }
.sidebar-banner picture, .top-banner picture, .sidebar-banner__link { display: block; }
.sidebar-banners .sidebar-banner__image, .story__sidebar .sidebar-banner__image,
.top-banner .top-banner__image { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; }
.story__sidebar .sidebar-banners { width: 100%; flex-basis: auto; }
@media (min-width: 1025px) and (max-width: 1440px) {
  .news-page__container > .sidebar-banners { width: 288px; flex-basis: 288px; }
}
@media (max-width: 1024px) {
  .sidebar-banners { width: 100%; flex: 0 0 auto; }
}

/* Reduce the excess gap before home Insights and enlarge usable tag controls. */
.home-insights { padding-block: clamp(48px, 4.2vw, 80px); }
.home-insights__grid { margin-top: clamp(28px, 2.5vw, 48px); align-items: start; }
.home-insights .v2-kicker { font-size: 16px; line-height: 1.5; }
.insight-lead .story__author { margin-top: 16px; }
.insights-page__tags { flex-wrap: wrap; justify-content: flex-start; gap: 12px; overflow: visible; padding-block: 8px; }
.insights-page__tag { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 20px; font: 500 16px/1.5 var(--v2-font); white-space: normal; }
.insight-card__tags { flex-wrap: wrap; gap: 8px; }
.insight-card__tag { padding: 6px 10px; font-size: 14px; line-height: 1.4; white-space: normal; }
.story__topics { flex-wrap: wrap; }
.story__topic { min-height: 40px; padding: 8px 14px; font-size: 16px; }

@media (max-width: 1024px) {
  .vision-page--aligned { padding: 40px 0 56px; gap: 32px; }
  .vision-page--aligned .vision-card.big { gap: 32px; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); padding: 24px; }
  .newsletter-section { padding-block: 32px; }
}
@media (max-width: 600px) {
  .vision-page--aligned .vision-card.big { grid-template-columns: minmax(0, 1fr); padding: 20px; }
  .vision-page--aligned .vision-card.big .vision-card__cover { max-width: 320px; margin-inline: auto; }
  .insights-page__tag { min-height: 44px; font-size: 14px; padding: 10px 14px; }
  .v2-subscribe--card, .story__sidebar .v2-subscribe--card { padding-inline: 0; }
}

.float-subscribe__panel { position: relative; background: #fff; color: var(--v2-ink); padding: 24px 20px 12px; max-height: calc(100dvh - 100px); overflow-y: auto; }
.float-subscribe__panel .float-subscribe__close { position: absolute; top: 4px; right: 8px; width: 32px; height: 32px; color: var(--v2-ink); font: 24px/1 var(--v2-font); z-index: 1; }
.float-subscribe__panel .v2-subscribe--card { padding-inline: 0; }

@media (max-width: 600px) {
  .v2-related .v2-section-head { flex-wrap: wrap; gap: 20px; }
  .v2-related .v2-section-head .v2-h2 { flex-basis: 100%; }
  .v2-related .v2-section-head__rule { display: none; }
  .v2-related .v2-section-head__button { margin: 0; }
}
