/* ═══════════════════════════════════════════════════════════════════════════
   BU ÖZEL DERS — ORTAK TASARIM SİSTEMİ
   ───────────────────────────────────────────────────────────────────────────
   KURULUM (sadece bir kez):
     WordPress Yönetim → Görünüm → Özelleştir → Ek CSS
     Bu dosyanın TAMAMINI oraya yapıştır → Yayınla

   ÖNEMLİ: En üstteki @import satırı Ek CSS kutusunun EN BAŞINDA olmalı.
   Üstüne başka CSS koyma, yoksa yazı tipleri yüklenmez.

   Renk değiştirmek istersen sadece aşağıdaki .bod{...} bloğundaki
   değişkenleri düzenle — bütün sayfalar birden güncellenir.
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap');

/* ═══════════════ 1. TOKENLAR ═══════════════ */
.bod{
  /* Logo renkleri */
  --nv:#10315B;      /* lacivert  */
  --nv-2:#17406F;
  --nv-3:#071B38;
  --gd:#D6A44C;      /* altın     */
  --gd-2:#EBCB86;
  --gd-3:#A97A2A;
  --sky:#7EA9D4;     /* logodaki su mavisi */

  --bg:#F6F8FC;
  --sf:#FFFFFF;
  --ink:#0B1B31;
  --mut:#54677F;
  --brd:#E2E9F3;
  --wa:#25D366;

  --max:1200px;
  --pad:clamp(20px,5vw,40px);
  --sec:clamp(72px,9vw,124px);

  /* Ana sayfa banner ayarları — fotoğraf üzerindeki yazı okunmuyorsa
     --hero-koyu değerini .10 / .20 / .30 yaparak karartabilirsin. */
  --hero-koyu:0;
  --hero-odak:center 42%;   /* masaüstü kırpma noktası */
  --hero-odak-m:60% 38%;    /* mobil kırpma noktası    */

  --r-s:10px; --r-m:16px; --r-l:22px; --r-xl:30px;
  --e:cubic-bezier(.22,1,.36,1);
  --sh-1:0 1px 2px rgba(11,27,49,.04), 0 10px 28px -14px rgba(11,27,49,.20);
  --sh-2:0 2px 6px rgba(11,27,49,.06), 0 28px 56px -24px rgba(11,27,49,.32);
  --sh-g:0 12px 32px -12px rgba(214,164,76,.55);

  font-family:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
  position:relative;
  isolation:isolate;
}
.bod *,.bod *::before,.bod *::after{box-sizing:border-box}
.bod h1,.bod h2,.bod h3,.bod h4{
  font-family:'Lexend',sans-serif;
  font-weight:600; line-height:1.15; letter-spacing:-.02em;
  color:var(--nv); margin:0;
}
.bod p{margin:0}
.bod ul{margin:0;padding:0;list-style:none}
/* :where() özgüllüğü sıfırlar — böylece .bod-btn--gold gibi bileşen
   renkleri bu kuralı ezebilir. Düz "a" seçicisi kullanma. */
.bod :where(a){color:inherit;text-decoration:none}
.bod img,.bod svg{display:block;max-width:100%}
.bod img{height:auto}
.bod button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
.bod :focus-visible{outline:3px solid var(--gd);outline-offset:3px;border-radius:6px}

.bod-wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.bod-sec{padding-block:var(--sec);position:relative}

/* Flex satırları, içindeki en uzun bölünemez kelimenin altına inemez;
   e-posta/URL gibi ifadeler dar ekranda taşmaya yol açar. Bu kural onu engeller. */
.bod-checks li,.bod-topic li,.bod-faq-body li,.bod-toc a,
.bod-coach-list li,.bod-plan-feats li,.bod-cover span,.bod-cta-mini span{
  min-width:0;overflow-wrap:anywhere
}

/* ═══════════════ 2. HAREKET (JS varsa) ═══════════════ */
.bod-js [data-reveal]{opacity:0;transform:translateY(20px)}
.bod-js [data-reveal].is-in{
  opacity:1;transform:none;
  transition:opacity .7s var(--e), transform .7s var(--e);
  transition-delay:calc(var(--d,0) * 80ms);
}
@media (prefers-reduced-motion:reduce){
  .bod-js [data-reveal]{opacity:1!important;transform:none!important}
  .bod *,.bod *::before,.bod *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ═══════════════ 3. TİPOGRAFİ ÖLÇEĞİ ═══════════════ */
.bod-h1{font-size:clamp(2.1rem,5.4vw,3.9rem);font-weight:600}
.bod-h2{font-size:clamp(1.75rem,3.6vw,2.7rem)}
.bod-h3{font-size:clamp(1.1rem,1.8vw,1.32rem);font-weight:600}
.bod-lead{font-size:clamp(1.02rem,1.5vw,1.17rem);color:var(--mut);line-height:1.7}
.bod-eyebrow{
  font-family:'Lexend',sans-serif;font-size:.76rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gd-3)
}
.bod-mark{
  position:relative;display:inline-block;color:var(--nv);white-space:nowrap
}
.bod-mark::after{
  content:"";position:absolute;left:-.06em;right:-.06em;bottom:.06em;height:.34em;
  background:linear-gradient(90deg,rgba(214,164,76,.42),rgba(235,203,134,.55));
  border-radius:3px;z-index:-1;transform:scaleX(0);transform-origin:left;
}
.bod-js .bod-mark::after{transition:transform .8s .5s var(--e)}
.bod-js [data-reveal].is-in .bod-mark::after,
.bod:not(.bod-js) .bod-mark::after{transform:scaleX(1)}

.bod-sec-head{max-width:660px;margin-bottom:clamp(36px,5vw,56px)}
.bod-sec-head.is-center{margin-inline:auto;text-align:center}
.bod-sec-head .bod-eyebrow{display:block;margin-bottom:14px}
.bod-sec-head .bod-lead{margin-top:16px}

/* ═══════════════ 4. BUTONLAR ═══════════════ */
.bod-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:'Lexend',sans-serif;font-weight:500;font-size:1rem;
  padding:15px 28px;border-radius:100px;cursor:pointer;
  transition:transform .25s var(--e), box-shadow .25s var(--e), background-color .25s var(--e), color .25s var(--e), border-color .25s var(--e);
  white-space:nowrap;line-height:1.2;
}
.bod-btn svg{width:19px;height:19px;flex:none}
.bod-btn:hover{transform:translateY(-2px)}
.bod-btn:active{transform:translateY(0)}
.bod-btn--gold{background:var(--gd);color:#26170A;box-shadow:var(--sh-g)}
.bod-btn--gold:hover{background:var(--gd-2);box-shadow:0 16px 40px -12px rgba(214,164,76,.7)}
.bod-btn--navy{background:var(--nv);color:#fff;box-shadow:0 12px 30px -14px rgba(16,49,91,.7)}
.bod-btn--navy:hover{background:var(--nv-2)}
.bod-btn--ghost{border:1.5px solid rgba(255,255,255,.32);color:#fff;background:rgba(255,255,255,.05)}
.bod-btn--ghost:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.55)}
.bod-btn--outline{border:1.5px solid var(--brd);background:var(--sf);color:var(--nv)}
.bod-btn--outline:hover{border-color:var(--nv);background:var(--nv);color:#fff}
.bod-btn--block{width:100%}

.bod-link{
  display:inline-flex;align-items:center;gap:8px;font-family:'Lexend',sans-serif;
  font-weight:500;font-size:.95rem;color:var(--nv);
  min-height:44px;padding-inline:2px;
}
.bod-link svg{width:16px;height:16px;transition:transform .3s var(--e)}
.bod-link:hover svg{transform:translateX(4px)}

/* ═══════════════ 5. HERO — FOTOĞRAF BANNER ═══════════════
   Fotoğraf yüklenmezse ya da silinirse lacivert zemin kalır, tasarım bozulmaz.
   Ayar düğmeleri (yukarıdaki .bod bloğunda):
     --hero-koyu    → fotoğraf üzerindeki karartma (0 = sadece degrade, .35 = çok koyu)
     --hero-odak    → fotoğrafın hangi noktadan kırpılacağı (masaüstü)
     --hero-odak-m  → aynısı, mobil için
   ═══════════════════════════════════════════════════════════ */
.bod-hero{
  position:relative;overflow:hidden;color:#fff;
  background-color:#10315B;
  display:flex;align-items:center;
  min-height:clamp(540px,76vh,780px);
  padding-block:clamp(80px,10vw,120px);
}
.bod-hero-bg{position:absolute;inset:0;z-index:0;background-color:#10315B}
.bod-hero-bg img{
  position:absolute;left:0;top:-14%;
  width:100%;height:114%;object-fit:cover;
  object-position:var(--hero-odak,center 42%);
  will-change:transform;transform:translate3d(0,0,0);
}
/* Scroll parallax: JS bu görsele translateY uygular (aşağıdaki script bloğu).
   JS çalışmazsa görsel sabit kalır, tasarım bozulmaz. */
.bod-hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(100deg,
      rgba(7,27,56,.93) 0%,
      rgba(9,31,63,.90) 55%,
      rgba(16,49,91,.58) 78%,
      rgba(16,49,91,.42) 100%),
    linear-gradient(to top, rgba(7,27,56,.85) 0%, rgba(7,27,56,0) 45%),
    radial-gradient(90% 70% at 88% 6%, rgba(214,164,76,.16) 0%, transparent 55%),
    rgba(7,27,56,var(--hero-koyu,0));
}
.bod-hero h1,.bod-hero h2,.bod-hero h3{color:#fff}
.bod-hero .bod-mark{color:#fff}
.bod-hero .bod-mark::after{background:linear-gradient(90deg,rgba(214,164,76,.55),rgba(214,164,76,.22))}
.bod-hero-slogan{display:block;margin-top:16px;color:var(--gd-2)}

.bod-hero-in{
  position:relative;z-index:2;width:100%;max-width:730px;
  text-shadow:0 1px 26px rgba(4,15,32,.55);
}

/* Köşe rozeti — banner fotoğrafının üzerine, sağ üstte. Metnin oturduğu
   sol sütundan bağımsız, hero'nun kendi köşesine göre konumlanır. */
.bod-hero-credential{
  position:absolute;z-index:3;top:clamp(20px,3.5vw,32px);right:clamp(20px,3.5vw,32px);
  display:flex;align-items:center;gap:11px;
  padding:12px 18px 12px 14px;border-radius:16px;
  background:rgba(7,27,56,.8);border:1px solid rgba(214,164,76,.5);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  box-shadow:0 14px 32px -16px rgba(0,0,0,.65);
  max-width:min(230px,44vw);
}
.bod-hero-credential svg{width:24px;height:24px;color:var(--gd-2);flex:none}
.bod-hero-credential span{
  font-family:'Lexend',sans-serif;font-weight:500;font-size:.83rem;
  line-height:1.35;color:#fff
}
.bod-hero-credential b{color:var(--gd-2);font-weight:600}

/* Mobil sürüm: köşede değil, metin akışının içinde — dar ekranlarda
   rozet pilinin (İstanbul'da yüz yüze...) uzunluğu değişken olduğu için
   sabit bir köşe konumu güvenilir biçimde çakışmasız tutulamıyor. */
.bod-hero-credential-m{display:none}
@media (max-width:680px){
  .bod-hero-credential{display:none}
  .bod-hero-credential-m{
    display:inline-flex;align-items:center;gap:9px;
    margin-top:14px;padding:8px 15px 8px 11px;border-radius:12px;
    background:rgba(7,27,56,.55);border:1px solid rgba(214,164,76,.4);
    -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  }
  .bod-hero-credential-m svg{width:19px;height:19px;color:var(--gd-2);flex:none}
  .bod-hero-credential-m span{
    font-family:'Lexend',sans-serif;font-weight:500;font-size:.78rem;
    line-height:1.3;color:#fff
  }
  .bod-hero-credential-m b{color:var(--gd-2);font-weight:600}
}
.bod-badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px 8px 10px;border-radius:100px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);
  font-size:.85rem;font-weight:500;color:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.bod-badge .bod-dot{
  width:8px;height:8px;border-radius:50%;background:var(--gd);flex:none;
  box-shadow:0 0 0 0 rgba(214,164,76,.65);animation:bodPulse 2.6s infinite
}
@keyframes bodPulse{
  0%{box-shadow:0 0 0 0 rgba(214,164,76,.6)}
  70%{box-shadow:0 0 0 10px rgba(214,164,76,0)}
  100%{box-shadow:0 0 0 0 rgba(214,164,76,0)}
}
.bod-hero h1{margin:24px 0 0}
.bod-hero-sub{
  margin-top:20px;max-width:56ch;font-size:clamp(1.02rem,1.5vw,1.14rem);
  color:rgba(255,255,255,.88);line-height:1.72
}
.bod-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.bod-hero-note{
  display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:24px;
  font-size:.88rem;color:rgba(255,255,255,.76)
}
.bod-hero-note span{display:inline-flex;align-items:center;gap:7px}
.bod-hero-note svg{width:15px;height:15px;color:var(--gd);flex:none}


/* ═══════════════ 6. GÜVEN ŞERİDİ ═══════════════ */
.bod-strip{
  background:var(--nv-3);color:rgba(255,255,255,.86);
  padding-block:17px;overflow:hidden;position:relative
}
.bod-strip::before,.bod-strip::after{
  content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none
}
.bod-strip::before{left:0;background:linear-gradient(90deg,var(--nv-3),transparent)}
.bod-strip::after{right:0;background:linear-gradient(270deg,var(--nv-3),transparent)}
.bod-marquee{display:flex;width:max-content;animation:bodSlide 38s linear infinite}
.bod-strip:hover .bod-marquee{animation-play-state:paused}
@keyframes bodSlide{to{transform:translateX(-50%)}}
.bod-marquee ul{display:flex;align-items:center}
.bod-marquee li{
  display:inline-flex;align-items:center;gap:10px;padding-inline:26px;
  font-size:.92rem;font-weight:500;white-space:nowrap
}
.bod-marquee li::after{
  content:"";width:5px;height:5px;border-radius:50%;background:var(--gd);
  margin-left:26px;opacity:.7
}
.bod-marquee svg{width:17px;height:17px;color:var(--gd);flex:none}
@media (prefers-reduced-motion:reduce){
  .bod-marquee{animation:none;width:100%;justify-content:center;flex-wrap:wrap}
  .bod-marquee ul:last-child{display:none}
  .bod-marquee ul{flex-wrap:wrap;justify-content:center;gap:6px}
}

/* ═══════════════ 7. KATEGORİLER ═══════════════ */
.bod-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.2vw,26px)}
.bod-cat{
  position:relative;background:var(--sf);border:1px solid var(--brd);
  border-radius:var(--r-l);padding:clamp(26px,3vw,36px);overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .4s var(--e), box-shadow .4s var(--e), border-color .4s var(--e);
}
.bod-cat::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(90% 70% at 100% 0%,rgba(214,164,76,.13),transparent 62%);
  opacity:0;transition:opacity .4s var(--e)
}
.bod-cat:hover{transform:translateY(-6px);box-shadow:var(--sh-2);border-color:rgba(214,164,76,.5)}
.bod-cat:hover::before{opacity:1}
.bod-cat-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.bod-cat-ic{
  width:56px;height:56px;flex:none;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--nv),var(--nv-2));color:var(--gd-2);
  box-shadow:0 12px 26px -14px rgba(16,49,91,.85);
  transition:transform .4s var(--e)
}
.bod-cat:hover .bod-cat-ic{transform:rotate(-6deg) scale(1.06)}
.bod-cat-ic svg{width:27px;height:27px}
.bod-cat-num{
  font-family:'Lexend',sans-serif;font-size:2.4rem;font-weight:700;line-height:1;
  color:rgba(16,49,91,.09);letter-spacing:-.04em
}
.bod-cat h3{margin-top:22px}
.bod-cat-grade{
  display:block;margin-top:7px;font-size:.85rem;font-weight:600;color:var(--gd-3);
  font-family:'Lexend',sans-serif
}
.bod-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.bod-chip{
  font-size:.85rem;padding:7px 14px;border-radius:100px;
  background:#F1F5FA;border:1px solid #E4EBF4;color:#37485F;
  transition:background-color .25s var(--e), color .25s var(--e), border-color .25s var(--e)
}
.bod-cat:hover .bod-chip{background:#fff;border-color:rgba(214,164,76,.35)}
.bod-cat-foot{
  margin-top:auto;padding-top:14px;display:flex;align-items:center;
  justify-content:space-between;gap:14px;flex-wrap:wrap
}
.bod-cat-mode{font-size:.82rem;color:var(--mut);display:inline-flex;align-items:center;gap:7px}
.bod-cat-mode svg{width:15px;height:15px;color:var(--gd-3)}

/* ═══════════════ 8. NEDEN BİZ ═══════════════ */
.bod-why{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(16px,1.8vw,22px)}
.bod-why-card{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(24px,2.6vw,32px);
  transition:transform .4s var(--e), box-shadow .4s var(--e), border-color .4s var(--e)
}
.bod-why-card:hover{transform:translateY(-5px);box-shadow:var(--sh-1);border-color:#D2DDEC}
.bod-why-card.is-span3{grid-column:span 3}
.bod-why-card.is-span2{grid-column:span 2}
.bod-why-card.is-hi{
  background:linear-gradient(150deg,var(--nv) 0%,var(--nv-2) 58%,var(--nv-3) 100%);
  border-color:transparent;position:relative;overflow:hidden
}
.bod-why-card.is-hi::after{
  content:"";position:absolute;right:-56px;top:-56px;width:190px;height:190px;
  border-radius:50%;background:radial-gradient(circle,rgba(214,164,76,.30),transparent 66%)
}
.bod-why-card.is-hi h3,.bod-why-card.is-hi p{color:#fff;position:relative;z-index:1}
.bod-why-card.is-hi p{color:rgba(255,255,255,.76)}
.bod-why-card.is-hi .bod-why-ic{background:rgba(214,164,76,.20);color:var(--gd-2)}
.bod-why-ic{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:rgba(16,49,91,.07);color:var(--nv);margin-bottom:20px;position:relative;z-index:1;
  transition:background-color .3s var(--e), color .3s var(--e)
}
.bod-why-ic svg{width:24px;height:24px}
.bod-why-card:not(.is-hi):hover .bod-why-ic{background:var(--gd);color:#26170A}
.bod-why-card h3{font-size:1.09rem}
.bod-why-card p{margin-top:11px;font-size:.95rem;color:var(--mut);line-height:1.68}

/* ═══════════════ 9. SÜREÇ ═══════════════ */
.bod-flow{background:var(--sf);border-top:1px solid var(--brd);border-bottom:1px solid var(--brd)}
.bod-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.4vw,30px);position:relative}
.bod-steps::before{
  content:"";position:absolute;top:27px;left:9%;right:9%;height:2px;
  background:repeating-linear-gradient(90deg,var(--brd) 0 7px,transparent 7px 15px)
}
.bod-steps::after{
  content:"";position:absolute;top:27px;left:9%;height:2px;
  background:linear-gradient(90deg,var(--gd),var(--gd-2));
  width:0;transition:width 1.9s .25s var(--e)
}
.bod:not(.bod-js) .bod-steps::after,.bod-steps.is-in::after{width:82%}
.bod-step{position:relative;text-align:center;padding-inline:6px}
.bod-step-n{
  width:54px;height:54px;margin:0 auto 20px;border-radius:50%;position:relative;z-index:2;
  display:grid;place-items:center;background:var(--sf);
  border:2px solid var(--brd);color:var(--nv);
  font-family:'Lexend',sans-serif;font-weight:600;font-size:1.02rem;
  transition:border-color .4s var(--e), background-color .4s var(--e), color .4s var(--e), transform .4s var(--e)
}
.bod-step:hover .bod-step-n{
  background:var(--gd);border-color:var(--gd);color:#26170A;transform:scale(1.09)
}
.bod-step h3{font-size:1.06rem}
.bod-step p{margin-top:10px;font-size:.93rem;color:var(--mut);line-height:1.65}

/* ═══════════════ 10. KOÇLUK ═══════════════ */
.bod-coach{
  background:linear-gradient(155deg,var(--nv) 0%,var(--nv-2) 55%,var(--nv-3) 100%);
  border-radius:var(--r-xl);padding:clamp(34px,4.6vw,64px);color:#fff;
  position:relative;overflow:hidden
}
.bod-coach::before{
  content:"";position:absolute;right:-90px;bottom:-110px;width:400px;height:400px;
  border-radius:50%;background:radial-gradient(circle,rgba(214,164,76,.22),transparent 64%)
}
.bod-coach::after{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:radial-gradient(80% 80% at 20% 20%,#000,transparent 72%);
  mask-image:radial-gradient(80% 80% at 20% 20%,#000,transparent 72%)
}
.bod-coach-grid{
  position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(32px,4vw,60px);align-items:center
}
.bod-coach h2,.bod-coach h3{color:#fff}
.bod-coach .bod-eyebrow{color:var(--gd-2)}
.bod-coach-lead{margin-top:18px;color:rgba(255,255,255,.76);font-size:1.04rem;line-height:1.72}
.bod-coach-list{display:grid;gap:12px}
.bod-coach-list li{
  display:flex;gap:14px;align-items:flex-start;padding:15px 18px;border-radius:14px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);
  transition:background-color .3s var(--e), transform .3s var(--e)
}
.bod-coach-list li:hover{background:rgba(255,255,255,.12);transform:translateX(5px)}
.bod-coach-list svg{width:21px;height:21px;color:var(--gd-2);flex:none;margin-top:2px}
.bod-coach-list b{
  display:block;font-family:'Lexend',sans-serif;font-weight:500;font-size:.98rem
}
.bod-coach-list small{display:block;font-size:.86rem;color:rgba(255,255,255,.62);margin-top:3px;line-height:1.55}
.bod-coach-tag{
  display:inline-flex;align-items:center;gap:9px;margin-top:26px;padding:11px 18px;
  border-radius:100px;background:rgba(214,164,76,.16);border:1px solid rgba(214,164,76,.34);
  font-size:.88rem;color:var(--gd-2)
}
.bod-coach-tag svg{width:16px;height:16px;flex:none}

/* ═══════════════ 11. BAŞARI HİKAYELERİ ═══════════════ */
.bod-tests{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2vw,24px)}
.bod-test{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(24px,2.8vw,32px);display:flex;flex-direction:column;position:relative;
  transition:transform .4s var(--e), box-shadow .4s var(--e)
}
.bod-test:hover{transform:translateY(-5px);box-shadow:var(--sh-1)}
.bod-quote{width:34px;height:34px;color:rgba(214,164,76,.32);margin-bottom:16px}
.bod-test p{font-size:1rem;line-height:1.72;color:#2C3B4F}
.bod-test-res{
  display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin-top:20px;
  padding:7px 14px;border-radius:100px;background:rgba(214,164,76,.13);
  border:1px solid rgba(214,164,76,.28);
  font-family:'Lexend',sans-serif;font-size:.83rem;font-weight:500;color:var(--gd-3)
}
.bod-test-res svg{width:15px;height:15px}
.bod-test-by{
  margin-top:auto;padding-top:22px;display:flex;align-items:center;gap:13px;
  border-top:1px solid var(--brd)
}
.bod-test-res + .bod-test-by{margin-top:24px}
.bod-av{
  width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--nv),var(--nv-2));color:var(--gd-2);
  font-family:'Lexend',sans-serif;font-weight:600;font-size:.94rem
}
.bod-test-by b{display:block;font-family:'Lexend',sans-serif;font-size:.94rem;font-weight:500;color:var(--nv)}
.bod-test-by small{display:block;font-size:.82rem;color:var(--mut);margin-top:1px}
.bod-stars{display:flex;gap:3px;margin-bottom:12px}
.bod-stars svg{width:16px;height:16px;color:var(--gd)}

/* ═══════════════ 12. FİYATLANDIRMA ═══════════════ */
.bod-plans{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2vw,24px);
  align-items:stretch
}
.bod-plan{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(26px,3vw,36px);display:flex;flex-direction:column;position:relative;
  transition:transform .4s var(--e), box-shadow .4s var(--e), border-color .4s var(--e)
}
.bod-plan:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.bod-plan.is-best{
  border-color:var(--gd);box-shadow:0 24px 60px -30px rgba(214,164,76,.65)
}
.bod-plan-tag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  padding:6px 16px;border-radius:100px;background:var(--gd);color:#26170A;
  font-family:'Lexend',sans-serif;font-size:.76rem;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;
  box-shadow:var(--sh-g)
}
.bod-plan-ic{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  background:rgba(16,49,91,.07);color:var(--nv);margin-bottom:18px
}
.bod-plan.is-best .bod-plan-ic{background:rgba(214,164,76,.16);color:var(--gd-3)}
.bod-plan-ic svg{width:23px;height:23px}
.bod-plan h3{font-size:1.24rem}
.bod-plan-desc{margin-top:10px;font-size:.94rem;color:var(--mut);line-height:1.65;min-height:3.3em}
.bod-plan-price{
  margin-top:20px;padding-top:20px;border-top:1px dashed var(--brd);
  font-family:'Lexend',sans-serif;font-weight:500;font-size:1.02rem;color:var(--nv)
}
.bod-plan-price small{display:block;font-family:'Source Sans 3',sans-serif;font-size:.85rem;color:var(--mut);margin-top:5px;font-weight:400}
.bod-plan-feats{display:grid;gap:11px;margin-top:22px;margin-bottom:28px}
.bod-plan-feats li{display:flex;gap:11px;align-items:flex-start;font-size:.94rem;line-height:1.6}
.bod-plan-feats svg{width:19px;height:19px;color:var(--gd-3);flex:none;margin-top:2px}
.bod-plan .bod-btn{margin-top:auto}
.bod-plan-foot{
  margin-top:clamp(28px,3.4vw,40px);text-align:center;font-size:.92rem;color:var(--mut)
}
.bod-plan-foot a{color:var(--nv);font-weight:600;border-bottom:1px solid rgba(16,49,91,.28)}

/* ═══════════════ 13. İLETİŞİM ═══════════════ */
.bod-contact{
  background:linear-gradient(155deg,var(--nv) 0%,var(--nv-2) 50%,var(--nv-3) 100%);
  color:#fff;position:relative;overflow:hidden
}
.bod-contact::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(70% 60% at 12% 8%,rgba(214,164,76,.18),transparent 58%),
    radial-gradient(60% 60% at 90% 96%,rgba(126,169,212,.18),transparent 58%)
}
.bod-contact h2,.bod-contact h3{color:#fff}
.bod-contact .bod-eyebrow{color:var(--gd-2)}
.bod-contact .bod-mark{color:#fff}
.bod-contact .bod-mark::after{background:linear-gradient(90deg,rgba(214,164,76,.5),rgba(214,164,76,.2))}
.bod-contact-in{position:relative;z-index:1}
.bod-contact-lead{
  margin-top:18px;max-width:58ch;color:rgba(255,255,255,.76);font-size:1.05rem;line-height:1.72
}
.bod-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(34px,4vw,48px)
}
.bod-card{
  display:flex;align-items:center;gap:16px;padding:22px;border-radius:var(--r-m);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
  transition:background-color .3s var(--e), transform .3s var(--e), border-color .3s var(--e)
}
.bod-card:hover{background:rgba(255,255,255,.13);transform:translateY(-4px);border-color:rgba(214,164,76,.45)}
.bod-card-ic{
  width:48px;height:48px;border-radius:14px;flex:none;display:grid;place-items:center;
  background:rgba(214,164,76,.17);color:var(--gd-2)
}
.bod-card-ic svg{width:23px;height:23px}
.bod-card small{display:block;font-size:.8rem;color:rgba(255,255,255,.6);letter-spacing:.04em;text-transform:uppercase}
.bod-card b{
  display:block;font-family:'Lexend',sans-serif;font-weight:500;font-size:1.02rem;
  margin-top:4px;word-break:break-word
}
.bod-contact-bot{
  margin-top:clamp(34px,4vw,48px);padding-top:30px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between
}
.bod-social{display:flex;gap:11px}
.bod-social a{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);color:#fff;
  transition:background-color .3s var(--e), transform .3s var(--e), color .3s var(--e)
}
.bod-social a:hover{background:var(--gd);color:#26170A;transform:translateY(-3px)}
.bod-social svg{width:20px;height:20px}
.bod-cover{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:.9rem;color:rgba(255,255,255,.68)}
.bod-cover span{display:inline-flex;align-items:center;gap:8px}
.bod-cover svg{width:16px;height:16px;color:var(--gd-2);flex:none}

/* ═══════════════ 14. YÜZEN BUTONLAR ═══════════════ */
.bod-fab{
  position:fixed;right:18px;bottom:18px;z-index:9990;
  display:flex;flex-direction:column;gap:12px;align-items:flex-end;
}
.bod-fab a{
  position:relative;width:56px;height:56px;border-radius:50%;
  display:grid;place-items:center;color:#fff;
  box-shadow:0 10px 26px -8px rgba(0,0,0,.42);
  transition:transform .3s var(--e), box-shadow .3s var(--e), width .3s var(--e);
}
.bod-fab a:hover{transform:scale(1.07)}
.bod-fab a:active{transform:scale(.97)}
.bod-fab svg{width:28px;height:28px}
.bod-fab-wa{background:var(--wa)}
.bod-fab-tel{background:var(--nv)}
.bod-fab-lb{
  position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(6px);
  background:var(--ink);color:#fff;font-family:'Lexend',sans-serif;font-size:.82rem;
  padding:8px 14px;border-radius:9px;white-space:nowrap;opacity:0;pointer-events:none;
  transition:opacity .25s var(--e), transform .25s var(--e);
  box-shadow:0 8px 20px -8px rgba(0,0,0,.4)
}
.bod-fab-lb::after{
  content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);
  border:6px solid transparent;border-left-color:var(--ink)
}
@media (hover:hover){
  .bod-fab a:hover .bod-fab-lb{opacity:1;transform:translateY(-50%) translateX(0)}
}
@media (max-width:600px){
  .bod-fab{right:14px;bottom:14px;gap:10px}
  .bod-fab a{width:52px;height:52px}
  .bod-fab svg{width:26px;height:26px}
}

/* ═══════════════ 14b. BAŞA DÖN ═══════════════ */
.bod-top{
  position:fixed;left:18px;bottom:18px;z-index:9990;
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--nv);color:var(--gd-2);
  border:2px solid var(--gd);
  box-shadow:0 10px 26px -8px rgba(0,0,0,.42);
  transition:transform .3s var(--e), background-color .3s var(--e),
             color .3s var(--e), opacity .3s var(--e),
             visibility .3s var(--e), border-color .3s var(--e);
}
.bod-top svg{width:23px;height:23px}
.bod-top:hover{background:var(--gd);border-color:var(--gd-2);color:var(--nv)}
.bod-js .bod-top{opacity:0;visibility:hidden;transform:translateY(12px) scale(.9);pointer-events:none}
.bod-js .bod-top.is-on{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.bod-js .bod-top.is-on:hover{transform:translateY(-3px)}
.bod-js .bod-top.is-on:active{transform:translateY(0) scale(.95)}
@media (max-width:600px){
  .bod-top{left:14px;bottom:14px;width:48px;height:48px}
  .bod-top svg{width:21px;height:21px}
}

/* ═══════════════ 15. RESPONSIVE ═══════════════ */
@media (max-width:1080px){
  .bod-hero{min-height:clamp(520px,72vh,700px)}
  .bod-why-card.is-span3,.bod-why-card.is-span2{grid-column:span 3}
  .bod-coach-grid{grid-template-columns:1fr;gap:34px}
  .bod-tests,.bod-plans{grid-template-columns:1fr 1fr}
  .bod-plan.is-best{grid-column:span 2}
  .bod-test:last-child{grid-column:span 2}
}
@media (max-width:820px){
  .bod-cats{grid-template-columns:1fr}
  .bod-steps{grid-template-columns:1fr 1fr;gap:34px 22px}
  .bod-steps::before,.bod-steps::after{display:none}
  .bod-cards{grid-template-columns:1fr}
}
@media (max-width:680px){
  .bod{font-size:16px}
  .bod-why{grid-template-columns:1fr}
  .bod-why-card.is-span3,.bod-why-card.is-span2{grid-column:span 1}
  .bod-tests,.bod-plans{grid-template-columns:1fr}
  .bod-plan.is-best,.bod-test:last-child{grid-column:span 1}
  /* Mobilde degrade yatayda sikistigi icin fotografin parlak kismi
     yaziya daha cok yaklasiyor — ek karartma. */
  .bod{--hero-koyu:.16}
  .bod-hero{min-height:clamp(500px,88vh,660px);padding-block:clamp(64px,13vw,88px)}
  .bod-hero-bg img{object-position:var(--hero-odak-m,60% 38%)}
  .bod-hero-cta{flex-direction:column;align-items:stretch}
  .bod-hero-cta .bod-btn{width:100%}
  .bod-contact-bot{flex-direction:column;align-items:flex-start;gap:24px}
  .bod-steps{grid-template-columns:1fr;gap:26px}
  .bod-step{display:grid;grid-template-columns:54px 1fr;gap:0 18px;text-align:left}
  .bod-step-n{margin:0}
  .bod-step h3{align-self:center}
  .bod-step p{grid-column:2}
}
@media (max-width:400px){
  .bod-cat{padding:22px}
  .bod-why-card,.bod-test,.bod-plan{padding:22px}
  .bod-mark{white-space:normal}
  .bod-chip{font-size:.8rem;padding:6px 12px}
}


/* ══════════════════════════════════════════════════════════════════════════
   İÇ SAYFA BİLEŞENLERİ
   (kategori ve alt kategori sayfaları bu bloktan beslenir)
   ══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════ 16. SAYFA HERO ═══════════════ */
.bod-phero{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(110% 85% at 85% 0%, rgba(214,164,76,.20) 0%, transparent 55%),
    radial-gradient(80% 70% at 5% 100%, rgba(126,169,212,.18) 0%, transparent 58%),
    linear-gradient(160deg,#143B6B 0%,#10315B 45%,#071B38 100%);
  background-color:#10315B;
  padding-block:clamp(56px,7vw,88px) clamp(56px,7vw,92px);
}
.bod-phero::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:58px 58px;
  -webkit-mask-image:radial-gradient(100% 90% at 50% 0%,#000 20%,transparent 80%);
  mask-image:radial-gradient(100% 90% at 50% 0%,#000 20%,transparent 80%);
  pointer-events:none;
}
.bod-phero h1,.bod-phero h2,.bod-phero h3{color:#fff}
.bod-phero .bod-eyebrow{color:var(--gd-2)}
.bod-phero .bod-mark{color:#fff}
.bod-phero .bod-mark::after{background:linear-gradient(90deg,rgba(214,164,76,.5),rgba(214,164,76,.2))}
.bod-phero-grid{
  position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;
  gap:clamp(34px,4.5vw,64px);align-items:center
}
.bod-phero h1{margin-top:18px;font-size:clamp(1.9rem,4.4vw,3.05rem)}
.bod-phero-sub{
  margin-top:26px;max-width:56ch;color:rgba(255,255,255,.78);
  font-size:clamp(1rem,1.4vw,1.1rem);line-height:1.72
}
.bod-phero-cta{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}

/* Kırıntı yolu */
.bod-crumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  position:relative;z-index:2;margin-bottom:clamp(24px,3vw,34px);
  font-size:.86rem;color:rgba(255,255,255,.6)
}
.bod-crumb a{color:rgba(255,255,255,.72);transition:color .25s var(--e)}
.bod-crumb a:hover{color:var(--gd-2)}
.bod-crumb svg{width:14px;height:14px;opacity:.5;flex:none}
.bod-crumb [aria-current]{color:var(--gd-2)}

/* Hero yan panel — hızlı bilgiler */
.bod-phero-card{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-l);padding:clamp(22px,2.6vw,30px);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 30px 70px -34px rgba(0,0,0,.7)
}
.bod-phero-card h2{
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gd-2);font-weight:600
}
.bod-phero-card dl{margin:18px 0 0;display:grid;gap:0}
.bod-phero-card dl > div{padding:14px 0;border-top:1px solid rgba(255,255,255,.11)}
.bod-phero-card dl > div:first-child{border-top:0;padding-top:0}
.bod-phero-card dl > div:last-child{padding-bottom:0}
.bod-phero-card dt{
  display:flex;align-items:center;gap:9px;
  font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.55)
}
.bod-phero-card dt svg{width:16px;height:16px;color:var(--gd-2);flex:none}
.bod-phero-card dd{
  margin:6px 0 0;padding-left:25px;
  font-family:'Lexend',sans-serif;font-weight:500;
  font-size:.98rem;line-height:1.45
}

/* Hero altı hızlı etiketler */
.bod-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;position:relative;z-index:2}
.bod-fact{
  display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:100px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  font-size:.87rem;color:rgba(255,255,255,.88)
}
.bod-fact svg{width:15px;height:15px;color:var(--gd-2);flex:none}

/* ═══════════════ 17. ALT KATEGORİ KARTLARI ═══════════════ */
.bod-subs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2vw,24px)}
.bod-subs.is-2{grid-template-columns:repeat(2,1fr)}
.bod-subs.is-4{grid-template-columns:repeat(4,1fr)}
.bod-sub{
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(24px,2.8vw,32px);
  transition:transform .4s var(--e), box-shadow .4s var(--e), border-color .4s var(--e)
}
.bod-sub::after{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--gd),var(--gd-2));
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--e)
}
.bod-sub:hover{transform:translateY(-6px);box-shadow:var(--sh-2);border-color:rgba(214,164,76,.5)}
.bod-sub:hover::after{transform:scaleX(1)}
.bod-sub-ic{
  width:52px;height:52px;border-radius:15px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--nv),var(--nv-2));color:var(--gd-2);
  box-shadow:0 12px 26px -14px rgba(16,49,91,.85);margin-bottom:20px;
  transition:transform .4s var(--e)
}
.bod-sub:hover .bod-sub-ic{transform:rotate(-6deg) scale(1.06)}
.bod-sub-ic svg{width:25px;height:25px}
.bod-sub h3{font-size:1.12rem}
.bod-sub-grade{
  display:block;margin-top:7px;font-size:.83rem;font-weight:600;color:var(--gd-3);
  font-family:'Lexend',sans-serif
}
.bod-sub p{margin-top:14px;font-size:.94rem;color:var(--mut);line-height:1.68}
.bod-sub .bod-link{margin-top:auto;padding-top:18px}

/* ═══════════════ 18. KONU / MÜFREDAT GRIDI ═══════════════ */
.bod-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,22px)}
.bod-topics.is-2{grid-template-columns:repeat(2,1fr)}
.bod-topic{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(22px,2.6vw,30px);
  transition:box-shadow .4s var(--e), border-color .4s var(--e)
}
.bod-topic:hover{box-shadow:var(--sh-1);border-color:#D2DDEC}
.bod-topic-head{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.bod-topic-ic{
  width:42px;height:42px;border-radius:13px;flex:none;display:grid;place-items:center;
  background:rgba(16,49,91,.07);color:var(--nv)
}
.bod-topic-ic svg{width:21px;height:21px}
.bod-topic h3{font-size:1.05rem}
.bod-topic-head span{
  display:block;font-size:.79rem;color:var(--gd-3);font-weight:600;
  font-family:'Lexend',sans-serif;margin-top:2px
}
.bod-topic ul{display:grid;gap:9px}
.bod-topic li{
  display:flex;gap:10px;align-items:flex-start;font-size:.93rem;
  line-height:1.6;color:#3A4A60
}
.bod-topic li::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--gd);
  flex:none;margin-top:.55em;opacity:.75
}

/* ═══════════════ 19. KONTROL LİSTESİ ═══════════════ */
.bod-checks{display:grid;gap:13px}
.bod-checks li{display:flex;gap:13px;align-items:flex-start;font-size:1rem;line-height:1.65}
.bod-checks svg{width:21px;height:21px;color:var(--gd-3);flex:none;margin-top:3px}
.bod-checks b{
  font-family:'Lexend',sans-serif;font-weight:500;color:var(--nv);
  display:block;font-size:1rem
}
.bod-checks small{display:block;font-size:.91rem;color:var(--mut);margin-top:3px;line-height:1.6}

/* ═══════════════ 20. İKİLİ BÖLÜM ═══════════════ */
.bod-split{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(32px,4.5vw,64px);align-items:center
}
.bod-split.is-wide{grid-template-columns:.92fr 1.08fr}
.bod-panel{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(26px,3vw,38px)
}
.bod-panel.is-dark{
  background:linear-gradient(150deg,var(--nv),var(--nv-2) 60%,var(--nv-3));
  border-color:transparent;color:#fff;position:relative;overflow:hidden
}
.bod-panel.is-dark::after{
  content:"";position:absolute;right:-60px;top:-60px;width:210px;height:210px;
  border-radius:50%;background:radial-gradient(circle,rgba(214,164,76,.26),transparent 66%)
}
.bod-panel.is-dark h2,.bod-panel.is-dark h3{color:#fff;position:relative;z-index:1}
.bod-panel.is-dark p,.bod-panel.is-dark li{color:rgba(255,255,255,.78);position:relative;z-index:1}
.bod-panel.is-dark .bod-checks b{color:#fff}
.bod-panel.is-dark .bod-checks small{color:rgba(255,255,255,.66)}
.bod-panel.is-dark .bod-checks svg{color:var(--gd-2)}

/* ═══════════════ 21. TABLO ═══════════════ */
.bod-tablewrap{
  overflow-x:auto;border:1px solid var(--brd);border-radius:var(--r-l);
  background:var(--sf);-webkit-overflow-scrolling:touch
}
.bod-table{width:100%;border-collapse:collapse;min-width:520px;font-size:.95rem}
.bod-table caption{
  caption-side:bottom;padding:14px 20px;font-size:.85rem;color:var(--mut);
  text-align:left;border-top:1px solid var(--brd)
}
.bod-table th,.bod-table td{padding:14px 20px;text-align:left;vertical-align:top}
.bod-table thead th{
  background:#F1F5FA;font-family:'Lexend',sans-serif;font-weight:600;
  font-size:.83rem;letter-spacing:.05em;text-transform:uppercase;color:var(--nv);
  border-bottom:1px solid var(--brd);white-space:nowrap
}
.bod-table tbody tr + tr{border-top:1px solid var(--brd)}
.bod-table tbody th{font-family:'Lexend',sans-serif;font-weight:500;color:var(--nv)}
.bod-table td{color:#3A4A60}
.bod-table tbody tr:hover{background:#FAFCFE}
.bod-table .is-num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ═══════════════ 22. BİLGİ KUTUSU ═══════════════ */
.bod-note{
  display:flex;gap:16px;align-items:flex-start;
  padding:20px 24px;border-radius:var(--r-m);
  background:rgba(214,164,76,.09);border:1px solid rgba(214,164,76,.3)
}
.bod-note svg{width:22px;height:22px;color:var(--gd-3);flex:none;margin-top:2px}
.bod-note p{font-size:.95rem;line-height:1.68;color:#3A4A60}
.bod-note b{font-family:'Lexend',sans-serif;font-weight:600;color:var(--nv)}

/* ═══════════════ 23. SSS AKORDEON ═══════════════ */
.bod-faq{display:grid;gap:12px;max-width:860px;margin-inline:auto}
.bod-faq details{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-m);
  overflow:hidden;transition:border-color .3s var(--e), box-shadow .3s var(--e)
}
.bod-faq details[open]{border-color:rgba(214,164,76,.45);box-shadow:var(--sh-1)}
.bod-faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:20px 24px;cursor:pointer;list-style:none;
  font-family:'Lexend',sans-serif;font-weight:500;font-size:1.02rem;
  color:var(--nv);line-height:1.45;
  transition:background-color .25s var(--e)
}
.bod-faq summary::-webkit-details-marker{display:none}
.bod-faq summary:hover{background:#FAFCFE}
.bod-faq summary::after{
  content:"";width:11px;height:11px;flex:none;
  border-right:2px solid var(--gd-3);border-bottom:2px solid var(--gd-3);
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform .3s var(--e)
}
.bod-faq details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.bod-faq-body{padding:0 24px 22px}
.bod-faq-body p{font-size:.97rem;line-height:1.72;color:#3A4A60}
.bod-faq-body p + p{margin-top:12px}
.bod-faq-body ul{display:grid;gap:8px;margin-top:12px}
.bod-faq-body li{
  display:flex;gap:10px;font-size:.95rem;line-height:1.65;color:#3A4A60
}
.bod-faq-body li::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--gd);
  flex:none;margin-top:.55em;opacity:.75
}

/* ═══════════════ 24. KAPANIŞ CTA ═══════════════ */
.bod-cta{
  background:linear-gradient(155deg,var(--nv) 0%,var(--nv-2) 50%,var(--nv-3) 100%);
  color:#fff;position:relative;overflow:hidden;text-align:center
}
.bod-cta::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(60% 60% at 15% 10%,rgba(214,164,76,.20),transparent 58%),
    radial-gradient(55% 60% at 88% 92%,rgba(126,169,212,.18),transparent 58%)
}
.bod-cta-in{position:relative;z-index:1;max-width:720px;margin-inline:auto}
.bod-cta h2{color:#fff}
.bod-cta .bod-mark,.bod-panel.is-dark .bod-mark{color:#fff}
.bod-cta .bod-mark::after,.bod-panel.is-dark .bod-mark::after{
  background:linear-gradient(90deg,rgba(214,164,76,.5),rgba(214,164,76,.2))
}
.bod-cta .bod-eyebrow{color:var(--gd-2);display:block;margin-bottom:14px}
.bod-cta p{margin-top:18px;color:rgba(255,255,255,.78);font-size:1.05rem;line-height:1.72}
.bod-cta-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:32px}
.bod-cta-mini{
  display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:center;
  margin-top:28px;font-size:.9rem;color:rgba(255,255,255,.62)
}
.bod-cta-mini span{display:inline-flex;align-items:center;gap:8px}
.bod-cta-mini svg{width:15px;height:15px;color:var(--gd-2);flex:none}

/* ═══════════════ 25. İÇ SAYFA RESPONSIVE ═══════════════ */
@media (max-width:1080px){
  .bod-phero-grid{grid-template-columns:1fr;gap:36px}
  .bod-subs.is-4{grid-template-columns:repeat(2,1fr)}
  .bod-topics{grid-template-columns:repeat(2,1fr)}
  .bod-split,.bod-split.is-wide{grid-template-columns:1fr;gap:32px}
}
@media (max-width:820px){
  .bod-subs,.bod-subs.is-2{grid-template-columns:1fr}
  .bod-subs.is-3-keep{grid-template-columns:1fr}
}
@media (max-width:680px){
  .bod-topics,.bod-topics.is-2{grid-template-columns:1fr}
  .bod-subs.is-4{grid-template-columns:1fr}
  .bod-phero-cta{flex-direction:column;align-items:stretch}
  .bod-phero-cta .bod-btn{width:100%}
  .bod-cta-btns{flex-direction:column;align-items:stretch}
  .bod-cta-btns .bod-btn{width:100%}
  .bod-faq summary{padding:17px 18px;font-size:.98rem}
  .bod-faq-body{padding:0 18px 18px}
  .bod-note{padding:17px 18px;gap:13px}
}
@media (max-width:400px){
  .bod-sub,.bod-topic,.bod-panel{padding:22px}
  .bod-phero-card{padding:20px}
}


/* ══════════════════════════════════════════════════════════════════════════
   KURUMSAL & HUKUKİ SAYFA BİLEŞENLERİ
   (hakkımızda, iletişim, kullanım koşulları, gizlilik, KVKK)
   ══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════ 26. DOLDURULACAK ALAN İŞARETİ ═══════════════
   Hukuki metinlerde firma bilgisi girilmesi gereken yerler.
   Bilgiyi girdikten sonra <span class="bod-fill">…</span> etiketini kaldır. */
.bod-fill{
  display:inline-block;
  background:rgba(214,164,76,.16);
  border-bottom:2px dotted #8A5E15;
  padding:1px 7px;border-radius:5px;
  font-family:'Lexend',sans-serif;font-weight:600;font-size:.94em;
  color:#8A5E15;                 /* açık altın zemin üzerinde 5.03:1 — WCAG AA */
  overflow-wrap:anywhere;
}

/* ═══════════════ 27. UZUN METİN (HUKUKİ SAYFALAR) ═══════════════ */
.bod-legal{max-width:840px;margin-inline:auto}
.bod-legal-meta{
  display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;
  padding:16px 22px;border-radius:var(--r-m);
  background:#F1F5FA;border:1px solid var(--brd);
  font-size:.9rem;color:var(--mut);margin-bottom:clamp(28px,4vw,40px)
}
.bod-legal-meta span{display:inline-flex;align-items:center;gap:8px}
.bod-legal-meta svg{width:16px;height:16px;color:var(--gd-3);flex:none}
.bod-legal-meta b{color:var(--nv);font-family:'Lexend',sans-serif;font-weight:600}

.bod-legal section + section{margin-top:clamp(36px,4.5vw,52px)}
.bod-legal h2{
  font-size:clamp(1.2rem,2.1vw,1.5rem);
  padding-bottom:14px;border-bottom:2px solid var(--brd);
  margin-bottom:20px;scroll-margin-top:90px
}
.bod-legal h2 .bod-legal-no{
  display:inline-block;min-width:1.9em;color:var(--gd-3);font-weight:700
}
.bod-legal h3{
  font-size:1.05rem;margin-top:26px;margin-bottom:10px;color:var(--nv-2)
}
.bod-legal p{font-size:1rem;line-height:1.78;color:#37485F;overflow-wrap:break-word}
.bod-legal p + p{margin-top:14px}
.bod-legal strong{color:var(--nv);font-weight:600}
.bod-legal ul,.bod-legal ol{display:grid;gap:10px;margin-top:14px;padding-left:0}
.bod-legal ol{counter-reset:bodleg}
.bod-legal li{
  display:flex;gap:12px;align-items:flex-start;
  font-size:1rem;line-height:1.72;color:#37485F;
  /* Flex öğeleri varsayılan olarak en uzun kelimenin altına inemez.
     E-posta adresi gibi bölünemeyen uzun ifadeler dar ekranda taşmaya
     yol açıyordu — bu iki satır onu engelliyor. */
  min-width:0;overflow-wrap:anywhere;
}
.bod-legal ul > li::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--gd);
  flex:none;margin-top:.62em;opacity:.8
}
.bod-legal ol > li{counter-increment:bodleg}
.bod-legal ol > li::before{
  content:counter(bodleg,lower-alpha) ")";
  flex:none;min-width:1.5em;color:var(--gd-3);font-weight:600;
  font-family:'Lexend',sans-serif;font-size:.95em
}
.bod-legal a:not(.bod-btn):not(.bod-link){
  color:var(--nv);font-weight:600;border-bottom:1px solid rgba(16,49,91,.3)
}
.bod-legal a:not(.bod-btn):not(.bod-link):hover{border-bottom-color:var(--gd-3);color:var(--gd-3)}
.bod-legal .bod-note{margin-top:20px}
.bod-legal .bod-tablewrap{margin-top:18px}

/* İçindekiler */
.bod-toc{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(22px,2.6vw,28px);margin-bottom:clamp(32px,4vw,48px)
}
.bod-toc h2{
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gd-3);font-weight:600;border:0;padding:0;margin:0 0 16px
}
.bod-toc ol{display:grid;gap:2px;counter-reset:bodtoc;margin:0;padding:0}
/* .bod-toc, .bod-legal icinde ic ice oldugu icin ".bod-legal ol > li" kuralindaki
   bodleg sayaci/harf oneki buraya sizmasin diye ozgullugu esitleyip sonradan eziyoruz. */
.bod-toc ol > li{counter-increment:bodtoc;display:block}
.bod-toc ol > li::before{content:none}
.bod-toc a{
  display:flex;gap:12px;align-items:baseline;
  padding:9px 10px;border-radius:9px;font-size:.96rem;line-height:1.5;
  color:#37485F;transition:background-color .22s var(--e), color .22s var(--e)
}
.bod-toc a::before{
  content:counter(bodtoc) ".";
  flex:none;min-width:1.8em;color:var(--gd-3);font-weight:600;
  font-family:'Lexend',sans-serif;font-size:.9em
}
.bod-toc a:hover{background:#F1F5FA;color:var(--nv)}

/* ═══════════════ 28. FORM ═══════════════ */
.bod-form{
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(24px,3vw,36px);box-shadow:var(--sh-1)
}
.bod-form-head{margin-bottom:24px}
.bod-form-head h2{font-size:clamp(1.15rem,2vw,1.4rem)}
.bod-form-head p{margin-top:10px;font-size:.95rem;color:var(--mut);line-height:1.65}
.bod-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bod-field{display:flex;flex-direction:column;gap:7px}
.bod-field.is-full{grid-column:1 / -1}
.bod-field label{
  font-family:'Lexend',sans-serif;font-weight:500;font-size:.9rem;color:var(--nv)
}
.bod-field label .bod-opt{font-weight:400;color:var(--mut);font-size:.88em}
.bod-field input,.bod-field select,.bod-field textarea{
  font:inherit;font-size:.98rem;color:var(--ink);
  padding:13px 15px;border-radius:var(--r-s);
  border:1.5px solid var(--brd);background:#FBFCFE;
  width:100%;min-height:48px;
  transition:border-color .22s var(--e), background-color .22s var(--e), box-shadow .22s var(--e)
}
.bod-field textarea{min-height:120px;resize:vertical;line-height:1.6}
.bod-field select{
  cursor:pointer;-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2354677F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:17px;
  padding-right:42px
}
.bod-field input:hover,.bod-field select:hover,.bod-field textarea:hover{border-color:#C9D6E6}
.bod-field input:focus,.bod-field select:focus,.bod-field textarea:focus{
  outline:none;border-color:var(--gd);background:#fff;
  box-shadow:0 0 0 4px rgba(214,164,76,.16)
}
.bod-field input::placeholder,.bod-field textarea::placeholder{color:#9AAABD}

.bod-form .bod-btn{margin-top:22px}
.bod-form-note{
  display:flex;gap:13px;align-items:flex-start;margin-top:18px;
  padding:15px 18px;border-radius:var(--r-m);
  background:rgba(37,211,102,.08);border:1px solid rgba(37,211,102,.28)
}
.bod-form-note svg{width:19px;height:19px;color:#128C4A;flex:none;margin-top:2px}
.bod-form-note p{font-size:.9rem;line-height:1.62;color:#2C4A38}
.bod-form-note b{font-weight:600;color:#0E6B39}

/* ═══════════════ 29. KURUMSAL RESPONSIVE ═══════════════ */
/* ═══════════════ 30. LOKASYON (İLÇE) BİLEŞENLERİ ═══════════════ */
.bod-locs{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,20px)
}
.bod-loc{
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-l);
  padding:clamp(20px,2.2vw,26px);
  transition:transform .35s var(--e), box-shadow .35s var(--e), border-color .35s var(--e)
}
.bod-loc::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--gd),var(--gd-2));
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--e)
}
.bod-loc:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:rgba(214,164,76,.5)}
.bod-loc:hover::after{transform:scaleY(1)}
.bod-loc-top{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.bod-loc-ic{
  width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--nv),var(--nv-2));color:var(--gd-2);
  transition:transform .35s var(--e)
}
.bod-loc:hover .bod-loc-ic{transform:scale(1.08)}
.bod-loc-ic svg{width:20px;height:20px}
.bod-loc h3{font-size:1.06rem;line-height:1.25}
.bod-loc-yaka{
  display:block;margin-top:3px;font-size:.76rem;font-weight:600;color:var(--gd-3);
  font-family:'Lexend',sans-serif;letter-spacing:.03em
}
.bod-loc p{
  font-size:.88rem;line-height:1.6;color:var(--mut);
  min-width:0;overflow-wrap:anywhere
}
.bod-loc .bod-link{margin-top:auto;padding-top:14px;font-size:.9rem;min-height:44px}

/* Komşu ilçeler şeridi */
.bod-nearby{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:22px
}
.bod-nearby a{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 16px;border-radius:100px;min-height:44px;
  background:var(--sf);border:1px solid var(--brd);
  font-family:'Lexend',sans-serif;font-weight:500;font-size:.9rem;color:var(--nv);
  transition:border-color .25s var(--e), background-color .25s var(--e), transform .25s var(--e)
}
.bod-nearby a svg{width:15px;height:15px;color:var(--gd-3);flex:none}
.bod-nearby a:hover{
  border-color:var(--gd);background:rgba(214,164,76,.08);transform:translateY(-2px)
}

@media (max-width:1080px){ .bod-locs{grid-template-columns:repeat(3,1fr)} }
@media (max-width:820px){  .bod-locs{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){  .bod-locs{grid-template-columns:1fr} }

@media (max-width:680px){
  .bod-fields{grid-template-columns:1fr}
  /* iOS Safari, 16px'ten küçük yazılı bir alana dokunulduğunda sayfayı
     otomatik yakınlaştırır. Bunu engellemek için mobilde tam 16px. */
  .bod-field input,.bod-field select,.bod-field textarea{font-size:16px}
  .bod-legal-meta{padding:14px 16px}
  .bod-toc a{padding:11px 8px}
  .bod-legal h2{scroll-margin-top:70px}
}

/* ═══════════════ 31. SITE HEADER (WPCode ile her sayfaya eklenir) ═══════════════
   header-wpcode.html dosyasındaki HTML ile birlikte çalışır. Bu blok sticky
   (yapışkan) bir üst bar üretir; header ~80px (mobilde ~64px) yükseklikte
   olduğu için sayfa içi çapalar (#iletisim, #kocluk, #kategoriler ve hukuki
   sayfalardaki h2'ler) altında kalmasın diye scroll-margin-top eklendi. */
.bod-sec[id]{scroll-margin-top:90px}

/* position:sticky #bod-header İÇİNDEKİ <header>'a değil, DOĞRUDAN #bod-header'a
   uygulanıyor. Sebep: #bod-header, sayfa içeriğinden (#bod-basi) ve footer'dan
   (#bod-footer) AYRI bir kardeş <div> — kendi içeriği kadar (~80px) yüksek.
   Sticky bir eleman, ait olduğu üst kapsayıcı kutunun sınırları içinde "yapışır";
   <header> öğesinin ebeveyni #bod-header sadece 80px olursa yapışacak hiç yer
   kalmaz (sayfa geri kalanı ayrı bir div'de olduğu için). #bod-header <body>'nin
   DOĞRUDAN çocuğu olduğunda ise onun kapsayıcısı <body> olur — <body> tüm sayfa
   (header+içerik+footer) kadar uzun olduğundan sticky düzgün çalışır. */
#bod-header{
  /* .bod{overflow-x:clip} bunu miras alırsa clipping container oluşup sticky'yi
     yine bozar; visible'a çekiyoruz. */
  overflow:visible;
  position:sticky;top:0;z-index:500;
}
.bod-site-header{
  /* backdrop-filter KULLANMA — filter/backdrop-filter/transform, position:fixed
     torunlar (mobil .bod-nav paneli) için YENİ bir containing block oluşturur;
     bu, panelin tüm ekranı değil bu barın kendi ~64px yüksekliğini kaplamasına
     yol açıyordu. Onun yerine neredeyse opak düz bir zemin kullanıyoruz. */
  background:rgba(246,248,252,.97);
  border-bottom:1px solid var(--brd);
}
.bod-site-header-in{
  width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:80px;
}
.bod-logo{
  /* display:flex KULLANMA — inline metin + <b> karışımını flex item'a
     çevirip aralarındaki boşluğu yutuyor ("Bu Özel Ders" -> "BuÖzelDers"). */
  flex:none;
  font-family:'Lexend',sans-serif;font-weight:700;font-size:1.22rem;
  color:var(--nv);letter-spacing:-.01em;
}
.bod-logo b{color:var(--gd-3);font-weight:700}

.bod-nav-toggle-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}

.bod-nav{
  display:flex;align-items:center;gap:2px;margin-inline:auto;flex-wrap:wrap;
}
.bod-nav-item{position:relative}
.bod-nav a{
  display:flex;align-items:center;gap:6px;min-height:44px;padding:10px 14px;border-radius:10px;
  font-family:'Lexend',sans-serif;font-weight:500;font-size:.93rem;color:var(--ink);
  transition:background-color .2s var(--e), color .2s var(--e);
}
.bod-nav > .bod-nav-item > a:hover,
.bod-nav > .bod-nav-item > a:focus-visible{background:rgba(16,49,91,.06);color:var(--nv)}
.bod-nav-caret{width:13px;height:13px;flex:none;transition:transform .25s var(--e)}
.bod-nav-item:hover .bod-nav-caret,
.bod-nav-item:focus-within .bod-nav-caret{transform:rotate(180deg)}

.bod-nav-panel{
  position:absolute;top:100%;left:0;min-width:250px;padding:8px;margin-top:4px;
  background:var(--sf);border:1px solid var(--brd);border-radius:var(--r-m);box-shadow:var(--sh-2);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s var(--e), transform .2s var(--e), visibility .2s;
}
.bod-nav-item:hover .bod-nav-panel,
.bod-nav-item:focus-within .bod-nav-panel{opacity:1;visibility:visible;transform:translateY(0)}
.bod-nav-panel a{padding:10px 12px;border-radius:8px;font-size:.9rem;min-height:auto}

.bod-nav-cta{display:flex;align-items:center;gap:14px;flex:none}
.bod-nav-cta .bod-btn{padding:12px 22px;font-size:.9rem}

.bod-nav-burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;flex:none;cursor:pointer;border-radius:10px;
}
.bod-nav-burger span{
  display:block;height:2px;width:22px;margin-inline:auto;background:var(--nv);border-radius:2px;
  transition:transform .3s var(--e), opacity .3s var(--e)
}
.bod-nav-toggle-input:checked ~ .bod-site-header-in .bod-nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.bod-nav-toggle-input:checked ~ .bod-site-header-in .bod-nav-burger span:nth-child(2){opacity:0}
.bod-nav-toggle-input:checked ~ .bod-site-header-in .bod-nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:960px){
  .bod-site-header-in{min-height:64px}
  .bod-nav-cta .bod-btn--gold{display:none}
  .bod-nav-burger{display:flex}

  .bod-nav{
    position:fixed;inset:64px 0 0 0;z-index:499;
    background:var(--sf);flex-direction:column;align-items:stretch;
    padding:14px clamp(20px,5vw,40px) 100px;gap:2px;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    transform:translateX(100%);transition:transform .35s var(--e);
  }
  .bod-nav-toggle-input:checked ~ .bod-site-header-in .bod-nav{transform:translateX(0)}
  .bod-nav-item{width:100%}
  .bod-nav > .bod-nav-item > a{width:100%;font-size:1.02rem}
  .bod-nav-panel{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;background:none;margin:0 0 6px 14px;padding:0;display:grid;gap:2px;
  }
  .bod-nav-panel a{color:var(--mut)}
  .bod-nav a.bod-nav-mobile-cta{display:flex;margin-top:18px}
  .bod-sec[id]{scroll-margin-top:70px}
}
@media (min-width:961px){
  /* Özgüllüğü ".bod-nav a{display:flex}" kuralını yenecek şekilde
     ".bod-nav a.bod-nav-mobile-cta" yazıldı — tek sınıf seçici yetmiyordu. */
  .bod-nav a.bod-nav-mobile-cta{display:none}
}

/* ═══════════════ 32. SITE FOOTER (WPCode ile her sayfaya eklenir) ═══════════════
   footer-wpcode.html dosyasındaki HTML ile birlikte çalışır. */
.bod-site-footer{
  background:linear-gradient(155deg,var(--nv) 0%,var(--nv-2) 50%,var(--nv-3) 100%);
  color:#fff;position:relative;overflow:hidden;isolation:isolate;
}
.bod-site-footer::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(70% 60% at 12% 0%,rgba(214,164,76,.16),transparent 58%),
    radial-gradient(60% 60% at 92% 100%,rgba(126,169,212,.16),transparent 58%)
}
.bod-foot-in{
  width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  padding-top:clamp(52px,7vw,80px);
}
.bod-foot-top{
  display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(28px,4vw,48px);
}
.bod-foot-logo{
  /* display:flex/inline-flex KULLANMA — bkz. .bod-logo yorumu */
  font-family:'Lexend',sans-serif;font-weight:700;font-size:1.28rem;color:#fff;
}
.bod-foot-logo b{color:var(--gd-2)}
.bod-foot-slogan{
  display:block;margin-top:8px;font-family:'Lexend',sans-serif;font-weight:600;
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gd-2)
}
.bod-foot-desc{
  margin-top:16px;max-width:34ch;color:rgba(255,255,255,.72);font-size:.92rem;line-height:1.75
}
.bod-foot-brand .bod-social{margin-top:22px}

.bod-foot-h{
  font-family:'Lexend',sans-serif;font-size:.76rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gd-2);margin:0
}
.bod-foot-col ul{margin-top:18px;display:grid;gap:12px}
.bod-foot-col a{
  color:rgba(255,255,255,.76);font-size:.93rem;transition:color .2s var(--e);
  min-width:0;overflow-wrap:anywhere
}
.bod-foot-col a:hover{color:var(--gd-2)}
.bod-foot-contact li{display:flex;align-items:flex-start;gap:10px;color:rgba(255,255,255,.76);font-size:.9rem}
.bod-foot-contact svg{width:16px;height:16px;color:var(--gd-2);flex:none;margin-top:3px}

.bod-foot-bottom{
  margin-top:clamp(40px,5vw,64px);padding-block:22px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;
  font-size:.83rem;color:rgba(255,255,255,.56)
}
.bod-foot-legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.bod-foot-legal a{color:rgba(255,255,255,.56);transition:color .2s var(--e)}
.bod-foot-legal a:hover{color:#fff}

@media (max-width:900px){
  .bod-foot-top{grid-template-columns:1fr 1fr;row-gap:40px}
}
@media (max-width:560px){
  .bod-foot-top{grid-template-columns:1fr;row-gap:36px}
  .bod-foot-bottom{flex-direction:column;align-items:flex-start}
}