.page-home{background:#b9d87a;color:#203b25}
/* Let touch momentum settle naturally instead of snapping whole chapters. */
@media(pointer:coarse){html:has(body.page-home){scroll-snap-type:none!important}}
html.lite-graphics:has(body.page-home){scroll-snap-type:none!important}
html.lite-graphics body .header.header::before,
html.lite-graphics body .header.header .navigation,
html.lite-graphics .journey-controls .scroll-cue .scroll-icon{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.lite-graphics .scroll-icon svg,
html.lite-graphics .in-flavour-finale .range-bottle-large{animation:none!important}
.page-home .header{position:fixed;top:0;left:0;width:100%;background:#fffbe845;backdrop-filter:blur(14px);border:0}
.page-home .header-inner{height:96px;width:calc(100% - 88px);max-width:none}
.page-home .navigation{margin-left:0;gap:34px}
.page-home .brand,.page-home .brand img{width:110px;height:57px}
.page-home .header-actions{gap:24px}
.page-home .header-actions>.button{background:#203b25;color:#fffbe9}
.flavour-journey{height:100svh;min-height:600px;position:relative}.flavour-journey.is-enhanced{height:365svh}
.flavour-stage{height:100svh;min-height:540px;position:sticky;top:0;overflow:hidden;isolation:isolate;background:#b9d87a;color:#203b25}
.stage-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#fff7d64d 0%,transparent 65%);z-index:0}
.stage-eyebrow{position:absolute;top:138px;left:0;width:100%;text-align:center;font-size:10px;font-weight:800;letter-spacing:.24em;z-index:3}
.flavour-titles{position:absolute;inset:0;pointer-events:none;z-index:1}
.flavour-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;will-change:opacity,transform;padding-bottom:8vh}
.flavour-title.is-active{opacity:1}
.flavour-title span{font-size:clamp(120px,21.3vw,360px);font-weight:800;letter-spacing:-.085em;line-height:.85;white-space:nowrap}
.flavour-title[data-title="0"] span{font-size:clamp(90px,15.8vw,265px)}
html[lang="en"] .flavour-title[data-title="2"] span{font-size:clamp(70px,13.2vw,235px)}
.webgl-scene{position:absolute;inset:0;z-index:2;pointer-events:none}
.webgl-scene canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .5s}
.webgl-scene.is-ready canvas{opacity:1}
.scene-poster{position:absolute;inset:0;opacity:1;visibility:visible;transition:opacity .5s}
.scene-poster img{width:100%;height:100%;max-width:none;object-fit:cover}
.scene-poster:not([hidden])~.scene-fallback{visibility:hidden}
.webgl-scene.is-ready .scene-poster{opacity:0;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
.scene-fallback{position:absolute;height:55%;width:auto;max-width:40%;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-13deg);object-fit:contain;filter:drop-shadow(25px 32px 20px #62411245)}
.webgl-scene.is-ready .scene-fallback{opacity:0;visibility:hidden}
.stage-side-label{position:absolute;right:30px;top:50%;writing-mode:vertical-rl;font-size:8px;font-weight:800;letter-spacing:.2em;z-index:3}
.flavour-notes{position:absolute;left:46px;bottom:130px;width:300px;z-index:3}
.flavour-note{position:absolute;bottom:0;left:0;opacity:0;transform:translateY(12px);transition:opacity .24s,transform .24s;pointer-events:none}
.flavour-note.is-active{position:relative;opacity:1;transform:none;pointer-events:auto}
.flavour-number{font-size:9px;letter-spacing:.14em;font-weight:800;margin-bottom:14px}
.flavour-note h2{font-size:29px;letter-spacing:-.055em;line-height:1.15;max-width:240px}
.flavour-note>p:last-child{font-size:11px;margin-top:12px;max-width:235px;line-height:1.65}
.journey-controls{position:absolute;bottom:33px;left:46px;right:46px;z-index:4;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.scroll-cue{display:flex;align-items:center;gap:13px;font-size:8px;letter-spacing:.15em;font-weight:800}
.scroll-cue>span{border:1px solid #203b2550;border-radius:50%;width:33px;height:42px;display:grid;place-items:center;font-size:17px;font-weight:400;animation:scroll-nudge 2s ease-in-out infinite}
.flavour-finale{position:relative;overflow:hidden;min-height:740px;padding:110px max(46px,calc((100vw - 1280px)/2));background:#203b25;color:#fffce8;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.flavour-finale .eyebrow{color:#b9d979;font-size:10px;margin-bottom:30px}
.flavour-finale h2{font-size:clamp(70px,8vw,130px);position:relative;z-index:2;line-height:.99}
.flavour-finale h2 em{color:#c9e788}
.flavour-finale>p:not(.eyebrow){max-width:325px;font-size:13px;color:#d8dfcd;margin:27px 0;position:relative;z-index:2}
.finale-copy>p:not(.eyebrow){max-width:325px;font-size:13px;color:#d8dfcd;margin:27px 0;position:relative;z-index:2}
.flavour-finale .button{background:#d2eb91;color:#203b25;gap:30px;position:relative;z-index:2}
.flavour-finale .button:hover{background:#e5f8b1}
.flavour-finale .button span{font-size:23px}
.finale-cans{position:absolute;right:4%;top:17%;width:48%;height:65%;display:flex;align-items:center;justify-content:center}
.finale-cans::before{content:'';position:absolute;left:4%;right:4%;bottom:1%;height:18%;border-radius:50%;background:radial-gradient(ellipse,#091b12a6,transparent 68%);transform:rotate(-5deg);pointer-events:none}
.finale-cans::after{content:'';position:absolute;inset:4% -8% 5%;z-index:-1;background:radial-gradient(ellipse,#bddf7330,transparent 66%);pointer-events:none}
.finale-cans img{position:absolute;width:auto;height:70%;max-width:45%;object-fit:contain;filter:drop-shadow(20px 30px 14px #0004)}
.finale-cans img{bottom:8%;top:auto;transform-origin:50% 90%;transform:translateX(-50%) perspective(900px) rotateY(var(--yaw,0deg)) rotate(var(--tilt,0deg));filter:drop-shadow(8px 18px 10px #071c1759);transition:transform .8s cubic-bezier(.2,.75,.2,1),left .8s cubic-bezier(.2,.75,.2,1),opacity .5s ease}
.finale-cans .range-bottle-large{left:40%;bottom:15%;height:80%;z-index:1;--tilt:-7deg;--yaw:-8deg}
.finale-cans .range-bottle-small{left:64%;bottom:13%;height:66%;z-index:2;--tilt:11deg;--yaw:10deg}
.finale-cans .range-can-pomegranate{left:50%;bottom:3%;height:49%;z-index:5;--tilt:0deg;--yaw:0deg}
.finale-cans .range-can-grape{left:23%;bottom:7%;height:46%;z-index:4;--tilt:-15deg;--yaw:12deg}
.finale-cans .range-can-blueberry{left:77%;bottom:8%;height:46%;z-index:3;--tilt:16deg;--yaw:-12deg}
.is-scroll-chapter:not(.range-open) .range-bottle-large{left:41%;--tilt:-5deg}
.is-scroll-chapter:not(.range-open) .range-bottle-small{left:62%;--tilt:8deg}
.is-scroll-chapter:not(.range-open) .range-can-grape,
.is-scroll-chapter:not(.range-open) .range-can-pomegranate,
.is-scroll-chapter:not(.range-open) .range-can-blueberry{opacity:0;transform:translate(-50%,22%) perspective(900px) rotateY(0deg) rotate(0deg) scale(.85)}
.in-flavour-finale .range-bottle-large{animation:range-bottle-float 5s ease-in-out infinite}
@keyframes range-bottle-float{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media(prefers-reduced-motion:reduce){.in-flavour-finale .range-bottle-large{animation:none}}
.experience-footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:28px 46px;background:#f7f5e9}
.experience-footer img{width:95px;height:47px;object-fit:contain}
.experience-footer small{font-size:10px}
.experience-footer>div{display:flex;gap:25px;font-size:10px}
.experience-footer a:hover{text-decoration:underline}
@keyframes scroll-nudge{50%{transform:translateY(4px)}}
@media(min-width:1600px){.flavour-notes{left:5vw}.journey-controls{left:5vw;right:5vw}.flavour-note h2{font-size:35px}.flavour-notes{width:350px}}
@media(max-width:1000px){.flavour-note h2{font-size:24px;max-width:195px}.flavour-notes{width:210px;bottom:135px;left:28px}.flavour-note>p:last-child{max-width:185px}.page-home .header-inner{width:calc(100% - 50px)}.journey-controls{left:28px;right:28px;gap:12px}.scroll-cue{font-size:7px;gap:9px}.page-home .header-actions>.button{display:inline-flex}.page-home .navigation{gap:22px}.page-home .header-actions{gap:18px}.stage-eyebrow{top:125px}.flavour-finale{padding-inline:35px;min-height:660px}.finale-cans{right:1%;width:49%;height:58%;top:24%}.experience-footer{padding-inline:30px}}
@media(max-width:700px){.flavour-stage{min-height:600px}.page-home .header-inner{height:80px;width:calc(100% - 36px)}.page-home .brand,.page-home .brand img{width:92px;height:47px}.page-home .navigation{top:80px;background:#fcfaf3;margin-left:0}.page-home .header-actions{gap:12px}.page-home .header-actions>.button{padding:10px 13px;font-size:9px;gap:8px}.page-home .header-actions>.button svg{width:14px;height:14px}.page-home .languages{gap:5px}.stage-eyebrow{top:113px;font-size:8px;letter-spacing:.18em}.flavour-title{padding-bottom:26vh}.flavour-title span{font-size:22vw}.flavour-title[data-title="0"] span{font-size:16.3vw}html[lang="en"] .flavour-title[data-title="2"] span{font-size:13.3vw}.stage-side-label{right:12px;font-size:6px;top:41%}.flavour-notes{left:23px;bottom:122px;width:60%}.flavour-number{font-size:8px;margin-bottom:8px}.flavour-note h2{font-size:26px;max-width:240px}.flavour-note>p:last-child{font-size:10px;margin-top:7px;max-width:230px}.journey-controls{left:20px;right:20px;bottom:22px;display:flex;justify-content:space-between;gap:10px}.scroll-cue{position:absolute;bottom:61px;left:0;font-size:6px;gap:7px}.scroll-cue>span{border:0;width:auto;height:auto;font-size:13px;animation:none}.scene-fallback{height:43%;top:44%;max-width:45%}.flavour-finale{padding:70px 25px 370px;min-height:850px;align-items:center;text-align:center}.flavour-finale .eyebrow{font-size:8px;margin-bottom:24px}.flavour-finale h2{font-size:76px}.flavour-finale>p:not(.eyebrow){font-size:12px;margin:23px 0;max-width:290px}.flavour-finale .button{font-size:11px;padding:15px 23px}.finale-cans{top:auto;bottom:20px;left:9%;right:9%;width:82%;height:300px}.experience-footer{padding:25px;flex-wrap:wrap;gap:20px}.experience-footer>div{width:100%;justify-content:space-between;font-size:9px}.experience-footer small{font-size:8px}}
@media(min-width:641px) and (max-width:700px){.page-home .navigation{position:static;background:transparent}.page-home .header-actions>.button{display:inline-flex}.page-home .navigation a{font-size:11px}}
@media(max-width:370px){.page-home .brand,.page-home .brand img{width:77px}.page-home .header-actions{gap:9px}.page-home .header-actions>.button{padding:9px 11px;font-size:8px}.page-home .header-actions>.button svg{display:none}.page-home .languages{font-size:9px}.flavour-note h2{font-size:23px}.flavour-note>p:last-child{font-size:9px;max-width:185px}.stage-eyebrow{font-size:7px}.flavour-finale h2{font-size:65px}}
@media(max-height:650px) and (min-width:701px){.stage-eyebrow{top:105px}.flavour-notes{bottom:105px}.journey-controls{bottom:20px}.flavour-note h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){.scroll-cue>span{animation:none}.flavour-title,.flavour-note,.webgl-scene canvas{transition:none}}

.cta-chevron{width:23px;height:23px;flex-shrink:0;transition:transform .3s ease}.flavour-finale .button:hover .cta-chevron{transform:translateX(3px)}
.home-contact{padding:75px max(46px,calc((100vw - 1280px)/2));background:#f7f5e9;display:flex;align-items:center;justify-content:space-between;gap:60px;border-bottom:1px solid #203b2520}.home-contact .eyebrow{font-size:9px;margin-bottom:20px}.home-contact h2{font-size:clamp(48px,6vw,80px);letter-spacing:-.06em}.home-contact p:not(.eyebrow){max-width:430px;font-size:13px;line-height:1.8;margin-top:20px;color:#50634c}.contact-orbit{display:flex;align-items:center;justify-content:center;gap:22px;flex-shrink:0;border:1px solid #203b2538;border-radius:50%;width:170px;height:170px;font-size:13px;font-weight:700;transition:background .3s,border-color .3s}.contact-orbit:hover{background:#e4edcf;border-color:#203b25}.contact-orbit:hover .cta-chevron{transform:translateX(4px)}
@media(max-width:700px){.home-contact{padding:50px 25px;gap:30px;flex-direction:column;align-items:flex-start}.home-contact .eyebrow{font-size:7px;margin-bottom:18px}.home-contact h2{font-size:48px}.home-contact p:not(.eyebrow){font-size:12px;margin-top:17px}.contact-orbit{border-radius:100px;width:auto;height:auto;padding:15px 22px;gap:35px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.finale-cans img,.cta-chevron{transition:none}}

/* Equal side tracks keep the cue at the viewport centre at every width. */
.journey-controls {
  container-type:inline-size;
  --control-height:56px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:clamp(5px,1.3vw,24px);
}
.scroll-cue {
  position:relative;inset:auto;transform:none;grid-column:2;grid-row:1;justify-self:center;
  line-height:1;gap:clamp(4px,1cqw,11px);white-space:nowrap;
  font-size:clamp(5px,.85cqw,8px);letter-spacing:.12em;
}
.scroll-cue .scroll-icon {
  width:var(--control-height);height:var(--control-height);
  border:1px solid #203b2542;border-radius:50%;
  display:grid;place-items:center;animation:none;flex-shrink:0;
}
.scroll-icon svg {width:24px;height:24px;animation:scroll-chevron 2.4s ease-in-out infinite}
@keyframes scroll-chevron {0%,100%{transform:translateY(-2px);opacity:.5}50%{transform:translateY(2px);opacity:1}}
@media(max-width:700px) {
  .journey-controls {left:12px;right:12px;bottom:22px}
  .flavour-notes {bottom:115px;width:85%}
}
@media(max-width:600px) {
  .journey-controls {--control-height:52px}
  .scroll-cue {gap:0;letter-spacing:.06em}
  .scroll-cue .scroll-label {position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);white-space:nowrap}
}

@media(prefers-reduced-motion:reduce) {.scroll-icon svg{animation:none}}

/* Every flavour occupies the same three shared rows, including hidden copy. */
.flavour-notes {
  display:grid;grid-template-rows:auto auto auto;row-gap:12px;
  width:clamp(230px,25vw,300px);padding-left:16px;border-left:1px solid #203b2538;
}
.flavour-notes .flavour-note {
  position:static;grid-column:1;grid-row:1 / span 3;
  display:grid;grid-template-rows:subgrid;transform:none;transition:opacity .24s;
}
.flavour-note .flavour-number {margin:0}
.flavour-note h2 {max-width:none;min-height:2.3em}
.flavour-note>p:last-child {max-width:none;margin:0;min-height:3.3em}
@media(max-width:700px){.flavour-notes{width:min(340px,calc(100% - 46px));row-gap:10px;padding-left:12px}}

.scroll-cue .scroll-label{border:0;border-radius:0;width:auto;height:auto;display:inline;font:inherit;animation:none}

/* The hero now has one calm, centered scroll invitation—no flavour picker,
   progress strip or competing catalogue CTA on either mobile or desktop. */
.journey-controls{left:50%;right:auto;bottom:33px;transform:translateX(-50%);display:block;container-type:normal}
.journey-controls .scroll-cue{display:flex;position:relative;inset:auto;transform:none;gap:11px;font-size:8px;letter-spacing:.12em;white-space:nowrap}
@media(max-width:700px){.journey-controls{left:50%;right:auto;bottom:22px;transform:translateX(-50%)}.journey-controls .scroll-cue{gap:0;font-size:6px;letter-spacing:.06em}.journey-controls .scroll-cue .scroll-label{position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);white-space:nowrap}}

/* A full viewport chapter follows the completed sticky can journey in normal
   document flow. Its content can grow on short screens or with larger text. */
/* Oversized snap areas permit free scrolling inside the can journey, but the
   viewport cannot settle across the boundary between two chapters. */
html:has(body.page-home){scroll-snap-type:y mandatory;scroll-padding-top:0}
.flavour-journey{scroll-snap-align:start}
.home-contact,.experience-footer{scroll-snap-align:start}
.flavour-chapter{position:relative;background:#203b25;scroll-snap-align:start;scroll-margin:0;z-index:6;box-shadow:0 -30px 70px #12251a24}
.flavour-chapter.is-scroll-chapter{height:calc(var(--chapter-height,100svh) + 100svh)}
.is-scroll-chapter .flavour-finale{position:sticky;top:0}
.chapter-reveal-stop{position:absolute;bottom:var(--chapter-height,100svh);height:0;width:1px;pointer-events:none;scroll-snap-align:start}
.flavour-finale .finale-copy>.button{box-shadow:0 0 0 0 #d2eb9100;transition:box-shadow .7s,background .7s,transform .7s,opacity .65s,translate .8s}
.range-open .finale-copy>.button{background:#e5f8b1;box-shadow:0 0 0 7px #d2eb911a,0 10px 34px #c9e78825;transform:translateY(-3px)}
.flavour-finale{min-height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:4vw;padding:clamp(110px,14svh,160px) max(46px,calc((100vw - 1280px)/2)) 60px}
.finale-copy{position:relative;z-index:2}
.flavour-finale{isolation:isolate}
.flavour-finale::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 74% 48%,#45644155,transparent 65%)}
.page-home .header{transition:background .45s,color .45s}
.page-home.in-flavour-finale .header{background:#203b2573;color:#fffce8}
.page-home.in-flavour-finale .header-actions>.button{background:#d2eb91;color:#203b25}
@media(prefers-reduced-motion:reduce){.finale-copy>*,.flavour-finale .finale-cans,.page-home .header{transition:none}}
.flavour-finale .finale-cans{position:relative;inset:auto;width:100%;height:clamp(300px,65svh,760px)}
@media(max-width:1000px) and (min-width:701px){.flavour-finale{padding-inline:35px;gap:20px}.flavour-finale h2{font-size:clamp(64px,9vw,90px)}}
@media(max-width:700px){.flavour-finale{min-height:100svh;grid-template-columns:minmax(0,1fr);gap:24px;padding:104px 25px 32px;align-content:center;text-align:center}.finale-copy>p:not(.eyebrow){font-size:12px;max-width:290px;margin:20px auto}.flavour-finale h2{font-size:clamp(52px,14vw,76px)}.flavour-finale .eyebrow{margin-bottom:20px}.flavour-finale .finale-cans{width:100%;height:clamp(210px,34svh,360px)}}
/* Keep the foreground cans and rear bottles clustered on mobile. */
@media(max-width:700px){
  .finale-cans .range-bottle-large{left:42%;height:86%}
  .finale-cans .range-bottle-small{left:61%;height:69%}
  .finale-cans .range-can-grape{left:27%}
  .finale-cans .range-can-blueberry{left:73%}
}
@media(prefers-reduced-motion:reduce){.flavour-finale .finale-copy>.button{transition:none}.in-flavour-finale .range-bottle-large{animation:none}}

/* Match the floating navigation with a small, softly reflective glass cue. */
.journey-controls .scroll-cue .scroll-icon{
  background:linear-gradient(140deg,#fffef55c,#fffef512 60%,#fffef533);
  border:.5px solid #ffffff42;
  box-shadow:inset 0 .5px 0 #ffffff52,0 5px 16px #203b2512;
  -webkit-backdrop-filter:blur(10px) saturate(125%);backdrop-filter:blur(10px) saturate(125%);
}
@media(prefers-reduced-transparency:reduce){.journey-controls .scroll-cue .scroll-icon{background:#f7f5e9;backdrop-filter:none}}