/* Single-slide company introduction. All artwork is rendered locally. */
:root { color-scheme: dark; --blue:#21b9ef; --orange:#ff9b36; }
* { box-sizing:border-box; }
html,body { margin:0; min-width:320px; width:100%; min-height:100%; background:#04070b; color:#f4f6fa; }
body { font-family:"ABeeZee",sans-serif; -webkit-font-smoothing:antialiased; }
.big-picture { position:relative; isolation:isolate; width:100%; height:100svh; min-height:540px; overflow:hidden; background:radial-gradient(ellipse at 73% 50%,#0b263b60,transparent 55%),#04070b; }
.big-picture::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,#04070b50,transparent 60%),radial-gradient(ellipse at center,transparent 45%,#04070b80); }
#connections { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.masthead { position:absolute; inset:25px 4.5vw auto; display:flex; align-items:center; gap:20px; z-index:5; }
.brand { display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; font:700 19px "Montserrat",sans-serif; }
.brand img { width:34px; height:46px; object-fit:contain; }
.brand-line { color:#8c9eae; font:10px "Space Mono",monospace; letter-spacing:.2em; padding-left:20px; border-left:1px solid #ffffff24; }
.tools { display:flex; gap:8px; margin-left:auto; opacity:.5; transition:opacity .2s; }.tools:hover,.tools:focus-within { opacity:1; }
button { cursor:pointer; width:36px; height:36px; border:1px solid #ffffff30; background:#07101b70; color:white; border-radius:50%; font-size:13px; display:grid; place-items:center; }
button svg { width:16px; fill:none; stroke:currentColor; stroke-width:1.5; }
a:focus-visible,button:focus-visible { outline:2px solid var(--blue); outline-offset:5px; }
.headline { position:absolute; z-index:2; top:24%; left:6%; pointer-events:none; }
.headline > p { color:var(--orange); font:11px "Space Mono",monospace; letter-spacing:.15em; line-height:1.7; max-width:40vw; margin:0 0 24px 6px; }
h1 { font:800 clamp(65px,8.8vw,170px)/.87 "Montserrat",sans-serif; letter-spacing:-.075em; margin:0; }
h1 span { color:transparent; -webkit-text-stroke:1px #b7d9edc7; text-shadow:0 0 55px #21b9ef10; }
.constellation { position:absolute; width:53vw; height:70vh; top:13%; right:0; margin:0; pointer-events:none; }
.ai-core { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:130px; height:130px; border-radius:50%; border:1px solid #a4e9ff80; background:radial-gradient(circle at 35% 25%,#175273,#061422 75%); box-shadow:0 0 35px #21b9ef35,inset 0 0 25px #21b9ef25,0 0 100px #21b9ef10; display:flex; flex-direction:column; align-items:center; justify-content:center; font:700 49px/1 "Montserrat",sans-serif; letter-spacing:-.06em; }
.node-label { position:absolute; color:#8db2c9; font:9px "Space Mono",monospace; letter-spacing:.13em; padding:7px 10px; border-left:1px solid #21b9ef65; background:#040b1280; }
.label-one { top:11%; left:29%; }.label-two { top:27%; right:7%; }.label-three { top:65%; right:7%; }.label-four { bottom:8%; left:42%; color:#ffc280; border-color:#ff9b3680; }.label-five { top:67%; left:9%; }.label-six { top:30%; left:4%; }
.statement { position:absolute; left:6%; right:6%; bottom:6%; display:flex; justify-content:space-between; align-items:end; gap:20px; border-top:1px solid #a3c7dd26; padding-top:24px; }
.equation-label { color:#758e9f; font:8px "Space Mono",monospace; letter-spacing:.17em; }
.statement div p { font:600 clamp(25px,3vw,52px)/1.1 "Montserrat",sans-serif; letter-spacing:-.05em; margin:12px 0 0; }.statement div p > span { color:var(--blue); }.statement div p > .full-stop { color:var(--orange); }
.payoff { font-size:clamp(12px,1.1vw,18px); line-height:1.7; color:#8ba8bb; margin:0 0 1px; }.payoff strong { color:#ebf3f9; font-weight:400; }
.no-script { position:absolute; top:68%; left:6%; color:#8ba8bb; }
@media(min-width:1600px) { .ai-core { width:170px; height:170px; font-size:65px; }.node-label { font-size:11px; } }
@media(max-width:700px) { .masthead { inset:18px 6% auto; }.brand-line { display:none; }.headline { top:19%; }.headline>p { font-size:9px; max-width:86vw; margin:0 0 18px 3px; }h1 { font-size:clamp(58px,13vw,92px); }.constellation { width:100%; height:49%; top:36%; right:0; }.ai-core { width:88px; height:88px; font-size:34px; }.node-label { font-size:7px; padding:5px 6px; }.label-one { left:33%; top:7%; }.label-two { right:6%; }.label-three { right:3%; }.label-four { bottom:5%; }.label-five { left:9%; }.label-six { left:5%; }.statement { bottom:4%; padding-top:17px; }.equation-label { font-size:6px; letter-spacing:.07em; }.statement div p { font-size:27px; }.payoff { font-size:10px; } }
@media(max-height:560px) and (min-width:701px) { .big-picture { min-height:0; } .masthead { top:12px; }.headline { top:25%; }h1 { font-size:15vh; }.headline>p { margin-bottom:15px; }.statement { bottom:5%; padding-top:12px; }.statement div p { font-size:27px; }.ai-core { width:90px; height:90px; font-size:35px; }.node-label { font-size:7px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none !important; } }
@media print { .big-picture { height:18cm; print-color-adjust:exact; -webkit-print-color-adjust:exact; }.tools { display:none; } }
