/* ==========================================================================
   responsive.css — breakpoint overrides. Load LAST so it wins the cascade.
   ========================================================================== */

@media (max-width: 768px) {
  nav { padding: 16px 24px; }
  .nav-logo { gap: 10px; }
  .hero-mark { width: 68px; height: 68px; border-radius: 20px; margin-bottom: 22px; }
  section { padding: 64px 24px; }
  .cta-section { margin: 0 24px 60px; padding: 48px 32px; flex-direction: column; align-items: flex-start; }
  .cta-section::before { font-size: 100px; }
  footer { flex-direction: column; align-items: flex-start; gap: 20px; padding: 32px 24px; }
  .footer-links { flex-wrap: wrap; gap: 16px; }
}