/* ============================================================
   CMTI homepage polish v1 — loaded AFTER all other stylesheets.
   CSS-only, reversible (remove the <link> and this file).
   Fixes: sticky-header overlap, broken footer grid, truncated
   card meta, rainbow card buttons, uneven cards/rows, quote
   overlap, CEO panel balance, mobile tap targets + hero size.
   ============================================================ */

/* 1) Anchors never hide under the sticky header */
html { scroll-padding-top: 112px; }
section[id], .section, .section-title { scroll-margin-top: 112px; }

/* 2) Footer: one true 4-column row on desktop, tidy contact list */
@media (min-width: 992px) {
  .site-footer .footer-content {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1fr 1.25fr;
    gap: 2.5rem;
    align-items: start;
  }
}
.site-footer .contact-item { margin-bottom: 0.55rem; line-height: 1.5; }
.site-footer .contact-info { display: flex; flex-direction: column; gap: 0.35rem; }

/* 3) Course cards: equal heights, actions pinned to the bottom */
.cmti-card { display: flex; flex-direction: column; height: 100%; }
.cmti-card-body { flex: 1 1 auto; display: flex; flex-direction: column; }
.cmti-card-actions { margin-top: auto; }

/* 4) Card meta (trainer / level / lectures) never clipped mid-word */
.cmti-card-meta, .cmti-card-meta * {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* 5) One brand button system on cards — no rainbow per theme */
.cmti-card .cmti-btn--primary {
  background: var(--gold) !important;
  border-color: var(--gold-deep) !important;
  color: #171205 !important;
}
.cmti-card .cmti-btn--ghost {
  background: transparent !important;
  border-color: var(--ink) !important;
  color: var(--ink) !important;
}

/* 6) Partial last rows centre themselves instead of leaving a hole */
.category-grid, .quote-cards { justify-content: center; }

/* 7) Testimonials: the giant quote mark clears the first word */
.quote-card { padding-top: 2.4rem; }

/* 8) CEO card: photo panel content sits centred, not top-heavy */
.ceo-image-content {
  display: flex; flex-direction: column;
  justify-content: center; align-items: center;
  height: 100%; text-align: center;
}

/* 9) Stats stay readable over the textured glass */
.stat-number, .stat-text { text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); }

/* 10) Mobile: calmer hero, honest tap targets, stacked footer */
@media (max-width: 768px) {
  .hero-title { font-size: clamp(1.65rem, 7vw, 2.3rem); line-height: 1.16; }
  .hero-badge { font-size: 0.7rem; letter-spacing: 0.04em; padding: 0.35rem 0.7rem; }
  .g3-cube-wrap, .g3-orb { opacity: 0.35; transform: scale(0.6); }
  .cmti-btn, .btn { min-height: 48px; }
  .site-footer .footer-content { display: flex; flex-direction: column; gap: 1.5rem; }
  .quote-card { padding-top: 2rem; }
}