:root {
  --ae-red: #880103;
  --ae-red-bright: #CC0000;
  --ae-red-dim: rgba(136,1,3,0.15);
  --ae-red-glow: rgba(136,1,3,0.08);
  --ae-red-line: rgba(136,1,3,0.35);
  --bg: #FFFFFF;
  --bg-warm: #F5F5F7;
  --bg-alt: #EFEFEF;
  --bg-dark: #AEAEAE;
  --bg-dark-panel: #A6A6A6;
  --bg-dark-card: #B5B5B5;
  --bg-dark-hover: #C0C0C0;
  --text-primary: #1A1A1A;
  --text-secondary: #444444;
  --text-body: #555555;
  --text-muted: #888888;
  --text-light: #AAAAAA;
  --off-white: #F5F5F7;
  --white-hi: #FFFFFF;
  --body-light: #C4C0BA;
  --body-text-dark: #999590;
  --muted-dark: #777777;
  --rule: #E0DEDA;
  --rule-light: #ECEAE7;
  --dark-rule: rgba(0,0,0,0.1);
  --dim-rule: rgba(0,0,0,0.06);
  --hud-green: #3ECF8E;
  --status-green-light: #2D8A56;
  --sans: 'Archivo', -apple-system, sans-serif;
  --heading: 'Archivo', -apple-system, sans-serif;
  --heading-cond: 'Archivo Narrow', -apple-system, sans-serif;
  --mono: 'JetBrains Mono', monospace;
  --container: 1280px;
  --container-pad: 48px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { font-family: var(--sans); background: var(--bg); color: var(--text-primary); overflow-x: hidden; -webkit-font-smoothing: antialiased; position: relative; }
.site-grid { position: fixed; top: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 64px); max-width: 1300px; height: 100%; pointer-events: none; z-index: 0; border-left: 1px solid rgba(0,0,0,0.06); border-right: 1px solid rgba(0,0,0,0.06); overflow: hidden; }
.grid-zone { position: relative; }
.company-network { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 64px); max-width: 1300px; height: 100%; pointer-events: none; z-index: 0; overflow: hidden; }
.company-network svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; }
#about > .ctn { position: relative; z-index: 1; }
.site-grid svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.ctn { width: 100%; max-width: var(--container); margin: 0 auto; padding-left: var(--container-pad); padding-right: var(--container-pad); }

.data-ticker { background: #0A0A0A; padding: 18px 0; position: absolute; bottom: 0; left: 0; right: 0; z-index: 4; }
.data-ticker-inner { display: flex; align-items: center; justify-content: center; gap: 36px; font-family: var(--mono); font-size: 10px; color: rgba(255,255,255,0.35); letter-spacing: 1.5px; text-transform: uppercase; flex-wrap: wrap; }
.data-ticker-inner .num { color: rgba(255,255,255,0.7); font-weight: 500; }
.data-ticker-inner .sep { color: rgba(255,255,255,0.15); }
.data-ticker-inner .live { color: var(--hud-green); display: inline-flex; align-items: center; gap: 6px; }
.data-ticker-inner .live-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--hud-green); animation: tickerPulse 2s ease-in-out infinite; }
@keyframes tickerPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }

.rv { opacity: 0; transform: translateY(24px); transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1); }
.rv.v { opacity: 1; transform: translateY(0); }
.rv-d1 { transition-delay: 0.1s; }
.rv-d2 { transition-delay: 0.2s; }

nav { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 5000; height: 52px; width: calc(100% - 48px); max-width: var(--container); background: rgba(8,8,8,0.2); backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4); border: 1px solid rgba(255,255,255,0.06); border-top-color: rgba(255,255,255,0.1); border-radius: 18px; transition: background 0.5s, border-color 0.5s, box-shadow 0.5s; box-shadow: 0 4px 24px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.04); }
nav.nav-scrolled { background: rgba(255,255,255,0.25); backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4); border-color: rgba(0,0,0,0.04); border-top-color: rgba(255,255,255,0.5); box-shadow: 0 4px 24px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.4); }
.nav-inner { max-width: 100%; margin: 0 auto; padding: 0 24px; height: 100%; display: flex; align-items: center; justify-content: space-between; }
.nav-left { display: flex; align-items: center; gap: 0; text-decoration: none; }
.nav-logo-img { height: 32px; transition: opacity 0.3s; }
svg.nav-logo-img { height: 32px; width: auto; }
.nav-logo-white { display: block; }
.nav-logo-red { display: none; }
nav.nav-scrolled .nav-logo-white { display: none; }
nav.nav-scrolled .nav-logo-red { display: block; }
.nav-center { display: flex; gap: 32px; }
.nav-center a { font-family: var(--mono); font-size: 11px; font-weight: 400; color: rgba(255,255,255,0.7); text-decoration: none; letter-spacing: 1.5px; text-transform: uppercase; transition: color 0.2s; }
.nav-center a:hover { color: #FFFFFF; }
nav.nav-scrolled .nav-center a { color: var(--text-secondary); }
nav.nav-scrolled .nav-center a:hover { color: var(--ae-red); }
.nav-right a { font-family: var(--mono); font-size: 11px; font-weight: 500; color: rgba(255,255,255,0.8); text-decoration: none; letter-spacing: 1.5px; text-transform: uppercase; padding: 0 24px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.25); border-radius: 12px; transition: all 0.3s; }
.nav-right a:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.5); }
nav.nav-scrolled .nav-right a { color: var(--ae-red); border-color: var(--ae-red-line); }
nav.nav-scrolled .nav-right a:hover { background: var(--ae-red-dim); }

.nav-right .lang-en, .nav-right .lang-de { font-family: var(--mono); font-size: 11px; font-weight: 400; letter-spacing: 1px; padding: 0 24px; height: 36px; border: 1px solid rgba(255,255,255,0.2); border-radius: 12px; color: rgba(255,255,255,0.6); text-decoration: none; transition: all 0.2s; }
.nav-right .lang-en:hover, .nav-right .lang-de:hover { color: #FFFFFF; border-color: rgba(255,255,255,0.4); }
.nav-right .lang-en.active, .nav-right .lang-de.active { background: rgba(255,255,255,0.15); color: #FFFFFF; border-color: rgba(255,255,255,0.3); }
nav.nav-scrolled .nav-right .lang-en, nav.nav-scrolled .nav-right .lang-de { color: var(--text-muted); border-color: var(--rule); }
nav.nav-scrolled .nav-right .lang-en:hover, nav.nav-scrolled .nav-right .lang-de:hover { color: var(--ae-red); border-color: var(--ae-red-line); }
nav.nav-scrolled .nav-right .lang-en.active, nav.nav-scrolled .nav-right .lang-de.active { background: var(--ae-red-dim); color: var(--ae-red); border-color: var(--ae-red-line); }

.hero { padding: 0; display: flex; flex-direction: column; align-items: center; position: relative; overflow: hidden; background: #0A0A0A; min-height: 100vh; }
.hero::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 30% 50%, transparent 0%, rgba(0,0,0,0.4) 100%); pointer-events: none; z-index: 1; }
.hero-screenshot-wrap { width: 100%; height: 100vh; position: relative; overflow: hidden; }
.hero-screenshot-wrap svg, .hero-screenshot-wrap img, .hero-screenshot-wrap video { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0.28; }
.hero-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 3; max-width: var(--container); margin: 0 auto; padding: 0 var(--container-pad); text-align: center; }
.hero-headline { font-family: var(--heading); font-size: clamp(40px, 6vw, 80px); font-weight: 200; line-height: 1.05; letter-spacing: -3px; color: rgba(255,255,255,0.92); text-shadow: 0 2px 40px rgba(0,0,0,0.5); opacity: 0; animation: popIn 0.8s cubic-bezier(0.16,1,0.3,1) 0.2s forwards; }
.hero-headline strong { font-family: var(--heading-cond); font-weight: 600; letter-spacing: -1px; color: #FFFFFF; }
@keyframes popIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.hero-bottom { position: absolute; bottom: 56px; left: 0; right: 0; z-index: 3; padding: 0 0 48px; }
.hero-bottom .ctn { max-width: var(--container); margin: 0 auto; padding: 0 var(--container-pad); }
.hero-typed-lines { max-width: 900px; }
.hero-typed-line { font-family: var(--heading); font-size: clamp(20px, 2.5vw, 40px); font-weight: 200; line-height: 1.4; letter-spacing: -1.5px; color: rgba(255,255,255,0.85); display: block; min-height: 1.4em; white-space: nowrap; text-shadow: 0 2px 30px rgba(0,0,0,0.6); }
.hero-typed-line strong { font-family: var(--heading-cond); font-weight: 600; letter-spacing: -0.5px; color: #FFFFFF; }
.hero-typed-cursor { display: inline-block; width: 2px; height: 0.8em; background: rgba(255,255,255,0.7); margin-left: 3px; vertical-align: middle; animation: blink 0.6s step-end infinite; }
@keyframes blink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }
.hero-punchline { font-family: var(--heading); font-size: clamp(15px, 1.6vw, 19px); font-weight: 300; line-height: 1.5; color: rgba(255,255,255,0.6); letter-spacing: -0.1px; margin: 0 0 36px; max-width: 560px; }
.hero-punchline strong { font-family: var(--heading-cond); font-weight: 600; color: rgba(255,255,255,0.85); }
.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; justify-content: flex-start; }

.btn-a { display: inline-flex; align-items: center; gap: 8px; padding: 16px 40px; background: var(--ae-red); color: white; font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; border: none; border-radius: 12px; cursor: pointer; text-decoration: none; transition: all 0.2s; }
.btn-a:hover { background: #6B0102; }
.btn-b { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; background: transparent; color: #FFFFFF; font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; border: 1px solid rgba(255,255,255,0.4); border-radius: 12px; cursor: pointer; text-decoration: none; transition: all 0.2s; }
.btn-b:hover { border-color: #FFFFFF; background: rgba(255,255,255,0.08); }
.btn-a-light { display: inline-flex; align-items: center; gap: 8px; padding: 16px 40px; background: var(--ae-red); color: white; font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; border: none; border-radius: 12px; cursor: pointer; text-decoration: none; transition: all 0.2s; }
.btn-a-light:hover { background: #6B0102; }
.btn-b-light { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; background: transparent; color: var(--text-secondary); font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; border: 1px solid var(--rule); border-radius: 12px; cursor: pointer; text-decoration: none; transition: all 0.2s; }
.btn-b-light:hover { border-color: var(--ae-red); color: var(--ae-red); }

.wm-mission-section { background: transparent; padding: 100px 0; border-top: 1px solid var(--rule); }
.wm-mission-section .ctn { display: flex; flex-direction: column; align-items: center; }
.wm-mission { font-family: var(--heading); font-size: clamp(18px, 2vw, 24px); font-weight: 200; line-height: 1.6; color: var(--text-body); letter-spacing: -0.3px; max-width: 800px; text-align: center; }
.wm-mission strong { font-family: var(--heading-cond); font-weight: 600; color: var(--text-primary); }
.sec { padding: 140px 0; position: relative; }
.sec-label { font-family: var(--mono); font-size: 10px; font-weight: 400; letter-spacing: 3px; text-transform: uppercase; color: var(--ae-red-bright); margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.sec-label::before { display: none; }
.sec-h2 { font-family: var(--heading); font-size: clamp(22px, 2.6vw, 36px); font-weight: 200; line-height: 1.2; letter-spacing: -0.8px; color: var(--text-primary); max-width: 680px; margin-bottom: 20px; }
.sec-h2 strong { font-family: var(--heading-cond); font-weight: 600; letter-spacing: -0.3px; }
.sec-desc { font-size: 16px; line-height: 1.7; color: var(--text-body); max-width: 520px; margin-bottom: 64px; font-weight: 300; }

.peak-section { background: var(--bg-warm); padding: 100px 0 120px; position: relative; }
.peak-tags { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 56px; flex-wrap: wrap; }
.peak-tag { font-family: var(--mono); font-size: 10px; letter-spacing: 1px; text-transform: uppercase; padding: 9px 18px; border: 1px solid rgba(0,0,0,0.12); border-radius: 100px; color: rgba(0,0,0,0.5); background: transparent; transition: all 0.2s; cursor: pointer; }
.peak-tag.active { background: #1A1A1A; color: white; border-color: #1A1A1A; }
.peak-tag:hover:not(.active) { border-color: rgba(0,0,0,0.3); color: rgba(0,0,0,0.8); }
.peak-tag.see-all { border-color: transparent; color: rgba(0,0,0,0.4); }

.peak-stage { max-width: 1100px; margin: 0 auto; position: relative; }
.peak-track { position: relative; }
.peak-card { width: 100%; background: #0F0F0F; border-radius: 4px; overflow: hidden; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,0.15); aspect-ratio: 16/9; cursor: pointer; transition: opacity 0.4s ease; }
.peak-card.hidden { display: none; }
.peak-card-screenshot { position: absolute; inset: 0; background: #0F0F0F; }
.peak-card-scrim { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(10,10,10,0.88) 0%, rgba(10,10,10,0.65) 38%, rgba(10,10,10,0.15) 72%, transparent 100%); z-index: 1; }
.peak-card-overlay { position: absolute; top: 0; left: 0; padding: 48px 56px; z-index: 2; max-width: 60%; }
.peak-card-kicker { font-family: var(--mono); font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,0.55); margin-bottom: 20px; }
.peak-card-headline { font-family: var(--sans); font-size: clamp(24px, 2.2vw, 32px); font-weight: 500; line-height: 1.25; letter-spacing: -0.4px; color: white; }
.peak-card-headline strong { font-family: var(--heading-cond); font-weight: 700; }
.peak-card-headline .arrow { display: inline-block; margin-left: 4px; font-weight: 300; opacity: 0.7; }

.peak-nav-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,0.5); border: 1px solid rgba(0,0,0,0.08); display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(8px); z-index: 3; color: rgba(0,0,0,0.7); font-family: var(--mono); font-size: 14px; transition: background 0.2s; }
.peak-nav-arrow:hover { background: rgba(255,255,255,0.85); }
.peak-nav-prev { left: -60px; }
.peak-nav-next { right: -60px; }

.peak-mock-table { position: absolute; bottom: 28px; right: 28px; left: 38%; font-family: var(--mono); font-size: 9px; }
.peak-mock-row { display: flex; gap: 14px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.05); color: rgba(255,255,255,0.55); }
.peak-mock-row.head { color: rgba(255,255,255,0.3); font-size: 8px; text-transform: uppercase; letter-spacing: 1px; }
.peak-mock-row.flip { background: rgba(136,1,3,0.18); padding-left: 6px; padding-right: 6px; }
.peak-mock-row.flip .neg { color: #FF6B6B; }
.peak-mock-c1 { flex: 1; }
.peak-mock-c2, .peak-mock-c3 { width: 56px; text-align: right; }
.peak-mock-pos { color: #4ADE80; }

.peak-mock-plants { position: absolute; bottom: 28px; right: 28px; left: 36%; font-family: var(--mono); font-size: 9px; color: rgba(255,255,255,0.55); }
.peak-mock-plant-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.peak-mock-plant-name { width: 70px; text-align: right; font-size: 9px; }
.peak-mock-plant-bar { flex: 1; height: 6px; background: rgba(255,255,255,0.06); border-radius: 1px; position: relative; overflow: hidden; }
.peak-mock-plant-fill { position: absolute; top: 0; left: 0; height: 100%; background: rgba(74,222,128,0.6); }
.peak-mock-plant-fill.warn { background: rgba(255,200,80,0.6); }
.peak-mock-plant-fill.bad { background: rgba(255,107,107,0.7); }
.peak-mock-plant-val { width: 40px; text-align: right; font-size: 9px; }
.peak-mock-plant-val.bad { color: #FF6B6B; }

.arch-section { background: transparent; }
.arch-section .sec-h2 { max-width: none; }

.arch-row { display: grid; grid-template-columns: 260px auto 1fr; align-items: center; gap: 40px; padding: 40px 0; cursor: pointer; transition: opacity 0.2s; }
.arch-item.open .arch-row:hover { opacity: 1; }

.arch-item { position: relative; padding: 0 24px; border-radius: 0; transition: background 0.3s; margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); padding-left: calc(50vw - 50% + 24px); padding-right: calc(50vw - 50% + 24px); }
.arch-item:hover { background: var(--bg-warm); }
.arch-item.open { background: var(--bg-warm); }

.arch-col-left { padding-right: 32px; }
.arch-desc { font-size: 14px; line-height: 1.6; color: var(--text-body); font-weight: 300; }
.arch-num { font-family: var(--mono); font-size: 12px; font-weight: 500; color: var(--ae-red); letter-spacing: 1px; margin-bottom: 12px; }
.arch-num-label { font-weight: 400; color: var(--text-primary); margin-left: 6px; letter-spacing: 0.5px; }

.arch-col-mid { display: flex; justify-content: center; padding: 0 32px; }
.arch-thumb { width: 100%; max-width: 280px; aspect-ratio: 5/3; overflow: hidden; border-radius: 4px; box-shadow: 0 4px 24px rgba(0,0,0,0.12), 0 1px 4px rgba(0,0,0,0.08); }
.arch-thumb svg { width: 100%; height: 100%; display: block; }

.arch-visual { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 320px; min-height: 240px; }
.arch-letter { display: none; }
.arch-letter svg { height: 100%; width: auto; }
.arch-screenshot { position: relative; display: flex; align-items: center; justify-content: center; opacity: 1; pointer-events: auto; }
.arch-screenshot svg { width: 100%; height: 100%; display: block; border-radius: 4px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.06); }

.arch-col-right { display: flex; align-items: center; justify-content: flex-end; padding-left: 32px; }
.arch-col-right h3 { font-family: var(--heading); font-size: clamp(48px, 7vw, 96px); font-weight: 100; font-style: italic; color: var(--text-primary); letter-spacing: -3px; line-height: 0.9; margin: 0; text-align: right; transition: color 0.3s; white-space: nowrap; }
.arch-item:hover .arch-col-right h3 { color: var(--ae-red); }
.arch-item.open .arch-col-right h3 { color: var(--ae-red); }

.arch-expand-arrow { position: absolute; bottom: 16px; left: max(calc(var(--container-pad) + 24px), calc((100vw - var(--container)) / 2 + var(--container-pad) + 24px)); width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), background 0.3s; z-index: 2; background: var(--text-primary); border-radius: 10px; }
.arch-expand-arrow svg { display: none; }
.arch-expand-arrow::before { content: ''; width: 8px; height: 8px; border-right: 1.5px solid #FFFFFF; border-bottom: 1.5px solid #FFFFFF; transform: rotate(45deg); margin-top: -3px; transition: transform 0.4s cubic-bezier(0.16,1,0.3,1); }
.arch-expand-arrow:hover { background: var(--ae-red); }
.arch-item:hover .arch-expand-arrow { background: var(--ae-red); }
.arch-item.open .arch-expand-arrow::before { transform: rotate(-135deg); margin-top: 3px; }
.arch-item.open .arch-expand-arrow { background: var(--ae-red); }

.arch-drawer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.5s cubic-bezier(0.16,1,0.3,1); }
.arch-item.open .arch-drawer { grid-template-rows: 1fr; }
.arch-drawer-inner { overflow: hidden; }
.arch-drawer-content { opacity: 0; transform: translateY(-12px); transition: opacity 0.35s, transform 0.35s; padding: 0 0 40px; }
.arch-item.open .arch-drawer-content { opacity: 1; transform: translateY(0); transition-delay: 0.1s; }

.arch-expand-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; padding-top: 16px; }
.arch-expand-text p { font-size: 15px; line-height: 1.75; color: var(--text-body); font-weight: 300; max-width: 460px; }
.arch-status { display: flex; align-items: center; gap: 8px; margin-top: 24px; font-family: var(--mono); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--status-green-light); }
.arch-dot { width: 6px; height: 6px; background: var(--status-green-light); border-radius: 50%; display: inline-block; animation: blink 2s ease-in-out infinite; }
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

.arch-hud { background: none; border: none; border-top: 1px solid var(--rule); padding: 24px 0 0; position: relative; }
.arch-hud-label { font-family: var(--mono); font-size: 9px; font-weight: 400; letter-spacing: 2px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--rule-light); }
.arch-hud-footer { font-family: var(--mono); font-size: 10px; color: var(--text-light); letter-spacing: 0.5px; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--rule-light); }
.arch-hud-footer.delta { color: var(--ae-red-bright); font-weight: 500; }

.arch-metric { display: flex; align-items: center; gap: 16px; margin-bottom: 12px; }
.arch-metric:last-child { margin-bottom: 0; }
.arch-metric-val { font-family: var(--mono); font-size: 11px; color: var(--text-secondary); width: 120px; flex-shrink: 0; letter-spacing: 0.3px; }
.arch-metric-bar { flex: 1; height: 4px; background: var(--rule-light); border-radius: 2px; overflow: hidden; }
.arch-bar-fill { height: 100%; background: var(--ae-red); border-radius: 2px; transition: width 1.2s cubic-bezier(0.16,1,0.3,1); }
.arch-bar-fill.baseline { background: var(--text-light); }
.arch-bar-fill.optimized { background: var(--ae-red); }

.arch-terminal { font-family: var(--mono); font-size: 12px; line-height: 1.8; }
.arch-prompt { color: var(--text-secondary); margin-bottom: 14px; display: flex; gap: 8px; }
.arch-prompt-icon { color: var(--ae-red-bright); flex-shrink: 0; }
.arch-response { padding-left: 20px; border-left: 2px solid var(--rule); }
.arch-response-line { color: var(--text-muted); margin-bottom: 6px; font-size: 11px; }
.arch-response-line:last-child { margin-bottom: 0; }
.arch-response-line.highlight { color: var(--ae-red-bright); font-weight: 500; }

.arch-scenarios { display: flex; flex-direction: column; gap: 16px; }
.arch-scenario-label { font-family: var(--mono); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 6px; }
.arch-scenario-val { font-family: var(--heading-cond); font-size: 28px; font-weight: 500; color: var(--text-primary); letter-spacing: -0.5px; margin-bottom: 8px; }
.arch-scenario-val span { font-size: 13px; font-weight: 400; color: var(--text-muted); letter-spacing: 1px; }
.arch-scenario-val.up { color: var(--ae-red); }
.arch-scenario-bar { height: 4px; background: var(--rule-light); border-radius: 2px; overflow: hidden; }

.metrics-section { background: var(--bg-warm); padding: 100px 0; }
.core-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; max-width: 1160px; margin: 0 auto; }
.core-lede { font-size: 17px; line-height: 1.65; color: var(--text-body); font-weight: 300; max-width: 560px; margin-top: 32px; margin-bottom: 48px; }
.core-lede strong { color: var(--text-primary); font-weight: 400; }
.core-bullets { margin-top: 8px; }
.cbullet { padding: 22px 0; border-top: 1px solid var(--rule); }
.cbullet:last-child { border-bottom: 1px solid var(--rule); }
.cbullet-title { font-family: var(--heading-cond); font-size: 17px; font-weight: 600; color: var(--text-primary); letter-spacing: -0.2px; }

.core-dial-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; }
.core-dial { width: 520px; height: 520px; position: relative; max-width: 100%; }
.core-dial svg { width: 100%; height: 100%; display: block; overflow: visible; }
.core-legend { margin-top: 24px; display: flex; gap: 28px; font-family: var(--mono); font-size: 9px; text-transform: uppercase; letter-spacing: 1.2px; }
.core-legend-item { display: flex; align-items: center; gap: 8px; }
.core-legend-dot { width: 9px; height: 9px; border-radius: 50%; }
.core-legend-dot.day1 { background: var(--ae-red); }
.core-legend-dot.expansion { background: none; border: 1px solid #888; }
.core-legend-item .day1-txt { color: var(--ae-red-bright); }
.core-legend-item .exp-txt { color: var(--text-muted); }

.arch-stack-diagram { display: flex; flex-direction: column; gap: 0; max-width: 960px; margin: 0 auto; }

.arch-tier { position: relative; padding: 36px 44px; border: 1px solid var(--rule); transition: all 0.3s; }
.arch-tier + .arch-tier { border-top: none; }

.arch-tier-ae { background: var(--bg); position: relative; z-index: 3; }
.arch-tier-ae::before { content: ''; position: absolute; top: 8px; left: 8px; width: 16px; height: 16px; border-top: 1px solid var(--ae-red); border-left: 1px solid var(--ae-red); }
.arch-tier-ae::after { content: ''; position: absolute; bottom: 8px; right: 8px; width: 16px; height: 16px; border-bottom: 1px solid var(--ae-red); border-right: 1px solid var(--ae-red); }

.arch-tier-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.arch-tier-left { flex: 1; min-width: 260px; }
.arch-tier-right { display: flex; gap: 32px; flex-wrap: wrap; }

.arch-tier-tag { font-family: var(--mono); font-size: 9px; font-weight: 400; letter-spacing: 2.5px; text-transform: uppercase; display: inline-block; padding: 4px 10px; margin-bottom: 14px; }
.arch-tier-tag-ae { border: 1px solid var(--ae-red-line); color: var(--ae-red-bright); background: var(--ae-red-dim); }
.arch-tier-tag-plan { border: 1px solid var(--rule); color: var(--text-muted); background: transparent; }
.arch-tier-tag-erp { border: 1px solid var(--rule); color: var(--text-light); background: transparent; }

.arch-tier-name { font-family: var(--heading-cond); font-size: 22px; font-weight: 500; color: var(--text-primary); margin-bottom: 8px; letter-spacing: -0.3px; }
.arch-tier-ae .arch-tier-name { color: var(--ae-red); }
.arch-tier-desc { font-size: 14px; line-height: 1.65; color: var(--text-body); font-weight: 300; max-width: 420px; }

.arch-tier-caps { display: flex; gap: 8px; flex-wrap: wrap; }
.arch-tier-cap { font-family: var(--mono); font-size: 10px; letter-spacing: 0.5px; padding: 6px 14px; border-radius: 2px; white-space: nowrap; }
.arch-tier-ae .arch-tier-cap { background: var(--ae-red-dim); color: var(--ae-red-bright); border: 1px solid var(--ae-red-line); }

.arch-tier-plan { background: var(--bg-warm); z-index: 2; }
.arch-tier-plan .arch-tier-name { color: var(--text-secondary); font-size: 18px; }
.arch-tier-plan .arch-tier-desc { color: var(--text-muted); font-size: 13px; }

.arch-vendors { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.arch-vendor { font-family: var(--mono); font-size: 10px; letter-spacing: 0.5px; padding: 5px 12px; border: 1px solid var(--rule); color: var(--text-muted); border-radius: 2px; background: transparent; }

.arch-tier-erp { background: #ECEAE7; z-index: 1; }
.arch-tier-erp .arch-tier-name { color: var(--text-muted); font-size: 18px; }
.arch-tier-erp .arch-tier-desc { color: var(--text-light); font-size: 13px; }

.arch-flow { display: flex; justify-content: center; align-items: center; height: 0; position: relative; z-index: 4; }
.arch-flow-arrow { display: flex; flex-direction: column; align-items: center; gap: 0; position: absolute; }
.arch-flow-line { width: 1px; height: 20px; background: var(--ae-red-line); }
.arch-flow-chevron { color: var(--ae-red); font-size: 10px; line-height: 1; margin-top: -2px; }

.arch-tier-ae { box-shadow: 0 4px 24px rgba(136,1,3,0.08), 0 1px 4px rgba(0,0,0,0.06); }

.ind-nav { display: flex; gap: 0; }
.ind-tab { flex: 1; padding: 24px 20px; cursor: pointer; transition: background 0.3s; border-top: 1.5px solid var(--rule); position: relative; }
.ind-tab:hover { background: var(--bg-warm); }
.ind-tab.active { background: var(--bg-warm); border-top-color: var(--ae-red); }
.ind-tab .tab-num { font-family: var(--mono); font-size: 11px; color: var(--text-light); margin-bottom: 8px; }
.ind-tab.active .tab-num { color: var(--ae-red); }
.ind-tab .tab-name { font-family: var(--heading-cond); font-size: 18px; font-weight: 600; color: var(--text-primary); letter-spacing: -0.2px; }
.ind-tab .tab-line { font-size: 12px; color: var(--text-muted); margin-top: 4px; font-weight: 300; }
.ind-content { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; }
.ind-left .ind-headline { font-family: var(--heading); font-size: clamp(22px, 3vw, 32px); font-weight: 200; letter-spacing: -0.8px; line-height: 1.2; margin-bottom: 20px; }
.ind-left .ind-headline strong { font-family: var(--heading-cond); font-weight: 600; letter-spacing: -0.2px; }
.ind-left .ind-body { font-size: 15px; line-height: 1.7; color: var(--text-body); font-weight: 300; margin-bottom: 36px; }
.ind-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.ind-stat { padding: 24px 0; border-top: 1.5px solid var(--text-primary); }
.ind-stat:nth-child(even) { padding-left: 32px; }
.ind-stat-label { font-family: var(--sans); font-size: 10px; font-weight: 600; letter-spacing: 1.4px; color: var(--text-muted); text-transform: uppercase; margin-bottom: 10px; }
.ind-stat-val { font-family: var(--heading); font-size: clamp(36px, 5vw, 52px); font-weight: 500; letter-spacing: -2px; line-height: 1; margin-bottom: 8px; }
.ind-stat-desc { font-size: 13px; color: var(--text-body); font-weight: 300; line-height: 1.4; max-width: 220px; }
.ind-right { background: var(--bg); border-radius: 12px; padding: 28px; border: 1px solid var(--rule); }
.ind-mock-header { font-family: var(--mono); font-size: 9px; color: var(--text-muted); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--rule-light); }
.ind-mock-alert { background: rgba(136,1,3,0.06); border-radius: 6px; padding: 10px 14px; margin-bottom: 16px; font-size: 12px; color: var(--ae-red); font-weight: 400; }
.ind-mock-row { display: grid; grid-template-columns: 1.4fr 0.8fr 0.8fr; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--rule-light); font-size: 13px; align-items: center; }
.ind-mock-row:last-of-type { border-bottom: none; }
.ind-mock-row .name { color: var(--text-primary); font-weight: 500; }
.ind-mock-row .dim { color: var(--text-muted); font-family: var(--mono); font-size: 11px; }
.ind-mock-row .val { font-family: var(--mono); font-size: 12px; font-weight: 500; text-align: right; }
.ind-mock-row .val.neg { color: var(--ae-red); }
.ind-mock-row .val.pos { color: #059669; }
.ind-mock-row.highlight { background: rgba(136,1,3,0.04); margin: 0 -28px; padding: 14px 28px; }
.ind-bar-track { height: 3px; background: var(--rule-light); border-radius: 2px; margin-top: 4px; }
.ind-bar-fill { height: 100%; border-radius: 2px; }
.ind-mock-footer { font-family: var(--mono); font-size: 10px; color: var(--text-light); margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--rule-light); letter-spacing: 0.3px; }

.ind-panel { display: none; background: var(--bg-warm); padding: 56px 48px; }
.ind-panel.active { display: block; animation: indFadeIn 0.35s ease forwards; }
@keyframes indFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.founders { display: flex; flex-direction: column; gap: 32px; }
.founder { padding-top: 24px; border-top: 1.5px solid var(--text-primary); }
.founder-header { display: flex; align-items: center; gap: 20px; margin-bottom: 16px; }
.founder-header-text { flex: 1; }
.founder-photo { width: 72px; height: 72px; border-radius: 50%; background: var(--bg-warm); border: 1px solid var(--rule); display: flex; align-items: center; justify-content: center; font-family: var(--heading-cond); font-size: 20px; font-weight: 600; color: var(--text-muted); letter-spacing: -0.5px; overflow: hidden; flex-shrink: 0; }
.founder-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.founder-name { font-family: var(--heading-cond); font-size: 20px; font-weight: 600; color: var(--text-primary); letter-spacing: -0.2px; margin-bottom: 4px; }
.founder-role { font-family: var(--mono); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--ae-red); }
.founder-bio { font-size: 13px; line-height: 1.6; color: var(--text-body); font-weight: 300; }

.cs-section { background: #1A1A1A; border-top: none; border-bottom: none; }
.cs-section .sec-label { color: var(--ae-red-bright); }
.cs-section .sec-h2 { color: rgba(255,255,255,0.6); }
.cs-section .sec-h2 strong { color: #FFFFFF; }
.cs-section .sec-desc { color: rgba(255,255,255,0.5); }
.cs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; overflow: hidden; }
.cs-card { background: #222; padding: 48px 40px; }
.cs-card .label { font-family: var(--mono); font-size: 9px; font-weight: 400; letter-spacing: 2.5px; text-transform: uppercase; color: var(--ae-red-bright); margin-bottom: 16px; }
.cs-card h3 { font-family: var(--heading-cond); font-size: 24px; font-weight: 500; color: #FFFFFF; margin-bottom: 12px; letter-spacing: -0.2px; }
.cs-card p { font-size: 14px; line-height: 1.75; color: rgba(255,255,255,0.5); font-weight: 300; }

.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 12px; overflow: hidden; }
.stat { background: var(--bg-warm); padding: 44px 36px; text-align: center; }
.stat-val { font-family: var(--heading-cond); font-size: 56px; font-weight: 500; color: var(--ae-red); letter-spacing: -2px; margin-bottom: 8px; }
.stat-label { font-size: 13px; font-weight: 300; color: var(--text-body); line-height: 1.5; }

.cta-sec { padding: 160px 0; text-align: center; position: relative; overflow: hidden; background: #1A1A1A; border-top: none; }
.cta-sec::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 600px; height: 600px; background: radial-gradient(circle, rgba(136,1,3,0.15) 0%, transparent 70%); pointer-events: none; }
.cta-sec .sec-h2 { text-align: center; max-width: 680px; margin: 0 auto 20px; color: rgba(255,255,255,0.6); }
.cta-sec .sec-h2 strong { color: #FFFFFF; }
.cta-sec .sec-desc { text-align: center; max-width: 520px; margin: 0 auto 48px; color: rgba(255,255,255,0.5); }
.cta-sec .sec-label { justify-content: center; }
.cta-sec .hero-actions { justify-content: center; }

.start-section { background: var(--bg-warm); padding: 120px 0; }
.start-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.start-form { display: flex; flex-direction: column; gap: 16px; }
.start-form input, .start-form textarea { font-family: var(--sans); font-size: 14px; font-weight: 300; color: var(--text-primary); background: var(--bg); border: 1px solid var(--rule); border-radius: 8px; padding: 14px 16px; outline: none; transition: border-color 0.2s; }
.start-form input:focus, .start-form textarea:focus { border-color: var(--ae-red); }
.start-form input::placeholder, .start-form textarea::placeholder { color: var(--text-light); }
.start-form textarea { resize: vertical; min-height: 100px; }
.start-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.start-form button { font-family: var(--mono); font-size: 12px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; color: white; background: var(--ae-red); border: none; border-radius: 8px; padding: 16px 32px; cursor: pointer; transition: background 0.2s; align-self: flex-start; }
.start-form button:hover { background: #6B0102; }

.contact-info { display: flex; flex-direction: column; gap: 24px; }
.contact-item { display: flex; flex-direction: column; gap: 4px; }
.contact-label { font-family: var(--mono); font-size: 10px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; color: var(--text-light); }
.contact-value { font-family: var(--sans); font-size: 16px; color: var(--text-primary); text-decoration: none; }
.contact-value:hover { color: var(--ae-red); }

.footer-wrap { padding: 0; border-top: none; background: #111; }
footer { max-width: var(--container); margin: 0 auto; padding: 32px var(--container-pad); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
footer .f-left { display: flex; align-items: center; gap: 8px; }
footer .f-left span { font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,0.4); }
footer .f-right { display: flex; gap: 24px; }
footer .f-right a { font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,0.5); text-decoration: none; letter-spacing: 0.5px; transition: color 0.2s; }
footer .f-right a:hover { color: var(--ae-red); }

@media (max-width: 900px) {
  :root { --container-pad: 24px; }
  .wm-bottom-strip { grid-template-columns: 1fr; }
  .arch-row { grid-template-columns: 1fr; gap: 24px; padding: 32px 0; }
  .arch-col-left { padding-right: 0; }
  .arch-col-mid { padding: 0; justify-content: flex-start; }
  .arch-col-right { justify-content: flex-start; padding-left: 0; }
  .arch-col-right h3 { text-align: left; font-size: clamp(40px, 12vw, 64px); }
  .arch-expand-grid { grid-template-columns: 1fr; }
  .ind-nav { flex-wrap: wrap; }
  .ind-tab { flex: none; width: 50%; }
  .ind-panel { padding: 32px 24px; }
  .ind-content { grid-template-columns: 1fr; gap: 40px; }
  .cases { grid-template-columns: 1fr; }
  .start-layout { grid-template-columns: 1fr; gap: 48px; }
  .start-form-row { grid-template-columns: 1fr; }
  .about-grid { grid-template-columns: 1fr; gap: 48px; }
  .cs-grid { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .nav-center { display: none; }
  .nav-logo-img { height: 30px; }
  .hero-content { padding: 0 var(--container-pad) 60px; }
  .hero h1 { font-size: clamp(40px, 12vw, 72px); letter-spacing: -2px; }
  .arch-tier { padding: 28px 24px; }
  .arch-tier-header { flex-direction: column; }
  .arch-tier-caps { margin-top: 16px; }
}

@keyframes heroIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }