html {
        scroll-behavior: smooth;
      }
      body {
        background-color: #020408;
        color: #e2e8f0;
        overflow-x: hidden;
      }

      /* Reduced Motion Fallback */
      @media (prefers-reduced-motion: reduce) {
        *,
        ::before,
        ::after {
          animation-duration: 0.01ms !important;
          animation-iteration-count: 1 !important;
          transition-duration: 0.01ms !important;
          scroll-behavior: auto !important;
        }
        .animate-diagonal-drift,
        .animate-pulse-slow {
          animation: none !important;
        }
      }

      .will-change-transform {
        will-change: transform;
      }

      /* Grid Background Pattern */
      .bg-grid {
        background-size: 50px 50px;
        background-image:
          linear-gradient(
            to right,
            rgba(255, 255, 255, 0.03) 1px,
            transparent 1px
          ),
          linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.03) 1px,
            transparent 1px
          );
      }

      /* Premium Glassmorphism Cards */
      .hud-card {
        background: rgba(10, 20, 35, 0.4);
        backdrop-filter: blur(16px) saturate(120%);
        -webkit-backdrop-filter: blur(16px) saturate(120%);
        border: 1px solid rgba(255, 255, 255, 0.08);
        position: relative;
        overflow: hidden;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      }
      .hud-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(
          800px circle at var(--mouse-x, 0) var(--mouse-y, 0),
          rgba(0, 243, 255, 0.08),
          transparent 40%
        );
        opacity: 0;
        transition: opacity 0.5s;
        z-index: 0;
        pointer-events: none;
      }
      .hud-card:hover::before {
        opacity: 1;
      }
      .hud-card:hover {
        border-color: rgba(0, 243, 255, 0.3);
        box-shadow: 0 10px 40px -10px rgba(0, 243, 255, 0.1);
        transform: translateY(-4px);
      }

      .text-glow {
        text-shadow: 0 0 20px rgba(0, 243, 255, 0.6);
      }
      .text-gradient {
        background: linear-gradient(135deg, #ffffff 0%, #00f3ff 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      }

      /* Animations */
      .reveal {
        opacity: 0;
        transform: translateY(40px);
      }
      .reveal.active {
        opacity: 1;
        transform: translateY(0);
        transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
      }
      .stagger-1 {
        transition-delay: 100ms;
      }
      .stagger-2 {
        transition-delay: 200ms;
      }
      .stagger-3 {
        transition-delay: 300ms;
      }

      .btn-primary {
        background: linear-gradient(90deg, #00f3ff 0%, #00a3ff 100%);
        color: #020408;
        transition: all 0.3s ease;
      }
      .btn-primary:hover {
        box-shadow: 0 0 25px rgba(0, 243, 255, 0.5);
        transform: scale(1.05);
      }

      .ticker-container {
        display: flex;
        width: 200%;
      }
      .ticker-wrapper:hover .ticker-container {
        animation-play-state: paused;
      }

      /* Custom Form Elements */
      .custom-input {
        background-color: #080a10;
        border: 1px solid #1e293b;
        color: #f8fafc;
        transition: all 0.3s ease;
      }
      .custom-input:focus {
        border-color: #00f3ff;
        outline: none;
        box-shadow: 0 0 10px rgba(0, 243, 255, 0.2);
      }
      .custom-checkbox {
        appearance: none;
        background-color: #080a10;
        border: 1px solid #1e293b;
        width: 1.25rem;
        height: 1.25rem;
        border-radius: 0.25rem;
        display: inline-grid;
        place-content: center;
        cursor: pointer;
        transition: all 0.2s ease;
      }
      .custom-checkbox::before {
        content: "";
        width: 0.65em;
        height: 0.65em;
        transform: scale(0);
        transition: 120ms transform ease-in-out;
        box-shadow: inset 1em 1em #00f3ff;
        background-color: #00f3ff;
        transform-origin: center;
        clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
      }
      .custom-checkbox:checked::before {
        transform: scale(1);
      }
      .custom-checkbox:checked {
        border-color: #00f3ff;
        background-color: rgba(0, 243, 255, 0.1);
      }

      .timeline-box {
        background: rgba(11, 18, 33, 0.8);
        border-width: 1px;
        transition: all 0.3s ease;
      }
      .timeline-box:hover {
        transform: translateY(-4px);
      }

      .cap-node {
        transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      }
      .cap-node:hover {
        transform: translateY(-6px);
      }
      .animate-shimmer {
        animation: shimmer 2s infinite;
      }

      /* Nav — glass effect matching pen testing page */
      .glass {
        background: rgba(2, 4, 8, 0.85);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
      }
      .nav-link {
        color: rgba(156, 163, 175, 1);
        transition: color 0.2s;
      }
      .nav-link:hover {
        color: #fff;
      }

      /* Architecture Interactive Nodes */
      .platform-node {
        cursor: pointer;
        transition: all 0.3s ease;
      }
      .platform-node.active {
        border-color: rgba(0, 243, 255, 0.8) !important;
        background: rgba(0, 243, 255, 0.1) !important;
        box-shadow: 0 0 20px rgba(0, 243, 255, 0.2);
      }

      /* Animated Connector Stream */
      .stream-line {
        background: linear-gradient(
          90deg,
          transparent,
          rgba(0, 243, 255, 0.8),
          transparent
        );
        background-size: 200% 100%;
      }

      /* Workflow Data-Flow dot */
      @keyframes data-flow {
        0% {
          left: 0%;
          opacity: 0;
          transform: translateX(-100%);
        }
        10% {
          opacity: 1;
        }
        90% {
          opacity: 1;
        }
        100% {
          left: 100%;
          opacity: 0;
          transform: translateX(0%);
        }
      }
      .animate-data-flow {
        animation: data-flow 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
      }

.security-grid .wpcf7-checkbox {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 20px 32px;
}