@media (max-width: 1080px) {
    .hero-layout,
    .services-grid,
    .contact-grid {
      grid-template-columns: 1fr;
    }
  
    .hero-visual {
      min-height: 620px;
    }
  
    .laptop-wrap {
      position: relative;
      top: 0;
      right: 0;
      margin: 0 auto;
    }
  
    .phone-wrap {
      right: 10px;
      bottom: 0;
    }
  }
  
  @media (max-width: 760px) {
    .nav {
      min-height: auto;
      padding: 16px 0;
      flex-wrap: wrap;
    }
  
    .nav-menu {
      width: 100%;
      justify-content: center;
      order: 3;
      gap: 18px;
    }
  
    .hero {
      min-height: auto;
      padding-top: 44px;
    }
  
    .hero-copy h1 {
      font-size: 2.35rem;
    }
  
    .laptop-screen {
      min-height: 280px;
    }
  
    .screen-slider {
      min-height: 246px;
    }
  
    .mini-stats,
    .slide-grid,
    .slide-dashboard {
      grid-template-columns: 1fr;
    }
  
    .phone-wrap {
      width: 142px;
      right: 0;
    }
  
    .phone-screen {
      height: 300px;
    }
  }

  @media (max-width: 1180px) {
    .hero-scene {
      min-height: 900px;
    }
  
    .laptop-dev {
      position: relative;
      left: auto;
      top: 0;
      width: min(100%, 720px);
      margin: 0 auto;
    }
  
    .scene-wire {
      position: relative;
      left: auto;
      top: auto;
      width: 220px;
      height: 120px;
      margin: 6px auto 10px;
      transform: rotate(18deg);
    }
  
    .phone-game {
      position: relative;
      right: auto;
      top: 0;
      width: 220px;
      margin: 0 auto;
    }
  
    .hero-dev .glow-a {
      left: 12%;
      top: 180px;
    }
  
    .hero-dev .glow-b {
      right: 12%;
      top: 540px;
    }
  }
  
  @media (max-width: 760px) {
    .hero-dev {
      padding-top: 34px;
    }
  
    .hero-scene {
      min-height: 760px;
    }
  
    .laptop-dev {
      width: 100%;
    }
  
    .dev-screen {
      min-height: 280px;
    }
  
    .code-editor {
      min-height: 246px;
      font-size: 0.86rem;
      padding: 22px 18px;
    }
  
    .scene-wire {
      width: 180px;
      height: 90px;
      margin: 0 auto 8px;
    }
  
    .phone-game {
      width: 180px;
    }
  
    .game-screen {
      height: 380px;
    }
  
    .hero-dev .glow-a,
    .hero-dev .glow-b {
      width: 220px;
      height: 220px;
    }
  }

  @media (max-width: 1180px) {
    .scene-flow {
      position: relative;
      left: auto;
      top: auto;
      width: 220px;
      height: 90px;
      margin: 10px auto 18px;
    }
  }
  
  @media (max-width: 760px) {
    .scene-flow {
      width: 180px;
      height: 80px;
    }
  
    .flow-line-1 { top: 18px; }
    .flow-line-2 { top: 38px; }
    .flow-line-3 { top: 58px; }
  
    .flow-particle-1 { top: 14px; }
    .flow-particle-2 { top: 34px; }
    .flow-particle-3 { top: 54px; }
  }

  @media (max-width: 980px) {
    .about-layout {
      grid-template-columns: 1fr;
    }
  
    .about-pillars {
      grid-template-columns: 1fr 1fr;
    }
  }
  
  @media (max-width: 640px) {
    .about-pillars {
      grid-template-columns: 1fr;
    }
  
    .about-copy {
      padding: 26px;
    }
  
    .pillar-card {
      min-height: 140px;
    }
  }

  @media (max-width: 980px) {
    .services-grid-strong {
      grid-template-columns: 1fr;
    }
  
    .service-card-strong {
      min-height: 220px;
    }
  }

  @media (max-width: 980px) {
    .contact-layout {
      grid-template-columns: 1fr;
    }
  }
  
  @media (max-width: 640px) {
    .contact-copy,
    .contact-form {
      padding: 24px;
    }
  
    .mail-animation {
      right: 20px;
      bottom: 24px;
      transform: scale(0.9);
      transform-origin: bottom right;
    }
  }

  @media (max-width: 640px) {
    .policy-card {
      padding: 24px;
    }
  }