/* BuharlıSoğutma.com — mobile scroll and menu performance layer — 2026-06-26 */
:root{--header-h:92px}
html{scroll-padding-top:calc(var(--header-h) + 24px)}
section[id],main[id],footer[id],div[id]{scroll-margin-top:calc(var(--header-h) + 24px)}

/* Prevent late section painting and height-estimation jumps. */
.service-card,.feature-card,.premium-card,.gallery-card,.contact-card,.faq-item,
.content-card,.side-card,.related-card,.reference-card,.comparison-card,.seo-card,
.product-card,.detail-media,img[loading="lazy"]{
  content-visibility:visible!important;
  contain:none!important;
  contain-intrinsic-size:auto!important;
}

.nav-toggle{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mobile-menu[hidden]{display:none!important}

@media(max-width:860px){
  html{scroll-behavior:auto!important;overscroll-behavior-y:auto!important}
  body:not(.menu-open):not(.consent-open){touch-action:pan-y;overscroll-behavior-y:auto}
  body{background:#fffaf5!important;text-rendering:auto}

  /* Fixed translucent layers repaint on every touch frame; use solid mobile surfaces. */
  header{
    background:#fffaf5!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:0 1px 0 rgba(199,102,46,.14)!important;
    transform:translateZ(0);
  }
  .shell,.hero-frame,.trust-card,.feature-card,.premium-card,.gallery-card,.spec-card,
  .audience-card,.faq-item,.cta-box,.seo-card,.contact-card,.comparison-card,
  .content-card,.side-card,.related-card,.reference-card,.product-card,
  .merchant-readiness-note,.ecosystem-shell,.ecosystem-card{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    filter:none!important;
    box-shadow:0 8px 22px rgba(44,34,26,.075)!important;
  }
  img,.detail-media img,.gallery-card img,.service-card img,.product-card img{
    filter:none!important;
  }
  .hero::before,.hero::after,.policy-hero--professional::after,.ecosystem-shell::before,
  .ecosystem-shell::after{filter:none!important}

  /* Menu remains outside document flow and animates only composited properties. */
  body.menu-open{overflow:hidden!important;touch-action:none!important}
  header .nav{position:relative}
  header .mobile-menu:not([hidden]){
    display:block!important;
    position:fixed!important;
    z-index:2140!important;
    top:var(--header-h)!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:auto!important;
    padding:10px 12px max(14px,env(safe-area-inset-bottom))!important;
    background:rgba(23,43,63,.22)!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .18s ease,visibility 0s linear .22s;
  }
  header .mobile-menu:not([hidden]).is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:opacity .18s ease;
  }
  header .mobile-menu-panel{
    width:min(100%,680px)!important;
    max-height:calc(100dvh - var(--header-h) - 24px)!important;
    margin:0 auto!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    border-radius:20px!important;
    background:#fff!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:0 18px 46px rgba(23,43,63,.20)!important;
    transform:translate3d(0,-10px,0);
    opacity:.96;
    transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .18s ease;
    will-change:transform,opacity;
  }
  header .mobile-menu.is-open .mobile-menu-panel{transform:translate3d(0,0,0);opacity:1}
  header .mobile-menu-links a{background:#fffaf5!important;transition:background-color .15s ease,color .15s ease!important}
  header .mobile-menu-links a:hover{transform:none!important}

  .consent-banner,.consent-modal__backdrop,.consent-modal__panel{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .consent-banner{box-shadow:0 14px 38px rgba(23,43,63,.20)!important}
  .consent-modal__panel{box-shadow:0 18px 52px rgba(23,43,63,.24)!important}

  .sticky-mobile{
    background:#fff!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:0 10px 28px rgba(23,43,63,.15)!important;
  }
}

@media(max-width:520px){
  .container{width:min(calc(100% - 22px),var(--max))}
  .section-space{padding:46px 0!important}
  .btn{transition:background-color .15s ease,border-color .15s ease!important}
  .btn:hover{transform:none!important}
}

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