@media (max-width: 768px) {
  #bg-canvas {
    display: none !important;
  }

  body::before,
  body::after {
    display: none !important;
  }

  body {
    perspective: none !important;
    background:
      radial-gradient(circle at top, rgba(0, 210, 255, 0.10), transparent 35%),
      #05070d !important;
  }

  .hero::before,
  .hero-section::before,
  .main-hero::before,
  .landing-hero::before {
    display: none !important;
  }

  .card,
  .service-card,
  .portfolio-item,
  .project-card,
  .feature-card,
  .about-card,
  .pricing-card,
  .contact-card,
  .premium-tilt,
  .hero-copy,
  .hero-visual-shell,
  .hero-visual-main,
  .simple-photo-story-visual,
  .portfolio-visual {
    transform: none !important;
    will-change: auto !important;
    backdrop-filter: blur(8px);
  }

  .premium-tilt::after,
  .hero-visual-main::before,
  .simple-photo-story-visual::before,
  .portfolio-visual::before {
    display: none !important;
  }

  .card:hover,
  .service-card:hover,
  .portfolio-item:hover,
  .project-card:hover,
  .feature-card:hover,
  .about-card:hover,
  .pricing-card:hover,
  .contact-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 35px rgba(0,0,0,0.35) !important;
  }

  .card > *,
  .service-card > *,
  .portfolio-item > *,
  .project-card > *,
  .feature-card > * {
    transform: none !important;
  }

  button:hover,
  .btn:hover,
  .cta:hover,
  .cta-button:hover,
  .submit-btn:hover,
  input[type="submit"]:hover,
  a.button:hover {
    transform: translateY(-2px) !important;
  }

  img,
  .portfolio-item img,
  .project-card img,
  .hero-visual-main img,
  .simple-photo-story-visual img,
  .portfolio-visual img {
    transform: none !important;
  }

  .home-page [data-reveal] {
    filter: none !important;
    clip-path: none !important;
  }
}