/* Ten distinct water studies. All artwork stays behind imagery and outside shopping controls. */
.page-home .vial-stage{isolation:isolate}.page-home .stage-waterline{display:none}.water-scene{position:absolute;inset:-6% -8% -9%;z-index:0;pointer-events:none;overflow:hidden;border-radius:43% 51% 35% 46%;opacity:.85;contain:paint}.water-scene>svg{display:block;width:100%;height:100%;overflow:visible}.water-scene *{transform-box:fill-box}.water-scene .tidal-layer,.water-scene .tidal-glint,.water-scene .optical-lens,.water-scene .lens-shadow,.water-scene .pool-expand,.water-scene .caustic-web,.water-scene .blue-swell,.water-scene .laminar-streams,.water-scene .still-ring,.water-scene .pool-shimmer,.water-scene .glacial-pane,.water-scene .glass-seam,.water-scene .liquid-band,.water-scene .subsurface-rays,.water-scene .water-bubble,.water-scene .deep-surface,.water-scene .current-loop,.water-scene .current-highlight{animation-play-state:paused}.water-active .tidal-layer,.water-active .tidal-glint,.water-active .optical-lens,.water-active .lens-shadow,.water-active .pool-expand,.water-active .caustic-web,.water-active .blue-swell,.water-active .laminar-streams,.water-active .still-ring,.water-active .pool-shimmer,.water-active .glacial-pane,.water-active .glass-seam,.water-active .liquid-band,.water-active .subsurface-rays,.water-active .water-bubble,.water-active .deep-surface,.water-active .current-loop,.water-active .current-highlight{animation-play-state:running}
.tidal-layer{transform-origin:center;animation:tidal-flow 14s linear infinite}.layer-back{opacity:.4;translate:0 65px;animation-duration:22s;animation-direction:reverse}.layer-front{translate:0 150px;opacity:.65}.tidal-glint{animation:water-glint 11s ease-in-out infinite alternate;opacity:.6}.theme-shelf .stage-sculpture{background:linear-gradient(140deg,#e3f5ff,#accfe8);border-radius:52% 48% 12% 35%;transform:rotate(-7deg)}.theme-shelf .water-scene{inset:-5% -10% -12%;border-radius:55% 50% 0 0}
.optical-lens{transform-origin:center;animation:lens-drift 16s ease-in-out infinite alternate}.lens-shadow{transform-origin:center;animation:lens-shadow 16s ease-in-out infinite alternate}.theme-focus .stage-sculpture{clip-path:none;background:radial-gradient(ellipse at center,#eaf8ff,#b9dbef);border-radius:50%;transform:none;inset:3% -4% 0}.theme-focus .water-scene{inset:-16% -4% -8%;border-radius:50%;opacity:.75}.theme-focus .story-photo{border-radius:50% 50% 12px 12px}.theme-focus .is-revealing .story-photo{animation:optical-reveal 1.2s cubic-bezier(.16,1,.3,1) both}
.pool-expand{animation:drop-spread 10s cubic-bezier(.2,.5,.3,1) infinite;animation-delay:var(--pool-delay)}.theme-list .water-scene{inset:0 -12% -10%;border-radius:0;opacity:.95}.theme-list .stage-sculpture{background:linear-gradient(180deg,#e6f4ff 0%,#d7ebf8 60%,#c2dff0);border-radius:50% 50% 18% 18%}.theme-list .is-revealing .story-photo img{animation:three-drop-reveal 1.15s cubic-bezier(.16,1,.3,1) both}
.caustic-web{transform-origin:center;opacity:.33;animation:caustic-swim 19s ease-in-out infinite alternate}.blue-swell{opacity:.4;translate:0 190px;animation:tidal-flow 24s linear infinite reverse}.theme-blue .stage-sculpture{background:radial-gradient(ellipse at 50% 20%,#8fd2f2,#4294d5 75%);box-shadow:inset 0 0 65px #0c61a02b}.theme-blue .water-scene{opacity:.85;inset:-5% -10% -4%;border-radius:55% 50% 0 0}.theme-blue .story-photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 30%,#ddfaff38 48%,transparent 62%);transform:translateX(-120%)}.theme-blue .is-revealing .story-photo:after{animation:photo-waterlight 1.7s cubic-bezier(.2,.7,.3,1) both}
.laminar-streams{transform-origin:center;animation:laminar-flow 18s ease-in-out infinite alternate}.theme-wall .stage-sculpture{background:linear-gradient(140deg,#dff8fc,#a9dce6);border-radius:62% 20% 37% 16%;transform:rotate(-5deg)}.theme-wall .water-scene{inset:-10% -5% -3%;opacity:.75;border-radius:47% 34% 36% 24%}.theme-wall .is-revealing .story-photo img{animation:laminar-reveal 1.15s cubic-bezier(.16,1,.3,1) both}
.still-ring{animation:stillwater-spread 14s linear infinite;animation-delay:var(--ring-delay)}.pool-shimmer{animation:water-glint 12s ease-in-out infinite alternate}.theme-frame .water-scene{inset:5% -18% -18%;border-radius:50%;opacity:.85}.theme-frame .stage-rings{display:none}.theme-frame .stage-sculpture{border-radius:50%;background:radial-gradient(ellipse,#e8f6f9,#c4dde8);inset:30% -6% 0;transform:none}.theme-frame .is-revealing .story-photo{animation:stillwater-reveal 1.4s cubic-bezier(.16,1,.3,1) both}
.glacial-pane{transform-origin:center;animation:glacial-shift 20s ease-in-out infinite alternate}.pane-back{opacity:.55;animation-direction:reverse}.pane-front{opacity:.7;animation-delay:-8s}.glass-seam{animation:seam-glide 15s ease-in-out infinite alternate;opacity:.8}.theme-sidecar .stage-rings{display:none}.theme-sidecar .stage-sculpture{background:linear-gradient(120deg,#e6f3f7,#d0e8ef 40%,#f5fbfc 70%,#c5e0e9);border:1px solid #fff;border-radius:3px 70px 3px 70px;transform:rotate(-5deg)}.theme-sidecar .water-scene{border-radius:3px 70px 3px 70px;inset:-6% -7% -1%;opacity:.85}.theme-sidecar .story-photo{border-radius:4px 60px 4px 60px}.theme-sidecar .is-revealing .story-photo img{animation:glass-reveal 1.3s cubic-bezier(.16,1,.3,1) both}
.liquid-band{transform-origin:center;animation:ribbon-drift 16s ease-in-out infinite alternate}.band-back{opacity:.7}.band-front{opacity:.6;animation-delay:-7s;animation-direction:alternate-reverse}.theme-ribbon .stage-sculpture{clip-path:none;border-radius:70% 24% 55% 20%;background:linear-gradient(135deg,#bbdff8,#83b7e6);transform:rotate(-10deg)}.theme-ribbon .water-scene{inset:-15% -14% -8%;border-radius:40%;opacity:.85}.theme-ribbon .is-revealing .story-photo img{animation:ribbon-reveal 1.25s cubic-bezier(.16,1,.3,1) both}
.subsurface-rays{opacity:.25;transform-origin:50% 0;animation:rays-sway 17s ease-in-out infinite alternate}.water-bubble{animation:bubble-rise 18s linear infinite;animation-delay:var(--bubble-delay)}.deep-surface{animation:surface-glide 12s ease-in-out infinite alternate}.theme-window .stage-sculpture{background:radial-gradient(ellipse at 50% 15%,#a7d9ed,#4088b1 65%,#235579);box-shadow:inset 0 0 70px #173b6066,0 0 70px #8cceee14}.theme-window .water-scene{inset:-2% -5% -3%;border-radius:50%;opacity:1}.theme-window .is-revealing .story-photo img{animation:depth-reveal 1.4s cubic-bezier(.16,1,.3,1) both}
.current-loop{transform-origin:center;animation:current-drift 18s ease-in-out infinite alternate}.current-highlight{animation:current-travel 13s linear infinite}.theme-desk .stage-sculpture{border-radius:60% 40% 28% 33%;background:linear-gradient(140deg,#d9f2f6,#b8deec);transform:rotate(-5deg)}.theme-desk .water-scene{inset:-9% -10% -4%;border-radius:50%;opacity:.85}.theme-desk .is-revealing .story-photo{animation:drop-reveal 1.25s cubic-bezier(.16,1,.3,1) both}
/* A thin, individually drawn water edge joins the shop and the studio image. */
.water-bridge{height:62px;position:relative;pointer-events:none;overflow:hidden;opacity:.8;margin:0;background:linear-gradient(180deg,#fff0,#d5edf61c);contain:paint}.water-bridge svg{width:120%;height:100%;margin-left:-10%;overflow:visible;display:block;fill:none}.bridge-current{stroke:#6ba8ce;stroke-width:1.1;stroke-opacity:.55;animation:bridge-flow 17s ease-in-out infinite alternate;animation-play-state:paused}.bridge-echo{stroke:#fff;stroke-width:4;opacity:.9;transform:translateY(5px);animation:bridge-flow 23s ease-in-out infinite alternate-reverse;animation-play-state:paused}.water-active .bridge-current,.water-active .bridge-echo{animation-play-state:running}.bridge-blue{background:linear-gradient(#fff,#e7f3fc)}.bridge-blue .bridge-current{stroke:#237ab9;stroke-width:1.5}.bridge-focus{background:#165fe0}.bridge-focus .bridge-current{stroke:#bfeeff;stroke-width:1.5}.bridge-focus .bridge-echo{opacity:.3}.bridge-frame{height:50px}.bridge-sidecar{background:#fffdfa}.bridge-sidecar .bridge-current{stroke:#a5b9c3;stroke-width:1.4}.bridge-ribbon{background:#dbeafa}.bridge-ribbon .bridge-current{stroke:#4384bd;stroke-width:2}.bridge-window{background:linear-gradient(#fff,#e7f1f7)}.bridge-window .bridge-current{stroke:#38749b}.bridge-desk .bridge-current{stroke:#5a9fae}.page-home .brand-story{padding-top:38px}
/* Tiny buoyancy lives on the images, separate from their fixed layout and pointer depth. */
.water-ready .hero-vial img{animation:vial-buoyancy 9s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:50% 70%}.water-ready .hero-vial-1 img{animation-delay:-3s;animation-duration:11s}.water-ready .hero-vial-2 img{animation-delay:-6s;animation-duration:13s}.water-ready .vial-stage.water-in-view .hero-vial img{animation-play-state:running}.theme-focus.water-ready .hero-vial img{animation-name:optical-buoyancy}.theme-list.water-ready .hero-vial img{animation-name:drop-buoyancy}.theme-frame.water-ready .hero-vial img,.theme-sidecar.water-ready .hero-vial img{animation-name:still-buoyancy}.theme-ribbon.water-ready .hero-vial img{animation-name:ribbon-buoyancy}.theme-window.water-ready .hero-vial img{animation-name:depth-buoyancy}
.page-home .buy-card{isolation:isolate;overflow:hidden}.page-home .buy-card:before{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,#81c9e7,transparent);transform:scaleX(.2);opacity:0;transition:transform .7s cubic-bezier(.16,1,.3,1),opacity .5s;pointer-events:none}.page-home .buy-card:hover:before,.page-home .buy-card:focus-within:before{transform:scaleX(1);opacity:1}.theme-list .buy-card:before,.theme-frame .buy-card:before{height:4px;border-radius:100%;background:linear-gradient(90deg,transparent,#80bbd5,transparent)}.theme-sidecar .buy-card:before{height:100%;width:1px;background:#b6d4df}.theme-window .buy-card:hover{box-shadow:0 9px 25px #123e6614}.water-controls{max-width:1280px;margin:0 auto;padding:0 5% 24px;display:flex;justify-content:flex-end}.water-controls button{font-size:14px;color:#4d6b80;min-height:44px;padding:8px 0;display:flex;align-items:center;gap:10px}.water-controls button:before{content:'Ⅱ';font-size:15px}.water-controls button[aria-pressed=true]:before{content:'▷'}.water-controls button:disabled{cursor:default;opacity:.75}.water-controls button:disabled:before{content:'—'}.water-paused .water-scene *,.water-paused .water-bridge *,.water-paused .hero-vial img{animation-play-state:paused!important}.water-page-hidden .water-scene *,.water-page-hidden .water-bridge *,.water-page-hidden .hero-vial img{animation-play-state:paused!important}
@keyframes tidal-flow{from{transform:translateX(0)}to{transform:translateX(-400px)}}@keyframes water-glint{from{opacity:.2;transform:translate(-12px,4px) scaleX(.95)}to{opacity:.7;transform:translate(14px,-4px) scaleX(1.04)}}@keyframes lens-drift{from{transform:translate(-8px,4px) rotate(-3deg) scale(.98)}to{transform:translate(9px,-5px) rotate(3deg) scale(1.02)}}@keyframes lens-shadow{from{transform:scaleX(.94);opacity:.06}to{transform:scaleX(1.04);opacity:.11}}@keyframes drop-spread{0%{transform:scale(.55);opacity:0}20%{opacity:.8}100%{transform:scale(1.4);opacity:0}}@keyframes caustic-swim{from{transform:translate(-18px,-14px) scale(1.02) rotate(-4deg)}to{transform:translate(20px,12px) scale(1.12) rotate(4deg)}}@keyframes laminar-flow{from{transform:translate(-15px,12px) rotate(-3deg)}to{transform:translate(20px,-10px) rotate(3deg)}}@keyframes stillwater-spread{0%{transform:scale(.55);opacity:0}20%{opacity:.8}100%{transform:scale(1.5);opacity:0}}@keyframes glacial-shift{from{transform:translateX(-15px) skewX(-2deg)}to{transform:translateX(18px) skewX(2deg)}}@keyframes seam-glide{from{transform:translateX(-35px);opacity:.2}to{transform:translateX(40px);opacity:.8}}@keyframes ribbon-drift{from{transform:translate(-18px,12px) rotate(-3deg)}to{transform:translate(18px,-12px) rotate(3deg)}}@keyframes rays-sway{from{transform:skewX(-7deg) translateX(-12px);opacity:.2}to{transform:skewX(7deg) translateX(15px);opacity:.4}}@keyframes bubble-rise{0%{transform:translate(0,80px);opacity:0}15%{opacity:.6}80%{opacity:.4}100%{transform:translate(12px,-220px);opacity:0}}@keyframes surface-glide{from{transform:translateX(-20px) scaleY(.8)}to{transform:translateX(20px) scaleY(1.15)}}@keyframes current-drift{from{transform:rotate(-3deg) scale(.97)}to{transform:rotate(3deg) scale(1.03)}}@keyframes current-travel{to{stroke-dashoffset:-100}}@keyframes bridge-flow{from{transform:translate(-25px,1px)}to{transform:translate(25px,-3px)}}
@keyframes vial-buoyancy{from{transform:translateY(2px) rotate(-.45deg)}to{transform:translateY(-4px) rotate(.45deg)}}@keyframes optical-buoyancy{from{transform:translate(-1px,1px) rotate(-.3deg)}to{transform:translate(1px,-4px) rotate(.3deg)}}@keyframes drop-buoyancy{from{transform:translateY(3px)}to{transform:translateY(-3px)}}@keyframes still-buoyancy{from{transform:translateY(1px)}to{transform:translateY(-2px)}}@keyframes ribbon-buoyancy{from{transform:translate(-2px,2px) rotate(-.5deg)}to{transform:translate(2px,-3px) rotate(.5deg)}}@keyframes depth-buoyancy{from{transform:translateY(2px) scale(.998)}to{transform:translateY(-3px) scale(1.002)}}
@keyframes optical-reveal{from{clip-path:ellipse(15% 25% at 50% 50%);opacity:.4}to{clip-path:ellipse(100% 100% at 50% 50%);opacity:1}}@keyframes three-drop-reveal{from{clip-path:polygon(0 100%,33% 80%,66% 95%,100% 70%,100% 100%);transform:scale(1.04)}to{clip-path:polygon(0 0,33% 0,66% 0,100% 0,100% 100%,0 100%);transform:scale(1)}}@keyframes photo-waterlight{from{transform:translateX(-110%)}to{transform:translateX(110%)}}@keyframes laminar-reveal{from{clip-path:inset(0 0 0 40% round 50%);transform:scale(1.04)}to{clip-path:inset(0 round 0);transform:scale(1)}}@keyframes stillwater-reveal{from{clip-path:circle(30% at 50% 60%);opacity:.5}to{clip-path:circle(85% at 50% 60%);opacity:1}}@keyframes glass-reveal{from{clip-path:inset(0 35% 0 35%);transform:scale(1.04)}to{clip-path:inset(0);transform:scale(1)}}@keyframes ribbon-reveal{from{clip-path:polygon(0 0,30% 0,0 100%,0 100%);transform:scale(1.04)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:scale(1)}}@keyframes depth-reveal{from{transform:scale(1.1);opacity:.4;clip-path:inset(6% round 18%)}to{transform:scale(1);opacity:1;clip-path:inset(0 round 0)}}@keyframes drop-reveal{from{clip-path:ellipse(30% 45% at 50% 65%);opacity:.4}to{clip-path:ellipse(100% 100% at 50% 65%);opacity:1}}
@media(max-width:600px){.water-scene{opacity:.72}.water-bridge{height:39px}.page-home .brand-story{padding-top:27px}.water-controls{padding:0 6% 17px}.water-scene .caustic-web{stroke-width:3}.water-ready .hero-vial img{animation-duration:13s}.water-ready .hero-vial-1 img{animation-duration:15s}.water-ready .hero-vial-2 img{animation-duration:17s}}
@media(prefers-reduced-motion:reduce){.water-scene *,.water-bridge *,.water-ready .hero-vial img{animation:none!important}.water-bubble{opacity:.35}.still-ring{opacity:.3}.pool-expand{opacity:.5}.page-home .story-photo,.page-home .story-photo img{clip-path:none!important;transform:none!important;opacity:1!important}}
.water-scene .still-ring,.water-scene .pool-expand{transform-box:view-box}
.theme-shelf .is-revealing .story-photo img{animation:shore-reveal 1.25s cubic-bezier(.16,1,.3,1) both}
@keyframes shore-reveal{from{clip-path:inset(30% 0 0 round 45% 45% 0 0);transform:scale(1.04)}to{clip-path:inset(0 round 0);transform:scale(1)}}
@keyframes tidal-flow{from{transform:translateX(0)}to{transform:translateX(-800px)}}
@keyframes three-drop-reveal{from{clip-path:polygon(0 100%,33% 80%,66% 95%,100% 70%,100% 100%,0 100%);transform:scale(1.04)}to{clip-path:polygon(0 0,33% 0,66% 0,100% 0,100% 100%,0 100%);transform:scale(1)}}
