.hero-anim{width:100%;display:flex;flex-direction:column;align-items:center;gap:12px}.hero-anim .hero-anim-stage{width:100%;max-width:600px;aspect-ratio:1 / 1;position:relative;background-color:#0f1115;box-shadow:0 20px 40px #0006;border-radius:12px;overflow:hidden;container-type:inline-size;cursor:pointer}.hero-anim .bg-fill{position:absolute;inset:0;background-color:#2d3748;opacity:0;z-index:1;will-change:opacity}.hero-anim .layer{position:absolute;inset:0;opacity:0;z-index:2;will-change:transform,opacity;transform-origin:50% 50%}.hero-anim .layer[data-initial]{opacity:1;z-index:1}.hero-anim .layer img,.hero-anim .layer picture{position:absolute;display:block;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.hero-anim .layer img{inset:0;width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.hero-anim .picture-bg{position:absolute;display:block;opacity:0;pointer-events:none;will-change:opacity}.hero-anim .picture-bg-checker{background-color:#666;background-image:linear-gradient(45deg,#989898 25%,transparent 25%),linear-gradient(-45deg,#989898 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#989898 75%),linear-gradient(-45deg,transparent 75%,#989898 75%);background-size:40px 40px;background-position:0 0,0 20px,20px -20px,-20px 0px}.hero-anim .overlay{position:absolute;display:block;opacity:0;pointer-events:none;z-index:10;will-change:opacity}.hero-anim .flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;z-index:30;will-change:opacity}.hero-anim .scanner-line{position:absolute;left:0;width:100%;height:16.666%;top:-16.666%;background:linear-gradient(to bottom,transparent,rgba(59,130,246,.7) 50%,transparent);box-shadow:0 0 12px #3b82f699;pointer-events:none;opacity:0;z-index:25;will-change:transform,opacity}.hero-anim .caption{position:absolute;left:50%;bottom:14px;transform:translate(-50%);background:#000000b8;color:#fff;padding:6px 14px;border-radius:14px;font-size:clamp(11px,2.4cqi,14px);font-weight:500;white-space:pre-line;text-align:center;line-height:1.25;opacity:0;z-index:31;pointer-events:none;letter-spacing:.02em;will-change:opacity}.hero-anim .caption:empty{display:none}.hero-anim .stage-badge{position:absolute;top:12px;left:12px;background:#0009;border:1px solid rgba(255,255,255,.25);color:#fff;padding:4px 10px;border-radius:6px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;z-index:31;opacity:0;will-change:opacity}.hero-anim .pause-indicator{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:40;opacity:0;transition:opacity .15s ease}.hero-anim .pause-indicator.visible{opacity:1}.hero-anim .pause-indicator-icon{width:80px;height:80px;background:#0000008c;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.6)}.hero-anim .pause-indicator-icon:before,.hero-anim .pause-indicator-icon:after{content:"";width:8px;height:28px;background:#fff;border-radius:1px}.hero-anim .pause-indicator-icon:before{margin-right:6px}.hero-anim .present-panel{position:absolute;inset:0;display:flex;flex-direction:column;background:transparent;opacity:0;pointer-events:none;z-index:6;transform-origin:50% 50%;will-change:opacity,transform;overflow:hidden}.hero-anim .present-sheet{flex:0 0 60%;display:flex;align-items:center;justify-content:flex-start;padding:12px 24px 18px;background:transparent;min-height:0;overflow:hidden}.hero-anim .present-sheet picture{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;position:static}.hero-anim .present-sheet img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;-o-object-fit:contain;object-fit:contain;position:static;inset:auto}.hero-anim .present-brand{flex:0 0 40%;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:clamp(12px,3cqi,24px);padding:clamp(8px,2cqi,14px) 24px;background:transparent;color:#fff;min-height:0;overflow:hidden}.hero-anim .present-thumb{width:100%;height:100%;min-width:0;min-height:0;padding:10%;box-sizing:border-box;display:flex;justify-content:center;align-items:center}.hero-anim .present-thumb img{display:block;max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;position:static;inset:auto}.hero-anim .present-text{width:100%;height:100%;min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;gap:clamp(6px,2cqi,12px)}.hero-anim .present-snap-logo{display:inline-flex;align-items:center;gap:clamp(4.8px,1.9cqi,14.4px);font-family:Google Sans,Inter,system-ui,sans-serif;font-size:clamp(1.2rem,6cqi,2.28rem);font-weight:700;line-height:1;color:#fff}.hero-anim .present-snap-logo:before{content:"";width:clamp(31.2px,10.8cqi,67.2px);height:clamp(31.2px,10.8cqi,67.2px);flex:0 0 clamp(31.2px,10.8cqi,67.2px);background:url(/assets/img/core/anim/logo.png) center/cover no-repeat;border-radius:6px;border:2px solid #fff;box-sizing:border-box;aspect-ratio:1 / 1}.hero-anim .present-guarantee{display:flex;flex-direction:column;gap:.24rem;align-items:flex-start}.hero-anim .present-guarantee-text{font-family:Google Sans,Inter,system-ui,sans-serif;font-size:clamp(.78rem,2.88cqi,1.14rem);line-height:1;white-space:nowrap;color:#ffffffc7}.hero-anim .present-guarantee-stars{display:block;height:clamp(13.2px,4.2cqi,21.6px);width:auto;-o-object-fit:contain;object-fit:contain;position:static;inset:auto}.hero-anim .controls{display:flex;align-items:center;justify-content:center;gap:clamp(6px,2vw,16px);padding:8px clamp(6px,2vw,12px);background:#ffffff0a;border-radius:8px;width:100%;max-width:600px;box-sizing:border-box;flex-wrap:nowrap}.hero-anim .ctrl-btn{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:6px clamp(8px,2.4vw,14px);font-size:clamp(11px,2.6vw,13px);font-family:inherit;cursor:pointer;transition:background .1s;white-space:nowrap;flex:0 0 auto}.hero-anim .ctrl-btn:hover:not(:disabled){background:#ffffff2e}.hero-anim .ctrl-btn:disabled{opacity:.4;cursor:not-allowed}.hero-anim .step-info{color:#ffffffd9;font-size:clamp(11px,2.6vw,13px);min-width:0;flex:1 1 auto;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes hero-anim-pulse-glow{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.hero-anim .pulse-active{animation:hero-anim-pulse-glow .8s infinite ease-in-out}@media(prefers-reduced-motion:reduce){.hero-anim .pulse-active{animation:none}}