:root { color-scheme: light; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body.mvp-home { min-height: 100svh; overflow: hidden; background: #102a43; color: #fff; font-family: Inter, Arial, Helvetica, sans-serif; }
.mvp-header { height: clamp(58px, 8vh, 84px); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; padding: 10px clamp(18px, 3vw, 56px); background: #102a43; border-bottom: 1px solid rgba(255,255,255,.18); }
.mvp-brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: clamp(15px, 1.5vw, 20px); font-weight: 800; letter-spacing: -.03em; text-decoration: none; }.mvp-brand img { width: clamp(30px, 3vw, 44px); height: auto; }.mvp-header p { margin: 0; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; opacity: .78; }.mvp-contact { justify-self: end; color: #fff; font-size: 12px; font-weight: 700; text-decoration: none; border-bottom: 1px solid currentColor; }
.mvp-choices { height: calc(100svh - clamp(58px, 8vh, 84px)); display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); }
.mvp-choice { position: relative; isolation: isolate; display: grid; place-items: center; overflow: hidden; min-width: 0; text-decoration: none; border-right: 1px solid rgba(255,255,255,.28); border-bottom: 1px solid rgba(255,255,255,.28); transition: filter .2s ease; }.mvp-choice::before { content:""; position:absolute; inset:0; z-index:-2; background: repeating-linear-gradient(0deg, transparent 0 29px, rgba(255,255,255,.09) 30px), repeating-linear-gradient(90deg, transparent 0 29px, rgba(255,255,255,.09) 30px); opacity:.45; }.mvp-choice::after { content:""; position:absolute; inset:8%; z-index:-1; border:1px solid rgba(255,255,255,.17); clip-path:polygon(0 0, 100% 0, 100% 84%, 74% 84%, 74% 100%, 0 100%); }.mvp-choice:hover, .mvp-choice:focus-visible { filter:brightness(1.09); outline:none; }.mvp-choice:focus-visible { box-shadow:inset 0 0 0 5px #fff; }
.mvp-growth { color:#102a43; background:#dbe4e9; }.mvp-lighting { color:#fff; background:#362015; }.mvp-systems { color:#fff; background:#062c30; }.mvp-drafting { color:#fff; background:#303b37; }
.mvp-panel-kicker { position:absolute; z-index:2; top:clamp(17px, 2.4vw, 34px); left:clamp(18px, 3vw, 40px); font-size:clamp(9px, .8vw, 12px); font-weight:800; letter-spacing:.15em; text-transform:uppercase; opacity:.8; }.mvp-copy { position:absolute; z-index:2; bottom:clamp(18px, 3vw, 40px); left:clamp(18px, 3vw, 40px); display:grid; gap:5px; }.mvp-copy strong { font-size:clamp(30px, 4vw, 62px); letter-spacing:-.07em; line-height:.9; }.mvp-copy small { font-size:clamp(11px, 1.15vw, 16px); font-weight:700; letter-spacing:.035em; text-transform:uppercase; }.mvp-arrow { position:absolute; z-index:2; right:clamp(18px, 3vw, 40px); bottom:clamp(18px, 3vw, 40px); font-size:clamp(28px, 3vw, 46px); line-height:1; }
.mvp-badge { position:absolute; z-index:2; right:clamp(18px, 3vw, 40px); top:clamp(17px, 2.4vw, 34px); width:clamp(38px, 4.4vw, 68px); height:auto; }.mvp-system-graphic { position:relative; width:min(52%, 350px); aspect-ratio:1; opacity:.96; }.mvp-system-graphic::before, .mvp-system-graphic::after, .mvp-system-graphic i, .mvp-system-graphic b, .mvp-system-graphic em { content:""; position:absolute; display:block; }
.growth-graphic { border:2px solid #102a43; border-radius:48% 52% 43% 57%; transform:rotate(-18deg); background:radial-gradient(circle at 43% 41%, #102a43 0 7px, transparent 8px), radial-gradient(circle at 68% 62%, #a8773c 0 5px, transparent 6px); }.growth-graphic::before { inset:14%; border:2px solid #102a43; border-radius:50%; }.growth-graphic::after { width:65%; height:2px; left:17%; top:49%; background:#102a43; transform:rotate(29deg); box-shadow:0 -44px 0 -1px #102a43, 0 44px 0 -1px #102a43; }.growth-graphic i { width:11px; height:11px; border-radius:50%; background:#102a43; left:18%; top:49%; box-shadow:75px -43px 0 #102a43, 132px 34px 0 #a8773c; animation:route-pulse 2.8s ease-in-out infinite; }.growth-graphic b { inset:27%; border:1px dashed #102a43; border-radius:50%; }.growth-graphic em { width:2px; height:130%; top:-15%; left:50%; background:rgba(16,42,67,.26); }
.lighting-graphic { border-radius:50%; background:radial-gradient(circle, #ffd78a 0 5%, #c57b38 17%, rgba(197,123,56,.34) 34%, transparent 63%); }.lighting-graphic::before { inset:8%; border:1px solid rgba(255,212,130,.55); border-radius:50%; box-shadow:0 0 0 42px rgba(197,123,56,.09), 0 0 0 84px rgba(197,123,56,.06); }.lighting-graphic::after { left:50%; top:10%; width:2px; height:80%; background:linear-gradient(transparent, #ffd78a, transparent); transform:rotate(38deg); }.lighting-graphic i { inset:17%; border:1px solid rgba(255,212,130,.6); border-radius:50%; animation:scan 4s linear infinite; }.lighting-graphic b { width:5px; height:5px; border-radius:50%; background:#ffd78a; left:49%; top:49%; box-shadow:82px 20px 0 #c57b38, -69px -35px 0 #c57b38; }.lighting-graphic em { left:13%; right:13%; top:50%; height:1px; background:rgba(255,212,130,.65); transform:rotate(-30deg); }
.systems-graphic { border:1px solid rgba(150,222,197,.7); transform:rotate(45deg); }.systems-graphic::before { inset:19%; border:1px solid rgba(150,222,197,.7); }.systems-graphic::after { inset:36%; border:1px solid rgba(150,222,197,.7); }.systems-graphic i { width:13px; height:13px; border-radius:50%; background:#9be0c4; left:9%; top:47%; box-shadow:144px -92px 0 #9be0c4, 241px 13px 0 #9be0c4, 86px 128px 0 #9be0c4; animation:route-pulse 2.4s ease-in-out infinite alternate; }.systems-graphic b { width:2px; height:77%; left:50%; top:12%; background:#9be0c4; transform:rotate(56deg); box-shadow:0 0 0 1px rgba(155,224,196,.35); }.systems-graphic em { width:72%; height:2px; left:14%; top:50%; background:#9be0c4; transform:rotate(-28deg); }
.drafting-graphic { background:linear-gradient(135deg, transparent 49.5%, #c8d6db 50%, transparent 50.5%), linear-gradient(45deg, transparent 49.5%, rgba(200,214,219,.68) 50%, transparent 50.5%); border:1px solid #c8d6db; }.drafting-graphic::before { inset:14%; border:1px solid #c8d6db; }.drafting-graphic::after { inset:28%; border:1px dashed rgba(200,214,219,.8); }.drafting-graphic i { width:68%; height:1px; left:16%; top:49%; background:#c8d6db; box-shadow:0 -54px 0 rgba(200,214,219,.55), 0 54px 0 rgba(200,214,219,.55); }.drafting-graphic b { width:13px; height:13px; border:2px solid #d8b477; border-radius:50%; left:47%; top:47%; }.drafting-graphic em { width:2px; height:86%; left:50%; top:7%; background:#d8b477; animation:plot 3.2s ease-in-out infinite; }
@keyframes route-pulse { 50% { transform:scale(1.35); opacity:.55; } } @keyframes scan { to { transform:rotate(360deg); } } @keyframes plot { 50% { transform:translateX(62px); } }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:620px) { .mvp-header { grid-template-columns:1fr auto; height:58px; padding:8px 14px; }.mvp-header p { display:none; }.mvp-contact { font-size:10px; }.mvp-brand { gap:7px; font-size:14px; }.mvp-brand img { width:28px; }.mvp-choices { height:calc(100svh - 58px); }.mvp-panel-kicker { display:none; }.mvp-badge { top:12px; right:12px; width:27px; }.mvp-system-graphic { width:45%; }.mvp-copy { left:14px; bottom:13px; }.mvp-copy strong { font-size:clamp(20px, 7vw, 29px); }.mvp-copy small { display:none; }.mvp-arrow { right:14px; bottom:13px; font-size:25px; } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; } }

/* Version 2: one development engine, four intelligence layers. */
.mvp-header { position:fixed; z-index:10; top:24px; left:24px; width:auto; height:auto; display:block; padding:0; background:transparent; border:0; opacity:.85; transition:opacity .2s ease; }.mvp-header:hover, .mvp-header:focus-within { opacity:1; }.mvp-brand { display:block; }.mvp-brand img { width:48px; display:block; }
.mvp-choices { height:100svh; }.mvp-choice::before { opacity:.34; background:repeating-linear-gradient(0deg, transparent 0 27px, rgba(255,255,255,.08) 28px), repeating-linear-gradient(90deg, transparent 0 27px, rgba(255,255,255,.08) 28px); }.mvp-choice::after { inset:9%; border-color:rgba(255,255,255,.14); }
.mvp-panel-kicker { top:clamp(25px, 3vw, 46px); letter-spacing:.18em; }.mvp-badge { display:none; }.mvp-copy { opacity:0; transform:translateY(10px); transition:opacity .4s ease, transform .4s ease; }.mvp-choice:hover .mvp-copy, .mvp-choice:focus-visible .mvp-copy { opacity:1; transform:translateY(0); }.mvp-copy strong { font-size:clamp(34px, 4.3vw, 68px); }.mvp-arrow { opacity:0; transform:translateX(-10px); transition:opacity .4s ease, transform .4s ease; }.mvp-choice:hover .mvp-arrow, .mvp-choice:focus-visible .mvp-arrow { opacity:1; transform:translateX(0); }
.mvp-growth .mvp-panel-kicker { left:94px; }
.mvp-copy strong { display:block; line-height:1.1; padding-bottom:.08em; }
.mvp-growth { background:#e4e8ea; color:#163456; }.mvp-lighting { background:#2b1b13; }.mvp-systems { background:#012f33; }.mvp-drafting { background:#29343a; }
.growth-graphic { width:min(58%, 390px); border:0; border-radius:0; transform:none; background:transparent; }.growth-graphic::before { inset:12% 7%; border:0; border-radius:0; background:linear-gradient(30deg, transparent 49.5%, #345d85 50% 50.5%, transparent 51%), linear-gradient(-30deg, transparent 49.5%, #345d85 50% 50.5%, transparent 51%); }.growth-graphic::after { width:74%; height:62%; left:13%; top:18%; background:linear-gradient(30deg, transparent 49.4%, #163456 50% 50.7%, transparent 51%), linear-gradient(-30deg, transparent 49.4%, #163456 50% 50.7%, transparent 51%); box-shadow:none; transform:none; }.growth-graphic i { width:14px; height:14px; background:#163456; left:calc(50% - 7px); top:9%; box-shadow:-96px 91px 0 #345d85, 96px 91px 0 #345d85, -144px 182px 0 #163456, -48px 182px 0 #b68c52, 48px 182px 0 #b68c52, 144px 182px 0 #163456; animation:growth-nodes 2.8s ease-in-out infinite; }.growth-graphic b { inset:auto; width:62%; height:62%; left:19%; top:19%; border:1px dashed rgba(22,52,86,.48); border-radius:50%; }.growth-graphic em { display:none; }
.lighting-graphic { width:min(60%, 400px); border-radius:0; background:transparent; }.lighting-graphic::before { inset:0; border:0; border-radius:0; box-shadow:none; background:linear-gradient(28deg, transparent 49.5%, #ffd99f 50% 50.5%, transparent 51%), linear-gradient(-22deg, transparent 49.5%, #d8a15a 50% 50.5%, transparent 51%); clip-path:polygon(0 48%, 43% 48%, 49% 44%, 56% 48%, 100% 16%, 100% 20%, 57% 51%, 100% 79%, 100% 83%, 56% 54%, 49% 58%, 43% 52%, 0 52%); }.lighting-graphic::after { left:45%; top:35%; width:20%; height:30%; border:1px solid #d8a15a; background:rgba(216,161,90,.1); transform:skewX(-24deg); }.lighting-graphic i { inset:29%; border:1px solid rgba(255,217,159,.8); border-radius:50%; animation:refraction 3.6s ease-in-out infinite; }.lighting-graphic b { width:10px; height:10px; border-radius:50%; background:#fff3db; left:48%; top:48%; box-shadow:104px -56px 0 #d8a15a, 112px 62px 0 #d8a15a; }.lighting-graphic em { display:none; }
.systems-graphic { width:min(56%, 380px); transform:none; border:0; background:linear-gradient(30deg, transparent 49.5%, rgba(121,240,192,.7) 50% 50.5%, transparent 51%), linear-gradient(-25deg, transparent 49.5%, rgba(121,240,192,.7) 50% 50.5%, transparent 51%); }.systems-graphic::before, .systems-graphic::after { border:0; background:linear-gradient(90deg, transparent 49.3%, rgba(58,178,141,.8) 50% 50.7%, transparent 51%); }.systems-graphic::before { inset:7% 12%; transform:rotate(27deg); }.systems-graphic::after { inset:15% 4%; transform:rotate(-31deg); }.systems-graphic i { width:15px; height:15px; background:#79f0c0; left:8%; top:46%; box-shadow:112px -76px 0 #79f0c0, 221px -15px 0 #c9fff0, 109px 94px 0 #3ab28d, 251px 86px 0 #79f0c0; animation:routing 2.5s ease-in-out infinite alternate; }.systems-graphic b { width:70%; height:2px; left:13%; top:51%; background:#79f0c0; transform:rotate(-18deg); box-shadow:0 49px 0 rgba(121,240,192,.7); }.systems-graphic em { display:block; width:10px; height:10px; border-radius:50%; background:#c9fff0; left:26%; top:46%; animation:signal 2.2s linear infinite; }
.drafting-graphic { width:min(57%, 385px); background:linear-gradient(#3b4a52 1px, transparent 1px), linear-gradient(90deg, #3b4a52 1px, transparent 1px); background-size:16px 16px; border:1px solid #c8d6db; }.drafting-graphic::before { content:'A101  ·  A201  ·  S301  ·  RFI-024  ·  REV-C'; inset:9%; padding:12px; border:1px solid #c8d6db; color:#c8d6db; font-size:9px; font-style:normal; font-weight:800; letter-spacing:.13em; line-height:2.2; background:linear-gradient(135deg, transparent 49.5%, rgba(200,214,219,.65) 50% 50.5%, transparent 51%); }.drafting-graphic::after { inset:23%; border:1px solid rgba(200,214,219,.75); background:linear-gradient(90deg, transparent 49%, #d8b477 49.5% 50.5%, transparent 51%); }.drafting-graphic i { width:65%; height:1px; left:17%; top:66%; background:#c8d6db; box-shadow:0 -30px 0 rgba(200,214,219,.6), 0 30px 0 rgba(200,214,219,.6); }.drafting-graphic b { width:9px; height:9px; background:#d8b477; left:48%; top:64%; }.drafting-graphic em { width:2px; height:74%; left:50%; top:13%; background:#d8b477; animation:plot 3.2s ease-in-out infinite; }
@keyframes growth-nodes { 50% { filter:brightness(1.25); transform:scale(1.13); } } @keyframes refraction { 50% { transform:translateX(11px) rotate(12deg); } } @keyframes routing { 50% { filter:brightness(1.35); transform:translateX(11px); } } @keyframes signal { to { transform:translateX(172px); opacity:.35; } }
@media (max-width:620px) { .mvp-header { top:14px; left:14px; }.mvp-brand img { width:32px; }.mvp-copy { opacity:1; transform:none; }.mvp-copy strong { font-size:clamp(20px, 7vw, 29px); }.mvp-arrow { opacity:1; transform:none; }.mvp-system-graphic { width:40%; }.mvp-growth .mvp-panel-kicker { left:14px; }.drafting-graphic::before { font-size:5px; padding:5px; } }