/* ============================================
   CADLEM CONSULTANTS — Responsive / Media Queries
   ============================================ */

/* ── TABLET (768–1024px) ── */
@media (max-width: 1024px) and (min-width: 769px) {
  :root { --section-pad-x: 3rem; --section-pad-y: 6rem; }

  nav { padding: 1.5rem 3rem; }
  nav.scrolled { padding: 1rem 3rem; }

  .hero-content { padding: 0 3rem 6rem; }
  .hero-stats { right: 3rem; }

  #about { grid-template-columns: 1fr 1fr; }
  .about-text { padding: 5rem 3rem; }
  .about-img-inset { display: none; }

  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .services-top { flex-direction: column; gap: 1.5rem; }
  .services-top-right { max-width: 100%; }

  .portfolio-strip { grid-template-columns: 1.5fr 1fr 1fr; height: 400px; }
  .portfolio-item:last-child { display: none; }

  #process { grid-template-columns: 1fr 1fr; gap: 4rem; }

  .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial-card:last-child { display: none; }
  .testimonials-header { grid-template-columns: 1fr; }

  #contact { grid-template-columns: 1fr 1fr; }
  .contact-form-section { padding: 4rem 3rem; }

  footer { padding: 3rem 3rem; }
}

/* ── MOBILE (≤768px) ── */
@media (max-width: 768px) {
  :root { --section-pad-x: 1.5rem; --section-pad-y: 4rem; }

  /* Nav */
  nav { padding: 1.2rem 1.5rem; }
  nav.scrolled { padding: 0.9rem 1.5rem; }
  .nav-links { display: none; }
  .hamburger { display: flex; }

  /* Hero */
  .hero-content { padding: 0 1.5rem 4rem; max-width: 100%; }
  .hero-stats { display: none; }
  .hero-scroll { display: none; }
  .hero-title { font-size: clamp(2.4rem, 9vw, 3.5rem); }
  .hero-actions { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .btn-primary { padding: 0.9rem 2rem; font-size: 0.6rem; width: 100%; justify-content: center; }
  .btn-ghost { font-size: 0.6rem; }

  /* About */
  #about { grid-template-columns: 1fr; }
  .about-images { height: 55vw; min-height: 250px; }
  .about-img-inset { display: none; }
  .about-text { padding: 3rem 1.5rem; }
  .about-pillars { grid-template-columns: 1fr; }

  /* Services */
  .services-top { flex-direction: column; gap: 1.2rem; margin-bottom: 3rem; }
  .services-top-right { max-width: 100%; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card { height: 320px; }
  .service-desc { max-height: 60px !important; opacity: 1 !important; }
  .service-line { width: 30px !important; }

  /* Portfolio */
  .portfolio-header { flex-direction: column; gap: 1rem; align-items: flex-start; }
  .portfolio-strip { grid-template-columns: 1fr; height: auto; gap: 3px; }
  .portfolio-item { height: 240px; }
  .portfolio-label { opacity: 1 !important; transform: translateY(0) !important; }

  /* Process */
  #process { grid-template-columns: 1fr; gap: 2.5rem; }
  .process-image { height: 240px; }
  .process-image-accent { display: none; }
  .process-steps { margin-top: 1.5rem; }
  .process-step { gap: 1.2rem; padding: 1.5rem 0; }

  /* Testimonials */
  .testimonials-header { grid-template-columns: 1fr; margin-bottom: 3rem; }
  .testimonials-header p { display: none; }
  .testimonials-grid { grid-template-columns: 1fr; }

  /* Contact */
  #contact { grid-template-columns: 1fr; }
  .contact-image { height: 280px; }
  .contact-image-overlay {
    background: linear-gradient(to top, rgba(8,8,8,0.9) 30%, transparent 100%);
  }
  .contact-form-section { padding: 4rem 1.5rem; }
  .form { margin-top: 2rem; }
  .form-row { grid-template-columns: 1fr; }

  /* Footer */
  footer { padding: 3rem 1.5rem; }
  .footer-top { flex-direction: column; gap: 2.5rem; }
  .footer-nav { flex-direction: row; gap: 3rem; flex-wrap: wrap; }
  .footer-bottom { flex-direction: column; gap: 0.8rem; text-align: center; }

  /* Marquee */
  .marquee-item { font-size: 0.65rem; padding: 0 2rem; }

  /* Disable custom cursor on touch devices */
  body { cursor: auto; }
  .cursor, .cursor-ring { display: none; }
}

/* ── SMALL MOBILE (≤400px) ── */
@media (max-width: 400px) {
  .hero-title { font-size: 2.2rem; }
  .about-text { padding: 2.5rem 1.2rem; }
  .contact-form-section { padding: 3rem 1.2rem; }
  footer { padding: 2.5rem 1.2rem; }
}
