@font-face{font-family:Plex Mono;src:url('/trinity-wai/assets/ibm-plex-mono.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Plex Sans;src:url('/trinity-wai/assets/ibm-plex-sans.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:light;--lime:#c5ff01;--ink:#111;--paper:#ececec}
*{box-sizing:border-box}
body{margin:0;background:var(--lime);color:var(--ink);font-family:Plex Sans,Arial,sans-serif;min-width:280px}
.desktop-bar{height:100px;padding:24px 3.8vw;display:flex;align-items:center;gap:30px;border-bottom:2px solid var(--ink);position:relative;z-index:1}
.trinity-wordmark{font-family:Plex Mono,monospace;font-size:19px;line-height:1.04;letter-spacing:-1.1px}
.bar-line{flex:1;border-top:1px solid var(--ink);opacity:.35}
.bar-symbol{font-family:Plex Mono,monospace;font-size:42px;line-height:1}
.desktop{min-height:calc(100svh - 100px);display:grid;place-items:center;padding:64px 6vw 76px;position:relative;overflow:hidden;isolation:isolate}
.wallpaper-eyes{position:absolute;z-index:-1;width:146%;height:auto;max-width:none;left:-22%;top:50%;transform:translateY(-45%);pointer-events:none;user-select:none}
.window{width:min(100%,820px);background:var(--paper);border:2px solid var(--ink);box-shadow:12px 12px 0 var(--ink)}
.window-bar{height:44px;display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:2px solid var(--ink);font:13px Plex Mono,monospace}
.window-status{width:12px;height:12px;border:1.5px solid var(--ink);background:var(--lime)}
.window-lines{margin-left:auto;width:70px;height:14px;background:repeating-linear-gradient(to bottom,var(--ink) 0,var(--ink) 1px,transparent 1px,transparent 4px)}
.window-body{padding:43px 48px 44px}
.headline-row{position:relative}
h1{position:relative;z-index:1;font-weight:400;font-size:clamp(44px,5.5vw,76px);line-height:1.06;letter-spacing:-.07em;margin:0 0 26px;max-width:620px}
h1 span{white-space:nowrap}
.smile{position:absolute;width:80px;height:auto;right:0;bottom:-57px;transform:rotate(-10deg);pointer-events:none}
.intro{font-size:clamp(25px,3vw,34px);line-height:1.16;letter-spacing:-.035em;margin:0 0 32px}
.approach{border-top:1px solid var(--ink);padding-top:23px;margin-bottom:34px}
.approach h2{font:15px/1.5 Plex Mono,monospace;margin:0 0 9px}
.approach p{font-size:19px;line-height:1.45;margin:0;max-width:550px;letter-spacing:-.018em}
.destination{display:flex;justify-content:space-between;align-items:center;gap:18px;background:var(--ink);color:var(--lime);padding:18px 23px;text-decoration:none;font:20px/1.3 Plex Mono,monospace;border:2px solid var(--ink);transition:background .16s,color .16s,transform .16s,box-shadow .16s;min-height:73px}
.destination-arrow{font:36px/1 Plex Sans,Arial,sans-serif;transition:transform .16s}
.destination:hover{background:var(--lime);color:var(--ink);transform:translate(-3px,-3px);box-shadow:3px 3px 0 var(--ink)}
.destination:hover .destination-arrow{transform:translate(2px,-2px)}
.destination:focus-visible{outline:3px solid var(--ink);outline-offset:5px;background:var(--lime);color:var(--ink)}
.destination:active{transform:translate(0,0);box-shadow:none}
@media(min-width:1500px){.desktop{padding-top:80px;padding-bottom:100px}.window{width:880px}.window-body{padding:48px 54px 50px}h1{font-size:82px}}
@media(max-width:600px){.desktop-bar{height:77px;padding:19px 23px;gap:24px}.trinity-wordmark{font-size:16px}.bar-symbol{font-size:34px}.desktop{min-height:calc(100svh - 77px);padding:40px 22px 50px}.window{box-shadow:7px 7px 0 var(--ink)}.window-bar{height:37px;font-size:11px;padding:0 12px}.window-lines{width:43px}.window-body{padding:30px 23px 26px}h1{font-size:clamp(43px,10.5vw,64px);max-width:400px;margin-bottom:24px;letter-spacing:-.065em}.intro{font-size:27px;max-width:230px;margin-bottom:28px}.smile{width:46px;right:0;bottom:-73px}.approach{padding-top:18px;margin-bottom:26px}.approach h2{font-size:12px}.approach p{font-size:17px;line-height:1.45}.destination{font-size:clamp(12px,3.55vw,18px);padding:15px 14px;min-height:64px;gap:8px}.destination-arrow{font-size:28px}.wallpaper-eyes{width:280%;left:-91%;top:52%}}
@media(max-width:360px){.desktop{padding-right:17px;padding-left:17px}.window-body{padding:27px 18px 23px}.smile{width:36px}.intro{font-size:24px}.approach h2{font-size:11px}}
@media(prefers-reduced-motion:reduce){.destination,.destination-arrow{transition:none}}
