/* ---------- Yazı tipleri (yerel, OFL — assets/fonts/LISANS.txt) ----------
   Khand: derneğin kurumsal yazı tipi (başlıklar, düğmeler). Space Grotesk: gövde. Space Mono: bant etiketleri. */
@font-face{ font-family:"Khand"; font-weight:500; font-style:normal; font-display:swap; src:url("/assets/fonts/Khand-Medium.woff2") format("woff2"); }
@font-face{ font-family:"Khand"; font-weight:600; font-style:normal; font-display:swap; src:url("/assets/fonts/Khand-SemiBold.woff2") format("woff2"); }
@font-face{ font-family:"Khand"; font-weight:700; font-style:normal; font-display:swap; src:url("/assets/fonts/Khand-Bold.woff2") format("woff2"); }
@font-face{ font-family:"Space Grotesk"; font-weight:300 700; font-style:normal; font-display:swap; src:url("/assets/fonts/SpaceGrotesk.woff2") format("woff2"); }
@font-face{ font-family:"Space Mono"; font-weight:700; font-style:normal; font-display:swap; src:url("/assets/fonts/SpaceMono-Bold.woff2") format("woff2"); }

/* ============================================================
   HK ATÖLYE — Site stil dosyası
   Kimlik: "atölye masası" — kesim matı ızgarası, maskeleme
   bandı etiketleri, el yapımı sticker havası.
   ============================================================ */

:root{
  /* Renkler — HK Atölye marka paleti */
  --kagit:    #F6F4E6;  /* zemin: kremin açık tonu */
  --beyaz:    #FFFEF6;  /* kart zemini */
  --murekkep: #111511;  /* metin: siyah */
  --yesil:    #3E8233;  /* marka yeşili */
  --koyu:     #285421;  /* koyu yeşil */
  --krem:     #EDEBC5;  /* marka kremi (bant rengi) */
  --mat:      rgba(62, 130, 51, .10); /* kesim matı çizgileri */

  /* Tipografi */
  --f-display: "Khand", "Arial Narrow", sans-serif;
  --f-govde:   "Space Grotesk", "Segoe UI", sans-serif;
  --f-etiket:  "Space Mono", "Courier New", monospace;

  /* Ölçüler */
  --kap: 1140px;
  --radius: 16px;
  --cizgi: 2px solid var(--murekkep);
  --golge: 6px 6px 0 rgba(40, 84, 33, .9);
  --golge-kucuk: 4px 4px 0 var(--murekkep);
}

/* ---------- Sıfırlama ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--f-govde);
  background:var(--kagit);
  color:var(--murekkep);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:700; letter-spacing:.005em; line-height:1.1; }
img{ max-width:100%; display:block; }
[hidden]{ display:none !important; }
a{ color:inherit; }
button{ font:inherit; cursor:pointer; }
:focus-visible{ outline:3px solid var(--yesil); outline-offset:2px; border-radius:4px; }
.serit :focus-visible, .alt :focus-visible, .bolum--koyu :focus-visible{ outline-color:var(--krem); }

.kap{ max-width:var(--kap); margin:0 auto; padding:0 20px; }

/* ---------- Bant etiketi (imza öğe) ---------- */
.bant-etiket{
  display:inline-block;
  font-family:var(--f-etiket);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--krem);
  color:var(--murekkep);
  padding:.42em 1.1em;
  transform:rotate(-2deg);
  box-shadow:2px 2px 0 rgba(23,33,30,.25);
  /* bant uçlarındaki yırtık kenar */
  clip-path:polygon(0 6%, 3% 0, 97% 3%, 100% 10%, 99% 50%, 100% 88%, 96% 100%, 4% 97%, 0 92%, 1% 45%);
}
.bant-etiket--sag{ transform:rotate(2deg); }
.bant-etiket--koyu{ background:var(--koyu); color:var(--krem); }
.bant-etiket--beyaz{ background:var(--beyaz); }

/* ---------- Butonlar ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em; white-space:nowrap;
  font-family:var(--f-display); font-weight:600; font-size:1.2rem; letter-spacing:0; line-height:1;
  padding:.8em 1.6em;
  border:var(--cizgi); border-radius:999px;
  background:var(--yesil); color:#FFFFFF;
  text-decoration:none;
  box-shadow:var(--golge-kucuk);
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--murekkep); }
.btn:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 var(--murekkep); }
.btn--ikincil{ background:var(--beyaz); color:var(--murekkep); }
.btn--koyu{ background:var(--koyu); color:var(--krem); }
.btn--kucuk{ font-size:1.08rem; padding:.68em 1.3em; }
.menu .btn--kucuk{ font-size:1.12rem; padding:.6em 1.25em; }

/* ---------- Üst çubuk ---------- */
.ust{
  position:sticky; top:0; z-index:50;
  background:rgba(243,241,231,.92);
  backdrop-filter:blur(8px);
  border-bottom:var(--cizgi);
}
.ust-ic{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:14px 20px; max-width:var(--kap); margin:0 auto;
}
.logo{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.logo-rozet{
  width:46px; height:46px; flex:none;
  transform:rotate(-8deg);
  filter:drop-shadow(2px 2px 0 rgba(17,21,17,.25));
}
.logo-yazi{ font-family:var(--f-display); font-weight:700; font-size:1.6rem; letter-spacing:.01em; line-height:1; }

.menu{ display:flex; align-items:center; gap:26px; list-style:none; }
.menu a{
  text-decoration:none; font-weight:500; font-size:.98rem; padding:4px 2px;
}
.menu a:not(.btn):hover,
.menu a:not(.btn)[aria-current="page"]{
  background:linear-gradient(transparent 62%, var(--krem) 62%);
}
.menu-ac{
  display:none; background:none; border:var(--cizgi); border-radius:10px;
  width:44px; height:44px; place-items:center; background:var(--beyaz);
}
.menu-ac span, .menu-ac span::before, .menu-ac span::after{
  content:""; display:block; width:20px; height:2.5px; background:var(--murekkep);
  position:relative; transition:transform .2s ease, opacity .2s ease;
}
.menu-ac span::before{ position:absolute; top:-6px; }
.menu-ac span::after{ position:absolute; top:6px; }
.menu-ac[aria-expanded="true"] span{ background:transparent; }
.menu-ac[aria-expanded="true"] span::before{ transform:translateY(6px) rotate(45deg); }
.menu-ac[aria-expanded="true"] span::after{ transform:translateY(-6px) rotate(-45deg); }

/* ---------- Kesim matı zemin ---------- */
.mat-zemin{
  background-image:
    linear-gradient(var(--mat) 1px, transparent 1px),
    linear-gradient(90deg, var(--mat) 1px, transparent 1px);
  background-size:28px 28px;
}

/* ---------- Hero ---------- */
.hero{ padding:72px 0 84px; overflow:hidden; border-bottom:var(--cizgi); }
.hero-ic{ display:grid; grid-template-columns:1.25fr .75fr; gap:40px; align-items:center; }
.hero h1{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(3rem, 7.4vw, 5.4rem);
  line-height:.98; letter-spacing:.005em; margin:18px 0 20px; text-transform:none;
}
.isaret{
  display:inline-block; background:var(--krem); padding:.02em .18em;
  transform:rotate(-1.2deg); box-shadow:3px 3px 0 rgba(23,33,30,.2);
}
.hero-metin{ font-size:1.12rem; max-width:34em; margin-bottom:28px; }
.hero-btnlar{ display:flex; flex-wrap:wrap; gap:14px; }

/* Hero sağ: bant panosu */
.pano{ position:relative; display:flex; flex-direction:column; align-items:center; gap:16px; padding:6px 0; }
.pano-etiketler{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 12px; max-width:420px; }
.pano .bant-etiket{ position:static; font-size:.8rem; }
.pano-rozet{ position:static; width:170px; transform:rotate(6deg); filter:drop-shadow(4px 4px 0 rgba(17,21,17,.15)); }
.pano-not{ position:static; max-width:300px; background:var(--beyaz); border:var(--cizgi); border-radius:12px; box-shadow:var(--golge); padding:16px 18px; transform:rotate(-1.5deg); font-size:.95rem; line-height:1.5; }
.pano-not b{ font-family:var(--f-display); }

/* ---------- Kayan bant (marquee) ---------- */
.serit{
  background:var(--koyu); color:var(--krem);
  border-bottom:var(--cizgi);
  overflow:hidden; white-space:nowrap;
}
.serit-ic{
  display:inline-flex; gap:2.2em; align-items:center;
  padding:.75em 0; width:max-content;
  font-family:var(--f-display); font-weight:700; font-size:1.05rem;
  letter-spacing:.04em; text-transform:uppercase;
  animation:kaydir 22s linear infinite;
}
@keyframes kaydir{ to{ transform:translateX(-50%); } }

/* ---------- Bölümler ---------- */
.bolum{ padding:76px 0; }
.bolum--koyu{ background:var(--koyu); color:var(--kagit); border-top:var(--cizgi); border-bottom:var(--cizgi); }
.bolum-bas{ margin-bottom:40px; max-width:640px; }
.bolum-bas h2{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2.1rem, 4.2vw, 3.1rem); line-height:1.05;
  letter-spacing:.005em; margin-top:14px;
}
.bolum-bas p{ margin-top:12px; font-size:1.05rem; }

/* ---------- Kartlar ---------- */
.izgara{ display:grid; gap:24px; }
.izgara--3{ grid-template-columns:repeat(3, 1fr); }
.izgara--2{ grid-template-columns:repeat(2, 1fr); }

.kart{
  background:var(--beyaz); border:var(--cizgi); border-radius:var(--radius);
  box-shadow:var(--golge); padding:26px 24px;
  color:var(--murekkep);
  display:flex; flex-direction:column; gap:12px;
  transition:transform .18s ease, box-shadow .18s ease;
}
a.kart{ text-decoration:none; }
a.kart:hover, .kart--tikla:hover{ transform:translate(-3px,-3px); box-shadow:9px 9px 0 rgba(40,84,33,.9); }
/* Kartın tamamı tıklanır: içindeki ana buton kartı kaplar */
.kart--tikla{ position:relative; }
.kart--tikla .kart-alt .btn::after{ content:""; position:absolute; inset:0; border-radius:var(--radius); }
.kart--tikla .kart-alt .btn:focus-visible::after{ outline:3px solid var(--yesil); outline-offset:-3px; border-radius:var(--radius); }
.kart h3{ font-family:var(--f-display); font-weight:700; font-size:1.55rem; line-height:1.1; letter-spacing:.005em; }
.kart p{ font-size:.98rem; }
.kart-alt{ margin-top:auto; padding-top:8px; }
.kart-simge{
  display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; margin-bottom:14px;
  background:var(--krem); border:var(--cizgi); border-radius:14px; color:var(--koyu);
}
.kart--krem{ background:var(--krem); }
.kart--cizgili{
  background:repeating-linear-gradient(-45deg,
    var(--beyaz) 0 14px, #F2F0DA 14px 28px);
}

/* Atölye kartındaki meta satırı */
.meta{ display:flex; flex-wrap:wrap; gap:8px; }
.meta span{
  font-family:var(--f-etiket); font-size:.68rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
  border:1.5px solid var(--murekkep); border-radius:999px;
  padding:.3em .8em; background:var(--kagit);
}

/* ---------- Proje kartları ---------- */
.proje{ overflow:hidden; padding:0; }
.proje-gorsel{
  height:170px; border-bottom:var(--cizgi);
  display:flex; align-items:flex-end; padding:14px;
}
.proje-icerik{ padding:22px 24px 26px; display:flex; flex-direction:column; gap:10px; flex:1; }
.g-su{    background:linear-gradient(135deg, #285421, #3E8233); }
.g-cati{  background:linear-gradient(135deg, #3E8233, #9CC58C); }
.g-genel{ background:linear-gradient(135deg, #111511, #285421 60%, #EDEBC5 170%); }
.g-isaret{background:linear-gradient(135deg, #3E8233, #EDEBC5); }

/* ---------- Sayfa başlığı (iç sayfalar) ---------- */
.sayfa-bas{ padding:64px 0 56px; border-bottom:var(--cizgi); }
.sayfa-bas h1{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2.6rem, 6vw, 4.2rem); line-height:1;
  letter-spacing:.005em; margin-top:16px; max-width:15em;
}
.sayfa-bas p{ margin-top:14px; max-width:38em; font-size:1.08rem; }

/* ---------- Galeri ---------- */
.filtreler{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:30px; }
.filtre{
  border:var(--cizgi); border-radius:999px; background:var(--beyaz);
  padding:.5em 1.2em; font-weight:500; font-size:.95rem;
}
.filtre[aria-pressed="true"]{ background:var(--murekkep); color:var(--kagit); }

.galeri{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.karo{
  position:relative; aspect-ratio:4/3; border:var(--cizgi); border-radius:14px;
  overflow:hidden; box-shadow:var(--golge-kucuk); padding:0; text-align:left;
  transition:transform .18s ease;
}
.karo:hover{ transform:translate(-2px,-2px); }
.karo img{ width:100%; height:100%; object-fit:cover; }
.karo-etiket{
  position:absolute; left:12px; bottom:12px;
  font-family:var(--f-etiket); font-size:.66rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  background:var(--krem); padding:.4em .9em; transform:rotate(-2deg);
  box-shadow:2px 2px 0 rgba(23,33,30,.3);
}
.karo--video::after{
  content:"▶"; position:absolute; inset:0; display:grid; place-items:center;
  font-size:2rem; color:var(--kagit);
  background:rgba(23,33,30,.35);
}
.karo[hidden]{ display:none; }

/* Galeri yer tutucu desenleri (fotoğraf gelene kadar) */
.d1{ background:linear-gradient(135deg,#285421,#3E8233); }
.d2{ background:linear-gradient(135deg,#3E8233,#EDEBC5); }
.d3{ background:repeating-linear-gradient(-45deg,#285421 0 18px,#2F6428 18px 36px); }
.d4{ background:linear-gradient(135deg,#111511,#285421); }
.d5{ background:repeating-linear-gradient(45deg,#EDEBC5 0 18px,#E2DFAE 18px 36px); }
.d6{ background:linear-gradient(135deg,#9CC58C,#EDEBC5); }

/* ---------- Işık kutusu / KVKK penceresi ---------- */
.pencere{
  position:fixed; inset:0; z-index:100; display:none;
  align-items:center; justify-content:center; padding:20px;
  background:rgba(23,33,30,.62);
}
.pencere.acik{ display:flex; }
.pencere-kutu{
  background:var(--beyaz); border:var(--cizgi); border-radius:var(--radius);
  box-shadow:var(--golge); width:min(640px, 100%);
  max-height:min(80vh, 720px); display:flex; flex-direction:column;
}
.pencere-bas{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; border-bottom:var(--cizgi);
}
.pencere-bas h3{ font-family:var(--f-display); font-size:1.15rem; }
.pencere-kapat{
  width:38px; height:38px; border:var(--cizgi); border-radius:10px;
  background:var(--krem); font-weight:700; font-size:1rem;
}
.pencere-govde{ padding:20px; overflow:auto; font-size:.95rem; }
.pencere-govde h4{ font-family:var(--f-display); margin:14px 0 6px; }
.pencere-govde .karo{ width:100%; aspect-ratio:4/3; cursor:default; }
.pencere-govde .isik-medya{ width:100%; display:block; border:var(--cizgi); border-radius:12px; background:var(--murekkep); }
.pencere-govde img.isik-medya{ height:auto; }
.pencere-govde video.isik-medya, .pencere-govde iframe.isik-medya{ aspect-ratio:16/9; height:auto; }
.pencere-govde p.isik-aciklama{ margin-top:12px; font-size:.95rem; }

/* ---------- Form ---------- */
.form-kap{ display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:start; }
.form{
  background:var(--beyaz); border:var(--cizgi); border-radius:var(--radius);
  box-shadow:var(--golge); padding:30px 28px;
  display:flex; flex-direction:column; gap:18px;
}
.alan{ display:flex; flex-direction:column; gap:6px; }
.alan label{ font-weight:700; font-size:.95rem; }
.alan .ipucu{ font-size:.8rem; color:#4A554F; }
.alan input[type="text"],
.alan input[type="tel"],
.alan input[type="email"],
.alan input[type="number"],
.alan input[type="date"],
.alan input[type="url"],
.alan select,
.alan textarea{
  font:inherit; color:var(--murekkep);
  border:var(--cizgi); border-radius:12px;
  background:#FFFFFF; padding:.75em .9em; width:100%;
}
.alan textarea{ min-height:110px; resize:vertical; }
.alan input:focus, .alan select:focus, .alan textarea:focus{
  outline:3px solid var(--yesil); outline-offset:1px;
}
.satir-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.onay{ display:flex; gap:10px; align-items:flex-start; font-size:.92rem; }
.onay input{ width:20px; height:20px; margin-top:2px; accent-color:var(--yesil); flex:none; }
.kutu-grup{ display:flex; flex-wrap:wrap; gap:10px; }
.kutu-grup label{
  display:inline-flex; align-items:center; gap:8px;
  border:var(--cizgi); border-radius:999px; padding:.45em 1em;
  background:var(--kagit); font-weight:500; font-size:.92rem; cursor:pointer;
}
.kutu-grup input{ accent-color:var(--yesil); }
.kvkk-link{ font-weight:700; text-decoration:underline; text-decoration-color:var(--yesil); text-underline-offset:3px; }

.form-durum{ display:none; border:var(--cizgi); border-radius:12px; padding:14px 16px; font-size:.95rem; }
.form-durum.acik{ display:block; }
.form-durum--tamam{ background:#E2EFD7; }
.form-durum--hata{ background:#FBE3DA; }

/* Yan bilgi kutuları */
.yan-kutu{ margin-bottom:22px; }
.yan-kutu ul{ list-style:none; display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.yan-kutu li{ display:flex; gap:10px; align-items:baseline; }
.yan-kutu li::before{ content:"—"; font-weight:700; color:var(--yesil); }

/* ---------- CTA bandı ---------- */
.cta{
  border-top:var(--cizgi);
  background:var(--krem);
}
.cta-ic{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:20px; padding:52px 20px; max-width:var(--kap); margin:0 auto;
}
.cta h2{ font-family:var(--f-display); font-weight:700; font-size:clamp(1.9rem,3.8vw,2.7rem); line-height:1.08; max-width:18em; }

/* ---------- Alt bilgi ---------- */
.alt{ background:var(--koyu); color:var(--kagit); border-top:var(--cizgi); }
.alt-ic{
  max-width:var(--kap); margin:0 auto; padding:56px 20px 30px;
  display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:36px;
}
.alt h4{ font-family:var(--f-display); font-size:1.3rem; margin-bottom:12px; }
.alt p, .alt a{ font-size:.94rem; color:rgba(243,241,231,.88); }
.alt ul{ list-style:none; display:flex; flex-direction:column; gap:8px; }
.alt a{ text-decoration:none; }
.alt a:hover{ text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--krem); }
.alt-logo{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.alt-logo .logo-rozet{ transform:rotate(-6deg); filter:none; }
.alt-meta{
  border-top:1px solid rgba(243,241,231,.25);
  margin-top:20px;
}
.alt-meta-ic{
  max-width:var(--kap); margin:0 auto; padding:16px 20px;
  display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between;
  font-family:var(--f-etiket); font-size:.68rem; letter-spacing:.05em;
  text-transform:uppercase; color:rgba(243,241,231,.7);
}

/* ---------- Görünme animasyonu ---------- */
.gorun{ opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease; }
.gorun.aktif{ opacity:1; transform:none; }

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .serit-ic{ animation:none; }
  .gorun{ opacity:1; transform:none; transition:none; }
  .btn, .kart, .karo{ transition:none; }
}

/* ---------- Duyarlılık ---------- */
@media (max-width: 980px){
  .izgara--3{ grid-template-columns:repeat(2,1fr); }
  .galeri{ grid-template-columns:repeat(2,1fr); }
  .hero-ic{ grid-template-columns:1fr; }
  .pano{ min-height:260px; margin-top:10px; }
  .form-kap{ grid-template-columns:1fr; }
  .alt-ic{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 860px){
  .menu{
    position:absolute; top:calc(100% + 2px); left:0; right:0; z-index:49;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--kagit); border-bottom:var(--cizgi);
    box-shadow:0 24px 40px rgba(17,21,17,.18);
    padding:8px 20px 20px; display:none;
    max-height:calc(100vh - 80px); overflow:auto;
  }
  .menu.acik{ display:flex; }
  .menu li{ border-bottom:1.5px dashed rgba(23,33,30,.2); }
  .menu li:last-child{ border-bottom:none; padding-top:14px; }
  .menu a:not(.btn){ display:block; padding:14px 10px; font-size:1.05rem; border-radius:10px; }
  .menu a:not(.btn):hover,
  .menu a:not(.btn)[aria-current="page"]{ background:var(--krem); }
  .menu .btn{ justify-content:center; width:100%; }
  .menu-ac{ display:grid; }
}
@media (max-width: 640px){
  .bolum{ padding:56px 0; }
  .hero{ padding:52px 0 60px; }
  .izgara--3, .izgara--2{ grid-template-columns:1fr; }
  .galeri{ grid-template-columns:1fr 1fr; gap:14px; }
  .satir-2{ grid-template-columns:1fr; }
  .alt-ic{ grid-template-columns:1fr; gap:28px; }
  .pano-rozet{ width:132px; }
  .pano .bant-etiket{ font-size:.68rem; }
  .pano-not{ max-width:100%; }
}

/* ---------- Tıklayınca yüklenen gömmeler (harita, Instagram) ---------- */
.harita-gomme{ margin-top:14px; }
.harita-gomme iframe{ width:100%; aspect-ratio:4/3; border:var(--cizgi); border-radius:12px; display:block; }
.ig-gomme .instagram-media{ border-radius:12px; }

/* ---------- Erişilebilirlik: içeriğe atla ---------- */
.atla{ position:absolute; left:-9999px; top:8px; z-index:100; background:var(--murekkep); color:var(--kagit);
       padding:10px 14px; border-radius:8px; font-weight:700; }
.atla:focus{ left:8px; outline:3px solid var(--yesil); }

/* ---------- 404 ---------- */
.yok{ text-align:center; padding:70px 0; }
.yok h1{ font-size:clamp(2rem,5vw,3.2rem); }
.yok p{ max-width:36em; margin:12px auto 0; }

/* ---------- Proje kartı fotoğrafı (dernek CDN'inden) ---------- */
.proje-gorsel--foto{ position:relative; height:auto; min-height:0; padding:0; display:block; background:var(--koyu); }
.proje-gorsel--foto img{ width:100%; height:auto; display:block; }

/* ---------- "Nasıl katılırım" kartı: adımlar, alt düğme dipte ---------- */
.kart--dikey{ display:flex; flex-direction:column; }
.adimlar{ margin:6px 0 0; padding:0; list-style:none; counter-reset:adim; display:flex; flex-direction:column; gap:10px; }
.adimlar li{ position:relative; padding-left:38px; font-size:.97rem; line-height:1.5; }
.adimlar li::before{ counter-increment:adim; content:counter(adim); position:absolute; left:0; top:0;
  width:26px; height:26px; border-radius:50%; background:var(--yesil); color:#fff; font:700 .85rem/26px var(--f-mono); text-align:center; }
.ipucu-kart{ font-size:.9rem; opacity:.8; margin-top:12px; }
.kart--dikey .meta{ margin-top:14px; }

/* ---------- Alt bilgi: dernek bloğu ---------- */
.alt-sosyal{ margin-top:12px; }
.alt-not{ font-size:.88rem !important; opacity:.85; margin-bottom:12px; }
.alt-btnlar{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.alt-btnlar .btn{ font-size:.85rem; }
.alt .btn{ color:#fff; }
.alt .btn--ikincil{ color:var(--murekkep); }
.alt .btn:hover{ text-decoration:none; }

/* ---------- Kampanya ilerleme çubuğu ---------- */
.ilerleme{ height:10px; border:var(--cizgi); border-radius:999px; background:var(--kagit); overflow:hidden; margin-top:4px; }
.ilerleme-dolu{ display:block; height:100%; background:var(--yesil); border-radius:999px; transition:width .6s ease; }
.ilerleme-metin{ font-size:.86rem; margin-top:6px; opacity:.9; }
.ilerleme-yuzde{ font-family:var(--f-mono); font-weight:700; margin-left:6px; }
.kampanya-not{ font-size:.85rem; opacity:.75; margin:-18px 0 22px; }

/* ---------- Hayır Kapısı bandı ---------- */
.cta--hk .cta-ic{ display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:center; }
.cta-hk-logo img{ height:52px; width:auto; display:block; }
.cta-hk-metin .bant-etiket{ margin-bottom:10px; }
.cta--hk h2{ font-size:clamp(1.5rem,2.6vw,2rem); max-width:24em; margin-bottom:6px; }
.cta-hk-metin p{ font-size:.95rem; max-width:44em; opacity:.9; }
.cta-hk-btnlar{ display:flex; flex-direction:column; gap:10px; align-items:stretch; }
.cta-hk-btnlar .btn{ justify-content:center; }
@media (max-width:860px){
  .cta--hk .cta-ic{ grid-template-columns:1fr; gap:18px; }
  .cta-hk-btnlar{ flex-direction:row; flex-wrap:wrap; }
}

/* ---------- Alt bilgi: ikonlu liste, dernek logosu, sosyal ikonlar ---------- */
.alt-liste{ margin-top:12px; }
.alt-liste li{ display:flex; align-items:flex-start; gap:10px; }
.alt-ikon{ width:18px; height:18px; flex:0 0 auto; margin-top:3px; opacity:.85; }
.alt-hk{ display:inline-block; margin-bottom:14px; }
.alt-hk-logo{ height:36px; width:auto; display:block; }
.alt-sosyal-ikonlar{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.alt-sosyal-ikonlar a{ display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px;
  border:1.5px solid rgba(243,241,231,.35); border-radius:50%; color:var(--kagit); transition:background .15s, border-color .15s; }
.alt-sosyal-ikonlar a:hover{ background:var(--yesil); border-color:var(--yesil); text-decoration:none; }
.alt-sosyal-ikonlar .alt-ikon{ margin:0; opacity:1; width:17px; height:17px; }

/* ---------- Alt bilgi v2: iki marka sütunu + bağlantı şeridi ---------- */
.alt-ic--iki{ grid-template-columns:1fr 1fr; gap:48px; }
.alt-marka{ display:inline-block; margin-bottom:14px; }
.alt-marka-logo{ height:94px; width:auto; display:block; }
.alt-nav{ border-top:1px solid rgba(243,241,231,.25); }
.alt-nav-ic{ max-width:var(--kap); margin:0 auto; padding:14px 20px; display:flex; flex-wrap:wrap; gap:6px 22px; }
.alt-nav a{ font-size:.9rem; padding:4px 0; }
@media (max-width:860px){ .alt-ic--iki{ grid-template-columns:1fr; gap:32px; } .alt-marka-logo{ height:80px; } }

/* ---------- İkonlar ---------- */
.simge-ikon{ width:26px; height:26px; }
.btn-ikon{ width:16px; height:16px; margin-right:6px; vertical-align:-3px; }
.bilgi{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.bilgi li{ display:flex; align-items:flex-start; gap:10px; font-size:.92rem; line-height:1.45; }
.bilgi-ikon{ width:18px; height:18px; flex:0 0 auto; margin-top:2px; color:var(--yesil); }
.bilgi--buyuk li{ font-size:.97rem; gap:12px; }
.bilgi--buyuk .bilgi-ikon{ width:22px; height:22px; margin-top:1px; }
.bilgi a{ text-decoration:none; }
.bilgi a:hover{ text-decoration:underline; text-underline-offset:3px; }
.kart .bilgi + .kart-alt{ margin-top:18px; }

/* ---------- Hakkımızda ---------- */
.izgara--orta{ align-items:center; }
.izgara--4{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.alinti{ font-family:var(--f-display); font-weight:700; font-size:clamp(2rem,3.6vw,2.7rem); line-height:1.08; margin:14px 0 16px; }
.kart-logo{ height:116px; width:auto; display:block; margin:0 0 6px; }
.kart-logo--hk{ height:44px; margin-bottom:12px; }
.adim{ position:relative; padding-top:30px; }
.adim-no{ position:absolute; top:16px; right:18px; font:700 .8rem/26px var(--f-mono); width:26px; height:26px; border-radius:50%;
  background:var(--yesil); color:#fff; text-align:center; }
.alan-kart h3{ font-size:1.05rem; }
.alan-kart p{ font-size:.92rem; }
.bolum--krem{ background:var(--krem); border-top:var(--cizgi); border-bottom:var(--cizgi); }
.sss details{ background:var(--beyaz); border:var(--cizgi); border-radius:12px; padding:0 18px; margin-bottom:10px; box-shadow:var(--golge-kucuk, 3px 3px 0 rgba(40,84,33,.35)); }
.sss summary{ cursor:pointer; list-style:none; font-weight:700; padding:14px 0; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.sss summary::-webkit-details-marker{ display:none; }
.sss summary::after{ content:"+"; font-family:var(--f-mono); font-size:1.2rem; color:var(--yesil); flex:0 0 auto; }
.sss details[open] summary::after{ content:"–"; }
.sss details p{ padding:0 0 16px; font-size:.95rem; }
.alt-btnlar-acik{ display:flex; flex-wrap:wrap; gap:10px; }
@media (max-width:980px){ .izgara--4{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .izgara--4{ grid-template-columns:1fr; } .kart-logo{ height:96px; } }

/* ---------- Bağlantı sayfası (/link) ---------- */
.link-govde{ margin:0; }
.link-sayfa{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:40px 18px; }
.link-kap{ width:100%; max-width:460px; text-align:center; }
.link-avatar{ width:96px; height:96px; border-radius:50%; border:var(--cizgi); box-shadow:var(--golge); background:var(--beyaz); object-fit:cover; margin:0 auto 14px; display:block; }
.link-baslik{ font-family:var(--f-display); font-weight:700; font-size:2.1rem; line-height:1.05; margin:0 0 6px; }
.link-alt{ font-size:.98rem; opacity:.85; margin:0 0 22px; }
.link-liste{ display:flex; flex-direction:column; gap:12px; }
.link-btn{ display:flex; align-items:center; gap:14px; width:100%; padding:14px 16px; text-align:left;
  background:var(--beyaz); color:var(--murekkep); border:var(--cizgi); border-radius:16px; box-shadow:var(--golge);
  text-decoration:none; transition:transform .15s, box-shadow .15s; }
.link-btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(40,84,33,.9); }
.link-btn--vurgu{ background:var(--yesil); color:#fff; }
.link-btn-ikon{ width:42px; height:42px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; background:var(--krem); color:var(--koyu); }
.link-btn--vurgu .link-btn-ikon{ background:rgba(255,255,255,.18); color:#fff; }
.link-btn-ikon svg{ width:22px; height:22px; }
.link-btn-metin{ flex:1; min-width:0; }
.link-btn-metin b{ display:block; font-size:1rem; }
.link-btn-metin small{ display:block; font-size:.82rem; opacity:.75; margin-top:2px; }
.link-btn-ok{ width:18px; height:18px; flex:0 0 auto; opacity:.55; }
.link-uyari{ background:var(--beyaz); border:var(--cizgi); border-radius:16px; padding:22px; box-shadow:var(--golge); }
.link-uyari p{ margin-bottom:14px; }
.link-dip{ margin-top:28px; font-size:.82rem; opacity:.75; line-height:1.7; }
.link-dip a{ text-decoration:none; font-weight:600; }

/* ---------- Hakkımızda: ilkeler, belgeler, geniş harita ---------- */
.ilkeler{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.ilke{ display:flex; align-items:center; gap:14px; background:var(--beyaz); border:var(--cizgi); border-radius:14px; padding:16px 18px; box-shadow:var(--golge-kucuk); }
.ilke-ikon{ width:38px; height:38px; flex:0 0 auto; padding:8px; border-radius:10px; background:var(--krem); color:var(--koyu); }
.ilke b{ font-family:var(--f-display); font-weight:600; font-size:1.2rem; line-height:1.1; }
.belgeler{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.belgeler a{ display:inline-block; font-size:.86rem; padding:6px 12px; border:var(--cizgi); border-radius:999px; text-decoration:none; background:var(--kagit); }
.belgeler a:hover{ background:var(--krem); }
.harita-genis{ margin-top:28px; border:var(--cizgi); border-radius:var(--radius); overflow:hidden; box-shadow:var(--golge); background:var(--krem); }
.harita-genis iframe{ display:block; width:100%; height:380px; border:0; }
@media (max-width:980px){ .ilkeler{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .ilkeler{ grid-template-columns:1fr; } .harita-genis iframe{ height:280px; } }