/* Shared mobile rhythm, without changing the desktop composition. */
@media (max-width:700px){
  body{--mobile-gutter:clamp(16px,5.5vw,28px);--mobile-card-padding:20px}
  .header,.section,.premium-footer{padding-left:var(--mobile-gutter);padding-right:var(--mobile-gutter)}
  .header{gap:16px;min-height:88px;height:auto;padding-top:20px;padding-bottom:20px;flex-wrap:wrap}
  .header nav{gap:16px;flex-wrap:wrap}
  .header nav a,.header nav a:nth-child(4){font-size:14px;line-height:1.5;min-height:44px;display:flex;align-items:center}
  .hero{grid-template-columns:minmax(0,1fr)}
  .hero-copy{padding-left:var(--mobile-gutter);padding-right:var(--mobile-gutter);min-width:0}
  .hero h1{margin-top:28px;margin-bottom:24px}
  .hero-copy p br{display:none}
  .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch}
  .hero-actions .button{width:100%;justify-content:space-between;min-height:56px;font-size:16px}
  .hero-actions .text-link{justify-self:start;font-size:14px;min-height:44px;display:flex;align-items:center}
  .rating{width:100%;min-width:0;gap:16px;padding:18px 20px;border-radius:14px}
  .rating div{min-width:0;line-height:1.6}.rating strong{flex-shrink:0}
  .hero-photo{margin-left:var(--mobile-gutter);margin-right:var(--mobile-gutter);min-height:400px}
  .photo-label{left:24px;right:24px;bottom:64px;font-size:clamp(28px,8vw,36px);line-height:1.25}
  .photo-number{left:24px;right:24px;font-size:12px;letter-spacing:1px}
  .section{padding-top:56px;padding-bottom:56px}
  .section-head{margin-bottom:28px}.section-head p{max-width:none;font-size:16px}
  .about-grid,.features,.stay-category-grid,.stay-faq-grid,.home-comfort,.home-comfort ul,.seaside-information{grid-template-columns:minmax(0,1fr)}
  .about-grid{gap:28px}.features,.stay-category-grid{gap:16px}
  .feature,.features .transfer-feature,.stay-category-grid article,.review,.home-comfort,.stay-policy{padding:var(--mobile-card-padding);border-radius:14px;min-width:0}
  .feature h3{margin-top:12px;margin-bottom:10px}.feature p{font-size:16px;line-height:1.75}
  .feature span{font-size:12px}.features .transfer-feature{grid-column:auto}
  .home-comfort{gap:24px;margin-top:28px}.home-comfort ul{gap:24px}
  .stay-faq-grid,.seaside-information{gap:28px}
  .stay-policy{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .gallery button{min-width:0}.gallery img{height:210px}.gallery-caption{padding:40px 14px 16px;line-height:1.6}
  .reviews-grid{gap:16px}.review p{font-size:16px}
  .booking-card{padding:var(--mobile-card-padding);border-radius:16px;min-width:0}
  .booking-fields{grid-template-columns:minmax(0,1fr);gap:20px}
  .booking-fields label,.room-tools label{min-width:0}
  .booking-fields input,.room-tools select{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;font-size:16px;min-height:56px}
  .range-calendar{padding:20px 10px;border-radius:12px;margin-bottom:24px;min-width:0}
  .calendar-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
  .calendar-toolbar p{max-width:none;line-height:1.5}.calendar-eyebrow{font-size:12px;line-height:1.6;letter-spacing:.6px}
  .calendar-controls button{width:40px;height:40px}.calendar-day{font-size:14px;height:44px}
  .calendar-bottom{flex-wrap:wrap;font-size:12px;line-height:1.6}
  .room-picker{margin-top:28px;padding-top:28px;min-width:0}
  .room-tools{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
  .room-tools label{width:100%;font-size:14px}#room-count{margin:0;padding:0}
  .room-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .room-card{border-radius:14px;min-width:0}.room-card-body{padding:18px}
  .room-amenities{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px}
  .room-amenities li{min-width:0;align-items:flex-start;overflow-wrap:anywhere}
  .room-meta span{min-width:0;max-width:100%;line-height:1.5}
  .room-select{min-height:56px;padding:14px;font-size:16px;min-width:0}
  .booking-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
  .booking-actions .button,.booking-result .button{min-height:56px;justify-content:space-between;font-size:16px;text-align:left;gap:16px;line-height:1.5}
  .booking-direct{font-size:14px;line-height:1.7;justify-self:start}
  .booking-summary{padding:16px;border-radius:12px;overflow-wrap:anywhere}
  .booking-note,.field-hint{font-size:13px}.booking-number{margin-left:0;margin-right:0}
  .room-show-all{width:100%;line-height:1.5}
  .refined-contacts{grid-template-columns:minmax(0,1fr);gap:28px}
  .refined-contacts .contact-details{padding:var(--mobile-card-padding);border-radius:14px}
  .contact-card-heading{gap:12px}.contacts-label{font-size:12px;letter-spacing:1px}.contact-card-mark{flex-shrink:0}
  .refined-contacts .contact-phone{font-size:clamp(20px,6vw,28px);letter-spacing:-.03em;max-width:100%}
  .contact-card-bottom{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  .contact-card-bottom a{justify-content:space-between;min-height:44px;font-size:14px}
  .contacts-map-heading{padding:var(--mobile-card-padding)}
  .refined-contacts .contacts-map{border-radius:14px}.contacts-map-frame{height:340px}
  .footer-main{grid-template-columns:minmax(0,1fr);gap:28px}
  .footer-brand-block,.footer-contact{grid-column:auto;min-width:0}
  .footer-book{width:100%;min-height:52px;justify-content:space-between;font-size:16px}
  .footer-nav a{min-height:40px;display:flex;align-items:center}
  .footer-contact{padding:var(--mobile-card-padding);border-radius:14px}
  .footer-contact .footer-phone{font-size:clamp(20px,6vw,26px)}
  .footer-bottom{gap:16px;line-height:1.6}
  dialog{width:calc(100vw - 24px);max-width:none;padding:12px}
  dialog img{max-width:100%;width:100%}.dialog-bar{flex-wrap:wrap;gap:12px}
  .dialog-controls{width:100%;justify-content:space-between}.dialog-controls button{min-height:44px;min-width:44px}
}
@media(max-width:360px){
  .header{justify-content:center}.header nav{width:100%;justify-content:center}
  .room-amenities,.gallery{grid-template-columns:minmax(0,1fr)}
  .gallery button:first-child{grid-column:auto}.gallery img{height:250px}
  .contact-card-heading{align-items:flex-start}
}
