:where(:root) {
  --content-max: var(--W, 1200px);
  --content-wide: 1480px;
  --section-space-xl: 104px;
  --section-space-lg: 96px;
  --section-space-md: 72px;
  --section-space: var(--section-space-lg);
  --section-gutter-total: 48px;
  --section-head-space: 40px;
  --section-scroll-margin: 0px;
}

:where(.section) {
  padding-block: var(--section-space);
  scroll-margin-top: var(--section-scroll-margin);
}

:where(.inn, .section-inner) {
  width: min(100% - var(--section-gutter-total), var(--content-max));
  margin-inline: auto;
}

:where(.section-head) {
  margin-block-end: var(--section-head-space);
}

:where(.section-title) {
  margin-block: 0 18px;
}

:where(.section-desc) {
  max-width: var(--section-desc-max, 680px);
}

:where(.section-grid) {
  display: grid;
  gap: var(--section-grid-gap, 18px);
}

:where(.section-media) {
  aspect-ratio: var(--section-media-ratio, auto);
  overflow: hidden;
  background: var(--section-media-bg, transparent);
}

:where(.section-media > img, .section-media > picture > img) {
  width: 100%;
  height: 100%;
  display: block;
}

:where(.section-media.is-cover > img, .section-media.is-cover > picture > img) {
  object-fit: cover;
}

:where(.section-media.is-contain > img, .section-media.is-contain > picture > img) {
  object-fit: contain;
}