/* Quiet movement, designed around the product. */
:root{--scroll-progress:0;--scroll-y:0px;--scroll-turn:0deg;--pointer-x:0deg;--pointer-y:0deg}
header::after{content:"";height:2px;position:absolute;left:0;bottom:-1px;width:100%;background:linear-gradient(90deg,#136be0,#8edcff);transform-origin:left;transform:scaleX(var(--scroll-progress));pointer-events:none}header{transition:box-shadow .4s,background .4s}header.scrolled{background:#fffffff5;box-shadow:0 8px 30px #102c5009}
.hero{background:radial-gradient(ellipse at 80% 40%,#d1edff 0,transparent 48%),linear-gradient(120deg,#f8fcff,#ebf7ff 55%,#d8eeff)}.hero-art{perspective:1200px;isolation:isolate}.hero-art::before{content:"";position:absolute;inset:10% 4%;border-radius:50%;background:radial-gradient(ellipse,#fff9,transparent 65%);animation:light-breathe 9s ease-in-out infinite;pointer-events:none}.hero-photo{transform:translate3d(0,var(--scroll-y),0) rotate(calc(8deg + var(--scroll-turn))) rotateX(var(--pointer-y)) rotateY(var(--pointer-x));transition:transform .65s cubic-bezier(.22,1,.36,1),box-shadow .5s;will-change:transform}.hero-photo:hover{transform:translate3d(0,calc(var(--scroll-y) - 8px),0) rotate(calc(5deg + var(--scroll-turn))) rotateX(var(--pointer-y)) rotateY(var(--pointer-x));box-shadow:15px 35px 55px #00469338}.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#ffffff30 48%,transparent 65%);opacity:0;transition:opacity .5s;pointer-events:none}.hero-photo:hover::after{opacity:1}.b1{transform:translateY(calc(var(--scroll-y) * -.5)) rotate(calc(-19deg - var(--scroll-turn))) translate(-110px,-20px);transition:transform .8s cubic-bezier(.22,1,.36,1)}.b2{transform:translateY(calc(var(--scroll-y) * .4)) rotate(calc(-5deg + var(--scroll-turn))) translate(70px,-30px);transition:transform .9s cubic-bezier(.22,1,.36,1)}.circle-note{animation:note-float 7s ease-in-out infinite}.orbit{border-color:#82b6de40}.o1{animation:orbit-breathe 12s ease-in-out infinite}.scroll-cue{position:absolute;bottom:25px;left:25px;display:flex;align-items:center;gap:10px;font-size:7px;letter-spacing:2px;color:#6689ac}.scroll-cue i{height:30px;width:1px;background:#7badcf;position:relative;overflow:hidden}.scroll-cue i::after{content:"";position:absolute;left:0;top:0;width:1px;height:12px;background:#176fe3;animation:scroll-line 2.4s ease-in-out infinite}.hero-copy{animation:hero-enter 1s cubic-bezier(.22,1,.36,1) both}.hero-art{animation:hero-enter 1.25s .12s cubic-bezier(.22,1,.36,1) both}
.collection-rail{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:24px 5%;background:white;border-bottom:1px solid var(--line);font-size:8px;letter-spacing:1.7px;color:#7492ad}.collection-rail span:first-child{font-weight:700;color:var(--blue)}.collection-rail i{font-style:normal;margin:0 18px;color:#79bdf1}.category-list{border-radius:14px}.category-list button{transition:background .3s,color .3s}.category-list button b{display:inline-block;transition:transform .3s}.category-list button:hover b{transform:translate(3px,-3px)}.product-visual{border-radius:14px;box-shadow:0 5px 25px #123a5a04;transition:box-shadow .45s}.product:hover .product-visual{box-shadow:0 15px 35px #174c8012}.product h3{transition:color .3s}.product:hover h3{color:var(--blue)}.product-visual::after{content:"↗";position:absolute;bottom:14px;right:14px;background:white;color:var(--blue);width:33px;height:33px;border-radius:50%;display:grid;place-items:center;opacity:0;transform:translateY(6px);transition:.35s}.product:hover .product-visual::after,.product:focus-visible .product-visual::after{opacity:1;transform:none}.photo-pending::after{display:none}.product-grid>.product{animation:product-enter .65s cubic-bezier(.22,1,.36,1) both}.product-grid>.product:nth-child(2){animation-delay:.06s}.product-grid>.product:nth-child(3){animation-delay:.12s}.product-grid>.product:nth-child(4){animation-delay:.18s}.story{background:linear-gradient(115deg,#eaf7ff,#d7efff)}.story-symbol{font-size:140px}.story-link{transition:background .3s,transform .3s}.story-link:hover{background:#fff8;transform:rotate(10deg)}.primary span{transition:transform .3s}.primary:hover span{transform:translate(3px,-3px)}
.motion-ready .reveal{opacity:0;transform:translateY(24px);transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}.motion-ready .reveal.is-visible{opacity:1;transform:none}dialog[open]{animation:dialog-enter .35s cubic-bezier(.22,1,.36,1)}
@keyframes hero-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes product-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes dialog-enter{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@keyframes note-float{50%{transform:translateY(-8px) rotate(-9deg)}}@keyframes light-breathe{50%{opacity:.5;transform:scale(1.08)}}@keyframes orbit-breathe{50%{transform:scale(1.025)}}@keyframes scroll-line{0%{transform:translateY(-15px)}60%,100%{transform:translateY(40px)}}
@media(max-width:950px){.b1{transform:translateY(calc(var(--scroll-y) * -.5)) rotate(calc(-19deg - var(--scroll-turn))) translate(-65px,-20px)}}@media(max-width:650px){.collection-rail{padding:18px 28px;font-size:7px;letter-spacing:1px}.collection-rail span:last-child{display:none}.collection-rail span:nth-child(2){font-size:6px}.collection-rail i{margin:0 6px}.story-symbol{font-size:65px}.scroll-cue{left:28px;bottom:12px}.circle-note{bottom:47px}.hero-art{min-height:420px}.motion-ready .reveal{transform:translateY(16px)}.product-visual::after{opacity:1;transform:none;width:26px;height:26px;right:10px;bottom:10px;font-size:12px}.hero-photo{transition:transform .5s cubic-bezier(.22,1,.36,1)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.motion-ready .reveal{opacity:1;transform:none}.hero-photo,.hero-photo:hover{transform:rotate(8deg)}.b1{transform:rotate(-19deg) translate(-110px,-20px)}.b2{transform:rotate(-5deg) translate(70px,-30px)}}@media(max-width:950px) and (prefers-reduced-motion:reduce){.b1{transform:rotate(-19deg) translate(-65px,-20px)}}

.bank-panel{margin-top:42px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(120deg,#f5fbff,#eaf5ff);padding:32px;display:grid;grid-template-columns:1fr 1fr;gap:35px}.bank-panel h3{font-size:21px;margin:0 0 14px}.bank-intro{font-size:12px;line-height:1.9}.bank-notice{font-size:11px;line-height:1.9;color:#657c93}.bank-details{grid-template-columns:80px minmax(0,1fr);line-height:1.8;border:0;padding:0;margin:0;font-size:12px}.bank-details dt{color:#6c8099}.bank-details dd{overflow-wrap:anywhere}.bank-contact{font-size:11px;line-height:1.9;overflow-wrap:anywhere}.bank-contact a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}.detail-bank{margin-top:20px;border:1px solid var(--line);padding:14px;border-radius:10px}.detail-bank summary{font-size:12px;cursor:pointer;color:var(--blue)}.detail-bank[open] summary{margin-bottom:15px}.detail-bank .bank-details{font-size:11px;grid-template-columns:65px minmax(0,1fr)}@media(max-width:650px){.bank-panel{grid-template-columns:1fr;padding:22px;gap:20px}.bank-panel h3{font-size:18px}.bank-details{font-size:11px}}
