/*
 * Mobile scroll performance layer — v2
 * Natural touch scrolling, low-paint surfaces and stable section rendering.
 * Loaded after every other stylesheet.
 */
:root{
  --mobile-menu-duration:190ms;
  --mobile-header-height:var(--header-h,88px);
}

.nav-toggle,
.mobile-menu a,
.sticky-mobile a,
button,
.btn{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

@media (max-width:860px){
  html{
    scroll-behavior:auto!important;
    overscroll-behavior-y:auto!important;
    -webkit-text-size-adjust:100%;
  }

  body{
    overscroll-behavior-y:auto!important;
    background:#f4fbfc!important;
    background-image:linear-gradient(180deg,#fbfdfd 0%,#f3f9fa 48%,#f8faf9 100%)!important;
    text-rendering:auto!important;
  }

  /* Keep every section in the normal layout. Deferred section painting caused
     visible jumps and a disconnected feeling on long mobile pages. */
  main,
  main > *,
  main section,
  main article,
  footer,
  .service-card,
  .product-card,
  .faq-item,
  .related-card,
  .step-card,
  .contact-card,
  .policy-article,
  .policy-summary-card,
  .ecosystem-panel,
  .ecosystem-brand-card{
    content-visibility:visible!important;
    contain-intrinsic-size:none!important;
  }

  header{
    background:#f9fcfc!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:0 3px 12px rgba(22,56,68,.06)!important;
  }

  .nav{
    position:relative;
    flex-wrap:nowrap!important;
    min-height:var(--mobile-header-height);
    padding:11px 0!important;
  }

  .nav-cta{margin-left:auto!important}

  .nav-toggle{
    display:inline-flex!important;
    position:relative;
    z-index:3;
    width:50px;
    height:50px;
    border-radius:15px;
    box-shadow:0 3px 12px rgba(22,56,68,.08)!important;
    transform:none;
  }

  .nav-toggle:active{transform:scale(.97)}

  .nav-toggle .bar{
    transform-origin:center;
    transition:transform .16s ease,opacity .12s ease!important;
  }

  /* Menu animates only transform and opacity and never participates in page layout. */
  .mobile-menu{
    position:fixed!important;
    z-index:1100!important;
    top:var(--mobile-header-height)!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    height:calc(100vh - var(--mobile-header-height))!important;
    height:calc(100dvh - var(--mobile-header-height))!important;
    padding:10px 12px max(18px,env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
    background:rgba(7,31,40,.24)!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-5px);
    transition:opacity .14s ease,transform var(--mobile-menu-duration) cubic-bezier(.2,.75,.25,1),visibility 0s linear var(--mobile-menu-duration)!important;
    overscroll-behavior:contain;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  .mobile-menu.is-open{
    display:block!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
    transition-delay:0s!important;
    will-change:transform,opacity;
  }

  .mobile-menu-panel{
    width:min(100%,760px)!important;
    max-height:calc(100vh - var(--mobile-header-height) - 24px)!important;
    max-height:calc(100dvh - var(--mobile-header-height) - 24px)!important;
    margin:0 auto!important;
    padding:14px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border-radius:22px!important;
    background:#fff!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:0 10px 28px rgba(7,31,40,.16)!important;
    opacity:0;
    transform:translateY(-9px);
    transform-origin:top center;
    transition:opacity .14s ease,transform var(--mobile-menu-duration) cubic-bezier(.2,.75,.25,1)!important;
  }

  .mobile-menu.is-open .mobile-menu-panel{
    opacity:1;
    transform:translateY(0);
    will-change:transform,opacity;
  }

  .mobile-menu-links{gap:7px!important}
  .mobile-menu-links a{
    min-height:48px!important;
    padding:0 15px!important;
    border-radius:14px!important;
    box-shadow:none!important;
    transition:background-color .12s ease,transform .12s ease!important;
  }
  .mobile-menu-links a:active{background:#dff1f4!important;transform:scale(.99)}

  body.menu-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
    touch-action:none;
  }
  body.menu-open .mobile-menu,
  body.menu-open .mobile-menu-panel{touch-action:pan-y}

  /* Remove costly mobile paint effects. The visual hierarchy is preserved
     with borders and very shallow shadows. */
  .shell,
  .float-card,
  .feature-card,
  .premium-card,
  .gallery-card,
  .spec-card,
  .audience-card,
  .faq-item,
  .cta-box,
  .seo-card,
  .contact-card,
  .comparison-card,
  .detail-point,
  .article-card,
  .side-card,
  .side-panel,
  .step-card,
  .related-card,
  .insight-card,
  .ecosystem-panel,
  .ecosystem-brand-card,
  .policy-article,
  .policy-summary-card,
  .policy-lead,
  .policy-nav,
  .product-gallery-badge,
  .product-gallery-zoom,
  .consent-banner,
  .consent-modal__backdrop,
  .product-lightbox__backdrop{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  .shell,
  .float-card,
  .feature-card,
  .premium-card,
  .gallery-card,
  .spec-card,
  .audience-card,
  .faq-item,
  .cta-box,
  .seo-card,
  .contact-card,
  .comparison-card,
  .trust-card,
  .service-card,
  .product-card,
  .product-showcase-card,
  .detail-point,
  .article-card,
  .side-card,
  .side-panel,
  .step-card,
  .related-card,
  .insight-card,
  .ecosystem-panel,
  .ecosystem-brand-card,
  .policy-article,
  .policy-summary-card,
  .policy-lead,
  .policy-nav{
    box-shadow:0 3px 12px rgba(22,56,68,.055)!important;
  }

  img,
  .service-card img,
  .product-card img,
  .gallery-card img,
  .detail-media img,
  .hero-media img,
  #hizmetler .services-grid-8 .service-card img,
  #services .services-grid-8 .service-card img{
    filter:none!important;
  }

  .sticky-mobile{
    background:#fff!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:0 5px 18px rgba(22,56,68,.12)!important;
  }

  .consent-banner{
    background:#0a2731!important;
    box-shadow:0 8px 26px rgba(0,0,0,.22)!important;
  }
  .consent-modal__backdrop{background:rgba(4,22,29,.76)!important}

  .policy-nav,
  .side-card,
  .side-panel{position:static!important}

  .megamist-ecosystem{
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  .ecosystem-panel::before,
  .ecosystem-panel::after,
  .hero::before,
  .hero::after,
  .detail-hero::before,
  .detail-hero::after,
  .error-page::before,
  .error-page::after{
    display:none!important;
  }

  /* Persistent transitions and promoted layers consume memory while scrolling. */
  main *,
  footer *{
    will-change:auto!important;
  }
}

@media (max-width:620px){
  .mobile-menu{padding-inline:10px!important}
  .mobile-menu-panel{padding:12px!important;border-radius:19px!important}
  .mobile-menu-links a{min-height:46px!important}
}

@media (hover:none), (pointer:coarse){
  main .btn,
  main .service-card,
  main .feature-card,
  main .product-card,
  main .product-showcase-card,
  main .gallery-card,
  main .faq-item,
  main .contact-card,
  main .related-card,
  main .step-card,
  main .detail-point,
  main .ecosystem-link,
  footer a{
    transition:none!important;
  }

  .btn:hover,
  .service-card:hover,
  .feature-card:hover,
  .product-card:hover,
  .product-showcase-card:hover,
  .gallery-card:hover,
  .faq-item:hover,
  .contact-card:hover,
  .related-card:hover,
  .step-card:hover,
  .detail-point:hover,
  .ecosystem-link:hover{
    transform:none!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu,
  .mobile-menu-panel,
  .nav-toggle .bar{transition-duration:.01ms!important}
}
