/* Keep the initially chosen layout usable after resizing. Never navigate or
   replace the form when the screen crosses a breakpoint. Approved normal-size
   mobile and desktop rules remain in their original stylesheets. */
@media(max-width:1023px){
 body.desktop-family .container{width:calc(100% - 32px);min-width:0}
 body.desktop-family .desktop-contact-strip .container{flex-wrap:wrap;justify-content:flex-start;gap:6px 16px;padding-block:8px}
 body.desktop-family .desktop-contact-strip span:first-child{width:100%;white-space:normal}
 body.desktop-family .desktop-header{height:auto;min-height:72px;flex-wrap:wrap;gap:14px;padding-block:14px}
 body.desktop-family .desktop-header nav{order:3;width:100%;margin:0;flex-wrap:wrap;gap:12px 18px;font-size:13px}
 body.desktop-family .desktop-header>.family-button{margin-left:auto}
 body.desktop-family .desktop-quick-pages{display:flex;flex-wrap:wrap;gap:10px}
 body.desktop-family .desktop-hero{height:auto;min-height:380px}
 body.desktop-family .hero-inner{padding-block:30px;min-height:380px}
 body.desktop-family .hero-pool{width:100%;opacity:.62}
 body.desktop-family .desktop-hero:after{background:linear-gradient(90deg,#f5fcfff2,#f5fcff45)}
 body.desktop-family .desktop-hero-copy{position:relative;z-index:1;max-width:100%;min-width:0}
 body.desktop-family .desktop-hero-copy h1{font-size:clamp(30px,6vw,43px);white-space:pre-line;overflow-wrap:anywhere}
 body.desktop-family .desktop-hero-copy p{max-width:32em;overflow-wrap:anywhere}
 body.desktop-family .hero-note,body.desktop-family .hero-ribbon{display:none}
 body.desktop-family .hero-actions{flex-wrap:wrap}
 body.desktop-family #trip-dates form.desktop-booking{grid-template-columns:repeat(2,minmax(0,1fr));padding:18px;gap:14px;min-width:0}
 body.desktop-family #trip-dates form.desktop-booking>.guest-party,body.desktop-family #trip-dates form.desktop-booking>.booking-trigger{grid-column:1/-1}
 body.desktop-family .party-extras{flex-wrap:wrap}
 body.desktop-family .quick-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.desktop-family .desktop-rooms,body.desktop-family .about-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.desktop-family .compact-heading{flex-wrap:wrap;gap:10px}
 body.desktop-family .compact-heading>a{margin-left:0;white-space:normal}
 body.desktop-family .desktop-about .compact-heading{padding-inline:0}
 body.desktop-family .desktop-about:before,body.desktop-family .desktop-about:after{display:none}
 body.desktop-family .cafe-section,body.desktop-family .territory-layout,body.desktop-family .desktop-arrival-layout,body.desktop-family .desktop-human-contact{grid-template-columns:minmax(0,1fr)}
 body.desktop-family .desktop-reviews,body.desktop-family .azov-selected-review-grid{grid-template-columns:minmax(0,1fr)}
 body.desktop-family .desktop-question-grid,body.desktop-family .trip-highlights{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.desktop-family .territory-description{min-width:0}
 body.desktop-family .service-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 body.desktop-family .service-strip>div{min-width:0;overflow-wrap:anywhere}
 body.desktop-family .desktop-booking-section>.container,body.desktop-family .desktop-footer,body.desktop-family .desktop-legal{flex-wrap:wrap;gap:20px}
 body.desktop-family .desktop-footer{align-items:flex-start}
 body.desktop-family .desktop-resource-links,body.desktop-family .desktop-quick-pages{overflow-wrap:anywhere}
 body.desktop-family main,body.desktop-family section,body.desktop-family aside{min-width:0}
}
@media(max-width:480px){
 body.desktop-family .desktop-rooms,body.desktop-family .about-benefits,body.desktop-family .desktop-question-grid,body.desktop-family .trip-highlights{grid-template-columns:minmax(0,1fr)}
 body.desktop-family .desktop-header>.family-button{margin-left:0}
 body.desktop-family .desktop-brand strong{font-size:30px}
 body.desktop-family .quick-benefits .benefit{padding:10px;gap:8px}
 body.desktop-family .quick-benefits .benefit svg{width:22px;height:22px}
 body.desktop-family .quick-benefits .benefit h3{font-size:11px}
 body.desktop-family .cafe-panorama img{height:150px}
}
@media(min-width:1024px){
 body:not(.desktop-family) .hero-copy h1{font-size:clamp(60px,7vw,110px)}
}