/* ==========================================================
   ANATOLIA GELİŞTİRME KART SERİSİ — style.css
   Renk mantığı doğrudan fotoğraflanan PCB'den alındı:
   kırmızı FR4 + beyaz serigrafi + siyah mürekkep.
   Notlar (ileride kendime hatırlatma):
   - marquee'yi çok hızlı yapma, okunmuyor
   - buton "tık" animasyonu gerçek switch'i taklit etsin
   ========================================================== */

:root{
  /* --- Kırmızılar: gerçek kart fotoğrafından örneklendi --- */
  --kirmizi-900:#5c1219;
  --kirmizi-700:#a3222b;
  --kirmizi-600:#c6303c;
  --kirmizi-500:#e2564f;
  --kirmizi-100:#fbe4e1;

  /* --- Beyaz / kağıt tonları --- */
  --kagit:#fbf8f2;
  --kagit-koyu:#f1ebe0;
  --beyaz:#ffffff;

  /* --- Mürekkep / metin --- */
  --murekkep:#201c19;
  --murekkep-soft:#5b544c;

  /* --- Bakır: sadece küçük vurgular için (lehim noktası hissi) --- */
  --bakir:#c08a35;

  --cizgi:#e3d9cb;
  --golge:0 10px 30px rgba(32,28,25,.12);
  --golge-sert:0 4px 0 var(--kirmizi-900);

  --radius:10px;
  --font-mono:'Space Mono', ui-monospace, monospace;
  --font-sans:'Work Sans', system-ui, sans-serif;
  --font-el:'Caveat', cursive;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--murekkep);
  background:var(--kagit);
  line-height:1.6;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--font-mono);margin:0 0 .5em;line-height:1.25;letter-spacing:-.01em;}
p{margin:0 0 1em;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
ul{margin:0;padding:0;}

::selection{background:var(--kirmizi-600);color:var(--kagit);}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

/* ==================== STOK BANDI (marquee) ==================== */
.stok-bandi{
  background:var(--murekkep);
  color:var(--kagit);
  overflow:hidden;
  white-space:nowrap;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.03em;
  border-bottom:2px solid var(--kirmizi-600);
}
.stok-bandi-icerik{
  display:inline-flex;
  gap:3rem;
  padding:6px 0;
  animation:kaydir 22s linear infinite;
  width:max-content;
}
.stok-bandi-icerik span{padding-right:3rem;}
@keyframes kaydir{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ==================== HEADER ==================== */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(251,248,242,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--cizgi);
}
.header-ic{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;}
.logo{display:flex;align-items:center;gap:10px;}
.logo-cip{flex-shrink:0;transition:transform .5s;}
.logo:hover .logo-cip{transform:rotate(8deg);}
.logo-yazi{font-family:var(--font-mono);font-weight:700;font-size:1.15rem;letter-spacing:-.02em;}
.logo-yazi em{color:var(--kirmizi-600);font-style:normal;}
.logo-yazi.kucuk{font-size:1.05rem;}

.ana-nav{display:flex;align-items:center;gap:26px;font-size:.95rem;font-weight:500;}
.ana-nav a{position:relative;padding:4px 0;color:var(--murekkep-soft);transition:color .2s;}
.ana-nav a::after{
  content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;
  background:var(--kirmizi-600);transition:width .25s ease;
}
.ana-nav a:hover, .ana-nav a.aktif{color:var(--murekkep);}
.ana-nav a:hover::after, .ana-nav a.aktif::after{width:100%;}
.nav-github{
  font-family:var(--font-mono);font-size:.82rem;
  border:1.5px solid var(--murekkep);border-radius:6px;padding:6px 12px;
}
.nav-github:hover{background:var(--murekkep);color:var(--kagit);}
.nav-github::after{display:none;}

.menu-tetik{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.menu-tetik span{width:24px;height:2.5px;background:var(--murekkep);border-radius:2px;transition:.3s;}

@media (max-width:880px){
  .menu-tetik{display:flex;}
  .ana-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--kagit);flex-direction:column;align-items:flex-start;
    padding:18px 24px 26px;gap:16px;border-bottom:1px solid var(--cizgi);
    transform:translateY(-8px);opacity:0;pointer-events:none;transition:.25s;
  }
  .ana-nav.acik{transform:translateY(0);opacity:1;pointer-events:auto;}
}

/* ==================== BUTONLAR ==================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-mono);font-weight:700;font-size:.92rem;
  padding:13px 24px;border-radius:8px;cursor:pointer;border:2px solid transparent;
  transition:transform .12s ease, box-shadow .12s ease;
  white-space:nowrap;
}
.btn-kirmizi{
  background:var(--kirmizi-600);color:var(--kagit);
  box-shadow:var(--golge-sert);
}
.btn-kirmizi:hover{background:var(--kirmizi-700);}
.btn-kirmizi:active, .btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--kirmizi-900);}
.btn-anahat{
  background:transparent;border-color:var(--murekkep);color:var(--murekkep);
  box-shadow:0 4px 0 var(--murekkep);
}
.btn-anahat:hover{background:var(--murekkep);color:var(--kagit);}
.btn-anahat:active{box-shadow:0 0 0 var(--murekkep);}
.btn[disabled], .btn.pasif{
  opacity:.55;cursor:not-allowed;box-shadow:none;filter:grayscale(.3);
}
.btn[disabled]:active, .btn.pasif:active{transform:none;}
.btn-buyuk{padding:16px 30px;font-size:1rem;}

/* ==================== HERO / BOOT ANİMASYONU ==================== */
.hero{
  position:relative;padding:70px 0 90px;overflow:hidden;
}
.hero-izler{position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none;}
.hero-grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;
  position:relative;z-index:1;
}
.terminal{
  font-family:var(--font-mono);font-size:.8rem;color:var(--kirmizi-700);
  background:var(--murekkep);color:#c9f7c9;padding:10px 14px;border-radius:7px;
  display:inline-block;margin-bottom:22px;min-height:1.4em;
}
.terminal .imlec{display:inline-block;width:8px;background:#c9f7c9;margin-left:2px;animation:yanip 1s steps(1) infinite;}
@keyframes yanip{50%{opacity:0;}}

.eyebrow-el{
  font-family:var(--font-el);font-size:1.5rem;color:var(--kirmizi-600);
  display:inline-block;transform:rotate(-2deg);margin-bottom:2px;
}
.hero h1{
  font-size:clamp(2.1rem,4.2vw,3.4rem);
  opacity:0;animation:girYukari .7s .15s ease forwards;
}
.hero .lead{
  font-size:1.12rem;color:var(--murekkep-soft);max-width:52ch;
  opacity:0;animation:girYukari .7s .3s ease forwards;
}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;
  opacity:0;animation:girYukari .7s .45s ease forwards;}
@keyframes girYukari{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:translateY(0);}
}

.hero-gorsel{position:relative;}
.hero-gorsel .pano{
  position:relative;background:var(--beyaz);border:1px solid var(--cizgi);
  border-radius:16px;padding:26px;box-shadow:var(--golge);
  transform:rotate(3deg);
  animation:acilis-titrek 1.4s ease-out 1;
}
.hero-gorsel img{
  border-radius:8px;
  filter:brightness(0) saturate(0) brightness(1.7);
  animation:enerji-ver 1.6s ease forwards;
}
@keyframes enerji-ver{
  0%{filter:brightness(0) saturate(0) brightness(1.8);}
  55%{filter:brightness(0) saturate(0) brightness(1.8);}
  62%{filter:none;}
  70%{filter:brightness(1.6);}
  100%{filter:none;}
}
@keyframes acilis-titrek{
  0%{opacity:0;transform:rotate(3deg) scale(.96);}
  100%{opacity:1;transform:rotate(3deg) scale(1);}
}
.pano-led{
  position:absolute;top:14px;right:18px;width:10px;height:10px;border-radius:50%;
  background:#39d353;box-shadow:0 0 0 rgba(57,211,83,.6);
  animation:led-yan 1.9s ease-in-out infinite;
  animation-delay:1.4s;
}
@keyframes led-yan{
  0%,100%{box-shadow:0 0 2px 1px rgba(57,211,83,.5);}
  50%{box-shadow:0 0 9px 3px rgba(57,211,83,.85);}
}
.pano-etiket{
  position:absolute;bottom:-14px;left:26px;background:var(--kirmizi-600);color:var(--kagit);
  font-family:var(--font-mono);font-size:.72rem;padding:5px 10px;border-radius:5px;
  transform:rotate(-2deg);box-shadow:0 3px 0 var(--kirmizi-900);
}

/* ==================== BÖLÜM BAŞLIKLARI ==================== */
.bolum{padding:78px 0;}
.bolum-baslik{max-width:640px;margin-bottom:46px;}
.bolum-baslik h2{font-size:clamp(1.6rem,3vw,2.2rem);}
.bolum-baslik p{color:var(--murekkep-soft);font-size:1.02rem;}
.serit{
  display:inline-block;width:46px;height:4px;background:var(--kirmizi-600);
  border-radius:3px;margin-bottom:14px;
}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease;}
.reveal.gorunur{opacity:1;transform:translateY(0);}

/* ==================== ÖZELLİKLER (gerçek referans kodlarıyla: R1,R2,R3,D5,J5) ==================== */
.ozellik-izgara{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;
}
.ozellik-karti{
  background:var(--beyaz);border:1px solid var(--cizgi);border-radius:var(--radius);
  padding:24px 22px;position:relative;transition:transform .25s ease, box-shadow .25s ease, border-color .25s;
}
.ozellik-karti:hover{transform:translateY(-6px);box-shadow:var(--golge);border-color:var(--kirmizi-500);}
.ozellik-kod{
  font-family:var(--font-mono);font-size:.75rem;color:var(--kirmizi-600);
  border:1.5px solid var(--kirmizi-600);border-radius:5px;padding:2px 7px;display:inline-block;margin-bottom:12px;
}
.ozellik-karti h3{font-size:1.05rem;font-family:var(--font-sans);font-weight:700;}
.ozellik-karti p{color:var(--murekkep-soft);font-size:.93rem;margin:0;}

/* ==================== ÖNE ÇIKANLAR (Nano & Uno) ==================== */
.one-cikan-blok{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  padding:52px 0;
}
.one-cikan-blok:nth-child(even){direction:rtl;}
.one-cikan-blok:nth-child(even) > *{direction:ltr;}
.one-cikan-blok + .one-cikan-blok{border-top:1px dashed var(--cizgi);}

.tilt-kutu{perspective:900px;}
.tilt-ic{
  background:var(--beyaz);border:1px solid var(--cizgi);border-radius:14px;
  padding:22px;transition:transform .25s ease;box-shadow:var(--golge);
  will-change:transform;position:relative;
}
.tilt-ic img{border-radius:8px;}
.mini-led{
  position:absolute;width:8px;height:8px;border-radius:50%;background:var(--kirmizi-600);
  top:16px;left:16px;animation:led-yan-kirmizi 2.4s ease-in-out infinite;
}
@keyframes led-yan-kirmizi{
  0%,100%{box-shadow:0 0 2px 1px rgba(198,48,60,.5);}
  50%{box-shadow:0 0 10px 4px rgba(198,48,60,.8);}
}

.one-cikan-etiket{
  font-family:var(--font-mono);font-size:.78rem;color:var(--kirmizi-600);
  display:inline-block;margin-bottom:10px;
}
.one-cikan-blok h3{font-size:1.7rem;}
.one-cikan-ozellik-listesi{list-style:none;margin:18px 0 24px;}
.one-cikan-ozellik-listesi li{
  padding:7px 0 7px 26px;position:relative;color:var(--murekkep-soft);font-size:.96rem;
  border-bottom:1px solid var(--kagit-koyu);
}
.one-cikan-ozellik-listesi li::before{
  content:"›";position:absolute;left:4px;color:var(--kirmizi-600);font-weight:700;font-size:1.1rem;
}
.cip-etiket{
  display:inline-flex;align-items:center;gap:6px;background:var(--kagit-koyu);
  font-family:var(--font-mono);font-size:.78rem;padding:5px 10px;border-radius:6px;margin-bottom:14px;
}
.cip-etiket .nokta{width:6px;height:6px;background:var(--bakir);border-radius:50%;}

/* ==================== MODEL ŞERİDİ (yatay kaydırma) ==================== */
.model-serit{
  display:flex;gap:18px;overflow-x:auto;padding:6px 4px 22px;
  scroll-snap-type:x mandatory;
}
.model-serit::-webkit-scrollbar{height:6px;}
.model-serit::-webkit-scrollbar-thumb{background:var(--cizgi);border-radius:6px;}
.model-mini{
  flex:0 0 220px;scroll-snap-align:start;background:var(--beyaz);
  border:1px solid var(--cizgi);border-radius:12px;padding:18px;text-align:center;
  transition:transform .2s, box-shadow .2s;
}
.model-mini:hover{transform:translateY(-5px) rotate(-1deg);box-shadow:var(--golge);}
.model-mini-gorsel{height:110px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;}
.model-mini-gorsel img{max-height:100%;}
.model-mini h4{font-size:.98rem;margin-bottom:4px;}
.model-mini span{font-family:var(--font-mono);font-size:.74rem;color:var(--murekkep-soft);}

/* ==================== ÜRÜN KARTLARI (mağaza) ==================== */
.urun-izgara{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:26px;
}
.urun-karti{
  background:var(--beyaz);border:1px solid var(--cizgi);border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .22s, box-shadow .22s;
  position:relative;
}
.urun-karti:hover{transform:translateY(-6px);box-shadow:var(--golge);}
.urun-gorsel-alan{
  aspect-ratio:4/3;background:var(--kagit-koyu);display:flex;align-items:center;justify-content:center;
  padding:22px;position:relative;overflow:hidden;
}
.urun-gorsel-alan img{transition:transform .35s ease;}
.urun-karti:hover .urun-gorsel-alan img{transform:scale(1.06) rotate(-1.2deg);}
.one-cikan-rozeti{
  position:absolute;top:12px;left:12px;background:var(--kirmizi-600);color:var(--kagit);
  font-family:var(--font-mono);font-size:.68rem;padding:4px 9px;border-radius:5px;
  transform:rotate(-3deg);z-index:2;
}
.urun-govde{padding:20px 20px 22px;display:flex;flex-direction:column;gap:8px;flex-grow:1;}
.urun-govde h3{font-size:1.12rem;margin:0;}
.urun-govde .urun-cip{font-family:var(--font-mono);font-size:.78rem;color:var(--murekkep-soft);}
.urun-govde p{font-size:.9rem;color:var(--murekkep-soft);flex-grow:1;}
.urun-alt{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:10px;}

.stok-rozeti{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);
  font-size:.74rem;color:var(--kirmizi-700);background:var(--kirmizi-100);
  padding:4px 9px;border-radius:20px;font-weight:700;
}
.led-nokta{
  width:7px;height:7px;border-radius:50%;background:var(--kirmizi-600);flex-shrink:0;
  animation:led-yan-kirmizi 1.6s ease-in-out infinite;
}

/* Taslak (placeholder) görsel */
.taslak-gorsel{width:100%;height:100%;}
.taslak-govde{fill:none;stroke:var(--murekkep-soft);stroke-width:1.4;stroke-dasharray:5 4;}
.taslak-cizgiler line, .taslak-cizgiler rect, .taslak-cizgiler circle{
  stroke:var(--kirmizi-600);stroke-width:1.6;fill:none;opacity:.75;
}
.taslak-yazi{font-family:var(--font-mono);font-size:13px;fill:var(--murekkep-soft);}

/* Filtre çipleri (mağaza) */
.filtre-satir{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px;}
.filtre-cip{
  font-family:var(--font-mono);font-size:.82rem;padding:8px 16px;border-radius:20px;
  border:1.5px solid var(--cizgi);cursor:pointer;background:var(--beyaz);transition:.2s;
}
.filtre-cip:hover{border-color:var(--kirmizi-500);}
.filtre-cip.secili{background:var(--murekkep);border-color:var(--murekkep);color:var(--kagit);}

/* ==================== ÜRÜN DETAY ==================== */
.breadcrumb{font-size:.85rem;color:var(--murekkep-soft);margin-bottom:26px;}
.breadcrumb a:hover{color:var(--kirmizi-600);}
.detay-izgara{display:grid;grid-template-columns:1fr 1.05fr;gap:52px;align-items:start;}
.detay-galeri{position:sticky;top:100px;}
.galeri-ana{
  background:var(--kagit-koyu);border-radius:14px;padding:30px;aspect-ratio:1/.82;
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;overflow:hidden;
}
.galeri-ana img{max-height:100%;transition:transform .4s;}
.galeri-kucukler{display:flex;gap:10px;}
.galeri-kucukler button{
  border:2px solid var(--cizgi);border-radius:8px;padding:8px;background:var(--beyaz);
  cursor:pointer;width:70px;height:70px;
}
.galeri-kucukler button.secili{border-color:var(--kirmizi-600);}

.detay-cip-satiri{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap;}
.detay-baslik h1{font-size:clamp(1.7rem,3vw,2.3rem);margin-bottom:10px;}
.detay-ozet{font-size:1.05rem;color:var(--murekkep-soft);margin-bottom:22px;}
.detay-fiyat{
  font-family:var(--font-mono);font-size:1.3rem;font-weight:700;margin-bottom:6px;
}
.detay-fiyat span{font-size:.85rem;color:var(--murekkep-soft);font-weight:400;display:block;}
.detay-satin-al{
  display:flex;gap:14px;align-items:center;margin:22px 0 30px;flex-wrap:wrap;
}
.spec-tablo{width:100%;border-collapse:collapse;margin:18px 0 30px;font-size:.94rem;}
.spec-tablo tr{border-bottom:1px solid var(--cizgi);}
.spec-tablo td{padding:11px 6px;}
.spec-tablo td:first-child{color:var(--murekkep-soft);width:38%;font-family:var(--font-mono);font-size:.82rem;}
.ozellik-listesi-detay{list-style:none;margin:0 0 20px;}
.ozellik-listesi-detay li{padding:8px 0 8px 24px;position:relative;border-bottom:1px dashed var(--cizgi);}
.ozellik-listesi-detay li::before{content:"✓";position:absolute;left:0;color:var(--kirmizi-600);font-weight:700;}

/* ==================== FORM (ön talep / iletişim) ==================== */
.form-kutu{
  background:var(--beyaz);border:1px solid var(--cizgi);border-radius:16px;
  padding:36px;box-shadow:var(--golge);
}
.form-alan{margin-bottom:20px;}
.form-alan label{display:block;font-family:var(--font-mono);font-size:.82rem;margin-bottom:7px;}
.form-alan input, .form-alan select, .form-alan textarea{
  width:100%;padding:12px 14px;border:1.5px solid var(--cizgi);border-radius:8px;
  font-family:var(--font-sans);font-size:.96rem;background:var(--kagit);transition:border-color .2s, box-shadow .2s;
}
.form-alan input:focus, .form-alan select:focus, .form-alan textarea:focus{
  outline:none;border-color:var(--kirmizi-600);box-shadow:0 0 0 3px var(--kirmizi-100);
}
.form-satir-ikili{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-not{font-size:.82rem;color:var(--murekkep-soft);margin-top:-10px;}

.durum-kutusu{
  border-radius:14px;padding:26px 28px;margin-bottom:26px;display:flex;gap:16px;align-items:flex-start;
  animation:girYukari .5s ease;
}
.durum-kutusu.uyari{background:var(--kirmizi-100);border:1.5px solid var(--kirmizi-500);}
.durum-kutusu.basari{background:#e7f5ea;border:1.5px solid #6ec089;}
.durum-ikon{font-size:1.6rem;line-height:1;flex-shrink:0;}

/* ==================== KİŞİSEL NOT / HAKKINDA ==================== */
.kisisel-not{
  background:var(--murekkep);color:var(--kagit);border-radius:18px;padding:48px;position:relative;
  overflow:hidden;
}
.kisisel-not::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 15% 20%, rgba(198,48,60,.35), transparent 40%),
                    radial-gradient(circle at 85% 80%, rgba(198,48,60,.25), transparent 45%);
}
.kisisel-not p{position:relative;font-size:1.15rem;max-width:64ch;}
.kisisel-not .imza{font-family:var(--font-el);color:var(--kirmizi-500);font-size:1.8rem;position:relative;}

.zaman-cizelgesi{position:relative;padding-left:28px;}
.zaman-cizelgesi::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--cizgi);}
.zaman-adim{position:relative;padding-bottom:34px;}
.zaman-adim::before{
  content:"";position:absolute;left:-28px;top:3px;width:12px;height:12px;border-radius:50%;
  background:var(--kirmizi-600);border:3px solid var(--kagit);box-shadow:0 0 0 1.5px var(--kirmizi-600);
}
.zaman-adim h4{margin-bottom:4px;font-size:1rem;}
.zaman-adim span{font-family:var(--font-mono);font-size:.78rem;color:var(--kirmizi-600);}
.zaman-adim p{color:var(--murekkep-soft);font-size:.93rem;margin:6px 0 0;}

/* ==================== CTA BANT ==================== */
.cta-bant{
  background:var(--kirmizi-600);color:var(--kagit);border-radius:20px;
  padding:52px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  position:relative;overflow:hidden;
}
.cta-bant h2{color:var(--kagit);margin-bottom:6px;}
.cta-bant p{color:rgba(255,255,255,.85);margin:0;}
.cta-bant .btn-anahat{border-color:var(--kagit);color:var(--kagit);box-shadow:0 4px 0 var(--kirmizi-900);}
.cta-bant .btn-anahat:hover{background:var(--kagit);color:var(--kirmizi-600);}

/* ==================== FOOTER ==================== */
.site-footer{background:var(--murekkep);color:#cfc9c2;padding:60px 0 0;margin-top:60px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px;padding-bottom:40px;}
.footer-blok h4{color:var(--kagit);font-size:.88rem;margin-bottom:14px;}
.footer-blok a{display:block;padding:5px 0;font-size:.9rem;color:#b9b2a9;transition:color .2s;}
.footer-blok a:hover{color:var(--kirmizi-500);}
.footer-marka p{font-size:.88rem;color:#a79f95;}
.footer-imza{font-family:var(--font-el);color:var(--kirmizi-500);font-size:1.25rem;}
.footer-not{font-size:.78rem;}
.footer-alt{
  border-top:1px solid rgba(255,255,255,.1);padding:18px 24px;display:flex;
  justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.78rem;color:#8f887e;
}
@media (max-width:780px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}

.yukari-cik{
  position:fixed;bottom:22px;right:22px;width:44px;height:44px;border-radius:50%;
  background:var(--kirmizi-600);color:var(--kagit);border:0;cursor:pointer;font-size:1.1rem;
  box-shadow:0 6px 16px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:.3s;z-index:40;
}
.yukari-cik.gorunur{opacity:1;pointer-events:auto;}
.yukari-cik:hover{transform:translateY(-3px);}

/* ==================== GENEL RESPONSIVE ==================== */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-gorsel{order:-1;max-width:380px;margin:0 auto 20px;}
  .one-cikan-blok{grid-template-columns:1fr;}
  .one-cikan-blok:nth-child(even){direction:ltr;}
  .detay-izgara{grid-template-columns:1fr;}
  .detay-galeri{position:static;}
  .form-satir-ikili{grid-template-columns:1fr;}
  .cta-bant{flex-direction:column;text-align:center;}
}
@media (max-width:560px){
  .bolum{padding:52px 0;}
  .kisisel-not{padding:30px;}
}

/* GitHub Buton Stilleri */
.github-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background-color: #24292e; /* Dark GitHub Teması */
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 0.88rem;
    font-weight: 500;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    margin-bottom: 8px;
}

/* Icon Stili */
.github-icon {
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.external-arrow {
    opacity: 0.7;
    font-size: 0.8em;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

/* Hover (Üzerine Gelince) Efektleri */
.github-btn:hover {
    background-color: #2f363d;
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    transform: translateY(-2px);
    color: #ffffff !important;
}

.github-btn:hover .github-icon {
    transform: scale(1.1);
}

.github-btn:hover .external-arrow {
    opacity: 1;
    transform: translate(2px, -2px);
}

/* Tıklama Efekti */
.github-btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.github-btn {
    /* Hizalama ve Simetri */
    display: inline-flex;
    align-items: center;      /* Dikeyde tam ortalama */
    justify-content: center;  /* Yatayda tam ortalama */
    gap: 8px;                 /* Elemanlar arası simetrik boşluk */
    
    /* Boyutlandırma ve İç Boşluk */
    padding: 8px 16px;        /* Üst-alt 8px, Sağ-sol 16px simetrik padding */
    height: 38px;             /* Sabit yükseklik ile düzgün dikey oturum */
    box-sizing: border-box;
    
    /* Renk ve Kenarlık */
    background-color: #1a1a1a;
    color: #ffffff !important;
    border: 1px solid #333333;
    border-radius: 6px;       /* Temiz, yumuşatılmış köşeler */
    
    /* Tipografi */
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;           /* Satır yüksekliği kaymasını önler */
    text-decoration: none;
    
    /* Geçişler ve Efekt */
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}

/* GitHub İkonu Hizalaması */
.github-icon {
    display: block;
    flex-shrink: 0;
}

/* Ok Simgesi */
.ok-simge {
    font-size: 12px;
    line-height: 1;
    opacity: 0.7;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Hover Efekti */
.github-btn:hover {
    background-color: #2a2a2a;
    border-color: #555555;
    color: #ffffff !important;
}

.github-btn:hover .ok-simge {
    opacity: 1;
    transform: translate(2px, -2px); /* Ok imgesinin hafifçe sağ üst yöne kayması */
}

.nav-github {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background-color: #1C1A17;
    color: #FBF8F2 !important;
    border-radius: 6px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.nav-github:hover {
    background-color: #C6303C;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

.nav-github .dis-link-icon {
    opacity: 0.7;
    transition: transform 0.2s ease;
}

.nav-github:hover .dis-link-icon {
    opacity: 1;
    transform: translate(2px, -2px);
}

.nav-github {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s ease, transform 0.2s ease;
}

.nav-github .github-icon {
    transition: transform 0.25s ease;
}

.nav-github:hover {
    color: #C6303C;
}

.nav-github:hover .github-icon {
    transform: rotate(-6deg) scale(1.05);
}

.nav-github .dis-link-icon {
    opacity: 0.55;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.nav-github:hover .dis-link-icon {
    opacity: 1;
    transform: translate(1px, -1px);
}