/* Shared section wrapper, tags, titles, descriptions. Used on every page. */

section {
  padding: 64px 5%;
}

.section-inner {
  max-width: var(--content);
  margin: 0 auto;
}

.section-tag {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  color: var(--blue-mid);
  font-weight: 500;
  margin-bottom: 8px;
}

.section-title {
  font-family: var(--font-heading);
  font-size: 34px;
  color: var(--dark);
  margin-bottom: 10px;
  line-height: 1.22;
}

.section-desc {
  font-size: 15px;
  color: var(--muted);
  line-height: 1.65;
  max-width: 540px;
  font-weight: 400;
}

/* Alternate background to separate stacked sections */
.section-alt {
  background: var(--blue-pale);
}

@media (max-width: 900px) {
  section { padding: 48px 5%; }
  .section-title { font-size: 28px; }
}
