.hero-visual{height:auto!important;aspect-ratio:1200/620;isolation:isolate;background:#f6f4ee;overflow:hidden}.hero-visual::after{display:none!important}
.jp-stage{position:absolute;inset:0;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 42%,#f5e9d4,transparent 45%),linear-gradient(130deg,#f8f7f2,#e5ece5 65%,#efe9dd)}
.hero-visual img.jp-final{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;object-position:center;transform:none!important;animation:none!important;opacity:1;filter:saturate(.8);transition:opacity 1.2s ease,filter 1.6s ease;z-index:1}
.jp-pieces,.jp-light{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.jp-pieces{z-index:2;filter:drop-shadow(0 4px 5px rgba(38,61,44,.06))}
.jp-piece{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rotate)) scale(.85);transform-origin:center;transform-box:fill-box}
.jp-blank{fill:#fffdf8;stroke:#c8c8b8;stroke-width:1}.jp-piece-image{opacity:0;filter:grayscale(1) brightness(1.1)}.jp-outline{fill:none;stroke:rgba(113,135,113,.43);stroke-width:1.2;stroke-linejoin:round}
.jp-stage.is-playing .jp-piece{animation:jp-enter 1.65s cubic-bezier(.22,.8,.19,1) forwards;animation-delay:var(--delay)}
.jp-stage.is-playing .jp-piece-image{animation:jp-color 2.65s ease-out forwards;animation-delay:calc(var(--delay) + .55s)}
.jp-stage.is-playing .jp-final{opacity:0}
.jp-stage.is-complete .jp-final{opacity:1;filter:saturate(1)}.jp-stage.is-complete .jp-pieces{opacity:0;transition:opacity 1.2s ease}
.jp-light{z-index:3;opacity:0}.jp-light path{fill:none;stroke:#e6c98c;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.jp-stage.is-complete .jp-light{opacity:.82;transition:opacity .8s ease .65s}.jp-stage.is-complete .jp-light path{animation:jp-trace 2.2s ease-out .9s forwards}
.jp-time{position:absolute;left:18px;bottom:16px;z-index:4;display:flex;align-items:center;gap:9px;border:1px solid #d2d4c5;background:#fffdf8e6;border-radius:30px;padding:9px 13px;color:#49695a;letter-spacing:.13em;font:600 11px Georgia,serif;pointer-events:none}.jp-time i{display:block;width:15px;height:1px;background:#bca77f}
.jp-replay{position:absolute;z-index:5;bottom:14px;right:14px;border:1px solid #bec6b7;border-radius:30px;background:#fffcf4e8;color:#49695a;padding:9px 13px;font:600 11px Georgia,serif;letter-spacing:.1em}.jp-replay:hover{background:#fff}.hero-visual .scroll-link{z-index:6;bottom:12px}
@keyframes jp-enter{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rotate)) scale(.85)}30%{opacity:.9}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes jp-color{0%{opacity:0;filter:grayscale(1) brightness(1.12)}25%{opacity:.55}100%{opacity:1;filter:none}}@keyframes jp-trace{to{stroke-dashoffset:0}}
@media(max-width:700px){.hero-visual{height:auto!important;aspect-ratio:1200/700}.jp-time{font-size:8px;bottom:8px;left:7px;gap:5px;padding:6px 8px}.jp-time i{width:8px}.jp-replay{bottom:7px;right:7px;padding:7px 8px;font-size:9px}.jp-replay span{display:none}.hero-visual .scroll-link{bottom:7px;width:38px;height:38px;font-size:20px}}
@media(prefers-reduced-motion:reduce){.jp-pieces,.jp-light,.jp-replay{display:none!important}.hero-visual img.jp-final{opacity:1!important;filter:none!important;transition:none!important}.jp-piece,.jp-piece-image{animation:none!important}}