/* Ataksan — Alternatif 2 «Yörünge»
   Logodaki açık halka (üst + alt yay) sitenin geometrisi: mercek fotoğraflar, yay süslemeli lacivert bantlar,
   hap menü, madalyon markalar, yay göstergeli rakamlar. Tek yazı ailesi: Questrial (2026-10-11, kendinden barındırılır). Tek ağırlığı (400) var; 600–700 istenen yerlerde
   tarayıcı kalınlaştırır («bold biraz daha kalın») — bu kalınlaştırma harf genişliğini artırmadığı için kalın yazılarda
   harf aralığı açık tutulur (eksi aralık yok, küçük kalın yazıda +.01em). Arapça: Readex Pro (gerçek ağırlıklar). */

@font-face{font-family:"Questrial";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/questrial-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Questrial";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/questrial-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}

:root{
  --font:"Questrial",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  /* logo laciverti ve tonları */
  --lac:#141518;--lac-2:#1F2126;--lac-3:#2C2F36;--lac-koyu:#0B0C0E;
  --vurgu:#D5D8E0;        /* koyu zeminde vurgu: gümüş (küçük yazıda da 4,5:1 üstü) */
  --vurgu-ink:#4B4F5A;    /* açık zeminde vurgu: grafit */
  --zemin:#fff;--zemin-2:#F3F3F5;--zemin-3:#EAEAEE;--yuzey:#fff;--bant:#141518;
  --cizgi:#E2E3E8;--cizgi-2:#C8CAD2;--cizgi-k:rgba(255,255,255,.14);
  --isaret:rgba(20,21,24,.1);--odak:rgba(20,21,24,.12);--dugme-zemin:#141518;--dugme-zemin-2:#2C2F36;--dugme-metin:#fff;
  --ikon-gunes:none;--ikon-ay:block;
  --metin:#141518;--govde:#4A4D57;--sessiz:#686B76;
  --acik-govde:rgba(255,255,255,.8);--acik-sessiz:rgba(255,255,255,.64);
  --krom:linear-gradient(135deg,#F7F8FB 0%,#C7CBD6 45%,#F1F2F6 62%,#B3B9C7 100%);
  --kap:96rem;--oluk:clamp(1.25rem,4vw,4rem);   /* konteyner (2026-10-11): 92rem / 4.5vw → «genişlet» 100rem / 3.5vw → «birazcık küçült» 96rem / 4vw */
  --bolum:clamp(4.5rem,9.5vw,9.5rem);--ic:clamp(2rem,4.2vw,3.6rem);
  --r:1.5rem;--r-k:1.25rem;--yay-kose:clamp(4rem,12vw,9rem);
  --golge:0 20px 50px rgba(8,8,10,.26);--golge-acik:0 14px 40px rgba(20,21,24,.1);
}
html{font-size:106.25%}
@media (min-width:125rem){html{font-size:118.75%}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--metin);font-family:var(--font);font-size:1rem;font-weight:500;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
img{height:auto}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:.01em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
a{color:inherit}
button,input,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--vurgu-ink);outline-offset:3px;border-radius:.25rem}
.ust :focus-visible,.kahraman :focus-visible,.bant :focus-visible,.cagri :focus-visible,.alt :focus-visible,.sayfa-basi :focus-visible,.film :focus-visible,.arama-kat :focus-visible{outline-color:#fff}
.gorunmez{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gec{position:absolute;inset-inline-start:-200vw;top:.75rem;z-index:300;background:#fff;color:var(--lac);padding:.75rem 1.25rem;border-radius:999px;font-weight:700;text-decoration:none;letter-spacing:.01em}
.gec:focus{inset-inline-start:.75rem}
.kap{max-width:var(--kap);margin-inline:auto;padding-inline:var(--oluk)}
/* ızgara / esnek kap çocukları içeriğin min-content genişliğine kilitlenmesin (telefonda taşma) */
.kahraman__ic>*,.bant__ic>*,.cagri__ic>*,.sayfa-basi__ic>*,.ayrik>*,.iletisim>*,.vitrin>*,.bas>*{min-width:0}

/* ---------- tipografi ---------- */
.b1{font-size:clamp(2.6rem,6vw,5.2rem);line-height:1.04;letter-spacing:0;text-wrap:balance}
.b2{font-size:clamp(1.9rem,3.7vw,3.3rem);line-height:1.1;letter-spacing:0;text-wrap:balance}
.lede{font-size:clamp(1.05rem,1.3vw,1.2rem);line-height:1.65;color:var(--govde);margin-top:1rem;max-width:58ch}
.lede--acik{color:var(--acik-govde)}
.etiket{display:inline-flex;align-items:center;gap:.55rem;margin:0 0 1rem;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--vurgu-ink)}
.etiket--acik{color:var(--vurgu)}
.govde p{color:var(--govde);line-height:1.7;font-size:1.05rem;margin:0 0 1rem}
.govde p:last-child{margin-bottom:0}
.eylemler{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-top:1.75rem}
.eylemler--orta{justify-content:center;margin-top:var(--ic)}

/* ---------- yay (logo halkası) ---------- */
.yay{position:absolute;pointer-events:none;color:currentColor}
.yay path{stroke:currentColor;stroke-width:2.2;fill:none}
.mercek .yay{inset:-8%;width:116%;height:116%;color:var(--metin);opacity:.28}
.kahraman .mercek .yay,.sayfa-basi .mercek .yay{color:#fff;opacity:.6}
.kahraman .mercek .yay path{stroke-dasharray:100;stroke-dashoffset:100;animation:ciz 1.5s .3s ease-out forwards}
.anim-yok .kahraman .mercek .yay path{stroke-dashoffset:0}
@media (prefers-reduced-motion:reduce){.kahraman .mercek .yay path{stroke-dashoffset:0}}
@keyframes ciz{to{stroke-dashoffset:0}}
.yay--bant{inset-inline-end:-8rem;top:50%;width:48rem;height:48rem;transform:translateY(-50%);color:#fff;opacity:.1}
.yay--bant path{stroke-width:1.4}
.kahraman__zemin{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.yay--kahraman{inset-inline-end:-18vw;top:-30vh;width:min(80vw,70rem);height:min(80vw,70rem);color:#fff;opacity:.07}
.yay--kahraman path{stroke-width:1}
.yay--alt{inset-inline-start:-14rem;bottom:-22rem;width:44rem;height:44rem;color:#fff;opacity:.07}
.yay--alt path{stroke-width:1.4}

/* ---------- düğmeler ---------- */
.dugme{display:inline-flex;align-items:center;gap:.75rem;height:3.4rem;padding:0;padding-inline:1.5rem .5rem;border-radius:999px;border:1px solid transparent;font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .25s,color .25s,border-color .25s,transform .25s;letter-spacing:.01em}
.dugme:not(:has(.dugme__ok)){padding-inline-end:1.5rem}
.dugme__ok{width:2.4rem;height:2.4rem;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);transition:transform .3s}
.dugme:hover .dugme__ok{transform:translateX(3px)}
.dugme--lac{background:var(--dugme-zemin);color:var(--dugme-metin)}
.dugme--lac:hover{background:var(--dugme-zemin-2)}
.dugme--krom{background:var(--krom);color:var(--lac)}
.dugme--krom .dugme__ok{background:rgba(20,21,24,.1)}
.dugme--krom:hover{filter:brightness(1.04)}
.dugme--cizgi{background:none;border-color:var(--cizgi-2);color:var(--metin)}
.dugme--cizgi:hover{border-color:var(--lac)}
.dugme--acik{border-color:rgba(255,255,255,.4);color:#fff}
.dugme--acik:hover{border-color:#fff}
.dugme--kucuk{height:2.75rem;font-size:.92rem}
.dugme--tam{width:100%;justify-content:center;margin-top:1.4rem}
.dugme{max-width:100%}
@media (max-width:47.99rem){.eylemler .dugme,.cagri .dugme{white-space:normal;height:auto;min-height:3.4rem;padding-block:.5rem;text-align:center}}
.yuvarlak{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid rgba(255,255,255,.26);background:transparent;color:#fff;cursor:pointer;padding:0;transition:background .25s,border-color .25s}
.yuvarlak:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}
.yuvarlak--acik{border-color:var(--cizgi-2);color:var(--metin)}
.yuvarlak--acik:hover{background:var(--zemin-2);border-color:var(--metin)}

/* ---------- üst bilgi + hap menü ---------- */
/* sayfa yukarı çıkarken üst bilgi %35 daralır (2026-10-11): site.js ilk 120 px kaydırmada --ust-d'yi 0 → 1 götürür.
   Yükseklik 5.25rem → 3.4125rem; kaybedilen pay alt boşluk olur, akıştaki toplam yükseklik hep 5.25rem kalır —
   sayfa zıplamaz, şerit kısa olduğu anda bile alttaki içerikle arasında boşluk açılmaz (daralma ≤ kaydırma).
   Logo, hap menü ve yuvarlak düğmeler aynı oranla küçülür ki 3.4125rem'e sığsınlar. */
.ust{--ust-d:0;position:sticky;top:0;z-index:60;background:var(--bant);color:#fff;margin-bottom:calc(1.8375rem * var(--ust-d))}
.ust__ic{display:flex;align-items:center;gap:1.25rem;min-height:calc(5.25rem - 1.8375rem * var(--ust-d))}
.ust__logo{display:inline-flex;flex:none}
.ust__logo img{width:8.25rem;height:auto}
/* üst bilgi logosu «biraz büyüt» (2026-10-11): 8.25 → 9.5rem; 1024–1279 7 → 8rem; dar telefonlar 7 → 7.75rem, 6.4 → 7rem (alt bilgi logosu 8.25rem kalır).
   Daralırken logo %30 küçülür; kutu tam genişlikte kalır ki hap menü yerinden oynamasın. site.js görseli aynı dosyanın satır içi
   SVG'siyle değiştirir; menü daralmaya başlarken açılıştaki animasyon (.logo-oyna) bir kez oynar. */
.ust__ic > .ust__logo{--logo:9.5rem;width:var(--logo)}
.ust__ic > .ust__logo :is(img,svg){display:block;width:calc(var(--logo) * (1 - .3 * var(--ust-d)));height:auto;overflow:visible}
.ust__logo-svg :is(path,polygon){fill:#fff}
.ust__araclar .yuvarlak{--yuv:2.75rem;width:calc(var(--yuv) - .5rem * var(--ust-d));height:calc(var(--yuv) - .5rem * var(--ust-d))}
.ust__nav{display:none;margin-inline:auto}
/* menü daraldığında hap zemini olmasın (2026-10-11): zemin ve çerçeve --ust-d ile saydamlaşır; etkin sayfanın beyaz hapı kalır */
.hap{display:flex;gap:.2rem;padding:calc(.3rem - .1rem * var(--ust-d));border-radius:999px;background:rgba(255,255,255,calc(.07 * (1 - var(--ust-d))));border:1px solid rgba(255,255,255,calc(.1 * (1 - var(--ust-d))))}
.hap a{display:inline-flex;align-items:center;gap:.55rem;padding:.6rem;padding-block:calc(.6rem - .3rem * var(--ust-d));padding-inline:.9rem 1rem;border-radius:999px;color:rgba(255,255,255,.84);font-weight:700;font-size:.93rem;text-decoration:none;white-space:nowrap;transition:background .25s,color .25s;letter-spacing:.01em}
.hap a::before{content:"";width:.5rem;height:.5rem;border-radius:50%;border:2px solid currentColor;opacity:.45;transition:opacity .25s,background .25s}
.hap a:hover{background:rgba(255,255,255,.1);color:#fff}
.hap a[aria-current="page"]{background:#fff;color:var(--lac)}
.hap a[aria-current="page"]::before{background:#141518;border-color:#141518;opacity:1}
.ust__araclar{display:flex;align-items:center;gap:.6rem;margin-inline-start:auto}
.ust__tel{display:none;color:#fff;text-decoration:none;font-weight:700;font-size:.95rem;font-variant-numeric:tabular-nums;padding-inline:.5rem;letter-spacing:.01em}
/* üst bilgi araçları: dil · tema (≥48rem) · arama (· telefon ≥96rem) · menü (<64rem); «Teklif İste» üst bilgide yok (2026-10-11)
   telefonda tema düğmesi üst bilgide görünmez, alt panel menüdeki «Tema» düğmesi kalır (2026-10-11) */
@media (max-width:47.99rem){.ust__tema{display:none}}
@media (max-width:23.99rem){.ust__ic{gap:.75rem}.ust__ic > .ust__logo{--logo:7.75rem}.ust__araclar{gap:.45rem}.ust__araclar .yuvarlak{--yuv:2.6rem}}
@media (min-width:64rem){.ust__nav{display:block}.ust__menu{display:none}
  /* üç yuvarlak düğmenin daralırken kaybettiği genişlik (3 × .5rem) iç pay olur: hap menü yatayda yerinde kalır */
  .ust__araclar{padding-inline-start:calc(1.5rem * var(--ust-d))}}
/* 1024–1279: hap menü sıkışık; logo ve iç paylar küçülür ki satır 1024'e sığsın */
@media (min-width:64rem) and (max-width:79.99rem){
  .ust__ic{gap:1rem}
  .ust__ic > .ust__logo{--logo:8rem}
  .hap a{padding:calc(.55rem - .275rem * var(--ust-d)) .7rem calc(.55rem - .275rem * var(--ust-d)) .6rem;font-size:.86rem;gap:.4rem}
}
@media (min-width:96rem){.ust__tel{display:inline-flex}}

/* arama paneli (üst bilgiden açılır) */
.arama-kat{position:absolute;left:0;right:0;top:100%;background:var(--lac-koyu);border-top:1px solid var(--cizgi-k);box-shadow:var(--golge);padding-block:1.5rem 1.75rem}
.arama-kat__ic{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:1rem;align-items:center}
.arama-kat__ic>.arama{grid-column:1;grid-row:1}
.arama-kat__ic>.ipucu{grid-column:1;grid-row:2}
.arama-kat__kapat{grid-column:2;grid-row:1;align-self:center}
.arama-kat .arama{max-width:none}

/* alt panel menü (telefon / tablet) */
.menu-kat{position:fixed;inset:0;z-index:100}
.menu-kat__perde{position:absolute;inset:0;background:rgba(8,8,10,.62);opacity:0;transition:opacity .35s}
.menu-kat__panel{position:absolute;left:0;right:0;bottom:0;max-height:88vh;overflow:auto;background:var(--yuzey);color:var(--metin);border-radius:1.75rem 1.75rem 0 0;padding:1.25rem var(--oluk) calc(1.5rem + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.menu-kat[data-acik="true"] .menu-kat__perde{opacity:1}
.menu-kat[data-acik="true"] .menu-kat__panel{transform:none}
.menu-kat__ust{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}
.menu-kat__ust .etiket{margin:0}
.menu-kat__liste a{display:flex;align-items:center;gap:.75rem;padding:.95rem 0;font-size:1.35rem;font-weight:700;text-decoration:none;border-bottom:1px solid var(--cizgi);letter-spacing:.01em}
.menu-kat__liste a::before{content:"";width:.55rem;height:.55rem;border-radius:50%;border:2px solid var(--cizgi-2)}
.menu-kat__liste a[aria-current="page"]::before{background:var(--metin);border-color:var(--metin)}
.menu-kat__alt{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.25rem}
.menu-kat__alt .ust__tel{display:inline-flex;color:var(--metin);font-size:1.05rem;padding:0}

/* ---------- hap arama + canlı sonuçlar ---------- */
.arama{position:relative;display:flex;align-items:center;gap:.5rem;max-width:46rem;background:#fff;color:var(--metin);border-radius:999px;padding:.4rem;padding-inline-start:1.25rem;box-shadow:var(--golge)}
.arama,.arama__panel{--metin:#141518;--govde:#4A4D57;--sessiz:#686B76;--cizgi:#E2E3E8;--vurgu-ink:#4B4F5A;--zemin-2:#F3F3F5;--isaret:rgba(20,21,24,.1);--dugme-zemin:#141518;--dugme-zemin-2:#2C2F36;--dugme-metin:#fff}
.arama__ikon{color:var(--sessiz);display:grid;flex:none}
.arama input{flex:1 1 auto;width:0;min-width:0;height:3.2rem;border:0;background:none;outline:none;font-size:1.05rem;font-weight:600;color:var(--metin);letter-spacing:.01em}
.arama input::placeholder{color:var(--sessiz);font-weight:500}
.arama input::-webkit-search-cancel-button{-webkit-appearance:none}
.arama .dugme{flex:none}
.arama--kucuk input{height:2.9rem}
.arama--buyuk{box-shadow:var(--golge-acik);border:1px solid var(--cizgi)}
.arama__panel{position:absolute;inset-inline:0;top:calc(100% + .5rem);z-index:40;background:#fff;color:var(--metin);border-radius:var(--r-k);box-shadow:var(--golge);padding:.5rem;max-height:60vh;overflow:auto;text-align:left}
.arama__durum,.arama__yok{padding:.6rem .9rem;font-size:.85rem;color:var(--sessiz)}
.arama__yok a{color:var(--vurgu-ink);font-weight:700;letter-spacing:.01em}
.hit{display:flex;align-items:center;gap:.9rem;padding:.55rem .75rem;border-radius:1rem;text-decoration:none;color:var(--metin)}
.hit:hover,.hit:focus-visible{background:#F3F3F5}
.hit img{width:3.25rem;height:3.25rem;border-radius:.65rem;object-fit:contain;padding:2px;background:#fff;flex:none;box-shadow:inset 0 0 0 1px var(--cizgi)}
.hit__metin{flex:1;min-width:0}
.hit__ad{display:block;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.01em}
.hit__kod{display:block;font-size:.82rem;color:var(--sessiz);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hit__git{font-size:.8rem;font-weight:700;color:var(--vurgu-ink);white-space:nowrap;letter-spacing:.01em}
.arama__tumu{display:flex;justify-content:center;align-items:center;gap:.4rem;padding:.8rem;font-weight:700;color:var(--vurgu-ink);text-decoration:none;border-top:1px solid var(--cizgi);margin-top:.25rem;letter-spacing:.01em}
mark{background:var(--isaret);color:var(--metin);border-radius:.2rem;padding:0 .05em}
.ipucu{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem;max-width:46rem}
.ipucu__etiket{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acik-sessiz);margin-inline-end:.25rem}
.ipucu button{border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;border-radius:999px;padding:.5rem .9rem;font-size:.85rem;font-weight:600;cursor:pointer;transition:background .25s,border-color .25s;letter-spacing:.01em}
.ipucu button:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.6)}
.ipucu__baglanti{margin-inline-start:auto;display:inline-flex;align-items:center;gap:.4rem;color:#fff;font-weight:700;font-size:.9rem;text-decoration:none;letter-spacing:.01em}
.bolum .ipucu__etiket{color:var(--sessiz)}
.bolum .ipucu button{border-color:var(--cizgi-2);background:var(--yuzey);color:var(--metin)}
.bolum .ipucu button:hover{border-color:var(--metin);background:var(--zemin-2)}

/* ---------- kahraman ---------- */
/* «Makine aileleri» çıktıktan sonra (2026-10-11): üst ve alt pay eşit, metin bloğu dikeyde ortada; metnin içinde iki adımlı ritim —
   grup içinde 1.25rem (etiket→başlık, arama→öneriler), gruplar arasında 2.75rem (başlık→arama, öneriler→özet); «aralarını biraz aç» */
/* «hero vh 100» (2026-10-11): üst bilgiyle birlikte tam bir ekran (5.25rem = üst bilgi akış yüksekliği, daralırken de sabit);
   içerik dikeyde ortada. Telefonda içerik ekrandan uzun, yalnız en az yükseklik olarak kalır. */
/* kahraman yalnız yatayda kırpar: canlı aramanın sonuç paneli kahramanın altına taşabilsin (tam ekran kahramanda kesiliyordu);
   büyük süs yayı kendi kırpan katmanında (.kahraman__zemin) kalır */
.kahraman{position:relative;overflow-x:clip;background:var(--bant);color:#fff;padding-block:clamp(3rem,6vw,6rem);
  display:flex;flex-direction:column;justify-content:center;min-height:calc(100vh - 5.25rem);min-height:calc(100svh - 5.25rem)}
.kahraman > .kahraman__ic{width:100%}
.kahraman::before{content:"";position:absolute;inset:0;background:radial-gradient(60rem 40rem at 85% 20%,rgba(255,255,255,.07),transparent 60%);pointer-events:none}
.kahraman__ic{position:relative;display:grid;gap:3rem;align-items:center}
.kahraman__metin .b1{max-width:12ch;font-size:clamp(2.85rem,6.6vw,5.7rem)}
/* masaüstünde başlık her dilde iki satır: genişlik sınırı yok, boyut metin sütununa göre (en uzunu İngilizce) */
@media (min-width:64rem){.kahraman__metin{container-type:inline-size}.kahraman__metin .b1{max-width:none;font-size:min(5.7rem,12.4cqi,10.5vh)}}
.kahraman{--kh-k:1.5rem;--kh-b:3rem}   /* ritim: grup içi / gruplar arası («aralarını biraz aç» ×2, 2026-10-11) */
.kahraman__metin .arama{margin-top:var(--kh-b)}
.kahraman__metin > .etiket{margin-bottom:var(--kh-k);font-size:.86rem}
/* «herodaki materyalleri komple biraz büyüt» (2026-10-11): etiket, başlık, arama, öneriler, özet, mercek ve rozetler ~%10 büyük */
.kahraman .arama{max-width:50rem;padding:.45rem;padding-inline-start:1.4rem}
.kahraman .arama input{height:3.55rem;font-size:1.15rem}
.kahraman .arama .dugme{height:3.75rem;font-size:1.1rem;padding-inline:1.65rem .55rem}
.kahraman .arama .dugme__ok{width:2.65rem;height:2.65rem}
.kahraman .ipucu{max-width:50rem}
.kahraman .ipucu__etiket{font-size:.82rem}
.kahraman .ipucu button{font-size:.93rem;padding:.55rem 1rem}
.kahraman .ipucu__baglanti{font-size:.98rem}
.kahraman__metin > .ipucu{margin-top:var(--kh-k)}
.kahraman__ozet{font-size:1.2rem;line-height:1.65;color:var(--acik-govde);max-width:54ch;margin-top:var(--kh-b)}
.kahraman__gorsel{position:relative;display:grid;justify-items:center}
.mercek{position:relative;aspect-ratio:1;width:100%}
.mercek img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.mercek--kahraman{width:min(100%,35rem)}
.mercek--kahraman img{opacity:0;transition:opacity 1.2s ease}
.mercek--kahraman img.acik{opacity:1}
.mercek__kontrol{display:flex;align-items:center;justify-content:center;gap:.9rem;margin-top:1.25rem;flex-wrap:wrap}
.mercek__noktalar{display:flex;gap:.25rem}
.mercek__noktalar button{width:1.5rem;height:1.5rem;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.mercek__noktalar button::before{content:"";width:.6rem;height:.6rem;border-radius:50%;border:2px solid rgba(255,255,255,.55);transition:background .25s,border-color .25s}
.mercek__noktalar button[aria-pressed="true"]::before{background:#fff;border-color:#fff}
.mercek__altyazi{font-size:.85rem;color:var(--acik-sessiz);min-width:12ch}
#mercekDur svg:last-child{display:none}
#mercekDur[aria-pressed="true"] svg:first-child{display:none}
#mercekDur[aria-pressed="true"] svg:last-child{display:block}
.kahraman__rakam{display:flex;flex-direction:column;background:#fff;color:var(--lac);border-radius:999px;padding:.95rem 1.65rem;line-height:1.1}
.kahraman__rakam b{font-size:1.95rem;letter-spacing:0}
.kahraman__rakam span{font-size:.79rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#4A4D57;margin-top:.3rem}
.kahraman__film{display:flex;align-items:center;gap:.9rem;background:var(--lac-2);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:.5rem;padding-inline-end:1.4rem;cursor:pointer;text-align:start;box-shadow:var(--golge);transition:background .25s}
.kahraman__film:hover{background:var(--lac-3)}
.kahraman__film-disk{width:3.6rem;height:3.6rem;border-radius:50%;background:#fff;color:var(--lac);display:grid;place-items:center;flex:none}
.kahraman__film-etiket{display:block;font-size:.77rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acik-sessiz)}
.kahraman__film-ad{display:block;font-weight:700;letter-spacing:.01em;font-size:1.1rem}
.kahraman__ekler{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-top:1.25rem}
/* aşağı kaydır çizgisi (2026-10-11): sayfanın tam ortasında ince dikey çizgi, yarısı kahramanda yarısı alttaki bölümde;
   içinden parlak bir parça yukarıdan aşağı akar (2,4 sn döngü). Kahramanla bölüm arasında yüksekliği olmayan bir bağlantıdır,
   akışa yer kaplamaz; çizgi iki yana taşar, tıklama alanı 2.75rem genişliğinde. Ürün yelpazesine (#yelpaze) götürür.
   Renk metin rengi: kahraman ve bölüm zemini temayla birlikte döndüğü için iki yarıda da okunur. Hareket azaltmada durur. */
.asagi{--yari:2rem;position:relative;z-index:1;display:block;height:0;width:2.75rem;margin-inline:auto;color:var(--metin)}
.asagi::before{content:"";position:absolute;inset-inline:0;top:calc(-1 * var(--yari));height:calc(2 * var(--yari))}
.asagi__cizgi{position:absolute;left:50%;top:calc(-1 * var(--yari));width:1px;height:calc(2 * var(--yari));translate:-50% 0;overflow:hidden;
  background:color-mix(in srgb,currentColor 28%,transparent);transition:background .25s}
.asagi__cizgi::after{content:"";position:absolute;inset-inline:0;top:0;height:42%;background:linear-gradient(transparent,currentColor 70%);
  animation:asagiAkis 2.4s cubic-bezier(.45,.05,.4,1) infinite}
.asagi:hover .asagi__cizgi{background:color-mix(in srgb,currentColor 50%,transparent)}
.asagi:focus-visible{outline:none}
.asagi:focus-visible::before{outline:2px solid currentColor;outline-offset:2px;border-radius:999px}
@keyframes asagiAkis{0%{transform:translateY(-100%)}75%,100%{transform:translateY(240%)}}
@media (min-width:64rem){.asagi{--yari:3rem}}
#yelpaze{scroll-margin-top:3.4125rem}   /* daralmış üst bilginin altına */
@media (min-width:64rem){
  /* masaüstünde mercek ekran yüksekliğine göre de küçülür ki kahraman kısa dizüstü ekranlarında da tek ekrana sığsın:
     ekran − üst bilgi − iki pay − görsel sütununun payları (2 × 2rem) − altındaki denetimler (4rem) */
  /* boşluklar ve başlık ekran yüksekliğiyle de sınırlı: 900 px ve üstünde tam değerler, kısa ekranlarda biraz sıkışır ki kahraman sığsın */
  /* 900 px ve üstü: 1.6rem / 3.5rem; altında doğrusal azalır (768 px'te ~18 / ~40 px) */
  .kahraman{--kh-p:clamp(1.5rem,5vh,5rem);--kh-k:clamp(.85rem,calc(7.2vh - 2.2rem),1.6rem);--kh-b:clamp(1.5rem,calc(14.8vh - 4.3rem),3.5rem);padding-block:var(--kh-p)}
  .mercek--kahraman{width:min(100%,35rem,calc(100vh - 5.25rem - 2 * var(--kh-p) - 8rem));width:min(100%,35rem,calc(100svh - 5.25rem - 2 * var(--kh-p) - 8rem))}
  .kahraman__ic{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:4rem}
  .kahraman__gorsel{padding-block:2rem}
  .kahraman__ekler{display:contents}
  .kahraman__rakam{position:absolute;inset-inline-start:0;bottom:17%;box-shadow:var(--golge)}
  .kahraman__film{position:absolute;inset-inline-end:0;top:5%}
}
/* fareyle derinlik (site.js › initParalaks): kahramanda ve iç sayfa başlarında katmanlar imlecin tersine, derinliğe göre kayar; düğmeler yerinde */
@media (min-width:64rem) and (hover:hover) and (pointer:fine){
  .mercek--kahraman{translate:calc(var(--fx,0) * -12px) calc(var(--fy,0) * -12px)}
  .kahraman .mercek--kahraman .yay{translate:calc(var(--fx,0) * -9px) calc(var(--fy,0) * -9px)}
  .kahraman__rakam{translate:calc(var(--fx,0) * -24px) calc(var(--fy,0) * -18px)}
  .kahraman__film{translate:calc(var(--fx,0) * -28px) calc(var(--fy,0) * -20px)}
  .yay--kahraman{translate:calc(var(--fx,0) * 8px) calc(var(--fy,0) * 8px)}
  /* iç sayfa başları: aynı hareket (mercek, yayları, arkadaki büyük yay) */
  .mercek--kucuk{translate:calc(var(--fx,0) * -12px) calc(var(--fy,0) * -12px)}
  .sayfa-basi .mercek--kucuk .yay{translate:calc(var(--fx,0) * -9px) calc(var(--fy,0) * -9px)}
  .sayfa-basi > .yay--bant{translate:calc(var(--fx,0) * 8px) calc(var(--fy,0) * 8px)}
}

/* ---------- bölüm iskeleti ---------- */
.bolum{padding-block:var(--bolum)}
.bolum--kagit{background:var(--zemin-2)}
.bolum:not(.bolum--kagit)+.bolum:not(.bolum--kagit){padding-top:0}
.bolum--sik{padding-block:calc(var(--bolum)*.6)}
.bas{display:flex;align-items:end;justify-content:space-between;gap:1.5rem 2.5rem;flex-wrap:wrap;margin-bottom:var(--ic)}
.bas .b2{max-width:22ch}
.bas__yan{flex:0 1 auto;max-width:100%}
.bos-not{text-align:center;margin:1.5rem auto 0}

/* ---------- makine aileleri ---------- */
.aileler{display:grid;gap:1.25rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.aile{position:relative;display:flex;flex-direction:column;min-height:24rem;padding:1.75rem 1.75rem 9rem;border-radius:var(--r);background:var(--zemin-2);color:var(--metin);text-decoration:none;overflow:hidden;transition:background .3s,transform .3s}
.aile__no{font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu-ink)}
.aile h3{font-size:1.45rem;line-height:1.2;margin:.7rem 0 .55rem}
.aile p{color:var(--govde);font-size:.95rem;line-height:1.55;max-width:28ch}
.aile__git{margin-top:auto;padding-top:1rem;display:inline-flex;align-items:center;gap:.5rem;font-weight:700;letter-spacing:.01em}
.aile__foto{position:absolute;inset-inline-end:-10%;bottom:-18%;width:78%;transition:transform .5s}
.aile:hover{background:var(--zemin-3);transform:translateY(-3px)}
.aile:hover .aile__foto{transform:translate(-3%,-3%) scale(1.03)}
@media (max-width:47.99rem){.aileler{grid-template-columns:1fr}.aile{min-height:0;padding-bottom:9rem}}
@media (min-width:64rem){.aileler{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- lacivert bant (misyon) ---------- */
.bant{position:relative;overflow:hidden;background:var(--bant);color:#fff;padding-block:var(--bolum)}
.bant__ic{position:relative;display:grid;gap:2.5rem;align-items:center}
.bant__metin .b2{max-width:20ch}
.cerceve{overflow:hidden;border-radius:var(--r);border-start-end-radius:var(--yay-kose);background:var(--lac-2)}
.cerceve img{display:block;width:100%;height:auto}
.cerceve--sol{border-start-end-radius:var(--r);border-start-start-radius:var(--yay-kose)}

@media (min-width:64rem){.bant__ic{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem}}

/* ---------- marka madalyonları ---------- */
.madalyonlar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 1.25rem;overflow:clip;margin-inline:calc(var(--oluk) * -1);padding-inline:var(--oluk)}
.madalyon{display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none;color:var(--metin)}
.madalyon__foto{position:relative;width:min(100%,11rem);aspect-ratio:1;margin-bottom:1rem}
.madalyon__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--cizgi-2);transition:transform .5s}
.yay--madalyon{inset:-10%;width:120%;height:120%;color:var(--lac);opacity:.22;transition:opacity .4s,transform .6s cubic-bezier(.2,.7,.2,1),color .4s}
.yay--madalyon path{stroke-width:2.6}
.madalyon:hover .yay--madalyon,.madalyon:focus-visible .yay--madalyon{opacity:1;color:var(--metin);transform:rotate(16deg)}
.madalyon:hover .madalyon__foto img{transform:scale(1.04)}
.madalyon__ad{font-weight:700;font-size:1.1rem;letter-spacing:.01em}
.madalyon__sayi{font-size:.85rem;font-weight:700;color:var(--vurgu-ink);margin-top:.2rem;letter-spacing:.01em}
.madalyon__aile{font-size:.8rem;color:var(--sessiz);margin-top:.2rem}
@media (min-width:48rem){.madalyonlar{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:64rem){.madalyonlar{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* ---------- rakamlar (yay göstergeleri) ---------- */
.rakamlar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.gosterge{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:13rem;padding:1.5rem;border-radius:var(--r);background:var(--bant);color:#fff;overflow:hidden}
.gosterge svg{position:absolute;inset-inline-end:1rem;top:1rem;width:6.5rem;height:6.5rem}
.gosterge__iz{fill:none;stroke:rgba(255,255,255,.14);stroke-width:4}
.gosterge__dolu{fill:none;stroke:var(--vurgu);stroke-width:4;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset 1.4s cubic-bezier(.2,.7,.2,1)}
.gosterge b{display:inline-block;font-size:clamp(2.2rem,3vw,2.9rem);line-height:1;letter-spacing:0;font-variant-numeric:tabular-nums}
.gosterge b em{font-style:normal;color:var(--vurgu)}
.gosterge > span{font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acik-sessiz);margin-top:.55rem}
@media (min-width:64rem){.rakamlar{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- 01/02/03 kartlar ---------- */
.iddialar{display:grid;gap:1.25rem;margin-top:1.25rem}
.iddia{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);overflow:hidden}
.iddia__foto{aspect-ratio:8/3;background:var(--zemin-2)}
.iddia__foto img{width:100%;height:100%;object-fit:cover}
.iddia__foto--harita{background:#fff;padding:.35rem;border-bottom:1px solid var(--cizgi)}
.iddia__foto--harita img{object-fit:contain}
.iddia__metin{padding:1.5rem 1.6rem 1.75rem}
.iddia__no{font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--vurgu-ink)}
.iddia h3{font-size:1.3rem;margin:.5rem 0 .5rem}
.iddia__metin p+p,.iddia__metin h3+p{color:var(--govde);line-height:1.6}
@media (min-width:64rem){.iddialar{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- sekmeler + ürün kartları ---------- */
.sekmeler{display:inline-flex;gap:.2rem;padding:.3rem;border-radius:1.75rem;background:var(--zemin-2);flex-wrap:wrap;max-width:100%}
.sekmeler button{border:0;background:none;padding:.6rem 1rem;border-radius:999px;font-weight:700;font-size:.9rem;color:var(--govde);cursor:pointer;transition:background .25s,color .25s;letter-spacing:.01em}
.sekmeler button:hover{color:var(--lac)}
.sekmeler button[aria-selected="true"]{background:var(--dugme-zemin);color:var(--dugme-metin)}
.urunler{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.urun{display:flex;flex-direction:column;background:var(--zemin-2);border-radius:var(--r);padding:.75rem .75rem 1.25rem;text-decoration:none;color:var(--metin);transition:transform .3s,box-shadow .3s,background .3s}
.urun__foto{display:block;width:100%;aspect-ratio:1;border-radius:calc(var(--r) - .375rem);overflow:hidden;background:#fff;margin:0 0 1.1rem;box-shadow:inset 0 0 0 1px rgba(20,21,24,.06)}
.urun__foto img{width:100%;height:100%;object-fit:contain;padding:13%;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.urun:hover .urun__foto img{transform:scale(1.04)}
.urun__metin{display:flex;flex-direction:column;flex:1;padding-inline:.5rem}
.urun__marka{display:block;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu-ink)}
.urun h3{font-size:1.08rem;line-height:1.3;margin:.4rem 0 .35rem}
.urun__kod{display:block;font-size:.84rem;color:var(--sessiz);font-variant-numeric:tabular-nums}
.urun__teklif{margin-top:auto;padding-top:1rem;display:inline-flex;align-items:center;gap:.5rem;font-weight:700;letter-spacing:.01em}
.urun:hover{transform:translateY(-3px)}
.urun h3,.urun__marka{overflow-wrap:anywhere}
@media (max-width:23.99rem){.urunler{grid-template-columns:1fr}}
@media (min-width:48rem){.urunler{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:64rem){.urunler{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- sanal katalog ---------- */
.vitrin{display:grid;gap:1.5rem;justify-items:center}
.vitrin__ana{width:min(100%,30rem)}
.vitrin__ana img{background:#fff;box-shadow:inset 0 0 0 1px var(--cizgi)}
.vitrin__kucukler{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.vitrin__kucukler button{width:5.5rem;height:5.5rem;border-radius:50%;border:2px solid transparent;padding:.25rem;background:var(--yuzey);cursor:pointer;transition:border-color .25s}
.vitrin__kucukler img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.vitrin__kucukler button[aria-pressed="true"]{border-color:var(--metin)}
@media (min-width:64rem){.vitrin{grid-template-columns:minmax(0,30rem) auto;justify-content:center;align-items:center;gap:3.5rem}.vitrin__kucukler{flex-direction:column}}

/* ---------- ikili yerleşim ---------- */
.ayrik{display:grid;gap:clamp(2rem,5vw,5rem);align-items:center}
.ayrik--ust{align-items:start}
.mercek--harita{width:min(100%,28rem);justify-self:center}
.mercek--harita img{background:#fff;box-shadow:0 0 0 1px var(--cizgi)}
@media (min-width:64rem){.ayrik{grid-template-columns:repeat(2,minmax(0,1fr))}.ayrik--harita{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}

/* ---------- SSS ---------- */
.sss{display:flex;flex-direction:column;gap:.6rem}
.sss__madde{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r-k)}
.sss__madde summary{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.4rem;cursor:pointer;list-style:none}
.sss__madde summary::-webkit-details-marker{display:none}
.sss__no{color:var(--vurgu-ink);font-weight:700;font-size:.8rem;min-width:2ch;letter-spacing:.01em}
.sss__soru{flex:1;font-weight:700;font-size:1.05rem;line-height:1.35;letter-spacing:.01em}
.sss__ok{color:var(--sessiz);transition:transform .3s}
.sss__madde[open] .sss__ok{transform:rotate(180deg)}
.sss__cevap{padding:0 1.4rem 1.3rem;padding-inline-start:3.6rem;color:var(--govde);line-height:1.65}
.sss__cevap p{margin:0 0 .6rem}
.sss__cevap p:last-child{margin:0}
.bolum:not(.bolum--kagit) .sss__madde{background:var(--zemin-2);border-color:transparent}

/* ---------- çağrı bandı ---------- */
.cagri{position:relative;overflow:hidden;background:var(--bant);color:#fff;padding-block:var(--bolum)}
.cagri__ic{position:relative;display:grid;gap:2.5rem;align-items:center}
.cagri .b2{max-width:18ch}
.cagri__not{font-size:.85rem;color:var(--acik-sessiz);margin-top:1rem;line-height:1.6}
@media (min-width:64rem){.cagri__ic{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:4rem}}

/* ---------- alt bilgi ---------- */
.alt{position:relative;overflow:hidden;background:var(--lac-koyu);color:var(--acik-govde);padding-top:var(--bolum)}
.alt .kap{position:relative}
.alt__sutunlar{display:grid;gap:2.5rem 2rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.alt__marka{grid-column:1/-1}
/* telefonda/tablette İletişim sütunu tam genişlik: uzun resmî adres (ticaret unvanı + OSB adresi, 2026-10-14) dar yarım sütunda
   kelime kelime kırılıyordu; zaten iki sütunlu ızgarada tek başına kalan son sütun */
@media (max-width:63.99rem){.alt__sutunlar > :last-child{grid-column:1/-1}}
.alt__marka p{max-width:36ch;margin-top:1.25rem;line-height:1.65}
.alt__sosyal{display:flex;gap:.5rem;margin-top:1.25rem}
.alt__sosyal a{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--cizgi-k);color:#fff;transition:background .25s}
.alt__sosyal a:hover{background:rgba(255,255,255,.1)}
.alt h3{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:1rem}
.alt li{margin-bottom:.5rem}
.alt a{color:var(--acik-govde);text-decoration:none}
.alt a:hover{color:#fff}
.alt__tel{font-weight:700;color:#fff!important;font-size:1.1rem;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.alt__iletisim p{line-height:1.6;margin-top:.25rem;text-wrap:pretty}   /* uzun unvan satırında «Şti.» tek başına alt satıra düşmesin */
.alt__not{display:grid;gap:.75rem;border-top:1px solid var(--cizgi-k);margin-top:var(--ic);padding-block:1.75rem}
.alt__not-bas{font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.alt__not p+p{font-size:.9rem;line-height:1.65;color:var(--acik-sessiz)}
.alt__yasal{display:flex;align-items:baseline;gap:1.5rem;flex-wrap:wrap;border-top:1px solid var(--cizgi-k);padding-block:1.5rem 2rem;font-size:.9rem}
.alt__imza{margin-inline-start:auto;display:inline-block;width:4.4rem;position:relative;top:.235rem}
.alt__imza svg{width:100%;height:auto;color:#fff}
@media (min-width:64rem){.alt__sutunlar{grid-template-columns:1.6fr 1fr 1fr 1.3fr}.alt__marka{grid-column:auto}.alt__not{grid-template-columns:.3fr 1fr}}

/* ---------- film ---------- */
.film{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(8,8,10,.93);padding:clamp(1rem,4vw,3rem)}
.film__cerceve{width:min(72rem,100%);aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.film__cerceve iframe{width:100%;height:100%;border:0;display:block}
.film__kapat{position:absolute;top:1.25rem;inset-inline-end:1.25rem}
body.v-open{overflow:hidden}
.film-kutu{position:relative;display:block;width:100%;margin-top:var(--ic);padding:0;border:0;cursor:pointer;overflow:hidden;aspect-ratio:3/2;max-width:56rem;margin-inline:auto;border-radius:var(--r);border-start-end-radius:var(--yay-kose);background:var(--lac);color:#fff}
.film-kutu img{width:100%;height:100%;object-fit:cover;opacity:.7;transition:transform .6s,opacity .4s}
.film-kutu:hover img{transform:scale(1.03);opacity:.8}
.film-kutu__oynat{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:1rem;font-weight:700;font-size:1.1rem;white-space:nowrap;letter-spacing:.01em}

/* ---------- iç sayfa başı ---------- */
.sayfa-basi{position:relative;overflow:hidden;background:var(--bant);color:#fff;padding-block:clamp(2.25rem,5vw,4.5rem) clamp(3rem,6vw,5rem)}
.sayfa-basi__ic{position:relative;display:grid;gap:2.5rem;align-items:center}
.sayfa-basi .b1{max-width:14ch}
.mercek--kucuk{width:min(100%,16rem);justify-self:center}
.kirinti ul{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1.25rem;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--acik-sessiz)}
.kirinti a{color:inherit;text-decoration:none}
.kirinti a:hover{color:#fff}
.kirinti li[aria-hidden] svg{width:.6rem;height:.6rem;opacity:.6}
.kirinti [aria-current]{color:#fff}
@media (min-width:64rem){.sayfa-basi__ic{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}.mercek--kucuk{width:min(100%,22rem)}}

/* ---------- arama sayfası ---------- */
.arama-kutusu{max-width:54rem}
.sonuclar{margin-top:var(--ic)}
.sonuclar:empty{margin:0}
.sonuc-bas{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;padding-bottom:1rem;border-bottom:1px solid var(--cizgi);margin-bottom:1.25rem}
.sonuc-bas b{font-size:1.4rem}
.sonuc-bas .not{color:var(--sessiz);font-size:.9rem}
.sonuc-liste{display:grid;gap:1rem}
.sonuc{display:flex;flex-direction:column;gap:1rem;padding:.75rem .75rem 1.25rem;background:var(--zemin-2);border-radius:var(--r)}
.sonuc__foto{position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:0;border-radius:calc(var(--r) - .375rem);background:#fff;overflow:hidden;cursor:zoom-in;box-shadow:inset 0 0 0 1px rgba(20,21,24,.06)}
.sonuc__foto img{width:100%;height:100%;object-fit:contain;padding:13%;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.sonuc__foto:hover img{transform:scale(1.04)}
.sonuc__foto--yok{cursor:default}
.sonuc__foto--yok img{opacity:.5;padding:28%}
.sonuc__buyut{position:absolute;inset-inline-end:.6rem;bottom:.6rem;width:2.3rem;height:2.3rem;border-radius:50%;display:grid;place-items:center;background:#141518;color:#fff;opacity:.85;transition:opacity .25s}
.sonuc__foto:hover .sonuc__buyut,.sonuc__foto:focus-visible .sonuc__buyut{opacity:1}
.sonuc__metin{min-width:0;padding-inline:.5rem;display:flex;flex-direction:column;flex:1}
.sonuc__marka{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu-ink);margin-bottom:.3rem}
.sonuc__ad{font-weight:700;line-height:1.35;font-size:1.05rem;overflow-wrap:anywhere;letter-spacing:.01em}
.sonuc__kod{font-size:.85rem;color:var(--sessiz);margin-top:.3rem;overflow-wrap:anywhere}
.sonuc__teklif{display:inline-flex;align-items:center;gap:.4rem;margin-top:auto;padding-top:.8rem;font-weight:700;font-size:.9rem;color:var(--vurgu-ink);text-decoration:none;letter-spacing:.01em}
.bos{background:var(--zemin-2);border-radius:var(--r);padding:clamp(1.5rem,4vw,2.5rem)}
.bos h3{font-size:1.4rem}
.bos p{color:var(--govde);margin-top:.75rem;max-width:60ch;line-height:1.65}
.daha{display:flex;justify-content:center;margin-top:1.75rem}
.sonuc-liste{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:21.99rem){.sonuc-liste{grid-template-columns:1fr}}
@media (min-width:48rem){.sonuc-liste{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:64rem){.sonuc-liste{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}}

/* ---------- parça tipleri ---------- */
.tipler{display:grid;gap:.75rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.tip{display:flex;justify-content:space-between;align-items:center;gap:.75rem;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:999px;padding:.8rem 1rem;padding-inline-start:1.4rem;text-decoration:none;color:var(--metin);font-weight:700;transition:border-color .25s,transform .25s;letter-spacing:.01em}
.tip__ad{min-width:0}
.tip__sayi{flex:none;font-size:.78rem;color:var(--vurgu-ink);background:var(--zemin-2);border-radius:999px;padding:.4rem .7rem;white-space:nowrap}
.tip:hover{border-color:var(--metin);transform:translateY(-2px)}
@media (max-width:47.99rem){.tipler{grid-template-columns:1fr}}
@media (min-width:64rem){.tipler{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:80rem){.tipler{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- değerler ---------- */
.degerler{display:grid;gap:1.25rem}
.degerler--ikonlu{margin-top:var(--ic)}
.deger{background:var(--zemin-2);border-radius:var(--r);padding:2rem}
.deger__no{font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--vurgu-ink)}
.deger__ikon{display:grid;place-items:center;width:3.75rem;height:3.75rem;border-radius:50%;border:1px solid var(--cizgi-2);background:var(--yuzey);color:var(--metin)}
.deger h3{font-size:1.35rem;margin:1rem 0 .6rem}
.deger p{color:var(--govde);line-height:1.65}
@media (min-width:64rem){.degerler{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- sevkiyat bölgeleri ---------- */
.bolgeler{display:grid;gap:1rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.bolge{position:relative;overflow:hidden;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);padding:1.5rem;min-height:9.5rem}
.bolge__no{font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--vurgu-ink)}
.bolge h3{font-size:1.25rem;margin-top:.6rem}
.yay--bolge{inset-inline-end:-28%;bottom:-48%;width:95%;height:95%;color:var(--metin);opacity:.08}
.yay--bolge path{stroke-width:3}
@media (min-width:64rem){.bolgeler{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* ---------- iletişim ---------- */
.iletisim{display:grid;gap:2rem;align-items:start}
.iletisim__form{background:var(--zemin-2);border-radius:var(--r);padding:clamp(1.5rem,3vw,2.5rem)}
.form-izgara{display:grid;gap:.75rem}
.alan{display:flex;flex-direction:column;gap:.3rem;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r-k);padding:.8rem 1.25rem;transition:border-color .25s,box-shadow .25s}
.alan:focus-within{border-color:var(--vurgu-ink);box-shadow:0 0 0 3px var(--odak)}
.alan label{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sessiz)}
.alan input,.alan textarea{border:0;background:none;outline:none;padding:.15rem 0;font-weight:600;font-size:1rem;color:var(--metin);resize:vertical;letter-spacing:.01em}
.form-not{font-size:.8rem;color:var(--sessiz);margin-top:1rem;line-height:1.6}
.form-not--hata{color:#B3261E;font-weight:700;letter-spacing:.01em}
:is(html[data-tema="koyu"]) .form-not--hata{color:#FFB4AB}
@media (prefers-color-scheme:dark){html:not([data-tema="acik"]) .form-not--hata{color:#FFB4AB}}
/* istenmeyen ileti tuzağı: insanlar görmez, botlar doldurur */
.alan--tuzak{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;padding:0;border:0}
.secilen{display:flex;align-items:center;gap:1.1rem;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r-k);padding:.75rem;padding-inline-end:1.25rem;margin-bottom:1rem}
.secilen__foto{flex:none;width:6.5rem}
.secilen__buyut{display:block;width:100%;aspect-ratio:1;padding:0;border:0;border-radius:calc(var(--r-k) - .25rem);background:#fff;overflow:hidden;cursor:zoom-in;box-shadow:inset 0 0 0 1px rgba(20,21,24,.08)}
.secilen__buyut img{width:100%;height:100%;object-fit:contain;padding:12%}
.secilen__metin{min-width:0;padding-block:.25rem}
.secilen__kod{font-size:.85rem;color:var(--sessiz);margin-top:.25rem;overflow-wrap:anywhere}
@media (min-width:48rem){.secilen__foto{width:9rem}}
.secilen__etiket{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu-ink)}
.secilen__deger{font-weight:700;margin-top:.25rem;word-break:break-word;letter-spacing:.01em}
.onay{display:flex;gap:1rem;align-items:flex-start;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);padding:1.5rem}
.onay svg{color:var(--vurgu-ink);flex:none}
.onay b{font-size:1.15rem}
.onay p{color:var(--govde);margin-top:.35rem;line-height:1.6}
.onay__ref{font-weight:700;color:var(--metin);letter-spacing:.01em}
.bilgi{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);padding:1.75rem}
.bilgi+.bilgi{margin-top:1rem}
.bilgi h2{font-size:1.1rem;margin-bottom:.5rem}
.bilgi__satir{display:grid;gap:.2rem;padding:.9rem 0;border-top:1px solid var(--cizgi)}
.bilgi__satir:last-child{padding-bottom:0}
.bilgi__k{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sessiz)}
.bilgi__tel{font-size:1.3rem;font-weight:700;color:var(--metin);text-decoration:none;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.bilgi a{color:var(--metin);font-weight:600;text-decoration:none;letter-spacing:.01em}
.bilgi a:hover{color:var(--vurgu-ink)}
.bilgi p{line-height:1.6}
@media (min-width:48rem){.form-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}.alan--tam{grid-column:1/-1}}
@media (min-width:64rem){.iletisim{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:2.5rem}}
@media (min-width:64rem){.bolum:not(.bolum--kagit) .bilgi,.bolum:not(.bolum--kagit) .bolge{background:var(--yuzey)}}

/* ---------- belirme (tek seferlik, yumuşak) ---------- */
.js .belir{opacity:0;transform:translateY(1rem);transition:opacity .75s cubic-bezier(.2,.6,.2,1),transform .75s cubic-bezier(.2,.6,.2,1)}
.js .belir.in{opacity:1;transform:none}
.anim-yok *,.anim-yok *::before,.anim-yok *::after{transition:none!important;animation:none!important}
.anim-yok .belir{opacity:1!important;transform:none!important}
.anim-yok .mercek--kahraman img.acik{opacity:1}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .js .belir{opacity:1;transform:none}
}

/* ---------- koyu tema (rol token'ları) ---------- */
html[data-tema="koyu"]{--zemin:#0E0F11;--zemin-2:#16171A;--zemin-3:#1E2024;--yuzey:#1C1E22;--bant:#1A1C21;--metin:#F2F2F4;--govde:#C3C5CB;--sessiz:#9A9DA6;--cizgi:rgba(255,255,255,.1);--cizgi-2:rgba(255,255,255,.24);--vurgu-ink:#CDD0D8;--isaret:rgba(255,255,255,.16);--odak:rgba(255,255,255,.18);--dugme-zemin:#F2F2F4;--dugme-zemin-2:#DCDDE2;--dugme-metin:#141518;--golge-acik:0 14px 40px rgba(0,0,0,.4);--ikon-gunes:block;--ikon-ay:none;color-scheme:dark}
@media (prefers-color-scheme:dark){
  html:not([data-tema="acik"]){--zemin:#0E0F11;--zemin-2:#16171A;--zemin-3:#1E2024;--yuzey:#1C1E22;--bant:#1A1C21;--metin:#F2F2F4;--govde:#C3C5CB;--sessiz:#9A9DA6;--cizgi:rgba(255,255,255,.1);--cizgi-2:rgba(255,255,255,.24);--vurgu-ink:#CDD0D8;--isaret:rgba(255,255,255,.16);--odak:rgba(255,255,255,.18);--dugme-zemin:#F2F2F4;--dugme-zemin-2:#DCDDE2;--dugme-metin:#141518;--golge-acik:0 14px 40px rgba(0,0,0,.4);--ikon-gunes:block;--ikon-ay:none;color-scheme:dark}
}
html[data-tema="acik"]{color-scheme:light}
.ust{color-scheme:dark}
.tema .ikon-gunes{display:var(--ikon-gunes)}
.tema .ikon-ay{display:var(--ikon-ay)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}

/* ---------- dil seçimi ---------- */
.dil{position:relative}
.dil__dugme span{font-size:.78rem;font-weight:700;letter-spacing:.06em}
.dil__liste{position:absolute;top:calc(100% + .5rem);inset-inline-end:0;min-width:10.5rem;margin:0;padding:.4rem;list-style:none;background:var(--yuzey);color:var(--metin);border:1px solid var(--cizgi);border-radius:var(--r-k);box-shadow:var(--golge);z-index:70;color-scheme:light dark}
.dil__liste a{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:.75rem;text-decoration:none;font-weight:700;white-space:nowrap;letter-spacing:.01em}
.dil__liste a::before{content:"";width:.5rem;height:.5rem;border-radius:50%;border:2px solid var(--cizgi-2);flex:none}
.dil__liste a[aria-current]::before{background:var(--metin);border-color:var(--metin)}
.dil__liste a:hover{background:var(--zemin-2)}
.menu-kat__ayar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1.25rem;padding-top:1.1rem;border-top:1px solid var(--cizgi)}
.menu-kat__diller{display:inline-flex;gap:.2rem;padding:.25rem;border-radius:999px;background:var(--zemin-2);margin:0;list-style:none}
.menu-kat__diller a{display:block;padding:.5rem .85rem;border-radius:999px;font-size:.88rem;font-weight:700;text-decoration:none;letter-spacing:.01em}
.menu-kat__diller a[aria-current]{background:var(--dugme-zemin);color:var(--dugme-metin)}
.menu-kat__tema{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--cizgi-2);background:none;color:var(--metin);border-radius:999px;padding:.5rem;padding-inline-end:1rem;font-weight:700;cursor:pointer;letter-spacing:.01em}

/* ---------- yerinde dil değişimi: belirmeler ve kahraman çizimi yeniden oynamaz ---------- */
.yerinde .kahraman .mercek .yay path{animation:none;stroke-dashoffset:0}
.yerinde .belir{transition:none}

/* ---------- Arapça (RTL) ---------- */
@font-face{font-family:"Readex Pro";font-style:normal;font-weight:160 700;font-display:swap;src:url(/assets/fonts/readexpro-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:"Readex Pro";font-style:normal;font-weight:160 700;font-display:swap;src:url(/assets/fonts/readexpro-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}
html[lang="ar"]{--font:"Readex Pro","Questrial",system-ui,sans-serif}
html[lang="ar"] *{letter-spacing:0}
html[lang="ar"] body{line-height:1.75}
html[lang="ar"] .b1{line-height:1.22;letter-spacing:0}
html[lang="ar"] .b2{line-height:1.28}
html[lang="ar"] .aile h3,html[lang="ar"] .deger h3,html[lang="ar"] .iddia h3{line-height:1.4}
[dir="rtl"] :is(.dugme__ok svg,.aile__git svg,.urun__teklif svg,.ipucu__baglanti svg,.sonuc__teklif svg){transform:scaleX(-1)}
[dir="rtl"] .dugme:hover .dugme__ok{transform:translateX(-3px)}
[dir="rtl"] .aile:hover .aile__foto{transform:translate(3%,-3%) scale(1.03)}

[dir="rtl"] :is(.urun__kod,.hit__kod,.sonuc__kod,.secilen__deger,.secilen__kod,.onay__ref,.ust__tel,.alt__tel,.bilgi__tel,.alt__iletisim p,.bilgi p,.kirinti ul,.hit__ad,.sonuc__ad,.urun h3){direction:ltr;unicode-bidi:isolate}
[dir="rtl"] :is(.urun__kod,.sonuc__kod,.secilen__deger,.alt__iletisim p,.bilgi p,.urun h3,.sonuc__ad){text-align:right}
[dir="rtl"] .kirinti ul{direction:rtl}
[dir="rtl"] .kirinti li{direction:ltr;unicode-bidi:isolate}
[dir="rtl"] .yay--madalyon{transform:scaleX(-1)}
[dir="rtl"] .madalyon:hover .yay--madalyon,[dir="rtl"] .madalyon:focus-visible .yay--madalyon{transform:scaleX(-1) rotate(16deg)}

/* ---------- büyüteç (ürün fotoğrafı) ---------- */
picture{display:contents}
source{display:none}
.buyutec{position:fixed;inset:0;z-index:210;display:grid;place-items:center;padding:clamp(1rem,4vw,3rem);background:rgba(8,8,10,.86)}
.buyutec__panel{position:relative;width:min(40rem,100%);max-height:100%;overflow:auto;background:var(--yuzey);color:var(--metin);border-radius:var(--r);padding:1rem 1rem 1.5rem;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.buyutec__foto{aspect-ratio:1;width:min(100%,58vh);margin-inline:auto;background:#fff;border-radius:calc(var(--r) - .375rem);display:grid;place-items:center;overflow:hidden}
.buyutec__foto img{width:100%;height:100%;object-fit:contain;padding:2%}
.buyutec__kapat{position:absolute;top:1.6rem;inset-inline-end:1.6rem;z-index:1;background:#fff;color:#141518;border-color:#C8CAD2}
.buyutec__ad{font-size:1.25rem;font-weight:700;margin:1.1rem .5rem .25rem;overflow-wrap:anywhere;letter-spacing:.01em}
.buyutec__kod{color:var(--sessiz);font-size:.92rem;margin:0 .5rem 1.1rem;overflow-wrap:anywhere}
.buyutec .dugme{margin-inline:.5rem}
[dir="rtl"] :is(.buyutec__ad,.buyutec__kod){direction:ltr;unicode-bidi:isolate;text-align:right}


/* ---------- ürün kartı çerçevesi: üzerine gelince ince gri çizgi kartın çevresini dolaşarak çizilir ----------
   Yalnız ürün kartları (ana sayfa seçkisi, ürünler sayfası sonuçları). Kart rengi değişmez; conic maske + @property. */
@property --cizim{syntax:"<percentage>";inherits:false;initial-value:0%}
:is(.urun,.sonuc){position:relative}
:is(.urun,.sonuc)::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;
  border:1px solid var(--cizgi-urun);
  -webkit-mask:conic-gradient(from 0deg at 50% 50%,#000 var(--cizim),transparent 0);
          mask:conic-gradient(from 0deg at 50% 50%,#000 var(--cizim),transparent 0);
  transition:--cizim .7s cubic-bezier(.45,.05,.25,1)}
:root{--cizgi-urun:#9A9DA6}
html[data-tema="koyu"]{--cizgi-urun:#6E717B}
@media (prefers-color-scheme:dark){html:not([data-tema="acik"]){--cizgi-urun:#6E717B}}
.urun:is(:hover,:focus-visible)::after,.sonuc:hover::after,.sonuc:has(:focus-visible)::after{--cizim:100%}
[dir="rtl"] :is(.urun,.sonuc)::after{
  -webkit-mask:conic-gradient(from 0deg at 50% 50%,transparent calc(100% - var(--cizim)),#000 0);
          mask:conic-gradient(from 0deg at 50% 50%,transparent calc(100% - var(--cizim)),#000 0)}
@media (prefers-reduced-motion:reduce){:is(.urun,.sonuc)::after{transition:none}}

/* ---------- yasal sayfalar (KVKK, kullanım koşulları) ---------- */
.yasal{max-width:48rem}
.yasal__bolum+.yasal__bolum{margin-top:2.25rem;padding-top:2.25rem;border-top:1px solid var(--cizgi)}
.yasal h2{font-size:clamp(1.2rem,1.6vw,1.4rem);line-height:1.3;margin-bottom:.85rem}
.yasal p{color:var(--govde);line-height:1.75;margin:0 0 .85rem}
.yasal p:last-child{margin-bottom:0}
.yasal ul{margin:0 0 .85rem;padding:0;list-style:none;display:grid;gap:.55rem}
.yasal li{position:relative;padding-inline-start:1.4rem;color:var(--govde);line-height:1.7}
.yasal li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;width:.5rem;height:.5rem;border-radius:50%;border:2px solid var(--metin)}
.yasal__not{background:var(--zemin-2);border-radius:var(--r-k);padding:1rem 1.25rem;color:var(--metin)!important;font-weight:600;letter-spacing:.01em}
.yasal__tarih{margin-top:2.5rem!important;font-size:.85rem;color:var(--sessiz)!important;font-weight:700;letter-spacing:.06em}
.form-not--kvkk a{color:var(--metin);font-weight:700;letter-spacing:.01em}

/* ---------- marka sayfası: taranabilir parça listesi ---------- */
.liste-ara{display:flex;align-items:center;gap:.75rem;max-width:40rem;background:var(--yuzey);border:1px solid var(--cizgi-2);border-radius:999px;padding:.35rem 1.25rem;margin-bottom:1.25rem}
.liste-ara .arama__ikon{color:var(--sessiz)}
.liste-ara input{flex:1 1 auto;width:0;min-width:0;height:2.8rem;border:0;background:none;outline:none;font-weight:600;font-size:1rem;color:var(--metin);letter-spacing:.01em}
.liste-ara input::placeholder{color:var(--sessiz);font-weight:500}
.liste-ara__sayi{flex:none;font-size:.82rem;font-weight:700;color:var(--sessiz);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.liste-kap{border:1px solid var(--cizgi);border-radius:var(--r);overflow:hidden;background:var(--yuzey)}
.liste{margin:0;padding:0;list-style:none}
.liste__satir{display:grid;grid-template-columns:6.5rem minmax(0,1fr) minmax(0,10rem) minmax(0,15rem) auto;align-items:center;column-gap:1.5rem;
  padding:.7rem 1rem;border-bottom:1px solid var(--cizgi);content-visibility:auto;contain-intrinsic-size:auto 8rem}
.liste__satir:last-child{border-bottom:0}
.liste__satir:hover{background:var(--zemin-2)}
.liste__buyut,.liste__yok{display:block;width:6.5rem;height:6.5rem;border-radius:.75rem;background:#fff;overflow:hidden;padding:0;border:0;box-shadow:inset 0 0 0 1px rgba(20,21,24,.08)}
.liste__buyut{cursor:zoom-in}
.liste__buyut img,.liste__yok img{width:100%;height:100%;object-fit:contain;padding:6%}
.liste__yok img{opacity:.45;padding:24%}
.liste__parca{display:block;font-weight:700;line-height:1.35;overflow-wrap:anywhere;letter-spacing:.01em}
.liste__tip{display:block;font-size:.8rem;color:var(--sessiz);margin-top:.15rem}
.liste__kod,.liste__oem{color:var(--govde);font-size:.92rem;overflow-wrap:anywhere}
.liste__teklif{text-align:end;white-space:nowrap;padding-inline-end:1.75rem}
.liste__teklif a{font-weight:700;font-size:.9rem;color:var(--metin);letter-spacing:.01em}
.liste-bos{margin-top:1rem;color:var(--sessiz)}
@media (max-width:47.99rem){
  .liste__satir{grid-template-columns:5.5rem minmax(0,1fr);column-gap:1rem;row-gap:.2rem;align-items:start;padding:.9rem 1rem;contain-intrinsic-size:auto 9.5rem}
  .liste__buyut,.liste__yok{width:5.5rem;height:5.5rem}
  .liste__foto{grid-row:1/5}
  .liste__teklif{text-align:start;margin-top:.35rem;padding-inline-end:0}
}
}
[dir="rtl"] :is(.liste__parca,.liste__kod,.liste__oem){direction:ltr;unicode-bidi:isolate;text-align:right}

/* Makine aileleri kağıt zeminli bölümdeyse: kartlar zeminle aynı tonda kalmasın diye bölüm bir ton koyu */
:root{--zemin-4:#E3E4E9}
html[data-tema="koyu"]{--zemin-4:#0A0B0D}
@media (prefers-color-scheme:dark){html:not([data-tema="acik"]){--zemin-4:#0A0B0D}}
.bolum--aileler{background:var(--zemin-4)}

/* ---------- açık temada kahraman beyaz (2026-10-11); koyu temada siyah bant kalır ---------- */
html[data-tema="acik"] .kahraman{background:var(--zemin-2);color:var(--metin)}
html[data-tema="acik"] .kahraman::before{background:radial-gradient(60rem 40rem at 85% 20%,rgba(20,21,24,.035),transparent 60%)}
html[data-tema="acik"] .kahraman :focus-visible{outline-color:var(--metin)}
html[data-tema="acik"] .kahraman .etiket--acik{color:var(--vurgu-ink)}
html[data-tema="acik"] .kahraman .kahraman__ozet{color:var(--govde)}
html[data-tema="acik"] .kahraman .arama{box-shadow:0 14px 40px rgba(20,21,24,.12);border:1px solid var(--cizgi-2)}
html[data-tema="acik"] .kahraman .ipucu__etiket{color:var(--sessiz)}
html[data-tema="acik"] .kahraman .ipucu button{border-color:var(--cizgi-2);background:#fff;color:var(--metin)}
html[data-tema="acik"] .kahraman .ipucu button:hover{border-color:var(--metin);background:#fff}
html[data-tema="acik"] .kahraman .ipucu__baglanti{color:var(--metin)}
html[data-tema="acik"] .kahraman .mercek .yay{color:var(--metin);opacity:.32}
html[data-tema="acik"] .kahraman .yay--kahraman{color:var(--metin);opacity:.06}
html[data-tema="acik"] .kahraman .mercek__noktalar button::before{border-color:rgba(20,21,24,.4)}
html[data-tema="acik"] .kahraman .mercek__noktalar button[aria-pressed="true"]::before{background:var(--metin);border-color:var(--metin)}
html[data-tema="acik"] .kahraman .mercek__altyazi{color:var(--sessiz)}
html[data-tema="acik"] .kahraman #mercekDur{border-color:var(--cizgi-2);color:var(--metin)}
html[data-tema="acik"] .kahraman #mercekDur:hover{background:#fff;border-color:var(--metin)}
html[data-tema="acik"] .kahraman .kahraman__rakam{border:1px solid var(--cizgi);box-shadow:0 14px 40px rgba(20,21,24,.12)}
html[data-tema="acik"] .kahraman .kahraman__film{border-color:transparent;box-shadow:0 14px 40px rgba(20,21,24,.18)}
@media (prefers-color-scheme:light){
html:not([data-tema="koyu"]) .kahraman{background:var(--zemin-2);color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman::before{background:radial-gradient(60rem 40rem at 85% 20%,rgba(20,21,24,.035),transparent 60%)}
html:not([data-tema="koyu"]) .kahraman :focus-visible{outline-color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman .etiket--acik{color:var(--vurgu-ink)}
html:not([data-tema="koyu"]) .kahraman .kahraman__ozet{color:var(--govde)}
html:not([data-tema="koyu"]) .kahraman .arama{box-shadow:0 14px 40px rgba(20,21,24,.12);border:1px solid var(--cizgi-2)}
html:not([data-tema="koyu"]) .kahraman .ipucu__etiket{color:var(--sessiz)}
html:not([data-tema="koyu"]) .kahraman .ipucu button{border-color:var(--cizgi-2);background:#fff;color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman .ipucu button:hover{border-color:var(--metin);background:#fff}
html:not([data-tema="koyu"]) .kahraman .ipucu__baglanti{color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman .mercek .yay{color:var(--metin);opacity:.32}
html:not([data-tema="koyu"]) .kahraman .yay--kahraman{color:var(--metin);opacity:.06}
html:not([data-tema="koyu"]) .kahraman .mercek__noktalar button::before{border-color:rgba(20,21,24,.4)}
html:not([data-tema="koyu"]) .kahraman .mercek__noktalar button[aria-pressed="true"]::before{background:var(--metin);border-color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman .mercek__altyazi{color:var(--sessiz)}
html:not([data-tema="koyu"]) .kahraman #mercekDur{border-color:var(--cizgi-2);color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman #mercekDur:hover{background:#fff;border-color:var(--metin)}
html:not([data-tema="koyu"]) .kahraman .kahraman__rakam{border:1px solid var(--cizgi);box-shadow:0 14px 40px rgba(20,21,24,.12)}
html:not([data-tema="koyu"]) .kahraman .kahraman__film{border-color:transparent;box-shadow:0 14px 40px rgba(20,21,24,.18)}
}
@media (max-width:20.99rem){.ust__ic{padding-inline:1rem}.ust__ic > .ust__logo{--logo:7rem}.ust__araclar .yuvarlak{--yuv:2.5rem}.ust__araclar{gap:.4rem}}
/* ---------- ilk açılış: logo animasyonu (oturumda bir kez; head betiği html.acilis koyar, site.js kaldırır) ----------
   Sayfa altında normal yüklenir; katman yalnız örter. site.js logonun kendi SVG'sini (assets/logo.svg, değiştirilmeden)
   katmana yerleştirip parçalarına sınıf verir: halka (üst ve alt yay) dönerek yerine oturur, «ataksan» harfleri sırayla
   yükselir, «Build the future» ve ® belirir; sonra katman yukarı kayar. Betik çalışmazsa düz logo görünür.
   Hareket azaltma ve ?anim=0'da hiç gösterilmez. */
.acilis-kat{display:none}
html.acilis .acilis-kat{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:#141518;color:#fff;transition:transform .8s cubic-bezier(.76,0,.24,1)}
html.acilis:not(.acilis-cikis){overflow:hidden}
.acilis-kat__ic{position:relative;width:min(74vw,27rem);transition:opacity .4s ease,transform .6s cubic-bezier(.5,0,.75,0)}
.acilis-kat__logo{display:block;width:100%;height:auto;opacity:0;animation:acilisBelir .6s 1.2s forwards}
.acilis-kat__svg{display:block;width:100%;height:auto;overflow:visible}
.acilis-kat__svg :is(path,polygon){fill:#fff}
/* parça animasyonları: açılış katmanında hemen, üst bilgi logosunda yalnız .logo-oyna varken */
.acilis-halka{transform-box:view-box;transform-origin:98.5px 65.5px}
:is(.acilis-kat__svg,.logo-oyna) .acilis-halka{animation:acilisHalka 1.15s cubic-bezier(.2,.7,.15,1) both}
:is(.acilis-kat__svg,.logo-oyna) .acilis-halka--alt{animation-delay:.08s}
:is(.acilis-kat__svg,.logo-oyna) .acilis-harf{animation:acilisHarf .6s calc(.38s + var(--i,0) * 60ms) cubic-bezier(.2,.7,.2,1) both}
:is(.acilis-kat__svg,.logo-oyna) .acilis-imza{animation:acilisImza .8s 1.02s cubic-bezier(.3,.6,.2,1) both}
:is(.acilis-kat__svg,.logo-oyna) .acilis-r{animation:acilisBelir .5s 1.45s ease both}
@keyframes acilisHalka{from{opacity:0;transform:rotate(-170deg) scale(.82)}to{opacity:1;transform:none}}
@keyframes acilisHarf{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes acilisImza{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes acilisBelir{from{opacity:0}to{opacity:1}}
html.acilis-cikis .acilis-kat{transform:translateY(-100%)}
html.acilis-cikis .acilis-kat__ic{opacity:0;transform:translateY(-2.5rem) scale(.96)}
html.acilis:not(.acilis-cikis) .kahraman .mercek .yay path{animation-play-state:paused}