.listening-hero{isolation:isolate;min-height:700px;padding:44px var(--gutter) 36px;grid-template-columns:minmax(0,.88fr) minmax(0,1.25fr);gap:0;position:relative;overflow:clip}.listening-hero .hero-copy{z-index:3;pointer-events:none;padding:44px 0 56px;position:relative}.listening-hero .hero-copy a{pointer-events:auto}.listening-hero .hero-copy h1{letter-spacing:-.033em;font-size:clamp(80px,8.1vw,128px);line-height:.96}.listening-hero .hero-copy h1>span{margin-block:-.06em;padding-block:.06em;display:block;overflow:clip}.listening-hero .hero-copy h1>span>span{display:block}[data-reveal]:not([data-revealed=true]) .listening-hero h1>span>span{animation:title-enter var(--motion-entry) var(--motion-ease) both;animation-delay:calc(var(--line-index) * 95ms)}@keyframes title-enter{0%{opacity:0;translate:0 105%;rotate:3deg}to{opacity:1;translate:0;rotate:none}}.listening-hero .hero-copy>p{max-width:470px;margin-top:25px;padding-right:25px;font-size:clamp(17px,1.35vw,21px)}.listening-hero .hero-actions{margin-top:29px}.listening-hero .hero-actions .button{min-height:49px;padding-inline:22px;font-size:13px}.listening-composition{align-self:center;min-width:0;position:relative}.listening-stage{perspective:1500px;touch-action:pan-y;-webkit-user-select:none;user-select:none;width:100%;height:clamp(370px,34vw,565px);position:relative}.listening-field{pointer-events:none;z-index:0;opacity:.65;width:160%;height:125%;position:absolute;top:-5%;left:-32%}.sleeve-space{z-index:1;pointer-events:none;transform-style:preserve-3d;perspective:1500px;transform:translate3d(calc(var(--scene-x,0) * 12px), calc(var(--scene-y,0) * 8px + var(--scene-float,0px)), 0) rotateX(calc(var(--scene-y,0) * -5deg)) rotateY(calc(var(--scene-x,0) * 7deg));position:absolute;inset:0}.listening-sleeve{pointer-events:auto;aspect-ratio:1;width:54%;transform-style:preserve-3d;transition:transform var(--motion-scene) var(--motion-ease), box-shadow var(--motion-ui) var(--motion-ease);border:0;padding:0;position:absolute;top:9%;left:25%;box-shadow:8px 20px 45px #0005}.listening-sleeve img{object-fit:cover;backface-visibility:hidden;pointer-events:none;width:100%;height:100%;transition:filter var(--motion-scene) var(--motion-ease);border:1px solid #a89d8933;display:block}.listening-sleeve[data-position=front]{z-index:3;transform:translateZ(45px)rotateY(-6deg)rotate(2deg)}.listening-sleeve[data-position=left]{z-index:1;transform:translate3d(-60%,6%,-100px)rotateY(14deg)rotate(-6deg)scale(.85)}.listening-sleeve[data-position=right]{z-index:0;transform:translate3d(60%,6%,-100px)rotateY(-14deg)rotate(6deg)scale(.85)}.listening-sleeve:not([data-position=front]) img{filter:brightness(.7)}.listening-sleeve:hover img,.listening-sleeve:focus-visible img{filter:brightness()}.listening-sleeve:focus-visible{outline-offset:6px;outline:2px solid #fff}.listening-caption{z-index:5;flex-direction:column;align-items:center;gap:7px;margin-top:-6px;display:flex;position:relative}.listening-caption>a{border-bottom:1px solid #999;align-items:center;gap:12px;min-height:44px;padding:4px 0 8px;font-size:17px;display:inline-flex}.listening-caption>a svg{transition:transform .25s}.listening-caption>a:hover svg{transform:translate(4px)}.listening-caption>small{color:#b6b7bc;letter-spacing:.01em;font-size:11px}.listening-controls{z-index:5;justify-content:center;align-items:center;min-height:44px;margin-top:18px;display:flex;position:relative}.sleeve-navigation{align-items:center;gap:13px;display:flex}.sleeve-navigation .icon-button{border:1px solid #6b6b6b;width:44px;height:44px}.sleeve-navigation .icon-button:hover{background:#ffffff15;border-color:#fff}.sleeve-counter{font-variant-numeric:tabular-nums;letter-spacing:.08em;text-align:center;min-width:64px;font-size:12px}.sleeve-counter>span{color:#a3a4aa}.motion-toggle{color:#b6b7bc;justify-content:center;align-items:center;gap:7px;min-height:44px;padding:8px;font-size:10px;display:flex;position:absolute;bottom:0;right:0}.motion-toggle:hover{color:#fff}.motion-toggle:disabled{opacity:.8;cursor:default}.motion-toggle svg{flex-shrink:0}.motion-toggle>span{text-align:left;max-width:70px}html[lang=zh-CN] .listening-hero .hero-copy h1{letter-spacing:-.065em;font-size:clamp(48px,5.4vw,82px);line-height:1.24}html[lang=th] .listening-hero .hero-copy h1{letter-spacing:-.04em;font-size:clamp(44px,5vw,77px);line-height:1.24}@media (min-width:1600px){.listening-hero{min-height:780px}}@media (max-width:1100px) and (min-width:641px){.listening-hero{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);min-height:630px;padding-block:36px}.listening-hero .hero-copy{padding-bottom:66px}.listening-hero .hero-copy h1{font-size:clamp(68px,8.3vw,92px)}.listening-hero .hero-copy>p{padding-right:15px;font-size:16px}.listening-hero .hero-actions .button{padding-inline:16px;font-size:12px}.listening-stage{height:355px}.listening-sleeve{width:58%;top:18%;left:22%}.listening-caption{margin-top:0}.sleeve-navigation{gap:5px}.motion-toggle{margin-top:14px;position:static}.motion-toggle>span{max-width:none}.listening-controls{flex-direction:column;margin-top:20px}html[lang=zh-CN] .listening-hero .hero-copy h1{font-size:5.4vw}html[lang=th] .listening-hero .hero-copy h1{font-size:5.1vw}}@media (max-width:640px){.listening-hero{flex-direction:column;gap:0;min-height:0;padding-top:36px;padding-bottom:20px;display:flex}.listening-hero .hero-copy{padding:0}.listening-hero .hero-copy h1{max-width:100%;font-size:clamp(61px,17.1vw,95px);line-height:.98}.listening-hero .hero-copy>p{max-width:355px;margin-top:21px;padding-right:0;font-size:15px;line-height:1.65}.listening-hero .hero-actions{gap:10px;margin-top:22px}.listening-hero .hero-actions .button{min-height:46px;padding-inline:14px;font-size:11px}.listening-composition{width:100%;margin-top:25px}.listening-stage{perspective:1000px;height:clamp(270px,78vw,470px)}.listening-field{width:156%;height:136%;top:-13%;left:-28%}.listening-sleeve{width:58%;top:13%;left:21%}.listening-sleeve[data-position=front]{transform:translateZ(25px)rotateY(-6deg)rotate(2deg)}.listening-sleeve[data-position=left]{transform:translate3d(-58%,6%,-60px)rotateY(12deg)rotate(-6deg)scale(.85)}.listening-sleeve[data-position=right]{transform:translate3d(58%,6%,-60px)rotateY(-12deg)rotate(6deg)scale(.85)}.listening-caption{margin-top:-4px}.listening-caption>a{font-size:15px}.listening-caption>small{font-size:10px}.listening-controls{flex-direction:column;min-height:0;margin-top:17px}.sleeve-navigation{gap:9px}.motion-toggle{margin-top:12px;font-size:10px;position:static}.motion-toggle>span{max-width:none}html[lang=zh-CN] .listening-hero .hero-copy h1{letter-spacing:-.04em;font-size:clamp(38px,10.8vw,66px);line-height:1.3}html[lang=th] .listening-hero .hero-copy h1{font-size:clamp(37px,10.3vw,64px);line-height:1.3}}@media (prefers-reduced-motion:reduce){.listening-hero *,.listening-hero :before,.listening-hero :after{transition:none!important;animation:none!important}.sleeve-space{transform:none!important}}[data-reveal]:not([data-revealed=true]) .listening-composition[data-scene-intro]{animation:scene-arrive 1.1s var(--motion-ease) both}@keyframes scene-arrive{0%{opacity:0;transform:perspective(1600px)translate3d(70px,40px,-180px)rotateY(-14deg)rotateX(6deg)}to{opacity:1;transform:perspective(1600px)translate(0,0)rotateY(0)rotateX(0)}}.listening-hero .hero-copy>p[data-intro]{animation-delay:.18s}.listening-hero .hero-actions[data-intro]{animation-delay:.27s}.listening-caption>a{animation:caption-arrive .4s var(--motion-ease) both}@keyframes caption-arrive{0%{opacity:0;translate:0 10px}to{opacity:1;translate:0}}.listening-caption[data-playing=true]>a:before{content:"";background:#7895ff;border-radius:50%;width:5px;height:5px;box-shadow:0 0 14px #214cff88}.listening-sleeve[data-position=front]:hover{box-shadow:12px 28px 65px #0009}@media (prefers-reduced-motion:reduce){.listening-composition[data-scene-intro]{animation:none!important}}
