:root{
  --bg:#f6f8fc;
  --card: rgba(255,255,255,.78);
  --stroke: rgba(15,23,42,.10);
  --text:#0f172a;
  --muted: rgba(15,23,42,.70);
  --primary:#165dff;
  --primary-2:#0b3bd6;
  --wa:#22c55e;

  /* PERF: gölgeleri hafiflettik */
  --shadow: 0 14px 40px rgba(2,6,23,.08);
  --shadow2: 0 8px 22px rgba(2,6,23,.06);

  --r: 18px;
  --r2: 26px;
  --container: 1140px;
}

*{box-sizing:border-box}

html{
  text-size-adjust:100%;
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  font-synthesis:none;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(1200px 520px at 18% 10%, rgba(22,93,255,.16), transparent 60%),
    radial-gradient(900px 460px at 85% 0%, rgba(34,197,94,.12), transparent 60%),
    var(--bg);
  color:var(--text);
}

a{color:inherit}
img{display:block;max-width:100%}
.container{max-width:var(--container); margin:0 auto; padding:0 18px}
.accent{color:var(--primary)}

/* =========================
   CLS FIX (kritik)
   ========================= */

/* Sticky header yüklenirken yükseklik değişmesin */
header{ min-height:74px; }

/* JS ile dolan alanlara (chips/blog) önceden yer ayır */
#bolgeler .chips{ min-height:220px; }
#blog .blog-track{ min-height:460px; }

@media (min-width:981px){
  #bolgeler .chips{ min-height:120px; }
  #blog .blog-track{ min-height:420px; }
}

/* =========================
   Header
   ========================= */
header{
  position:sticky; top:0; z-index:50;
  background: rgba(246,248,252,.75);

  /* PERF: blur düşürüldü */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  border-bottom:1px solid rgba(15,23,42,.08);
}

/* blur yoksa düz arka plan */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  header{ background: rgba(246,248,252,.92); }
}

.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:14px}
.brand{display:flex;gap:12px;align-items:center;text-decoration:none}
.logo{
  width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
  background: linear-gradient(135deg, rgba(22,93,255,.95), rgba(11,59,214,.92));
  color:#fff;box-shadow:var(--shadow2)
}
.brand b{display:block;font-weight:900}
.brand span{display:block;font-size:12px;color:var(--muted);font-weight:700}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:10px;align-items:center}
nav a{
  text-decoration:none;font-weight:800;color:rgba(15,23,42,.78);
  padding:10px 12px;border-radius:999px;transition:.2s
}
nav a:hover{background: rgba(255,255,255,.70); box-shadow: var(--shadow2)}
.nav-cta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* Buttons */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 16px;border-radius:999px;border:1px solid var(--stroke);
  background: rgba(255,255,255,.72);box-shadow: var(--shadow2);
  text-decoration:none;font-weight:900;transition:.2s;white-space:nowrap
}
.btn:hover{transform: translateY(-2px)}
.btn.primary{background: linear-gradient(135deg, rgba(22,93,255,.95), rgba(11,59,214,.92)); color:#fff; border-color:transparent}
.btn.whatsapp{background: linear-gradient(135deg, rgba(34,197,94,.95), rgba(16,185,129,.92)); color:#fff; border-color:transparent}

/* Hero */
.hero{padding:28px 0 18px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:stretch}
.panel{
  border:1px solid rgba(15,23,42,.10);
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--shadow);
  overflow:hidden
}
.hero-left{padding:24px;display:flex;flex-direction:column;gap:16px;min-height:470px}
.badge{
  display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:999px;
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.72);
  width:fit-content;font-weight:900;color: rgba(15,23,42,.78)
}
.badge i{color:var(--primary)}
h1{margin:0;font-size:44px;line-height:1.06;letter-spacing:-.8px}
.lead{margin:0;color:var(--muted);font-weight:650;line-height:1.7}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}
.pill{
  display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.68);
  box-shadow: var(--shadow2);font-weight:850;color: rgba(15,23,42,.76)
}

/* Slider */
.slider{padding:14px;display:grid;gap:12px}
.slider-frame{
  position:relative;height:310px;border-radius:22px;border:1px solid rgba(15,23,42,.10);
  background:#fff;box-shadow: var(--shadow2);overflow:hidden
}
.slides{
  height:100%;
  display:flex;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
  will-change:auto; /* PERF */
}
.slide{min-width:100%;height:100%;position:relative;overflow:hidden}

/* PERF: filter/scale kaldırıldı */
.slide img{
  width:100%;height:100%;
  object-fit:cover;
  transform:none;
  filter:none;
}

.slide::after{content:"";position:absolute;inset:0;background: linear-gradient(180deg, rgba(15,23,42,.00), rgba(15,23,42,.40));pointer-events:none}
.slide-cap{
  position:absolute;left:14px;right:14px;bottom:14px;background: rgba(255,255,255,.86);
  border:1px solid rgba(15,23,42,.10);border-radius:16px;padding:10px 12px;box-shadow: var(--shadow2);display:grid;gap:2px
}
.slide-cap b{font-size:13px;font-weight:950}
.slide-cap span{font-size:12px;color:var(--muted);font-weight:750}
.slide-cap i{color:var(--primary)}
.slide-cap .fa-whatsapp,.slide-cap .fa-plane-departure{color:var(--wa)}
.slider-ui{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dots{display:flex;gap:8px;align-items:center}
.dot{
  width:9px;height:9px;border-radius:999px;border:1px solid rgba(15,23,42,.18);
  background: rgba(255,255,255,.70);cursor:pointer;transition:.2s
}
.dot.active{width:22px;background: rgba(22,93,255,.90);border-color:transparent}
.navbtn{
  width:44px;height:44px;border-radius:14px;border:1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.75);box-shadow: var(--shadow2);cursor:pointer;
  display:grid;place-items:center;transition:.2s
}
.navbtn:hover{transform: translateY(-2px)}
.navbtn i{color: rgba(15,23,42,.75)}

/* Sections */
section{padding:22px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.sec-head h2{margin:0;font-size:24px;letter-spacing:-.4px}
.sec-head p{margin:0;color:var(--muted);font-weight:650}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.72);
  border-radius: var(--r);box-shadow: var(--shadow2);padding:16px
}
.ic{
  width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
  background: rgba(22,93,255,.10);border:1px solid rgba(15,23,42,.08);margin-bottom:10px
}
.ic i{color:var(--primary)}
.card h3{margin:0 0 6px;font-size:16px;font-weight:950}
.card p{margin:0;color:var(--muted);font-weight:650;line-height:1.6}
.card-title{margin:0 0 6px;font-weight:950}
.card-desc{margin:0;color:var(--muted);font-weight:650;line-height:1.6}
.card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

/* Regions */
.searchbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.input{
  flex:1;min-width:240px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:999px;
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.72);box-shadow: var(--shadow2);
  color: rgba(15,23,42,.75);font-weight:800
}
.input i{opacity:.7}
.input input{width:100%;border:none;outline:none;background:transparent;color:var(--text);font:inherit}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.chip{
  display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.72);box-shadow: var(--shadow2);
  font-weight:900;color: rgba(15,23,42,.80);user-select:none
}
.chip i{color:var(--primary)}
.chip small{color: rgba(15,23,42,.55);font-weight:900}

/* Blog */
.blog-wrap{
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.62);
  border-radius: var(--r2);box-shadow: var(--shadow);padding:14px;overflow:hidden
}
.blog-top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:6px 6px 12px}
.blog-top h2{margin:0;font-size:24px;letter-spacing:-.4px}
.blog-top p{margin:6px 0 0;color:var(--muted);font-weight:650;line-height:1.6;max-width:760px}
.blog-nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.blog-track{
  display:flex;gap:12px;overflow:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px;
  -webkit-overflow-scrolling: touch
}
.blog-track::-webkit-scrollbar{height:10px}
.blog-track::-webkit-scrollbar-thumb{background: rgba(15,23,42,.12);border-radius:999px}
.post{
  scroll-snap-align:start;min-width:320px;max-width:360px;border:1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.82);border-radius:20px;box-shadow: var(--shadow2);overflow:hidden;
  display:flex;flex-direction:column;transform: translateZ(0)
}
.post .thumb{position:relative;height:170px;overflow:hidden;background:#fff}
.post .thumb img{width:100%;height:100%;object-fit:cover;transform:none}
.post .thumb::after{content:"";position:absolute;inset:0;background: linear-gradient(180deg, rgba(15,23,42,.00), rgba(15,23,42,.35));pointer-events:none}
.post .content{padding:14px;display:grid;gap:8px}
.post h3{margin:0;font-size:16px;font-weight:950;letter-spacing:-.2px}
.post p{margin:0;color:var(--muted);font-weight:650;line-height:1.65;font-size:13px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.tag{
  display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.74);color: rgba(15,23,42,.76);
  font-weight:900;font-size:12px;user-select:none
}
.tag i{color:var(--primary)}
.post .actions{margin-top:auto;padding:12px 10px 14px;display:flex;gap:10px;flex-wrap:wrap}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
.kv{display:grid;gap:10px}
.k{
  display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius: var(--r);
  border:1px solid rgba(15,23,42,.10);background: rgba(255,255,255,.72);box-shadow: var(--shadow2)
}
.k i{margin-top:2px;color: var(--primary)}
.k b{display:block;font-size:14px;font-weight:950}
.k span{display:block;margin-top:2px;color: var(--muted);font-weight:700;font-size:13px}
.k a{text-decoration:none;font-weight:950}
.map{
  border-radius: var(--r);border:1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.72);box-shadow: var(--shadow2);overflow:hidden;min-height:260px
}
.map iframe{width:100%;height:100%;border:0}

/* Footer */
footer{padding:22px 0 28px;border-top:1px solid rgba(15,23,42,.08);color: rgba(15,23,42,.70);font-weight:750}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footer-cta{display:flex;gap:10px;flex-wrap:wrap}

/* Floating bubbles */
.floating-bubbles{
  position:fixed;left:20px;bottom:20px;z-index:9999;display:flex;flex-direction:column;gap:14px
}
.bubble{
  position:relative;display:flex;align-items:center;width:58px;height:58px;border-radius:50px;border:none;cursor:pointer;
  -webkit-tap-highlight-color: transparent;
  /* PERF: blur kaldırıldı */
  color:#fff;font-size:22px;box-shadow:0 8px 20px rgba(0,0,0,.25);
  transition:width .35s cubic-bezier(.4,0,.2,1),filter .25s ease,box-shadow .3s ease;
  overflow:hidden;padding:0 18px;transform: translateZ(0)
}
.bubble i{flex-shrink:0;z-index:2}
.bubble-text{
  margin-left:12px;font-size:15px;font-weight:800;opacity:0;transform:translateX(-10px);
  transition: opacity .25s ease, transform .25s ease;
  white-space:nowrap;color:#fff
}
.bubble.call{background:linear-gradient(135deg,#165dff,#0b3bd6)}
.bubble.whatsapp{background:linear-gradient(135deg,#22c55e,#15803d)}
.bubble::before{
  content:"";position:absolute;left:10px;width:38px;height:38px;border-radius:50%;
  border:2px solid rgba(255,255,255,.45);animation:pulseBubble 1.6s infinite;pointer-events:none
}
@keyframes pulseBubble{0%{transform:scale(1);opacity:.9}70%{transform:scale(1.45);opacity:0}100%{transform:scale(1.45);opacity:0}}
.bubble.is-open{width:210px}
.bubble.is-open .bubble-text{opacity:1;transform:translateX(0)}

/* Hover efektlerini sadece mouse'lu cihazlarda çalıştır */
@media (hover:hover) and (pointer:fine){
  .bubble:hover{width:210px;filter:brightness(1.05);box-shadow:0 12px 28px rgba(0,0,0,.30)}
  .bubble:hover .bubble-text{opacity:1;transform:translateX(0)}
}

/* Motion azaltma */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; }
  .slides{ transition:none !important; }
  .bubble::before{ animation:none !important; }
  .btn, .navbtn{ transition:none !important; }
  .btn:hover, .navbtn:hover{ transform:none !important; }
}

/* İzolasyon */
section, footer, .blog-wrap, .panel, .card, .post, .map{ contain: content; }

/* Responsive */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  nav ul{display:none}
  .grid3{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  h1{font-size:36px}
  .slider-frame{height:260px}
}
@media (max-width:480px){
  .floating-bubbles{left:14px;bottom:14px;gap:12px}
  .bubble{width:54px;height:54px;padding:0 16px}
  .post{min-width:285px}
}

/* ===== CLS FIX: FontAwesome ikonları geç gelince satır kırılmasın ===== */
.logo i{ display:inline-block; width:22px; text-align:center; }
.btn i{ display:inline-block; width:18px; text-align:center; }
.navbtn i{ display:inline-block; width:18px; text-align:center; }
.badge i, .pill i, .chip i, .tag i{ display:inline-block; width:16px; text-align:center; }

/* Header'da CTA satırı kırılmasını azalt */
.nav-cta{ flex-wrap:nowrap; }
@media (max-width:980px){
  .nav-cta{ flex-wrap:wrap; }
}

/* Header yüksekliği stabil */
header{ min-height: 78px; }

#hizmetler{ contain-intrinsic-size: 520px; }
#bolgeler{ contain-intrinsic-size: 720px; }
#blog{ contain-intrinsic-size: 620px; }
#iletisim{ contain-intrinsic-size: 520px; }
footer{ contain-intrinsic-size: 140px; }

/* WhatsApp kart */
.k:has(a[data-wa]){
  position:relative;
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 18px;
  border-radius:18px;
  background:linear-gradient(135deg,#25D366,#128C7E);
  color:#fff;
  box-shadow:0 10px 25px rgba(37,211,102,.35);
  transition:.35s ease;
  overflow:hidden;
}

/* ikon alanı */
.k:has(a[data-wa]) i{
  font-size:22px;
  color:#fff; /* ← ikon beyaz */
  background:rgba(255,255,255,.18);
  padding:13px;
  border-radius:50%;
  animation:waPulse 1.8s infinite;
}

/* pulse animasyonu */
@keyframes waPulse{
  0%{
    box-shadow:0 0 0 0 rgba(255,255,255,.6);
  }
  70%{
    box-shadow:0 0 0 12px rgba(255,255,255,0);
  }
  100%{
    box-shadow:0 0 0 0 rgba(255,255,255,0);
  }
}

/* hover efekti */
.k:has(a[data-wa]):hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(37,211,102,.55);
}

/* parlama efekti */
.k:has(a[data-wa])::after{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:120%;
  height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);
  transition:.6s;
}

.k:has(a[data-wa]):hover::after{
  left:120%;
}

/* link */
.k:has(a[data-wa]) a{
  color:#fff;
  font-weight:700;
  text-decoration:none;
}

/* mobil dokunma efekti */
@media (hover:none){
  .k:has(a[data-wa]):active{
    transform:scale(.96);
  }
}

