/* Page-specific layout primitives. */

.contact-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 0.9rem;
}

.contact-card {
  grid-column: span 6;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--panel-2);
  box-shadow: var(--shadow-sm);
  padding: 1.15rem 1.15rem 1.05rem;
}

.contact-card-wide {
  grid-column: span 12;
}

.contact-title {
  margin: 0 0 0.6rem;
  font-size: 1.15rem;
}

.contact-text {
  margin: 0 0 0.75rem;
  max-width: var(--line);
  color: color-mix(in srgb, var(--text) 84%, var(--muted));
}

.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.2rem;
}

@media (max-width: 900px) {
  .contact-card {
    grid-column: span 12;
  }
}