/*
 * MXonnowell v0.1.62 — Mobil / Tablet Ayrı Uyum + Public Video Sürekli Döngü + Menü Görsel İyileştirme
 * Cihaz sözleşmesi: mobil <=767, tablet 768-1279, içerik masaüstü >=1280.
 * Navigasyon güvenliği: yoğun ana menü nedeniyle drawer 1480px'e kadar korunur.
 */
:root{
  --mx62-ink:#142c25;
  --mx62-muted:#65766f;
  --mx62-line:#dce8e2;
  --mx62-soft:#f5f9f7;
  --mx62-blue:#0a5f9f;
  --mx62-blue-deep:#063e69;
  --mx62-green:#087a3e;
  --mx62-green-soft:#edf7f1;
  --mx62-nav-top:var(--mx61-nav-top,68px);
}

/* ========== PUBLIC VIDEO: görünürlük JS hazır sınıfına bağlı değildir ========== */
html body .mxon50-video-hero,
html body .mxon50-template-video,
html body .mxon50-inline-video,
html body .mxon62-public-video-shell{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  background:#052d54!important;
}
html body .mxon50-video-hero video,
html body .mxon50-template-video>video,
html body .mxon50-inline-video>video,
html body .mxon62-public-video-shell video,
html body video.mx-public-loop-video-v0162{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  filter:none!important;
  background:#052d54!important;
}
html body .mxon50-video-hero__frame{display:block!important;visibility:visible!important;opacity:1!important;background:#052d54!important}

/* Public video üzerinde authored text/ikon yok; video tek görsel katmandır. */
.mxon62-public-video-shell::before,.mxon62-public-video-shell::after{content:none!important;display:none!important}
.mx-public-loop-video-v0162{width:100%;height:100%;object-fit:cover;object-position:center center}

/* Ara tanıtım videoları da otomatik döngü alanıdır. */
.mxon62-public-video-shell--inline{overflow:hidden;border-radius:18px;box-shadow:0 16px 42px rgba(2,45,77,.13)}
.mxon62-public-video-shell--inline video{width:100%!important;height:auto!important;aspect-ratio:16/9!important;object-fit:cover!important}

/* ========== MENÜ: ortak kurumsal iskelet ========== */
@media (max-width:1480px){
  html body .mx-header-v0148 .mx-site-menu-toggle{
    min-width:48px!important;
    min-height:46px!important;
    padding:0 14px!important;
    gap:9px!important;
    border:1px solid rgba(7,63,91,.14)!important;
    border-radius:14px!important;
    background:#fff!important;
    color:#143428!important;
    box-shadow:0 7px 22px rgba(3,39,66,.13)!important;
    text-shadow:none!important;
  }
  html body .mx-header-v0148 .mx-site-menu-toggle:hover{background:#f7faf8!important;border-color:#cbdcd3!important}
  html body .mx-header-v0148 .mx-site-menu-toggle .mx-menu-icon{width:21px!important;height:18px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important}
  html body .mx-header-v0148 .mx-site-menu-toggle .mx-menu-icon i{display:block!important;width:21px!important;height:2px!important;border-radius:3px!important;background:#173b2f!important}
  .mx-menu-toggle-copy-v0162{font-size:12.5px!important;line-height:1!important;font-weight:650!important;letter-spacing:.01em!important}

  html body .mx-mobile-menu-overlay-v0161{background:rgba(3,31,54,.52)!important}

  html body .mx-mobile-drawer-v0162{
    padding:0!important;
    gap:0!important;
    background:#fff!important;
    color:var(--mx62-ink)!important;
    border-left:1px solid var(--mx62-line)!important;
    box-shadow:-22px 0 58px rgba(2,34,61,.24)!important;
  }
  .mx-mobile-menu-head-v0162{
    position:sticky!important;
    top:0!important;
    z-index:8!important;
    min-height:76px!important;
    margin:0!important;
    padding:10px 14px!important;
    gap:10px!important;
    background:#fff!important;
    border-bottom:1px solid var(--mx62-line)!important;
    box-shadow:0 5px 16px rgba(2,44,74,.05)!important;
  }
  .mx-mobile-menu-head-v0162::before{
    content:"";
    position:absolute;
    left:0;top:0;right:0;
    height:3px;
    background:var(--mx62-blue);
  }
  .mx-mobile-menu-brand-v0162{
    min-width:0;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    color:var(--mx62-ink)!important;
    text-decoration:none!important;
  }
  .mx-mobile-menu-brand-v0162 img,
  .mx-mobile-menu-emblem-v0162{
    width:42px!important;height:42px!important;min-width:42px!important;
    object-fit:contain!important;
    border-radius:11px!important;
    background:#fff!important;
    border:1px solid #e1ebe6!important;
  }
  .mx-mobile-menu-emblem-v0162{display:grid!important;place-items:center!important;font-size:20px!important;font-weight:750!important;color:var(--mx62-blue)!important}
  .mx-mobile-menu-brand-v0162>span:last-child{display:flex!important;min-width:0!important;flex-direction:column!important;gap:3px!important}
  .mx-mobile-menu-brand-v0162 strong{font-size:13.5px!important;line-height:1.1!important;font-weight:720!important;letter-spacing:.025em!important;color:#12362a!important}
  .mx-mobile-menu-brand-v0162 small{font-size:10.5px!important;line-height:1.15!important;font-weight:520!important;color:var(--mx62-muted)!important}

  .mx-site-menu-close-v0162{
    width:44px!important;height:44px!important;min-width:44px!important;
    border:1px solid var(--mx62-line)!important;
    border-radius:13px!important;
    background:var(--mx62-soft)!important;
    color:#203a31!important;
    font-size:28px!important;
  }
  .mx-site-menu-close-v0162:hover{background:#edf4f0!important}

  .mx-mobile-menu-body-v0162{
    display:flex!important;
    flex-direction:column!important;
    gap:14px!important;
    padding:16px 14px calc(26px + env(safe-area-inset-bottom))!important;
  }
  .mx-mobile-menu-section-v0162{display:block!important;width:100%!important}
  .mx-mobile-menu-label-v0162{
    display:block!important;
    margin:0 4px 8px!important;
    color:#71827b!important;
    font-size:10.5px!important;
    line-height:1!important;
    font-weight:720!important;
    letter-spacing:.095em!important;
    text-transform:uppercase!important;
  }

  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148{gap:4px!important}
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a{
    position:relative!important;
    min-height:50px!important;
    padding:0 38px 0 13px!important;
    border:1px solid transparent!important;
    border-radius:12px!important;
    color:#1f3a31!important;
    font-size:13.5px!important;
    font-weight:560!important;
    transition:background .15s ease,border-color .15s ease,color .15s ease!important;
  }
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a::after{
    content:"›"!important;
    display:block!important;
    position:absolute!important;
    right:13px!important;
    top:50%!important;
    transform:translateY(-51%)!important;
    width:auto!important;height:auto!important;
    color:#91a29a!important;
    background:none!important;
    font:400 22px/1 Arial,sans-serif!important;
  }
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a:hover{background:var(--mx62-soft)!important;border-color:#e3ece7!important;color:#123d2e!important}
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a.is-current{
    background:var(--mx62-green-soft)!important;
    border-color:#cfe6d8!important;
    color:#075e31!important;
    font-weight:650!important;
    box-shadow:inset 3px 0 0 var(--mx62-green)!important;
  }
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a.is-current::after{color:var(--mx62-green)!important}

  html body .mx-mobile-drawer-v0162 .mx-nav-utility-v0148{
    margin:0!important;
    padding:0!important;
    border:0!important;
    gap:8px!important;
  }
  html body .mx-mobile-drawer-v0162 .mx-nav-utility-v0148 a{
    min-height:48px!important;
    padding:0 9px!important;
    border:1px solid var(--mx62-line)!important;
    border-radius:11px!important;
    background:#f8fbf9!important;
    color:#355148!important;
    font-size:11.5px!important;
    font-weight:580!important;
  }
  html body .mx-mobile-drawer-v0162 .mx-nav-utility-v0148 a:hover,
  html body .mx-mobile-drawer-v0162 .mx-nav-utility-v0148 a.is-current{background:#eef6f2!important;border-color:#cfe1d8!important;color:#075e31!important}

  html body .mx-mobile-drawer-v0162 .mx-mobile-login-v0162{
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:center!important;
    justify-items:start!important;
    min-height:62px!important;
    margin:2px 0 0!important;
    padding:10px 15px!important;
    border:1px solid var(--mx62-green)!important;
    border-radius:13px!important;
    background:var(--mx62-green)!important;
    color:#fff!important;
    box-shadow:0 10px 24px rgba(8,122,62,.18)!important;
  }
  .mx-mobile-login-v0162 span{font-size:13.5px!important;font-weight:680!important;line-height:1.15!important}
  .mx-mobile-login-v0162 small{margin-top:3px!important;font-size:10.5px!important;font-weight:470!important;line-height:1.2!important;color:rgba(255,255,255,.82)!important}

  .mx-mobile-menu-foot-v0162{
    display:flex!important;
    flex-direction:column!important;
    gap:3px!important;
    padding:13px 14px!important;
    border:1px solid #e2ece7!important;
    border-radius:12px!important;
    background:#f8fbf9!important;
  }
  .mx-mobile-menu-foot-v0162 strong{font-size:11.5px!important;font-weight:680!important;color:#244139!important}
  .mx-mobile-menu-foot-v0162 span{font-size:10.5px!important;color:#60756c!important}
  .mx-mobile-menu-foot-v0162 small{font-size:9.5px!important;line-height:1.35!important;color:#84958d!important}
}

/* ========== MOBİL <= 767: tek elle kullanım, tam genişlik menü, güçlü video görünürlüğü ========== */
@media (max-width:767px){
  :root{--mx62-nav-top:var(--mx61-nav-top,60px)}
  html body .mx-header-v0148 .mx-site-menu-toggle{
    width:46px!important;min-width:46px!important;height:46px!important;min-height:46px!important;
    padding:0!important;border-radius:13px!important;justify-content:center!important;
  }
  .mx-menu-toggle-copy-v0162{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}

  html body .mx-mobile-drawer-v0162{
    left:0!important;right:0!important;
    width:100vw!important;max-width:100vw!important;
    border-left:0!important;
    box-shadow:none!important;
  }
  .mx-mobile-menu-head-v0162{min-height:72px!important;padding-left:13px!important;padding-right:13px!important}
  .mx-mobile-menu-body-v0162{padding:14px 13px calc(28px + env(safe-area-inset-bottom))!important;gap:13px!important}
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a{min-height:51px!important;font-size:14px!important;padding-left:13px!important}
  html body .mx-mobile-drawer-v0162 .mx-nav-utility-v0148{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Public hero: mobilde video kesin görünür. Dikey eş varsa alanı daha doğal kullanır. */
  html body .mxon50-video-hero,
  html body .mxon50-template-video{
    width:100%!important;
    height:calc(100svh - 60px)!important;
    min-height:520px!important;
    max-height:820px!important;
    overflow:hidden!important;
  }
  html body .mxon50-video-hero__frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:100%!important;aspect-ratio:auto!important}
  html body .mxon50-video-hero video,
  html body .mxon50-template-video>video{
    width:100%!important;height:100%!important;min-height:100%!important;max-height:none!important;
    aspect-ratio:auto!important;object-fit:cover!important;object-position:center center!important;
  }
  @supports(height:100dvh){html body .mxon50-video-hero,html body .mxon50-template-video{height:calc(100dvh - 60px)!important}}

  /* Ara video mobilde kaybolmaz; dikey kaynak varsa kompakt 4:5 vitrin, yoksa 16:9. */
  html body .mxon62-public-video-shell--inline{margin:22px 0!important;border-radius:14px!important}
  html body .mxon62-public-video-shell--inline video{width:100%!important;height:auto!important;aspect-ratio:16/9!important;object-fit:cover!important}
  html body .mxon62-public-video-shell--inline video.mx-public-loop-video-v0162--portrait{aspect-ratio:4/5!important;max-height:72svh!important;object-fit:cover!important}

  /* Video kütüphanesi: kartlar mobilde tek kolon ve video alanı görünür. */
  html body .mx-video-library-grid{grid-template-columns:1fr!important;gap:14px!important}
  html body .mx-video-library-card__media video{display:block!important;visibility:visible!important;opacity:1!important;width:100%!important}
}

/* ========== TABLET 768-1279: mobil kurallar sızmaz, yön bağımsız kontrollü geometri ========== */
@media (min-width:768px) and (max-width:1279px){
  html body .mx-mobile-drawer-v0162{
    width:min(440px,56vw)!important;
    max-width:56vw!important;
    border-radius:0 0 0 18px!important;
  }
  .mx-mobile-menu-head-v0162{min-height:78px!important;padding:11px 16px!important}
  .mx-mobile-menu-body-v0162{padding:17px 16px calc(28px + env(safe-area-inset-bottom))!important;gap:15px!important}
  html body .mx-mobile-drawer-v0162 .mx-nav-list-v0148>li>a{min-height:50px!important;font-size:13.5px!important}

  html body .mxon50-video-hero,
  html body .mxon50-template-video{
    position:relative!important;
    width:100%!important;
    height:min(68svh,720px)!important;
    min-height:440px!important;
    max-height:720px!important;
    overflow:hidden!important;
  }
  html body .mxon50-video-hero__frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:100%!important;aspect-ratio:auto!important}
  html body .mxon50-video-hero video,
  html body .mxon50-template-video>video{width:100%!important;height:100%!important;min-height:100%!important;aspect-ratio:auto!important;object-fit:cover!important}

  html body .mxon62-public-video-shell--inline{margin:28px 0!important;border-radius:16px!important}
  html body .mxon62-public-video-shell--inline video{aspect-ratio:16/9!important;object-fit:cover!important}
  html body .mxon62-public-video-shell--inline video.mx-public-loop-video-v0162--portrait{aspect-ratio:4/5!important;max-height:660px!important;width:min(100%,540px)!important;margin-inline:auto!important}
}

/* Tablet yatayda çekmece biraz daha kontrollü, video daha sinematik. */
@media (min-width:1024px) and (max-width:1279px) and (orientation:landscape){
  html body .mx-mobile-drawer-v0162{width:420px!important;max-width:420px!important}
  html body .mxon50-video-hero,html body .mxon50-template-video{height:min(72svh,700px)!important;min-height:460px!important}
}

/* 1280-1480: içerik masaüstüdür; yalnız yoğun navigasyon güvenli drawer olarak kalır. */
@media (min-width:1280px) and (max-width:1480px){
  html body .mx-mobile-drawer-v0162{width:430px!important;max-width:430px!important}
}

@media (prefers-reduced-motion:reduce){
  /* Kullanıcı erişilebilirlik tercihi animasyonu kaldırır; video görünürlüğü kaybolmaz. */
  .mx-mobile-drawer-v0162,.mx-mobile-menu-overlay-v0161{transition:none!important}
}
