/* Phone layout: keep the illustrated opening, make navigation and reading comfortable. */
@media(max-width:700px){
  html{scroll-padding-top:24px}
  body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  .header{height:122px;grid-template-columns:52px 1fr 96px;gap:6px;padding:12px 20px}
  .brand img{width:100px;height:100px}
  .menu summary{font-size:0;width:52px;min-height:44px;gap:0}
  .menu summary .menu-lines{margin-right:0}
  .menu[open] summary .menu-lines{height:0;border-bottom:0;transform:rotate(45deg)}
  .menu[open] summary .menu-lines:after{content:"";display:block;width:22px;border-top:1px solid;transform:rotate(90deg);margin-top:-1px}
  .menu nav{position:fixed;inset:120px 16px auto;max-height:calc(100svh - 140px);overflow-y:auto;min-width:0;padding:18px 24px;box-shadow:0 14px 35px #34392e18}
  .menu nav a{font-size:25px;min-height:48px;display:flex;align-items:center}
  .header-book{min-height:44px;align-items:center;margin-top:17px;font-size:12px}
  .hero-stage{height:100svh;min-height:810px}
  .hero-content,.motion-ready .hero-content{top:165px}
  .hero-location{font-size:11px;margin-bottom:25px}
  .hero-content h1{font-size:clamp(58px,17.8vw,88px)}
  .hero-description{font-size:30px;margin-top:18px}
  .hero-content .link-cta{font-size:12px;line-height:1.4;min-height:48px;margin-top:25px;padding:14px 16px;gap:14px}
  .hero-dancer{width:clamp(166px,44vw,208px);right:8%;bottom:92px}
  .hero-bottom{min-height:48px;bottom:18px;font-size:10px;left:20px;right:20px;padding:12px;gap:8px}
  .hero-bottom a{display:flex;align-items:center;min-height:24px;white-space:nowrap}
  .hero-bottom a span{margin-left:7px}
  .story-copy>p+p,.course-body>p,.first-visit details p,.route-steps p{font-size:14px;line-height:1.7}
  .course-body a{min-height:44px;display:inline-flex;align-items:center;margin-top:12px}
  .course summary{min-height:72px}
  .course summary>span:first-child{max-width:calc(100% - 90px)}
  .gallery-controls button{width:44px;height:44px}
  .gallery-controls{gap:8px}
  .life-card{flex-basis:84%}
  .life-card>img{height:clamp(360px,108vw,460px)}
  .life-gallery h2{font-size:36px}
  .price-column h3{font-size:25px}
  .price-column dl>div{font-size:14px;padding-block:18px}
  .price-offer{align-items:center;line-height:1.6}
  .schedule-days button{min-height:48px}
  .schedule-table th:first-child{font-size:12px}
  .schedule-table td{font-size:14px}
  .schedule-table tr{grid-template-columns:93px minmax(0,1fr);gap:6px 12px}
  .schedule-coach{font-size:11px!important}
  .schedule-booking .button,.closing .button{min-height:52px;font-size:13px}
  .first-visit summary{font-size:14px;min-height:60px;align-items:center}
  .visit-heading h2{font-size:clamp(48px,14.5vw,63px)}
  .route-map>a:not(.map-zoom){min-height:48px;align-items:center;font-size:13px}
  .map-logo{width:19%;min-width:55px;padding:7px}
  .phone{font-size:clamp(25px,7.5vw,32px);min-height:44px}
  .socials a,.visit-contacts>a:not(.phone){min-height:44px;display:inline-flex;align-items:center;font-size:13px}
  .socials{gap:28px;margin-top:18px}
  .closing{min-height:650px;padding:45px 20px 50px}
  .closing h2{font-size:clamp(48px,14vw,64px)}
  .closing-brand{width:150px;padding:23px}
  .footer{align-items:center;font-size:11px}
  .footer>a{min-height:44px;display:flex;align-items:center;width:auto;margin-left:auto}
  .footer>span:nth-child(2){margin-left:0}
}
@media(max-width:359px){
  .header{padding-inline:16px;grid-template-columns:44px 1fr 86px}
  .brand img{width:90px;height:90px}
  .header-book{font-size:11px;gap:8px}
  .hero-stage{min-height:780px}
  .hero-content,.motion-ready .hero-content{top:150px}
  .hero-content .link-cta{font-size:11px;padding-inline:12px;gap:10px}
  .hero-dancer{width:166px;right:7%;bottom:88px}
  .hero-bottom{left:16px;right:16px;font-size:9px;padding-inline:10px}
  .life-gallery h2{font-size:31px;max-width:170px}
  .life-gallery .gallery-top{gap:10px}
  .gallery-controls{gap:4px}
  .teachers h2{font-size:48px}
  .teacher-profile{grid-template-columns:96px 1fr;column-gap:14px}
  .teacher-profile h3{font-size:21px}
  .pricing-heading h2{font-size:43px}
  .price-column h3{font-size:23px;gap:12px}
  .schedule-heading h2{font-size:40px}
  .schedule-sheet{padding-inline:12px}
  .schedule-table tr{grid-template-columns:82px minmax(0,1fr);gap:6px 10px}
  .schedule-table th:first-child{font-size:11px}
}