/* Touch-first refinements; desktop art direction remains in its stylesheet. */
@media(max-width:820px){
  html{scroll-padding-top:96px;-webkit-text-size-adjust:100%}
  body{min-width:0}
  .shell{width:calc(100% - 36px);max-width:680px}
  .shell>*,.canto-layout>*,.experience-grid>*,.spotify-strip>*,.portal-top>*{min-width:0}
  .section-pad,.cantometro{padding:64px 0}
  .section-title{font-size:clamp(36px,8.8vw,56px);line-height:1.08;letter-spacing:-.045em;text-wrap:balance}
  .section-intro,.hero-copy>p:not(.eyebrow){font-size:16px;line-height:1.7}
  .button,.canto-stop,.switcher button,.social-row a,.menu-toggle,.module-panel button,.archive-dialog button,.video-dialog button{min-height:46px;touch-action:manipulation}
  .button{padding:12px 20px;line-height:1.4;text-align:center;white-space:normal}
  .nav{padding-top:env(safe-area-inset-top,0px);background:#0d0813eb}
  .nav-inner{min-height:70px;gap:14px}.nav-logo{height:56px;width:72px}
  .nav-links{top:100%;padding:12px 18px 22px;max-height:calc(100dvh - 85px);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 24px 32px #0005}
  .nav .nav-links a:not(.nav-cta){min-height:50px;border-radius:9px;padding:14px;font-size:15px}
  .nav-links a[aria-current]{background:#ac53dd22}
  .nav-links a:after{display:none}
  .nav-links:not([hidden]){animation:mobile-menu-in .22s ease-out}
  .hero-copy{padding:112px 0 22px}
  .hero-copy h1{font-size:clamp(50px,12.5vw,80px);line-height:1.02;margin:20px 0 23px}
  .hero-buttons{display:grid;grid-template-columns:1fr;gap:10px;max-width:420px;margin-top:24px}
  .hero-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:28px;max-width:420px}
  .proof{padding-right:10px}.proof b{font-size:26px}.proof span{font-size:12px}
  .hero-art{width:calc(100% + 36px);min-height:0;height:clamp(370px,110vw,520px)}
  .floating-note{left:22px;right:22px;bottom:30px;max-width:300px;padding:18px}
  .floating-note b{font-size:22px}.floating-star{font-size:28px}
  .alyna-copy{padding:65px 0}.alyna .section-title{font-size:clamp(38px,9vw,58px)}
  .bio-points{gap:15px}.bio-point{min-height:0}.bio-point span{font-size:14px}
  .social-row{gap:9px}.contact-line{gap:10px;flex-direction:column;overflow-wrap:anywhere}
  .story-heading{margin-bottom:32px}.story-lead{font-size:22px;line-height:1.5}
  .story-photo img{height:auto;max-height:450px;aspect-ratio:4/5;object-fit:cover}
  .story-photo figcaption{padding:22px;font-size:23px}
  .artist-timeline{padding-left:23px}.artist-timeline li:before{left:-28px}
  .artist-timeline h3{font-size:27px;line-height:1.2}.artist-timeline li{padding-bottom:32px}
  .archive-heading{margin-top:50px}.archive-heading h3{font-size:32px}.archive-grid{gap:12px}
  .archive-grid img{height:auto;aspect-ratio:3/4;object-fit:cover}.archive-grid figcaption{font-size:14px;padding-top:10px}
  .archive-grid figcaption small{font-size:11px;letter-spacing:.03em}
  .story-chapter{margin-top:45px;padding-top:40px}.story-chapter h3{font-size:34px}
  .course-head{gap:24px}.course-grid{margin-top:30px;gap:15px}
  .course-card{min-height:290px;padding:24px 24px 65px}.course-card h3{font-size:35px;margin-top:23px}
  .course-more{left:24px!important;bottom:24px!important}
  .module-panel{padding:22px}.module-panel-top{gap:10px}.module-panel h3{font-size:28px}
  .lesson-chips span{max-width:100%;line-height:1.5}
  .step{grid-template-columns:28px minmax(0,1fr) 18px;gap:12px}.step h3{font-size:20px}
  .platform{min-height:350px}.platform-copy{padding:23px}.platform h3{font-size:32px}
  .platform-grid{gap:18px}.video-shelf{margin-top:36px}.video-thumbnails{gap:25px}
  .video-item h4{font-size:18px}.video-play:after{width:62px;height:46px}
  .spotify-strip{padding:16px;gap:14px;margin-top:28px}.spotify-strip iframe{min-width:0;max-width:100%}
  .spotify-strip a{display:inline-flex;align-items:center;min-height:44px;font-size:14px}
  .video-dialog,.archive-dialog{max-width:calc(100vw - 20px);width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:14px;overflow-y:auto;overscroll-behavior:contain}
  .video-dialog-top{align-items:flex-start;gap:12px}.video-dialog-top h3{line-height:1.3;padding-top:8px}
  .video-dialog-top form{flex-shrink:0}.video-dialog button{padding:10px 14px}
  .video-fallback{font-size:14px}.video-fallback a{display:inline-block;padding:6px 0}
  .archive-dialog img{max-height:65dvh}.archive-dialog p{font-size:15px}
  .portal{padding:20px}.portal-top{flex-wrap:wrap;gap:12px}.portal h3{font-size:24px}
  .progress-row{grid-template-columns:minmax(86px,1fr) minmax(50px,1fr) 36px;gap:8px;font-size:13px}
  .switcher{flex-wrap:wrap}.portal-note{padding:13px}
  .canto-layout{gap:27px}.canto-panel{padding:15px;border-radius:19px}
  .canto-steps{gap:5px}.canto-steps span{font-size:11px;padding:8px}
  .canto-stage{font-size:26px;line-height:1.2}.canto-message{font-size:15px;min-height:0}
  .canto-actions{display:flex;flex-direction:column;gap:10px}.canto-actions>*{width:100%;text-align:center;box-sizing:border-box}
  .canto-status{font-size:12px;line-height:1.5}.canto-game{margin:18px -4px;border-radius:14px}
  .game-top{padding:13px 10px;gap:8px;font-size:10px;letter-spacing:.03em}
  .game-score{gap:8px;padding:0 10px;font-size:11px}.game-stars{font-size:22px;letter-spacing:2px}
  .game-hint{padding:4px 10px;min-height:48px;font-size:14px;line-height:1.5}
  .game-help{font-size:12px;line-height:1.6;padding:0 10px 12px}
  .game-input{font-size:10px;padding:8px 10px;gap:6px}.game-signal{min-width:65px}
  .canto-result p{font-size:14px}.canto-tip{padding:15px;font-size:15px}
  .booking-photo{height:auto;aspect-ratio:4/5;object-fit:cover;max-height:470px}
  .contact-options{margin-top:25px;gap:5px}.contact-options strong{font-size:clamp(17px,4.8vw,23px)}
  .contact-options a{padding:23px 0}.final-inner{min-height:350px;padding:55px 0}
  .final .section-title{font-size:clamp(35px,8.5vw,52px)}
  .footer{padding-bottom:max(28px,env(safe-area-inset-bottom));gap:12px;line-height:1.6}
  .preload .intro-brand img{width:clamp(160px,48vw,250px);height:min(35svh,290px)}
  .intro-brand{max-width:100%;padding:0 18px}.intro-motto{font-size:18px;max-width:290px;margin:18px auto 0}
  .intro-skip{bottom:max(22px,env(safe-area-inset-bottom));right:22px;min-height:46px;font-size:14px}
}
@media(max-width:360px){.shell{width:calc(100% - 28px)}.hero-art{width:calc(100% + 28px);margin:0 -14px}.hero-copy h1{font-size:49px}.section-title{font-size:35px}.canto-panel{padding:12px}.canto-steps span{padding:7px 6px;font-size:10px}.game-score{flex-wrap:wrap}.nav-links{gap:0;padding:10px}.nav .nav-links a:not(.nav-cta){font-size:14px;padding:12px}.archive-grid{gap:10px}}
@media(max-width:820px) and (orientation:landscape){.intro-brand{display:grid;grid-template-columns:150px minmax(0,260px);align-items:center;column-gap:24px}.preload .intro-brand img{grid-row:1/4;width:145px;height:60svh}.intro-signature{margin:0}.intro-motto{font-size:17px}.intro-line{margin-top:16px}.intro-orbit{width:65svh}.video-frame{max-height:65dvh;width:auto;max-width:100%;margin:auto;aspect-ratio:16/9}}
@media(hover:none){.button:hover,.course-card:hover{transform:none;box-shadow:none}.platform:hover img,.archive-grid button:hover img,.video-preview:hover img{transform:none}.button:after{display:none}.button:active,.video-preview:active{opacity:.85}}
@keyframes mobile-menu-in{from{opacity:0;translate:0 -8px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){.nav-links:not([hidden]){animation:none}}
