/* Alpha 40 — Core Web Vitals and CLS stabilization. */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-display:swap}
img,svg,video,canvas{max-width:100%;height:auto}
img[width][height]{height:auto}
iframe{max-width:100%;border:0}

/* Reserve stable header and hero space before scripts/styles finish loading. */
:root{--mb-header-height:92px;--mb-mobile-header-height:72px}
.makkah-global-header,.mb30-global-header,.mbh-header{min-height:var(--mb-header-height)}
.mbh-hero,.makkah-home-hero,.mb-home-hero{min-height:clamp(620px,72vh,790px)}

/* Stable image geometry prevents cards from moving while images decode. */
.mbh-hotel-media,.mba-card-media,.mba-hotel-media,.mb14-card-media,.makkah-hotel-card__media,
.mbh-destination,.makkah-about-image,.makkah-contact-media{overflow:hidden;background:#eef2f5}
.mbh-hotel-media,.mba-card-media,.mba-hotel-media,.makkah-hotel-card__media{aspect-ratio:16/10}
.mbh-destination{aspect-ratio:16/9;height:auto!important}
.mbh-hotel-media img,.mba-card-media img,.mba-hotel-media img,.makkah-hotel-card__media img,
.mbh-destination img,.makkah-about-image img,.makkah-contact-media img{width:100%;height:100%;object-fit:cover;display:block}

/* Reserve space for maps and embeds. */
.makkah-map,.mbh-map,.mba-map,.makkah-contact-map,.contact-map-wrap{min-height:360px;aspect-ratio:16/7;background:#e9eff3;border-radius:18px;overflow:hidden}
.makkah-map iframe,.mbh-map iframe,.mba-map iframe,.makkah-contact-map iframe,.contact-map-wrap iframe{width:100%;height:100%;display:block}

/* Render below-the-fold sections only when needed without affecting layout size. */
@supports(content-visibility:auto){
 .mbh-section,.makkah-home-section,.makkah-about-section,.makkah-contact-section,.mba-results-wrap,.makkah-site-footer{
  content-visibility:auto;contain-intrinsic-size:auto 760px
 }
}

/* Avoid animated layout properties; transforms and opacity are compositor friendly. */
[data-reveal],.mb-reveal,.makkah-reveal{will-change:transform,opacity;backface-visibility:hidden}

/* Stable controls and touch targets. */
button,a,input,select,textarea{touch-action:manipulation}
.mba-wishlist,.mba-compare-check,.mb30-header-icon,.makkah-menu-toggle{min-width:42px;min-height:42px}

/* Archive skeleton keeps result height stable during AJAX updates. */
.mba-skeleton-card{min-height:430px;border-radius:16px;background:linear-gradient(90deg,#edf1f4 25%,#f7f9fa 37%,#edf1f4 63%);background-size:400% 100%;animation:mbPerfShimmer 1.25s ease-in-out infinite}
@keyframes mbPerfShimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}

@media(max-width:767px){
 :root{--mb-header-height:var(--mb-mobile-header-height)}
 .makkah-global-header,.mb30-global-header,.mbh-header{min-height:var(--mb-mobile-header-height)}
 .mbh-hero,.makkah-home-hero,.mb-home-hero{min-height:640px}
 .makkah-map,.mbh-map,.mba-map,.makkah-contact-map,.contact-map-wrap{min-height:300px;aspect-ratio:4/3}
 .mba-skeleton-card{min-height:390px}
}

@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
