/* ==========================================================================
   Fatih Agkaş Mali Müşavirlik — Ön yüz stilleri
   Mobil öncelikli, erişilebilir, bağımlılıksız.
   ========================================================================== */

:root{
  --c-primary:#0b2545;
  --c-primary-700:#081c34;
  --c-primary-050:#eef3f9;
  --c-accent:#c8a24a;
  --c-accent-700:#a8862f;
  --c-text:#1c2530;
  --c-muted:#5c6b7a;
  --c-line:#e3e8ef;
  --c-bg:#ffffff;
  --c-bg-alt:#f6f8fb;
  --c-ok:#0f7b4f;
  --c-err:#c0392b;

  --radius:14px;
  --radius-sm:9px;
  --r-btn:10px;
  --r-input:10px;
  --bw:1px;
  --shadow-sm:0 1px 2px rgba(11,37,69,.06),0 2px 8px rgba(11,37,69,.05);
  --shadow:0 8px 30px rgba(11,37,69,.09);
  --shadow-lg:0 20px 50px rgba(11,37,69,.14);

  --ff:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --ff-heading:var(--ff);--ff-body:var(--ff);--ff-menu:var(--ff);--ff-button:var(--ff);
  --c-secondary:#134074;--c-heading:var(--c-primary);
  --c-btn-bg:var(--c-primary);--c-btn-text:#fff;--c-btn-hover-bg:var(--c-primary-700);--c-btn-hover-text:#fff;
  --c-link:var(--c-primary);--c-link-hover:var(--c-accent-700);
  --c-footer-bg:var(--c-primary-700);--c-footer-text:#a9bbd0;
  --fs-h1:42px;--fs-h2:32px;--fs-h3:24px;--fs-h4:20px;--fs-h5:17px;--fs-h6:16px;
  --fs-body:16px;--fs-menu:15px;--fs-btn:15px;--fs-footer:15px;
  --fw-heading:700;--fw-body:400;--fw-menu:600;--fw-btn:600;
  --lh-body:1.7;--lh-heading:1.25;--ls-body:0;--ls-heading:-.3px;--p-space:16px;
  --section-y:84px;--card-pad:28px;--btn-h:48px;--btn-px:24px;--anim:200ms;
  --btn-shadow:0 8px 30px rgba(11,37,69,.14);
  --container:1200px;
  --gap:24px;
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{
  margin:0;font-family:var(--ff-body);color:var(--c-text);background:var(--c-bg);
  font-size:var(--fs-body);font-weight:var(--fw-body);line-height:var(--lh-body);
  letter-spacing:var(--ls-body);-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg,video,iframe{max-width:100%;height:auto;display:block}
a{color:var(--c-link);text-decoration:none;transition:color var(--anim)}
a:hover{color:var(--c-link-hover)}
h1,h2,h3,h4,h5,h6{
  font-family:var(--ff-heading);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);
  margin:0 0 .6em;font-weight:var(--fw-heading);color:var(--c-heading);
}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
h4{font-size:var(--fs-h4)}
h5{font-size:var(--fs-h5)}
h6{font-size:var(--fs-h6)}
p{margin:0 0 var(--p-space)}
ul,ol{margin:0 0 1em;padding-left:1.2em}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px;border-radius:4px}
address{font-style:normal}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* --- yardımcılar --- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:18px}
.container--narrow{max-width:840px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--c-accent);color:#fff;padding:12px 20px;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
.muted{color:var(--c-muted);font-size:.92rem}
.mt-xl{margin-top:48px}
.h2{font-size:var(--fs-h3);margin-bottom:20px}
.empty{padding:48px 0;text-align:center;color:var(--c-muted)}
.ico{width:24px;height:24px;flex:none}
.ico--sm{width:17px;height:17px}
.ico--star{width:15px;height:15px;fill:var(--c-accent);stroke:var(--c-accent)}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}

/* ==========================================================================
   Bakım modu uyarı şeridi (yalnızca giriş yapmış yöneticiye görünür)
   ========================================================================== */
.maint-bar{background:#8a5a00;color:#fff;font-size:.85rem}
.maint-bar__in{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:9px 18px}
.maint-bar strong{color:#ffdf9e}
.maint-bar a{
  margin-left:auto;color:#1a1405;background:#ffc94d;padding:5px 13px;border-radius:7px;
  font-weight:700;font-size:.8rem;white-space:nowrap;
}
.maint-bar a:hover{background:#fff;color:#1a1405}
.maint-bar__dot{
  width:9px;height:9px;border-radius:50%;background:#ffc94d;flex:none;
  box-shadow:0 0 0 0 rgba(255,201,77,.7);animation:maintPulse 2s infinite;
}
@keyframes maintPulse{
  70%{box-shadow:0 0 0 9px rgba(255,201,77,0)}
  100%{box-shadow:0 0 0 0 rgba(255,201,77,0)}
}
@media (max-width:640px){
  .maint-bar__in{padding:9px 14px;font-size:.8rem}
  .maint-bar a{margin-left:0;width:100%;text-align:center}
}

/* ==========================================================================
   Üst bar
   ========================================================================== */
.topbar{background:var(--c-primary-700);color:#cbd7e6;font-size:.82rem}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;flex-wrap:wrap}
.topbar__left{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.topbar__item{display:inline-flex;align-items:center;gap:6px;color:#cbd7e6}
.topbar__item:hover{color:#fff}
.topbar__right{display:flex;gap:6px}
.topbar__social{display:grid;place-items:center;width:28px;height:28px;border-radius:6px;color:#cbd7e6;transition:background .2s,color .2s}
.topbar__social svg{width:15px;height:15px}
.topbar__social:hover{background:rgba(255,255,255,.12);color:#fff}
@media (max-width:860px){
  .topbar__item--hide{display:none}
  .topbar{font-size:.78rem}
}
@media (max-width:520px){
  .topbar__in{justify-content:center}
  .topbar__left{gap:12px;justify-content:center}
}

/* ==========================================================================
   Header + navigasyon
   ========================================================================== */
.header{
  position:sticky;top:0;z-index:100;background:var(--c-bg);
  backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--c-line);
  transition:box-shadow .25s;
}
.header.is-stuck{box-shadow:var(--shadow-sm)}
/* Bar yüksekliği içeriğe göre kendiliğinden ayarlanır: logo, ayarlanan header
   yüksekliğine sığmıyorsa bar büyür; sığıyorsa fazladan boşluk oluşmaz.
   Sabit bir calc() yerine padding kullanmak, logosuz kurulumda da doğru çalışır. */
.header__in{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:var(--header-h);padding-block:12px;
}

.brand{display:flex;align-items:center;gap:11px;color:var(--c-primary)}
.brand__mark{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:var(--c-primary);color:var(--c-accent);flex:none}
.brand__mark .ico{width:22px;height:22px}
.brand{min-width:0}
/* Logo ölçüsü Tasarım Ayarları → Logo'dan yönetilir.
   Dosya ekranda görünenden büyük tutulduğu için 2x/3x ekranlarda da nettir;
   object-fit:contain sayesinde maksimum genişliğe dayansa bile oranı bozulmaz. */
.brand picture{display:block;min-width:0;flex:none}
/* Kutu değil, logonun kendisi ölçeklenir: yükseklik ve genişlik sınırlarından
   hangisi önce dolarsa oran korunarak ona göre küçülür. Böylece görselin
   çevresinde ölü boşluk oluşmaz ve hiçbir ekranda oran bozulmaz.
   vw sınırı, çok geniş logoların dar telefonlarda yatay taşma yaratmasını önler. */
.brand__logo{
  display:block;width:auto;height:auto;
  max-height:var(--logo-h);
  max-width:min(var(--logo-maxw), 58vw);
}
.brand--footer .brand__logo{
  max-height:var(--logo-f-h);
  max-width:min(var(--logo-f-maxw), 78vw);
}
.brand__text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
/* Menüye öğe eklendikçe marka adı satır ortasından bölünmesin; kibarca kısalsın */
.brand__text strong,.brand__text small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand__text strong{font-size:1.03rem;letter-spacing:-.2px}
.brand__text small{font-size:.7rem;color:var(--c-muted);font-weight:500;letter-spacing:.3px;text-transform:uppercase}

.nav{display:flex;align-items:center;gap:22px}
.nav__list{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.nav__item{position:relative}
.nav__item>a{
  display:flex;align-items:center;gap:5px;padding:10px 13px;border-radius:var(--r-btn);
  font-family:var(--ff-menu);font-weight:var(--fw-menu);font-size:var(--fs-menu);
  color:var(--c-text);transition:background var(--anim),color var(--anim);
}
.nav__item>a:hover,.nav__item>a.is-active{background:var(--c-primary-050);color:var(--c-primary)}
.nav__item>a.is-active{position:relative}
.caret{width:15px;height:15px;transition:transform .2s}
.nav__sub{
  position:absolute;top:calc(100% + 6px);left:0;min-width:240px;background:#fff;border:1px solid var(--c-line);
  border-radius:var(--radius-sm);box-shadow:var(--shadow);list-style:none;margin:0;padding:8px;
  opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:20;
}
.nav__item:hover>.nav__sub,.nav__item:focus-within>.nav__sub{opacity:1;visibility:visible;transform:translateY(0)}
.nav__sub a{display:block;padding:9px 12px;border-radius:7px;font-size:.9rem;color:var(--c-text)}
.nav__sub a:hover{background:var(--c-primary-050);color:var(--c-primary)}
.sub-toggle{display:none}

.nav-toggle{
  display:none;width:44px;height:44px;border:1px solid var(--c-line);border-radius:10px;
  background:#fff;padding:0;place-items:center;
}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--c-primary);border-radius:2px;margin:4px auto;transition:.25s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Menü açıkken sayfayı karartan katman.
   Renk NÖTR olmalı — lacivert/mavi bir tül, sitenin renkleriyle çakışıp kirli görünür.
   saturate(.85) ile arkadaki renkler hafifçe soğurulur, cam etkisi modern durur. */
.nav-backdrop{
  position:fixed;inset:0;z-index:110;
  background:rgba(10,12,15,.66);
  /* saturate(.25): arkadaki lacivert hero yarı saydam katmandan geçip mavi bir
     tül izlenimi yaratıyordu; doygunluğu düşürünce arka plan nötr griye iner. */
  backdrop-filter:blur(4px) saturate(.25);
  -webkit-backdrop-filter:blur(4px) saturate(.25);
  animation:navFade .25s ease;
}
/* backdrop-filter desteklemeyen eski tarayıcılarda rengi opaklıkla bastır */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav-backdrop{background:rgba(10,12,15,.8)}
}
@keyframes navFade{from{opacity:0}to{opacity:1}}

/* Masaüstünde çekmece başlığı ve kaydırma sarmalayıcısı devrede değil */
.nav__head,.nav__call{display:none}
.nav__scroll{display:contents}

@media (max-width:1024px){
  /* ÖNEMLİ: header'daki backdrop-filter, içindeki position:fixed öğeler için
     "containing block" oluşturur ve çekmeceyi header'ın içine hapseder.
     Mobilde bu efekti kapatıyoruz ki menü gerçekten ekranı kaplasın. */
  .header{backdrop-filter:none;background:#fff}

  .nav-toggle{display:grid}

  .nav{
    position:fixed;inset:0 0 0 auto;               /* sağ kenardan tam yükseklik */
    width:min(380px,100%);max-width:100%;
    height:100vh;height:100dvh;                    /* mobil tarayıcı çubuğuna uyum */
    background:#fff;z-index:120;
    display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;
    transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
    box-shadow:-18px 0 50px rgba(8,28,52,.28);
    overscroll-behavior:contain;
  }
  .nav.is-open{transform:translateX(0)}

  /* --- çekmece başlığı --- */
  .nav__head{
    display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;
    padding:14px 16px;border-bottom:1px solid var(--c-line);background:var(--c-primary);
    padding-top:calc(14px + env(safe-area-inset-top,0px));
  }
  .nav__head-brand{display:flex;align-items:center;gap:10px;min-width:0}
  .nav__head .brand__mark{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.12)}
  .nav__head .brand__mark .ico{width:19px;height:19px}
  .nav__head-title{
    color:#fff;font-weight:700;font-size:.95rem;line-height:1.25;
    overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  }
  .nav__close{
    flex:none;width:42px;height:42px;border:0;border-radius:11px;
    background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;
  }
  .nav__close svg{width:20px;height:20px}
  .nav__close:hover,.nav__close:focus-visible{background:var(--c-accent);color:#1a1405}

  /* --- kaydırılabilir liste --- */
  .nav__scroll{
    display:block;flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;padding:8px 14px 14px;
  }
  .nav__list{flex-direction:column;align-items:stretch;gap:2px}
  .nav__item{position:relative;border-bottom:1px solid var(--c-line)}
  .nav__item:last-child{border-bottom:0}
  .nav__item>a{
    padding:15px 46px 15px 12px;font-size:1rem;border-radius:10px;
    justify-content:flex-start;min-height:52px;
  }
  .nav__item>a.is-active{background:var(--c-primary-050);color:var(--c-primary);font-weight:700}
  .nav__item .caret{display:none}

  /* alt menü açma düğmesi */
  .sub-toggle{
    display:grid;place-items:center;position:absolute;top:4px;right:4px;
    width:44px;height:44px;border:1px solid var(--c-line);border-radius:10px;background:#fff;
  }
  .sub-toggle::before,.sub-toggle::after{
    content:"";position:absolute;background:var(--c-primary);border-radius:2px;transition:transform .25s,opacity .25s;
  }
  .sub-toggle::before{width:13px;height:2px}
  .sub-toggle::after{width:2px;height:13px}
  .sub-toggle[aria-expanded="true"]{background:var(--c-primary);border-color:var(--c-primary)}
  .sub-toggle[aria-expanded="true"]::before{background:#fff}
  .sub-toggle[aria-expanded="true"]::after{opacity:0}

  .nav__sub{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    padding:0 0 8px 14px;min-width:0;display:none;margin:0;
    border-left:2px solid var(--c-line);
  }
  .nav__sub.is-open{display:block}
  .nav__sub a{padding:12px 10px;font-size:.94rem;min-height:44px;display:flex;align-items:center}

  /* --- alt eylem alanı --- */
  .nav__cta{
    flex:none;display:grid;gap:9px;padding:14px 16px;border-top:1px solid var(--c-line);
    background:var(--c-bg-alt);padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));
  }
  .nav__cta .btn{width:100%;justify-content:center;padding:14px 20px}
  .nav__call{
    display:flex;align-items:center;justify-content:center;gap:8px;
    font-weight:700;font-size:.95rem;color:var(--c-primary);padding:11px;border-radius:10px;
    border:1px solid var(--c-line);background:#fff;
  }
  .nav__call:hover{border-color:var(--c-primary);background:var(--c-primary-050)}
  .nav__call .ico{color:var(--c-accent-700)}

  /* menü açıkken arka plan kaymasın */
  body.nav-open{overflow:hidden}
}

/* Dar telefonlarda çekmece tam ekran + marka ölçüleri */
@media (max-width:430px){
  .nav{width:100%;box-shadow:none}
  .brand__mark{width:38px;height:38px}
  .brand__text strong{font-size:.92rem}
  .brand__text small{font-size:.62rem;letter-spacing:.2px}
  .header__in{min-height:64px;padding-block:9px;gap:10px}
  .nav-toggle{width:42px;height:42px}
}
@media (max-width:360px){
  .container{padding-inline:14px}
  .brand{gap:8px}
  .brand__text strong{font-size:.85rem}
  .brand__text small{display:none}
  .brand__mark{width:34px;height:34px}
  .brand__mark .ico{width:19px;height:19px}
}

/* ==========================================================================
   Butonlar
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:var(--btn-h);padding:0 var(--btn-px);border-radius:var(--r-btn);
  border:calc(var(--bw) * 2) solid transparent;
  font-family:var(--ff-button);font-weight:var(--fw-btn);font-size:var(--fs-btn);
  line-height:1.2;cursor:pointer;
  transition:transform var(--anim),box-shadow var(--anim),background var(--anim),color var(--anim),border-color var(--anim);
  text-align:center;
}
.btnfx-lift .btn:hover{transform:translateY(-2px)}
.btnfx-scale .btn:hover{transform:scale(1.04)}
.btn:active{transform:translateY(0)}
.btn--primary{background:var(--c-btn-bg);color:var(--c-btn-text);border-color:var(--c-btn-bg)}
.btn--primary:hover{background:var(--c-btn-hover-bg);color:var(--c-btn-hover-text);box-shadow:var(--btn-shadow)}
.btn--accent{background:var(--c-accent);color:#1a1405;border-color:var(--c-accent)}
.btn--accent:hover{background:var(--c-accent-700);color:#fff;box-shadow:var(--btn-shadow)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--ghost:hover{background:rgba(255,255,255,.14);color:#fff;border-color:#fff}
.btn--ghost.btn--dark{color:var(--c-primary);border-color:var(--c-line)}
.btn--ghost.btn--dark:hover{background:var(--c-primary-050);color:var(--c-primary);border-color:var(--c-primary)}
.btn--wa{background:#25d366;color:#053b1a;border-color:#25d366}
.btn--wa:hover{background:#1da851;color:#fff}
.btn--sm{min-height:calc(var(--btn-h) - 10px);padding:0 calc(var(--btn-px) * .75);font-size:calc(var(--fs-btn) - 1px)}
.btn--lg{min-height:calc(var(--btn-h) + 8px);padding:0 calc(var(--btn-px) * 1.3);font-size:calc(var(--fs-btn) + 1px)}
.btn--block{width:100%}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{position:relative;background:var(--c-primary);color:#fff;overflow:hidden;isolation:isolate}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(1000px 420px at 82% 12%,rgba(200,162,74,.20),transparent 62%);
}
/* Tüm slaytlar tek grid hücresinde üst üste durur: yükseklik en uzun slayta göre
   sabitlenir, geçişte zıplama olmaz. Geçişler yalnızca opacity/transform ile
   yapılır — ikisi de GPU'da çalışır, düzen hesabı tetiklemez. */
/* minmax(0,1fr): grid öğeleri varsayılan olarak içeriklerinden dar olamaz
   (min-width:auto). Uzun başlık yüzünden slayt 416px'in altına inmiyor, dar
   telefonlarda hero taşıp yazı kırpılıyordu. */
.hero__slides{display:grid;position:relative;grid-template-columns:minmax(0,1fr)}
.hero__slide{
  /* Yükseklik .hero__content ile aynı kuraldan gelir (ekran genişliğine bağlı).
     Burada ayrıca vh kullanmak kutuyu orandan koparıyordu. */
  grid-area:1/1;position:relative;min-height:0;min-width:0;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .65s ease,visibility 0s linear .65s,transform .65s cubic-bezier(.22,.61,.36,1);
}
.hero__slide.is-active{
  opacity:1;visibility:visible;pointer-events:auto;z-index:2;
  transition:opacity .65s ease,visibility 0s,transform .65s cubic-bezier(.22,.61,.36,1);
}
/* Kaydırma efekti: yeni slayt yandan gelir */
.hero--slide .hero__slide{transform:translate3d(6%,0,0)}
.hero--slide .hero__slide.is-active{transform:translate3d(0,0,0)}
.hero--slide .hero__slide.is-leaving{transform:translate3d(-6%,0,0)}

.hero__bg{position:absolute;inset:0;z-index:0;display:block}
.hero__bg img{width:100%;height:100%;object-fit:cover;opacity:.28;display:block}
/* Hero yüksekliği ekran GENİŞLİĞİNE bağlanır (vw), yüksekliğine değil.
   Eskiden 60vh kullanılıyordu; pencere oranı değiştikçe kutu oranı da değişiyor,
   2:1 olarak hazırlanmış slayt görseli her ekranda farklı kırpılıyordu.
   50vw = tam 2:1 → görsel profil ölçüsünde yüklendiğinde hiç kırpılmaz. */
.hero__content{
  position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;
  min-height:clamp(430px,40vw,820px);
  padding-block:48px;align-items:flex-start;
}
/* Birden fazla banner varsa alttaki kumanda çubuğuna yer ayır ki içeriğe binmesin.
   Kutu kısaldığı için bu pay da küçültüldü; aksi hâlde içerik yukarı kayıp
   dikey dengeyi bozuyordu. */
.hero--multi .hero__content{padding-bottom:84px}
.hero__eyebrow{
  display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin:0 0 16px;
  padding:7px 15px;border:1px solid rgba(200,162,74,.5);border-radius:100px;
  background:rgba(200,162,74,.12);color:var(--c-accent);
  font-size:.78rem;font-weight:600;letter-spacing:.6px;text-transform:uppercase;
}
/* Dar ekranda başlık kutuya sığmalı: 8vw alt sınır, geniş ekranda ayarlanan
   H1 ölçüsü üst sınır. break-word ise çok uzun tek kelimelere karşı emniyet. */
.hero__title{
  font-size:clamp(1.55rem,8vw,calc(var(--fs-h1) * 1.2));
  color:#fff;margin:0 0 18px;font-weight:800;max-width:760px;
  overflow-wrap:break-word;
}
.hero__text{font-size:clamp(1rem,1.6vw,1.13rem);color:#c9d6e6;max-width:620px;margin:0 0 30px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px}
.hero--plain{padding-block:72px}
.hero--plain .hero__content{min-height:auto;padding-block:0}

/* --- hero'nun ekran genişliğine göre ölçüleri ---
   Bu blok, üstteki temel kuralların SONRASINDA durmalı: medya sorgusu özgüllük
   eklemez, önce yazılırsa sonraki temel kurallar onu ezer.

   Yükseklikler cihaz sınıfına göre ayrı ayrı belirlendi:
     masaüstü ≥1025px : genişliğin %40'ı (2.5:1) — 1440px'de 576px
     tablet   ≤1024px : yine %40 ama daha düşük tavan — 1024px'de 410px
     telefon  ≤768px  : genişliğin %125'i (0.8:1) — dikey mobil görselin oranı */
/* Dar masaüstü ve tabletlerde başlık, ekranla orantılı küçülür. Sabit büyük
   punto burada içeriği kutudan taşırıyor, kutu orandan kopuyor ve görsel
   yeniden kırpılıyordu. */
@media (min-width:769px) and (max-width:1200px){
  .hero__title{font-size:clamp(1.9rem,3.6vw,2.6rem)}
  .hero__text{font-size:1rem}
}
@media (max-width:1024px){
  .hero__content{min-height:clamp(390px,40vw,560px);padding-block:26px}
  .hero--multi .hero__content{padding-bottom:70px}
  .hero__eyebrow{margin-bottom:10px}
  .hero__title{margin-bottom:10px}
  .hero__text{margin-bottom:16px}
}
/* Telefonda dikey mobil görsel (0.8:1) devreye girer; kutu da o orana getirilir.
   İç boşluklar bilinçli olarak küçük: içerik 125vw'yi aşarsa kutu içeriğe göre
   uzar, oran bozulur ve görsel yeniden kırpılırdı. */
@media (max-width:768px){
  .hero__content{min-height:clamp(380px,125vw,980px);padding-block:20px}
  .hero--multi .hero__content{padding-bottom:72px}
  .hero__eyebrow{margin-bottom:10px;padding:5px 12px}
  .hero__title{margin-bottom:10px}
  .hero__text{margin-bottom:16px}
}
@media (max-width:400px){
  .hero__content{padding-block:14px}
  .hero--multi .hero__content{padding-bottom:66px}
  .hero__text{margin-bottom:12px}
}
/* --- alt kumanda çubuğu: [<]  • • •  [>] ---
   Oklar yanlarda dururken dar ve orta ekranlarda kaçınılmaz olarak metnin
   üzerine biniyordu. Tek bir alt çubukta toplanınca her genişlikte güvenli. */
.hero__nav{
  position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:6;
  display:flex;align-items:center;gap:12px;
  padding:6px;border-radius:100px;
  background:rgba(8,20,38,.34);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.hero__dots{display:flex;gap:8px}
.hero__dots button{
  width:36px;height:6px;border:0;border-radius:100px;background:rgba(255,255,255,.3);
  padding:0;transition:width .3s,background .3s;overflow:hidden;position:relative;cursor:pointer;
}
.hero__dots button:hover{background:rgba(255,255,255,.5)}
.hero__dots button[aria-selected="true"]{background:rgba(255,255,255,.28);width:58px}
.hero__dot-fill{position:absolute;inset:0;width:0;background:var(--c-accent);border-radius:100px}
.hero__dots button[aria-selected="true"] .hero__dot-fill{width:100%;transition:width var(--hero-int,6000ms) linear}
.hero.is-paused .hero__dots button[aria-selected="true"] .hero__dot-fill{transition:none}

/* --- oklar --- */
.hero__arrow{
  flex:none;width:38px;height:38px;border-radius:50%;border:0;
  background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;cursor:pointer;
  transition:background .2s,color .2s;
}
.hero__arrow svg{width:19px;height:19px}
.hero__arrow:hover{background:var(--c-accent);color:#1a1405}
.hero__arrow:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}
@media (max-width:400px){
  .hero__nav{gap:8px;padding:5px}
  .hero__arrow{width:34px;height:34px}
  .hero__dots button{width:28px}
  .hero__dots button[aria-selected="true"]{width:44px}
}
@media (prefers-reduced-motion:reduce){
  .hero__slide{transition:opacity .01ms}
  .hero__dot-fill{display:none}
}

/* ==========================================================================
   Sayfa başlığı
   ========================================================================== */
.page-hero{
  background:linear-gradient(140deg,var(--c-primary) 0%,var(--c-primary-700) 100%);
  color:#fff;padding:clamp(44px,7vw,76px) 0;position:relative;overflow:hidden;
}
.page-hero::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(760px 320px at 88% 0%,rgba(200,162,74,.20),transparent 60%);
}
.page-hero>*{position:relative;z-index:1}

/* --- banner görselli sayfa başlığı --- */
/* Görsel en altta, üzerinde okunabilirlik için koyu bir katman, en üstte yazı.
   Katman olmadan açık renkli bir bannerda beyaz başlık kaybolurdu. */
/* Seçici .page-hero>* kuralını kesin olarak geçsin diye özgülleştirildi:
   aksi hâlde görsel z-index:1 alır ve karartma katmanının üstüne çıkardı. */
.page-hero>.page-hero__bg{
  position:absolute;inset:0;z-index:0;display:block;
}
.page-hero__bg img{
  width:100%;height:100%;object-fit:cover;object-position:center;display:block;
}
/* Banner kutusu her sayfada AYNI ölçüde durur.
   Yükseklik başlık/özet uzunluğuna göre değişirse aynı görsel her sayfada farklı
   kırpılır ve tasarım dağılır. Bu yüzden yükseklik viewport genişliğine bağlanır
   (min-height), içerik ise yalnızca gerekirse kutuyu büyütebilir — asla taşmaz.
   Oranlar görsel profilleriyle eşleştirildi: masaüstü 4:1, tablet ~3.2:1,
   telefon ~1.95:1. Böylece tarayıcı tarafında ek kırpma neredeyse hiç olmuyor. */
.page-hero--img{
  display:flex;align-items:center;
  min-height:clamp(280px,25vw,480px);
  padding:38px 0;
}
@media (max-width:1024px){
  .page-hero--img{min-height:clamp(215px,25vw,330px);padding:32px 0}
}
@media (max-width:768px){
  .page-hero--img{min-height:clamp(200px,50vw,400px);padding:26px 0}
}
.page-hero--img>.container{width:100%}
.page-hero--img::after{
  background:
    linear-gradient(90deg,rgba(8,28,52,.86) 0%,rgba(8,28,52,.62) 55%,rgba(8,28,52,.42) 100%),
    radial-gradient(760px 320px at 88% 0%,rgba(200,162,74,.18),transparent 60%);
}
@media (max-width:768px){
  /* Dar ekranda yazı görselin her yerine denk gelebilir; katman biraz daha koyu */
  .page-hero--img::after{
    background:
      linear-gradient(180deg,rgba(8,28,52,.72) 0%,rgba(8,28,52,.84) 100%),
      radial-gradient(600px 260px at 88% 0%,rgba(200,162,74,.16),transparent 60%);
  }
}
.page-hero--sm{padding:clamp(34px,5vw,56px) 0}
.page-hero--post{padding-bottom:clamp(28px,4vw,44px)}
.page-hero__eyebrow{color:var(--c-accent);font-size:.8rem;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;margin:0 0 10px}
.page-hero__title{color:#fff;font-size:var(--fs-h1);margin:0 0 12px}
.page-hero__text{color:#c3d2e4;max-width:720px;margin:0;font-size:1.02rem}

/* --- iletişim numarası satırı --- */
.contact-list__who{
  display:block;font-size:.86rem;color:var(--c-muted);margin-bottom:2px;
}
.contact-list__wa{
  display:inline-flex;align-items:center;gap:6px;margin-top:6px;
  font-size:.83rem;font-weight:600;color:#128c7e;
}
.contact-list__wa:hover{color:#075e54}
.contact-list__wa .ico{width:15px;height:15px}

/* ==========================================================================
   Panelden yönetilen sayfa bölümleri
   ========================================================================== */
.psec{margin-top:48px}
.psec:first-child{margin-top:0}
.psec__eyebrow{
  color:var(--c-accent-700);font-size:.8rem;font-weight:700;letter-spacing:1.1px;
  text-transform:uppercase;margin:0 0 8px;
}
.psec__title{
  font-size:var(--fs-h2);margin:0 0 18px;position:relative;padding-left:16px;
}
.psec__title::before{
  content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:4px;
  border-radius:3px;background:var(--c-accent);
}
.psec__cards{
  display:grid;gap:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.pcard{
  background:var(--c-bg);border:var(--bw) solid var(--c-line);border-radius:var(--radius);
  padding:var(--card-pad);transition:box-shadow var(--anim),transform var(--anim),border-color var(--anim);
}
.pcard:hover{box-shadow:var(--shadow);transform:translateY(-3px);border-color:transparent}
.pcard__icon{
  display:grid;place-items:center;width:46px;height:46px;margin-bottom:14px;
  border-radius:12px;background:var(--c-primary-050);color:var(--c-primary);
}
.pcard__icon .ico{width:23px;height:23px}
.pcard__title{font-size:var(--fs-h5);margin:0 0 8px}
.pcard__text{color:var(--c-muted);font-size:.95rem;line-height:1.65}
.pcard__text p:last-child{margin-bottom:0}
@media (max-width:768px){
  .psec{margin-top:36px}
  .psec__cards{grid-template-columns:1fr}
}

/* --- breadcrumb --- */
.breadcrumb{background:var(--c-bg-alt);border-bottom:1px solid var(--c-line);font-size:.85rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:13px 0}
.breadcrumb li{display:flex;align-items:center;gap:8px;color:var(--c-muted)}
.breadcrumb li:not(:last-child)::after{content:"›";color:#9aa8b8}
.breadcrumb a{color:var(--c-muted)}
.breadcrumb a:hover{color:var(--c-primary)}
.breadcrumb span[aria-current]{color:var(--c-primary);font-weight:600}

/* ==========================================================================
   Bölümler
   ========================================================================== */
.section{padding:var(--section-y) 0}
.section--alt{background:var(--c-bg-alt)}
.section__head{max-width:720px;margin:0 auto clamp(32px,5vw,48px);text-align:center}
.section__eyebrow{color:var(--c-accent-700);font-size:.78rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;margin:0 0 10px}
.section__title{font-size:var(--fs-h2);margin:0 0 14px}
.section__desc{color:var(--c-muted);margin:0}
.section__foot{margin-top:38px;text-align:center}

/* --- hızlı avantajlar --- */
.quickfacts{background:var(--c-bg-alt);border-bottom:1px solid var(--c-line);padding:34px 0}
.quickfacts__grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.quickfact{display:flex;gap:14px;align-items:flex-start}
.quickfact .ico{color:var(--c-accent-700);margin-top:3px}
.quickfact h2{font-size:1rem;margin:0 0 4px}
.quickfact p{margin:0;font-size:.88rem;color:var(--c-muted);line-height:1.55}

/* --- kart ızgaraları --- */
.cards{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(285px,1fr))}
.cards--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.cards--3{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.cards--4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.card{
  background:var(--c-bg);border:var(--bw) solid var(--c-line);border-radius:var(--radius);
  padding:var(--card-pad) calc(var(--card-pad) - 4px);
  transition:transform var(--anim),box-shadow var(--anim),border-color var(--anim);position:relative;
}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:transparent}
.card__icon{
  display:grid;place-items:center;width:54px;height:54px;border-radius:13px;
  background:var(--c-primary-050);color:var(--c-primary);margin-bottom:17px;transition:.25s;
}
.card:hover .card__icon{background:var(--c-primary);color:var(--c-accent)}
.card__title{font-size:var(--fs-h5);margin:0 0 9px}
.card__title a{color:inherit}
.card__title a::after{content:"";position:absolute;inset:0}
.card__text{color:var(--c-muted);font-size:.92rem;margin:0 0 16px}
.card__link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.88rem;color:var(--c-accent-700)}
.card:hover .card__link .ico{transform:translateX(4px)}
.card__link .ico{transition:transform .25s}

/* --- blog kartı --- */
.post-card{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s;
}
.post-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.post-card__media{display:block;aspect-ratio:5/3;background:var(--c-primary-050);overflow:hidden}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.post-card:hover .post-card__media img{transform:scale(1.05)}
/* Kapak görseli olmayan yazı: Admin Panel → Blog Ayarları'ndan yönetilen ikon.
   Renk, zemin, boyut ve köşe yuvarlaklığı --bic-* değişkenlerinden gelir. */
.post-card__ph{
  display:grid;place-items:center;width:100%;height:100%;
  background:
    radial-gradient(130% 120% at 50% 0%,rgba(255,255,255,.7),rgba(255,255,255,0) 64%),
    var(--bic-bg,var(--c-primary-050));
}
.post-card__ph-in{
  display:grid;place-items:center;
  width:calc(var(--bic-size,48px) * 1.7);height:calc(var(--bic-size,48px) * 1.7);
  max-width:80%;max-height:80%;
  border-radius:var(--bic-radius,14px);
  background:#fff;color:var(--bic-color,var(--c-primary));
  box-shadow:0 6px 18px rgba(11,37,69,.10),0 0 0 1px rgba(11,37,69,.05);
  transition:transform .35s,box-shadow .35s;
}
.post-card:hover .post-card__ph-in{
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 14px 28px rgba(11,37,69,.17),0 0 0 1px rgba(11,37,69,.05);
}
/* Kutu ile ikon arasındaki oran sabit: boyut değişince ikon da orantılı büyür. */
.post-card__ph-in .ico{width:59%;height:59%;stroke-width:1.6}
/* Yüklenen kendi ikonunuz kendi renkleriyle görünür; kapak görseli kuralları uygulanmaz. */
.post-card__ph-in img.ico{object-fit:contain;transition:none}
.post-card:hover .post-card__ph-in img.ico{transform:none}
/* İkon sistemi kapalıyken eski sade yer tutucu */
.post-card__ph--sade{background:var(--c-primary-050);color:#b8c6d6}
.post-card__ph--sade .ico{width:44px;height:44px}
.post-card__body{padding:20px;display:flex;flex-direction:column;flex:1}
.post-card__body h2,.post-card__body h3{font-size:1.06rem;margin:10px 0 8px}
.post-card__body p{color:var(--c-muted);font-size:.9rem;margin:0 0 14px}
.post-card__body time{display:flex;align-items:center;gap:6px;margin-top:auto;color:var(--c-muted);font-size:.82rem}
.post-card--sm .post-card__body{padding:18px}

.chip{
  display:inline-flex;align-items:center;align-self:flex-start;padding:5px 11px;border-radius:100px;
  background:var(--c-primary-050);color:var(--c-primary);font-size:.75rem;font-weight:600;
}
.chip--light{background:rgba(255,255,255,.16);color:#fff;margin-bottom:14px}
.chip--sm{font-size:.7rem;padding:3px 9px}

/* --- hakkımızda bloğu --- */
.about-block{padding:var(--section-y) 0;background:var(--c-bg)}
.about-block__grid{display:grid;gap:clamp(28px,5vw,52px);grid-template-columns:1fr;align-items:center}
@media (min-width:900px){.about-block__grid{grid-template-columns:5fr 6fr}}
.about-block__media img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;object-fit:cover}
.about-block__placeholder{
  display:grid;place-items:center;aspect-ratio:4/3;border-radius:var(--radius);
  background:linear-gradient(140deg,var(--c-primary),var(--c-primary-700));color:var(--c-accent);
}
.about-block__placeholder .ico{width:80px;height:80px}
.checklist{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:11px}
.checklist li{display:flex;align-items:flex-start;gap:10px;font-size:.94rem}
.checklist .ico{color:var(--c-accent-700);margin-top:5px}

/* --- sayaçlar --- */
.counters{background:var(--c-primary);color:#fff;padding:clamp(38px,5vw,58px) 0}
.counters__grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));text-align:center}
.counter strong{display:block;font-size:clamp(1.9rem,4.4vw,2.9rem);color:var(--c-accent);font-weight:800;line-height:1.1}
.counter span{font-size:.87rem;color:#b9c8da}

/* --- referanslar --- */
.testimonial{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:28px 24px;margin:0;position:relative;
}
.testimonial__quote{position:absolute;top:18px;right:20px;color:var(--c-primary-050)}
.testimonial__quote .ico{width:40px;height:40px;fill:var(--c-primary-050)}
.testimonial__stars{display:flex;gap:2px;margin-bottom:12px}
.testimonial blockquote{margin:0 0 18px;padding:0}
.testimonial blockquote p{margin:0;font-size:.95rem;color:var(--c-text);line-height:1.75}
.testimonial figcaption{display:flex;align-items:center;gap:12px;border-top:1px solid var(--c-line);padding-top:14px}
.testimonial__avatar{flex:none;width:52px;height:52px;border-radius:50%;overflow:hidden;background:var(--c-primary-050)}
.testimonial__avatar img{width:100%;height:100%;object-fit:cover}
.testimonial__who{display:flex;flex-direction:column;min-width:0}
.testimonial figcaption strong{color:var(--c-primary)}
.testimonial__who span{font-size:.83rem;color:var(--c-muted)}
.testimonial__date{font-size:.78rem;color:var(--c-muted);opacity:.8;margin-top:2px}

/* --- referans listesi / kaydırmalı şerit ---
   3 veya daha az referansta sabit ızgara; daha fazlasında yatay kaydırma.
   Kaydırma CSS ile yapılır (scroll-snap), JS yalnızca ok ve noktaları yönetir —
   böylece JS çalışmasa bile parmakla/klavyeyle kaydırma çalışmaya devam eder. */
.refs__track{
  display:grid;gap:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.refs--slider .refs__track{
  grid-auto-flow:column;grid-auto-columns:minmax(300px,1fr);
  grid-template-columns:none;
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:6px;scrollbar-width:thin;
  scroll-behavior:smooth;
}
.refs--slider .refs__track>*{scroll-snap-align:start}
.refs--slider .refs__track:focus-visible{outline:3px solid var(--c-accent);outline-offset:4px;border-radius:var(--radius)}
@media (min-width:769px){
  .refs--slider .refs__track{grid-auto-columns:calc((100% - var(--gap) * 2) / 3)}
}
@media (min-width:569px) and (max-width:768px){
  .refs--slider .refs__track{grid-auto-columns:calc((100% - var(--gap)) / 2)}
}
@media (max-width:568px){
  .refs--slider .refs__track{grid-auto-columns:88%}
}

.refs__nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px}
.refs__btn{
  display:grid;place-items:center;width:40px;height:40px;flex:none;
  border:1px solid var(--c-line);border-radius:50%;background:var(--c-bg);color:var(--c-primary);
  transition:background var(--anim),color var(--anim),border-color var(--anim),opacity var(--anim);
}
.refs__btn svg{width:19px;height:19px}
.refs__btn:hover:not(:disabled){background:var(--c-primary);color:#fff;border-color:var(--c-primary)}
.refs__btn:disabled{opacity:.35;cursor:default}
.refs__dots{display:flex;align-items:center;gap:7px}
.refs__dots button{
  width:9px;height:9px;padding:0;border:0;border-radius:50%;
  background:var(--c-line);transition:background var(--anim),width var(--anim);
}
.refs__dots button.is-active{width:24px;border-radius:100px;background:var(--c-accent)}

/* --- ekip --- */
.team-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:24px 20px;text-align:center}
.team-card__photo{width:110px;height:110px;margin:0 auto 16px;border-radius:50%;overflow:hidden;background:var(--c-primary-050);display:grid;place-items:center;color:#9fb0c4}
.team-card__photo img{width:100%;height:100%;object-fit:cover}
.team-card h3{font-size:1.06rem;margin:0 0 4px}
.team-card__pos{color:var(--c-accent-700);font-size:.85rem;font-weight:600;margin:0 0 10px}
.team-card__bio{color:var(--c-muted);font-size:.87rem;margin:0 0 14px}
.team-card__links{display:flex;justify-content:center;gap:8px}
.team-card__links a{
  display:grid;place-items:center;width:34px;height:34px;border-radius:9px;
  background:var(--c-primary-050);color:var(--c-primary);font-size:.8rem;font-weight:700;
}
.team-card__links a:hover{background:var(--c-primary);color:#fff}

/* --- akordiyon --- */
.accordion{display:grid;gap:12px}
.accordion__item{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-sm);overflow:hidden}
.accordion__item summary{
  cursor:pointer;list-style:none;padding:17px 52px 17px 20px;font-weight:600;color:var(--c-primary);
  position:relative;font-size:.98rem;
}
.accordion__item summary::-webkit-details-marker{display:none}
.accordion__item summary::after{
  content:"";position:absolute;right:20px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--c-accent-700);border-bottom:2px solid var(--c-accent-700);
  transform:translateY(-70%) rotate(45deg);transition:transform .25s;
}
.accordion__item[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.accordion__item[open] summary{background:var(--c-primary-050)}
.accordion__body{padding:16px 20px 20px;color:var(--c-muted);font-size:.94rem;border-top:1px solid var(--c-line)}
.accordion__body p{margin:0 0 .7em}
.accordion__body :last-child{margin-bottom:0}

/* --- S.S.S. bölümü: akıcı açılış/kapanış -------------------------------
   Yükseklik animasyonu için içerik ayrı bir sarmalayıcıda tutulur; grid
   satırı 0fr → 1fr geçişi hem yumuşak hem de içerik yüksekliğinden bağımsızdır.
   Animasyonu desteklemeyen tarayıcılarda <details> yine normal açılır. */
.accordion--faq .accordion__item{
  border-color:var(--c-line);box-shadow:0 1px 2px rgba(11,37,69,.04);
  transition:box-shadow .25s,border-color .25s;
}
.accordion--faq .accordion__item[open]{box-shadow:0 6px 20px rgba(11,37,69,.09);border-color:var(--c-primary-050)}
.accordion--faq .accordion__item:hover{border-color:#cfdae8}
.accordion--faq summary{padding-block:19px}
.accordion__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.22,.61,.36,1)}
.accordion__item[open] .accordion__panel{grid-template-rows:1fr}
.accordion__panel>.accordion__body{overflow:hidden;min-height:0}
@supports not (grid-template-rows:0fr){
  .accordion__panel{display:block}
}
.faq__title{font-size:clamp(1.3rem,3vw,1.9rem);margin:0 0 22px;color:var(--c-primary)}
@media (prefers-reduced-motion:reduce){
  .accordion__panel{transition:none}
  .accordion__item summary::after{transition:none}
}
@media (max-width:568px){
  .accordion--faq summary{padding:15px 44px 15px 15px;font-size:.94rem}
  .accordion--faq .accordion__body{padding:14px 15px 17px}
}

/* ==========================================================================
   Alt CTA banner — footer'dan bağımsız, kart görünümlü çağrı bölümü
   Sitedeki tüm CTA alanları bu tek bileşeni kullanır.
   Renk, ölçü ve efektler panelden gelir; her değer bir CSS değişkenine
   yazılır, boş bırakılanlar buradaki varsayılana düşer.
   Admin Panel → Alt CTA Banner Yönetimi
   ========================================================================== */

/* Dış sarmalayıcı: üst/alt boşluğu taşır. Kenar boşluğu (margin) <main>
   dışına taşıp kaybolabildiği için gerçek dolgu (padding) kullanılır;
   böylece footer koyu, banner koyu olsa bile aralarında sayfa zemini görünür. */
.ctawrap{background:var(--c-bg);padding-top:var(--cta-mt,clamp(40px,5vw,72px));padding-bottom:var(--cta-mb,clamp(40px,5vw,72px))}
.ctawrap--mt-yok{--cta-mt:0px}
.ctawrap--mt-dar{--cta-mt:clamp(20px,2.5vw,32px)}
.ctawrap--mt-normal{--cta-mt:clamp(40px,5vw,72px)}
.ctawrap--mt-genis{--cta-mt:clamp(60px,8vw,110px)}
.ctawrap--mt-cokgenis{--cta-mt:clamp(84px,11vw,160px)}
.ctawrap--mb-yok{--cta-mb:0px}
.ctawrap--mb-dar{--cta-mb:clamp(20px,2.5vw,32px)}
.ctawrap--mb-normal{--cta-mb:clamp(40px,5vw,72px)}
.ctawrap--mb-genis{--cta-mb:clamp(60px,8vw,110px)}
.ctawrap--mb-cokgenis{--cta-mb:clamp(84px,11vw,160px)}
.ctawrap__full{width:100%}

.cta{
  --cta-bg:var(--c-primary);
  --cta-bg2:#16406e;
  --cta-fg:#fff;
  --cta-btn-bg:var(--c-accent); --cta-btn-fg:var(--c-primary);
  --cta-btn-hbg:#e0b842; --cta-btn-hfg:var(--c-primary);
  --cta-ov:rgba(11,37,69,.55);
  --cta-angle:135deg;
  --cta-pad:clamp(40px,6vw,64px);
  --cta-padx:clamp(24px,4vw,64px);
  --cta-r:24px;
  --cta-sh:0 18px 50px rgba(11,37,69,.18);
  --cta-title:clamp(1.4rem,3vw,2.1rem);
  --cta-desc:1.02rem;
  position:relative;isolation:isolate;overflow:hidden;
  border-radius:var(--cta-r);
  box-shadow:var(--cta-sh);
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(var(--cta-angle),var(--cta-bg),var(--cta-bg2));
  color:var(--cta-fg);
  padding:var(--cta-pad) var(--cta-padx);
  transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s ease;
}
/* Kart modunda içerik container genişliğinde kalır, tam ekran uzamaz. */
.cta--w-tam{border-radius:0;box-shadow:none;border-inline:0}

/* Zeminin üstüne ince bir parlaklık: düz rengi "premium" hissettiren detay. */
.cta::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(120% 140% at 12% 0%,rgba(255,255,255,.14),transparent 55%),
    radial-gradient(90% 120% at 100% 100%,rgba(255,255,255,.07),transparent 60%);
}
.cta--img::before{background:none}

/* Arka plan görseli */
.cta__bg{position:absolute;inset:0;z-index:-3;display:block}
.cta__bg img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.cta__veil{position:absolute;inset:0;z-index:-2;background:var(--cta-ov)}

/* Dekoratif blur küreler + ince ızgara dokusu */
.cta__decor{position:absolute;z-index:-1;border-radius:50%;pointer-events:none;filter:blur(58px)}
/* Sağ üstte vurgu renginde yumuşak bir ışık; butonun kontrastını bozmayacak
   kadar hafif tutulur, bu yüzden kartın dışına doğru taşırılmıştır. */
.cta__decor--1{
  width:min(42%,380px);aspect-ratio:1;right:-11%;top:-64%;opacity:.42;
  background:radial-gradient(circle,var(--cta-btn-bg),transparent 64%);
  animation:ctaFloat 14s ease-in-out infinite;
}
.cta__decor--2{
  width:min(38%,330px);aspect-ratio:1;left:-10%;bottom:-58%;opacity:.22;
  background:radial-gradient(circle,rgba(255,255,255,.55),transparent 64%);
  animation:ctaFloat 18s ease-in-out infinite reverse;
}
.cta__grid{
  position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.16;
  background-image:linear-gradient(rgba(255,255,255,.25) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.25) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(90% 80% at 20% 0%,#000,transparent 72%);
          mask-image:radial-gradient(90% 80% at 20% 0%,#000,transparent 72%);
}
@keyframes ctaFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-4%,6%,0) scale(1.08)}
}

/* İçerik */
.cta__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(20px,3vw,40px);position:relative}
.cta__text{min-width:0;flex:1 1 460px}
.cta__eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;
  font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cta-btn-bg);
  padding:6px 14px;border-radius:999px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(6px);
}
.cta__dot{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.12)}
.cta__title{
  color:var(--cta-fg);font-size:var(--cta-title);line-height:1.18;letter-spacing:-.015em;
  margin:0 0 10px;text-wrap:balance;
}
.cta__desc{color:var(--cta-fg);opacity:.8;margin:0;font-size:var(--cta-desc);line-height:1.6;max-width:56ch}
.cta__actions{display:flex;flex-wrap:wrap;gap:12px;flex:0 0 auto}

/* Başlık ve açıklama boyutu */
.cta--ts-kucuk{--cta-title:clamp(1.15rem,2vw,1.45rem)}
.cta--ts-normal{--cta-title:clamp(1.4rem,3vw,2.1rem)}
.cta--ts-buyuk{--cta-title:clamp(1.65rem,3.8vw,2.7rem)}
.cta--ts-cokbuyuk{--cta-title:clamp(1.9rem,4.8vw,3.3rem)}
.cta--ps-kucuk{--cta-desc:.92rem}
.cta--ps-normal{--cta-desc:1.02rem}
.cta--ps-buyuk{--cta-desc:1.14rem}

/* Butonlar */
.cta__btn,.cta__btn2{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--cta-btn-bg);color:var(--cta-btn-fg);border:1px solid transparent;
  border-radius:calc(var(--cta-r) * .42 + 6px);font-weight:700;
  transition:background .2s ease,color .2s ease,transform .2s cubic-bezier(.22,.61,.36,1),box-shadow .2s ease,border-color .2s ease;
}
.cta__btn2{background:rgba(255,255,255,.08);color:var(--cta-fg);border-color:rgba(255,255,255,.28);backdrop-filter:blur(6px)}
.cta__arrow{width:17px;height:17px;flex:0 0 auto;transition:transform .25s cubic-bezier(.22,.61,.36,1)}
.cta__btn:hover .cta__arrow,.cta__btn:focus-visible .cta__arrow{transform:translateX(4px)}
.cta__btn:hover,.cta__btn:focus-visible{background:var(--cta-btn-hbg);color:var(--cta-btn-hfg)}
.cta__btn2:hover,.cta__btn2:focus-visible{background:var(--cta-btn-hbg);color:var(--cta-btn-hfg);border-color:transparent}
.cta--fx-lift .cta__btn:hover,.cta--fx-lift .cta__btn2:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.28)}
.cta--fx-glow .cta__btn:hover,.cta--fx-glow .cta__btn2:hover{box-shadow:0 0 0 5px rgba(255,255,255,.16)}
.cta--fx-grow .cta__btn:hover,.cta--fx-grow .cta__btn2:hover{transform:scale(1.06)}
.cta--fx-none .cta__btn:hover,.cta--fx-none .cta__btn2:hover{transform:none;box-shadow:none}

/* Kartın kendi hover davranışı */
.cta--card-lift:hover{transform:translateY(-4px);box-shadow:0 26px 62px rgba(11,37,69,.26)}
.cta--card-glow:hover{box-shadow:var(--cta-sh),0 0 0 2px rgba(255,255,255,.18)}
.cta--card-tilt:hover{transform:perspective(1200px) rotateX(1.1deg) translateY(-3px)}
.cta--card-none:hover{transform:none}

/* Hizalama */
.cta--center .cta__in{flex-direction:column;text-align:center;justify-content:center}
.cta--center .cta__text{flex:1 1 auto}
.cta--center .cta__desc{margin-inline:auto}
.cta--center .cta__actions{justify-content:center}
.cta--right .cta__in{flex-direction:row-reverse;text-align:right}
.cta--right .cta__desc{margin-inline-start:auto}
.cta--right .cta__actions{justify-content:flex-start}

/* İç boşluk */
.cta--pad-dar{--cta-pad:clamp(24px,3.5vw,36px);--cta-padx:clamp(20px,3vw,40px)}
.cta--pad-normal{--cta-pad:clamp(36px,5vw,60px);--cta-padx:clamp(24px,4vw,64px)}
.cta--pad-genis{--cta-pad:clamp(52px,7vw,88px);--cta-padx:clamp(30px,5vw,80px)}
.cta--pad-cokgenis{--cta-pad:clamp(68px,10vw,128px);--cta-padx:clamp(34px,6vw,104px)}

/* Köşe yuvarlaklığı */
.cta--r-yok{--cta-r:0px}
.cta--r-az{--cta-r:14px}
.cta--r-normal{--cta-r:24px}
.cta--r-cok{--cta-r:32px}

/* Gölge */
.cta--sh-yok{--cta-sh:none}
.cta--sh-hafif{--cta-sh:0 10px 28px rgba(11,37,69,.12)}
.cta--sh-normal{--cta-sh:0 18px 50px rgba(11,37,69,.18)}
.cta--sh-belirgin{--cta-sh:0 28px 72px rgba(11,37,69,.28)}

/* Banner yüksekliği — içerik azken bile sabit bir yükseklik tutar */
.cta--h-orta,.cta--h-buyuk,.cta--h-tam{display:flex;align-items:center}
.cta--h-orta{min-height:clamp(240px,22vw,320px)}
.cta--h-buyuk{min-height:clamp(300px,30vw,440px)}
.cta--h-tam{min-height:clamp(360px,40vw,580px)}
.cta--h-orta>.cta__in,.cta--h-buyuk>.cta__in,.cta--h-tam>.cta__in{width:100%}

@media (max-width:900px){
  .cta__in{flex-direction:column;align-items:flex-start;text-align:left}
  .cta--center .cta__in{align-items:center;text-align:center}
  .cta--right .cta__in{align-items:flex-end;text-align:right}
  .cta__text{flex:1 1 auto;width:100%}
  .cta__actions{width:100%}
}
@media (max-width:768px){
  /* Dar ekranda köşeler biraz kısılır. Değeri kendi kendine referans veren
     bir var() ile hesaplamak custom property'yi geçersiz kılıp yarıçapı
     tamamen sıfırladığı için her sınıf ayrı ayrı tanımlanır. */
  .cta--r-normal{--cta-r:18px}
  .cta--r-cok{--cta-r:20px}
  .cta__desc{max-width:none}
  .cta__btn,.cta__btn2{flex:1 1 100%;justify-content:center;text-align:center}
  .cta__decor--1{width:64%;right:-18%;top:-26%}
  .cta__decor--2{width:56%;left:-22%;bottom:-30%}
  .cta--h-orta{min-height:clamp(220px,52vw,300px)}
  .cta--h-buyuk{min-height:clamp(260px,64vw,380px)}
  .cta--h-tam{min-height:clamp(300px,80vw,480px)}
}

@media (prefers-reduced-motion:reduce){
  .cta,.cta__btn,.cta__btn2,.cta__arrow{transition:none}
  .cta__decor{animation:none}
  .cta--card-lift:hover,.cta--card-tilt:hover,.cta--fx-lift .cta__btn:hover,.cta--fx-grow .cta__btn:hover{transform:none}
}

.inline-cta{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
  margin:44px 0;padding:26px 28px;border-radius:var(--radius);
  background:var(--c-primary-050);border:1px solid var(--c-line);
}
.inline-cta h2{font-size:1.15rem;margin:0 0 5px}
.inline-cta p{margin:0;color:var(--c-muted);font-size:.92rem}

/* ==========================================================================
   İçerik + kenar çubuğu
   ========================================================================== */
.layout{display:grid;gap:clamp(28px,4vw,44px);grid-template-columns:1fr}
@media (min-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 330px}}
.layout__main{min-width:0}
.layout__side{display:grid;gap:22px;align-content:start}
@media (min-width:1000px){.layout__side{position:sticky;top:96px}}

.widget{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:22px}
.widget__title{font-size:1.02rem;margin:0 0 15px;padding-bottom:12px;border-bottom:2px solid var(--c-accent);display:inline-block}
.widget__list{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.widget__list a{
  display:flex;align-items:center;gap:9px;padding:10px 8px;border-radius:8px;
  font-size:.92rem;color:var(--c-text);transition:background .2s,color .2s;
}
.widget__list a:hover,.widget__list a.is-active{background:var(--c-primary-050);color:var(--c-primary)}
.widget__list .ico{color:var(--c-accent-700);flex:none}
.widget__list .badge{margin-left:auto;background:var(--c-primary-050);color:var(--c-muted);border-radius:100px;padding:1px 9px;font-size:.75rem}
.widget__list--posts a{flex-direction:column;align-items:flex-start;gap:3px;font-weight:600;line-height:1.4}
.widget__list--posts time{font-size:.78rem;color:var(--c-muted);font-weight:400}
.widget--contact{background:linear-gradient(150deg,var(--c-primary),var(--c-primary-700));border-color:transparent;color:#fff}
.widget--contact .widget__title{color:#fff}
.widget__big{display:flex;align-items:center;gap:10px;color:#fff;font-weight:600;padding:9px 0;font-size:.95rem;word-break:break-word}
.widget__big .ico{color:var(--c-accent);flex:none}
.widget__big:hover{color:var(--c-accent)}
.widget__note{display:flex;align-items:center;gap:8px;color:#b9c8da;font-size:.87rem;margin:6px 0 16px}

/* --- zengin metin --- */
.rte{font-size:var(--fs-body);color:var(--c-text);line-height:calc(var(--lh-body) + .1)}
.rte>*:first-child{margin-top:0}
.rte h2{font-size:var(--fs-h3);margin:2em 0 .7em;padding-left:14px;border-left:4px solid var(--c-accent)}
.rte h3{font-size:var(--fs-h4);margin:1.7em 0 .6em}
.rte h4{font-size:1.03rem;margin:1.5em 0 .5em}
.rte ul,.rte ol{padding-left:1.4em;margin-bottom:1.3em}
.rte li{margin-bottom:.5em}
.rte ul{list-style:none;padding-left:0}
.rte ul li{position:relative;padding-left:26px}
.rte ul li::before{
  content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;
  background:var(--c-accent);
}
.rte ol{padding-left:1.5em}
.rte a{color:var(--c-accent-700);text-decoration:underline;text-underline-offset:3px}
.rte img{border-radius:var(--radius-sm);margin:1.5em 0}
.rte blockquote{
  margin:1.6em 0;padding:18px 24px;background:var(--c-primary-050);
  border-left:4px solid var(--c-primary);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic;
}
.rte blockquote p:last-child{margin-bottom:0}
.rte table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.92rem;display:block;overflow-x:auto}
.rte th,.rte td{border:1px solid var(--c-line);padding:11px 14px;text-align:left}
.rte th{background:var(--c-primary-050);font-weight:700;color:var(--c-primary)}
.rte code{background:var(--c-bg-alt);padding:2px 6px;border-radius:5px;font-size:.9em}
.rte hr{border:0;border-top:1px solid var(--c-line);margin:2.2em 0}

.lead{font-size:1.1rem;color:var(--c-primary);font-weight:500;line-height:1.75;margin-bottom:1.4em;padding-bottom:1.2em;border-bottom:1px solid var(--c-line)}
.detail-figure{margin:0 0 30px}
.detail-figure img{width:100%;border-radius:var(--radius);object-fit:cover;box-shadow:var(--shadow-sm)}
.detail-figure figcaption{margin-top:10px;font-size:.85rem;color:var(--c-muted);text-align:center}

.notice{background:#fffaf0;border:1px solid #f0dfb8;border-left:4px solid var(--c-accent);border-radius:var(--radius-sm);padding:18px 22px;margin:30px 0}
.notice h2{display:flex;align-items:center;gap:8px;font-size:1.02rem;margin:0 0 8px}
.notice p{margin:0;font-size:.93rem;color:#6b5a32}

.post-meta{display:flex;flex-wrap:wrap;gap:18px;color:#b9c8da;font-size:.87rem}
.post-meta>*{display:flex;align-items:center;gap:6px}

.tags{display:flex;flex-wrap:wrap;gap:8px;margin:30px 0}
.tag{display:inline-flex;align-items:center;gap:5px;padding:6px 13px;border-radius:100px;background:var(--c-bg-alt);border:1px solid var(--c-line);font-size:.8rem;color:var(--c-muted)}

.share{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:18px 0;border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.share span{font-weight:600;font-size:.9rem;color:var(--c-muted)}
.share a{padding:7px 15px;border-radius:8px;background:var(--c-primary-050);font-size:.83rem;font-weight:600}
.share a:hover{background:var(--c-primary);color:#fff}

/* --- sayfalama --- */
.pagination{margin-top:40px}
.pagination ul{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;list-style:none;padding:0;margin:0}
.pagination a,.pagination span{
  display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border-radius:9px;
  border:1px solid var(--c-line);font-weight:600;font-size:.92rem;background:#fff;color:var(--c-text);
}
.pagination a:hover{border-color:var(--c-primary);color:var(--c-primary)}
.pagination .is-current{background:var(--c-primary);border-color:var(--c-primary);color:#fff}

/* ==========================================================================
   İletişim
   ========================================================================== */
.contact-grid{display:grid;gap:clamp(28px,4vw,44px);grid-template-columns:1fr}
@media (min-width:900px){.contact-grid{grid-template-columns:1fr 1.35fr}}
.contact-list{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:18px}
.contact-list li{display:flex;gap:15px;align-items:flex-start}
.contact-list__ico{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--c-primary-050);color:var(--c-primary);flex:none}
.contact-list strong{display:block;font-size:.83rem;color:var(--c-muted);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
.contact-list a,.contact-list address,.contact-list span{color:var(--c-primary);font-weight:600;font-size:.98rem;line-height:1.5}
.contact-form{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:clamp(22px,3.5vw,34px);box-shadow:var(--shadow-sm)}

.form-row{display:grid;gap:0 18px;grid-template-columns:1fr}
@media (min-width:640px){.form-row{grid-template-columns:1fr 1fr}}
.form-group{margin-bottom:18px}
.form-group label{display:block;font-weight:600;font-size:.88rem;margin-bottom:7px;color:var(--c-primary)}
.form-group label span{color:var(--c-err)}
.form-group input,.form-group textarea,.form-group select{
  width:100%;padding:13px 15px;border:var(--bw) solid var(--c-line);border-radius:var(--r-input);
  font-family:inherit;font-size:.97rem;color:var(--c-text);background:var(--c-bg);
  transition:border-color var(--anim),box-shadow var(--anim);
}
/* Yazı imleci (caret) açıkça tanımlanır: tanımsız bırakıldığında bazı
   tarayıcı/işletim sistemi ayarlarında beyaza düşüp zeminde kayboluyor. */
input,textarea,select,[contenteditable="true"]{caret-color:var(--c-primary)}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--c-text);caret-color:var(--c-primary);
  box-shadow:0 0 0 1000px var(--c-bg) inset;
}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{
  outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(11,37,69,.10);
}
.form-group textarea{resize:vertical;min-height:130px}
.form-check{display:flex;align-items:flex-start;gap:10px;margin-bottom:22px}
.form-check input{width:19px;height:19px;margin-top:3px;flex:none;accent-color:var(--c-primary)}
.form-check label{font-size:.87rem;color:var(--c-muted);line-height:1.6}
.form-check a{text-decoration:underline}

/* --- alan hataları ve yardımcı notlar ---
   Eskiden hatalı alan yalnızca kırmızı çerçeveyle işaretleniyordu; ziyaretçi
   nedenini göremediği için form "çalışmıyor" gibi duruyordu. Artık nedeni
   alanın hemen altında yazıyor. */
.field-err{
  display:flex;align-items:flex-start;gap:6px;margin-top:7px;
  font-size:.82rem;line-height:1.5;color:var(--c-err,#c0392b);font-weight:600;
}
.field-err::before{content:"!";flex:0 0 16px;width:16px;height:16px;margin-top:1px;
  display:grid;place-items:center;border-radius:50%;
  background:var(--c-err,#c0392b);color:#fff;font-size:.7rem;line-height:1}
.field-err[hidden]{display:none}
.field-note{display:block;margin-top:7px;font-size:.8rem;color:var(--c-muted)}
.field-note--az{color:var(--c-err,#c0392b)}
.form-group.is-err input,.form-group.is-err textarea,.form-group.is-err select{
  border-color:var(--c-err,#c0392b);background:#fffafa;
}
.form-group.is-err input:focus,.form-group.is-err textarea:focus{
  box-shadow:0 0 0 3px rgba(192,57,43,.13);
}
.form-check.is-err{flex-wrap:wrap}
.form-check.is-err .field-err{flex-basis:100%}
.form-check.is-err input{outline:2px solid var(--c-err,#c0392b);outline-offset:2px}

/* --- gönderiliyor animasyonu --- */
.btn__spin{display:none;width:16px;height:16px;flex:none;border-radius:50%;
  border:2px solid currentColor;border-top-color:transparent;animation:btnspin .7s linear infinite}
.btn.is-loading .btn__spin{display:inline-block}
.btn.is-loading .ico{display:none}
.btn.is-loading{cursor:progress;opacity:.85}
@keyframes btnspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .btn__spin{animation-duration:2s}
}

.alert{padding:16px 20px;border-radius:var(--radius-sm);margin-bottom:22px;font-size:.93rem}
.alert strong{display:block;margin-bottom:4px}
.alert p,.alert ul{margin:0}
.alert ul{padding-left:1.2em}
.alert--ok{background:#eaf7f0;border:1px solid #b7e2cb;color:#0d5c3b}
.alert--err{background:#fdeceb;border:1px solid #f5c2bd;color:#8f2b20}
.alert--info{background:var(--c-primary-050);border:1px solid var(--c-line);color:var(--c-primary)}

/* Harita — yükseklik ve genişlik panelden gelir (Harita Ayarları) */
.map{line-height:0;--map-h:420px}
.map iframe{width:100%;height:var(--map-h);border:0;display:block;filter:grayscale(.15)}
/* Kart modu: sayfa genişliğinde, yuvarlatılmış köşeli */
.map:not(.map--full){
  width:100%;max-width:var(--container);margin-inline:auto;padding-inline:18px;
}
.map:not(.map--full) iframe{border-radius:var(--radius);box-shadow:0 10px 30px rgba(11,37,69,.10)}
/* Telefonda harita kısalır. Değeri --map-h üzerinden hesaplamak custom
   property'yi kendine referanslı kılıp geçersizleştireceği için doğrudan
   yükseklik verilir. */
@media (max-width:768px){
  .map iframe{height:min(var(--map-h),320px)}
}

/* --- arama --- */
.searchbox{display:flex;gap:8px}
.searchbox input{
  flex:1;padding:12px 15px;border:var(--bw) solid var(--c-line);border-radius:var(--r-input);font-family:inherit;font-size:.95rem;
}
.searchbox input:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(11,37,69,.10)}
.searchbox button{
  display:inline-flex;align-items:center;gap:7px;padding:12px 18px;border:0;border-radius:10px;
  background:var(--c-primary);color:#fff;font-weight:600;font-size:.92rem;
}
.searchbox button:hover{background:var(--c-accent-700)}
.searchbox--lg{margin-top:22px;max-width:560px}
.searchbox--lg input{padding:15px 18px}

.result-count{color:var(--c-muted);margin-bottom:22px}
.result-list{list-style:none;padding:0;margin:0;display:grid;gap:18px}
.result-list li{padding:20px 22px;border:1px solid var(--c-line);border-radius:var(--radius);background:#fff;transition:box-shadow .2s}
.result-list li:hover{box-shadow:var(--shadow-sm)}
.result-list h2{font-size:1.08rem;margin:9px 0 7px}
.result-list p{color:var(--c-muted);font-size:.91rem;margin:0 0 8px}
.result-url{font-size:.79rem;color:var(--c-ok);word-break:break-all}

/* --- site haritası --- */
.sitemap-grid{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.sitemap-col--wide{grid-column:1/-1}
.sitemap-col h2{font-size:1.08rem;padding-bottom:10px;border-bottom:2px solid var(--c-accent);margin-bottom:14px}
.sitemap-col ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.sitemap-col li{font-size:.93rem}
.sitemap-col small{color:var(--c-muted);font-size:.78rem}

/* --- 404 --- */
.error-page{padding:clamp(56px,9vw,110px) 0;text-align:center}
.error-page__code{font-size:clamp(4rem,14vw,8rem);font-weight:800;line-height:1;color:var(--c-primary-050);margin:0}
.error-page h1{font-size:clamp(1.4rem,3.2vw,2rem);margin:-14px 0 14px}
.error-page__text{color:var(--c-muted);max-width:520px;margin:0 auto 26px}
.error-page .searchbox{margin:0 auto 30px;max-width:460px}
.error-page__links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:44px}
.error-page__suggest{max-width:460px;margin:0 auto;text-align:left}
.error-page__suggest h2{font-size:1rem;margin-bottom:12px}
.error-page__suggest ul{list-style:none;padding:0;display:grid;gap:6px}
.error-page__suggest a{display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid var(--c-line);border-radius:9px;font-size:.92rem}
.error-page__suggest a:hover{border-color:var(--c-primary);background:var(--c-primary-050)}
.error-page__suggest .ico{color:var(--c-accent-700)}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{background:var(--c-footer-bg);color:var(--c-footer-text);padding-top:calc(var(--section-y) * .76);font-size:var(--fs-footer)}
/* Sütunlar aynı hizadan başlar (align-items:start) ve marka sütunu biraz
   daha geniştir; logo + açıklama + sosyal bağlantılar tek bir blok gibi durur.
   Ölçüler Admin Panel → Footer Yönetimi'nden gelir. */
.footer__grid{
  display:grid;gap:34px 40px;align-items:start;padding-bottom:44px;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
@media (min-width:1000px){
  .footer__grid{grid-template-columns:1.5fr 1fr 1fr 1.25fr}
  .footer--nobrand .footer__grid{grid-template-columns:repeat(3,1fr)}
}

.footer__col--brand{
  --f-logo-w:280px; --f-logo-h:84px; --f-desc:#8fa4bd; --f-pad:24px;
  display:flex;flex-direction:column;align-items:flex-start;
  gap:18px;padding-right:var(--f-pad);min-width:0;
}
.footer__col--pad-yok{--f-pad:0px}
.footer__col--pad-dar{--f-pad:12px}
.footer__col--pad-normal{--f-pad:24px}
.footer__col--pad-genis{--f-pad:44px}
.footer__col--center{align-items:center;text-align:center;padding-right:0}
.footer__col--right{align-items:flex-end;text-align:right;padding-right:0;padding-left:var(--f-pad)}

/* Logo: kutu değil logonun kendisi ölçeklenir, oran her zaman korunur.
   Dosya görünen ölçüden büyük tutulduğu için 2x ekranlarda da nettir. */
.brand--footer{color:#fff;margin:0;max-width:100%;min-width:0}
/* Taşıyıcı da küçülebilmeli: temadaki `flex:none` dar ekranlarda logonun
   sütun genişliğinin altına inmesini engelliyor, sayfa yatay kayıyordu. */
.brand--footer picture{flex:0 1 auto;max-width:100%;min-width:0}
.brand--footer .brand__logo{
  max-width:min(var(--f-logo-w),100%);
  max-height:var(--f-logo-h);
  width:auto;height:auto;
}
.brand--footer .brand__mark{background:rgba(255,255,255,.09)}
.brand--footer .brand__text strong{color:#fff}
.brand--footer .brand__text small{color:#8fa4bd}

/* Açıklama okunabilir genişlikte kalır; uzun satırlar oluşmaz. */
.footer__desc{color:var(--f-desc,#8fa4bd);font-size:.9rem;line-height:1.75;margin:0;max-width:36ch}
.footer__desc--kucuk{font-size:.82rem}
.footer__desc--normal{font-size:.9rem}
.footer__desc--buyuk{font-size:1rem}
.footer__col--center .footer__desc{margin-inline:auto}
.footer__col--right .footer__desc{margin-inline-start:auto}
.footer__social{display:flex;gap:8px;margin:0;flex-wrap:wrap}
.footer__social a{
  display:grid;place-items:center;width:36px;height:36px;border-radius:9px;
  background:rgba(255,255,255,.07);color:#cbd7e6;font-size:.74rem;font-weight:700;
}
.footer__social a:hover{background:var(--c-accent);color:#1a1405}
.footer__title{color:#fff;font-size:1rem;margin:0 0 16px;position:relative;padding-bottom:11px}
.footer__title::after{content:"";position:absolute;left:0;bottom:0;width:32px;height:2px;background:var(--c-accent)}
.footer__list{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.footer__list a{color:var(--c-footer-text);font-size:var(--fs-footer);display:inline-block}
.footer__list a:hover{color:var(--c-accent);transform:translateX(3px)}
.footer__contact p{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;font-size:.89rem;line-height:1.6}
.footer__contact .ico{color:var(--c-accent);flex:none;margin-top:3px}
.footer__contact a{color:var(--c-footer-text)}
.footer__contact a:hover{color:var(--c-accent)}
/* Tablet ve mobilde marka sütunu tam genişliğe yayılır, boşluk kalmaz */
@media (max-width:999px){
  .footer__col--brand{padding-right:0;padding-left:0}
  .footer__desc{max-width:52ch}
}
@media (max-width:640px){
  .footer__grid{gap:28px}
  .footer__col--brand{gap:14px}
  .footer__desc{max-width:none}
}

.footer__bottom{border-top:1px solid rgba(255,255,255,.09);padding:18px 0}
.footer__bottom-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.83rem}
.footer__bottom p{margin:0;color:#8fa4bd}
.footer__bottom a{color:#a9bbd0}
.footer__bottom a:hover{color:var(--c-accent)}

/* --- yüzen butonlar --- */
.wa-float{
  position:fixed;left:18px;bottom:18px;z-index:90;display:grid;place-items:center;
  width:54px;height:54px;border-radius:50%;background:#25d366;color:#fff;
  box-shadow:0 8px 26px rgba(37,211,102,.42);transition:transform .2s;
}
.wa-float:hover{transform:scale(1.08);color:#fff}
.wa-float svg{width:29px;height:29px}
.to-top{
  position:fixed;right:18px;bottom:18px;z-index:90;width:46px;height:46px;border-radius:12px;
  border:1px solid var(--c-line);background:#fff;color:var(--c-primary);display:grid;place-items:center;
  box-shadow:var(--shadow);transition:opacity .25s,transform .2s;
}
.to-top:hover{transform:translateY(-3px);background:var(--c-primary);color:#fff}
.to-top svg{width:20px;height:20px}
@media print{
  .topbar,.header,.footer,.wa-float,.to-top,.cta,.inline-cta,.share,.breadcrumb{display:none !important}
  body{font-size:12pt}
  .rte a::after{content:" (" attr(href) ")";font-size:.85em;color:#555}
}

/* Panelden sticky header kapatıldığında */
body.no-sticky .header{position:relative}
body.btnfx-none .btn:hover{transform:none}

/* Kategori sayfasındaki alt kategori bağlantıları */
.subcats{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}

/* ==========================================================================
   Çerez onay bannerı — Admin Panel → Çerez Yönetimi
   ========================================================================== */
.ckbar{
  --ck-bg:#0b2545; --ck-fg:#e8eef7; --ck-btn-bg:var(--c-accent); --ck-btn-fg:#0b2545;
  position:fixed;left:0;right:0;z-index:120;
  background:var(--ck-bg);color:var(--ck-fg);
  box-shadow:0 -8px 40px rgba(0,0,0,.28);
  padding:18px 0;
  transition:transform .3s cubic-bezier(.22,.61,.36,1),opacity .3s;
}
.ckbar--alt{bottom:0;transform:translateY(110%)}
.ckbar--ust{top:0;transform:translateY(-110%);box-shadow:0 8px 40px rgba(0,0,0,.28)}
.ckbar.is-in{transform:translateY(0)}
.ckbar[hidden]{display:none}

.ckbar__in{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.ckbar__text{flex:1 1 420px;min-width:0}
.ckbar__title{color:var(--ck-fg);font-size:1.02rem;margin:0 0 5px}
.ckbar__text p{margin:0;font-size:.88rem;line-height:1.6;opacity:.85;max-width:78ch}
.ckbar__acts{display:flex;flex-wrap:wrap;align-items:center;gap:9px;flex:0 0 auto}
.ckbar__link{color:var(--ck-fg);text-decoration:underline;font-size:.86rem;opacity:.9}
.ckbar__link:hover{opacity:1}
.ckbar__btn{
  background:var(--ck-btn-bg);color:var(--ck-btn-fg);border:1px solid transparent;
  font-size:.87rem;padding:10px 18px;font-weight:700;
}
.ckbar__btn--ghost{background:transparent;color:var(--ck-fg);border-color:rgba(255,255,255,.34)}
.ckbar__btn--ghost:hover{background:rgba(255,255,255,.12);color:var(--ck-fg)}

.ckbar__prefs{margin-top:16px;padding-top:15px;border-top:1px solid rgba(255,255,255,.16)}
.ckbar__prefs[hidden]{display:none}
.ckbar__row{display:flex;gap:11px;align-items:flex-start;margin-bottom:11px;font-size:.86rem;line-height:1.55;cursor:pointer}
.ckbar__row input{margin-top:3px;flex:none;width:17px;height:17px;accent-color:var(--ck-btn-bg)}
.ckbar__row input:disabled{opacity:.6;cursor:not-allowed}
.ckbar__row strong{color:var(--ck-fg)}
.ckbar__prefacts{display:flex;justify-content:flex-end}

@media (max-width:768px){
  .ckbar{padding:15px 0;max-height:88vh;overflow-y:auto}
  .ckbar__acts{width:100%}
  .ckbar__acts .ckbar__btn{flex:1 1 auto;justify-content:center}
  .ckbar__link{width:100%;text-align:center;order:3}
  .ckbar__text p{font-size:.84rem}
}
@media (prefers-reduced-motion:reduce){ .ckbar{transition:none} }