.escucha{padding-top:64px}
.escucha-intro{max-width:740px;margin-bottom:38px}
.escucha-kicker{margin:0 0 10px;color:#f2a93b;font:800 .78rem Arial,sans-serif;letter-spacing:.19em;text-transform:uppercase}
.escucha-intro h2{margin-bottom:18px}
.escucha-intro>p:last-child{font-size:1.15rem}
.walkman{--case:#28344a;--ink:#121a2b;position:relative;max-width:720px;margin:0 auto;padding:24px 0 0;color:#f1e8d8}
.walkman-tracks{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:530px;margin:0 auto 24px}
.walkman-track{min-height:68px;padding:10px 17px;border:2px solid #65717b;border-radius:5px 5px 10px 10px;background:linear-gradient(#344356,#1b2738);box-shadow:inset 0 1px #a9bbc155,0 5px 0 #0a101d;color:#e9e2d5;text-align:left;cursor:pointer}
.walkman-track span{display:block;color:#f2a93b;font:800 .66rem Arial,sans-serif;letter-spacing:.17em}
.walkman-track strong{display:block;margin-top:5px;font:700 .9rem Arial,sans-serif}
.walkman-track[aria-pressed="true"]{border-color:#f2a93b;background:linear-gradient(#69503e,#2b3040);box-shadow:inset 0 0 0 1px #f2a93b60,0 5px 0 #0a101d}
.walkman-track:hover{filter:brightness(1.12)}
.walkman-track:focus-visible{outline:3px solid #f2a93b;outline-offset:4px}
.walkman-headphones{position:absolute;z-index:0;top:162px;left:-104px;width:190px;height:216px;transform:rotate(-19deg);filter:drop-shadow(7px 12px 3px #0008);pointer-events:none}
.walkman-headband{position:absolute;top:0;left:28px;width:132px;height:160px;border:17px solid #151e2c;border-bottom:0;border-radius:94px 94px 0 0;box-shadow:inset 4px 0 #7b83804f,-3px -4px #0a111d}
.walkman-headband:after{content:"";position:absolute;top:0;left:8px;width:78px;height:45px;border-top:6px solid #b58153;border-radius:80px 80px 0 0}
.walkman-cup{position:absolute;bottom:7px;width:52px;height:86px;border:4px solid #080e1a;border-radius:16px 18px 21px 22px;background:linear-gradient(115deg,#636f74,#2d3b49 28%,#0e1929 79%);box-shadow:inset 3px 2px #b2aaa03d,3px 5px 3px #0009}
.walkman-cup:after{content:"";position:absolute;inset:12px 7px;border:5px solid #a56044;border-radius:12px;background:#1d1b23;box-shadow:inset 0 0 0 3px #d38b58}
.cup-left{left:11px;transform:rotate(7deg)}.cup-right{right:8px;transform:rotate(-7deg)}
.walkman-cable{position:absolute;z-index:0;top:65px;right:-44px;width:166px;height:165px;border:9px solid #141923;border-bottom:0;border-left:0;border-radius:0 100px 0 0;transform:rotate(8deg);filter:drop-shadow(4px 5px 1px #0008);pointer-events:none}
.walkman-case{position:relative;z-index:1;padding:12px 18px 20px;border:4px solid #0a101e;border-radius:19px 21px 28px 25px;background:linear-gradient(112deg,#4f6475 0%,#26344b 14%,#202b3f 58%,#0f1727 100%);box-shadow:inset 0 2px 0 #a9bbc180,inset 7px 0 0 #ffffff13,inset -7px -9px 0 #0005,0 15px 0 #0e1321,0 28px 0 -7px #090d17,0 34px 40px #0009;transform:rotate(-1.2deg)}
.walkman-case:before{content:"";position:absolute;inset:2px;border:1px solid #a7b6bb37;border-radius:14px 17px 24px 21px;pointer-events:none}
.walkman-case:after{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(102deg,#ffffff04 0 1px,transparent 1px 6px);mix-blend-mode:screen;pointer-events:none}
.walkman-topline,.walkman-markings,.walkman-bottomline{display:flex;align-items:center;justify-content:space-between;gap:12px;font-family:Arial,sans-serif}
.walkman-topline{min-height:33px;padding:0 15px 8px;color:#e6edf0}
.walkman-brand{font:900 1.1rem/1 Arial,sans-serif;letter-spacing:.16em;text-shadow:1px 2px #000}
.walkman-brand small{font-size:.54rem;letter-spacing:.24em;color:#f2a93b}
.walkman-jack{font:700 .62rem Arial,sans-serif;letter-spacing:.11em;color:#b4c4c9}
.walkman-face{padding:14px 19px 16px;border:3px solid #0d1422;border-radius:9px 9px 17px 17px;background:linear-gradient(138deg,#586877,#314353 28%,#273848 72%,#141f30);box-shadow:inset 0 2px 0 #bec8c780,inset 0 -7px 9px #0b14258c,0 3px 3px #0008}
.walkman-markings{font-size:.58rem;font-weight:800;letter-spacing:.2em;color:#d3e0dd}
.walkman-power{display:flex;align-items:center;gap:7px;color:#e6bf79}
.walkman-power i{width:8px;height:8px;border-radius:50%;background:#71342e;box-shadow:inset 0 1px 2px #000}
.walkman[data-state="playing"] .walkman-power i{background:#ff695e;box-shadow:0 0 11px #ff483b,inset 0 0 2px #fff}
.walkman-window{position:relative;overflow:hidden;margin:11px 0 17px;padding:18px 22px 20px;border:5px solid #0e1726;border-radius:11px;background:linear-gradient(140deg,#121b2d,#1b2637 50%,#07101d);box-shadow:inset 0 6px 12px #000a,0 2px 0 #9eaeb883}
.walkman-window:after{content:"";position:absolute;inset:0;background:linear-gradient(118deg,#ffffff44 0%,#ffffff0c 21%,transparent 23% 68%,#c4d4de20 71%,transparent 74%);pointer-events:none}
.walkman-cassette{position:relative;max-width:520px;margin:auto;padding:11px 18px 18px;border:3px solid #0a1019;border-radius:11px 11px 18px 18px;background:linear-gradient(110deg,#3e302f,#201f2a 28%,#35313a 73%,#131b28);box-shadow:inset 0 2px 0 #a9a4a36b,3px 6px 9px #0009}
.walkman-cassette:before,.walkman-cassette:after{content:"+";position:absolute;top:9px;color:#a9b2b5;font:700 12px Arial,sans-serif}
.walkman-cassette:before{left:7px}.walkman-cassette:after{right:7px}
.walkman-cassette-head{display:flex;justify-content:space-between;align-items:center;color:#e1d8c2;font:700 .6rem Arial,sans-serif;letter-spacing:.13em}
.walkman-cassette-head span:first-child{font-size:1rem;color:#f2a93b}
.walkman-cassette-label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0 10px;padding:7px 14px 8px;border-top:2px solid #f2a93b;background:linear-gradient(90deg,#dad2bd,#f4e9d2 64%,#d9c9aa);color:#17243a;box-shadow:inset 0 -3px #ad705c;font:800 clamp(.55rem,1.5vw,.8rem)/1.15 Arial,sans-serif;letter-spacing:.09em}
.walkman-cassette-label b{font:italic 800 clamp(.75rem,2vw,1.2rem)/1 Arial,sans-serif;transform:rotate(-5deg);color:#98294f}
.walkman-reels{display:flex;align-items:center;justify-content:space-around;gap:14px;margin:0 auto;max-width:350px;height:68px;border:3px solid #090d15;border-radius:8px;background:linear-gradient(#0a111b,#1b1b20);box-shadow:inset 0 2px 9px #000a}
.walkman-reel{display:block;width:55px;height:55px;border:11px solid #5d5a55;border-radius:50%;background:radial-gradient(circle,#172334 0 8px,#d9d0be 9px 11px,#293542 12px 100%);box-shadow:0 0 0 3px #141a23,inset 0 0 0 2px #9b9b91}
.walkman-reel:after{content:"";display:block;width:33px;height:33px;margin:-1px;border-radius:50%;background:conic-gradient(#bdad8e 0 18deg,transparent 18deg 62deg,#bdad8e 62deg 80deg,transparent 80deg 124deg,#bdad8e 124deg 142deg,transparent 142deg 186deg,#bdad8e 186deg 204deg,transparent 204deg 248deg,#bdad8e 248deg 266deg,transparent 266deg 310deg,#bdad8e 310deg 328deg,transparent 328deg)}
.walkman[data-state="playing"] .walkman-reel:after{animation:walkman-spin 2.8s linear infinite}
@keyframes walkman-spin{to{transform:rotate(360deg)}}
.walkman-tape-line{height:3px;margin:9px 18px 0;background:linear-gradient(90deg,transparent,#a88f6c 12% 88%,transparent)}
.walkman-controls{display:grid;grid-template-columns:1fr 1.55fr 1.25fr 1fr;gap:8px;padding:0 1px}
.walkman-key{min-height:54px;border:2px solid #0e1420;border-radius:5px 5px 10px 10px;background:linear-gradient(#b0b8b7,#647482 30%,#455768 70%,#263749);box-shadow:inset 0 2px 1px #fff9,inset -3px -4px 0 #17253780,0 4px 0 #111c2b,0 6px 4px #0008;color:#f1e8d8;font:800 .96rem Arial,sans-serif;text-shadow:0 1px 2px #000;cursor:pointer;transition:transform .12s,box-shadow .12s,filter .12s}
.walkman-key span{display:block;margin-top:2px;font-size:.54rem;letter-spacing:.16em}
.walkman-key:hover{filter:brightness(1.16)}
.walkman-key:active,.walkman-key[aria-pressed="true"]{transform:translateY(3px);box-shadow:inset 0 2px 7px #101a2a,0 1px 1px #000}
.walkman-key-play{background:linear-gradient(#f7c17e,#db814d 40%,#94523c 80%,#713637);color:#1b1725}
.walkman-key:focus-visible,.walkman-scrub:focus-visible{outline:3px solid #f2a93b;outline-offset:4px}
.walkman-bottomline{padding:17px 3px 0;color:#b3bdc3;font-size:.52rem;font-weight:800;letter-spacing:.13em}
.walkman-screw{position:absolute;z-index:2;width:10px;height:10px;border-radius:50%;border:2px solid #65727e;background:#c0c6bf;box-shadow:inset 1px 1px #fff6,1px 1px 2px #0009}
.walkman-screw:after{content:"";position:absolute;left:2px;top:2px;width:4px;height:2px;background:#384554;transform:rotate(-38deg)}
.screw-one{top:13px;left:7px}.screw-two{top:13px;right:7px}.screw-three{bottom:12px;left:7px}.screw-four{bottom:12px;right:7px}
.walkman-now{display:flex;justify-content:space-between;gap:12px;align-items:end;margin-top:43px;padding:0 4px;border-bottom:1px solid #596073}
.walkman-label{margin:0;color:#f2a93b;font:800 .65rem Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.walkman-title{margin:4px 0 8px;font:700 1.05rem Arial,sans-serif}
.walkman-timer{flex:none;padding-bottom:9px;color:#c0b9a9;font:700 .83rem ui-monospace,Consolas,monospace}
.walkman-scrub-label{display:block;margin:15px 4px 6px;color:#aaa8bd;font:700 .72rem Arial,sans-serif}
.walkman-scrub{width:100%;height:24px;margin:0;accent-color:#ff2e93;cursor:pointer}
.walkman-status{min-height:1.5em;margin:3px 4px 0;color:#c8bcb0;font:700 .82rem Arial,sans-serif}
.walkman audio:not([hidden]){display:block;width:100%;margin-top:16px}
.escucha-note{max-width:720px;margin:20px auto 0;color:#aaa8bd;font-size:.95rem}
@media(max-width:1080px){.walkman-headphones{left:-55px;top:142px;transform:rotate(-15deg) scale(.78)}}
@media(max-width:760px){.walkman-headphones{display:none}}
@media(max-width:600px){.escucha{padding-top:48px}.walkman{padding-top:13px}.walkman-tracks{gap:7px;margin-bottom:18px}.walkman-track{min-height:64px;padding:9px 10px}.walkman-track strong{font-size:.76rem}.walkman-cable{right:-10px;top:64px;width:70px;height:100px;border-width:6px}.walkman-case{padding:9px 10px 14px;border-width:3px}.walkman-face{padding:10px 10px 12px}.walkman-window{padding:13px 10px 15px}.walkman-cassette{padding:9px 12px 13px}.walkman-reels{height:55px}.walkman-reel{width:40px;height:40px;border-width:7px}.walkman-reel:after{width:27px;height:27px;margin:-1px}.walkman-key{min-height:48px}.walkman-bottomline{font-size:.43rem;letter-spacing:.08em}.walkman-now{margin-top:35px;align-items:start;flex-wrap:wrap}.walkman-timer{padding-bottom:10px}}
@media(prefers-reduced-motion:reduce){.walkman[data-state="playing"] .walkman-reel:after{animation:none}.walkman-key{transition:none}}