/* Gutenberg homepage composition.
 *
 * The page structure is made from core blocks. These selectors style the
 * editor-authored block classes without requiring a custom page-builder block.
 */

.homepage-blocks > .wp-block-group,
.homepage-blocks .wp-block-columns,
.homepage-blocks .wp-block-image,
.homepage-blocks .wp-block-buttons,
.homepage-blocks .wp-block-group > :last-child {
  margin-bottom: 0;
}

.homepage-blocks .wp-block-heading a {
  color: inherit;
  text-decoration: none;
}

.homepage-blocks .container-wide {
  max-width: none;
}

.homepage-blocks .wp-block-column {
  min-width: 0;
}

.homepage-blocks .wp-block-button__link {
  border-radius: 0;
}

.homepage-blocks .wp-block-button:not(.is-style-sfr-link, .is-style-sfr-link-light) .wp-block-button__link {
  display: inline-flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: center;
  padding: .85rem 1.35rem;
  border: 2px solid var(--ink);
  background: var(--ink);
  color: var(--white);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.homepage-blocks .wp-block-button:not(.is-style-sfr-link, .is-style-sfr-link-light) .wp-block-button__link:hover {
  border-color: var(--red);
  background: var(--red);
  color: var(--white);
  transform: translateY(-2px);
}

.homepage-blocks .wp-block-button.is-style-sfr-paper .wp-block-button__link {
  border-color: var(--paper);
  background: var(--paper);
  color: var(--ink);
}

.homepage-blocks .wp-block-button.is-style-sfr-paper .wp-block-button__link:hover {
  border-color: var(--white);
  background: var(--white);
  color: var(--ink);
}

.homepage-blocks .wp-block-button.is-style-sfr-outline-light .wp-block-button__link {
  border-color: rgba(255, 255, 255, .75);
  background: transparent;
  color: var(--white);
}

.homepage-blocks .wp-block-button.is-style-sfr-outline-light .wp-block-button__link:hover {
  border-color: var(--white);
  background: var(--white);
  color: var(--ink);
}

.homepage-blocks .wp-block-button.is-style-sfr-link .wp-block-button__link,
.homepage-blocks .wp-block-button.is-style-sfr-link-light .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--blue);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

.homepage-blocks .wp-block-button.is-style-sfr-link-light .wp-block-button__link {
  color: var(--white);
}

.homepage-blocks .wp-block-button.is-style-sfr-link .wp-block-button__link::after,
.homepage-blocks .wp-block-button.is-style-sfr-link-light .wp-block-button__link::after {
  content: "→";
  font-size: 1.1rem;
  transition: transform .2s ease;
}

.homepage-blocks .wp-block-button.is-style-sfr-link .wp-block-button__link:hover::after,
.homepage-blocks .wp-block-button.is-style-sfr-link-light .wp-block-button__link:hover::after {
  transform: translateX(.3rem);
}

.homepage-blocks .wp-block-button.is-style-sfr-link .wp-block-button__link:hover {
  color: var(--red);
}

.homepage-blocks .wp-block-button.is-style-sfr-link-light .wp-block-button__link:hover {
  color: #f1d9ad;
}

.homepage-blocks .section-heading__action {
  justify-content: flex-end;
  padding-bottom: .5rem;
}

.homepage-blocks .record-strip {
  gap: 0;
}

.homepage-blocks .record-strip__item {
  flex-basis: auto !important;
}

.homepage-blocks .timeline__item > .wp-block-heading,
.homepage-blocks .timeline__item > p {
  margin-bottom: 0;
}

.homepage-blocks .featured-outcome__content > .wp-block-heading {
  max-width: 10ch;
}

.homepage-blocks .outcome-ledger > .wp-block-group {
  display: grid;
  grid-template-columns: 6rem 1fr;
  gap: 1rem;
  padding-block: 1.15rem;
  border-bottom: 1px solid var(--line-light);
}

.homepage-blocks .outcome-ledger__label {
  margin: 0;
  color: #f1d9ad;
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1.4;
  text-transform: uppercase;
}

.homepage-blocks .outcome-ledger > .wp-block-group > p {
  margin: 0;
  color: #e5edf6;
}

.homepage-blocks .index-row {
  margin: 0;
}

.homepage-blocks .index-row__number,
.homepage-blocks .index-row__title,
.homepage-blocks .index-row__meta,
.homepage-blocks .index-row__action {
  margin: 0;
}

.homepage-blocks .index-row__action a {
  display: inline-grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  color: var(--ink);
  font-size: 1.25rem;
  text-decoration: none;
}

.homepage-blocks .index-row:hover .index-row__action a {
  color: var(--red-dark);
}

.homepage-blocks .human-perspective .wp-block-quote {
  margin: 2.5rem 0;
}

.homepage-blocks .media-mosaic__grid {
  gap: 1.2rem;
}

.homepage-blocks .media-mosaic__stack {
  display: grid;
  gap: 1.2rem;
}

.homepage-blocks .media-card {
  display: block;
  margin: 0;
}

.homepage-blocks .media-card::after {
  z-index: 2;
  pointer-events: none;
}

.homepage-blocks .media-card > a {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.homepage-blocks .media-card > a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--sfr-media-focus-x, 50%) var(--sfr-media-focus-y, 50%);
}

.homepage-blocks .media-card--lead,
.homepage-blocks .media-card--interview {
  --sfr-media-focus-x: 22%;
  --sfr-media-focus-y: 50%;
}

.homepage-blocks .media-card--documents {
  --sfr-media-focus-x: 50%;
  --sfr-media-focus-y: 22%;
}

.homepage-blocks .media-card--gallery {
  --sfr-media-focus-x: 50%;
  --sfr-media-focus-y: 42%;
}

.editor-styles-wrapper .media-card img {
  object-fit: cover;
  object-position: var(--sfr-media-focus-x, 50%) var(--sfr-media-focus-y, 50%);
}

.homepage-blocks .media-card figcaption {
  position: absolute;
  z-index: 3;
  right: 1.5rem;
  bottom: 1.6rem;
  left: 1.5rem;
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-size: clamp(1.35rem, 2.4vw, 2.2rem);
  font-weight: 600;
  line-height: 1.15;
  text-align: left;
}

.homepage-blocks .media-card figcaption strong {
  display: block;
  margin-bottom: 1.1rem;
  color: #f1d9ad;
  font-family: var(--sans);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.homepage-blocks .closing-pathways__grid {
  gap: 0;
}

.homepage-blocks .pathway {
  grid-template-columns: 3rem 1fr;
  grid-template-rows: auto auto 1fr auto;
}

.homepage-blocks .pathway > .wp-block-buttons {
  grid-column: 2;
  align-self: end;
}

.homepage-blocks .pathway__number,
.homepage-blocks .pathway__title,
.homepage-blocks .pathway__text {
  margin: 0;
}

.homepage-blocks .pathway__title,
.homepage-blocks .pathway__text {
  grid-column: 2;
}

@media (max-width: 70rem) {
  .homepage-blocks .hero__grid,
  .homepage-blocks .featured-outcome__grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .homepage-blocks .hero__media {
    width: min(100%, 38rem);
    margin-left: auto;
  }
}

@media (max-width: 52rem) {
  .homepage-blocks .section-heading__action {
    justify-content: flex-start;
  }

  .homepage-blocks .media-mosaic__grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .homepage-blocks .media-card,
  .homepage-blocks .media-card--lead {
    min-height: 27rem;
  }
}

@media (max-width: 35rem) {
  .homepage-blocks .hero__actions .wp-block-button,
  .homepage-blocks .hero__actions .wp-block-button__link {
    width: 100%;
  }

  .homepage-blocks .outcome-ledger > .wp-block-group {
    grid-template-columns: 1fr;
    gap: .35rem;
  }

  .homepage-blocks .pathway {
    grid-template-columns: 2.3rem 1fr;
    padding: 1rem;
  }
}