/* =========================================================
   FAUN AGENCY WEB SİTESİ
   YAZILIM GELİŞTİRME: Fahri Ünal
   Not: Class isimleri Türkçeleştirilmiştir.
   ========================================================= */

@font-face{font-family:"FaunBrand";src:url("fonts/faun-brand.woff2") format("woff2"),url("fonts/faun-brand.woff") format("woff");font-weight:700;font-style:italic;font-display:swap}
:root{--primary:#0b61af;--primary-bright:#1294d7;--primary-soft:#eaf5ff;--dark:#101827;--text:#3d4c63;--muted:#6c7b90;--white:#fff;--surface:#f6f9fc;--border:#d9e5f0;--shadow:0 24px 70px rgba(11,23,42,.08);--container:1180px}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:#f5f8fc;color:var(--text);line-height:1.65;overflow-x:hidden}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}ul{list-style:none}.container{width:min(var(--container),calc(100% - 48px));margin:0 auto;position:relative;z-index:2}
.site-arka-plan{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.arka-plan-sekil{position:absolute;border-radius:50%;filter:blur(8px);opacity:.45}.sekil-1{width:360px;height:360px;left:-130px;bottom:8%;background:radial-gradient(circle at center,rgba(18,148,215,.16),rgba(18,148,215,0) 70%)}.sekil-2{width:360px;height:360px;right:-100px;top:5%;background:radial-gradient(circle at center,rgba(11,97,175,.14),rgba(11,97,175,0) 70%)}.arka-plan-izgara{position:absolute;inset:0;background-image:linear-gradient(to right,rgba(11,97,175,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(11,97,175,.04) 1px,transparent 1px);background-size:110px 110px;mask-image:radial-gradient(circle at center,rgba(0,0,0,.6),transparent 85%);opacity:.35}
.header{position:sticky;top:0;z-index:1000;padding:18px 0;background:rgba(245,248,252,.82);backdrop-filter:blur(14px);border-bottom:1px solid rgba(217,229,240,.65)}.menu-satiri{display:flex;justify-content:space-between;align-items:center;gap:24px}.marka-gorseli{height:58px;width:auto}.nav{display:flex;align-items:center;gap:28px}.nav a{font-size:14px;font-weight:700;color:var(--dark);position:relative}.nav a:after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--primary);transition:.25s}.nav a:hover:after{width:100%}.mobil-menu-buton{display:none;width:48px;height:48px;border:none;border-radius:14px;background:#fff;box-shadow:var(--shadow);cursor:pointer}.mobil-menu-buton span{display:block;width:22px;height:2px;background:var(--dark);margin:5px auto;transition:.25s}
.hero{padding:58px 0 70px;position:relative}.giris-yerlesim{display:grid;grid-template-columns:1.02fr .98fr;gap:46px;align-items:center}.ust-rozet,.bolum-etiketi,.mini-rozet{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid rgba(11,97,175,.14);color:var(--primary);font-weight:800;font-size:14px;box-shadow:0 14px 28px rgba(11,97,175,.05)}.hero h1,.bolum-basligi h2,.hakkimda-icerik h2,.iletisim-karti h2{font-family:"FaunBrand",Inter,sans-serif;font-style:italic;line-height:.98;color:var(--dark);letter-spacing:-.02em}.hero h1{font-size:clamp(58px,8vw,98px);max-width:700px;margin:20px 0 18px}.hero h1 span{display:block;color:var(--primary)}.hero p{max-width:760px;font-size:18px;color:var(--muted)}.giris-butonlari{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.buton{display:inline-flex;align-items:center;justify-content:center;min-width:170px;padding:17px 28px;border-radius:18px;font-size:16px;font-weight:800;transition:.28s ease;border:1px solid transparent}.birincil-buton{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-bright) 100%);color:var(--white);box-shadow:0 18px 35px rgba(11,97,175,.24)}.birincil-buton:hover{background:#fff;color:var(--primary);border-color:var(--primary);box-shadow:0 18px 35px rgba(11,97,175,.12)}.ikincil-buton{background:#fff;border-color:rgba(11,97,175,.18);color:var(--primary)}.ikincil-buton:hover{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-bright) 100%);color:#fff;border-color:transparent;box-shadow:0 18px 35px rgba(11,97,175,.2)}
.hizmet-ozetleri{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:30px}.ozet-karti,.gosterge-karti,.hizmet-karti,.surec-karti,.iletisim-karti,.yan-bilgi-kutusu,.profil-karti{background:rgba(255,255,255,.84);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow)}.ozet-karti{padding:18px 16px;border-radius:18px;transition:.25s;min-height:126px}.ozet-karti:hover{transform:translateY(-5px);border-color:rgba(11,97,175,.26)}.ozet-karti strong{display:block;font-size:15px;color:var(--dark);line-height:1.25;margin-bottom:6px}.ozet-karti span{display:block;color:var(--muted);font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.performans-gorseli{position:relative;min-height:520px}.ana-gosterge-karti{position:absolute;right:0;left:40px;top:40px;padding:28px;border-radius:28px}.kart-ust-alan{display:flex;justify-content:space-between;gap:20px;align-items:center}.durum{background:#e9f7ef;color:#1d8b4f;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800}.ilerleme-listesi{margin:26px 0;display:grid;gap:16px}.ilerleme-satiri span{display:inline-block;margin-bottom:6px;font-size:14px;font-weight:700;color:var(--dark)}.doluluk-cubugu{height:12px;border-radius:999px;background:#ebf2f8;overflow:hidden}.doluluk-cubugu i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primary),#39b0ff)}.sonuc-izgarasi{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.sonuc-izgarasi div{padding:18px;border-radius:18px;background:#f7fbff;border:1px solid var(--border)}.sonuc-izgarasi small{display:block;color:var(--muted);font-size:13px;margin-bottom:6px}.sonuc-izgarasi strong{color:var(--dark);font-size:18px}.hareketli-bilgi-karti{position:absolute;display:flex;align-items:center;gap:14px;max-width:260px;padding:16px 18px;border-radius:18px;background:rgba(18,24,33,.92);color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.25);animation:floatCard 4s ease-in-out infinite}.hareketli-bilgi-karti i{font-size:22px;color:#7bc8ff}.hareketli-bilgi-karti strong{display:block;font-size:14px;line-height:1.2}.hareketli-bilgi-karti span{display:block;opacity:.8;font-size:12px;line-height:1.45}.google-karti{left:0;bottom:95px}.meta-karti{right:0;bottom:0;animation-delay:1.2s}
.section{padding:92px 0}.bolum-basligi{max-width:780px;margin:0 auto 36px}.bolum-basligi.center{text-align:center}.bolum-basligi h2,.hakkimda-icerik h2{font-size:clamp(34px,4vw,58px);margin-top:16px}.bolum-basligi p,.hakkimda-icerik p{margin-top:12px;color:var(--muted);font-size:17px}.hakkimda-yerlesim{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:center}.genis-hakkimda{max-width:1040px}.kompakt-profil{display:grid;grid-template-columns:160px 1fr;align-items:center;padding:18px;gap:18px;border-radius:26px;overflow:hidden}.profil-gorseli{height:160px;border-radius:22px;background:linear-gradient(135deg,rgba(11,97,175,.08),#fff);padding:10px;overflow:hidden}.profil-gorseli img{width:100%;height:100%;object-fit:cover;border-radius:18px;object-position:center top}.profil-etiketi{display:inline-flex;margin-bottom:8px;padding:7px 10px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:12px;font-weight:900}.profil-bilgisi h3{color:var(--dark);font-size:22px;margin-bottom:8px}.profil-bilgisi p{color:var(--muted);font-size:14px;line-height:1.55}.uzmanlik-etiketleri{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.uzmanlik-etiketleri span{padding:8px 12px;border-radius:999px;background:#f3f9ff;border:1px solid var(--border);font-size:12px;font-weight:800;color:var(--primary)}.hakkimda-icerik{padding:10px 0}.tikli-liste{display:grid;gap:12px;margin-top:18px}.tikli-liste li{position:relative;padding-left:28px;color:var(--text);font-weight:600}.tikli-liste li:before{content:"✔";position:absolute;left:0;top:0;color:var(--primary);font-weight:900}
.kart-izgarasi{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.hizmet-karti{position:relative;overflow:hidden;padding:28px;border-radius:24px;transition:.3s}.hizmet-karti:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--primary),var(--primary-bright));opacity:0;transition:.3s;z-index:-1}.hizmet-karti:hover{transform:translateY(-8px);box-shadow:0 24px 70px rgba(11,97,175,.22);border-color:rgba(11,97,175,.28);color:#fff}.hizmet-karti:hover:before{opacity:1}.hizmet-karti:hover h3,.hizmet-karti:hover p,.hizmet-karti:hover li{color:#fff}.hizmet-karti:hover .ikon-kutusu{background:#fff;color:var(--primary)}.ikon-kutusu{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(11,97,175,.12),rgba(18,148,215,.18));color:var(--primary);font-size:26px;margin-bottom:20px;transition:.3s}.hizmet-karti h3{font-size:20px;line-height:1.3;color:var(--dark);margin-bottom:12px}.hizmet-karti p{color:var(--muted);margin-bottom:16px}.hizmet-karti ul{display:grid;gap:10px}.hizmet-karti li{position:relative;padding-left:20px;color:var(--text);font-size:14px}.hizmet-karti li:before{content:"•";position:absolute;left:0;color:currentColor;font-size:20px;line-height:1}
.surec-izgarasi{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.surec-karti{position:relative;padding:28px 24px;border-radius:24px}.ok-akisi .surec-karti:not(:last-child):after{content:"→";position:absolute;right:-28px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--primary);color:#fff;font-weight:900;box-shadow:0 10px 25px rgba(11,97,175,.25);z-index:2}.surec-karti span{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:var(--primary-soft);color:var(--primary);font-weight:900;margin-bottom:16px}.surec-karti h3{margin-bottom:8px;color:var(--dark)}.surec-karti p{color:var(--muted)}
.logo-kayan-alan{position:relative;overflow:hidden;padding:24px 0;border-radius:28px;background:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow)}.logo-kayan-alan:before,.logo-kayan-alan:after{content:"";position:absolute;top:0;width:110px;height:100%;z-index:2;pointer-events:none}.logo-kayan-alan:before{left:0;background:linear-gradient(90deg,#f5f8fc,rgba(245,248,252,0))}.logo-kayan-alan:after{right:0;background:linear-gradient(270deg,#f5f8fc,rgba(245,248,252,0))}.logo-seridi{display:flex;align-items:center;gap:20px;width:max-content;animation:logoScroll 26s linear infinite;will-change:transform;white-space:nowrap}.logo-kayan-alan:hover .logo-seridi{animation-play-state:paused}.logo-kutusu{width:160px;height:84px;flex:0 0 auto;display:grid;place-items:center;border-radius:18px;background:#fff;border:1px solid var(--border);box-shadow:0 12px 28px rgba(9,20,34,.06);transition:.28s}.logo-kutusu img{max-width:96px;max-height:42px;filter:grayscale(1) opacity(.42);transition:.28s}.logo-kutusu:hover{transform:translateY(-4px);border-color:rgba(11,97,175,.28);box-shadow:0 18px 42px rgba(11,97,175,.1)}.logo-kutusu:hover img{filter:grayscale(1) opacity(.82)}
.iletisim-yerlesim{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}.iletisim-karti,.yan-bilgi-kutusu{padding:32px;border-radius:26px}.iletisim-karti h2{margin:16px 0 10px;font-size:clamp(34px,4vw,54px)}.iletisim-karti p{color:var(--muted)}.iletisim-listesi{display:grid;gap:14px;margin-top:26px}.iletisim-listesi a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:#f7fbff;border:1px solid var(--border);font-weight:700}.iletisim-listesi a i{color:var(--primary)}.kompakt li{font-size:15px}
.footer{position:relative;padding:42px 0;background:linear-gradient(135deg,#0a57a3 0%,#138fd1 100%);overflow:hidden}.alt-bilgi-desen{position:absolute;inset:0;background:url("images/fa-pattern.svg") center/360px repeat;opacity:.06;filter:brightness(10)}.alt-bilgi-satiri{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;color:rgba(255,255,255,.9);font-size:14px;position:relative;z-index:2}.alt-bilgi-marka{display:flex;flex-direction:column;gap:14px;max-width:420px}.alt-bilgi-logo{width:170px;height:auto}.footer a{font-weight:800;color:#fff;border:1px solid rgba(255,255,255,.22);padding:14px 18px;border-radius:14px;background:rgba(255,255,255,.08)}.footer a:hover{background:#fff;color:var(--primary)}
.animasyon-giris{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s ease}.animasyon-giris.gorundu{opacity:1;transform:translateY(0)}.gecikme-1{transition-delay:.1s}.gecikme-2{transition-delay:.2s}.gecikme-3{transition-delay:.3s}@keyframes logoScroll{from{transform:translateX(0)}to{transform:translateX(calc(-1 * (160px + 20px) * 6))}}@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media(max-width:1100px){.giris-yerlesim,.hakkimda-yerlesim,.iletisim-yerlesim{grid-template-columns:1fr}.performans-gorseli{min-height:560px}.kart-izgarasi{grid-template-columns:repeat(2,1fr)}.surec-izgarasi{grid-template-columns:repeat(2,1fr)}.ok-akisi .surec-karti:not(:last-child):after{display:none}.hizmet-ozetleri{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.mobil-menu-buton{display:block}.nav{position:absolute;top:calc(100% + 8px);left:20px;right:20px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.85);border-radius:20px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start;padding:20px;gap:16px;opacity:0;pointer-events:none;transform:translateY(-10px);transition:.28s}.nav.active{opacity:1;pointer-events:auto;transform:translateY(0)}.hero{padding-top:40px}.ana-gosterge-karti{position:relative;left:0;top:0}.performans-gorseli{min-height:auto;display:grid;gap:16px}.hareketli-bilgi-karti{position:relative;left:auto;right:auto;bottom:auto;max-width:none;animation:none}.alt-bilgi-satiri{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){.container{width:min(var(--container),calc(100% - 24px))}.marka-gorseli{height:48px}.section,.hero{padding:72px 0}.hero h1{font-size:clamp(42px,14vw,74px)}.hero p,.bolum-basligi p,.hakkimda-icerik p{font-size:16px}.kart-izgarasi,.surec-izgarasi,.sonuc-izgarasi,.hizmet-ozetleri{grid-template-columns:1fr}.hizmet-karti,.surec-karti,.iletisim-karti,.yan-bilgi-kutusu,.ana-gosterge-karti{padding:22px;border-radius:20px}.giris-butonlari{flex-direction:column}.buton,.ozet-karti{width:100%}.kompakt-profil{grid-template-columns:1fr;text-align:left}.profil-gorseli{width:150px;height:150px}.logo-kutusu{width:136px;height:72px}.logo-kutusu img{max-width:84px;max-height:38px}@keyframes logoScroll{from{transform:translateX(0)}to{transform:translateX(calc(-1 * (136px + 20px) * 6))}}}


/* v6.1 - sade arka plan efekti */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 18%, rgba(18,148,215,.075), transparent 32%),
    radial-gradient(circle at 82% 28%, rgba(11,97,175,.06), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,0) 0%, rgba(11,97,175,.025) 48%, rgba(255,255,255,0) 100%);
}
.site-arka-plan::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    repeating-linear-gradient(135deg, rgba(11,97,175,.035) 0 1px, transparent 1px 32px);
  opacity:.18;
  transform:rotate(-2deg);
  mask-image:radial-gradient(circle at center, rgba(0,0,0,.52), transparent 78%);
}
main,.header,.footer{position:relative}


/* v6.2 controlled additions from v7 */
.metric-icons{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:720px;
}
.metric-icons .ozet-karti{
  min-height:116px;
  padding:18px;
}
.metric-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.metric-head i{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(11,97,175,.12),rgba(18,148,215,.18));
  color:var(--primary);
  font-size:15px;
  flex:0 0 auto;
}
.metric-head strong{
  margin:0;
}
.metric-icons .ozet-karti span{
  line-height:1.55;
}

.premium-profile{
  position:relative;
  display:grid;
  grid-template-columns:190px 1fr;
  align-items:center;
  gap:24px;
  padding:24px;
  border-radius:30px;
  overflow:hidden;
}
.premium-profile::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 18% 18%, rgba(18,148,215,.12), transparent 38%), linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.76));
  z-index:-1;
}
.profile-visual{
  position:relative;
  padding:10px;
  border-radius:28px;
  background:linear-gradient(135deg,rgba(11,97,175,.11),rgba(18,148,215,.07));
}
.premium-profile .profil-gorseli{
  height:215px;
  width:100%;
  border-radius:22px;
  padding:0;
  background:#eef5fb;
}
.premium-profile .profil-gorseli img{
  border-radius:22px;
  object-fit:cover;
  object-position:center top;
}
.premium-profile .profil-bilgisi p{
  font-size:15px;
  line-height:1.7;
  max-width:380px;
}
.premium-profile .profil-bilgisi h3{
  font-size:28px;
  margin-bottom:10px;
}
.premium-profile .uzmanlik-etiketleri{
  margin-top:16px;
}

.enhanced-sidebox{
  overflow:hidden;
}
.side-badges{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid var(--border);
}
.side-badges span{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(11,97,175,.07),rgba(18,148,215,.05));
  border:1px solid rgba(11,97,175,.12);
  color:var(--dark);
  font-weight:800;
  font-size:13px;
}
.side-badges i{
  color:var(--primary);
}

.footer.v7-footer{
  position:relative;
  padding:54px 0 26px;
  background:linear-gradient(135deg,#0a57a3 0%,#138fd1 100%);
  overflow:hidden;
}
.footer.v7-footer .footer-glow{
  position:absolute;
  inset:auto auto -120px -120px;
  width:340px;
  height:340px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.18),rgba(255,255,255,0) 70%);
  pointer-events:none;
}
.footer.v7-footer .footer-watermark{
  position:absolute;
  right:4%;
  top:50%;
  transform:translateY(-50%);
  opacity:.055;
  pointer-events:none;
}
.footer.v7-footer .footer-watermark img{
  width:360px;
  height:auto;
}
.footer-main{
  display:grid;
  grid-template-columns:1.3fr .7fr .7fr;
  gap:32px;
  align-items:start;
  color:#fff;
}
.footer.v7-footer .alt-bilgi-marka{
  display:flex;
  flex-direction:column;
  gap:16px;
  max-width:470px;
}
.footer.v7-footer .alt-bilgi-marka p{
  color:rgba(255,255,255,.84);
}
.footer.v7-footer .alt-bilgi-logo{
  width:180px;
  height:auto;
}
.footer-links-block h4{
  font-size:16px;
  font-weight:800;
  margin-bottom:14px;
  color:#fff;
}
.footer-links{
  display:grid;
  gap:10px;
}
.footer-links a{
  color:rgba(255,255,255,.84);
  font-weight:600;
  transition:.2s;
}
.footer-links a:hover{
  color:#fff;
  transform:translateX(4px);
}
.footer-actions{
  display:flex;
  flex-direction:column;
  gap:14px;
  align-items:flex-start;
}
.footer-cta,.footer-top{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.24);
  color:#fff;
  background:rgba(255,255,255,.08);
  font-weight:800;
  transition:.25s;
}
.footer-cta:hover,.footer-top:hover{
  background:#fff;
  color:var(--primary);
}
.footer-bottom{
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.82);
  font-size:14px;
}

@media(max-width:1100px){
  .premium-profile{grid-template-columns:180px 1fr;}
  .footer-main{grid-template-columns:1fr;}
  .footer.v7-footer .footer-watermark{right:-40px;top:auto;bottom:-30px;transform:none;}
}
@media(max-width:820px){
  .premium-profile{grid-template-columns:1fr;}
  .premium-profile .profil-gorseli{width:190px;height:190px;}
  .footer.v7-footer .footer-watermark{display:none;}
}
@media(max-width:640px){
  .metric-icons{grid-template-columns:1fr;}
  .premium-profile{padding:22px;}
}



/* === v7 controlled refinements from v6.2 base === */

/* Metric cards: icon style without global scale changes */
.ozet-karti-v7 {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ozet-basligi {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 7px;
}
.ozet-basligi i {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0,119,200,.12), rgba(20,147,229,.16));
  color: var(--primary);
  font-size: 15px;
}
.ozet-karti-v7 span {
  line-height: 1.45;
}

/* Floating cards: better placement only */
.performans-gorseli .hareketli-bilgi-karti {
  z-index: 5;
}
.performans-gorseli .google-karti {
  left: -6px;
  bottom: 118px;
}
.performans-gorseli .meta-karti {
  right: -4px;
  bottom: 24px;
}

/* Profile card: cleaner, not smaller */
.profil-karti-v7 {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(0,119,200,.12);
}
.profil-karti-v7::after {
  content: "";
  position: absolute;
  right: -70px;
  top: -80px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,119,200,.16), rgba(0,119,200,0) 70%);
  pointer-events: none;
}
.profil-gorseli-v7,
.profil-bilgisi-v7 {
  position: relative;
  z-index: 1;
}
.profil-bilgisi-v7 h3 {
  white-space: nowrap;
}
.profil-karti-v7 .uzmanlik-etiketleri {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profil-karti-v7 .uzmanlik-etiketleri span {
  text-align: center;
}

/* References: stronger grey visibility */
.logo-kutusu img {
  filter: grayscale(1) opacity(.60);
}
.logo-kutusu:hover img {
  filter: grayscale(1) opacity(.92);
}
.logo-kutusu:hover {
  border-color: rgba(0,119,200,.26);
}

/* Sidebox mini cards */
.yan-mini-kartlar {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(0,119,200,.12);
}
.yan-mini-kartlar span {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(0,119,200,.08), rgba(20,147,229,.04));
  border: 1px solid rgba(0,119,200,.12);
  color: var(--dark);
  font-size: 14px;
  font-weight: 800;
}
.yan-mini-kartlar i {
  color: var(--primary);
  width: 18px;
}

/* Footer alignment: keep v6.2 height feel */
.footer-v7 {
  position: relative;
}
.alt-bilgi-satiri-v7 {
  align-items: flex-start;
  display: grid;
  grid-template-columns: 1.35fr .7fr .55fr;
  gap: 34px;
}
.alt-bilgi-marka p {
  color: rgba(255,255,255,.86);
  max-width: 460px;
  line-height: 1.65;
  margin-top: 8px;
}
.alt-bilgi-menu h4 {
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  margin-bottom: 12px;
}
.alt-bilgi-menu nav {
  display: grid;
  gap: 9px;
}
.alt-bilgi-menu a {
  color: rgba(255,255,255,.86);
  font-weight: 700;
  transition: .22s ease;
}
.alt-bilgi-menu a:hover {
  color: #fff;
  transform: translateX(4px);
}
.alt-bilgi-butonlar {
  display: grid;
  gap: 12px;
  justify-items: stretch;
}
.alt-bilgi-buton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 130px;
  padding: 13px 17px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.24);
  font-weight: 900;
  transition: .24s ease;
}
.alt-bilgi-birincil-buton,
.alt-bilgi-acik-buton {
  color: #fff;
  background: rgba(255,255,255,.08);
}
.alt-bilgi-buton:hover {
  background: #fff;
  color: var(--primary);
}

@media (max-width: 1100px) {
  .alt-bilgi-satiri-v7 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 820px) {
  .performans-gorseli .google-karti,
  .performans-gorseli .meta-karti {
    left: auto;
    right: auto;
    bottom: auto;
  }
}
@media (max-width: 640px) {
  .profil-bilgisi-v7 h3 {
    white-space: normal;
  }
  .profil-karti-v7 .uzmanlik-etiketleri {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}



/* === v8 desktop layout scale adjustment ===
   Desktop container width increased by 25% from 1180px to 1475px.
   Mobile/tablet behavior is preserved through existing responsive rules. */
@media (min-width: 1200px) {
  :root {
    --container: 1475px;
  }

  .giris-yerlesim {
    gap: 58px;
  }

  .bolum-basligi {
    max-width: 920px;
  }

  .hakkimda-yerlesim.genis-hakkimda,
  .genis-hakkimda {
    max-width: 1260px;
  }
}

@media (min-width: 1500px) {
  .container {
    width: min(var(--container), calc(100% - 72px));
  }
}



/* === v8.1 menu/anchor behavior fix === */
.header {
  z-index: 9999;
}

section[id] {
  scroll-margin-top: 120px;
}



/* === v9 düzenlemeleri: üst menü, logo, üçüncü floating card ve Türkçe yapı === */

/* Üst menü: logo ve yazılar bir tık büyütüldü */
.header .marka-gorseli {
  height: 66px;
}

.header .nav a {
  font-size: 15.5px;
}

/* Dashboard alanındaki üçüncü hareketli kart */
.performans-gorseli .yazilim-karti {
  top: 60px;
  right: 132px;
  bottom: auto;
  max-width: 260px;
  animation-delay: .65s;
  background: rgba(18, 24, 33, .90);
}

.performans-gorseli .yazilim-karti i {
  color: #7bc8ff;
}

/* Üç floating kart birlikte daha dengeli çalışsın */
.performans-gorseli .hareketli-bilgi-karti {
  backdrop-filter: blur(10px);
}

@media (max-width: 1100px) {
  .header .marka-gorseli {
    height: 58px;
  }

  .header .nav a {
    font-size: 14px;
  }

  .performans-gorseli .yazilim-karti {
    right: 80px;
  }
}

@media (max-width: 820px) {
  .performans-gorseli .yazilim-karti {
    top: auto;
    right: auto;
  }
}



/* === v11 iyileştirmeleri === */

/* 1) Logo yaklaşık 10px büyütüldü */
.marka-gorseli {
  height: 76px;
}

@media (max-width: 1100px) {
  .marka-gorseli {
    height: 68px;
  }
}

@media (max-width: 640px) {
  .marka-gorseli {
    height: 58px;
  }
}

/* 2) Özet kartı açıklamaları büyüyen yerleşime göre daha dolu ve okunaklı */
.ozet-karti-v7 span,
.ozet-karti span {
  line-height: 1.58;
}

.ozet-karti-v7 {
  justify-content: flex-start;
}

/* 3) İlerleme satırlarına dinamik nitro efekti */
.nitro-cubuk {
  position: relative;
  overflow: hidden;
  background: rgba(11, 97, 175, .08);
}

.nitro-cubuk::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.55) 18%,
    transparent 36%,
    transparent 100%
  );
  transform: translateX(-120%);
  animation: nitro-parlama 2.35s ease-in-out infinite;
  z-index: 2;
  pointer-events: none;
}

.nitro-cubuk i {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, #0b61af 0%, #1294d7 45%, #39b0ff 70%, #0b61af 100%);
  background-size: 220% 100%;
  animation:
    nitro-akis 2.8s linear infinite,
    nitro-nefes 1.9s ease-in-out infinite;
  box-shadow: 0 0 16px rgba(18,148,215,.22);
}

.nitro-cubuk i::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      115deg,
      rgba(255,255,255,.00) 0,
      rgba(255,255,255,.00) 9px,
      rgba(255,255,255,.28) 10px,
      rgba(255,255,255,.28) 14px
    );
  opacity: .34;
  animation: nitro-cizgi 1.15s linear infinite;
}

@keyframes nitro-akis {
  0% { background-position: 0% 50%; }
  100% { background-position: -220% 50%; }
}

@keyframes nitro-nefes {
  0%, 100% { filter: saturate(1) brightness(1); }
  50% { filter: saturate(1.22) brightness(1.12); }
}

@keyframes nitro-cizgi {
  0% { transform: translateX(-22px); }
  100% { transform: translateX(22px); }
}

@keyframes nitro-parlama {
  0% { transform: translateX(-130%); opacity: 0; }
  24% { opacity: .65; }
  55% { transform: translateX(130%); opacity: 0; }
  100% { transform: translateX(130%); opacity: 0; }
}

/* Hareket hassasiyeti olan kullanıcılar için animasyonu azalt */
@media (prefers-reduced-motion: reduce) {
  .nitro-cubuk::before,
  .nitro-cubuk i,
  .nitro-cubuk i::after {
    animation: none;
  }
}



/* === v12 düzeltmeleri === */

/* 1) Üst menü sayfa ile birlikte sabit aksın */
.header {
  position: sticky !important;
  top: 0 !important;
  z-index: 99999 !important;
}

/* Türkçe class yapısı için üst menü güvenli sticky düzeltmesi */
header.header,
#top.header {
  position: sticky !important;
  top: 0 !important;
  z-index: 99999 !important;
}

/* 2) Referans logoları sonsuz ve pürüzsüz kayan döngü */
.logo-kayan-alan {
  overflow: hidden;
}

.logo-seridi {
  display: flex;
  align-items: center;
  width: max-content;
  animation: referans-sonsuz-kayma 24s linear infinite !important;
  will-change: transform;
}

.logo-kayan-alan:hover .logo-seridi {
  animation-play-state: paused !important;
}

@keyframes referans-sonsuz-kayma {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-1 * (160px + 20px) * 6));
  }
}

@media (max-width: 640px) {
  @keyframes referans-sonsuz-kayma {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(-1 * (136px + 20px) * 6));
    }
  }
}

/* 3) Süreç kartları arasındaki oklar animasyonlu hale getirildi */
.ok-akisi .surec-karti:not(:last-child)::after {
  animation: surec-ok-hareketi 1.45s ease-in-out infinite;
}

@keyframes surec-ok-hareketi {
  0%, 100% {
    transform: translateY(-50%) translateX(0) scale(1);
    box-shadow: 0 10px 25px rgba(11,97,175,.22);
  }
  50% {
    transform: translateY(-50%) translateX(6px) scale(1.08);
    box-shadow: 0 14px 32px rgba(11,97,175,.36);
  }
}

/* 4) Footer menü hover: zemin beyaz olunca yazı maviye dönsün */
.alt-bilgi-menu a:hover {
  color: var(--primary) !important;
}

/* Footer butonları ve menü linkleri için güvenli hover */
.alt-bilgi-menu a:hover,
.footer-menu a:hover {
  color: var(--primary) !important;
}

/* Hızlı menü linkleri kutulu yapıdaysa hover okunurluğunu koru */
.alt-bilgi-menu a:hover {
  background: #fff;
  border-color: rgba(255,255,255,.75);
}

/* Hareket hassasiyeti olan kullanıcılar için */
@media (prefers-reduced-motion: reduce) {
  .logo-seridi,
  .ok-akisi .surec-karti:not(:last-child)::after {
    animation: none !important;
  }
}



/* === v13 profil kartı sosyal medya bağlantıları === */

.sosyal-medya-butonlari {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.sosyal-medya-butonlari a {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(0,119,200,.09), rgba(20,147,229,.04));
  border: 1px solid rgba(0,119,200,.15);
  color: var(--primary);
  font-size: 16px;
  transition: transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease;
}

.sosyal-medya-butonlari a:hover {
  transform: translateY(-3px);
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%);
  color: #fff;
  box-shadow: 0 14px 28px rgba(0,119,200,.20);
}

@media (max-width: 640px) {
  .sosyal-medya-butonlari {
    margin-top: 14px;
  }

  .sosyal-medya-butonlari a {
    width: 36px;
    height: 36px;
    border-radius: 12px;
  }
}



/* === v14 düzenlemeleri === */

/* 1) Üst menü sabit kalırken yumuşak geçiş efekti */
.header {
  transition: background .28s ease, box-shadow .28s ease, padding .28s ease, border-color .28s ease;
}

.header.menu-kaydirildi {
  background: rgba(245,248,252,.94);
  box-shadow: 0 14px 34px rgba(11, 23, 42, .08);
  border-bottom-color: rgba(11,97,175,.12);
}

.header.menu-kaydirildi .marka-gorseli {
  transform: scale(.94);
}

.marka-gorseli {
  transition: transform .28s ease, height .28s ease;
}

/* 2) Profil kartı sosyal medya butonları ortalandı */
.sosyal-medya-butonlari {
  justify-content: center;
}

/* 3) Profil kartı uzmanlık etiketlerine sosyal buton benzeri hover efekti */
.uzmanlik-etiketleri span {
  transition: transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.uzmanlik-etiketleri span:hover {
  transform: translateY(-3px);
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 14px 28px rgba(0,119,200,.18);
}

/* 4) Süreç okları hareket edip kart altına girmesin, nabız/parlama efekti versin */
.ok-akisi .surec-karti:not(:last-child)::after {
  animation: surec-ok-nabiz 1.55s ease-in-out infinite !important;
}

@keyframes surec-ok-nabiz {
  0%, 100% {
    transform: translateY(-50%) scale(1);
    box-shadow: 0 10px 25px rgba(11,97,175,.22), 0 0 0 0 rgba(11,97,175,.20);
    opacity: 1;
  }
  50% {
    transform: translateY(-50%) scale(1.08);
    box-shadow: 0 14px 30px rgba(11,97,175,.34), 0 0 0 8px rgba(11,97,175,.08);
    opacity: .96;
  }
}

/* 5) Referans logoları: beyaz boşluk bırakmadan sonsuz döngü */
.logo-kayan-alan {
  overflow: hidden;
}

.logo-seridi {
  display: flex;
  align-items: center;
  gap: 20px;
  width: max-content;
  animation: referans-kesintisiz-kayma 34s linear infinite !important;
  will-change: transform;
}

.logo-kayan-alan:hover .logo-seridi {
  animation-play-state: paused !important;
}

@keyframes referans-kesintisiz-kayma {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-1 * (160px + 20px) * 10));
  }
}

@media (max-width: 640px) {
  @keyframes referans-kesintisiz-kayma {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(-1 * (136px + 20px) * 10));
    }
  }
}

/* v12'deki eski referans animasyonunu etkisiz bırakmak için aynı elemente yeni animasyon verildi. */

/* Hareket hassasiyeti olan kullanıcılar için */
@media (prefers-reduced-motion: reduce) {
  .logo-seridi,
  .ok-akisi .surec-karti:not(:last-child)::after {
    animation: none !important;
  }
}



/* === v15 footer hızlı menü hover düzeltmesi === */

/* Footer hızlı menü linkleri hover durumunda beyaz zemin + mavi yazı ile okunur kalır */
.alt-bilgi-menu a:hover,
.footer-menu a:hover,
.footer-links a:hover {
  background: #ffffff !important;
  color: var(--primary) !important;
  border-color: rgba(255,255,255,.85) !important;
}

/* Footer içinde ikon varsa hover durumunda ikon da mavi kalsın */
.alt-bilgi-menu a:hover i,
.footer-menu a:hover i,
.footer-links a:hover i {
  color: var(--primary) !important;
}

/* Linklerin normal görünümü okunur ve kontrollü olsun */
.alt-bilgi-menu a,
.footer-menu a,
.footer-links a {
  transition: background .24s ease, color .24s ease, border-color .24s ease, transform .24s ease;
}



/* === v16 footer iletişim formu ve logo düzenlemesi === */

/* Footer logosu daha görünür hale getirildi */
.alt-bilgi-logo,
.footer-logo {
  width: 220px !important;
  max-width: 100%;
}

/* Footer sağ alanında yeni hızlı talep formu */
.alt-bilgi-form-alani {
  width: 100%;
  max-width: 440px;
}

.alt-bilgi-formu {
  display: grid;
  gap: 11px;
  padding: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 18px 44px rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
}

.alt-bilgi-formu h4 {
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  margin-bottom: 2px;
}

.alt-bilgi-formu label {
  display: grid;
  gap: 5px;
}

.alt-bilgi-formu span {
  color: rgba(255,255,255,.86);
  font-size: 12px;
  font-weight: 800;
}

.alt-bilgi-formu input,
.alt-bilgi-formu select {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.12);
  color: #fff;
  outline: none;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.alt-bilgi-formu input::placeholder {
  color: rgba(255,255,255,.58);
}

.alt-bilgi-formu select {
  cursor: pointer;
}

.alt-bilgi-formu select option {
  color: #101827;
  background: #fff;
}

.alt-bilgi-formu input:focus,
.alt-bilgi-formu select:focus {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.55);
  box-shadow: 0 0 0 4px rgba(255,255,255,.10);
}

.alt-bilgi-formu button {
  height: 44px;
  border: 0;
  border-radius: 14px;
  margin-top: 4px;
  background: #fff;
  color: var(--primary);
  font-weight: 900;
  cursor: pointer;
  transition: transform .24s ease, box-shadow .24s ease, background .24s ease;
}

.alt-bilgi-formu button:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
}

@media (max-width: 1100px) {
  .alt-bilgi-form-alani {
    max-width: 100%;
  }

  .alt-bilgi-logo,
  .footer-logo {
    width: 190px !important;
  }
}

@media (max-width: 640px) {
  .alt-bilgi-formu {
    padding: 16px;
  }

  .alt-bilgi-formu input,
  .alt-bilgi-formu select {
    height: 40px;
  }
}



/* === v18 düzeltmeleri: görünürlük, üst menü efekti, footer formu, büyük logo kullanımı === */

/* Üst menü maviye daha yavaş ve efektli geçsin */
.header {
  transition:
    background .72s cubic-bezier(.22, 1, .36, 1),
    box-shadow .72s cubic-bezier(.22, 1, .36, 1),
    border-color .72s cubic-bezier(.22, 1, .36, 1),
    backdrop-filter .72s cubic-bezier(.22, 1, .36, 1) !important;
}

/* Logo alanı sabit kalsın, logo maviye geçince küçülmesin */
.marka-logo-alani {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 235px;
  height: 86px;
}

.marka-logo-alani .marka-gorseli {
  position: absolute;
  left: 0;
  top: 50%;
  height: 76px !important;
  width: auto;
  transform: translateY(-50%) scale(1) !important;
  transition:
    opacity .72s cubic-bezier(.22, 1, .36, 1),
    transform .72s cubic-bezier(.22, 1, .36, 1),
    filter .72s cubic-bezier(.22, 1, .36, 1) !important;
}

.logo-mavi {
  opacity: 1;
}

.logo-beyaz {
  opacity: 0;
}

/* Kaydırma sonrası üst menü footer rengine döner */
.header.menu-kaydirildi {
  background: linear-gradient(135deg, rgba(10,87,163,.96) 0%, rgba(19,143,209,.96) 100%) !important;
  border-bottom-color: rgba(255,255,255,.16) !important;
  box-shadow: 0 18px 42px rgba(11, 97, 175, .18) !important;
  backdrop-filter: blur(18px);
}

.header.menu-kaydirildi .logo-mavi {
  opacity: 0;
  transform: translateY(-50%) scale(1) !important;
}

.header.menu-kaydirildi .logo-beyaz {
  opacity: 1;
  transform: translateY(-50%) scale(1) !important;
}

.header.menu-kaydirildi .nav a,
.header.menu-kaydirildi .nav a:visited {
  color: #ffffff !important;
}

.header.menu-kaydirildi .nav a::after {
  background: #ffffff !important;
}

.header.menu-kaydirildi .mobil-menu-buton {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.20);
}

.header.menu-kaydirildi .mobil-menu-buton span {
  background: #ffffff;
}

/* Footer form doğru kolona otursun */
.alt-bilgi-form-alani {
  width: 100%;
  max-width: 460px;
  justify-self: stretch;
}

.alt-bilgi-formu {
  display: grid;
  gap: 11px;
  padding: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 18px 44px rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
}

.alt-bilgi-formu h4 {
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  margin-bottom: 2px;
}

.alt-bilgi-formu label {
  display: grid;
  gap: 5px;
}

.alt-bilgi-formu span {
  color: rgba(255,255,255,.86);
  font-size: 12px;
  font-weight: 800;
}

.alt-bilgi-formu input,
.alt-bilgi-formu select {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.12);
  color: #fff;
  outline: none;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.alt-bilgi-formu input::placeholder {
  color: rgba(255,255,255,.58);
}

.alt-bilgi-formu select option {
  color: #101827;
  background: #fff;
}

.alt-bilgi-formu input:focus,
.alt-bilgi-formu select:focus {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.55);
  box-shadow: 0 0 0 4px rgba(255,255,255,.10);
}

.alt-bilgi-formu button {
  height: 44px;
  border: 0;
  border-radius: 14px;
  margin-top: 4px;
  background: #fff;
  color: var(--primary);
  font-weight: 900;
  cursor: pointer;
  transition: transform .24s ease, box-shadow .24s ease, background .24s ease;
}

.alt-bilgi-formu button:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
}

/* Footer yerleşimi form ile dengeli olsun */
.alt-bilgi-satiri-v7,
.footer-wrap-v7,
.alt-bilgi-satiri {
  grid-template-columns: 1.05fr .62fr .92fr !important;
  align-items: start !important;
}

/* Footer logosu daha görünür */
.alt-bilgi-logo,
.footer-logo {
  width: 230px !important;
  max-width: 100%;
}

/* Sayfada kullanılan referans/faun logoları çok küçük kalmasın */
.logo-kutusu {
  width: 220px !important;
  height: 104px !important;
}

.logo-kutusu img {
  max-width: 150px !important;
  max-height: 70px !important;
}

/* Profil kartındaki sosyal ikonlar ve genel marka görünümü dengeli */
.sosyal-medya-butonlari {
  justify-content: center;
}

/* Mobil ve tablet güvenliği */
@media (max-width: 1100px) {
  .marka-logo-alani {
    width: 205px;
    height: 76px;
  }

  .marka-logo-alani .marka-gorseli {
    height: 68px !important;
  }

  .alt-bilgi-satiri-v7,
  .footer-wrap-v7,
  .alt-bilgi-satiri {
    grid-template-columns: 1fr !important;
  }

  .alt-bilgi-form-alani {
    max-width: 100%;
  }

  .alt-bilgi-logo,
  .footer-logo {
    width: 200px !important;
  }
}

@media (max-width: 640px) {
  .marka-logo-alani {
    width: 170px;
    height: 62px;
  }

  .marka-logo-alani .marka-gorseli {
    height: 58px !important;
  }

  .logo-kutusu {
    width: 160px !important;
    height: 82px !important;
  }

  .logo-kutusu img {
    max-width: 110px !important;
    max-height: 52px !important;
  }

  .alt-bilgi-formu {
    padding: 16px;
  }
}



/* === v19 footer hizalama + soft header geçişi + logo büyütme === */

/* Header geçişini daha soft hale getir */
.header {
  transition:
    background 1.15s cubic-bezier(.19, 1, .22, 1),
    box-shadow 1.15s cubic-bezier(.19, 1, .22, 1),
    border-color 1.15s cubic-bezier(.19, 1, .22, 1),
    backdrop-filter 1.15s cubic-bezier(.19, 1, .22, 1) !important;
}

.marka-logo-alani {
  width: 285px !important;
  height: 102px !important;
}

.marka-logo-alani .marka-gorseli,
.marka-gorseli {
  height: 92px !important;
  width: auto !important;
  transition:
    opacity 1.15s cubic-bezier(.19, 1, .22, 1),
    transform 1.15s cubic-bezier(.19, 1, .22, 1),
    filter 1.15s cubic-bezier(.19, 1, .22, 1) !important;
}

.header.menu-kaydirildi .logo-mavi {
  opacity: 0;
  transform: translateY(-50%) scale(1) !important;
}

.header.menu-kaydirildi .logo-beyaz {
  opacity: 1;
  transform: translateY(-50%) scale(1) !important;
}

/* Footer ana yerleşim: marka + hızlı menü + form aynı hizada */
.alt-bilgi-v19 {
  position: relative;
  padding: 74px 0 30px !important;
  background: linear-gradient(135deg, #0a57a3 0%, #138fd1 100%);
  overflow: hidden;
}

.alt-bilgi-satiri-v19 {
  display: grid !important;
  grid-template-columns: 1.08fr .72fr 1.12fr !important;
  gap: 46px !important;
  align-items: start !important;
  color: #fff;
  position: relative;
  z-index: 2;
}

.alt-bilgi-v19 .alt-bilgi-marka {
  display: flex;
  flex-direction: column;
  gap: 28px;
  max-width: 520px;
}

.alt-bilgi-v19 .alt-bilgi-logo {
  width: 280px !important;
  height: auto;
}

.alt-bilgi-v19 .alt-bilgi-marka p {
  color: rgba(255,255,255,.88);
  font-size: 16px;
  line-height: 1.72;
  max-width: 480px;
}

.alt-bilgi-v19 .alt-bilgi-menu h4 {
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  margin-bottom: 16px;
}

.alt-bilgi-v19 .alt-bilgi-menu nav {
  display: grid;
  gap: 12px;
}

.alt-bilgi-v19 .alt-bilgi-menu a {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 0 22px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  color: rgba(255,255,255,.94);
  font-size: 16px;
  font-weight: 850;
  transition: background .24s ease, color .24s ease, border-color .24s ease, transform .24s ease;
}

.alt-bilgi-v19 .alt-bilgi-menu a:hover {
  background: #ffffff !important;
  color: var(--primary) !important;
  border-color: rgba(255,255,255,.82) !important;
  transform: translateX(4px);
}

/* Footer formu kırmızıyla işaretlenen sağ alana oturtuldu */
.alt-bilgi-v19 .alt-bilgi-form-alani {
  width: 100%;
  max-width: none !important;
  justify-self: stretch;
}

.alt-bilgi-v19 .alt-bilgi-formu {
  width: 100%;
  display: grid;
  gap: 12px;
  padding: 22px;
  border-radius: 24px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow: 0 22px 52px rgba(0,0,0,.10);
  backdrop-filter: blur(12px);
}

.alt-bilgi-v19 .alt-bilgi-formu h4 {
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  margin-bottom: 4px;
}

.alt-bilgi-v19 .alt-bilgi-formu label {
  display: grid;
  gap: 6px;
}

.alt-bilgi-v19 .alt-bilgi-formu span {
  color: rgba(255,255,255,.90);
  font-size: 12px;
  font-weight: 850;
}

.alt-bilgi-v19 .alt-bilgi-formu input,
.alt-bilgi-v19 .alt-bilgi-formu select {
  width: 100%;
  height: 46px;
  padding: 0 15px;
  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.13);
  color: #fff;
  outline: none;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.alt-bilgi-v19 .alt-bilgi-formu input::placeholder {
  color: rgba(255,255,255,.62);
}

.alt-bilgi-v19 .alt-bilgi-formu select option {
  color: #101827;
  background: #fff;
}

.alt-bilgi-v19 .alt-bilgi-formu input:focus,
.alt-bilgi-v19 .alt-bilgi-formu select:focus {
  background: rgba(255,255,255,.19);
  border-color: rgba(255,255,255,.62);
  box-shadow: 0 0 0 4px rgba(255,255,255,.10);
}

.alt-bilgi-v19 .alt-bilgi-formu button {
  height: 48px;
  border: 0;
  border-radius: 15px;
  margin-top: 4px;
  background: #fff;
  color: var(--primary);
  font-size: 15px;
  font-weight: 900;
  cursor: pointer;
  transition: transform .24s ease, box-shadow .24s ease, background .24s ease;
}

.alt-bilgi-v19 .alt-bilgi-formu button:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.14);
  background: rgba(255,255,255,.92);
}

/* Alt satır: copyright + yukarı çık */
.alt-bilgi-alt-satir {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.86);
  font-size: 14px;
}

.alt-bilgi-yukari {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 14px;
  padding: 12px 16px;
  font-weight: 900;
  transition: background .24s ease, color .24s ease, transform .24s ease;
}

.alt-bilgi-yukari:hover {
  background: #fff;
  color: var(--primary);
  transform: translateY(-2px);
}

/* Sağdaki watermark form ile çakışmasın */
.alt-bilgi-v19 .footer-watermark {
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
  opacity: .045;
  pointer-events: none;
}

.alt-bilgi-v19 .footer-watermark img {
  width: 390px;
  height: auto;
}

/* Header mobil güvenliği */
@media (max-width: 1100px) {
  .marka-logo-alani {
    width: 235px !important;
    height: 86px !important;
  }

  .marka-logo-alani .marka-gorseli,
  .marka-gorseli {
    height: 76px !important;
  }

  .alt-bilgi-satiri-v19 {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }

  .alt-bilgi-v19 .alt-bilgi-logo {
    width: 230px !important;
  }

  .alt-bilgi-v19 .footer-watermark {
    display: none;
  }
}

@media (max-width: 640px) {
  .marka-logo-alani {
    width: 180px !important;
    height: 66px !important;
  }

  .marka-logo-alani .marka-gorseli,
  .marka-gorseli {
    height: 60px !important;
  }

  .alt-bilgi-v19 {
    padding: 54px 0 24px !important;
  }

  .alt-bilgi-alt-satir {
    flex-direction: column;
    align-items: flex-start;
  }

  .alt-bilgi-v19 .alt-bilgi-formu {
    padding: 18px;
  }
}



/* === v20 footer desen kaldırma + watermark büyütme + header arka plan geçiş efekti === */

/* Footer arkasındaki desen kaldırıldı */
.alt-bilgi-desen,
.footer-pattern,
.footer-v7 .alt-bilgi-desen,
.alt-bilgi-v19 .alt-bilgi-desen {
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}

/* Footer watermark kalsın ama daha büyük ve daha zarif olsun */
.alt-bilgi-v19 .footer-watermark {
  right: 2% !important;
  top: 50% !important;
  opacity: .038 !important;
}

.alt-bilgi-v19 .footer-watermark img {
  width: 780px !important;
  max-width: none !important;
}

/* Header arka plan geçişi: beyazdan maviye daha efektli geçiş */
.header {
  position: sticky !important;
  isolation: isolate;
  overflow: hidden;
  background: rgba(245,248,252,.88) !important;
  transition:
    box-shadow 1.25s cubic-bezier(.19, 1, .22, 1),
    border-color 1.25s cubic-bezier(.19, 1, .22, 1),
    backdrop-filter 1.25s cubic-bezier(.19, 1, .22, 1) !important;
}

/* Gradient doğrudan background olarak değil, opaklığı animasyonlu katman olarak çalışır */
.header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 18% 50%, rgba(255,255,255,.18), transparent 34%),
    linear-gradient(135deg, rgba(10,87,163,.98) 0%, rgba(19,143,209,.98) 100%);
  opacity: 0;
  transform: translateY(-8px);
  transition:
    opacity 1.25s cubic-bezier(.19, 1, .22, 1),
    transform 1.25s cubic-bezier(.19, 1, .22, 1);
  pointer-events: none;
}

.header.menu-kaydirildi {
  background: rgba(245,248,252,.04) !important;
}

.header.menu-kaydirildi::before {
  opacity: 1;
  transform: translateY(0);
}

/* Logo geçişi arka plan geçişiyle aynı hızda çalışsın */
.logo-mavi,
.logo-beyaz,
.marka-logo-alani .marka-gorseli {
  transition:
    opacity 1.25s cubic-bezier(.19, 1, .22, 1),
    transform 1.25s cubic-bezier(.19, 1, .22, 1),
    filter 1.25s cubic-bezier(.19, 1, .22, 1) !important;
}

/* Header'daki logo görünür boyutu 2x hissine yakın büyütüldü */
.marka-logo-alani {
  width: 330px !important;
  height: 112px !important;
}

.marka-logo-alani .marka-gorseli,
.marka-gorseli {
  height: 104px !important;
  width: auto !important;
}

/* Beyaz logo kaydırmada küçülmesin */
.header.menu-kaydirildi .logo-beyaz {
  opacity: 1 !important;
  transform: translateY(-50%) scale(1) !important;
}

.header.menu-kaydirildi .logo-mavi {
  opacity: 0 !important;
  transform: translateY(-50%) scale(1) !important;
}

/* Footer içindeki ana beyaz logo da daha güçlü görünsün */
.alt-bilgi-v19 .alt-bilgi-logo,
.alt-bilgi-logo,
.footer-logo {
  width: 300px !important;
  max-width: 100%;
}

/* Mobil/tablet güvenliği */
@media (max-width: 1100px) {
  .marka-logo-alani {
    width: 250px !important;
    height: 88px !important;
  }

  .marka-logo-alani .marka-gorseli,
  .marka-gorseli {
    height: 78px !important;
  }

  .alt-bilgi-v19 .footer-watermark img {
    width: 520px !important;
  }

  .alt-bilgi-v19 .alt-bilgi-logo,
  .alt-bilgi-logo,
  .footer-logo {
    width: 230px !important;
  }
}

@media (max-width: 640px) {
  .marka-logo-alani {
    width: 185px !important;
    height: 68px !important;
  }

  .marka-logo-alani .marka-gorseli,
  .marka-gorseli {
    height: 60px !important;
  }

  .alt-bilgi-v19 .footer-watermark {
    display: none;
  }
}



/* === v21 footer watermark + logo eşitleme + hızlı menü sosyal linkleri === */

/* Beyaz logo kırpıldığı için mavi logoyla aynı görsel ölçüde net görünür */
.marka-logo-alani .logo-beyaz,
.header .logo-beyaz {
  height: 104px !important;
  width: auto !important;
  max-width: none !important;
}

.marka-logo-alani .logo-mavi,
.header .logo-mavi {
  height: 104px !important;
  width: auto !important;
  max-width: none !important;
}

/* Footer içindeki beyaz logo daha net ve dengeli */
.alt-bilgi-v19 .alt-bilgi-logo,
.alt-bilgi-logo,
.footer-logo {
  width: 300px !important;
  height: auto !important;
}

/* Footer watermark tam ortaya büyük filigran gibi yerleştirildi */
.alt-bilgi-v19 .footer-watermark,
.footer-watermark {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  opacity: .032 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.alt-bilgi-v19 .footer-watermark img,
.footer-watermark img {
  width: 980px !important;
  max-width: none !important;
  height: auto !important;
}

/* Footer içerikleri watermark üstünde kalsın */
.alt-bilgi-v19 .container,
.footer .container {
  position: relative;
  z-index: 2;
}

/* Footer hızlı menü 6 satır olduğu için form yüksekliğiyle daha dengeli görünür */
.alt-bilgi-v19 .alt-bilgi-menu nav {
  gap: 10px;
}

.alt-bilgi-v19 .alt-bilgi-menu a {
  min-height: 50px;
}

/* Sosyal bağlantılar hızlı menü formatında ama hafif ikon hissiyle */
.alt-bilgi-sosyal-linkedin::before {
  content: "in";
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.13);
  color: inherit;
  font-weight: 900;
  font-size: 13px;
}

.alt-bilgi-sosyal-instagram::before {
  content: "◎";
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.13);
  color: inherit;
  font-weight: 900;
  font-size: 15px;
}

.alt-bilgi-v19 .alt-bilgi-menu a:hover::before {
  background: rgba(0,119,200,.10);
  color: var(--primary);
}

/* Mobil/tablet güvenliği */
@media (max-width: 1100px) {
  .marka-logo-alani .logo-beyaz,
  .header .logo-beyaz,
  .marka-logo-alani .logo-mavi,
  .header .logo-mavi {
    height: 78px !important;
  }

  .alt-bilgi-v19 .footer-watermark img,
  .footer-watermark img {
    width: 620px !important;
  }

  .alt-bilgi-v19 .alt-bilgi-logo,
  .alt-bilgi-logo,
  .footer-logo {
    width: 240px !important;
  }
}

@media (max-width: 640px) {
  .marka-logo-alani .logo-beyaz,
  .header .logo-beyaz,
  .marka-logo-alani .logo-mavi,
  .header .logo-mavi {
    height: 60px !important;
  }

  .alt-bilgi-v19 .footer-watermark,
  .footer-watermark {
    display: none !important;
  }
}



/* === v22 footer sosyal ikonları + header logo eşitleme === */

/* Header'da mavi ve beyaz logo aynı görünür kutuya otursun */
.marka-logo-alani {
  width: 260px !important;
  height: 112px !important;
}

.marka-logo-alani .logo-mavi,
.marka-logo-alani .logo-beyaz,
.header .logo-mavi,
.header .logo-beyaz {
  height: 104px !important;
  width: auto !important;
  max-width: 260px !important;
  object-fit: contain !important;
  transform: translateY(-50%) scale(1) !important;
  transform-origin: left center !important;
}

.header.menu-kaydirildi .logo-mavi,
.header.menu-kaydirildi .logo-beyaz {
  transform: translateY(-50%) scale(1) !important;
}

/* Footer hızlı menü altına profil kartındaki mantıkta sosyal medya ikonları */
.alt-bilgi-sosyal-medya {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
  flex-wrap: wrap;
}

.alt-bilgi-sosyal-medya a {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 15px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.24);
  color: #fff;
  font-size: 17px;
  transition: transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.alt-bilgi-sosyal-medya a:hover {
  transform: translateY(-3px);
  background: #fff;
  color: var(--primary);
  border-color: rgba(255,255,255,.90);
  box-shadow: 0 14px 28px rgba(0,0,0,.12);
}

/* Eski text sosyal link pseudo stilleri devre dışı */
.alt-bilgi-sosyal-linkedin::before,
.alt-bilgi-sosyal-instagram::before {
  content: none !important;
}

/* Footer hızlı menü 4 link + sosyal ikon yapısına göre dengeli kalsın */
.alt-bilgi-v19 .alt-bilgi-menu nav {
  gap: 12px;
}

@media (max-width: 1100px) {
  .marka-logo-alani {
    width: 220px !important;
    height: 88px !important;
  }

  .marka-logo-alani .logo-mavi,
  .marka-logo-alani .logo-beyaz,
  .header .logo-mavi,
  .header .logo-beyaz {
    height: 78px !important;
    max-width: 220px !important;
  }
}

@media (max-width: 640px) {
  .marka-logo-alani {
    width: 175px !important;
    height: 68px !important;
  }

  .marka-logo-alani .logo-mavi,
  .marka-logo-alani .logo-beyaz,
  .header .logo-mavi,
  .header .logo-beyaz {
    height: 60px !important;
    max-width: 175px !important;
  }

  .alt-bilgi-sosyal-medya a {
    width: 38px;
    height: 38px;
    border-radius: 13px;
  }
}



/* === v23 header logo boyutu doğrudan ust-menu.html içinden yönetilebilir === */

/*
  Logo boyutları artık sections/ust-menu.html dosyasındaki header style alanından yönetilir.

  Örnek:
  --header-logo-genislik: 260px;
  --header-logo-yukseklik: 104px;
*/

.marka-logo-alani {
  width: var(--header-logo-genislik, 260px) !important;
  height: var(--header-logo-yukseklik, 104px) !important;
}

.marka-logo-alani .logo-mavi,
.marka-logo-alani .logo-beyaz,
.header .logo-mavi,
.header .logo-beyaz {
  height: var(--header-logo-yukseklik, 104px) !important;
  max-width: var(--header-logo-genislik, 260px) !important;
  width: auto !important;
  object-fit: contain !important;
  transform: translateY(-50%) scale(1) !important;
  transform-origin: left center !important;
}

.header.menu-kaydirildi .logo-mavi,
.header.menu-kaydirildi .logo-beyaz {
  transform: translateY(-50%) scale(1) !important;
}

/* Tablet logo ölçüsü */
@media (max-width: 1100px) {
  .marka-logo-alani {
    width: var(--header-logo-genislik-tablet, 220px) !important;
    height: var(--header-logo-yukseklik-tablet, 78px) !important;
  }

  .marka-logo-alani .logo-mavi,
  .marka-logo-alani .logo-beyaz,
  .header .logo-mavi,
  .header .logo-beyaz {
    height: var(--header-logo-yukseklik-tablet, 78px) !important;
    max-width: var(--header-logo-genislik-tablet, 220px) !important;
  }
}

/* Mobil logo ölçüsü */
@media (max-width: 640px) {
  .marka-logo-alani {
    width: var(--header-logo-genislik-mobil, 175px) !important;
    height: var(--header-logo-yukseklik-mobil, 60px) !important;
  }

  .marka-logo-alani .logo-mavi,
  .marka-logo-alani .logo-beyaz,
  .header .logo-mavi,
  .header .logo-beyaz {
    height: var(--header-logo-yukseklik-mobil, 60px) !important;
    max-width: var(--header-logo-genislik-mobil, 175px) !important;
  }
}



/* === v25 dil seçici TR / EN === */

/* Genel dil seçici */
.dil-secici {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(0,119,200,.14);
  box-shadow: 0 10px 24px rgba(11,23,42,.06);
  backdrop-filter: blur(12px);
}

.dil-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 64px;
  height: 36px;
  justify-content: center;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--primary);
  font-weight: 900;
  font-size: 13px;
  overflow: hidden;
  transition: color .28s ease, background .28s ease, transform .28s ease, box-shadow .28s ease;
}

.dil-link::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%);
  opacity: 0;
  transition: opacity .28s ease;
  z-index: -1;
}

.dil-link:hover,
.dil-link.aktif-dil {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,119,200,.14);
}

.dil-link:hover::before,
.dil-link.aktif-dil::before {
  opacity: 1;
}

.bayrak {
  display: inline-flex;
  font-size: 17px;
  line-height: 1;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.10));
  animation: bayrak-yumusak 2.6s ease-in-out infinite;
}

.dil-link:nth-child(2) .bayrak {
  animation-delay: .35s;
}

@keyframes bayrak-yumusak {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-1.5px) rotate(-2deg);
  }
}

/* Header içindeki dil seçici menüyle dengeli dursun */
.dil-secici-header {
  margin-left: 14px;
}

/* Header maviye dönünce dil seçici de cam efektiyle beyaza uyumlansın */
.header.menu-kaydirildi .dil-secici-header {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.24);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

.header.menu-kaydirildi .dil-secici-header .dil-link {
  color: #fff;
}

.header.menu-kaydirildi .dil-secici-header .dil-link::before {
  background: rgba(255,255,255,.20);
}

.header.menu-kaydirildi .dil-secici-header .dil-link:hover,
.header.menu-kaydirildi .dil-secici-header .dil-link.aktif-dil {
  color: #fff;
}

/* Footer dil seçici, sosyal medya ikonlarıyla aynı blok hissinde */
.dil-secici-footer {
  margin-top: 18px;
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.22);
  box-shadow: none;
}

.dil-secici-footer .dil-link {
  color: #fff;
}

.dil-secici-footer .dil-link::before {
  background: #fff;
}

.dil-secici-footer .dil-link:hover,
.dil-secici-footer .dil-link.aktif-dil {
  color: var(--primary);
}

/* Mobilde header dil seçici alt satıra taşınabilir */
@media (max-width: 820px) {
  .dil-secici-header {
    margin-left: 0;
    margin-top: 12px;
  }

  .nav.active + .dil-secici-header,
  .dil-secici-header {
    align-self: flex-start;
  }
}

@media (max-width: 640px) {
  .dil-link {
    min-width: 58px;
    height: 34px;
    font-size: 12px;
  }

  .bayrak {
    font-size: 16px;
  }
}



/* === v26 dil sistemi ve hizalama düzeltmeleri === */

/* Header menü alanı daha ortalı ve dengeli dursun */
.menu-satiri {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
}

.menu-satiri .nav {
  justify-self: center;
}

.dil-secici-header {
  justify-self: end;
  margin-left: 18px;
}

/* Bayrak kaldırıldı, TR/EN tek kez görünür */
.dil-link {
  min-width: 54px;
  height: 36px;
  padding: 0 14px;
  letter-spacing: .02em;
}

.dil-link .bayrak {
  display: none !important;
}

/* Footer sosyal medya ve dil alanlarını ortala */
.alt-bilgi-sosyal-medya,
.dil-secici-footer {
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}

.dil-secici-footer {
  display: flex;
  width: max-content;
}

/* Footer hızlı menü kolonunda sosyal ve dil alanı merkez hizası */
.alt-bilgi-v19 .alt-bilgi-menu {
  text-align: left;
}

.alt-bilgi-v19 .alt-bilgi-menu .alt-bilgi-sosyal-medya,
.alt-bilgi-v19 .alt-bilgi-menu .dil-secici-footer {
  text-align: center;
}

/* Header mobilde de düzenli kalsın */
@media (max-width: 820px) {
  .menu-satiri {
    display: flex !important;
  }

  .dil-secici-header {
    margin-left: 0;
  }
}



/* === v27 üst menü yerleşimi ve buton tasarımı === */

/* Menü yazıları tam ortada değil, logo ile dil seçici arasında sağa yakın dengeli dursun */
.menu-satiri {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  column-gap: 34px !important;
}

.menu-satiri .nav {
  justify-self: end !important;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Menü linkleri artık bütüncül, yumuşak buton tasarımında */
.menu-satiri .nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.54);
  border: 1px solid rgba(0,119,200,.10);
  color: var(--dark);
  font-size: 14.5px;
  font-weight: 850;
  box-shadow: 0 8px 20px rgba(11,23,42,.035);
  transition:
    background .26s ease,
    color .26s ease,
    border-color .26s ease,
    transform .26s ease,
    box-shadow .26s ease;
}

.menu-satiri .nav a::after {
  display: none !important;
}

.menu-satiri .nav a:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%);
  border-color: transparent;
  color: #fff !important;
  box-shadow: 0 14px 28px rgba(0,119,200,.16);
}

/* Header maviye döndüğünde menü butonları cam efektiyle uyumlansın */
.header.menu-kaydirildi .menu-satiri .nav a {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.20);
  color: #fff !important;
  box-shadow: none;
}

.header.menu-kaydirildi .menu-satiri .nav a:hover {
  background: #fff;
  color: var(--primary) !important;
  border-color: #fff;
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
}

/* Dil seçici menü ile aynı hizayı korusun */
.dil-secici-header {
  justify-self: end !important;
  margin-left: 6px !important;
}

/* Tablet görünümde menü sıkışmasın */
@media (max-width: 1200px) {
  .menu-satiri {
    column-gap: 22px !important;
  }

  .menu-satiri .nav {
    gap: 8px;
  }

  .menu-satiri .nav a {
    min-height: 38px;
    padding: 0 13px;
    font-size: 13.5px;
  }
}

/* Mobilde mevcut açılır menü mantığı korunsun */
@media (max-width: 820px) {
  .menu-satiri {
    display: flex !important;
  }

  .menu-satiri .nav {
    justify-self: auto !important;
    gap: 16px;
  }

  .menu-satiri .nav a {
    width: 100%;
    justify-content: flex-start;
    min-height: 42px;
    padding: 0 16px;
  }
}



/* === v28 üst menü tipografi/renk + footer sosyal ikon + yukarı çık düzeltmesi === */

/* Üst menü butonları: siyah yerine mavi yazı, beyaz zemin */
.menu-satiri .nav a {
  color: var(--primary) !important;
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(0,119,200,.16) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
  box-shadow: 0 10px 24px rgba(11,23,42,.045) !important;
}

/* Hover: mavi zemin, beyaz yazı */
.menu-satiri .nav a:hover {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%) !important;
  border-color: transparent !important;
}

/* Header maviye döndüğünde butonlar cam beyaz, yazılar beyaz */
.header.menu-kaydirildi .menu-satiri .nav a {
  color: #ffffff !important;
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.22) !important;
  box-shadow: none !important;
}

/* Header mavi durumdayken hover: beyaz zemin, mavi yazı */
.header.menu-kaydirildi .menu-satiri .nav a:hover {
  color: var(--primary) !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}

/* Dil seçiciyle menü fontu daha uyumlu olsun */
.dil-link {
  font-weight: 850 !important;
  letter-spacing: -0.01em;
}

/* Footer sosyal medya ikonları tam ortalı */
.alt-bilgi-sosyal-medya {
  justify-content: center !important;
  align-items: center !important;
}

.alt-bilgi-sosyal-medya a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  text-align: center !important;
  padding: 0 !important;
}

.alt-bilgi-sosyal-medya a i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1em !important;
  height: 1em !important;
  line-height: 1 !important;
  margin: 0 !important;
  transform: translateY(0) !important;
}

/* Eski pseudo ikonlar kesinlikle devre dışı */
.alt-bilgi-sosyal-medya a::before,
.alt-bilgi-sosyal-medya a::after {
  content: none !important;
  display: none !important;
}

/* Yukarı çık butonu */
.alt-bilgi-yukari {
  cursor: pointer;
}



/* === v29 genel görsel iyileştirmeler === */

/* 1) Hero başlık dilini tüm ana başlıklara yay */
.bolum-basligi h2 span,
.hakkimda-icerik h2 span,
.iletisim-karti h2 span,
.section-heading h2 span,
.about-content h2 span,
.contact-card h2 span {
  color: var(--primary);
}

.bolum-basligi h2,
.hakkimda-icerik h2,
.iletisim-karti h2,
.section-heading h2,
.about-content h2,
.contact-card h2 {
  text-wrap: balance;
}

/* 2) Header menü: daha premium, daha az oyuncak hissi */
.menu-satiri .nav {
  gap: 8px !important;
}

.menu-satiri .nav a {
  min-height: 38px !important;
  padding: 0 15px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(0,119,200,.13) !important;
  color: var(--primary) !important;
  font-size: 13.8px !important;
  font-weight: 850 !important;
  letter-spacing: -0.015em !important;
  box-shadow: 0 10px 24px rgba(11,23,42,.04) !important;
}

.menu-satiri .nav a:hover {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-bright) 100%) !important;
  color: #fff !important;
  transform: translateY(-2px);
}

.header.menu-kaydirildi .menu-satiri .nav a {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.22) !important;
  color: #fff !important;
}

.header.menu-kaydirildi .menu-satiri .nav a:hover {
  background: #fff !important;
  color: var(--primary) !important;
}

/* 3) Profil kartı güçlendirme */
.profil-karti-v7,
.profil-karti {
  position: relative;
}

.profil-karti-v7::before,
.profil-karti::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border-top: 3px solid rgba(0,119,200,.28);
  pointer-events: none;
}

.profil-karti-v7 .profil-gorseli,
.profil-karti .profil-gorseli {
  box-shadow: 0 18px 35px rgba(11,23,42,.08);
}

.uzmanlik-etiketleri span {
  font-weight: 900;
  border-color: rgba(0,119,200,.18) !important;
}

/* 4) Süreç okları yerine daha premium flow line/parlayan nokta hissi */
.ok-akisi {
  position: relative;
}

.ok-akisi::before {
  content: "";
  position: absolute;
  left: 11%;
  right: 11%;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0,119,200,.20), transparent);
  transform: translateY(-50%);
  z-index: 0;
  pointer-events: none;
}

.ok-akisi::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 11%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--primary);
  box-shadow: 0 0 0 8px rgba(0,119,200,.08), 0 10px 25px rgba(0,119,200,.20);
  transform: translateY(-50%);
  animation: surec-nokta-akis 4.4s ease-in-out infinite;
  z-index: 1;
  pointer-events: none;
}

.ok-akisi .surec-karti {
  position: relative;
  z-index: 2;
}

.ok-akisi .surec-karti:not(:last-child)::after {
  display: none !important;
}

@keyframes surec-nokta-akis {
  0% { left: 11%; opacity: .30; }
  12% { opacity: 1; }
  50% { opacity: 1; }
  88% { opacity: 1; }
  100% { left: calc(89% - 12px); opacity: .30; }
}

/* 5) Referans alanı daha premium */
.logo-kayan-alan {
  position: relative;
  border-radius: 30px;
}

.logo-kayan-alan::before,
.logo-kayan-alan::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 110px;
  z-index: 4;
  pointer-events: none;
}

.logo-kayan-alan::before {
  left: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.98), rgba(255,255,255,0));
}

.logo-kayan-alan::after {
  right: 0;
  background: linear-gradient(270deg, rgba(255,255,255,.98), rgba(255,255,255,0));
}

.logo-kutusu {
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(0,119,200,.14) !important;
  box-shadow: 0 12px 30px rgba(11,23,42,.045);
}

.logo-kutusu img {
  filter: grayscale(1) opacity(.66) !important;
}

.logo-kutusu:hover img {
  filter: grayscale(1) opacity(.96) !important;
}

/* 6) İletişim sağ kutusu daha az input, daha çok bilgi kartı gibi */
.premium-yan-bilgi,
.yan-bilgi-kutusu {
  overflow: hidden;
}

.premium-yan-bilgi::before,
.yan-bilgi-kutusu::before {
  content: "";
  position: absolute;
  right: -80px;
  top: -90px;
  width: 210px;
  height: 210px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(0,119,200,.13), rgba(0,119,200,0) 70%);
  pointer-events: none;
}

.yan-mini-kartlar span,
.side-mini-cards span {
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(0,119,200,.16) !important;
  box-shadow: 0 10px 24px rgba(11,23,42,.035);
}

/* 7) Footer yoğunluğunu ve watermark'ı dengele */
.footer-watermark {
  opacity: .026 !important;
}

.footer-watermark img {
  width: 1050px !important;
}

.alt-bilgi-v19 .alt-bilgi-menu a {
  min-height: 48px !important;
}

.alt-bilgi-sosyal-medya {
  gap: 10px !important;
  margin-top: 16px !important;
}

.dil-secici-footer {
  margin-top: 15px !important;
}

/* 8) Nitro efekti daha kurumsal ve yavaş */
.nitro-cubuk i {
  animation:
    nitro-akis 4.2s linear infinite,
    nitro-nefes 2.9s ease-in-out infinite !important;
}

.nitro-cubuk::before {
  animation: nitro-parlama 3.9s ease-in-out infinite !important;
}

/* Responsive güvenliği */
@media (max-width: 900px) {
  .ok-akisi::before,
  .ok-akisi::after {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ok-akisi::after {
    animation: none !important;
  }
}



/* === v32 STABIL DÜZELTME ===
   Bu sürümde CSS tekrar güvenli tek dosyada tutulur.
   Font yolları bozulmaz. Süreç efekti sade mavi/yeşil nokta sistemine alınır.
*/

/* v29'daki kayan çizgi efekti kapatıldı */
.ok-akisi::before,
.ok-akisi::after {
  display: none !important;
}

/* Eski ok simgeleri ve hareketli efektler kapatıldı */
.ok-akisi .surec-karti:not(:last-child)::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  right: -28px !important;
  width: 46px !important;
  height: 12px !important;
  transform: translateY(-50%) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: transparent !important;
  z-index: 4 !important;
  pointer-events: none !important;
}

/* Kartlar arasında ince, sade bağlantı çizgisi */
.surec-nokta-efekti .surec-karti:not(:last-child)::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -34px !important;
  width: 68px !important;
  height: 2px !important;
  transform: translateY(-50%) !important;
  background: linear-gradient(90deg, rgba(11,97,175,.08), rgba(11,97,175,.18), rgba(11,97,175,.08)) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Mavi/yeşil yanıp sönen noktalar */
.surec-nokta-efekti .surec-karti:not(:last-child)::after {
  background:
    radial-gradient(circle, #1fd48d 0 42%, transparent 45%) 0 center / 12px 12px no-repeat,
    radial-gradient(circle, #1294d7 0 42%, transparent 45%) 17px center / 12px 12px no-repeat,
    radial-gradient(circle, #1fd48d 0 42%, transparent 45%) 34px center / 12px 12px no-repeat !important;
  animation: surecNoktaYumusak 1.9s ease-in-out infinite !important;
}

.surec-nokta-efekti .surec-karti:nth-child(2)::after {
  animation-delay: .22s !important;
}

.surec-nokta-efekti .surec-karti:nth-child(3)::after {
  animation-delay: .44s !important;
}

@keyframes surecNoktaYumusak {
  0%, 100% {
    opacity: .35;
    filter: saturate(.9);
  }
  45% {
    opacity: 1;
    filter: saturate(1.25);
  }
  70% {
    opacity: .62;
  }
}

@media (max-width: 1100px) {
  .surec-nokta-efekti .surec-karti::before,
  .surec-nokta-efekti .surec-karti::after {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .surec-nokta-efekti .surec-karti::after {
    animation: none !important;
  }
}


/* =========================================================
   v35 | SÜREÇ KARTLARI YENİ BAĞLANTI EFEKTİ
   - Eski mavi/yeşil nokta efekti yerine daha modern veri akışı eklendi.
   - Kart hover durumunda mavi vurgu ve glow efekti verildi.
   - Bu blok özellikle surec-izgarasi / ok-akisi / surec-nokta-efekti alanı için yazıldı.
   ========================================================= */

.surec-izgarasi .surec-karti {
  overflow: visible;
  transition:
    transform .34s ease,
    box-shadow .34s ease,
    border-color .34s ease,
    background .34s ease,
    color .34s ease;
}

.surec-izgarasi .surec-karti h3,
.surec-izgarasi .surec-karti p,
.surec-izgarasi .surec-karti span {
  transition:
    color .34s ease,
    background .34s ease,
    box-shadow .34s ease,
    transform .34s ease;
}

/* Eski sade nokta sistemini yeni bağlantı tasarımı ile değiştir */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -36px !important;
  width: 72px !important;
  height: 3px !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;
  background: linear-gradient(
    90deg,
    rgba(26, 137, 255, 0) 0%,
    rgba(65, 197, 255, .42) 20%,
    rgba(255, 255, 255, .96) 50%,
    rgba(65, 197, 255, .42) 80%,
    rgba(26, 137, 255, 0) 100%
  ) !important;
  background-size: 200% 100% !important;
  box-shadow:
    0 0 14px rgba(36, 161, 255, .18),
    0 0 22px rgba(36, 161, 255, .10) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  animation: surecVeriAkisi 2.8s linear infinite !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -12px !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateY(-50%) rotate(45deg) !important;
  border-radius: 4px !important;
  background: linear-gradient(135deg, #7ce3ff 0%, #1b8fff 55%, #0b61af 100%) !important;
  border: 1px solid rgba(255, 255, 255, .95) !important;
  box-shadow:
    0 0 0 4px rgba(57, 176, 255, .10),
    0 0 16px rgba(57, 176, 255, .46),
    0 0 28px rgba(11, 97, 175, .18),
    inset 0 0 10px rgba(255, 255, 255, .72) !important;
  z-index: 3 !important;
  pointer-events: none !important;
  animation: surecDugumParla 2s ease-in-out infinite !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(2):not(:last-child)::after {
  animation-delay: .22s !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(3):not(:last-child)::after {
  animation-delay: .44s !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover {
  transform: translateY(-8px) !important;
  background:
    linear-gradient(180deg, rgba(11, 97, 175, .12), rgba(57, 176, 255, .06)),
    rgba(255, 255, 255, .96) !important;
  border-color: rgba(11, 97, 175, .22) !important;
  box-shadow:
    0 22px 48px rgba(11, 97, 175, .16),
    0 8px 18px rgba(57, 176, 255, .08),
    inset 0 1px 0 rgba(255, 255, 255, .96) !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover h3 {
  color: var(--primary) !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover p {
  color: #5d7390 !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover span {
  background: linear-gradient(135deg, var(--primary), #39b0ff) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(11, 97, 175, .16) !important;
  transform: translateY(-2px) !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover::before,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover::after {
  filter: brightness(1.12) saturate(1.08);
}

@keyframes surecVeriAkisi {
  0% {
    background-position: 100% 0;
    opacity: .72;
  }
  50% {
    background-position: 0% 0;
    opacity: 1;
  }
  100% {
    background-position: -100% 0;
    opacity: .72;
  }
}

@keyframes surecDugumParla {
  0%, 100% {
    transform: translateY(-50%) rotate(45deg) scale(.88);
    box-shadow:
      0 0 0 4px rgba(57, 176, 255, .08),
      0 0 14px rgba(57, 176, 255, .34),
      0 0 24px rgba(11, 97, 175, .14),
      inset 0 0 8px rgba(255, 255, 255, .58);
  }
  50% {
    transform: translateY(-50%) rotate(45deg) scale(1.08);
    box-shadow:
      0 0 0 6px rgba(57, 176, 255, .12),
      0 0 22px rgba(57, 176, 255, .52),
      0 0 34px rgba(11, 97, 175, .20),
      inset 0 0 12px rgba(255, 255, 255, .82);
  }
}

@media (max-width: 1100px) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::before,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::after {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti h3,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti p,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti span {
    transition: none !important;
  }

  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::before,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::after {
    animation: none !important;
  }
}


/* =========================================================
   v36 | SÜREÇ ALANI PREMIUM PULSE CONNECTOR
   Amaç:
   - v35'teki fazla parlak / elmas hissi veren efekti kaldırmak.
   - Daha sade, kurumsal, mavi tonlu ve premium bir bağlantı etkisi vermek.
   - Kart hover durumunda temiz mavi glow oluşturmak.
   ========================================================= */

/* Süreç kartlarının animasyon davranışı */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti {
  overflow: visible;
  transition:
    transform .32s ease,
    box-shadow .32s ease,
    border-color .32s ease,
    background .32s ease;
}

/* Eski ok / elmas / agresif glow efekti tamamen sıfırlanır */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::before,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
  pointer-events: none !important;
}

/* Kartlar arasındaki sade bağlantı çizgisi */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -28px !important;
  width: 28px !important;
  height: 2px !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;
  background: linear-gradient(
    90deg,
    rgba(11, 97, 175, .08) 0%,
    rgba(18, 148, 215, .30) 50%,
    rgba(11, 97, 175, .08) 100%
  ) !important;
  background-size: 160% 100% !important;
  box-shadow: none !important;
  z-index: 1 !important;
  animation: surecCizgiAkisiV36 3.2s ease-in-out infinite !important;
}

/* Ortadaki küçük mavi pulse nokta */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -22px !important;
  width: 16px !important;
  height: 16px !important;
  transform: translateY(-50%) scale(1) !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at center, #ffffff 0 18%, #7dd7ff 19% 38%, #1294d7 39% 100%) !important;
  border: 2px solid rgba(255, 255, 255, .95) !important;
  box-shadow:
    0 0 0 5px rgba(18, 148, 215, .08),
    0 8px 18px rgba(11, 97, 175, .14) !important;
  z-index: 3 !important;
  animation: surecPulseNoktasiV36 2.25s ease-in-out infinite !important;
}

/* Her bağlantı biraz farklı ritimde çalışsın */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(2):not(:last-child)::after,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(2):not(:last-child)::before {
  animation-delay: .25s !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(3):not(:last-child)::after,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:nth-child(3):not(:last-child)::before {
  animation-delay: .50s !important;
}

/* Kart hover efekti: mavi ama temiz, okunabilirlik bozulmaz */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover {
  transform: translateY(-7px) !important;
  border-color: rgba(11, 97, 175, .24) !important;
  background:
    linear-gradient(180deg, rgba(234, 245, 255, .88), rgba(255, 255, 255, .94)) !important;
  box-shadow:
    0 22px 48px rgba(11, 97, 175, .14),
    0 8px 18px rgba(18, 148, 215, .08) !important;
}

/* Hover'da başlık ve numara kutusu daha markalı görünür */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover h3 {
  color: var(--primary) !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover span {
  background: linear-gradient(135deg, var(--primary), var(--primary-bright)) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(11, 97, 175, .16) !important;
  transform: translateY(-2px);
}

/* Hover sırasında bağlantı da hafif canlansın ama bağırmasın */
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover::before {
  background: linear-gradient(90deg, rgba(11, 97, 175, .18), rgba(18, 148, 215, .58), rgba(11, 97, 175, .18)) !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover::after {
  box-shadow:
    0 0 0 7px rgba(18, 148, 215, .11),
    0 10px 24px rgba(11, 97, 175, .18) !important;
}

/* Yavaş ve premium çizgi akışı */
@keyframes surecCizgiAkisiV36 {
  0%, 100% {
    background-position: 100% 0;
    opacity: .55;
  }
  50% {
    background-position: 0% 0;
    opacity: 1;
  }
}

/* Nokta etrafında hafif dalga hissi */
@keyframes surecPulseNoktasiV36 {
  0%, 100% {
    transform: translateY(-50%) scale(.94) !important;
    box-shadow:
      0 0 0 3px rgba(18, 148, 215, .08),
      0 8px 18px rgba(11, 97, 175, .12) !important;
    filter: brightness(1);
  }
  45% {
    transform: translateY(-50%) scale(1.08) !important;
    box-shadow:
      0 0 0 8px rgba(18, 148, 215, .10),
      0 0 0 15px rgba(18, 148, 215, .035),
      0 12px 24px rgba(11, 97, 175, .17) !important;
    filter: brightness(1.08);
  }
}

/* Tablet ve mobilde kart arası çizgileri kapatıyoruz; grid kırıldığında taşma olmasın */
@media (max-width: 1100px) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::before,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::after {
    display: none !important;
  }
}

/* Hareket azaltma tercihi olan kullanıcılarda animasyon durur */
@media (prefers-reduced-motion: reduce) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti span,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti h3 {
    transition: none !important;
  }

  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::before,
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::after {
    animation: none !important;
  }
}


/* === v37 hero dashboard refinement === */
.performans-gorseli {
  min-height: 580px;
}

.premium-dashboard-karti {
  left: 48px;
  right: 8px;
  top: 34px;
  padding: 30px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(246,250,255,.92) 100%);
  border: 1px solid rgba(255,255,255,.96);
  box-shadow: 0 30px 80px rgba(17, 44, 78, .14), inset 0 1px 0 rgba(255,255,255,.65);
}

.premium-dashboard-karti::before,
.premium-dashboard-karti::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.premium-dashboard-karti::before {
  width: 260px;
  height: 260px;
  right: -120px;
  top: -120px;
  background: radial-gradient(circle, rgba(57,176,255,.18) 0%, rgba(57,176,255,0) 72%);
}

.premium-dashboard-karti::after {
  inset: 0;
  background: linear-gradient(120deg, transparent 10%, rgba(255,255,255,.22) 22%, transparent 34%);
  transform: translateX(-110%);
  animation: premium-kart-parlama 6.5s ease-in-out infinite;
}

.premium-dashboard-ust,
.premium-ilerleme-listesi,
.premium-sonuc-izgarasi {
  position: relative;
  z-index: 1;
}

.durum-canli {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(233,247,239,.95);
  color: #1d8b4f;
  padding: 8px 14px;
}

.durum-canli i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #37c86d;
  box-shadow: 0 0 0 0 rgba(55,200,109,.45);
  animation: pulseDot 1.9s ease-out infinite;
}

.premium-ilerleme-listesi {
  gap: 18px;
}

.premium-ilerleme-satiri .satir-ust {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 8px;
}

.premium-ilerleme-satiri .satir-ust strong {
  font-size: 14px;
  color: var(--dark);
  line-height: 1.2;
}

.premium-ilerleme-satiri .satir-ust small {
  font-size: 12px;
  font-weight: 800;
  color: var(--primary);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(11,97,175,.08);
  border: 1px solid rgba(11,97,175,.10);
}

.premium-ilerleme-satiri .doluluk-cubugu {
  height: 13px;
  background: linear-gradient(90deg, #e9f1f8 0%, #edf5fb 100%);
  box-shadow: inset 0 1px 2px rgba(14, 34, 61, .06);
}

.premium-sonuc-izgarasi {
  gap: 16px;
}

.metric-kutusu {
  padding: 18px 18px 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(244,249,255,.92) 100%);
  border: 1px solid rgba(11,97,175,.10);
  box-shadow: 0 14px 30px rgba(13, 48, 84, .06);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
}

.metric-kutusu span {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

.metric-kutusu:hover {
  transform: translateY(-4px);
  border-color: rgba(11,97,175,.18);
  box-shadow: 0 18px 36px rgba(13, 48, 84, .10);
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(240,247,255,.98) 100%);
}

.premium-floating-kart {
  z-index: 6;
  max-width: 276px;
  padding: 18px 20px;
  border: 1px solid rgba(123,200,255,.18);
  background: linear-gradient(135deg, rgba(17,25,39,.96) 0%, rgba(31,42,61,.94) 100%);
  box-shadow: 0 22px 48px rgba(8, 18, 35, .28), 0 0 0 1px rgba(255,255,255,.03) inset;
}

.premium-floating-kart::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(102,184,255,.45), rgba(102,184,255,0), rgba(102,184,255,.18));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.premium-floating-kart i {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(92,171,255,.12);
  box-shadow: 0 0 0 1px rgba(102,184,255,.08) inset;
}

.premium-floating-kart span {
  opacity: .92;
}

.performans-gorseli .google-karti {
  left: -28px;
  bottom: 182px;
}

.performans-gorseli .meta-karti {
  right: -14px;
  bottom: 86px;
}

.performans-gorseli .yazilim-karti {
  top: -6px;
  right: 116px;
  max-width: 294px;
}

@keyframes premium-kart-parlama {
  0%, 100% { transform: translateX(-120%); opacity: 0; }
  14% { opacity: .45; }
  36% { transform: translateX(120%); opacity: 0; }
}

@keyframes pulseDot {
  0% { box-shadow: 0 0 0 0 rgba(55,200,109,.42); }
  70% { box-shadow: 0 0 0 10px rgba(55,200,109,0); }
  100% { box-shadow: 0 0 0 0 rgba(55,200,109,0); }
}

@media (max-width: 1100px) {
  .premium-dashboard-karti {
    left: 0;
    right: 0;
    top: 0;
  }

  .performans-gorseli {
    min-height: 620px;
  }

  .performans-gorseli .google-karti {
    left: 12px;
    bottom: 148px;
  }

  .performans-gorseli .meta-karti {
    right: 0;
    bottom: 60px;
  }

  .performans-gorseli .yazilim-karti {
    top: 20px;
    right: 80px;
  }
}

@media (max-width: 820px) {
  .performans-gorseli {
    min-height: auto;
  }

  .premium-dashboard-karti {
    padding: 24px;
  }

  .premium-floating-kart {
    max-width: none;
  }
}

@media (max-width: 640px) {
  .premium-dashboard-karti {
    padding: 22px;
  }

  .premium-ilerleme-satiri .satir-ust {
    flex-wrap: wrap;
  }
}


/* === v38 final refinements: süreç kartları + premium atmosfer === */
.performans-gorseli {
  position: relative;
  isolation: isolate;
}

.dashboard-atmosfer-katmani {
  position: absolute;
  inset: 10px -18px 0 24px;
  border-radius: 40px;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 20%, rgba(61, 166, 255, 0.22) 0%, rgba(61, 166, 255, 0) 32%),
    radial-gradient(circle at 84% 18%, rgba(116, 222, 255, 0.16) 0%, rgba(116, 222, 255, 0) 24%),
    radial-gradient(circle at 74% 78%, rgba(8, 109, 196, 0.16) 0%, rgba(8, 109, 196, 0) 28%),
    linear-gradient(145deg, rgba(255,255,255,0.24) 0%, rgba(218,235,248,0.14) 42%, rgba(209,227,242,0.08) 100%);
  filter: blur(0px);
}

.dashboard-atmosfer-katmani::before,
.dashboard-atmosfer-katmani::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.dashboard-atmosfer-katmani::before {
  width: 220px;
  height: 220px;
  top: 40px;
  left: 18px;
  background: radial-gradient(circle, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.08) 42%, rgba(255,255,255,0) 70%);
  animation: dashboardOrtamNefes 7s ease-in-out infinite;
}

.dashboard-atmosfer-katmani::after {
  width: 300px;
  height: 300px;
  right: -40px;
  bottom: 10px;
  background: radial-gradient(circle, rgba(76,179,255,0.2) 0%, rgba(76,179,255,0.05) 32%, rgba(76,179,255,0) 72%);
  animation: dashboardOrtamNefes 9s ease-in-out infinite reverse;
}

.premium-dashboard-karti,
.premium-floating-kart {
  position: relative;
  z-index: 2;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti {
  position: relative;
  gap: 28px !important;
  align-items: stretch;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti {
  position: relative;
  overflow: visible;
  min-height: 210px;
  background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(246,250,255,0.86) 100%) !important;
  border: 1px solid rgba(255,255,255,0.94) !important;
  box-shadow: 0 20px 45px rgba(17, 44, 78, 0.10), inset 0 1px 0 rgba(255,255,255,0.75) !important;
  transition: transform .32s ease, box-shadow .32s ease, background .32s ease, border-color .32s ease !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,0.16) 0%, rgba(43,155,255,0.06) 50%, rgba(17,113,210,0.12) 100%);
  opacity: 0;
  transition: opacity .32s ease;
  pointer-events: none;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
  content: "➜" !important;
  position: absolute;
  top: 50%;
  right: -25px;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 21px;
  font-weight: 900;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #a8dcff 18%, #39b0ff 52%, #0b61af 100%) !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,0.72), 0 0 18px rgba(57,176,255,0.38), 0 10px 22px rgba(11,97,175,0.26);
  border: 1px solid rgba(255,255,255,0.9);
  z-index: 5;
  animation: surecOkParlamaV38 1.25s ease-in-out infinite !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child) > * {
  position: relative;
  z-index: 1;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti span,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti h3,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti p {
  transition: color .32s ease, background .32s ease, box-shadow .32s ease;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover {
  transform: translateY(-8px) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.02) 38%, rgba(255,255,255,0.00) 100%),
    linear-gradient(135deg, #0f76c7 0%, #2593e8 56%, #47b3ff 100%) !important;
  border-color: rgba(170,223,255,0.52) !important;
  box-shadow: 0 24px 48px rgba(11,97,175,0.18), 0 0 0 1px rgba(255,255,255,0.16) inset !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover::before {
  opacity: .72;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover h3,
.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover p {
  color: #ffffff !important;
}

.surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:hover span {
  background: rgba(255,255,255,0.18) !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.18) inset;
}

@keyframes surecOkParlamaV38 {
  0%, 100% {
    opacity: .92;
    transform: translateY(-50%) scale(1);
    box-shadow: 0 0 0 4px rgba(255,255,255,0.72), 0 0 18px rgba(57,176,255,0.30), 0 10px 22px rgba(11,97,175,0.24);
  }
  50% {
    opacity: 1;
    transform: translateY(-50%) scale(1.08);
    box-shadow: 0 0 0 6px rgba(255,255,255,0.78), 0 0 26px rgba(57,176,255,0.48), 0 14px 28px rgba(11,97,175,0.34);
  }
}

@keyframes dashboardOrtamNefes {
  0%, 100% { transform: scale(1) translate3d(0,0,0); opacity: .92; }
  50% { transform: scale(1.05) translate3d(6px,-8px,0); opacity: 1; }
}

@media (max-width: 1100px) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
    right: -18px;
    width: 42px;
    height: 42px;
    font-size: 18px;
  }
}

@media (max-width: 820px) {
  .dashboard-atmosfer-katmani {
    inset: 0;
    border-radius: 28px;
  }

  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti {
    min-height: auto;
  }
}

@media (max-width: 640px) {
  .surec-izgarasi.ok-akisi.surec-nokta-efekti .surec-karti:not(:last-child)::after {
    display: none !important;
  }
}


/* =========================================================
   v39 | HERO PERFORMANS PANELİ DÜZENLEME
   - v38'de eklenen büyük arka plan atmosfer/gölge kaldırıldı.
   - Sağ performans paneli eski, düzgün hizalı düzene yaklaştırıldı.
   - 3 floating kart korunur ama daha düzenli konumlandırılır.
   - Performans değerleri %100 olarak korunur.
   ========================================================= */

/* Arka plan gölge/atmosfer katmanı tamamen kaldırıldı */
.dashboard-atmosfer-katmani,
.dashboard-atmosfer-katmani::before,
.dashboard-atmosfer-katmani::after {
  display: none !important;
}

/* Sağ tarafı tekrar eski dengeye yaklaştır */
.performans-gorseli {
  min-height: 540px !important;
  position: relative !important;
  isolation: auto !important;
}

/* Ana dashboard kartı düz ve hizalı dursun */
.premium-dashboard-karti,
.ana-gosterge-karti {
  left: 40px !important;
  right: 0 !important;
  top: 40px !important;
  padding: 28px !important;
  overflow: visible !important;
  background: rgba(255,255,255,.86) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  box-shadow: var(--shadow) !important;
}

/* v38 parlama katmanlarını kaldır */
.premium-dashboard-karti::before,
.premium-dashboard-karti::after {
  display: none !important;
}

/* Barlar %100 ama taşmadan hizalı kalsın */
.premium-ilerleme-listesi {
  margin: 26px 0 !important;
  gap: 16px !important;
}

.premium-ilerleme-satiri .satir-ust {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 6px !important;
}

.premium-ilerleme-satiri .satir-ust strong {
  font-size: 14px !important;
  color: var(--dark) !important;
}

.premium-ilerleme-satiri .satir-ust small {
  font-size: 12px !important;
  font-weight: 900 !important;
  color: var(--primary) !important;
  background: rgba(11,97,175,.08) !important;
  border: 1px solid rgba(11,97,175,.12) !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
}

.premium-ilerleme-satiri .doluluk-cubugu {
  width: 100% !important;
  height: 12px !important;
}

.premium-ilerleme-satiri .doluluk-cubugu i {
  width: 100% !important;
}

/* Metric kutular eski düzene daha yakın, hizalı */
.premium-sonuc-izgarasi,
.sonuc-izgarasi {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 14px !important;
}

.metric-kutusu,
.sonuc-izgarasi div {
  padding: 18px !important;
  border-radius: 18px !important;
  background: #f7fbff !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}

.metric-kutusu span {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}

/* Floating kartlar korunur ama yamuk görüntü olmaması için eski dengeye alınır */
.performans-gorseli .premium-floating-kart,
.performans-gorseli .hareketli-bilgi-karti {
  z-index: 6 !important;
  max-width: 260px !important;
  padding: 16px 18px !important;
  border-radius: 18px !important;
  background: rgba(18,24,33,.92) !important;
  color: #fff !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.25) !important;
  border: none !important;
}

/* v38 floating kart border katmanı kaldır */
.premium-floating-kart::after {
  display: none !important;
}

.premium-floating-kart i,
.hareketli-bilgi-karti i {
  width: auto !important;
  height: auto !important;
  flex: 0 0 auto !important;
  display: block !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 22px !important;
  color: #7bc8ff !important;
}

/* Floating kart konumları eski düzene yaklaştırıldı */
.performans-gorseli .yazilim-karti {
  top: 60px !important;
  right: 132px !important;
  bottom: auto !important;
  left: auto !important;
  max-width: 260px !important;
}

.performans-gorseli .google-karti {
  left: 0 !important;
  bottom: 118px !important;
  right: auto !important;
  top: auto !important;
}

.performans-gorseli .meta-karti {
  right: -4px !important;
  bottom: 24px !important;
  left: auto !important;
  top: auto !important;
}

/* Aktif badge küçük ve hizalı kalsın */
.durum-canli,
.durum {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: #e9f7ef !important;
  color: #1d8b4f !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.durum-canli i {
  width: 8px !important;
  height: 8px !important;
}

/* Responsive güvenliği */
@media (max-width: 1100px) {
  .premium-dashboard-karti,
  .ana-gosterge-karti {
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
  }

  .performans-gorseli {
    min-height: 560px !important;
  }

  .performans-gorseli .yazilim-karti {
    right: 80px !important;
    top: 34px !important;
  }

  .performans-gorseli .google-karti {
    left: 0 !important;
    bottom: 118px !important;
  }

  .performans-gorseli .meta-karti {
    right: 0 !important;
    bottom: 24px !important;
  }
}

@media (max-width: 820px) {
  .performans-gorseli {
    min-height: auto !important;
    display: grid !important;
    gap: 16px !important;
  }

  .premium-dashboard-karti,
  .ana-gosterge-karti {
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    top: 0 !important;
  }

  .performans-gorseli .premium-floating-kart,
  .performans-gorseli .hareketli-bilgi-karti {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    max-width: none !important;
    animation: none !important;
  }
}


/* ===== V40 RESTORED FIX =====
   Süreç kartı hover rengi yumuşatıldı; mavi baskınlığı azaltıldı.
   Hedef: ikinci referans görseldeki gibi daha dengeli mavi-beyaz his.
===== */


/* =========================================================
   v55 CLEAN | FLOATING KARTLAR ESKİ STABİL ANİMASYONA DÖNDÜRÜLDÜ
   - v54 wrapper modeli kaldırıldı, eski kart yapısı kullanıldı.
   - Kartlar yeniden oval, koyu, premium ve hareketli.
   - Animasyon eski sürümlerdeki gibi transform tabanlı tek hareket.
   - Bu blok sadece hero sağ performans alanındaki 3 floating kartı etkiler.
   ========================================================= */

@keyframes faunFloatEskiStabil {
  0%, 100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -12px, 0);
  }
}

@keyframes faunFloatIsik {
  0% {
    transform: translateX(-130%) skewX(-20deg);
    opacity: 0;
  }
  35% {
    opacity: .16;
  }
  70% {
    transform: translateX(180%) skewX(-20deg);
    opacity: 0;
  }
  100% {
    transform: translateX(180%) skewX(-20deg);
    opacity: 0;
  }
}

@media (min-width: 821px) {
  .performans-gorseli {
    min-height: 560px !important;
    overflow: visible !important;
  }

  .performans-gorseli .hareketli-bilgi-karti,
  .performans-gorseli .premium-floating-kart {
    position: absolute !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 260px !important;
    max-width: 260px !important;
    min-height: auto !important;
    height: auto !important;
    padding: 16px 18px !important;
    border-radius: 18px !important;
    background: rgba(18,24,33,.92) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 50px rgba(0,0,0,.25) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    overflow: hidden !important;
    z-index: 9 !important;
    animation: faunFloatEskiStabil 4s ease-in-out infinite !important;
    will-change: transform !important;
    backface-visibility: hidden !important;
  }

  .performans-gorseli .hareketli-bilgi-karti::after,
  .performans-gorseli .premium-floating-kart::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: 58% !important;
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent) !important;
    pointer-events: none !important;
    animation: faunFloatIsik 6.4s ease-in-out infinite !important;
    z-index: 1 !important;
  }

  .performans-gorseli .hareketli-bilgi-karti > *,
  .performans-gorseli .premium-floating-kart > * {
    position: relative !important;
    z-index: 2 !important;
  }

  .performans-gorseli .hareketli-bilgi-karti i,
  .performans-gorseli .premium-floating-kart i {
    width: auto !important;
    height: auto !important;
    flex: 0 0 auto !important;
    display: block !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #7bc8ff !important;
    font-size: 22px !important;
  }

  .performans-gorseli .hareketli-bilgi-karti strong,
  .performans-gorseli .premium-floating-kart strong {
    display: block !important;
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.22 !important;
    margin-bottom: 3px !important;
  }

  .performans-gorseli .hareketli-bilgi-karti span,
  .performans-gorseli .premium-floating-kart span {
    display: block !important;
    color: rgba(255,255,255,.86) !important;
    opacity: 1 !important;
    font-size: 12px !important;
    line-height: 1.38 !important;
  }

  /* Eski stabil konumlar */
  .performans-gorseli .yazilim-karti {
    top: 60px !important;
    right: 132px !important;
    left: auto !important;
    bottom: auto !important;
    animation-delay: .65s !important;
  }

  .performans-gorseli .google-karti {
    left: 0 !important;
    bottom: 118px !important;
    right: auto !important;
    top: auto !important;
    animation-delay: 0s !important;
  }

  .performans-gorseli .meta-karti {
    right: -4px !important;
    bottom: 24px !important;
    left: auto !important;
    top: auto !important;
    animation-delay: 1.2s !important;
  }
}

@media (max-width: 1100px) and (min-width: 821px) {
  .performans-gorseli .yazilim-karti {
    right: 80px !important;
    top: 34px !important;
  }

  .performans-gorseli .google-karti {
    left: 0 !important;
    bottom: 118px !important;
  }

  .performans-gorseli .meta-karti {
    right: 0 !important;
    bottom: 24px !important;
  }
}

@media (max-width: 820px) {
  .performans-gorseli .hareketli-bilgi-karti,
  .performans-gorseli .premium-floating-kart {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: none !important;
    animation: none !important;
  }
}


/* =========================================================
   v02 | HERO FLOATING KARTLAR DIŞ ALANA TAŞINDI
   Baz: v55-clean ana sürüm
   Amaç:
   - Dashboard içeriğini temiz bırakmak
   - Floating kartları ana panelin dışına taşımak
   - İnce bağlantı çizgileriyle performans kartına bağlamak
   - Eski stabil yüzme animasyonunu korumak
   ========================================================= */

@keyframes faunDisKartYuzmeV02 {
  0%, 100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -10px, 0);
  }
}

@keyframes faunDisKartYuzmeV02Soft {
  0%, 100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -7px, 0);
  }
}

@keyframes faunBaglantiPulseV02 {
  0%, 100% {
    opacity: .42;
    filter: drop-shadow(0 0 2px rgba(18,148,215,.10));
  }
  50% {
    opacity: .95;
    filter: drop-shadow(0 0 8px rgba(18,148,215,.34));
  }
}

@keyframes faunDisKartIsikV02 {
  0% {
    transform: translateX(-135%) skewX(-20deg);
    opacity: 0;
  }
  35% {
    opacity: .16;
  }
  70% {
    transform: translateX(180%) skewX(-20deg);
    opacity: 0;
  }
  100% {
    transform: translateX(180%) skewX(-20deg);
    opacity: 0;
  }
}

@media (min-width: 821px) {
  .performans-gorseli {
    min-height: 600px !important;
    overflow: visible !important;
    isolation: isolate;
  }

  .ana-gosterge-karti,
  .premium-dashboard-karti {
    overflow: visible !important;
    z-index: 3 !important;
  }

  /* Kartların genel görünümü: v55 stabil oval koyu kart yapısı korunur */
  .performans-gorseli .hareketli-bilgi-karti,
  .performans-gorseli .premium-floating-kart {
    position: absolute !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 260px !important;
    max-width: 260px !important;
    min-height: auto !important;
    height: auto !important;
    padding: 16px 18px !important;
    border-radius: 18px !important;
    background: rgba(18,24,33,.92) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 50px rgba(0,0,0,.25) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    overflow: hidden !important;
    z-index: 10 !important;
    animation: faunDisKartYuzmeV02 5.6s ease-in-out infinite !important;
    will-change: transform !important;
    backface-visibility: hidden !important;
  }

  .performans-gorseli .hareketli-bilgi-karti::after,
  .performans-gorseli .premium-floating-kart::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: 58% !important;
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent) !important;
    pointer-events: none !important;
    animation: faunDisKartIsikV02 7s ease-in-out infinite !important;
    z-index: 1 !important;
  }

  .performans-gorseli .hareketli-bilgi-karti > *,
  .performans-gorseli .premium-floating-kart > * {
    position: relative !important;
    z-index: 2 !important;
  }

  /* Kartları panelin dışına taşıyoruz */
  .performans-gorseli .yazilim-karti {
    top: -26px !important;
    right: -42px !important;
    left: auto !important;
    bottom: auto !important;
    width: 285px !important;
    max-width: 285px !important;
    animation-delay: .2s !important;
  }

  .performans-gorseli .google-karti {
    left: -64px !important;
    bottom: 162px !important;
    right: auto !important;
    top: auto !important;
    width: 250px !important;
    max-width: 250px !important;
    animation: faunDisKartYuzmeV02Soft 6s ease-in-out infinite !important;
    animation-delay: .75s !important;
  }

  .performans-gorseli .meta-karti {
    right: -74px !important;
    bottom: 68px !important;
    left: auto !important;
    top: auto !important;
    width: 265px !important;
    max-width: 265px !important;
    animation-delay: 1.15s !important;
  }

  /* İnce bağlantı çizgileri */
  .performans-gorseli .yazilim-karti::before,
  .performans-gorseli .google-karti::before,
  .performans-gorseli .meta-karti::before {
    content: "" !important;
    position: absolute !important;
    pointer-events: none !important;
    z-index: -1 !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(18,148,215,.58), rgba(255,255,255,.12)) !important;
    animation: faunBaglantiPulseV02 3.2s ease-in-out infinite !important;
  }

  .performans-gorseli .yazilim-karti::before {
    width: 92px !important;
    left: -74px !important;
    top: 50% !important;
    transform: rotate(18deg) translateY(-50%) !important;
  }

  .performans-gorseli .google-karti::before {
    width: 72px !important;
    right: -62px !important;
    top: 48% !important;
    transform: rotate(-7deg) translateY(-50%) !important;
  }

  .performans-gorseli .meta-karti::before {
    width: 78px !important;
    left: -66px !important;
    top: 48% !important;
    transform: rotate(9deg) translateY(-50%) !important;
  }

  /* Bağlantı ucu: küçük mavi node */
  .performans-gorseli .yazilim-karti i,
  .performans-gorseli .google-karti i,
  .performans-gorseli .meta-karti i {
    color: #7bc8ff !important;
  }

  .performans-gorseli .hareketli-bilgi-karti:hover,
  .performans-gorseli .premium-floating-kart:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.30), 0 0 24px rgba(18,148,215,.16) !important;
  }
}

/* Orta ekranlarda dışa taşma daha kontrollü olsun */
@media (max-width: 1200px) and (min-width: 821px) {
  .performans-gorseli .yazilim-karti {
    right: -18px !important;
    top: -24px !important;
    width: 260px !important;
  }

  .performans-gorseli .google-karti {
    left: -28px !important;
    bottom: 150px !important;
    width: 230px !important;
  }

  .performans-gorseli .meta-karti {
    right: -28px !important;
    bottom: 62px !important;
    width: 240px !important;
  }

  .performans-gorseli .yazilim-karti::before,
  .performans-gorseli .google-karti::before,
  .performans-gorseli .meta-karti::before {
    width: 52px !important;
  }
}

/* Mobilde dış floating yerine akışta kart */
@media (max-width: 820px) {
  .performans-gorseli .hareketli-bilgi-karti,
  .performans-gorseli .premium-floating-kart {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: none !important;
    animation: none !important;
  }

  .performans-gorseli .hareketli-bilgi-karti::before,
  .performans-gorseli .premium-floating-kart::before {
    display: none !important;
  }
}


/* =========================================================
   v04 | MOBİL MENÜ AÇILMA DÜZELTMESİ
   Sorun:
   - JavaScript menüye .active class'ı ekliyor.
   - Mobil CSS tarafında menünün açık hali yeterince net tanımlı olmadığı için menü görünmüyordu.
   Çözüm:
   - #mobileNav.active ve .mobil-menu-buton.active durumları net şekilde tanımlandı.
   ========================================================= */

@media (max-width: 820px) {
  .menu-satiri {
    position: relative !important;
  }

  .mobil-menu-buton {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    position: relative !important;
    z-index: 1200 !important;
  }

  #mobileNav,
  .nav#mobileNav {
    display: flex !important;
    position: absolute !important;
    top: calc(100% + 14px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 16px !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid rgba(11,97,175,.12) !important;
    box-shadow: 0 22px 55px rgba(17,44,78,.16) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-10px) scale(.98) !important;
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease !important;
    z-index: 1100 !important;
  }

  #mobileNav.active,
  .nav#mobileNav.active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }

  #mobileNav a,
  .nav#mobileNav a {
    width: 100% !important;
    padding: 13px 16px !important;
    border-radius: 15px !important;
    background: rgba(11,97,175,.06) !important;
    color: var(--primary) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
  }

  #mobileNav a:hover,
  .nav#mobileNav a:hover {
    background: linear-gradient(135deg, var(--primary), var(--primary-bright)) !important;
    color: #ffffff !important;
  }

  .mobil-menu-buton.active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg) !important;
  }

  .mobil-menu-buton.active span:nth-child(2) {
    opacity: 0 !important;
  }

  .mobil-menu-buton.active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg) !important;
  }
}


/* =========================================================
   v05 | MOBİL MENÜ HARD FIX
   Bu çözüm JS include/event çakışması olsa bile inline onclick + CSS ile çalışır.
   ========================================================= */

@media (max-width: 820px) {
  .header {
    overflow: visible !important;
  }

  .menu-satiri {
    position: relative !important;
    overflow: visible !important;
  }

  .mobil-menu-buton {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 0 !important;
    position: relative !important;
    z-index: 5001 !important;
    cursor: pointer !important;
  }

  #mobileNav,
  .nav#mobileNav {
    display: flex !important;
    position: absolute !important;
    top: calc(100% + 12px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: calc(100vh - 130px) !important;
    overflow-y: auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 16px !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.98) !important;
    border: 1px solid rgba(11,97,175,.14) !important;
    box-shadow: 0 24px 60px rgba(17,44,78,.18) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-12px) scale(.98) !important;
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease !important;
    z-index: 5000 !important;
  }

  #mobileNav.active,
  #mobileNav.mobil-menu-acik,
  .nav#mobileNav.active,
  .nav#mobileNav.mobil-menu-acik,
  body.mobil-menu-acik #mobileNav {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }

  #mobileNav a,
  .nav#mobileNav a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 12px 16px !important;
    border-radius: 15px !important;
    background: rgba(11,97,175,.06) !important;
    color: var(--primary) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
  }

  .mobil-menu-buton.active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg) !important;
  }

  .mobil-menu-buton.active span:nth-child(2) {
    opacity: 0 !important;
  }

  .mobil-menu-buton.active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg) !important;
  }
}


/* =========================================================
   v18 | HAKKIMDA PROFİL KARTI TAM PAKET DÜZELTME
   Amaç:
   - Profil fotoğrafını büyük ve dikey tutmak.
   - Sağdaki yazıların fotoğrafın üstüne binmesini engellemek.
   - Profil kartını grid yapısına alarak fotoğraf ve metni net ayırmak.
   - Tek dosya/tek ZIP güncelleme yapısına geçmek.
   ========================================================= */

.hakkimda-yerlesim.genis-hakkimda {
  grid-template-columns: minmax(0, 1fr) minmax(560px, 640px);
  align-items: center;
  gap: clamp(36px, 5vw, 76px);
}

.profil-karti-v7 {
  width: 100%;
  display: grid !important;
  grid-template-columns: 245px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 28px !important;
  padding: 28px !important;
  overflow: hidden !important;
}

.profil-gorseli-v7 {
  width: 245px !important;
  height: 340px !important;
  min-width: 245px !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, rgba(11,97,175,.10), rgba(18,148,215,.06));
  box-shadow: 0 22px 55px rgba(11, 23, 42, .14);
  align-self: center;
}

.profil-gorseli-v7 img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: inherit !important;
  display: block;
}

.profil-bilgisi-v7 {
  min-width: 0 !important;
  align-self: center !important;
}

.profil-bilgisi-v7 .profil-etiketi {
  max-width: 100%;
  white-space: normal;
  line-height: 1.25;
}

.profil-bilgisi-v7 h3,
.profil-bilgisi-v7 p {
  max-width: 100%;
}

.profil-bilgisi-v7 p {
  line-height: 1.62;
}

.profil-bilgisi-v7 .uzmanlik-etiketleri {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profil-bilgisi-v7 .uzmanlik-etiketleri span {
  min-width: 0;
  text-align: center;
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .hakkimda-yerlesim.genis-hakkimda {
    grid-template-columns: 1fr;
  }

  .profil-karti-v7 {
    max-width: 680px;
    margin: 0 auto;
  }
}

@media (max-width: 720px) {
  .profil-karti-v7 {
    grid-template-columns: 1fr !important;
    text-align: center;
    padding: 24px !important;
  }

  .profil-gorseli-v7 {
    width: min(260px, 78vw) !important;
    height: 330px !important;
    min-width: 0 !important;
    margin: 0 auto 4px !important;
  }

  .profil-bilgisi-v7 .uzmanlik-etiketleri {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profil-bilgisi-v7 .sosyal-medya-butonlari {
    justify-content: center;
  }
}

@media (max-width: 460px) {
  .profil-gorseli-v7 {
    width: min(220px, 78vw) !important;
    height: 290px !important;
  }

  .profil-bilgisi-v7 .uzmanlik-etiketleri {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   v19 | HAKKIMDA PROFİL YAZI ALANI GENİŞLETME
   Amaç:
   - Profil fotoğrafı yanındaki içerik alanını genişletmek.
   - Fotoğraf boyutunu koruyup kart içindeki metin kolonuna daha fazla alan vermek.
   - Sayfa genel grid yapısını bozmadan sadece hakkımda/profil kartı alanını iyileştirmek.
   ========================================================= */

.hakkimda-yerlesim.genis-hakkimda {
  grid-template-columns: minmax(0, 1fr) minmax(620px, 720px);
  gap: clamp(34px, 4.6vw, 70px);
}

.profil-karti-v7 {
  grid-template-columns: 235px minmax(0, 1fr) !important;
  gap: 24px !important;
  padding: 26px !important;
}

.profil-gorseli-v7 {
  width: 235px !important;
  min-width: 235px !important;
}

.profil-bilgisi-v7 {
  width: 100%;
  max-width: none !important;
}

.profil-bilgisi-v7 p {
  max-width: 410px;
}

@media (max-width: 1180px) {
  .hakkimda-yerlesim.genis-hakkimda {
    grid-template-columns: 1fr;
  }

  .profil-karti-v7 {
    max-width: 720px;
  }
}

@media (max-width: 720px) {
  .profil-karti-v7 {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .profil-gorseli-v7 {
    width: min(260px, 78vw) !important;
    min-width: 0 !important;
  }

  .profil-bilgisi-v7 p {
    max-width: 100%;
  }
}


/* =========================================================
   v21 | HAKKIMDA PROFİL KARTI DENGE REVİZESİ + IP LİSANS MUAFİYETİ
   Amaç:
   - Profil fotoğrafı güzel büyük görünümü korusun ama metin alanını sıkıştırmasın.
   - Fotoğraf alanı bir tık küçültüldü.
   - Sağ kartın metin kolonu genişletildi.
   - Sol başlık/metin alanı daha dengeli nefes alacak şekilde grid oranı ayarlandı.
   ========================================================= */

.hakkimda-yerlesim.genis-hakkimda {
  grid-template-columns: minmax(520px, 1.08fr) minmax(560px, 640px);
  gap: clamp(38px, 5vw, 72px);
}

.profil-karti-v7 {
  grid-template-columns: 215px minmax(0, 1fr) !important;
  gap: 24px !important;
  padding: 26px 28px !important;
}

.profil-gorseli-v7 {
  width: 215px !important;
  height: 315px !important;
  min-width: 215px !important;
}

.profil-bilgisi-v7 {
  min-width: 0 !important;
  width: 100% !important;
}

.profil-bilgisi-v7 p {
  max-width: 100% !important;
  line-height: 1.58;
}

.profil-bilgisi-v7 .profil-etiketi {
  max-width: 100%;
  white-space: normal;
}

.profil-bilgisi-v7 .uzmanlik-etiketleri {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.profil-bilgisi-v7 .uzmanlik-etiketleri span {
  white-space: nowrap;
}

@media (max-width: 1240px) {
  .hakkimda-yerlesim.genis-hakkimda {
    grid-template-columns: 1fr;
  }

  .profil-karti-v7 {
    max-width: 660px;
    margin: 0 auto;
  }
}

@media (max-width: 720px) {
  .profil-karti-v7 {
    grid-template-columns: 1fr !important;
    text-align: center;
    padding: 24px !important;
  }

  .profil-gorseli-v7 {
    width: min(240px, 78vw) !important;
    height: 300px !important;
    min-width: 0 !important;
    margin: 0 auto 4px !important;
  }

  .profil-bilgisi-v7 .sosyal-medya-butonlari {
    justify-content: center;
  }
}

@media (max-width: 460px) {
  .profil-gorseli-v7 {
    width: min(210px, 78vw) !important;
    height: 275px !important;
  }

  .profil-bilgisi-v7 .uzmanlik-etiketleri {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   v23 | FAQ ALANI YAZI STİLİ DÜZELTİLMİŞ TASARIM
   Amaç:
   - Hakkımda alanındaki eski başlık/font stilini bozmamak.
   - FAQ alanını mevcut site başlık sistemiyle uyumlu yapmak.
   - Fazla agresif özel başlık font/formatlarını kaldırmak.
   ========================================================= */

.faq-section {
  position: relative;
  overflow: hidden;
  padding-top: clamp(72px, 8vw, 115px);
  padding-bottom: clamp(72px, 8vw, 115px);
}

.faq-section::before {
  content: "";
  position: absolute;
  inset: 8% auto auto 50%;
  width: 640px;
  height: 640px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: radial-gradient(circle, rgba(18,148,215,.10), rgba(18,148,215,0) 68%);
  pointer-events: none;
}

.faq-section .bolum-basligi {
  position: relative;
  z-index: 1;
  margin-bottom: 34px;
}

.faq-section .bolum-basligi h2 {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

.faq-section .bolum-basligi p {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.faq-panel {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
  width: min(920px, 100%);
  margin: 0 auto;
}

.faq-kart {
  position: relative;
  border-radius: 24px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(11,97,175,.10);
  box-shadow: 0 18px 46px rgba(17,44,78,.06);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
}

.faq-kart:hover {
  transform: translateY(-3px);
  border-color: rgba(11,97,175,.20);
  box-shadow: 0 24px 60px rgba(17,44,78,.10);
}

.faq-kart.aktif {
  background: rgba(255,255,255,.96);
  border-color: rgba(11,97,175,.22);
  box-shadow: 0 26px 70px rgba(17,44,78,.12);
}

.faq-soru {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 22px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  text-align: left;
  cursor: pointer;
  color: var(--dark);
  font-family: inherit;
  font-size: 18px;
  font-weight: 850;
  line-height: 1.4;
}

.faq-soru i {
  width: 38px;
  height: 38px;
  min-width: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  color: var(--primary);
  background: rgba(11,97,175,.08);
  transition: transform .25s ease, color .25s ease, background .25s ease;
}

.faq-kart.aktif .faq-soru i {
  transform: rotate(45deg);
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-bright));
}

.faq-cevap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .28s ease;
}

.faq-cevap p {
  overflow: hidden;
  margin: 0;
  padding: 0 24px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.75;
}

.faq-kart.aktif .faq-cevap {
  grid-template-rows: 1fr;
}

.faq-kart.aktif .faq-cevap p {
  padding-bottom: 24px;
}

@media (max-width: 560px) {
  .faq-soru {
    padding: 19px 18px;
    font-size: 16px;
  }

  .faq-cevap p {
    padding-left: 18px;
    padding-right: 18px;
    font-size: 15px;
  }

  .faq-kart.aktif .faq-cevap p {
    padding-bottom: 20px;
  }
}