/* Responsive patch layer — added at go-live. Keeps the desktop design untouched
   and adapts layout for tablets and phones. */

@media (max-width: 1080px) {
  .cc-menu { gap: 18px; }
  .cc-menu a { font-size: 14px; }
}

@media (max-width: 960px) {
  /* Nav: brand + CTA on the first row, links become a scrollable row below */
  .cc-nav-inner { flex-wrap: wrap; height: auto; padding: 10px 0 0; gap: 12px; }
  .cc-menu {
    order: 3; flex-basis: 100%; margin-left: 0;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    padding: 4px 2px 12px; scrollbar-width: none;
  }
  .cc-menu::-webkit-scrollbar { display: none; }
  .cc-nav-right { margin-left: auto; }
  .cc-nav-right .cc-btn { height: 36px; padding: 0 16px; font-size: 14px; }

  /* Any inline two-column grid stacks to one column */
  div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  .cc-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .cc-footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .cc-band { padding: 64px 0; }
  .cc-hero { padding: 72px 0 56px; }
  .cc-cta-band { padding: 80px 24px; }
  h1 { font-size: clamp(38px, 9vw, 64px) !important; }
}

@media (max-width: 640px) {
  .cc-container { padding: 0 20px; }
  .cc-grid-3 { grid-template-columns: 1fr; }
  .cc-footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .cc-footer-meta { flex-direction: column; gap: 8px; }
  .cc-quote { font-size: 24px; }
  .cc-hero-ctas .cc-btn { width: 100%; }
  .cc-eyebrow { font-size: 15px; }
  h2 { font-size: clamp(28px, 8vw, 40px) !important; }
  .cc-stack { height: 260px; }
}