:root{--paper:#f3efe5;--ink:#403326;--muted:#796c5c;--accent:#9e805d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #b78a54;outline-offset:6px}img{display:block;max-width:100%}.skip{position:fixed;top:-100px;z-index:100;background:white;padding:15px}.skip:focus{top:0}header{height:82px;position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:8px 5%;background:#f3efe5d9;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-bottom:1px solid #ffffff60}.brand img{width:62px;height:62px;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);mix-blend-mode:multiply}.edition{font-size:10px;letter-spacing:2px}.edition b{font-weight:400;color:var(--accent)}#chapters-button{background:none;border:1px solid #40332630;padding:12px 16px;border-radius:3px;font-size:12px}#chapters-button span{display:inline-block;margin-left:15px;transition:transform .3s}#chapters-button[aria-expanded=true] span{transform:rotate(45deg)}nav{position:absolute;top:81px;right:5%;width:min(380px,90vw);padding:20px;background:#f3efe5;box-shadow:0 18px 40px #0002;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .3s,transform .3s,visibility .3s}nav.open{opacity:1;visibility:visible;transform:none}nav a{display:flex;gap:14px;padding:19px 6px;border-bottom:1px solid #40332620;font-size:12px}nav a span{flex:1}nav a:hover{color:var(--accent)}.progress{position:absolute;bottom:-1px;left:0;right:0;height:2px}.progress i{display:block;background:var(--accent);height:100%;transform:scaleX(0);transform-origin:left}.intro{height:100svh;min-height:740px;position:relative;overflow:hidden;color:var(--paper)}.intro-photo,.intro-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%}.intro-overlay{background:linear-gradient(90deg,#1e1a15de,#1e1a1560 65%,#1e1a1510)}.intro-copy{position:relative;padding:180px 8% 110px}.eyebrow{font-size:10px;letter-spacing:2.4px;line-height:1.7}h1{font-size:clamp(56px,6.8vw,100px);line-height:1.04;font-weight:400;letter-spacing:-4px;margin:28px 0}em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}h1 em{color:#d1b48d}.intro-copy>p:not(.eyebrow){font-size:17px;line-height:1.8;color:#e0d7cb}.begin{display:inline-flex;gap:45px;align-items:center;font-size:13px;margin-top:20px;border-bottom:1px solid #d1b48d80;padding-bottom:12px}.begin span{font-size:24px;transition:transform .3s}.begin:hover span{transform:translateY(5px)}.intro-bottom{position:absolute;bottom:30px;left:8%;right:5%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px}.journey{position:relative;display:grid;grid-template-columns:52% 48%}.visual{position:sticky;top:82px;height:calc(100svh - 82px);overflow:hidden;background:#e5decd}.scene{position:absolute;inset:0;opacity:0;visibility:hidden;transform:scale(1.035);transition:opacity .8s ease,transform 1.2s ease,visibility .8s;display:flex;align-items:center;justify-content:center}.scene.active{opacity:1;visibility:visible;transform:scale(1)}.scene-photo img{width:100%;height:100%;object-fit:cover;object-position:center 60%}.scene-photo:after{content:'';position:absolute;inset:65% 0 0;background:linear-gradient(transparent,#271e1460)}.visual-caption{position:absolute;bottom:35px;left:7%;z-index:1;font-size:9px;letter-spacing:2px}.scene-photo .visual-caption{color:white}.specimen{position:absolute;top:35px;left:7%;font-size:9px;letter-spacing:2px;color:var(--muted)}.botanical{background:radial-gradient(ellipse,#f1ecdf,#ddd5c4)}.botanical svg{width:85%;height:85%}.scene-counter{position:absolute;bottom:32px;right:6%;z-index:2;background:#f3efe5e6;padding:9px 12px;font-size:10px;letter-spacing:2px}.seed-scene{background:#e9dfcd;flex-direction:column;gap:40px}.fruit-cut{width:60%;max-width:330px;aspect-ratio:4/5;border-radius:48%;background:#9a4b38;padding:20px;transform:rotate(-18deg);box-shadow:20px 30px 55px #4033261f,inset 3px 3px 12px #ffffff30}.pulp{height:100%;border-radius:48%;background:#d5b67e;display:flex;align-items:center;justify-content:center;gap:5px;padding:15px}.seed{width:45%;height:77%;background:linear-gradient(100deg,#76805a,#b2b18b);border:1px solid #6d714d;box-shadow:inset 6px 0 10px #3e492140}.seed-left{border-radius:70% 25% 25% 70%}.seed-right{border-radius:25% 70% 70% 25%}.diagram-label{font-size:9px;letter-spacing:2px}.step{min-height:100svh;display:flex;justify-content:center;flex-direction:column;padding:100px 15%;border-bottom:1px solid #40332610}.step h2,.next h2{font-size:clamp(37px,4.1vw,62px);line-height:1.13;letter-spacing:-1.8px;font-weight:400;margin:25px 0}.step>p:not(.eyebrow){font-size:16px;line-height:1.9;color:var(--muted);max-width:400px;margin:0 0 18px}.step-link,.source-button{align-self:flex-start;border:0;border-bottom:1px solid #40332655;background:none;padding:14px 0;font-size:12px;margin-top:18px}.step-link span,.source-button span{margin-left:20px}.next{text-align:center;padding:120px 7%;background:#302a23;color:var(--paper)}.next em{color:#cfb78e}.next>p:not(.eyebrow){line-height:1.9;font-size:15px;color:#c8bfb0}.prototype{display:block;font-size:8px;letter-spacing:1.5px;color:#b3a38e;margin:40px 0}.restart{display:inline-block;padding:16px 24px;border:1px solid #ffffff40;font-size:12px}.restart:hover{background:#ffffff10}footer{padding:30px 5%;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:1px}dialog{border:1px solid #ffffff60;border-radius:5px;background:var(--paper);color:var(--ink);padding:45px;width:min(540px,90vw);box-shadow:0 30px 90px #0003}dialog::backdrop{background:#211b16a6;backdrop-filter:blur(6px)}dialog h2{font-size:28px;font-weight:400}dialog p{font-size:14px;line-height:1.8}dialog a{font-size:13px;text-decoration:underline;text-underline-offset:5px}dialog .note{font-size:12px;color:var(--muted);margin-top:25px}#source-close{position:absolute;top:12px;right:15px;border:0;background:none;font-size:28px}
@media(max-width:760px){header{height:74px;padding:6px 6%}.brand img{width:58px;height:58px}.edition{font-size:8px;letter-spacing:1px}.edition b{display:none}#chapters-button{padding:10px;font-size:11px}#chapters-button span{margin-left:5px}nav{top:73px}.intro{min-height:740px}.intro-copy{padding:180px 7% 100px}h1{font-size:clamp(49px,10vw,74px);letter-spacing:-2px}.intro-photo{object-position:60% center}.intro-bottom{left:7%;font-size:8px}.intro-bottom span:first-child{display:none}.journey{display:block}.visual{top:74px;height:40svh;min-height:220px;z-index:3;border-bottom:1px solid #40332625}.scene-photo img{object-position:center 65%}.botanical svg{height:110%;width:70%}.visual-caption{font-size:7px;bottom:17px;left:5%;letter-spacing:1px}.specimen{top:15px;font-size:7px;letter-spacing:1px}.scene-counter{bottom:12px;font-size:8px}.fruit-cut{height:66%;width:auto;padding:10px}.pulp{padding:8px}.seed-scene{gap:15px}.diagram-label{font-size:7px}.step{min-height:78svh;padding:65px 8%;scroll-margin-top:40svh}.step h2{font-size:40px}.step>p:not(.eyebrow){font-size:15px;line-height:1.8}.step .eyebrow{font-size:9px}.next{padding:80px 7%}.next h2{font-size:40px}.next br{display:none}footer{font-size:8px;line-height:1.7;flex-direction:column}dialog{padding:35px 25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.scene{transform:none}}
.chapter-intro{background:#302a23;color:var(--paper);padding:100px 8%}.chapter-intro h2,.greek-chapter>h2{font-size:clamp(44px,6vw,88px);line-height:1.08;letter-spacing:-2px;font-weight:400;margin:28px 0}.chapter-intro em{color:#c9ad84}.chapter-intro>p:not(.eyebrow){font-size:16px;line-height:1.8;max-width:530px;color:#d0c6b8}.route-visual{background:#ded7c5;display:flex;align-items:center;justify-content:center}.route-line{width:70%;position:relative;padding:0 0 0 40px}.route-line:before{content:'';position:absolute;top:20px;bottom:50px;left:12px;width:1px;background:#40332635}.route-stop{position:relative;padding:24px 0 40px;opacity:.35;transform:translateX(0);transition:opacity .7s,transform .7s}.route-stop.active{opacity:1;transform:translateX(8px)}.route-stop i{position:absolute;left:-34px;top:31px;width:12px;height:12px;border:1px solid #80684c;background:#ded7c5;border-radius:50%;transition:background .5s}.route-stop.active i{background:#80684c}.route-stop>span{font-size:10px;letter-spacing:2px}.route-stop strong{display:block;font-family:Georgia,serif;font-size:clamp(30px,4vw,55px);font-weight:400;margin:10px 0}.route-stop small{font-size:12px;color:var(--muted)}.citation{font-size:11px;text-decoration:underline;text-underline-offset:4px;line-height:1.7;color:var(--muted);margin-top:12px;display:block}.greek-chapter{padding:100px 8%;background:#e7decd}.greek-intro{font-size:17px;line-height:1.8;color:var(--muted)}.era-controls{display:flex;border-bottom:1px solid #40332630;gap:10px;margin-top:55px}.era-controls button{flex:1;text-align:left;padding:22px 10px;border:0;border-bottom:2px solid transparent;background:none;font-size:10px;transition:color .3s,border-color .3s}.era-controls button span{font-size:17px;margin-left:15px}.era-controls button[aria-selected=true]{border-color:var(--ink)}.era-controls button:hover{color:var(--accent)}.era-panels{min-height:390px}.era-panels article{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;padding:45px 0}.era-panels article[hidden]{display:none}.era-art{background:#d7c9b1;aspect-ratio:1.6;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:30px}.era-word{font:italic clamp(45px,6vw,90px) Georgia,serif;color:#735b3f}.era-art>span:last-child{font-size:9px;letter-spacing:3px}.era-panels h3{font-size:29px;font-weight:400;line-height:1.2}.era-panels p{font-size:15px;line-height:1.8;color:var(--muted)}.freddo-intro{background:#4b584b}.freddo-visual{background:#dce0d3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:40px}.drink-diagram{position:relative;width:230px;height:330px}.glass{position:absolute;bottom:20px;width:230px;height:280px;border:2px solid #ffffffb0;border-top:4px solid #fff9;border-radius:8px 8px 45px 45px;overflow:hidden;background:linear-gradient(100deg,#ffffff30,transparent 50%,#ffffff40);box-shadow:inset 12px 0 20px #fff2;transform:perspective(700px) rotateX(-8deg)}.coffee-liquid{position:absolute;bottom:0;width:100%;height:28%;background:linear-gradient(90deg,#52321b,#88542c,#452c1e);transition:height 1s,background 1s}.foam{position:absolute;width:100%;height:13px;bottom:27%;background:#b69158;border-radius:50%;transition:bottom 1s,height 1s}.ice{position:absolute;width:67px;height:65px;border:2px solid #ffffff90;background:#eff8ff40;border-radius:10px;opacity:0;transform:translateY(-90px) rotate(15deg);transition:opacity .7s,transform 1s}.ice-one{left:23px;bottom:85px}.ice-two{right:19px;bottom:120px}.ice-three{left:80px;bottom:25px}.pour{position:absolute;left:115px;top:0;height:210px;width:5px;background:#986336;z-index:2;opacity:.7;transition:opacity .6s}.saucer-shadow{position:absolute;bottom:0;left:-10px;right:-10px;height:16px;background:#40332625;filter:blur(9px);border-radius:50%}.freddo-visual[data-stage="1"] .coffee-liquid{height:58%}.freddo-visual[data-stage="1"] .foam{bottom:57%;height:30px}.freddo-visual:not([data-stage="0"]) .pour{opacity:0}.freddo-visual[data-stage="2"] .coffee-liquid{height:75%}.freddo-visual[data-stage="2"] .foam{bottom:74%;height:19px}.freddo-visual[data-stage="2"] .ice{opacity:1;transform:translateY(0) rotate(15deg)}.drink-label{font-size:11px;letter-spacing:2px}.finale{padding:0;display:grid;grid-template-columns:1fr 1fr;text-align:left}.finale>img{width:100%;height:100%;max-height:800px;object-fit:cover}.finale>div{align-self:center;padding:70px 12%}.finale h2{font-size:clamp(34px,3.8vw,55px)}.finale p{font-size:15px;line-height:1.8}.finale .restart{margin:12px 8px 0 0}#chapters{max-height:calc(100svh - 100px);overflow-y:auto}
@media(max-width:760px){.chapter-intro,.greek-chapter{padding:70px 8%}.chapter-intro h2,.greek-chapter>h2{font-size:44px}.route-line{display:flex;width:90%;padding:25px 0 0;gap:15px}.route-line:before{top:20px;bottom:auto;left:5%;right:5%;width:auto;height:1px}.route-stop{flex:1;padding:20px 0;transform:none}.route-stop.active{transform:translateY(-5px)}.route-stop i{left:5px;top:-10px}.route-stop strong{font-size:23px}.route-stop small{font-size:10px;line-height:1.5;display:block}.route-stop>span{font-size:8px}.era-controls{gap:0;margin-top:30px}.era-controls button{padding:18px 4px}.era-controls button span{display:block;font-size:13px;margin:8px 0 0}.era-panels article{grid-template-columns:1fr;gap:15px;padding:25px 0}.era-panels{min-height:600px}.era-art{aspect-ratio:2.4;gap:15px}.era-panels h3{font-size:25px}.drink-diagram{width:140px;height:190px}.glass{width:140px;height:170px;bottom:10px;border-radius:6px 6px 25px 25px}.pour{left:70px;height:135px}.freddo-visual{gap:12px}.drink-label{font-size:9px}.ice{width:38px;height:38px}.ice-one{left:15px;bottom:50px}.ice-two{right:15px;bottom:75px}.ice-three{left:50px;bottom:17px}.finale{display:block}.finale>img{height:430px;object-position:center 60%}.finale>div{padding:60px 8%}.finale h2{font-size:40px}}
/* Photographic storytelling: preserve the existing scene transitions. */
.era-photo{margin:0}.era-photo img{width:100%;height:340px;object-fit:cover}.era-photo figcaption{font-size:10px;line-height:1.6;color:var(--muted);margin-top:10px}.photo-sequence{display:block;background:#302a23}.freddo-photo{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}.freddo-photo.active{opacity:1}.freddo-photo img{width:100%;height:100%;object-fit:cover;object-position:center 55%}.freddo-photo:nth-child(2) img{object-position:center 38%;transform:scale(1.12)}.photo-sequence:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#21180fd9);pointer-events:none}.photo-sequence .drink-label{position:absolute;bottom:75px;left:7%;color:white;z-index:2}.photo-sequence .visual-caption{color:#eee4d5;z-index:2;max-width:85%;line-height:1.6}.scene-photo .visual-caption{max-width:73%;line-height:1.6;font-size:8px}
@media(max-width:760px){.era-photo img{height:270px}.photo-sequence .drink-label{bottom:47px;left:5%;font-size:10px}.photo-sequence .visual-caption{font-size:7px}.freddo-photo img{object-position:center 56%}.freddo-photo:nth-child(2) img{object-position:center 42%}}

#era-1 .era-photo img{object-position:50% 30%}
#era-2 .era-photo img{object-position:center 53%}
/* Interactive freddo preparation. */


.brew-controls{position:absolute;top:24px;left:5%;right:5%;z-index:5;display:flex;gap:4px;padding:5px;border:1px solid #fff5;border-radius:12px;background:#231d18b8;backdrop-filter:blur(16px)}.brew-controls button{flex:1;border:0;border-radius:8px;background:transparent;color:#f3efe5;padding:14px 7px;font-size:10px;line-height:1.4;transition:background .35s,color .35s,transform .35s}.brew-controls button span{display:block;margin-top:5px;font-size:12px}.brew-controls button:hover{background:#ffffff18}.brew-controls button[aria-pressed=true]{background:#f3efe5;color:#403326}.photo-sequence .drink-label{bottom:75px}.brew-next{margin-top:25px}.brew-again{display:block;background:none;border:0;border-bottom:1px solid #40332640;padding:9px 0;margin-top:22px;font-size:12px}.step>p.brew-finish{border-left:2px solid var(--accent);padding-left:18px;font:italic 21px/1.6 Georgia,serif}.freddo-journey .step:focus{outline:none}.freddo-journey .step:focus-visible{outline:2px solid var(--accent);outline-offset:-8px}
@media(max-width:760px){.brew-controls{top:12px;left:4%;right:4%;padding:3px}.brew-controls button{padding:8px 3px;font-size:9px}.brew-controls button span{font-size:10px;margin-top:2px}.photo-sequence .drink-label{bottom:48px}.photo-sequence .visual-caption{bottom:17px}.freddo-journey .step{padding-bottom:110px}.finale>div{padding-bottom:110px}}
@media(prefers-reduced-motion:reduce){}