/* ============================================================
   Lechler Corporate Theme
   Dark navy gradient · Lechler Blue #003D8F
   ============================================================ */

:root {
  /* --- Background --- */
  --bg-base: #060e1a;
  --bg-gradient: linear-gradient(135deg, #0a1225 0%, #0f2044 40%, #162d5a 100%);

  /* --- Brand palette --- */
  --brand: #003D8F;
  --brand-rgb: 0,61,143;
  --accent: #7eb3ff;
  --accent-rgb: 126,179,255;
  --teal: #00d4aa;
  --teal-rgb: 0,212,170;
  --amber: #fbbf24;
  --amber-rgb: 245,158,11;
  --red: #ef4444;
  --red-rgb: 239,68,68;
  --red-text: #fca5a5;
  --green: #10b981;
  --green-rgb: 16,185,129;
  --green-text: #6ee7b7;
  --purple: #8b5cf6;
  --purple-rgb: 139,92,246;
  --purple-text: #c4b5fd;
  --sky: #3b82f6;
  --sky-rgb: 59,130,246;
  --sky-text: #93c5fd;

  /* --- Text --- */
  --text-primary: #fff;
  --text-body: #c8d6e5;
  --text-secondary: #8aaed0;
  --text-muted: #5a7a9b;
  --text-heading: #fff;
  --text-h2: #7eb3ff;
  --text-h4: #8aaed0;

  /* --- Typography --- */
  --font-sans: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono: 'SF Mono', Monaco, 'Cascadia Code', monospace;
  --h1-size: 72px; --h1-weight: 700;
  --h2-size: 52px; --h2-weight: 600;
  --h3-size: 36px; --h3-weight: 600;
  --h4-size: 26px; --h4-weight: 500;
  --body-size: 28px;
  --small-size: 22px;

  /* --- Cards --- */
  --card-bg: rgba(255,255,255,.04);
  --card-border: rgba(255,255,255,.08);
  --card-radius: 16px;
  --card-glow-bg: rgba(0,61,143,.15);
  --card-glow-border: rgba(0,61,143,.35);
  --card-glow-shadow: 0 0 30px rgba(0,61,143,.15);
  --card-accent-bg: linear-gradient(135deg,rgba(0,61,143,.2),rgba(0,212,170,.08));
  --card-accent-border: rgba(126,179,255,.2);

  /* --- Badges --- */
  --badge-radius: 20px;
  --badge-blue-bg: rgba(0,61,143,.35);
  --badge-blue-text: #7eb3ff;
  --badge-blue-border: rgba(0,61,143,.5);
  --badge-teal-bg: rgba(0,212,170,.15);
  --badge-teal-text: #00d4aa;
  --badge-teal-border: rgba(0,212,170,.3);
  --badge-amber-bg: rgba(245,158,11,.15);
  --badge-amber-text: #fbbf24;
  --badge-amber-border: rgba(245,158,11,.3);
  --badge-red-bg: rgba(239,68,68,.15);
  --badge-red-text: #fca5a5;
  --badge-red-border: rgba(239,68,68,.3);

  /* --- Progress bar --- */
  --progress-height: 4px;
  --progress-bg: rgba(255,255,255,.06);
  --progress-fill: linear-gradient(90deg, #003D8F, #00d4aa);
  --progress-position: bottom;

  /* --- Step animation --- */
  --step-transform: translateY(28px);
  --step-duration: .65s;
  --step-easing: cubic-bezier(.22,.61,.36,1);
  --stagger-transform: translateY(20px);
  --stagger-duration: .55s;

  /* --- Divider --- */
  --divider-bg: linear-gradient(90deg,rgba(0,61,143,.6),rgba(0,61,143,0));

  /* --- Particles / Orbs --- */
  --particle-color: rgba(126,179,255,.4);
  --orb-1-color: rgba(0,61,143,.3);
  --orb-2-color: rgba(0,212,170,.18);
  --orb-3-color: rgba(99,102,241,.12);
  --orb-4-color: rgba(59,130,246,.15);

  /* --- Landing --- */
  --landing-title-gradient: linear-gradient(135deg, #7eb3ff, #00d4aa);
  --landing-btn-primary-bg: linear-gradient(135deg,rgba(0,61,143,.5),rgba(0,61,143,.3));
  --landing-btn-primary-border: rgba(0,61,143,.6);
  --landing-btn-primary-text: #7eb3ff;
  --landing-btn-hover-bg: linear-gradient(135deg,rgba(0,61,143,.7),rgba(0,61,143,.5));
  --landing-slide-num-bg: rgba(0,61,143,.25);
  --landing-slide-num-text: #7eb3ff;

  /* --- Timeline --- */
  --timeline-line: linear-gradient(180deg,#003D8F,rgba(0,61,143,.1));
  --timeline-dot-bg: #003D8F;
  --timeline-dot-border: #7eb3ff;
  --timeline-dot-shadow: 0 0 12px rgba(0,61,143,.5);
  --timeline-dot-radius: 50%;
  --timeline-dot-size: 16px;
  --timeline-highlight-bg: #00d4aa;
  --timeline-highlight-border: #00d4aa;
  --timeline-highlight-shadow: 0 0 16px rgba(0,212,170,.5);

  /* --- Icon circles --- */
  --icon-circle-bg: rgba(0,61,143,.25);
  --icon-circle-border: rgba(0,61,143,.4);

  /* --- Table --- */
  --table-header-color: #7eb3ff;
  --table-header-border: rgba(0,61,143,.4);
  --table-row-border: rgba(255,255,255,.06);
  --table-hover-bg: rgba(255,255,255,.02);

  /* --- Connector --- */
  --connector-c1: #003D8F;
  --connector-c2: #7eb3ff;

  /* --- Terminal --- */
  --terminal-bg: rgba(0,0,0,.45);
  --terminal-border: rgba(0,212,170,.2);
  --terminal-bar-bg: rgba(0,0,0,.3);
  --terminal-prompt: #00d4aa;

  /* --- Code block --- */
  --code-bg: rgba(0,0,0,.5);
  --code-border: rgba(126,179,255,.15);
  --code-header-bg: rgba(0,0,0,.3);
  --code-kw: #c4b5fd;
  --code-tbl: #fbbf24;
  --code-str: #6ee7b7;
  --code-fn: #7eb3ff;
  --code-cm: #5a7a9b;

  /* --- Browser mockup --- */
  --browser-bg: #1a1f2e;
  --browser-tab-bg: rgba(255,255,255,.03);
  --browser-tab-active-bg: #1a1f2e;

  /* --- Misc components --- */
  --phase-arrow-bg: rgba(0,61,143,.5);
  --phase-arrow-color: #7eb3ff;
  --insight-gradient: linear-gradient(180deg,#00d4aa,#7eb3ff);
  --hr-gradient: linear-gradient(90deg,#003d8f,rgba(0,61,143,.1));

  /* --- Charts --- */
  --chart-blue: #3b82f6;
  --chart-light-blue: #7eb3ff;
  --chart-navy: #003D8F;
  --chart-teal: #00d4aa;
  --chart-amber: #fbbf24;
  --chart-red: #ef4444;
  --chart-green: #10b981;
  --chart-purple: #8b5cf6;
  --chart-grid: rgba(255,255,255,.08);
  --chart-grid-text: #5a7a9b;

  /* --- Color utilities --- */
  --c-teal: #00d4aa; --bg-teal-u: rgba(0,212,170,.15); --b-teal-u: rgba(0,212,170,.3);
  --c-blue: #7eb3ff; --bg-blue-u: rgba(126,179,255,.15); --b-blue-u: rgba(126,179,255,.3);
  --c-amber: #fbbf24; --bg-amber-u: rgba(245,158,11,.15); --b-amber-u: rgba(245,158,11,.3);
  --c-purple: #c4b5fd; --bg-purple-u: rgba(139,92,246,.15); --b-purple-u: rgba(139,92,246,.3);
  --c-green: #6ee7b7; --bg-green-u: rgba(16,185,129,.15); --b-green-u: rgba(16,185,129,.3);
  --c-sky: #93c5fd; --bg-sky-u: rgba(59,130,246,.15); --b-sky-u: rgba(59,130,246,.3);
  --c-red: #fca5a5; --bg-red-u: rgba(239,68,68,.15); --b-red-u: rgba(239,68,68,.3);

  /* --- Watermark --- */
  --watermark-opacity: .45;

  /* --- Glow keyframe --- */
  --glow-color-1: rgba(0,61,143,.3);
  --glow-color-2: rgba(0,61,143,.5);

  /* --- MCP diagram --- */
  --mcp-host-bg: rgba(0,61,143,.3);
  --mcp-host-border: #003D8F;
  --mcp-host-color: #7eb3ff;
  --mcp-client-bg: rgba(126,179,255,.1);
  --mcp-client-border: rgba(126,179,255,.3);
  --mcp-server-bg: rgba(0,212,170,.1);
  --mcp-server-border: rgba(0,212,170,.3);
  --mcp-server-color: #00d4aa;
  --mcp-tool-bg: rgba(245,158,11,.1);
  --mcp-tool-border: rgba(245,158,11,.3);
  --mcp-tool-color: #fbbf24;

  /* --- SAP panel --- */
  --sap-bg: rgba(0,112,242,.06);
  --sap-border: rgba(0,112,242,.2);
  --sap-active: #fbbf24;
  --sap-done: #00d4aa;
}

/* --- Lechler-specific orb sizes / positions --- */
.slide.layout-title .orb-1{width:600px;height:600px;top:-150px;left:-100px;background:var(--orb-1-color);filter:blur(120px);animation:float 18s ease-in-out infinite}
.slide.layout-title .orb-2{width:450px;height:450px;bottom:-100px;right:-50px;background:var(--orb-2-color);filter:blur(100px);animation:float 22s ease-in-out infinite reverse}
.slide.layout-title .orb-3{width:350px;height:350px;top:80px;right:250px;background:var(--orb-3-color);filter:blur(100px);animation:float 15s ease-in-out infinite 3s}
.slide.layout-title .orb-4{width:280px;height:280px;bottom:180px;left:280px;background:var(--orb-4-color);filter:blur(90px);animation:float 20s ease-in-out infinite 5s}
.slide.layout-closing .orb-1{width:500px;height:500px;top:-100px;right:-50px;background:rgba(var(--brand-rgb),.25);filter:blur(120px);animation:float 20s ease-in-out infinite}
.slide.layout-closing .orb-2{width:400px;height:400px;bottom:-80px;left:-40px;background:rgba(var(--teal-rgb),.15);filter:blur(100px);animation:float 18s ease-in-out infinite reverse}

/* --- Lechler logo glow on title --- */
.slide.layout-title .logo-glow{filter:drop-shadow(0 0 24px rgba(var(--brand-rgb),.4))}