
.ppf-experience{background:#080808;color:#ededed;padding:60px 0}.ppf-intro{color:#c9c9c9;font-size:15px;margin-bottom:28px}.ppf-canvas{position:relative;isolation:isolate;background:#080808;border:1px solid #ffffff18;border-radius:16px;overflow:hidden;container-type:inline-size}.ppf-image-wrap{position:relative}.ppf-image-wrap img{display:block;width:100%;height:auto;border-radius:0}.ppf-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.ppf-callouts{position:absolute;z-index:2;top:2.1%;left:0;right:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.ppf-callout{background:transparent;border:0;color:#ededed;padding:0 16%;text-align:center;min-width:0;border-radius:6px;cursor:pointer}.ppf-callout strong{display:block;font:500 clamp(19px,2.6cqw,38px)/1.1 Impact,'Arial Narrow',sans-serif;letter-spacing:.3px}.ppf-callout strong:after{content:'';display:block;width:28%;max-width:48px;height:2px;background:#a2a2a2;margin:10px auto}.ppf-callout span{display:block;font-size:clamp(11px,1.15cqw,16px);line-height:1.45}.ppf-callout small{display:block;font-size:clamp(9px,.8cqw,11px);color:#a9a9a9;margin-top:7px;line-height:1.35}.ppf-callout:hover strong,.ppf-callout[aria-pressed=true] strong{color:#d3d3d3}.ppf-callout:focus-visible{outline:2px solid #d3d3d3;outline-offset:-2px}.ppf-piece{opacity:0}.ppf-material{fill:url(#ppf-surface);stroke:#a0d8f5;stroke-width:1.6;stroke-linejoin:round}.ppf-crease{fill:none;stroke:white;stroke-width:1.7;opacity:.28}.ppf-sheen{opacity:0}.ppf-leader{opacity:.45;transition:opacity .25s}.ppf-leader path{fill:none;stroke:#e7e7e7;stroke-width:1.6;stroke-linejoin:round}.ppf-leader circle{fill:#080808c9;stroke:#e7e7e7;stroke-width:1.8}.ppf-leader.active{opacity:1}.ppf-leader.active path,.ppf-leader.active circle{stroke:#d2d2d2;stroke-width:2.5}.ppf-leader .ppf-shield{fill:#080808bd}.ppf-player{display:flex;align-items:center;gap:24px;margin-top:22px;flex-wrap:wrap}.ppf-player-buttons{display:flex;gap:10px}.ppf-player .btn{min-height:44px;padding:12px 18px;font-size:11px}.ppf-timeline-label{flex:1;min-width:190px;color:#bbbbbb;font-size:10px;letter-spacing:1.2px}.ppf-timeline-label input{padding:0;margin:10px 0 0;width:100%;height:18px;background:transparent;border:0;accent-color:#c1c1c1;cursor:pointer;box-shadow:none}#ppf-phase{font-size:12px;color:#cccccc;min-width:150px}.ppf-detail{font-size:12px;color:#b8b8b8;line-height:1.7;margin:20px 0 0;max-width:850px}.ppf-mobile-marker{display:none}.ppf-mobile-marker circle{fill:#080808e6;stroke:#d3d3d3;stroke-width:2}.ppf-mobile-marker text{font:22px Arial;fill:white;text-anchor:middle}.ppf-mobile-marker.active circle{fill:#616161}
@media(max-width:1050px){.ppf-callouts{position:relative;top:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px;padding:22px 16px;background:#080808}.ppf-callout{padding:8px 4px}.ppf-callout strong{font-size:24px}.ppf-callout span{font-size:12px}.ppf-callout small{font-size:10px}.ppf-callout strong:after{margin:8px auto}.ppf-callout strong:before{font:10px Arial;display:block;margin-bottom:6px;color:#d3d3d3}.ppf-callout:nth-child(1) strong:before{content:'01 / HOOD'}.ppf-callout:nth-child(2) strong:before{content:'02 / MIRROR'}.ppf-callout:nth-child(3) strong:before{content:'03 / FILM EDGE'}.ppf-callout:nth-child(4) strong:before{content:'04 / PRODUCT TERMS'}.ppf-leaders{display:none}.ppf-mobile-marker{display:block}.ppf-experience{padding:40px 0}.ppf-player{gap:16px}.ppf-timeline-label{min-width:100%;order:3}#ppf-phase{min-width:0;font-size:11px}.ppf-image-wrap{margin-top:-12%;z-index:0}}
@media(prefers-reduced-motion:reduce){.ppf-leader{transition:none}}
