/* ===== OZD Firma – main.css (temel stiller) ===== */

/* Reset/normalize benzeri hafif dokunuş */
*{box-sizing:border-box}
img{max-width:100%;height:auto;display:block}
a{color:var(--ozd-primary);text-decoration:none}
a:hover{text-decoration:underline}

/* Yardımcı sınıflar ve iskelet */
.container{width:min(100%,var(--ozd-max));margin-inline:auto;
  padding:clamp(12px,2vw,24px)}
.grid{display:grid;gap:clamp(12px,2vw,24px)}
.grid-auto{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.muted{color:var(--ozd-muted)}
.hide{display:none !important}
.center{text-align:center}

/* Başlıklar ve tipografi */
h1{font-size:clamp(1.6rem,3.5vw,2.6rem);margin:0 0 .2em}
h2{font-size:clamp(1.3rem,2.5vw,1.8rem);margin:.6em 0 .3em}
h3{margin:.6em 0 .3em}

/* Bölümler */
.header{border-bottom:1px solid #e5e7eb;background:#fff}
.main{min-height:50vh}
.footer{border-top:1px solid #e5e7eb;background:#fafafa;font-size:.95rem}

/* Bileşenler */
.card{border:1px solid #e5e7eb;border-radius:16px;padding:18px;background:#fff}
.btn{display:inline-block;padding:.65rem 1rem;border-radius:10px;
  border:1px solid transparent;background:var(--ozd-primary);color:#fff;font-weight:600}
.btn.secondary{background:var(--ozd-accent)}

/* Hero */
.hero{padding-block:40px}
.hero p{font-size:clamp(1rem,2vw,1.15rem)}

/* Formlar */
label{display:block;margin:.5rem 0 .35rem}
input,textarea{width:100%;padding:.65rem .8rem;border:1px solid #d1d5db;border-radius:8px;background:#fff}
input:focus,textarea:focus{outline:2px solid var(--ozd-primary);outline-offset:1px}

/* Harita sarıcı */
.map-wrap{aspect-ratio:16/9;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden}

/* Erişilebilirlik: skip link */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:12px;top:12px;width:auto;height:auto;background:#fff;padding:.5rem .75rem;border-radius:8px;border:1px solid #e5e7eb}

/* Yardımcı boşluklar */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.mt-1{margin-top:.25rem}.mb-1{margin-bottom:.25rem}
.mt-2{margin-top:.5rem}.mb-2{margin-bottom:.5rem}
.mt-3{margin-top:1rem}.mb-3{margin-bottom:1rem}


/* ===========================
   FOOTER
   =========================== */

.footer{
  background:#000; /* siyah arka plan */
  color:#fff;      /* varsayılan metin: beyaz */
  margin-top: clamp(24px, 4vw, 56px);
  padding: clamp(28px, 4vw, 56px) 0;
  border-top: 1px solid rgba(255,255,255,.06); /* hafif üst sınır */
}

.footer .muted{
  color:#bbb; /* siyah zeminde okunaklı soluk metin */
}

.footer a{
  color:#fff; 
  text-decoration: none;
  transition: color .15s ease, opacity .15s ease, text-decoration-color .15s ease;
}
.footer a:hover{
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.footer a:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Grid yerleşim: mobilde 1 sütun, sonra 2, sonra 3 */
.footer__grid{
  display: grid;
  gap: clamp(16px, 3vw, 28px);
  grid-template-columns: 1fr; /* mobil */
}

@media (min-width: 640px){
  .footer__grid{
    grid-template-columns: 1.1fr 1fr; /* tablet: 2 sütun */
  }
}
@media (min-width: 960px){
  .footer__grid{
    grid-template-columns: 1.2fr 1fr 1fr; /* desktop: 3 sütun */
  }
}

/* Sütunlar */
.footer__col{
  min-width: 0;
}
.footer__col > * + *{
  margin-top: .65rem; /* elemanlar arası dikey boşluk */
}

/* Başlıklar */
.footer__title{
  font-weight: 600;
  font-size: clamp(1rem, 1.2vw, 1.1rem);
  margin: 0 0 .6rem 0;
  color: #fff;
}

/* Sosyal liste */
.footer__social{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: .75rem .9rem;
  flex-wrap: wrap;
}
.footer__social li{
  line-height: 1.6;
}
.footer__social a{
  display: inline-flex;
  align-items: center;
  line-height: 1.4;
  border-radius: 8px;
  padding: 4px 6px;
  background: rgba(255,255,255,.06);
}
.footer__social a:hover{
  background: rgba(255,255,255,.12);
}

/* Tipografi ve satır yüksekliği */
.footer p,
.footer li{
  line-height: 1.6;
}

/* Adres/telefon blokları arasına hafif aralık */
.footer__col--contact p + p{
  margin-top: .35rem;
}

/* Erişilebilirlik için ekran okuyucuya özel sınıf (kullanıyorsan) */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}


/* ===========================
   AHŞAP TEMA (GLOBAL UYGULAMA)
   =========================== */

/* Palet ve kontrast değişkenleri */
:root{
  /* Ahşap tonları (açık → koyu) */
  --wood-50:#f6efe6;
  --wood-100:#ecdbc6;
  --wood-300:#d7b28a;
  --wood-600:#a4784f;
  --wood-800:#6b4226;

  /* Ahşap üstü metin renkleri */
  --wood-text-dark:#2b1a10;   /* Açık ahşapta koyu metin (AA+) */
  --wood-text-light:#faf7f2;  /* Koyu ahşapta açık metin */
  --wood-muted:#d6c9b8;

  /* Vurgu/link renkleri (ahşapla uyumlu) */
  --wood-accent:#d9a46b;
  --wood-accent-hover:#ffd198;
}

/* Sayfa zemininde hafif ahşap dokusu */
body{
  background:
    linear-gradient(180deg,var(--wood-50),var(--wood-100)),
    repeating-linear-gradient(
      90deg,
      rgba(107,66,38,.05) 0px,
      rgba(107,66,38,.05) 2px,
      rgba(215,166,107,.05) 2px,
      rgba(215,166,107,.05) 4px
    );
  background-size:auto, 8px 100%;
  color: var(--wood-text-dark); /* okunaklı koyu metin */
}

/* Üst alanı ahşapla bütünleştir (koyu şerit) */
.header{
  background: var(--wood-800);
  border-bottom: 1px solid rgba(0,0,0,.35);
  color: var(--wood-text-light);
}
.header a{ color: var(--wood-text-light); }
.header a:hover{ color: #fff; }

/* Hero bölümü ahşap açık degrade */
.hero{
  background: linear-gradient(180deg,var(--wood-100),var(--wood-300));
  color: var(--wood-text-dark);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Orta içerik alanına nötr kontrast (okunurluk için beyaz kart yaklaşımı) */
.main{
  background: transparent;
}
.card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}

/* Ahşap zemin üzerinde bağlantılar */
a{ color: var(--wood-accent); }
a:hover{ color: var(--wood-accent-hover); }

/* Butonlar: ahşap palete uyumlu hover/aktif dokunuşlar */
.btn{
  background: var(--ozd-primary, var(--wood-600));
  border-color: transparent;
  color:#fff;
}
.btn:hover{
  filter: brightness(1.06);
}
.btn.secondary{
  background: var(--ozd-accent, var(--wood-accent));
  color:#1b1b1b;
}
.btn.secondary:hover{
  background: var(--ozd-accent, var(--wood-accent-hover));
}

/* Bölüm boşlukları (genel) */
.section{ padding: clamp(30px,4vw,60px) 0; }

/* Ahşap temalı bölüm varyantı (isteğe bağlı sınıf) */
.section.wood,
.wood-bg{
  background: linear-gradient(180deg,var(--wood-100),var(--wood-300));
  color: var(--wood-text-dark);
  /* ince doku çizgisi */
  background-image:
    linear-gradient(180deg,var(--wood-100),var(--wood-300)),
    repeating-linear-gradient(
      90deg,
      rgba(107,66,38,.04) 0px,
      rgba(107,66,38,.04) 2px,
      rgba(215,166,107,.04) 2px,
      rgba(215,166,107,.04) 4px
    );
  background-blend-mode: multiply, normal;
}
.wood-bg h1, .wood-bg h2, .wood-bg h3, .wood-bg h4{ color: var(--wood-text-dark); }
.wood-bg .muted{ color: var(--wood-muted); }
.wood-bg a{ color: var(--wood-accent); }
.wood-bg a:hover{ color: var(--wood-accent-hover); }

/* Ahşap kart (vurgulu kutu) */
.wood-card{
  background: var(--wood-50);
  border:1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: clamp(16px,2vw,28px);
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
  color: var(--wood-text-dark);
}

/* Yan alan (kullanıyorsan) */
.sidebar{
  display:grid;
  gap: 16px;
}
.sidebar .widget{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  padding:16px;
}

/* Formlar: ahşap zemin üzerinde kontrast */
label{ color: inherit; }
input, textarea{
  background:#fff;
  border:1px solid #d1d5db;
  color:#111;
}
input:focus, textarea:focus{
  outline:2px solid var(--ozd-primary, var(--wood-600));
  outline-offset:1px;
}

/* Başlık şeridi (opsiyonel, bölüm başlıklarına) */
.wood-header{
  background: var(--wood-800);
  color: var(--wood-text-light);
  padding: clamp(12px,2vw,16px);
  border-left: 4px solid var(--wood-600);
  border-radius: 8px;
  letter-spacing:.02em;
  font-weight:600;
}

/* Konteyner kartlı sayfa kabı (isteğe bağlı) */
.page-frame{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  padding: clamp(18px,2.4vw,28px);
}

/* Odak görünürlüğü ahşapta net olsun */
:focus-visible{
  outline:2px solid var(--wood-text-dark);
  outline-offset:2px;
}

/* Küçük ekran optimizasyonları */
@media (max-width: 640px){
  .header{ text-align:center; }
  .hero{ padding-block: 28px; }
}


/* =====================================================
   Footer (widget + yasal menü) düzeni
   Renkleri değiştirme — mevcut paleti kullan (inherit)
   ===================================================== */

/* Yeni yapının kök kapsayıcısı */
.ozd-footer-widgets{
  padding-block: clamp(20px, 3.2vw, 36px);
}

/* 3 sütunlu ızgara: mobil 1, tablet 2, desktop 3 */
.ozd-footer-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(16px, 2.8vw, 28px);
}
@media (min-width: 640px){
  .ozd-footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (min-width: 960px){
  .ozd-footer-grid{ grid-template-columns: 1.15fr 1fr 1fr; }
}

/* Sütun genel davranışları */
.ozd-footer-col{
  min-width: 0; /* aşırı geniş içeriği kırmadan akıt */
}
.ozd-footer-col .widget{ margin: 0; }
.ozd-footer-col .widget + .widget{ margin-top: .75rem; }

/* Başlık hiyerarşisi — renkleri miras al */
.ozd-footer-col .widget-title,
.ozd-footer-col .footer__title{
  font-weight: 600;
  font-size: clamp(1rem, 1.1vw, 1.1rem);
  margin: 0 0 .6rem 0;
  color: inherit;
}

/* Yasal/Sitemap menüsü */
.ozd-footer-legal-nav{ /* <nav> sarmalayıcı */
  display: block;
}
.ozd-footer-legal{ /* <ul> */
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem .9rem;
}
/* Tek satır linkler; renkleri mevcut temadan al */
.ozd-footer-legal li a{
  text-decoration: none;
  color: inherit;
  line-height: 1.6;
}
.ozd-footer-legal li a:hover{ text-decoration: underline; }
.ozd-footer-legal li a:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 2px;
  text-decoration: none;
}

/* Sosyal bağlantılar (Özel HTML içi liste kullandıysan) */
.footer-social .social-links{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: .65rem .9rem;
  flex-wrap: wrap;
}
.footer-social .social-links a{
  display: inline-flex;
  align-items: center;
  line-height: 1.4;
  padding: 4px 6px;
  border-radius: 8px;
  background: transparent; /* renk miras */
  border: 1px solid currentColor; /* kontrast, renk miras */
  text-decoration: none;
}
.footer-social .social-links a:hover{
  text-decoration: none;
  opacity: .9;
}
.footer-social .social-links a:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Telif satırı — yalnızca yerleşim; renk miras */
.footer-bottom{
  margin-top: clamp(16px, 2.6vw, 28px);
  padding-top: clamp(12px, 2vw, 16px);
  border-top: 1px solid currentColor;
  opacity: .85;
  text-align: center;
  font-size: .95rem;
}

/* Küçük ekranlarda dikey boşlukları sıkılaştır */
@media (max-width: 480px){
  .ozd-footer-widgets{ padding-block: 16px; }
  .footer-bottom{ margin-top: 16px; }
}
