/* Şifalı Bahçe — palet: adaçayı zemin, yaprak yeşili, dut moru, ayva sarısı */
:root {
  --zemin: #EEF1E6;
  --zemin-koyu: #E2E7D7;
  --murekkep: #1F2A22;
  --soluk: #56635A;
  --yaprak: #2F4A37;
  --dut: #5B2140;
  --ayva: #E3B53C;
  --cizgi: #C9D1BC;
  --kart: #F7F9F2;

  --f-baslik: "Young Serif", Georgia, serif;
  --f-metin: "Albert Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-etiket: "IBM Plex Mono", ui-monospace, Menlo, monospace;

  --kenar: clamp(16px, 4vw, 56px);
  --genislik: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--zemin);
  color: var(--murekkep);
  font: 400 17px/1.6 var(--f-metin);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--ayva); outline-offset: 3px; border-radius: 4px; }

.gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.atla { position: absolute; left: -999px; top: 8px; background: var(--yaprak); color: #fff; padding: 8px 14px; border-radius: 8px; z-index: 10; }
.atla:focus { left: 8px; }

/* Üst şerit */
.ust {
  max-width: var(--genislik);
  margin: 0 auto;
  padding: 22px var(--kenar);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.marka {
  display: inline-flex; align-items: center; gap: 10px;
  text-decoration: none;
  font: 400 22px/1 var(--f-baslik);
  color: var(--yaprak);
}
.marka-ikon { width: 34px; height: 34px; color: var(--dut); }
.menu { display: flex; gap: 26px; font-size: 15px; font-weight: 500; }
.menu a { text-decoration: none; color: var(--soluk); padding: 6px 0; }
.menu a:hover { color: var(--murekkep); }
.menu .menu-vurgu { color: var(--dut); border-bottom: 2px solid var(--ayva); }

/* Kahraman */
.kahraman {
  max-width: var(--genislik);
  margin: 0 auto;
  padding: clamp(24px, 5vw, 64px) var(--kenar) clamp(48px, 7vw, 96px);
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}
.ust-etiket {
  font: 500 13px/1 var(--f-etiket);
  letter-spacing: .08em;
  color: var(--soluk);
  margin: 0 0 22px;
}
.kahraman h1 {
  font: 400 clamp(46px, 7.4vw, 104px)/.98 var(--f-baslik);
  letter-spacing: -.02em;
  color: var(--yaprak);
  margin: 0 0 28px;
}
.kahraman h1 em { font-style: normal; color: var(--dut); display: block; }
.giris { font-size: 19px; color: var(--soluk); max-width: 34ch; margin: 0 0 34px; }

.bu-ay {
  display: inline-flex; flex-direction: column; gap: 6px;
  padding: 16px 20px 18px;
  background: var(--kart);
  border-left: 4px solid var(--ayva);
  border-radius: 0 12px 12px 0;
}
.bu-ay-etiket { font: 500 12px/1 var(--f-etiket); letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); }
.bu-ay-liste { font: 400 24px/1.25 var(--f-baslik); color: var(--dut); }

.kahraman-gorsel {
  margin: 0;
  aspect-ratio: 4 / 5;
  border-radius: 999px 999px 18px 18px;   /* kemer: bahçe kapısı */
  overflow: hidden;
  background: linear-gradient(160deg, #6E8B5E, var(--yaprak));
}
.kahraman-gorsel img { width: 100%; height: 100%; object-fit: cover; }

/* Bölüm başları */
.bolum-bas { max-width: 640px; margin: 0 0 36px; }
.bolum-bas h2, .ilkeler h2 {
  font: 400 clamp(32px, 4.4vw, 52px)/1.05 var(--f-baslik);
  color: var(--yaprak);
  margin: 0 0 12px;
}
.bolum-bas p { color: var(--soluk); margin: 0; }

/* Hasat takvimi — imza öğe */
.takvim {
  background: var(--yaprak);
  color: #EEF1E6;
  padding: clamp(56px, 8vw, 104px) var(--kenar);
}
.takvim > * { max-width: var(--genislik); margin-left: auto; margin-right: auto; }
.takvim .bolum-bas { margin-left: auto; margin-right: auto; max-width: var(--genislik); }
.takvim .bolum-bas h2 { color: #fff; }
.takvim .bolum-bas p { color: #C5D2BD; max-width: 56ch; }

.takvim-kutu { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.takvim-tablo {
  width: 100%;
  min-width: 720px;
  border-collapse: separate;
  border-spacing: 0;
  font: 400 15px/1 var(--f-metin);
}
.takvim-tablo th {
  font: 500 12px/1 var(--f-etiket);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #A9BAA2;
  padding: 0 0 14px;
  text-align: center;
}
.takvim-tablo abbr { text-decoration: none; }
.takvim-tablo .meyve-sut { text-align: left; width: 150px; }
.takvim-tablo th.simdi { color: var(--ayva); }

.takvim-tablo tbody th {
  font: 400 19px/1 var(--f-baslik);
  letter-spacing: 0;
  text-transform: none;
  color: #fff;
  text-align: left;
  padding: 0 12px 0 0;
  height: 48px;
  white-space: nowrap;
}
.takvim-tablo td {
  height: 48px;
  padding: 0;
  border-top: 1px solid rgba(238, 241, 230, .12);
  position: relative;
}
.takvim-tablo tbody tr:first-child td { border-top-color: rgba(238, 241, 230, .2); }
.takvim-tablo td.simdi { background: rgba(227, 181, 60, .12); }

/* Hasat çubuğu: ardışık ayları tek parça gibi göster */
.takvim-tablo td.var::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 15px; bottom: 15px;
  background: var(--renk, var(--ayva));
}
.takvim-tablo td.bas::after { left: 6px; border-radius: 999px 0 0 999px; }
.takvim-tablo td.son::after { right: 6px; border-radius: 0 999px 999px 0; }
.takvim-tablo td.bas.son::after { border-radius: 999px; }
.takvim-tablo tr.simdi-var th { color: var(--ayva); }

.dipnot { font-size: 14px; color: #A9BAA2; margin-top: 22px; }

/* Galeri */
.bahce, .ilkeler {
  max-width: var(--genislik);
  margin: 0 auto;
  padding: clamp(56px, 8vw, 104px) var(--kenar);
}
.galeri {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: clamp(160px, 20vw, 260px);
  gap: 14px;
}
.galeri figure {
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--zemin-koyu);
}
.galeri img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.galeri figure:hover img { transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .galeri img { transition: none; } .galeri figure:hover img { transform: none; } }
.g-genis { grid-column: span 2; }
.g-uzun { grid-row: span 2; }
.g-tam { grid-column: 1 / -1; }

/* İlkeler */
.ilkeler { border-top: 1px solid var(--cizgi); }
.ilkeler h2 { margin-bottom: 40px; }
.ilke-liste {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 48px);
}
.ilke-liste article { border-top: 3px solid var(--dut); padding-top: 20px; }
.ilke-liste h3 { font: 400 24px/1.2 var(--f-baslik); color: var(--dut); margin: 0 0 10px; }
.ilke-liste p { color: var(--soluk); margin: 0; }

/* Takip */
.takip {
  background: var(--dut);
  color: #F6EDF1;
  padding: clamp(56px, 8vw, 104px) var(--kenar);
}
.takip-ic { max-width: 760px; margin: 0 auto; text-align: center; }
.takip h2 { font: 400 clamp(34px, 5vw, 58px)/1.05 var(--f-baslik); margin: 0 0 16px; color: #fff; }
.takip p { color: #E3CCD7; margin: 0 auto 36px; max-width: 52ch; }
.sosyal {
  list-style: none; margin: 0 0 32px; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
}
.sosyal a {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 20px 10px;
  border: 1px solid rgba(246, 237, 241, .28);
  border-radius: 16px;
  text-decoration: none;
  transition: background .2s, border-color .2s;
}
.sosyal a:hover { background: rgba(255, 255, 255, .08); border-color: var(--ayva); }
.sosyal svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.sosyal svg .dolu { fill: currentColor; stroke: none; }
.sosyal span { font-weight: 600; }
.sosyal small { font: 400 12px/1 var(--f-etiket); color: #D9BCC9; }
.eposta {
  display: inline-block;
  font: 400 clamp(20px, 3vw, 28px)/1.2 var(--f-baslik);
  color: var(--ayva);
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
}

.alt {
  max-width: var(--genislik);
  margin: 0 auto;
  padding: 28px var(--kenar);
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  font: 400 13px/1.4 var(--f-etiket);
  color: var(--soluk);
}

/* Telefon */
@media (max-width: 860px) {
  .menu a:not(.menu-vurgu) { display: none; }
  .kahraman { grid-template-columns: 1fr; }
  .kahraman-gorsel { aspect-ratio: 4 / 3; border-radius: 200px 200px 16px 16px; order: -1; }
  .ilke-liste { grid-template-columns: 1fr; }
  .sosyal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sosyal li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .galeri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-genis { grid-column: span 2; }
  .g-uzun { grid-row: span 1; }
}