.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: 1.25rem; }

@media (min-width: 768px)  { .container { padding-inline: 2rem; } }
@media (min-width: 1280px) { .container { padding-inline: 3rem; } }

.section { padding-block: var(--sp-sec); }
.section--sm { padding-block: calc(var(--sp-sec) / 2); }
.section--dark { background-color: #0D0D0D; color: rgba(255,255,255,0.75); }
.section--dark h2, .section--dark h3 { color: #fff; }
.section--green { background-color: var(--color-primary); color: rgba(255,255,255,0.85); }
.section--green h2 { color: #fff; }
.section--light { background-color: var(--color-surface); }

.services-grid { display: grid; grid-template-columns: 1fr; gap: var(--gap); }
@media (min-width: 640px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }

.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gap); }
@media (min-width: 768px) { .team-grid { grid-template-columns: repeat(4, 1fr); } }

.cta-section {
  text-align: center;
  padding-block: var(--sp-sec);
}

.cta-section__title { font-size: var(--type-h2); color: #fff; margin-bottom: 1.75rem; }
.cta-section__btns { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
