:root{--paper:#e9edf3;--ink:#3c3c48}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;padding:20px;background:#fff;color:var(--ink);font-family:'Helvetica Neue',Arial,sans-serif;font-weight:300}main{background:var(--paper)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.preview-bar{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.04em;padding:0 0 16px;gap:12px}.preview-bar button{background:transparent;color:var(--ink);border:1px solid #b2b6c1;padding:8px 15px;border-radius:24px}nav{display:flex;justify-content:center;gap:24px;padding:50px 20px 0;font-size:13px;letter-spacing:.06em;text-transform:uppercase}nav a{opacity:.65}nav a:first-child{opacity:1}.hero{text-align:center;padding:120px 24px 130px}.hero h1{font-family:Didot,'Bodoni MT','Times New Roman',serif;font-size:clamp(100px,12vw,185px);font-weight:700;letter-spacing:-.045em;line-height:.87;margin:0 0 85px}.hero p{font-size:16px;line-height:1.9;max-width:650px;margin:auto;font-weight:300}.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;padding:0 40px 180px;max-width:1800px;margin:auto}.project{min-width:0;perspective:1200px}.project>a{display:block}.art{position:relative;aspect-ratio:1/1.16;perspective:1000px;container-type:inline-size}.caption{text-align:center;position:relative;z-index:2;margin-top:20px}.caption h2{font-family:Didot,'Bodoni MT','Times New Roman',serif;font-size:clamp(34px,4.5vw,75px);font-weight:700;line-height:.83;letter-spacing:-.055em;margin:0 0 18px}.caption h2 span{background:#fff;padding:0 6px;box-decoration-break:clone}.caption p{font-family:'Arial Narrow',Arial,sans-serif;text-transform:uppercase;letter-spacing:-.025em;font-size:clamp(13px,1.5vw,23px);line-height:1.2;color:#80828a;max-width:95%;margin:0 auto}.gen-orbit,.house-disc{position:absolute;inset:0;will-change:transform}.gen-crop{width:100%;aspect-ratio:750/695;overflow:hidden;position:absolute;top:9%;left:0}.gen-crop img{width:100%;display:block}.house-crop{width:100%;aspect-ratio:750/830;overflow:hidden;position:absolute;top:1%;left:0}.house-crop img{width:100%;display:block}.phone{position:absolute;top:1%;left:9%;width:53%;border:6px solid #fcfcfe;border-radius:15% / 7%;background:#17181d;overflow:hidden;will-change:transform;box-shadow:0 2px 0 #bdc2cb}.screen{overflow:hidden;aspect-ratio:276/598;border-radius:12% / 6%;background:#19191f}.screen img{display:block;width:100%;height:100%;object-fit:cover}.phone-shadow{position:absolute;top:93%;left:6%;width:61%;height:4%;background:#242739;border-radius:50%;filter:blur(13px);opacity:.13}.game{position:absolute;left:42%;top:39%;width:52%;aspect-ratio:1;display:flex;flex-direction:column;justify-content:space-between;padding:6%;border-radius:13%;color:#fff;background:linear-gradient(140deg,#ff5818,#f48820 60%,#e9af33);transform:rotate(9deg);will-change:transform;box-shadow:0 1px 0 #df8a24}.game span{font-weight:700;font-size:4.7cqw;white-space:nowrap;letter-spacing:-.03em}.game strong{font-size:14cqw;line-height:1;font-weight:700;letter-spacing:-.06em}.card-shadow{position:absolute;left:40%;top:46%;width:51%;aspect-ratio:1;background:#242739;border-radius:13%;filter:blur(17px);opacity:.13;transform:rotate(9deg);will-change:transform}.gen .art{transform:translateY(12px)}.house .art{transform:translateY(30px)}footer{min-height:45vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-top:1px solid #d8dce3;font-size:13px}footer p{color:#858894;font-size:11px;text-transform:uppercase;letter-spacing:.12em}a:focus-visible,button:focus-visible{outline:2px solid #086d79;outline-offset:6px}@media(max-width:900px){.projects{gap:16px;padding:0 22px 120px}.phone{border-width:4px}.hero{padding-top:95px}.caption h2{font-size:4.8vw}}@media(max-width:650px){body{padding:12px}.preview-bar{font-size:11px}nav{padding-top:25px;gap:18px;font-size:11px}.hero{padding:70px 22px 100px}.hero h1{font-size:22vw;margin-bottom:40px}.hero p{font-size:15px;line-height:1.75}.projects{grid-template-columns:1fr;gap:100px;padding:0 28px 120px}.project{max-width:430px;width:100%;margin:auto}.caption h2{font-size:clamp(48px,12vw,75px)}.caption p{font-size:18px}.house .art,.gen .art{transform:none}.phone{border-width:6px}.art{aspect-ratio:1/1.18}footer{min-height:35vh}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}

/* Round 2: source typography and grounded Open House Chicago. */
@font-face{font-family:'Abril Fatface';src:url('assets/abril-fatface.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Bebas Neue';src:url('assets/bebas-neue.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.caption h2{font-family:'K22 Didoni',serif;font-weight:400;color:#3b3d49;letter-spacing:0;line-height:.84;margin-bottom:14px}
.caption h2 br{display:none}
.caption h2 span{display:block;padding:0;line-height:inherit;background:#fff}
.caption p{font-family:'Bebas Neue',sans-serif;font-weight:400;color:#87878f;line-height:1.02;letter-spacing:0;max-width:none}
.caption p span{display:block;white-space:nowrap}
.house .art{transform:none}
.house-disc{inset:auto;left:1%;top:13%;width:98%;aspect-ratio:1;transform-origin:50% 97%;will-change:transform}
.house-disc>img{width:100%;display:block}
.house-ground{position:absolute;left:11%;top:89.5%;width:77%;height:4%;background:#20232b;border-radius:50%;filter:blur(8px);opacity:.23}
.house-stamp{position:absolute;left:63%;top:4%;width:34%;aspect-ratio:1;will-change:transform;filter:drop-shadow(0 5px 5px #24273918)}
.stamp-crop{position:absolute;inset:0;overflow:hidden;border-radius:50%;background:#fff}
.stamp-crop img{position:absolute;width:294.12%;max-width:none;left:-178.43%;top:-19.6%;height:auto;pointer-events:none}

.caption{container-type:inline-size}.caption h2{line-height:.80}.caption h2 span+span{margin-top:.533333cqw}.house-stamp>img{display:block;width:100%;height:auto}

/* Round 3: consistent lockups and contact shadows. */
.caption h2{line-height:.84;background:none}
.caption h2 span{background:#fff;line-height:.84}
.caption h2 span+span{margin-top:.8cqw}
.caption p span{border-bottom:1px solid rgba(255,255,255,.82);padding-bottom:.25cqw}
.caption p span+span{padding-top:.15cqw}
.house-ground{top:89.1%;left:10%;width:79%;height:5%;filter:blur(10px);opacity:.24}
.house-contact{position:absolute;left:35%;top:90.5%;width:32%;height:1.25%;border-radius:50%;background:#171b24;filter:blur(2.6px);opacity:.48}

@font-face{font-family:'K22 Didoni';src:url('assets/k22-didoni.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.caption h2 span+span{margin-top:1.2cqw}
.caption h2 span~span{margin-top:1.2cqw}

/* Typography recovered from the layered source document. */
@font-face{font-family:'Trade Gothic Condensed';src:url('assets/trade-gothic-bold-condensed-20.otf') format('opentype');font-style:normal;font-weight:700;font-display:swap}
.caption h2{line-height:.8461538462}.caption h2 span{line-height:inherit}
.caption p{font-family:'Trade Gothic Condensed',sans-serif;font-weight:700;line-height:.90}

/* Tighter OHC contact: dark core with a short, soft falloff. */
.house-ground{left:22%;top:90.3%;width:58%;height:2.3%;filter:blur(5px);opacity:.25}
.house-contact{left:33%;top:90.5%;width:36%;height:1.35%;filter:blur(2px);opacity:.65}

/* Original shadow pixels, masked from the source artwork. */
.house-original-shadow{position:absolute;left:-3%;top:-2%;width:106%;aspect-ratio:750/1250;pointer-events:none;clip-path:inset(61.44% 0 36% 0);-webkit-mask-image:linear-gradient(to bottom,transparent 61.44%,#000 61.6%,#000 64%,transparent 64%);mask-image:linear-gradient(to bottom,transparent 61.44%,#000 61.6%,#000 64%,transparent 64%)}
.house-original-shadow img{width:100%;height:auto;display:block}
.house-original-shadow{clip-path:inset(58.4% 0 35.2% 0);-webkit-mask-image:radial-gradient(ellipse 38% 2.8% at 50% 61.6%,#000 50%,transparent 100%);mask-image:radial-gradient(ellipse 38% 2.8% at 50% 61.6%,#000 50%,transparent 100%)}

/* Stable baseline positions, with individual optical pair adjustments. */
.caption h2>.name-line{height:.78em;line-height:1;display:flex;align-items:center;justify-content:center;position:relative}
.caption h2 .name-ink{display:inline-block;background:none;padding:0;margin:0;line-height:1;white-space:pre;transform:translateY(.105em)}
.caption h2 .glyph{display:inline;background:none;padding:0;margin:0;line-height:inherit}
.caption h2 .glyph~.glyph,.caption h2 .name-ink~.name-ink{margin-top:0}

/* Opening headline shares the portfolio's K22 face. */
.hero h1{font-family:'K22 Didoni',serif;font-weight:400;letter-spacing:-.055em;line-height:.88;color:#3b3d49}

/* Crop the supplied screenshot's iOS status bar in the phone viewport. */
.screen img{height:107%;width:100%;max-width:none;object-fit:fill;transform:translateY(-6.54%)}

.preview-bar{flex-wrap:wrap}.preview-bar>span{margin-right:auto}.preview-bar button[hidden]{display:none}.tilt-status{font-size:12px;margin:0 0 12px;color:#646772}.tilt-status:empty{display:none}

/* Explicit artwork crop avoids intrinsic image height exposing baked-in text in Safari. */
.gen-crop{aspect-ratio:auto;height:0;padding-bottom:92.666667%;overflow:hidden}
.gen-crop img{position:absolute;top:0;left:0;width:100%;height:auto}

.hero-ai-break{display:none}@media(max-width:650px){.hero-ai-break{display:block}}

/* Optical pair corrections for the opening headline. */
.hero-word{white-space:nowrap}.hero h1 .kern-tight{margin-left:-.018em}.hero h1 .kern-loose{margin-left:.012em}.hero h1 .kern-tighter{margin-left:-.034em}

/* Cursor-reactive dot field behind the hero and projects. */
.bg-field{position:fixed;left:0;top:0;pointer-events:none;z-index:0}main>*:not(.bg-field){position:relative;z-index:1}

/* Per-letter headline physics (shove + wobble). */
.hero h1 .g{display:inline-block;will-change:transform}
.hero h1 .kern-ft{margin-left:-.105em}

/* Tighter gap between the subline and the first project. */
.hero{padding-bottom:80px}@media(max-width:650px){.hero{padding-bottom:36px}}