site-header,
hero-section,
problem-section,
features-section,
demo-section,
how-it-works-section,
pricing-section,
security-section,
audience-section,
pilot-section,
site-footer { display: contents; }

:root {
      --navy-950: #061727;
      --navy-900: #0a2239;
      --navy-800: #123450;
      --blue-700: #075e9e;
      --blue-600: #0878c8;
      --blue-500: #1595dc;
      --cyan-400: #35c6d4;
      --mint-100: #dff8f0;
      --mint-500: #36b98c;
      --white: #ffffff;
      --gray-25: #fbfcfd;
      --gray-50: #f5f8fa;
      --gray-100: #edf2f5;
      --gray-200: #dbe5eb;
      --gray-500: #687b89;
      --gray-700: #3c5060;
      --text: #132c3f;
      --danger: #ba4f5e;
      --shadow-sm: 0 8px 24px rgba(9, 39, 61, .07);
      --shadow-lg: 0 24px 64px rgba(4, 28, 48, .14);
      --radius-sm: 12px;
      --radius-md: 20px;
      --radius-lg: 28px;
      --container: 1180px;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: 90px; }
    body {
      margin: 0;
      color: var(--text);
      background: var(--white);
      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }
    body.menu-open { overflow: hidden; }
    button, textarea, input { font: inherit; }
    button, a { -webkit-tap-highlight-color: transparent; }
    a { color: inherit; text-decoration: none; }
    img, svg { display: block; }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, h3 { color: var(--navy-950); line-height: 1.12; letter-spacing: -.03em; }
    h1 { font-size: clamp(2.8rem, 6vw, 5.35rem); margin-bottom: 1.4rem; }
    h2 { font-size: clamp(2rem, 4vw, 3.4rem); margin-bottom: 1rem; }
    h3 { font-size: 1.28rem; margin-bottom: .75rem; }
    p { color: var(--gray-700); }
    :focus-visible { outline: 3px solid rgba(21, 149, 220, .35); outline-offset: 3px; }

    .skip-link {
      position: fixed; left: 1rem; top: -5rem; z-index: 2000;
      padding: .7rem 1rem; color: var(--white); background: var(--navy-950); border-radius: 8px;
    }
    .skip-link:focus { top: 1rem; }
    .container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
    .section { padding: 110px 0; }
    .section--soft { background: var(--gray-50); }
    .section-head { max-width: 700px; margin-bottom: 48px; }
    .section-head.center { text-align: center; margin-inline: auto; }
    .eyebrow {
      display: inline-flex; align-items: center; gap: .55rem; margin-bottom: 1rem;
      color: var(--blue-700); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
    }
    .eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--cyan-400); }
    .lead { font-size: clamp(1.05rem, 2vw, 1.22rem); }
    .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
    .btn {
      display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
      min-height: 49px; padding: .78rem 1.2rem; border: 1px solid transparent; border-radius: 11px;
      font-weight: 750; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .btn:hover { transform: translateY(-2px); }
    .btn-primary { color: var(--white); background: var(--blue-600); box-shadow: 0 10px 24px rgba(8,120,200,.24); }
    .btn-primary:hover { background: var(--blue-700); box-shadow: 0 14px 28px rgba(8,120,200,.28); }
    .btn-secondary { color: var(--navy-900); background: var(--white); border-color: var(--gray-200); }
    .btn-secondary:hover { border-color: var(--blue-500); }
    .btn-light { color: var(--navy-950); background: var(--white); box-shadow: var(--shadow-sm); }