/* ── ARMADA GIDA · ANA STİL ──────────────────────────────────────────────────
   Dil: İsviçre grid + manifest (irsaliye) tipografisi. Tek imza: rota ağı.
   Aile: Archivo VF (başlık+gövde) · IBM Plex Mono (veri/etiket).            */

/* ── Fontlar (self-host; latin + latin-ext = ş/ğ/İ tam) ── */
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('../fonts/archivo-latin-wght-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+20BA,U+2212}
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('../fonts/archivo-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0130,U+015E-015F,U+011E-011F,U+1E00-1EFF,U+20AC,U+20BA}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+2013-2014,U+2192,U+20BA}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/ibm-plex-mono-latin-ext-400-normal.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0130,U+015E-015F,U+011E-011F,U+20AC,U+20BA}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/ibm-plex-mono-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+2013-2014,U+2192,U+20BA}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/ibm-plex-mono-latin-ext-600-normal.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0130,U+015E-015F,U+011E-011F,U+20AC,U+20BA}

/* ── Token anayasası (palet LOGODAN: kırmızı #E3000F + siyah + kırık beyaz) ── */
:root{
  --murekkep:#171310; --koyu:#231D17; --hat:#ABA294;
  --kagit:#F4F2ED; --kagit-koyu:#EAE6DC; --cizgi:#D9D3C7;
  --gri:#6E675C; --kirmizi:#E3000F; --kirmizi-koyu:#B4000D; --yesil:#3E7A4E;
  --kagit-metin-ters:#EDE9E0; --cizgi-koyu:rgba(237,233,224,.16);
  --sans:'Archivo',system-ui,sans-serif; --mono:'Plex Mono',ui-monospace,monospace;
  --fs-dev:clamp(2.5rem,5.6vw,4.4rem);
  --fs-baslik:clamp(1.75rem,3.4vw,2.6rem);
  --fs-ara:1.22rem; --fs-govde:1rem; --fs-kucuk:.875rem; --fs-mono:.78rem;
  --icerik:1240px; --kenar:clamp(20px,4vw,48px);
  --r:6px; --yay:cubic-bezier(.34,1.4,.5,1);
}

/* ── Zemin ── */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:430;font-size:var(--fs-govde);line-height:1.65;
  color:var(--murekkep);background:var(--kagit);-webkit-font-smoothing:antialiased;
  font-variant-numeric:lining-nums;}
img,svg{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--kirmizi);color:#fff}
:focus-visible{outline:2px solid var(--kirmizi-koyu);outline-offset:2px;border-radius:2px}
.atlama{position:absolute;left:-999px;top:0;background:var(--murekkep);color:#fff;
  padding:10px 18px;z-index:99}
.atlama:focus{left:8px;top:8px}

.kapsayici{max-width:var(--icerik);margin:0 auto;padding-inline:var(--kenar)}
.bolum{padding-block:clamp(64px,9vw,128px)}
.bolum+.bolum{padding-top:0}

/* ── Tipografi rolleri ── */
.etiket-mono{font-family:var(--mono);font-size:var(--fs-mono);font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gri);
  display:flex;align-items:center;gap:12px;margin-bottom:20px}
.etiket-mono::before{content:'';width:26px;height:1px;background:var(--kirmizi);flex:none}
.etiket-mono .no{color:var(--kirmizi)}
h1,h2,h3{font-weight:760;letter-spacing:-.022em;line-height:1.06;text-wrap:balance}
h1{font-size:var(--fs-dev);font-weight:820}
h2{font-size:var(--fs-baslik)}
h3{font-size:var(--fs-ara);letter-spacing:-.012em;line-height:1.25}
.lede{font-size:1.12rem;line-height:1.6;color:var(--gri);max-width:56ch}
.baslik-blok{max-width:760px;margin-bottom:clamp(36px,5vw,64px)}
.baslik-blok .lede{margin-top:16px}

/* ── Butonlar (48px+, yaylı basınç) ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:50px;padding:0 26px;border-radius:var(--r);border:1px solid transparent;
  font:600 .95rem/1 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;
  transition:transform .16s var(--yay),background-color .16s,border-color .16s,color .16s;
  -webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.96)}
.btn-birincil{background:var(--murekkep);color:var(--kagit)}
.btn-birincil:hover{background:var(--koyu)}
.btn-cerceve{border-color:var(--murekkep);color:var(--murekkep);background:transparent}
.btn-cerceve:hover{background:rgba(23,19,16,.06)}
.btn-vurgu{background:var(--kirmizi);color:#fff}
.btn-vurgu:hover{background:var(--kirmizi-koyu)}
.btn .ok{transition:transform .2s var(--yay)}
.btn:hover .ok{transform:translateX(4px)}

/* ── Üst çubuk ── */
.ust{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--kagit) 92%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--cizgi)}
.ust-ic{display:flex;align-items:center;gap:32px;min-height:76px}
.marka{display:flex;align-items:center;text-decoration:none;flex:none}
.marka img{height:54px;width:auto;display:block}
.ust nav{display:flex;gap:4px;margin-left:auto}
.ust nav a{font-weight:560;font-size:.92rem;text-decoration:none;padding:10px 14px;
  border-radius:var(--r);color:var(--murekkep)}
.ust nav a:hover{background:rgba(23,19,16,.06)}
.ust .btn{min-height:44px;padding-inline:20px;font-size:.9rem;flex:none}
.menu-dugme{display:none;margin-left:auto;background:none;border:1px solid var(--cizgi);
  border-radius:var(--r);width:46px;height:46px;cursor:pointer;position:relative}
.menu-dugme i,.menu-dugme::before,.menu-dugme::after{content:'';position:absolute;left:12px;right:12px;
  height:2px;background:var(--murekkep);transition:transform .25s var(--yay),opacity .2s}
.menu-dugme::before{top:16px}.menu-dugme i{top:22px}.menu-dugme::after{top:28px}
.menu-acik .menu-dugme::before{transform:translateY(6px) rotate(45deg)}
.menu-acik .menu-dugme i{opacity:0}
.menu-acik .menu-dugme::after{transform:translateY(-6px) rotate(-45deg)}

/* Mobil örtü menü (header DIŞINDA yaşar — backdrop-filter fixed'i kırar) */
.mobil-menu{display:none}
.menu-acik{overflow:hidden}
.menu-acik .mobil-menu{display:flex;flex-direction:column;gap:4px;
  position:fixed;inset:76px 0 0;background:var(--kagit);z-index:49;
  padding:32px var(--kenar);border-top:1px solid var(--cizgi)}
.mobil-menu a{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;text-decoration:none;
  padding:14px 4px;border-bottom:1px solid var(--cizgi)}
.mobil-menu .btn{margin-top:28px;border-bottom:none}
.mobil-menu .mini{font-family:var(--mono);font-size:.72rem;color:var(--gri);
  letter-spacing:.14em;margin-top:auto;padding-bottom:12px}

/* ── HERO · rota ağı imzası ── */
.hero{min-height:min(85vh,860px);display:flex;align-items:center;position:relative;overflow:hidden}
.hero-ic{display:grid;grid-template-columns:minmax(0,56fr) minmax(0,44fr);gap:clamp(32px,5vw,72px);
  align-items:center;width:100%}
.hero .lede{margin:24px 0 36px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-rota{position:relative}
.hero-rota svg{width:100%;height:auto}

/* Manifest şeridi — hero altı canlı operasyon dili */
.manifest{border-block:1px solid var(--cizgi);background:var(--kagit)}
.manifest-ic{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;
  mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent)}
.manifest-ic::-webkit-scrollbar{display:none}
.manifest-hucre{font-family:var(--mono);font-size:var(--fs-mono);font-weight:600;
  letter-spacing:.1em;padding:16px 28px;border-right:1px solid var(--cizgi);
  white-space:nowrap;color:var(--gri);display:flex;gap:10px;align-items:center;flex:none}
.manifest-hucre:first-child{padding-left:0}
.manifest-hucre .yon{color:var(--kirmizi)}
.manifest-hucre .nokta{width:7px;height:7px;border-radius:50%;background:var(--yesil);flex:none}

/* SVG rota ağı çizim dili */
.rota-izgara line{stroke:rgba(23,19,16,.055);stroke-width:1}
.rota-hat{fill:none;stroke:var(--hat);stroke-width:1.6;stroke-dasharray:5 7;
  stroke-linecap:round;animation:hatAkis 26s linear infinite;opacity:.85}
.rota-hat.vurgu{stroke:var(--kirmizi);stroke-width:2}
@keyframes hatAkis{to{stroke-dashoffset:-288}}
.rota-dugum{fill:var(--murekkep)}
.rota-dugum-halka{fill:none;stroke:var(--murekkep);stroke-width:1.4}
.rota-merkez-nabiz{fill:none;stroke:var(--kirmizi);stroke-width:1.4;transform-box:fill-box;
  transform-origin:center;animation:nabiz 3.2s ease-out infinite}
@keyframes nabiz{0%{transform:scale(.45);opacity:.9}80%{transform:scale(1.6);opacity:0}100%{opacity:0}}
.rota-uydu{fill:var(--gri);opacity:.5}
.rota-etiket{font-family:var(--mono);font-size:12.5px;font-weight:600;letter-spacing:.12em;
  fill:var(--murekkep)}
.rota-etiket.soluk{fill:var(--gri);font-weight:400;font-size:10.5px}
.rota-tasit{fill:var(--kirmizi)}

/* ── İstatistik kartları ── */
.istatistikler{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--cizgi);
  border-radius:10px;overflow:hidden;background:#fff}
.kart-istatistik{padding:clamp(24px,3vw,40px);border-right:1px solid var(--cizgi);
  display:flex;flex-direction:column;gap:6px}
.kart-istatistik:last-child{border-right:none}
.kart-istatistik .deger{font-weight:820;font-size:clamp(2.2rem,3.6vw,3.2rem);
  letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.kart-istatistik .deger .arti{color:var(--kirmizi)}
.kart-istatistik .etiket{font-weight:620;font-size:.95rem;letter-spacing:-.01em}
.kart-istatistik .ek{font-family:var(--mono);font-size:.72rem;color:var(--gri);letter-spacing:.06em}
.kart-istatistik.bos .deger{color:var(--cizgi);font-weight:500}
.kart-istatistik .rozet{align-self:flex-start;margin-top:2px}

/* Doğrulama rozeti — dürüst veri dili */
.rozet{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.66rem;
  font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gri);
  border:1px dashed var(--cizgi);border-radius:99px;padding:4px 10px;white-space:nowrap}
.rozet::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--kirmizi)}

/* ── Kategori kartları (iş ortaklıkları) ── */
.kategoriler{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kart-kategori{background:#fff;border:1px solid var(--cizgi);border-radius:10px;
  padding:30px 28px;display:flex;flex-direction:column;gap:10px;min-height:200px;
  transition:transform .22s var(--yay),box-shadow .22s}
.kart-kategori:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(23,19,16,.08)}
.kart-kategori .kod{font-family:var(--mono);font-size:.72rem;font-weight:600;
  letter-spacing:.14em;color:var(--kirmizi)}
.kart-kategori p{color:var(--gri);font-size:.94rem;line-height:1.55}
.kart-kategori .markalar{margin-top:auto;padding-top:14px;border-top:1px solid var(--cizgi);
  font-family:var(--mono);font-size:.74rem;color:var(--gri);letter-spacing:.04em;line-height:1.9}
.kart-kategori.notr{background:var(--kagit-koyu);border-style:dashed}

/* ── Operasyon kartları + foto-slot ── */
.operasyonlar{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.kart-operasyon{display:flex;flex-direction:column;gap:16px}
.kart-operasyon h3{margin-top:6px}
.kart-operasyon p{color:var(--gri);font-size:.94rem;line-height:1.6}
.kart-operasyon .sira{font-family:var(--mono);font-size:.72rem;font-weight:600;
  letter-spacing:.14em;color:var(--kirmizi)}

/* Nötr placeholder: kadrajı gösterir, stok fotoğraf taklidi yapmaz */
.foto-slot{position:relative;background:var(--kagit-koyu) repeating-linear-gradient(45deg,
  transparent 0 12px,rgba(23,19,16,.045) 12px 13px);border-radius:8px;overflow:hidden}
.foto-slot::before,.foto-slot::after{content:'';position:absolute;width:18px;height:18px;
  border:1.6px solid rgba(23,19,16,.4)}
.foto-slot::before{top:10px;left:10px;border-right:none;border-bottom:none}
.foto-slot::after{bottom:10px;right:10px;border-left:none;border-top:none}
.foto-slot .cekim{position:absolute;left:14px;bottom:12px;font-family:var(--mono);
  font-size:.64rem;font-weight:600;letter-spacing:.12em;color:var(--murekkep);
  background:var(--kagit);border:1px solid var(--cizgi);border-radius:4px;padding:4px 8px}
.foto-slot.d45{aspect-ratio:4/5}
.foto-slot.d169{aspect-ratio:16/9}
.foto-slot.d32{aspect-ratio:3/2}

/* ── CCİ portföy şeridi (markalar referans — kahraman değil) ── */
.portfoy{margin-top:16px;background:#fff;border:1px solid var(--cizgi);border-radius:10px;
  padding:28px 30px}
.portfoy .etiket-mono{margin-bottom:22px}
.portfoy-logolar{display:flex;flex-wrap:wrap;align-items:center;gap:26px 42px}
.portfoy-logolar img{height:30px;width:auto;flex:none}

/* ── Bölge seçici ── */
.bolge-duzen{display:grid;grid-template-columns:minmax(0,42fr) minmax(0,58fr);
  gap:clamp(28px,4vw,56px);align-items:start}
.bolge-sekmeler{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.bolge-sekme{font:600 .95rem/1 var(--sans);padding:12px 22px;min-height:46px;
  border:1px solid var(--cizgi);border-radius:99px;background:#fff;cursor:pointer;
  transition:all .18s var(--yay)}
.bolge-sekme:active{transform:scale(.96)}
.bolge-sekme[aria-selected="true"]{background:var(--murekkep);color:var(--kagit);border-color:var(--murekkep)}
.bolge-ozet{color:var(--gri);margin-bottom:20px;max-width:52ch}
.sube-kartlar{display:flex;flex-direction:column;gap:12px}
.kart-sube{background:#fff;border:1px solid var(--cizgi);border-radius:10px;padding:22px 24px;
  display:flex;flex-direction:column;gap:8px}
.kart-sube .ust-satir{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.kart-sube h3{font-size:1.08rem}
.kart-sube .rol{color:var(--gri);font-size:.92rem}
.kart-sube .detay{font-family:var(--mono);font-size:.74rem;color:var(--gri);
  letter-spacing:.04em;padding-top:10px;border-top:1px dashed var(--cizgi)}
.bolge-harita svg{width:100%;height:auto}
.bolge-harita .il-grup{opacity:.3;transition:opacity .3s}
.bolge-harita .il-grup.aktif{opacity:1}
.bolge-harita .il-grup.aktif .rota-dugum{fill:var(--kirmizi)}

/* ── Zaman çizelgesi bandı ── */
.zaman-dis{border-block:1px solid var(--cizgi);background:#fff}
.zaman-bandi{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;
  scrollbar-color:var(--cizgi) transparent}
.zaman-madde{flex:0 0 min(300px,78vw);scroll-snap-align:start;padding:clamp(32px,4vw,52px) 28px;
  border-right:1px solid var(--cizgi);display:flex;flex-direction:column;gap:10px;position:relative}
.zaman-madde::before{content:'';position:absolute;top:0;left:28px;width:34px;height:3px;
  background:var(--kirmizi)}
.zaman-madde .yil{font-family:var(--mono);font-weight:600;font-size:1.9rem;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
.zaman-madde .ad{font-weight:700;font-size:1.12rem;letter-spacing:-.015em}
.zaman-madde .not{font-family:var(--mono);font-size:.72rem;color:var(--gri);letter-spacing:.06em}
.zaman-madde.kapanis{justify-content:center;background:var(--kagit-koyu)}
.zaman-madde.kapanis .ad{font-size:1.25rem;max-width:14ch;text-wrap:balance}
.zaman-madde.kapanis::before{background:var(--yesil)}

/* ── Sahne bandı (sayfada TEK koyu panel) ── */
.sahne{background:var(--koyu);color:var(--kagit-metin-ters);border-radius:14px;
  padding:clamp(40px,6vw,84px);position:relative;overflow:hidden}
.sahne::before{content:'';position:absolute;inset:0;
  background:radial-gradient(640px 320px at 88% -10%,rgba(227,0,15,.16),transparent 70%)}
.sahne>*{position:relative}
.sahne .etiket-mono{color:rgba(237,233,224,.65)}
.sahne h2{color:#fff;max-width:18ch}
.sahne .lede{color:rgba(237,233,224,.78);margin:20px 0 34px}
.sahne .rota-mini{position:absolute;right:-40px;bottom:-60px;width:360px;opacity:.2;pointer-events:none}

/* ── Kariyer bandı ── */
.kariyer-duzen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,4vw,64px);align-items:center}
.kariyer-duzen h2{max-width:14ch}
.kariyer-duzen .lede{margin:18px 0 30px}

/* ── Footer ── */
.alt{background:var(--murekkep);color:var(--kagit-metin-ters);margin-top:clamp(64px,9vw,128px)}
.alt-ic{padding-block:clamp(48px,6vw,80px);display:grid;
  grid-template-columns:minmax(0,38fr) repeat(3,minmax(0,20fr));gap:clamp(28px,4vw,48px)}
.alt .marka b{color:#fff}
.alt .unvan{font-size:.82rem;color:rgba(237,233,224,.55);line-height:1.6;margin-top:14px;max-width:34ch}
.alt h4{font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(237,233,224,.5);margin-bottom:16px}
.alt ul{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:.92rem}
.alt a{text-decoration:none;color:var(--kagit-metin-ters)}
.alt a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.alt .soluk{color:rgba(237,233,224,.45)}
.alt .mono-not{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;
  color:rgba(237,233,224,.45);line-height:1.8}
.alt-bant{border-top:1px solid var(--cizgi-koyu);padding-block:20px;display:flex;
  gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:rgba(237,233,224,.45)}

/* ── Görünme animasyonu (yalnız JS varken — içerik JS'siz asla gizlenmez) ── */
html.js .gizli-baslar{opacity:0;transform:translateY(18px);
  transition:opacity .6s ease,transform .6s var(--yay)}
html.js .gorunur{opacity:1;transform:none}

/* ── Duyarlılık ── */
@media (max-width:1024px){
  .kategoriler{grid-template-columns:repeat(2,1fr)}
  .operasyonlar{grid-template-columns:repeat(2,1fr);gap:24px}
  .ust nav{display:none}
  .ust .btn-ust{display:none}
  .menu-dugme{display:block}
}
@media (max-width:820px){
  .hero{min-height:0;padding-top:clamp(40px,8vw,72px)}
  .hero-ic{grid-template-columns:1fr}
  .hero-rota{max-width:480px}
  .bolge-duzen{grid-template-columns:1fr}
  .bolge-harita{max-width:420px;margin:0 auto}
  .kariyer-duzen{grid-template-columns:1fr}
  .alt-ic{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .kategoriler{grid-template-columns:1fr}
  .operasyonlar{grid-template-columns:1fr}
  .istatistikler{grid-template-columns:1fr}
  .kart-istatistik{border-right:none;border-bottom:1px solid var(--cizgi)}
  .kart-istatistik:last-child{border-bottom:none}
  .alt-ic{grid-template-columns:1fr}
  .hero-cta .btn{flex:1 1 100%}
}

/* ── Hareket azaltma: animasyon sıfır ── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .gizli-baslar{opacity:1;transform:none}
}
