/* ------------------------------------------------------------------
   Dünyasan Savunma — ortak stil
   RENK: Tek kurumsal renk #0058A9. Lacivert kullanılmıyor.
   Koyu alanlar bu mavinin kendi tonlarıyla kuruluyor; nötrler ise
   mavi çalmayan düz gri.
------------------------------------------------------------------ */
:root{
  --mavi:#0058A9;
  --mavi-koyu:#00417E;
  --mavi-solgun:#EDF3F9;
  --beyaz:#ffffff;
  --gri-zemin:#F5F6F7;
  --gri-cizgi:#E2E5E8;
  --metin:#22282D;
  --metin-2:#616B75;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--beyaz);color:var(--metin);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.kap{width:min(1400px,90vw);margin:0 auto}
.kap.orta{text-align:center}
.kap.orta .baslik,.kap.orta .metin{margin-left:auto;margin-right:auto}

/* ---------- Üst şerit ---------- */
.serit{background:var(--mavi-koyu);color:#D6E6F4;font-size:13px}
.serit .ic{display:flex;justify-content:space-between;align-items:center;height:42px;gap:24px}
.serit .sol{display:flex;gap:28px}
.serit a:hover{color:#fff}
.serit .dil a{padding:0 8px;opacity:.65}
.serit .dil a.aktif{opacity:1;font-weight:700}

/* ---------- Menü ---------- */
.ust{background:#fff;border-bottom:1px solid var(--gri-cizgi);position:sticky;top:0;z-index:100}
.ust .ic{display:flex;align-items:center;justify-content:space-between;height:76px;gap:22px}
.marka img{height:34px;width:auto}
.menu{display:flex;gap:22px}
.menu a{font-size:13.5px;font-weight:600;padding:28px 0;position:relative;white-space:nowrap}
.menu a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--mavi);
  transform:scaleX(0);transition:transform .3s}
.menu a:hover{color:var(--mavi)}
.menu a:hover::after,.menu a.aktif::after{transform:scaleX(1)}
.menu a.aktif{color:var(--mavi)}
.menu-dugme{display:none;background:none;border:0;padding:0;margin:0;cursor:pointer;
  width:40px;height:40px;position:relative;font-size:0;color:var(--mavi);
  -webkit-tap-highlight-color:transparent}
.menu-dugme::before,.menu-dugme::after{content:"";position:absolute;left:8px;right:8px;height:2px;
  background:currentColor;border-radius:2px;
  transition:transform .32s cubic-bezier(.22,.61,.36,1),top .26s ease,box-shadow .14s ease}
.menu-dugme::before{top:13px;box-shadow:0 7px 0 currentColor}
.menu-dugme::after{top:27px}
.menu-dugme.acik::before{top:19px;transform:rotate(45deg);box-shadow:0 0 0 rgba(0,0,0,0)}
.menu-dugme.acik::after{top:19px;transform:rotate(-45deg)}
/* Mobil menünün içindeki Teklif Al — masaüstünde header'daki buton kullanılır */
.menu .teklif-mobil{display:none}

.btn{display:inline-block;padding:12px 26px;font-size:12.5px;font-weight:700;transition:.25s;
  border:2px solid transparent;cursor:pointer;white-space:nowrap}
.btn.dolu{background:var(--mavi);color:#fff}
.btn.dolu:hover{background:var(--mavi-koyu)}
.btn.bos{border-color:var(--mavi);color:var(--mavi)}
.btn.bos:hover{background:var(--mavi);color:#fff}
.btn.beyaz{background:#fff;color:var(--mavi)}
.btn.beyaz:hover{background:var(--mavi-solgun)}

/* ---------- Hero (ana sayfa) ---------- */
.hero{background:var(--gri-zemin);position:relative;overflow:hidden;border-bottom:1px solid var(--gri-cizgi)}
.hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:40%;background:var(--mavi);
  clip-path:polygon(0 0,100% 0,70% 100%,0 100%);opacity:.05}
.hero .ic{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;
  align-items:center;padding:58px 0 66px;position:relative}
.hero h1{font-size:clamp(27px,3.3vw,42px);line-height:1.12;font-weight:800;letter-spacing:-.02em;
  color:var(--mavi);max-width:17ch}
.hero p{margin-top:20px;font-size:15.5px;line-height:1.8;color:var(--metin-2);max-width:52ch}
.hero .aksiyon{margin-top:28px;display:flex;gap:16px;flex-wrap:wrap}

/* ---------- İç sayfa başlık bandı ---------- */
.sayfa-bas{background:var(--mavi);color:#fff;padding:46px 0 50px;position:relative;overflow:hidden}
.sayfa-bas::before{content:"";position:absolute;right:-90px;top:50%;transform:translateY(-50%);
  width:340px;height:340px;background:url(varliklar/dunyasan-amblem.svg) no-repeat center/contain;
  opacity:.09;filter:brightness(0) invert(1)}
.sayfa-bas .etiket{color:#fff;border-color:rgba(255,255,255,.55)}
.sayfa-bas h1{font-size:clamp(25px,2.8vw,36px);line-height:1.16;font-weight:800;letter-spacing:-.02em;max-width:20ch}
.sayfa-bas .giris{margin-top:15px;font-size:15.5px;line-height:1.75;color:rgba(255,255,255,.9);max-width:62ch}

.etiket{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mavi);padding-bottom:10px;margin-bottom:17px;border-bottom:2px solid var(--mavi)}

/* ---------- Dünya animasyonu (her tasarımda kalacak ortak bileşen) ----------
   Yıldız SVG üstte maske gibi durur, dönen dünya videosu ortadaki daireden
   görünür. Video yüklenene kadar küre gradyanı boşluğu doldurur. */
.kure{position:relative;aspect-ratio:1/1;display:grid;place-items:center;max-width:390px;margin-inline:auto}
.kure::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:73.8%;aspect-ratio:1/1;border-radius:50%;z-index:0;
  background:radial-gradient(circle at 34% 28%,#2E7CB5 0%,#12558F 42%,#073C68 72%,#00274A 100%)}
.kure video{position:relative;z-index:1;opacity:0;transition:opacity .7s ease;
  width:73.8%;aspect-ratio:1/1;border-radius:50%;object-fit:cover;border:6px solid #fff;
  box-shadow:0 26px 60px rgba(0,88,169,.26)}
.kure video.hazir{opacity:1}
.kure::after{content:"";position:absolute;inset:0;z-index:2;
  background:url(varliklar/yildiz.svg) no-repeat center/contain;pointer-events:none}

/* ---------- Rakam şeridi ---------- */
.rakam{background:var(--mavi);color:#fff}
.rakam .ic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.22)}
.rakam .ic > div{background:var(--mavi);padding:30px 20px;text-align:center}
.rakam b{display:block;font-size:clamp(19px,2vw,29px);font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.rakam span{display:block;margin-top:6px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.86)}

/* ---------- Bölüm ---------- */
.bolum{padding:70px 0}
.bolum.gri{background:var(--gri-zemin)}
.bolum.mavi{background:var(--mavi);color:#fff}
.bolum.mavi .baslik{color:#fff}
.bolum.mavi .metin{color:rgba(255,255,255,.88)}
.bolum.mavi .etiket{color:#fff;border-color:rgba(255,255,255,.6)}
.baslik{font-size:clamp(21px,2.3vw,30px);line-height:1.2;font-weight:800;letter-spacing:-.02em;
  color:var(--mavi);max-width:22ch}
.metin{margin-top:17px;font-size:15.5px;line-height:1.8;color:var(--metin-2);max-width:66ch}
.metin + .metin{margin-top:16px}
.metin strong{color:var(--metin);font-weight:700}
.ikili{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.bolum-ust{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;flex-wrap:wrap}
.olcu{display:flex;gap:34px;margin-top:26px;flex-wrap:wrap}
.olcu b{display:block;font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--mavi)}
.olcu span{display:block;margin-top:4px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-2)}
.resim-cerceve{border:1px solid var(--gri-cizgi);overflow:hidden;background:#fff}
.resim-cerceve img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}

/* ---------- Ürün kartları ---------- */
.urun-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:38px}
.urun-grid.buyuk{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin-top:0}
.urun{background:#fff;border:1px solid var(--gri-cizgi);transition:.35s;display:flex;flex-direction:column}
.urun:hover{border-color:var(--mavi);box-shadow:0 20px 44px rgba(0,88,169,.12);transform:translateY(-5px)}
.urun .res{aspect-ratio:16/10;overflow:hidden;background:var(--gri-zemin);display:grid;place-items:center;padding:18px}
.urun .res img{width:100%;height:100%;object-fit:contain;transition:transform .6s}
.urun:hover .res img{transform:scale(1.05)}
.urun .ii{padding:20px;flex:1;display:flex;flex-direction:column}
.urun .kalem{display:inline-block;align-self:flex-start;font-size:11.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mavi);background:var(--mavi-solgun);padding:5px 11px;margin-bottom:14px}
.urun h3{font-size:16.5px;font-weight:700;color:var(--mavi)}
.urun .en{margin-top:3px;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--metin-2)}
.urun p{margin-top:8px;font-size:13.5px;line-height:1.7;color:var(--metin-2)}
.urun .devam{margin-top:auto;padding-top:18px;display:inline-flex;gap:9px;align-items:center;
  font-size:13.5px;font-weight:700;color:var(--mavi)}
.urun .devam::after{content:"→";transition:transform .3s}
.urun:hover .devam::after{transform:translateX(6px)}

/* ---------- Ürün detay ---------- */
.urun-gorsel{border:1px solid var(--gri-cizgi);background:var(--gri-zemin);padding:36px;display:grid;place-items:center}
.urun-gorsel img{width:100%;object-fit:contain}
table.teknik{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--gri-cizgi)}
table.teknik th,table.teknik td{padding:12px 16px;text-align:left;font-size:14px;border-bottom:1px solid var(--gri-cizgi)}
table.teknik th{width:38%;color:var(--mavi);font-weight:700;background:var(--mavi-solgun)}
table.teknik td{color:var(--metin-2);line-height:1.6}
table.teknik tr:last-child th,table.teknik tr:last-child td{border-bottom:0}

.tablo-sar{overflow-x:auto;margin-top:44px;border:1px solid var(--gri-cizgi);background:#fff}
table.kod-tablo{width:100%;border-collapse:collapse;min-width:640px}
table.kod-tablo th{background:var(--mavi);color:#fff;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:12px 16px;text-align:left}
table.kod-tablo td{padding:11px 16px;font-size:13.5px;line-height:1.6;color:var(--metin-2);
  border-bottom:1px solid var(--gri-cizgi)}
table.kod-tablo td.kod{font-weight:700;color:var(--mavi);white-space:nowrap;font-variant-numeric:tabular-nums}
table.kod-tablo tr:last-child td{border-bottom:0}
table.kod-tablo tbody tr:hover{background:var(--mavi-solgun)}

.gezinme{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.gez{display:block;transition:.25s}
.gez small{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-2);margin-bottom:5px}
.gez b{font-size:17px;color:var(--mavi)}
.gez:hover b{text-decoration:underline}
.gez.sonraki{text-align:right}

/* ---------- Üretim yetenekleri ---------- */
.yetenek-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--gri-cizgi);
  border:1px solid var(--gri-cizgi);margin-top:38px}
.yt{background:#fff;padding:22px 19px;transition:.3s}
.yt:hover{background:var(--mavi-solgun)}
.yt b{display:block;font-size:14.5px;color:var(--mavi);margin-bottom:8px}
.yt span{font-size:12.5px;line-height:1.65;color:var(--metin-2)}

/* ---------- Parça şeridi ---------- */
.parca-serit{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;margin-top:50px}
.parca-serit.dort{grid-template-columns:repeat(4,minmax(0,1fr))}
.parca{aspect-ratio:1/1;border:1px solid var(--gri-cizgi);background:#fff;overflow:hidden;position:relative}
.parca img{width:100%;height:100%;object-fit:contain;padding:12px;transition:transform .5s}
.parca.kapla img{object-fit:cover;padding:0}
.parca:hover img{transform:scale(1.07)}
.parca span{position:absolute;left:0;right:0;bottom:0;background:rgba(0,88,169,.94);color:#fff;
  font-size:11.5px;text-align:center;padding:7px 4px;opacity:0;transition:opacity .3s}
.parca:hover span{opacity:1}

/* ---------- Altyapı kartları ---------- */
.altyapi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.ay{border:1px solid rgba(255,255,255,.28);padding:26px;background:rgba(255,255,255,.07)}
.ay h3{font-size:17px;margin-bottom:14px}
.ay ul{list-style:none;display:grid;gap:11px}
.ay li{font-size:14px;line-height:1.6;padding-left:22px;position:relative;color:rgba(255,255,255,.9)}
.ay li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;background:#fff}
.ay .rozet{display:inline-block;margin-top:20px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.5);padding:7px 14px}

/* ---------- Göstergeler ---------- */
.gosterge{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--gri-cizgi);
  border:1px solid var(--gri-cizgi);margin-top:26px}
.gosterge > div{background:#fff;padding:17px 11px;text-align:center}
.gosterge b{display:block;font-size:19px;font-weight:800;color:var(--mavi);letter-spacing:-.02em}
.gosterge span{display:block;margin-top:5px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--metin-2)}

/* ---------- Sertifikalar ---------- */
.sert-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:38px}
.sert{background:#fff;border:1px solid var(--gri-cizgi);padding:20px;text-align:center;transition:.3s}
.sert:hover{border-color:var(--mavi);box-shadow:0 16px 36px rgba(0,88,169,.10)}
.sert img{width:100%;aspect-ratio:3/4;object-fit:contain;background:var(--gri-zemin);margin-bottom:16px}
.sert b{display:block;font-size:13.5px;color:var(--mavi);line-height:1.45}
.sert small{display:block;margin-top:8px;font-size:12.5px;line-height:1.6;color:var(--metin-2)}

/* ---------- Referanslar ---------- */
.ref-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--gri-cizgi);
  border:1px solid var(--gri-cizgi);margin-top:38px}
.ref{background:#fff;aspect-ratio:2/1;padding:24px;transition:.3s;overflow:hidden}
.ref:hover{background:var(--mavi-solgun)}
/* max-width/max-height padding'i saymadığı için logolar taşıyordu; kutuyu
   birebir dolduran bir alan verip içine sığdırmak güvenli. */
.ref img{width:100%;height:100%;object-fit:contain;filter:grayscale(1);opacity:.62;transition:.35s}
.ref:hover img{filter:none;opacity:1}

/* ---------- Misyon / Vizyon ---------- */
.mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:38px}
.mv > div{background:#fff;border:1px solid var(--gri-cizgi);border-top:3px solid var(--mavi);padding:32px}
.mv h3{font-size:18px;color:var(--mavi);margin-bottom:14px}
.mv p{font-size:14.5px;line-height:1.85;color:var(--metin-2)}

/* ---------- İletişim ---------- */
.bilgi{display:grid;gap:24px;margin-top:34px}
.bilgi > div{padding-left:24px;border-left:3px solid var(--mavi)}
.bilgi small{display:block;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--metin-2);margin-bottom:7px}
.bilgi p{font-size:15px;line-height:1.65}
.bilgi a:hover{color:var(--mavi)}
.form{display:grid;gap:14px;background:var(--gri-zemin);border:1px solid var(--gri-cizgi);padding:28px}
.form label{display:grid;gap:8px;font-size:13.5px;font-weight:600;color:var(--metin)}
.form input,.form textarea{border:1px solid var(--gri-cizgi);background:#fff;padding:11px 13px;
  font-size:14px;font-family:inherit;color:var(--metin)}
.form input:focus,.form textarea:focus{outline:2px solid var(--mavi);outline-offset:-2px}
.form button{justify-self:start;margin-top:6px}
.form .not{font-size:12.5px;color:var(--metin-2);margin-top:-4px}

/* ---------- Altbilgi ---------- */
footer{background:var(--mavi-koyu);color:rgba(255,255,255,.74);padding:48px 0 22px;font-size:13.5px}
.alt-ic{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px;padding-bottom:30px;
  border-bottom:1px solid rgba(255,255,255,.16)}
.alt-logo{height:32px;width:auto;margin-bottom:20px}
.alt-ic p{line-height:1.8}
.alt-ic h4{color:#fff;font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.alt-ic a{display:block;padding:5px 0;transition:.2s}
.alt-ic a:hover{color:#fff;padding-left:5px}
.alt-son{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:24px;font-size:13px}

/* ---------- Beliriş ---------- */
.gel{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.gel.gorundu{opacity:1;transform:none}

/* ---------- Uyarlama ---------- */
@media(max-width:1100px){
  .urun-grid,.yetenek-grid,.sert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .parca-serit{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ref-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .alt-ic{grid-template-columns:1fr 1fr;gap:34px}
}
@media(max-width:1024px){
  .hero .ic,.ikili,.altyapi,.mv{grid-template-columns:minmax(0,1fr);gap:44px}
  .kure{max-width:360px}
  .rakam .ic,.gosterge{grid-template-columns:repeat(2,minmax(0,1fr))}
  .serit .sol{display:none}
  .urun-grid.buyuk{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:1180px){
  /* Menü header'ın ALTINA yapışır: sabit piksel (eskiden 134px) header
     yüksekliğiyle tutmuyordu ve aralarında beyaz bir bant kalıyordu. */
  .menu{position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;gap:0;
    border-top:1px solid var(--gri-cizgi);border-bottom:1px solid var(--gri-cizgi);
    box-shadow:0 24px 46px rgba(0,0,0,.14);padding:8px 0 0;
    max-height:calc(100vh - 74px);max-height:calc(100dvh - 74px);overflow-y:auto;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-14px);
    transition:opacity .26s ease,transform .32s cubic-bezier(.22,.61,.36,1),visibility .26s}
  .menu.acik{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .menu a{padding:14px 4vw;opacity:0;transform:translateY(-9px);
    transition:opacity .3s ease,transform .34s cubic-bezier(.22,.61,.36,1),background .2s ease,color .2s ease}
  .menu.acik a{opacity:1;transform:none}
  /* Kapanış anında maddeler sırayla değil, hep birlikte silinsin */
  .menu:not(.acik) a{transition-delay:0s!important}
  .menu a:active{background:var(--mavi-solgun)}
  .menu a::after{display:none}
  .menu-dugme{display:block}
  /* Menü akıştan çıkınca space-between TR/EN bloğunu ortada bırakıyordu */
  .ust .ic{gap:14px}
  .ust .sag{margin-left:auto}
  /* Header'daki Teklif Al butonu bu genişlikte sığmıyor; gizleniyor ve
     yerine mobil menünün sonunda tam genişlikte bir bağlantı çıkıyor.
     Öncesinde mobilde Teklif Al'a hiçbir yerden erişilemiyordu. */
  .ust .btn.dolu{display:none}
  .menu .teklif-mobil{display:block;margin:10px 4vw 18px;padding:14px 20px;
    background:var(--mavi);color:#fff;font-weight:700;text-align:center;
    letter-spacing:.02em;transition:.25s}
  .menu .teklif-mobil:hover{background:var(--mavi-koyu);color:#fff}
}
/* 1180-1400 arası: menü sığıyor ama sıkışık; madde arası ve yazı bir tık küçülüyor */
@media(max-width:1400px) and (min-width:1181px){
  .menu{gap:12px}
  .menu a{font-size:12.5px}
}
@media(max-width:640px){
  .bolum{padding:64px 0}
  .urun-grid,.yetenek-grid,.sert-grid,.parca-serit,.ref-grid,.alt-ic{grid-template-columns:minmax(0,1fr)}
  .parca-serit.dort{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ust .ic{height:74px}
  .marka img{height:32px}
  .gezinme{flex-direction:column;align-items:flex-start}
  .gez.sonraki{text-align:left}
}

/* ---------- Header sağ blok (dil + teklif) ---------- */
.ust .sag{display:flex;align-items:center;gap:22px}
.dil{display:flex;align-items:center;font-size:13px;font-weight:700;letter-spacing:.06em}
.dil a{padding:5px 8px;color:var(--metin-2);transition:.2s}
.dil a:hover{color:var(--mavi)}
.dil a.aktif{color:var(--mavi);border-bottom:2px solid var(--mavi)}

/* ---------- Ürünler sayfası: katalog düzeni ---------- */
.hizli-gez{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:38px;margin-bottom:8px;
  border-bottom:1px solid var(--gri-cizgi)}
.hizli-gez a{font-size:13.5px;font-weight:600;color:var(--metin-2);border:1px solid var(--gri-cizgi);
  padding:10px 18px;transition:.25s}
.hizli-gez a:hover{border-color:var(--mavi);color:var(--mavi);background:var(--mavi-solgun)}

.urun-blok{padding:36px 0;border-bottom:1px solid var(--gri-cizgi)}
.urun-blok:last-child{border-bottom:0}
.blok-bas{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:32px;align-items:center}
.blok-gorsel{border:1px solid var(--gri-cizgi);background:var(--gri-zemin);padding:20px;
  display:grid;place-items:center;aspect-ratio:4/3}
.blok-gorsel img{width:100%;height:100%;object-fit:contain}
.blok-bilgi h2{font-size:22px;font-weight:800;color:var(--mavi);letter-spacing:-.02em;margin-top:4px}
.blok-bilgi .en{margin-top:4px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--metin-2)}
.blok-bilgi .ozet{margin:11px 0 18px;font-size:14.5px;line-height:1.75;color:var(--metin-2);max-width:56ch}
.blok-bilgi .kalem{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mavi);background:var(--mavi-solgun);padding:5px 11px}
.toplam{margin-top:14px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--metin-2)}
.urun-blok .tablo-sar{margin-top:30px}

/* ---------- Kariyer ---------- */
table.kod-tablo.pozisyon td{vertical-align:middle}
table.kod-tablo.pozisyon td b{color:var(--metin);font-size:15.5px}
table.kod-tablo td.sag{text-align:right}
.kucuk-btn{display:inline-block;background:var(--mavi);color:#fff;font-size:12.5px;font-weight:700;
  padding:9px 20px;transition:.25s;white-space:nowrap}
.kucuk-btn:hover{background:var(--mavi-koyu)}
.ikili-alan{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form select{border:1px solid var(--gri-cizgi);background:#fff;padding:13px 15px;font-size:15px;
  font-family:inherit;color:var(--metin)}
.form input[type="file"]{padding:11px;background:#fff;font-size:14px}
.form label.onay{display:flex;flex-direction:row;align-items:flex-start;gap:11px;font-weight:400;
  font-size:14px;line-height:1.6;color:var(--metin-2)}
.form label.onay input{width:17px;height:17px;margin-top:2px;flex:0 0 17px}
.bag{color:var(--mavi);font-weight:600}
.bag:hover{text-decoration:underline}

@media(max-width:900px){
  .blok-bas{grid-template-columns:minmax(0,1fr);gap:26px}
  .ikili-alan{grid-template-columns:1fr}
  .ust .sag .btn.dolu{display:none}
}

/* ---------- Ürünler sayfası: kart ızgarası ---------- */
.ur-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ur-kart{position:relative;background:#fff;border:1px solid var(--gri-cizgi);
  display:flex;flex-direction:column;transition:.35s;overflow:hidden}
.ur-kart:hover{border-color:var(--mavi);box-shadow:0 18px 40px rgba(0,88,169,.13);transform:translateY(-4px)}
.ur-no{position:absolute;top:14px;left:16px;z-index:2;font-size:12px;font-weight:800;
  letter-spacing:.1em;color:var(--mavi);opacity:.45}
.ur-res{aspect-ratio:4/3;background:linear-gradient(160deg,var(--mavi-solgun),#fff 70%);
  display:grid;place-items:center;padding:22px;border-bottom:1px solid var(--gri-cizgi)}
.ur-res img{width:100%;height:100%;object-fit:contain;transition:transform .55s}
.ur-kart:hover .ur-res img{transform:scale(1.06)}
.ur-alt{padding:20px;display:flex;flex-direction:column;flex:1}
.ur-alt h3{font-size:17px;font-weight:700;color:var(--mavi);line-height:1.3}
.ur-en{margin-top:3px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--metin-2)}
.ur-ozet{margin-top:10px;font-size:13.5px;line-height:1.65;color:var(--metin-2)}
.ur-etiketler{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}
.rozet-kalem,.rozet-kod{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px;border:1px solid var(--gri-cizgi);color:var(--metin-2)}
.rozet-kod{background:var(--mavi);border-color:var(--mavi);color:#fff}
.ur-devam{margin-top:auto;padding-top:16px;display:inline-flex;gap:8px;align-items:center;
  font-size:13px;font-weight:700;color:var(--mavi)}
.ur-devam::after{content:"→";transition:transform .3s}
.ur-kart:hover .ur-devam::after{transform:translateX(6px)}

.katalog-cagri{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
  margin-top:34px;padding:28px 32px;background:var(--mavi-solgun);border:1px solid var(--gri-cizgi)}
.katalog-cagri h3{font-size:18px;color:var(--mavi);font-weight:700}
.katalog-cagri p{margin-top:6px;font-size:14px;color:var(--metin-2)}

@media(max-width:1100px){ .ur-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:640px){ .ur-grid{grid-template-columns:minmax(0,1fr)} }

/* ---------- Ürün ailesi galerisi ---------- */
.galeri{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:38px}
.gal-kutu{border:1px solid var(--gri-cizgi);background:#fff;overflow:hidden;transition:.3s}
.gal-kutu:hover{border-color:var(--mavi);box-shadow:0 14px 30px rgba(0,88,169,.11)}
.gal-kutu img{width:100%;aspect-ratio:1/1;object-fit:contain;padding:14px;
  background:linear-gradient(160deg,var(--mavi-solgun),#fff 70%);transition:transform .5s}
.gal-kutu:hover img{transform:scale(1.07)}
.gal-kutu figcaption{padding:11px 12px;font-size:12px;line-height:1.45;color:var(--metin-2);
  border-top:1px solid var(--gri-cizgi);text-align:center}
@media(max-width:1100px){ .galeri{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(max-width:640px){ .galeri{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- Ürün kalemleri: süzgeç + ızgara ---------- */
.suzgec{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:26px;margin-bottom:28px;
  border-bottom:1px solid var(--gri-cizgi)}
.suz{background:none;border:1px solid var(--gri-cizgi);color:var(--metin-2);font-family:inherit;
  font-size:12.5px;font-weight:600;padding:9px 16px;cursor:pointer;transition:.22s}
.suz:hover{border-color:var(--mavi);color:var(--mavi)}
.suz.aktif{background:var(--mavi);border-color:var(--mavi);color:#fff}

.kalem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.kalem{background:#fff;border:1px solid var(--gri-cizgi);display:flex;flex-direction:column;
  transition:.28s}
.kalem:hover{border-color:var(--mavi);box-shadow:0 14px 30px rgba(0,88,169,.11)}
.kalem.gizli{display:none}
/* overflow+min-height:0 olmadan grid öğesinin auto minimumu aspect-ratio'yu
   eziyor ve kartların görsel alanı farklı yükseklikte kalıyordu. */
.kalem-res{aspect-ratio:4/3;background:linear-gradient(160deg,var(--mavi-solgun),#fff 72%);
  display:grid;place-items:center;padding:16px;border-bottom:1px solid var(--gri-cizgi);
  overflow:hidden}
.kalem-res img{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;
  transition:transform .45s}
.kalem:hover .kalem-res img{transform:scale(1.06)}
.kalem-alt{padding:14px 15px 13px;display:flex;flex-direction:column;flex:1}
.kalem-ad{font-size:13px;line-height:1.5;color:var(--metin);flex:1}
.kalem-son{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;
  padding-top:11px;border-top:1px solid var(--gri-cizgi)}
.kalem-kod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;font-weight:700;
  color:var(--mavi);background:var(--mavi-solgun);padding:4px 8px;letter-spacing:.02em;white-space:nowrap}
.kalem-kod.kod-yok{background:none;color:var(--metin-2);font-weight:600;padding-left:0;
  font-family:inherit;font-style:italic}
.kalem-bag{font-size:11px;color:var(--metin-2);text-align:right;line-height:1.35;transition:.2s}
.kalem-bag:hover{color:var(--mavi)}
.kalem-bos{text-align:center;color:var(--metin-2);padding:40px 0;font-size:15px}

@media(max-width:1100px){ .kalem-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(max-width:760px){ .kalem-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:440px){ .kalem-grid{grid-template-columns:minmax(0,1fr)} }

/* ---------- Duyuru kartı (sağ altta beliren bilgi) ---------- */
.duyuru{position:fixed;right:24px;bottom:24px;z-index:90;width:min(348px,calc(100vw - 40px));
  background:#fff;border:1px solid var(--gri-cizgi);box-shadow:0 22px 50px rgba(7,20,34,.18);
  opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.duyuru.gorundu{opacity:1;transform:none}
.duyuru-kapat{position:absolute;top:6px;right:8px;z-index:2;background:rgba(255,255,255,.9);
  border:0;width:26px;height:26px;font-size:19px;line-height:1;color:var(--metin-2);cursor:pointer;
  border-radius:50%;transition:.2s}
.duyuru-kapat:hover{background:var(--gri-zemin);color:var(--metin)}
.duyuru-ic{display:flex;gap:0;align-items:stretch}
.duyuru-res{flex:0 0 96px;overflow:hidden;background:var(--mavi)}
.duyuru-res img{width:100%;height:100%;object-fit:cover}
.duyuru-yazi{padding:14px 16px 15px;min-width:0}
.duyuru-etiket{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:var(--mavi);padding:3px 8px;margin-bottom:8px}
.duyuru-yazi b{display:block;font-size:14.5px;line-height:1.35;color:var(--mavi)}
.duyuru-yazi p{margin-top:6px;font-size:12.5px;line-height:1.6;color:var(--metin-2)}
.duyuru-bag{display:inline-block;margin-top:10px;font-size:12.5px;font-weight:700;color:var(--mavi)}
.duyuru-ic:hover .duyuru-bag{text-decoration:underline}

@media(max-width:520px){
  .duyuru{right:12px;left:12px;bottom:12px;width:auto}
  .duyuru-res{flex-basis:76px}
}

/* Stok kodu olmayan kalemlerde grup adı sola yaslanır */
.kalem-son:not(:has(.kalem-kod)){justify-content:flex-start}
.kalem-son:not(:has(.kalem-kod)) .kalem-bag{text-align:left}

/* ==================================================================
   ZENGİNLEŞTİRME KATMANI
   Kurumsal mavi ana renk olarak kalır; metalik ton yalnızca ince bir
   aksan olarak kullanılır (firma metal işliyor, bu vurgu markayla
   çelişmiyor). Beğenilmezse _eski-tek-sayfa/ortak-sade.css'e dönülür.
================================================================== */
:root{
  --metalik:#C0A15B;
  --metalik-acik:#E4D2A4;
  --metalik-cizgi:linear-gradient(90deg,transparent,var(--metalik) 22%,var(--metalik-acik) 50%,var(--metalik) 78%,transparent);
}

/* ---------- Bölüm dokusu ---------- */
.bolum,.hero{position:relative}
/* Desen yalnızca gri ve mavi bölümlerde; beyaz bölümler sade kalsın ki
   sayfa boğulmasın. */
.bolum.gri::before,.bolum.mavi::before{content:"";position:absolute;inset:0;
  pointer-events:none;z-index:0;background:url(varliklar/desen.svg) repeat;
  background-size:320px}
.bolum.gri::before{opacity:.14}
.bolum.mavi::before{opacity:.09;filter:brightness(0) invert(1)}
.bolum > *{position:relative;z-index:1}

/* ---------- Başlık aksanı ---------- */
.etiket{position:relative;border-bottom:0;padding-bottom:12px}
.etiket::after{content:"";position:absolute;left:0;bottom:0;width:54px;height:2px;
  background:var(--metalik-cizgi)}
.bolum.mavi .etiket::after,.sayfa-bas .etiket::after{
  background:linear-gradient(90deg,var(--metalik-acik),transparent)}

.baslik{position:relative}
.bolum-ust,.ikili > div > .baslik{margin-bottom:2px}

/* ---------- Hero derinliği ---------- */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:var(--metalik-cizgi);opacity:.75}
.hero .ic{z-index:1}

/* ---------- Sayfa başlık bandı: metalik alt çizgi ---------- */
.sayfa-bas{border-bottom:3px solid transparent;
  background-image:url(varliklar/desen.svg),linear-gradient(var(--mavi),var(--mavi));
  background-size:250px,auto;background-repeat:repeat,no-repeat}
.sayfa-bas::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:var(--metalik-cizgi)}

/* ---------- Rakam şeridi: metalik ayraç ---------- */
.rakam{position:relative}
.rakam::before,.rakam::after{content:"";position:absolute;left:0;right:0;height:2px;
  background:var(--metalik-cizgi);opacity:.85}
.rakam::before{top:0} .rakam::after{bottom:0}
.rakam b{position:relative;display:inline-block}

/* ---------- Kartlarda köşe aksanı ---------- */
.urun,.kalem,.sert,.mv > div,.gal-kutu,.yt{position:relative}
.kalem::after,.sert::after,.gal-kutu::after{content:"";position:absolute;top:0;right:0;
  width:0;height:0;border-style:solid;border-width:0 14px 14px 0;
  border-color:transparent var(--metalik) transparent transparent;opacity:0;transition:opacity .3s}
.kalem:hover::after,.sert:hover::after,.gal-kutu:hover::after{opacity:.85}

.mv > div{border-top:0}
.mv > div::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:var(--metalik-cizgi)}

/* ---------- Misyon/vizyon ve alıntı kutuları ---------- */
.mv h3{display:flex;align-items:center;gap:11px}
.mv h3::before{content:"";width:22px;height:1.5px;background:var(--metalik)}

/* ---------- Altbilgi ---------- */
footer{position:relative}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:var(--metalik-cizgi)}
footer::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:url(varliklar/desen.svg) repeat;background-size:220px;opacity:.05;
  filter:brightness(0) invert(1)}
footer .kap{position:relative;z-index:1}

/* ---------- Düğmelerde ince parlama ---------- */
.btn.dolu{position:relative;overflow:hidden}
.btn.dolu::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  transform:skewX(-18deg);transition:left .55s ease}
.btn.dolu:hover::after{left:120%}

/* ---------- Görsel çerçevesi ---------- */
.resim-cerceve{position:relative}
.resim-cerceve::after{content:"";position:absolute;inset:8px;border:1px solid rgba(255,255,255,.42);
  pointer-events:none}
.resim-cerceve::before{content:"";position:absolute;left:0;top:0;width:44px;height:44px;z-index:2;
  border-top:2px solid var(--metalik);border-left:2px solid var(--metalik)}

/* ---------- Süzgeç düğmelerinde aktif aksan ---------- */
.suz.aktif{position:relative}
.suz.aktif::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;
  background:var(--metalik-acik)}

/* ---------- Sayaç ---------- */
.rakam b[data-sayac]{font-variant-numeric:tabular-nums}

/* ---------- Sertifika rozet şeridi (kalite sayfası) ---------- */
.rozet-serit{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.rozet-serit span{font-size:12.5px;font-weight:700;letter-spacing:.05em;color:var(--mavi);
  background:#fff;border:1px solid var(--gri-cizgi);padding:10px 16px;position:relative}
.rozet-serit span::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--metalik-cizgi)}
.rozet-serit span.ozel{background:var(--mavi);color:#fff;border-color:var(--mavi)}

/* ---------- Sertifikalar sayfası ---------- */
.sert-liste{display:grid;gap:20px}
.sert-kart{display:grid;grid-template-columns:minmax(0,178px) minmax(0,1fr);gap:26px;
  background:#fff;border:1px solid var(--gri-cizgi);padding:22px;transition:.3s;position:relative}
.sert-kart:hover{border-color:var(--mavi);box-shadow:0 16px 36px rgba(0,88,169,.1)}
.sert-kart.one-cikan{border-left:3px solid transparent;
  background-image:var(--metalik-cizgi),linear-gradient(#fff,#fff);
  background-size:3px 100%,auto;background-position:left top,0 0;background-repeat:no-repeat}
.sert-gorsel{aspect-ratio:3/4;background:var(--gri-zemin);border:1px solid var(--gri-cizgi);
  overflow:hidden;display:grid;place-items:center}
.sert-gorsel img{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
.sert-bilgi{align-self:center;min-width:0}
.sert-bilgi h3{font-size:19px;font-weight:700;color:var(--mavi);line-height:1.3}
.sert-kurum{margin-top:7px;font-size:13px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--metin-2)}
.sert-detay{margin-top:12px;font-size:14.5px;line-height:1.7;color:var(--metin-2)}

@media(max-width:640px){
  .sert-kart{grid-template-columns:minmax(0,1fr);gap:18px}
  .sert-gorsel{max-width:200px}
}

/* ---------- Kariyer ilanları ---------- */
.ilan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:38px}
.ilan{background:#fff;border:1px solid var(--gri-cizgi);padding:26px;position:relative;
  display:flex;flex-direction:column;transition:.3s}
.ilan:hover{border-color:var(--mavi);box-shadow:0 16px 36px rgba(0,88,169,.1)}
.ilan::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gri-cizgi)}
.ilan.alimda::before{background:var(--metalik-cizgi);
  background-image:linear-gradient(180deg,var(--metalik),var(--metalik-acik),var(--metalik))}
.ilan.acik::before{background:var(--mavi)}

.ilan-ust{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.ilan-rozet{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 11px;background:var(--gri-zemin);color:var(--metin-2)}
.ilan.alimda .ilan-rozet{background:var(--metalik);color:#3a2d06;position:relative}
.ilan.alimda .ilan-rozet::after{content:"";position:absolute;right:-4px;top:-4px;width:7px;height:7px;
  border-radius:50%;background:var(--metalik);animation:nabiz 1.9s ease-in-out infinite}
.ilan.acik .ilan-rozet{background:var(--mavi-solgun);color:var(--mavi)}
@keyframes nabiz{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.5);opacity:.35}}
.ilan-birim{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--metin-2)}
.ilan h3{font-size:19px;font-weight:700;color:var(--mavi);line-height:1.3}
.ilan-sekil{margin-top:5px;font-size:12.5px;color:var(--metin-2)}
.ilan-aciklama{margin-top:13px;font-size:14px;line-height:1.7;color:var(--metin-2)}
.ilan-nitelik{list-style:none;margin-top:14px;display:grid;gap:6px}
.ilan-nitelik li{font-size:13px;line-height:1.55;color:var(--metin-2);padding-left:17px;position:relative}
.ilan-nitelik li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  background:var(--mavi);opacity:.45}
.ilan-btn{margin-top:auto;padding-top:20px;display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;color:var(--mavi)}
.ilan-btn::after{content:"→";transition:transform .3s}
.ilan:hover .ilan-btn::after{transform:translateX(6px)}
.ilan.havuz{background:var(--gri-zemin)}

@media(max-width:820px){ .ilan-grid{grid-template-columns:minmax(0,1fr)} }

/* ==================================================================
   ALTIN ÇERÇEVE KATMANI
   Kurumsal mavi ana renk; altın çerçeve ve süslemeler prestij katmanı.
   Geri dönmek için: _eski-tek-sayfa/ortak-hafif-metalik.css
================================================================== */
:root{
  --altin:#C9A227;
  --altin-acik:#EBDCA8;
  --altin-koyu:#8E6E1A;
  --altin-yuzey:linear-gradient(135deg,var(--altin-koyu) 0%,var(--altin-acik) 38%,
    var(--altin) 52%,var(--altin-koyu) 100%);
}

/* ---------- Genel çerçeve yardımcısı ---------- */
.altin-cerceve{position:relative;padding:3px;background:var(--altin-yuzey)}
.altin-cerceve > *{background:#fff;position:relative;z-index:1}

/* ---------- Kartlarda altın çerçeve ---------- */
.sert-kart,.mv > div,.ilan.alimda,.katalog-cagri{
  background:#fff;border:2px solid var(--altin);position:relative}
/* .duyuru bu listeye alınmaz: position:fixed kalmalı, yoksa kart
   ekranın sağ altına sabitlenmeyip sayfanın en altına düşer. */
.duyuru{background:#fff;border:2px solid var(--altin)}
.katalog-cagri{background:var(--mavi-solgun)}
.ilan.alimda{background:#fff}

/* İç ince çizgi — çerçeveye derinlik verir */
.sert-kart::before,.mv > div::after,.katalog-cagri::before{
  content:"";position:absolute;inset:5px;border:1px solid rgba(201,162,39,.42);
  pointer-events:none;z-index:0}

/* Köşe süslemeleri */
.sert-kart::after{content:"";position:absolute;top:-2px;right:-2px;width:26px;height:26px;
  border-top:4px solid var(--altin-koyu);border-right:4px solid var(--altin-koyu);
  pointer-events:none;opacity:1;background:none}
.sert-kart.one-cikan{border-width:3px}
.sert-kart.one-cikan::after{border-width:5px}

.mv > div{border-top:5px solid var(--altin)}
.mv > div::before{content:"";position:absolute;left:0;right:0;top:0;height:0}

/* ---------- Görsel çerçeveleri: klasik altın kenar ---------- */
.resim-cerceve{padding:9px;background:var(--altin-yuzey);border:0}
.resim-cerceve img{border:1px solid rgba(255,255,255,.5)}
.resim-cerceve::after{inset:16px;border:1px solid rgba(255,255,255,.5)}
.resim-cerceve::before{display:none}

.urun-gorsel,.blok-gorsel{padding:8px;background:var(--altin-yuzey);border:0}
.urun-gorsel img,.blok-gorsel img{background:#fff;padding:20px}

.sert-gorsel{padding:6px;background:var(--altin-yuzey);border:0}
.sert-gorsel img{background:#fff}

/* ---------- Başlık süslemesi ---------- */
.baslik{position:relative}
.bolum .kap > .gel > .baslik::after,
.bolum .kap > .baslik::after{content:"";display:block;width:88px;height:16px;margin-top:16px;
  background:url(varliklar/ayirici.svg) no-repeat left center}
.bolum.mavi .baslik::after,.sayfa-bas h1::after{filter:brightness(1.5)}
/* Ortalı bölümlerde süs de ortalansın; varsayılanı sola dayalı */
.kap.orta .baslik::after{margin-left:auto;margin-right:auto;background-position:center}

/* ---------- Rakam şeridi: altın çerçeveli kutular ---------- */
.rakam{background:var(--mavi-koyu);padding:3px 0}
.rakam::before,.rakam::after{height:3px;background:var(--altin-yuzey);opacity:1}
.rakam .ic{background:var(--altin);gap:2px;border:2px solid var(--altin)}
.rakam .ic > div{background:var(--mavi-koyu);position:relative}
.rakam .ic > div::after{content:"";position:absolute;inset:8px;border:1px solid rgba(201,162,39,.4);
  pointer-events:none}
.rakam b{color:var(--altin-acik)}

/* ---------- Bölüm ayırıcı ---------- */
.bolum + .bolum::before{content:""}
.bolum.gri,.bolum.mavi{border-top:2px solid transparent;
  background-image:linear-gradient(var(--gri-zemin),var(--gri-zemin)),var(--altin-yuzey);
  background-origin:border-box;background-clip:padding-box,border-box}
.bolum.mavi{background-image:linear-gradient(var(--mavi),var(--mavi)),var(--altin-yuzey);
  border-bottom:2px solid transparent}

/* ---------- Sayfa başlık bandı ---------- */
.sayfa-bas::after{height:4px;background:var(--altin-yuzey)}
.sayfa-bas .etiket::after{background:var(--altin-yuzey);width:64px;height:2px}

/* ---------- Hero ---------- */
.hero::after{height:4px;background:var(--altin-yuzey);opacity:1}

/* ---------- Düğmeler ---------- */
.btn.bos{border-color:var(--altin);color:var(--mavi);position:relative}
.btn.bos:hover{background:var(--altin);border-color:var(--altin);color:#3a2d06}
.btn.dolu{border:1px solid var(--altin)}

/* ---------- Etiketler ---------- */
.etiket::after{background:var(--altin-yuzey);height:2px;width:48px}

/* ---------- Rozet şeridi ---------- */
.rozet-serit span{border-color:transparent;
  background-image:linear-gradient(#fff,#fff),var(--altin-yuzey);
  background-origin:border-box;background-clip:padding-box,border-box;border:1.5px solid transparent}
.rozet-serit span::before{display:none}
.rozet-serit span.ozel{background-image:linear-gradient(var(--mavi),var(--mavi)),var(--altin-yuzey)}

/* ---------- Altbilgi ---------- */
footer::before{height:3px;background:var(--altin-yuzey)}
.alt-ic h4{color:var(--altin-acik)}

/* ---------- Duyuru kartı ---------- */
.duyuru{border-color:transparent;
  background-image:linear-gradient(#fff,#fff),var(--altin-yuzey);
  background-origin:border-box;background-clip:padding-box,border-box;border:2px solid transparent}
.duyuru-etiket{background:var(--altin-yuzey);color:#3a2d06}

/* ---------- Ana sayfa slayt gösterisi ---------- */
.slayt-bolum{background:var(--gri-zemin)}
.slayt-kutu{position:relative;margin-top:38px;padding:8px;background:var(--altin-yuzey)}
.slayt-sahne{position:relative;aspect-ratio:21/9;overflow:hidden;background:var(--mavi-koyu)}
.slayt{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .35s ease,visibility .35s ease}
.slayt.etkin{opacity:1;visibility:visible;pointer-events:auto}
.slayt img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.06)}
/* Yavaş yakınlaşma yalnız görünen karede çalışır ve yalnız o kare kompozit
   katmana alınır. Eskiden yedi karenin de dönüşümü canlıydı; çıkan kare
   1,06'ya geri sarılırken görünen karenin animasyonuyla aynı anda çiziliyor,
   fare üstündeyken geçiş gözle görülür şekilde takılıyordu. */
.slayt.etkin img{transform:scale(1);transition:transform 1.6s ease-out;will-change:transform}
@media(prefers-reduced-motion:reduce){
  .slayt img{transform:none}
  .slayt.etkin img{transform:none;transition:none;will-change:auto}
}
.slayt figcaption{position:absolute;left:0;right:0;bottom:0;padding:52px 34px 26px;color:#fff;
  background:linear-gradient(transparent,rgba(0,44,86,.86))}
.slayt figcaption b{display:block;font-size:21px;font-weight:800;letter-spacing:-.01em}
.slayt figcaption span{display:block;margin-top:5px;font-size:13.5px;color:rgba(255,255,255,.82)}

.slayt-ok{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;
  border:1.5px solid var(--altin);background:rgba(0,44,86,.55);color:#fff;font-size:22px;
  cursor:pointer;transition:.25s;display:grid;place-items:center}
.slayt-ok:hover{background:var(--altin);color:#3a2d06}
.slayt-ok.sol{left:24px} .slayt-ok.sag{right:24px}

.slayt-noktalar{position:absolute;left:0;right:0;bottom:18px;z-index:3;display:flex;
  justify-content:center;gap:9px}
.slayt-nokta{width:9px;height:9px;border:1px solid var(--altin-acik);background:rgba(255,255,255,.25);
  cursor:pointer;padding:0;transition:.25s}
.slayt-nokta.etkin{background:var(--altin);width:26px}

@media(max-width:820px){
  .slayt-sahne{aspect-ratio:4/3}
  .slayt-ok{width:38px;height:38px}
  .slayt-ok.sol{left:10px} .slayt-ok.sag{right:10px}
  .slayt figcaption{padding:40px 18px 22px}
  .slayt figcaption b{font-size:17px}
}

/* ---------- Ürün portföyü ---------- */
.pf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.pf-kart{background:#fff;border:2px solid var(--gri-cizgi);display:flex;flex-direction:column;
  transition:.35s;position:relative}
.pf-kart:hover{border-color:var(--altin);box-shadow:0 20px 44px rgba(0,88,169,.13);
  transform:translateY(-5px)}
.pf-res{position:relative;aspect-ratio:4/3;overflow:hidden;
  background:linear-gradient(160deg,var(--mavi-solgun),#fff 72%);
  display:grid;place-items:center;padding:22px;border-bottom:1px solid var(--gri-cizgi)}
.pf-res img{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;transition:transform .55s}
.pf-kart:hover .pf-res img{transform:scale(1.07)}
.pf-no{position:absolute;top:10px;left:12px;font-size:12px;font-weight:800;letter-spacing:.1em;
  color:var(--altin-koyu);opacity:.6}
.pf-alt{padding:15px 16px 16px;display:flex;flex-direction:column;flex:1}
.pf-alt h3{font-size:14.5px;font-weight:700;color:var(--mavi);line-height:1.3}
.pf-en{margin-top:3px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--metin-2)}
.pf-ozet{margin-top:11px;font-size:13.5px;line-height:1.65;color:var(--metin-2);flex:1}
.pf-son{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;
  padding-top:13px;border-top:1px solid var(--gri-cizgi)}
.pf-adet{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--altin-koyu);background:rgba(201,162,39,.12);padding:5px 10px}
.pf-bak{font-size:13px;font-weight:700;color:var(--mavi);display:inline-flex;gap:7px;align-items:center}
.pf-bak::after{content:"→";transition:transform .3s}
.pf-kart:hover .pf-bak::after{transform:translateX(6px)}

@media(max-width:1100px){ .pf-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(max-width:860px){ .pf-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:640px){ .pf-grid{grid-template-columns:minmax(0,1fr)} }

/* ---------- Hero arka plan videosu (filigran) ---------- */
/* Tesis videosu hero'nun ardında soluk döner; metnin okunurluğu için
   üzerine soldan sağa açılan bir zemin perdesi bindirilir. */
.hero-video{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero-video video{width:100%;height:100%;object-fit:cover;display:block;
  opacity:.32;filter:grayscale(.22) contrast(1.06)}
.hero-video::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,
    var(--gri-zemin) 0%,
    rgba(244,246,249,.90) 32%,
    rgba(244,246,249,.60) 56%,
    rgba(244,246,249,.34) 100%)}
/* Videonun üstündeki mavi köşe dokusu perdeden sonra gelsin */
.hero::before{z-index:1}
.hero::after{z-index:2}
.hero .ic{z-index:3}

@media(max-width:820px){
  /* Dar ekranda küre metnin altında, ortalanmış ve taşmayan boyutta durmalı */
  .hero .ic{padding:38px 0 46px}
  .kure{max-width:min(310px,76vw);width:100%}
  .hero-video video{opacity:.24}
  .hero-video::after{background:linear-gradient(180deg,
    rgba(244,246,249,.9) 0%,rgba(244,246,249,.82) 60%,rgba(244,246,249,.9) 100%)}
}

/* ---------- Belge şeridi (Kalite sayfası) ---------- */
/* Standart adlarını yazmak yerine belgenin kendisini gösterir. */
.belge-serit{margin-top:34px;max-width:310px}
.belge{display:block;position:relative;background:#fff;border:2px solid var(--altin);
  padding:6px;transition:transform .3s,box-shadow .3s;overflow:hidden}
.belge::after{content:"";position:absolute;inset:5px;border:1px solid rgba(201,162,39,.34);
  pointer-events:none}
.belge img{display:block;width:100%;height:auto}
.belge:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(0,44,86,.2);z-index:2}


/* ---------- Özel üretim ---------- */
/* Kategoriler ürün portföyüyle aynı ızgarada, aynı kart biçiminde */

/* Kategori sayfası — parça fotoğrafları */
.oz-giris{max-width:74ch}
/* Parçalar aynı kare tuvale ortalandığı için kartlar da kare ve tek boyut */
.oz-kareler{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:32px}
.oz-kare{margin:0;border:2px solid var(--altin);padding:5px;position:relative;overflow:hidden;
  background:radial-gradient(circle at 50% 42%,#fff 0%,var(--gri-zemin) 84%)}
.oz-kare::after{content:"";position:absolute;inset:4px;border:1px solid rgba(201,162,39,.3);
  pointer-events:none}
.oz-kare img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain}

@media(max-width:1080px){
  .oz-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .oz-kareler{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
}
@media(max-width:620px){
  .oz-grid{grid-template-columns:minmax(0,1fr)}
  .oz-kareler{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
}

/* ---------- Teklif talebi ---------- */
/* Adım göstergesi — tamamlanan, içinde bulunulan ve bekleyen adım ayrışır */
.teklif-adim{list-style:none;margin:0 0 36px;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:adim}
.teklif-adim li{display:flex;gap:14px;align-items:center;background:#fff;
  border:2px solid var(--gri-cizgi);padding:16px 18px;transition:.3s}
.teklif-adim b{flex:0 0 32px;height:32px;display:grid;place-items:center;font-size:14px;
  background:var(--gri-zemin);color:var(--metin-3);transition:.3s}
.teklif-adim span{font-size:13px;line-height:1.55;color:var(--metin-3)}
.teklif-adim li.etkin{border-color:var(--altin);box-shadow:0 10px 26px rgba(0,88,169,.09)}
.teklif-adim li.etkin b{background:var(--altin-yuzey);color:#3a2d06}
.teklif-adim li.etkin span{color:var(--metin);font-weight:600}
.teklif-adim li.tamam{border-color:var(--altin-acik)}
.teklif-adim li.tamam b{background:var(--mavi);color:#fff;font-size:0}
.teklif-adim li.tamam b::after{content:"✓";font-size:15px}
.teklif-adim li.tamam span{color:var(--metin-2)}

/* Adım gezinme çubuğu */
.adim-dugme{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.adim-dugme .btn{margin:0}
.adim-dugme #adimIleri,.adim-dugme #adimGonder{margin-left:auto}
.adim-sayac{font-size:12.5px;letter-spacing:.08em;color:var(--metin-3);
  font-variant-numeric:tabular-nums}
.adim-not{margin-top:14px;font-size:12.5px;line-height:1.65;color:var(--metin-3)}
.alan-hata{border-color:#c0392b !important}

.teklif-form{max-width:none}
.teklif-form fieldset{border:1px solid var(--gri-cizgi);padding:24px 26px 26px;margin-bottom:24px}
.teklif-form legend{padding:0 10px;font-size:11.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mavi)}
.ikili-alan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}
.teklif-form select{width:100%;padding:11px 12px;border:1px solid var(--gri-cizgi);
  background:#fff;font-family:inherit;font-size:14px;color:var(--metin)}

/* Dosya yükleme alanı */
.dosya-alan{display:block;border:2px dashed var(--altin);background:var(--mavi-solgun);
  padding:30px 24px;text-align:center;cursor:pointer;transition:.25s;margin-bottom:18px}
.dosya-alan:hover,.dosya-alan.uzerinde{background:#fff;border-color:var(--mavi)}
.dosya-ikon{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 12px;
  background:var(--altin-yuzey);color:#3a2d06;font-size:19px;font-weight:800}
.dosya-alan b{display:block;font-size:14.5px;color:var(--mavi)}
.dosya-alan small{display:block;margin-top:6px;font-size:12.5px;color:var(--metin-3)}
.dosya-alan input[type=file]{display:none}
.dosya-liste{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.dosya-liste li{display:flex;justify-content:space-between;gap:14px;align-items:center;
  background:#fff;border:1px solid var(--gri-cizgi);padding:10px 14px;font-size:13px}
.dosya-liste li span{color:var(--metin-3);font-variant-numeric:tabular-nums}
.dosya-liste li.buyuk{border-color:#c0392b;color:#c0392b}

.onay{display:flex;gap:11px;align-items:flex-start;font-size:13px;line-height:1.6;
  color:var(--metin-2);margin-bottom:22px}
.onay input{margin-top:3px;flex:0 0 auto}

@media(max-width:820px){
  .teklif-adim{grid-template-columns:minmax(0,1fr);gap:12px}
  .ikili-alan{grid-template-columns:minmax(0,1fr)}
  .teklif-form fieldset{padding:20px 16px}
}

/* Bot tuzağı — insanlar görmez, doldurulursa istek sessizce yok sayılır */
.tuzak{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

/* ---------- Form sonuç sayfaları ---------- */
.sonuc-kutu{max-width:620px;margin:0 auto;text-align:center;background:#fff;
  border:2px solid var(--altin);padding:52px 40px 46px}
.sonuc-imge{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 22px;
  font-size:30px;font-weight:800;letter-spacing:-.02em}
.sonuc-imge:not(.basarili){font-size:19px}
.sonuc-imge.basarili{background:var(--mavi);color:#fff}
.sonuc-imge.hata{background:var(--altin-yuzey);color:#3a2d06}
.sonuc-kutu h2{font-size:23px;font-weight:800;color:var(--mavi);letter-spacing:-.01em}
.sonuc-kutu p{margin-top:14px;font-size:14.5px;line-height:1.75;color:var(--metin-2)}
.sonuc-kutu .btn{margin-top:26px;display:inline-block}
.dosya-uyari{margin:0 0 18px;padding:12px 15px;border-left:3px solid #c0392b;
  background:#fdf0ee;font-size:13px;line-height:1.6;color:#8e2c20}

/* Ek yükleme durumu — varliklar/ek-yukle.js yazıyor */
.ek-durum{margin:0 0 16px;padding:11px 15px;border-left:3px solid var(--mavi);
  background:var(--mavi-solgun);font-size:13px;line-height:1.6;color:var(--mavi-koyu);
  font-variant-numeric:tabular-nums}
.ek-durum.ek-hata{border-left-color:#c0392b;background:#fdf0ee;color:#8e2c20}

/* ---------- Grup arası geçiş butonları ---------- */
.urun-gezin{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;
  margin-top:44px;padding-top:34px;border-top:1px solid var(--gri-cizgi)}
.gezin-dugme{display:flex;align-items:center;gap:16px;padding:18px 22px;background:#fff;
  border:2px solid var(--gri-cizgi);text-decoration:none;transition:.28s;min-width:0}
.gezin-dugme:hover{border-color:var(--altin);box-shadow:0 14px 32px rgba(0,88,169,.12);
  transform:translateY(-3px)}
.gezin-dugme.sonraki{justify-content:flex-end;text-align:right}
.gezin-ok{flex:0 0 38px;height:38px;display:grid;place-items:center;font-size:17px;
  background:var(--gri-zemin);color:var(--mavi);transition:.28s}
.gezin-dugme:hover .gezin-ok{background:var(--altin-yuzey);color:#3a2d06}
.gezin-yazi{min-width:0}
.gezin-yazi small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.13em;
  text-transform:uppercase;color:var(--metin-3)}
.gezin-yazi b{display:block;margin-top:4px;font-size:14.5px;font-weight:700;color:var(--mavi);
  line-height:1.3}
@media(max-width:700px){
  .urun-gezin{grid-template-columns:minmax(0,1fr);gap:12px}
  .gezin-dugme.sonraki{justify-content:flex-start;text-align:left;flex-direction:row-reverse}
}
/* Uzun ince parçalar iki kart genişliğinde: kare kartta okunmuyorlar */
/* Uzun plaka: parça 6,5:1 oranında ince. 2/1 kutuda üstte ve altta kocaman
   boşluk kalıyor, parça çerçevenin ortasında kaybolmuş görünüyordu.
   Kutu parçaya yaklaştırıldı; çerçevenin genişliği (iki kart) aynı. */
.oz-kare.genis{grid-column:span 2;align-self:center}
.oz-kare.genis img{aspect-ratio:4/1}
@media(max-width:620px){ .oz-kare.genis{grid-column:span 2} }

/* ---------- Grup sekmeleri ---------- */
/* Kategori sayfalarında bütün gruplara tek tıkla geçiş */
.grup-serit{background:#fff;border-bottom:1px solid var(--gri-cizgi);position:sticky;top:0;
  z-index:40}
.grup-serit .kap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:thin}
.grup-sekme{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:15px 16px;
  font-size:13px;font-weight:600;color:var(--metin-2);text-decoration:none;white-space:nowrap;
  border-bottom:3px solid transparent;transition:.22s}
.grup-sekme:hover{color:var(--mavi);background:var(--gri-zemin)}
.grup-sekme span{font-size:11px;font-weight:800;color:var(--metin-3);
  background:var(--gri-zemin);padding:2px 7px;transition:.22s}
.grup-sekme.etkin{color:var(--mavi);border-bottom-color:var(--altin)}
.grup-sekme.etkin span{background:var(--altin-yuzey);color:#3a2d06}
@media(max-width:820px){
  .grup-serit{position:static}
  .grup-sekme{padding:13px 12px;font-size:12.5px}
}

/* ---------- ERP sayfası ---------- */
/* Ekran görüntüleri kırpılmadan, tam görünmeli — resim-cerceve 4/3'e kırpıyor */
.erp-ekran{margin:0;padding:9px;background:var(--altin-yuzey);position:relative}
.erp-ekran img{display:block;width:100%;height:auto;border:1px solid rgba(255,255,255,.55)}
.erp-ekran figcaption{margin-top:11px;padding:0 4px 3px;font-size:12px;line-height:1.6;
  color:var(--metin-2)}

/* Tezgah başındaki panel: ekran görüntüsü telefon gövdesi içinde */
.erp-telefon{margin:0;justify-self:center;max-width:310px;padding:11px;background:#22282D;
  border-radius:26px;box-shadow:0 22px 44px rgba(0,0,0,.22)}
.erp-telefon img{display:block;width:100%;height:auto;border-radius:15px}
.erp-telefon figcaption{margin-top:12px;text-align:center;font-size:12px;line-height:1.6;
  color:rgba(255,255,255,.72)}

/* İzlenebilirlik zinciri: her adım bir sonrakine ok ile bağlanır */
.erp-zincir{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--gri-cizgi);border:1px solid var(--gri-cizgi);margin-top:30px}
.erp-zincir div{background:#fff;padding:19px 15px;position:relative}
.erp-zincir b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--altin-koyu);margin-bottom:7px}
.erp-zincir span{font-size:13.5px;line-height:1.6;color:var(--metin-1)}
.erp-zincir div:not(:last-child)::after{content:"";position:absolute;right:-7px;top:50%;
  width:12px;height:12px;margin-top:-6px;background:#fff;border-top:1px solid var(--gri-cizgi);
  border-right:1px solid var(--gri-cizgi);transform:rotate(45deg);z-index:2}

@media (max-width:900px){
  .erp-zincir{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-zincir div:not(:last-child)::after{display:none}
}
@media (max-width:560px){
  .erp-zincir{grid-template-columns:minmax(0,1fr)}
}

/* ERP logosu kutusu — logo yatay ve beyaz zeminli, resim-cerceve onu 4/3'e kırpardı */
.erp-marka{display:flex;align-items:center;justify-content:center;padding:52px 40px;
  background:#fff;border:2px solid var(--altin);position:relative}
.erp-marka::after{content:"";position:absolute;inset:5px;
  border:1px solid rgba(201,162,39,.42);pointer-events:none}
.erp-marka img{width:100%;max-width:440px;height:auto}
@media(max-width:640px){ .erp-marka{padding:34px 22px} }

/* ---------- ERP: birlikte çalıştığımız firmalar ---------- */
.bolum.mavi.firma-bolum{background:var(--mavi-koyu);
  background-image:linear-gradient(var(--mavi-koyu),var(--mavi-koyu)),var(--altin-yuzey)}
.firma-bolum .baslik{color:#fff;max-width:20ch}
.firma-bolum .etiket{color:#fff;border-color:rgba(255,255,255,.55)}
.firma-ust{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:46px;align-items:end}
.firma-ust p{font-size:14.5px;line-height:1.9;color:rgba(255,255,255,.85)}
.firma-ust p + p{margin-top:15px}

.firma-panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;margin-top:44px}
.fp-ana{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.24);
  padding:44px 38px;display:flex;flex-direction:column;justify-content:center;
  position:relative;overflow:hidden;transition:.3s}
.fp-ana::after{content:"";position:absolute;right:-64px;bottom:-64px;width:250px;height:250px;
  background:url(varliklar/dunyasan-amblem.svg) no-repeat center/contain;
  opacity:.08;filter:brightness(0) invert(1);pointer-events:none}
.fp-ana > *{position:relative;z-index:1}
.fp-ana:hover{background:rgba(255,255,255,.12)}
.fp-ana .fp-ikon{width:88px;height:88px;margin-bottom:30px}
.fp-ana b{display:block;font-size:23px;font-weight:800;letter-spacing:-.02em;margin-bottom:13px}
.fp-ana span{display:block;font-size:14.5px;line-height:1.8;color:rgba(255,255,255,.85)}

.fp-liste{display:grid;gap:1px;background:rgba(255,255,255,.24);border:1px solid rgba(255,255,255,.24)}
.fp-liste > div{background:var(--mavi-koyu);display:flex;gap:16px;align-items:flex-start;
  padding:20px 23px;transition:.3s}
.fp-liste > div:hover{background:var(--mavi)}
.fp-liste .fp-ikon{width:25px;height:25px;flex:none;margin-top:3px}
.fp-liste b{display:block;font-size:15px;font-weight:700;margin-bottom:5px}
.fp-liste span{display:block;font-size:12.8px;line-height:1.66;color:rgba(255,255,255,.8)}

.fp-ikon{display:block;color:#fff}
.fp-ikon svg{width:100%;height:100%;display:block}

.firma-serit{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
  margin-top:20px;padding:27px 34px;background:#fff}
.firma-serit b{display:block;font-size:18.5px;font-weight:800;letter-spacing:-.02em;color:var(--mavi)}
.firma-serit small{display:block;margin-top:7px;font-size:13.5px;color:var(--metin-2)}

@media(max-width:900px){
  .firma-ust{grid-template-columns:minmax(0,1fr);gap:22px;align-items:start}
  .firma-panel{grid-template-columns:minmax(0,1fr)}
  .fp-ana{padding:32px 26px}
}
@media(max-width:640px){
  .firma-serit{padding:24px 22px}
  .fp-ana .fp-ikon{width:64px;height:64px;margin-bottom:22px}
}