﻿/* Editorial product presentation and tactile details for Mooz. */
:root{--showcase-ink:#1d2920;--showcase-light:#fafbf5}
.announcement{background:#163d2b;font-size:12px;padding:9px 16px}
.header{background:#f8faefed;border-bottom:1px solid #d7e1d2;padding-top:12px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.header-tagline{color:#42604b}.header .logo{color:#173b29}.header .logo span{color:#bc9500}
.glass-control,.site-nav{background:#fff9;border-color:#fff;box-shadow:inset 0 1px #fff,0 4px 18px #20452a0e}
.header .site-nav a{color:#25432f}.header .site-nav a:hover{background:#e8f0df}
.explore-shell{background:#f8faef;padding-top:8px}.explore-bar{background:#ffffffb3;border-color:#fff;box-shadow:0 8px 28px #315c3810,inset 0 1px #fff}
.hero{background:#f4f7e9;min-height:610px;gap:clamp(25px,4vw,70px);padding-block:45px 60px;align-items:center}
.hero-copy{max-width:570px}.hero .eyebrow{color:#577054;font-size:12px}.hero h1{color:#173c28;font-size:clamp(70px,6.5vw,100px);line-height:1.25;letter-spacing:-3px;margin:15px 0 18px}.hero h1 em{color:#173c28}.hero .period{color:#dd7937}.hero-copy>p{color:#52604f;max-width:440px;font-size:16px;line-height:2.1}.hero-actions{margin-top:28px}.hero-note{color:#637568;margin-top:34px}.hero .face{color:#d4a900}.hero .scroll-label{color:#718272}
.hero-art{min-height:505px;border-radius:32px;background:#e8cf3b url('assets/banana-editorial.png') center/cover;overflow:hidden;box-shadow:0 20px 60px #52613e17}.hero-art::after{content:'FRESH BY NATURE';position:absolute;bottom:23px;left:25px;padding:9px 14px;border-radius:50px;color:#fff;font-size:10px;font-weight:900;letter-spacing:1.5px;background:#153b288c;backdrop-filter:blur(12px)}.hero-art>*{display:none}
.ticker{background:#235b3d}.ticker div{font-size:12px}.ticker span{color:#f9de4d}
.home-discover,.products,.why{background:#fafbf5}.section-head h2,.why h2{color:#173c28}.section-head h2 span,.why h2 em{color:#b79200}.section-head>p,.benefits p{color:#627064}
.product-visual{border-radius:24px;box-shadow:inset 0 1px 0 #ffffffc4}.product-tag{background:#ffffffcf}.price-row .add{border-color:#1f573a;color:#1f573a}.price-row .add:hover{background:#1f573a;color:white}
.story{background:#173f2c}.story-art{background:#97bba1;isolation:isolate}.cloud-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.story-disc{background:#f4d856;box-shadow:0 0 0 20px #ffffff30,0 20px 50px #1e452b20}.story-spark{color:#fff}.story-copy p{color:#dbe9d8}
.button,.x-btn{position:relative;isolation:isolate;overflow:hidden;transition:transform .2s,box-shadow .25s}.button:before,.x-btn:before{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(circle 95px at var(--flame-x,50%) 50%,#fff8a6b3,#ff8f3970 38%,transparent 76%);opacity:0;transition:opacity .2s;pointer-events:none}.button:hover:before,.button:focus-visible:before,.x-btn:hover:before,.x-btn:focus-visible:before{opacity:1}.button:hover,.x-btn:hover{box-shadow:0 9px 23px #d67c3370}.button:focus-visible,.x-btn:focus-visible{outline:3px solid #e57338;outline-offset:4px}
/* Day and night switch inspired by the supplied sky toggle. */
.theme-toggle.glass-control{width:72px;height:44px;padding:5px;background:#fff9;overflow:visible;border:1px solid #fff;direction:ltr}
.sky-switch{display:block;position:relative;width:60px;height:32px;border-radius:30px;overflow:hidden;background:linear-gradient(#85c8eb,#bfe7ef);box-shadow:inset 0 2px 5px #255d7440;transition:background .45s}
.sky-orb{position:absolute;left:4px;top:4px;width:24px;height:24px;border-radius:50%;background:#ffd759;box-shadow:inset 0 2px 2px #fff9,0 2px 6px #29463950,0 0 0 7px #ffffff2c;transition:transform .45s cubic-bezier(.2,.8,.2,1),background .4s}
.sky-clouds{position:absolute;right:1px;bottom:-6px;width:20px;height:16px;border-radius:50%;background:#faffff;box-shadow:-10px 1px #eaf8ff,-19px 5px #faffff,-5px -5px #d5f1fc;transition:transform .45s}
.sky-stars{position:absolute;left:7px;top:2px;color:white;font-size:10px;letter-spacing:1px;opacity:0;transition:opacity .3s}
.sky-crater{position:absolute;inset:0;border-radius:50%;opacity:0;background:radial-gradient(circle at 30% 35%,#9caab5 0 12%,transparent 14%),radial-gradient(circle at 67% 62%,#aab6bf 0 10%,transparent 12%);transition:opacity .3s}
html[data-theme=dark] .header{background:#1d3024ed;border-color:#ffffff20}html[data-theme=dark] .header .logo{color:#f6f5df}html[data-theme=dark] .header .logo span{color:#f8dc64}html[data-theme=dark] .header .site-nav a{color:#f4f6ea}html[data-theme=dark] .header .site-nav a:hover{background:#ffffff22}html[data-theme=dark] .explore-shell{background:#1d3024}html[data-theme=dark] .hero{background:#203a2b}html[data-theme=dark] .hero h1,html[data-theme=dark] .hero h1 em{color:#f8f9e9}html[data-theme=dark] .hero .eyebrow,html[data-theme=dark] .hero-copy>p,html[data-theme=dark] .hero-note,html[data-theme=dark] .hero .scroll-label{color:#d3e1d0}html[data-theme=dark] .home-discover,html[data-theme=dark] .products,html[data-theme=dark] .why{background:#17221b}html[data-theme=dark] .section-head h2,html[data-theme=dark] .why h2{color:#eff5e8}html[data-theme=dark] .theme-toggle.glass-control{background:#ffffff25;border-color:#ffffff40}html[data-theme=dark] .sky-switch{background:linear-gradient(#203b54,#38566a)}html[data-theme=dark] .sky-orb{transform:translateX(28px);background:#e1e8e8}html[data-theme=dark] .sky-clouds{transform:translateY(25px)}html[data-theme=dark] .sky-stars,html[data-theme=dark] .sky-crater{opacity:1}
@media(max-width:1023px){.hero{min-height:0;gap:25px;padding:45px 6% 50px}.hero-art{min-height:380px}.hero h1{font-size:clamp(55px,8vw,78px)}.header{padding-top:14px}}
@media(max-width:800px){.hero{grid-template-columns:1fr}.hero-copy{max-width:620px}.hero-art{grid-row:auto;min-height:340px}.hero h1{font-size:clamp(58px,10vw,76px)}.hero-note{margin-top:22px}.hero .scroll-label{display:none}}
@media(max-width:560px){.hero{padding:36px 5% 26px;gap:25px}.hero h1{font-size:57px;line-height:1.25;letter-spacing:-3px}.hero-copy>p{font-size:14px}.hero-actions{gap:18px}.hero-art{min-height:265px;border-radius:23px}.hero-art::after{bottom:15px;left:15px}.header{padding-inline:3%}.theme-toggle.glass-control{width:59px;height:42px;padding:4px}.sky-switch{width:49px;height:30px}.sky-orb{width:22px;height:22px}.sky-clouds{transform:scale(.8);transform-origin:bottom right}html[data-theme=dark] .sky-orb{transform:translateX(19px)}html[data-theme=dark] .sky-clouds{transform:translateY(25px)}}
@media(prefers-reduced-motion:reduce){.sky-switch,.sky-orb,.sky-clouds,.sky-stars,.sky-crater,.button,.x-btn{transition:none!important}}
