/* 選ばれる理由：パソコンの専用寸法と配置。スマホの変更は../responsive.css。 */
:where([data-section="reasons"][data-ui="sui"]).reasons {
  padding-block: var(--space-section);
  overflow: hidden;
  background: var(--color-surface);
}

:where([data-section="reasons"][data-ui="sui"]) .reasons__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-card-gap);
  margin-block-end: var(--space-grid);
}

:where([data-section="reasons"][data-ui="sui"]) .reasons__heading .section-heading__lead {
  padding-inline-start: var(--space-stack);
  border-inline-start: var(--size-line) solid var(--color-soft);
}

:where([data-section="reasons"][data-ui="sui"]) .reasons__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--space-grid);
  list-style: none;
}

:where([data-section="reasons"][data-ui="sui"]) .reason {
  display: flex;
  gap: var(--space-stack);
  padding-block: var(--space-card-gap);
  border-block: var(--size-line) solid var(--color-line);
}

:where([data-section="reasons"][data-ui="sui"]) .reason:nth-child(n + 3) {
  border-block-start: 0;
}

:where([data-section="reasons"][data-ui="sui"]) .reason__number {
  color: var(--color-soft);
  font-family: var(--font-latin);
  font-size: var(--font-size-number);
  line-height: var(--line-tight);
}

:where([data-section="reasons"][data-ui="sui"]) .reason__title {
  font-family: var(--font-title);
  font-size: var(--font-size-card);
  font-weight: var(--weight-title);
}

:where([data-section="reasons"][data-ui="sui"]) .reason__body {
  margin-block-start: var(--space-small);
  color: var(--color-text-muted);
  font-size: var(--font-size-body);
}

:where([data-section="reasons"][data-ui="sui"]) .reasons__wordmark {
  position: absolute;
  inset-inline-end: var(--space-inline);
  inset-block-end: var(--space-small);
}

:where([data-section="reasons"][data-ui="sui"]) .reason__title span {
  display: inline-block;
}
