@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--gold:#edd193;--muted:#a7b9aa;--cream:#f8edcd;--forest:#0b1918}*{box-sizing:border-box}body{margin:0;background:var(--forest);color:var(--cream);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}header{height:100px;position:absolute;top:0;left:0;width:100%;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:linear-gradient(#071413cc,transparent)}.wordmark{display:flex;align-items:center;gap:16px;font:700 38px 'Cormorant Garamond',Georgia,serif;color:var(--gold)}.wordmark>span{font:700 16px 'DM Sans',sans-serif;letter-spacing:2px}.wordmark small{display:block;font-size:10px;letter-spacing:2.5px;font-weight:400;margin-top:6px}.project-status{font-size:13px;letter-spacing:1px;border:1px solid #cfbb7938;border-radius:30px;padding:9px 16px;color:#dfd9bc}#motion{background:none;border:0;font-size:12px;color:#b6c5b4;padding:12px}main{position:relative;max-width:1800px;margin:auto}.intro{position:absolute;z-index:3;top:118px;left:6%;pointer-events:none}.eyebrow{font-size:11px;letter-spacing:3px;color:#c6d6b9}h1{font:500 clamp(40px,5vw,74px)/.96 'Cormorant Garamond',Georgia,serif;margin:16px 0 18px;text-shadow:0 3px 20px #071410}h1 em{font-style:normal;color:var(--gold)}.intro p{font-size:14px;color:#d7dfcf}.world{position:relative;aspect-ratio:3/2;max-height:1050px;min-height:710px;overflow:hidden;background:#173126}.forest{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;display:block}.vignette{position:absolute;inset:0;background:linear-gradient(90deg,#071411a1,transparent 40%),linear-gradient(0deg,#0b1918,transparent 24%,transparent 78%,#08181655);pointer-events:none}.doors{position:absolute;inset:0}.door{position:absolute;top:32%;width:18%;height:33%;padding:0 5px 10px;transform:translateX(-50%);border:0;background:transparent;display:flex;align-items:center;justify-content:flex-end;flex-direction:column;text-shadow:0 2px 10px #000,0 0 6px #000;transition:filter .2s}.door:nth-child(1){left:34%;--accent:#f6ce85}.door:nth-child(2){left:54%;--accent:#bfebb0}.door:nth-child(3){left:75%;--accent:#e9b674}.door:before{content:'';position:absolute;inset:0;border:1px solid transparent;border-radius:80px 80px 8px 8px;transition:all .25s;background:linear-gradient(transparent 25%,#081810c9)}.door:hover:before,.door.active:before{border-color:var(--accent);box-shadow:0 0 30px #efd49b24; background:linear-gradient(transparent,#14271abc)}.door>span,.door>strong{position:relative}.number{color:var(--accent);font:600 16px Georgia,serif;margin-bottom:8px}.door strong{font:600 clamp(26px,3vw,42px) 'Cormorant Garamond',Georgia,serif;color:var(--accent)}.desc{font-size:12px;margin-top:4px}.enter{font-size:11px;letter-spacing:2px;text-transform:uppercase;padding:10px 18px;margin-top:15px;border:1px solid #d4c89f6b;border-radius:3px;background:#0b191883}#jean{position:absolute;left:50%;top:78%;transform:translate(-50%,-50%);width:clamp(60px,7vw,100px);height:auto;image-rendering:pixelated;filter:drop-shadow(0 5px 4px #0007);transition:left 1.1s ease-in-out,top 1.1s ease-in-out;pointer-events:none}#jean.walking{animation:walk .16s steps(2) infinite}.speech{position:absolute;bottom:7%;left:50%;transform:translateX(-50%);width:min(460px,85%);background:#0b201beb;border:1px solid #b3bf806b;border-radius:8px;padding:17px 40px 15px 20px;box-shadow:0 15px 30px #0004;backdrop-filter:blur(8px)}.speech-name{display:block;font-size:10px;letter-spacing:2px;color:var(--gold);margin-bottom:7px}.speech strong{font-size:14px;font-weight:500}.speech p{font-size:13px;line-height:1.5;color:#bfd0bd;margin:6px 0 0}.speech button{position:absolute;top:7px;right:7px;border:0;background:none;color:#afc3ab;font-size:23px;line-height:1;padding:6px}.speech[hidden]{display:none}.hint{position:absolute;bottom:2%;left:0;width:100%;text-align:center;font-size:12px;letter-spacing:1px;color:#adbb9f}footer{max-width:1800px;margin:auto;display:flex;gap:20px;justify-content:space-between;align-items:center;padding:24px 5% 30px;color:#b8c5b1;font-size:12px;border-top:1px solid #8ea17a26}footer>span:first-child{color:var(--gold);letter-spacing:1px}footer small{font-size:10px;max-width:300px;line-height:1.5;text-align:right}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}@keyframes walk{to{margin-top:-4px}}.still *, .still *:before{animation:none!important;transition:none!important}@media(min-width:1450px){.world{min-height:800px}.intro{top:150px}}@media(max-width:700px){header{height:80px;padding:0 20px}.wordmark{font-size:28px;gap:10px}.wordmark>span{font-size:12px;letter-spacing:1.4px}.wordmark small{font-size:8px}.project-status{display:none}#motion{font-size:10px}.intro{top:94px;left:25px}h1{font-size:47px}.intro p{font-size:12px;max-width:240px;line-height:1.5}.eyebrow{font-size:9px;letter-spacing:2px}.world{aspect-ratio:auto;min-height:800px;height:calc(100svh - 65px);max-height:950px}.forest{object-fit:fill;object-position:center}.door{width:28%;top:35%;height:30%}.door:nth-child(1){left:20%}.door:nth-child(2){left:50%}.door:nth-child(3){left:80%}.door strong{font-size:30px}.desc{font-size:10px;line-height:1.3;max-width:85px}.enter{font-size:10px;padding:8px 10px;letter-spacing:1px;margin-top:10px}#jean{top:75%;width:68px}.speech{bottom:7%;padding:13px 34px 12px 15px}.speech p{font-size:12px}.hint{font-size:10px}footer{padding:18px 20px;flex-wrap:wrap;gap:10px}footer small{text-align:left;max-width:none;width:100%}.footer-brand{font-size:10px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:700px){.intro{position:relative;top:auto;left:auto;padding:100px 25px 24px;background:radial-gradient(ellipse at bottom,#203a2b,#0b1918 75%)}h1{margin:12px 0}.intro p{max-width:none;margin-bottom:0}.world{height:510px;min-height:0;max-height:none;overflow:visible;background:#0b1918}.forest{height:auto;object-fit:contain}.vignette{background:linear-gradient(0deg,#0b1918 25%,transparent 60%)}.door{top:12%;height:35%;width:28%}.door:nth-child(1){left:30%}.door:nth-child(2){left:54%}.door:nth-child(3){left:79%}.door:before{background:linear-gradient(transparent,#0b1918c9);border-radius:60px 60px 6px 6px}.door strong{font-size:28px}.number{margin-bottom:4px}.desc{font-size:10px}.enter{margin-top:9px}#jean{top:53%;width:68px}.speech{bottom:12%;width:88%}.hint{bottom:4%}footer{margin-top:0}}
#jean{width:clamp(110px,13vw,190px);max-height:190px;object-fit:contain}@media(max-width:700px){#jean{width:125px;max-height:125px}}
.scene{position:absolute;inset:0;transform:scale(1.2);transform-origin:50% 45%}.scene .forest{width:100%;height:100%;object-fit:cover}.world{overflow:hidden}.inhabitant{position:absolute;top:46%;width:6%;height:11%;overflow:visible;pointer-events:none;opacity:.94;filter:drop-shadow(0 3px 3px #0009)}.inhabitant img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;animation:working 5s ease-in-out infinite}.brewer{left:31%}.botanist{left:51%;filter:hue-rotate(65deg) drop-shadow(0 3px 3px #0009)}.botanist img{animation-duration:6.5s;animation-delay:-2s}.distiller{left:72%;filter:sepia(.25) drop-shadow(0 3px 3px #0009)}.distiller img{animation-duration:7.5s;animation-delay:-4s}.doors{z-index:2}.door:nth-child(1){left:31%}.door:nth-child(2){left:55%}.door:nth-child(3){left:80%}.door{width:21%;top:31%;height:34%}.door:before{background:linear-gradient(transparent 55%,#081810a9)}.door:hover:before,.door.active:before{background:linear-gradient(transparent 55%,#14271a99)}#jean{z-index:3;top:72%}.speech{z-index:4;width:min(650px,88%);bottom:5%;padding:18px 25px}.speech strong{font-size:16px}.products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;padding:0;margin:14px 0 9px}.products[hidden]{display:none}.products li{border:1px solid #ddcd8840;border-radius:5px;padding:12px;background:#c4cf8510;display:flex;flex-direction:column;gap:7px;min-width:0}.products .product-number{font-size:11px;letter-spacing:2px;color:var(--gold)}.products strong{font-family:'Cormorant Garamond',Georgia,serif;font-size:23px;line-height:1.1;color:var(--gold)}.products li>span:last-child{font-size:12px;line-height:1.35;color:#c1cfb7}#product-note{display:block;font-size:11px;color:#9bb09a}#product-note[hidden]{display:none}@keyframes working{0%,100%{transform:translate(-8px,0) scaleX(1)}25%{transform:translate(7px,-2px) scaleX(1)}45%{transform:translate(10px,0) scaleX(-1)}75%{transform:translate(-5px,-2px) scaleX(-1)}}@media(max-width:700px){.scene{height:auto;bottom:auto;aspect-ratio:3/2;transform:scale(1.15);transform-origin:50% 45%}.scene .forest{height:100%;object-fit:cover}.door{width:28%;top:11%;height:34%}.door:nth-child(1){left:31%}.door:nth-child(2){left:55%}.door:nth-child(3){left:80%}.inhabitant{width:9%;height:16%;top:43%}.brewer{left:30%}.botanist{left:50%}.distiller{left:71%}.speech{bottom:9%;width:92%;padding:14px 16px}.products{gap:6px}.products li{padding:9px 7px}.products strong{font-size:20px}.products li>span:last-child{font-size:11px}.speech p{font-size:12px}.hint{bottom:2%}#jean{top:47%}.world{height:545px}.intro{padding-bottom:30px}}
.camera{position:absolute;inset:0;transform:scale(.98);transform-origin:50% 45%;transition:transform 1.1s cubic-bezier(.22,.61,.36,1);will-change:transform}.camera .scene{inset:0}.camera .doors{inset:0}.focused .intro{opacity:.25;transition:opacity 1s}.intro{transition:opacity 1s}.speech[aria-busy=true] .products{opacity:.45}.atelier-switch{display:flex;flex-wrap:wrap;gap:8px;margin:13px 0 10px}.atelier-switch[hidden]{display:none}.atelier-switch button{padding:7px 12px;font-size:12px;border:1px solid #c7bb874d;border-radius:4px;background:#102b21;color:#d9e3c9}.atelier-switch button[aria-pressed=true]{background:#e8ce8c;color:#14261c;border-color:#e8ce8c}.atelier-switch #overview{margin-left:auto;color:var(--gold);background:transparent}.speech{bottom:4%}#close-speech{padding:8px}#product-note{padding-right:24px}@media(max-width:700px){.camera{transform-origin:50% 22%}.focused .intro{opacity:1}.atelier-switch{gap:5px}.atelier-switch button{padding:7px 8px;font-size:11px}.atelier-switch #overview{margin-left:0}.world{height:580px}.speech{bottom:7%}.hint{bottom:1%}}

@media(max-width:700px){.camera .scene{bottom:auto;height:auto;aspect-ratio:3/2}}