/* ==========================================================================
   Üçel Tarım — Site stilleri
   Renkler logodan alınmıştır (bkz. proje brifingi §4).
   ========================================================================== */

:root {
  /* Marka renkleri */
  --yesil-koyu: #2E4F38;   /* ana renk: metin, başlık, footer */
  --yesil-acik: #8ED359;   /* vurgu: ikon, hover, dekoratif çizgi (metin için DEĞİL) */
  --sari-yesil: #D3D345;   /* çok az: küçük aksan */
  --yesil-buton: #3E6B4A;  /* buton / etkileşim */
  --yesil-buton-hover: #345A3E;
  --zemin: #FAFAF7;
  --zemin-krem: #F1EEE4;
  --beyaz: #FFFFFF;

  /* Türetilmiş nötrler */
  --metin: #22352A;
  --metin-ikincil: #5A6B5F;
  --cizgi: #DDD9CC;
  --cizgi-acik: #E8E4D8;
  --golge: 0 1px 2px rgba(46, 79, 56, .06), 0 8px 24px -12px rgba(46, 79, 56, .18);

  /* Tipografi */
  --font: "Manrope", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --fs-sm: .875rem;
  --fs-base: 1.0625rem;
  --fs-lg: 1.1875rem;
  --fs-h3: 1.25rem;
  --fs-h2: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem);
  --fs-h1: clamp(2rem, 1.4rem + 2.8vw, 3.25rem);
  --fs-hero: clamp(2rem, 1.2rem + 3.6vw, 3.75rem);

  /* Boşluk / ölçüler */
  --container: 1160px;
  --kenar: clamp(1.25rem, 4vw, 2.5rem);
  --bolum-dikey: clamp(3.5rem, 8vw, 6.5rem);
  --radius: 14px;
  --radius-sm: 8px;
  --gecis: 180ms ease;
}

/* --------------------------------------------------------------------------
   Temel
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-base);
  line-height: 1.65;
  color: var(--metin);
  background: var(--zemin);
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
main { flex: 1 0 auto; }
img, svg, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--yesil-koyu); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--yesil-buton); }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
h1, h2, h3 { color: var(--yesil-koyu); line-height: 1.2; letter-spacing: -.01em; margin: 0 0 .5em; font-weight: 700; }
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
ul { margin: 0; padding: 0; list-style: none; }
button, input, textarea { font: inherit; color: inherit; }

:focus-visible {
  outline: 3px solid var(--yesil-acik);
  outline-offset: 3px;
  border-radius: 2px;
}

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--kenar);
}

.skip-link {
  position: absolute; left: 1rem; top: -100px;
  background: var(--yesil-koyu); color: var(--beyaz);
  padding: .6rem 1rem; border-radius: var(--radius-sm); z-index: 100;
}
.skip-link:focus { top: 1rem; color: var(--beyaz); }

.ikon {
  width: 1.25em; height: 1.25em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

/* --------------------------------------------------------------------------
   Butonlar ve bağlantılar
   -------------------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .8rem 1.5rem;
  min-height: 48px;
  border-radius: 999px;
  border: 2px solid var(--yesil-buton);
  background: var(--yesil-buton);
  color: var(--beyaz);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background var(--gecis), border-color var(--gecis), color var(--gecis), transform var(--gecis);
}
.btn:hover { background: var(--yesil-buton-hover); border-color: var(--yesil-buton-hover); color: var(--beyaz); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .65; cursor: default; }

.btn-ikincil { background: transparent; color: var(--yesil-koyu); border-color: var(--cizgi); }
.btn-ikincil:hover { background: var(--zemin-krem); border-color: var(--yesil-koyu); color: var(--yesil-koyu); }

.btn-acik { background: var(--beyaz); border-color: var(--beyaz); color: var(--yesil-koyu); }
.btn-acik:hover { background: var(--zemin-krem); border-color: var(--zemin-krem); color: var(--yesil-koyu); }

.btn-cerceve-acik { background: transparent; border-color: rgba(255,255,255,.7); color: var(--beyaz); }
.btn-cerceve-acik:hover { background: rgba(255,255,255,.12); border-color: var(--beyaz); color: var(--beyaz); }

.link-ok {
  display: inline-flex; align-items: center; gap: .4rem;
  font-weight: 600; text-decoration: none; color: var(--yesil-koyu);
}
.link-ok .ikon { transition: transform var(--gecis); }
.link-ok:hover .ikon-ok { transform: translateX(4px); }
.link-ok span { border-bottom: 2px solid var(--yesil-acik); }

.ust-baslik {
  display: inline-flex; align-items: center; gap: .6rem;
  margin: 0 0 .75rem;
  font-size: var(--fs-sm); font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--yesil-buton);
}
.ust-baslik::before { content: ""; width: 1.75rem; height: 3px; background: var(--yesil-acik); border-radius: 2px; }
.ust-baslik-acik { color: rgba(255,255,255,.85); }

.rozet {
  display: inline-block;
  padding: .15rem .6rem;
  border-radius: 999px;
  background: var(--yesil-koyu);
  color: var(--beyaz);
  font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(250, 250, 247, .94);
  backdrop-filter: saturate(160%) blur(8px);
  border-bottom: 1px solid var(--cizgi-acik);
  transition: box-shadow var(--gecis);
}
.site-header.kaydirildi { box-shadow: 0 6px 20px -14px rgba(46,79,56,.35); }
.header-inner {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-height: 84px;
}
.brand img { width: auto; height: 52px; }

.nav-list { display: flex; gap: .25rem; }
.nav-list a {
  display: block; padding: .6rem .9rem;
  font-weight: 600; text-decoration: none; color: var(--yesil-koyu);
  border-radius: var(--radius-sm);
  position: relative;
}
.nav-list a::after {
  content: ""; position: absolute; left: .9rem; right: .9rem; bottom: .3rem;
  height: 2px; background: var(--yesil-acik); border-radius: 2px;
  transform: scaleX(0); transform-origin: left; transition: transform var(--gecis);
}
.nav-list a:hover::after, .nav-list a[aria-current="page"]::after { transform: scaleX(1); }

.nav-toggle {
  display: none; align-items: center; gap: .6rem;
  background: none; border: 1px solid var(--cizgi); border-radius: var(--radius-sm);
  padding: .5rem .8rem; cursor: pointer; font-weight: 600; color: var(--yesil-koyu);
}
.nav-toggle-cizgi, .nav-toggle-cizgi::before, .nav-toggle-cizgi::after {
  display: block; width: 20px; height: 2px; background: currentColor; border-radius: 2px;
  transition: transform var(--gecis), opacity var(--gecis);
}
.nav-toggle-cizgi { position: relative; }
.nav-toggle-cizgi::before, .nav-toggle-cizgi::after { content: ""; position: absolute; left: 0; }
.nav-toggle-cizgi::before { top: -6px; }
.nav-toggle-cizgi::after { top: 6px; }
.nav-toggle[aria-expanded="true"] .nav-toggle-cizgi { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle-cizgi::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-cizgi::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 767px) {
  .header-inner { min-height: 72px; }
  .brand img { height: 44px; }
  .nav-toggle { display: inline-flex; }
  .site-nav {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--zemin);
    border-bottom: 1px solid var(--cizgi-acik);
    box-shadow: 0 16px 32px -16px rgba(46,79,56,.3);
  }
  .site-nav.acik { display: block; }
  .nav-list { flex-direction: column; gap: 0; padding: .5rem var(--kenar) 1rem; }
  .nav-list a { padding: .85rem .5rem; border-bottom: 1px solid var(--cizgi-acik); border-radius: 0; }
  .nav-list li:last-child a { border-bottom: 0; }
  .nav-list a::after { display: none; }
  .nav-list a[aria-current="page"] { color: var(--yesil-buton); }
}

/* --------------------------------------------------------------------------
   Hero (anasayfa)
   -------------------------------------------------------------------------- */
.hero {
  position: relative;
  display: grid; align-items: end;
  min-height: min(82vh, 760px);
  background: var(--yesil-koyu);
  color: var(--beyaz);
  isolation: isolate;
  overflow: hidden;
}
.hero-foto, .hero-foto img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-foto img { object-fit: cover; object-position: center 40%; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(20,38,26,.25) 0%, rgba(20,38,26,.15) 35%, rgba(20,38,26,.82) 100%),
    linear-gradient(90deg, rgba(20,38,26,.55) 0%, rgba(20,38,26,0) 70%);
}
.hero-icerik {
  position: relative; z-index: 2;
  padding-top: clamp(5rem, 14vw, 9rem);
  padding-bottom: clamp(3rem, 7vw, 5.5rem);
  max-width: var(--container);
}
.hero-logo { width: auto; height: clamp(56px, 8vw, 84px); margin-bottom: 1.75rem; }
.hero-baslik {
  color: var(--beyaz);
  font-size: var(--fs-hero);
  max-width: 17ch;
  margin-bottom: 1rem;
  text-shadow: 0 2px 20px rgba(0,0,0,.25);
}
.hero-alt {
  font-size: clamp(1.05rem, .95rem + .5vw, 1.3rem);
  max-width: 56ch;
  color: rgba(255,255,255,.92);
  margin-bottom: 2rem;
}
.hero-butonlar { display: flex; flex-wrap: wrap; gap: .75rem; }
.hero--fotosuz { min-height: 0; }
.hero--fotosuz::after { background: none; }

/* --------------------------------------------------------------------------
   Bölümler
   -------------------------------------------------------------------------- */
.bolum { padding-block: var(--bolum-dikey); }
.bolum-krem { background: var(--zemin-krem); }
.bolum-koyu { background: var(--yesil-koyu); color: var(--beyaz); }
.bolum-koyu h2 { color: var(--beyaz); }
.bolum-koyu a:not(.btn) { color: var(--beyaz); }

.bolum-baslik {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem;
  margin-bottom: 2.25rem;
}
.bolum-baslik h2 { margin-bottom: 0; }

.sayfa-baslik {
  background: var(--zemin-krem);
  border-bottom: 1px solid var(--cizgi-acik);
  padding-block: clamp(2.5rem, 6vw, 4.5rem);
}
.sayfa-baslik h1 { margin-bottom: 0; position: relative; padding-top: .9rem; }
.sayfa-baslik h1::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 3rem; height: 4px; border-radius: 2px; background: var(--yesil-acik);
}
.sayfa-baslik-alt { margin-top: .75rem; color: var(--metin-ikincil); font-size: var(--fs-lg); max-width: 60ch; }

/* Tanıtım (anasayfa) */
.tanitim {
  display: grid; gap: 2rem 4rem;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 900px) {
  .tanitim { grid-template-columns: 5fr 7fr; }
}
.tanitim h2 { margin-bottom: 0; }
.tanitim-metin { font-size: var(--fs-lg); }
.tanitim-metin p { max-width: 62ch; }
.tanitim-metin .link-ok { margin-top: 1.25rem; }

.metin-govde { max-width: 72ch; font-size: var(--fs-lg); }
.metin-govde p { margin-bottom: 1.25em; }

/* Kartlar */
.kart {
  background: var(--beyaz);
  border: 1px solid var(--cizgi-acik);
  border-radius: var(--radius);
  box-shadow: var(--golge);
  overflow: hidden;
}
.kart-izgara {
  display: grid; gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}
.fabrika-kart { display: flex; flex-direction: column; transition: transform var(--gecis), box-shadow var(--gecis); }
.fabrika-kart:hover { transform: translateY(-3px); box-shadow: 0 2px 4px rgba(46,79,56,.06), 0 18px 34px -16px rgba(46,79,56,.3); }
.kart-foto { aspect-ratio: 4 / 3; background: var(--zemin-krem); overflow: hidden; }
.kart-foto picture img { width: 100%; height: 100%; object-fit: cover; }
.kart-govde { padding: 1.35rem 1.5rem 1.6rem; display: flex; flex-direction: column; gap: .4rem; }
.kart-ust { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.kart-sehir { font-size: var(--fs-sm); font-weight: 600; color: var(--metin-ikincil); letter-spacing: .02em; }
.kart-baslik { margin: 0; font-size: var(--fs-h3); }
.kart-baslik a { text-decoration: none; }
.kart-baslik a::after { content: ""; position: absolute; inset: 0; }
.fabrika-kart { position: relative; }
.kart-adres { color: var(--metin-ikincil); font-size: .95rem; margin: 0; }

.kart-metin { padding: clamp(1.5rem, 3vw, 2.25rem); }
.kart-baslik-buyuk { position: relative; padding-top: .8rem; font-size: 1.5rem; }
.kart-baslik-buyuk::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 2.5rem; height: 3px; border-radius: 2px; background: var(--yesil-acik);
}
.ikili-izgara {
  display: grid; gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
}

/* Fotoğrafı olmayan fabrika için yer tutucu */
.foto-yok {
  width: 100%; height: 100%; min-height: 200px;
  display: grid; place-items: center;
  background:
    radial-gradient(circle at 30% 20%, rgba(142,211,89,.18), transparent 55%),
    linear-gradient(160deg, var(--zemin-krem), #E6E2D3);
}
.foto-yok img { width: 96px; opacity: .35; }

/* İletişim satırları (adres / tel / faks / e-posta) */
.iletisim-liste { display: grid; gap: .65rem; }
.iletisim-liste li { display: flex; gap: .7rem; align-items: flex-start; }
.iletisim-liste .ikon { color: var(--yesil-buton); margin-top: .2em; }
.iletisim-liste a { text-decoration: none; }
.iletisim-liste a:hover { text-decoration: underline; }
.satir-icerik { display: flex; flex-direction: column; }
.satir-etiket { font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--metin-ikincil); }

/* Fabrika detay (Fabrikalarımız sayfası) */
.fabrika-liste { display: grid; gap: 2rem; }
.fabrika-detay {
  display: grid; gap: 1.5rem;
  grid-template-columns: minmax(0, 1fr);
  background: var(--beyaz);
  border: 1px solid var(--cizgi-acik);
  border-radius: var(--radius);
  box-shadow: var(--golge);
  overflow: hidden;
  scroll-margin-top: 100px;
}
.fabrika-detay-foto { aspect-ratio: 4 / 3; background: var(--zemin-krem); }
.fabrika-detay-foto picture img { width: 100%; height: 100%; object-fit: cover; }
.fabrika-detay-govde { padding: 1.5rem 1.5rem 2rem; display: flex; flex-direction: column; gap: 1.1rem; }
.fabrika-detay-baslik { margin: 0; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.fabrika-detay-govde .btn { align-self: flex-start; margin-top: .25rem; }
@media (min-width: 900px) {
  .fabrika-detay { grid-template-columns: 6fr 5fr; gap: 0; }
  .fabrika-detay-foto { aspect-ratio: auto; min-height: 380px; }
  .fabrika-detay-govde { padding: 2.5rem; justify-content: center; }
}

/* Çağrı (anasayfa alt bandı) */
.cagri {
  display: grid; gap: 2rem 4rem; align-items: center;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 900px) { .cagri { grid-template-columns: 7fr 5fr; } }
.cagri h2 { margin-bottom: .5rem; }
.cagri-metin { color: rgba(255,255,255,.85); font-size: var(--fs-lg); max-width: 50ch; margin: 0; }
.cagri-aksiyon { display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; }
.cagri-iletisim { display: grid; gap: .5rem; }
.cagri-iletisim li { display: flex; align-items: center; gap: .6rem; }
.cagri-iletisim .ikon { color: var(--yesil-acik); }
.cagri-iletisim a { text-decoration: none; font-weight: 600; }
.cagri-iletisim a:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
   İletişim sayfası
   -------------------------------------------------------------------------- */
.iletisim-izgara {
  display: grid; gap: 3rem;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}
@media (min-width: 960px) { .iletisim-izgara { grid-template-columns: 7fr 5fr; gap: 4rem; } }

.form-kutu {
  background: var(--beyaz);
  border: 1px solid var(--cizgi-acik);
  border-radius: var(--radius);
  box-shadow: var(--golge);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  scroll-margin-top: 100px;
}
.form-kutu h2 { margin-bottom: .25rem; }
.form-aciklama { color: var(--metin-ikincil); margin-bottom: 1.75rem; }
.iletisim-form { display: grid; gap: 1.1rem; }
.form-ikili { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.form-satir { display: grid; gap: .4rem; }
.form-satir label { font-weight: 600; font-size: .95rem; color: var(--yesil-koyu); }
.etiket-not { font-weight: 400; color: var(--metin-ikincil); }
.form-satir input, .form-satir textarea {
  width: 100%;
  padding: .75rem .9rem;
  border: 1px solid var(--cizgi);
  border-radius: var(--radius-sm);
  background: var(--zemin);
  transition: border-color var(--gecis), box-shadow var(--gecis), background var(--gecis);
}
.form-satir input:focus, .form-satir textarea:focus {
  outline: none;
  border-color: var(--yesil-buton);
  background: var(--beyaz);
  box-shadow: 0 0 0 3px rgba(142,211,89,.35);
}
.form-satir textarea { resize: vertical; min-height: 140px; }
.bal-kupu { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: .25rem; }
.form-durum { margin: 0; padding: .6rem .9rem; border-radius: var(--radius-sm); font-size: .95rem; font-weight: 500; }
.form-durum--ok { background: #E6F4D9; color: #234A2A; border: 1px solid #BFE29B; }
.form-durum--hata { background: #FBEAE7; color: #7A2E22; border: 1px solid #F0C4BC; }
.form-not { font-size: var(--fs-sm); color: var(--metin-ikincil); margin: .5rem 0 0; }
.cf-turnstile { min-height: 65px; }

.lokasyonlar { display: grid; gap: 1.25rem; align-content: start; }
.lokasyonlar h2 { margin-bottom: .25rem; }
.lokasyon {
  padding: 1.35rem 0 1.5rem;
  border-top: 1px solid var(--cizgi);
  display: grid; gap: .6rem;
  scroll-margin-top: 100px;
}
.lokasyon-baslik { margin: 0; }
.lokasyon .link-ok { margin-top: .35rem; font-size: .95rem; }

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */
.bulunamadi { text-align: center; padding-block: clamp(4rem, 12vw, 8rem); }
.bulunamadi p { color: var(--metin-ikincil); margin-bottom: 1.5rem; }
.bulunamadi .ust-baslik::before { display: none; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-footer {
  background: var(--yesil-koyu);
  color: rgba(255,255,255,.85);
  margin-top: auto;
}
.site-footer a { color: var(--beyaz); text-decoration: none; }
.site-footer a:hover { color: var(--yesil-acik); }
.footer-grid {
  display: grid; gap: 2.5rem 2rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  padding-block: clamp(3rem, 6vw, 4.5rem) 2.5rem;
}
@media (min-width: 900px) { .footer-grid { grid-template-columns: 1.6fr 1fr 1fr .8fr; } }
.footer-brand img { width: auto; height: 60px; margin-bottom: 1.25rem; }
.footer-adres { max-width: 30ch; margin: 0; font-size: .95rem; }
.footer-baslik {
  color: var(--beyaz); font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  margin-bottom: 1rem;
}
.footer-liste { display: grid; gap: .6rem; }
.footer-lokasyonlar li { display: grid; }
.footer-lokasyonlar a { font-weight: 600; }
.footer-sehir { font-size: var(--fs-sm); color: rgba(255,255,255,.6); }
.footer-liste a[aria-current="page"] { color: var(--yesil-acik); }
.footer-alt {
  border-top: 1px solid rgba(255,255,255,.14);
  padding-block: 1.25rem;
  font-size: var(--fs-sm);
  color: rgba(255,255,255,.65);
}
.footer-alt p { margin: 0; }

/* --------------------------------------------------------------------------
   Yazdırma
   -------------------------------------------------------------------------- */
@media print {
  .site-header, .site-footer, .hero-butonlar, .nav-toggle, .iletisim-form, .bolum-koyu { display: none !important; }
  body { background: #fff; color: #000; }
  a { color: inherit; }
}