/* ==========================================================================
   Africa CPTA Theme — Layout
   Reusable section scaffolding, grids, utilities
   ========================================================================== */

/* Section shells */
.section-bg { padding: clamp(40px, 6vw, 96px) 0; }
.light-section { background: var(--color-bg, #fff); color: var(--color-text, #222); }
.dark-section  { background: #0f1419; color: #e8eef5; }

/* Section headings */
.section-title {
  font-weight: 800;
  letter-spacing: -.01em;
  margin-bottom: .5rem;
}
.section-intro {
  color: var(--color-text-dim, #5b6b79);
  max-width: 760px;
  margin-inline: auto;
}

/* Cards */
.card-plain {
  background: var(--color-surface, #fff);
  border: 1px solid var(--color-border, rgba(0,0,0,.08));
  border-radius: 12px;
}

/* Image aspect helpers */
.ratio-3x2 { aspect-ratio: 3 / 2; }
.ratio-16x9 { aspect-ratio: 16 / 9; }
.object-cover { object-fit: cover; }

/* Chips / badges */
.chip {
  display: inline-block;
  padding: .25rem .5rem;
  border-radius: 999px;
  background: var(--color-muted, #f5f7f9);
  color: var(--color-text, #222);
  font-weight: 600;
  font-size: .85rem;
}

/* Spacing helpers */
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}