/* =========================================================================
   TARCA ORGANIK - Gorsel kimlik katmani (store.css USTUNE yazar)
   Sicak, dogal, butik organik market. Editoryel + botanik.
   Fraunces serif manset + Karla govde. Krem kagit zemin, orman yesili,
   terracotta vurgu, yumusak yuvarlak koseler.
   ========================================================================= */

/* --- Tipografik olcek: serif baslik / sans govde --- */
body{font-size:16.5px;line-height:1.62;letter-spacing:.005em}
h1,h2,h3,h4,.urun-ad,.logo-yazi,.bolum-bas h2{font-family:var(--font-display);letter-spacing:-.01em;font-weight:600}
h1{line-height:1.05}
h2{line-height:1.12}

/* --- Buton dili: yumusak pill, sicak, dolu orman yesili / ince outline --- */
.buton{border-radius:999px;font-weight:600;font-family:var(--font);padding:12px 22px;letter-spacing:.01em;transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease}
.buton-birincil{background:var(--renk-birincil);color:#fdfbf4;box-shadow:0 6px 16px -10px rgba(46,83,57,.7)}
.buton-birincil:hover{background:#24432d;transform:translateY(-1px)}
.buton-katmanli{background:transparent;border:1.5px solid var(--renk-ikincil);color:var(--renk-ikincil)}
.buton-katmanli:hover{background:var(--renk-ikincil);color:#fdfbf4;border-color:var(--renk-ikincil)}
.buton-vurgu{background:var(--renk-vurgu);color:#fffdf8}
.buton-vurgu:hover{background:#ab5a35;filter:none}
.buton-buyuk{padding:15px 30px;font-size:16px}
.buton:focus-visible{outline:3px solid color-mix(in srgb,var(--renk-ikincil) 45%,transparent);outline-offset:2px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid color-mix(in srgb,var(--renk-ikincil) 45%,transparent);outline-offset:2px}

/* --- Header: krem, sicak, alt cizgi terracotta vurgulu --- */
.ust-bar{background:color-mix(in srgb,var(--renk-arkaplan) 86%,#fff);border-bottom:1px solid var(--renk-kenar);backdrop-filter:blur(10px)}
.logo-isaret{background:var(--renk-birincil);color:var(--renk-arkaplan);border-radius:14px;font-family:var(--font-display);font-weight:700;width:38px;height:38px;font-size:21px}
.logo-yazi{font-family:var(--font-display);font-weight:700;font-size:21px;letter-spacing:-.02em;color:var(--renk-yazi)}
.arama-form{background:#fffdf8;border:1.5px solid var(--renk-kenar);border-radius:999px}
.arama-form:focus-within{border-color:var(--renk-ikincil)}
.arama-form button{background:var(--renk-birincil);color:var(--renk-arkaplan)}
.aksiyon:hover{background:color-mix(in srgb,var(--renk-vurgu) 14%,transparent);color:var(--renk-birincil)}
.sepet-aksiyon .rozet{background:var(--renk-vurgu);color:#fffdf8}
.kategori-bar{background:var(--renk-birincil);border-bottom:none}
.kategori-bar a{color:color-mix(in srgb,var(--renk-arkaplan) 88%,#fff);font-family:var(--font);font-weight:500}
.kategori-bar a:hover{background:color-mix(in srgb,#fff 14%,transparent);color:#fffdf8}
.kategori-bar .kampanya{color:var(--renk-vurgu);font-weight:600}

/* --- Bolum ritmi: editoryel eyebrow + serif h2 --- */
.bolum{padding:clamp(48px,8vw,96px) 16px}
.bolum-bas{margin-bottom:clamp(24px,4vw,40px)}
.bolum-bas h2{font-size:clamp(1.7rem,3.4vw,2.6rem)}
.eyebrow,.bolum-etiket-ust{display:inline-flex;align-items:center;gap:8px;font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--renk-vurgu);margin-bottom:10px}
.eyebrow::before{content:"";width:22px;height:1.5px;background:var(--renk-vurgu);display:inline-block}

/* --- HERO: editoryel sicak (slider DEGIL) --- */
.tarca-hero{position:relative;overflow:hidden;background:
   radial-gradient(120% 100% at 100% 0%,color-mix(in srgb,var(--renk-vurgu) 12%,transparent),transparent 55%),
   linear-gradient(180deg,color-mix(in srgb,var(--renk-ikincil) 9%,var(--renk-arkaplan)),var(--renk-arkaplan))}
.tarca-hero-ic{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center;padding:clamp(48px,7vw,92px) 0 clamp(40px,6vw,76px)}
.tarca-hero-yazi{max-width:560px}
.tarca-hero h1{font-size:clamp(2.4rem,5.6vw,4.1rem);font-weight:600;color:var(--renk-yazi);margin:.1em 0 .35em}
.tarca-hero h1 em{font-style:italic;color:var(--renk-ikincil)}
.tarca-hero-metin{font-size:clamp(1rem,1.6vw,1.18rem);color:color-mix(in srgb,var(--renk-yazi) 78%,transparent);line-height:1.65;max-width:52ch}
.tarca-hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.tarca-guven{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:34px;padding-top:26px;border-top:1px solid var(--renk-kenar)}
.tarca-guven span{display:inline-flex;align-items:center;gap:9px;font-size:14.5px;font-weight:500;color:var(--renk-ikincil)}
.tarca-guven svg{color:var(--renk-vurgu);flex-shrink:0}

/* Hero sag: organik blob + urun sahnesi (CSS cizimi) */
.tarca-hero-sahne{position:relative;aspect-ratio:1/1;max-width:520px;margin-left:auto;width:100%}
.tarca-blob{position:absolute;inset:0;background:
   radial-gradient(circle at 32% 30%,color-mix(in srgb,var(--renk-ikincil) 22%,transparent),transparent 60%),
   var(--renk-birincil);
   border-radius:46% 54% 58% 42%/52% 44% 56% 48%;
   box-shadow:inset 0 0 0 1.5px color-mix(in srgb,#fff 12%,transparent),0 30px 60px -34px rgba(46,83,57,.65)}
.tarca-blob::after{content:"";position:absolute;inset:18px;border:1.5px dashed color-mix(in srgb,var(--renk-arkaplan) 40%,transparent);border-radius:46% 54% 58% 42%/52% 44% 56% 48%}
.tarca-yaprak{position:absolute;color:color-mix(in srgb,var(--renk-arkaplan) 80%,transparent);opacity:.85}
.tarca-yaprak.y1{top:8%;left:16%;width:74px}
.tarca-yaprak.y2{bottom:12%;right:14%;width:90px;transform:rotate(28deg);color:color-mix(in srgb,var(--renk-vurgu) 70%,transparent)}
.tarca-rozet-kart{position:absolute;background:#fffdf8;border-radius:18px;padding:14px 18px;box-shadow:0 18px 40px -24px rgba(42,38,32,.6);display:flex;gap:12px;align-items:center;border:1px solid var(--renk-kenar)}
.tarca-rozet-kart .ikon{width:40px;height:40px;border-radius:12px;background:color-mix(in srgb,var(--renk-vurgu) 16%,transparent);color:var(--renk-vurgu);display:grid;place-items:center;flex-shrink:0}
.tarca-rozet-kart b{font-family:var(--font-display);font-size:16px;color:var(--renk-yazi);display:block;line-height:1.1}
.tarca-rozet-kart small{font-size:12.5px;color:var(--renk-yazi-acik)}
.tarca-rozet-kart.r1{top:10%;right:-10px}
.tarca-rozet-kart.r2{bottom:8%;left:-18px}

/* --- Bu hafta taze: mevsimsel yatay serit --- */
.taze-serit{background:var(--renk-birincil);color:var(--renk-arkaplan);padding:16px 0}
.taze-serit-ic{display:flex;align-items:center;gap:18px;overflow-x:auto;scrollbar-width:none}
.taze-serit-ic::-webkit-scrollbar{display:none}
.taze-serit b{font-family:var(--font-display);font-size:18px;white-space:nowrap;padding-right:18px;border-right:1px solid color-mix(in srgb,#fff 22%,transparent)}
.taze-cip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:14.5px;font-weight:500;color:color-mix(in srgb,var(--renk-arkaplan) 92%,#fff)}
.taze-cip svg{color:var(--renk-vurgu)}

/* --- Botanik kategori tile'lari --- */
.botanik-izgara{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.botanik-kart{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:172px;padding:20px;border-radius:var(--radius);background:#fffdf8;border:1px solid var(--renk-kenar);overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.botanik-kart:nth-child(3n+1){background:color-mix(in srgb,var(--renk-ikincil) 9%,#fffdf8)}
.botanik-kart:nth-child(3n+2){background:color-mix(in srgb,var(--renk-vurgu) 8%,#fffdf8)}
.botanik-kart:hover{transform:translateY(-4px);border-color:var(--renk-ikincil);box-shadow:0 22px 44px -30px rgba(46,83,57,.5)}
.botanik-ikon{width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--renk-birincil) 12%,transparent);color:var(--renk-birincil);display:grid;place-items:center}
.botanik-kart h3{font-size:1.12rem;margin:14px 0 2px;color:var(--renk-yazi)}
.botanik-kart span{font-size:13px;font-weight:600;color:var(--renk-vurgu);display:inline-flex;align-items:center;gap:5px}
.botanik-yaprak-deko{position:absolute;right:-18px;bottom:-18px;width:96px;height:96px;color:color-mix(in srgb,var(--renk-ikincil) 14%,transparent);pointer-events:none}

/* --- Urun karti imzasi: sicak, serif ad, terracotta fiyat, organik rozet cipleri --- */
.urun-izgara{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.urun-kart{background:#fffdf8;border:1px solid var(--renk-kenar);border-radius:var(--radius);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;display:flex;flex-direction:column}
.urun-kart:hover{transform:translateY(-5px);box-shadow:0 26px 48px -32px rgba(42,38,32,.45);border-color:color-mix(in srgb,var(--renk-ikincil) 50%,var(--renk-kenar))}
.urun-gorsel{aspect-ratio:1/1;background:color-mix(in srgb,var(--renk-ikincil) 7%,#fff);position:relative}
.urun-gorsel img{width:100%;height:100%;object-fit:cover}
.indirim-rozet{background:var(--renk-vurgu);color:#fffdf8;border-radius:999px;font-weight:700;font-size:12px;padding:4px 10px;left:12px;top:12px;position:absolute}
.yeni-rozet{background:var(--renk-birincil);color:var(--renk-arkaplan);border-radius:999px;font-weight:700;font-size:11px;letter-spacing:.06em;padding:4px 10px;position:absolute;top:12px;right:12px}
.favori-mini{position:absolute;bottom:12px;right:12px;background:#fffdf8;border-radius:999px;width:38px;height:38px;display:grid;place-items:center;box-shadow:0 6px 16px -8px rgba(42,38,32,.5);color:var(--renk-ikincil);transition:.15s}
.favori-mini:hover{color:var(--renk-vurgu);transform:scale(1.06)}
.urun-bilgi{padding:16px 16px 8px;display:flex;flex-direction:column;gap:2px;flex:1}
.urun-marka{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--renk-vurgu)}
.urun-ad{font-family:var(--font-display);font-size:1.06rem;font-weight:600;line-height:1.25;color:var(--renk-yazi);margin:2px 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.urun-puan{font-size:13px;color:var(--renk-yazi-acik);display:inline-flex;align-items:center;gap:4px}
.urun-puan svg{color:var(--renk-vurgu)}
.urun-fiyat-blok{margin-top:auto;padding-top:8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.urun-fiyat-blok .eski{color:var(--renk-yazi-acik);text-decoration:line-through;font-size:13.5px}
.urun-fiyat-blok .guncel{font-family:var(--font-display);font-weight:700;font-size:1.32rem;color:var(--renk-vurgu)}
.urun-kart .urun-sepet{margin:8px 16px 16px;border-radius:999px}
.urun-rozet-cipleri{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 4px}
.rozet-cip{font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--renk-birincil) 10%,transparent);color:var(--renk-birincil)}
.rozet-cip.vegan{background:color-mix(in srgb,var(--renk-ikincil) 14%,transparent);color:var(--renk-ikincil)}
.rozet-cip.glutensiz{background:color-mix(in srgb,var(--renk-vurgu) 14%,transparent);color:var(--renk-vurgu)}

/* --- Uretici hikayesi kartlari --- */
.uretici-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.uretici-kart{background:#fffdf8;border:1px solid var(--renk-kenar);border-radius:var(--radius);padding:26px;position:relative;transition:.18s}
.uretici-kart:hover{border-color:var(--renk-ikincil);transform:translateY(-3px)}
.uretici-bas{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.uretici-avatar{width:54px;height:54px;border-radius:50%;background:var(--renk-birincil);color:var(--renk-arkaplan);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:22px;flex-shrink:0}
.uretici-bas b{font-family:var(--font-display);font-size:1.18rem;color:var(--renk-yazi);display:block;line-height:1.1}
.uretici-bas small{font-size:13px;color:var(--renk-vurgu);font-weight:600;display:inline-flex;align-items:center;gap:5px}
.uretici-kart p{color:color-mix(in srgb,var(--renk-yazi) 76%,transparent);line-height:1.6;font-size:15px;margin:0}
.uretici-kart .tirnak{font-family:var(--font-display);font-size:48px;line-height:0;color:color-mix(in srgb,var(--renk-vurgu) 30%,transparent);position:absolute;top:24px;right:24px}

/* --- Mutfaktan (tarif/blog teaser) --- */
.bolum.zemin-surface{background:color-mix(in srgb,var(--renk-ikincil) 7%,var(--renk-arkaplan))}
.blog-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.blog-kart{background:#fffdf8;border:1px solid var(--renk-kenar);border-radius:var(--radius);overflow:hidden;transition:.18s}
.blog-kart:hover{transform:translateY(-4px);border-color:var(--renk-ikincil);box-shadow:0 22px 44px -32px rgba(42,38,32,.4)}
.blog-kart-resim{aspect-ratio:16/10;background:color-mix(in srgb,var(--renk-vurgu) 8%,#fff)}
.blog-kart-resim img{width:100%;height:100%;object-fit:cover}
.blog-kart-bilgi{padding:20px}
.blog-etiket{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--renk-vurgu);margin-bottom:8px}
.blog-kart h3{font-family:var(--font-display);font-size:1.2rem;color:var(--renk-yazi);margin:0 0 6px}
.blog-kart p{color:var(--renk-yazi-acik);font-size:14px;margin:0 0 10px}

/* --- Sertifika rozet seridi --- */
.sertifika-serit{border-top:1px solid var(--renk-kenar);border-bottom:1px solid var(--renk-kenar);padding:30px 0;background:color-mix(in srgb,var(--renk-birincil) 5%,var(--renk-arkaplan))}
.sertifika-liste{display:flex;flex-wrap:wrap;justify-content:center;gap:18px 40px;align-items:center}
.sertifika-oge{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--renk-ikincil)}
.sertifika-oge svg{color:var(--renk-vurgu)}

/* --- Bulten --- */
.bulten{background:var(--renk-birincil);color:var(--renk-arkaplan)}
.bulten-ic{padding:clamp(36px,5vw,56px) 16px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.bulten h3{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2.1rem);color:var(--renk-arkaplan);margin:0 0 6px}
.bulten p{color:color-mix(in srgb,var(--renk-arkaplan) 80%,transparent);margin:0}
.bulten-form{display:flex;gap:10px;flex-wrap:wrap}
.bulten-form input{background:#fffdf8;border:1.5px solid transparent;border-radius:999px;padding:13px 20px;min-width:240px;color:var(--renk-yazi)}
.bulten-form input:focus{border-color:var(--renk-vurgu);outline:none}
.bulten-form .buton-birincil{background:var(--renk-vurgu);color:#fffdf8}
.bulten-form .buton-birincil:hover{background:#ab5a35}

/* --- Footer: koyu orman tonunda sicak --- */
.alt-bar{background:#23402c;color:color-mix(in srgb,var(--renk-arkaplan) 78%,#fff);border-top:none}
.alt-bar .logo-isaret{background:var(--renk-vurgu);color:#fffdf8}
.alt-bar .logo-yazi{color:var(--renk-arkaplan)}
.alt-bar h4{font-family:var(--font-display);color:var(--renk-arkaplan);font-weight:600}
.alt-bar a:hover{color:var(--renk-vurgu)}
.alt-bar .sosyal a{border:1px solid color-mix(in srgb,#fff 18%,transparent);border-radius:12px}
.alt-bar .sosyal a:hover{border-color:var(--renk-vurgu);color:var(--renk-vurgu)}
.alt-serit{background:#1c3324;color:color-mix(in srgb,var(--renk-arkaplan) 65%,#fff)}
.odeme-rozetler span{border-color:color-mix(in srgb,#fff 16%,transparent)}

/* --- Sayfa basliklari (kategori/urun/sayfa) --- */
.sayfa-bas h1,.icerik-sayfa h1,.urun-detay h1{font-family:var(--font-display)}

/* --- RESPONSIVE --- */
@media(max-width:1024px){
  .botanik-izgara{grid-template-columns:repeat(3,1fr)}
  .urun-izgara{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .tarca-hero-ic{grid-template-columns:1fr;gap:36px}
  .tarca-hero-sahne{max-width:380px;margin:0 auto}
  .uretici-izgara{grid-template-columns:1fr 1fr}
  .blog-izgara{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  body{font-size:16px}
  .botanik-izgara{grid-template-columns:1fr 1fr}
  .urun-izgara{grid-template-columns:1fr 1fr}
  .uretici-izgara,.blog-izgara{grid-template-columns:1fr}
  .bulten-ic{grid-template-columns:1fr}
  .bulten-form{flex-direction:column}
  .bulten-form input{min-width:0;width:100%}
  .tarca-rozet-kart.r1{right:0}
  .tarca-rozet-kart.r2{left:0}
}
@media(max-width:460px){
  .urun-izgara{grid-template-columns:1fr 1fr;gap:12px}
  .tarca-hero-cta .buton{flex:1;justify-content:center}
  .urun-ad{font-size:.98rem}
}
