/*
  Tipografi: Schibsted Grotesk — Norveçli medya grubu Schibsted için üretildi.
  Karakterli ama ciddi, Türkçe eksiksiz. Trend "AI sitesi" font listesinde yok.
  Tek aile, ağırlık aralığıyla çalışıyor — uluslararası markaların yaptığı gibi.
*/
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2.5px solid var(--yesil);outline-offset:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

:root{
  --murekkep:#100830; --murekkep-70:#4a4363; --murekkep-45:#655f7c;
  --kagit:#fff; --kagit-2:#f5f4f1; --gece:#0a0518;
  --yesil:#237a30; --yesil-parlak:#4cc45d; --mavi:#0070b8;
  --cizgi:#e4e2dc; --cizgi-gece:rgba(255,255,255,.16);
  --f:"Schibsted Grotesk",system-ui,-apple-system,sans-serif;
  --olcu:min(1560px,100% - 96px);
  --hiza:minmax(0,1fr) [ic-bas] var(--olcu) [ic-son] minmax(0,1fr);
}
@media(max-width:900px){:root{--olcu:calc(100% - 40px)}}

body{font-family:var(--f);color:var(--murekkep);background:var(--kagit);
  font-size:18px;line-height:1.55;font-synthesis:none;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.kap{display:grid;grid-template-columns:var(--hiza)}
.kap > *{grid-column:ic-bas / ic-son}
.tam{grid-column:1 / -1}

/* tipografik ölçek */
.dev{font-size:clamp(46px,8.2vw,132px);font-weight:800;line-height:.92;letter-spacing:-.045em}
.buyuk{font-size:clamp(34px,5vw,76px);font-weight:800;line-height:.98;letter-spacing:-.04em}
.orta{font-size:clamp(26px,3.4vw,46px);font-weight:700;line-height:1.08;letter-spacing:-.03em}
.giris{font-size:clamp(20px,2.3vw,32px);font-weight:400;line-height:1.4;letter-spacing:-.015em}
.etiket{font-size:12px;font-weight:700;letter-spacing:.19em;text-transform:uppercase}
.tnum{font-variant-numeric:tabular-nums}

/* ══════════ BAŞLIK ══════════ */
/* Başlık çubuğu sayfayla birlikte kaymaz. Üstteyken saydam, açılış görselinin
   üzerinde durur; aşağı kayınca buzlu cam gibi beyaza yakın yarı saydam bir
   zemin alır ve yazılar koyuya, logo kendi renklerine döner. */
.ust{position:fixed;top:0;left:0;right:0;z-index:30;padding-block:26px;
  transition:background-color .3s,backdrop-filter .3s,padding-block .3s,box-shadow .3s}
.ust.kaydi{padding-block:14px;background:rgba(252,252,250,.72);
  -webkit-backdrop-filter:saturate(1.7) blur(20px);backdrop-filter:saturate(1.7) blur(20px);
  box-shadow:0 1px 0 rgba(16,18,28,.08)}
/* Buzlu cam desteklenmiyorsa şeffaflık okunurluğu bozmasın. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .ust.kaydi{background:rgba(252,252,250,.96)}
}
.ust.kaydi img{filter:none}
.ust.kaydi nav,.ust.kaydi .diller{color:var(--murekkep)}
@media(prefers-reduced-motion:reduce){.ust{transition:none}}
.ust > div{display:flex;align-items:center;gap:44px}
.ust img{height:30px;filter:brightness(0) invert(1)}
.ust nav{display:flex;gap:34px;font-size:15px;font-weight:600;color:#fff}
.ust nav a{opacity:.82;padding-block:4px;border-bottom:1.5px solid transparent;transition:opacity .2s,border-color .2s}
.ust nav a:hover{opacity:1;border-color:var(--yesil-parlak)}
.diller{margin-inline-start:auto;display:flex;gap:14px;font-size:13px;font-weight:700;color:#fff}
.diller a,.diller span{display:inline-flex;align-items:center;min-height:24px;padding-block:4px;opacity:.55;transition:opacity .2s}
.diller a:hover{opacity:.9}
.diller a[aria-current]{opacity:1;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px;text-decoration-color:var(--yesil-parlak)}
@media(max-width:1000px){.ust nav{display:none}}

/* ══════════ 1 · AÇILIŞ ══════════ */
.acilis{position:relative;min-height:min(94dvh,900px);display:grid;grid-template-columns:var(--hiza);
  align-items:end;padding-bottom:clamp(48px,7vh,92px);isolation:isolate;overflow:hidden}
.acilis picture,.acilis img.zemin{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.acilis::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,10,4,.52) 0%,rgba(20,10,4,.1) 34%,rgba(20,10,4,.06) 52%,rgba(20,10,4,.72) 100%)}
.acilis .ic{grid-column:ic-bas / ic-son;color:#fff}
.acilis h1{max-width:15ch;text-shadow:0 2px 40px rgba(0,0,0,.25)}
.acilis h1 em{font-style:normal;color:var(--yesil-parlak)}
.acilis .acilis-alt{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;
  margin-top:34px;flex-wrap:wrap}
.acilis p{max-width:46ch;font-size:clamp(17px,1.5vw,21px);color:rgba(255,255,255,.86);line-height:1.5}
.acilis .git{display:inline-flex;align-items:center;gap:13px;font-size:15px;font-weight:700;
  border-bottom:2px solid var(--yesil-parlak);padding-bottom:9px;transition:gap .25s}
.acilis .git:hover{gap:20px}

/* ══════════ 2 · ADIMLAR ══════════
   Sayfa kaydırıldıkça maddeler ilerler; maddeye tıklayınca o adıma gider.
   Kaydırma çalınmıyor — bölüm yapışkan kalıyor, sayfa normal akıyor. */
.adim-iz{position:relative;height:calc(100svh + (var(--adet) - 1) * 74svh)}
.adim-sabit{position:sticky;top:0;min-height:100svh;display:flex;align-items:center;
  padding-block:clamp(56px,8vh,92px)}
.adim-sabit > .kap{width:100%}
.adim-ic{display:block}
.adim-alt{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);
  gap:clamp(36px,5vw,88px);align-items:center;margin-top:clamp(34px,4.4vw,60px)}

.adimlar .one{font-size:clamp(30px,4.6vw,66px);font-weight:800;line-height:1.04;
  letter-spacing:-.045em;text-align:center;max-width:22ch;margin-inline:auto}
/* Yeşil kısım kendi satırında dursun — yoksa "problemi / çözüyoruz" diye bölünüyor */
.adimlar .one em{display:block;font-style:normal;color:var(--yesil)}

.adim-liste{list-style:none;padding:0;display:grid;gap:4px}
.adim-liste button{display:grid;grid-template-columns:44px minmax(0,1fr);gap:20px;
  align-items:start;text-align:start;width:100%;padding:16px 0;transition:opacity .45s ease}
.adim-liste .adim-rozet{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  border:2px solid var(--cizgi);color:var(--murekkep-45);position:relative;
  transition:background .35s,border-color .35s,color .35s,transform .35s}
.adim-liste .sayi{font-size:16px;font-weight:800;font-variant-numeric:tabular-nums;transition:opacity .25s}
.adim-liste .tik{position:absolute;opacity:0;transition:opacity .25s}
.adim-liste b{display:block;font-size:clamp(19px,1.7vw,24px);font-weight:800;
  letter-spacing:-.028em;line-height:1.2}
.adim-liste em{display:block;font-style:normal;font-size:clamp(15.5px,1.1vw,17px);
  color:var(--murekkep-70);line-height:1.55;margin-top:6px;max-width:42ch}

/* JS yoksa hepsi tam görünür kalır; sönümleme yalnızca JS ile devrede */
.adimlar.js .adim-liste button{opacity:.34}
.adimlar.js .adim-liste button[aria-current]{opacity:1}
.adimlar.js .adim-liste button[aria-current] .adim-rozet{background:var(--murekkep);
  border-color:var(--murekkep);color:#fff;transform:scale(1.06)}
.adimlar.js .adim-liste button.gecti .adim-rozet{background:var(--yesil);border-color:var(--yesil);color:#fff}
.adimlar.js .adim-liste button.gecti .sayi{opacity:0}
.adimlar.js .adim-liste button.gecti .tik{opacity:1}
.adim-liste button:hover{opacity:.8}
.adimlar.js .adim-liste button[aria-current]:hover{opacity:1}

.adim-sag{position:relative;aspect-ratio:4/5;max-height:min(66svh,560px);margin-inline-start:auto;width:100%}
.adim-sag figure{position:absolute;inset:0;margin:0;overflow:hidden;
  opacity:0;transform:translateY(28px) scale(1.015);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.3,1)}
.adim-sag figure.acik{opacity:1;transform:none}
.adim-sag img{width:100%;height:100%;object-fit:cover}
.adim-cubuk{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(16,8,48,.14)}
.adim-cubuk i{display:block;height:100%;width:var(--p,0%);background:var(--yesil);transition:width .12s linear;margin-inline-start:0}
[dir=rtl] .adim-cubuk i{margin-inline-start:auto}

@media(max-width:900px){
  .adim-iz{height:calc(100svh + (var(--adet) - 1) * 68svh)}
  /* Sabit bölme ekranı boydan boya doldurur; artan yer görsele gider,
     böylece telefon boyu ne olursa olsun altta ölü boşluk kalmaz. */
  .adim-sabit{align-items:stretch;padding-block:clamp(30px,5.5svh,50px) clamp(22px,3.5svh,32px)}
  .adim-ic{display:flex;flex-direction:column;height:100%}
  .adim-alt{display:flex;flex-direction:column;align-items:stretch;gap:18px;margin-top:16px;flex:1;min-height:0}
  .adim-sag{order:-1;flex:1 1 0;min-height:164px;aspect-ratio:auto;max-height:none}
  /* Yeşil kısım tek başına alt satırda dursun */
  .adimlar .one{font-size:clamp(26px,7vw,36px);max-width:none;text-align:center}
  .adimlar .one em{display:block}
  .adim-liste{flex:0 0 auto;gap:0}
  .adim-liste button{grid-template-columns:38px minmax(0,1fr);gap:14px;padding:12px 0}
  .adim-liste .adim-rozet{width:38px;height:38px}
  .adim-liste b{font-size:18px}
  .adim-liste em{font-size:14.5px;margin-top:5px;line-height:1.5}
}
@media(prefers-reduced-motion:reduce){
  .adim-sag figure{transition:opacity .01ms}
}

/* ══════════ 3 · KÖK / KANIT ══════════ */
.kanit{background:var(--gece);color:#fff;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.kanit .gorsel{position:relative;min-height:520px;overflow:hidden}
.kanit .gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Pencere etkisi: JS açtığında görsel ekran boyuna çıkar ve sayfa kaydıkça karşı
   yönde ötelenir; bölüm, sabit duran bir fotoğrafın üzerinde gezen bir pencere gibi
   davranır. background-attachment:fixed iOS'ta çalışmadığı için aynı sonuç transform
   ile üretiliyor. JS yoksa görsel olduğu gibi kalır. */
.kanit .gorsel.sabit img{top:0;bottom:auto;height:100vh;will-change:transform}
@media(prefers-reduced-motion:reduce){.kanit .gorsel.sabit img{height:100%;transform:none !important}}
.kanit .yazi{padding:clamp(56px,8vw,120px) clamp(32px,5vw,96px);display:flex;flex-direction:column;justify-content:center}
.kanit .et{color:var(--yesil-parlak)}
.kanit h2{margin-block:0 24px;max-width:14ch}
.kanit h2 em{font-style:normal;color:var(--yesil-parlak)}
.kanit p{color:rgba(255,255,255,.72);max-width:48ch;font-size:17.5px;line-height:1.62}
.olcum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;margin-top:52px;
  background:var(--cizgi-gece);border-block:1px solid var(--cizgi-gece)}
.olcum div{background:var(--gece);padding:24px 10px 22px;display:flex;flex-direction:column;justify-content:space-between}
.olcum .s{font-size:clamp(30px,3.1vw,44px);font-weight:800;letter-spacing:-.045em;line-height:1;
  color:var(--yesil-parlak);font-variant-numeric:tabular-nums;white-space:nowrap}
.olcum .a{font-size:13.5px;color:rgba(255,255,255,.6);margin-top:9px;line-height:1.35}
@media(max-width:960px){.kanit{grid-template-columns:minmax(0,1fr)}.kanit .gorsel{min-height:64vw;max-height:520px}}
@media(max-width:620px){
  /* rakamlar dar ekranda sütuna sıkışmasın — satır düzenine geç */
  .olcum{grid-template-columns:minmax(0,1fr);gap:1px;margin-top:38px}
  .olcum div{display:flex;flex-direction:row;align-items:baseline;justify-content:space-between;gap:18px;padding:17px 0}
  .olcum .s{font-size:32px}
  .olcum .a{margin-top:0;text-align:end;max-width:17ch}
}

/* ══════════ 4 · ÜRÜN AİLELERİ ══════════ */
.urun{padding-block:clamp(80px,12vh,160px)}
.urun-bas{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;
  padding-bottom:30px;border-bottom:1.5px solid var(--murekkep);flex-wrap:wrap}
.urun-bas .et{color:var(--yesil);margin-bottom:16px}
.guven h2{margin-block:0 22px}
.urun-bas .tum{display:inline-flex;align-items:center;gap:11px;font-size:15px;font-weight:700;
  border-bottom:2px solid var(--murekkep);padding-bottom:7px;min-height:44px;
  transition:gap .25s,color .2s,border-color .2s}
.urun-bas .tum:hover{gap:18px;color:var(--yesil);border-color:var(--yesil)}

.aile-izgara{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;
  margin-top:clamp(28px,3.4vw,44px)}
.aile-kart{position:relative;overflow:hidden;aspect-ratio:4/3;isolation:isolate;display:block}
.aile-kart img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.8,.3,1)}
.aile-kart:hover img{transform:scale(1.045)}
.aile-kart::after{content:"";position:absolute;inset:0;
  background:linear-gradient(transparent 26%,rgba(8,4,18,.46) 56%,rgba(8,4,18,.9) 100%)}
.aile-kart .uzeri{position:absolute;inset:auto 0 0 0;padding:clamp(20px,2vw,28px);color:#fff;z-index:1}
.aile-kart .sayi{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--yesil-parlak)}
.aile-kart h3{font-size:clamp(18px,1.55vw,24px);font-weight:800;letter-spacing:-.03em;
  line-height:1.14;margin-top:9px;max-width:16ch}
@media(max-width:900px){.aile-izgara{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
@media(max-width:560px){.aile-izgara{grid-template-columns:minmax(0,1fr)}
  .aile-kart{aspect-ratio:16/10}}

/* ══════════ 5 · BİTKİ / TAM GÖRSEL ══════════ */
.bitki{position:relative;min-height:min(80dvh,760px);display:grid;grid-template-columns:var(--hiza);
  align-items:center;isolation:isolate;overflow:hidden}
.bitki img.zemin{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.bitki::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(8,4,2,.9) 0%,rgba(8,4,2,.84) 34%,rgba(8,4,2,.5) 62%,rgba(8,4,2,.1) 100%)}
.bitki .ic{grid-column:ic-bas / ic-son;color:#fff;max-width:760px;padding-block:clamp(70px,10vh,120px)}
.bitki .et{color:var(--yesil-parlak)}
.bitki h2{margin-block:22px 20px}
.bitki p{color:rgba(255,255,255,.9);max-width:44ch;font-size:18px}
.mahsul{display:flex;flex-wrap:wrap;gap:9px;margin-top:36px}
.mahsul a{border:1.5px solid rgba(255,255,255,.34);padding:11px 19px;font-size:15px;font-weight:600;
  min-height:46px;display:inline-flex;align-items:center;transition:background .2s,border-color .2s,color .2s}
.mahsul a:hover{background:#fff;border-color:#fff;color:var(--murekkep)}

/* ══════════ 6 · KANIT ŞERİDİ ══════════ */
.guven{padding-block:clamp(80px,11vh,150px);background:var(--kagit-2)}
.guven .ic{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,90px);align-items:center}
.guven .et{color:var(--yesil)}
.guven h2{margin-block:20px 22px}
.guven p{color:var(--murekkep-70);max-width:50ch}
.belge{display:grid;gap:0;margin-top:38px;border-top:1px solid var(--cizgi)}
.belge div{display:flex;justify-content:space-between;gap:20px;align-items:baseline;
  padding-block:15px;border-bottom:1px solid var(--cizgi);font-size:15.5px}
.belge .no{font-weight:700;font-variant-numeric:tabular-nums}
.guven figure img{width:100%;aspect-ratio:3/2;object-fit:cover}
.guven figcaption{font-size:13.5px;color:var(--murekkep-45);margin-top:14px;max-width:44ch}
@media(max-width:960px){.guven .ic{grid-template-columns:minmax(0,1fr);gap:40px}}

/* ══════════ ALT ══════════ */
.alt{background:var(--gece);color:#fff;padding-block:clamp(70px,9vh,110px) 44px}
.alt-ust{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:44px;
  padding-bottom:52px;border-bottom:1px solid var(--cizgi-gece)}
.alt img{height:32px;filter:brightness(0) invert(1)}
.alt-ust > div > p{color:rgba(255,255,255,.6);font-size:15.5px;margin-top:20px;max-width:36ch;line-height:1.6}
.alt h3{font-size:12px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:rgba(255,255,255,.55);margin-bottom:18px}
.alt ul{list-style:none;padding:0;display:grid;gap:2px;font-size:15.5px}
.alt ul a{display:inline-flex;align-items:center;min-height:26px;padding-block:3px;color:rgba(255,255,255,.82);transition:color .2s}
.alt ul a:hover{color:var(--yesil-parlak)}
.alt-son{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-top:26px;
  font-size:13.5px;color:rgba(255,255,255,.45)}
@media(max-width:900px){.alt-ust{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}}
@media(max-width:560px){.alt-ust{grid-template-columns:minmax(0,1fr)}}

/* ══ Dokunmatik hedefler — mobilde en az 44px (Apple HIG / WCAG 2.5.8) ══ */
@media(pointer:coarse),(max-width:900px){
  .ust > div > a:first-child{min-height:44px;display:inline-flex;align-items:center}
  .diller{gap:4px}
  .diller a{min-height:44px;min-width:38px;display:inline-flex;align-items:center;justify-content:center}
  .acilis .git,.urun-bas .tum{min-height:44px;align-items:center;padding-block:0 11px}
  .alt ul{gap:2px}
  .alt ul a{min-height:44px;display:inline-flex;align-items:center}
  .belge div{padding-block:17px}
}



/* kutunun tamamı tıklanabilir */
.kutu{position:relative}
.kutu-bag{position:absolute;inset:0;z-index:2}
.kutu:has(.kutu-bag:hover){background:var(--kagit-2)}
.kutu:has(.kutu-bag:hover) .sahne{background:#ecebe5}

/* ══════════════════════════════════════════════════════════════════
   İÇ SAYFALAR — her sayfa tipinin kendi yapısı var.
   Ortak "koyu bant + beyaz gövde" şablonu yok. Anasayfayla aynı
   ölçek, renk ve tipografiyi paylaşır; kurgusu her tipte farklıdır.
   ══════════════════════════════════════════════════════════════════ */

/* ── PERDE — tam kadraj fotoğraf açılışı (kategori, program, haber, kurumsal) ── */
.perde{position:relative;min-height:min(72dvh,720px);display:grid;
  grid-template-columns:var(--hiza);align-items:end;isolation:isolate;overflow:hidden;
  padding-bottom:clamp(40px,6vh,80px)}
.perde.kisa{min-height:min(56dvh,520px)}
.perde .zemin{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.perde::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(8,4,18,.62) 0%,rgba(8,4,18,.1) 26%,rgba(8,4,18,.42) 52%,rgba(8,4,18,.88) 74%,rgba(8,4,18,.95) 100%)}
.perde .ic{grid-column:ic-bas / ic-son;color:#fff}
.perde h1{max-width:16ch;text-shadow:0 2px 40px rgba(0,0,0,.3)}
.perde .ozet{color:rgba(255,255,255,.88);max-width:52ch;margin-top:20px;
  font-size:clamp(17px,1.4vw,20px);line-height:1.5}
.perde .sayac{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px;font-size:13.5px;
  color:rgba(255,255,255,.74)}
.perde .sayac b{color:#fff;font-weight:700}

/* Kırıntı yolu */
.kirinti{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-size:13px;
  margin-bottom:24px;color:rgba(255,255,255,.78);text-shadow:0 1px 12px rgba(0,0,0,.5)}
.kirinti a{color:rgba(255,255,255,.94);padding-block:6px}
.kirinti a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.kirinti i{font-style:normal;opacity:.4}
.kirinti [aria-current]{color:#fff}

/* ── ÜRÜN DETAY: koyu sahne + dev içerik şeridi ── */
.urun-perde{position:relative;background:var(--gece);color:#fff;overflow:hidden;isolation:isolate}
.urun-perde .doku{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3;z-index:-2}
.urun-perde::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(10,5,24,.95) 0%,rgba(10,5,24,.84) 46%,rgba(10,5,24,.62) 100%)}
.urun-perde .ust-kisim{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(32px,5vw,86px);align-items:center;padding-block:clamp(96px,11vh,140px) clamp(40px,5vh,64px)}
.urun-sahne{display:grid;place-items:center;min-height:clamp(260px,34vh,420px);position:relative}
.urun-sahne::before{content:"";position:absolute;width:76%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(76,196,93,.2),transparent 68%)}
.urun-sahne img{max-height:clamp(230px,32vh,400px);width:auto;position:relative}
.urun-perde .kicker{color:var(--yesil-parlak)}
.urun-perde h1{margin-block:20px 16px;max-width:12ch}
.urun-perde .veciz{font-size:clamp(19px,1.9vw,27px);font-weight:600;color:rgba(255,255,255,.94);
  letter-spacing:-.02em;line-height:1.28;max-width:24ch}
.urun-perde .tur{font-size:15px;color:rgba(255,255,255,.62);margin-top:16px;line-height:1.5;max-width:44ch}
@media(max-width:960px){
  .urun-perde .ust-kisim{grid-template-columns:minmax(0,1fr);gap:26px;padding-block:clamp(84px,11vh,110px) 34px}
  .urun-sahne{min-height:220px;order:-1}
  .urun-sahne img{max-height:200px}
}

.icerik-serit{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);
  border-top:1px solid var(--cizgi-gece);padding-bottom:clamp(30px,4vh,52px)}
.icerik-serit > div{padding:clamp(22px,2.6vw,34px) 20px 0 0;margin-inline-end:20px;
  border-inline-end:1px solid var(--cizgi-gece)}
.icerik-serit > div:last-child{border-inline-end:0;margin-inline-end:0;padding-inline-end:0}
.icerik-serit dt{font-size:11px;font-weight:700;letter-spacing:.13em;
  color:rgba(255,255,255,.58);line-height:1.3;min-height:2.6em}
/* "4,8 - 6,8" gibi aralıklar satır ortasından bölünüp tireyi tek başına
   ortada bırakıyordu (Arapçada pH etiketi kısa olduğu için sütun dar). */
.icerik-serit dd{white-space:nowrap;margin:8px 0 0;font-size:clamp(30px,4vw,54px);font-weight:800;letter-spacing:-.045em;
  line-height:1;color:var(--yesil-parlak);font-variant-numeric:tabular-nums}
@media(max-width:820px){
  .icerik-serit{grid-auto-flow:row;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .icerik-serit > div{padding-block:18px;border-bottom:1px solid var(--cizgi-gece)}
  .icerik-serit > div:nth-child(2n){border-inline-end:0;margin-inline-end:0;padding-inline-end:0}
  .icerik-serit dt{min-height:0}
  .icerik-serit dd{font-size:32px}
}

/* ── ÜRÜN: NE YAPAR ──
   Sol sütun eskiden yalnızca minik bir etiket taşıyordu, yarım ekran boş
   kalıyordu; artık gerçek bir başlık oturuyor. */
.anlati{padding-block:clamp(52px,7vh,92px)}
.anlati .ic{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);
  gap:clamp(18px,5vw,80px);align-items:start}
.anlati-bas{position:sticky;top:40px}
.anlati-bas .tire{display:block;width:40px;height:3px;background:var(--yesil);margin-bottom:16px}
.anlati-bas h2{font-size:clamp(22px,2.4vw,33px);font-weight:800;letter-spacing:-.035em;line-height:1.06}
.anlati-govde{max-width:66ch}
.anlati p{font-size:clamp(15.5px,1.05vw,17px);color:var(--murekkep-70);line-height:1.7}
.anlati p + p{margin-top:1.05em}
.anlati p.lede{font-size:clamp(17px,1.3vw,20px);font-weight:500;color:var(--murekkep);
  line-height:1.55;letter-spacing:-.012em}
.anlati h3{font-size:clamp(18.5px,1.5vw,22px);font-weight:800;letter-spacing:-.026em;
  line-height:1.25;margin:1.9em 0 .55em}
.anlati h3:first-child{margin-top:0}
.anlati h4{font-size:15px;font-weight:700;letter-spacing:.005em;color:var(--yesil);
  margin:1.7em 0 .5em;line-height:1.35}
.anlati .sayili{margin:.9em 0 0;padding:0;list-style:none;counter-reset:s;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:0 clamp(24px,3vw,48px)}
.anlati .sayili li{counter-increment:s;display:grid;grid-template-columns:26px minmax(0,1fr);
  gap:10px;padding-block:11px;border-bottom:1px solid var(--cizgi);align-items:baseline;
  font-size:15px;line-height:1.5;color:var(--murekkep-70)}
.anlati .sayili li::before{content:counter(s,decimal-leading-zero);font-size:11.5px;font-weight:800;
  color:var(--yesil);font-variant-numeric:tabular-nums}

/* ── SONRAKİ ADIM — ürün sayfasından besleme programlarına ── */
.sonraki-adim{padding-bottom:clamp(56px,7vh,90px)}
.sonraki-adim .ic{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(24px,4vw,64px);align-items:center;padding-top:clamp(44px,5.5vw,72px);
  border-top:1px solid var(--cizgi)}
.sonraki-adim h2{font-size:clamp(21px,2.2vw,30px);font-weight:800;letter-spacing:-.035em;
  line-height:1.1;margin-top:14px;max-width:22ch}
.sonraki-adim .et{color:var(--yesil)}
.program-baglar{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  border-top:1px solid var(--cizgi)}
.program-baglar a{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:19px 20px 19px 0;border-bottom:1px solid var(--cizgi);min-height:44px;transition:color .2s}
.program-baglar a:hover{color:var(--yesil)}
.program-baglar b{font-size:15.5px;font-weight:700;letter-spacing:-.018em;line-height:1.3}
.program-baglar em{font-style:normal;font-size:12.5px;color:var(--murekkep-45);
  font-variant-numeric:tabular-nums;flex:none}
@media(max-width:900px){
  .sonraki-adim .ic{grid-template-columns:minmax(0,1fr);gap:26px;align-items:start}
  .sonraki-adim h2{max-width:none}
  .program-baglar{grid-template-columns:minmax(0,1fr)}
}

/* ── İDDİA BANDI ──
   Metnin parantezinde kaybolan performans rakamları. Siteyle aynı dil:
   keskin köşe, tek yazı karakteri, lacivert zemin. Kaynak cümle altta. */
.iddia{background:var(--gece);color:#fff;margin-top:clamp(38px,4.6vw,60px);
  padding:clamp(28px,3.2vw,44px) clamp(24px,3vw,44px)}
.iddia dl{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:clamp(20px,2.4vw,34px)}
.iddia dl > div{padding-inline-end:clamp(18px,2vw,32px);border-inline-end:1px solid var(--cizgi-gece)}
.iddia dl > div:last-child{border-inline-end:0;padding-inline-end:0}
.iddia dd{margin:0;font-size:clamp(34px,4.2vw,56px);font-weight:800;letter-spacing:-.045em;
  line-height:1;color:var(--yesil-parlak);font-variant-numeric:tabular-nums}
.iddia dl > div.one dd{color:#fff}
.iddia dd span{display:block;font-size:12.5px;font-weight:500;letter-spacing:0;
  color:rgba(255,255,255,.62);margin-top:7px}
.iddia dt{margin-top:10px;font-size:14px;font-weight:600;line-height:1.4;color:rgba(255,255,255,.9)}
/* .anlati p kuralı bundan daha özgül olduğu için koyu zeminde koyu metin
   dayatıyordu (2.17:1); iki sınıfla özgüllüğü aşıyoruz. */
.iddia .iddia-kaynak{font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.56);
  margin:clamp(24px,2.6vw,34px) 0 0;padding-top:18px;border-top:1px solid var(--cizgi-gece);max-width:96ch}
@media(max-width:760px){
  .iddia dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px 18px}
  .iddia dl > div{padding-inline-end:16px}
  .iddia dl > div:nth-child(2n){border-inline-end:0;padding-inline-end:0}
  .iddia dd{font-size:32px}
}

/* Bölüm içi ara başlık: etiket + boşluğu dolduran ince çizgi */
.ara-bas{display:flex;align-items:center;gap:18px;margin-top:clamp(40px,5vw,66px)}
.ara-bas span{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--murekkep-45);flex:none}
.ara-bas::after{content:"";flex:1;height:1px;background:var(--cizgi)}

/* ── FAYDA ÖBEKLERİ — temalı kartlar (handoff düzeni, site dili) ──
   Uzun madde listesi yerine adlandırılmış öbekler. Başlıklar
   content/fayda-gruplari.json'da; yalnız tanımlı üründe devreye girer. */
.fayda-obek{display:grid;grid-template-columns:minmax(0,1fr);
  gap:clamp(14px,1.6vw,20px);margin-top:clamp(14px,1.6vw,20px)}
/* Dört öbek 2×2 otursun — auto-fit 3+1 yapıyordu */
@media(min-width:900px){.fayda-obek{grid-template-columns:repeat(2,minmax(0,1fr))}}
.fayda-obek .fayda-kat{border:1px solid var(--cizgi);background:#fff;
  padding:clamp(24px,2.4vw,32px) clamp(22px,2.2vw,30px)}
/* ── Açılır fayda başlıkları ──
   Başlık <summary>; kapalı başlarlar, tıklanınca açılır. Varsayılan üçgen
   işareti kaldırılıp kendi okumuzu koyuyoruz. */
.fayda-kat > summary{display:flex;align-items:center;gap:14px;cursor:pointer;
  font-size:clamp(18px,1.5vw,22px);font-weight:800;letter-spacing:-.028em;line-height:1.25;
  list-style:none;-webkit-tap-highlight-color:transparent}
.fayda-kat > summary::-webkit-details-marker{display:none}
.fayda-kat > summary::marker{content:""}
.fayda-kat > summary .ad{flex:1;min-width:0}
.fayda-kat > summary .tnum{flex:none;font-size:11.5px;font-weight:800;color:var(--yesil);
  font-variant-numeric:tabular-nums;letter-spacing:.06em}
.fayda-kat > summary:focus-visible{outline:2px solid var(--murekkep);outline-offset:4px}
.fayda-ok{flex:none;color:var(--murekkep-45);transition:transform .22s}
.fayda-kat[open] > summary .fayda-ok{transform:rotate(180deg)}
[dir=rtl] .fayda-ok{transform:scaleX(-1)}
[dir=rtl] .fayda-kat[open] > summary .fayda-ok{transform:scaleX(-1) rotate(180deg)}
.fayda-kat[open] > summary{margin-bottom:16px}
@media(prefers-reduced-motion:reduce){.fayda-ok{transition:none}}

/* Düz listeli üründe tek başlık: kart değil, bölüm ayracı gibi durur. */
.fayda-kat.tek{border-top:1px solid var(--cizgi);margin-top:clamp(40px,5vw,66px);padding-top:22px}
.fayda-kat.tek > summary{font-size:11px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--murekkep-45);
  /* Metin küçük olduğu için satır 16px kalıyordu; WCAG 2.2 dokunma hedefi
     en az 24px. Dikey boşlukla satırın tamamı tıklanabilir yükseklikte. */
  padding-block:6px;min-height:24px}
.fayda-kat.tek[open] > summary{margin-bottom:4px}
.fayda-obek ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fayda-obek li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;
  align-items:start;font-size:15px;line-height:1.6;color:var(--murekkep-70)}
.fayda-obek li::before{content:"";width:10px;height:5px;margin-top:8px;
  border-left:2px solid var(--yesil);border-bottom:2px solid var(--yesil);
  transform:rotate(-45deg);transform-origin:center}
@media(max-width:820px){
  .fayda-obek .fayda-kat{padding:20px 18px}
  .fayda-kat > summary{font-size:18px;gap:11px}
  .fayda-kat[open] > summary{margin-bottom:14px}
  .fayda-obek li{font-size:14.5px;grid-template-columns:16px minmax(0,1fr);gap:9px}
}

.fayda{list-style:none;padding:0;margin-top:4px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:0 clamp(28px,4vw,64px)}
.fayda li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;
  padding-block:15px;border-bottom:1px solid var(--cizgi);align-items:start;
  font-size:15.5px;line-height:1.6;color:var(--murekkep-70)}
.fayda li::before{content:"";width:11px;height:6px;margin-top:8px;
  border-left:2px solid var(--yesil);border-bottom:2px solid var(--yesil);
  transform:rotate(-45deg);transform-origin:center}
@media(min-width:900px){.fayda{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Açıklaması olmayan üründe fayda listesi sağ sütunda tek sıra kalır */
.fayda.tek,.anlati-govde .fayda{grid-template-columns:minmax(0,1fr);margin-top:0}
.anlati-govde .uyari-blok{margin-top:0}
@media(max-width:900px){
  .anlati .ic{grid-template-columns:minmax(0,1fr);gap:22px}
  .anlati-bas{position:static}
  .anlati-govde{max-width:none}
  .fayda li{grid-template-columns:18px minmax(0,1fr);gap:10px;padding-block:13px}
}

.uygulama{background:var(--gece);color:#fff;padding-block:clamp(70px,9vh,120px)}
.uygulama .bas{padding-bottom:26px;border-bottom:1px solid var(--cizgi-gece)}
.uygulama .et{color:var(--yesil-parlak)}
.uygulama h2{font-size:clamp(23px,2.4vw,34px);font-weight:800;letter-spacing:-.035em;line-height:1.05;margin-top:14px}
/* Genişletilmiş uygulama başlığı: solda başlık, sağda özet */
.uygulama .bas.genis{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);
  gap:clamp(20px,4vw,64px);align-items:end}
/* Özet metni yalnız kaynağı olan üründe var; olmayanda başlık iki sütunun
   birine sıkışıp sağda boşluk bırakıyordu. */
.uygulama .bas.genis:not(:has(.ozet)){grid-template-columns:minmax(0,1fr)}
.uygulama .bas.genis .ozet{font-size:clamp(15.5px,1.15vw,17.5px);line-height:1.6;
  color:rgba(255,255,255,.7);max-width:44ch;margin:0 0 4px}

/* Üç adım kartı */
.adim-kart{list-style:none;margin:clamp(26px,3vw,40px) 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(12px,1.4vw,18px)}
.adim-kart li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;
  border:1px solid var(--cizgi-gece);padding:clamp(18px,1.8vw,24px)}
.adim-kart .tnum{font-size:11.5px;font-weight:800;color:var(--yesil-parlak);
  font-variant-numeric:tabular-nums;letter-spacing:.06em;padding-top:3px}
.adim-kart b{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.018em}
.adim-kart em{display:block;font-style:normal;font-size:13.5px;line-height:1.55;
  color:rgba(255,255,255,.62);margin-top:6px}

/* Bitki seçici — solda liste, sağda seçilen bitkinin dozu */
.secici{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);
  gap:clamp(12px,1.4vw,18px);margin-top:clamp(20px,2.2vw,28px);align-items:start}
.secici-liste{border:1px solid var(--cizgi-gece);padding:clamp(14px,1.4vw,18px)}
.secici-liste .kicker{display:block;color:rgba(255,255,255,.52);margin-bottom:10px}
/* Kapsayıcı role="group" (sekme değil, bir düğme kümesi). Seçici
   [role=tablist] yazılı kaldığı için ne masaüstü ızgarası ne mobil sarmalı
   çip düzeni uygulanıyordu; düğmeler alt alta, her biri metni kadar
   genişlikte tırtıklı bir merdiven gibi diziliyordu. */
.secici-liste [role=group]{display:grid}
.secici-liste button{display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;text-align:start;padding:13px 12px;min-height:44px;font:inherit;font-size:14.5px;
  color:rgba(255,255,255,.66);background:transparent;border:0;cursor:pointer;
  transition:background .18s,color .18s;line-height:1.35}
.secici-liste button svg{flex:none;opacity:0;transition:opacity .18s}
.secici-liste .kisa{display:none}
.secici-liste button:hover{color:#fff;background:rgba(255,255,255,.05)}
.secici-liste button[aria-pressed=true]{color:#fff;background:rgba(255,255,255,.08);font-weight:600}
.secici-liste button[aria-pressed=true] svg{opacity:1;color:var(--yesil-parlak)}

.secici-panel{position:relative;border:1px solid var(--cizgi-gece);
  padding:clamp(24px,2.6vw,40px);min-height:clamp(260px,26vw,340px)}
/* JS yoksa bütün bitkiler görünür kalır; JS varken tek kart gösterilir. */
.secici-kart{display:block}
.secici-kart + .secici-kart{margin-top:clamp(24px,2.6vw,36px);padding-top:clamp(24px,2.6vw,36px);
  border-top:1px solid var(--cizgi-gece)}
.secici.js .secici-kart{display:none;margin-top:0;padding-top:0;border-top:0}
.secici.js .secici-kart.acik{display:block}
.secici-kart .kicker{display:block;color:var(--yesil-parlak);margin-bottom:12px}
/* Bitki adı çoğu üründe kısa ("Buğday, Arpa"), ama bazı tablolarda 126
   karaktere kadar bir liste geliyor; başlık ölçüsünde basılınca üç satırlık
   ağır bir blok oluyordu. */
.secici-kart h3.uzun{font-size:clamp(16.5px,1.45vw,20px);font-weight:700;letter-spacing:-.018em;line-height:1.35}
.secici-kart h3{font-size:clamp(22px,2.4vw,34px);font-weight:800;letter-spacing:-.035em;
  line-height:1.1;margin:0}
.secici-kart dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:clamp(20px,2.4vw,40px);margin:clamp(24px,2.6vw,36px) 0 0;
  padding-top:clamp(22px,2.4vw,32px);border-top:1px solid var(--cizgi-gece)}
.secici-kart dt{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.4}
.secici-kart dd{margin:10px 0 0;display:flex;align-items:baseline;gap:8px}
.secici-kart dd b{font-size:clamp(38px,4.6vw,62px);font-weight:800;letter-spacing:-.045em;
  line-height:1;color:var(--yesil-parlak);font-variant-numeric:tabular-nums}
/* Metin değerler doz değil, cümledir (ortanca 62, en uzun 344 karakter).
   Rakamlarla aynı görsel ağırlıkta basılınca kart bir metin duvarına
   dönüşüyordu. tabular-nums da burada zararlı: virgül ve noktayı rakam
   genişliğinde bastığı için düzyazıda "Kardeşlenme , sapa" gibi boşluk
   açıyordu — o ayar yalnız sayı hizalaması için. */
.secici-kart dd b.soz{font-size:clamp(14.5px,1.05vw,16px);font-weight:500;
  letter-spacing:0;line-height:1.55;color:rgba(255,255,255,.86);
  font-variant-numeric:normal}
/* "100-150" gibi aralıklar tek satırda kalsın: Seed-On'da değerler tek
   sayıydı, diğer ürünlerde aralık geliyor ve satır ortasından bölünüyordu. */
.secici-kart dd b.tnum{white-space:nowrap}
.secici-kart dd b.uzun{font-size:clamp(28px,3.2vw,44px)}
.secici-kart dd i{font-style:normal;font-size:15px;font-weight:600;color:rgba(255,255,255,.66)}
.secici-not{font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.72);
  margin:clamp(22px,2.4vw,30px) 0 0;padding-inline-start:15px;
  border-inline-start:2px solid var(--yesil-parlak);max-width:66ch}

@media(max-width:900px){
  .uygulama .bas.genis{grid-template-columns:minmax(0,1fr);gap:16px;align-items:start}
  .uygulama .bas.genis .ozet{max-width:none;margin-bottom:0}
  .secici{grid-template-columns:minmax(0,1fr)}
  /* Sarmalı çip: sekiz seçenek de aynı anda görünür, gizli kaydırma yok */
  .secici-liste [role=group]{display:flex;flex-wrap:wrap;gap:7px}
  .secici-liste button{border:1px solid var(--cizgi-gece);white-space:nowrap;
    padding:10px 14px;min-height:44px;width:auto;justify-content:center}
  .secici-liste button svg{display:none}
  .secici-liste .tam{display:none}
  .secici-liste .kisa{display:inline}
  .secici-panel{min-height:0;padding:20px 18px}
  .secici-kart dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
  .secici-kart dd b{font-size:36px}
}

.uygulama .ara-bas{margin-top:clamp(46px,5.5vw,74px)}
.uygulama .ara-bas span{color:rgba(255,255,255,.5)}
.uygulama .ara-bas::after{background:var(--cizgi-gece)}

/* ── DOZ ÇİZELGESİ ──
   Masaüstünde sabit yerleşimli çizelge (doz sütunları sağa sıkışmıyor),
   mobilde aynı işaretleme etiketli karta dönüşüyor — yatay kaydırma yok. */
.cizelge-sar{margin-top:clamp(22px,2.8vw,36px)}
.cizelge{width:100%;border-collapse:collapse;table-layout:fixed}
.cizelge thead th{text-align:start;font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.52);line-height:1.35;
  padding:0 18px 15px 0;vertical-align:bottom}
.cizelge thead th.d{color:var(--yesil-parlak)}
.cizelge thead th:last-child{padding-inline-end:0}
.cizelge tbody tr{border-top:1px solid var(--cizgi-gece)}
.cizelge th[scope=row]{text-align:start;font-size:clamp(15px,1.15vw,17px);font-weight:700;
  letter-spacing:-.022em;line-height:1.35;color:#fff;padding:20px 18px 20px 0;vertical-align:top}
.cizelge td{font-size:14px;color:rgba(255,255,255,.6);line-height:1.5;
  padding:20px 18px 20px 0;vertical-align:top}
.cizelge td:last-child{padding-inline-end:0}
.cizelge td.d{color:var(--yesil-parlak)}
.cizelge td.d.bos{color:rgba(255,255,255,.54)}
.cizelge td.d.bos b{font-weight:400}
/* Doz sütunu cümle taşıdığında düz metin; içindeki miktar vurgulanır */
.cizelge thead th.dm{color:var(--yesil-parlak)}
.cizelge td.dm{color:rgba(255,255,255,.72);font-size:13.5px;line-height:1.55}
.cizelge td.dm b{color:var(--yesil-parlak);font-weight:800;white-space:nowrap;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.cizelge td.d b{display:block;font-size:clamp(18px,1.55vw,23px);font-weight:800;letter-spacing:-.03em;
  line-height:1.04;font-variant-numeric:tabular-nums}
.cizelge td.d i{display:block;font-style:normal;font-size:11.5px;letter-spacing:.03em;
  color:rgba(255,255,255,.54);margin-top:6px;line-height:1.3}
.cizelge-not{font-size:12.5px;color:rgba(255,255,255,.56);line-height:1.55;margin-top:18px;max-width:62ch}
/* Tabloda satır satır tekrar eden talimat: bir kez, tüm satırlar için */
.cizelge-not.ortak{font-size:14px;color:rgba(255,255,255,.82);margin-top:22px;
  padding-inline-start:16px;border-inline-start:2px solid var(--yesil-parlak);max-width:72ch}

@media(max-width:760px){
  .cizelge,.cizelge tbody,.cizelge tr,.cizelge th,.cizelge td{display:block;width:auto}
  .cizelge colgroup,.cizelge thead{display:none}
  .cizelge tbody tr{display:grid;grid-template-columns:repeat(var(--doz,2),minmax(0,1fr));
    gap:11px 14px;border:1px solid var(--cizgi-gece);padding:14px 15px;margin-top:11px}
  .cizelge th[scope=row],.cizelge td:not(.d){grid-column:1 / -1}
  .cizelge th[scope=row]{padding:0;font-size:16.5px}
  .cizelge td{padding:0;font-size:13.5px}
  .cizelge td::before{content:attr(data-e);display:block;font-size:10px;font-weight:700;
    letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.54);margin-bottom:5px}
  .cizelge td.d b{font-size:21px}
  .cizelge td.d i{margin-top:4px}
}

.kunye{padding-block:clamp(60px,8vh,100px)}
.kunye .ic{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:clamp(32px,5vw,72px);align-items:start}
.ozellik{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  border-top:1px solid var(--cizgi)}
.ozellik div{padding:20px 22px 20px 0;border-bottom:1px solid var(--cizgi)}
.ozellik dt{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--murekkep-45)}
.ozellik dd{margin:7px 0 0;font-size:15.5px;line-height:1.5}
.belgeler{display:grid;gap:10px}
.belge-kart{border:1px solid var(--cizgi);display:grid;grid-template-columns:60px minmax(0,1fr) auto;
  gap:16px;align-items:center;padding:16px;transition:border-color .2s,background .2s;min-height:60px}
.belge-kart:hover{border-color:var(--murekkep);background:var(--kagit-2)}
.belge-kart img{width:60px;height:76px;object-fit:cover;border:1px solid var(--cizgi)}
.belge-kart b{display:block;font-size:14.5px}
.belge-kart em{font-style:normal;font-size:12.5px;color:var(--murekkep-45);font-variant-numeric:tabular-nums}
.belge-kart svg{color:var(--murekkep-45)}
@media(max-width:900px){.kunye .ic{grid-template-columns:minmax(0,1fr);gap:34px}}
@media(max-width:600px){
  /* Tek sütunda her künye satırı 74px yer kaplıyordu; etiket-değer satırına
     çevirince aynı bilgi yarı yükseklikte ve daha okunur duruyor. */
  .ozellik{grid-template-columns:minmax(0,1fr)}
  .ozellik div{display:grid;grid-template-columns:minmax(88px,auto) minmax(0,1fr);gap:14px;
    align-items:baseline;padding:13px 0}
  .ozellik dt{line-height:1.3}
  .ozellik dd{margin:0;font-size:15px}
}

/* ── ÜRÜN KATEGORİ: değişimli editoryal satırlar ── */
.sira{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(28px,4.5vw,72px);align-items:center;padding-block:clamp(38px,5vh,66px);
  border-bottom:1px solid var(--cizgi);position:relative}
.sira:nth-of-type(even) .sira-gorsel{order:2}
.sira-gorsel{background:var(--kagit-2);display:grid;place-items:center;
  min-height:clamp(220px,26vw,340px);position:relative;transition:background .25s}
.sira:hover .sira-gorsel{background:#ecebe5}
.sira-gorsel img{max-height:clamp(180px,22vw,290px);width:auto}
.sira-gorsel .no{position:absolute;top:18px;inset-inline-start:20px;font-size:12px;font-weight:700;
  color:var(--murekkep-45);font-variant-numeric:tabular-nums}
.sira .kicker{color:var(--yesil)}
.sira h2,.sira h3{font-size:clamp(24px,2.6vw,36px);font-weight:800;letter-spacing:-.038em;
  line-height:1.04;margin-block:11px 9px}
.sira .tur{font-size:14.5px;color:var(--murekkep-70);line-height:1.5;max-width:46ch}
.sira .mini{display:flex;flex-wrap:wrap;margin-top:24px;padding-top:22px;border-top:1px solid var(--cizgi)}
.sira .mini div{padding-inline-end:22px;margin-inline-end:22px;border-inline-end:1px solid var(--cizgi)}
.sira .mini div:last-child{border-inline-end:0;margin-inline-end:0;padding-inline-end:0}
.sira .mini dt{font-size:10.5px;font-weight:700;letter-spacing:.12em;color:var(--murekkep-45)}
.sira .mini dd{margin:3px 0 0;font-size:clamp(20px,1.7vw,25px);font-weight:800;letter-spacing:-.035em;
  font-variant-numeric:tabular-nums}
.sira .git{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:14.5px;
  font-weight:700;color:var(--yesil);min-height:44px;transition:gap .25s}
.sira:hover .git{gap:17px}
.sira-bag{position:absolute;inset:0;z-index:2}
@media(max-width:860px){
  /* Mobilde her ürün tek bir kutu: metin solda, ambalaj sağda, künye altta.
     .sira-yazi çözülüyor ki künye ve bağlantı kutunun tam genişliğini alsın. */
  .sira{grid-template-columns:minmax(0,1fr) 104px;gap:0 14px;align-items:start;
    padding:15px 16px;border:1px solid var(--cizgi);background:#fff;margin-top:14px}
  .sira:first-of-type{margin-top:2px}
  .sira:hover .sira-gorsel{background:var(--kagit-2)}
  .sira-yazi{display:contents}
  .sira:nth-of-type(even) .sira-gorsel{order:0}
  .sira-gorsel{grid-column:2;grid-row:1;min-height:118px;aspect-ratio:auto;background:transparent;
    align-self:stretch;overflow:hidden}
  .sira-gorsel img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:center}
  .sira-gorsel .no{display:none}
  .sira-ust{grid-column:1;grid-row:1}
  .sira h2,.sira h3{font-size:25px;margin-block:7px 6px}
  .sira .tur{font-size:13.5px}
  .sira .mini{grid-column:1 / -1;grid-row:2;display:grid;
    grid-template-columns:repeat(auto-fit,minmax(62px,1fr));gap:10px 10px;align-items:end;
    margin-top:15px;padding-top:13px}
  .sira .mini div{padding:0;margin:0;border:0}
  .sira .mini dt{display:block;line-height:1.3}
  .sira .mini dd{font-size:21px}
  .sira .git{grid-column:1 / -1;grid-row:3;margin-top:13px;padding-top:13px;
    border-top:1px solid var(--cizgi);min-height:0;justify-content:space-between;display:flex}
}

.diger{background:var(--gece);color:#fff;padding-block:clamp(56px,7vh,90px)}
.diger .et{color:var(--yesil-parlak);margin-bottom:26px}
.diger-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  border-top:1px solid var(--cizgi-gece)}
.diger-liste a{padding:20px 22px 20px 0;border-bottom:1px solid var(--cizgi-gece);
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;min-height:44px;transition:color .2s}
.diger-liste a:hover{color:var(--yesil-parlak)}
.diger-liste b{font-size:15.5px;font-weight:600;letter-spacing:-.01em}
.diger-liste em{font-style:normal;font-size:13px;color:rgba(255,255,255,.48);font-variant-numeric:tabular-nums}

/* ── PROGRAM: bu bitkide adı geçen ürünler + talep ── */
.uygun{padding-block:clamp(56px,7.5vh,96px)}
.uygun .bas{max-width:62ch}
.uygun .et{color:var(--yesil)}
.uygun h2{font-size:clamp(23px,2.5vw,34px);font-weight:800;letter-spacing:-.035em;
  line-height:1.1;margin-top:14px}
.uygun .ozet{font-size:15.5px;line-height:1.65;color:var(--murekkep-70);margin-top:16px}
.uygun-liste{list-style:none;margin:clamp(30px,3.6vw,48px) 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(12px,1.4vw,18px)}
.uygun-liste li{border:1px solid var(--cizgi);padding:clamp(18px,1.9vw,24px);background:#fff}
.uygun-liste a{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.uygun-liste .ad{font-size:clamp(18px,1.6vw,22px);font-weight:800;letter-spacing:-.03em}
.uygun-liste a:hover .ad{color:var(--yesil)}
.uygun-liste .bolge{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--murekkep-45);flex:none}
.uygun-liste dl{display:flex;flex-wrap:wrap;gap:0 22px;margin:16px 0 0;
  padding-top:14px;border-top:1px solid var(--cizgi)}
.uygun-liste dt{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--murekkep-45);line-height:1.3}
.uygun-liste dd{margin:5px 0 0;font-size:17px;font-weight:800;letter-spacing:-.02em;
  color:var(--yesil);font-variant-numeric:tabular-nums}
.uygun-liste .satir{font-size:12.5px;line-height:1.5;color:var(--murekkep-45);margin:12px 0 0}
@media(max-width:700px){
  .uygun-liste{grid-template-columns:minmax(0,1fr)}
  .uygun-liste li{padding:16px}
  .uygun-liste .ad{font-size:18px}
}

/* ── PROGRAM: talep ── */

.talep{background:var(--gece);color:#fff}
.talep .ic{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  gap:clamp(36px,5vw,86px);padding-block:clamp(60px,8vh,104px);align-items:start}
.talep .et{color:var(--yesil-parlak)}
.talep h2{font-size:clamp(26px,3vw,42px);font-weight:800;letter-spacing:-.035em;line-height:1.05;margin-block:16px 18px}
.talep p{color:rgba(255,255,255,.74);max-width:46ch;line-height:1.62}
.talep .liste{margin-top:30px;border-top:1px solid var(--cizgi-gece)}
.talep .liste div{padding-block:15px;border-bottom:1px solid var(--cizgi-gece);
  display:flex;gap:14px;align-items:baseline;font-size:15.5px}
.talep .liste svg{color:var(--yesil-parlak);flex:none}
@media(max-width:900px){.talep .ic{grid-template-columns:minmax(0,1fr);gap:34px}}

/* ── FORM ── */
form.ab{display:grid;gap:18px}
form.ab .cift{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
form.ab label{display:block;font-size:12.5px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;margin-bottom:9px;opacity:.82}
form.ab .zor{color:var(--yesil-parlak)}
form.ab input,form.ab select,form.ab textarea{width:100%;min-height:54px;font:inherit;font-size:16px;
  border:0;border-bottom:1.5px solid rgba(255,255,255,.42);background:transparent;color:#fff;
  padding:0 2px;border-radius:0;transition:border-color .2s}
form.ab textarea{min-height:110px;resize:vertical;line-height:1.5;padding-top:14px}
form.ab input::placeholder,form.ab textarea::placeholder{color:rgba(255,255,255,.34)}
form.ab input:focus,form.ab select:focus,form.ab textarea:focus{outline:none;border-color:var(--yesil-parlak)}
form.ab select option{color:var(--murekkep)}
form.ab .yardim{font-size:13px;color:rgba(255,255,255,.52);line-height:1.5}
form.ab button{background:var(--yesil-parlak);color:#04120a;min-height:58px;padding-inline:36px;
  font-size:16px;font-weight:700;justify-self:start;transition:transform .2s,background .2s}
form.ab button:hover{transform:translateY(-2px);background:#5fd670}
@media(max-width:760px){form.ab .cift{grid-template-columns:minmax(0,1fr)}}

.bolunmus{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:100dvh}
.bolunmus .foto{position:relative;overflow:hidden}
/* sabit başlık açık fotoğrafın üstünde okunabilsin */
.bolunmus .foto::before{content:"";position:absolute;inset:0 0 auto 0;height:190px;z-index:1;
  background:linear-gradient(rgba(8,4,18,.72),rgba(8,4,18,0));pointer-events:none}
.bolunmus .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bolunmus .foto .uzeri{position:absolute;inset:auto 0 0 0;padding:clamp(30px,4vw,54px);color:#fff;
  background:linear-gradient(transparent,rgba(8,4,18,.88))}
.bolunmus .foto .uzeri p{font-size:clamp(17px,1.5vw,21px);font-weight:600;max-width:26ch;line-height:1.35}
.bolunmus .panel{background:var(--gece);color:#fff;
  padding:clamp(96px,11vh,140px) clamp(28px,4vw,72px) clamp(56px,7vh,86px)}
.bolunmus h1{font-size:clamp(32px,3.6vw,52px);font-weight:800;letter-spacing:-.04em;line-height:1.02;margin-block:18px 16px}
.bolunmus .ozet{color:rgba(255,255,255,.74);max-width:44ch;margin-bottom:36px;line-height:1.6}
.bolunmus .bilgi{margin-top:40px;padding-top:26px;border-top:1px solid var(--cizgi-gece);display:grid;gap:18px}
.bolunmus .bilgi div{display:grid;gap:5px}
.bolunmus .bilgi dt{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.bolunmus .bilgi dd{margin:0;font-size:16.5px;line-height:1.5}
@media(max-width:900px){
  .bolunmus{grid-template-columns:minmax(0,1fr);min-height:0}
  .bolunmus .foto{min-height:46vw;max-height:320px}
  .bolunmus .panel{padding:40px 20px 56px}
  .bolunmus .foto .uzeri{display:none}
}

/* ── HABER ── */
.one-cikan{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);
  align-items:center;padding-block:clamp(50px,6vh,84px);border-bottom:1px solid var(--cizgi);position:relative}
.one-cikan img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--kagit-2)}
.one-cikan time{font-size:12.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--yesil)}
.one-cikan h2{font-size:clamp(28px,3.2vw,46px);font-weight:800;letter-spacing:-.04em;line-height:1.05;margin-top:14px}
.one-cikan .git{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:15px;
  font-weight:700;min-height:44px;transition:gap .25s}
.one-cikan:hover .git{gap:17px}
@media(max-width:860px){.one-cikan{grid-template-columns:minmax(0,1fr);gap:20px}}

.haber-liste{border-top:1px solid var(--cizgi)}
/* Dört akış içi öğe var (görsel, tarih, başlık, fotoğraf sayısı); üç sütun
   tanımlıyken tarih esnek sütunu alıyor, başlık 120px'e sıkışıyordu. */
.haber-sat{display:grid;grid-template-columns:120px 150px minmax(0,1fr) 130px;gap:clamp(20px,3vw,44px);
  align-items:center;padding-block:22px;border-bottom:1px solid var(--cizgi);
  transition:background .18s;position:relative}
.haber-sat:hover{background:var(--kagit-2)}
.haber-sat time{font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--murekkep-45)}
.haber-sat h3{font-size:clamp(18px,1.7vw,24px);font-weight:700;letter-spacing:-.025em;line-height:1.25}
.haber-sat:hover h3{color:var(--yesil)}
.haber-sat img{width:120px;height:76px;object-fit:cover;background:var(--kagit-2)}
@media(max-width:760px){
  .haber-sat{grid-template-columns:96px minmax(0,1fr);gap:6px 14px;padding-block:18px}
  .haber-sat time{grid-column:2;font-size:12px}
  .haber-sat h3{grid-column:2}
  .haber-sat img{grid-row:1 / span 2;grid-column:1;width:96px;height:70px}
}

.makale{max-width:70ch;padding-block:clamp(50px,6vh,84px)}
.makale p{font-size:clamp(17.5px,1.3vw,20px);color:var(--murekkep-70);line-height:1.7}
.makale p + p{margin-top:1.15em}
.makale p:first-child{font-size:clamp(21px,2vw,28px);font-weight:600;color:var(--murekkep);
  line-height:1.36;letter-spacing:-.02em}
.mozaik{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px;
  padding-bottom:clamp(50px,6vh,84px)}
.mozaik img{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--kagit-2)}

/* ── KURUMSAL / YAZI ── */
.beyanat{padding-block:clamp(70px,9vh,120px)}
/* 350 karakterlik bir gövde paragrafı 50 puntoda 13 satır sürüyordu; vurgu
   cümlesi ölçeği yalnızca gerçekten kısa metinlerde uygulanır. */
.beyanat .buyuk-soz.uzun{font-size:clamp(19px,1.7vw,24px);font-weight:500;letter-spacing:-.015em;
  line-height:1.55;max-width:62ch}
.beyanat .buyuk-soz{font-size:clamp(26px,3.4vw,50px);font-weight:700;letter-spacing:-.035em;
  line-height:1.16;max-width:22ch}
.ikili-blok{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(30px,4.5vw,80px);align-items:center;padding-block:clamp(44px,6vh,80px)}
.ikili-blok.ters figure{order:2}
.ikili-blok img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ikili-blok p{font-size:clamp(17px,1.2vw,19.5px);color:var(--murekkep-70);line-height:1.68}
.ikili-blok p + p{margin-top:1.05em}
@media(max-width:860px){.ikili-blok{grid-template-columns:minmax(0,1fr);gap:24px}
  .ikili-blok.ters figure{order:0}}

.rakamlar{background:var(--gece);color:#fff;padding-block:clamp(56px,7vh,96px)}
.rakamlar .satir{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  border-top:1px solid var(--cizgi-gece)}
.rakamlar .satir > div{padding:26px 22px 26px 0;border-bottom:1px solid var(--cizgi-gece)}
.rakamlar .s{font-size:clamp(34px,4vw,58px);font-weight:800;letter-spacing:-.045em;line-height:1;
  color:var(--yesil-parlak);font-variant-numeric:tabular-nums}
.rakamlar .a{font-size:14px;color:rgba(255,255,255,.62);margin-top:10px;line-height:1.4}

.madde{list-style:none;padding:0;counter-reset:m;margin-top:clamp(34px,4vw,54px)}
.madde li{counter-increment:m;display:grid;grid-template-columns:64px minmax(0,1fr);gap:22px;
  padding-block:26px;border-top:1px solid var(--cizgi);align-items:start}
.madde li::before{content:counter(m,decimal-leading-zero);font-size:14px;font-weight:800;
  color:var(--yesil);font-variant-numeric:tabular-nums;padding-top:5px}
.madde li p{font-size:clamp(17px,1.2vw,19.5px);margin:0;color:var(--murekkep-70);line-height:1.62}
@media(max-width:600px){.madde li{grid-template-columns:38px minmax(0,1fr);gap:14px;padding-block:20px}}

/* ── ORTAK ── */
.bolum{padding-block:clamp(60px,8vh,110px)}
.bolum-bas{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;
  flex-wrap:wrap;padding-bottom:26px;border-bottom:1.5px solid var(--murekkep)}
.bolum-bas h2{font-size:clamp(26px,3.2vw,44px);font-weight:800;letter-spacing:-.038em;line-height:1.04}
.kicker{font-size:12px;font-weight:700;letter-spacing:.19em;text-transform:uppercase;display:block}

.gezinme{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1px;
  background:var(--cizgi);border-block:1px solid var(--cizgi)}
.gezinme a{background:#fff;padding:26px clamp(20px,2.4vw,36px);transition:background .2s;min-height:44px}
.gezinme a:hover{background:var(--kagit-2)}
.gezinme span{font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--murekkep-45)}
.gezinme b{display:block;font-size:17px;font-weight:800;letter-spacing:-.028em;margin-top:8px}
.gezinme a:last-child{text-align:end}
@media(max-width:600px){.gezinme{grid-template-columns:minmax(0,1fr)}.gezinme a:last-child{text-align:right}
/* direction:ltr bağlamında "start" SOL demek; RTL hücrede değer etiketinden
   ters tarafa yaslanıyordu. Yön yalıtımı korunuyor, hizalama sağa alınıyor. */}

.dortdortluk{min-height:66vh;display:grid;place-items:center;text-align:center;padding-block:90px}
.dortdortluk .kod{font-size:clamp(84px,15vw,200px);font-weight:800;letter-spacing:-.065em;
  line-height:.84;color:var(--kagit-2)}
.dortdortluk h1{margin-top:-.16em;font-size:clamp(28px,3.4vw,46px);font-weight:800;letter-spacing:-.035em}
.dortdortluk p{color:var(--murekkep-70);margin-top:18px;max-width:44ch;margin-inline:auto}

/* ── Dokunmatik: iç sayfalarda da tüm hedefler ≥44px ── */
@media(pointer:coarse),(max-width:900px){
  .kirinti{gap:4px}
  .kirinti a,.kirinti span[aria-current]{min-height:44px;display:inline-flex;align-items:center;
    padding-inline:2px}
  .kirinti i{align-self:center}
  .mozaik a,.one-cikan .git,.sira .git{min-height:44px}
  .diger-liste a{padding-block:14px}
  form.ab select{min-height:54px}
  .dortdortluk .tum{min-height:44px}
  .ikili-blok .tum{min-height:44px}
}

/* ══ Uyarı ve saklama — etiketten gelen bilgiler ══ */
.uyari-blok{margin-top:clamp(30px,4vw,48px);border-top:1px solid var(--cizgi)}
.uyari-blok h3{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--murekkep-45);padding-top:22px}
.uyari-blok ul{list-style:none;padding:0;margin-top:14px;display:grid;gap:9px}
.uyari-blok li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;font-size:15.5px;
  line-height:1.55;color:var(--murekkep-70)}
.uyari-blok li::before{content:"";width:7px;height:7px;background:var(--yesil);margin-top:9px}
.uyari-blok p{font-size:15.5px;line-height:1.6;color:var(--murekkep-70);margin-top:14px;max-width:62ch}

/* ══ Yatay kaydırmalı galeri ══ */
/* ══ Haber galerisi: Instagram çoklu görsel gönderisi düzeni ══
   Bir kare bir fotoğraf, yana kaydırma düğmeleri fotoğrafın üzerinde,
   altta konum noktaları. Düğmeler her ekran boyunda görünür. */
.kaydir{margin-top:clamp(34px,4.4vw,56px)}
.kaydir-bas{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:14px}
.kaydir-bas h2{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--murekkep-45)}
.kaydir-sayac{font-size:12px;font-weight:600;color:var(--murekkep-45);font-variant-numeric:tabular-nums;
  direction:ltr;unicode-bidi:isolate}
.kaydir-sayac b{color:var(--murekkep);font-weight:800}

.kaydir-cerceve{position:relative}
.kaydir-iz{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;background:var(--kagit-2)}
.kaydir-iz::-webkit-scrollbar{display:none}
.kaydir-iz:focus-visible{outline:2px solid var(--murekkep);outline-offset:3px}
/* Tek kare = tam genişlik; kaydırma her seferinde tam bir fotoğrafta durur. */
/* scroll-snap-stop:always programlı kaydırmayı başladığı karede kesiyordu;
   mandatory tutma zaten her duruşta tam bir fotoğrafa oturtuyor. */
.kaydir-iz a{flex:0 0 100%;scroll-snap-align:center;display:block}
.kaydir-iz img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--kagit-2)}

.kaydir-ok{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.92);color:var(--murekkep);border:0;
  box-shadow:0 2px 10px rgba(0,0,0,.18);cursor:pointer;
  transition:background .2s,opacity .2s,visibility .2s}
.kaydir-ok.geri{inset-inline-start:12px}
.kaydir-ok.ileri{inset-inline-end:12px}
/* Sağdan sola yazımda okun yönü de dönmeli. */
[dir=rtl] .kaydir-ok svg{transform:scaleX(-1)}
.kaydir-ok:hover{background:#fff}
.kaydir-ok:focus-visible{outline:2px solid var(--murekkep);outline-offset:2px}
.kaydir-ok[disabled]{opacity:0;visibility:hidden;pointer-events:none}

.kaydir-nokta{display:flex;justify-content:center;gap:6px;margin-top:14px}
.kaydir-nokta i{width:6px;height:6px;border-radius:50%;background:var(--cizgi);
  transition:background .2s,transform .2s}
.kaydir-nokta i.etkin{background:var(--murekkep);transform:scale(1.4)}

@media(max-width:760px){
  .kaydir-ok{width:34px;height:34px}
  .kaydir-ok.geri{inset-inline-start:8px}
  .kaydir-ok.ileri{inset-inline-end:8px}
}
@media(prefers-reduced-motion:reduce){
  .kaydir-nokta i{transition:none}
}

/* ══ "Ne yapar" metninin kapalı kutuları ══
   Seed-On'daki fayda kartlarıyla aynı davranış ve görünüm; ilk paragraf
   açıkta kalır, ayrıntı kutuların içinde durur. */
.anlati-kutular{display:grid;gap:10px;margin-top:clamp(22px,2.4vw,30px)}
.anlati-kat{border:1px solid var(--cizgi);background:#fff;
  padding:clamp(16px,1.8vw,22px) clamp(16px,1.8vw,24px)}
.anlati-kat > summary{display:flex;align-items:center;gap:14px;cursor:pointer;
  font-size:clamp(16px,1.3vw,19px);font-weight:800;letter-spacing:-.022em;line-height:1.3;
  color:var(--murekkep);list-style:none;-webkit-tap-highlight-color:transparent;
  min-height:24px}
.anlati-kat > summary::-webkit-details-marker{display:none}
.anlati-kat > summary::marker{content:""}
.anlati-kat > summary .ad{flex:1;min-width:0}
.anlati-kat > summary:focus-visible{outline:2px solid var(--murekkep);outline-offset:4px}
.anlati-kat[open] > summary{margin-bottom:14px}
.anlati-kat[open] > summary .fayda-ok{transform:rotate(180deg)}
[dir=rtl] .anlati-kat[open] > summary .fayda-ok{transform:scaleX(-1) rotate(180deg)}
/* Kutu içinde ilk başlık üstten boşluk almasın. */
.anlati-ic > :first-child{margin-top:0}
.anlati-ic p{font-size:clamp(15px,1vw,16.5px)}

/* Kutu içi madde listeleri — fayda, uyarı ve metin listeleri aynı biçimde. */
.anlati-ic .fayda-liste{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.anlati-ic .fayda-liste li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;
  align-items:start;font-size:15px;line-height:1.6;color:var(--murekkep-70)}
.anlati-ic .fayda-liste li::before{content:"";width:10px;height:5px;margin-top:8px;
  border-left:2px solid var(--yesil);border-bottom:2px solid var(--yesil);
  transform:rotate(-45deg);transform-origin:center}
@media(min-width:900px){.anlati-ic .fayda-liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px clamp(24px,3vw,44px)}}

/* Kaydırılmış başlıkta arama, dil ve mobil menü de koyu zemine göre. */
.ust.kaydi .ara-bag{color:var(--murekkep);opacity:.72}
.ust.kaydi .ara-bag:hover{opacity:1}
.ust.kaydi .mobil-menu > summary{color:var(--murekkep);border-color:var(--cizgi)}
.ust.kaydi .mobil-menu > summary .cizgiler,
.ust.kaydi .mobil-menu > summary .cizgiler::before,
.ust.kaydi .mobil-menu > summary .cizgiler::after{background:var(--murekkep)}
.ust.kaydi .diller a[aria-current]{text-decoration-color:var(--yesil)}

/* Alt bilgi künyesi — tasarım imzası. */
.alt-son .yapan{color:rgba(255,255,255,.42)}
.alt-son .yapan a{color:rgba(255,255,255,.72);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px;transition:color .2s}
.alt-son .yapan a:hover{color:#fff}

/* ══ Fotoğraf büyütme penceresi ══
   Haberdeki fotoğrafa tıklayınca sayfa değişmeden büyük açılır. <dialog>
   olduğu için Esc, odak tuzağı ve perde tarayıcıdan gelir. */
.buyutec{width:100%;max-width:100%;height:100%;max-height:100%;
  margin:0;padding:0;border:0;overflow:hidden;
  display:none;place-items:center;
  /* Karartma pencerenin kendi arka planında: ::backdrop bazı motorlarda
     biçimlenmiyor, böylece perde her koşulda var. */
  background:rgba(8,10,16,.92)}
.buyutec[open]{display:grid}
.buyutec::backdrop{background:rgba(8,10,16,.92)}
.buyutec img{max-width:min(96vw,1500px);max-height:88vh;width:auto;height:auto;
  object-fit:contain;display:block;grid-area:1/1}

.buyutec-kapat{position:fixed;top:14px;inset-inline-end:14px;z-index:3;
  width:46px;height:46px;border:0;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer;
  transition:background .2s}
.buyutec-kapat:hover{background:rgba(255,255,255,.28)}
.buyutec-kapat:focus-visible{outline:2px solid #fff;outline-offset:3px}

.buyutec-ok{position:fixed;top:50%;transform:translateY(-50%);z-index:2;
  width:48px;height:48px;border:0;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer;transition:background .2s,opacity .2s,visibility .2s}
.buyutec-ok:hover{background:rgba(255,255,255,.28)}
.buyutec-ok:focus-visible{outline:2px solid #fff;outline-offset:3px}
.buyutec-ok.geri{inset-inline-start:14px}
.buyutec-ok.ileri{inset-inline-end:14px}
[dir=rtl] .buyutec-ok svg{transform:scaleX(-1)}
.buyutec-ok[disabled]{opacity:0;visibility:hidden;pointer-events:none}

.buyutec-sayac{position:fixed;inset-inline:0;bottom:18px;text-align:center;
  color:rgba(255,255,255,.72);font-size:13px;font-weight:600;
  font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
.buyutec-sayac b{color:#fff;font-weight:800}

/* Galerideki fotoğraf tıklanabilir olduğunu belli etsin. */
.kaydir-iz a{cursor:zoom-in}

@media(max-width:760px){
  .buyutec img{max-width:100vw;max-height:80vh}
  .buyutec-kapat{width:40px;height:40px;top:10px;inset-inline-end:10px}
  .buyutec-ok{width:40px;height:40px}
  .buyutec-ok.geri{inset-inline-start:8px}
  .buyutec-ok.ileri{inset-inline-end:8px}
}
@media(prefers-reduced-motion:reduce){
  .buyutec-kapat,.buyutec-ok{transition:none}
}

/* ══ Kurumsal: değerler ve referanslar ══ */
.degerler{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--cizgi);
  border:1px solid var(--cizgi);margin-top:clamp(34px,4vw,52px)}
.degerler > div{background:#fff;padding:clamp(24px,2.6vw,34px)}
.degerler img{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:18px}
.degerler h3{font-size:clamp(17px,1.5vw,21px);font-weight:800;letter-spacing:-.025em;line-height:1.2}
.degerler p{font-size:14.5px;color:var(--murekkep-70);margin-top:9px;line-height:1.5}
@media(max-width:900px){.degerler{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.degerler{grid-template-columns:minmax(0,1fr)}}

.referanslar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--cizgi-gece);
  border-block:1px solid var(--cizgi-gece);margin-top:clamp(34px,4vw,52px)}
.referanslar figure{background:var(--gece);padding:clamp(26px,3vw,40px);margin:0}
.referanslar blockquote{font-size:clamp(17px,1.5vw,21px);line-height:1.5;letter-spacing:-.015em;
  color:rgba(255,255,255,.92)}
.referanslar figcaption{margin-top:20px;padding-top:16px;border-top:1px solid var(--cizgi-gece);
  font-size:14px;color:rgba(255,255,255,.55)}
.referanslar figcaption b{display:block;color:#fff;font-size:15.5px;font-weight:700;margin-bottom:2px}
@media(max-width:760px){.referanslar{grid-template-columns:minmax(0,1fr)}}

/* ══ Haber gövdesi: ara başlıklar ══ */
.makale h2{font-size:clamp(20px,1.8vw,26px);font-weight:800;letter-spacing:-.03em;line-height:1.2;
  margin-top:1.6em;color:var(--murekkep)}
.makale h2:first-child{margin-top:0}

/* haber satırında fotoğraf sayısı */
.haber-sat .adet{font-size:12.5px;color:var(--murekkep-45);white-space:nowrap;text-align:end}
@media(max-width:760px){.haber-sat .adet{grid-column:2;text-align:start;font-size:12px}}

/* haber gövdesi: giriş büyük, kalan satırlar normal */
.makale p.ince{font-size:clamp(16.5px,1.2vw,18.5px);font-weight:400;color:var(--murekkep-70);
  line-height:1.62;letter-spacing:0;margin-top:.85em}

/* ══ ÜRÜN AİLESİ ŞERİTLERİ — tam genişlik, metin görselin üstünde HTML olarak ══
   Görseller sol yarısı boş kalacak şekilde çekildi; üstüne bir de yatay perde
   binerek metin her dilde okunur kalıyor. Metin görselin içine gömülü değil. */
.serit{position:relative;display:block;background:var(--gece);color:#fff;isolation:isolate;overflow:hidden}
.serit + .serit{border-top:1px solid rgba(255,255,255,.12)}
.serit-gorsel{position:absolute;inset:0;z-index:-2}
.serit-gorsel img{width:100%;height:100%;object-fit:cover;object-position:center;
  transition:transform .8s cubic-bezier(.2,.8,.3,1)}
.serit:hover .serit-gorsel img{transform:scale(1.035)}
.serit::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(5,3,12,.94) 0%,rgba(5,3,12,.86) 30%,rgba(5,3,12,.42) 58%,rgba(5,3,12,.06) 100%)}
.serit-ic{display:grid;grid-template-columns:var(--hiza);
  min-height:clamp(300px,32vw,440px);align-items:center}
.serit-ic > div{grid-column:ic-bas / ic-son;max-width:46ch;padding-block:clamp(44px,5vw,68px)}
.serit .no{font-size:12px;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.42);
  font-variant-numeric:tabular-nums}
.serit .kicker{color:var(--yesil-parlak);display:inline-block;margin-inline-start:14px}
.serit h2{font-size:clamp(27px,3.4vw,48px);font-weight:800;letter-spacing:-.038em;
  line-height:1.04;margin-block:16px 14px;max-width:17ch}
.serit .urunler{font-size:15.5px;color:rgba(255,255,255,.72);line-height:1.55;max-width:40ch}
.serit .git{display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:700;
  margin-top:24px;padding-bottom:8px;border-bottom:2px solid var(--yesil-parlak);
  transition:gap .25s;min-height:44px}
.serit:hover .git{gap:19px}

@media(max-width:820px){
  /* dar ekranda metin görselin üstünde sıkışmasın — görsel üstte, metin altta */
  .serit-gorsel{position:relative;inset:auto;z-index:0}
  .serit-gorsel img{aspect-ratio:16/9;object-position:72% center;transform:none!important}
  .serit::after{display:none}
  .serit-ic{min-height:0;grid-template-columns:var(--hiza)}
  .serit-ic > div{max-width:none;padding-block:26px 34px}
  .serit h2{font-size:clamp(24px,6.4vw,32px);max-width:none;margin-block:12px 10px}
}

/* ══ Mobil şeritler: metin görselin üstünde kalsın, yalnız kategori adı ══
   Görselin boş bırakılmış kısmı zaten metin için ayrılmıştı; dar ekranda da
   onu kullanıyoruz. Yardımcı metinler kalkıyor, ad öne çıkıyor. */
@media(max-width:820px){
  .serit-gorsel{position:absolute;inset:0;z-index:-2}
  .serit-gorsel img{aspect-ratio:auto;height:100%;object-position:64% center}
  .serit::after{display:block;
    background:linear-gradient(90deg,rgba(5,3,12,.93) 0%,rgba(5,3,12,.82) 46%,rgba(5,3,12,.34) 78%,rgba(5,3,12,.1) 100%)}
  .serit-ic{min-height:232px;align-items:center}
  .serit-ic > div{padding-block:26px;max-width:none}
  .serit .no,.serit .urunler,.serit .git{display:none}
  /* üst etiket kalsın: "Makro element" iki kategoride geçiyor, ayıran bilgi burada */
  .serit .kicker{display:block;margin:0 0 8px;font-size:11px;letter-spacing:.15em}
  .serit h2{font-size:clamp(25px,7vw,34px);margin:0;max-width:13ch;line-height:1.08}
}


/* ── ARAMA ── */
.arama{padding-block:clamp(44px,6vh,80px)}
.arama .ic{max-width:none}
.arama-kutu label{display:block;color:var(--yesil);margin-bottom:12px}
.arama-kutu input{width:100%;font:inherit;font-size:clamp(20px,2.4vw,32px);font-weight:700;
  letter-spacing:-.03em;padding:0 0 16px;border:0;border-bottom:2px solid var(--murekkep);
  background:transparent;border-radius:0;color:var(--murekkep)}
.arama-kutu input::placeholder{color:var(--murekkep-45);font-weight:500;letter-spacing:-.01em}
.arama-kutu input:focus{outline:none;border-bottom-color:var(--yesil)}

.arama-suzgec{display:grid;gap:clamp(16px,2vw,24px);margin-top:clamp(28px,3.4vw,44px)}
.suzgec-grup .kicker{display:block;color:var(--murekkep-45);margin-bottom:10px}
.yongalar{display:flex;flex-wrap:wrap;gap:8px}
.yongalar button{font:inherit;font-size:14px;padding:9px 15px;min-height:40px;
  border:1px solid var(--cizgi);background:#fff;color:var(--murekkep-70);cursor:pointer;
  transition:border-color .18s,color .18s,background .18s}
.yongalar button:hover{border-color:var(--murekkep-45);color:var(--murekkep)}
.yongalar button[aria-pressed=true]{background:var(--murekkep);border-color:var(--murekkep);
  color:#fff;font-weight:700}

.arama-sayac{font-size:12.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--murekkep-45);margin:clamp(30px,3.6vw,46px) 0 0;padding-bottom:14px;
  border-bottom:1px solid var(--cizgi)}
.arama-sonuc{list-style:none;margin:0;padding:0}
.arama-sonuc a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;align-items:baseline;
  padding:18px 0;border-bottom:1px solid var(--cizgi);transition:color .18s}
.arama-sonuc a:hover{color:var(--yesil)}
.arama-sonuc .tur{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--murekkep-45)}
.arama-sonuc b{font-size:clamp(17px,1.5vw,21px);font-weight:800;letter-spacing:-.028em}
.arama-sonuc em{display:block;font-style:normal;font-size:14px;color:var(--murekkep-70);margin-top:5px}
.arama-bos{font-size:16px;color:var(--murekkep-70);margin-top:26px;line-height:1.6}
.arama-bos a{color:var(--yesil);font-weight:700;text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){
  .arama-sonuc a{grid-template-columns:minmax(0,1fr);gap:6px;padding:15px 0}
  .arama-sonuc b{font-size:17px}
  .yongalar button{font-size:13.5px;padding:8px 13px}
}

/* Başlıktaki arama bağlantısı */
.ust .ara-bag{display:inline-flex;align-items:center;gap:8px;color:#fff;opacity:.82;
  font-size:14px;font-weight:600;margin-inline-start:auto;padding:8px 0;min-height:44px;
  transition:opacity .2s}
.ust .ara-bag:hover{opacity:1}
/* Etiket gizlenince geriye 17px'lik simge kalıyordu; WCAG 2.2 dokunma
   hedefi en az 24px olmalı. */
@media(max-width:900px){.ust .ara-bag span{display:none}
  .ust .ara-bag{min-width:44px;justify-content:center}}

/* Henüz çevirisi olmayan diller: tıklanamaz ama görünür — niyet belli olsun */
.diller span[aria-disabled]{opacity:.38;cursor:default}
.alt-son .yakinda{opacity:.4}

/* Klavye kullanıcısı için içeriğe atlama bağlantısı */
/* Yatay gizleme RTL'de ters yöne kaçıp düzeni taşırıyordu; dikey gizleme
   iki yönde de aynı çalışır. */
.atla{position:absolute;inset-inline-start:0;top:0;z-index:100;background:var(--murekkep);color:#fff;
  padding:14px 22px;font-size:15px;font-weight:700;transform:translateY(-200%);
  transition:transform .15s}
.atla:focus{transform:none}

/* Alt bilgide sosyal medya — settings.json'dan geliyor */
.alt .sosyal{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:16px;font-size:14px}
.alt .sosyal a{color:rgba(255,255,255,.6);min-height:26px;display:inline-flex;align-items:center;
  transition:color .2s}
.alt .sosyal a:hover{color:var(--yesil-parlak)}
.alt p a{display:inline-flex;align-items:center;min-height:26px;color:inherit;transition:color .2s}
.alt p a:hover{color:var(--yesil-parlak)}

/* 404: sayfada koyu kahraman yok, beyaz başlık metni görünmüyordu */
.dortdortluk-sayfa{background:var(--gece);color:#fff;min-height:100svh;display:grid;align-items:center}
.dortdortluk-sayfa .kod{color:var(--yesil-parlak)}
.dortdortluk-sayfa p{color:rgba(255,255,255,.72)}
.dortdortluk-sayfa .tum{border-color:var(--cizgi-gece);color:#fff}
.dortdortluk-sayfa .tum:hover{border-color:var(--yesil-parlak);color:var(--yesil-parlak)}

/* ── MOBİL MENÜ ──
   <details> kullanılıyor: JS olmadan da açılıp kapanır. 1000px üstünde
   gizlenir, orada normal yatay menü çalışır. */
.mobil-menu{display:none;position:relative;margin-inline-start:14px}
.mobil-menu summary{list-style:none;width:44px;height:44px;display:grid;place-items:center;
  cursor:pointer;border:1px solid rgba(255,255,255,.3)}
.mobil-menu summary::-webkit-details-marker{display:none}
.mobil-menu summary:hover{border-color:var(--yesil-parlak)}
.mobil-menu .cizgiler,.mobil-menu .cizgiler::before,.mobil-menu .cizgiler::after{
  display:block;width:18px;height:2px;background:#fff;transition:transform .2s,opacity .2s}
.mobil-menu .cizgiler{position:relative}
.mobil-menu .cizgiler::before,.mobil-menu .cizgiler::after{content:"";position:absolute;left:0}
.mobil-menu .cizgiler::before{top:-6px}
.mobil-menu .cizgiler::after{top:6px}
.mobil-menu[open] .cizgiler{background:transparent}
.mobil-menu[open] .cizgiler::before{transform:translateY(6px) rotate(45deg)}
.mobil-menu[open] .cizgiler::after{transform:translateY(-6px) rotate(-45deg)}

/* Mutlak konumlu içerik kapalı <details> içinde gizlenmiyor — açıkça gizliyoruz. */
.mobil-menu:not([open]) .mobil-panel{display:none}
/* Sayfa payına yaslanan tam genişlik açılır menü: düğmeye yaslanınca sola taşıyordu. */
.mobil-panel{position:fixed;top:82px;left:20px;right:20px;
  background:var(--gece);border:1px solid var(--cizgi-gece);padding:10px;z-index:40;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.6);max-height:calc(100dvh - 100px);overflow-y:auto}
/* .ust nav'ın 34px gap değeri miras kalıyordu; menü satırları arası açılıyordu. */
.mobil-panel nav{display:grid;gap:0}
.mobil-panel a{display:flex;align-items:center;min-height:48px;padding:0 14px;color:#fff;
  font-size:16px;font-weight:600;transition:background .18s}
.mobil-panel a:hover,.mobil-panel a:focus-visible{background:rgba(255,255,255,.08)}
.mobil-ara{gap:10px;margin-top:6px;padding-top:14px!important;border-top:1px solid var(--cizgi-gece);
  color:var(--yesil-parlak)!important}

@media(max-width:1000px){
  .mobil-menu{display:block}
  .ust > div{gap:0}
  .ust .ara-bag{margin-inline-start:auto}
}
@media(max-width:420px){
  .ust .diller{gap:8px;font-size:12px}
}

/* Garanti edilen içerik değerlerinin birimi — % ile ppm karışmasın */
.icerik-serit dd i,.sira .mini dd i{font-style:normal;font-weight:600;
  font-size:.44em;letter-spacing:0;margin-inline-start:.18em;vertical-align:.55em;
  color:rgba(255,255,255,.6)}
.sira .mini dd i{color:var(--murekkep-45);vertical-align:.4em;font-size:.55em}
/* Türkçede işaret sayıdan önce geliyor ("%30"); boşluk da yön değiştirir. */
.icerik-serit dd i.on,.sira .mini dd i.on{margin-inline-start:0;margin-inline-end:.14em}

/* ── RTL'DE SAYI YÖNÜ ──
   Arapça sayfada "2,4 - 4,5" çift yönlü algoritma yüzünden "-2,4 4,5" olarak
   diziliyordu. Doz ve içerik değerleri her dilde soldan sağa okunmalı; aksi
   halde tescilli değerler yanlış görünür. */
[dir=rtl] .icerik-serit dd,
[dir=rtl] .sira .mini dd,
[dir=rtl] .cizelge td.d,
[dir=rtl] .cizelge td.dm b,
[dir=rtl] .secici-kart dd,
[dir=rtl] .iddia dd,
[dir=rtl] .uygun-liste dd,
[dir=rtl] .ozellik dd,
[dir=rtl] .tnum{direction:ltr;unicode-bidi:isolate;text-align:start}
[dir=rtl] .cizelge td.d,[dir=rtl] .secici-kart dd,[dir=rtl] .iddia dd{text-align:right}

/* Onay önizlemesinde form gönderimi kapalı; açıklama formun altında çıkar. */
.onizleme-not{margin-top:14px;padding:11px 14px;border-radius:9px;
  background:#fdf4e0;color:#8a5a00;font-size:14px;font-weight:500;line-height:1.45}