@font-face{font-family:Editorial;src:url('/assets/editorial.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/sans.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:light;--ivory:#f8f7f3;--cream:#f1ede7;--stone:#e6e0d7;--charcoal:#45484a;--secondary:#64676a;--blue:#a4bcce;--coral:#e5a194;--gold:#ebcb83}
*{box-sizing:border-box}html{background:var(--ivory)}body{margin:0;color:var(--charcoal);font-family:Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}::selection{background:#a4bcce66;color:#45484a}a{color:inherit}.page{isolation:isolate;min-height:100svh;min-height:100dvh;min-height:max(620px,100svh);display:flex;flex-direction:column;position:relative;overflow:hidden;background:linear-gradient(118deg,var(--ivory) 10%,#f7f5f0 76%,var(--cream))}.masthead{height:124px;display:flex;align-items:center;padding:0 5.5vw;position:relative;z-index:2;flex-shrink:0}.wordmark{font-size:11px;letter-spacing:.22em;text-decoration:none;padding:10px 0;line-height:1.6}.wordmark:focus-visible{outline:1px solid var(--charcoal);outline-offset:8px}
.hero{display:flex;align-items:center;flex:1;position:relative;z-index:2;padding:30px 0 82px;pointer-events:none}.hero-copy{margin-left:12.2vw;max-width:650px;position:relative}h1{font:400 clamp(76px,7.55vw,122px)/.89 Editorial,Georgia,serif;letter-spacing:-.047em;margin:0 0 32px}h1 span{display:block;padding-bottom:.075em;margin-bottom:-.075em}.intro{font-size:clamp(13px,1.12vw,17px);line-height:1.8;letter-spacing:-.015em;margin:0;color:#56595b}
.artwork{position:absolute;z-index:1;inset:0;pointer-events:none;overflow:hidden}.art-parallax{width:100%;height:100%;transform:translate3d(var(--parallax-x,0px),var(--parallax-y,0px),0);transition:transform 2.8s cubic-bezier(.2,.7,.2,1)}.fluid-art{position:absolute;width:clamp(760px,88vw,1680px);height:auto;right:-12vw;top:50%;transform:translateY(-50%);overflow:visible}.surface{transform-box:view-box;transform-origin:75% 50%}.surface-ivory{opacity:.9}.surface-blue{opacity:.88}.surface-coral{opacity:.86}
.skip-link{position:fixed;left:20px;top:12px;padding:12px 18px;background:var(--charcoal);color:var(--ivory);z-index:10;transform:translateY(-200%);font-size:13px}.skip-link:focus{transform:none}
@media(prefers-reduced-motion:no-preference){.entrance{animation:entrance 1.6s ease-out both}.masthead{animation-delay:.05s}h1{animation:entrance 1.8s cubic-bezier(.2,.65,.2,1) both;animation-delay:.15s}.intro{animation-delay:.35s}.artwork{animation:art-entrance 2.4s ease-out both}.surface-ivory{animation:ivory-drift 31s ease-in-out infinite alternate}.surface-blue{animation:blue-drift 26s ease-in-out infinite alternate}.surface-coral{animation:coral-drift 29s ease-in-out infinite alternate}@keyframes entrance{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes art-entrance{from{opacity:0}to{opacity:1}}@keyframes ivory-drift{to{transform:translate(calc(var(--surface-x,0px) - 3px),calc(var(--surface-y,0px) + 4px));opacity:.83}}@keyframes blue-drift{to{transform:translate(calc(var(--surface-x,0px) + 4px),calc(var(--surface-y,0px) - 5px));opacity:.8}}@keyframes coral-drift{to{transform:translate(calc(var(--surface-x,0px) - 4px),calc(var(--surface-y,0px) + 3px));opacity:.78}}}
@media(min-width:1800px){.hero-copy{margin-left:max(12.2vw,calc((100vw - 1360px)/2))}}
@media(max-width:1000px) and (min-width:701px){.hero-copy{margin-left:9vw}.fluid-art{width:105vw;right:-37vw}.hero{padding-bottom:64px}h1{font-size:9vw}.intro{font-size:13px}}
@media(max-width:700px){.page{min-height:100svh}.masthead{height:100px;padding-inline:8vw}.wordmark{font-size:10px;letter-spacing:.2em}.hero{align-items:flex-start;padding:clamp(38px,8svh,72px) 8vw 180px}.hero-copy{margin:0;max-width:100%}h1{font-size:clamp(65px,16vw,98px);line-height:.92;letter-spacing:-.047em;margin-bottom:25px}.intro{font-size:12px;line-height:1.9;letter-spacing:-.025em}.fluid-art{width:880px;max-width:none;right:calc(50% - 365px);top:auto;bottom:-200px;transform:none}.surface-ivory{--surface-x:-25px;--surface-y:10px;transform:translate(-25px,10px);opacity:.82}.surface-blue{--surface-x:10px;--surface-y:20px;transform:translate(10px,20px);opacity:.82}.surface-coral{--surface-x:-10px;--surface-y:-40px;transform:translate(-10px,-40px);opacity:.8}}
@media(max-width:700px) and (min-height:850px){.hero{padding-top:13svh}.fluid-art{bottom:-170px}}
@media(max-width:370px){.hero{padding-top:38px;padding-bottom:150px}h1{font-size:18vw}.intro{font-size:11px}.fluid-art{width:800px;right:calc(50% - 340px);bottom:-200px}}
@media(max-height:560px) and (min-width:701px){.page{min-height:100svh}.masthead{height:78px}.hero{padding:20px 0 30px}h1{font-size:72px;margin-bottom:20px}.intro{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.art-parallax{transform:none!important}}

@media(max-width:700px) and (max-height:700px){.masthead{height:80px}.hero{padding-top:34px;padding-bottom:130px}.fluid-art{bottom:-240px}}
@media(max-width:700px) and (max-height:500px){.masthead{height:65px}.hero{padding:10px 8vw 50px}h1{font-size:60px;margin-bottom:18px}.intro{font-size:11px}.fluid-art{right:-200px;bottom:-400px}}

/* A suspended nameplate: fine suspension wires and a visible pendulum motion. */
.hanging-name{position:absolute;top:0;left:5.5vw;padding:49px 0 0;transform-origin:50% 0;}
.hanging-name::before,.hanging-name::after{content:"";position:absolute;top:0;width:1px;height:50px;background:linear-gradient(#45484a25,#45484a70);}
.hanging-name::before{left:19px}.hanging-name::after{right:19px}
.nameplate{display:block;padding:12px 17px;border:1px solid #45484a40;background:#f8f7f3d9;box-shadow:0 3px 8px #45484a04;line-height:1.6;}
.hanging-name:focus-visible{outline:none}.hanging-name:focus-visible .nameplate{outline:1px solid var(--charcoal);outline-offset:5px}
@media(prefers-reduced-motion:no-preference){.hanging-name{animation:name-sway 3.2s ease-in-out -.8s infinite}@keyframes name-sway{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}}
@media(max-width:700px){.hanging-name{left:8vw;padding-top:34px}.hanging-name::before,.hanging-name::after{height:35px}.nameplate{padding:10px 14px}}
@media(max-width:700px) and (max-height:500px){.hanging-name{padding-top:17px}.hanging-name::before,.hanging-name::after{height:18px}.nameplate{padding:8px 12px}}
