@font-face{font-family:Inter;src:url('./font-400/font.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Inter;src:url('./font-600/font.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--paper:#eeeee6;--ink:#20251e;--green:#244d36;--yellow:#e7ef83;--pink:#eebbb4;--lavender:#c9c5e7;--pad:48px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #244d36;outline-offset:5px}.skip{position:absolute;left:12px;top:-70px;background:var(--ink);color:white;padding:10px;z-index:10}.skip:focus{top:12px}header{height:88px;margin:0 var(--pad);border-bottom:1px solid #a9ada0;display:flex;justify-content:space-between;align-items:center}.brand{font-size:30px;letter-spacing:-1.8px;font-weight:600;display:flex;align-items:center;gap:12px}.mark{font-size:47px;line-height:1;color:var(--green);letter-spacing:0}nav{display:flex;gap:40px;font-size:14px}nav a{padding:12px 0}nav span{margin-left:13px}main{padding:0 var(--pad)}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;padding:29px 0 35px}.eyebrow,.art-index,.section-line>span{font-size:11px;letter-spacing:1px}.eyebrow{margin:0 0 18px}h1{font-size:clamp(48px,5.8vw,84px);font-weight:400;line-height:1.02;letter-spacing:-5px;margin:0}h1 span{font-weight:600}.purpose{max-width:310px;font-size:19px;line-height:1.5;margin:0 0 5px}.section-line{display:flex;align-items:center;justify-content:space-between;padding:16px 0 18px;border-top:1px solid #a9ada0}h2{font-size:16px;font-weight:400;margin:0}.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.project-open{border:0;background:none;padding:0;text-align:left;display:block;width:100%}.art{height:238px;position:relative;overflow:hidden;isolation:isolate}.art-index{position:absolute;left:20px;top:16px;z-index:2}.listening{background:var(--yellow)}.orchard{background:var(--green);color:var(--yellow)}.table{background:var(--pink)}.ring{position:absolute;border:2px solid var(--green);border-radius:50%;left:50%;top:53%;transform:translate(-50%,-50%);transition:transform .7s cubic-bezier(.2,.8,.2,1)}.r1{width:280px;height:180px}.r2{width:220px;height:140px}.r3{width:160px;height:100px}.r4{width:100px;height:60px}.dot{position:absolute;left:calc(50% - 16px);top:calc(53% - 10px);width:32px;height:20px;border-radius:50%;background:var(--green)}.light{position:absolute;width:27px;background:var(--yellow);border-radius:16px 16px 0 0;bottom:0;transform-origin:bottom;transition:transform .7s}.light:before{content:"";position:absolute;width:55px;height:55px;background:var(--yellow);border-radius:50%;left:-14px;top:-25px}.l1{height:85px;left:14%;transform:rotate(-12deg)}.l2{height:145px;left:32%;transform:rotate(7deg)}.l3{height:100px;left:51%;transform:rotate(-5deg)}.l4{height:165px;left:70%;transform:rotate(15deg)}.l5{height:63px;left:87%;transform:rotate(-12deg)}.tile{position:absolute;width:100px;height:100px;background:var(--green);transition:transform .7s}.t1{left:13%;top:70px;border-radius:50% 50% 0 50%;transform:rotate(-12deg)}.t2{left:37%;top:95px;background:var(--yellow);transform:rotate(8deg)}.t3{left:61%;top:69px;border-radius:50%;transform:rotate(20deg)}.t4{left:24%;top:153px;width:70px;height:70px;background:var(--lavender);border-radius:50%}.t5{left:60%;top:157px;width:70px;height:70px;background:var(--ink);border-radius:0 50% 0 0}.enter{position:absolute;right:14px;bottom:14px;padding:6px 11px;border-radius:20px;background:var(--paper);color:var(--ink);font-size:11px;z-index:3}.enter span{margin-left:8px}.project-title{display:flex;align-items:center;justify-content:space-between;padding-top:13px}.project-title h3{font-size:24px;font-weight:400;letter-spacing:-.8px;margin:0}.project-title>span{font-size:25px}.project>p{font-size:14px;max-width:345px;line-height:1.5;margin:5px 0 0}.project-open:hover .ring,.project-open:focus-visible .ring{transform:translate(-50%,-50%) rotate(-20deg) scale(.9,1.1)}.project-open:hover .light,.project-open:focus-visible .light{transform:rotate(-12deg)}.project-open:hover .tile,.project-open:focus-visible .tile{transform:rotate(24deg)}footer{margin:30px var(--pad) 0;border-top:1px solid #a9ada0;padding:21px 0 22px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}footer p{font-size:12px;margin:0 0 5px}.conversation{font-size:29px;letter-spacing:-1px}.conversation span{margin-left:20px}.contact-meta{text-align:right;font-size:14px}.contact-meta p{font-size:10px;margin:10px 0 0}dialog{padding:0;border:0;background:var(--paper);color:var(--ink);max-width:650px;width:calc(100% - 32px);max-height:calc(100% - 32px);box-shadow:0 10px 100px #0004}dialog::backdrop{background:#20251ebf;backdrop-filter:blur(5px)}.dialog-top{padding:16px 24px;display:flex;align-items:center;justify-content:space-between;font-size:12px}.dialog-top button{border:0;background:none;min-height:44px;padding:6px 0 6px 16px}.dialog-top button span{font-size:24px;margin-left:12px}.dialog-art{height:240px;overflow:hidden;position:relative}.dialog-art .art{height:100%}.dialog-art .art-index,.dialog-art .enter{display:none}.dialog-content{padding:24px}.dialog-content h2{font-size:36px;letter-spacing:-1.2px;line-height:1.1}.dialog-content>p{font-size:17px;max-width:450px}.dialog-content #rearrange{background:var(--ink);color:var(--paper);border:0;padding:13px 18px;border-radius:30px;font-size:14px}.dialog-content #rearrange span{margin-left:20px}.dialog-content .pattern-status{font-size:11px;display:inline-block;margin-left:12px}.dialog-art[data-pattern="1"] .ring{transform:translate(-50%,-50%) rotate(-30deg) scale(1.1,.8)}.dialog-art[data-pattern="1"] .light{transform:rotate(-20deg)}.dialog-art[data-pattern="1"] .tile{transform:rotate(50deg)}.dialog-art[data-pattern="2"] .ring{transform:translate(-50%,-50%) rotate(35deg) scale(.8,1.1)}.dialog-art[data-pattern="2"] .light{transform:rotate(25deg)}.dialog-art[data-pattern="2"] .tile{transform:rotate(-30deg)}
@media(min-width:1600px){body{max-width:1600px;margin:auto}}@media(max-width:700px){:root{--pad:20px}header{height:78px}.brand{font-size:26px}.mark{font-size:38px}nav{gap:22px;font-size:12px}nav a:first-child{display:none}nav span{margin-left:6px}.intro{display:block;padding:28px 0 26px}.eyebrow{font-size:9px;margin-bottom:20px;letter-spacing:.9px}h1{font-size:48px;letter-spacing:-2.9px;line-height:1.05}.purpose{font-size:16px;max-width:310px;margin:23px 0 0;line-height:1.5}.section-line{padding:15px 0}h2{font-size:14px}.section-line>span{font-size:10px}.projects{grid-template-columns:1fr;gap:27px}.art{height:235px}.project-title h3{font-size:25px}.project>p{font-size:14px;max-width:315px}.project-title{padding-top:11px}footer{margin-top:31px;display:block;padding:24px 0 30px}.conversation{font-size:26px}.conversation span{margin-left:8px}.contact-meta{text-align:left;margin-top:27px}.contact-meta p{font-size:10px}.dialog-top{padding:8px 20px}.dialog-art{height:200px}.dialog-content{padding:22px}.dialog-content h2{font-size:30px}.dialog-content>p{font-size:16px}.dialog-content .pattern-status{display:block;margin:12px 0 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
