/* Shared breakpoint overrides that touch several unrelated components at once. Component-specific responsive tweaks stay in that component's own stylesheet; only the cross-cutting ones live here. This file must be the last stylesheet linked in so these equal-specificity overrides win by source order. */ @media (max-width: 900px) { nav { padding: 22px 28px; } nav.scrolled { padding: 16px 28px; } section { padding: 80px 28px; } .about-grid, .contact-grid { grid-template-columns: 1fr; gap: 48px; } .cap-grid { grid-template-columns: 1fr 1fr; } .nav-links { display: none; } .nav-right { gap: 20px; } } @media (max-width: 600px) { .cap-grid { grid-template-columns: 1fr; } .hero-ctas { flex-direction: column; align-items: center; } }