@font-face{font-family:Metropolis;src:url('assets/v6/fonts/Metropolis-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Metropolis;src:url('assets/v6/fonts/Metropolis-Medium.woff2') format('woff2');font-weight:500 600;font-display:swap}
@font-face{font-family:Metropolis;src:url('assets/v6/fonts/Metropolis-Bold.woff2') format('woff2');font-weight:700 900;font-display:swap}

:root{--ink:#2d241b;--ink-2:#4a3b2c;--paper:#f6efdf;--paper-2:#efe4cc;--gold:#e8c98e;--gold-deep:#b98a45;--muted:#7a6650;--night:#17160f;--white:#fff8eb;
 --gutter:clamp(20px,4.6vw,80px);--ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.76,0,.24,1);
 font-family:Metropolis,"Helvetica Neue",Arial,sans-serif;color-scheme:light}
*,*:before,*:after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:clip}
button{font:inherit;cursor:pointer;color:inherit;background:none;border:0;padding:0}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,figure,ul,ol{margin:0}ul,ol{padding:0;list-style:none}
h1,h2,h3{font-weight:500;letter-spacing:-.045em;line-height:1}
p{font-size:1.0625rem;line-height:1.6}
img{display:block;max-width:100%}
em{font-style:normal;color:var(--gold-deep)}
:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.skip{position:fixed;top:-100px;left:20px;z-index:400;background:var(--paper);padding:16px 20px}.skip:focus{top:20px}
.w{display:inline-block;will-change:opacity,transform,filter}

/* Links */
.link-cta{position:relative;display:inline-flex;align-items:center;gap:10px;padding:6px 0;font-size:16px;font-weight:500}
.link-cta:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:0 50%}
.link-cta:hover:after{animation:line-redraw .9s var(--ease)}
@keyframes line-redraw{0%{transform:scaleX(1);transform-origin:100% 50%}45%{transform:scaleX(0);transform-origin:100% 50%}46%{transform-origin:0 50%}100%{transform:scaleX(1);transform-origin:0 50%}}

/* Cursor */
.cursor{position:fixed;left:0;top:0;z-index:250;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;display:grid;place-items:center;opacity:0;transition:width .45s var(--ease),height .45s var(--ease),margin .45s var(--ease),background .3s,opacity .3s}
.cursor.on{opacity:1}
.cursor.label{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--gold);mix-blend-mode:normal}
.cursor-label{font-size:13px;font-weight:500;color:var(--ink);opacity:0;transition:opacity .3s}.cursor.label .cursor-label{opacity:1}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* Header */
.site-header{position:fixed;z-index:80;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:24px var(--gutter);color:var(--ink);transition:transform .6s var(--ease),color .4s}
.site-header.hide{transform:translateY(-110%)}
.site-header.on-dark{color:var(--white)}
.brand{font-size:20px;font-weight:500;letter-spacing:-.04em}
.menu-btn{display:inline-flex;align-items:center;gap:14px;min-height:44px}.menu-label{font-size:15px}
.bars{position:relative;width:30px;height:12px}.bars i{position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .5s var(--ease),width .4s}.bars i:first-child{top:1px}.bars i:last-child{bottom:1px;left:auto;width:65%}
.menu-open .bars i:first-child{transform:translateY(4.5px) rotate(45deg)}.menu-open .bars i:last-child{width:100%;transform:translateY(-4.5px) rotate(-45deg)}
.menu-open .site-header{color:var(--paper);transform:none}

.menu{position:fixed;inset:0;z-index:70;display:grid;align-content:center;padding:110px var(--gutter) 40px;background:var(--ink);color:var(--paper);clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease-io);visibility:hidden}
.menu-open .menu{clip-path:inset(0);visibility:visible}
.menu nav{display:grid;gap:clamp(2px,1vh,8px)}
.menu nav a{width:fit-content;font-size:clamp(38px,6.4vw,88px);font-weight:500;letter-spacing:-.05em;line-height:1.08;opacity:0;transform:translateY(40px);transition:opacity .6s,transform .8s var(--ease),color .3s}
.menu nav a:hover{color:var(--gold)}
.menu-open .menu nav a{opacity:1;transform:none;transition-delay:calc(.25s + var(--i)*.05s)}
.menu-foot{position:absolute;left:var(--gutter);bottom:30px;font-size:14px;opacity:.7}
body.menu-open{overflow:hidden}

/* ========== STORY ========== */
.story{position:relative;height:540svh}
.story-anchor{position:absolute;top:150svh;width:1px;height:1px}
.story-stage{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:var(--night);color:var(--white)}
.world{position:absolute;inset:0 0 auto;height:200%;z-index:-3;will-change:transform}
.world-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:56% center}
.paint-surface{position:absolute;inset:0 0 auto;height:50%;overflow:hidden;background:#fffdf8;pointer-events:none}
.paint-surface:after{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(180deg,#f6efdff2 0%,#f6efdfc9 30%,#f6efdf00 54%,#f6efdf00 78%,#f6efdfcc 100%);pointer-events:none}
.paint-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:56% bottom}
#rocca-film{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
#rocca-paint{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .4s}#rocca-paint.ready{opacity:1}
.soil-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#120f0aee 0%,#120f0a80 38%,#120f0a66 60%,#120f0af0 100%);opacity:0;pointer-events:none}

.hero-copy{position:absolute;left:var(--gutter);top:clamp(110px,17vh,180px);width:min(50vw,760px);z-index:5;pointer-events:none;will-change:transform,opacity,filter}
.hero-title{margin:0}.hero-lettering{display:block;width:100%;height:auto;overflow:visible}.hero-lettering use{fill:var(--ink)}
.title-letter{opacity:0;transform-box:fill-box}
.ready .title-letter{animation:letter-in 1.1s var(--ease) calc(var(--letter-delay) * .4) both}
@keyframes letter-in{from{opacity:0;transform:translateY(10px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}
.hero-dates{position:absolute;left:0;right:0;bottom:clamp(26px,5vh,48px);z-index:6;text-align:center;font-size:15px;font-weight:500;letter-spacing:.02em;color:var(--ink);opacity:0;transition:opacity 1.2s 1.3s}
.ready .hero-dates{opacity:1}.hero-dates.settled{transition:none}

.descent-copy{position:absolute;left:var(--gutter);right:var(--gutter);top:50%;z-index:6;text-align:center;transform:translateY(-50%);pointer-events:none;visibility:hidden}
.descent-copy h2{font-size:clamp(40px,6vw,100px);color:var(--white)}
.descent-copy em{color:var(--gold)}

.paper{position:absolute;inset:0;z-index:-1;background:var(--paper);clip-path:circle(0% at 50% 41%)}
.truffle{position:absolute;left:50%;top:41%;z-index:4;width:min(86vw,100svh);aspect-ratio:4/3;margin-left:calc(min(86vw,100svh) / -2);will-change:transform,opacity;pointer-events:none}
.truffle canvas{display:block;width:100%;height:100%}

.anatomy{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(28px,6vh,60px);z-index:6;color:var(--ink);pointer-events:none}
.anatomy article{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;gap:clamp(20px,3vw,48px);visibility:hidden}
.anatomy h2{font-size:clamp(56px,7.4vw,124px);line-height:.85}
.anatomy p{max-width:300px;padding-bottom:6px;font-size:16px;line-height:1.5;color:var(--ink-2)}

/* ========== VARIETIES ========== */
.varieties{position:relative;height:400svh;background:var(--paper)}
.varieties-stage{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden}
.varieties-track{display:flex;height:100%;will-change:transform}
.v-panel{position:relative;flex:none;height:100%}
.v-intro{width:min(60vw,860px);display:flex;align-items:center;padding:0 var(--gutter)}
.v-intro h2{font-size:clamp(52px,7.2vw,124px)}
.v-card{width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,3vh,30px);padding:90px var(--gutter) 60px}
.specimen{position:relative;width:min(40vw,62svh);aspect-ratio:1;will-change:transform}
.sprite{position:absolute;inset:0;background-image:var(--sprite);background-size:200% 100%;background-repeat:no-repeat;mix-blend-mode:multiply;transition:opacity .15s linear,transform .15s linear,filter .15s linear}
.sprite.whole{background-position:100% 50%;opacity:calc(1 - var(--o,0));transform:scale(calc(1 + var(--o,0) * .12)) rotate(calc(var(--o,0) * 8deg));filter:blur(calc(var(--o,0) * 6px))}
.sprite.inside{background-position:0 50%;opacity:var(--o,0);transform:scale(calc(.86 + var(--o,0) * .14)) rotate(calc((1 - var(--o,0)) * -6deg));filter:blur(calc((1 - var(--o,0)) * 6px))}
.v-text{text-align:center}
.v-text h3{font-size:clamp(44px,5vw,84px)}
.v-latin{margin-top:12px;font-size:15px;color:var(--muted)}

/* ========== KITCHEN ========== */
.kitchen{position:relative;height:300svh;background:var(--paper)}
.kitchen-stage{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;color:var(--white)}
.kitchen-frame{position:absolute;inset:0;clip-path:inset(var(--it,22%) var(--ix,30%) round var(--ir,24px));will-change:clip-path;background:var(--night)}
.kitchen-frame video{width:100%;height:100%;object-fit:cover;transform:scale(var(--vs,1.25));will-change:transform}
.kitchen-frame:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#0f0d0900 55%,#0f0d09b3 100%);opacity:var(--shade,0)}
.kitchen-title{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:clamp(52px,9.4vw,170px);line-height:.95;pointer-events:none;color:var(--white);text-shadow:0 4px 40px #0f0d0966}
.kitchen-title em{color:inherit}
.k-line{display:block;white-space:nowrap;will-change:transform}
.kitchen-copy{position:absolute;z-index:2;left:0;right:0;bottom:clamp(30px,6vh,56px);text-align:center;font-size:18px;opacity:0;visibility:hidden}

/* ========== MANIFESTO ========== */
.manifesto{padding:clamp(120px,24vh,260px) var(--gutter)}
.manifesto p{max-width:1250px;font-size:clamp(28px,3.5vw,58px);font-weight:500;line-height:1.16;letter-spacing:-.035em}
.read-words .w{opacity:.14}

/* ========== WAYS ========== */
.ways-section{padding:0 var(--gutter) clamp(120px,22vh,240px)}
.ways-title{font-size:clamp(44px,6vw,104px);margin-bottom:clamp(50px,9vh,100px)}
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,5vh,60px) clamp(14px,1.8vw,30px)}
.way{transform:translateY(calc(var(--d) * 8vh))}
.way figure{opacity:0;transform:translateY(60px);transition:opacity 1s var(--ease),transform 1.3s var(--ease);transition-delay:calc(var(--d) * .1s)}
.way.in figure{opacity:1;transform:none}
.way-img{overflow:hidden;border-radius:3px;aspect-ratio:4/5}
.way-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.14)}
.way h3{margin-top:16px;font-size:clamp(20px,1.7vw,26px);letter-spacing:-.03em}

/* ========== PAST ========== */
.past{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:end;padding:clamp(110px,18vh,200px) var(--gutter);background:var(--gold)}
.edition-year{display:flex;font-size:clamp(110px,19vw,330px);font-weight:500;letter-spacing:-.08em;line-height:.8;color:#6a4a1f;overflow:hidden;padding-bottom:.04em}
.edition-year span{display:inline-block;transform:translateY(105%);transition:transform 1.2s var(--ease)}
.edition-year.in span{transform:none}.edition-year.in span:nth-child(2){transition-delay:.08s}.edition-year.in span:nth-child(3){transition-delay:.16s}.edition-year.in span:nth-child(4){transition-delay:.24s}
.past-body h2{font-size:clamp(44px,5vw,84px)}.past-body h2 em{color:#6a4a1f}
.past-body p{margin:26px 0 22px;max-width:520px;font-size:clamp(18px,1.5vw,21px)}

/* ========== MAP ========== */
.fair-map{padding:clamp(110px,18vh,200px) var(--gutter);background:var(--paper)}
.fair-map h2{font-size:clamp(48px,7vw,120px);margin-bottom:clamp(40px,8vh,90px)}
.map-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:6vw;align-items:end}
.map-visual{display:block;width:100%;background:#fff;border-radius:3px;overflow:hidden}
.map-visual img{width:100%;height:clamp(420px,44vw,640px);object-fit:contain;transition:transform 1s var(--ease)}
.map-visual:hover img{transform:scale(1.03)}
.place-list li{padding:16px 0;border-bottom:1px solid #2d241b1f;font-size:17px;color:var(--muted)}.place-list li:first-child{border-top:1px solid #2d241b1f}
.place-list strong{display:block;margin-bottom:2px;font-weight:500;color:var(--ink);font-size:20px;letter-spacing:-.02em}
.small-note{margin:22px 0;font-size:14px;color:var(--muted)}

/* ========== VISIT ========== */
.visit{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;display:flex;align-items:center;padding:clamp(110px,16vh,170px) var(--gutter) clamp(60px,10vh,110px);color:var(--white);background:var(--night)}
.visit-bg{position:absolute;inset:0;z-index:-1}
.visit-bg img{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover;object-position:60% 50%;will-change:transform}
.visit-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#17160fb3 0%,#17160f66 40%,#17160fe6 100%)}
.visit-inner{width:100%;max-width:1400px;margin:0 auto}
.visit-title{font-size:clamp(56px,9vw,160px);line-height:.95}.visit-title em{color:var(--gold)}
.countdown{margin-top:24px;font-size:clamp(18px,1.6vw,22px);color:#fff8ebcc}.countdown strong{font-weight:500;color:var(--white)}
.dates{margin-top:clamp(40px,8vh,90px);border-top:1px solid #fff8eb33}
.dates li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:clamp(16px,2.6vh,28px) 0;border-bottom:1px solid #fff8eb33}
.d-date{font-size:clamp(30px,4vw,64px);font-weight:500;letter-spacing:-.045em;line-height:1}
.d-cal{font-size:14px;font-weight:500;opacity:.75;transition:opacity .3s,color .3s}.d-cal:hover{opacity:1;color:var(--gold)}
.visit-note{margin-top:28px;font-size:14px;color:#fff8eb99}

/* ========== FOOTER ========== */
.site-footer{position:relative;isolation:isolate;display:flex;align-items:flex-start;min-height:90svh;padding:clamp(70px,12vh,120px) var(--gutter) 30px;overflow:hidden;background:#fffdf8;color:var(--ink)}
.footer-media{position:absolute;inset:0;z-index:-1;pointer-events:none}
.footer-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:56% bottom}
.footer-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#fffdf8 0%,#fffdf8d9 22%,#fffdf800 50%)}
.footer-inner{width:100%;text-align:center}
.footer-mark{font-size:clamp(56px,11vw,190px);font-weight:500;letter-spacing:-.07em;line-height:.9}
.footer-line{margin-top:14px;font-size:15px;color:var(--muted)}
.footer-links{display:flex;justify-content:center;gap:clamp(18px,3vw,40px);margin-top:26px;font-size:15px;font-weight:500}
.footer-links a{opacity:.8;transition:opacity .3s}.footer-links a:hover{opacity:1}

/* Reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* Dialog */
dialog{padding:0;border:0;background:var(--night);color:var(--white);max-width:none;max-height:none;width:100%;height:100dvh;overflow:auto}
dialog::backdrop{background:#000c}
.dialog-close{position:fixed;top:20px;right:24px;z-index:10;min-height:44px;padding:0 18px;background:var(--paper);color:var(--ink);font-size:14px;font-weight:500;border-radius:2px}
.image-viewport{height:calc(100dvh - 140px);margin-top:78px;overflow:auto}
.image-viewport img{width:100%;height:100%;object-fit:contain;padding:0 16px}
.image-dialog p{max-width:980px;margin:16px auto;padding:0 24px;font-size:14px;opacity:.75;text-align:center}
.noscript-note{padding:30px}

/* ========== RESPONSIVE ========== */
@media (max-width:1100px){
 .hero-copy{width:min(70vw,640px)}
 .ways{grid-template-columns:repeat(2,1fr)}.way{transform:none}
 .past,.map-grid{gap:5vw}
}
@media (max-width:760px){
 :root{--gutter:20px}
 .site-header{padding:16px var(--gutter)}
 .story{height:480svh}
 .hero-copy{top:clamp(96px,14vh,130px);width:calc(100% - 40px)}
 .hero-dates{font-size:14px}
 .descent-copy{top:27%}
 .truffle{top:39%;width:102vw;margin-left:-51vw}
 .anatomy{bottom:24px}.anatomy article{flex-direction:column;align-items:flex-start;gap:10px}
 .anatomy h2{font-size:clamp(48px,14vw,68px)}.anatomy p{font-size:15px}
 .v-intro{width:86vw}
 .specimen{width:min(76vw,44svh)}
 .v-text h3{font-size:clamp(40px,11vw,56px)}
 .kitchen-title{font-size:clamp(44px,13vw,80px)}
 .kitchen-copy{font-size:16px;padding:0 var(--gutter)}
 .ways{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);gap:12px;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter) 6px;scrollbar-width:none}.ways::-webkit-scrollbar{display:none}
 .way{flex:0 0 74vw;scroll-snap-align:start}
 .past,.map-grid{display:block}
 .past-body{margin-top:40px}
 .map-text{margin-top:36px}
 .map-visual img{height:auto;max-height:520px;aspect-ratio:1/1.2}
 .dates li{flex-direction:column;gap:8px}
 .visit-title{font-size:clamp(48px,14vw,80px)}
 .site-footer{min-height:auto;flex-direction:column}
 .footer-media{position:relative;inset:auto;order:2;height:64vw;margin:40px calc(var(--gutter) * -1) -30px}
 .footer-media:after{background:linear-gradient(180deg,#fffdf8 0%,#fffdf800 40%)}
 .footer-links{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
 *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.12s!important}
 .title-letter{opacity:1}.reveal,.way figure{opacity:1;transform:none}.read-words .w{opacity:1}
}