/* ═══════════════════════════════════════════════════════════════════
   LİL'MEDS — GECE ECZANESİ
   Tek tasarım dosyası. Ana sayfa bunu tek başına yükler; diğer
   sayfalar kendi gövde stillerinden sonra yükleyip yalnızca kabuğu
   (başlık çubuğu, menü, arama, favoriler, altbilgi) devralır.

   Fikir: sayfa bir gece. Hero ve koku kapıları vitrin camının
   arkasındaki karanlıkta, ışık tek bir lambadan geliyor. Aşağı
   inildikçe ışık açılıyor, bilgi kâğıda geçiyor. Altbilgide yeniden
   gece oluyor. Karanlık hissi taşır, aydınlık bilgiyi.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  /* Gece — şişe camının karanlıktaki rengi, nötr siyah değil */
  --gece:#0A1711;      /* saf siyaha yakın değil: şişe camı */
  --cam:#112A20;
  --cam-ust:#1A3728;
  /* Lamba */
  --amber:#C98A3C;          /* lamba — koyu zeminde */
  --amber-ic:#F0C786;
  /* Aydınlık zeminde amber küçük yazı için fazla açık kalıyor:
     #C98A3C / #F7F5EF ölçülen kontrast 2,68:1 (gereken 4,5).
     Kâğıt üstündeki etiketler ve ürün kodları bu koyu pirinci
     kullanıyor — aynı renk ailesi, okunur karşılığı. */
  --pirinc:#7E5518;
  --amber-sis:rgba(201,138,60,.14);
  /* Gündüz */
  --kagit:#F7F5EF;
  --kagit-2:#ECE8DD;
  --murekkep:#11211B;
  --murekkep-2:#53625A;
  --cizgi:rgba(17,33,27,.14);
  --cizgi-gece:rgba(240,199,134,.16);

  /* Yazı tipleri.
     Başlıklarda Bodoni Moda: didone, yani eski eczane ve parfüm
     şişesi etiketlerinin yazı karakteri. Gövdede Archivo: grotesk,
     etiket ve kutu yazısı gibi duran bir işçi.
     Beğenilmezse yalnızca aşağıdaki iki satırı ve <head>'deki font
     bağlantısını değiştirmek yeterli. Denenebilecek eşleşmeler:
       Playfair Display + Inter   (daha klasik, daha yumuşak)
       Instrument Serif + Archivo (daha editoryal, daha keskin) */
  --f-baslik:'Bodoni Moda',Georgia,'Times New Roman',serif;
  --f-govde:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --yay:cubic-bezier(.22,.61,.36,1);
  --yay-yumusak:cubic-bezier(.33,1,.68,1);
  --en:1280px;
  --bar:68px;
  --bosluk:clamp(22px,5vw,48px);
}

/* ═══ TİPOGRAFİ ═══════════════════════════════════════════════════ */
body{
  font-family:var(--f-govde)!important;
  color:var(--murekkep);
  background:var(--kagit);
  -webkit-font-smoothing:antialiased;
}
.bolum-baslik,.hero-baslik,.imza-ad,.kapi-ad,.etiket-ad,
.menu-bag,.guven-baslik{
  font-family:var(--f-baslik)!important;
  font-weight:500;
  letter-spacing:-.01em;
}

/* Bodoni'nin tüy gibi ince çizgileri koyu zeminde daha da incelir
   (ışık taşması). Bu yüzden gece bölümlerinde bir kademe kalın. */
.sahne .bolum-baslik,.sahne .hero-baslik,.sahne .kapi-ad{font-weight:600}

.minik{
  font-family:var(--f-govde);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--pirinc);
  margin:0 0 14px;
}
.sahne .minik{color:var(--amber)}

/* ═══ ZEMİN RİTMİ ════════════════════════════════════════════════ */
.sahne{background:var(--gece);color:#EFEAE0;position:relative;overflow:hidden}
.isik{background:var(--kagit);color:var(--murekkep);position:relative}
.sahne a{color:#EFEAE0}
main>section{padding:clamp(54px,7vw,92px) 0}
/* İki aydınlık bölüm yan yana gelince alt ve üst dolgu toplanıp
   184 px boş beyaz alan oluşturuyordu. Bitişik olanlarda tek
   boşluk kalıyor. */
main>section.isik + section.isik{padding-top:0}
main>section.sahne-tam{padding:0}
.genis{max-width:var(--en);margin:0 auto;padding:0 var(--bosluk)}

/* ═══ BAŞLIK ÇUBUĞU ══════════════════════════════════════════════
   Brifing: solda menü, ortada logo, sağda ara / favoriler / sepet.
   Hero üstünde şeffaf, kaydırınca katı. */
header.site-head{
  position:fixed!important;top:0;left:0;right:0;z-index:900;
  /* Sayfadan sayfaya geçerken üst çubuk yerinde kalır. */
  view-transition-name:lm-ustbar;
  background:transparent!important;
  border:0!important;box-shadow:none!important;
  transition:background .4s var(--yay),border-color .4s var(--yay);
  border-bottom:1px solid transparent!important;
}
header.site-head nav{
  display:flex!important;align-items:center!important;
  height:var(--bar)!important;min-height:var(--bar)!important;
  max-width:var(--en)!important;margin:0 auto!important;
  padding:0 var(--bosluk)!important;gap:0!important;
  background:transparent!important;border:0!important;
}
/* Hero üstündeyken açık renk, kaydırınca koyu */
.site-head .nav-logo,.site-head .icon-tool,.site-head .hamburger span,
.site-head #hamburger:after,.site-head .hamburger:after{color:#EFEAE0!important}
.site-head #hamburger span,.site-head .hamburger span{background:#EFEAE0!important}

.site-head.is-compact{
  background:rgba(247,245,239,.97)!important;
  border-bottom-color:var(--cizgi)!important;
}
.site-head.is-compact .nav-logo,
.site-head.is-compact .icon-tool,
.site-head.is-compact #hamburger:after,.site-head.is-compact .hamburger:after{color:var(--murekkep)!important}
.site-head.is-compact #hamburger span,.site-head.is-compact .hamburger span{background:var(--murekkep)!important}

/* Sol: menü düğmesi. Etiket CSS'ten geliyor, 309 sayfanın
   markup'ına dokunmaya gerek kalmıyor.
   Izgara kullanılıyor: esnek kutuyu satır yönüne çevirince çizgiler
   de yan yana diziliyordu. Burada çizgiler 1. sütunda alt alta,
   etiket 2. sütunda iki satırı birden kaplıyor.
   Seçicilerde #hamburger var: eski dosyadaki kimlik seçicisi
   sınıf seçicisini yeniyordu. */
.site-head #hamburger,.site-head .hamburger{
  order:1;
  display:grid!important;
  grid-template-columns:17px auto;
  grid-template-rows:auto auto;
  column-gap:10px;row-gap:4px;
  align-items:center;justify-items:start;
  width:auto!important;height:auto!important;
  background:none!important;border:0!important;border-radius:0!important;
  padding:6px 2px!important;margin:0!important;
  cursor:pointer;flex:0 0 auto;
  box-shadow:none!important;outline:0;
}
.site-head #hamburger span,.site-head .hamburger span{
  display:block!important;
  grid-column:1;
  width:17px!important;height:1.3px!important;
  margin:0!important;border-radius:0!important;
  transition:transform .32s var(--yay),opacity .2s var(--yay)!important;
}
.site-head #hamburger span:nth-child(1),.site-head .hamburger span:nth-child(1){grid-row:1}
.site-head #hamburger span:nth-child(2),.site-head .hamburger span:nth-child(2){grid-row:2}
.site-head #hamburger span:nth-child(3),.site-head .hamburger span:nth-child(3){display:none!important}
.site-head #hamburger:after,.site-head .hamburger:after{
  content:'Menü';
  grid-column:2;grid-row:1/3;
  font-family:var(--f-govde);font-size:13.5px;font-weight:500;
  letter-spacing:.02em;line-height:1;
}
/* Açıkken iki çizgi çaprazlanıp çarpı oluyor */
.site-head #hamburger[aria-expanded="true"] span:nth-child(1),
.site-head .hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(3.2px) rotate(45deg)}
.site-head #hamburger[aria-expanded="true"] span:nth-child(2),
.site-head .hamburger[aria-expanded="true"] span:nth-child(2){transform:translateY(-3.2px) rotate(-45deg)}

/* Orta: logo */
.site-head .nav-logo{
  order:2;flex:1 1 auto;
  display:flex!important;align-items:center;justify-content:center;
  gap:0!important;
  font-family:var(--f-baslik)!important;
  font-size:clamp(17px,2vw,21px)!important;font-weight:500!important;
  letter-spacing:.17em!important;text-decoration:none!important;
  text-transform:uppercase;
}
.site-head .nav-logo em{font-style:normal}
.site-head .nav-seal{display:none!important}

/* Sağ: araçlar. Masaüstü bağlantı şeridi tamamen kalkıyor —
   bağlantılar DOM'da duruyor (arama motorları için) ama görsel olarak
   tam ekran menüye taşındı. */
.site-head .desktop-nav{display:none!important}
.site-head .nav-cta{display:none!important}
.site-head .nav-tools{
  order:3;flex:0 0 auto;
  display:flex!important;align-items:center!important;gap:4px!important;
}
.site-head .icon-tool{
  width:38px!important;height:38px!important;
  display:grid!important;place-items:center!important;
  background:none!important;border:0!important;border-radius:0!important;
  cursor:pointer;position:relative;
  transition:opacity .2s var(--yay);
}
.site-head .icon-tool:hover{opacity:.62;background:none!important}
.site-head .icon-tool svg{
  width:18px;height:18px;
  /* Ana sayfanın simge SVG'lerinde fill/stroke niteliği yok; eski
     stil dosyasına güveniyorlardı. O dosya artık yüklenmediği için
     arama simgesi dolu bir nokta olarak çiziliyordu. */
  fill:none!important;stroke:currentColor!important;
  stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;
}
.site-head .icon-tool svg [fill="currentColor"]{fill:currentColor!important}
.sayac{
  position:absolute;top:4px;right:2px;
  min-width:15px;height:15px;padding:0 3px;
  border-radius:999px;background:var(--amber);color:#1A1208;
  font-size:9.5px;font-weight:700;line-height:15px;text-align:center;
}
.sayac:empty,.sayac[data-bos]{display:none}

/* Üst çubuğun kapladığı yeri yalnızca hero'su olmayan sayfalar telafi
   eder; ana sayfada hero zaten tam ekran ve çubuk onun üstünde durur. */
body:not(.ev) main{padding-top:var(--bar)}

/* ═══ HERO ═══════════════════════════════════════════════════════
   Brifing: şişe fotoğrafı yok. Atmosfer ışık, cam, doku ve
   tipografiyle kuruluyor. */
#hero{
  min-height:100svh;min-height:100vh;
  display:grid;place-items:center;
  text-align:center;
  background:var(--gece);
}
.atmosfer{position:absolute;inset:0;pointer-events:none}
.atmosfer span{position:absolute;display:block}

/* Lamba: tezgâhın üstünde tek sıcak kaynak. Işık metnin ALTINDAN
   yükseliyor — tepeden aydınlatma stüdyo gibi durur, alttan gelen
   ışık vitrin gibi. İki katman: dar sıcak çekirdek ve geniş soluk hale. */
.at-isik{
  inset:0;
  background:
    radial-gradient(40% 30% at 50% 79%,
      rgba(240,199,134,.30) 0%,
      rgba(201,138,60,.11) 44%,
      transparent 72%),
    radial-gradient(74% 52% at 50% 66%,
      rgba(201,138,60,.085) 0%,
      transparent 68%);
}
/* Cam: ışığın şişe kenarında kırıldığı iki ince dikey parıltı */
.at-cam{
  inset:0;
  background:
    linear-gradient(90deg,transparent 31.4%,rgba(240,199,134,.055) 32.4%,transparent 33.4%),
    linear-gradient(90deg,transparent 66.6%,rgba(240,199,134,.04) 67.4%,transparent 68.4%);
}
/* Tezgâh: en alttaki ince ışık çizgisi, yüzeyin kenarı */
.at-taban{
  left:0;right:0;bottom:0;height:30%;
  background:linear-gradient(0deg,
    rgba(240,199,134,.12) 0%,
    rgba(240,199,134,.03) 34%,
    transparent 80%);
}
/* Doku: ışığın içindeki gren.
   DİKKAT — burada mix-blend-mode KULLANILMIYOR. Denendi: overlay
   karışımı koyu zeminde gürültüyü aydınlatıyor ve hero'nun ortası
   ölçülen (215,216,215) gri bir sise dönüşüyordu. Düz, çok düşük
   geçirgenlikli bir katman doğru dokuyu veriyor. */
.at-gren{
  inset:0;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* Kenar karartması: dikkat ortada kalsın */
#hero:after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(72% 62% at 50% 58%,transparent 30%,rgba(7,16,12,.80) 100%);
}

.hero-ic{position:relative;z-index:2;padding:0 var(--bosluk);max-width:860px}
.hero-etiket{
  font-size:10.5px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--amber-ic);margin:0 0 clamp(22px,4vw,34px);
  font-weight:500;
}
.hero-baslik{
  font-family:var(--f-baslik)!important;
  /* Slogan iki dizeye çıktı ("İlacınız koku, eczacınız Lil'Meds").
     Tek dizelik eski başlığın puntosu üç satıra bölünüp ilk ekranı
     yutuyordu; punto buna göre düşürüldü. */
  font-size:clamp(2.6rem,7.4vw,5.4rem)!important;
  line-height:1.02;letter-spacing:-.025em;
  font-weight:600;color:#F6F1E7;margin:0;
}
/* İkinci dize: kendi satırında, italik ve amber — marka adı
   vurgulanıyor, satır sonu rastgele sarmaya bırakılmıyor. */
.hero-baslik em{
  display:block;font-style:italic;font-size:.86em;
  color:var(--amber-ic);letter-spacing:-.012em;
}
.hero-alt{
  font-size:clamp(1.02rem,1.6vw,1.22rem);
  color:rgba(242,238,230,.82);
  margin:clamp(20px,3vw,28px) auto 0;max-width:30ch;
  line-height:1.6;
}
.hero-eylem{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
  margin-top:clamp(34px,5vw,48px);
}

/* Aşağı in göstergesi — sayfadaki tek kendiliğinden hareket */
.hero-in{
  position:absolute;left:50%;bottom:30px;transform:translateX(-50%);
  z-index:2;width:30px;height:52px;display:grid;place-items:end center;
}
.hero-in-cizgi{
  display:block;width:1px;height:40px;
  background:linear-gradient(180deg,transparent,rgba(240,199,134,.55));
  transform-origin:top;transform:scaleY(.55);opacity:.5;
}
/* Sayfadaki tek kendiliğinden hareket. Kullanıcı bir kez kaydırdıktan
   sonra ipucuna gerek kalmıyor; animasyon orada duruyor ki arka planda
   boşuna kare üretmesin. */
html:not(.kaydirildi) .hero-in-cizgi{
  animation:in-nefes 2.6s var(--yay-yumusak) infinite;
}
@keyframes in-nefes{
  0%,100%{transform:scaleY(.35);opacity:.35}
  50%    {transform:scaleY(1);  opacity:.9}
}

/* ═══ DÜĞMELER ═══════════════════════════════════════════════════ */
.dugme{
  display:inline-flex;align-items:center;justify-content:center;
  height:50px;padding:0 30px;
  font-family:var(--f-govde);font-size:14px;font-weight:500;
  letter-spacing:.01em;text-decoration:none;border-radius:0;
  border:1px solid transparent;cursor:pointer;
  transition:background .26s var(--yay),color .26s var(--yay),
             border-color .26s var(--yay);
}
/* Not: seçiciler .sahne ile birlikte yazıldı. Yalnızca .dugme-dolu
   yazılınca gece bölümlerindeki genel ".sahne a{color:…}" kuralı daha
   özgül kalıyor ve dolu düğmenin yazısı krem zemine krem düşüyordu. */
.dugme-dolu,.sahne .dugme-dolu,.isik .dugme-dolu{
  background:var(--amber-ic);color:#1A1208;border-color:var(--amber-ic);
}
.dugme-dolu:hover,.sahne .dugme-dolu:hover{background:#fff;border-color:#fff;color:#1A1208}
.dugme-cizgi,.sahne .dugme-cizgi{
  background:transparent;border-color:rgba(240,199,134,.42);color:#EFEAE0;
}
.dugme-cizgi:hover,.sahne .dugme-cizgi:hover{border-color:var(--amber-ic);background:rgba(240,199,134,.07)}
.isik .dugme-cizgi{border-color:var(--cizgi);color:var(--murekkep)}
.isik .dugme-cizgi:hover{border-color:var(--murekkep);background:transparent}
.isik .dugme-dolu{background:var(--murekkep);color:var(--kagit);border-color:var(--murekkep)}
.isik .dugme-dolu:hover{background:#000;border-color:#000}

.metin-dugme{
  background:none;border:0;padding:0;cursor:pointer;
  font:inherit;color:inherit;
  border-bottom:1px solid currentColor;
}
.minik-bag{
  font-size:13px;color:var(--murekkep-2);text-decoration:none;
  border-bottom:1px solid var(--cizgi);padding-bottom:2px;
  transition:color .2s var(--yay),border-color .2s var(--yay);
}
.minik-bag:hover{color:var(--murekkep);border-color:var(--murekkep)}

/* ═══ 2 · KOKU DÜNYANI SEÇ ═══════════════════════════════════════
   Bu bölüm önce koyu zemindeydi. Hero'yla birlikte art arda 1.618 px
   neredeyse siyah alan oluşuyordu; brifing koyu zemini yalnızca hero
   için istiyor. Aydınlığa alındı, kapıların boyu da üçte bire indi:
   içlerinde yalnızca üç satır var, 340 px yükseklik boşluktu. */
#dunya{padding-top:clamp(52px,6vw,78px)!important}
#dunya .bolum-baslik{
  font-size:clamp(1.7rem,3.4vw,2.5rem);
  margin:0 0 clamp(24px,3vw,34px);
  color:var(--murekkep);letter-spacing:-.018em;
}
.kapilar{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);
}
.kapi{
  display:grid;grid-template-columns:1fr auto;align-items:center;
  gap:4px 18px;
  min-height:0;padding:22px 24px 22px 0;
  text-decoration:none;position:relative;
  transition:background .3s var(--yay),padding-left .3s var(--yay);
}
.kapi+.kapi{border-left:1px solid var(--cizgi);padding-left:24px}
.kapi:hover{background:var(--kagit-2)}
.kapi:before{display:none}
.kapi-sayi{
  grid-column:2;grid-row:1/3;align-self:center;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--pirinc);white-space:nowrap;
}
.kapi-ad{
  grid-column:1;grid-row:1;
  font-family:var(--f-baslik)!important;
  font-size:clamp(1.4rem,2.4vw,1.85rem);line-height:1.1;
  color:var(--murekkep);margin:0;
}
.kapi-not{grid-column:1;grid-row:2;font-size:12.5px;color:var(--murekkep-2)}

/* ═══ 3 · EDİTORYAL KEŞİF ════════════════════════════════════════ */
.imza-sahne{
  display:grid;grid-template-columns:1fr .68fr;
  gap:clamp(28px,5vw,64px);align-items:center;
  padding-bottom:clamp(40px,5vw,64px);
  border-bottom:1px solid var(--cizgi);
  margin-bottom:clamp(36px,4.5vw,56px);
}
.imza-ad{font-size:clamp(2.4rem,6vw,4.2rem);line-height:.95;margin:0 0 18px}
.imza-metin{font-size:1.0625rem;line-height:1.75;color:var(--murekkep-2);max-width:46ch;margin:0 0 22px}
.imza-veri{display:flex;flex-wrap:wrap;gap:0;margin:0 0 30px;font-size:12.5px}
.imza-veri span{padding-right:18px;margin-right:18px;border-right:1px solid var(--cizgi);color:var(--murekkep-2)}
.imza-veri span:last-child{border:0;margin:0;padding:0;color:var(--murekkep);font-weight:600}

/* ─────────────────────────────────────────────────────────────
   İmza kokusunun sahnesi — çizilmiş 50 ml flakon
   Önceki hâli üç boş <span>'dan ibaretti: kapak yok, etiket yok,
   dip yok. Yükleniyor iskeleti gibi duruyordu.
   Yerine ürünün kendisi çizildi — berrak cam gövde, amber esans,
   mat siyah kapak, kraft etiket ve LM mührü. Fotoğraf değil, SVG:
   ek istek yok, her ekranda net, 6 KB.
   ───────────────────────────────────────────────────────────── */
.imza-cam{
  aspect-ratio:1/1;position:relative;overflow:hidden;
  background:linear-gradient(170deg,#0C1B15,#07100C 70%);
}
.imza-cam svg{position:absolute;inset:0;width:100%;height:100%;display:block}

.raf-bas{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:26px}
.raf-bas .bolum-baslik{font-size:clamp(1.5rem,3vw,2.1rem);margin:0}

/* Etiket rafı: 283 ürünün tamamı aynı stok fotoğrafı paylaşıyor,
   sekiz kartta aynı şişeyi tekrarlamak premium görünmüyor. Kartlar
   bu yüzden fotoğrafsız — eczane etiketi gibi kuruldu. */
.raf{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(232px,1fr);
  gap:1px;background:var(--cizgi);border:1px solid var(--cizgi);
  overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:thin;
}
.etiket{
  background:var(--kagit);scroll-snap-align:start;
  display:flex;flex-direction:column;
  padding:20px 20px 18px;text-decoration:none;color:inherit;min-width:0;
  transition:background .3s var(--yay);
}
.etiket:hover{background:#fff}
.etiket-ust{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:26px}
.etiket-ust b{font-size:11px;letter-spacing:.1em;color:var(--pirinc);font-weight:600}
.etiket-ust i{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--murekkep-2);font-style:normal}
.etiket-marka{font-size:12px;letter-spacing:.04em;color:var(--murekkep-2);margin-bottom:3px}
.etiket-ad{font-size:1.45rem;line-height:1.1;margin-bottom:12px}
.etiket-nota{font-size:12.5px;line-height:1.55;color:var(--murekkep-2);margin-bottom:auto;padding-bottom:20px}
.etiket-alt{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--cizgi);padding-top:12px}
.etiket-alt i{font-size:11.5px;color:var(--murekkep-2);font-style:normal}
.etiket-alt b{font-size:15px;font-weight:600}
.raf-dip{margin:22px 0 0;font-size:13.5px;color:var(--murekkep-2)}

/* ═══ 4 · KOKU ASİSTANI ══════════════════════════════════════════
   Mevcut markup ve 43 KB'lik betik olduğu gibi duruyor; yalnızca
   kabuk aydınlığa çevrildi. */
#koku-asistani{background:var(--kagit)!important;color:var(--murekkep)!important}
#koku-asistani .section-title,#koku-asistani h2{color:var(--murekkep)!important;font-family:var(--f-baslik)!important}
#koku-asistani .section-eyebrow{color:var(--pirinc)!important}
#koku-asistani p{color:var(--murekkep-2)!important}
.qz-panel{
  background:#fff!important;border:1px solid var(--cizgi)!important;
  border-radius:0!important;box-shadow:none!important;
}
.qz-intro{color:var(--murekkep-2)!important}
.qz-q{font-family:var(--f-baslik)!important;color:var(--murekkep)!important}
.qz-opt{border-radius:0!important;border-color:var(--cizgi)!important}
.qz-sn{background:var(--murekkep)!important;color:var(--kagit)!important}

/* ═══ 5 · SOSYAL KANIT VE GÜVEN ══════════════════════════════════ */
#guven>.genis>section{padding:0 0 clamp(30px,4vw,46px)!important;background:none!important}
#guven .section-title,#guven h2{font-family:var(--f-baslik)!important;color:var(--murekkep)!important}

/* Katlanır katmanlar: ana sayfadan kaldırılan içerik silinmedi,
   isteyenin açacağı katmanlara alındı. Böylece hem ilk ekranda
   bilgi yığılmıyor hem de arama motorları metni görmeye devam ediyor. */
.katlar{border-top:1px solid var(--cizgi);margin-top:clamp(20px,3vw,32px)}
.kat{border-bottom:1px solid var(--cizgi)}
.kat>summary{
  list-style:none;cursor:pointer;
  padding:16px 34px 16px 0;position:relative;
  font-size:clamp(1rem,1.6vw,1.1rem);font-weight:500;
}
.kat>summary::-webkit-details-marker{display:none}
.kat>summary:after{
  content:'';position:absolute;right:6px;top:50%;
  width:11px;height:11px;margin-top:-6px;
  border-right:1px solid var(--murekkep-2);border-bottom:1px solid var(--murekkep-2);
  transform:rotate(45deg);transition:transform .3s var(--yay);
}
.kat[open]>summary:after{transform:rotate(-135deg)}
.kat-ic{padding-bottom:12px}
.kat-ic>section{padding:0 0 24px!important;background:none!important}
.kat-ic .section-eyebrow,.kat-ic .gold-rule{display:none}
.kat-ic .section-title,.kat-ic h2{font-size:1.15rem!important;margin-bottom:12px!important}

/* ═══ 6 · ALTBİLGİ ═══════════════════════════════════════════════ */
footer{
  background:var(--gece)!important;color:rgba(242,238,230,.80)!important;
  padding:clamp(56px,7vw,80px) var(--bosluk) 32px!important;
  border:0!important;
}
footer>*{max-width:var(--en);margin-left:auto;margin-right:auto}
footer .foot-brand{
  font-family:var(--f-baslik)!important;
  font-size:22px!important;letter-spacing:.17em;text-transform:uppercase;
  color:#F2EDE3!important;
}
footer .foot-desc{font-size:13px;line-height:1.7;color:rgba(242,238,230,.62)!important;max-width:42ch}
footer h3{
  font-family:var(--f-govde)!important;
  font-size:10.5px!important;letter-spacing:.2em;text-transform:uppercase;
  color:var(--amber)!important;margin-bottom:14px!important;font-weight:600!important;
}
footer a{color:rgba(242,238,230,.82)!important;text-decoration:none;font-size:13.5px}
footer a:hover{color:#F6F1E7!important}
footer li{margin-bottom:9px;list-style:none}
footer ul{padding:0;margin:0}

/* ═══ TAM EKRAN MENÜ ═════════════════════════════════════════════
   Bağlantılar zaten DOM'daydı (mobil menü). Artık her ekran boyunda
   tam ekran katman olarak açılıyor. */
.mob-menu{
  position:fixed!important;inset:0!important;z-index:1000!important;
  width:100%!important;max-width:none!important;height:100%!important;
  background:var(--gece)!important;color:#EFEAE0!important;
  display:block!important;
  padding:0!important;margin:0!important;border:0!important;
  overflow-y:auto!important;overscroll-behavior:contain;
  opacity:0;visibility:hidden;
  transform:none!important;
  transition:opacity .36s var(--yay),visibility .36s!important;
  /* İçerik ortalanmış bir sütunda ama SOLA yaslı akar. Ortalamayı
     kapsayıcının dolgusu yapıyor; öğelere margin:0 auto verilince
     ızgara/esnek düzende daralıp ortalanıyorlardı. */
  padding-left:max(var(--bosluk),calc((100% - var(--en))/2))!important;
  padding-right:max(var(--bosluk),calc((100% - var(--en))/2))!important;
  text-align:left!important;
}
.mob-menu.open{opacity:1!important;visibility:visible!important}
.mob-menu>*{max-width:none;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
.mob-menu .menu-head{
  display:flex!important;align-items:center;justify-content:space-between;
  height:var(--bar);border-bottom:1px solid var(--cizgi-gece);
  margin-bottom:clamp(20px,3vw,32px)!important;
  max-width:none!important;
}
.mob-menu .menu-head span{
  font-family:var(--f-baslik)!important;font-size:12px!important;
  letter-spacing:.2em;text-transform:uppercase;color:var(--amber)!important;
}
.mob-menu #menu-close{
  background:none!important;border:0!important;
  font-size:26px;line-height:1;color:#EFEAE0!important;cursor:pointer;
  width:40px;height:40px;
}
.mob-menu .menu-group-label{
  grid-column:1/-1;
  font-size:10.5px!important;letter-spacing:.2em;text-transform:uppercase;
  color:var(--amber)!important;font-weight:600!important;
  margin:clamp(22px,3vw,34px) 0 2px!important;
  padding-bottom:10px;border-bottom:1px solid var(--cizgi-gece);
}
.mob-menu .menu-group-label:first-of-type{margin-top:0!important}

/* Bağlantı iki satır: üstte ad (başlık yazı tipi), altta açıklama.
   Metinler <b> ve <small> içinde olduğu için boyut doğrudan onlara
   verilmeli; yalnızca <a> hedeflenince eski satır içi kurallar
   kazanıyor ve iki metin yan yana yapışıyordu. */
.mob-menu a{
  display:block!important;
  padding:13px 0!important;border:0!important;
  border-bottom:1px solid rgba(240,199,134,.08)!important;
  text-decoration:none!important;color:#EFEAE0!important;
  text-transform:none!important;letter-spacing:0!important;
  transition:color .22s var(--yay),padding-left .3s var(--yay);
}
.mob-menu a:hover{color:var(--amber-ic)!important;padding-left:8px!important}
.mob-menu a>span{display:block}
.mob-menu a b{
  display:block;
  font-family:var(--f-baslik)!important;
  font-size:clamp(1.25rem,2.4vw,1.72rem)!important;
  font-weight:500!important;line-height:1.18;letter-spacing:-.008em;
  color:inherit!important;margin-bottom:2px;
}
.mob-menu a small{
  display:block;
  font-family:var(--f-govde)!important;
  font-size:12.5px!important;font-weight:400!important;
  color:rgba(239,234,224,.42)!important;line-height:1.5;
}
/* Menü satırlarındaki ikonlar. Eskiden ✦ ⌁ ♀ ♂ gibi karakterlerdi;
   yazı tipinde bulunmadıkları için işletim sisteminin yedek fontuna
   düşüyor, ⚡ mobilde sarı bir emoji olarak çiziliyordu. Artık çizim. */
.mob-menu a{display:grid!important;grid-template-columns:22px 1fr;gap:0 16px;align-items:start}
.mob-menu .menu-icon{
  display:grid!important;place-items:center;
  width:22px;height:22px;margin-top:5px;
  color:var(--amber);opacity:.85;
}
.mob-menu .menu-icon svg{width:18px;height:18px}
.mob-menu a:hover .menu-icon{opacity:1}
.mob-menu .menu-intro{
  grid-column:1/-1;
  font-size:14px;color:rgba(239,234,224,.5);
  margin:0 0 clamp(18px,3vw,30px);max-width:46ch;
}
.mob-menu .menu-wa{
  grid-column:1/-1;
  margin-top:clamp(26px,4vw,40px);
  border:1px solid rgba(240,199,134,.32)!important;
  padding:16px 22px!important;
  font-family:var(--f-govde)!important;font-size:13.5px!important;
  color:var(--amber-ic)!important;
}
.mob-menu .menu-wa:hover{
  background:rgba(240,199,134,.07)!important;padding-left:22px!important;
}

/* Not: burada body:has(.mob-menu.open) KULLANILMIYOR. Gövdeyi bir
   torununun sınıfına göre izleyen :has() kuralı, o ağaçtaki her
   değişiklikte stil geçersizleştirmesi tetikliyor. Kaydırma kilidini
   menüyü açan betik doğrudan uyguluyor. */

/* ═══ ARAMA KATMANI ══════════════════════════════════════════════ */
.ara-katman{
  position:fixed;inset:0;z-index:1100;
  background:rgba(7,16,12,.985);
  color:#EFEAE0;
  opacity:0;visibility:hidden;
  transition:opacity .3s var(--yay),visibility .3s;
  overflow-y:auto;overscroll-behavior:contain;
}
.ara-katman.acik{opacity:1;visibility:visible}
.ara-ic{max-width:860px;margin:0 auto;padding:var(--bosluk)}
.ara-ust{display:flex;align-items:center;gap:16px;height:var(--bar)}
.ara-ust input{
  flex:1;background:none;border:0;outline:none;
  font-family:var(--f-baslik);font-size:clamp(1.5rem,4vw,2.4rem);
  color:#F6F1E7;padding:0;
}
.ara-ust input::placeholder{color:rgba(239,234,224,.3)}
/* Arama kutusu katmanın tamamını kaplıyor; etrafına ayrıca odak
   çerçevesi çizmek gürültü yapıyor. Odak, altındaki çizginin
   amber'e dönmesiyle belli oluyor. */
.ara-ust input:focus,.ara-ust input:focus-visible{outline:none!important;box-shadow:none!important}
.ara-ust input::-webkit-search-cancel-button{filter:invert(1);opacity:.4}
.ara-katman.odakli .ara-cizgi{background:var(--amber)}
.ara-kapat{
  background:none;border:0;color:#EFEAE0;font-size:26px;
  cursor:pointer;width:40px;height:40px;flex:none;
}
.ara-cizgi{height:1px;background:var(--cizgi-gece);margin-bottom:18px}
.ara-durum{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:18px}
.ara-sonuc{display:grid;gap:1px;background:var(--cizgi-gece)}
.ara-sonuc a{
  background:var(--gece);display:flex;align-items:baseline;gap:14px;
  padding:14px 4px;text-decoration:none;color:#EFEAE0;
  transition:background .2s var(--yay);
}
.ara-sonuc a:hover{background:var(--cam)}
.ara-sonuc b{font-family:var(--f-baslik);font-size:1.15rem;font-weight:500}
.ara-sonuc i{font-style:normal;font-size:12px;color:rgba(239,234,224,.45)}
.ara-sonuc u{text-decoration:none;margin-left:auto;font-size:13px;color:var(--amber-ic);white-space:nowrap}
.ara-bos{color:rgba(239,234,224,.5);font-size:14px;line-height:1.7}

/* ═══ FAVORİLER ══════════════════════════════════════════════════ */
.fav-katman{
  position:fixed;top:0;right:0;bottom:0;z-index:1100;
  width:min(420px,100%);
  background:var(--kagit);color:var(--murekkep);
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .38s var(--yay);
  box-shadow:-18px 0 60px -30px rgba(0,0,0,.5);
}
.fav-katman.acik{transform:none}
.fav-ust{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--bar);padding:0 20px;border-bottom:1px solid var(--cizgi);
}
.fav-ust h2{font-family:var(--f-baslik);font-size:1.15rem;margin:0;font-weight:500}
.fav-ust button{background:none;border:0;font-size:24px;cursor:pointer;color:inherit;width:40px;height:40px}
.fav-liste{flex:1;overflow-y:auto;padding:4px 20px 20px}
.fav-satir{display:flex;align-items:baseline;gap:12px;padding:16px 0;border-bottom:1px solid var(--cizgi)}
.fav-satir b{font-family:var(--f-baslik);font-size:1.1rem;font-weight:500}
.fav-satir small{display:block;font-size:12px;color:var(--murekkep-2)}
.fav-satir a{text-decoration:none;color:inherit;flex:1;min-width:0}
.fav-sil{background:none;border:0;cursor:pointer;color:var(--murekkep-2);font-size:18px;line-height:1;padding:4px}
.fav-sil:hover{color:var(--murekkep)}
.fav-bos{padding:40px 0;color:var(--murekkep-2);font-size:14px;line-height:1.7}
.fav-perde{
  position:fixed;inset:0;z-index:1099;background:rgba(7,16,12,.5);
  opacity:0;visibility:hidden;transition:opacity .3s var(--yay),visibility .3s;
}
.fav-perde.acik{opacity:1;visibility:visible}

/* Favori düğmesi. Ürün sayfasında başlığın altında, yazılı. */
.fav-dugme{
  background:none;border:0;cursor:pointer;color:inherit;
  display:inline-grid;place-items:center;width:38px;height:38px;
  transition:opacity .2s var(--yay),transform .2s var(--yay);
}
.fav-dugme:hover{transform:scale(1.08)}
.fav-dugme[aria-pressed="true"] svg{fill:var(--amber);stroke:var(--amber)}

.fav-dugme-yazili{
  display:inline-flex!important;align-items:center;gap:8px;
  width:auto!important;height:auto!important;
  margin:14px 0 2px;padding:9px 0;
  font-family:var(--f-govde);font-size:13.5px;font-weight:500;
  color:var(--murekkep-2);
}
.fav-dugme-yazili:hover{transform:none;color:var(--murekkep)}
.fav-dugme-yazili[aria-pressed="true"]{color:var(--pirinc)}

/* ═══ KATMAN PENCERESİ ═══════════════════════════════════════════
   Ana sayfadan çıkarılan ama çalışmaya devam eden bölümler
   (üyelik formu) burada açılır. */
.lm-katman{
  position:fixed;inset:0;z-index:1200;
  background:rgba(7,16,12,.72);
  display:grid;place-items:center;padding:var(--bosluk);
  opacity:0;visibility:hidden;
  transition:opacity .3s var(--yay),visibility .3s;
}
.lm-katman.acik{opacity:1;visibility:visible}
.lm-katman-ic{
  position:relative;width:min(760px,100%);max-height:88vh;overflow-y:auto;
  background:var(--kagit);color:var(--murekkep);
  padding:clamp(28px,4vw,48px);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.6);
}
.lm-katman-kapat{
  position:absolute;top:10px;right:12px;
  background:none;border:0;font-size:26px;line-height:1;
  color:var(--murekkep-2);cursor:pointer;width:40px;height:40px;
}
.lm-katman-kapat:hover{color:var(--murekkep)}
.lm-katman-govde>section{
  padding:0!important;background:none!important;color:inherit!important;
}
.lm-katman-govde .section-title,.lm-katman-govde h2{
  font-family:var(--f-baslik)!important;color:var(--murekkep)!important;
  font-size:clamp(1.5rem,3vw,2rem)!important;margin-bottom:14px!important;
}
.lm-katman-govde .section-eyebrow{color:var(--pirinc)!important}
.lm-katman-govde p,.lm-katman-govde li{color:var(--murekkep-2)!important}
.lm-katman-govde .gold-rule{display:none}
.lm-katman-govde input,.lm-katman-govde select,.lm-katman-govde textarea{
  border-radius:0!important;border:1px solid var(--cizgi)!important;
}

/* ═══ SAYFA GEÇİŞLERİ ════════════════════════════════════════════ */
@view-transition{navigation:auto}
::view-transition-old(root){animation:g-cik .24s var(--yay) both}
::view-transition-new(root){animation:g-gir .36s var(--yay) both}
@keyframes g-cik{to{opacity:0}}
@keyframes g-gir{from{opacity:0;transform:translateY(12px)}}

/* ═══ HERO AÇILIŞI — sayfanın tek orkestre edilmiş anı ═══════════ */
.js #hero .atmosfer{opacity:0}
.js #hero [data-giris]{opacity:0;transform:translateY(16px)}
.hazir #hero .atmosfer{opacity:1;transition:opacity 1.5s var(--yay-yumusak) .15s}
.hazir #hero [data-giris]{
  opacity:1;transform:none;
  transition:opacity .9s var(--yay-yumusak),transform .9s var(--yay-yumusak);
}
.hazir #hero [data-giris="1"]{transition-delay:.55s}
.hazir #hero [data-giris="2"]{transition-delay:.72s}
.hazir #hero [data-giris="3"]{transition-delay:.94s}
.hazir #hero [data-giris="4"]{transition-delay:1.1s}
.js #hero .hero-in{opacity:0}
.hazir #hero .hero-in{opacity:1;transition:opacity .8s var(--yay) 1.5s}

/* ═══ ODAK VE ERİŞİLEBİLİRLİK ════════════════════════════════════ */
a:focus-visible,button:focus-visible,input:focus-visible,
summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--amber)!important;outline-offset:3px!important;
}
.sahne a:focus-visible,.mob-menu a:focus-visible,
.ara-katman *:focus-visible,footer a:focus-visible{
  outline-color:var(--amber-ic)!important;
}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .hero-in-cizgi{animation:none;transform:scaleY(.8);opacity:.6}
  @view-transition{navigation:none}
}
/* JavaScript çalışmazsa hiçbir şey gizli kalmasın */
@media (scripting:none){
  #hero .atmosfer,#hero [data-giris],#hero .hero-in{opacity:1!important;transform:none!important}
}

/* ═══ MOBİL ══════════════════════════════════════════════════════ */
@media (max-width:860px){
  :root{--bar:60px}
  .kapilar{grid-template-columns:1fr}
  .kapi{padding:18px 0}
  .kapi+.kapi{border-left:0;border-top:1px solid var(--cizgi);padding-left:0}
  .imza-sahne{grid-template-columns:1fr}
  /* 16/10'da kare çizim yüksekliğe sığıyor ve iki yanda geniş boşluk
     kalıyordu; şişe telefonda küçücük duruyordu. 5/4 ile çizim
     %44 daha fazla alan alıyor, sayfa 76 piksel uzuyor. */
  .imza-cam{aspect-ratio:5/4;order:-1}
  .raf{grid-auto-columns:minmax(206px,78%)}
  .site-head #hamburger:after,.site-head .hamburger:after{display:none}
  .site-head .nav-logo{justify-content:center}
}
@media (max-width:560px){
  .hero-baslik{font-size:clamp(2.15rem,8.8vw,2.95rem)!important}
  .hero-etiket{letter-spacing:.24em;font-size:9.5px}
  .hero-eylem{flex-direction:column;align-items:stretch}
  .dugme{width:100%}
  .raf-bas{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ═══ ESKİ ANA SAYFADAN ARTAKALANLAR ═════════════════════════════
   Yeni ana sayfada karşılığı olmayan, ama diğer sayfalarda işini
   gören öğeler. Yalnızca ana sayfada (body.ev) kapatılıyor. */

/* Duyuru şeridi "3+ üründe ücretsiz kargo · %30 esans · mağaza"
   yazıyordu ve hero'yu 112 px aşağı itiyordu. Brifing bu bilgilerin
   hero'da olmamasını istiyor; ikisi de güven bölümünde ve menüde var. */
body.ev .announce{display:none!important}

/* Eski sayfadaki kaydırmayla belirme sistemi (.reveal) kapatıldı.
   İki sebep: ana sayfa artık onu görünür yapan betiği yüklemiyor, ve
   her bölümün aşağıdan belirmesi zaten jenerik duruyor. Sayfada tek
   bir orkestre edilmiş hareket var — hero açılışı. */
body.ev .reveal{opacity:1!important;transform:none!important;transition:none!important}

/* premium.js, <main>'in başına bir güven şeridi (.lm-confidence)
   enjekte ediyor: fiziksel mağaza, ücretsiz kargo, şeffaf toplam,
   WhatsApp onayı. Aynı dört madde güven bölümünde zaten var ve
   brifing bu bilgilerin hero'nun hemen altında olmamasını istiyor. */
body.ev .lm-confidence{display:none!important}

/* Yüzen sepet düğmesi: başlık çubuğunda zaten sepet var. */
body.ev .lm-cart-button{display:none!important}

/* Eski hero'nun duman ve ışın katmanları — kuralları silindi,
   kalan boş kapsayıcılar da yer kaplamasın. */
body.ev .smoke,body.ev .rays{display:none!important}

/* Diğer sayfalarda üst çubuk hero olmadığı için hep katı durur. */
body:not(.ev) header.site-head{
  background:rgba(247,245,239,.97)!important;
  border-bottom-color:var(--cizgi)!important;
}
body:not(.ev) .site-head .nav-logo,
body:not(.ev) .site-head .icon-tool,
body:not(.ev) .site-head #hamburger:after,.site-head .hamburger:after{color:var(--murekkep)!important}
body:not(.ev) .site-head #hamburger span,.site-head .hamburger span{background:var(--murekkep)!important}



/* ═══ 5 · SOSYAL KANIT VE GÜVEN — bölüm içi biçimler ════════════
   Yorumlar ve güven maddeleri eskiden kutu kartlardı. Aynı köşe
   yarıçapı ve aynı gölgeyle dizilen kutular her sitede var; burada
   eczane belgesi dili kullanıldı: saç çizgiler, alıntılar, kutu yok. */
#guven .gold-rule{display:none}
#guven .section-eyebrow,#koku-asistani .section-eyebrow{
  font-family:var(--f-govde)!important;
  font-size:11px!important;letter-spacing:.2em!important;
  text-transform:uppercase;color:var(--amber)!important;
  display:inline-flex!important;align-items:center;gap:10px;
  margin-bottom:12px!important;font-weight:600!important;
}
#guven .section-title{
  font-size:clamp(1.6rem,3vw,2.3rem)!important;
  line-height:1.1!important;margin:0 0 clamp(26px,4vw,40px)!important;
}
#guven .section-title em{font-style:normal;color:var(--pirinc)}

/* Google başlığı: tek satırda puan, yıldız ve sayı */
#reviews .g-head{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding-bottom:20px;border-bottom:1px solid var(--cizgi);
  margin-bottom:clamp(22px,3vw,34px);
}
/* Google harfleri marka renkleriyle yazılıyordu; krem zeminde sarı
   harf ölçülen 1,57:1 ile okunmuyordu. Tek renk, okunur. */
#reviews .g-mark{
  display:flex;gap:1px;font-weight:600;font-size:14px;letter-spacing:.02em;
}
#reviews .g-mark span{color:var(--murekkep-2)!important}
#reviews .g-score{font-family:var(--f-baslik);font-size:2rem;line-height:1;font-weight:600}
#reviews .g-stars{color:var(--pirinc);letter-spacing:.12em;font-size:14px}
#reviews .g-sub{font-size:12.5px;color:var(--murekkep-2);margin-left:auto}

/* Yorumlar: kutu değil, alıntı */
#reviews .g-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(22px,3vw,40px);
}
#reviews .g-rev{
  /* eski kart: dört kenar çerçeve + 14px yuvarlatma + beyaz zemin.
     Önce tüm kenarlık sıfırlanıyor, sonra yalnızca sol saç çizgi. */
  border:0!important;
  border-left:1px solid var(--cizgi)!important;
  padding:2px 0 2px 20px!important;
  background:none!important;box-shadow:none!important;border-radius:0!important;
}
#reviews .g-rev:nth-child(n+4){display:none}
#reviews .g-rev-stars{color:var(--pirinc);font-size:12px;letter-spacing:.1em;margin-bottom:10px}
#reviews .g-rev p{
  font-size:14.5px;line-height:1.75;color:var(--murekkep);margin:0 0 14px;
  display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;
}
#reviews .g-rev-foot{display:flex;align-items:baseline;gap:8px;font-size:12px}
#reviews .g-rev-foot b{font-weight:600}
#reviews .g-rev-foot span{color:var(--murekkep-2)}

/* Güven maddeleri: dört sütun, kutu yok, üstte saç çizgi */
#trust{padding-top:clamp(24px,3vw,38px)!important}
#trust .trust-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0!important;background:none!important;
  border-top:1px solid var(--cizgi);
}
#trust .trust-item{
  padding:22px 24px 4px 0!important;
  text-align:left!important;
  background:none!important;border:0!important;box-shadow:none!important;
  border-radius:0!important;
}
#trust .trust-item+.trust-item{border-left:1px solid var(--cizgi);padding-left:24px}
/* Simge kutusuz, yalın bir çizgi işareti olarak duruyor.
   DİKKAT: index.html'in kendi .trust-icon kuralı 42px'lik bir daire
   çiziyor (border + background + border-radius). Burada arka planı ve
   yuvarlaklığı sıfırlarken `border` kalmıştı; blok öğe olduğu için
   satır boyu uzayıp 320×21'lik boş bir dikdörtgen olarak görünüyordu.
   Ölçüldü ve kapatıldı — kenarlığı buradan geri almak isteyen olursa
   genişliği de birlikte vermeli. */
#trust .trust-icon{
  display:block!important;
  color:var(--pirinc);line-height:0;margin:0 0 14px!important;
  background:none!important;width:auto!important;height:auto!important;
  border:0!important;border-radius:0!important;font-size:0!important;
}
#trust .trust-icon svg{width:19px;height:19px}
#trust .trust-title{
  font-family:var(--f-govde);font-size:13.5px;font-weight:600;
  margin-bottom:6px;color:var(--murekkep);
}
#trust .trust-desc{font-size:12.5px;line-height:1.65;color:var(--murekkep-2)}

/* Yorum düğmeleri. Dolu düğmenin yazısı zemini ile aynı koyu yeşildi
   (ölçülen kontrast 1,43:1): .rev-btn-solid beyaz veriyor, ardından
   gelen .rev-btn aynı özgüllükte koyu yeşile çeviriyordu.
   Ayrıca brifing BÜYÜK HARF düğme yazısı istemiyor. */
#guven .rev-btn,#guven .rev-btn-solid{
  text-transform:none!important;letter-spacing:.01em!important;
  border-radius:0!important;font-size:13.5px!important;
  font-family:var(--f-govde)!important;font-weight:500!important;
  padding:0 26px!important;height:48px!important;
  display:inline-flex!important;align-items:center;justify-content:center;
}
#guven .rev-btn{
  border:1px solid var(--cizgi)!important;color:var(--murekkep)!important;
  background:none!important;
}
#guven .rev-btn:hover{border-color:var(--murekkep)!important;background:none!important}
#guven .rev-btn-solid{
  background:var(--murekkep)!important;background-image:none!important;
  color:var(--kagit)!important;border-color:var(--murekkep)!important;
  box-shadow:none!important;
}
#guven .rev-btn-solid:hover{background:#000!important;color:var(--kagit)!important}

/* Altbilgideki adres bloğu koyu gri kalıyordu, okunmuyordu */
footer .foot-adres,footer address,footer .foot-col p,footer small{
  color:rgba(242,238,230,.68)!important;font-size:12.5px;line-height:1.75;font-style:normal;
}
/* Altbilgi logosundaki altın "Meds" ölçülen 3,95:1 ile eşiğin
   altındaydı; açık amber tonuna alındı. */
footer .foot-brand em{color:var(--amber-ic)!important;font-style:normal}
.foot-bottom{
  background:var(--gece)!important;color:rgba(242,238,230,.58)!important;
  border-top:1px solid var(--cizgi-gece)!important;
  padding:18px var(--bosluk)!important;font-size:11.5px!important;
}
.foot-bottom a{color:rgba(242,238,230,.72)!important}

@media (max-width:860px){
  #reviews .g-grid{grid-template-columns:1fr;gap:20px}
  #reviews .g-rev:nth-child(n+3){display:none}
  #reviews .g-sub{margin-left:0;width:100%}
  #trust .trust-grid{grid-template-columns:1fr}
  #trust .trust-item+.trust-item{
    border-left:0;padding-left:0;border-top:1px solid var(--cizgi);
  }
}

/* ═══ TAŞINAN BİLEŞENLER ══════════════════════════════════════════
   Tester seti penceresi, üyelik formu ve menü perdesi. Bu bileşenler
   çalışıyor ve brifing korunmalarını istiyor; biçimleri eski gövde
   dosyasındaydı, ana sayfa onu artık yüklemediği için buraya alındı.
   157 kural taşındı. */
.mem-submit{font-family:var(--f-govde),'Segoe UI',sans-serif!important}.menu-backdrop{position:fixed;inset:0;z-index:198;background:rgba(19,16,12,.35);}.menu-backdrop[hidden]{display:none}.mem-card{border-radius:16px!important}.mem-card input{min-height:48px}.mem-consent{background:#f7f4ee;border:1px solid rgba(53,42,25,.1);padding:11px;border-radius:9px}.lm-source-badge{display:inline-flex;align-items:center;background:#eef3ef;color:#245448;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:700;margin-bottom:12px}/* Mobil menü: gerçek bir çekmece, arka plan opak ve metin her zaman okunur. */.menu-backdrop{background:rgba(20,25,22,.48)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}/* Formun işlevsel durumları mevcut yerleşimi değiştirmeden görünür kalır. */.mem-privacy-note{margin:12px 2px 0;color:#66736e;font-size:.72rem;line-height:1.55}.mem-submit:disabled{cursor:wait;opacity:.7}.mem-error{margin-top:12px;padding:11px 13px;border-radius:9px;background:#fff0ed;color:#8b2e21;font-size:.78rem;line-height:1.5}.mem-consent strong{color:#1e3d2f}.menu-intro{margin:2px 0 17px;color:#6d665c;font-size:.78rem;line-height:1.55}.mob-menu>a:not(.menu-wa){gap:12px!important;min-height:62px!important}.mob-menu .menu-wa{display:flex!important;min-height:48px!important;margin-top:18px;padding:0 16px!important;align-items:center!important;justify-content:center!important;border:0!important;border-radius:999px;background:#1e3d2f;color:#fff!important;font-size:.76rem!important;font-weight:700!important}.mem-card{box-shadow:0 10px 34px rgba(27,49,40,.07)!important}.tester-overlay{position:fixed;inset:0;z-index:1100;background:rgba(15,29,26,.72);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}.tester-overlay.is-open{opacity:1;visibility:visible}.tester-dialog{position:fixed;z-index:1101;inset:4vh max(18px,calc((100vw - 940px)/2));height:92vh;background:#fbfaf6;color:#173730;border:1px solid rgba(255,255,255,.45);border-radius:24px;box-shadow:0 28px 90px rgba(0,0,0,.32);display:grid;grid-template-rows:auto auto auto minmax(150px,1fr) auto;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(16px) scale(.985);transition:.22s ease;font-family:Manrope,Arial,sans-serif}.tester-dialog.is-open{opacity:1;visibility:visible;transform:none}body.tester-open{overflow:hidden}.tester-dialog header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px 26px 16px;border-bottom:1px solid rgba(23,55,48,.1)}.tester-dialog header small{color:#a57840;text-transform:uppercase;letter-spacing:.13em;font-weight:700}.tester-dialog h2{margin:3px 0 3px;font:600 clamp(28px,4vw,40px)/1.05 var(--f-baslik),serif}.tester-dialog header p{margin:0;color:#66716b;font-size:13px}.tester-close{border:0;background:#e9eee9;color:#173730;width:40px;height:40px;border-radius:50%;font-size:27px;line-height:1;cursor:pointer}.tester-controls{display:grid;grid-template-columns:minmax(280px,.8fr) 1.2fr;gap:16px;padding:16px 26px}.tester-size{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tester-size button{background:#fff;border:1px solid rgba(23,55,48,.16);border-radius:12px;padding:10px 12px;color:#173730;text-align:left;cursor:pointer}.tester-size button strong,.tester-size button span{display:block}.tester-size button span{margin-top:2px;font-size:11px;color:#6e756f}.tester-size button.is-active{border-color:#173730;background:#173730;color:#fff;box-shadow:0 6px 18px rgba(23,55,48,.18)}.tester-size button.is-active span{color:#e9dfcf}.tester-search{height:100%;min-height:52px;background:#fff;border:1px solid rgba(23,55,48,.16);border-radius:12px;display:flex;align-items:center;padding:0 15px;gap:9px}.tester-search span{font-size:22px}.tester-search input{border:0;outline:0;background:transparent;width:100%;font:500 14px Manrope,Arial,sans-serif;color:#173730}.tester-selection{padding:0 26px 14px}.tester-selection-head{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;margin-bottom:8px}.tester-selection-head span{color:#a57840;font-weight:700}.tester-selected{min-height:46px;display:flex;gap:7px;overflow:auto;padding-bottom:4px}.tester-selected button{flex:0 0 auto;border:1px solid #dce3dc;background:#fff;border-radius:999px;padding:8px 10px;color:#42534c;font:600 11px Manrope,Arial,sans-serif;cursor:pointer}.tester-selected button span{font-size:16px;margin-left:6px}.tester-selection-empty{color:#7a837e;font-size:12px;padding:9px 0}.tester-results{overflow:auto;padding:4px 26px 20px;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:8px}.tester-product{width:100%;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:10px;border:1px solid rgba(23,55,48,.11);border-radius:12px;background:#fff;color:#173730;padding:10px;text-align:left;cursor:pointer;transition:.15s ease}.tester-product:hover{border-color:#a57840;transform:translateY(-1px)}.tester-product.is-selected{border-color:#173730;background:#edf2ed}.tester-product strong,.tester-product small{display:block}.tester-product strong{font:600 13px/1.3 Manrope,Arial,sans-serif}.tester-product small{margin-top:3px;color:#7a837e;font-size:10px}.tester-check{width:30px;height:30px;border-radius:50%;background:#eef1ed;display:grid;place-items:center;font-weight:700}.tester-product.is-selected .tester-check{background:#173730;color:#fff}.tester-empty{grid-column:1/-1;text-align:center;color:#7a837e;padding:40px}.tester-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 26px;border-top:1px solid rgba(23,55,48,.12);background:#fff}.tester-dialog footer div small,.tester-dialog footer div strong{display:block}.tester-dialog footer div small{color:#6e756f;font-size:11px}.tester-dialog footer div strong{font:600 28px var(--f-baslik),serif}.tester-dialog footer button{border:0;border-radius:12px;background:#173730;color:#fff;min-width:250px;padding:15px 20px;font:700 13px Manrope,Arial,sans-serif;cursor:pointer}.tester-dialog footer button:disabled{background:#d7ddd8;color:#778079;cursor:not-allowed}@media(max-width:680px){.tester-dialog{inset:0;height:100dvh;border-radius:0;grid-template-rows:auto auto auto minmax(120px,1fr) auto}.tester-dialog header{padding:16px 16px 12px}.tester-dialog h2{font-size:28px}.tester-dialog header p{font-size:11px}.tester-controls{grid-template-columns:1fr;padding:12px 16px;gap:9px}.tester-size button{padding:8px 10px}.tester-search{min-height:46px}.tester-selection{padding:0 16px 9px}.tester-results{grid-template-columns:1fr;padding:3px 16px 15px}.tester-product{padding:9px}.tester-dialog footer{padding:11px 16px calc(11px + env(safe-area-inset-bottom));gap:10px}.tester-dialog footer button{min-width:0;flex:1;padding:13px 10px}.tester-dialog footer div strong{font-size:23px}.tester-selection-head{align-items:flex-start}.tester-selection-head span{text-align:right}}.mem-submit{background:var(--lm-forest)!important;color:#fff!important;border:1px solid var(--lm-forest)!important;border-radius:999px!important;box-shadow:0 8px 22px rgba(18,59,50,.18)!important}.mem-submit:hover{background:var(--lm-forest-2)!important;transform:translateY(-2px)}#uyelik .mem-card{border:1px solid var(--lm-line)!important;border-radius:22px!important;box-shadow:var(--lm-shadow)!important}@media(max-width:430px){#uyelik .mem-card{padding:22px 16px!important}}.tester-showcase{position:relative;margin:0!important;height:330px;border-radius:19px;overflow:hidden;border:1px solid rgba(18,59,50,.12);background:#eadcc7;box-shadow:0 18px 44px rgba(18,59,50,.13)}.tester-showcase img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;transition:transform .5s ease}.tester-showcase:hover img{transform:scale(1.025)}.tester-showcase::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(7,31,27,.74));pointer-events:none}.tester-showcase figcaption{position:absolute;z-index:2;left:20px;right:20px;bottom:17px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;color:#fff}.tester-showcase figcaption strong{font:600 1.45rem var(--f-baslik),serif}.tester-showcase figcaption span{font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.76)}.tester-price-note{margin:7px 2px 0;color:#996e38;font-size:10px;line-height:1.35}@media(max-width:680px){.tester-showcase{height:280px;grid-row:1}.tester-showcase figcaption{left:14px;right:14px;bottom:13px}.tester-price-note{font-size:9px;margin-top:5px}}#uyelik .mem-wrap{display:grid!important;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr)!important;gap:36px!important;align-items:center!important;max-width:1100px!important;margin:auto!important}#uyelik .mem-copy{text-align:left!important;margin:0!important}#uyelik .mem-card{padding:22px!important}@media(max-width:980px){#uyelik .mem-wrap{grid-template-columns:1fr!important;gap:22px!important}#uyelik .mem-copy{text-align:center!important}}.menu-backdrop{top:106px!important}.tester-showcase{border-radius:24px!important;overflow:hidden!important;background:#efe7d8!important}.tester-steps{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.tester-steps span{display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(255,255,255,.2);border-radius:10px;font-size:12px}.tester-steps b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e5cfaa;color:var(--v94-deep)}@media(max-width:768px){.menu-backdrop{top:92px!important}.tester-showcase{order:-1!important;max-height:400px}.tester-showcase img{height:400px!important;object-fit:contain!important}}#uyelik .mem-wrap{max-width:1120px!important;margin:auto!important;display:grid!important;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr)!important;gap:38px!important;align-items:center!important}#uyelik .mem-copy{text-align:left!important;margin:0!important}#uyelik .mem-copy p{color:rgba(255,255,255,.72)!important}#uyelik .mem-card{padding:24px!important;background:#fff!important;color:var(--lm95-ink)!important;border-radius:18px!important;box-shadow:none!important}@media(max-width:768px){#uyelik .mem-wrap{grid-template-columns:1fr!important;gap:22px!important}#uyelik .mem-copy{text-align:center!important}}/* Üyelik artık KOYU zeminde: koyu başlık → açık */#uyelik .mem-copy h2{color:#fff!important}#uyelik .mem-copy .section-eyebrow{color:#e8cd86!important}#uyelik .mem-copy li,#uyelik .mem-copy ul li,#uyelik .mem-list li{color:#d4ded7!important}#uyelik .mem-copy li svg,#uyelik .mem-copy li:before{color:#8fcfae!important}#uyelik .mem-copy h2 em{color:#e8cd86!important}/* ── Tester seti kartı: beyaz başlık açık zeminde 1.23:1 ── */.tester-card strong,.ct-tester strong{color:#17231d!important}/* Tester seti görsel başlığı: beyaz metin açık bej zeminde 1.23:1 idi.
   Hem fotoğraf hem düz zemin üzerinde çalışsın diye kendi koyu zemini verildi. */.tester-showcase figcaption{background:rgba(12,34,27,.72)!important;color:#fff!important;
  padding:10px 16px!important;border-radius:12px!important;display:inline-block!important;
  }.tester-showcase figcaption strong,.tester-showcase figcaption span{color:#fff!important}/* Butonlarda BÜYÜK HARF yerine normal yazım */.mem-submit{text-transform:none!important;letter-spacing:.01em!important}.mem-submit{font-weight:600!important}#uyelik .mem-copy p,#uyelik .mem-copy li{color:#cfdbd4!important}#uyelik .mem-copy h2 em{color:var(--v97-gold-lt)!important}#kesif .tester-showcase{background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(232,205,134,.2)!important}/* Tester görseli çerçevenin içinde kutulanıyordu (object-fit:contain) */#kesif .tester-showcase{overflow:hidden!important;border-radius:16px!important;padding:0!important}#kesif .tester-showcase img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}/* Başlık ve alt yazı aynı satırda üst üste biniyordu */#kesif .tester-showcase figcaption{left:14px!important;right:14px!important;bottom:14px!important;
  display:flex!important;flex-direction:column!important;gap:2px!important;align-items:flex-start!important;
  padding:11px 14px!important}#kesif .tester-showcase figcaption strong{font:600 17px/1.2 Manrope,sans-serif!important}#kesif .tester-showcase figcaption span{font:400 12px/1.3 Manrope,sans-serif!important;color:#e4ebe6!important}/* Kalan BÜYÜK HARF butonlar */.tester-open,.mem-submit{text-transform:none!important;letter-spacing:.01em!important}/* Koyu bölümlerdeki beyaz kartların içi açık zemin kuralına döner */#uyelik .mem-card{color:var(--v97-ink)!important}#uyelik .mem-card label,#uyelik .mem-card .ob-label{color:#44524a!important}/* Tester görseli: dikey şişe yatay çerçevede fazla yakın kırpılıyordu */#kesif .tester-showcase img{object-position:50% 38%!important}#kesif .tester-showcase figcaption{padding:9px 13px!important;border-radius:10px!important}#kesif .tester-showcase figcaption span{text-transform:none!important;letter-spacing:.01em!important}/* ─── Üyelik: önce yalnızca e-posta, gerisi sonra açılır ─── */.mem-form[data-aste="kapali"] .mem-step2{display:none}.mem-form .mem-hint{font-size:12.5px;color:#55625a;margin-top:8px}.mem-form[data-aste="acik"] .mem-hint{display:none}#uyelik .mem-copy h2{color:#fff!important}#uyelik .mem-copy p,#uyelik .mem-copy li{color:rgba(231,237,233,.78)!important}/* Koyu odadaki beyaz paneller tekrar açık zemin kuralına döner */#uyelik .mem-card{background:#fff!important;color:var(--e-ink)!important;
  border-radius:3px!important;box-shadow:0 24px 60px rgba(4,20,14,.22)!important}#kesif .tester-showcase{background:rgba(255,255,255,.05)!important;
  border:1px solid var(--e-line-lt)!important;border-radius:3px!important}/* Altın italik vurgu YALNIZCA hero'da — koyu odalarda da düz */#uyelik .mem-copy h2 em{color:inherit!important;font-style:normal!important}#kesif .tester-showcase{height:300px!important}#uyelik .mem-card{padding:26px!important}#uyelik .mem-wrap{gap:34px!important}@media(max-width:900px){#kesif .tester-showcase{height:220px!important}#uyelik .mem-wrap{gap:22px!important}}/* Üyelik başlığı 3 satıra kırılıp sütunu 408px yapıyordu */#uyelik .mem-copy h2{font-size:clamp(28px,2.9vw,40px)!important;
  line-height:1.06!important}#uyelik .mem-copy p{font-size:15px!important;margin-bottom:14px!important}#uyelik .mem-copy li{font-size:14px!important;margin-bottom:5px!important}#kesif .tester-showcase{height:270px!important}@media(max-width:900px){#uyelik .mem-copy h2{font-size:clamp(26px,7vw,34px)!important}}.tester-showcase{
  margin:0!important;
  position:relative;
  aspect-ratio:4/5;
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(165deg,#F6F4EE,#E9E5DA);
  box-shadow:0 20px 48px -22px rgba(14,58,44,.3);
}.tester-showcase img{
  width:100%!important;height:100%!important;
  object-fit:cover!important;
  object-position:50% 42%!important;
  display:block;
  transition:transform .7s var(--lm-yay);
}.tester-showcase:hover img{transform:scale(1.03)}.tester-showcase figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:38px 20px 16px!important;
  background:linear-gradient(transparent,rgba(9,42,31,.82))!important;
  color:#fff!important;
  display:flex;flex-direction:column;gap:1px;
}.tester-showcase figcaption strong{
  font-family:var(--lm-baslik)!important;
  font-size:19px!important;font-weight:600!important;color:#fff!important;
}.tester-showcase figcaption span{
  font-size:12.5px!important;color:rgba(255,255,255,.82)!important;
}@media (max-width:860px){.tester-showcase{aspect-ratio:3/4;max-width:360px;margin:0 auto!important}}

/* Katalog ve sipariş penceresindeki simgeler de çizim oldu */
.sbar-icon,.sh-chk,.ob-success-icon{
  display:inline-grid!important;place-items:center;line-height:0;font-size:0!important;
  background:none!important;
}
.sbar-icon svg{width:15px;height:15px}
.sh-chk svg{width:13px;height:13px}
.ob-success-icon svg{width:22px;height:22px}

/* ═══ ÇEREZ ONAYI ════════════════════════════════════════════════
   Sayfanın altından girer, içeriği örtmez, ilk ziyaretten sonra
   bir daha çıkmaz. Analiz çerezleri Consent Mode ile reddedilmiş
   başlar; bu düğme yalnızca onu açar. */
.cerez{
  position:fixed;left:0;right:0;bottom:0;z-index:1300;
  background:var(--gece);color:rgba(242,238,230,.9);
  border-top:1px solid var(--cizgi-gece);
  transform:translateY(100%);
  transition:transform .42s var(--yay);
}
.cerez.acik{transform:none}
.cerez-ic{
  max-width:var(--en);margin:0 auto;
  padding:18px var(--bosluk);
  display:flex;align-items:center;gap:clamp(16px,3vw,40px);
}
.cerez-yazi{
  margin:0!important;font-size:13px!important;line-height:1.6!important;max-width:68ch;
  /* Diğer sayfalarda gövde dosyasının genel p kuralı bunu gri yapıyor
     ve koyu zeminde ölçülen kontrast 2,53:1'e düşüyordu. */
  color:rgba(242,238,230,.86)!important;
}
.cerez-yazi a{color:var(--amber-ic);text-decoration:underline;text-underline-offset:2px}
.cerez-dugmeler{display:flex;gap:10px;flex:none;margin-left:auto}
.cerez button{
  font-family:var(--f-govde);font-size:13px;font-weight:500;
  height:42px;padding:0 20px;border-radius:0;cursor:pointer;
  white-space:nowrap;
  transition:background .22s var(--yay),border-color .22s var(--yay),color .22s var(--yay);
}
.cerez-ret{
  background:transparent;border:1px solid rgba(240,199,134,.34);
  color:rgba(242,238,230,.86);
}
.cerez-ret:hover{border-color:var(--amber-ic);color:#fff}
.cerez-kabul{
  background:var(--amber-ic);border:1px solid var(--amber-ic);color:#1A1208;
}
.cerez-kabul:hover{background:#fff;border-color:#fff}

@media (max-width:720px){
  .cerez-ic{flex-direction:column;align-items:stretch;gap:14px;padding:16px var(--bosluk) 18px}
  .cerez-dugmeler{margin-left:0}
  .cerez button{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .cerez{transition:none}
}

/* ═══ HAREKETLER ═════════════════════════════════════════════════
   Hepsi görünür alana girince bir kez çalışır, hepsi transform ve
   opacity üzerinden gider. Sonsuz dönen hiçbir şey yok. */

/* Oranlar: p.css bunları width ile canlandırıyordu — her kare
   yerleşim hesabı demek. Genişlik sabitlenip transform'a geçildi. */
.js .duel-bar i[data-w],.js .perf-bar i[data-w]{
  width:100%!important;
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.05s cubic-bezier(.2,.7,.2,1)!important;
  will-change:auto;
}
.perf-bar i[data-w]{transition-delay:.12s!important}

/* İmza sahnesi: tek bir düzenlenmiş an — tezgâh lambası yanar,
   şişe bir tık doğrulur, marka izi en son belirir. Dağınık efekt
   yok; sayfadaki tek gösterili hareket bu. */
.js .imza-cam .lamba{opacity:0;transition:opacity 1.2s var(--yay-yumusak)}
.js .imza-cam .sise{
  transform:translate(0,12px);opacity:.45;
  transition:transform 1s var(--yay-yumusak),opacity 1s var(--yay-yumusak);
}
.js .imza-cam .muhur,.js .imza-cam .kunye{
  opacity:0;transition:opacity 1.1s var(--yay-yumusak) .34s;
}
.imza-cam.yanik .lamba{opacity:1}
.imza-cam.yanik .sise{transform:none;opacity:1}
.imza-cam.yanik .muhur{opacity:.62}
.imza-cam.yanik .kunye{opacity:.5}

/* Etiket rafı: kartlar soldan sağa sırayla gelir */
.js .raf .etiket{
  opacity:0;transform:translateY(12px);
  transition:opacity .5s var(--yay-yumusak),transform .5s var(--yay-yumusak),background .3s var(--yay);
}
.raf.girdi .etiket{
  opacity:1;transform:none;
  transition-delay:calc(var(--g,0) * 70ms);
}
/* Kartın içi: üzerine gelince koku imzası öne çıkar, fiyatın altı çizilir */
.etiket-nota{transition:color .3s var(--yay)}
.etiket:hover .etiket-nota{color:var(--murekkep)}
.etiket-alt{position:relative}
.etiket-alt:after{
  content:'';position:absolute;left:0;bottom:-1px;height:1px;width:100%;
  background:var(--pirinc);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--yay);
}
.etiket:hover .etiket-alt:after{transform:scaleX(1)}

/* Koku kapıları: üzerine gelince ok soldan kayarak girer */
.kapi{overflow:hidden}
.kapi-ad{position:relative;transition:transform .36s var(--yay)}
.kapi:hover .kapi-ad{transform:translateX(26px)}
.kapi-ad:before{
  content:'';position:absolute;left:-26px;top:50%;
  width:16px;height:1px;margin-top:-1px;
  background:var(--pirinc);
  transform:scaleX(0);transform-origin:right;
  transition:transform .36s var(--yay);
}
.kapi:hover .kapi-ad:before{transform:scaleX(1)}
.kapi-not{transition:color .3s var(--yay)}
.kapi:hover .kapi-not{color:var(--murekkep)}

/* Ürün sayfasındaki nota etiketleri sırayla belirir */
.js .note{
  opacity:0;transform:translateY(8px);
  transition:opacity .42s var(--yay-yumusak),transform .42s var(--yay-yumusak);
}
.note.girdi{
  opacity:1;transform:none;
  transition-delay:calc(var(--g,0) * 45ms);
}

/* JavaScript yoksa hiçbiri gizli kalmaz */
@media (scripting:none){
  .raf .etiket,.note{opacity:1!important;transform:none!important}
  .imza-cam .sise{opacity:1!important;transform:none!important}
  .imza-cam .lamba{opacity:1!important}
  .imza-cam .muhur{opacity:.62!important}
  .imza-cam .kunye{opacity:.5!important}
  .duel-bar i[data-w],.perf-bar i[data-w]{transform:scaleX(1)!important}
}
@media (prefers-reduced-motion:reduce){
  .raf .etiket,.note{opacity:1!important;transform:none!important;transition:none!important}
  .imza-cam .sise{opacity:1!important;transform:none!important;transition:none!important}
  .imza-cam .lamba{opacity:1!important;transition:none!important}
  .imza-cam .muhur{opacity:.62!important;transition:none!important}
  .imza-cam .kunye{opacity:.5!important;transition:none!important}
  .kapi:hover .kapi-ad{transform:none}
}

/* Krem zeminde 3,59:1'de kalan açık pirinç küçük yazılar */
small{color:inherit}
.lm-cart-drawer small,.ob-form-wrap small{color:var(--murekkep-2)}

/* ─────────────────────────────────────────────────────────────
   Ürün sayfası ikincil eylem: "5 ml Tester İste"
   Mağazada deneme vaadi kalktığı için bu düğme fiziksel mağaza
   bağlantısının yerini aldı. p.css'te inline-flex olduğu için
   satırda daralıp kalıyordu; birincil düğmeyle aynı genişliğe
   çekiliyor ki iki eylem kasıtlı bir çift gibi dursun.
   ───────────────────────────────────────────────────────────── */
.cta-box .btn-store{
  flex:1;min-width:230px;gap:9px;
  text-transform:none!important;letter-spacing:.01em!important;
  font-size:.92rem!important;
}
.cta-box .btn-store:before{
  content:'';width:15px;height:15px;flex:none;opacity:.72;
  background:currentColor;
  -webkit-mask:var(--ikon-vial) center/contain no-repeat;
          mask:var(--ikon-vial) center/contain no-repeat;
}
:root{
  --ikon-vial:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 3h4'/%3E%3Cpath d='M10.5 3v5.5L7.2 17a3 3 0 0 0 2.8 4h4a3 3 0 0 0 2.8-4l-3.3-8.5V3'/%3E%3Cpath d='M8.6 14h6.8'/%3E%3C/svg%3E");
}

/* ─────────────────────────────────────────────────────────────
   Katalog: sabit başlık ile kendi marka satırının çakışması
   katalog.html tam yükseklikte bir uygulama kabuğu (#app) ve
   <main> taşımıyor. Başlık boşluğu kuralı — body:not(.ev) main —
   bu yüzden ona uygulanmıyordu; sabit site başlığı sayfanın kendi
   mühür + "283 ürün" satırının tam üstüne biniyordu.
   Ölçüm: site başlığı 0–62px, #hdr 0px'den başlıyordu.
   Sayfanın kendi marka bağlantısı site başlığıyla aynı işi yaptığı
   için gizleniyor; canlı ürün sayacı kalıyor (arama daraldıkça
   güncelleniyor, bilgi taşıyor).
   ───────────────────────────────────────────────────────────── */
/* lilmeds.css'teki `body:has(#list-view) #hdr{padding:…!important}`
   kısayolu üst boşluğu da kapsadığı için aynı seçiciyle ve !important
   ile geçiliyor; sadece üst değer değişiyor. */
body:has(#list-view) #hdr,#app #hdr{
  padding-top:calc(var(--sat,0px) + var(--bar) + 12px)!important;
}
#app #hdr .brand{display:none}
#app #hdr .hdr-top{justify-content:flex-end;margin-bottom:10px}

/* ─────────────────────────────────────────────────────────────
   Bölüm üstü küçük etiketler (.section-eyebrow)
   Ölçüm: 11px amber (#C98A3C) krem zeminde (#F7F5EF) 9 bölümde
   2,68:1 kalıyordu; 11px metin için AA eşiği 4,5:1.
   --pirinc (#7E5518) aynı sıcaklıkta ama eşiği geçiyor.
   Seçiciler kimlik düzeyinde, çünkü rakip kurallar da öyle;
   dosyanın sonunda olmak eşitliği çözüyor.
   Koyu zeminli bölümler (#uyelik, #kesif, #imza) dışarıda:
   orada açık şampanya tonu zaten yüksek kontrast veriyor.
   ───────────────────────────────────────────────────────────── */
#koku-asistani .section-eyebrow,#reviews .section-eyebrow,
#trust .section-eyebrow,#sss .section-eyebrow,
#comparison .section-eyebrow,#kalite .section-eyebrow,
#rehber .section-eyebrow,#process .section-eyebrow,
#about .section-eyebrow,#guven .section-eyebrow,
#catalog-cta .section-eyebrow,#yeni-gelenler .section-eyebrow,
#kategoriler .section-eyebrow,#favoriler .section-eyebrow,
#seo-articles .section-eyebrow,.seo-articles .section-eyebrow{
  color:var(--pirinc)!important;
}

/* ─────────────────────────────────────────────────────────────
   İki açık zeminli rozet AA eşiğinin altındaydı (gerçek piksel):
     .cc-save  "%93 tasarruf"  #4ADE80 / yeşil %10 tint → 1,55:1
     .kalite-them .kalite-tag  #6B6B66 / #DCDCD8        → 3,89:1
   #4ADE80 koyu zemin için üretilmiş bir ton; açık zeminde
   okunmuyor. Yeşil anlamı korunarak koyultuldu.
   ───────────────────────────────────────────────────────────── */
.cc-save{
  color:#136A35!important;
  background:rgba(19,106,53,.09)!important;
  border-color:rgba(19,106,53,.26)!important;
}
.kalite-them .kalite-tag{color:#4F4F4A!important}

/* ─────────────────────────────────────────────────────────────
   Yüzen WhatsApp düğmesi
   Ölçüm: beyaz yazı #25D366→#1da851 degradesinde 2,32:1.
   WhatsApp'ın kendi markasında da bilinen bir sorun; 13px yazı
   için AA eşiği 4,5:1, simge için 3:1.
   Degrade yeşil ailesinde kalacak şekilde koyultuldu; açık uçta
   ölçülen değer 4,83:1, koyu uçta 7,18:1. Sitenin orman yeşili
   paletine de bu ton daha yakın duruyor.
   ───────────────────────────────────────────────────────────── */
.wa-float{
  background:linear-gradient(135deg,#13833F,#0E6530)!important;
  box-shadow:0 6px 24px rgba(14,101,48,.34),0 2px 6px rgba(0,0,0,.14)!important;
}
.wa-float:hover{box-shadow:0 10px 32px rgba(14,101,48,.42)!important}

/* ─────────────────────────────────────────────────────────────
   Ürün sayfası SEO bölümü (.urun-seo)
   Dört ara başlık, nota piramidi ve ürüne özel SSS. Sayfadaki
   diğer başlıklar .sec-title; bunlar gerçek h2 olduğu için kendi
   ölçüsünü taşıyor ama aynı altın saç çizgisini kullanıyor ki
   sayfada yabancı durmasın.
   ───────────────────────────────────────────────────────────── */
.urun-seo{margin:38px 0 8px}
.urun-seo h2{
  font-family:var(--f-baslik),Georgia,serif;
  font-size:clamp(1.12rem,2.1vw,1.42rem);
  font-weight:600;line-height:1.25;color:var(--murekkep);
  margin:30px 0 12px;display:flex;align-items:baseline;gap:14px;
}
.urun-seo h2:first-child{margin-top:0}
.urun-seo h2:after{
  content:'';flex:1;height:1px;align-self:center;
  background:linear-gradient(90deg,rgba(176,134,52,.34),transparent);
}
.urun-seo p{
  margin:0 0 12px;font-size:.95rem;line-height:1.72;color:var(--murekkep-2);
}
.urun-seo p strong,.urun-seo p b{color:var(--murekkep);font-weight:600}

/* Nota piramidi: üç katman, solda ince altın çizgi */
.nota-piramit{list-style:none;margin:4px 0 14px;padding:0}
.nota-piramit li{
  position:relative;padding:0 0 0 18px;margin-bottom:11px;
  font-size:.93rem;line-height:1.68;color:var(--murekkep-2);
}
.nota-piramit li:before{
  content:'';position:absolute;left:0;top:.62em;
  width:7px;height:1px;background:var(--pirinc);opacity:.75;
}
.nota-piramit li b{
  color:var(--murekkep);font-weight:600;
  letter-spacing:.01em;margin-right:3px;
}

/* Ürüne özel SSS — ana sayfadaki .kat akordeonuyla aynı dil */
.urun-sss{border-bottom:1px solid var(--cizgi)}
.urun-sss:first-of-type{border-top:1px solid var(--cizgi)}
.urun-sss>summary{
  list-style:none;cursor:pointer;position:relative;
  padding:15px 34px 15px 0;
  font-size:.95rem;font-weight:500;color:var(--murekkep);
}
.urun-sss>summary::-webkit-details-marker{display:none}
.urun-sss>summary:after{
  content:'';position:absolute;right:6px;top:50%;
  width:9px;height:9px;margin-top:-5px;
  border-right:1px solid var(--murekkep-2);
  border-bottom:1px solid var(--murekkep-2);
  transform:rotate(45deg);transition:transform .3s var(--yay);
}
.urun-sss[open]>summary:after{transform:rotate(-135deg)}
.urun-sss>p{margin:0 0 16px;padding-right:12px}

.urun-seo .discl-ic{
  margin-top:14px;padding:12px 14px;border-radius:9px;
  background:rgba(176,134,52,.06);
  border:1px solid rgba(176,134,52,.16);
  font-size:.88rem;color:var(--murekkep-2);
}
@media (max-width:560px){
  .urun-seo{margin-top:30px}
  .urun-seo h2{gap:10px}
}

/* Ürün sayfasındaki küme şeridi: markanın, koku ailesinin ve notanın
   kendi sayfasına giden üç bağlantı. Hem kullanıcıya hem iç bağlantı
   grafiğine çalışıyor. */
.kume-serit{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:26px 0 4px;padding-top:18px;
  border-top:1px solid var(--cizgi);
  font-size:.85rem;
}
.kume-serit>span{color:var(--murekkep-2);margin-right:2px}
.kume-serit a{
  display:inline-block;padding:6px 13px;border-radius:999px;
  border:1px solid var(--cizgi);color:var(--murekkep);
  text-decoration:none;transition:border-color .2s,background .2s;
}
.kume-serit a:hover{border-color:var(--pirinc);background:rgba(176,134,52,.06)}

/* ─────────────────────────────────────────────────────────────
   Makale tabloları (eşleştirme listesi, fiyat bantları)
   283 satırlık tablo mobilde taşıyor; sarmalayıcı yatay kaydırma
   veriyor ve ilk sütun sabit kalıyor ki hangi markaya baktığınız
   kaybolmasın.
   ───────────────────────────────────────────────────────────── */
.muadil-tablo-sar{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  margin:18px 0 22px;border:1px solid var(--cizgi);border-radius:12px;
}
.muadil-tablo{
  width:100%;border-collapse:collapse;
  font-size:.88rem;line-height:1.5;background:var(--kagit);
}
.muadil-tablo th,.muadil-tablo td{
  padding:10px 13px;text-align:left;
  border-bottom:1px solid var(--cizgi);white-space:nowrap;
}
.muadil-tablo thead th{
  position:sticky;top:0;z-index:2;
  background:var(--kagit-2);color:var(--murekkep);
  font-size:.74rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;
}
.muadil-tablo tbody tr:nth-child(2n){background:rgba(17,33,27,.022)}
.muadil-tablo tbody tr:hover{background:rgba(176,134,52,.07)}
.muadil-tablo td:nth-child(2){white-space:normal;min-width:190px}
.muadil-tablo a{color:var(--murekkep);text-decoration:underline;
  text-underline-offset:2px;text-decoration-color:rgba(176,134,52,.45)}
.muadil-tablo a:hover{color:var(--pirinc)}
.muadil-tablo code{
  font-size:.8rem;font-weight:700;letter-spacing:.04em;
  padding:2px 7px;border-radius:4px;
  background:var(--cam);color:var(--kagit);
}
.muadil-tablo tbody tr td:last-child{font-weight:600;color:var(--pirinc)}
/* 283 satır masaüstünde sayfayı 15.000 piksele çıkarıyordu. Tablo kendi
   içinde kaydırılıyor; başlık satırı sticky olduğu için hangi sütuna
   baktığınız kaybolmuyor. */
.muadil-tablo-sar{max-height:76vh;overflow-y:auto}

/* Tek başına duran tablo (fiyat bantları) da aynı çerçeveyi alsın */
.article-head ~ section > .muadil-tablo,
section > .muadil-tablo{
  border:1px solid var(--cizgi);border-radius:12px;overflow:hidden;
}
@media (max-width:600px){
  .muadil-tablo{font-size:.82rem}
  .muadil-tablo th,.muadil-tablo td{padding:9px 10px}
  .muadil-tablo-sar{max-height:72vh;overflow-y:auto}
}

/* Ana sayfa altındaki keşif şeridi: yeni küme ve rehber sayfalarına
   giden bağlantılar. Altbilgiden hemen önce, ayrı bir bölüm olarak
   değil — brifing ana sayfayı altı bölümde tutuyor. */
.hub-serit{
  max-width:var(--en);margin:0 auto;padding:26px var(--bosluk) 32px;
  display:flex;flex-wrap:wrap;gap:9px;justify-content:center;
  border-top:1px solid var(--cizgi);
}
.hub-serit a{
  padding:8px 15px;border-radius:999px;border:1px solid var(--cizgi);
  color:var(--murekkep-2);text-decoration:none;font-size:.84rem;
  transition:border-color .2s,color .2s,background .2s;
}
.hub-serit a:hover{
  border-color:var(--pirinc);color:var(--murekkep);
  background:rgba(176,134,52,.06);
}

/* Genişletilen rehber sayfaları (.hub) — .legal düzeni metin için
   dar; başlık aralıkları ve bağlantı şeridi buradan geliyor. */
.legal.hub h2{margin-top:30px}
.legal.hub .lead{font-size:1.02rem;line-height:1.7;color:var(--murekkep-2)}
.legal.hub .lm-seo-links{
  display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px;
}
.legal.hub .lm-seo-links a{
  padding:7px 13px;border-radius:999px;border:1px solid var(--cizgi);
  color:var(--murekkep);text-decoration:none;font-size:.85rem;
}
.legal.hub .lm-seo-links a:hover{
  border-color:var(--pirinc);background:rgba(176,134,52,.06);
}

/* Görsel olarak gizli etiket — ekran okuyucu okur, düzen değişmez.
   Yorum formundaki iki alanın yalnızca placeholder'ı vardı; yazı
   girilince kaybolduğu için WCAG 3.3.2'yi karşılamıyordu. */
.gorsel-gizli{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);
  white-space:nowrap;border:0;
}

/* Sepet formunun satır içi uyarısı (alert() yerine) */
.lm-form-uyari{
  display:none;margin:0 0 10px;padding:10px 13px;border-radius:9px;
  background:rgba(150,46,32,.07);border:1px solid rgba(150,46,32,.26);
  color:#8B2E21;font-size:.86rem;line-height:1.5;
}
.lm-form-uyari.acik{display:block}

/* Çerez şeridi: ölçümde ilk ekranın %19'unu kaplıyordu. Metin iki
   satıra indi, dolgu ve düğme yüksekliği sıkılaştırıldı. */
.cerez .cerez-ic{padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px))!important}
.cerez .cerez-yazi{font-size:.85rem!important;line-height:1.5!important;margin:0 0 10px!important}
.cerez .cerez-dugmeler{gap:8px!important}
.cerez .cerez-ret,.cerez .cerez-kabul{padding:10px 14px!important;font-size:.84rem!important}

/* ─────────────────────────────────────────────────────────────
   Hero kanıt şeridi — kendi kendine geçen beş satır + noktalar
   Ölçüm: ilk ekranda ürün, fiyat ya da güven işareti yoktu.
   Satırlar üst üste duruyor (grid), yalnızca .acik olan görünür;
   böylece şerit sabit yükseklikte kalıyor ve geçişte sayfa
   zıplamıyor (CLS 0).
   ───────────────────────────────────────────────────────────── */







/* DİKKAT: flex çocuğu olarak noktalar esneyip elips oluyordu —
   flex:none ve min/max ile kare tutuluyor. */



/* Dokunma hedefi görünenden büyük olsun (WCAG 2.5.8) */




@media (prefers-reduced-motion:reduce){
  
}

/* ── İçeriğe geç ──────────────────────────────────────────────
   Ekran okuyucuya hep açık, göze yalnızca odaklanınca. fixed:
   sayfanın neresinde olunursa olunsun görünür kalsın diye.
   Renkler !important: liste sayfalarında .skip-link'e marka dışı
   bir kahverengi dayatan eski bir kural var. */
.skip,.skip-link{position:fixed!important;left:-9999px;top:0;z-index:999}
.skip:focus,.skip-link:focus{left:16px;top:16px;padding:13px 20px;
  border-radius:10px;background:#F0C786!important;color:#11211B!important;
  font:600 .92rem/1 'Archivo',system-ui,sans-serif;text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  outline:3px solid #0A1711;outline-offset:2px}

/* Fiyatın yanındaki puan özeti — yorum yoksa hiç görünmez
   (hidden kaldırılmaz), boş bir kutu kalmasın. */
.p-rating{display:flex;align-items:center;gap:9px;margin:7px 0 2px;
  font:400 .88rem/1 'Archivo',system-ui,sans-serif}
.p-rating[hidden]{display:none}
.p-rating-yildiz{font-size:.95rem;letter-spacing:.06em}
.p-rating b{font-weight:600}
.p-rating a{color:inherit;opacity:.72;text-decoration:underline;
  text-underline-offset:3px}
.p-rating a:hover{opacity:1}

/* ═══════════════════════════════════════════════════════════════
   ÜRÜN SAYFASI — nota piramidi, bölüm ritmi, alt metin düzeni
   Hepsi .urun-sayfa altında kapsanıyor: liste ve makale sayfaları
   aynı gece.css'i yüklüyor, oralara sızmaması gerekiyor.
   ═══════════════════════════════════════════════════════════════ */

.urun-sayfa{
  /* Düz beyaz yerine sıcak kâğıt + çok hafif doku. Degrade sabit
     duruyor ki kaydırırken "zemin kayıyor" hissi olmasın. */
  background:
    radial-gradient(900px 520px at 78% -8%, rgba(201,138,60,.085), transparent 62%),
    radial-gradient(700px 480px at 6% 22%, rgba(17,42,32,.055), transparent 58%),
    linear-gradient(180deg,#FBFAF6 0%,#F5F2E9 46%,#F7F5EF 100%)!important;
  background-attachment:fixed!important;
}

/* ── Nota piramidi ──────────────────────────────────────────── */
.koku-piramidi{
  margin:clamp(34px,6vw,62px) 0;
  padding:clamp(26px,4.5vw,46px) clamp(20px,4vw,40px);
  border-radius:20px;
  background:
    radial-gradient(620px 300px at 20% 0%, rgba(201,138,60,.16), transparent 66%),
    linear-gradient(165deg,#13281F 0%,#0C1B14 58%,#101F18 100%);
  color:#EFEAD9;
  box-shadow:0 24px 60px -24px rgba(10,23,17,.55);
  position:relative;overflow:hidden;
}
.koku-piramidi::after{      /* ince altın çerçeve */
  content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  border:1px solid rgba(240,199,134,.17);
}
.np-etiket{
  margin:0 0 6px;font:600 .68rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.26em;text-transform:uppercase;color:#C98A3C;
}
.koku-piramidi h2{
  margin:0 0 clamp(22px,3.4vw,34px);
  font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:clamp(1.65rem,3.4vw,2.5rem);line-height:1.08;
  letter-spacing:-.02em;color:#F6F1E7;
}
.np-katman{
  padding:clamp(18px,2.6vw,24px) 0;
  border-top:1px solid rgba(240,199,134,.14);
}
.np-katman:first-of-type{border-top:0;padding-top:0}
.np-bas{margin:0 0 16px}
.np-bas h3{
  margin:0;font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:1.16rem;letter-spacing:.01em;color:#F0C786;
}
.np-bas p{
  margin:4px 0 0;font-size:.84rem;line-height:1.5;
  color:rgba(239,234,217,.62);max-width:52ch;
}
.np-liste{
  /* Izgara değil esnek dizi: bir katmanda tek nota olduğunda
     (çoğu "Kalp" katmanı öyle) auto-fill ızgara onu sola yapıştırıp
     yanında dört sütunluk boşluk bırakıyordu. */
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;gap:clamp(12px,1.8vw,20px);
}
.np-nota{flex:0 0 clamp(84px,9vw,104px)}
.np-nota{
  display:flex;flex-direction:column;align-items:center;gap:9px;
  text-align:center;
}
.np-cizim{
  /* Numune tabağı: açık renkli notalar (beyaz misk, yasemin) koyu
     zeminde kaybolmasın diye altlarında kendi kabı var. */
  width:76px;height:76px;border-radius:50%;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 38% 30%, rgba(255,255,255,.11), transparent 62%),
    linear-gradient(150deg,rgba(247,245,239,.10),rgba(247,245,239,.03));
  border:1px solid rgba(240,199,134,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 6px 18px -8px rgba(0,0,0,.5);
  transition:transform .32s cubic-bezier(.22,.7,.2,1),border-color .32s;
}
.np-nota:hover .np-cizim{transform:translateY(-3px);border-color:rgba(240,199,134,.42)}
.np-cizim svg{width:56px;height:56px;display:block}
.np-ad{
  font:500 .78rem/1.3 'Archivo',system-ui,sans-serif;
  color:rgba(239,234,217,.88);letter-spacing:.005em;
}
@media (max-width:560px){
  .np-liste{grid-template-columns:repeat(auto-fill,minmax(78px,1fr))}
  .np-cizim{width:64px;height:64px}
  .np-cizim svg{width:46px;height:46px}
  .np-ad{font-size:.73rem}
}
@media (prefers-reduced-motion:reduce){
  .np-nota:hover .np-cizim{transform:none}
}

/* ── Alt metin: bölüm ritmi ve okunabilirlik ────────────────── */
.urun-sayfa .urun-seo{
  margin:clamp(30px,5vw,54px) 0;
  padding:clamp(26px,4.4vw,46px) clamp(20px,4vw,40px);
  border-radius:20px;
  background:linear-gradient(170deg,#FFFDF8 0%,#FAF7EE 100%);
  border:1px solid rgba(17,33,27,.07);
  box-shadow:0 18px 46px -26px rgba(17,33,27,.22);
}
.urun-sayfa .urun-seo h2{
  margin:clamp(26px,3.6vw,38px) 0 12px;
  font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:clamp(1.3rem,2.5vw,1.72rem);line-height:1.14;
  letter-spacing:-.016em;color:#11211B;
  padding-bottom:10px;border-bottom:1px solid rgba(201,138,60,.22);
}
.urun-sayfa .urun-seo h2:first-child{margin-top:0}
.urun-sayfa .urun-seo p{
  margin:0 0 14px;font-size:1rem;line-height:1.72;
  color:#3C4842;max-width:68ch;
}
.urun-sayfa .urun-seo strong{color:#11211B;font-weight:600}
.urun-sayfa .urun-seo ul{margin:0 0 16px;padding-left:0;list-style:none;max-width:68ch}
.urun-sayfa .urun-seo ul li{
  position:relative;padding-left:22px;margin:0 0 9px;
  font-size:.97rem;line-height:1.66;color:#3C4842;
}
.urun-sayfa .urun-seo ul li::before{
  content:"";position:absolute;left:2px;top:.72em;
  width:7px;height:1.5px;background:#C98A3C;border-radius:1px;
}

/* "Açık olalım" kutusu — dürüstlük notu, göze çarpsın */
.urun-sayfa .acik-not,.urun-sayfa .seo-note{
  margin:22px 0 0;padding:16px 20px;border-radius:12px;
  background:rgba(201,138,60,.07);
  border-left:3px solid #C98A3C;
  font-size:.94rem;line-height:1.62;color:#3C4842;
}

/* ── Kullanım önerisi: etiket/değer çifti ──────────────────── */
.urun-sayfa .meta-row{
  display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  margin:14px 0 18px;
}
.urun-sayfa .meta-item{
  padding:14px 16px;border-radius:12px;
  background:rgba(17,42,32,.04);
  border:1px solid rgba(17,33,27,.08);
}
.urun-sayfa .meta-k{
  display:block;font:600 .64rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.2em;text-transform:uppercase;color:#7E5518;margin-bottom:7px;
}
.urun-sayfa .meta-v{
  display:block;font:500 1rem/1.3 'Archivo',system-ui,sans-serif;color:#11211B;
}

/* ── Performans çubukları ──────────────────────────────────── */
.urun-sayfa .perf-row{
  display:grid;grid-template-columns:minmax(72px,88px) 1fr auto;
  align-items:center;gap:14px;margin:0 0 13px;
}
@media (max-width:560px){
  /* 390 px'te üç sütun sığmıyor, değer alt satıra düşüp satırı
     44 px'e çıkarıyordu. Etiket ve değer üstte yan yana,
     çubuk altlarında tam genişlikte. */
  .urun-sayfa .perf-row{
    grid-template-columns:1fr auto;gap:5px 10px;margin-bottom:16px;
  }
  .urun-sayfa .perf-bar{grid-column:1 / -1;order:3}
  .urun-sayfa .perf-v{order:2;text-align:right}
}
.urun-sayfa .perf-k{
  font:600 .64rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.16em;text-transform:uppercase;color:#7E5518;
}
.urun-sayfa .perf-bar{
  height:7px;border-radius:4px;overflow:hidden;
  background:rgba(17,33,27,.09);
}
.urun-sayfa .perf-bar i{
  /* Tam genişlikte duruyor, doluluk transform ile veriliyor —
     tek kaynak. Ekrana girince gece.js scaleX'i çalıştırıyor. */
  display:block;height:100%;width:100%;border-radius:4px;
  transform:scaleX(0);transform-origin:left center;
  transition:transform .9s cubic-bezier(.22,.7,.2,1);
  background:linear-gradient(90deg,#C98A3C,#E6B468);
  box-shadow:0 1px 3px rgba(201,138,60,.4);
}
@media (prefers-reduced-motion:reduce){
  .urun-sayfa .perf-bar i{transition:none}
}
.urun-sayfa .perf-v{
  font:500 .84rem/1 'Archivo',system-ui,sans-serif;color:#3C4842;white-space:nowrap;
}

/* ── SSS ───────────────────────────────────────────────────── */
.urun-sayfa .urun-sss details{
  border-bottom:1px solid rgba(17,33,27,.09);
}
.urun-sayfa .urun-sss summary{
  padding:17px 34px 17px 0;cursor:pointer;position:relative;
  font:500 1rem/1.45 'Archivo',system-ui,sans-serif;color:#11211B;
  list-style:none;
}
.urun-sayfa .urun-sss summary::-webkit-details-marker{display:none}
.urun-sayfa .urun-sss summary::after{
  content:"";position:absolute;right:6px;top:50%;
  width:9px;height:9px;margin-top:-6px;
  border-right:1.6px solid #7E5518;border-bottom:1.6px solid #7E5518;
  transform:rotate(45deg);transition:transform .25s;
}
.urun-sayfa .urun-sss details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.urun-sayfa .urun-sss details p{
  margin:0 0 17px;font-size:.96rem;line-height:1.68;color:#3C4842;max-width:68ch;
}

/* ── Küçük dokunuşlar ──────────────────────────────────────── */
.urun-sayfa .sec-title{
  font:600 .68rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.24em;text-transform:uppercase;color:#7E5518;
  margin:30px 0 13px;
}
.urun-sayfa .trustline{
  background:rgba(17,42,32,.045)!important;
  border:1px solid rgba(17,33,27,.08);
  border-radius:12px;
}

/* ── Uzun içerik bandı ──────────────────────────────────────────
   .pwrap iki sütunlu ızgara: solda şişe, sağda satın alma bloğu.
   Uzun içerik (piramit, metin, SSS, yorumlar, benzerler) o dar
   sütunda kalırsa 1280 px ekranda solda 448 px boş kalıyor.
   Bu kap ızgaranın dışında, tam genişlikte. */
.urun-sayfa .urun-alt{
  max-width:1180px;margin:0 auto;
  padding:0 clamp(16px,4vw,24px) clamp(40px,6vw,72px);
}
.urun-sayfa .urun-alt .sec-title{margin-top:38px}
.urun-sayfa .urun-alt .rel-scroll{
  display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(176px,1fr));
  overflow:visible;
}
.urun-sayfa .urun-alt .rv-wrap{max-width:860px}
.urun-sayfa .urun-alt .kume-serit{margin-top:34px}
@media (max-width:860px){
  .urun-sayfa .urun-alt{padding-left:16px;padding-right:16px}
  .urun-sayfa .urun-alt .rel-scroll{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }
  .urun-sayfa .urun-alt .rel-scroll>*{flex:0 0 62%;scroll-snap-align:start}
}

/* SEO metnindeki üç satırlık nota özeti — görsel piramidin yazılı
   karşılığı. Ekran okuyucu ve arama motoru için duruyor; kutuya
   gerek yok, sade bir liste yeterli. */
.urun-sayfa .urun-seo ul.nota-piramit{margin:4px 0 18px;max-width:68ch}
.urun-sayfa .urun-seo ul.nota-piramit li{
  padding-left:0;margin:0 0 11px;
  border-left:2px solid rgba(201,138,60,.3);padding:2px 0 2px 15px;
}
.urun-sayfa .urun-seo ul.nota-piramit li::before{display:none}
.urun-sayfa .urun-seo ul.nota-piramit b{
  color:#7E5518;font-weight:600;letter-spacing:.01em;
}

/* ═══════════════════════════════════════════════════════════════
   VİTRİN — ana sayfa, görselli kayan şerit
   Her slaydın sahnesi ürünün KENDİ notalarından kuruluyor; 283
   ürün aynı iki şişe fotoğrafını paylaştığı için fotoğrafla vitrin
   kurmak altı kez aynı kareyi göstermek olurdu.
   ═══════════════════════════════════════════════════════════════ */
.vitrin{
  position:relative;padding:clamp(52px,8vw,96px) 0;
  background:
    radial-gradient(760px 420px at 82% 6%, rgba(201,138,60,.10), transparent 64%),
    linear-gradient(180deg,#0A1711 0%,#0D1D15 52%,#0A1711 100%);
  color:#EFEAD9;overflow:hidden;
}
.v-bas{margin:0 0 clamp(22px,3.4vw,34px)}
.v-etiket{
  margin:0 0 7px;font:600 .68rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.26em;text-transform:uppercase;color:#C98A3C;
}
.vitrin .bolum-baslik{margin:0;color:#F6F1E7}

/* ── slayt alanı ── */
.v-liste{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-areas:"v";
  min-height:clamp(330px,42vw,420px);
}
.v-slayt{
  grid-area:v;opacity:0;visibility:hidden;transform:translateY(16px) scale(.985);
  transition:opacity .62s cubic-bezier(.22,.7,.2,1),
             transform .62s cubic-bezier(.22,.7,.2,1),visibility .62s;
}
.v-slayt.acik{opacity:1;visibility:visible;transform:none}

.v-kart{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  align-items:stretch;gap:clamp(20px,3.4vw,44px);
  text-decoration:none;color:inherit;height:100%;
  border-radius:20px;overflow:hidden;
  background:rgba(247,245,239,.035);
  border:1px solid rgba(240,199,134,.14);
}
.v-kart:hover{border-color:rgba(240,199,134,.34)}
.v-kart:focus-visible{outline:3px solid #F0C786;outline-offset:3px}

/* ── sahne: nota çizimlerinden kurulu görsel ── */
.v-sahne{
  position:relative;min-height:clamp(220px,28vw,420px);
  background:linear-gradient(152deg,var(--r1) 0%,var(--r2) 100%);
  overflow:hidden;
}
.v-isik{
  position:absolute;inset:0;
  background:
    radial-gradient(440px 320px at 28% 18%,
      color-mix(in srgb,var(--vurgu) 30%,transparent), transparent 66%),
    radial-gradient(320px 260px at 86% 82%,
      color-mix(in srgb,var(--vurgu) 14%,transparent), transparent 70%);
}
.v-sahne::after{      /* ince kumaş dokusu — düz degradeyi kırıyor */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:
    repeating-linear-gradient(115deg,rgba(255,255,255,.028) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(25deg,rgba(0,0,0,.035) 0 1px,transparent 1px 5px);
}
.v-oge{
  position:absolute;display:block;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.42));
  transition:transform .7s cubic-bezier(.22,.7,.2,1);transition-delay:var(--gec);
}
.v-oge svg{display:block;width:100%;height:auto}
/* Sahne yerleşimi: ilk denemede üçü de küçük kalıp panelin
   yarısını boş bırakıyordu. Büyütüldü ve köşelere yayıldı;
   en büyük öğe sol üstte ağırlık merkezi oluyor. */
.v-buyuk{width:54%;left:4%;top:8%}
.v-orta {width:40%;right:4%;top:38%}
.v-kucuk{width:31%;left:30%;bottom:2%}
.v-kart:hover .v-buyuk{transform:translateY(-7px) rotate(-2deg)}
.v-kart:hover .v-orta {transform:translateY(-5px) rotate(3deg)}
.v-kart:hover .v-kucuk{transform:translateY(-4px)}

/* ── metin ── */
.v-metin{
  padding:clamp(22px,3.2vw,40px) clamp(20px,3vw,38px);
  display:flex;flex-direction:column;justify-content:center;gap:11px;
}
.v-ust{
  margin:0;font:600 .64rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.22em;text-transform:uppercase;color:#C98A3C;
}
.v-ad{
  margin:0;font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.08;
  letter-spacing:-.02em;color:#F6F1E7;
}
.v-ad span{
  display:block;font-family:'Archivo',system-ui,sans-serif;
  font-size:.56em;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(239,234,217,.6);margin-bottom:5px;
}
.v-ad em{font-style:italic;color:#F0C786}
.v-nota{
  margin:0;font-size:.9rem;line-height:1.55;
  color:rgba(239,234,217,.68);max-width:36ch;
}
.v-fiyat{margin:5px 0 0;display:flex;align-items:baseline;gap:11px;flex-wrap:wrap}
.v-fiyat b{
  font-family:'Bodoni Moda',Georgia,serif;font-size:1.72rem;
  font-weight:600;color:#F0C786;letter-spacing:-.01em;
}
.v-kat{font-size:.82rem;color:rgba(239,234,217,.46);text-decoration:line-through}
.v-git{
  margin-top:8px;display:inline-flex;align-items:center;gap:9px;
  font:600 .86rem/1 'Archivo',system-ui,sans-serif;color:#F0C786;
}
.v-git i{
  width:22px;height:1.4px;background:currentColor;display:block;
  transition:width .3s cubic-bezier(.22,.7,.2,1);
}
.v-kart:hover .v-git i{width:36px}

/* ── kontroller ── */
.v-kontrol{
  margin-top:clamp(18px,2.6vw,28px);
  display:flex;align-items:center;justify-content:center;gap:16px;
}
.v-noktalar{display:flex;align-items:center;gap:9px}
.v-nokta{
  flex:0 0 auto;width:8px;height:8px;min-width:8px;min-height:8px;
  max-width:8px;max-height:8px;padding:0!important;border-radius:50%;
  background:transparent;border:1px solid rgba(240,199,134,.45);
  cursor:pointer;appearance:none;-webkit-appearance:none;
  transition:background .3s,border-color .3s,transform .3s;
}
.v-nokta.acik{background:#F0C786;border-color:#F0C786;transform:scale(1.2)}
.v-nokta:focus-visible{outline:2px solid #F0C786;outline-offset:3px}
.v-ok{
  width:42px;height:42px;border-radius:50%;cursor:pointer;
  background:transparent;border:1px solid rgba(240,199,134,.26);
  display:grid;place-items:center;position:relative;
  transition:border-color .25s,background .25s;
}
.v-ok:hover{border-color:rgba(240,199,134,.6);background:rgba(240,199,134,.08)}
.v-ok:focus-visible{outline:2px solid #F0C786;outline-offset:3px}
.v-ok::before{
  content:"";width:9px;height:9px;
  border-top:1.6px solid #F0C786;border-right:1.6px solid #F0C786;
}
.v-geri::before{transform:rotate(-135deg);margin-left:3px}
.v-ileri::before{transform:rotate(45deg);margin-right:3px}

@media (max-width:820px){
  .v-kart{grid-template-columns:1fr}
  .v-sahne{min-height:200px}
  .v-buyuk{width:46%;left:5%;top:6%}
  .v-orta{width:34%;right:6%;top:34%}
  .v-kucuk{width:26%;left:32%;bottom:2%}
  .v-liste{min-height:0}
  .v-metin{padding:20px 20px 24px}
}
@media (prefers-reduced-motion:reduce){
  .v-slayt{transition:opacity .2s}
  .v-oge,.v-git i{transition:none}
  .v-kart:hover .v-buyuk,.v-kart:hover .v-orta,.v-kart:hover .v-kucuk{transform:none}
}

/* ── Hero kanıt şeridi — artık dönmüyor ────────────────────────
   Dönen metin şeridinin yerini aşağıdaki görselli vitrin aldı.
   Aynı ekranda iki ayrı şey dönerse ikisi de okunmuyor; kanıtlar
   tek sırada hep görünür duruyor, kayan olan vitrin. */
.kanit{
  list-style:none;margin:clamp(22px,4vh,38px) auto 0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:7px clamp(14px,2.4vw,28px);max-width:62ch;
}
.kanit li{
  display:flex;align-items:baseline;gap:7px;
  font:400 .84rem/1.4 'Archivo',system-ui,sans-serif;
  color:rgba(239,234,217,.6);white-space:nowrap;
}
.kanit li+li::before{
  content:"";width:3px;height:3px;border-radius:50%;
  background:rgba(240,199,134,.42);margin-right:clamp(14px,2.4vw,28px);
  align-self:center;
}
.kanit b{
  font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:1rem;color:#F0C786;letter-spacing:.005em;
}
@media (max-width:560px){
  .kanit{gap:5px 12px;max-width:34ch}
  .kanit li{font-size:.78rem}
  .kanit li+li::before{margin-right:12px}
  .kanit b{font-size:.92rem}
}

/* ── Parfüm kodları tablosu ─────────────────────────────────────
   283 satır düz HTML olarak geliyor (Google JavaScript beklemeden
   görsün diye); süzme JS varsa üstüne biniyor. */
.kod-sayfa .lead{font-size:1.06rem;line-height:1.7;max-width:70ch}
.kod-ara-sar{margin:26px 0 8px;position:relative}
#kod-ara{
  width:100%;max-width:560px;padding:15px 18px;border-radius:12px;
  border:1px solid rgba(17,33,27,.16);background:#fff;
  font:400 1rem/1.3 'Archivo',system-ui,sans-serif;color:#11211B;
}
#kod-ara:focus{outline:3px solid rgba(201,138,60,.5);outline-offset:2px;
  border-color:#C98A3C}
.kod-sonuc{margin:9px 0 0;font-size:.88rem;color:#6b7570;min-height:1.3em}
.kod-atla{margin:18px 0 30px;font-size:.92rem;color:#4a564f}
.kod-atla a{color:#7E5518;text-decoration:underline;text-underline-offset:3px}

.kod-sayfa h2{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.kod-say{
  font:600 .62rem/1 'Archivo',system-ui,sans-serif;letter-spacing:.18em;
  text-transform:uppercase;color:#7E5518;
  background:rgba(201,138,60,.1);padding:5px 10px;border-radius:999px;
}
.kod-not{margin:0 0 14px;font-size:.94rem;color:#4a564f}
.kod-not a{color:#7E5518;font-weight:500}

.kod-sar{
  margin:0 0 42px;border:1px solid rgba(17,33,27,.1);border-radius:14px;
  overflow:hidden;background:#fff;
}
.kod-tablo{width:100%;border-collapse:collapse;font-size:.93rem}
.kod-tablo th{
  text-align:left;padding:13px 14px;background:#11211B;color:#F0C786;
  font:600 .62rem/1.2 'Archivo',system-ui,sans-serif;
  letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;
  position:sticky;top:0;z-index:2;
}
.kod-tablo td{padding:11px 14px;border-top:1px solid rgba(17,33,27,.07);vertical-align:middle}
.kod-tablo tr:nth-child(even) td{background:rgba(17,42,32,.022)}
.kod-tablo tr:hover td{background:rgba(201,138,60,.07)}
.kod-tablo a{color:inherit;text-decoration:none}
.kod-tablo a:hover{text-decoration:underline;text-underline-offset:3px}
.kod-k{width:1%;white-space:nowrap}
.kod-k a{
  display:inline-block;font:600 .84rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.06em;color:#7E5518;
  background:rgba(201,138,60,.11);padding:7px 11px;border-radius:7px;
}
.kod-a b{font-weight:600;color:#11211B}
.kod-c,.kod-f{color:#6b7570;white-space:nowrap}
.kod-p{text-align:right;white-space:nowrap;font-weight:600;color:#11211B}
.kod-tablo tr[hidden]{display:none}

@media (max-width:720px){
  /* Dar ekranda tablo satırı karta dönüyor: yatay kaydırma yerine
     her kayıt kendi bloğunda okunuyor. */
  .kod-tablo thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .kod-tablo tr{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;
    padding:12px 14px;border-top:1px solid rgba(17,33,27,.07)}
  .kod-tablo tr:nth-child(even) td{background:transparent}
  .kod-tablo td{border:0;padding:0}
  .kod-k{grid-row:1 / span 2}
  .kod-a{align-self:center}
  .kod-c,.kod-f,.kod-p{display:inline;font-size:.82rem}
  .kod-c::after{content:" · "}
  .kod-f::after{content:" · "}
  .kod-p{text-align:left}
}

/* ═══════════════════════════════════════════════════════════════
   ÖDEME SAYFASI
   ═══════════════════════════════════════════════════════════════ */
.odeme-adim{
  list-style:none;display:flex;gap:10px;margin:0 0 clamp(22px,4vw,34px);padding:0;
  flex-wrap:wrap;
}
.odeme-adim li{
  display:flex;align-items:center;gap:9px;
  font:500 .88rem/1 'Archivo',system-ui,sans-serif;color:#8d968f;
  padding:9px 15px 9px 9px;border-radius:999px;
  border:1px solid rgba(17,33,27,.1);background:#fff;
}
.odeme-adim li b{
  width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  background:rgba(17,33,27,.08);color:#6b7570;font-size:.78rem;font-weight:600;
}
.odeme-adim li.acik{color:#11211B;border-color:rgba(201,138,60,.45)}
.odeme-adim li.acik b{background:#C98A3C;color:#11211B}

.odeme-duzen{
  display:grid;gap:clamp(20px,3.4vw,38px);
  grid-template-columns:minmax(0,1.35fr) minmax(260px,.9fr);
  align-items:start;
}
@media (max-width:860px){
  .odeme-duzen{grid-template-columns:1fr}
  .of-ozet{order:-1}
}

/* ── form ── */
.of-satir{margin:0 0 16px}
.of-ikili{display:grid;gap:0 16px;grid-template-columns:1fr 1fr}
@media (max-width:560px){.of-ikili{grid-template-columns:1fr}}
.of-satir label{
  display:block;margin:0 0 6px;
  font:600 .68rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.14em;text-transform:uppercase;color:#7E5518;
}
.of-satir label span{text-transform:none;letter-spacing:0;color:#8d968f;font-weight:400}
.of-satir input,.of-satir textarea{
  width:100%;padding:13px 15px;border-radius:10px;
  border:1px solid rgba(17,33,27,.16);background:#fff;color:#11211B;
  font:400 1rem/1.4 'Archivo',system-ui,sans-serif;
}
.of-satir textarea{resize:vertical;min-height:84px}
.of-satir input:focus,.of-satir textarea:focus{
  outline:3px solid rgba(201,138,60,.45);outline-offset:1px;border-color:#C98A3C;
}
.of-satir input.is-error,.of-satir textarea.is-error{
  border-color:#962E20;background:rgba(150,46,32,.04);
}
.of-satir small{display:block;margin-top:6px;font-size:.8rem;color:#8d968f}

.of-onay{
  display:flex;gap:11px;align-items:flex-start;margin:20px 0;
  font-size:.92rem;line-height:1.55;color:#3C4842;
}
.of-onay input{width:19px;height:19px;flex:0 0 19px;margin-top:2px;accent-color:#C98A3C}
.of-onay a{color:#7E5518;text-decoration:underline;text-underline-offset:3px}

.of-gonder{width:100%;justify-content:center;margin-top:4px}
.of-gonder:disabled{opacity:.6;cursor:wait}
.of-guven{
  margin:14px 0 0;font-size:.84rem;line-height:1.6;color:#6b7570;text-align:center;
}
.of-guven b{color:#11211B}

/* ── sipariş özeti ── */
.of-ozet{
  padding:clamp(18px,2.6vw,26px);border-radius:16px;
  background:linear-gradient(170deg,#FFFDF8,#F6F2E8);
  border:1px solid rgba(17,33,27,.09);
  position:sticky;top:calc(var(--bar,68px) + 16px);
}
.of-ozet h3{
  margin:0 0 14px;font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:1.2rem;color:#11211B;
}
.oz-liste{list-style:none;margin:0 0 14px;padding:0}
.oz-liste li{
  display:flex;justify-content:space-between;gap:12px;align-items:baseline;
  padding:9px 0;border-bottom:1px solid rgba(17,33,27,.07);
  font-size:.9rem;color:#3C4842;
}
.oz-liste small{display:block;color:#8d968f;font-size:.78rem;margin-top:2px}
.oz-liste b{white-space:nowrap;color:#11211B}
.oz-toplam{margin:0;font-size:.92rem}
.oz-toplam div{display:flex;justify-content:space-between;padding:6px 0;color:#3C4842}
.oz-toplam dt,.oz-toplam dd{margin:0}
.oz-ind dd{color:#2E6B4F}
.oz-genel{
  margin-top:8px;padding-top:12px!important;
  border-top:1px solid rgba(17,33,27,.14);
}
.oz-genel dt{font-weight:600;color:#11211B}
.oz-genel dd{
  font-family:'Bodoni Moda',Georgia,serif;font-size:1.35rem;
  font-weight:600;color:#11211B;
}
.oz-not{margin:12px 0 0;font-size:.8rem;line-height:1.5;color:#8d968f}

/* ── PayTR çerçevesi ── */
#paytriframe{min-height:620px;border:0;border-radius:14px;background:#fff}
.of-yukleniyor{
  padding:46px 20px;text-align:center;color:#6b7570;font-size:.94rem;
  background:#fff;border:1px solid rgba(17,33,27,.09);border-radius:14px;
}
.of-geri{margin-top:16px;text-align:center}
.of-link{
  background:none;border:0;cursor:pointer;color:#7E5518;
  font:500 .92rem/1 'Archivo',system-ui,sans-serif;
  text-decoration:underline;text-underline-offset:3px;padding:8px;
}

/* ── sonuç sayfaları ── */
.odeme-sonuc{text-align:center}
.odeme-sonuc .lead,.odeme-sonuc p{margin-left:auto;margin-right:auto}
.odeme-sonuc h2,.odeme-sonuc ol,.odeme-sonuc ul,.odeme-sonuc .acik-not{text-align:left}
.os-isaret{
  width:66px;height:66px;margin:0 auto 20px;border-radius:50%;
  display:grid;place-items:center;font-size:2rem;font-weight:600;
}
.os-ok{background:rgba(46,107,79,.12);color:#2E6B4F}
.os-hata{background:rgba(150,46,32,.1);color:#962E20}

/* Sepet çekmecesinde kartla ödeme düğmesi — birincil eylem */
.lm-cart-kart{
  background:linear-gradient(135deg,#C98A3C,#A96F28)!important;
  color:#11211B!important;border-color:transparent!important;
  margin-bottom:9px;font-weight:600;
}
.lm-cart-kart::after{content:' 🔒';font-size:.85em}
.lm-cart-kart:hover{filter:brightness(1.06)}

/* ═══════════════════════════════════════════════════════════════
   TESTER BOY SEÇENEKLERİ
   50/100 ml ile aynı ızgarada ama görsel olarak ayrı bir kademe:
   müşteri bunun tam boy değil deneme boyu olduğunu kart üstünde
   görsün diye daha sakin, kesik çerçeveli.
   ═══════════════════════════════════════════════════════════════ */
.boy-grid{grid-template-columns:repeat(auto-fit,minmax(132px,1fr))}
.boy-card.boy-tester{
  border-style:dashed!important;
  background:rgba(201,138,60,.04)!important;
}
.boy-card.boy-tester .boy-ml::after{
  content:' tester';font-size:.62em;letter-spacing:.1em;
  text-transform:uppercase;color:#7E5518;font-weight:600;
}
.boy-card.boy-tester.boy-on{
  border-style:solid!important;
  background:rgba(201,138,60,.1)!important;
}
.boy-tester-not{
  display:block;margin-top:6px;font-size:.82em;color:#8d968f;line-height:1.5;
}
@media (max-width:420px){
  .boy-grid{grid-template-columns:1fr 1fr}
}

/* ═══════════════════════════════════════════════════════════════
   MOBİL ALTLIK — AKORDEON
   390 px ekranda 4 sütunlu ızgara zorlanıyordu: sütunlar 78-158 px
   kalıyor, her bağlantı iki satıra kırılıyor ve altlık 1256 px'e,
   yani 1,5 ekran boyuna çıkıyordu. İletişim sütunu da taşıp
   kesiliyordu.
   Mobilde tek sütun + katlanır başlıklar. Bağlantılar DOM'da
   duruyor (yalnızca CSS ile kapalı), arama motoru görmeye devam
   ediyor; site yapısı bozulmuyor.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  /* Izgara footer'ın KENDİSİNDE (ana sayfa) ya da .foot-in
     sarmalayıcısında (diğer sayfalar). İkisi de tek sütuna. */
  body > footer,
  body > footer > div:not(.foot-col),
  body > footer .foot-in {
    display: block !important;
    grid-template-columns: none !important;
  }
  footer .foot-col,
  footer .foot-in > div {
    border-top: 1px solid rgba(255,255,255,.09);
    padding: 0;
    margin: 0;
    min-width: 0;
  }
  /* Marka bloğu her zaman açık, başlıksız */
  footer .foot-col:first-of-type,
  footer .foot-in > div:first-child {
    border-top: 0;
    padding-bottom: 18px;
  }

  footer .foot-col > h3,
  footer .foot-in > div > .foot-t {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    margin: 0 !important;
    padding: 16px 2px !important;
    cursor: pointer;
    user-select: none;
  }
  footer .foot-col > h3::after,
  footer .foot-in > div > .foot-t::after {
    content: '';
    width: 8px; height: 8px;
    border-right: 1.6px solid currentColor;
    border-bottom: 1.6px solid currentColor;
    transform: rotate(45deg) translate(-2px,-2px);
    transition: transform .22s cubic-bezier(.2,.7,.2,1);
    opacity: .6;
  }
  footer [data-alt-acik] > h3::after,
  footer [data-alt-acik] > .foot-t::after {
    transform: rotate(-135deg) translate(-2px,-2px);
  }

  /* Katlanan gövde */
  footer .foot-col > ul,
  footer .foot-col > p,
  footer .foot-in > div > a,
  footer .foot-in > div > p,
  footer .foot-in > div > br {
    display: none;
  }
  /* Gösterme kuralları gizleme kurallarıyla EN AZ AYNI özgüllükte
     olmalı. Önce "footer [data-alt-acik] > a" yazılmıştı (0,1,2);
     gizleyen "footer .foot-in > div > a" (0,1,3) daha özgül olduğu
     için sütun açıldığında bağlantılar yine gizli kalıyordu. */
  footer .foot-col[data-alt-acik] > ul,
  footer .foot-col[data-alt-acik] > p,
  footer .foot-in > div[data-alt-acik] > p { display: block; }
  footer .foot-in > div[data-alt-acik] > a { display: block; }
  footer .foot-in > div[data-alt-acik] > br { display: initial; }

  /* İlk sütun (marka bloğu) BAŞLIKSIZ ve her zaman açık — ona
     data-alt-acik verilmiyor. Katlama kuralları yüzünden içindeki
     <br> ve bağlantılar gizli kalıyordu: satır sonları kaybolduğu
     için "kargo3-4 iş gününde teslim" diye bitişik yazıyor, telefon
     ve Instagram bağlantıları ise mobilde hiç görünmüyordu.
     Özgüllük, gizleyen kuraldan (0,1,3) yüksek olsun diye
     :first-child ile yazıldı. */
  footer .foot-in > div:first-child > a,
  footer .foot-col:first-of-type > ul,
  footer .foot-col:first-of-type > p { display: block; }
  footer .foot-in > div:first-child > br { display: initial; }

  /* İlk sütun açılır değil; başlığındaki ok işareti yanıltıcı. */
  footer .foot-col:first-of-type > h3::after,
  footer .foot-in > div:first-child > .foot-t::after { display: none; }

  footer .foot-col > ul { margin: 0 0 14px; padding: 0; }
  footer .foot-col li { margin: 0; }
  /* Buraya display YAZILMIYOR: gizleme kuralından sonra geldiği
     için display:block yazmak kapalı sütunları geri açıyordu.
     Görünürlüğü yukarıdaki gizle/göster çifti yönetiyor. */
  footer .foot-col li a,
  footer .foot-in > div > a {
    padding: 9px 2px;          /* dokunma hedefi */
    white-space: normal;
    overflow-wrap: anywhere;   /* uzun e-posta taşmasın */
  }
}

/* Marka sayfalarındaki fiyat karşılaştırma tablosu */
.kume-zengin{margin:clamp(28px,5vw,46px) 0 0}
.kume-zengin h2{
  font-family:'Bodoni Moda',Georgia,serif;font-weight:600;
  font-size:clamp(1.15rem,2.4vw,1.5rem);margin:clamp(24px,4vw,34px) 0 12px;
}
.kume-zengin p{line-height:1.75;margin:0 0 14px}
.kiyas-tablo{
  width:100%;border-collapse:collapse;font-size:.92rem;
  background:#fff;border-radius:12px;overflow:hidden;
}
.kiyas-tablo th{
  text-align:left;padding:11px 12px;background:rgba(17,33,27,.05);
  font:600 .72rem/1 'Archivo',system-ui,sans-serif;
  letter-spacing:.1em;text-transform:uppercase;color:#7E5518;
  white-space:nowrap;
}
.kiyas-tablo td{padding:11px 12px;border-top:1px solid rgba(17,33,27,.07)}
.kiyas-tablo td:nth-child(2){text-decoration:line-through;opacity:.55}
.kiyas-tablo td:nth-child(3){font-weight:600}
.kiyas-tablo td:last-child{color:#2E6B4F;font-weight:600;white-space:nowrap}
.kume-zengin .tablo-sar{overflow-x:auto;margin:0 0 14px;-webkit-overflow-scrolling:touch}
.secim-liste{margin:0 0 14px;padding-left:20px;line-height:1.85}
.secim-liste li{margin:0 0 6px}

/* Sipariş sonrası Google yorum çağrısı */
.yorum-cagri{
  margin:clamp(26px,4vw,38px) 0;padding:clamp(20px,3vw,28px);
  border-radius:16px;background:linear-gradient(170deg,#FFFDF8,#F6F2E8);
  border:1px solid rgba(201,138,60,.3);text-align:left;
}
.yorum-cagri h2{margin:0 0 10px;font-size:1.1rem}
.yorum-cagri p{margin:0 0 12px;line-height:1.7}
.yorum-cagri p:last-child{margin:0}