body {
      box-sizing: border-box;
    }
    * {
      font-family: 'Poppins', sans-serif;
    }
    html, body {
      height: 100%;
      overflow: hidden;
    }
    #app-wrapper {
      height: 100%;
      overflow-y: auto;
      scroll-behavior: smooth;
    }
    .gradient-hero {
      background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #1e3a5f 100%);
    }
    .gradient-light {
      background: linear-gradient(135deg, #f0f9ff 0%, #f5f3ff 100%);
    }
    .glass-card {
      background: rgba(255, 255, 255, 0.7);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255, 255, 255, 0.2);
    }
    .gradient-text {
      background: linear-gradient(to right, #0369a1, #16a34a);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .glow-button {
      box-shadow: 0 0 30px rgba(22, 163, 74, 0.3);
      transition: all 0.3s ease;
    }
    .glow-button:hover {
      box-shadow: 0 0 50px rgba(22, 163, 74, 0.5);
      transform: translateY(-2px);
    }
    .fade-in {
      animation: fadeInUp 0.8s ease-out forwards;
      opacity: 0;
    }
    @keyframes fadeInUp {
      from {
        transform: translateY(30px);
        opacity: 0;
      }
      to {
        transform: translateY(0);
        opacity: 1;
      }
    }
    .delay-1 { animation-delay: 0.1s; }
    .delay-2 { animation-delay: 0.2s; }
    .delay-3 { animation-delay: 0.3s; }
    .delay-4 { animation-delay: 0.4s; }
    .delay-5 { animation-delay: 0.5s; }
    .nav-active {
      color: #16a34a;
      border-bottom: 2px solid #16a34a;
    }
    .page-section {
      display: none;
    }
    .page-section.active {
      display: block;
    }
    .service-card {
      transition: all 0.3s ease;
    }
    .service-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 20px 40px rgba(22, 163, 74, 0.15);
    }
    .testimonial-card {
      transition: all 0.3s ease;
    }
    .testimonial-card:hover {
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
    }
    .portfolio-card {
      transition: all 0.3s ease;
    }
    .portfolio-card:hover {
      transform: scale(1.02);
    }
    .accordion-content {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease;
    }
    .accordion-content.active {
      max-height: 500px;
    }
    .pricing-tier {
      transition: all 0.3s ease;
      border: 2px solid transparent;
    }
    .pricing-tier:hover {
      border-color: #16a34a;
      transform: translateY(-4px);
    }
    .mobile-menu-animation {
      transition: max-height 0.3s ease-in-out;
    }
    /* Icon animations */
    .icon-animate {
      animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(-10px); }
    }
    @view-transition 
    { 
      navigation: auto; 
    }