/** Shopify CDN: Minification failed

Line 14:0 Unexpected "@font-face"

**/
/* ⚠ ÜRETİLMİŞ DOSYA — ELLE DÜZENLEME.
   Kaynak: farbelab-site/site-v2/iskelet.css
   Üretici: artistboya-site/farbelab-gom.mjs  (node farbelab-gom.mjs)
   FarbeLab'in sinematiği değişince üreticiyi yeniden çalıştır.
   Kaynağa göre iki bildirim ÇIKARILDI: body'deki overflow-x:hidden
   (sticky'yi kırıyordu) ve html'deki scroll-behavior:smooth (sayfa
   kaydırması temanın Lenis'ine ait). */
#fl-film /* FarbeLab yazı tipleri (farbelab.de, #fl-film self-host) */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url('https://farbelab.de/fonts/Inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('https://farbelab.de/fonts/JetBrainsMono-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('https://farbelab.de/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('https://farbelab.de/fonts/JetBrainsMono-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('https://farbelab.de/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}


#fl-film {
  
  --fl-kagit:    #f4f2ef;
  --fl-murekkep: #17171a;
  --fl-cizgi:    #d8d4ce;
  --fl-gri:      #6d6a66;

  
  --fl-zemin: var(--fl-kagit);
  --fl-yazi:  var(--fl-murekkep);
  --fl-soluk: #6d6a66;
  --fl-kural: #d8d4ce;

  --fl-olcek: clamp(2.75rem, 6.4vw, 5.75rem);
}

#fl-film * { box-sizing: border-box; }

#fl-film {
  margin: 0;
  background: var(--fl-kagit);
  color: var(--fl-murekkep);
  font-family: 'Inter', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}




#fl-film { height: 1113vh; position: relative; }

#fl-film .pencere {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
}


#fl-film .zemin {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--fl-zemin);
  transition: background-color .25s linear;
}


#fl-film .gorsel {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

#fl-film .film-panel {
  margin: 0;
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #16130f url('./vid/kahraman-poster.webp') center/cover;
  opacity: var(--fl-fo, 1);
  transition: opacity .45s linear;
}
#fl-film .film {
  width: 100%;
  height: 100%;
  display: block;
  
  opacity: 0;
  transition: opacity .5s ease;
  
  transform: scale(1.045) translate3d(var(--fl-px, 0px), var(--fl-py, 0px), 0);
}
#fl-film .film.cizildi { opacity: 1; }


#fl-film .film-ton {
  position: absolute;
  inset: 0;
  background: var(--fl-zemin);
  opacity: var(--fl-ton, .42);
  transition: background-color .25s linear;
}


#fl-film .film-scrim {
  position: absolute;
  inset: 0;
  
  
  background: linear-gradient(100deg,
    color-mix(in srgb, var(--fl-zemin) 86%, transparent) 0%,
    color-mix(in srgb, var(--fl-zemin) 68%, transparent) 32%,
    color-mix(in srgb, var(--fl-zemin) 38%, transparent) 56%,
    color-mix(in srgb, var(--fl-zemin) 12%, transparent) 78%,
    transparent 93%);
  opacity: 1;
  transition: background .25s linear;
}
@supports not (color: color-mix(in srgb, red, blue)) {
  #fl-film .film-scrim { background: linear-gradient(100deg, var(--fl-zemin) 0%, var(--fl-zemin) 30%, transparent 86%); }
}

#fl-film .film-kunye {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  display: flex;
  justify-content: space-between;
  padding: 1rem clamp(1.25rem, 5vw, 5rem);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .58rem;
  letter-spacing: .14em;
  color: var(--fl-yazi);
  opacity: .5;
}


#fl-film .ust {
  position: absolute;
  top: 0; left: 0; right: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 1.25rem clamp(1rem, 4vw, 3rem);
  color: var(--fl-yazi);
  transition: color .25s linear;
}
#fl-film .logo {
  font-weight: 800;
  font-size: .95rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  color: inherit;
}
#fl-film .nav { margin-left: auto; display: flex; gap: 1.5rem; }
#fl-film .nav a {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  color: inherit;
  opacity: .62;
}
#fl-film .nav a:hover { opacity: 1; }
#fl-film .dugme {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  padding: .5rem .85rem;
  border: 1px solid currentColor;
  color: inherit;
}


#fl-film .perde {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 6rem clamp(1.25rem, 5vw, 5rem) 4rem;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, var(--fl-ky, 0px), 0);
  max-width: 100%;
}
#fl-film .perde > * {
  max-width: 50ch;
  opacity: var(--fl-co, 1);
  transform: translate3d(0, var(--fl-cy, 0px), 0);
  will-change: opacity, transform;
}



#fl-film .satir { display: block; overflow: hidden; padding-bottom: .16em; margin-bottom: -.16em; }
#fl-film .satir .ic {
  display: inline-block;
  transform: translate3d(0, calc((1 - var(--fl-lt, 1)) * 125%), 0);
}


#fl-film .kunye {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--fl-soluk);
  margin: 0 0 1.25rem;
}

#fl-film .dev {
  color: var(--fl-vurgu, inherit);
  font-size: var(--fl-olcek);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: .97;
  margin: 0 0 1.5rem;
}
#fl-film .buyuk {
  color: var(--fl-vurgu, inherit);
  font-size: clamp(2rem, 4.2vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.05;
  margin: 0 0 1.75rem;
}
#fl-film .alt {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .8rem;
  letter-spacing: .04em;
  color: var(--fl-soluk);
  margin: 0;
}
#fl-film .govde { font-size: 1.0625rem; line-height: 1.62; margin: 0 0 1rem; max-width: 48ch; }


#fl-film .sayilar { display: flex; flex-wrap: wrap; gap: 1.5rem 2.25rem; margin: 2.25rem 0 0; max-width: 50ch; }
#fl-film .sayilar div { display: flex; align-items: baseline; gap: .4rem; }
#fl-film .sayilar dt { font-size: 1.75rem; font-weight: 800; letter-spacing: -.02em; margin: 0; }
#fl-film .sayilar dd {
  margin: 0;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fl-soluk);
}


#fl-film .kartela {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  background: var(--fl-kural);
  border: 1px solid var(--fl-kural);
  max-width: 100%;
}
#fl-film .kartela li { background: var(--fl-zemin); padding: .8rem .8rem .9rem; display: grid; gap: .5rem; }
#fl-film .fl-cip {
  --fl-r: 0%;                      
  height: 3rem;
  position: relative;
  background: var(--fl-kagit);
  overflow: hidden;
}
#fl-film .fl-cip::after {
  content: '';
  position: absolute; inset: 0;
  background: var(--fl-c);
  -webkit-mask-image: radial-gradient(circle, #000 var(--fl-r), transparent calc(var(--fl-r) + 2%));
          mask-image: radial-gradient(circle, #000 var(--fl-r), transparent calc(var(--fl-r) + 2%));
  -webkit-mask-size: 10px 10px;
          mask-size: 10px 10px;
}
#fl-film .kartela .ad { font-size: .78rem; font-weight: 600; letter-spacing: -.01em; }
#fl-film .kartela .veri {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .58rem;
  letter-spacing: .05em;
  color: var(--fl-soluk);
  line-height: 1.5;
}
#fl-film .dipnot {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .62rem; letter-spacing: .06em; color: var(--fl-soluk);
  margin: 1.1rem 0 0; max-width: 80ch;
}
#fl-film .perde-3 > .kartela, #fl-film .perde-3 > .dipnot { max-width: 100%; }




#fl-film .paket { list-style: none; padding: 0; margin: 1.6rem 0 0; counter-reset: p; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(23ch, 1fr)); max-width: 88ch; }

#fl-film .perde-6 > .paket { max-width: 88ch; }
#fl-film .paket li { counter-increment: p; display: grid; gap: .25rem; align-content: start; padding-top: .7rem; border-top: 1px solid var(--fl-kural); }
#fl-film .paket li::before {
  content: counter(p, decimal-leading-zero);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .6rem; letter-spacing: .1em; color: var(--fl-soluk);
}
#fl-film .paket b { font-size: .95rem; letter-spacing: -.01em; }
#fl-film .paket span { font-size: .85rem; line-height: 1.5; color: var(--fl-soluk); }


#fl-film .son { max-width: 20ch; }


#fl-film .eylem { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.8rem 0 0; }
#fl-film .eylem .dugme { opacity: .92; }
#fl-film .eylem .dugme:hover { opacity: 1; }

#fl-film .iletisim { margin: 1.4rem 0 0; }
#fl-film .iletisim a {
  font-size: 1.25rem; font-weight: 600; letter-spacing: -.01em;
  color: inherit; text-decoration: none;
  border-bottom: 1px solid currentColor; padding-bottom: .15rem;
}
#fl-film .alt-kunye { margin: 3rem 0 0; }


#fl-film .olcu {
  position: fixed; left: 1rem; bottom: 1rem; z-index: 99;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .62rem; letter-spacing: .06em;
  background: #000; color: #0f0; padding: .4rem .6rem;
  white-space: pre; pointer-events: none;
}


@media (prefers-reduced-motion: reduce) {
  #fl-film html { scroll-behavior: auto; }
  #fl-film { height: auto; }
  #fl-film .pencere { position: static; height: auto; overflow: visible; }
  #fl-film .gorsel { position: static; height: auto; padding: 3rem 1.25rem 0; place-items: center; }
  #fl-film .film-panel { height: 70vh; }
  #fl-film .film { display: none; }
  #fl-film .film-panel { background: url('./vid/kahraman-poster.webp') center/cover; }
  #fl-film .ust { position: sticky; background: var(--fl-kagit); }
  #fl-film .perde {
    position: static;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    padding: 4rem clamp(1.25rem, 5vw, 5rem);
    border-top: 1px solid var(--fl-cizgi);
  }
  #fl-film .perde > * { opacity: 1 !important; transform: none !important; }
  #fl-film .satir .ic { transform: none !important; }
  #fl-film .fl-cip { --fl-r: 100% !important; }
}


@media (max-width: 860px) and (not (prefers-reduced-motion: reduce)) {
  
  #fl-film .film { transform: none; }
  #fl-film .film-kunye { display: none; }
  #fl-film .film-ton { background: #0b0a09; opacity: var(--fl-ton-mobil, .30); }
  
  #fl-film .film-scrim {
    background: linear-gradient(to top,
      rgba(9, 8, 7, .72) 0%, rgba(9, 8, 7, .46) 26%,
      rgba(9, 8, 7, .18) 48%, transparent 66%);
    opacity: 1;
  }

  #fl-film .nav { display: none; }

  #fl-film .perde {
    justify-content: flex-end;
    padding: 4.5rem 1.25rem 3.25rem;
  }
  
  
  #fl-film .perde-0, #fl-film .perde-1, #fl-film .perde-2, #fl-film .perde-3, #fl-film .perde-4 {
    color: #f4f2ef !important;
    
    text-shadow: 0 1px 2px rgba(8, 7, 6, .92), 0 2px 14px rgba(8, 7, 6, .78),
                 0 0 34px rgba(8, 7, 6, .55);
  }
  
  #fl-film .perde-0 .dev, #fl-film .perde-0 .buyuk, #fl-film .perde-1 .buyuk, #fl-film .perde-2 .buyuk, #fl-film .perde-3 .buyuk, #fl-film .perde-4 .buyuk, #fl-film .perde-5 .buyuk { color: #f4f2ef !important; }
  #fl-film .perde-5 .kanit b, #fl-film .perde-5 .kanit i { color: #f4f2ef !important; }
  #fl-film .perde-0 .kunye, #fl-film .perde-1 .kunye, #fl-film .perde-2 .kunye, #fl-film .perde-3 .kunye, #fl-film .perde-4 .kunye, #fl-film .perde-5 .kunye {
    text-shadow: 0 1px 3px rgba(8, 7, 6, .96), 0 2px 16px rgba(8, 7, 6, .88);
  }
  #fl-film .perde-0 .kunye, #fl-film .perde-1 .kunye, #fl-film .perde-2 .kunye, #fl-film .perde-3 .kunye, #fl-film .perde-4 .kunye, #fl-film .perde-0 .alt, #fl-film .perde-1 .sayilar dd, #fl-film .perde-3 .dipnot, #fl-film .perde-3 .veri, #fl-film .perde-4 .foy span, #fl-film .perde-4 .foy i, #fl-film .perde-5 .kunye, #fl-film .perde-5 .kanit span, #fl-film .perde-5 .kanit em { color: #ded8cf !important; }
  
  #fl-film .perde-3 .kunye { color: #f7f5f1 !important; }
  #fl-film .perde-3 .kartela li {
    background: rgba(11, 10, 9, .88);
    border-color: #ffffff26;
    backdrop-filter: blur(3px);
  }
  #fl-film .perde-3 .ad { color: #f4f2ef !important; }

  #fl-film .dev   { font-size: clamp(2.2rem, 10.5vw, 3.1rem); }
  #fl-film .buyuk { font-size: clamp(1.7rem, 8vw, 2.4rem); margin-bottom: 1rem; }
  #fl-film .govde { font-size: .95rem; max-width: 100%; }

  #fl-film .sayilar { gap: .9rem 1.6rem; margin-top: 1.25rem; }
  #fl-film .sayilar dt { font-size: 1.35rem; }


  
  
  #fl-film .kartela, #fl-film .foy, #fl-film .paket, #fl-film .kanit {
    display: flex;
    gap: .6rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: .5rem;
    max-width: 100%;
    background: none;
    border: 0;
    scrollbar-width: none;
  }
  #fl-film .kartela::-webkit-scrollbar, #fl-film .foy::-webkit-scrollbar, #fl-film .paket::-webkit-scrollbar, #fl-film .kanit::-webkit-scrollbar { display: none; }
  #fl-film .kartela li { min-width: 138px; scroll-snap-align: start; border: 1px solid var(--fl-kural); }
  #fl-film .foy li, #fl-film .paket li {
    min-width: 210px;
    scroll-snap-align: start;
    padding: .7rem .8rem .8rem;
    border: 1px solid var(--fl-kural);
    border-top-width: 1px;
  }
  #fl-film .foy { margin-top: .75rem; }
  #fl-film .paket { margin-top: 1rem; }
}



@media (min-width: 861px) {
  
  #fl-film .perde-1, #fl-film .perde-2, #fl-film .perde-3, #fl-film .perde-4 {
    text-shadow: 0 1px 2px rgba(8, 7, 6, .88), 0 2px 18px rgba(8, 7, 6, .72),
                 0 0 44px rgba(8, 7, 6, .52);
  }
  
  #fl-film .perde-0 { text-shadow: 0 1px 2px rgba(252, 251, 249, .78), 0 0 22px rgba(252, 251, 249, .62); }
  #fl-film .perde > * { max-width: 46ch; }

  
  #fl-film .perde-0 { justify-content: flex-end; padding-bottom: 7rem; }

  
  #fl-film .perde-3 { justify-content: flex-end; padding-bottom: 5rem; }
  #fl-film .perde-3 > .kartela { max-width: 100%; }
  #fl-film .perde-3 > .dipnot { max-width: 100%; }
  #fl-film .perde-3 .kartela { grid-template-columns: repeat(10, 1fr); }
  #fl-film .perde-3 .kartela li { padding: .7rem .55rem .8rem; }
  #fl-film .perde-3 .fl-cip { height: 2.6rem; }
  #fl-film .perde-3 .kartela .veri { font-size: .52rem; }

  
  #fl-film .perde-5, #fl-film .perde-6 { align-items: center; text-align: center; }
  #fl-film .perde-5 > *, #fl-film .perde-6 > * { margin-left: auto; margin-right: auto; }
  #fl-film .perde-6 > .paket { max-width: min(88%, 980px); text-align: left; }
  
  #fl-film .perde-8 .son { max-width: 24ch; }
  #fl-film .perde-8 .iletisim, #fl-film .perde-8 .alt-kunye { text-align: center; }
}




#fl-film .bolum-gosterge {
  position: absolute;
  right: 1.1rem; top: 50%; transform: translateY(-50%);
  display: grid; gap: .5rem;
  z-index: 6;
}
#fl-film .bolum-gosterge button {
  appearance: none; background: none; border: 0; padding: .25rem 0;
  cursor: pointer; display: block; width: 22px;
}
#fl-film .bolum-gosterge span {
  display: block; height: 2px; border-radius: 2px;
  background: currentColor; opacity: .22;
  transition: opacity .25s linear, transform .25s ease;
  transform-origin: right center;
}
#fl-film .bolum-gosterge [data-durum="gecti"] span { opacity: .42; }
#fl-film .bolum-gosterge [data-durum="su"] span { opacity: 1; transform: scaleX(1.6); }
#fl-film .bolum-gosterge button:hover span { opacity: .8; }


#fl-film .kartela a {
  color: inherit; text-decoration: none; display: grid; gap: .5rem;
  transition: transform .2s ease;
}
#fl-film .kartela a:hover { transform: translateY(-2px); }
#fl-film .kartela a:hover .ad { text-decoration: underline; text-underline-offset: .2em; }



#fl-film .tablo-kap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  margin-top: 1.2rem;
}
#fl-film .teknik, #fl-film .ticari {
  border-collapse: collapse;
  font-size: .8rem;
  width: 100%;
  min-width: 34rem;
}
#fl-film .ticari { min-width: 22rem; }
#fl-film .teknik th, #fl-film .teknik td, #fl-film .ticari th, #fl-film .ticari td {
  text-align: left;
  padding: .55rem .7rem;
  border-bottom: 1px solid var(--fl-kural);
  white-space: nowrap;
}
#fl-film .teknik thead th, #fl-film .ticari th {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .58rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--fl-soluk); font-weight: 400;
}
#fl-film .teknik td { font-size: .82rem; }
#fl-film .teknik td a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--fl-kural); }
#fl-film .teknik td a:hover { border-bottom-color: currentColor; }
#fl-film .teknik .ortu { font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .12em; }
#fl-film .ticari th { width: 45%; white-space: normal; }
#fl-film .ticari td { font-size: .82rem; white-space: normal; }

#fl-film .ticari [data-ticari] { color: var(--fl-soluk); font-style: italic; }


#fl-film .kanit {
  list-style: none; padding: 0; margin: 1.4rem 0 0;
  display: grid; gap: 1.6rem;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  max-width: 88ch;
}
#fl-film .kanit li { display: grid; gap: .35rem; align-content: start; }
#fl-film .kanit figure {
  margin: 0 0 .55rem; overflow: hidden; border-radius: 2px;
  background: #0e0c0b; aspect-ratio: 4 / 3;
}
#fl-film .kanit video { width: 100%; height: 100%; object-fit: cover; display: block; }
#fl-film .kanit b { font-size: 1.45rem; font-weight: 800; letter-spacing: -.025em; }
#fl-film .kanit i {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal; font-size: .58rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fl-soluk);
}
#fl-film .kanit span { font-size: .85rem; line-height: 1.5; color: var(--fl-soluk); margin-top: .3rem; }
#fl-film .kanit em {
  font-style: normal; font-size: .6rem; letter-spacing: .08em;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  color: var(--fl-soluk); opacity: .7; margin-top: .2rem;
}



#fl-film .yan-vid {
  position: absolute;
  right: clamp(1.25rem, 5vw, 5rem);
  top: 0; bottom: 0;
  margin: auto 0;
  height: min(66vh, 520px);
  width: calc(min(66vh, 520px) * 9 / 16);
  max-width: 30vw;
  overflow: hidden;
  border: 1px solid var(--fl-kural);
  background: #0d0c0b;
  pointer-events: none;
}
#fl-film .yan-vid video { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1180px) { #fl-film .yan-vid { display: none; } }

@media (min-width: 1181px) {
  #fl-film .perde-7 > *:not(.yan-vid), #fl-film .perde-8 > *:not(.yan-vid) { max-width: min(62%, 880px); }
}

#fl-film .sss { margin-top: 1.3rem; max-width: 72ch; }
#fl-film .sss details { border-top: 1px solid var(--fl-kural); }
#fl-film .sss details:last-child { border-bottom: 1px solid var(--fl-kural); }
#fl-film .sss summary {
  cursor: pointer; list-style: none;
  padding: .85rem 1.6rem .85rem 0;
  font-size: .95rem; font-weight: 600; letter-spacing: -.01em;
  position: relative;
}
#fl-film .sss summary::-webkit-details-marker { display: none; }
#fl-film .sss summary::after {
  content: '+'; position: absolute; right: .2rem; top: .8rem;
  font-weight: 400; font-size: 1.1rem; color: var(--fl-soluk);
  transition: transform .2s ease;
}
#fl-film .sss details[open] summary::after { transform: rotate(45deg); }
#fl-film .sss details div {
  padding: 0 1.6rem .95rem 0;
  font-size: .87rem; line-height: 1.6; color: var(--fl-soluk);
}


#fl-film .iletisim.tel { margin-top: .5rem; }
#fl-film .iletisim.tel a { font-size: 1rem; }
#fl-film .altbilgi { margin-top: 2.4rem; display: grid; gap: .7rem; }
#fl-film .telif {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .6rem; letter-spacing: .06em; color: var(--fl-soluk); margin: 0;
}
#fl-film .yasal { display: flex; gap: 1.2rem; flex-wrap: wrap; }
#fl-film .yasal a {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .6rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--fl-soluk); text-decoration: none;
  border-bottom: 1px solid var(--fl-kural); padding-bottom: .15rem;
}
#fl-film .yasal a:hover { color: var(--fl-yazi); border-bottom-color: currentColor; }


@media (min-width: 861px) {
  
  #fl-film .perde-4 > *, #fl-film .perde-5 > *, #fl-film .perde-6 > *, #fl-film .perde-7 > * { max-width: min(92%, 1000px); }
  #fl-film .perde-4 .tablo-kap, #fl-film .perde-6 .tablo-kap { max-width: min(92%, 1000px); }
  #fl-film .kanit { grid-template-columns: repeat(4, 1fr); }
  #fl-film .sss { max-width: min(80%, 820px); }
}


@media (max-width: 860px) {
  #fl-film .bolum-gosterge { right: .5rem; }
  #fl-film .bolum-gosterge button { width: 14px; }
  #fl-film .teknik { font-size: .72rem; min-width: 30rem; }
  #fl-film .teknik th, #fl-film .teknik td { padding: .45rem .5rem; }
  #fl-film .ticari { min-width: 0; }
  #fl-film .ticari th { width: 52%; font-size: .55rem; }
  #fl-film .kanit li { min-width: 15rem; scroll-snap-align: start; }
  #fl-film .kanit figure { aspect-ratio: 4 / 3; margin-bottom: .5rem; }
  #fl-film .kanit b { font-size: 1.2rem; }
  #fl-film .kanit span { font-size: .8rem; }
  
  #fl-film .sss details div { font-size: .82rem; }
  #fl-film .sss summary { font-size: .9rem; }
  
  #fl-film .perde-3, #fl-film .perde-4, #fl-film .perde-5, #fl-film .perde-6, #fl-film .perde-7, #fl-film .perde-8 {
    justify-content: center;
  }
}


@media (max-width: 860px) {
  
  #fl-film .kanit {
    display: flex;
    gap: .6rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: .4rem;
    max-width: 100%;
    scrollbar-width: none;
  }
  #fl-film .kanit::-webkit-scrollbar { display: none; }
  #fl-film .kanit li {
    min-width: 14.5rem; max-width: 14.5rem;
    scroll-snap-align: start;
    border: 1px solid var(--fl-kural);
    padding: .55rem .6rem .7rem;
  }
  #fl-film .kanit figure { aspect-ratio: 4 / 3; margin-bottom: .45rem; }
  #fl-film .kanit b { font-size: 1.1rem; }
  #fl-film .kanit span { font-size: .76rem; line-height: 1.45; }
  #fl-film .kanit em { display: none; }          

  
  #fl-film .perde-6 .paket li { min-width: 13rem; max-width: 13rem; padding: .5rem .6rem .6rem; }
  #fl-film .perde-6 .paket span { font-size: .74rem; line-height: 1.4; }
  #fl-film .ticari th, #fl-film .ticari td { padding: .3rem .45rem; }
  #fl-film .ticari th { font-size: .5rem; }
  #fl-film .ticari td { font-size: .72rem; }
  #fl-film .perde-6 .tablo-kap { margin-top: .8rem; }
  #fl-film .perde-6 .govde { font-size: .88rem; }

  
  #fl-film .perde-4 .teknik th, #fl-film .perde-4 .teknik td { padding: .34rem .45rem; }
}


#fl-film .govde.ikinci { margin-top: .9rem; font-size: .92em; color: var(--fl-soluk); }
#fl-film .govde.ikinci b { color: var(--fl-yazi); font-weight: 600; }




@media (min-width: 861px) {
  #fl-film .perde-6 .paket { margin-top: 1.1rem; gap: .8rem 1.1rem; }
  #fl-film .perde-6 .paket li { padding-top: .55rem; }
  #fl-film .perde-6 .paket span { font-size: .8rem; line-height: 1.45; }
  #fl-film .perde-6 .tablo-kap { margin-top: .9rem; }
  
  #fl-film .perde-6 .ticari th, #fl-film .perde-6 .ticari td { padding: .3rem .7rem; line-height: 1.3; }
  #fl-film .perde-6 .govde { font-size: .95rem; }
}


@media (max-width: 400px) {
  #fl-film .govde.ikinci { font-size: .84em; line-height: 1.5; margin-top: .7rem; }
  #fl-film .perde-1 .govde { font-size: .88rem; }
  #fl-film .perde-1 .sayilar { margin-top: 1rem; gap: .55rem 1rem; }
  
  #fl-film .perde-6 .govde { font-size: .84rem; }
  #fl-film .perde-6 .buyuk { font-size: clamp(1.5rem, 7.4vw, 2rem); }
  #fl-film .perde-6 .paket { margin-top: .8rem; }
  #fl-film .perde-6 .paket li { padding: .45rem .55rem .5rem; }
  #fl-film .perde-6 .paket b { font-size: .88rem; }
  #fl-film .perde-6 .paket span { font-size: .7rem; line-height: 1.35; }
  #fl-film .perde-6 .tablo-kap { margin-top: .6rem; }
  #fl-film .ticari th, #fl-film .ticari td { padding: .2rem .4rem; }
  #fl-film .ticari th { font-size: .48rem; }
  #fl-film .perde-6 .tablo-kap { margin-top: .5rem; }
  #fl-film .sss { margin-top: 1rem; }
  #fl-film .sss summary { padding: .62rem 1.4rem .62rem 0; font-size: .88rem; }
}


@media (max-width: 860px) and (max-height: 780px) {
  
  #fl-film .perde-6 { padding-top: 6.5rem; }
  #fl-film .perde-6 .kunye { margin-bottom: .2rem; }
  #fl-film .perde-6 .buyuk { font-size: 1.42rem; line-height: 1.12; }
  #fl-film .perde-6 .govde { font-size: .8rem; line-height: 1.4; margin-top: .6rem; }
  #fl-film .perde-6 .paket { margin-top: .55rem; gap: .6rem; }
  #fl-film .perde-6 .paket li { padding-top: .4rem; padding-bottom: .3rem; }
  #fl-film .perde-6 .paket span { font-size: .67rem; line-height: 1.32; }
  #fl-film .perde-6 .tablo-kap { margin-top: .4rem; }
  
  #fl-film .perde-6 .ticari th, #fl-film .perde-6 .ticari td { padding: .1rem .4rem; line-height: 1.25; }
  
  #fl-film .sss summary { padding: .5rem 1.3rem .5rem 0; font-size: .85rem; }
}


#fl-film .film-scrim2 {
  position: absolute; inset: 0; pointer-events: none;
  opacity: var(--fl-ton2, 0);
  background: linear-gradient(to top,
    transparent 0%, rgba(9, 8, 7, .34) 14%, rgba(9, 8, 7, .62) 40%,
    rgba(9, 8, 7, .58) 60%, rgba(9, 8, 7, .18) 80%, transparent 92%);
  transition: opacity .25s linear;
}

@media (min-width: 861px) {
  #fl-film .film-scrim2 {
    background: linear-gradient(100deg,
      rgba(9, 8, 7, .52) 0%, rgba(9, 8, 7, .44) 30%,
      rgba(9, 8, 7, .18) 56%, transparent 76%);
  }
}

/* ── FarbeLab ürün bölümü (üretilmiş) ─────────────────────────────
   Sinematik değil: burası dükkân. O yüzden ART IST'in açık zemini ve
   kendi ölçüleri kullanılıyor — sinematikten çıkıp mağazaya dönmek
   okunur bir eşik olmalı. */
/* ⚠ ÜRÜN ARTIK TAM EKRAN BİR PERDE (inset:0), ayrı bir bölüm değil.
   Bu yüzden yükseklik EKRANA sığmak zorunda: dikey ölçüler vh cinsinden
   ve tüp kalan yeri alıyor. Sayfa akışındaki hâlinden farkı bu. */
#fl-urun { color: var(--fl-yazi, #f4f2ef); font-family: Inter, system-ui, sans-serif;
  padding: clamp(1.4rem, 3.4vh, 3rem) clamp(1.25rem, 5vw, 5rem);
  display: grid; align-items: center; }
#fl-urun .fl-u-ic { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(1.5rem, 4vw, 4rem); align-items: center; max-width: 1400px; margin: 0 auto; width: 100%; }
#fl-urun .fl-u-sahne { display: grid; gap: .8rem; min-height: 0; }
/* ⚠ TÜP KUTUSU YOK. Görseller alfa kanallı (ölçüldü: 4 kanal), yani
   arkalarında kutu olmadan filmin üstünde durabiliyorlar. Kutu koymak
   "beyaz arkaplan"ı küçültmekten başka bir şey olmazdı. */
#fl-urun .fl-u-tup { position: relative; touch-action: pan-y; cursor: grab;
  height: min(56vh, 500px); display: grid; place-items: center; }
#fl-urun .fl-u-tup:active { cursor: grabbing; }
/* ⚠ width/height:100% BURADA ÇALIŞMIYOR. Kap "place-items:center"
   olduğu için öğe içeriğine göre boyutlanıyor ve yüzde, içeriğin kendi
   boyuna göre çözülüyor: kutu 230 px iken görsel 396 px çiziliyordu
   (ölçüldü) ve çip şeridinin üstüne taşıyordu. max-* ile sınır kesin.
   ⚠ NOT: bu sadece taşmayı gizlemek değil, kutunun sözünü tutması.
   ⚠⚠ BU YORUMDA TERS TIRNAK KULLANMA — şablon dizesinin içinde. */
#fl-urun .fl-u-tup img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;
  user-select: none; -webkit-user-drag: none;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.45)); }
/* ⚠ TÜP ÖNDE, ÇİPLER ARKADA. Mobilde tüp görseli kutusundan taşıyor ve
   DOM sırası gereği çip şeridi onun ÜSTÜNE biniyordu (Timur ekran
   görüntüsünde gösterdi). Tüpe yığın önceliği verildi. */
#fl-urun .fl-u-tup { position: relative; z-index: 2; }
#fl-urun .fl-u-renkler { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: center;
  position: relative; z-index: 1; }
#fl-urun .fl-u-renk { border: 1px solid rgba(244,242,239,.28); background: rgba(10,9,8,.35);
  padding: .28rem .28rem .14rem; border-radius: 3px; cursor: pointer; line-height: 1;
  display: grid; gap: .18rem; justify-items: center; backdrop-filter: blur(2px); }
#fl-urun .fl-u-renk span { display: block; width: 1.9rem; height: 1.9rem; background: var(--fl-c); border-radius: 2px; }
#fl-urun .fl-u-renk em { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .5rem;
  font-style: normal; color: rgba(244,242,239,.75); letter-spacing: .06em; }
#fl-urun .fl-u-renk.secili { border-color: #f4f2ef; }
#fl-urun .fl-u-kunye { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .62rem;
  letter-spacing: .16em; color: var(--fl-soluk, #cdc2b2); margin: 0 0 .8rem; }
#fl-urun .fl-u-baslik { font-size: clamp(2rem, 4.4vw, 3.4rem); line-height: .98; letter-spacing: -.02em;
  margin: 0 0 1rem; font-weight: 700; }
#fl-urun .fl-u-govde { font-size: clamp(.95rem, 1.15vw, 1.05rem); line-height: 1.55; max-width: 44ch; margin: 0 0 1.2rem; }
#fl-urun .fl-u-dip { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .6rem;
  letter-spacing: .05em; line-height: 1.7; color: var(--fl-soluk, #cdc2b2); margin: 0 0 1.4rem; max-width: 58ch; }
#fl-urun .fl-u-fiyat { font-size: 1.6rem; font-weight: 700; margin: 0 0 .9rem; }
#fl-urun .fl-u-fiyat small { font-size: .7rem; font-weight: 400; color: var(--fl-soluk, #cdc2b2); margin-left: .5rem; }
/* Satın alma düğmesi TEK OPAK ÖĞE: hareketli görüntü üstünde çağrının
   kaybolmaması için ters kontrast (açık zemin, koyu yazı). */
#fl-urun .fl-u-btn { display: inline-block; background: #f4f2ef; color: #17171a; border: 0;
  padding: .95rem 2.2rem; border-radius: 2px; font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; text-decoration: none; }
#fl-urun .fl-u-btn:hover { background: #fff; }
#fl-urun .fl-u-yok { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .66rem;
  letter-spacing: .08em; color: var(--fl-soluk, #cdc2b2); border: 1px dashed rgba(244,242,239,.35);
  padding: .9rem 1.1rem; background: rgba(10,9,8,.3); }
/* ⚠ SAĞ KENAR RAYI (.sectnav) sabit ve difference karışımıyla çiziliyor;
   pay verilmezse metnin sağına biniyor (1440'ta 28 px ölçüldü). */
@media (min-width: 1100px) { #fl-urun { padding-right: clamp(6rem, 10vw, 10rem); } }
/* ⚠ MOBİLDE TEK SÜTUN VE EKRANA SIĞMA. Perde tam ekran (inset:0) olduğu
   için taşan içerik kırpılır. */
@media (max-width: 860px) {
  #fl-urun { padding: clamp(1rem, 2.4vh, 2rem) 1.25rem; align-content: center; }
  #fl-urun .fl-u-ic { grid-template-columns: 1fr; gap: .9rem; }
  #fl-urun .fl-u-tup { height: min(27vh, 240px); }
  #fl-urun .fl-u-renk span { width: 1.4rem; height: 1.4rem; }
  #fl-urun .fl-u-baslik { font-size: clamp(1.7rem, 7vw, 2.4rem); }
  #fl-urun .fl-u-govde { font-size: .9rem; margin-bottom: .7rem; }
  #fl-urun .fl-u-dip { font-size: .55rem; line-height: 1.6; margin-bottom: .9rem; }
}