.trio { scroll-margin-top: 90px; }
.trio__head { text-align: center; max-width: 40ch; margin: 0 auto clamp(2rem, 5vw, 3.5rem); }
.trio__head .eyebrow { color: var(--glow); margin-bottom: 0.75rem; }

.trio__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 3vw, 2rem);
}
.trio__foot { margin-top: clamp(2rem, 5vw, 3.5rem); text-align: center; }

@media (max-width: 900px) {
  .trio__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .trio__grid { grid-template-columns: 1fr; max-width: 24rem; margin-inline: auto; }
}