@keyframes shine {
      0% { transform: translateX(-120%); }
      100% { transform: translateX(120%); }
    }

    @keyframes bob {
      0%,100% { transform: translateY(0) translateZ(90px); }
      50% { transform: translateY(-12px) translateZ(90px); }
    }

    @keyframes pulse {
      0% { box-shadow: 0 0 0 0 rgba(15,118,110,.26); }
      70% { box-shadow: 0 0 0 22px rgba(15,118,110,0); }
      100% { box-shadow: 0 0 0 0 rgba(15,118,110,0); }
    }

    @keyframes scan {
      from { transform: translateX(-100%); }
      to { transform: translateX(100%); }
    }

    @keyframes marquee {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    @keyframes floatBlob {
      0%,100% { transform: translate3d(0,0,0); }
      50% { transform: translate3d(-26px,18px,0); }
    }

    @media (max-width: 1100px) {
      .hero-grid,
      .feature-grid,
      .story-grid,
      .contact-grid,
      .footer-top {
        grid-template-columns: 1fr;
      }

      .stats,
      .products,
      .quotes {
        grid-template-columns: repeat(2, 1fr);
      }

      .section-head {
        flex-direction: column;
        align-items: start;
      }

      .footer-socials {
        grid-template-columns: repeat(2, minmax(130px, 1fr));
      }
    }

    @media (max-width: 768px) {
      .nav {
        flex-wrap: wrap;
        justify-content: center;
        padding: 14px 0;
      }

      .nav-links {
        flex-wrap: wrap;
        justify-content: center;
      }

      .hero {
        padding-top: 32px;
      }

      .hero h1 {
        max-width: none;
      }

      .visual {
        min-height: 480px;
      }

      .stage {
        width: 100%;
      }

      .floating {
        right: 0;
        width: min(200px, 54vw);
      }

      .mini {
        left: 0;
      }

      .stats,
      .products,
      .quotes,
      .pill-grid,
      .contact-form-row {
        grid-template-columns: 1fr;
      }

      .footer-socials {
        grid-template-columns: 1fr;
      }

      .footer-brand {
        grid-template-columns: 1fr;
      }

      .footer-logo {
        margin-left: 0;
        justify-content: start;
      }
    
        section-head-products {
        flex-direction: column;
        align-items: flex-start;
      }
    
      .lihat-semua-btn {
        margin-top: 8px;
      }
      
      .modal-platforms {
        grid-template-columns: 1fr;
      }
    
      .meta {
        align-items: flex-start;
        flex-direction: column;
      }
    }
    
    @media (max-width: 980px) {
      .page-hero-grid,
      .toolbar,
      .feature-grid,
      .story-grid,
      .contact-grid,
      .hero-grid,
      .footer-top {
        grid-template-columns: 1fr;
      }
    
      .products,
      .quotes,
      .stats {
        grid-template-columns: repeat(2, 1fr);
      }
    
      .nav-links,
      .footer-socials {
        display: none;
      }
    }
    
    @media (max-width: 640px) {
      .products,
      .quotes,
      .stats,
      .pill-grid,
      .contact-form-row,
      .modal-platforms {
        grid-template-columns: 1fr;
      }
    
      .page-hero {
        padding: 52px 0 20px;
      }
    
      .page-hero h1,
      .hero h1,
      .section-head h2,
      .contact-head h2 {
        max-width: 100%;
      }
    
      .meta,
      .footer-bottom,
      .hero-actions,
      .hero-meta,
      .section-head-products {
        flex-direction: column;
        align-items: flex-start;
      }
    }