/*
 * responsive.css — All media queries (1024px, 768px, 480px, 375px)
 * Stadias.in
 */

/* ─── TABLET (≤1024px) ─── */
@media (max-width: 1024px) {
  .nav-links, .nav-cta { display: none; }
  .hamburger { display: flex; }
  .mobile-nav { display: flex; }
  nav { padding: 20px 32px; }
  .about, .services, .projects, .stats,
  .testimonial, .contact, footer { padding-left: 32px; padding-right: 32px; }
  .parallax-banner-content { padding: 0 32px; }
  .about { padding-top: 100px; padding-bottom: 100px; }
  .about-grid { grid-template-columns: 1fr; gap: 60px; }
  .about-badge { width: 130px; height: 130px; bottom: -20px; right: -10px; }
  .about-badge .num { font-size: 38px; }
  .services { padding-top: 100px; padding-bottom: 100px; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .services-header { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 48px; }
  .projects-header { flex-direction: column; align-items: flex-start; gap: 20px; padding-top: 60px; }
  .projects-grid { grid-template-columns: 1fr 1fr; }
  .projects-grid .project-card:first-child { grid-column: span 2; }
  .projects-grid .project-card:first-child .project-img { min-height: 420px; }
  .stats-inner { grid-template-columns: 1fr 1fr; }
  .big-num { font-size: 72px; }
  .contact { padding-top: 100px; padding-bottom: 100px; }
  .contact-grid { grid-template-columns: 1fr; gap: 60px; }
  .form-row { grid-template-columns: 1fr 1fr; }
  footer { padding: 60px 32px 32px; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
  .hero-stats { display: none; }
  .hero-title { font-size: clamp(70px, 10vw, 110px); }
  .banner-quote { font-size: clamp(40px, 6vw, 70px); }
  .cursor, .cursor-ring { display: none; }
  body { cursor: auto; }
  a, button { cursor: pointer; }
}

/* ─── MOBILE (≤768px) ─── */
@media (max-width: 768px) {
  .about, .services, .projects, .stats,
  .testimonial, .contact, footer { padding-left: 20px; padding-right: 20px; }
  .parallax-banner-content { padding: 0 20px; }
  nav { padding: 18px 20px; }
  .hero-content { padding: 0 20px; }
  .hero-title { font-size: clamp(60px, 14vw, 90px); line-height: 0.88; }
  .hero-sub { font-size: 15px; margin: 24px auto 36px; }
  .hero-actions { flex-direction: column; gap: 12px; }
  .btn-primary, .btn-ghost { width: 100%; text-align: center; padding: 16px 20px; clip-path: none; border-radius: 2px; }
  .hero-eyebrow { font-size: 10px; letter-spacing: 5px; }
  .ticker-item { font-size: 11px; padding: 0 24px; }
  .about { padding-top: 80px; padding-bottom: 80px; }
  .about-img-main { aspect-ratio: 3/2; }
  .about-features { grid-template-columns: 1fr; gap: 16px; }
  .about-badge { width: 110px; height: 110px; }
  .about-badge .num { font-size: 32px; }
  .about-badge .lbl { font-size: 9px; }
  .services { padding-top: 80px; padding-bottom: 80px; }
  .services-grid { grid-template-columns: 1fr; gap: 2px; }
  .service-card { padding: 36px 28px; }
  .services::before { font-size: 120px; }
  .projects-parallax { height: 60vh; }
  .parallax-content .section-title { font-size: clamp(48px, 10vw, 80px); }
  .projects { padding-bottom: 80px; }
  .projects-header { padding-top: 60px; padding-bottom: 40px; }
  .projects-grid { grid-template-columns: 1fr; gap: 3px; }
  .projects-grid .project-card:first-child { grid-column: span 1; }
  .projects-grid .project-card:first-child .project-img { min-height: 320px; }
  .project-img { min-height: 240px !important; }
  .project-name { font-size: 26px !important; }
  .project-overlay { padding: 24px; }
  .parallax-banner { height: auto; min-height: 50vh; padding: 60px 0; }
  .banner-quote { font-size: clamp(34px, 7vw, 56px); }
  .stats { padding: 80px 20px; }
  .stats-inner { grid-template-columns: 1fr 1fr; gap: 2px; }
  .stat-card { padding: 40px 20px; }
  .big-num { font-size: 56px; }
  .testimonial { padding: 80px 20px; }
  .testimonial-text { font-size: clamp(20px, 4vw, 28px); }
  .testimonial::before { font-size: 300px; top: -40px; left: -20px; }
  .contact { padding-top: 80px; padding-bottom: 80px; }
  .contact-grid { gap: 48px; }
  .form-row { grid-template-columns: 1fr; gap: 16px; }
  .contact-detail { gap: 14px; }
  footer { padding: 48px 20px 28px; }
  .footer-top { grid-template-columns: 1fr; gap: 36px; }
  .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
  .footer-tagline { font-size: 16px; }
  .section-title { font-size: clamp(38px, 8vw, 56px) !important; }
  .nav-cta { display: none; }
  .whatsapp-fab { bottom: 20px; right: 20px; }
  .whatsapp-fab a { width: 55px; height: 55px; }
  .whatsapp-fab a::before { width: 55px; height: 55px; }
  .whatsapp-fab svg { width: 28px; height: 28px; }
  .whatsapp-fab a::after { display: none; }
}

/* ─── SMALL MOBILE (≤480px) ─── */
@media (max-width: 480px) {
  .hero-title { font-size: clamp(52px, 16vw, 76px); }
  .hero-sub { font-size: 14px; }
  .logo { font-size: 22px; letter-spacing: 2px; }
  .mobile-nav a { font-size: 38px; }
  .stats-inner { grid-template-columns: 1fr 1fr; }
  .stat-card { padding: 32px 16px; }
  .big-num { font-size: 46px; }
  .about-img-main { aspect-ratio: 4/3; }
  .service-card { padding: 28px 20px; }
  .service-card h3 { font-size: 20px; }
  .recaptcha-notice { flex-direction: column; align-items: flex-start; gap: 8px; }
  .recaptcha-notice .rc-logo { width: 30px; height: 30px; }
  .contact-detail-icon { width: 34px; height: 34px; }
  .form-input, .form-select, .form-textarea { padding: 14px 16px; font-size: 13px; }
  .btn-primary { font-size: 12px; padding: 15px 20px; }
  .footer-top { gap: 28px; }
  .social-links { gap: 8px; }
  .social-link { width: 36px; height: 36px; font-size: 12px; }
  .banner-quote { font-size: clamp(28px, 8vw, 44px); }
  .section-title { font-size: clamp(34px, 9vw, 50px) !important; }
  .ticker-item { font-size: 10px; padding: 0 16px; }
}

/* ─── VERY SMALL (≤375px) ─── */
@media (max-width: 375px) {
  .hero-title { font-size: 48px; }
  .big-num { font-size: 38px; }
  .project-name { font-size: 22px !important; }
  .mobile-nav a { font-size: 32px; padding: 12px 0; }
  .about-badge { width: 90px; height: 90px; bottom: -10px; right: 0; }
  .about-badge .num { font-size: 26px; }
}