/* === BÖLÜM GEÇİŞLERİ ===================================================
   Bordo (#1a0d12) ile krem (#f6f0e3) arasındaki parlaklık farkı çok büyük:
   aradaki ara tonlar HER TÜRLÜ düz gradyanda geniş bir bant olarak görünüyor
   (denendi — kehribar bir sürgü çıktı, çamurun sıcak hali). Çözüm ana
   sayfadaki yöntem: geçişi FOTOĞRAFIN üstünde yapmak. Doku ara tonları
   gizliyor, göz bunu renk rampası değil bahçeye düşen ışık olarak okuyor.

   Bu yüzden sayfalarda bordo↔krem geçişi SADECE BİR KEZ ve bu bantla olur;
   sayfanın üstü bordo başlar, bant krem gövdeye iner.
   ==================================================================== */

.bahce-band {
    position: relative;
    min-height: 260px;
    background: url('images/bahçe19.jpeg') center/cover no-repeat;
    /* Bölüm kesirli piksele denk geldiğinde tarayıcı kıl gibi bir çizgi
       bırakıyor; birkaç piksel örtüşme kapatıyor. */
    margin-top: -6px;
    position: relative;
    z-index: 1;
}

.bahce-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        #1a0d12 0%,
        rgba(26, 13, 18, 0.82) 16%,
        rgba(26, 13, 18, 0.34) 38%,
        rgba(246, 240, 227, 0.18) 58%,
        rgba(246, 240, 227, 0.78) 82%,
        #f6f0e3 100%);
}

/* Krem → koyu yeşil: ara duraklar zeytin yaprağı tonları. Bu geçiş fotoğrafsız
   çalışıyor çünkü iki uç da orta parlaklıkta ve aynı sıcaklıkta.
   Duraklar anasayfa.html'deki .yesil-bolge ile birebir aynı. */
.site-footer {
    background-color: var(--yesil-koyu, #14240f);
    background-image: linear-gradient(180deg,
        rgb(246,240,227) 0.0%,
        rgb(244,239,225) 4.2%,
        rgb(240,235,219) 8.3%,
        rgb(232,229,210) 12.5%,
        rgb(223,222,199) 16.7%,
        rgb(213,213,185) 20.8%,
        rgb(202,204,171) 25.0%,
        rgb(190,194,157) 29.2%,
        rgb(178,185,142) 33.3%,
        rgb(168,176,129) 37.5%,
        rgb(158,168,117) 41.7%,
        rgb(151,162,108) 45.8%,
        rgb(145,158,101) 50.0%,
        rgb(143,156,98) 54.2%,
        rgb(141,154,97) 58.3%,
        rgb(134,147,92) 62.5%,
        rgb(122,136,84) 66.7%,
        rgb(108,122,74) 70.8%,
        rgb(92,106,63) 75.0%,
        rgb(75,89,52) 79.2%,
        rgb(58,73,41) 83.3%,
        rgb(43,59,31) 87.5%,
        rgb(31,47,22) 91.7%,
        rgb(23,39,17) 95.8%,
        rgb(20,36,15) 100.0%);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 300px;
    padding-top: 286px !important;
    margin-top: -6px !important;
    position: relative;
    z-index: 1;
    border-top: none !important;
}

/* Vitrin sayfanın en üstünden başlıyor: sabit header'ın altında kalmasın.
   Üstünde krem bir şerit kalırsa header'ın altında ince açık bir çizgi
   görünüyor; negatif margin onu kapatıyor. */
.vitrin {
    background: var(--bordo);
    color: var(--fildisi);
    border: none !important;
    margin-top: -40px !important;
    padding: 150px 24px 76px !important;
}

@media (max-width: 640px) {
    .bahce-band { min-height: 200px; }
    .site-footer {
        background-size: 100% 210px;
        padding-top: 200px !important;
    }
    .vitrin { padding: 112px 20px 60px !important; }
}
