@font-face{font-family:Changa;src:url('public/fonts/changa-one.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Dela;src:url('public/fonts/dela.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Zen;src:url('public/fonts/zen.woff2') format('woff2');font-weight:500;font-display:swap}
:root{--cream:#f6f1e6;--ink:#074c38;--yellow:#f8e979;--pink:#e88c99;--space:clamp(24px,5.2vw,96px);--header-height:88px;--body-font:Zen,'Hiragino Kaku Gothic ProN',sans-serif;--display-font:Dela,sans-serif;--english-font:Changa,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 20px)}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body-font);font-weight:500;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button,img{-webkit-user-select:none;user-select:none}button{border:0}button:focus-visible,a:focus-visible{outline:3px solid #bf593a;outline-offset:6px}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--display-font);font-weight:400}button,dialog{color:var(--ink)}::selection{background:var(--yellow);color:var(--ink)}[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:var(--yellow);padding:15px}.skip-link:focus{top:15px}.eyebrow{font-family:var(--english-font);font-size:14px;letter-spacing:.07em}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-height:54px;padding:14px 28px;border-radius:99px;font-weight:500;font-size:14px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px)}.button:active{transform:scale(.97)}.button-yellow{background:var(--yellow);color:var(--ink)}.button-yellow:hover{background:#f7df42}.button-green{background:var(--ink);color:var(--cream)}.button-green:hover{background:#17634a}.arrow{font-family:Arial,sans-serif;font-size:24px;line-height:1;transition:transform .2s}.button:hover .arrow{transform:translate(2px,-2px)}
.site-header{position:fixed;z-index:40;top:0;left:0;right:0;height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space);background:rgba(246,241,230,.94);border-bottom:1px solid rgba(7,76,56,.09)}.brand{display:flex;align-items:baseline;font-family:var(--english-font);font-size:32px;gap:5px;line-height:1;white-space:nowrap}.brand-do{font-size:44px;letter-spacing:-.045em}.brand i{font-style:normal;font:10px Arial;align-self:flex-start;margin-top:6px}.desktop-nav{display:flex;gap:40px;font-size:13px}.desktop-nav a{position:relative;padding:12px 0}.desktop-nav a:after{content:'';position:absolute;left:0;right:0;bottom:5px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s}.desktop-nav a:hover:after{transform:scaleX(1)}.header-coupon{min-height:44px;font-size:12px;padding:10px 22px;gap:24px}.header-coupon .arrow{font-size:20px}.menu-toggle{display:none}.mobile-menu{display:none}
#flavor-story{height:100svh;position:relative}.js #flavor-story{height:660svh}.hero-stage{position:sticky;top:0;height:100svh;min-height:640px;overflow:hidden;isolation:isolate;background:var(--cream)}.hero-copy{position:absolute;z-index:8;left:var(--space);top:21.5%;pointer-events:none}.hero-copy .eyebrow{margin-bottom:22px}.hero-copy h1{font-size:clamp(40px,4.9vw,88px);letter-spacing:-.08em;line-height:1.3}.question-mark{display:inline-block;margin-left:-.04em}.hero-intro{margin-top:24px;font-size:16px;line-height:1.8;letter-spacing:.04em}.mobile-break{display:none}.flavor-scene{--scene-opacity:0;--scene-x:0px;--scene-scale:1;--art-x:0px;--art-y:0px;--art-rotate:0deg;--cup-y:0px;--word-x:0px;position:absolute;inset:0;opacity:var(--scene-opacity);transform:translate3d(var(--scene-x),0,0) scale(var(--scene-scale));pointer-events:none;will-change:transform,opacity}.flavor-scene:first-of-type{--scene-opacity:1}.flavor-scene[data-flavor-scene="0"]{--scene-opacity:1}.strawberry{--flavor-color:#e56c83;--word-color:#e9c3bd}.mango{--flavor-color:#d58a0d;--word-color:#eed093}.kiwi{--flavor-color:#538251;--word-color:#c7d7a9}.flavor-word{position:absolute;left:50%;top:50%;transform:translate3d(calc(-50% + var(--word-x)),0,0);font-family:var(--english-font);font-size:clamp(100px,19.3vw,345px);font-weight:400;letter-spacing:-.045em;line-height:.85;white-space:nowrap;color:var(--word-color);z-index:0}.mango .flavor-word,.kiwi .flavor-word{font-size:clamp(180px,30vw,520px);top:44%}.scene-art{position:absolute;z-index:2;right:-2%;top:13%;width:60%;height:77%;object-fit:contain;mix-blend-mode:multiply;transform:translate3d(var(--art-x),var(--art-y),0) rotate(var(--art-rotate));will-change:transform}.scene-cup{position:absolute;z-index:3;left:44%;bottom:12%;width:25%;height:57%;object-fit:contain;mix-blend-mode:multiply;transform:translate3d(0,var(--cup-y),0) rotate(-7deg);will-change:transform}.flavor-caption{position:absolute;z-index:7;left:var(--space);bottom:18.5%}.flavor-kicker{font-family:var(--english-font);font-size:12px;letter-spacing:.06em}.flavor-caption h2{font-family:var(--english-font);font-size:clamp(33px,3vw,51px);line-height:1.1;margin-top:7px}.flavor-caption h2 span{display:inline-block;font-family:var(--body-font);font-size:12px;margin-left:16px;vertical-align:middle;letter-spacing:.03em}.flavor-caption p{font-size:12px;margin-top:12px}.flavor-sign{position:absolute;z-index:5;right:5%;top:24%;font-family:var(--english-font);font-style:italic;font-size:26px;color:var(--flavor-color);line-height:.9;transform:rotate(10deg)}.hero-bottom{position:absolute;bottom:5%;left:var(--space);right:var(--space);z-index:12;display:flex;align-items:center;justify-content:space-between;gap:30px}.scroll-note{display:flex;align-items:center;gap:13px;font-family:var(--english-font);font-size:11px;letter-spacing:.05em}.scroll-note small{display:block;font-family:var(--body-font);font-size:10px;margin-top:4px;letter-spacing:0}.scroll-line{display:block;width:1px;height:39px;background:var(--ink);position:relative}.scroll-line:after{content:'';width:5px;height:5px;border:solid var(--ink);border-width:0 1px 1px 0;position:absolute;bottom:0;left:-2px;transform:rotate(45deg)}.flavor-controls{display:flex;gap:6px;align-items:center;padding:6px;border-radius:60px;background:rgba(255,255,255,.6);border:1px solid rgba(7,76,56,.1)}.flavor-controls button{display:flex;align-items:center;gap:8px;padding:12px 16px;background:transparent;border-radius:40px;min-height:44px;font-family:var(--english-font);font-size:15px;transition:background .18s,color .18s}.flavor-controls button[aria-pressed="true"]{background:var(--ink);color:var(--cream)}.flavor-controls button:hover{background:#d8ddc7;color:var(--ink)}.flavor-dot{display:block;width:9px;height:9px;border-radius:50%}.dot-strawberry{background:#ef899f}.dot-mango{background:#eec25e}.dot-kiwi{background:#a4c57e}.flavor-counter{display:flex;gap:12px;align-items:baseline;font-family:var(--english-font);font-size:30px}.flavor-counter b{font-weight:400}.flavor-counter>span{font-size:14px;opacity:.5}.skip-story{position:absolute;right:var(--space);bottom:15%;font-size:11px;z-index:13;display:flex;align-items:center;gap:20px}.skip-story:hover{text-decoration:underline}
.flavors-section{padding:70px var(--space) 46px;background:#f5e9a7;position:relative;overflow:hidden}.section-topline{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.06em;padding-bottom:23px;border-bottom:1px solid rgba(7,76,56,.25)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:54px}.section-heading h2{font-size:clamp(32px,4.4vw,66px);line-height:1.4;letter-spacing:-.06em}.section-heading p{font-size:14px;line-height:2.1;margin-right:5%}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4.3vw;margin-top:16px}.product{position:relative;min-width:0;padding-top:50px}.product-mango{padding-top:95px}.product-kiwi{padding-top:140px}.product-number{font-family:var(--english-font);font-size:14px;position:absolute;top:50px;left:0}.product-mango .product-number{top:95px}.product-kiwi .product-number{top:140px}.product-word{font-family:var(--english-font);font-style:italic;position:absolute;z-index:0;top:22%;left:50%;transform:translateX(-50%) rotate(-9deg);font-size:clamp(58px,7vw,112px);color:rgba(177,75,78,.27);white-space:nowrap}.product-mango .product-word{top:28%;color:rgba(174,102,9,.28)}.product-kiwi .product-word{top:35%;color:rgba(54,104,60,.24)}.product-image-button{position:relative;z-index:1;display:block;background:none;padding:0;width:100%;mix-blend-mode:multiply}.product-image-button img{width:100%;height:clamp(280px,30vw,440px);object-fit:contain;transform:rotate(-9deg);transition:transform .4s cubic-bezier(.2,.8,.2,1)}.product-mango .product-image-button img{transform:rotate(4deg)}.product-kiwi .product-image-button img{transform:rotate(-5deg)}.product-image-button:hover img{transform:translateY(-12px) rotate(0deg)}.product-info{display:flex;align-items:center;justify-content:space-between;margin-top:20px;padding-top:22px;border-top:1px solid rgba(7,76,56,.25)}.product h3{font-family:var(--english-font);font-size:32px;font-weight:400;line-height:1.15}.product h3 span{display:block;font-family:var(--body-font);font-size:11px;margin-top:8px}.round-link{background:transparent;border:1px solid var(--ink);border-radius:50%;width:45px;height:45px;font:23px Arial;transition:background .2s,color .2s,transform .2s}.round-link:hover{background:var(--ink);color:var(--yellow);transform:rotate(45deg)}.product>p{font-size:12px;margin-top:18px}.collection-note{font-size:10px;opacity:.72;margin-top:56px}.word-ribbon{display:flex;align-items:center;justify-content:space-around;gap:40px;white-space:nowrap;overflow:hidden;font-family:var(--english-font);font-size:clamp(22px,4vw,60px);padding:24px 0;background:var(--ink);color:var(--yellow)}.word-ribbon i{font-style:normal;font-family:Arial,sans-serif;font-size:.65em}
.about-section{display:grid;grid-template-columns:.85fr 1.3fr;gap:6vw;padding:130px var(--space) 100px;align-items:center}.about-copy{position:relative}.about-copy h2{font-size:clamp(30px,3.7vw,57px);line-height:1.5;letter-spacing:-.06em;margin:26px 0}.about-copy>p:not(.eyebrow){font-size:14px;line-height:2.3}.about-copy .button{margin-top:32px;min-width:235px}.about-sign{position:absolute;right:-20px;bottom:6px;font-family:var(--english-font);font-size:32px;font-style:italic;line-height:.9;transform:rotate(-12deg);color:#cf627b}.shop-figure{margin:0;transform:rotate(2deg)}.shop-figure>img{width:100%;height:clamp(390px,39vw,620px);object-fit:cover}.shop-figure figcaption{display:flex;justify-content:space-between;font-family:var(--english-font);font-size:10px;margin-top:14px;letter-spacing:.03em}.shop-figure figcaption span{font-family:var(--body-font)}.access-section{margin:0 var(--space) 90px;border-top:1px solid rgba(7,76,56,.25);border-bottom:1px solid rgba(7,76,56,.25);padding:34px 0;display:flex;justify-content:space-between;align-items:center;gap:30px}.access-section h2{font-family:var(--english-font);font-size:33px}.access-section h2 span{display:block;font-family:var(--body-font);font-size:10px;margin-top:7px}.access-section p{font-size:13px;line-height:2}.access-section p span{font-size:11px}.text-link{display:flex;justify-content:space-between;gap:35px;font-size:12px;padding:15px 0;border-bottom:1px solid currentColor}.text-link span{font:20px Arial}.text-link:hover span{transform:translate(2px,-2px)}
.coupon-section{position:relative;isolation:isolate;min-height:470px;display:flex;align-items:center;justify-content:center;padding:85px var(--space);overflow:hidden;background:var(--ink);color:var(--cream)}.coupon-copy{position:relative;z-index:3;margin-left:16%}.coupon-copy h2{font-size:clamp(33px,3.8vw,62px);line-height:1.5;letter-spacing:-.06em;margin:20px 0 35px}.coupon-large{min-width:360px;font-family:var(--display-font);font-size:18px;min-height:69px}.coupon-portrait{position:absolute;left:-2%;bottom:-39%;width:40%;height:125%;overflow:hidden;transform:rotate(-9deg);border-radius:50% 50% 0 0;background:var(--cream);z-index:1}.coupon-portrait img{width:100%;height:100%;object-fit:contain;object-position:center top;mix-blend-mode:multiply;transform:scale(1.25)}.coupon-doodle{position:absolute;right:6%;top:25%;font:italic 31px/.95 var(--english-font);transform:rotate(10deg);color:var(--yellow)}.site-footer{padding:50px var(--space) 25px;overflow:hidden}.footer-wordmark{font-family:var(--english-font);font-size:clamp(62px,16.1vw,250px);line-height:1;letter-spacing:-.047em;display:block;white-space:nowrap}.footer-wordmark>span{font:14px Arial;vertical-align:top;display:inline-block;margin:2% 0 0 12px}.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid rgba(7,76,56,.2);padding-top:25px;margin-top:25px;font:11px var(--english-font);letter-spacing:.05em}.footer-bottom small{font:10px var(--body-font);letter-spacing:0}.footer-bottom a span{margin-left:15px}
dialog{border:0;width:min(520px,calc(100% - 32px));max-height:calc(100svh - 40px);padding:60px 35px 45px;border-radius:10px;background:var(--cream);text-align:center;overflow:auto}dialog::backdrop{background:rgba(3,35,25,.65);backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:18px;top:14px;background:transparent;width:40px;height:40px;font:30px Arial;border-radius:50%}.dialog-close:hover{background:#e9e0cf}.dialog-wordmark{display:block;font:40px var(--english-font);margin-bottom:32px}dialog .eyebrow{font-size:11px}dialog h2{font-size:30px;line-height:1.6;letter-spacing:-.07em;margin:15px 0 20px}dialog>p:not(.eyebrow){font-size:13px;line-height:2}dialog .dialog-return{margin-top:30px;justify-content:center}.modal-open{overflow:hidden}.noscript-note{padding:24px;text-align:center;background:var(--yellow);font-size:13px}
.svg-filters{position:absolute;pointer-events:none}.scene-art,.scene-cup,.product-image-button img,.coupon-portrait img{mix-blend-mode:normal;filter:url(#studio-cutout)}.product-image-button{mix-blend-mode:normal}
@media(min-width:1800px){.hero-copy{top:23%}.scene-art{right:0;width:58%}.scene-cup{left:43%;width:25%}}
@media(max-width:1100px){:root{--space:36px;--header-height:76px}.desktop-nav{gap:23px;font-size:12px}.brand{font-size:26px}.brand-do{font-size:37px}.header-coupon{gap:12px;padding:10px 18px}.hero-copy h1{font-size:5vw}.scene-art{width:65%;right:-8%}.scene-cup{left:42%;width:28%}.flavor-sign{right:3%;font-size:21px}.flavor-caption h2 span{display:block;margin:9px 0 0}.flavor-controls button{padding:10px 12px;font-size:14px}.scroll-note small{display:none}.about-sign{display:none}.coupon-doodle{right:4%;font-size:24px}.coupon-copy{margin-left:24%}.coupon-large{min-width:300px}.access-section{gap:24px}.text-link{gap:18px}.section-topline>span:last-child{font-size:8px}}
@media(max-width:760px){:root{--space:22px;--header-height:72px}.site-header{gap:12px}.brand{font-size:24px;gap:4px}.brand-do{font-size:34px}.brand i{font-size:8px}.desktop-nav{display:none}.header-coupon{margin-left:auto;min-height:37px;font-size:10px;padding:9px 13px;gap:9px}.header-coupon .arrow{font-size:17px}.menu-toggle{display:flex;background:transparent;flex-direction:column;justify-content:center;gap:6px;padding:10px 4px;width:30px;height:44px}.menu-toggle span{height:1px;width:21px;background:var(--ink);transition:transform .2s}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.mobile-menu{position:fixed;z-index:39;top:var(--header-height);left:0;right:0;display:flex;flex-direction:column;padding:24px var(--space) 35px;background:var(--cream);box-shadow:0 20px 30px #074c3814}.mobile-menu>a{display:flex;justify-content:space-between;border-bottom:1px solid #074c3826;padding:22px 0;font-family:var(--display-font);font-size:19px}.mobile-menu>a>span{font-family:var(--english-font);font-size:15px}.mobile-menu .button{margin-top:24px;justify-content:center}.js #flavor-story{height:600svh}.hero-stage{min-height:620px}.hero-copy{top:calc(var(--header-height) + 29px);left:var(--space)}.hero-copy .eyebrow{font-size:10px;margin-bottom:12px;letter-spacing:.07em}.hero-copy h1{font-size:clamp(32px,7.8vw,55px);line-height:1.4;letter-spacing:-.09em}.hero-intro{font-size:11px;line-height:1.9;margin-top:14px}.mobile-break{display:inline}.flavor-word{font-size:24.5vw;top:44%;letter-spacing:-.055em}.mango .flavor-word,.kiwi .flavor-word{font-size:44vw;top:41%}.scene-art{right:-22%;top:27%;width:100%;height:54%}.scene-cup{left:3%;bottom:19%;width:48%;height:36%;transform:translate3d(0,var(--cup-y),0) rotate(-10deg)}.flavor-sign{right:6%;top:30%;font-size:19px}.flavor-caption{bottom:16%;left:auto;right:var(--space);text-align:right}.flavor-kicker{font-size:8px}.flavor-caption h2{font-size:29px;margin-top:5px}.flavor-caption h2 span{font-size:9px;margin-top:5px}.flavor-caption p{display:none}.hero-bottom{bottom:5.2%;left:var(--space);right:var(--space);gap:12px;flex-wrap:wrap;justify-content:center}.flavor-controls{order:0;width:100%;justify-content:center;padding:4px;gap:2px;background:rgba(255,255,255,.75)}.flavor-controls button{flex:1;justify-content:center;min-height:42px;padding:10px 8px;font-size:14px}.flavor-dot{width:7px;height:7px}.scroll-note{position:absolute;left:0;bottom:-28px;font-size:8px;gap:7px}.scroll-note span:last-child{line-height:1}.scroll-line{height:17px}.flavor-counter{position:absolute;right:0;bottom:-28px;font-size:17px;gap:6px}.flavor-counter>span{font-size:10px}.skip-story{bottom:1.6%;right:auto;left:50%;transform:translateX(-50%);font-size:8px;gap:7px;white-space:nowrap}.flavors-section{padding:40px var(--space) 30px}.section-topline{padding-bottom:18px}.section-topline .eyebrow{font-size:11px}.section-topline>span:last-child{font-size:7px;max-width:125px;text-align:right;line-height:1.6}.section-heading{display:block;margin-top:35px}.section-heading h2{font-size:32px;line-height:1.5}.section-heading p{font-size:12px;margin-top:22px;line-height:2;margin-right:0}.product-grid{display:flex;flex-direction:column;gap:30px;margin-top:20px}.product{padding-top:35px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;column-gap:20px;min-height:300px}.product-mango{direction:rtl}.product-mango>*{direction:ltr}.product-number,.product-mango .product-number,.product-kiwi .product-number{top:27px;font-size:12px}.product-image-button{grid-column:1;grid-row:1/3}.product-image-button img{height:290px;max-width:100%}.product-info{grid-column:2;grid-row:1;margin-top:70px;padding-top:18px;align-self:end;gap:12px}.product h3{font-size:29px}.product h3 span{font-size:10px}.round-link{width:37px;height:37px;flex:0 0 37px;font-size:21px}.product>p{grid-column:2;grid-row:2;align-self:start;margin-top:18px;font-size:11px;line-height:1.8}.product-word{font-size:66px;top:22%;left:28%;opacity:.75}.product-mango .product-word{top:20%;left:72%}.product-kiwi .product-word{top:22%}.collection-note{font-size:9px;line-height:1.8;margin-top:30px}.word-ribbon{justify-content:flex-start;padding:20px 22px;gap:22px;font-size:27px}.about-section{display:flex;flex-direction:column;gap:45px;padding:65px var(--space) 45px;align-items:stretch}.about-copy .eyebrow{font-size:11px}.about-copy h2{font-size:34px;margin:22px 0}.about-copy>p:not(.eyebrow){font-size:13px}.about-copy .button{min-width:240px;font-size:13px;margin-top:25px}.about-sign{display:block;right:5%;font-size:31px;bottom:10px}.shop-figure{margin:0 4px;transform:rotate(2deg)}.shop-figure>img{height:340px}.shop-figure figcaption{font-size:8px}.access-section{margin:0 var(--space) 55px;display:grid;grid-template-columns:1fr;gap:22px;padding:26px 0}.access-section h2{font-size:30px;display:flex;align-items:center;gap:16px}.access-section h2 span{font-size:10px;margin-top:0}.access-section p{font-size:12px}.access-section p span{font-size:10px}.text-link{width:max-content;font-size:11px;padding:6px 0;gap:50px}.coupon-section{min-height:510px;align-items:flex-start;padding:47px var(--space) 45px;justify-content:flex-start}.coupon-copy{margin:0;z-index:3}.coupon-copy .eyebrow{font-size:11px}.coupon-copy h2{font-size:31px;line-height:1.5;margin:18px 0 27px}.coupon-large{min-width:0;width:100%;font-size:15px;padding:16px 22px;min-height:58px;gap:35px}.coupon-portrait{width:58%;height:69%;left:51%;bottom:-21%;transform:rotate(-8deg)}.coupon-doodle{font-size:27px;right:auto;left:var(--space);top:auto;bottom:58px;transform:rotate(-10deg)}.site-footer{padding:32px var(--space) 24px}.footer-wordmark{font-size:15.3vw;letter-spacing:-.035em}.footer-wordmark>span{font-size:8px;margin-left:5px}.footer-bottom{flex-wrap:wrap;font-size:9px;gap:18px;margin-top:25px;padding-top:20px}.footer-bottom small{font-size:8px;order:3;width:100%}.footer-bottom a{margin-left:auto}dialog{padding:50px 25px 32px}.dialog-wordmark{font-size:35px}dialog h2{font-size:27px}}
@media(max-width:380px){:root{--space:17px}.brand{font-size:20px}.brand-do{font-size:30px}.header-coupon{padding:8px 10px;gap:6px;font-size:9px}.site-header{gap:8px}.hero-copy h1{font-size:31px}.hero-copy{top:96px}.hero-intro{font-size:10px}.product{column-gap:12px}.product h3{font-size:25px}.round-link{width:33px;height:33px;flex-basis:33px}.product-image-button img{height:260px}.about-sign{font-size:25px;right:1%}.coupon-copy h2{font-size:28px}}
@media(max-height:700px) and (min-width:761px){.hero-stage{min-height:570px}.hero-copy{top:20%}.hero-copy h1{font-size:4.5vw}.hero-copy .eyebrow{margin-bottom:12px}.hero-intro{margin-top:15px;font-size:13px}.scene-art{top:14%;height:75%}.flavor-caption{bottom:20%}.flavor-caption h2{font-size:32px}.flavor-caption p{display:none}.hero-bottom{bottom:4%}.flavor-sign{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.scene-art,.scene-cup{will-change:auto}.product-image-button:hover img{transform:none}}

/* 中央・左右の立体カルーセル。原案の役割配置を3味へ翻訳する。 */
.hero-stage { background: var(--cream); }
.hero-copy { top: 14%; left: var(--space); z-index: 25; }
.hero-copy .eyebrow { display: none; }
.hero-copy h1 { font-size: clamp(17px, 1.7vw, 28px); letter-spacing: -.07em; line-height: 1.5; }
.hero-copy h1 br { display: none; }
.hero-intro { font-size: 11px; margin-top: 10px; }
.hero-intro br { display: none; }
.flavor-scene { opacity: 1; transform: none; will-change: auto; }
.flavor-word, .flavor-caption, .flavor-sign { opacity: var(--scene-opacity); }
.flavor-word { top: 25%; font-size: clamp(110px, 18.5vw, 350px); z-index: 0; letter-spacing: -.035em; }
.mango .flavor-word, .kiwi .flavor-word { top: 23%; font-size: clamp(180px, 27vw, 490px); }
.figurine { position: absolute; bottom: 11%; left: 50%; width: min(58vw, 840px); height: 83%; z-index: var(--figure-z, 20); opacity: var(--figure-opacity, 1); transform-origin: 50% 75%; transform: translate3d(calc(-50% + var(--figure-x, 0px)),var(--figure-y, 0px),0) scale(var(--figure-scale, 1)); filter: blur(var(--figure-blur, 0px)); will-change: transform, opacity; }
.flavor-scene[data-flavor-scene="1"] { --figure-x: 24vw; --figure-y: 9vh; --figure-scale: .34; --figure-blur: 2px; --figure-opacity: .8; --figure-z: 10; }
.flavor-scene[data-flavor-scene="2"] { --figure-x: -24vw; --figure-y: 9vh; --figure-scale: .34; --figure-blur: 2px; --figure-opacity: .8; --figure-z: 10; }
.scene-art { left: 0; right: auto; top: 0; bottom: auto; width: 100%; height: 100%; object-position: center bottom; }
.scene-cup { left: 3%; bottom: 2%; top: auto; width: 43%; height: 52%; transform: translate3d(0,var(--cup-y),0) rotate(-8deg); }
.flavor-caption { left: var(--space); bottom: 22%; max-width: 280px; z-index: 25; }
.flavor-caption h2 { font-size: clamp(31px, 3vw, 47px); }
.flavor-caption h2 span { display: block; margin: 10px 0 0; font-size: 11px; }
.flavor-caption p { display: block; margin-top: 17px; font-size: 12px; }
.flavor-sign { right: var(--space); top: 16%; font-size: 25px; z-index: 25; }
.hero-bottom { bottom: 4%; z-index: 27; }
.hero-bottom .scroll-note { display: none; }
.flavor-controls { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }
.flavor-counter { margin-left: auto; }
.carousel-arrows { position: absolute; left: var(--space); bottom: 10%; z-index: 27; display: flex; gap: 12px; }
.carousel-arrows button { display: grid; place-items: center; border: 1px solid currentColor; background: transparent; width: 56px; height: 56px; border-radius: 50%; font: 27px Arial,sans-serif; transition: background .2s, color .2s, transform .2s; }
.carousel-arrows button:hover { color: var(--cream); background: var(--ink); transform: scale(1.06); }
.skip-story { z-index: 27; bottom: 12%; right: var(--space); left: auto; transform: none; display: block; text-align: right; }
.skip-story>span { font: clamp(24px, 2.8vw, 43px)/1 var(--english-font); letter-spacing: -.03em; }
.skip-story i { display: inline-block; font: .8em Arial,sans-serif; font-style: normal; margin-left: 10px; }
.skip-story small { display: block; font-size: 10px; margin-top: 10px; }
@media (max-width: 1100px) and (min-width: 761px) {
  .figurine { width: 67vw; height: 81%; }
  .flavor-caption { max-width: 220px; bottom: 24%; }
  .flavor-caption h2 { font-size: 31px; }
  .flavor-sign { font-size: 21px; }
  .flavor-controls button { padding: 10px 12px; }
}
@media (max-width: 760px) {
  .hero-stage { min-height: 620px; }
  .hero-copy { top: 15%; left: var(--space); }
  .hero-copy h1 { font-size: clamp(17px, 4.3vw, 22px); }
  .hero-intro { font-size: 10px; margin-top: 7px; }
  .flavor-word { top: 29%; font-size: 24vw; }
  .mango .flavor-word, .kiwi .flavor-word { top: 26%; font-size: 43vw; }
  .figurine { width: 114vw; height: 69%; bottom: 15%; transform-origin: 50% 75%; }
  .scene-art { left: 0; top: 0; width: 100%; height: 100%; }
  .scene-cup { left: 5%; bottom: 1%; width: 43%; height: 47%; }
  .flavor-sign { display: none; }
  .flavor-caption { left: var(--space); right: auto; bottom: 16%; max-width: 170px; text-align: left; }
  .flavor-kicker { font-size: 7px; }
  .flavor-caption h2 { font-size: 26px; margin-top: 5px; }
  .flavor-caption h2 span { font-size: 9px; margin-top: 5px; }
  .flavor-caption p { display: none; }
  .hero-bottom { bottom: 2.8%; left: var(--space); right: var(--space); height: 43px; flex-wrap: nowrap; }
  .flavor-controls { width: 100%; bottom: 0; }
  .flavor-controls button { min-height: 38px; padding: 8px; font-size: 13px; }
  .flavor-counter { display: none; }
  .carousel-arrows { left: var(--space); bottom: 9%; gap: 9px; }
  .carousel-arrows button { width: 39px; height: 39px; font-size: 22px; }
  .skip-story { bottom: 10%; right: var(--space); left: auto; }
  .skip-story>span { font-size: 21px; }
  .skip-story small { font-size: 8px; margin-top: 6px; }
}
@media (max-height: 700px) and (min-width: 761px) {
  .hero-copy { top: 18%; }.hero-copy h1 { font-size: 21px; }.hero-intro { display: none; }
  .figurine { height: 82%; bottom: 10%; }.flavor-caption { bottom: 24%; }
  .carousel-arrows { bottom: 10%; }.carousel-arrows button { width: 44px; height: 44px; }
  .hero-bottom { bottom: 3%; }.flavor-controls button { min-height: 35px; padding: 8px 12px; }
}

/* 操作案内と小さなプレビューが重ならない下端の配置。 */
@media(min-width:761px){.skip-story{bottom:4.5%}.flavor-counter{display:none}.carousel-arrows{bottom:5%}.flavor-caption{bottom:17%}}
.no-js-coupon{font-size:12px}.js .no-js-coupon{display:none}html:not(.js) [data-open-coupon],html:not(.js) .menu-toggle,html:not(.js) .carousel-arrows,html:not(.js) .flavor-controls{display:none}
.hero-stage{background:var(--stage-color,var(--cream))}
@media(prefers-reduced-motion:reduce){.js #flavor-story{height:100svh}.hero-stage{position:relative}.figurine{will-change:auto}}