/* ══════════════════════════════════════════════════════════════════════════════
   TRADE ASIST — site stili
   ⛔ PALET LOGODAN ÖLÇÜLDÜ (19 Ağu 2026). Owner kendi amblemini verdi: lacivert-altın,
     zeytin dalı, Yunan tapınağı, deniz. Önceki koyu yeşil + geometrik sans palet o
     amblemle ÇAKIŞIYORDU. Kural: site logoya uyar, logo siteye değil.
   ⛔ ALTIN METİN RENGİ DEĞİLDİR: #B48424 krem üstünde 3,15:1 — normal metin için yetmez.
     Owner zaten "yazılar okunmuyor" demişti. Altın yalnız çizgi, çerçeve, büyük başlık.
   ⛔ AÇIK TEMA — prefers-color-scheme koyu bloğu YOK (TK-042 · "kara olmasın").
   ══════════════════════════════════════════════════════════════════════════════ */
:root{
  --lacivert:#00183C;      /* mürekkep — logodan ölçüldü */
  --lacivert2:#002E5F;     /* ikincil koyu yüzey */
  --altin:#B48424;         /* vurgu — YALNIZ çizgi/çerçeve/büyük başlık */
  --altin-metin:#7C5A12;   /* altının metin olarak kullanılabilir koyu varyantı */
  --zeytin:#243C0C;
  --deniz:#2B7EA5;
  --kagit:#FDFAF3;
  --krem:#F6EEDC;
  --kart:#FFFFFF;
  --soluk:#4A5262;
  --cizgi:#E2D9C4;
  --olcu: clamp(1.1rem, .6rem + 1.6vw, 2rem);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--kagit);color:var(--lacivert);
  font-family:"Commissioner",system-ui,sans-serif;font-size:18.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:"Source Serif 4","Georgia",serif;font-weight:600;line-height:1.16;
  letter-spacing:-.012em;margin:0;color:var(--lacivert)}
p{margin:0 0 1.15rem}
a{color:inherit}
img{display:block;max-width:100%}
.sar{max-width:1240px;margin:0 auto;padding-left:var(--olcu);padding-right:var(--olcu)}
.dar{max-width:74ch}
.kunye{font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--altin-metin);font-weight:500}

/* ══ ÜST BAR ══
   Amblem KÜÇÜKTE OKUNMAZ (tapınak, yelkenli, alt yazı kaybolur) — bu yüzden amblemin
   yanına ayrı kelime markası konur. Amblem logoların standart çözümü budur. */
.ust{position:sticky;top:0;z-index:60;background:rgba(253,250,243,.95);
  backdrop-filter:saturate(150%) blur(10px);border-bottom:1px solid var(--cizgi)}
.ust .sar{display:flex;align-items:center;justify-content:space-between;height:76px;gap:1rem}
/* ⛔ AMBLEM BÜYÜK VE ÜST BARDAN TAŞAR (owner: "logo çok küçük ... biraz da hero
   karuselin üzerine binecek şekilde büyüt"). Amblem, üst barın yüksekliğini
   BÜYÜTMEDEN aşağı taşar: bar 76px kalır, amblem 108px olur ve karuselin üstüne
   biner. Taşabilmesi için barın `overflow` kesmemesi ve amblemin z-index'i gerekir. */
.ust{overflow:visible}
.marka{display:flex;align-items:center;gap:.9rem;text-decoration:none;position:relative}
/* ⛔ 2. TUR (owner: "logo büyüdü desen de göremedim hâlâ küçük ... en başta
   gerçekten daha büyüt ve resimlerin üzerine binebilir").
   108px yetmedi: bar 76px olduğu için amblemin görünen kısmı zaten sınırlıydı.
   Şimdi 168px ve barın ALTINA 84px sarkıyor — yani yarısı fotoğrafın üzerinde.
   Beyaz halka koyu fotoğraf üzerinde ambleme kendi çerçevesini veriyor. */
.marka img{width:168px;height:168px;flex:0 0 168px;position:relative;z-index:2;
  margin-bottom:-84px;
  filter:drop-shadow(0 6px 18px rgba(0,24,60,.45))}
.marka .ad{font-family:"Source Serif 4",serif;font-weight:600;font-size:20px;
  letter-spacing:.13em;line-height:1;color:var(--lacivert)}
.marka .alt{font-family:"IBM Plex Mono",monospace;font-size:8.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--soluk);margin-top:.35em}
.ust nav{display:flex;gap:1.6rem;align-items:center}
.ust nav a{font-size:15.5px;text-decoration:none;color:var(--soluk);white-space:nowrap}
.ust nav a:hover{color:var(--lacivert)}
.dil{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.06em;
  border:1px solid var(--cizgi);padding:6px 11px;border-radius:2px}
.dil b{color:var(--lacivert)} .dil span{color:var(--soluk)}
@media(max-width:960px){ .ust nav a:not(.dil){display:none} .marka .alt{display:none} }
@media(max-width:1000px){ .marka img{width:132px;height:132px;flex:0 0 132px;margin-bottom:-62px} }
@media(max-width:700px){
  .marka img{width:96px;height:96px;flex:0 0 96px;margin-bottom:-40px}
  .marka .ad{font-size:17px;letter-spacing:.1em}
}

/* ══ HERO ══
   ⛔ 19 Ağu owner: "yazı karuselin üzerine fazla biniyor." BİNME YOK.
     Karusel önce ve BÜYÜK; metin tamamen ALTINDA, kendi zemininde. */
.karusel{position:relative;height:clamp(440px,74vh,760px);overflow:hidden;background:var(--lacivert)}
.kare{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease}
.kare.aktif{opacity:1}
.kare img{width:100%;height:100%;object-fit:cover}
.noktalar{position:absolute;z-index:5;left:0;right:0;bottom:20px;display:flex;
  justify-content:center;gap:10px;padding:0 var(--olcu)}
.noktalar button{width:10px;height:10px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.45);transition:background .3s,transform .3s}
.noktalar button[aria-current="true"]{background:#fff;transform:scale(1.3)}
.hero-metin{background:var(--lacivert);color:var(--kagit);
  border-top:4px solid var(--altin)}
.hero-metin .sar{padding-top:3rem;padding-bottom:3rem}
.hero-metin h1{color:#fff;font-size:clamp(2rem,1.2rem + 3vw,3.4rem);max-width:22ch}
.hero-metin .kunye{color:#D8B972}
.hero-metin .lead{color:#C9D2E0;max-width:70ch;margin-top:1.5rem;font-size:1.06rem}
.eylem{display:flex;flex-wrap:wrap;gap:1.2rem;align-items:center;margin-top:2rem}
.dugme{display:inline-block;background:var(--altin);color:#231802;text-decoration:none;
  padding:.95rem 1.9rem;font-weight:600;font-size:1rem;border-radius:2px;
  border:0;cursor:pointer;font-family:inherit;transition:background .18s}
.dugme:hover{background:#CB9A34}
.ikincil{color:#C9D2E0;text-decoration:none;font-size:1rem;
  border-bottom:1px solid #21406B;padding-bottom:3px}
.ikincil:hover{color:#fff;border-color:var(--altin)}
.manifest{background:#001229;border-top:1px solid #12305A}
.manifest .sar{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;padding:1rem 0}
.manifest span{font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:#95A6BE}

/* ══ BÖLÜM ORTAK ══ */
section{padding:clamp(3.6rem,7.5vw,6.5rem) 0}
.bolum-bas{max-width:76ch;margin-bottom:2.8rem}
.bolum-bas h2{font-size:clamp(1.65rem,1.05rem + 2.2vw,2.7rem);margin:.85rem 0 1.2rem}
.bolum-bas p{color:var(--soluk);font-size:1.06rem}
.krem{background:var(--krem)}
.giris p:first-of-type{font-size:1.28rem;line-height:1.55;color:var(--lacivert)}

/* ══ SÜREÇ — alternatif editoryal akış ══ */
.adim{display:grid;gap:2rem;align-items:center;padding:2.8rem 0;border-top:1px solid var(--cizgi)}
@media(min-width:900px){
  .adim{grid-template-columns:1fr 1fr;gap:3.4rem}
  .adim:nth-child(even) .adim-gorsel{order:2}
}
.adim-gorsel img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px}
.adim h3{font-size:clamp(1.3rem,1rem + .9vw,1.75rem);margin:.7rem 0 1rem}
.adim p{color:var(--soluk);font-size:1.02rem;margin-bottom:0}
.adim .no{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.16em;
  color:var(--altin-metin);font-weight:500}

/* ══ ORIGINS ══ */
.origins-grid{display:grid;gap:1.4rem;margin-top:2.4rem}
@media(min-width:700px){ .origins-grid{grid-template-columns:1fr 1fr} }
@media(min-width:1060px){ .origins-grid{grid-template-columns:repeat(4,1fr)} }
.origin{position:relative;border-radius:2px;overflow:hidden;aspect-ratio:3/4;background:var(--lacivert);margin:0}
.origin img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.origin:hover img{transform:scale(1.05)}
.origin .yazi{position:absolute;inset:auto 0 0 0;padding:1.2rem;color:#fff;
  background:linear-gradient(to top,rgba(0,18,41,.94),rgba(0,18,41,0))}
.origin h3{font-size:1.15rem;margin-bottom:.2rem;color:#fff}
.origin span{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;color:#D8B972}

/* ══ ÜRÜN KARTLARI — imza öğesi: künye şeridi ══ */
.urunler{display:grid;gap:1.8rem}
@media(min-width:620px){ .urunler{grid-template-columns:1fr 1fr} }
@media(min-width:1080px){ .urunler{grid-template-columns:1fr 1fr 1fr 1fr} }
.urun{background:var(--kart);border:1px solid var(--cizgi);border-radius:2px;
  display:flex;flex-direction:column;overflow:hidden}
.urun-gorsel{aspect-ratio:4/3;overflow:hidden;background:var(--krem)}
.urun-gorsel img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.urun:hover .urun-gorsel img{transform:scale(1.04)}
.urun-ic{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.urun h3{font-size:1.2rem;margin-bottom:.6rem}
.urun p{font-size:1rem;color:var(--soluk);margin:0 0 1.2rem;flex:1}
.spec{border-top:1px solid var(--cizgi);padding-top:.9rem;display:grid;gap:.45rem}
.spec div{display:flex;justify-content:space-between;gap:.9rem;
  font-family:"IBM Plex Mono",monospace;font-size:12.5px;line-height:1.45}
.spec .k{color:var(--soluk);text-transform:uppercase;letter-spacing:.1em;white-space:nowrap}
.spec .d{color:var(--lacivert);text-align:right;font-weight:500}

/* ══ KAPSAM ══ */
.ikili{display:grid;gap:1px;background:var(--cizgi);border:1px solid var(--cizgi)}
@media(min-width:840px){ .ikili{grid-template-columns:1fr 1fr} }
.ikili > div{background:var(--kagit);padding:2.2rem 2rem}
.ikili h3{font-size:1.3rem;margin-bottom:1.2rem}
.ikili ul{margin:0;padding-left:1.15rem;color:var(--soluk);font-size:1.02rem}
.ikili li{margin-bottom:.8rem}
.ikili .yap h3{color:var(--altin-metin)}

/* ══ TİCARİ ŞARTLAR ══ */
.sart{display:grid;gap:2.4rem;align-items:center}
@media(min-width:920px){ .sart{grid-template-columns:1.1fr .9fr} }
.sart img{width:100%;object-fit:cover;border-radius:2px;max-height:380px}
.sart .kutu{border-left:3px solid var(--altin);padding-left:1.7rem}

/* ══ İLETİŞİM ══ */
.iletisim{background:var(--lacivert);color:var(--kagit)}
.iletisim h2{color:#fff} .iletisim .bolum-bas p{color:#C9D2E0}
.iletisim .kunye{color:#D8B972}
.ilet-grid{display:grid;gap:2.8rem}
@media(min-width:900px){ .ilet-grid{grid-template-columns:1fr 1fr} }
.form-alan{margin-bottom:1.2rem}
.form-alan > label{display:block;font-family:"IBM Plex Mono",monospace;font-size:12px;
  letter-spacing:.13em;text-transform:uppercase;color:#95A6BE;margin-bottom:.5rem}
.form-alan input,.form-alan select,.form-alan textarea{width:100%;background:#001F4A;
  border:1px solid #123B70;color:var(--kagit);padding:.8rem .95rem;font:inherit;font-size:1rem;
  border-radius:2px}
.form-alan input:focus,.form-alan select:focus,.form-alan textarea:focus{
  outline:2px solid var(--altin);outline-offset:1px}
.taraf{display:flex;gap:.8rem}
.taraf label{flex:1;border:1px solid #123B70;padding:.8rem;text-align:center;cursor:pointer;
  border-radius:2px;color:#C9D2E0;font-family:"IBM Plex Mono",monospace;font-size:12.5px;
  letter-spacing:.12em;text-transform:uppercase;margin:0}
.taraf input{position:absolute;opacity:0;width:0;height:0}
.taraf label:has(input:checked){border-color:var(--altin);color:#fff;background:#0A2A57}
.bal{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.durum{margin-top:1rem;font-size:.98rem;min-height:1.5em}
.durum.iyi{color:#7FD4A8} .durum.kotu{color:#FF9E8A}
.ilet-bilgi div{border-top:1px solid #123B70;padding:1.15rem 0}
.ilet-bilgi .k{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.13em;
  text-transform:uppercase;color:#95A6BE;margin-bottom:.35rem}
.ilet-bilgi a{color:#fff;text-decoration:none;border-bottom:1px solid #123B70}

footer{background:#001229;color:#95A6BE;padding:3.2rem 0 2.6rem;font-size:14.5px}
/* ⛔ Amblem footer'da BÜYÜK ve SAĞ ALTTA (owner kararı). Metin solda akar,
   amblem sağda durur; dar ekranda alt alta geçer ve amblem yine sağa yaslanır. */
footer .sar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.6rem;
  align-items:flex-end}
footer .yazi{display:flex;flex-direction:column;gap:.35rem;max-width:60ch}
/* Sağ blok: dil seçici SOLDA, amblem hemen SAĞINDA — owner kararı. */
footer .alt-sag{display:flex;align-items:center;gap:1.4rem;margin-left:auto}
footer img{width:200px;height:200px;filter:drop-shadow(0 3px 14px rgba(0,0,0,.45))}
.dil-alt{border-color:#123B70;color:#C9D2E0;text-decoration:none;white-space:nowrap;
  padding:9px 14px;font-size:14px}
.dil-alt b{color:#fff} .dil-alt span{color:#95A6BE}
.dil-alt:hover{border-color:var(--altin)}
@media(max-width:760px){
  footer .sar{justify-content:center;text-align:center}
  footer .yazi{align-items:center}
  footer .alt-sag{margin:0 auto}
  footer img{width:140px;height:140px}
}

@media(prefers-reduced-motion:no-preference){
  .ac{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1)}
  .ac.gorundu{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){ .kare{transition:none} }
:focus-visible{outline:2px solid var(--altin);outline-offset:2px}

/* ══ ALT SAYFALAR (belge tipi) ═══════════════════════════════════════════════
   ⛔ Ana sayfa VİTRİN, alt sayfa BELGEDİR. Burada fotoğraf yoğunluğu değil
     OKUNABİLİRLİK önceliklidir: dar ölçü, büyük gövde, bol boşluk.
     Owner'ın "yazılar okunmuyor" tespiti burada iki kat önemli — bu sayfalarda
     kullanıcı gerçekten uzun metin okuyacak. */
.belge-bas{background:var(--lacivert);color:var(--kagit);border-top:4px solid var(--altin);
  padding:clamp(2.6rem,6vw,4.6rem) 0 clamp(2.2rem,5vw,3.4rem)}
.belge-bas h1{color:#fff;font-size:clamp(2rem,1.3rem + 2.6vw,3.2rem);max-width:20ch;margin:.7rem 0 0}
.belge-bas .kunye{color:#D8B972}
.belge-bas .lead{color:#C9D2E0;max-width:70ch;margin-top:1.4rem;font-size:1.1rem}
.belge{padding:clamp(2.8rem,6vw,5rem) 0}
.belge .sar{max-width:1240px}
.blm{max-width:68ch;margin:0 0 clamp(2.4rem,5vw,3.6rem)}
.blm h2{font-size:clamp(1.45rem,1.05rem + 1.5vw,2.05rem);margin:0 0 1rem;
  padding-top:1.6rem;border-top:1px solid var(--cizgi)}
.blm:first-child h2{padding-top:0;border-top:0}
.blm h3{font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--altin-metin);font-weight:500;margin:2rem 0 .7rem}
.blm .h3-alt{font-size:1.18rem;color:var(--lacivert);margin:-.4rem 0 1.2rem;
  font-family:"Source Serif 4",serif}
.blm p{color:var(--soluk);font-size:1.06rem;line-height:1.72}
.blm p b{color:var(--lacivert)}
.belge-cta{border-top:1px solid var(--cizgi);padding-top:2.4rem;margin-top:1rem}
.ust nav a.secili{color:var(--lacivert);border-bottom:2px solid var(--altin);padding-bottom:3px}
