/*
Theme Name: Teknoloji AIHL
Theme URI: https://teknolojiaihl.com
Author: Sancaktepe Teknoloji Anadolu İmam Hatip Lisesi
Description: Okul projeleri, kurs duyuruları, haberler ve dergi içerikleri için hafif, hızlı ve sunucu dostu WordPress teması. Harici kütüphane, gereksiz font/script yükü yoktur.
Version: 1.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: teknolojiaihl
*/

/* ==========================================================================
   0) DEĞİŞKENLER
   ========================================================================== */
:root{
  --renk-ana:#123a6b;      /* lacivert */
  --renk-ana-koyu:#0b2547;
  --renk-vurgu:#d99a2b;    /* amber/altın */
  --renk-metin:#1f2429;
  --renk-metin-soft:#5b6470;
  --renk-zemin:#ffffff;
  --renk-zemin-alt:#f4f6f9;
  --renk-cizgi:#e3e7ec;
  --radius:8px;
  --max-genislik:1180px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ==========================================================================
   1) RESET / TEMEL
   ========================================================================== */
*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font);
  color:var(--renk-metin);
  background:var(--renk-zemin);
  line-height:1.6;
  font-size:17px;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--renk-ana); text-decoration:none; }
a:hover{ color:var(--renk-vurgu); }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ line-height:1.25; margin:0 0 .5em; font-weight:700; }
p{ margin:0 0 1em; }
.container{
  max-width:var(--max-genislik);
  margin:0 auto;
  padding:0 20px;
}
.gorunmez{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.skip-link{
  position:absolute; left:-9999px; top:0; background:var(--renk-ana); color:#fff;
  padding:10px 16px; z-index:9999;
}
.skip-link:focus{ left:10px; top:10px; }

/* ==========================================================================
   2) ÜST BAR / HEADER
   ========================================================================== */
.site-header{
  border-bottom:1px solid var(--renk-cizgi);
  background:var(--renk-zemin);
  position:sticky; top:0; z-index:100;
}
.site-header-ic{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px; gap:20px; flex-wrap:wrap;
}
.site-logo{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.25rem; color:var(--renk-ana); }
.site-logo img{ max-height:48px; width:auto; }
.site-logo:hover{ color:var(--renk-ana); }

.ana-menu{ display:flex; gap:6px; flex-wrap:wrap; }
.ana-menu li a{
  display:block; padding:10px 14px; border-radius:var(--radius);
  color:var(--renk-metin); font-weight:600; font-size:.95rem;
}
.ana-menu li a:hover, .ana-menu li.current-menu-item a{
  background:var(--renk-zemin-alt); color:var(--renk-ana);
}
.menu-toggle{
  display:none; background:none; border:1px solid var(--renk-cizgi);
  border-radius:var(--radius); padding:8px 12px; font-size:1rem; cursor:pointer;
}

/* ==========================================================================
   3) HERO / SAYFA BAŞLIĞI
   ========================================================================== */
.sayfa-basligi{
  background:var(--renk-zemin-alt);
  border-bottom:1px solid var(--renk-cizgi);
  padding:34px 0;
  margin-bottom:36px;
}
.sayfa-basligi h1{ font-size:1.8rem; color:var(--renk-ana-koyu); margin:0; }
.sayfa-basligi p{ color:var(--renk-metin-soft); margin:6px 0 0; }

/* ==========================================================================
   4) İÇERİK KARTLARI (Projeler/Haberler/Duyurular/Dergi ortak)
   ========================================================================== */
.bolum-baslik{
  display:flex; align-items:baseline; justify-content:space-between;
  margin:48px 0 18px; flex-wrap:wrap; gap:10px;
}
.bolum-baslik h2{ font-size:1.4rem; color:var(--renk-ana-koyu); }
.bolum-baslik .tumunu-gor{ font-size:.9rem; font-weight:600; }

.kart-izgara{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px,1fr));
  gap:22px;
}
.kart{
  background:var(--renk-zemin);
  border:1px solid var(--renk-cizgi);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:box-shadow .15s ease, transform .15s ease;
}
.kart:hover{ box-shadow:0 6px 18px rgba(18,58,107,.12); transform:translateY(-2px); }
.kart-gorsel{ aspect-ratio:16/10; overflow:hidden; background:var(--renk-zemin-alt); }
.kart-gorsel img{ width:100%; height:100%; object-fit:cover; }
.kart-govde{ padding:16px; display:flex; flex-direction:column; gap:8px; flex:1; }
.kart-etiket{
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; color:var(--renk-vurgu); background:rgba(217,154,43,.12);
  padding:3px 9px; border-radius:999px; align-self:flex-start;
}
.kart-govde h3{ font-size:1.05rem; margin:0; }
.kart-govde h3 a{ color:var(--renk-metin); }
.kart-govde h3 a:hover{ color:var(--renk-ana); }
.kart-ozet{ color:var(--renk-metin-soft); font-size:.92rem; margin:0; }
.kart-meta{ font-size:.8rem; color:var(--renk-metin-soft); margin-top:auto; padding-top:6px; }

/* ==========================================================================
   5) TEKİL İÇERİK (single)
   ========================================================================== */
.icerik-tekil{ max-width:800px; margin:0 auto; padding:0 20px 60px; }
.icerik-tekil .kart-etiket{ margin-bottom:10px; }
.icerik-tekil h1{ font-size:2rem; color:var(--renk-ana-koyu); }
.icerik-tekil .meta-satiri{ color:var(--renk-metin-soft); font-size:.9rem; margin-bottom:20px; }
.icerik-tekil .oncelenmis-gorsel{ margin:0 0 24px; border-radius:var(--radius); overflow:hidden; }
.icerik-govde{ font-size:1.05rem; }
.icerik-govde h2{ margin-top:1.6em; }
.icerik-govde img{ border-radius:var(--radius); }
.icerik-govde blockquote{
  border-left:4px solid var(--renk-vurgu); margin:1.2em 0; padding:.3em 1em;
  color:var(--renk-metin-soft); font-style:italic;
}

/* ==========================================================================
   6) SAYFALAMA / ARŞİV LİSTE
   ========================================================================== */
.liste-sarmal{ padding:0 0 60px; }
.sayfalama{ display:flex; justify-content:center; gap:8px; margin-top:36px; }
.sayfalama a, .sayfalama span{
  padding:8px 14px; border:1px solid var(--renk-cizgi); border-radius:var(--radius);
  font-size:.9rem; color:var(--renk-metin);
}
.sayfalama .current{ background:var(--renk-ana); color:#fff; border-color:var(--renk-ana); }

/* ==========================================================================
   7) KENAR ÇUBUĞU (opsiyonel widget alanı)
   ========================================================================== */
.widget{ margin-bottom:28px; padding:18px; background:var(--renk-zemin-alt); border-radius:var(--radius); }
.widget h2, .widget h3{ font-size:1rem; color:var(--renk-ana-koyu); margin-bottom:10px; }

/* ==========================================================================
   8) ALT BİLGİ / FOOTER
   ========================================================================== */
.site-footer{ background:var(--renk-ana-koyu); color:#dfe6f0; margin-top:60px; }
.footer-izgara{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:28px; padding:44px 20px;
}
.footer-izgara h3{ color:#fff; font-size:1rem; margin-bottom:12px; }
.footer-izgara a{ color:#c3cfe0; }
.footer-izgara a:hover{ color:var(--renk-vurgu); }
.site-footer .alt-satir{
  border-top:1px solid rgba(255,255,255,.12);
  padding:16px 20px; text-align:center; font-size:.85rem; color:#a9b6c8;
}

/* ==========================================================================
   9) FORMLAR / YORUMLAR (temel)
   ========================================================================== */
input[type=text], input[type=email], input[type=url], input[type=search], textarea{
  width:100%; padding:10px 12px; border:1px solid var(--renk-cizgi); border-radius:var(--radius);
  font-family:var(--font); font-size:1rem;
}
button, .buton, input[type=submit]{
  display:inline-block; background:var(--renk-ana); color:#fff; border:none;
  padding:11px 20px; border-radius:var(--radius); font-weight:600; cursor:pointer; font-size:.95rem;
}
button:hover, .buton:hover, input[type=submit]:hover{ background:var(--renk-ana-koyu); color:#fff; }

/* ==========================================================================
   10) VİTRİN SLAYTI (menünün hemen altında)
   ========================================================================== */
.vitrin-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  background:var(--renk-ana-koyu);
}
.vitrin-track{
  display:flex;
  transition:transform .5s ease;
}
.vitrin-slayt{
  position:relative;
  min-width:100%;
  aspect-ratio:16/6.2;
  min-height:260px;
  display:flex;
  align-items:flex-end;
}
.vitrin-medya, .vitrin-medya img, .vitrin-video-kapagi, .vitrin-video-kapagi img, .vitrin-slayt iframe{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0;
}
.vitrin-video-kapagi{ cursor:pointer; }
.vitrin-oynat-buton{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:64px; height:64px; border-radius:50%; background:rgba(0,0,0,.55);
  color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.6rem;
}
.vitrin-slayt::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(11,37,71,.88) 0%, rgba(11,37,71,.15) 55%, transparent 100%);
  pointer-events:none;
}
.vitrin-metin{
  position:relative; z-index:1; color:#fff; padding:28px 32px; max-width:640px;
}
.vitrin-metin h2{ font-size:1.7rem; margin-bottom:.3em; }
.vitrin-metin p{ color:#dfe6f0; font-size:.98rem; margin-bottom:14px; }
.vitrin-ok{
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,.85); border:none; width:40px; height:40px;
  border-radius:50%; font-size:1.4rem; line-height:1; cursor:pointer; z-index:2;
  color:var(--renk-ana-koyu);
}
.vitrin-ok.geri{ left:14px; }
.vitrin-ok.ileri{ right:14px; }
.vitrin-ok:hover{ background:#fff; }
.vitrin-noktalar{
  position:absolute; bottom:12px; left:0; right:0; z-index:1;
  display:flex; justify-content:center; gap:8px;
}
.vitrin-nokta{
  width:9px; height:9px; border-radius:50%; border:none; background:rgba(255,255,255,.5); cursor:pointer; padding:0;
}
.vitrin-nokta.aktif{ background:#fff; }

/* ==========================================================================
   11) ALT BÖLÜM: Haberler / Duyurular sütunları + sabit yan panel
   ========================================================================== */
.alt-izgara{
  display:grid;
  grid-template-columns:1fr 1fr 300px;
  gap:32px;
  margin:20px 0 60px;
  align-items:start;
}
.sutun-baslik{
  font-size:1.15rem; color:var(--renk-ana-koyu);
  border-bottom:2px solid var(--renk-vurgu); padding-bottom:8px; margin-bottom:14px;
}
.alt-sutun .tumunu-gor{ display:inline-block; margin-top:6px; font-size:.88rem; font-weight:600; }
.alt-yan-panel{ position:sticky; top:86px; }

.mini-liste{ display:flex; flex-direction:column; gap:12px; }
.mini-satir{ display:flex; gap:10px; align-items:flex-start; }
.mini-gorsel{ flex:0 0 auto; width:56px; height:56px; border-radius:6px; overflow:hidden; }
.mini-gorsel img{ width:100%; height:100%; object-fit:cover; }
.mini-metin{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.mini-baslik{ font-size:.94rem; font-weight:600; color:var(--renk-metin); line-height:1.35; }
.mini-baslik:hover{ color:var(--renk-ana); }
.mini-tarih{ font-size:.78rem; color:var(--renk-metin-soft); }

.alt-yan-panel .widget .mini-liste{ gap:10px; }
.alt-yan-panel .widget:last-child{ margin-bottom:0; }

/* ==========================================================================
   12) DUYARLI (RESPONSIVE)
   ========================================================================== */
@media (max-width:800px){
  .menu-toggle{ display:inline-block; }
  .ana-menu{
    display:none; flex-direction:column; width:100%;
    order:3; border-top:1px solid var(--renk-cizgi); padding-top:8px;
  }
  .ana-menu.acik{ display:flex; }
  .kart-izgara{ grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); }
  .alt-izgara{ grid-template-columns:1fr; }
  .alt-yan-panel{ position:static; }
  .vitrin-slayt{ aspect-ratio:auto; min-height:340px; }
  .vitrin-metin{ padding:20px; max-width:100%; }
  .vitrin-metin h2{ font-size:1.3rem; }
}