/* Horizon: one continuous, scroll-directed product composition. */
.motion-intro{--scene-bg:#173e2c;--scene-ink:#f5f0db;--scene-accent:#c2d68b;position:relative;background:var(--scene-bg);color:var(--scene-ink);isolation:isolate}
.motion-stage{height:calc(100svh - 86px);min-height:0;position:relative;overflow:clip;background:var(--scene-bg);color:var(--scene-ink);isolation:isolate}
.motion-ready .motion-intro{height:310svh}.motion-ready .motion-stage{position:sticky;top:86px}
.motion-scenes,.motion-scene{position:absolute;inset:0}.motion-scene{opacity:0;pointer-events:none;z-index:3;will-change:opacity}.motion-scene:first-child{opacity:1;pointer-events:auto}.motion-scene.is-active{pointer-events:auto}
.motion-word{position:absolute;left:50%;top:39%;translate:-50% -50%;font-family:Georgia,'Playfair Display',serif;font-size:clamp(150px,23vw,390px);font-weight:700;line-height:.9;letter-spacing:-.07em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px var(--scene-ink);opacity:.12;user-select:none;will-change:transform}
.motion-copy{position:absolute;top:50%;left:max(5vw,calc((100vw - 1340px)/2));width:38%;max-width:520px;translate:0 -50%;z-index:6;will-change:transform,opacity}
.motion-eyebrow{font-size:9px;font-weight:600;letter-spacing:.19em;margin-bottom:28px;opacity:.7}
.motion-title{font-family:'Playfair Display',Georgia,serif;font-size:clamp(64px,7.2vw,112px);font-weight:600;line-height:1.01;letter-spacing:-.065em;margin:0}.motion-title span{display:block}.motion-title em{color:var(--scene-accent);font-weight:600}
.motion-subtitle{font-family:'Playfair Display',Georgia,serif;font-size:clamp(22px,2.25vw,34px);letter-spacing:-.03em;margin-top:19px}.motion-description{font-size:12px;line-height:1.9;max-width:310px;opacity:.7;margin-top:17px}
.motion-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;margin-top:27px;padding:17px 23px;border-radius:99px;background:var(--scene-ink);color:var(--scene-bg);font-size:11px;font-weight:700;transition:transform .25s}.motion-cta:hover{transform:translateY(-4px)}.motion-cta span{font-size:20px;font-weight:400}
.motion-product-wrap{position:absolute;left:65%;top:48%;width:clamp(270px,34vw,570px);height:86%;translate:-50% -50%;transform-origin:50% 70%;will-change:transform}.motion-product-float{height:100%;width:100%;animation:motion-hover 6s ease-in-out infinite}.motion-product{width:100%;height:100%;object-fit:contain;filter:drop-shadow(12px 26px 20px #0003);user-select:none;-webkit-user-drag:none}
.motion-product-label{position:absolute;bottom:17%;right:5%;text-align:right;display:flex;flex-direction:column;gap:8px;z-index:6;will-change:transform}.motion-product-label span{font-size:8px;letter-spacing:.16em;opacity:.65}.motion-product-label strong{font-family:'Playfair Display',Georgia,serif;font-size:clamp(18px,2vw,29px);font-weight:500}
.motion-halo{position:absolute;left:65%;top:50%;width:47vw;height:47vw;max-width:760px;max-height:760px;border-radius:50%;translate:-50% -50%;background:radial-gradient(circle,var(--scene-accent),transparent 69%);opacity:.2;z-index:0;will-change:transform}
.motion-orbit{position:absolute;border:1px solid currentColor;opacity:.15;border-radius:50%;left:65%;top:50%;translate:-50% -50%;width:51vw;height:34vw;pointer-events:none;z-index:2}.orbit-a{rotate:-28deg;animation:orbit-drift 35s linear infinite}.orbit-b{width:39vw;height:51vw;rotate:30deg;animation:orbit-drift 48s linear infinite reverse}
.motion-grain{position:absolute;inset:0;pointer-events:none;opacity:.06;z-index:8;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23noise)' d='M0 0h150v150H0z'/%3E%3C/svg%3E")}
.motion-reel{position:absolute;inset:0;opacity:.14;clip-path:circle(var(--reel-size,19%) at 80% 65%);z-index:0;mix-blend-mode:luminosity;pointer-events:none;will-change:clip-path}.motion-reel:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--scene-bg) 12%,transparent 80%)}.motion-reel video{width:100%;height:100%;object-fit:cover}
.motion-topline{position:absolute;top:28px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;z-index:10;font-size:8px;letter-spacing:.16em}.motion-topline button{padding:8px 11px;border:1px solid #ffffff30;border-color:color-mix(in srgb,currentColor 25%,transparent);border-radius:99px;font-size:9px;letter-spacing:0}
.motion-bottom{position:absolute;bottom:30px;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:10}.motion-scroll-hint{font-size:8px;letter-spacing:.15em;display:flex;gap:16px;align-items:center}.motion-scroll-hint span{font-size:19px;animation:motion-nudge 1.7s ease-in-out infinite}.motion-film-trigger{font-size:10px;display:flex;gap:20px;align-items:center}.motion-film-trigger span{font-size:20px}
.motion-scene-nav{display:flex;align-items:center;gap:24px}.motion-scene-nav button{display:flex;align-items:center;gap:9px;font-size:9px;opacity:.45;padding:10px 0;transition:opacity .25s}.motion-scene-nav button[aria-current='step']{opacity:1}.motion-scene-nav i{width:28px;height:1px;background:currentColor;transform:scaleX(.4);transform-origin:left;transition:transform .3s}.motion-scene-nav button[aria-current='step'] i{transform:scaleX(1)}.motion-scene-nav b{font-weight:500}
.motion-progress{position:absolute;bottom:0;left:0;right:0;height:3px;z-index:12;background:#ffffff12}.motion-progress span{display:block;width:100%;height:100%;background:var(--scene-accent);transform-origin:left;transform:scaleX(var(--motion-progress,0));will-change:transform}
.motion-ingredients{position:absolute;inset:0;z-index:4;pointer-events:none;will-change:transform}.motion-leaf{position:absolute;color:#78994c;will-change:transform,opacity}.motion-leaf svg{width:100%;height:100%}.leaf-one{width:110px;left:48%;top:13%;rotate:-22deg}.leaf-two{width:160px;right:3%;top:28%;rotate:130deg;filter:blur(1px)}.leaf-three{width:85px;left:46%;bottom:14%;rotate:30deg}.motion-ice{position:absolute;width:47px;height:47px;border:1px solid #fff8;border-radius:12px;background:linear-gradient(130deg,#fffa,#ffffff08 65%,#fff5);box-shadow:inset 3px 3px 6px #fff6;backdrop-filter:blur(3px);rotate:28deg}.ice-one{right:10%;top:20%}.ice-two{left:50%;bottom:21%;width:35px;height:35px;rotate:-17deg}.motion-bean{position:absolute;width:41px;height:62px;border-radius:50%;background:linear-gradient(110deg,#4c291a,#9b6343 46%,#382017);box-shadow:7px 12px 16px #0003}.motion-bean:after{content:'';position:absolute;top:9%;bottom:9%;left:48%;width:3px;rotate:8deg;border-radius:50%;background:#20120b}.bean-one{top:17%;left:48%;rotate:35deg}.bean-two{bottom:20%;right:8%;rotate:-25deg}.motion-citrus{position:absolute;width:110px;height:110px;border-radius:50%;border:7px solid #fbdca5;background:repeating-conic-gradient(#ffc364 0deg 40deg,#ffe6ae 41deg 44deg);box-shadow:0 0 0 3px #e79635,8px 16px 25px #7a421020}.citrus-one{right:5%;top:19%;rotate:28deg}.citrus-two{left:48%;bottom:17%;width:68px;height:68px;rotate:-25deg}
.motion-bean,.motion-citrus{opacity:0}
.motion-outro{position:relative;overflow:hidden;padding:80px 24px 65px;text-align:center;background:#f5f0e4;color:#183e2b}.motion-outro:before,.motion-outro:after{content:'✳';position:absolute;font-size:110px;color:#9ba76140;top:30%;left:8%;rotate:-18deg}.motion-outro:after{left:auto;right:8%;rotate:15deg}.motion-outro-kicker{font-size:9px;letter-spacing:.2em;font-weight:600}.motion-outro h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(40px,5vw,76px);line-height:1.12;letter-spacing:-.05em;margin-top:20px}.motion-outro h2 em{color:#83934e}.motion-outro p{font-size:12px;line-height:1.9;margin-top:22px;color:#64705f}.motion-outro>a{display:inline-flex;gap:35px;align-items:center;font-size:11px;font-weight:700;border-bottom:1px solid #b5bda4;padding:12px 0;margin-top:17px}.motion-menu-status{display:block;font-size:8px;margin-top:25px;opacity:.6}
.motion-film-dialog{border:0;padding:48px 18px 18px;width:min(1100px,94vw);max-width:94vw;background:#0e2019;color:white;border-radius:10px;overflow:visible}.motion-film-dialog::backdrop{background:#05150eeb;backdrop-filter:blur(10px)}.motion-film-dialog>button{position:absolute;right:20px;top:15px;font-size:12px}.motion-film-dialog>video{width:100%;max-height:75svh;display:block}
.motion-paused .motion-stage *{animation-play-state:paused!important}
@keyframes motion-hover{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(1deg)}}@keyframes orbit-drift{to{transform:rotate(360deg)}}@keyframes motion-nudge{50%{transform:translateY(6px)}}
@media(min-width:1600px){.motion-copy{left:calc((100vw - 1400px)/2)}.motion-product-label{right:calc((100vw - 1400px)/2)}}
@media(max-width:1000px){.motion-title{font-size:76px}.motion-product-wrap{left:70%;width:44vw;height:75%}.motion-product-label{right:5%;bottom:18%}.motion-description{max-width:260px}.motion-scene-nav{gap:15px}.motion-scene-nav b{display:none}.motion-eyebrow{font-size:8px}}
@media(max-width:767px){.motion-ready .motion-intro{height:270svh}.motion-stage{top:74px!important;height:calc(100svh - 74px);min-height:0}.motion-topline{top:18px;left:6%;right:6%}.motion-topline>span{font-size:6px;letter-spacing:.13em}.motion-topline button{font-size:8px;padding:7px 9px}.motion-copy{left:7%;top:13%;translate:none;width:85%;max-width:none}.motion-eyebrow{font-size:7px;margin-bottom:14px}.motion-title{font-size:clamp(55px,15vw,80px);line-height:.95;letter-spacing:-.055em}.motion-title span{display:inline}.motion-title span+span{margin-left:.18em}.motion-subtitle{font-size:23px;margin-top:12px}.motion-description{font-size:10px;line-height:1.7;max-width:240px;margin-top:10px}.motion-cta{font-size:9px;padding:12px 17px;gap:26px;margin-top:15px}.motion-cta span{font-size:16px}.motion-product-wrap{left:57%;top:65%;width:66vw;height:51%;max-width:370px}.motion-product-label{bottom:18%;right:7%;max-width:125px}.motion-product-label strong{font-size:17px}.motion-product-label span{font-size:5px;line-height:1.8;letter-spacing:.1em}.motion-word{top:60%;font-size:36vw;opacity:.14}.motion-halo{left:57%;top:63%;width:110vw;height:110vw}.motion-orbit{left:57%;top:65%;width:100vw;height:70vw}.orbit-b{width:70vw;height:105vw}.leaf-one{width:70px;left:8%;top:49%}.leaf-two{width:100px;right:-5%;top:48%}.leaf-three{width:55px;left:13%;bottom:15%}.ice-one{right:10%;top:48%;width:34px;height:34px}.ice-two{left:12%;bottom:27%;width:25px;height:25px}.bean-one{left:13%;top:50%;width:26px;height:40px}.bean-two{right:10%;bottom:19%;width:28px;height:42px}.citrus-one{right:-2%;top:48%;width:68px;height:68px;border-width:5px}.citrus-two{left:10%;bottom:23%;width:45px;height:45px;border-width:4px}.motion-bottom{left:7%;right:7%;bottom:20px;gap:12px;flex-wrap:wrap}.motion-scroll-hint{font-size:6px;gap:9px;order:2}.motion-scene-nav{width:100%;justify-content:center;gap:28px;margin-bottom:4px}.motion-scene-nav b{display:inline;font-size:8px}.motion-scene-nav button{font-size:8px;gap:7px}.motion-scene-nav i{width:16px}.motion-film-trigger{font-size:8px;order:3}.motion-film-trigger span{font-size:16px}.motion-outro{padding:58px 22px 45px}.motion-outro p{font-size:10px}.motion-outro:before,.motion-outro:after{font-size:55px;left:-15px}.motion-outro:after{left:auto;right:-15px}.motion-reel{opacity:.1}}
@media(max-width:380px){.motion-title{font-size:51px}.motion-copy{top:12%}.motion-description{max-width:225px}.motion-product-label{bottom:19%;right:5%}.motion-product-wrap{left:52%;width:69vw}}
.motion-ready .motion-intro.motion-reduced{height:auto}.motion-ready .motion-reduced .motion-stage{position:relative;top:0!important;height:auto;min-height:0}.motion-reduced .motion-scenes{position:relative;display:grid;grid-template-columns:repeat(3,1fr)}.motion-reduced .motion-scene{position:relative;inset:auto;min-height:680px;opacity:1!important;pointer-events:auto}.motion-reduced .motion-copy{position:relative;left:auto;top:auto;translate:none;width:auto;padding:40px 24px;transform:none!important;opacity:1!important}.motion-reduced .motion-title{font-size:44px}.motion-reduced .motion-title span{display:block}.motion-reduced .motion-title span+span{margin:0}.motion-reduced .motion-product-wrap{height:300px;width:90%;left:50%;top:auto;bottom:30px;translate:-50% 0;transform:none!important}.motion-reduced .motion-product-label,.motion-reduced .motion-word,.motion-reduced .motion-ingredients,.motion-reduced .motion-reel,.motion-reduced .motion-orbit,.motion-reduced .motion-halo,.motion-reduced .motion-topline,.motion-reduced .motion-bottom{display:none}.motion-reduced .motion-product-float{animation:none}.motion-reduced .scene-coffee{background:#eadbc7;color:#45291f}.motion-reduced .scene-peach{background:#f6b986;color:#572e1a}.motion-reduced .motion-outro{animation:none}@media(max-width:1000px){.motion-reduced .motion-scenes{grid-template-columns:1fr}.motion-reduced .motion-scene{min-height:650px}}
.motion-access{display:none}.motion-reduced .motion-access{display:flex;align-items:center;justify-content:center;gap:20px;padding:16px 22px;background:#173e2c;color:#f5f0db;font-size:11px;flex-wrap:wrap}.motion-access button{border-bottom:1px solid #c2d68b;padding:5px 0;color:#c2d68b}.motion-reduced .scene-matcha{--scene-bg:#173e2c;--scene-ink:#f5f0db;--scene-accent:#c2d68b}.motion-reduced .scene-coffee{--scene-bg:#eadbc7;--scene-ink:#41291d;--scene-accent:#825234}.motion-reduced .scene-peach{--scene-bg:#f6b986;--scene-ink:#532f1f;--scene-accent:#a4401a}

@media(max-height:700px) and (min-width:768px){.motion-title{font-size:64px}.motion-eyebrow{margin-bottom:18px}.motion-subtitle{font-size:25px;margin-top:14px}.motion-description{margin-top:12px;font-size:11px}.motion-cta{margin-top:18px;padding:13px 20px}.motion-product-wrap{height:80%;top:46%}.motion-product-label{bottom:18%}.motion-copy{top:46%}.motion-bottom{bottom:20px}.motion-topline{top:20px}}
@media(max-height:700px) and (max-width:767px){.motion-title{font-size:49px}.motion-copy{top:12%}.motion-subtitle{font-size:20px}.motion-description{font-size:9px;max-width:220px}.motion-product-wrap{height:45%;top:67%}.motion-product-label{bottom:21%}.motion-cta{margin-top:10px;padding:10px 15px}.motion-bottom{bottom:12px}.motion-scene-nav{margin-bottom:0}}
.motion-opt-in .motion-product-float{animation:motion-hover 6s ease-in-out infinite!important}.motion-opt-in .orbit-a{animation:orbit-drift 35s linear infinite!important}.motion-opt-in .orbit-b{animation:orbit-drift 48s linear infinite reverse!important}.motion-opt-in .motion-scroll-hint span{animation:motion-nudge 1.7s ease-in-out infinite!important}.motion-opt-in.motion-paused .motion-stage *{animation-play-state:paused!important}

.motion-citrus{border-color:#ee9e77;border-radius:48% 52% 50% 46%;background:radial-gradient(ellipse at 50% 60%,#9d482a 0 11%,#d88049 13% 20%,#ffd39c 24% 72%,#efad7f 75%);box-shadow:0 0 0 3px #df855f,8px 16px 25px #7a421020}

/* V6 — art directed liquid orbit, editorial masks and spatial choreography. */
.motion-stage{perspective:1200px}.motion-ready .motion-intro:not(.motion-reduced){height:350svh}
.motion-fluid{position:absolute;inset:0;z-index:2;pointer-events:none;isolation:isolate}.motion-fluid-layer{position:absolute;left:68%;top:49%;translate:-50% -50%;width:min(69vw,1000px);height:108%;object-fit:contain;opacity:0;filter:drop-shadow(0 18px 18px #0002);will-change:transform,opacity}.motion-fluid-layer:first-child{opacity:1}
.motion-product-wrap{z-index:4;transform-style:preserve-3d}.motion-product-float{animation:v6-product-breathe 7s cubic-bezier(.37,0,.63,1) infinite}.motion-opt-in .motion-product-float{animation:v6-product-breathe 7s cubic-bezier(.37,0,.63,1) infinite!important}
.motion-title>span{overflow:clip;padding-bottom:.14em;margin-bottom:-.14em}.motion-title .motion-line{display:block;font:inherit;font-weight:inherit;will-change:transform;transform-origin:0 100%}.motion-title em{display:inline-block}.motion-copy{z-index:7}.motion-word{font-size:clamp(160px,25vw,420px);letter-spacing:-.08em}.motion-product-label{z-index:8;bottom:16%;right:4%;padding:9px 0 9px 13px;border-left:1px solid color-mix(in srgb,var(--scene-ink) 25%,transparent)}
.motion-cinematic-status{position:absolute;top:27px;left:50%;translate:-50% 0;display:flex;align-items:center;gap:8px;font-size:7px;letter-spacing:.16em;z-index:11;opacity:.65}.motion-cinematic-status:before{content:'';width:4px;height:4px;background:var(--scene-accent);border-radius:50%;box-shadow:0 0 10px var(--scene-accent)}
.motion-reel{opacity:.22;mix-blend-mode:soft-light;clip-path:ellipse(var(--reel-size,44%) 58% at 77% 48%);mask-image:linear-gradient(90deg,transparent 33%,#000 70%)}.motion-reel:after{background:linear-gradient(90deg,var(--scene-bg),transparent 80%)}
.motion-ingredients{z-index:5}.motion-leaf{opacity:.15!important}.motion-bean,.motion-citrus{display:none}.motion-ice{opacity:.35!important;animation:v6-ice-drift 8s ease-in-out infinite alternate}.ice-two{animation-delay:-4s}.motion-orbit{opacity:.1}.motion-halo{opacity:.3}
.motion-grain{opacity:.035}.motion-scene-nav button{position:relative}.motion-scene-nav button:after{content:'';position:absolute;bottom:3px;left:0;right:0;height:1px;background:currentColor;scale:0 1;transform-origin:left;transition:scale .6s}.motion-scene-nav button[aria-current=step]:after{scale:1 1}
@keyframes v6-product-breathe{0%,100%{transform:translate3d(0,0,0) rotate(-1deg)}50%{transform:translate3d(0,-10px,14px) rotate(1.3deg)}}
@keyframes v6-ice-drift{to{translate:8px -17px;rotate:43deg}}
.motion-paused .motion-stage *{animation-play-state:paused!important}.motion-reduced .motion-fluid,.motion-reduced .motion-cinematic-status{display:none}.motion-reduced .motion-title .motion-line{transform:none!important}.motion-reduced .motion-product-float{animation:none!important}
@media(max-width:767px){.motion-ready .motion-intro:not(.motion-reduced){height:310svh}.motion-fluid-layer{left:57%;top:67%;width:115vw;height:68%}.motion-product-label{bottom:20%;right:5%;max-width:110px;padding-left:8px}.motion-cinematic-status{top:50px;font-size:6px;left:7%;translate:none}.motion-copy{top:16%}.motion-title .motion-line{display:inline-block}.motion-title>span{display:inline-block;vertical-align:bottom}.motion-ingredients{z-index:2}.motion-reel{mask-image:linear-gradient(180deg,transparent 25%,#000 70%)}.motion-word{font-size:38vw;top:64%}}
@media(max-height:700px) and (min-width:768px){.motion-cinematic-status{top:23px}.motion-eyebrow{font-size:7px}.motion-copy{top:47%}.motion-product-wrap{height:78%;top:46%}.motion-product-label{bottom:17%}.motion-fluid-layer{height:110%}}
@media(max-height:700px) and (max-width:767px){.motion-cinematic-status{top:43px}.motion-copy{top:16%}.motion-title{font-size:44px}.motion-description{max-width:205px}.motion-fluid-layer{top:69%;height:59%}.motion-product-wrap{top:69%;height:43%}}

.motion-intro:not(.motion-reduced) .motion-fluid-layer{animation:v6-fluid-orbit 10s ease-in-out infinite!important}.motion-fluid-layer:nth-child(2){animation-delay:-3s!important}.motion-fluid-layer:nth-child(3){animation-delay:-6s!important}
@keyframes v6-fluid-orbit{0%,100%{rotate:-4deg;scale:.98}50%{rotate:5deg;scale:1.035}}
.motion-cinematic-status{border:0;background:none;color:inherit;cursor:pointer;padding:8px 0}.motion-paused .motion-fluid-layer{animation-play-state:paused!important}

.motion-product-label{background:color-mix(in srgb,var(--scene-bg) 88%,transparent);backdrop-filter:blur(8px);border-radius:0 9px 9px 0;padding:11px 14px;max-width:245px}.motion-product-label strong{font-size:clamp(17px,1.8vw,27px)}
@media(max-width:767px){.motion-product-label{padding:8px 9px;max-width:115px}.motion-product-label strong{font-size:16px}}

.motion-intro.motion-paused .motion-stage .motion-fluid-layer{animation-play-state:paused!important}

.motion-cinematic-status{font-size:10px;letter-spacing:.04em;padding:8px 13px;border:1px solid color-mix(in srgb,currentColor 25%,transparent);border-radius:99px;background:color-mix(in srgb,var(--scene-bg) 75%,transparent);opacity:.85;top:18px}.motion-cinematic-status:hover{opacity:1}
@media(max-width:767px){.motion-cinematic-status{font-size:8px;top:47px;padding:6px 10px}}
