.sound-styles{max-width:1240px;margin:auto;padding:88px 32px 64px;scroll-margin-top:30px}
.styles-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}
.styles-heading .eyebrow{font-size:13px;letter-spacing:.08em;color:#9c496b;margin-bottom:12px}
.styles-heading h2{font-size:clamp(32px,4vw,48px);line-height:1.12;letter-spacing:-1.8px}
.styles-arrows{display:flex;gap:8px;flex-shrink:0}
.styles-arrows button{width:48px;height:48px;border:1px solid #eecfdd;background:white;border-radius:50%;font:22px Poppins,sans-serif;color:#f5003d;cursor:pointer}
.styles-arrows button:disabled{opacity:.3;cursor:default}
.style-deck{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:4px;padding:16px 4px 24px;scrollbar-width:thin;scrollbar-color:#edb4c8 transparent;perspective:1000px}
.sound-card{position:relative;flex:0 0 29%;min-width:240px;aspect-ratio:3/4;overflow:hidden;border:1px solid #efdbe4;border-radius:22px;text-align:left;background:#fff4f8;scroll-snap-align:start;cursor:pointer;color:#27232c;transition:transform .25s ease,box-shadow .25s ease}
.sound-card:nth-child(even){transform:translateY(8px)}
.sound-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.sound-copy{position:absolute;inset:0;padding:22px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(transparent 30%,#fff7fae6 69%,#fff7fa 100%)}
.sound-number{position:absolute;top:18px;left:18px;font-size:12px;letter-spacing:.08em;font-weight:600;color:#64324a;background:#ffffffa6;padding:4px 9px;border-radius:14px}
.sound-copy strong{font:700 clamp(22px,2.2vw,29px)/1.15 Poppins,sans-serif;letter-spacing:-1px}
.sound-description{font:400 13px/1.5 Poppins,sans-serif;display:block;margin:8px 0 16px;color:#63535c}
.sound-listen{display:inline-flex;align-self:start;font:600 13px Poppins,sans-serif;padding:10px 15px;background:#fff;border:1px solid #e7c3d2;border-radius:30px;color:#a82952;min-height:42px}
.sound-card.is-playing{border:2px solid #f5003d}.sound-card.is-playing .sound-listen{background:#f5003d;color:#fff;border-color:#f5003d}
.styles-hint{font:500 25px/1.2 Caveat,cursive;text-align:center;color:#8d4867;margin:18px 0 8px}
.styles-hint span{display:inline-block;transform:rotate(12deg);margin-left:7px}
.style-selected{max-width:630px;margin:26px auto 0;border:1px solid #edd0df;background:#fff7fa;padding:20px 24px;border-radius:20px}
.style-selected[hidden]{display:none}
.style-selected-title{display:flex;gap:8px;align-items:baseline;margin-bottom:14px}.style-selected-title>span{font-size:13px;color:#745f6a}.style-selected-title h3{font-size:18px;margin:0}.style-close{margin-left:auto;background:transparent;border:0;min-width:44px;min-height:44px;font-size:28px;cursor:pointer;color:#755163}
.style-selected .song-timeline{padding-top:4px}.style-selected .song-seek{position:relative;width:100%;height:26px;display:block}.style-selected .song-times{margin-top:3px}
.sound-styles .how-cta{margin-top:32px}
@media(hover:hover){.sound-card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:0 15px 30px #74304a13}.sound-card:hover img{transform:scale(1.035)}}
@media(max-width:768px){
 .sound-styles{padding:52px 24px 40px;overflow:clip}
 .styles-heading{align-items:start;margin-bottom:18px;gap:12px}.styles-heading h2{font-size:34px;letter-spacing:-1.3px}.styles-heading .eyebrow{font-size:12px;letter-spacing:0;max-width:250px}
 .styles-arrows{align-self:end;gap:5px}.styles-arrows button{width:36px;height:36px;font-size:18px}
 .style-deck{margin-right:-24px;padding-right:24px;gap:14px;scroll-padding-left:0}
 .sound-card{flex-basis:76%;min-width:0;max-width:340px;aspect-ratio:3/4}
 .sound-copy{padding:20px}.sound-copy strong{font-size:25px}.sound-description{font-size:13px}.sound-listen{font-size:13px}
 .style-selected{padding:14px 16px}.style-selected-title{flex-wrap:wrap}.style-selected-title h3{font-size:17px}
}
@media(prefers-reduced-motion:reduce){.sound-card,.sound-card img{transition:none!important;transform:none!important}.style-deck{scroll-behavior:auto}}
.sound-styles .how-cta{text-align:center}
@media(max-width:768px){.styles-arrows button{width:44px;height:44px}.sound-description,.sound-listen{font-size:14px}}
