/* =========================================================================
   SSA (Servis Sağlayıcı Ağı) katalogu — kart, filtre paneli, sonuç barı,
   sayfalama ve ortak açılır seçici/onay kutusu.

   Ayrı dosya olmasının sebebi: bu kurallar İKİ yerde kullanılıyor —
     • herkese açık /ssa sayfası (_ExgieLayout, exgie-site.css ile birlikte)
     • panel içindeki /Project/Home/Services (_HorizontalLayout, Bootstrap'li)
   Tek kopya olsun diye exgie-site.css'ten buraya çıkarıldı; _ExgieLayout
   ikisini birden yükler, panel sayfası yalnız bunu yükler.

   Kullandığı değişkenler (--ink, --ink-soft, --ghost, --line, --soft, --grad)
   hem exgie-site.css hem exgie-shell.css :root bloğunda aynı değerlerle var.
   ========================================================================= */

.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.svc{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:18px; background:#fff;
  transition:border-color .15s ease;
}
.svc:hover{border-color:#d9d9d3}
.svc-thumb{
  height:132px; display:flex; align-items:flex-end; padding:14px;
  background:var(--grad); position:relative;
}
/* Kapak görseli varsa gradyanın üstüne serilir; radyal parlama (::after) ve
   kategori rozeti onun da üstünde kalır. Dosya bulunamazsa img DOM.dan
   kaldırılıyor (onerror) ve altındaki gradyan yeniden görünür oluyor. */
.svc-thumb img{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%; object-fit:cover; display:block;
}
.svc-thumb::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 78% 18%, rgba(255,255,255,.34), transparent 62%);
}
.svc-thumb span{
  position:relative; z-index:1;
  font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; background:rgba(0,0,0,.24); padding:5px 11px; border-radius:999px;
}
.svc-body{display:flex; flex-direction:column; flex:1; padding:16px 18px 18px}
.svc-by{
  display:flex; align-items:center; gap:6px;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:14px; letter-spacing:-0.02em;
}
.svc-by svg{
  width:15px; height:15px; fill:none; stroke:#FF5F0E;
  stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.svc-by em{
  font-family:'Inter',sans-serif; font-style:normal;
  font-size:12px; font-weight:400; color:var(--ghost); margin-left:2px;
}
/* Başlık tek satır, taşan kısım "…" ile kesilir — hizmet adları çok değişken
   uzunlukta geliyor, ızgaradaki kartlar aynı hizada dursun. */
.svc h3{
  margin-top:11px; font-family:'Archivo',sans-serif; font-size:15.5px; font-weight:700;
  letter-spacing:-0.02em; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* Açıklama en fazla 3 satır; fazlası "…" ile kesilir. */
.svc p{
  margin-top:7px; font-size:13px; line-height:1.6; color:var(--ink-soft); text-wrap:pretty;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3;
  overflow:hidden;
}
.svc-foot{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:auto; padding-top:16px;
}
.svc-foot b{font-family:'Archivo',sans-serif; font-size:17px; font-weight:700; letter-spacing:-0.02em}
.svc-foot small{font-size:11.5px; font-weight:400; color:var(--ink-soft)}
/* Kart butonu artık katalog bağlantısı (<span> değil <a>) — alt çizgi istemiyoruz. */
.svc-btn{
  font-size:13px; font-weight:500; padding:9px 15px; border-radius:10px;
  border:1px solid var(--line); color:var(--ink); white-space:nowrap;
  text-decoration:none;
}
.svc:hover .svc-btn{border-color:#cfcfc9}

.ssa-cta{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  margin-top:22px; padding:22px 24px;
  border:1px solid var(--line); border-radius:18px; background:#fff;
}
.ssa-cta b{display:block; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.ssa-cta span{display:block; margin-top:4px; font-size:13.5px; color:var(--ink-soft)}
@media (max-width:940px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .svc-grid{grid-template-columns:1fr} }

.svc-perks{display:flex; flex-direction:column; gap:6px; margin-top:11px}
.svc-perk{display:flex; align-items:center; gap:7px; font-size:12.5px; line-height:1.35}
.svc-perk svg{
  flex:none; width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.svc-perk.is-point{color:var(--accent-ink, #c2521a)}
.svc-perk.is-ref{color:#2f7d53}

.svc-bundle{
  margin:14px 0 2px; padding:13px 14px; border-radius:13px;
  background:#eef2ee; border:1px solid #dfe7df;
}
.svc-bundle > b{
  display:flex; align-items:center; gap:7px;
  font-family:'Archivo',sans-serif; font-size:12.5px; font-weight:700;
  letter-spacing:-0.01em; color:#2E4034;
}
.svc-bundle > b svg{
  flex:none; width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.svc-bundle ul{list-style:none; margin:9px 0 0; padding:0; display:flex; flex-direction:column; gap:5px}
.svc-bundle li{display:flex; align-items:center; gap:8px; font-size:12.5px; line-height:1.4}
.svc-bundle li::before{
  content:""; flex:none; width:6px; height:6px; border-radius:999px;
  border:1.4px solid #7fa38a;
}
.svc-bundle li a{color:#2E4034; text-decoration:underline; text-underline-offset:2px}
.svc-bundle li a:hover{text-decoration-thickness:2px}
.svc-old{display:flex; align-items:center; gap:9px; margin-top:11px; flex-wrap:wrap}
.svc-old s{font-size:13px; color:var(--ghost)}
.svc-save{
  font-size:11.5px; font-weight:500; padding:4px 10px; border-radius:999px;
  background:var(--grad); color:#fff;
}

.svc-rate{display:flex; align-items:center; gap:5px; margin-left:auto; font-size:12px; color:var(--ink-soft)}
.svc-stars{display:inline-flex; gap:1px}
.svc-stars svg{width:12px; height:12px; fill:#FF5F0E}
.svc-stars svg.off{fill:#e4e4de}
.svc-stars svg.half{fill:url(#halfstar)}
.svc-rate b{font-family:'Archivo',sans-serif; font-size:12.5px; font-weight:700; color:var(--ink); letter-spacing:-0.02em}
.svc-rate small{color:var(--ghost); font-size:11.5px}

/* ---- SSA pazaryeri sayfası ---- */
.sp-hero{max-width:1180px; margin:0 auto; padding:40px 24px 26px}
.sp-search{
  display:flex; gap:10px; max-width:640px; margin:0 auto; align-items:stretch;
}
.sp-search input{
  flex:1; min-width:0; font:inherit; font-size:15px; color:var(--ink);
  padding:14px 18px; border:1px solid var(--line); border-radius:13px; background:#fff;
}
.sp-search input:focus{outline:none; border-color:#c9c9c2}
.sp-search button{
  flex:none; font:inherit; font-size:15px; font-weight:500; color:#fff;
  padding:14px 24px; border:0; border-radius:13px; background:var(--ink); cursor:pointer;
  transition:background .15s ease;
}
.sp-search button:hover{background:#2e2e34}

/* Üst barla içerik arasında nefes payı. Yukarıdaki `.sp{padding-top:34px}` kuralı bu
   kısayolla eziliyordu; değer buraya alındı. Boşluk hem filtre kartına hem sonuç
   barına uygulanır — böylece ikisi aynı hizada başlar (kart sticky olduğu için
   padding yokken 3px aşağı kayıyordu). */
.sp{max-width:1180px; margin:0 auto; padding:20px 24px 96px}
.sp-wrap > *{min-width:0}
.sp-wrap{display:grid; grid-template-columns:262px 1fr; gap:20px; align-items:start}

.sp-filters{
  border:1px solid var(--line); border-radius:18px; background:#fff; padding:20px;
  /* Üst bar sticky ve 115px; 135 = altına 20px boşluk. Sayfa başındaki boşlukla
     aynı olsun diye — 118'de kaydırınca araya yalnız 3px kalıyordu. */
  position:sticky; top:135px;
  /* Kart içeriği kadar uzuyor. Önceden `max-height:calc(100vh - 155px)` +
     kendi iç kaydırması vardı; sağlayıcı listesi uzayınca son gruplar
     görünmüyor, kullanıcı kart İÇİNDE ayrıca kaydırmak zorunda kalıyordu.
     Artık tek kaydırma var: sayfanın kendisi. */
  align-self:start;
  scrollbar-width:none;
}
.sp-filters::-webkit-scrollbar{display:none}
.fgroup + .fgroup{margin-top:20px; padding-top:20px; border-top:1px solid var(--line)}
.fgroup > b{
  display:block; margin-bottom:11px;
  font-family:'Archivo',sans-serif; font-size:13px; font-weight:700; letter-spacing:-0.01em;
}
.fcheck span{flex:1; min-width:0; color:var(--ink-soft)}
.fcheck:hover span{color:var(--ink)}
.fcheck em{font-style:normal; font-size:12px; color:var(--ghost)}
.frange{display:flex; align-items:center; gap:8px}
.frange input{
  flex:1; min-width:0; font:inherit; font-size:13.5px; text-align:center;
  padding:9px 8px; border:1px solid var(--line); border-radius:10px; background:#fff;
}
.frange input:focus{outline:none; border-color:#c9c9c2}
.frange span{color:var(--ghost); font-size:13px}
/* Filtre satırları artık bağlantı; sütundaki diğer öğelerle aynı görünmeli. */
.sp-filters a.fcheck{text-decoration:none; color:inherit}
/* Satır etiketlerinde font-size tanımlı değildi, tarayıcı varsayılanı 16px'e
   düşüyordu — kartın geri kalanı (başlıklar 13px, buton ve girişler 13.5px)
   yanında iri duruyor ve uzun kategori adları iki satıra taşıyordu. */
.sp-filters .fcheck span{font-size:13.5px; line-height:1.35}
/* Puan satırları: yıldızlar metinden kısa olduğu için satırlar sıkışıp onay
   kutuları birbirine yapışıyordu. Yıldız büyütüldü ve satıra dikey pay verildi;
   satır yüksekliği diğer filtre satırlarıyla (13.5px × 1.35 ≈ 18px) uyumlu. */
.sp-filters .fstars{padding:3px 0}
.sp-filters .fstars .svc-stars{flex:1; min-width:0; gap:2px}
.sp-filters .fstars .svc-stars svg{width:16px; height:16px}
.fclear{
  display:block; width:100%; margin-top:18px; font:inherit; font-size:13.5px;
  padding:10px; border:1px solid var(--line); border-radius:11px;
  background:#fff; color:var(--ink-soft); cursor:pointer;
  text-align:center; text-decoration:none;
}
.fclear:hover{border-color:#d4d4ce; color:var(--ink)}

.sp-bar{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  flex-wrap:wrap; margin-bottom:16px;
}
.sp-bar b{font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.sp-bar b span{font-weight:400; color:var(--ink-soft)}
.sp-sort{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--ink-soft)}
.sp-grid > *{min-width:0}
.sp-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
/* Tasarımda sayfa numaraları <span>'di; gerçek sayfalamada gezinilebilir olmaları
   için <a> oldular. Aynı kurala bağlı, yoksa tarayıcı varsayılanına (mavi, altı
   çizili) düşüyorlardı. Geçerli sayfa ve "…" hâlâ <span>. */
.sp-page{display:flex; justify-content:center; gap:6px; margin-top:26px}
.sp-page span, .sp-page a{
  min-width:36px; height:36px; padding:0 10px; border-radius:11px;
  border:1px solid var(--line); background:#fff; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center; font-size:13.5px; cursor:pointer;
  text-decoration:none;
}
.sp-page span:hover, .sp-page a:hover{border-color:#d4d4ce; color:var(--ink)}
.sp-page span.is-on{
  color:var(--ink); border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}
@media (max-width:1000px){
  .sp-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .sp-grid{grid-template-columns:1fr}
  .sp{padding:0 14px 70px}
  .sp-filters{padding:16px}
  .mk-in{padding:10px 14px; gap:10px}
  .mk-sub{padding:0 14px 8px}
  .svc-body{padding:14px 15px 16px}
}

/* ---- açılır seçici (ortak) ---- */
.sel{position:relative}
.sel-btn{
  display:flex; align-items:center; gap:10px;
  font:inherit; font-size:13.5px; color:var(--ink); cursor:pointer;
  padding:9px 13px; border:1px solid var(--line); border-radius:11px; background:#fff;
  white-space:nowrap; transition:border-color .15s ease;
}
.sel-btn:hover{border-color:#d4d4ce}
.sel.is-open .sel-btn{border-color:#c9c9c2}
.sel-chev{
  width:10px; height:7px; flex:none; margin-left:auto;
  fill:none; stroke:var(--ink-soft); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
  transition:transform .18s ease;
}
.sel.is-open .sel-chev{transform:rotate(180deg)}
.sel .sel-list{
  position:absolute; top:calc(100% + 6px); right:0; z-index:50;
  min-width:190px; list-style:none; margin:0; padding:6px;
  background:#fff; border:1px solid var(--line); border-radius:13px;
  box-shadow:0 16px 40px rgba(20,20,25,.13);
}
.sel .sel-list[hidden]{display:none}
.sel .sel-list li{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 11px; border-radius:9px; font-size:13.5px; color:var(--ink); cursor:pointer;
}
.sel .sel-list li:hover{background:var(--soft)}
/* Seçenekler bağlantı oldu (onclick yerine); tıklama alanı tüm satır olsun ve
   tarayıcının mavi/altı çizili varsayılanına düşmesin. */
.sel .sel-list li > a{
  flex:1; min-width:0; color:inherit; text-decoration:none;
  margin:-9px -11px; padding:9px 11px;
}
.sel .sel-list li[aria-selected="true"]::after{
  content:""; width:9px; height:5px; margin-right:2px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink);
  transform:rotate(-45deg) translateY(-2px);
}
.sp-sort-l{font-size:13.5px; color:var(--ink-soft)}

/* ---- onay kutusu (ortak) ---- */
.chk input[type="checkbox"],
.fcheck input[type="checkbox"]{
  appearance:none; -webkit-appearance:none; flex:none;
  width:16px; height:16px; min-width:16px; min-height:16px;
  margin:0; padding:0; font-size:inherit;
  border:1.5px solid #c9c9c2; border-radius:5px; background:#fff;
  position:relative; cursor:pointer;
}
.chk input[type="checkbox"]:checked,
.fcheck input[type="checkbox"]:checked{border-color:var(--ink); background:var(--ink)}
.chk input[type="checkbox"]:checked::after,
.fcheck input[type="checkbox"]:checked::after{
  content:""; position:absolute; left:50%; top:50%;
  width:8px; height:4.2px; margin:-3.4px 0 0 -4px;
  border-left:1.8px solid #fff; border-bottom:1.8px solid #fff;
  transform:rotate(-45deg);
}
.chk,.fcheck{display:flex; align-items:flex-start; gap:10px; cursor:pointer}
.frm label.chk,.frm .chk{flex-direction:row}
.fcheck{align-items:center}

.pn-empty{display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px}

/* ---- mobil pazaryeri ---- */
.sp-mbar{display:none}
.sp-main{display:block; min-width:0}
@media (max-width:1000px){
  .sp-wrap{display:block}
  .sp-filters{
    position:fixed; left:0; right:0; bottom:0; z-index:70;
    max-height:80vh; border-radius:22px 22px 0 0; border:0;
    box-shadow:0 -14px 40px rgba(20,20,25,.18);
    padding:10px 18px calc(20px + env(safe-area-inset-bottom));
    transform:translateY(100%); transition:transform .24s ease;
    overflow-y:auto;
  }
  .sp-filters::before{
    content:""; display:block; width:38px; height:4px; border-radius:999px;
    background:var(--line); margin:0 auto 14px;
  }
  body.sheet-on .sp-filters{transform:none}
  body.sheet-on::after{
    content:""; position:fixed; inset:0; z-index:65;
    background:rgba(20,20,25,.32); backdrop-filter:blur(2px);
  }
  body.sheet-on{overflow:hidden}

  .sp-mbar{
    display:flex; gap:8px; position:sticky; top:0; z-index:20;
    padding:10px 0 12px; background:var(--paper);
  }
  .sp-mbtn{
    flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
    font:inherit; font-size:14px; padding:11px 14px;
    border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink);
  }
  .sp-mbtn svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
  .sp-mcount{
    min-width:19px; height:19px; padding:0 6px; border-radius:999px;
    background:var(--grad); color:#fff; font-size:11px;
    display:flex; align-items:center; justify-content:center;
  }
  .fclear{margin-bottom:6px}
}
@media (max-width:760px){
  .mk-catwrap{display:none}
  .mk-search{width:100%}
  .mk-mini.mk-acc small{display:none}
  .mk-in{flex-wrap:wrap; row-gap:10px}
  .mk-search{order:5; flex-basis:100%}
  .sp-bar b{font-size:14px}
  .sp-sort{display:none}
}

@media (max-width:1000px){
  /* kategori şeridi aramanın altında, kart yerine mini çip */
  .mk-sub{
    padding:0 24px 10px; gap:6px;
    -webkit-mask-image:linear-gradient(to right,#000 88%,transparent);
    mask-image:linear-gradient(to right,#000 88%,transparent);
    -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
    -webkit-mask-size:100% 100%; mask-size:100% 100%;
  }
  .mk-sub a,.mk-all{padding:7px 12px; font-size:13px; border:1px solid var(--line); border-radius:999px; background:#fff}
  .mk-all{order:-1}
  .sp-bar{margin-bottom:12px}
}

/* ---- pazaryeri üst barı (hedef pazar + arama) ----------------------------
   Bu widget'lar artık panel içindeki katalogda da kullanılıyor; kurallar
   ortak dosyada dursun diye exgie-site.css'ten buraya taşındı. */
/* ---- pazaryeri başlığı ---- */
.mk-top{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30}
.mk-in{
  max-width:1400px; margin:0 auto; padding:12px 24px;
  display:flex; align-items:center; gap:14px;
}
.mk-logo{display:flex; align-items:center}
.mk-mark{display:block; height:30px; width:auto}
.mk-ico{width:19px; height:19px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.mk-loc{
  display:flex; align-items:center; gap:8px; border:0; background:none;
  padding:6px 8px; border-radius:10px; color:var(--ink); text-align:left;
  transition:background .15s ease;
}
.mk-loc:hover{background:var(--soft)}
.mk-loc small,.mk-mini small{display:block; font-size:11px; color:var(--ink-soft); line-height:1.2}
.mk-loc b,.mk-mini b{display:flex; align-items:center; gap:5px; font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:-0.02em; line-height:1.25}

.mk-search{
  flex:1; min-width:0; display:flex; align-items:stretch;
  border:1.6px solid var(--line); border-radius:13px; background:#fff;
  transition:border-color .15s ease;
}
.mk-search:focus-within{border-color:transparent; background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box}
.mk-catwrap{position:relative; flex:none; display:flex; align-self:stretch}
.mk-catlist{
  position:absolute; top:calc(100% + 8px); left:0; z-index:40;
  min-width:250px; list-style:none; margin:0; padding:6px;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 16px 40px rgba(20,20,25,.13);
}
.mk-catlist[hidden]{display:none}
.mk-catlist li{
  padding:9px 11px; border-radius:9px; font-size:13.5px; color:var(--ink);
  cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.mk-catlist li:hover,.mk-catlist li.is-cur{background:#f6f6f3}
/* Satırlar artık bağlantı; tıklama alanı tüm satır olsun ve link gibi görünmesin. */
.mk-catlist li > a{flex:1; min-width:0; color:inherit; text-decoration:none; margin:-9px -11px; padding:9px 11px}
.mk-catlist li > em{font-style:normal; font-size:12px; color:var(--ghost)}
/* Hizmeti olmayan pazaryeri: listede kalır ama seçilemez. */
.mk-catlist li.is-bos{color:var(--ghost); cursor:default}
.mk-catlist li.is-bos:hover{background:none}
.mk-catlist li[aria-selected="true"]::after{
  content:""; width:9px; height:5px; margin-right:2px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink);
  transform:rotate(-45deg) translateY(-2px);
}
.mk-dd.is-open .mk-chev{transform:rotate(180deg)}
.mk-ddloc{position:relative}
.mk-ddwide{
  min-width:520px; display:grid; grid-template-columns:1fr 1fr; gap:0 4px;
}
@media (max-width:760px){ .mk-ddwide{min-width:260px; grid-template-columns:1fr} }
.mk-cat{
  flex:none; display:flex; align-items:center; gap:7px; border:0; background:var(--soft);
  padding:0 14px; font-size:13px; color:var(--ink-soft); white-space:nowrap;
  border-radius:11px 0 0 11px;
}
.mk-cat:hover{color:var(--ink)}
.mk-loc .mk-chev{margin-top:1px}
.mk-chev{transition:transform .18s ease; width:10px; height:7px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.mk-search input{
  flex:1; min-width:0; border:0; font:inherit; font-size:15px; color:var(--ink);
  padding:12px 14px; background:none;
}
.mk-search input:focus{outline:none}
.mk-go{
  flex:none; border:0; width:52px; color:#fff; background:var(--grad);
  border-radius:0 11px 11px 0;
  display:flex; align-items:center; justify-content:center;
}
.mk-go .mk-ico{width:20px; height:20px}

.mk-mini{
  display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:10px;
  color:var(--ink); text-decoration:none; white-space:nowrap;
  transition:background .15s ease;
}
.mk-mini:hover{background:var(--soft)}
.mk-acc{margin-left:auto}
.mk-cart{
  position:relative; display:flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:11px; text-decoration:none; color:var(--ink);
  border:1px solid var(--line); transition:border-color .15s ease;
}
.mk-cart:hover{border-color:#d4d4ce}
.mk-cart b{font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:-0.02em}
.mk-badge{
  position:absolute; top:2px; left:24px; min-width:16px; height:16px; padding:0 4px;
  border-radius:999px; background:var(--accent-ink, #c2521a); color:#fff;
  font-size:10px; font-weight:600; display:flex; align-items:center; justify-content:center;
}

.mk-sub{
  max-width:1400px; margin:0 auto; padding:0 24px 10px;
  display:flex; align-items:center; gap:4px; overflow-x:auto;
  scrollbar-width:none;
}
.mk-sub::-webkit-scrollbar{display:none}
.mk-sub a,.mk-all{
  flex:none; display:flex; align-items:center; gap:7px;
  padding:8px 13px; border-radius:10px; font-size:13.5px;
  color:var(--ink-soft); text-decoration:none; border:0; background:none; white-space:nowrap;
}
.mk-sub a:hover,.mk-all:hover{background:var(--soft); color:var(--ink)}
.mk-all{font-weight:500; color:var(--ink)}

@media (max-width:1100px){ .mk-hide{display:none} }
@media (max-width:820px){
  .mk-loc{display:none}
  .mk-in{flex-wrap:wrap}
  .mk-search{order:3; flex-basis:100%}
}




/* Yatay kategori satırında seçili olan. Satır artık gerçek bağlantılardan
   oluşuyor (önceden href="#" idi), "Tümü" de <button> değil <a>. */
.mk-sub a.is-on,.mk-all.is-on{background:var(--soft); color:var(--ink); font-weight:500}
.mk-all{display:inline-flex; align-items:center; gap:7px; text-decoration:none}
/* Sonuç alanı sunucudan yenilenirken hafif soluk. */
.sp-wrap[aria-busy="true"]{opacity:.55; transition:opacity .12s ease}

/* Kart üstündeki sağlayıcı adı artık profile (/spn/{slug}) bağlantı. Rengi ve
   ağırlığı satırın kendisinden miras alıyor — kart içinde ikinci bir vurgu
   istemiyoruz; yalnız üzerine gelince alt çizgi. */
.svc-byl{color:inherit; text-decoration:none}
.svc-byl:hover{text-decoration:underline; text-underline-offset:2px}

/* ==========================================================================
   HİZMET DETAY SAYFASI — exgie-site.css'ten TAŞINDI.

   Sebep: detay sayfası artık iki yerde çiziliyor (herkese açık /hizmet ve
   panel içindeki /Project/Home/Service) ve panel exgie-site.css'i
   YÜKLEYEMİYOR — o dosyanın genel gövde/başlık kuralları panelin kendi
   stiliyle çakışıyor. Katalogda (SSA listesi) aynı sorun aynı şekilde
   çözülmüştü; kurallar burada TEK KOPYA duruyor, panele özgü farklar
   exgie-ssa-panel.css'te.
   ========================================================================== */

/* ---- yorumlar ---- */
.rv-sum{
  display:grid; grid-template-columns:200px 1fr; gap:28px; align-items:center;
  padding:22px 24px; border:1px solid var(--line); border-radius:18px; background:#fff;
  /* Tasarım kaynağında bu blokta üst boşluk yoktu — kardeş bölümlerle (sd-inc 18,
     sd-prov 16, qa-l 22) aynı ritim için eklendi; "Müşteri yorumları" başlığı
     kutuya yapışıyordu. İki yüzeyde de geçerli (tek kopya kural). */
  margin-top:16px;
}
.rv-score{text-align:center}
.rv-score b{display:block; font-family:'Archivo',sans-serif; font-size:42px; font-weight:700; letter-spacing:-0.045em; line-height:1}
.rv-score small{display:block; margin-top:8px; font-size:12.5px; color:var(--ink-soft)}
.rv-stars{display:inline-flex; gap:2px}
.rv-stars svg{width:15px; height:15px; fill:#FF5F0E}
.rv-stars svg.off{fill:#e4e4de}
.rv-score .rv-stars{margin-top:8px}
.rv-score .rv-stars svg{width:17px; height:17px}
.rv-bars{display:flex; flex-direction:column; gap:7px}
.rv-bar{display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-soft)}
.rv-bar > span{width:10px; text-align:right}
.rv-bar i{flex:1; height:7px; border-radius:999px; background:#f0f0ec; overflow:hidden}
.rv-bar b{display:block; height:100%; border-radius:999px; background:var(--grad)}
.rv-bar em{width:34px; font-style:normal; text-align:right; color:var(--ghost)}

.rv-list{display:flex; flex-direction:column; gap:14px; margin-top:16px}
.rv{display:flex; gap:14px; padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff}
.rv-av{
  flex:none; width:42px; height:42px; border-radius:13px; background:var(--grad);
  display:flex; align-items:center; justify-content:center;
  font-family:'Archivo',sans-serif; font-size:14px; font-weight:700; color:#fff; letter-spacing:-0.02em;
}
.rv-body{flex:1; min-width:0}
.rv-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.rv-head b{font-family:'Archivo',sans-serif; font-size:14.5px; font-weight:700; letter-spacing:-0.02em}
.rv-head small{margin-left:auto; font-size:12.5px; color:var(--ghost)}
.rv-ver{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:#2f7d53}
.rv-ver svg{width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.rv .rv-stars{margin-top:7px}
.rv p{margin-top:9px; font-size:14px; line-height:1.7; color:var(--ink-soft); text-wrap:pretty}
.rv-reply{
  margin-top:14px; padding:14px 16px; border-radius:13px;
  background:#f6f6f3; border-left:2.5px solid #FF5F0E;
}
.rv-reply b{font-family:'Archivo',sans-serif; font-size:13px; font-weight:700; letter-spacing:-0.02em}
.rv-reply p{margin-top:5px; font-size:13.5px; line-height:1.6}
.rv-more{
  margin-top:14px; width:100%; font:inherit; font-size:14px; padding:12px;
  border:1px solid var(--line); border-radius:12px; background:#fff;
  color:var(--ink-soft); cursor:pointer;
}
.rv-more:hover{border-color:#d4d4ce; color:var(--ink)}
@media (max-width:640px){ .rv-sum{grid-template-columns:1fr; gap:18px} }

/* ---- servis detay ---- */
.sd{max-width:1180px; margin:0 auto; padding:34px 24px 90px}
.sd-crumb{display:flex; gap:8px; font-size:13px; color:var(--ghost); margin-bottom:20px}
.sd-crumb a{color:var(--ink-soft); text-decoration:none}
.sd-crumb a:hover{color:var(--ink)}
.sd-wrap{display:grid; grid-template-columns:1fr 358px; gap:24px; align-items:start}

.sd-cover{
  position:relative; height:330px; border-radius:20px; overflow:hidden;
  background:var(--grad); display:flex; align-items:center; justify-content:center;
}
.sd-cover::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 76% 18%, rgba(255,255,255,.3), transparent 60%)}
.sd-play{
  position:relative; z-index:1; width:66px; height:66px; border-radius:999px;
  background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px rgba(20,20,25,.2);
}
.sd-play svg{width:22px; height:22px; margin-left:3px; fill:var(--ink)}
.sd-tag{
  display:inline-block; margin-top:22px; font-size:11.5px; letter-spacing:.06em;
  text-transform:uppercase; color:#fff; background:var(--grad); padding:6px 13px; border-radius:999px;
}
.sd h1{
  margin-top:14px; font-family:'Archivo',sans-serif; font-weight:700;
  font-size:clamp(26px, calc(var(--fs) * 0.58), 38px); letter-spacing:-0.04em; line-height:1.14;
}
.sd-meta{display:flex; align-items:center; gap:14px; margin-top:12px; flex-wrap:wrap; font-size:13px; color:var(--ink-soft)}
.sd-meta .dot{width:4px; height:4px; border-radius:999px; background:var(--line)}

.sd-tabs{display:flex; gap:2px; margin-top:26px; border-bottom:1px solid var(--line);
  justify-content:flex-start; max-width:none; padding:0}  /* genel nav{} kuralına karşı — bkz. .pf-tabs notu */
.sd-tabs a{
  padding:11px 15px; font-size:14px; color:var(--ink-soft); text-decoration:none;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.sd-tabs a:hover{color:var(--ink)}
.sd-tabs a.is-on{color:var(--ink); font-weight:500; border-bottom-color:var(--accent, #FF5F0E)}

.sd-block{padding-top:30px; scroll-margin-top:20px}
.sd-block > h2{font-family:'Archivo',sans-serif; font-size:19px; font-weight:700; letter-spacing:-0.03em}
.sd-block p{margin-top:12px; font-size:15px; line-height:1.8; color:var(--ink-soft); text-wrap:pretty; max-width:720px}
.sd-inc{list-style:none; margin:18px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 22px}
.sd-inc li{position:relative; padding-left:24px; font-size:14px; line-height:1.5; color:var(--ink-soft)}
.sd-inc li::before{
  content:""; position:absolute; left:3px; top:6px; width:9px; height:5px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink); transform:rotate(-45deg);
}
.sd-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:18px}
.sd-step{padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff}
.sd-num{
  display:flex; align-items:center; justify-content:center; width:28px; height:28px;
  border-radius:9px; font-family:'Archivo',sans-serif; font-size:13px; font-weight:700;
  color:var(--ink); background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent; margin-bottom:12px;
}
.sd-step b{display:block; font-family:'Archivo',sans-serif; font-size:14.5px; font-weight:700; letter-spacing:-0.02em}
.sd-step small{display:block; margin-top:6px; font-size:13px; line-height:1.55; color:var(--ink-soft)}
.sd-empty{
  margin-top:16px; padding:26px; text-align:center; font-size:13.5px; color:var(--ghost);
  border:1px dashed var(--line); border-radius:16px;
}
.sd-prov{display:flex; align-items:center; gap:14px; margin-top:16px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff}
.sd-prov-logo{flex:none; width:52px; height:52px; border-radius:14px; background:var(--grad)}
.sd-prov b{display:flex; align-items:center; gap:6px; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.sd-prov b svg{width:15px; height:15px; fill:none; stroke:#FF5F0E; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.sd-prov small{display:block; margin-top:4px; font-size:13px; color:var(--ink-soft)}
.sd-prov a{margin-left:auto; font-size:13.5px; color:var(--accent-ink, #c2521a); text-decoration:none; white-space:nowrap}
/* Sağlayıcı kimliği tıklanabilir: overlay anchor kartın tamamını kaplar,
   görünür "Tüm hizmetleri" linki aynı profile gider. */
.sd-prov.is-tikla,
.sd-buy-top.is-tikla{position:relative}
.sd-prov a.sd-prov-ort,
.sd-buy-top a.sd-prov-ort{position:absolute; inset:0; margin:0; border-radius:inherit}
.sd-prov.is-tikla:hover{border-color:#cfcfc9}
.sd-prov.is-tikla:hover b,
.sd-buy-top.is-tikla:hover b{text-decoration:underline; text-underline-offset:3px}

/* satın alma kartı */
.sd-buy{position:sticky; top:20px; border:1px solid var(--line); border-radius:20px; background:#fff; padding:22px}
.sd-buy-top{display:flex; align-items:center; gap:11px; padding-bottom:16px; border-bottom:1px solid var(--line)}
.sd-buy-logo{flex:none; width:40px; height:40px; border-radius:12px; background:var(--grad)}
.sd-buy-top b{display:block; font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.sd-buy-top small{display:block; margin-top:2px; font-size:12.5px; color:var(--ghost)}
.sd-price{display:flex; align-items:baseline; gap:8px; margin-top:16px; flex-wrap:wrap}
.sd-price em{font-style:normal; font-family:'Archivo',sans-serif; font-size:30px; font-weight:700; letter-spacing:-0.04em}
.sd-price span{font-size:13px; color:var(--ink-soft)}
.sd-taksit{margin-top:8px; font-size:12.5px; color:var(--ink-soft)}
.sd-actions{display:flex; flex-direction:column; gap:9px; margin-top:18px}
.sd-btn{
  width:100%; text-align:center; font-size:15px; font-weight:500; padding:13px 18px;
  border-radius:12px; text-decoration:none; border:1px solid transparent; cursor:pointer;
}
.sd-btn.is-primary{background:var(--ink); color:#fff}
.sd-btn.is-primary:hover{background:#2e2e34}
.sd-btn.is-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.sd-btn.is-ghost:hover{border-color:#cfcfc9}
.sd-trust{margin-top:16px; padding-top:16px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px}
.sd-trust span{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-soft)}
.sd-trust svg{flex:none; width:15px; height:15px; fill:none; stroke:#2f7d53; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}

.sd-more{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.sd-more h2{font-family:'Archivo',sans-serif; font-size:20px; font-weight:700; letter-spacing:-0.03em; margin-bottom:14px}
.sd-more + .sd-more{padding-top:0}
.sd-rows{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.sd-row{
  display:flex; align-items:center; gap:12px; padding:14px;
  border:1px solid var(--line); border-radius:16px; background:#fff;
  text-decoration:none; color:var(--ink); transition:border-color .15s ease;
}
.sd-row:hover{border-color:#d9d9d3}
.sd-row-th{flex:none; width:44px; height:44px; border-radius:12px; background:var(--grad)}
.sd-row-t{min-width:0}
.sd-row-t b{display:block; font-size:13.5px; font-weight:600; line-height:1.3}
.sd-row-t small{display:block; margin-top:3px; font-size:12.5px; color:var(--ink-soft)}
.sd-row-go{margin-left:auto; color:var(--ghost); font-size:17px}
@media (max-width:1040px){ .sd-wrap{grid-template-columns:1fr} .sd-buy{position:static} .sd-steps{grid-template-columns:1fr 1fr} .sd-rows{grid-template-columns:1fr 1fr} }
@media (max-width:620px){ .sd-inc{grid-template-columns:1fr} .sd-steps{grid-template-columns:1fr} .sd-rows{grid-template-columns:1fr} }

/* ---- servis detay · sorular ve yanıtlar ---- */
.qa-top{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap}
.qa-top p{font-size:14px; line-height:1.6; color:var(--ink-soft); max-width:58ch}
.qa-top p b{color:var(--ink); font-weight:500}
.qa-top .sd-btn{flex:none; padding:11px 18px; font-size:14px}

.qa-l{list-style:none; margin:22px 0 0; padding:0}
.qa-item{padding:20px 0; border-bottom:1px solid var(--line)}
.qa-item:first-child{padding-top:0}
.qa-item:last-child{border-bottom:0}
.qa-q, .qa-a{display:flex; gap:13px}
.qa-a{margin-top:14px; padding-left:32px}
.qa-mark{
  width:24px; height:24px; flex:none; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  background:var(--soft); color:var(--ink-soft);
  font-family:'Archivo',sans-serif; font-size:12px; font-weight:700;
}
.qa-mark.is-a{background:var(--ink); color:#fff}
.qa-q p{font-size:15px; line-height:1.55; font-weight:500}
.qa-a p{font-size:14px; line-height:1.7; color:var(--ink-soft)}
.qa-q small, .qa-a small{display:block; margin-top:6px; font-size:12.5px; color:var(--ghost)}
.qa-a small b{font-weight:500; color:var(--ink-soft)}
.qa-a small svg{
  width:13px; height:13px; vertical-align:-2px; fill:none; stroke:#2f7d53;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:640px){
  .qa-a{padding-left:0}
  .qa-top .sd-btn{width:100%}
  .qa-form-f span{width:100%}
  .qa-form-f .sd-btn{flex:1}
}

/* ---- modal (pazarlama tarafı) ---- */
.ovl{
  position:fixed; inset:0; z-index:90;
  display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(20,20,25,.38);
}
.ovl[hidden]{display:none}
.mdl{
  display:flex; flex-direction:column; width:100%; max-width:540px;
  max-height:calc(100vh - 48px); background:#fff; border-radius:20px;
  box-shadow:0 24px 70px rgba(20,20,25,.28);
}
.mdl-h{
  display:flex; align-items:flex-start; gap:16px;
  padding:20px 22px 17px; border-bottom:1px solid var(--line);
}
.mdl-ht{flex:1; min-width:0}
.mdl-ht b{
  display:block; font-family:'Archivo',sans-serif; font-size:17px;
  font-weight:700; letter-spacing:-0.02em;
}
.mdl-ht small{display:block; margin-top:4px; font-size:12.5px; line-height:1.5; color:var(--ink-soft)}
.mdl-x{
  flex:none; display:flex; padding:7px; border:0; border-radius:9px;
  background:transparent; cursor:pointer; transition:background .15s ease;
}
.mdl-x:hover{background:var(--soft)}
.mdl-x svg{
  width:18px; height:18px; fill:none; stroke:var(--ink-soft);
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.mdl-b{flex:1; padding:18px 22px; overflow-y:auto}
.mdl-f{
  display:flex; align-items:center; justify-content:flex-end; gap:10px;
  padding:15px 22px; border-top:1px solid var(--line);
}
.mdl-f .sd-btn{padding:12px 20px; font-size:14px}
body.is-locked{overflow:hidden}

/* ---- soru modali içeriği ---- */
.sor-prov{display:flex; align-items:center; gap:12px; padding:13px 15px; border-radius:14px; background:var(--soft)}
.sor-logo{width:38px; height:38px; flex:none; border-radius:11px; background:var(--grad)}
.sor-id{flex:1; min-width:0}
.sor-id b{display:block; font-size:14px; font-weight:500}
.sor-id b svg{
  width:14px; height:14px; vertical-align:-2px; fill:none; stroke:#2f7d53;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
.sor-id small{display:block; margin-top:2px; font-size:12.5px; color:var(--ink-soft)}
.sor-sla{
  flex:none; display:inline-flex; align-items:center; gap:6px;
  font-size:12px; padding:5px 10px; border-radius:999px; background:#fff; color:var(--ink-soft);
}
.sor-sla svg{
  width:13px; height:13px; fill:none; stroke:currentColor;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

.sor-hints{margin-top:15px}
.sor-hints > small{display:block; font-size:12.5px; color:var(--ink-soft)}
.sor-hints > div{display:flex; gap:6px; flex-wrap:wrap; margin-top:9px}
.sor-h{
  font:inherit; font-size:12.5px; padding:7px 12px; cursor:pointer;
  border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink-soft);
  transition:border-color .15s ease, color .15s ease;
}
.sor-h:hover{border-color:#d4d4ce; color:var(--ink)}

.sor-f{display:block; margin-top:15px}
.sor-f > span{display:flex; align-items:baseline; justify-content:space-between; gap:12px; font-size:12.5px; color:var(--ink-soft)}
.sor-f > span em{font-style:normal; font-size:12px; color:var(--ghost); font-variant-numeric:tabular-nums}
.sor-f textarea, .sor-f input{
  width:100%; margin-top:7px; font:inherit; font-size:14px; line-height:1.6; color:var(--ink);
  padding:12px 13px; border:1px solid var(--line); border-radius:12px; background:#fff;
}
.sor-f textarea{resize:vertical}
.sor-f textarea:focus, .sor-f input:focus{outline:none; border-color:#c9c9c2}
.sor-f > small{display:block; margin-top:6px; font-size:12px; color:var(--ghost)}
.sor-as{display:flex; align-items:center; gap:11px; margin-top:14px; font-size:13px; color:var(--ink-soft)}
.sor-as-av{
  width:32px; height:32px; flex:none; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:var(--soft); color:var(--ink-soft);
  font-family:'Archivo',sans-serif; font-size:11.5px; font-weight:700;
}
.sor-as b{font-weight:500; color:var(--ink)}
.sor-as small{display:block; margin-top:3px; font-size:12px; line-height:1.5; color:var(--ghost)}
.sor-as small b{font-weight:500; color:var(--ink-soft)}
.sor-note{
  display:flex; align-items:flex-start; gap:8px; margin-top:14px;
  font-size:12px; line-height:1.6; color:var(--ink-soft);
}
.sor-note svg{
  width:15px; height:15px; flex:none; margin-top:2px; fill:none; stroke:var(--ghost);
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:600px){
  .ovl{padding:0; align-items:flex-end}
  .mdl{max-width:none; max-height:94vh; border-radius:20px 20px 0 0}
  .mdl-f .sd-btn{flex:1; text-align:center}
}


/* -------------------------------------------------------------------------
   GERÇEK GÖRSELLER

   Tasarım paketinde bu kutular gradyan yer tutucuydu (içleri boştu); gerçek
   sayfada kapak fotoğrafı ve sağlayıcı logosu var. Kutunun kendi köşe
   yuvarlaklığı ve boyutu korunsun diye görsel kutuyu doldurup `inherit`
   köşe alıyor. Görsel yoksa gradyan yine görünür.
   ------------------------------------------------------------------------- */
.sd-row-th img{
  display:block; width:100%; height:100%;
  object-fit:cover; border-radius:inherit;
}
/* LOGOLAR: cover kırpar, contain sığdırır. Gradyan yalnız YER TUTUCU (logo
   yokken); logo varken kutu beyaza döner — şeffaf PNG'lerin arkasında gradyan
   görünüyordu (kullanıcı sorusu). Küçük iç boşluk logoyu nefeslendirir. */
.sd-prov-logo img,
.sd-buy-logo img,
.sor-logo img{
  display:block; width:100%; height:100%;
  object-fit:contain; border-radius:inherit; padding:5px;
}
.sd-prov-logo:has(img),
.sd-buy-logo:has(img),
.sor-logo:has(img){background:#fff; border:1px solid var(--line)}

/* Kapak: görsel kutuyu kaplıyor, oynat düğmesi ÜSTÜNDE duruyor. `.sd-cover`
   flex-merkezli olduğu için görsel akışta bırakılsaydı düğmeyle yan yana
   dizilirdi — bu yüzden mutlak konum. */
.sd-cover img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.sd-cover.has-video .sd-play{cursor:pointer; border:0; padding:0}
.sd-cover.has-video .sd-play:hover{background:#fff}

/* Video oynatılırken karartma katmanı ve dolgu kalkıyor. */
.sd-cover.is-playing{display:block}
.sd-cover.is-playing::after{display:none}
.sd-cover.is-playing iframe{position:absolute; inset:0; width:100%; height:100%; border:0}

/* Soru gönderim sonucu — hata kırmızı. */
.sor-note.is-err{color:#b3261e}
.sor-note.is-err svg{stroke:#b3261e}

/* Menüde POST gerektiren işler <form><button> ile geliyor; buton tarayıcı
   varsayılanına (gri kutu) düşmesin. <a> karşılığı yukarıda zaten tanımlı. */
.sel-list li > form{flex:1; min-width:0; margin:0}
.sel-list li > form > button,
.sel-list li > button:not([class]){
  display:block; width:100%; text-align:left; padding:0;
  font:inherit; font-size:13.5px; line-height:inherit; color:inherit;
  background:none; border:0; box-shadow:none; cursor:pointer;
}

/* ---- .sd-icerik: eski editör içeriğini ehlileştirme -----------------------
   Açıklama HTML'i eski Sneat editöründen (çoğu Word yapıştırması) geliyor:
   inline font-family/size/color, boş paragraflar, "·&nbsp;" sahte maddeler,
   sabit genişlikli öğeler... Tasarımın tipografisini ezip detay sayfasını
   iki yüzeyde de bozuyordu. Bu kapsam inline stilleri etkisizleştirir,
   metni tasarımın düzenine çeker. Başlık/kalın kuralları * sıfırlamasından
   SONRA ve daha özgül — onlar kendi değerlerini geri alır. */
/* Sıfırlama yalnız İÇERİDEKİLERE — kap kendisi dahil edilirse inherit!important
   kabın kendi 15px/1.75 değerlerini de ezip üstten 16px/normal aldırıyordu. */
.sd-icerik *{
  font-family:inherit !important; font-size:inherit !important;
  line-height:inherit !important; color:inherit !important;
  background:transparent !important; width:auto !important;
}
.sd-icerik{font-size:15px; line-height:1.75; color:var(--ink-soft)}
.sd-icerik p{margin:0 0 14px}
.sd-icerik p:last-child{margin-bottom:0}
.sd-icerik b, .sd-icerik strong{color:var(--ink) !important; font-weight:600}
.sd-icerik h1, .sd-icerik h2, .sd-icerik h3, .sd-icerik h4{
  font-family:'Archivo',sans-serif !important; font-size:17px !important;
  color:var(--ink) !important; margin:20px 0 8px; font-weight:600; letter-spacing:-0.01em;
}
.sd-icerik img{max-width:100% !important; height:auto !important; border-radius:12px}
.sd-icerik ul, .sd-icerik ol{margin:0 0 14px 18px; padding:0}
.sd-icerik li{margin:4px 0}
.sd-icerik table{max-width:100%; border-collapse:collapse}
.sd-icerik td, .sd-icerik th{border:1px solid var(--line); padding:8px 10px; font-size:13.5px}
.sd-icerik a{color:var(--accent, #FF5F0E) !important; text-decoration:none}