.jh{--jc:var(--primary);--jt:#fff;position:relative;isolation:isolate;overflow:hidden;background:var(--jc);color:var(--jt);padding:clamp(20px,3.4vw,52px) 0 calc(var(--arc) + clamp(8px,1.4vw,20px));transition:background-color .9s var(--ease),color .5s}.jh[data-tone=dark]{--b-bg:#1E1026;--b-tx:#fff;--b-flip:#fff;--b-flip-tx:#1E1026}.jh[data-tone=dark] .btn--outline{--b-bg:transparent;--b-tx:#1E1026;--b-flip:#1E1026;--b-flip-tx:#fff}.jh__wrap{display:block;position:relative}.jh__scenes{display:grid;max-width:var(--page-width);margin-inline:auto;padding-inline:24px}.jh__scene{grid-area:1/1;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(16px,3vw,56px);align-items:center;min-height:min(66dvh,600px);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .45s,visibility 0s .45s}.jh__scene.is-active{visibility:visible;opacity:1;pointer-events:auto;transition:opacity .45s}.jh__copy{position:relative;z-index:2;display:grid;gap:18px;justify-items:start;align-content:center}.jh__eyebrow{font-weight:700;font-size:15px;letter-spacing:.01em;padding:7px 15px;border-radius:999px;background:color-mix(in srgb,currentColor 15%,transparent)}.jh__hl{font-family:var(--font-heading);font-weight:800;font-size:calc(clamp(32px,3.9vw,58px) * var(--heading-scale));line-height:.98;letter-spacing:-.036em;text-wrap:balance}.jh__desc{font-size:clamp(16px,1.35vw,19px);line-height:1.5;max-width:42ch;color:inherit;opacity:.94}.jh__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}.jh__stage{position:relative;container-type:inline-size;aspect-ratio:1/1;width:min(100%,500px);justify-self:end}.jh__arch{position:absolute;left:25cqw;right:5cqw;top:3cqw;bottom:1cqw;border:4px solid var(--outline);border-radius:35cqw 35cqw 6cqw 6cqw;background:var(--c2);overflow:hidden}.jh__arch img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:50% 68%;mix-blend-mode:multiply;translate:calc(var(--mx,0) * -10px) calc(var(--my,0) * -8px);scale:1.06}.jh__mascot{position:absolute;left:0;bottom:3cqw;width:40cqw;aspect-ratio:1;border-radius:50%;background:var(--c2);border:4px solid var(--outline);padding:4.5cqw;display:grid;place-items:center;rotate:-9deg;z-index:3;translate:calc(var(--mx,0) * 16px) calc(var(--my,0) * 12px)}.jh__mascot svg{width:100%;height:auto}.jh__d{position:absolute;z-index:4;left:var(--x);top:var(--y);width:var(--sz);height:var(--sz);translate:calc(var(--mx,0) * var(--depth,12) * 1px) calc(var(--my,0) * var(--depth,12) * 1px)}.jh__d i{display:block;width:100%;height:100%;animation:jh-float var(--dur,6s) ease-in-out infinite;animation-delay:var(--dl,0s)}.jh__d[data-k=ball] i{border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.7) 0 14%,transparent 15%),var(--dc)}.jh__d[data-k=ring] i{border-radius:50%;border:max(5px,1.1cqw) solid var(--dc)}.jh__d[data-k=bean] i{height:56%;margin-top:22%;border-radius:999px;background:linear-gradient(160deg,rgba(255,255,255,.55) 0 18%,transparent 19%),var(--dc);rotate:var(--r,0deg)}.jh__d[data-k=spark] i{background:var(--dc);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}.jh__d[data-k=cub] i{width:78%;height:78%;margin:11%;border-radius:50% 50% 50% 10%;rotate:calc(var(--r,0deg) - 45deg);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.65) 0 13%,transparent 14%),var(--dc)}@keyframes jh-float{0%,to{transform:translateY(0) scale(1) rotate(0)}50%{transform:translateY(-16px) scale(1.09) rotate(7deg)}}[data-s="0"]{--s:0}[data-s="1.4"]{--s:1.4}[data-s="2.2"]{--s:2.2}[data-s="2.4"]{--s:2.4}[data-s="2.5"]{--s:2.5}[data-s="2.8"]{--s:2.8}[data-s="3"]{--s:3}[data-s="3.1"]{--s:3.1}[data-s="3.3"]{--s:3.3}[data-s="3.4"]{--s:3.4}[data-s="3.6"]{--s:3.6}[data-s="4.4"]{--s:4.4}[data-s="5.2"]{--s:5.2}.jh__scene.is-active [data-s]{animation:jh-rise .9s var(--ease) both;animation-delay:calc(var(--s,0) * .15s + .1s)}.jh__scene.is-active .jh__mascot,.jh__scene.is-active .jh__mchip,.jh__scene.is-active .jh__arch,.jh__scene.is-active .jh__d{animation-name:jh-pop;animation-timing-function:var(--spring);animation-duration:1s}@keyframes jh-rise{0%{opacity:0;transform:translateY(38px)}to{opacity:1;transform:none}}@keyframes jh-pop{0%{opacity:0;transform:translateY(70px) scale(.5) rotate(-14deg)}to{opacity:1;transform:none}}.jh--fluid{padding:0}.jh--fluid .jh__scenes{max-width:none;padding-inline:0}.jh--fluid .jh__scene--arch{width:min(100% - 48px,var(--page-width));justify-self:center;padding-block:clamp(20px,3.4vw,52px) calc(var(--arc) + clamp(30px,3vw,56px))}.jh--fluid .jh__nav{position:absolute;left:0;right:0;bottom:calc(var(--arc) + 14px);margin:0;z-index:6}.jh__scene--banner{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-items:stretch;min-height:var(--bh,560px)}.jh__bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:block;background:var(--c)}.jh__bg img{width:100%;height:100%;object-fit:cover;object-position:var(--bx,50%) var(--by,50%);scale:1.06;translate:calc(var(--mx,0) * -12px) calc(var(--my,0) * -8px)}.jh__scene--banner.is-active .jh__bg{animation:jh-fade 1.1s var(--ease) both}@keyframes jh-fade{0%{opacity:0}to{opacity:1}}.jh__scrim{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.jh__scrim[data-style=gradient]{background:linear-gradient(97deg,color-mix(in srgb,var(--c) var(--sc,80%),transparent) 0 24%,color-mix(in srgb,var(--c) calc(var(--sc,80%) * .5),transparent) 52%,transparent 78%)}.jh__scrim[data-style=bottom]{background:linear-gradient(to top,color-mix(in srgb,var(--c) var(--sc,80%),transparent) 0 20%,color-mix(in srgb,var(--c) calc(var(--sc,80%) * .3),transparent) 56%,transparent 88%)}.jh__scrim[data-style=panel],.jh__scrim[data-style=none]{display:none}.jh__dlayer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;container-type:inline-size;pointer-events:none}.jh__dlayer .jh__d[data-z=s]{--sz:clamp(18px,3.2cqw,46px)}.jh__dlayer .jh__d[data-z=m]{--sz:clamp(26px,4.6cqw,66px)}.jh__dlayer .jh__d[data-z=l]{--sz:clamp(34px,6cqw,88px)}.jh__dlayer .jh__d[data-k=ring] i{border-width:max(4px,.35cqw)}.jh__band{position:relative;z-index:3;display:grid;align-content:center;width:min(100% - 48px,var(--page-width));margin-inline:auto;padding-block:clamp(34px,5vw,70px) calc(var(--arc) + clamp(34px,4vw,66px))}.jh__copy--banner{max-width:min(100%,640px);gap:16px}.jh__scene--banner[data-scrim=panel] .jh__copy--banner{background:color-mix(in srgb,var(--c) 88%,transparent);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);padding:clamp(22px,2.6vw,40px);border-radius:28px;box-shadow:0 30px 70px -40px #1e1026bf}.jh__copy--banner .jh__hl{font-size:calc(clamp(34px,4.3vw,64px) * var(--heading-scale));text-shadow:0 2px 26px rgba(30,16,38,.22)}.jh__copy--banner .jh__desc{max-width:38ch}.jh__mchip{width:clamp(58px,6vw,86px);aspect-ratio:1;border-radius:50%;background:var(--c2);border:4px solid var(--outline);padding:clamp(8px,.9vw,13px);display:grid;place-items:center;rotate:-8deg;translate:calc(var(--mx,0) * 14px) calc(var(--my,0) * 10px)}.jh__mchip svg{width:100%;height:auto}.jh__nav{position:relative;z-index:5;max-width:var(--page-width);margin:clamp(14px,2vw,26px) auto 0;padding-inline:24px;display:flex;align-items:center;gap:14px}.jh__dots{display:flex;gap:9px}.jh__dot{width:16px;height:16px;border-radius:999px;background:var(--dc);border:3px solid #fff;box-shadow:0 0 0 1px #1e102640;transition:width .45s var(--spring)}.jh__dot[aria-current=true]{width:46px}.jh__pause{font-size:13px;font-weight:700;color:inherit;text-decoration:underline;text-underline-offset:3px;padding:6px}@media(max-width:989px){.jh__scene{grid-template-columns:1fr;min-height:0;gap:8px}.jh__stage{order:-1;width:min(52%,230px);justify-self:center}.jh__copy{gap:12px;justify-items:center;text-align:center}.jh__hl{font-size:calc(clamp(30px,8vw,44px) * var(--heading-scale))}.jh__actions,.jh__nav{justify-content:center}.jh__scene--banner{min-height:var(--bh,560px)}.jh__copy--banner{justify-items:start;text-align:left}.jh__copy--banner .jh__actions{justify-content:flex-start}}@media(max-width:749px){.jh{padding-top:16px}.jh__scenes,.jh__nav{padding-inline:16px}.jh__desc{font-size:15.5px}.jh__eyebrow{font-size:13px;padding:5px 12px}.jh--fluid .jh__scenes{padding-inline:0}.jh--fluid .jh__scene--arch{width:min(100% - 32px,var(--page-width));padding-block:16px calc(var(--arc) + 46px)}.jh__scene--banner{min-height:var(--bhm,480px)}.jh__scene--banner .jh__scrim[data-style]{display:block;background:linear-gradient(to top,color-mix(in srgb,var(--c) 92%,transparent) 0 38%,color-mix(in srgb,var(--c) 45%,transparent) 72%,color-mix(in srgb,var(--c) 10%,transparent))}.jh__band{width:min(100% - 32px,var(--page-width));align-content:end;padding-block:clamp(90px,22vw,170px) calc(var(--arc) + 50px)}.jh__copy--banner{max-width:none;gap:13px}.jh__copy--banner .jh__hl{font-size:calc(clamp(31px,8.4vw,46px) * var(--heading-scale))}.jh__copy--banner .jh__desc{max-width:34ch}.jh__mchip{width:54px;padding:8px}.jh--fluid .jh__nav{bottom:auto;top:16px;justify-content:center}.jh__dlayer .jh__d[data-hide-sm]{display:none}}@media(prefers-reduced-motion:reduce){.jh__d i{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/cn-j-hero.css.map */