/* Shared viewport fixes, loaded after page styles. Desktop layout stays intact. */
@media(max-width:1050px) and (min-width:761px){
 .header .menu-toggle{display:block}
 .header .nav{display:none;position:absolute;top:106px;left:0;right:0;max-width:100%;padding:25px 7%;background:#151b16fa;z-index:30;flex-direction:column;align-items:stretch;gap:22px}
 .header .nav.open{display:flex}
 .header.is-scrolled .nav{top:88px}
 .header .nav-services{width:100%;flex-wrap:wrap;justify-content:space-between}
 .header .nav .services-submenu{position:static;width:100%;min-width:0;margin:4px 0 8px;box-shadow:none}
 .header .services-submenu a{white-space:normal}
 .contactbar .contacts .email,.contactbar .contacts .address{display:none}
}
@media(max-width:760px){
 main,main>section,main>div,.site-footer{min-width:0;max-width:100%}
 main img,main video,main iframe{max-width:100%}
 .hero .content{width:calc(100% - 40px);min-width:0;margin:0 auto}
 .hero h1{font-size:clamp(36px,10.5vw,52px);line-height:1.12;letter-spacing:-.9px;overflow-wrap:break-word}
 .hero .eyebrow{font-size:10px;line-height:1.6;letter-spacing:.5px;gap:9px}
 .hero .eyebrow:before{width:22px;flex-shrink:0}
 .hero .description{font-size:15px;line-height:1.8}
 .hero .actions{display:flex;flex-wrap:wrap;gap:12px}
 .hero .actions .cta{flex:1 1 145px;min-width:0;max-width:100%;padding:0 16px;font-size:12px;gap:10px}
 .hero-slider-controls{width:fit-content;max-width:100%;flex-wrap:wrap;gap:6px}
 .hero-slider-arrow,.hero-slider-pause{width:32px;height:32px;flex-shrink:0}
 .hero-slider-dots{gap:6px;margin:0}
 .hero-slider-dot{width:17px}
 .hero-slider-count{font-size:10px;letter-spacing:1px;margin:0}
 .benefits-strip .features{margin:0 20px;min-width:0;grid-template-columns:minmax(0,1fr)}
 .benefits-strip .feature>div{min-width:0}
 .feature-icon{flex-shrink:0}
 .experience-layout,.services-inner,.gallery-inner,.journey-inner,.reviews-inner,.contact-content,.footer-inner{min-width:0}
 .experience-layout>*,.journey-inner>*,.footer-main>*,.guide-article-layout>*,.catalog-grid>*,.gallery-page-grid>*{min-width:0}
 .experience-footer,.reviews-footer,.gallery-footer,.footer-bottom{flex-wrap:wrap;gap:16px}
 .experience-title,.journey-title,.contact-heading,.about-hero h1,.detail-hero h1,.catalog-intro h1,.gallery-page-intro h1,.guide-intro h1,.guide-article-hero h1{overflow-wrap:break-word;max-width:100%}
 .contact-actions .contact-button{min-width:0;max-width:100%;flex:1 1 220px;gap:12px}
 .contact-info{grid-template-columns:minmax(0,1fr)}
 .contact-info .contact-detail:last-child{grid-column:auto}
 .about-place{flex-wrap:wrap;max-width:100%;gap:12px}
 .about-space-list a{grid-template-columns:25px minmax(0,1fr) 25px}
 .detail-info div{min-width:0;gap:12px}
 .detail-info strong,.detail-info a{overflow-wrap:anywhere}
 .detail-booking .booking-actions{min-width:0;flex-wrap:wrap}
 .detail-booking .cta,.about-closing .cta{max-width:100%;min-width:0;width:fit-content;white-space:normal}
 .gallery-page-toolbar{flex-wrap:wrap;min-width:0}
 .gallery-page-filters{min-width:0;max-width:100%}
 .gallery-page-total{max-width:100%}
 .guide-copy,.guide-copy p,.guide-copy li{overflow-wrap:anywhere}
 .footer-bottom>span{min-width:0;overflow-wrap:break-word}
 .footer-top{flex-shrink:0}
 .footer-main{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:360px){
 .hero .content{width:calc(100% - 36px)}
 .hero h1{font-size:36px}
 .hero .actions .cta{flex-basis:100%}
 .experience-footer{align-items:flex-start;flex-direction:column}
 .journey-step{grid-template-columns:40px minmax(0,1fr);gap:16px}
 .journey-track{left:20px}
 .footer-main{grid-template-columns:minmax(0,1fr)}
 .contactbar .social{gap:14px;padding-left:14px}
}

/* Frame mobile hero photographs independently from the benefits below. */
@media(max-width:760px){
 .hero{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;min-height:0}
 .hero>.header-slot{grid-column:1;grid-row:1}
 .hero>.content{grid-column:1;grid-row:2;min-height:440px;padding-top:28px;padding-bottom:30px}
 .hero>.benefits-strip{grid-column:1;grid-row:3;margin-top:0}
 .hero>.hero-slides,.hero>.hero-shade{grid-column:1;grid-row:1 / 3;inset:0}
 .hero .hero-slide{object-fit:cover;object-position:50% 50%}
 .hero .hero-slide:nth-child(1){object-position:76% 56%}
 .hero .hero-slide:nth-child(2){object-position:48% 50%}
 .hero .hero-slide:nth-child(3){object-position:54% 50%}
 .hero .hero-slide:nth-child(4){object-position:58% 50%}
 .hero>.hero-shade{background:linear-gradient(90deg,#0d120fc9 0%,#0d120f85 55%,#0d120f38 100%),linear-gradient(0deg,#0d120f8a,transparent 65%)}
}
@media(max-width:360px){.hero>.content{min-height:450px}}

/* Small-screen menu and touch controls. */
@media(max-width:1050px){
 .header .menu-toggle{min-width:44px;min-height:44px;padding:8px;display:grid;place-items:center;flex-shrink:0}
 .header .nav{max-height:calc(100dvh - 106px);overflow-y:auto;overscroll-behavior:contain}
 .header .nav>a,.header .nav-services>a{min-height:44px;display:flex;align-items:center}
 .header .services-toggle{min-width:44px;min-height:44px}
}
@media(max-width:760px){
 .hero-slider-controls{display:grid;width:min(100%,300px);grid-template-columns:44px minmax(0,1fr) 44px 44px;gap:4px 8px;align-items:center}
 .hero-slider-prev{grid-column:1;grid-row:1}
 .hero-slider-count{grid-column:2;grid-row:1;justify-self:center}
 .hero-slider-next{grid-column:3;grid-row:1}
 .hero-slider-pause{grid-column:4;grid-row:1}
 .hero-slider-arrow,.hero-slider-pause{width:44px;height:44px}
 .hero-slider-dots{grid-column:1/-1;grid-row:2;justify-content:center;gap:4px;margin:0}
 .hero-slider-dot{width:44px;height:44px;display:grid;place-items:center}
 .hero-slider-dot:after{width:20px}
}


/* Comfortable mobile phone and WhatsApp contact tabs. */
@media(max-width:760px){
 :root{--mobile-contact-height:54px;--mobile-contact-gap:10px;--mobile-contact-bottom:22px}
 .floating{gap:var(--mobile-contact-gap);bottom:calc(var(--mobile-contact-bottom) + env(safe-area-inset-bottom,0px))}
 .floating :is(button,a){width:52px;height:var(--mobile-contact-height);border-radius:8px 0 0 8px}
 /* Keep the footer's final row above both fixed tabs at the end of the page. */
 .site-footer{padding-bottom:calc(var(--mobile-contact-height) + var(--mobile-contact-height) + var(--mobile-contact-gap) + var(--mobile-contact-bottom) + 20px + env(safe-area-inset-bottom,0px))}
 .floating .call-icon,.floating .whatsapp-icon{width:52px;min-width:52px}
 .floating svg{width:26px;height:26px}
}
/* Mobile header spacing trial - 15 October 2026. */
@media(max-width:760px){
 .contactbar{height:48px}
 .contactbar .contact-inner{width:calc(100% - 40px);gap:12px;min-width:0}
 .contactbar .contacts{min-width:0;font-size:13px;gap:0}
 .contactbar .contacts .contact-item.address,.contactbar .contacts .contact-item.email{display:none}
 .contactbar .contacts .contact-item{min-height:44px;gap:8px;white-space:nowrap}
 .contactbar .contacts .contact-item svg{width:16px;height:16px}
 .contactbar .social{gap:4px;padding:0 0 0 12px;flex-shrink:0}
 .contactbar .social .iconbutton{width:36px;height:44px;min-width:36px}
 .header .nav-inner{width:calc(100% - 40px);gap:20px}
 .header .brand{flex-shrink:0}
 .header .brand-logo{height:66px;max-width:140px}
 .header.is-scrolled .brand-logo{height:62px}
 .hero>.content{padding-top:40px;padding-bottom:36px}
 .hero .eyebrow{line-height:1.7}
 .hero h1{margin-top:26px;margin-bottom:24px;line-height:1.16}
 .hero .description{line-height:1.85;max-width:34ch}
 .hero .actions{margin-top:28px;gap:12px}
 .hero-slider-controls{margin-top:26px}
}