:root{color-scheme:dark;--green:#8bffaf;--muted:#82958b;--bg:#050807}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{color:#e2e9e3;font-family:'IBM Plex Mono',monospace}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:8px}.hero{min-height:760px;height:100svh;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#0d2117 0,transparent 58%)}.header{position:absolute;top:0;left:0;width:100%;padding:32px 4.3%;display:flex;align-items:center;justify-content:space-between;z-index:5;border-bottom:1px solid #b7f4cc12}.monogram{font-size:23px;font-weight:500;letter-spacing:-3px}.monogram span{color:var(--green);font-weight:400;padding:0 7px}.domain{font-size:12px;letter-spacing:2px;color:#a7b5ac}.contact-trigger{background:none;border:0;font-size:12px;letter-spacing:1px;cursor:pointer;padding:9px 0}.contact-icon{display:inline-block;color:var(--green);margin-left:17px;font-size:20px;vertical-align:-2px}.coordinates{position:absolute;top:145px;left:4.3%;right:4.3%;display:flex;justify-content:space-between;font-size:11px;letter-spacing:1.5px;color:#7c9c87;z-index:3}.wordmark{position:absolute;top:14%;left:50%;transform:translateX(-50%);margin:0;width:94%;font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:clamp(80px,17.5vw,310px);line-height:1.04;font-weight:600;letter-spacing:-.018em;text-align:center;color:#c9d7ca;z-index:0}.portrait{position:absolute;inset:0;z-index:1;pointer-events:none;mask-image:linear-gradient(to bottom,transparent 12%,#000 25%,#000 78%,transparent 99%)}.portrait img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 50%;mix-blend-mode:lighten}.portrait{mix-blend-mode:lighten}.grain{position:absolute;inset:0;z-index:4;opacity:.12;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.2' d='M0 0h200v200H0z'/%3E%3C/svg%3E")}.code{position:absolute;z-index:3;font-size:11px;line-height:1.9;letter-spacing:.4px;color:#668f73}.code span{color:#395a44}.code-left{left:7%;top:48%}.code-right{right:6%;top:57%;text-align:right}.face-zone{position:absolute;z-index:6;left:50%;top:36%;transform:translate(-50%,-50%);width:230px;height:190px;display:flex;align-items:center;justify-content:center}.face-target{position:absolute;inset:0;width:100%;background:none;border:0;cursor:crosshair}.corner{position:absolute;width:10px;height:10px;border-color:#82ffab70;border-style:solid;transition:width .6s,height .6s,border-color .6s}.tl{top:0;left:0;border-width:1px 0 0 1px}.tr{top:0;right:0;border-width:1px 1px 0 0}.bl{bottom:0;left:0;border-width:0 0 1px 1px}.br{bottom:0;right:0;border-width:0 1px 1px 0}.target-line{position:absolute;left:42%;top:50%;width:16%;height:1px;background:#8bffaf44;box-shadow:0 0 15px #68ffb25c}.reveal{position:relative;display:flex;flex-direction:column;align-items:center;gap:15px;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .4s;white-space:nowrap;pointer-events:none;background:radial-gradient(ellipse,#020906f5 25%,#020906bd 55%,transparent 75%);padding:50px 40px}.reveal-label,.reveal-foot{font-size:9px;letter-spacing:2px;color:#69ac80}.reveal a{font-size:19px;color:var(--green);text-shadow:0 0 18px #32ff6d70;letter-spacing:-.6px;padding:10px 0;border-bottom:1px solid #72ff9b55}.active .reveal{opacity:1;transform:none;pointer-events:auto}.active .target-line{opacity:0}.active .corner{border-color:var(--green);width:18px;height:18px}.intro{position:absolute;left:4.3%;bottom:135px;z-index:3}.eyebrow{font-size:10px;letter-spacing:2px;color:#7e9d88}.intro p{font-family:Arial,sans-serif;font-weight:400;font-size:clamp(26px,3vw,48px);line-height:1.15;letter-spacing:-1.4px;margin:20px 0 0}.interaction-note{position:absolute;right:6%;bottom:140px;z-index:3}.note-rule{display:block;width:28px;height:1px;background:var(--green);margin-bottom:18px}.interaction-note p{font-size:14px;line-height:1.6;margin:0 0 16px}.interaction-note p span{color:#84938a}.note-small{font-size:9px;letter-spacing:1.4px;color:#83aa90}footer{position:absolute;bottom:0;left:4.3%;right:4.3%;height:73px;border-top:1px solid #bbf7c922;display:flex;align-items:center;justify-content:space-between;color:#819487;font-size:10px;letter-spacing:1.1px;z-index:4}.footer-center{color:#4f6c58}.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(min-aspect-ratio:17/10){.portrait img{object-fit:contain}.face-zone{top:36%}}@media(max-width:700px){.hero{min-height:720px}.header{padding:23px 6%}.domain{display:none}.contact-trigger{font-size:10px}.coordinates{top:104px;left:6%;right:6%;font-size:9px}.coordinates span:last-child{display:none}.wordmark{top:19%;width:96%;font-size:18vw}.portrait{inset:6% -50% 0;mask-image:linear-gradient(to bottom,transparent 7%,#000 22%,#000 72%,transparent 94%)}.portrait img{object-fit:cover}.face-zone{top:39.5%;width:170px;height:170px}.reveal a{font-size:17px}.code-left{top:58%;left:6%;font-size:9px}.code-right{display:none}.intro{left:6%;bottom:133px}.intro p{font-size:29px}.eyebrow{font-size:9px;letter-spacing:1px}.interaction-note{right:6%;bottom:137px;max-width:120px}.interaction-note p{font-size:12px}.note-small{font-size:8px;letter-spacing:1px;line-height:1.8;display:block}.footer-center{display:none}footer{left:6%;right:6%;font-size:9px;height:65px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
:root .portrait{inset:20% 0 -15%;mix-blend-mode:normal;mask-image:linear-gradient(to bottom,transparent 0%,#000 13%,#000 70%,transparent 96%)}
:root .portrait img{mix-blend-mode:normal;object-fit:contain}
:root .face-zone{top:53%}
@media(max-width:700px){:root .portrait{inset:22% -50% -2%}:root .portrait img{object-fit:cover}:root .face-zone{top:49%}}

.header{display:grid;grid-template-columns:1fr auto 1fr}.header .domain{grid-column:2}.header .contact-trigger{grid-column:3;justify-self:end}
