body {
  background-image:
    radial-gradient(circle at 0% 0%, rgba(38, 92, 60, 0.55), transparent 55%),
    radial-gradient(circle at 100% 0%, rgba(178, 122, 58, 0.5), transparent 60%),
    radial-gradient(circle at 50% 100%, rgba(7, 20, 15, 0.9), transparent 65%);
}

.overview-hero {
  background: radial-gradient(circle at 0 0, rgba(29, 92, 69, 0.35), transparent 60%),
              radial-gradient(circle at 100% 0, rgba(178, 122, 58, 0.35), transparent 65%),
              linear-gradient(180deg, rgba(5, 6, 7, 0.96), rgba(7, 20, 15, 0.98));
}

.hero--overview .hero__title {
  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.85);
}

.overview-hero__media {
  background: none;
  box-shadow: var(--shadow-strong);
}

.overview-hero__image,
.overview-locations__image,
.overview-art__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.overview-grid {
  gap: var(--space-10);
}

.overview-grid--reverse {
  align-items: stretch;
}

.overview-locations {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr);
  gap: var(--space-10);
  align-items: center;
}

.overview-locations__media {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-elevated);
}

.overview-locations__grid {
  align-self: stretch;
}

.overview-card-small {
  padding: var(--space-6);
}

.overview-art__media {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-elevated);
}

.overview-art__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.overview-art {
  background: radial-gradient(circle at 0 0, rgba(29, 92, 69, 0.28), transparent 60%),
              radial-gradient(circle at 100% 100%, rgba(178, 122, 58, 0.3), transparent 70%),
              linear-gradient(135deg, rgba(5, 8, 10, 0.98), rgba(19, 16, 12, 0.99));
}

.overview-community {
  background-image:
    linear-gradient(135deg, var(--color-bg-parchment), var(--color-bg-parchment-soft));
}

.overview-community__actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (max-width: 960px) {
  .overview-locations {
    grid-template-columns: minmax(0, 1fr);
  }

  .overview-locations__media {
    order: -1;
  }
}

@media (max-width: 720px) {
  .section {
    padding-block: var(--space-16);
  }

  .overview-card,
  .overview-art,
  .overview-community {
    padding: var(--space-6);
  }
}
