﻿
:root { --bg:#0b1117; --bg-soft:#101a22; --bg-panel:#121d26; --ink:#ecf1f4; --muted:#b3c0c7; --line:#243640; --lime:#b9f14a; --cyan:#6fc9ed; --orange:#f39a52; --panel-alt:#0f1a20; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at top, #13222c 0%, var(--bg) 32%, #0b1117 100%); font-family:'DM Sans', sans-serif; font-size:16px; line-height:1.5; }
a { color:inherit; text-decoration:none; }
.section-shell { width:min(1180px, calc(100% - 64px)); margin:0 auto; }
.site-header { display:flex; align-items:center; gap:32px; width:min(1320px, calc(100% - 64px)); margin:0 auto; padding:26px 0; }
.brand { display:flex; align-items:center; gap:11px; font-size:13px; font-weight:700; letter-spacing:.01em; white-space:nowrap; }
.brand-mark { display:grid; place-items:center; width:36px; height:36px; color:var(--bg); background:linear-gradient(135deg, var(--lime), #d7ff81); font:700 13px/1 'Space Grotesk', sans-serif; letter-spacing:-.06em; box-shadow:0 0 0 1px rgba(185,241,74,.25); }
.site-nav { display:flex; gap:28px; margin-left:auto; color:var(--muted); font-size:13px; }
.site-nav a:hover, .text-link:hover { color:var(--cyan); }
.header-link { padding:11px 16px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.02); font-size:13px; font-weight:700; transition:background .2s, color .2s, border-color .2s; }
.header-link:hover { color:var(--bg); background:var(--lime); border-color:transparent; }
.hero { display:grid; grid-template-columns:1fr 1fr; gap:8%; align-items:center; min-height:650px; padding:78px 0 104px; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 24px; color:var(--lime); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow-line { display:inline-block; width:34px; height:1px; background:currentColor; }
h1, h2, h3 { font-family:'Space Grotesk', sans-serif; letter-spacing:-.045em; }
h1 { max-width:660px; margin:0; font-size:clamp(52px, 6vw, 86px); line-height:.94; font-weight:600; }
.hero-lede { max-width:540px; margin:30px 0 0; color:var(--muted); font-size:18px; line-height:1.5; }
.hero-actions { display:flex; align-items:center; gap:25px; margin-top:38px; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:18px; min-height:49px; padding:13px 19px; border:0; font:700 13px 'DM Sans', sans-serif; cursor:pointer; transition:transform .2s, background .2s; }
.button:hover { transform:translateY(-2px); }
.button-dark { color:var(--bg); background:linear-gradient(135deg, var(--lime), #dfffa9); }
.button-dark:hover { background:linear-gradient(135deg, #dfffa9, var(--lime)); }
.button-light { color:var(--bg); background:var(--lime); }
.button-light:hover { background:var(--cream); }
.text-link { color:var(--ink); font-size:13px; font-weight:700; }
.hero-proof { display:flex; align-items:center; flex-wrap:wrap; gap:11px; margin-top:67px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.proof-dot { width:8px; height:8px; background:var(--cyan); border-radius:50%; box-shadow:0 0 16px rgba(111,201,237,.8); }
.proof-divider { color:#6d7d87; }
.hero-visual { position:relative; min-height:460px; padding:36px 0 0 30px; }
.photo-collage { position:relative; display:grid; gap:18px; grid-template-columns:1.3fr 1fr; align-items:end; min-height:430px; }
.photo { position:relative; overflow:hidden; border-radius:18px; border:1px solid rgba(255,255,255,.08); box-shadow:0 22px 48px rgba(0,0,0,.34); }
.photo img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(1.08) contrast(1.06) brightness(.82); }
.photo::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,14,18,0) 30%, rgba(8,14,18,.5) 100%); }
.photo-caption { position:absolute; left:18px; right:18px; bottom:18px; z-index:1; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#ebfaff; font-weight:700; }
.photo-robot { height:330px; }
.photo-panel { height:250px; margin-top:42px; } 
.photo-cnc { height:220px; }
.signal-band { color:var(--ink); background:linear-gradient(90deg, #c9f55b, #b6e8ff); }.signal-content { display:flex; justify-content:space-between; align-items:center; gap:32px; padding:25px 0; }.signal-content p { max-width:650px; margin:0; font:500 18px/1.3 'Space Grotesk',sans-serif; }.signal-arrow { color:var(--bg); font-size:30px; }
.capabilities { padding:135px 0 90px; }.section-heading { display:grid; grid-template-columns:1fr 2fr; gap:24px; align-items:start; margin-bottom:58px; }.section-heading .eyebrow { margin-top:12px; }.section-heading h2, .process-intro h2, .industry-heading h2, .meeting-header h2 { max-width:740px; margin:0; font-size:clamp(38px,4.4vw,62px); line-height:1.02; font-weight:600; }.code-stack { padding:20px 0 48px; }
.stack-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:20px; margin-top:26px; }
.stack-card { padding:24px 22px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.02); }
.stack-label { display:inline-block; margin-bottom:16px; color:var(--cyan); font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; }
.stack-card h3 { margin:0 0 10px; font-size:26px; line-height:1.08; }
.stack-card p { margin:0; color:var(--muted); font-size:15px; }

.supplier-section { display:grid; grid-template-columns:1.1fr 1.9fr; gap:36px; align-items:start; padding:56px 0 30px; }
.supplier-copy h2 { margin:0; font-size:clamp(32px, 4vw, 54px); line-height:1.05; }
.supplier-copy p:not(.eyebrow) { max-width:520px; margin:22px 0 0; color:var(--muted); font-size:17px; }
.supplier-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; }
.supplier-card { padding:22px 20px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)); }
.supplier-tag { display:inline-block; margin-bottom:15px; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--lime); font-weight:700; }
.supplier-card h3 { margin:0 0 10px; font-size:22px; line-height:1.1; }
.supplier-card p { margin:0; color:var(--muted); font-size:15px; }

.ecosystem { padding:0 0 24px; }.ecosystem-tags { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }.ecosystem-tags span { padding:10px 14px; border:1px solid var(--line); background:rgba(255,255,255,.03); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); box-shadow:inset 0 0 0 1px rgba(255,255,255,.02); }.industry-showcase { padding:0 0 36px; }
.industry-heading { margin-bottom:26px; }
.industry-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.industry-card { padding:26px 22px; background:rgba(255,255,255,.025); border:1px solid var(--line); border-radius:16px; }
.industry-tag { display:inline-block; margin-bottom:16px; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--lime); font-weight:700; }
.industry-card h3 { margin:0 0 10px; font-size:22px; line-height:1.12; }
.industry-card p { margin:0; color:var(--muted); font-size:15px; }
.capability { display:grid; grid-template-columns:72px 1fr 30px; gap:30px; align-items:start; padding:27px 0 30px; border-top:1px solid var(--line); transition:padding .2s, color .2s; }.capability:last-child { border-bottom:1px solid var(--line); }.capability:hover { color:var(--cyan); padding-left:12px; }.capability-number { color:var(--lime); font:600 13px 'Space Grotesk',sans-serif; }.capability h3 { margin:0 0 7px; font-size:25px; font-weight:600; }.capability p { max-width:610px; margin:0; color:var(--muted); font-size:15px; }.capability-icon { color:var(--cyan); font-size:23px; text-align:right; }
.process-section { padding:125px 0 133px; background:#101d22; }.process-grid { display:grid; grid-template-columns:1fr 1fr; gap:13%; }.process-intro > p:not(.eyebrow) { max-width:400px; margin:30px 0 0; color:var(--muted); }.process-steps { border-top:1px solid var(--line); }.process-step { display:grid; grid-template-columns:64px 1fr; gap:18px; padding:25px 0; border-bottom:1px solid var(--line); }.process-step > span { color:var(--lime); font:600 13px 'Space Grotesk',sans-serif; }.process-step h3 { margin:0 0 6px; font-size:21px; }.process-step p { margin:0; color:var(--muted); font-size:14px; }
.meeting-section { padding:16px 0 90px; }
.meeting-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:24px; }
.meeting-card { padding:24px 20px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.02); }
.meeting-card span { display:inline-block; margin-bottom:14px; color:var(--lime); font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; }
.meeting-card h3 { margin:0 0 10px; font-size:22px; }
.meeting-card p { margin:0; color:var(--muted); }
.assessment { display:grid; grid-template-columns:1fr 1fr; gap:12%; padding:130px 0; color:var(--bg); background:linear-gradient(135deg, var(--cyan), #d9f7ff); }.assessment-copy h2 { max-width:540px; margin:0; font-size:clamp(39px,4.5vw,60px); line-height:1.02; color:var(--bg); }.eyebrow-light { color:var(--bg); }.assessment-copy > p:not(.eyebrow) { max-width:470px; margin:28px 0 0; color:rgba(11,17,23,.82); }.assessment-note { display:flex; gap:12px; align-items:flex-start; max-width:410px; margin-top:42px; color:rgba(11,17,23,.82); font-size:12px; }.note-mark { display:grid; place-items:center; width:19px; height:19px; flex:0 0 19px; color:var(--bg); background:var(--bg); border-radius:50%; font-weight:700; }
.lead-form { display:flex; flex-direction:column; padding-top:3px; }.lead-form label { margin:17px 0 7px; color:var(--bg); font-size:12px; font-weight:700; }.lead-form input,.lead-form select,.lead-form textarea { width:100%; padding:12px 0; color:var(--bg); background:transparent; border:0; border-bottom:1px solid rgba(11,17,23,.4); border-radius:0; font:15px 'DM Sans',sans-serif; outline:none; }.lead-form input::placeholder,.lead-form textarea::placeholder { color:rgba(11,17,23,.62); }.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus { border-color:var(--bg); }.lead-form select option { color:var(--bg); }.lead-form textarea { resize:vertical; }.lead-form .button { align-self:flex-start; margin-top:26px; }.form-status { min-height:24px; margin:13px 0 0; color:var(--bg); font-size:13px; }
.site-footer { display:grid; grid-template-columns:1fr 1fr auto; gap:20px; align-items:center; padding-top:28px; padding-bottom:28px; color:var(--muted); font-size:11px; }.footer-brand { color:var(--ink); }.site-footer p { margin:0; text-transform:uppercase; letter-spacing:.1em; }.footer-meta { text-align:right; }
.reveal { animation:rise .75s both; }.reveal-delay { animation-delay:.17s; }.reveal-delay-small { animation-delay:.09s; }@keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:800px) { .section-shell,.site-header { width:min(100% - 36px, 600px); }.site-header { flex-wrap:wrap; gap:17px; padding:18px 0; }.site-nav { order:3; width:100%; justify-content:space-between; gap:10px; }.header-link { margin-left:auto; }.hero { grid-template-columns:1fr; gap:54px; min-height:auto; padding:62px 0 82px; }.hero-visual { min-height:370px; padding-left:12px; }.photo-collage { grid-template-columns:1fr; }.photo-robot, .photo-panel, .photo-cnc { height:240px; margin-top:0; }.hero-proof { margin-top:45px; }.section-heading,.process-grid,.assessment,.industry-grid,.meeting-grid,.supplier-section,.stack-grid { grid-template-columns:1fr; gap:46px; }.capabilities { padding:90px 0; }.process-section { padding:90px 0; }.assessment { padding:90px 0; }.site-footer { grid-template-columns:1fr; gap:12px; padding:24px 0; }.footer-meta { text-align:left; } }
@media (max-width:480px) { h1 { font-size:49px; }.site-nav { font-size:12px; }.header-link { display:none; }.hero-actions { align-items:flex-start; flex-direction:column; gap:20px; }.capability { grid-template-columns:42px 1fr; gap:14px; }.capability-icon { display:none; }.capability h3 { font-size:22px; }.signal-content p { font-size:16px; }.photo { border-radius:14px; } }

