
    .material-symbols-outlined {
      font-family: 'Material Icons Outlined', sans-serif;
      font-style: normal; font-weight: normal; font-size: inherit;
      line-height: 1; letter-spacing: normal; text-transform: none;
      display: inline-block; white-space: nowrap; word-wrap: normal;
      direction: ltr; vertical-align: middle;
    }
    /* HERO */
    .hero {
      position: relative;
      min-height: calc(100vh - 88px);
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      text-align: center; padding: 80px 24px 60px; overflow: hidden;
    }
    #hero-canvas {
      position: absolute; inset: 0; width: 100%; height: 100%;
      pointer-events: none; z-index: 0;
    }

    .hero-content { position: relative; z-index: 2; max-width: 860px; }
    .hero-live-pill {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 5px 14px; border: 1px solid rgba(103,223,112,0.25);
      background: rgba(103,223,112,0.07); font-family: var(--font-mono);
      font-size: 10px; font-weight: 700; color: var(--primary);
      text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 28px;
    }
    .live-ping { position: relative; width: 8px; height: 8px; flex-shrink: 0; }
    .live-ping-outer {
      position: absolute; inset: 0; border-radius: 50%;
      background: var(--primary); opacity: 0.75;
      animation: ping 1.4s ease-in-out infinite;
    }
    .live-ping-inner { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
    @keyframes ping {
      0%   { transform: scale(1);   opacity: 0.75; }
      100% { transform: scale(2.2); opacity: 0; }
    }
    .hero-eyebrow {
      font-family: var(--font-mono); font-size: 10px; font-weight: 700;
      color: var(--primary); text-transform: uppercase; letter-spacing: 0.25em;
      margin-bottom: 20px; display: flex; align-items: center; justify-content: center; gap: 10px;
    }
    .hero-eyebrow::before, .hero-eyebrow::after {
      content: ''; width: 32px; height: 1px; background: var(--primary); opacity: 0.4;
    }
    .hero-title {
      font-family: var(--font-mono); font-size: clamp(48px, 9vw, 96px);
      font-weight: 700; color: var(--on-surface); letter-spacing: -0.05em;
      text-transform: uppercase; line-height: 0.92; margin-bottom: 10px;
      text-shadow: 0 0 40px rgba(103,223,112,0.15);
    }
    .hero-title .accent { color: var(--primary); }
    .hero-subtitle {
      font-family: var(--font-mono); font-size: clamp(14px, 2.5vw, 22px);
      font-weight: 400; color: var(--on-surface-muted); letter-spacing: -0.02em;
      text-transform: uppercase; margin-bottom: 28px;
    }
    .hero-desc {
      font-family: var(--font-sans); font-size: 15px; color: var(--on-surface-dim);
      max-width: 520px; margin: 0 auto 40px; line-height: 1.75;
    }
    .hero-ctas { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 40px; }
    .hero-features-list {
      display: flex; flex-wrap: wrap; gap: 24px;
      justify-content: center; margin-bottom: 56px;
    }
    .hero-feature-item {
      display: flex; align-items: center; gap: 7px;
      font-family: var(--font-mono); font-size: 10px;
      color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.08em;
    }
    .hero-feature-item .material-symbols-outlined { font-size: 14px; color: var(--primary); }
    .hero-stats { display: flex; gap: 48px; justify-content: center; flex-wrap: wrap; position: relative; z-index: 2; }
    .hero-stat { text-align: center; }
    .hero-stat-value { font-family: var(--font-mono); font-size: 36px; font-weight: 700; color: var(--primary); letter-spacing: -0.05em; line-height: 1; }
    .hero-stat-label { font-family: var(--font-mono); font-size: 9px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.12em; margin-top: 6px; }
    .hero-stat-divider { width: 1px; background: rgba(62,74,60,0.5); align-self: stretch; }
    .terminal-stream {
      position: absolute; bottom: 28px; left: 24px;
      font-family: var(--font-mono); font-size: 9px;
      color: rgba(103,223,112,0.22); text-align: left; line-height: 1.6;
      pointer-events: none; z-index: 2;
    }
    .terminal-stream .t-line { display: block; }
    .terminal-stream .blink { animation: blink 1s step-end infinite; color: rgba(103,223,112,0.45); }
    /* SECTION DIVIDER */
    .section-divider { border: none; border-top: 1px solid rgba(62,74,60,0.3); margin: 0; }
    /* FEATURE CARDS */
    .features-section { padding: 80px 24px; background: var(--surface-base); }
    .features-inner { max-width: 1200px; margin: 0 auto; }
    .features-heading { text-align: center; margin-bottom: 56px; }
    .features-eyebrow { font-family: var(--font-mono); font-size: 9px; font-weight: 700; color: var(--primary); text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 12px; }
    .features-title { font-family: var(--font-mono); font-size: clamp(22px, 4vw, 36px); font-weight: 700; color: var(--on-surface); letter-spacing: -0.04em; text-transform: uppercase; margin-bottom: 12px; }
    .features-sub { font-family: var(--font-sans); font-size: 13px; color: var(--on-surface-muted); max-width: 520px; margin: 0 auto; line-height: 1.65; }
    .feature-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .feature-card-glass {
      background: var(--surface-low); border: 1px solid rgba(62,74,60,0.35);
      padding: 32px 28px; transition: border-color 0.25s ease, background 0.25s ease;
    }
    .feature-card-glass:hover { border-color: rgba(103,223,112,0.4); background: var(--surface-container); }
    .feature-card-icon-wrap {
      width: 44px; height: 44px; background: rgba(103,223,112,0.08);
      border: 1px solid rgba(103,223,112,0.2); display: flex; align-items: center;
      justify-content: center; margin-bottom: 20px; transition: transform 0.25s ease;
    }
    .feature-card-glass:hover .feature-card-icon-wrap { transform: scale(1.1); }
    .feature-card-icon-wrap .material-symbols-outlined { font-size: 20px; color: var(--primary); }
    .feature-card-title { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--on-surface); text-transform: uppercase; letter-spacing: -0.02em; margin-bottom: 10px; }
    .feature-card-desc { font-family: var(--font-sans); font-size: 12px; color: var(--on-surface-muted); line-height: 1.65; }
    /* MOCKUP */
    .mockup-section { padding: 80px 24px; background: var(--surface); position: relative; }
    .mockup-inner { max-width: 1100px; margin: 0 auto; position: relative; }
    .mockup-glow {
      position: absolute; inset: -4px;
      background: linear-gradient(135deg, rgba(103,223,112,0.1), rgba(88,166,255,0.05));
      filter: blur(32px); opacity: 0.5; pointer-events: none;
    }
    .mockup-window { position: relative; background: var(--surface-low); border: 1px solid rgba(62,74,60,0.5); overflow: hidden; }
    .mockup-titlebar { background: var(--surface-high); border-bottom: 1px solid rgba(62,74,60,0.4); padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; }
    .mockup-dots { display: flex; gap: 6px; align-items: center; }
    .mockup-dot { width: 10px; height: 10px; border-radius: 50%; }
    .mockup-dot.red    { background: rgba(255,95,87,0.5); }
    .mockup-dot.yellow { background: rgba(255,189,46,0.5); }
    .mockup-dot.green  { background: rgba(103,223,112,0.5); }
    .mockup-titlebar-label { font-family: var(--font-mono); font-size: 10px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.06em; margin-left: 12px; }
    .mockup-body { display: grid; grid-template-columns: 1fr 280px; height: 320px; }
    .mockup-chart-panel { background: var(--surface-base); border-right: 1px solid rgba(62,74,60,0.3); padding: 16px; overflow: hidden; }
    .mockup-chart-label { font-family: var(--font-mono); font-size: 8px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 8px; }
    .mockup-chart-value { font-family: var(--font-mono); font-size: 22px; font-weight: 700; color: var(--primary); letter-spacing: -0.03em; margin-bottom: 12px; }
    .mockup-right { display: flex; flex-direction: column; }
    .mockup-log { flex: 1; background: var(--surface-container); border-bottom: 1px solid rgba(62,74,60,0.3); padding: 12px 14px; font-family: var(--font-mono); font-size: 9px; color: rgba(103,223,112,0.55); line-height: 1.8; overflow: hidden; }
    .mockup-log .dim { color: rgba(135,148,132,0.45); }
    .mockup-log .log-cursor { animation: blink 1s step-end infinite; }
    .mockup-table { flex: 1; background: var(--surface-low); padding: 10px 14px; }
    .mockup-table-header { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 8px; color: var(--on-surface-muted); text-transform: uppercase; padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid rgba(62,74,60,0.3); }
    .mockup-table-row { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 10px; padding: 4px 0; }
    .mockup-table-row .t { color: var(--primary); font-weight: 700; }
    .mockup-table-row .v { color: var(--on-surface); }
    .mockup-table-row .g { color: var(--primary); }
    .mockup-table-row .r { color: var(--tertiary); }
    /* SECTORS */
    .sectors-section { padding: 72px 24px; max-width: 1200px; margin: 0 auto; }
    .section-eyebrow { font-family: var(--font-mono); font-size: 9px; font-weight: 700; color: var(--primary); text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 10px; }
    .section-title { font-family: var(--font-mono); font-size: clamp(22px, 4vw, 36px); font-weight: 700; color: var(--on-surface); letter-spacing: -0.04em; text-transform: uppercase; margin-bottom: 36px; }
    .sectors-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px; background: rgba(62,74,60,0.3); }
    .sector-card { background: var(--surface-low); padding: 24px 16px; text-align: center; cursor: pointer; text-decoration: none; display: block; transition: background 0.05s; }
    .sector-card:hover { background: var(--surface-high); }
    .sector-card-icon { font-size: 22px; margin-bottom: 10px; display: block; }
    .sector-card-name { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 6px; }
    .sector-card-count { font-family: var(--font-mono); font-size: 18px; font-weight: 700; letter-spacing: -0.03em; }
    .sector-card-label { font-family: var(--font-mono); font-size: 8px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.08em; margin-top: 2px; }
    .sc-Defense       { --sc-color: var(--sector-defense-text); }
    .sc-Tech          { --sc-color: var(--sector-tech-text); }
    .sc-Manufacturing { --sc-color: var(--sector-manufacturing-text); }
    .sc-Construction  { --sc-color: var(--sector-construction-text); }
    .sc-Logistics     { --sc-color: var(--sector-logistics-text); }
    .sc-Farming       { --sc-color: var(--sector-farming-text); }
    .sector-card-name, .sector-card-count { color: var(--sc-color); }
    /* HOW IT WORKS */
    .how-section { padding: 72px 24px; max-width: 1200px; margin: 0 auto; }
    .steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(62,74,60,0.3); }
    .step-card { background: var(--surface-low); padding: 32px 28px; }
    .step-number { font-family: var(--font-mono); font-size: 48px; font-weight: 700; color: rgba(103,223,112,0.07); letter-spacing: -0.05em; line-height: 1; margin-bottom: 16px; user-select: none; }
    .step-icon { font-size: 20px; color: var(--primary); margin-bottom: 12px; }
    .step-title { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--on-surface); text-transform: uppercase; letter-spacing: -0.02em; margin-bottom: 10px; }
    .step-desc { font-family: var(--font-sans); font-size: 12px; color: var(--on-surface-muted); line-height: 1.65; }
    /* DATA SOURCES */
    .sources-band { background: var(--surface-low); border-top: 1px solid rgba(62,74,60,0.3); border-bottom: 1px solid rgba(62,74,60,0.3); padding: 40px 24px; }
    .sources-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 2fr; gap: 48px; align-items: center; }
    .sources-label { font-family: var(--font-mono); font-size: 9px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 8px; }
    .sources-title { font-family: var(--font-mono); font-size: 20px; font-weight: 700; color: var(--on-surface); text-transform: uppercase; letter-spacing: -0.03em; line-height: 1.2; }
    .source-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(62,74,60,0.3); }
    .source-card { background: var(--surface-base); padding: 20px; }
    .source-card-name { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--primary); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 6px; }
    .source-card-desc { font-family: var(--font-sans); font-size: 11px; color: var(--on-surface-muted); line-height: 1.55; }
    /* DISCLAIMER */
    .disclaimer-band { background: rgba(58,46,31,0.15); border-top: 1px solid rgba(210,153,34,0.15); border-bottom: 1px solid rgba(210,153,34,0.15); padding: 16px 24px; text-align: center; }
    .disclaimer-text { font-family: var(--font-mono); font-size: 9px; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.08em; max-width: 800px; margin: 0 auto; line-height: 1.7; }
    .disclaimer-text strong { color: var(--tertiary); font-weight: 700; }
    /* RESPONSIVE */
    @media (max-width: 1024px) {
      .sectors-grid { grid-template-columns: repeat(3, 1fr); }
      .steps-grid { grid-template-columns: 1fr; }
      .sources-inner { grid-template-columns: 1fr; gap: 24px; }
      .source-cards { grid-template-columns: 1fr; }
      .feature-cards-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
      .mockup-body { grid-template-columns: 1fr; height: auto; }
      .mockup-chart-panel { height: 220px; border-right: none; border-bottom: 1px solid rgba(62,74,60,0.3); }
      .mockup-right { flex-direction: row; }
      .mockup-log, .mockup-table { flex: 1; }
    }
    @media (max-width: 640px) {
      .sectors-grid { grid-template-columns: repeat(2, 1fr); }
      .hero-stats { gap: 28px; }
      .hero-stat-divider { display: none; }
      .feature-cards-grid { grid-template-columns: 1fr; }
      .mockup-right { flex-direction: column; }
    }

    /* ── Hamburger ─────────────────────────────────────────── */
    .hamburger {
      display: none;
      flex-direction: column;
      gap: 4px;
      cursor: pointer;
      padding: 8px;
      background: transparent;
      border: none;
      margin-left: 4px;
      flex-shrink: 0;
    }
    .hamburger span { display: block; width: 20px; height: 2px; background: var(--on-surface-muted); transition: all 150ms ease; }

    @media (max-width: 768px) {
      .site-nav {
        display: none;
        position: absolute;
        top: 56px; left: 0; right: 0;
        background: var(--surface);
        border-bottom: 1px solid rgba(62,74,60,0.3);
        flex-direction: column;
        padding: 8px 0; gap: 0; z-index: 99;
      }
      .site-nav.open { display: flex; }
      .nav-link { padding: 12px 24px; width: 100%; border-bottom: 1px solid rgba(62,74,60,0.15); min-height: 44px; display: flex; align-items: center; }
      .hamburger { display: flex; }
      #auth-link { display: none; }
    }
    @media (min-width: 769px) { .hamburger { display: none; } }
  