*{box-sizing:border-box}body{margin:0;background:#5d9aa6;color:#fff;font-family:"Arial Rounded MT Bold","Chalkboard SE","Comic Sans MS",ui-rounded,sans-serif}.story-scene{position:relative;max-width:1920px;margin:auto;container-type:inline-size}.story-image{display:block;width:100%;height:auto}.story-copy{position:absolute;left:32%;top:28%;width:35.5%;height:59%;background:#5d9aa6;padding:1.4% 1%;display:flex;align-items:center;text-align:center}.story-copy h1{font-size:clamp(12px,2.05cqw,40px);font-weight:700;line-height:1.35;margin:0 0 1.1em;letter-spacing:.02em}.story-copy p{font-size:clamp(10px,1.7cqw,33px);line-height:1.65;margin:.9em 0;letter-spacing:.015em}.floating-copy{animation:storyFloat 6s ease-in-out infinite;text-shadow:0 2px 0 #1c25414d}.story-button{position:absolute;left:3.8%;width:21%;height:13%;border-radius:16px}.story-button.teoria{top:16.5%}.story-button.audicion{top:38%}.story-button.ritmo{top:59%}.story-button:hover{box-shadow:0 0 20px #fde74c99,inset 0 0 22px #ffffff50}.story-button:focus-visible{outline:4px solid #FDE74C;outline-offset:4px}.story-button:active{background:#ffffff38}.story-motto{position:absolute;left:3.6%;top:79%;width:22%;height:16%;display:grid;place-content:center;background:#5d9aa6;text-align:center;font-size:clamp(10px,1.7cqw,32px);line-height:1.5}.story-stars{position:absolute;inset:0;pointer-events:none}.story-stars span{position:absolute;color:#FDE74C;font-size:clamp(14px,2cqw,30px);animation:storyGlow 5s ease-in-out infinite}.story-stars span:nth-child(1){left:28%;top:15%}.story-stars span:nth-child(2){left:60%;top:89%;animation-delay:-2s}.story-stars span:nth-child(3){left:29%;top:76%;animation-delay:-3s}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.story-tools{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;padding:24px}.story-tools a,.story-tools button,.mobile-choices a{min-height:48px;padding:14px 20px;border:2px solid #1C2541;border-radius:18px;background:#FDE74C;color:#0B1320;text-decoration:none;font-family:inherit;font-size:16px;font-weight:700;line-height:1.4;cursor:pointer}.story-tools button{font-family:inherit;font-size:16px;font-weight:700}a:focus-visible,button:focus-visible{outline:3px solid white;outline-offset:4px}.mobile-copy,.mobile-choices{display:none}@keyframes storyFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes storyGlow{0%,100%{opacity:.3;transform:scale(.85)}50%{opacity:.9;transform:scale(1.1)}}body.story-paused *{animation:none!important;transition:none!important}@media(max-width:650px){.story-copy{padding:1%}.story-copy h1{font-size:2.05cqw}.story-copy p{font-size:1.7cqw}.story-button{display:none}.mobile-copy{display:block;padding:14px 24px;text-align:center;line-height:1.65}.mobile-copy h2{font-size:26px}.mobile-copy p{font-size:18px}.mobile-choices{display:grid;gap:14px;padding:12px 24px;max-width:440px;margin:auto}.mobile-choices a{text-align:center;font-size:22px;font-weight:700;box-shadow:0 4px 0 #1C2541}.mobile-choices a:nth-child(2){background:#e4f5f4}.mobile-choices a:nth-child(3){background:#9BC53D}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Móvil: solo la ilustración a la derecha del original; una única copia del texto y los botones. */
@media(max-width:650px){
 .story-scene{width:min(82vw,360px);aspect-ratio:16/27;overflow:hidden;margin:14px auto 0}
 .story-scene .story-image{position:absolute;right:0;top:0;width:300%;max-width:none;height:100%;object-fit:fill}
 .story-scene .story-copy,.story-scene .story-motto,.story-scene .story-stars,.story-scene .story-button{display:none}
 .mobile-copy{padding-top:12px}
 .mobile-copy h1{font-size:26px;line-height:1.4;margin:16px 0}
}
