/* Premium fotoğraf görüntüleyici — cx-lb.js (Kurumsal sayfa galerileri, albüm sayfaları). Koyu sinematik zemin, fotoğrafın renginden ortam ışığı. */
.cxlb { --lb-ac: var(--kv-g, var(--ax-navy, #1b5e24)); --lb-top: 74px; position: fixed; inset: 0; z-index: 2147483000; display: none; color: #fff; font-family: "Plus Jakarta Sans", system-ui, sans-serif; -webkit-tap-highlight-color: transparent; overscroll-behavior: contain; }
.cxlb.is-open { display: block; }
html.cxlb-lock { overflow: hidden; }
.cxlb__bg { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 40%, #121d16 0%, #050806 72%); opacity: 0; transition: opacity .35s ease; }
.cxlb.is-in .cxlb__bg { opacity: 1; }
.cxlb__amb { position: absolute; inset: -12%; opacity: 0; pointer-events: none; transition: opacity .7s ease; }
.cxlb__amb img { width: 100%; height: 100%; object-fit: cover; filter: blur(80px) saturate(1.6); transform: scale(1.15); }
.cxlb.is-in .cxlb__amb { opacity: .34; }

/* üst çubuk */
.cxlb__top { position: absolute; left: 0; right: 0; top: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 16px; height: var(--lb-top); padding: 0 20px; background: linear-gradient(180deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); transition: opacity .25s, transform .25s; }
.cxlb__ttl { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cxlb__ttl b { overflow: hidden; font-family: "Montserrat", "Plus Jakarta Sans", system-ui, sans-serif; font-size: 15px; font-weight: 700; letter-spacing: .01em; white-space: nowrap; text-overflow: ellipsis; }
.cxlb__ttl b:empty { display: none; }
.cxlb__cnt { flex: none; padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, .12); font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.cxlb__cnt:empty { display: none; }
.cxlb__acts { display: flex; flex: none; gap: 6px; }
.cxlb__b { display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; font-size: 15px; text-decoration: none; cursor: pointer; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: background .2s, transform .2s, opacity .2s; }
.cxlb__b:hover { background: rgba(255, 255, 255, .24); color: #fff; }
.cxlb__b:active { transform: scale(.92); }
.cxlb__b:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.cxlb__b[hidden] { display: none; }
.cxlb__x { margin-left: 6px; background: rgba(255, 255, 255, .18); }
.cxlb.is-play .cxlb__play { background: var(--lb-ac); }
.cxlb.is-single .cxlb__play, .cxlb.is-single .cxlb__nav, .cxlb.is-single .cxlb__strip { display: none; }

/* sahne */
.cxlb__stage { position: absolute; left: 0; right: 0; top: var(--lb-top); bottom: var(--lb-bot, 112px); z-index: 1; overflow: hidden; touch-action: none; }
.cxlb__wrap { position: absolute; transform-origin: 50% 50%; will-change: transform; }
.cxlb__img { display: block; width: 100%; height: 100%; border-radius: 10px; box-shadow: 0 40px 90px -20px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .06); transform-origin: 50% 50%; cursor: zoom-in; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }
.cxlb__img:not([src]) { visibility: hidden; }
.cxlb.is-zoom .cxlb__img { border-radius: 0; cursor: grab; }
.cxlb.is-pan .cxlb__img { cursor: grabbing; }
.cxlb__spin { position: absolute; left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; border: 3px solid rgba(255, 255, 255, .18); border-top-color: #fff; border-radius: 50%; opacity: 0; pointer-events: none; animation: cxlbSpin .8s linear infinite; transition: opacity .2s; }
.cxlb.is-load .cxlb__spin { opacity: 1; transition-delay: .35s; }
@keyframes cxlbSpin { to { transform: rotate(360deg); } }

/* oklar */
.cxlb__nav { position: absolute; top: calc(var(--lb-top) + (100% - var(--lb-top) - var(--lb-bot, 112px)) / 2); z-index: 2; width: 54px; height: 54px; margin-top: -27px; font-size: 18px; background: rgba(255, 255, 255, .1); }
.cxlb__nav--p { left: 22px; }
.cxlb__nav--n { right: 22px; }
.cxlb__nav:hover { background: var(--lb-ac); }

/* alt: açıklama + şerit */
.cxlb__bot { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 10px 20px 16px; background: linear-gradient(0deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)); transition: opacity .25s, transform .25s; }
.cxlb__cap { max-width: 860px; margin: 0 auto 12px; font-size: 14.5px; line-height: 1.55; text-align: center; color: rgba(255, 255, 255, .92); }
.cxlb__cap:empty { display: none; }
.cxlb__strip { display: flex; gap: 8px; overflow-x: auto; padding: 4px 3px; scrollbar-width: none; }
.cxlb__strip::-webkit-scrollbar { display: none; }
.cxlb__strip > :first-child { margin-left: auto; }
.cxlb__strip > :last-child { margin-right: auto; }
.cxlb__strip button { flex: none; width: 68px; height: 50px; padding: 0; overflow: hidden; border: 0; border-radius: 9px; background: rgba(255, 255, 255, .08); opacity: .45; cursor: pointer; outline: 2px solid transparent; outline-offset: 2px; transition: opacity .2s, outline-color .2s, transform .2s; }
.cxlb__strip button:hover { opacity: .85; }
.cxlb__strip button[aria-current="true"] { opacity: 1; outline-color: #fff; transform: translateY(-2px); }
.cxlb__strip button:focus-visible { outline-color: #fff; opacity: 1; }
.cxlb__strip img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* slayt gösterisi çubuğu, bildirim */
.cxlb__prog { position: absolute; left: 0; right: 0; top: 0; z-index: 4; height: 3px; pointer-events: none; }
.cxlb__prog i { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--lb-ac), #9be3a8); }
.cxlb__toast { position: absolute; left: 50%; bottom: calc(var(--lb-bot, 112px) + 16px); z-index: 5; padding: 10px 16px; border-radius: 999px; background: rgba(255, 255, 255, .95); color: #0f1f14; font-size: 13.5px; font-weight: 600; opacity: 0; pointer-events: none; transform: translate(-50%, 8px); transition: opacity .2s, transform .2s; }
.cxlb__toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* dokunarak arayüzü gizle/göster */
.cxlb.is-ui-off .cxlb__top { opacity: 0; transform: translateY(-10px); pointer-events: none; }
.cxlb.is-ui-off .cxlb__bot { opacity: 0; transform: translateY(10px); pointer-events: none; }
.cxlb.is-ui-off .cxlb__nav { opacity: 0; pointer-events: none; }

@media (hover: none) { .cxlb__nav { display: none; } }
@media (max-width: 760px) {
  .cxlb { --lb-top: 60px; }
  .cxlb__top { padding: 0 10px 0 14px; gap: 10px; }
  .cxlb__ttl b { font-size: 13.5px; }
  .cxlb__acts { gap: 4px; }
  .cxlb__b { width: 38px; height: 38px; font-size: 14px; }
  .cxlb__x { margin-left: 2px; }
  .cxlb__fs, .cxlb__nav { display: none; }
  .cxlb__img { border-radius: 0; box-shadow: none; }
  .cxlb__bot { padding: 8px 10px 12px; }
  .cxlb__cap { margin-bottom: 8px; font-size: 13.5px; }
  .cxlb__strip { gap: 6px; }
  .cxlb__strip button { width: 52px; height: 40px; border-radius: 7px; }
}
@media (max-width: 380px) { .cxlb__ttl b { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .cxlb *, .cxlb { transition: none !important; animation-duration: 0s !important; }
}
