/* ==========================================================================
   Ankara Lipödem — Vitrin stil dosyası
   Temel: tasarim-9 (Sade & Aranabilir) — beyaz, modern, küçük animasyonlar.
   Renkler: Karaca Medikal kırmızısı + lacivert.

   ── Tasarım kararları (tek yerden yönetilir) ────────────────────────────
   Vurgu rengi : --bordo (kırmızı) — tek hue, geri kalan nötr/çizgi
   Köşe kişiliği: yumuşak (8px kart · 6px buton/input · hap yalnız etiket)
   Yazı çifti  : Cormorant Garamond (başlık) + Inter (gövde)
   Boşluk      : 4·8·12·16·24·32·48·64·96 (8px ızgara)
   Tipografi   : 12 · 13 · 14 · 16 · 18 · 22 · 28 · clamp(başlıklar)
   Gölge       : tek yön, ≤%8 opaklık, 3 kademe
   ─────────────────────────────────────────────────────────────────────── */

@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-var-latin.woff2") format("woff2");font-weight:300 700;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* latin-ext yalnız Türkçe'nin latin-ext'e düşen 4 harfi için (ğ Ğ ş Ş) */
@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-tr-ext.woff2") format("woff2");font-weight:300 700;font-display:swap;
  unicode-range:U+011E,U+011F,U+015E,U+015F}
@font-face{font-family:Inter;src:url("../fonts/inter-var-latin.woff2") format("woff2");font-weight:100 900;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;src:url("../fonts/inter-tr-ext.woff2") format("woff2");font-weight:100 900;font-display:swap;
  unicode-range:U+011E,U+011F,U+015E,U+015F}

:root{
  /* ── Renk: tek vurgu (kırmızı), geri kalan sıcak nötr ─────────── */
  --bordo:#C2261D;          /* vurgu — metin olarak da geçer (4.9:1) */
  --bordo-koyu:#9E1D15;
  --lacivert:#1E3A6E;       /* yapı rengi — buton, başlık, ikon */
  --lacivert-koyu:#16294d;

  --metin:#1F1F21;          /* rafine siyah, #000 değil */
  --metin-2:#4A4A50;
  --mut:#6A6A71;            /* ikincil metin — 5.4:1 beyazda */
  --mut-acik:#6E6E75;       /* üçüncül — krem zeminde 4.5:1 üstü */

  --cizgi:#E8E3DB;
  --cizgi-hover:#CFC7B8;
  --cizgi-acik:#F0EDE7;
  --zemin:#FFFFFF;
  --zemin-2:#F7F5F1;        /* panel bandı */
  --zemin-3:#FBF9F6;        /* krem bandı */

  /* ── Odak ─────────────────────────────────────────────────────── */
  --odak:#0B5FD6;
  --odak-yumusak:rgba(11,95,214,.14);

  /* ── Boşluk: 8px ızgara ───────────────────────────────────────── */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px;

  /* ── Köşe: tek kişilik (yumuşak) ──────────────────────────────── */
  --r-kart:12px; --r-kontrol:8px; --r-hap:999px; --r-kucuk:6px;

  /* ── Gölge: tek yön, düşük opaklık ────────────────────────────── */
  --golge-1:0 1px 2px rgba(31,31,33,.04), 0 2px 6px rgba(31,31,33,.04);
  --golge-2:0 2px 6px rgba(31,31,33,.05), 0 8px 20px rgba(31,31,33,.06);
  --golge-3:0 4px 12px rgba(31,31,33,.06), 0 16px 40px rgba(31,31,33,.08);

  /* ── Hareket ──────────────────────────────────────────────────── */
  --gecis:200ms cubic-bezier(.22,.61,.36,1);
  --wrap:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;background:var(--zemin);color:var(--metin);
  line-height:1.6;-webkit-font-smoothing:antialiased;font-size:17px;
}
h1,h2,h3,h4{font-family:"Cormorant Garamond",Georgia,serif;line-height:1.14;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(34px,5.4vw,56px);line-height:1.08;letter-spacing:-.02em}
h2{font-size:clamp(26px,3.4vw,38px)}
h3{font-size:22px;line-height:1.25}
h4{font-size:18px;line-height:1.3;font-family:Inter,sans-serif;font-weight:700;letter-spacing:0}
p{text-wrap:pretty}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--odak);outline-offset:3px;border-radius:var(--r-kucuk)}

/* İçeriğe geç — odaklanınca görünür */
.atla{position:absolute;left:-9999px;top:var(--s2);z-index:100;background:var(--lacivert);color:#fff;
  padding:var(--s3) var(--s5);border-radius:var(--r-kontrol);font-weight:600}
.atla:focus{left:var(--s4);outline:2px solid var(--odak);outline-offset:3px}

/* ── Yerleşim ─────────────────────────────────────────────────────── */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s5)}
.bolum{padding:clamp(56px,7vw,96px) 0}
.bolum--panel{background:var(--zemin-2)}
.bolum--krem{background:var(--zemin-3)}
.izgara{display:grid;gap:var(--s5)}
.izgara--2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.izgara--3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.izgara--4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
@media (max-width:620px){.izgara{grid-template-columns:1fr}}

/* ── Bölüm başlıkları ─────────────────────────────────────────────── */
.micro{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--bordo);font-feature-settings:"case"}
.kafa{max-width:62ch;margin-bottom:clamp(32px,4vw,48px)}
.kafa--orta{margin-left:auto;margin-right:auto;text-align:center}
.kafa h2{margin-top:var(--s3)}
.kafa p{color:var(--metin-2);margin-top:var(--s3);font-size:17px}

/* ── Üst bar ──────────────────────────────────────────────────────── */
.ust{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--cizgi)}
.ust-ic{display:flex;align-items:center;gap:var(--s4);min-height:76px}
.marka{display:flex;align-items:center;gap:var(--s3);margin-right:auto;padding:var(--s1);border-radius:var(--r-kontrol);transition:background var(--gecis)}
.marka:hover{background:var(--zemin-2)}
.marka img{height:44px;width:auto}
.marka span{display:flex;flex-direction:column;line-height:1.2}
.marka b{font-family:"Cormorant Garamond",serif;font-size:21px;font-weight:700;color:var(--lacivert);letter-spacing:-.01em}
.marka small{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--mut);font-weight:500}
.menu{display:flex;align-items:center;gap:var(--s1)}
.menu a{padding:10px var(--s3);border-radius:var(--r-kucuk);font-size:16px;font-weight:500;color:var(--metin-2);white-space:nowrap;transition:background var(--gecis),color var(--gecis)}
.menu a:hover{background:var(--zemin-2);color:var(--lacivert)}
.menu a.aktif{color:var(--lacivert);font-weight:600}
.ust-tel{display:inline-flex;align-items:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:var(--r-kontrol);
  background:var(--lacivert);color:#fff;font-weight:600;font-size:16px;font-variant-numeric:tabular-nums;white-space:nowrap;flex:0 0 auto;
  transition:background var(--gecis),transform var(--gecis)}
.ust-tel:hover{background:var(--lacivert-koyu);transform:translateY(-1px)}
.ust-tel svg{width:18px;height:18px}
.menu-dugme{display:none;width:48px;height:48px;border:1px solid var(--cizgi);border-radius:var(--r-kontrol);background:#fff;cursor:pointer;
  align-items:center;justify-content:center;gap:var(--s2);transition:background var(--gecis),border-color var(--gecis)}
.menu-dugme:hover{background:var(--zemin-2);border-color:var(--cizgi-hover)}
.menu-dugme svg{width:22px;height:22px;color:var(--lacivert)}
@media (max-width:940px){
  .menu{position:fixed;left:0;right:0;top:76px;flex-direction:column;align-items:stretch;gap:2px;background:#fff;
    border-bottom:1px solid var(--cizgi);padding:var(--s3) var(--s5) var(--s5);box-shadow:var(--golge-3);
    transform:translateY(-120%);transition:transform var(--gecis);visibility:hidden}
  .menu.acik{transform:none;visibility:visible}
  .menu a{padding:var(--s3) var(--s4);font-size:17px;border-bottom:1px solid var(--cizgi-acik)}
  .menu-dugme{display:flex}
  .ust-tel{padding:0 var(--s4);font-size:15px}
}

/* ── Arama ────────────────────────────────────────────────────────── */
.ara{position:relative;display:flex;align-items:center;gap:var(--s3);background:#fff;border:1.5px solid var(--cizgi);
  border-radius:var(--r-kontrol);padding:6px 6px 6px var(--s4);box-shadow:var(--golge-1);transition:border-color var(--gecis),box-shadow var(--gecis)}
.ara:focus-within{border-color:var(--lacivert);box-shadow:var(--golge-2),0 0 0 4px var(--odak-yumusak)}
.ara svg.ara-ikon{width:20px;height:20px;color:var(--mut);flex:0 0 auto}
.ara input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:17px;padding:var(--s3) 2px;color:var(--metin);font-family:inherit}
.ara .btn{flex:0 0 auto}
.ara--buyuk{max-width:620px;padding:8px 8px 8px var(--s5);border-radius:var(--r-kart)}
.ara-sonuc{margin-top:var(--s3);font-size:15px;color:var(--mut)}
.ara-sonuc b{color:var(--metin);font-variant-numeric:tabular-nums}

/* ── Butonlar: tek yükseklik (48), tek radius ─────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);
  border-radius:var(--r-kontrol);border:1.5px solid transparent;font-weight:600;font-size:16px;cursor:pointer;font-family:inherit;
  background:#fff;transition:background var(--gecis),color var(--gecis),border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis)}
.btn svg{width:18px;height:18px}
.btn--dolu{background:var(--lacivert);color:#fff;border-color:var(--lacivert)}
.btn--dolu:hover{background:var(--lacivert-koyu);transform:translateY(-1px);box-shadow:0 6px 16px rgba(30,58,110,.22)}
.btn--kirmizi{background:var(--bordo);color:#fff;border-color:var(--bordo)}
.btn--kirmizi:hover{background:var(--bordo-koyu);transform:translateY(-1px);box-shadow:0 6px 16px rgba(184,35,27,.2)}
.btn--cizgi{border-color:var(--cizgi-hover);color:var(--metin)}
.btn--cizgi:hover{border-color:var(--lacivert);color:var(--lacivert);background:var(--zemin-2)}
.btn--kucuk{min-height:44px;padding:0 var(--s4);font-size:15px;border-radius:var(--r-kucuk)}
.butonlar{display:flex;flex-wrap:wrap;gap:var(--s3)}
.butonlar--orta{justify-content:center}

/* ── Hero ─────────────────────────────────────────────────────────── */
.hero{padding:clamp(56px,7vw,104px) 0 clamp(40px,4.5vw,64px)}
.hero h1{margin-top:var(--s4);max-width:24ch}
.hero .alt{color:var(--metin-2);font-size:clamp(17px,1.7vw,19px);max-width:58ch;margin:var(--s5) 0 var(--s6)}
.hero--dar{max-width:760px}
.vurgu{color:var(--bordo)}
/* ── Ortalanmış sayfa başlığı (kafa--orta ile birlikte) ───────────── */
/* Başlık, açıklama, butonlar ve arama kutusu sayfa ortasına gelir. */
.hero .wrap.kafa--orta{max-width:760px;margin-left:auto;margin-right:auto;text-align:center}
.hero .wrap.kafa--orta .yol{justify-content:center}
.hero .wrap.kafa--orta h1,.hero .wrap.kafa--orta .alt{margin-left:auto;margin-right:auto}
.hero .wrap.kafa--orta .alt{margin-top:var(--s5)}
.hero .wrap.kafa--orta .butonlar{justify-content:center}
.hero .wrap.kafa--orta .ara{margin-left:auto;margin-right:auto}
.hero .wrap.kafa--orta .ara--buyuk{max-width:620px}
/* arama kutusunu tek başına ortalamak için sarmalayıcı */
.ara-sar{display:flex;justify-content:center;margin-top:var(--s5)}
.ara-sar .ara{width:100%}

/* Künye şeridi */
.serit{display:flex;flex-wrap:wrap;gap:var(--s5);padding:var(--s5) 0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);margin-top:var(--s7)}
.serit div{display:flex;align-items:center;gap:var(--s3);font-size:15px;color:var(--metin-2);font-variant-numeric:tabular-nums}
.serit svg{width:20px;height:20px;color:var(--lacivert);flex:0 0 auto}
/* ortalanmış hero içindeki künye şeridi de ortalanır */
.hero .wrap.kafa--orta .serit{justify-content:center;text-align:left}
.hero .wrap.kafa--orta .serit div{justify-content:center}

/* ── Kart: ölü boşluk yok ───────────────────────────────────────── */
/* Izgara satırları hizalanır; kart içeriği yukarıdan akar, link metni takip eder. */
.izgara{align-items:start}
.kart{position:relative;background:#fff;border:1px solid var(--cizgi);border-radius:var(--r-kart);padding:var(--s5);
  display:flex;flex-direction:column;transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis)}
/* Eşit yükseklik gereken ızgaralarda kartlar esner (blog/ürün), hizmet kartları içeriğe göre kalır */
.izgara--esnek{align-items:stretch}
.kart:hover{border-color:var(--cizgi-hover);box-shadow:var(--golge-3);transform:translateY(-2px)}
/* ikon: soluk çip değil — doğrudan marka rengi, net ağırlık */
.kart .ikon{width:40px;height:40px;display:grid;place-items:center;color:var(--lacivert);margin-bottom:var(--s3);
  border-radius:var(--r-kontrol);background:var(--zemin-2);transition:background var(--gecis),color var(--gecis)}
.kart:hover .ikon{background:var(--lacivert);color:#fff}
.kart .ikon svg{width:22px;height:22px}
.kart .ikon--sayi{font-family:"Cormorant Garamond",serif;font-size:20px;font-weight:700;color:var(--bordo);font-variant-numeric:tabular-nums}
.kart:hover .ikon--sayi{background:var(--zemin-2);color:var(--bordo)}
.kart h3{font-size:21px;line-height:1.25}
.kart p{color:var(--metin-2);font-size:16px;margin-top:var(--s2)}
/* künye kartındaki bağlantılar (telefon) dokunulabilir olsun */
.kart a[href^="tel:"]{display:inline-flex;align-items:center;min-height:32px}
/* link: metnin hemen altında; mobilde dokunma hedefi 44px */
.kart .bag{margin-top:var(--s4);font-weight:600;font-size:15px;color:var(--lacivert);
  display:inline-flex;gap:6px;align-items:center;align-self:flex-start;min-height:44px}
.kart .bag span{transition:transform var(--gecis)}
.kart:hover .bag span{transform:translateX(3px)}
/* kartın tamamı zaten bağlantı değilse (article) — linki genişlet */
@media (max-width:620px){
  .kart{padding:var(--s5) var(--s5) var(--s3)}
  .kart .bag{min-height:44px;margin-top:var(--s3)}
}

/* ── Ürün kartı (4:3) ─────────────────────────────────────────────── */
.urun-kart{background:#fff;border:1px solid var(--cizgi);border-radius:var(--r-kart);overflow:hidden;
  display:flex;flex-direction:column;transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis)}
.urun-kart:hover{border-color:var(--cizgi-hover);box-shadow:var(--golge-3);transform:translateY(-2px)}
.urun-gorsel{position:relative;aspect-ratio:4/3;background:var(--zemin-2);overflow:hidden}
.urun-gorsel img{width:100%;height:100%;object-fit:cover;transition:transform 360ms cubic-bezier(.22,.61,.36,1)}
.urun-gorsel img.gorsel-yok{object-fit:contain;padding:var(--s6);opacity:.45;background:var(--zemin-3)}
.urun-kart:hover .urun-gorsel img{transform:scale(1.03)}
.urun-kart:hover .urun-gorsel img.gorsel-yok{transform:none}
.urun-govde{padding:var(--s5);display:flex;flex-direction:column;gap:var(--s2);flex:1}
.urun-kat{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--bordo)}
.urun-ad{font-family:"Cormorant Garamond",serif;font-size:21px;font-weight:600;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.urun-aciklama{color:var(--metin-2);font-size:15px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.urun-etiketler{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s3)}
.etiket{font-size:13px;padding:var(--s1) 10px;border-radius:var(--r-hap);background:var(--zemin-2);color:var(--mut);border:1px solid var(--cizgi);
  display:inline-flex;align-items:center}
/* etiketler bağlantıysa dokunma hedefi 44px (liste içinde) */
a.etiket{min-height:44px;padding:0 var(--s4);font-size:14px}

/* ── Filtre çipleri ───────────────────────────────────────────────── */
.cipler{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s5)}
.cip{display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;padding:0 var(--s4);border-radius:var(--r-hap);
  border:1.5px solid var(--cizgi);background:#fff;font-family:inherit;font-size:15px;font-weight:500;cursor:pointer;color:var(--metin);
  transition:border-color var(--gecis),background var(--gecis),color var(--gecis)}
.cip:hover{border-color:var(--lacivert);color:var(--lacivert)}
.cip.aktif{background:var(--lacivert);border-color:var(--lacivert);color:#fff;font-weight:600}
.cip span.sayi{opacity:.6;font-size:14px;font-variant-numeric:tabular-nums}

.gelismis{margin-top:var(--s4);border:1px solid var(--cizgi);border-radius:var(--r-kart);background:#fff;overflow:hidden}
.gelismis summary{padding:var(--s4) var(--s5);cursor:pointer;font-weight:600;font-size:16px;list-style:none;transition:background var(--gecis)}
.gelismis summary:hover{background:var(--zemin-2)}
.gelismis summary::-webkit-details-marker{display:none}
.gelismis summary:before{content:"▾ ";color:var(--lacivert);font-weight:700}
.gelismis[open] summary:before{content:"▴ "}
.gelismis .ic{padding:0 var(--s5) var(--s5);display:grid;gap:var(--s5);grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.gelismis h4{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:var(--s2);font-weight:700}
.gelismis label{display:inline-flex;align-items:center;gap:var(--s2);font-size:15px;padding:5px 0;cursor:pointer}
.gelismis input[type=checkbox],.gelismis input[type=radio]{width:18px;height:18px;accent-color:var(--lacivert)}
.sonuc-cubugu{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-top:var(--s5);font-size:15px;color:var(--mut)}
.sonuc-cubugu b{color:var(--metin);font-variant-numeric:tabular-nums}
.sonuc-cubugu select{min-height:44px;padding:0 var(--s3);border:1.5px solid var(--cizgi);border-radius:var(--r-kucuk);background:#fff;
  font-family:inherit;font-size:15px;transition:border-color var(--gecis)}
.sonuc-cubugu select:hover{border-color:var(--cizgi-hover)}
.temizle{margin-left:auto}

/* ── Ürün detay ───────────────────────────────────────────────────── */
.detay{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:900px){.detay{grid-template-columns:1fr}}
.galeri{display:flex;flex-direction:column;gap:var(--s3)}
.galeri-ana{position:relative;aspect-ratio:4/3;border:1px solid var(--cizgi);border-radius:var(--r-kart);overflow:hidden;background:var(--zemin-2)}
.galeri-ana img{width:100%;height:100%;object-fit:cover}
.galeri-ana img.gorsel-yok{object-fit:contain;padding:var(--s8);opacity:.45;background:var(--zemin-3)}
.galeri-mini{display:flex;gap:var(--s2);flex-wrap:wrap}
.galeri-mini button{width:88px;aspect-ratio:4/3;border:1.5px solid var(--cizgi);border-radius:var(--r-kucuk);overflow:hidden;background:#fff;cursor:pointer;padding:0;
  transition:border-color var(--gecis),transform var(--gecis)}
.galeri-mini button:hover{border-color:var(--cizgi-hover);transform:translateY(-2px)}
.galeri-mini button.aktif{border-color:var(--lacivert)}
.galeri-mini img{width:100%;height:100%;object-fit:cover}
.galeri-mini img.gorsel-yok{object-fit:contain;padding:6px;opacity:.45;background:var(--zemin-3)}
.detay-bilgi h1{margin:var(--s2) 0 var(--s3);font-size:clamp(28px,3.6vw,38px)}
.detay-bilgi .aciklama{color:var(--metin-2);font-size:17px;margin-bottom:var(--s5);white-space:pre-line}
/* kategori kicker — bağlantı olduğu için hover ver */
a.urun-kat{text-decoration:none;transition:color var(--gecis)}
a.urun-kat:hover{color:var(--lacivert)}
/* satın alma güven satırları (beden/teslim/fatura) */
.satilabilir{display:flex;flex-direction:column;gap:var(--s3);margin:var(--s5) 0;padding:var(--s5);background:var(--zemin-3);border:1px solid var(--cizgi);border-radius:var(--r-kart)}
.satir-bilgi{display:flex;gap:var(--s3);align-items:flex-start;font-size:15.5px;color:var(--metin-2);line-height:1.5}
.satir-bilgi svg{width:22px;height:22px;color:var(--lacivert);flex:0 0 auto;margin-top:1px}
.satir-bilgi b{display:block;color:var(--metin);font-weight:600;font-size:16px;margin-bottom:2px}
/* adım listesi (satın alma akışı) */
.adim-liste{list-style:none;counter-reset:adim;display:flex;flex-direction:column;gap:var(--s4);padding:0;margin:0}
.adim-liste li{counter-increment:adim;position:relative;padding-left:44px;font-size:16px;color:var(--metin-2);line-height:1.55}
.adim-liste li:before{content:counter(adim);position:absolute;left:0;top:-2px;width:30px;height:30px;display:grid;place-items:center;
  background:var(--lacivert);color:#fff;border-radius:var(--r-hap);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.ozellikler{display:grid;gap:var(--s2);margin:var(--s5) 0;padding:var(--s5) 0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.ozellikler div{display:flex;gap:var(--s4);font-size:16px}
.ozellikler b{min-width:112px;color:var(--mut);font-weight:600}
.yol{font-size:14px;color:var(--mut);display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}
.yol a{display:inline-flex;align-items:center;min-height:26px}
.yol a:hover{color:var(--lacivert)}

/* ── SSS ──────────────────────────────────────────────────────────── */
.sss details{border-bottom:1px solid var(--cizgi)}
.sss summary{padding:var(--s5) 0;cursor:pointer;font-weight:600;font-size:17px;list-style:none;display:flex;gap:var(--s3);
  align-items:flex-start;transition:color var(--gecis)}
.sss summary:hover{color:var(--lacivert)}
.sss summary::-webkit-details-marker{display:none}
.sss summary:before{content:"+";color:var(--bordo);font-weight:700;font-size:22px;line-height:1;flex:0 0 auto;width:22px}
.sss details[open] summary:before{content:"–"}
.sss .cevap{padding:0 var(--s5) var(--s5) 34px;color:var(--metin-2);font-size:16px}

/* ── İletişim ─────────────────────────────────────────────────────── */
.iletisim-kutular{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.iletisim-kutu{border:1px solid var(--cizgi);border-radius:var(--r-kart);padding:var(--s5);background:#fff;display:flex;flex-direction:column;gap:var(--s2);
  transition:border-color var(--gecis),box-shadow var(--gecis)}
.iletisim-kutu:hover{border-color:var(--cizgi-hover);box-shadow:var(--golge-2)}
.iletisim-kutu svg{width:22px;height:22px;color:var(--lacivert)}
.iletisim-kutu b{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);font-weight:700}
.iletisim-kutu span{font-size:17px;font-variant-numeric:tabular-nums}
/* kart içi telefon linkleri — mobilde dokunma hedefi */
.iletisim-kutu span a{display:inline-flex;align-items:center;min-height:32px}
.iletisim-kutu span a:hover{color:var(--lacivert)}
.harita{margin-top:var(--s5);border:1px solid var(--cizgi);border-radius:var(--r-kart);overflow:hidden;aspect-ratio:16/7;background:var(--zemin-2)}
.harita iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:700px){.harita{aspect-ratio:4/3}}

/* ── Alt bilgi ────────────────────────────────────────────────────── */
.altbilgi{background:var(--zemin-3);border-top:1px solid var(--cizgi);padding:clamp(40px,5vw,64px) 0 var(--s6);margin-top:var(--s8)}
.altbilgi-ic{display:grid;gap:var(--s6);grid-template-columns:1.4fr 1fr 1fr}
@media (max-width:760px){.altbilgi-ic{grid-template-columns:1fr}}
.altbilgi h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin-bottom:var(--s3);font-weight:700}
.altbilgi a{display:flex;align-items:center;min-height:44px;font-size:16px;color:var(--metin-2);transition:color var(--gecis)}
.altbilgi a:hover{color:var(--lacivert)}
.altbilgi .kunye{font-size:15px;color:var(--metin-2);line-height:1.65;font-variant-numeric:tabular-nums}
/* künye içi bağlantılar (telefon) — mobilde de rahat dokunulsun */
.altbilgi .kunye a{display:inline-flex;align-items:center;min-height:32px;padding:0}
.altbilgi .kunye a:hover{color:var(--lacivert)}
.alt-cizgi{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--cizgi);font-size:14px;color:var(--mut);display:flex;gap:var(--s4);flex-wrap:wrap}
.alt-cizgi a{display:inline;color:var(--mut)}
.alt-cizgi a:hover{color:var(--lacivert)}

/* ── Hareket (sakin, 150–300 ms) ──────────────────────────────────── */
.belir{opacity:0;transform:translateY(12px)}
.gorundu{opacity:1;transform:none;transition:opacity .45s ease,transform .45s cubic-bezier(.22,.61,.36,1)}
/* Hero (ilk ekran) animasyonsuz: LCP gecikmesin */
.hero .belir{opacity:1;transform:none}
details:not([open]) > *:not(summary){content-visibility:hidden}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .belir{opacity:1;transform:none}
  .gorundu{transition:none}
  *{animation:none!important;transition:none!important}
}

/* ── Dar ekran ────────────────────────────────────────────────────── */
@media (max-width:560px){
  .btn-metin{display:none}
  .ust-tel{padding:0 var(--s3);font-size:14px;min-height:44px;white-space:nowrap}
  .marka img{height:40px}
  .marka b{font-size:19px}
  .marka small{font-size:11px}
  .hero h1{max-width:100%}
  .ara{padding-left:var(--s3)}
  .harita{aspect-ratio:1/1}
}
@media (max-width:480px){
  .ust-tel{min-width:44px;padding:0;justify-content:center}
  .tel-metin{display:none}
  .marka small{display:none}
  .marka b{font-size:18px}
}

/* ── Yardımcılar ──────────────────────────────────────────────────── */
.bos{grid-column:1/-1;text-align:center;padding:var(--s8) var(--s5);border:1px dashed var(--cizgi);border-radius:var(--r-kart);color:var(--mut)}
.bos b{display:block;font-size:20px;color:var(--metin);margin-bottom:var(--s2);font-family:"Cormorant Garamond",serif;font-weight:600}
.not{background:var(--zemin-3);border:1px solid var(--cizgi);border-left:3px solid var(--bordo);border-radius:var(--r-kucuk);padding:var(--s4) var(--s5);font-size:16px;color:var(--metin-2)}
@media print{
  .ust,.altbilgi,.butonlar,.ara,.cipler,.gelismis,.sonuc-cubugu{display:none!important}
  body{font-size:12pt}
  .bolum{padding:var(--s4) 0}
}

/* ── Barkod okuyucu ───────────────────────────────────────────────── */
.modal{position:fixed;inset:0;z-index:90;background:rgba(12,14,18,.88);display:flex;flex-direction:column}
.modal-ic{position:relative;flex:1;display:flex;flex-direction:column}
.modal video{width:100%;height:100%;object-fit:cover;background:#000}
.modal-cerceve{position:absolute;inset:24% 12%;border:2px solid rgba(255,255,255,.92);border-radius:var(--r-kart);
  box-shadow:0 0 0 100vmax rgba(0,0,0,.3)}
.modal-ust{padding:var(--s4);display:flex;align-items:center;gap:var(--s3);background:rgba(0,0,0,.55);color:#fff}
.modal-ust span{font-weight:600}
.modal-ust .btn{margin-left:auto}
.modal-alt{padding:var(--s4);display:flex;gap:var(--s3);background:rgba(0,0,0,.55)}
.modal-alt .btn{flex:1}

/* ── Blog kartı (ana sayfa şeridi) ────────────────────────────────── */
.blog-kart{display:flex;flex-direction:column;background:#fff;border:1px solid var(--cizgi);border-radius:var(--r-kart);
  overflow:hidden;transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis)}
.blog-kart:hover{border-color:var(--cizgi-hover);box-shadow:var(--golge-3);transform:translateY(-2px)}
/* kapak: gerçek 16:9 → kartla aynı oran, kırpma yok */
.blog-kart .kapak{display:block;aspect-ratio:16/9;background:var(--zemin-3);overflow:hidden}
.blog-kart .kapak img{width:100%;height:100%;object-fit:cover;transition:transform 360ms cubic-bezier(.22,.61,.36,1)}
.blog-kart:hover .kapak img{transform:scale(1.03)}
.blog-kart .kapak img.gorsel-yok{object-fit:contain;padding:var(--s5);opacity:.4;transform:none!important}
.blog-kart .ic{padding:var(--s5);display:flex;flex-direction:column;gap:var(--s2);flex:1}
.blog-kart .kume{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--bordo)}
/* başlık en fazla 2 satır → kart yükseklikleri ve "Yazıyı oku" hizası sabit kalır */
.blog-kart .baslik{font-family:"Cormorant Garamond",serif;font-size:22px;font-weight:600;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.blog-kart .ozet{color:var(--metin-2);font-size:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.blog-kart .bag{margin-top:auto;padding-top:var(--s3);font-weight:600;font-size:15px;color:var(--lacivert);display:inline-flex;gap:6px;align-items:center;align-self:flex-start}
.blog-kart .bag span{transition:transform var(--gecis)}
.blog-kart:hover .bag span{transform:translateX(3px)}