/* =====================================================================
   RD Engineering — Responsive Stylesheet (Mobile-first breakpoints)
   ===================================================================== */

/* ---- Large desktop tune ---- */
@media (max-width: 1200px) {
  .footer-top { grid-template-columns: 1.4fr 1fr 1.2fr; }
  .footer-col:nth-child(3) { display: none; }
}

/* ---- Prevent horizontal scroll on tablet/phone ----
   Directional reveals translate sideways; on stacked layouts the
   off-screen shift pokes past the viewport, so use vertical-only. */
@media (max-width: 900px) {
  .reveal-left,
  .reveal-right { transform: translateY(34px); }
  .reveal-left.is-visible,
  .reveal-right.is-visible { transform: none; }
}

/* ---- Tablet landscape ---- */
@media (max-width: 1024px) {
  .section { padding: 76px 0; }
  .feature-grid,
  .product-grid,
  .testi-grid,
  .infra-feature-grid,
  .mvv-grid { grid-template-columns: repeat(2, 1fr); }
  .industry-grid { grid-template-columns: repeat(2, 1fr); }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 40px 20px; }
  .stat:nth-child(3)::before, .stat:nth-child(2)::before { display: none; }
  .split { gap: 44px; }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .clients-grid { grid-template-columns: repeat(3, 1fr); }
  .clients-logos { grid-template-columns: repeat(3, 1fr); }
  .cert-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-layout { grid-template-columns: 1fr; }

  /* Nav collapses */
  .nav-cta .nav-phone { display: none; }
  .nav-cta > .btn-primary { display: none; }
  .nav-toggle { display: flex; }
  .nav-menu {
    position: fixed;
    top: var(--nav-h); left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    background: #fff;
    padding: 16px 24px 28px;
    gap: 2px;
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-md);
    transform: translateY(-140%);
    transition: transform .38s var(--ease);
    max-height: calc(100vh - var(--nav-h));
    overflow-y: auto;
  }
  .nav-menu.open { transform: translateY(0); }
  .nav-menu a { padding: 14px 12px; font-size: 1.05rem; border-radius: var(--radius); }
  .nav-menu a::after { display: none; }
  .nav-menu a.active { background: var(--steel-50); }
  .nav-menu .mobile-cta { display: block; margin-top: 14px; }
  .nav-menu .mobile-cta .btn { width: 100%; }
}

/* ---- Tablet portrait ---- */
@media (max-width: 820px) {
  .cta-band { padding: 48px 36px; flex-direction: column; align-items: flex-start; text-align: left; }
  .modal-card { grid-template-columns: 1fr; max-height: 88vh; overflow-y: auto; }
  .modal-media { aspect-ratio: 16 / 10; }
  .split { grid-template-columns: 1fr; }
  .split.reverse .split-media { order: 0; }
  .split-media .badge-float { position: static; margin-top: 18px; display: inline-flex; }
  .timeline::before { left: 20px; }
  .tl-item { width: 100%; left: 0 !important; text-align: left !important; padding: 0 0 34px 52px; }
  .tl-item .tl-dot { left: 11px !important; right: auto !important; }
}

/* ---- Mobile ---- */
@media (max-width: 640px) {
  :root { --nav-h: 66px; }
  .section { padding: 56px 0; }
  .section-sm { padding: 44px 0; }
  .container { padding: 0 18px; }

  h1 { font-size: clamp(2rem, 8vw, 2.5rem); }
  .hero { min-height: auto; padding-top: calc(var(--nav-h) + 40px); padding-bottom: 40px; }
  .hero p { font-size: 1.05rem; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }
  .hero-meta { gap: 26px 34px; margin-top: 40px; }
  .hero-meta div strong { font-size: 1.6rem; }

  .feature-grid,
  .product-grid,
  .testi-grid,
  .infra-feature-grid,
  .mvv-grid,
  .industry-grid,
  .process-grid,
  .values-grid,
  .strength-grid,
  .team-grid { grid-template-columns: 1fr; }

  .stats-grid { grid-template-columns: 1fr 1fr; }
  .clients-grid { grid-template-columns: repeat(2, 1fr); }
  .clients-logos { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .cert-card { grid-template-columns: 1fr; gap: 18px; }
  .cert-thumb img { height: 300px; }
  .gallery-grid { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .gallery-item.wide { grid-column: span 1; }
  .gallery-item.tall { grid-row: span 1; }

  .form-row { grid-template-columns: 1fr; }
  .contact-form-wrap { padding: 28px 22px; }
  .contact-info-grid { grid-template-columns: 1fr; }

  .cta-band { padding: 40px 26px; }
  .cta-band .cta-actions { width: 100%; flex-direction: column; }
  .cta-band .cta-actions .btn { width: 100%; }

  .section-head { margin-bottom: 40px; }
  .floating { right: 16px; bottom: 16px; }
  .float-btn { width: 50px; height: 50px; }

  .footer-top { grid-template-columns: 1fr; gap: 34px; }
  .footer-col:nth-child(3) { display: block; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 10px; }

  .page-hero { padding: calc(var(--nav-h) + 44px) 0 48px; }
  .modal { padding: 14px; }
  .modal-body { padding: 28px 24px; }
}

/* ---- Small mobile ---- */
@media (max-width: 380px) {
  .stats-grid { grid-template-columns: 1fr; }
  .brand-text small { letter-spacing: .18em; }
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* ---- Print ---- */
@media print {
  .site-header, .floating, .trust-strip, .cta-band, .hero-bg { display: none !important; }
  body { color: #000; }
}
