*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  :root {
    color-scheme: light;
    --c-base:          #f5f5f5;
    --c-surface-1:     #ffffff;
    --c-surface-2:     #ffffff;
    --c-surface-3:     #f0f0f0;
    --c-hover:         #e8e8e8;
    --c-selected:      #dce9f7;
    --c-border:        #e0e0e0;
    --c-border-strong: #c8c8c8;
    --c-text-1:        #1a1a1a;
    --c-text-2:        #1a1a1a;
    --c-text-3:        #707070;
    --c-accent:        #0078d4;
    --c-accent-hover:  #006cbe;
    --c-accent-soft:   rgba(0,120,212,0.09);
    --c-accent-glow:   rgba(0,120,212,0.16);
    --c-shadow-sm:     0 1px 2px rgba(0,0,0,0.06);
    --c-shadow-md:     0 2px 8px rgba(0,0,0,0.08);
    --c-shadow-lg:     0 8px 32px rgba(0,0,0,0.12);
    --f-sans: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    --f-mono: "SF Mono","Cascadia Code","Consolas","Menlo",monospace;
  }

  @media (prefers-color-scheme: dark) {
    :root {
      color-scheme: dark;
      --c-base:          #2b2b2b;
      --c-surface-1:     #323232;
      --c-surface-2:     #3d3d3d;
      --c-surface-3:     #444444;
      --c-hover:         #4a4a4a;
      --c-selected:      #2d4a6e;
      --c-border:        rgba(255,255,255,0.08);
      --c-border-strong: rgba(255,255,255,0.14);
      --c-text-1:        #ffffff;
      --c-text-2:        #ffffff;
      --c-text-3:        #888888;
      --c-accent:        #4da3f5;
      --c-accent-hover:  #62b0f7;
      --c-accent-soft:   rgba(77,163,245,0.14);
      --c-accent-glow:   rgba(77,163,245,0.22);
      --c-shadow-sm:     0 1px 2px rgba(0,0,0,0.25);
      --c-shadow-md:     0 2px 8px rgba(0,0,0,0.35);
      --c-shadow-lg:     0 8px 32px rgba(0,0,0,0.45);
    }
  }

  html { scroll-behavior: smooth; }
  body { font-family: var(--f-sans); background: var(--c-base); color: var(--c-text-1); overflow-x: hidden; line-height: 1.6; -webkit-font-smoothing: antialiased; }
  ::-webkit-scrollbar { width: 4px; }
  ::-webkit-scrollbar-track { background: transparent; }
  ::-webkit-scrollbar-thumb { background: var(--c-border-strong); border-radius: 999px; }

  /* ─── GRID BG ──────────────────────────────────── */
  .grid-bg {
    position: absolute; inset: 0;
    background-image: linear-gradient(var(--c-border) 1px,transparent 1px), linear-gradient(90deg,var(--c-border) 1px,transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(ellipse 80% 55% at 50% 0%,black 20%,transparent 72%);
    pointer-events: none; opacity: .65;
  }

  /* ─── NAV ──────────────────────────────────────── */
  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    padding: 0 max(32px,5vw); height: 64px;
    display: flex; align-items: center; justify-content: space-between;
    background: var(--c-surface-1); border-bottom: 1px solid var(--c-border);
    box-shadow: var(--c-shadow-sm); transition: box-shadow .2s;
  }
  .nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--c-text-1); }
  .nav-logo-mark { width:30px; height:30px; background:var(--c-accent); border-radius:7px; display:grid; place-items:center; position:relative; overflow:hidden; flex-shrink:0; }
  .nav-logo-mark::before { content:''; position:absolute; width:16px; height:16px; border:2px solid rgba(255,255,255,.9); border-radius:3px; }
  .nav-logo-mark::after  { content:''; position:absolute; width:6px; height:6px; background:rgba(255,255,255,.9); border-radius:1px; }
  .nav-logo span { font-size:15px; font-weight:700; letter-spacing:-.01em; }
  .nav-links { display:flex; gap:28px; list-style:none; }
  .nav-links a { color:var(--c-text-3); text-decoration:none; font-size:13px; font-weight:500; transition:color .15s; }
  .nav-links a:hover { color:var(--c-accent); }
  .nav-right { display:flex; gap:10px; align-items:center; }
  .btn-ghost { padding:7px 18px; font-family:var(--f-sans); font-size:13px; font-weight:500; color:var(--c-text-3); background:transparent; border:1px solid var(--c-border-strong); border-radius:6px; cursor:pointer; text-decoration:none; transition:all .15s; }
  .btn-ghost:hover { color:var(--c-text-1); background:var(--c-hover); }
  .btn-primary { padding:8px 20px; font-family:var(--f-sans); font-size:13px; font-weight:600; color:#fff; background:var(--c-accent); border:none; border-radius:6px; cursor:pointer; text-decoration:none; transition:all .15s; }
  .btn-primary:hover { background:var(--c-accent-hover); box-shadow:0 4px 14px var(--c-accent-glow); transform:translateY(-1px); }

  /* ─── HERO ─────────────────────────────────────── */
  .hero {
    position:relative; min-height:100svh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; padding:120px max(32px,8vw) 100px;
    overflow:hidden; background:var(--c-surface-1);
  }
  .hero-glow { position:absolute; top:-15%; left:50%; transform:translateX(-50%); width:1000px; height:600px; background:radial-gradient(ellipse at 50% 30%,var(--c-accent-glow) 0%,transparent 65%); pointer-events:none; }

  .hero-badge {
    display:inline-flex; align-items:center; gap:8px;
    padding:6px 16px; background:var(--c-accent-soft);
    border:1px solid var(--c-accent); border-radius:100px;
    font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
    color:var(--c-accent); margin-bottom:40px; animation:fadeUp .6s ease both;
  }
  .badge-dot { width:6px; height:6px; background:var(--c-accent); border-radius:50%; animation:pulse 2s ease-in-out infinite; }
  @keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(1.5)} }

  .hero h1 {
    font-size:clamp(48px,7vw,88px); font-weight:800;
    line-height:1.05; letter-spacing:-.035em;
    max-width:900px; margin-bottom:28px; color:var(--c-text-1);
    animation:fadeUp .75s .1s ease both;
  }
  .hero h1 .accent { color:var(--c-accent); }

  .hero-sub { font-size:clamp(16px,2vw,20px); color:var(--c-text-3); max-width:560px; line-height:1.7; margin-bottom:52px; animation:fadeUp .75s .2s ease both; font-weight:400; }

  .hero-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:72px; animation:fadeUp .75s .3s ease both; }
  .btn-hero { padding:14px 32px; font-family:var(--f-sans); font-size:15px; font-weight:700; color:#fff; background:var(--c-accent); border:none; border-radius:8px; cursor:pointer; text-decoration:none; transition:all .2s; display:inline-flex; align-items:center; gap:8px; }
  .btn-hero:hover { background:var(--c-accent-hover); box-shadow:0 10px 32px var(--c-accent-glow); transform:translateY(-2px); }
  .btn-hero-ghost { padding:14px 32px; font-family:var(--f-sans); font-size:15px; font-weight:600; color:var(--c-text-1); background:var(--c-surface-3); border:1px solid var(--c-border-strong); border-radius:8px; cursor:pointer; text-decoration:none; transition:all .2s; }
  .btn-hero-ghost:hover { background:var(--c-hover); }

  .hero-trust { display:flex; align-items:center; gap:22px; justify-content:center; animation:fadeUp .75s .4s ease both; flex-wrap:wrap; }
  .trust-item { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--c-text-3); font-weight:500; }
  .trust-icon { width:14px; height:14px; stroke:var(--c-accent); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
  .trust-sep { width:1px; height:16px; background:var(--c-border-strong); }

  .scroll-hint { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; animation:fadeUp 1s .7s ease both; }
  .scroll-hint span { font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--c-text-3); font-weight:500; }
  .scroll-line { width:1px; height:40px; background:linear-gradient(var(--c-accent),transparent); animation:scrollLine 1.6s ease-in-out infinite; }
  @keyframes scrollLine { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 50.01%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

  /* ─── STATS BAR ─────────────────────────────────── */
  .stats-bar { border-top:1px solid var(--c-border); border-bottom:1px solid var(--c-border); background:var(--c-surface-1); box-shadow:var(--c-shadow-sm); padding:0 max(32px,5vw); display:grid; grid-template-columns:repeat(4,1fr); }
  .stat { padding:40px 24px; text-align:center; border-right:1px solid var(--c-border); }
  .stat:last-child { border-right:none; }
  .stat-num { font-family:var(--f-mono); font-size:42px; font-weight:500; color:var(--c-text-1); line-height:1; margin-bottom:10px; display:block; letter-spacing:-.02em; }
  .stat-num span { color:var(--c-accent); }
  .stat-label { font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--c-text-3); font-weight:600; }

  /* ─── SHARED SECTION ────────────────────────────── */
  .s { position:relative; z-index:1; padding:120px max(32px,8vw); }

  .section-label { display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--c-accent); margin-bottom:20px; }
  .section-label::before { content:''; width:24px; height:1px; background:var(--c-accent); }

  h2.display { font-size:clamp(36px,5vw,64px); font-weight:800; line-height:1.06; letter-spacing:-.03em; margin-bottom:20px; color:var(--c-text-1); }
  h2.display .accent { color:var(--c-accent); }

  .section-intro { font-size:17px; color:var(--c-text-3); max-width:560px; line-height:1.75; margin-bottom:72px; font-weight:400; }

  /* ─── FEATURES ──────────────────────────────────── */
  #features {
    max-width: 1280px;
    margin: auto;
  }
  .features-section { background:var(--c-base); }
  .features-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1px; background:var(--c-border); border:1px solid var(--c-border); border-radius:14px; overflow:hidden; box-shadow:var(--c-shadow-md); }
  .feature-card { background:var(--c-surface-1); padding:40px 36px; transition:background .15s; }
  .feature-card:hover { background:var(--c-selected); }
  .feature-icon { width:44px; height:44px; margin-bottom:24px; display:grid; place-items:center; border-radius:10px; background:var(--c-accent-soft); border:1px solid var(--c-accent); }
  .feature-icon svg { width:20px; height:20px; stroke:var(--c-accent); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
  .feature-card h3 { font-size:15px; font-weight:700; margin-bottom:12px; color:var(--c-text-1); letter-spacing:-.01em; }
  .feature-card p  { font-size:14px; color:var(--c-text-3); line-height:1.7; }

  /* ─── SECURITY HIGHLIGHT ────────────────────────── */
  .highlight-section { background:var(--c-surface-1); border-top:1px solid var(--c-border); border-bottom:1px solid var(--c-border); }
  .highlight-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; max-width:1200px; margin:0 auto; }
  .highlight-content h2 { font-size:clamp(32px,4vw,52px); font-weight:800; line-height:1.1; letter-spacing:-.03em; margin-bottom:22px; color:var(--c-text-1); }
  .highlight-content h2 .accent { color:var(--c-accent); }
  .highlight-content > p { font-size:16px; color:var(--c-text-3); line-height:1.75; margin-bottom:14px; }
  .principle-list { list-style:none; margin-top:32px; display:flex; flex-direction:column; gap:10px; }
  .principle-list li { display:flex; gap:16px; align-items:flex-start; padding:18px 20px; background:var(--c-surface-3); border:1px solid var(--c-border); border-radius:10px; transition:all .15s; }
  .principle-list li:hover { background:var(--c-selected); border-color:var(--c-accent); }
  .principle-num { font-family:var(--f-mono); font-size:11px; font-weight:600; color:var(--c-accent); padding-top:2px; flex-shrink:0; letter-spacing:.04em; }
  .principle-list li p { font-size:14px; color:var(--c-text-3); line-height:1.65; margin:0; }
  .principle-list li strong { display:block; font-size:14px; font-weight:700; color:var(--c-text-1); margin-bottom:4px; letter-spacing:-.01em; }

  /* Security Diagram */
  .diagram-card { background:var(--c-surface-2); border:1px solid var(--c-border); border-radius:14px; padding:32px; position:relative; overflow:hidden; box-shadow:var(--c-shadow-md); }
  .diagram-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--c-accent); }
  .diagram-header { display:flex; align-items:center; gap:5px; margin-bottom:26px; padding-bottom:16px; border-bottom:1px solid var(--c-border); }
  .diagram-dot { width:8px; height:8px; border-radius:50%; }
  .diagram-title { font-family:var(--f-mono); font-size:11px; color:var(--c-text-3); letter-spacing:.08em; text-transform:uppercase; margin-left:8px; }
  .diagram-flow { display:flex; flex-direction:column; gap:8px; }
  .flow-step { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:8px; border:1px solid var(--c-border); background:var(--c-surface-3); font-size:14px; color:var(--c-text-2); }
  .flow-step.hi { border-color:rgba(0,120,212,.3); background:var(--c-selected); }
  @media (prefers-color-scheme:dark) { .flow-step.hi { border-color:rgba(77,163,245,.3); } }
  .flow-badge { font-family:var(--f-mono); font-size:10px; font-weight:700; padding:3px 10px; border-radius:4px; letter-spacing:.06em; flex-shrink:0; }
  .fb-accent  { background:var(--c-accent-soft); color:var(--c-accent); border:1px solid var(--c-accent); }
  .fb-neutral { background:var(--c-surface-3); color:var(--c-text-3); border:1px solid var(--c-border-strong); }
  .flow-label { color:var(--c-text-3); flex:1; font-size:13px; }
  .flow-arrow { text-align:left; padding-left:14px; color:var(--c-accent); font-size:12px; opacity:.55; }
  .server-note { margin-top:20px; padding:14px 16px; border:1px dashed var(--c-border-strong); border-radius:8px; font-family:var(--f-mono); font-size:11px; color:var(--c-text-3); line-height:1.7; background:var(--c-surface-3); }
  .server-note strong { color:var(--c-accent); font-weight:600; }

  /* ─── COMPARISON ────────────────────────────────── */
  .comparison-section { background:var(--c-base); }
  .compare-wrapper { overflow-x:auto; }
  .compare-table { width:100%; border-collapse:collapse; min-width:640px; border:1px solid var(--c-border); border-radius:14px; overflow:hidden; box-shadow:var(--c-shadow-md); }
  .compare-table thead tr { background:var(--c-surface-3); border-bottom:2px solid var(--c-border); }
  .compare-table th { padding:18px 22px; text-align:left; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--c-text-3); }
  .compare-table th.hc { color:var(--c-accent); background:var(--c-accent-soft); border-top:3px solid var(--c-accent); }
  .col-brand-name    { font-size:15px; font-weight:700; color:var(--c-text-1); letter-spacing:-.01em; text-transform:none; display:block; margin-bottom:2px; }
  .col-brand-name.ac { color:var(--c-accent); }
  .col-brand-sub     { font-size:10px; color:var(--c-text-3); letter-spacing:.08em; font-weight:600; display:block; text-transform:uppercase; }
  .compare-table td { padding:16px 22px; font-size:14px; color:var(--c-text-3); border-bottom:1px solid var(--c-border); vertical-align:middle; background:var(--c-surface-1); }
  .compare-table tbody tr:last-child td { border-bottom:none; }
  .compare-table tbody tr:hover td { background:var(--c-hover); }
  .compare-table td.fn { color:var(--c-text-1); font-weight:600; font-size:14px; letter-spacing:-.01em; }
  .compare-table td.hc { background:var(--c-accent-soft); border-left:1px solid rgba(0,120,212,.15); border-right:1px solid rgba(0,120,212,.15); color:var(--c-text-1); }
  .compare-table tbody tr:hover td.hc { background:var(--c-selected); }
  .ck { color:#107c10; font-size:14px; font-weight:700; }
  .pt { color:#ca6a00; font-size:13px; font-weight:600; }
  .cx { color:var(--c-text-3); font-size:18px; font-weight:300; }
  @media (prefers-color-scheme:dark) { .ck { color:#4ec94e; } .pt { color:#e8a045; } }

  /* ─── USE CASES ─────────────────────────────────── */
  .usecases-section { background:var(--c-surface-1); border-top:1px solid var(--c-border); border-bottom:1px solid var(--c-border); }
  .usecase-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .usecase-card { padding:36px 32px; background:var(--c-surface-3); border:1px solid var(--c-border); border-radius:12px; transition:all .2s; position:relative; overflow:hidden; }
  .usecase-card::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--c-accent); transform:scaleX(0); transform-origin:left; transition:transform .28s; }
  .usecase-card:hover::after { transform:scaleX(1); }
  .usecase-card:hover { border-color:var(--c-accent); background:var(--c-selected); box-shadow:var(--c-shadow-md); transform:translateY(-3px); }
  .usecase-num { font-family:var(--f-mono); font-size:10px; font-weight:700; color:var(--c-accent); letter-spacing:.12em; margin-bottom:14px; display:block; text-transform:uppercase; }
  .usecase-card h3 { font-size:19px; font-weight:700; margin-bottom:12px; color:var(--c-text-1); line-height:1.25; letter-spacing:-.02em; }
  .usecase-card p  { font-size:14px; color:var(--c-text-3); line-height:1.7; }

  /* ─── PROCESS ───────────────────────────────────── */
  .process-section { background:var(--c-base); }
  .process-steps { display:grid; grid-template-columns:repeat(3,1fr); position:relative; gap:40px; }
  .process-steps::before { content:''; position:absolute; top:28px; left:18%; right:18%; height:1px; background:var(--c-border-strong); }
  .step-num { width:56px; height:56px; border-radius:50%; background:var(--c-surface-1); border:2px solid var(--c-accent); display:grid; place-items:center; font-family:var(--f-mono); font-size:14px; font-weight:700; color:var(--c-accent); margin-bottom:28px; position:relative; z-index:1; box-shadow:var(--c-shadow-sm); }
  .process-step h3 { font-size:17px; font-weight:700; margin-bottom:12px; color:var(--c-text-1); letter-spacing:-.015em; }
  .process-step p  { font-size:14px; color:var(--c-text-3); line-height:1.7; }
  .process-timeline { display:flex; align-items:center; gap:8px; margin-top:16px; font-size:12px; color:var(--c-text-3); font-weight:500; }
  .timeline-pill { padding:3px 12px; background:var(--c-accent-soft); border:1px solid var(--c-accent); border-radius:100px; font-size:11px; color:var(--c-accent); font-weight:700; letter-spacing:.03em; }

  /* ─── BETRIEB MODELLE ───────────────────────────── */
  .deploy-section { background:var(--c-surface-1); border-top:1px solid var(--c-border); border-bottom:1px solid var(--c-border); }
  .deploy-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--c-border); border:1px solid var(--c-border); border-radius:14px; overflow:hidden; box-shadow:var(--c-shadow-md); }
  .deploy-card { background:var(--c-surface-2); padding:48px 40px; }
  .deploy-card:hover { background:var(--c-selected); }
  .deploy-tag { display:inline-block; font-family:var(--f-mono); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:4px 12px; border-radius:100px; background:var(--c-accent-soft); color:var(--c-accent); border:1px solid var(--c-accent); margin-bottom:20px; }
  .deploy-card h3 { font-size:22px; font-weight:800; letter-spacing:-.025em; color:var(--c-text-1); margin-bottom:14px; }
  .deploy-card p { font-size:14px; color:var(--c-text-3); line-height:1.7; margin-bottom:24px; }
  .deploy-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
  .deploy-list li { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--c-text-2); }
  .deploy-list li::before { content:''; width:16px; height:16px; border-radius:50%; background:var(--c-accent-soft); border:1px solid var(--c-accent); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .deploy-check { width:16px; height:16px; border-radius:50%; background:var(--c-accent); display:grid; place-items:center; flex-shrink:0; }
  .deploy-check svg { width:9px; height:9px; stroke:#fff; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

  /* ─── SECURITY LEVELS ───────────────────────────── */
  .levels-section { background:var(--c-base); }
  .levels-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--c-border); border:1px solid var(--c-border); border-radius:14px; overflow:hidden; box-shadow:var(--c-shadow-md); }
  .level-card { background:var(--c-surface-1); padding:40px 36px; }
  .level-card:hover { background:var(--c-selected); }
  .level-badge { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 12px; border-radius:100px; margin-bottom:18px; }
  .lb-high { background:rgba(16,124,16,0.1); color:#107c10; border:1px solid rgba(16,124,16,0.3); }
  .lb-max  { background:var(--c-accent-soft); color:var(--c-accent); border:1px solid var(--c-accent); }
  @media (prefers-color-scheme:dark) { .lb-high { color:#4ec94e; border-color:rgba(78,201,78,0.3); background:rgba(78,201,78,0.1); } }
  .level-card h3 { font-size:18px; font-weight:700; letter-spacing:-.02em; color:var(--c-text-1); margin-bottom:10px; }
  .level-card p  { font-size:14px; color:var(--c-text-3); line-height:1.7; margin-bottom:20px; }
  .level-features { list-style:none; display:flex; flex-direction:column; gap:8px; }
  .level-features li { display:flex; align-items:flex-start; gap:9px; font-size:13px; color:var(--c-text-3); line-height:1.5; }
  .lf-dot { width:5px; height:5px; border-radius:50%; background:var(--c-accent); flex-shrink:0; margin-top:6px; }

  /* ─── CTA ───────────────────────────────────────── */
  .cta-section { background:var(--c-accent); text-align:center; }
  .cta-inner { max-width:720px; margin:0 auto; }
  .cta-section .section-label { color:rgba(255,255,255,.7); justify-content:center; margin-bottom:28px; }
  .cta-section .section-label::before { background:rgba(255,255,255,.45); }
  .cta-section h2 { font-size:clamp(40px,5.5vw,68px); font-weight:800; line-height:1.06; letter-spacing:-.03em; margin-bottom:22px; color:#fff; }
  .cta-section h2 .accent-soft { color:rgba(255,255,255,.8); }
  .cta-section > .cta-inner > p { font-size:17px; color:rgba(255,255,255,.8); line-height:1.7; margin-bottom:48px; }
  .cta-form { display:flex; gap:10px; max-width:460px; margin:0 auto 22px; }
  .cta-input { flex:1; padding:13px 18px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); border-radius:8px; font-family:var(--f-sans); font-size:14px; color:#fff; outline:none; transition:all .2s; }
  .cta-input::placeholder { color:rgba(255,255,255,.5); }
  .cta-input:focus { background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.65); }
  .btn-cta-white { padding:13px 28px; font-family:var(--f-sans); font-size:14px; font-weight:700; color:var(--c-accent); background:#fff; border:none; border-radius:8px; cursor:pointer; text-decoration:none; transition:all .2s; white-space:nowrap; }
  .btn-cta-white:hover { transform:translateY(-1px); box-shadow:0 8px 24px rgba(0,0,0,.2); }
  .cta-note { font-size:13px; color:rgba(255,255,255,.65); }
  .cta-note a { color:rgba(255,255,255,.9); text-decoration:none; }

  /* ─── FOOTER ────────────────────────────────────── */
  footer { padding:40px max(32px,5vw); border-top:1px solid var(--c-border); background:var(--c-surface-1); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
  .footer-copy { font-size:13px; color:var(--c-text-3); }
  .footer-links { display:flex; gap:24px; list-style:none; }
  .footer-links a { font-size:13px; color:var(--c-text-3); text-decoration:none; transition:color .15s; }
  .footer-links a:hover { color:var(--c-accent); }
  .footer-contact { font-size:13px; color:var(--c-text-3); display:flex; align-items:center; gap:7px; }
  .footer-contact a { color:var(--c-accent); text-decoration:none; }

  /* ─── ANIMATIONS ────────────────────────────────── */
  @keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
  .reveal { opacity:0; transform:translateY(28px); transition:opacity .65s ease,transform .65s ease; }
  .reveal.visible { opacity:1; transform:none; }

  /* ─── RESPONSIVE ────────────────────────────────── */
  @media (max-width:1024px) {
    .deploy-grid { grid-template-columns:1fr; }
    .levels-grid  { grid-template-columns:1fr; }
  }
  @media (max-width:900px) {
    .stats-bar { grid-template-columns:repeat(2,1fr); }
    .stat:nth-child(2) { border-right:none; }
    .stat:nth-child(3) { border-top:1px solid var(--c-border); }
    .highlight-inner { grid-template-columns:1fr; gap:48px; }
    .usecase-grid { grid-template-columns:1fr; }
    .process-steps { grid-template-columns:1fr; gap:0; }
    .process-steps::before { display:none; }
    .process-step { padding-bottom:36px; }
    .nav-links { display:none; }
  }
  @media (max-width:600px) {
    .cta-form { flex-direction:column; }
    .hero-actions { flex-direction:column; align-items:center; }
    footer { flex-direction:column; }
  }