.container       { max-width: var(--container-max); margin: 0 auto; padding: 0 1.5rem; }
.container--narrow { max-width: var(--container-narrow); margin: 0 auto; padding: 0 1.5rem; }

.section         { padding: var(--section-pad); }
.section--dark   { background: var(--navy); color: var(--white); }
.section--dark h2,
.section--dark h3 { color: var(--white); }
.section--soft   { background: var(--offwhite); }
.section--gold   { background: var(--navy); color: var(--white); }

.grid-2-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 768px) {
  .grid-2-col { grid-template-columns: 1fr 1fr; }
}

.grid-3-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) {
  .grid-3-col { grid-template-columns: 1fr 1fr 1fr; }
}

.text-center { text-align: center; }
.mb-1 { margin-bottom: .5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }

.kicker {
  display: inline-block;
  font-family: var(--ff-heading);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: .75rem;
}

.section--dark .kicker { color: var(--gold-light); }

.btn {
  display: inline-block;
  font-family: var(--ff-heading);
  font-weight: 600;
  font-size: .95rem;
  padding: .75rem 1.75rem;
  border-radius: var(--border-radius);
  transition: all .25s;
  cursor: pointer;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}
.btn--primary:hover {
  background: var(--gold-light);
  color: var(--navy);
}

.btn--ghost {
  background: transparent;
  color: var(--gold);
  border: 2px solid var(--gold);
}
.btn--ghost:hover {
  background: var(--gold);
  color: var(--navy);
}

.btn--on-dark {
  background: var(--gold);
  color: var(--navy);
}
.btn--on-dark:hover {
  background: var(--gold-light);
  color: var(--navy);
}
