/* ============================================================
   PrestijCold — kurumsal tasarım sistemi (Koç Holding referanslı)
   Marka: mavi #0070A0 · koyu #183038 · beyaz zemin
   ============================================================ */

:root {
  --mavi: #0070A0;
  --mavi-koyu: #005A82;
  --lacivert: #183038;
  --lacivert-derin: #0E2233;
  --metin: #2A3439;
  --metin-soluk: #5B6770;
  --cizgi: #E3E8EB;
  --zemin: #FFFFFF;
  --zemin-yumusak: #F5F8FA;
  --font: "Figtree", "Segoe UI", system-ui, sans-serif;
  --orta: 1280px;
  --gecis: 0.3s ease;
  --golge: 0 10px 34px rgba(24, 48, 56, 0.10);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body {
  font-family: var(--font);
  color: var(--metin);
  background: var(--zemin);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
::selection { background: var(--mavi); color: #fff; }

.orta { max-width: var(--orta); margin: 0 auto; padding: 0 clamp(1.1rem, 3.5vw, 2rem); }
.orta.dar { max-width: 880px; }
.atlama {
  position: absolute; left: -9999px; top: 0; z-index: 300;
  background: var(--lacivert); color: #fff; padding: 0.6rem 1.2rem;
}
.atlama:focus { left: 0; }

h1, h2, h3 { font-weight: 700; color: var(--lacivert); line-height: 1.18; letter-spacing: -0.015em; }

/* ---------- butonlar / bağlantılar ---------- */
.btn {
  display: inline-block; text-decoration: none; cursor: pointer;
  font-family: var(--font); font-weight: 600; font-size: 0.95rem;
  padding: 0.78rem 1.7rem; border-radius: 6px; border: 2px solid transparent;
  transition: background var(--gecis), color var(--gecis), border-color var(--gecis), transform 0.2s;
}
.btn.buyuk { padding: 0.95rem 2.4rem; font-size: 1rem; }
.btn-dolu { background: var(--mavi); color: #fff; }
.btn-dolu:hover { background: var(--mavi-koyu); }
.btn-cerceve { border-color: var(--lacivert); color: var(--lacivert); background: transparent; }
.btn-cerceve:hover { background: var(--lacivert); color: #fff; }
.btn-beyaz { background: #fff; color: var(--lacivert); }
.btn-beyaz:hover { transform: translateY(-2px); }

.cizgi-baglanti {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-weight: 600; font-size: 0.95rem; color: var(--mavi);
  text-decoration: none; position: relative; padding-bottom: 3px;
  width: fit-content;
}
.cizgi-baglanti::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: 100%;
  background: currentColor; transform: scaleX(0.35); transform-origin: left;
  transition: transform var(--gecis);
}
.cizgi-baglanti:hover::after { transform: scaleX(1); }
.cizgi-baglanti i { font-style: normal; transition: transform var(--gecis); }
.cizgi-baglanti:hover i { transform: translateX(4px); }
.cizgi-baglanti.acik { color: #9FD6EF; }

.ust-etiket {
  display: inline-block; font-size: 0.8rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--mavi);
  margin-bottom: 0.7rem;
}

/* ---------- üst bar ---------- */
.ust {
  position: sticky; top: 0; z-index: 100;
  background: #fff; border-bottom: 1px solid var(--cizgi);
}
.ust-ic {
  max-width: 1400px; margin: 0 auto;
  display: flex; align-items: center; gap: 1.6rem;
  padding: 0.85rem clamp(1.1rem, 3vw, 2rem);
}
.marka img { height: 44px; width: auto; }
.nav { margin-left: auto; }
.nav-liste { list-style: none; display: flex; }
.nav-baglanti {
  display: flex; align-items: center; gap: 0.35rem;
  padding: 1.05rem 0.95rem; text-decoration: none;
  font-weight: 600; font-size: 0.98rem; color: var(--lacivert);
  position: relative; white-space: nowrap;
}
.nav-baglanti::after {
  content: ""; position: absolute; left: 0.95rem; right: 0.95rem; bottom: 0.62rem;
  height: 2.5px; background: var(--mavi); transform: scaleX(0); transform-origin: left;
  transition: transform var(--gecis);
}
.nav-oge:hover .nav-baglanti::after, .nav-baglanti.aktif::after { transform: scaleX(1); }
.nav-baglanti .ok { transition: transform var(--gecis); color: var(--metin-soluk); }
.nav-oge:hover .ok { transform: rotate(180deg); }

/* mega menü */
.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  background: #fff; border-top: 1px solid var(--cizgi);
  box-shadow: 0 26px 40px rgba(24, 48, 56, 0.13);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}
.nav-oge { position: static; }
.nav-oge:hover .mega, .nav-oge:focus-within .mega {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.mega-ic {
  max-width: var(--orta); margin: 0 auto;
  display: grid; grid-template-columns: 380px 1fr; gap: 3rem;
  padding: 2.2rem clamp(1.1rem, 3vw, 2rem) 2.6rem;
}
.mega-gorsel { position: relative; display: block; border-radius: 8px; overflow: hidden; text-decoration: none; }
.mega-gorsel img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; transition: transform 0.5s ease; }
.mega-gorsel:hover img { transform: scale(1.05); }
.mega-gorsel-yazi {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 2.2rem 1.3rem 1.1rem;
  background: linear-gradient(transparent, rgba(14, 34, 51, 0.85));
  color: #fff; font-weight: 700; font-size: 1.25rem;
}
.mega-gorsel-yazi em {
  display: block; font-style: normal; font-weight: 600; font-size: 0.85rem;
  color: #BFE3F5; margin-top: 0.2rem;
}
.mega-liste {
  list-style: none; align-self: start;
  display: grid; grid-template-columns: repeat(2, minmax(220px, 320px)); gap: 0 3rem;
}
.mega-liste a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.85rem 0.2rem; text-decoration: none;
  font-weight: 600; font-size: 1.02rem; color: var(--lacivert);
  border-bottom: 1px solid var(--cizgi);
  transition: color var(--gecis), padding-left var(--gecis);
}
.mega-liste a:hover { color: var(--mavi); padding-left: 0.5rem; }
.mega-liste svg { color: var(--mavi); flex-shrink: 0; }

.ust-tel {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-weight: 600; font-size: 0.92rem; color: var(--lacivert);
  text-decoration: none; white-space: nowrap;
}
.ust-tel:hover { color: var(--mavi); }
.ust-tel svg { color: var(--mavi); }
.hamburger { display: none; }

/* mobil menü */
.mobil-menu {
  position: fixed; inset: 0; top: 63px; z-index: 90;
  background: #fff; padding: 1.6rem 1.4rem 3rem;
  overflow-y: auto;
  transform: translateX(100%); transition: transform 0.35s ease;
}
.mobil-menu.acik { transform: translateX(0); }
.mobil-grup { border-bottom: 1px solid var(--cizgi); padding: 0.6rem 0; }
.mobil-baglanti { display: block; font-weight: 700; font-size: 1.15rem; color: var(--lacivert); text-decoration: none; padding: 0.45rem 0; }
.mobil-alt { display: block; font-size: 0.97rem; color: var(--metin-soluk); text-decoration: none; padding: 0.3rem 0 0.3rem 1rem; }
.mobil-menu .btn { margin-top: 1.4rem; width: 100%; text-align: center; }

/* ---------- menü ikonları ---------- */
.mi { flex-shrink: 0; }
.nav-baglanti .mi { color: var(--mavi); }
.mega-liste a { align-items: center; gap: 0.8rem; justify-content: flex-start; }
.mega-ikon {
  display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0;
  border-radius: 9px; background: rgba(0, 112, 160, 0.09); color: var(--mavi);
  transition: background var(--gecis), color var(--gecis);
}
.mega-liste a:hover .mega-ikon { background: var(--mavi); color: #fff; }
.mega-etiket { flex: 1; }
.mega-ok { color: var(--mavi); }
.mobil-baglanti { display: flex !important; align-items: center; gap: 0.7rem; }
.mobil-baglanti .mi { color: var(--mavi); }
.mobil-alt { display: flex !important; align-items: center; gap: 0.6rem; }
.mobil-alt .mi { color: var(--mavi); opacity: 0.75; }

/* ---------- hero: Türkiye haritası sahnesi ---------- */
.hero-harita {
  background: radial-gradient(130% 150% at 80% 0%, #14395c 0%, var(--lacivert-derin) 52%, #071522 100%);
  color: #fff; overflow: hidden; position: relative;
}
.hero-harita-ic {
  display: grid; grid-template-columns: minmax(320px, 440px) 1fr;
  gap: clamp(2rem, 4vw, 4rem); align-items: center;
  min-height: min(86vh, 860px); padding-top: 3rem; padding-bottom: 3.5rem;
}
.hero-ust-etiket {
  display: block; font-size: 0.76rem; font-weight: 700; letter-spacing: 0.2em;
  color: #7EC3E8; margin-bottom: 1rem;
}
.hero-metin { opacity: 0; transform: translateY(24px); }
.yayil .hero-metin { opacity: 1; transform: none; transition: opacity 0.9s ease 0.15s, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.15s; }
.hero-metin h1 { color: #fff; font-size: clamp(2rem, 4.2vw, 3.3rem); line-height: 1.1; max-width: 16ch; }
.hero-metin > p { color: rgba(255, 255, 255, 0.82); margin: 1.2rem 0 1.7rem; max-width: 46ch; font-size: 1.05rem; }
.hero-ctalar { display: flex; gap: 0.9rem; flex-wrap: wrap; }
.btn-hero-cerceve { border-color: rgba(255, 255, 255, 0.55); color: #fff; background: transparent; }
.btn-hero-cerceve:hover { background: #fff; color: var(--lacivert); border-color: #fff; }
.hero-mini-stats { display: flex; gap: 2rem; margin-top: 2.2rem; flex-wrap: wrap; }
.hero-mini-stats strong { display: block; font-size: 1.55rem; font-weight: 800; letter-spacing: -0.02em; }
.hero-mini-stats span { font-size: 0.78rem; color: rgba(255, 255, 255, 0.62); }

.hero-harita-kap { position: relative; }
.tr-gercek { width: 100%; height: auto; display: block; filter: drop-shadow(0 18px 40px rgba(0, 0, 0, 0.35)); }
.harita-kaynak-not {
  margin-top: 1rem; text-align: center;
  font-size: 0.78rem; color: rgba(255, 255, 255, 0.45);
  opacity: 0; transition: opacity 0.8s ease 0.6s;
}
.yayil .harita-kaynak-not { opacity: 1; }

/* kamera: İstanbul'a yakın başla → uzaklaş */
.harita-kamera {
  transform-origin: var(--ist-x) var(--ist-y);
  transform: scale(2.9);
  transition: transform 2.3s cubic-bezier(0.55, 0, 0.2, 1);
  will-change: transform;
}
.uzaklas .harita-kamera { transform: scale(1); }

/* il poligonları */
.il-parca {
  fill: #12293D; stroke: #35608A; stroke-width: 0.55; stroke-linejoin: round;
  transition: fill 0.7s ease var(--g, 0ms);
}
.yayil .il-parca { fill: #1A3C5B; }
.il-parca:hover { fill: #2A5B85; transition-delay: 0ms; transition-duration: 0.2s; }
.il-parca.il-ist { fill: var(--mavi); stroke: #9FD6EF; stroke-width: 0.9; }

/* rotalar: İstanbul'dan çizilir */
.rota-yay {
  fill: none; stroke: #7EC3E8; stroke-width: 1.1; stroke-linecap: round;
  stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0.8;
}
.yayil .rota-yay { animation: rota-ciz 1.5s cubic-bezier(0.4, 0, 0.3, 1) forwards; animation-delay: var(--g, 0ms); }
@keyframes rota-ciz { to { stroke-dashoffset: 0; } }

/* il noktaları: İstanbul'dan dalga dalga yanar */
.il-nokta2 {
  fill: #57B2E3; opacity: 0;
  transform-box: fill-box; transform-origin: center; transform: scale(0.2);
}
.yayil .il-nokta2 { animation: nokta-pop 0.55s cubic-bezier(0.2, 1.6, 0.4, 1) forwards; animation-delay: var(--g, 0ms); }
@keyframes nokta-pop { to { opacity: 1; transform: scale(1); } }
.il-nokta2.nokta-ist { fill: #fff; opacity: 1; transform: none; animation: none !important; }
.nokta-ist-halka {
  fill: none; stroke: #fff; stroke-width: 1.4; opacity: 0;
  transform-box: fill-box; transform-origin: center;
}
.yayil .nokta-ist-halka { animation: halka-nabiz 2.6s ease-out infinite 0.4s; }
@keyframes halka-nabiz {
  0% { opacity: 0.85; transform: scale(1); }
  100% { opacity: 0; transform: scale(3.2); }
}

@media (max-width: 900px) {
  .hero-harita-ic { grid-template-columns: 1fr; min-height: auto; padding-top: 2.2rem; }
  .hero-harita-kap { order: -1; }
  .hero-metin h1 { max-width: none; }
}

/* ---------- slider ---------- */
.slider { position: relative; height: min(78vh, 720px); min-height: 460px; overflow: hidden; background: var(--lacivert-derin); }
.slayt { position: absolute; inset: 0; opacity: 0; transition: opacity 0.9s ease; }
.slayt.aktif { opacity: 1; z-index: 1; }
.slayt img { width: 100%; height: 100%; object-fit: cover; }
.slayt-golge {
  position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(14, 34, 51, 0.78) 0%, rgba(14, 34, 51, 0.35) 55%, rgba(14, 34, 51, 0.05) 100%);
}
.slayt-icerik {
  position: absolute; left: 0; right: 0; bottom: 0; top: 0;
  max-width: 1400px; margin: 0 auto;
  padding: 0 clamp(1.1rem, 3vw, 2rem);
  display: flex; flex-direction: column; justify-content: center;
}
.slayt-baslik {
  color: #fff; font-size: clamp(2rem, 4.6vw, 3.6rem); font-weight: 800;
  max-width: 15ch; line-height: 1.1;
}
.slayt-icerik p { color: rgba(255, 255, 255, 0.88); margin: 1rem 0 1.5rem; max-width: 52ch; font-size: 1.08rem; }
.slayt-icerik .cizgi-baglanti { color: #fff; }
.slider-noktalar {
  position: absolute; z-index: 2; bottom: 1.6rem; left: 50%; transform: translateX(-50%);
  display: flex; gap: 0.6rem;
}
.slider-nokta {
  width: 34px; height: 4px; border: none; border-radius: 2px; cursor: pointer;
  background: rgba(255, 255, 255, 0.4); transition: background var(--gecis);
}
.slider-nokta.aktif { background: #fff; }

/* ---------- bölümler ---------- */
.bolum { padding: clamp(3.4rem, 7vw, 5.6rem) 0; }
.bolum-baslik-grup { margin-bottom: 2.6rem; max-width: 780px; }
.bolum-baslik-grup.satirda {
  max-width: none; display: flex; align-items: flex-end;
  justify-content: space-between; gap: 2rem; flex-wrap: wrap;
}
.bolum h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.bolum-alt { margin-top: 0.8rem; color: var(--metin-soluk); font-size: 1.05rem; }
.giris-metin { font-size: clamp(1.05rem, 1.6vw, 1.2rem); line-height: 1.75; max-width: 70ch; color: var(--metin); }

/* rakamlar bandı */
.rakamlar { background: var(--zemin-yumusak); border-bottom: 1px solid var(--cizgi); padding: 2.6rem 0; }
.rakam-sira { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.5rem; }
.rakam { text-align: center; }
.rakam-deger {
  font-size: clamp(1.9rem, 3.4vw, 2.9rem); font-weight: 800; color: var(--mavi);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
}
.rakam-birim { font-weight: 700; color: var(--mavi); margin-left: 3px; }
.rakam-etiket { display: block; margin-top: 0.15rem; font-size: 0.86rem; font-weight: 600; color: var(--metin-soluk); }

/* hizmet kartları */
.kart-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.6rem; }
.kart-izgara.uc { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.hizmet-kart {
  display: flex; flex-direction: column; text-decoration: none;
  border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden;
  background: #fff; transition: box-shadow var(--gecis), transform var(--gecis);
}
.hizmet-kart:hover { box-shadow: var(--golge); transform: translateY(-4px); }
.hizmet-gorsel { overflow: hidden; }
.hizmet-gorsel img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; transition: transform 0.5s ease; }
.hizmet-kart:hover .hizmet-gorsel img { transform: scale(1.06); }
.hizmet-govde { display: flex; flex-direction: column; gap: 0.55rem; padding: 1.3rem 1.3rem 1.5rem; flex: 1; }
.hizmet-ad { font-weight: 700; font-size: 1.12rem; color: var(--lacivert); }
.hizmet-ozet { font-size: 0.92rem; color: var(--metin-soluk); flex: 1; }

/* ---------- 2D süreç anlatımı: duraklı kamyon hattı ---------- */
.bolum-baslik-grup.ortali { margin-left: auto; margin-right: auto; text-align: center; }
.surec-anlatim { padding: clamp(3.2rem, 6vw, 5rem) 0 1.6rem; background: #fff; }
.surec-kaydirak { overflow-x: auto; scrollbar-width: thin; }
.surec-sahne {
  position: relative; max-width: 1280px; min-width: 1000px;
  height: 330px; margin: 0 auto; padding: 0 1rem;
}
.surec-yol { position: absolute; left: 2%; right: 2%; top: 158px; height: 10px; border-radius: 6px; background: #E9EEF2; }
.surec-yol-cizgi {
  position: absolute; inset: 3px 6px; border-radius: 4px;
  background: repeating-linear-gradient(90deg, #C3CFD8 0 22px, transparent 22px 44px);
  animation: yol-ak 1.6s linear infinite;
}
@keyframes yol-ak { to { background-position: -44px 0; } }

.surec-durak { position: absolute; left: var(--yer); top: 163px; transform: translate(-50%, -50%); }
.durak-nokta {
  position: relative; z-index: 2;
  display: grid; place-items: center; width: 62px; height: 62px;
  background: #fff; border: 3px solid #C9D6DE; border-radius: 50%;
  color: var(--metin-soluk);
  animation: durak-aktif 22s linear infinite; animation-delay: var(--beklet);
}
.durak-halka {
  position: absolute; left: 50%; top: 50%; width: 62px; height: 62px; z-index: 1;
  margin: -31px 0 0 -31px; border-radius: 50%;
  border: 3px solid var(--mavi); opacity: 0;
  animation: durak-halka 22s linear infinite; animation-delay: var(--beklet);
}
.durak-etiket {
  position: absolute; left: 50%; top: 44px; transform: translateX(-50%);
  width: 200px; text-align: center; padding-top: 0.6rem;
}
.durak-etiket b {
  display: block; font-size: 0.92rem; color: var(--metin-soluk);
  animation: etiket-aktif 22s linear infinite; animation-delay: var(--beklet);
}
.durak-etiket small { display: block; font-size: 0.78rem; color: var(--metin-soluk); opacity: 0.8; margin-top: 0.2rem; line-height: 1.45; }
.surec-durak.ilk .durak-etiket { left: -26px; transform: none; text-align: left; }
.surec-durak.son .durak-etiket { left: auto; right: -26px; transform: none; text-align: right; }
@keyframes durak-aktif {
  0%, 8.5% { border-color: var(--mavi); background: var(--mavi); color: #fff; transform: scale(1.14); box-shadow: 0 10px 24px rgba(0, 112, 160, 0.35); }
  11%, 100% { border-color: #C9D6DE; background: #fff; color: var(--metin-soluk); transform: scale(1); box-shadow: none; }
}
@keyframes durak-halka {
  0% { opacity: 0.9; transform: scale(0.9); }
  8.5% { opacity: 0; transform: scale(2); }
  100% { opacity: 0; transform: scale(2); }
}
@keyframes etiket-aktif {
  0%, 8.5% { color: var(--lacivert); }
  11%, 100% { color: var(--metin-soluk); }
}

.surec-tir {
  position: absolute; top: 160px; left: 1.5%;
  transform: translate(-100%, -100%);   /* referans: tırın burnu */
  animation: tir-yolculuk 22s linear infinite;
  z-index: 1; pointer-events: none;     /* durak dairelerinin arkasından geçer */
}
.surec-tir img {
  display: block; width: auto; height: 64px;
  filter: drop-shadow(0 7px 9px rgba(24, 48, 56, 0.28));
  animation: tir-zipla 0.9s ease-in-out infinite;
}
@keyframes tir-zipla { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
@keyframes teker-don { to { transform: rotate(360deg); } }
@keyframes tir-yolculuk {
  0%      { left: 0.3%; opacity: 1; }
  7%      { left: 0.3%; }
  20%     { left: 23.3%; }
  27%     { left: 23.3%; }
  40%     { left: 46.3%; }
  47%     { left: 46.3%; }
  60%     { left: 69.3%; }
  67%     { left: 69.3%; }
  80%     { left: 92.3%; }
  88%     { left: 92.3%; opacity: 1; }
  93%     { left: 119%; opacity: 0; }
  93.05%  { left: -2%; opacity: 0; }
  97%     { left: -2%; opacity: 0; }
  100%    { left: 0.3%; opacity: 1; }
}
.soguk-pof {
  position: absolute; left: -12px; top: 16px; font-size: 0.75rem; color: #7EC3E8;
  animation: pof-savril 1.8s ease-out infinite;
}
.soguk-pof.p2 { top: 30px; font-size: 0.6rem; animation-delay: 0.9s; }
@keyframes pof-savril {
  0% { opacity: 0.9; transform: translate(0, 0) scale(0.8); }
  100% { opacity: 0; transform: translate(-26px, -8px) scale(1.3) rotate(120deg); }
}

/* ---------- sürdürülebilirlik ---------- */
.surdur { position: relative; overflow: hidden; background: linear-gradient(180deg, #F3FAF6 0%, #EAF4FB 100%); }
.ust-etiket.yesil { color: #3FA47A; }
.cizgi-baglanti.yesil { color: #2E8A64; }
.surdur-blob {
  position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none; z-index: 0;
}
.surdur-blob.b1 { width: 460px; height: 460px; left: -140px; top: -120px; background: rgba(87, 184, 148, 0.20); animation: blob-yuz 16s ease-in-out infinite alternate; }
.surdur-blob.b2 { width: 520px; height: 520px; right: -160px; bottom: -180px; background: rgba(126, 195, 232, 0.22); animation: blob-yuz 19s ease-in-out infinite alternate-reverse; }
@keyframes blob-yuz { from { transform: translate(0, 0) scale(1); } to { transform: translate(50px, 34px) scale(1.12); } }
.surdur-yaprak {
  position: absolute; z-index: 0; font-size: 1.1rem; opacity: 0;
  animation: yaprak-yuksel var(--sure, 15s) linear infinite; pointer-events: none;
}
@keyframes yaprak-yuksel {
  0% { opacity: 0; transform: translateY(30px) rotate(0deg); }
  12% { opacity: 0.55; }
  85% { opacity: 0.35; }
  100% { opacity: 0; transform: translateY(-120px) rotate(65deg); }
}
.surdur .orta { position: relative; z-index: 1; }

.surdur-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.surdur-kart {
  background: #fff; border: 1px solid rgba(63, 164, 122, 0.22); border-radius: 14px;
  padding: 1.8rem 1.6rem; text-align: left;
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.surdur-kart:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(46, 138, 100, 0.16); }
.surdur-ikon {
  display: grid; place-items: center; width: 86px; height: 86px;
  border-radius: 22px; background: linear-gradient(150deg, #F0F9F4, #E7F2FA);
  margin-bottom: 1.1rem;
}
.surdur-kart h3 { font-size: 1.12rem; margin-bottom: 0.5rem; }
.surdur-kart p { font-size: 0.92rem; color: var(--metin-soluk); }

.gunes-isin { transform-box: fill-box; transform-origin: center; animation: teker-don 14s linear infinite; }
.rota-cizim { animation: rota-cizim-ak 2.6s linear infinite; }
@keyframes rota-cizim-ak { to { stroke-dashoffset: -110; } }
.yaprak-salla { transform-box: fill-box; transform-origin: 50% 90%; animation: yaprak-sallan 3.6s ease-in-out infinite; }
@keyframes yaprak-sallan { 0%, 100% { transform: rotate(-3.5deg); } 50% { transform: rotate(3.5deg); } }
.kutu-yukle { animation: kutu-hop 3.2s ease-in-out infinite; }
.kutu-yukle.k2 { animation-delay: 1.6s; }
@keyframes kutu-hop {
  0% { opacity: 0; transform: translateY(-13px); }
  18% { opacity: 1; transform: translateY(0); }
  78% { opacity: 1; }
  92%, 100% { opacity: 0; }
}

.surdur-trend {
  margin-top: 2.6rem;
  display: grid; grid-template-columns: minmax(260px, 420px) 1fr; gap: 2.6rem; align-items: center;
  background: #fff; border: 1px solid rgba(63, 164, 122, 0.22); border-radius: 16px;
  padding: clamp(1.6rem, 3.5vw, 2.6rem);
}
.trend-svg { width: 100%; height: auto; }
.trend-cizgi { stroke-dasharray: 100; stroke-dashoffset: 100; }
.surdur-trend.geldi .trend-cizgi { animation: trend-ciz 2.2s cubic-bezier(0.4, 0, 0.2, 1) 0.3s forwards; }
@keyframes trend-ciz { to { stroke-dashoffset: 0; } }
.surdur-trend-metin h3 { font-size: 1.35rem; margin-bottom: 0.6rem; }
.surdur-trend-metin p { color: var(--metin-soluk); font-size: 0.97rem; margin-bottom: 1rem; }

@media (max-width: 900px) {
  .surdur-trend { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .surec-tir { display: none; }
  .durak-nokta { animation: none; border-color: var(--mavi); color: var(--mavi); }
  .durak-halka, .surdur-yaprak { display: none; }
  .trend-cizgi { stroke-dashoffset: 0; }
}

/* ---------- hizmet akordeonu: 5'li bitişik şerit ---------- */
.hizmet-akordeon {
  display: flex; gap: 0; height: 480px;
  border-radius: 14px; overflow: hidden;
  box-shadow: var(--golge);
  position: relative;
}
.akordeon-panel {
  position: relative; flex: 1; min-width: 0;
  display: block; text-decoration: none; overflow: hidden;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1), filter 0.45s ease;
  border-right: 2px solid rgba(255, 255, 255, 0.65);
}
.akordeon-panel:last-of-type { border-right: none; }
.akordeon-panel img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; transition: transform 0.6s ease;
}
.akordeon-golge {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14, 34, 51, 0.05) 40%, rgba(14, 34, 51, 0.82) 100%);
}
.akordeon-icerik {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 1.3rem 1.2rem 1.4rem; color: #fff;
  display: flex; flex-direction: column; gap: 0.25rem;
}
.akordeon-no { font-weight: 800; font-size: 0.85rem; color: #9FD6EF; letter-spacing: 0.08em; }
.akordeon-ad { font-weight: 700; font-size: 1.12rem; line-height: 1.25; text-shadow: 0 2px 10px rgba(0,0,0,0.35); }
.akordeon-ok {
  font-size: 1.1rem; color: #9FD6EF; margin-top: 0.3rem;
  opacity: 0; transform: translateX(-8px); transition: opacity 0.35s, transform 0.35s;
}
/* hover koreografisi: seçilen renkli + geniş, diğerleri siyah-beyaz + kısık */
.hizmet-akordeon:hover .akordeon-panel {
  filter: grayscale(1) brightness(0.72);
}
.hizmet-akordeon .akordeon-panel:hover {
  flex: 2.6; filter: none;
}
.akordeon-panel:hover img { transform: scale(1.05); }
.akordeon-panel:hover .akordeon-ok { opacity: 1; transform: translateX(0); }
.akordeon-panel:hover .akordeon-ad { font-size: 1.3rem; }

/* fareyi takip eden bilgi kartı */
.akordeon-bilgi {
  position: fixed; z-index: 60; pointer-events: none;
  width: min(300px, 70vw);
  background: #fff; border: 1px solid var(--cizgi); border-radius: 12px;
  box-shadow: 0 14px 34px rgba(24, 48, 56, 0.22);
  padding: 0.95rem 1.1rem;
  opacity: 0; transform: translateY(8px) scale(0.97);
  transition: opacity 0.22s ease, transform 0.22s ease;
}
.akordeon-bilgi.gorunur { opacity: 1; transform: translateY(0) scale(1); }
.akordeon-bilgi strong { display: block; color: var(--lacivert); font-size: 0.98rem; margin-bottom: 0.3rem; }
.akordeon-bilgi p { font-size: 0.85rem; color: var(--metin-soluk); line-height: 1.5; margin-bottom: 0.45rem; }
.akordeon-bilgi-ipucu { font-size: 0.76rem; font-weight: 700; color: var(--mavi); }

@media (max-width: 900px), (pointer: coarse) {
  .hizmet-akordeon { flex-direction: column; height: auto; }
  .akordeon-panel { height: 130px; border-right: none; border-bottom: 2px solid rgba(255,255,255,0.65); }
  .akordeon-panel:last-of-type { border-bottom: none; }
  .hizmet-akordeon:hover .akordeon-panel { filter: none; }
  .hizmet-akordeon .akordeon-panel:hover { flex: 1; }
  .akordeon-bilgi { display: none; }
  .akordeon-ok { opacity: 1; transform: none; position: absolute; right: 1.2rem; bottom: 1.3rem; }
  .akordeon-icerik { flex-direction: row; align-items: baseline; gap: 0.7rem; }
}

/* ---------- rüzgar gülü sahnesi + donmuş metin ---------- */
.tanitim-ic { position: relative; }
.tanitim-sahne { position: relative; }
.turbin { width: 100%; max-width: 430px; height: auto; display: block; margin: 0 auto; filter: drop-shadow(0 10px 18px rgba(24, 48, 56, 0.12)); }
.kanatlar {
  transform-origin: 200px 148px;
  animation: kanat-don 9s linear infinite;
}
@keyframes kanat-don { to { transform: rotate(360deg); } }
.soguk-aura { transform-origin: 200px 148px; animation: aura-nabiz 3.4s ease-out infinite; }
@keyframes aura-nabiz {
  0% { transform: scale(0.7); opacity: 0.7; }
  100% { transform: scale(1.9); opacity: 0; }
}

.kar {
  position: absolute; left: 38%; top: 26%;
  color: #7EC3E8; font-size: 1.05rem; line-height: 1;
  pointer-events: none; opacity: 0;
  animation: kar-savrul var(--sure, 11s) linear infinite;
  animation-delay: var(--gecikme, 0s);
  text-shadow: 0 0 6px rgba(159, 214, 239, 0.8);
  z-index: 3;
}
.kar:nth-child(2n) { font-size: 0.8rem; }
.kar:nth-child(3n) { font-size: 1.3rem; color: #A9D8F0; }
@keyframes kar-savrul {
  0%   { transform: translate(0, 0) rotate(0deg) scale(0.5); opacity: 0; }
  8%   { opacity: 0.95; }
  70%  { opacity: 0.85; }
  100% { transform: translate(var(--tx, 420px), var(--ty, 40px)) rotate(540deg) scale(1.15); opacity: 0; }
}

/* donmuş başlık: buz gradyanlı metin + kırağı örtüsü */
.donmus { position: relative; }
.donmus h2 {
  background: linear-gradient(175deg, #6FB6DE 0%, #3D8DBC 20%, #1B6C9C 45%, #14486B 72%, var(--lacivert) 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}
.donmus::before {
  content: ""; position: absolute; inset: -1.4rem -1.2rem; z-index: -1;
  border-radius: 18px; pointer-events: none;
  background:
    radial-gradient(230px 130px at 0% 8%, rgba(159, 214, 239, 0.30), transparent 68%),
    radial-gradient(180px 110px at 4% 55%, rgba(199, 231, 247, 0.24), transparent 70%),
    radial-gradient(150px 90px at 30% 0%, rgba(159, 214, 239, 0.18), transparent 70%);
}
.donmus .onay-liste li::before { border-color: #4FA8D8; }
.buz-sarkit {
  position: absolute; color: #9FD6EF; pointer-events: none; opacity: 0.8;
  font-size: 0.95rem; text-shadow: 0 0 5px rgba(159, 214, 239, 0.9);
  animation: sarkit-parla 3s ease-in-out infinite;
}
@keyframes sarkit-parla { 0%, 100% { opacity: 0.45; } 50% { opacity: 0.95; } }

/* harita bandı (koyu) */
.harita-bant {
  background: radial-gradient(120% 140% at 85% 10%, #14395c 0%, var(--lacivert-derin) 55%, #081826 100%);
  color: #fff; padding: clamp(3.6rem, 7vw, 6rem) 0;
}
.harita-ic { display: grid; grid-template-columns: minmax(300px, 480px) 1fr; gap: 3.5rem; align-items: center; }
.harita-metin h2 { color: #fff; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.harita-metin > p { margin: 1.1rem 0 1.8rem; color: rgba(255, 255, 255, 0.78); }
.harita-rakamlar { display: flex; gap: 2.4rem; margin-bottom: 1.8rem; flex-wrap: wrap; }
.harita-rakamlar strong { display: block; font-size: 2.1rem; font-weight: 800; letter-spacing: -0.02em; }
.harita-rakamlar span { font-size: 0.85rem; color: rgba(255, 255, 255, 0.65); }
.harita-gorsel svg { width: 100%; height: auto; }
.il-nokta { fill: #4FA8D8; animation: il-nabiz 4.2s ease-in-out infinite; }
.il-nokta.il-merkez { fill: #FFFFFF; animation: none; }
.il-rota {
  stroke: rgba(159, 214, 239, 0.6); stroke-width: 0.35; stroke-dasharray: 1.8 1.3;
  animation: rota-akis 3.6s linear infinite;
}
@keyframes il-nabiz { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
@keyframes rota-akis { to { stroke-dashoffset: -6.2; } }

/* tanıtım (kurumsal) bölümü */
.tanitim { background: var(--zemin-yumusak); }
.tanitim-ic { display: grid; grid-template-columns: 1.05fr 1fr; gap: 3.5rem; align-items: center; }
.tanitim-gorsel img { border-radius: 10px; box-shadow: var(--golge); }
.tanitim-metin h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); margin-bottom: 1rem; }
.tanitim-metin p { color: var(--metin-soluk); margin-bottom: 1.3rem; }
.onay-liste { list-style: none; margin-bottom: 1.8rem; }
.onay-liste li { position: relative; padding: 0.4rem 0 0.4rem 2rem; font-weight: 500; }
.onay-liste li::before {
  content: ""; position: absolute; left: 0; top: 0.72rem;
  width: 16px; height: 9px;
  border-left: 3px solid var(--mavi); border-bottom: 3px solid var(--mavi);
  transform: rotate(-45deg);
}

/* haber kartları */
.haber-kart {
  display: flex; flex-direction: column; text-decoration: none;
  border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden; background: #fff;
  transition: box-shadow var(--gecis), transform var(--gecis);
}
.haber-kart:hover { box-shadow: var(--golge); transform: translateY(-4px); }
.haber-gorsel { overflow: hidden; }
.haber-gorsel img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; transition: transform 0.5s ease; }
.haber-kart:hover .haber-gorsel img { transform: scale(1.05); }
.haber-govde { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.3rem; flex: 1; }
.haber-govde time { font-size: 0.82rem; font-weight: 600; color: var(--mavi); }
.haber-baslik { font-weight: 700; font-size: 1.08rem; color: var(--lacivert); line-height: 1.35; flex: 1; }
.haber-ozet { font-size: 0.9rem; color: var(--metin-soluk); }

/* CTA bandı */
.cta-bant { background: var(--mavi); color: #fff; padding: clamp(2.6rem, 5vw, 3.8rem) 0; }
.cta-ic { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.cta-ic h2 { color: #fff; font-size: clamp(1.4rem, 2.6vw, 2rem); max-width: 24ch; }
.cta-ic p { color: rgba(255, 255, 255, 0.85); margin-top: 0.5rem; max-width: 56ch; }

/* ---------- iç sayfa hero ---------- */
.sayfa-hero { position: relative; min-height: 340px; display: flex; align-items: flex-end; background: var(--lacivert-derin); overflow: hidden; }
.sayfa-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sayfa-hero-golge {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,34,51,0.18) 0%, rgba(14,34,51,0.78) 100%);
}
.sayfa-hero-icerik { position: relative; z-index: 1; width: 100%; padding-top: 5rem; padding-bottom: 2.6rem; }
.sayfa-hero h1 { color: #fff; font-size: clamp(2rem, 4.4vw, 3.2rem); }
.sayfa-hero h1.kucuk { font-size: clamp(1.5rem, 3vw, 2.3rem); max-width: 28ch; }
.sayfa-hero-icerik > p, .sayfa-hero-icerik p { color: rgba(255, 255, 255, 0.85); margin-top: 0.6rem; max-width: 60ch; }
.sayfa-hero.duz { background: linear-gradient(120deg, var(--lacivert-derin), #14395c); min-height: 260px; }
.ekmek { font-size: 0.85rem; color: rgba(255, 255, 255, 0.7); margin-bottom: 0.9rem; }
.ekmek a { color: rgba(255, 255, 255, 0.85); text-decoration: none; }
.ekmek a:hover { color: #fff; text-decoration: underline; }
.ekmek span { color: #fff; }

/* ---------- içerik gövdesi ---------- */
.yanyana { display: grid; grid-template-columns: 1fr 340px; gap: 3.5rem; align-items: start; }
.icerik-govde { font-size: 1.03rem; max-width: 75ch; }
.icerik-govde.genis { max-width: none; }
.icerik-govde h2 { font-size: 1.6rem; margin: 2.4rem 0 0.9rem; scroll-margin-top: 110px; }
.icerik-govde h2:first-child { margin-top: 0; }
.icerik-govde h3 { font-size: 1.2rem; margin: 1.8rem 0 0.6rem; }
.icerik-govde p { margin-bottom: 1.1rem; }
.icerik-govde ul, .icerik-govde ol { padding-left: 1.4rem; margin-bottom: 1.2rem; }
.icerik-govde li { margin-bottom: 0.45rem; }
.icerik-govde img { border-radius: 10px; margin: 1.6rem 0; }
.icerik-govde blockquote {
  border-left: 4px solid var(--mavi); background: var(--zemin-yumusak);
  padding: 1.1rem 1.4rem; border-radius: 0 8px 8px 0; margin: 1.6rem 0;
  font-weight: 500;
}
.icerik-govde .vurgu-rakam { font-size: 2.6rem; font-weight: 800; color: var(--mavi); line-height: 1.1; }
.icerik-govde .uyari { border: 1px solid #E5B36A; background: #FDF6EA; border-radius: 8px; padding: 1rem 1.3rem; font-size: 0.95rem; }

/* iki kolonlu içerik ızgaraları (sayfa HTML'inde kullanılabilir) */
.deger-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.4rem; margin: 1.6rem 0; }
.deger-kart { border: 1px solid var(--cizgi); border-left: 4px solid var(--mavi); border-radius: 8px; padding: 1.2rem 1.4rem; background: #fff; }
.deger-kart h3 { margin: 0 0 0.4rem !important; font-size: 1.08rem !important; }
.deger-kart p { margin: 0; font-size: 0.93rem; color: var(--metin-soluk); }

.zaman-cizelge { list-style: none; padding: 0 !important; margin: 1.8rem 0; position: relative; }
.zaman-cizelge::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: var(--cizgi); }
.zaman-cizelge li { position: relative; padding: 0 0 1.6rem 2.2rem; margin: 0 !important; }
.zaman-cizelge li::before {
  content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 16px;
  border-radius: 50%; background: #fff; border: 4px solid var(--mavi);
}
.zaman-cizelge strong { display: block; color: var(--mavi); font-size: 1.15rem; }

/* yan panel */
.yan-panel { display: flex; flex-direction: column; gap: 1.4rem; position: sticky; top: 100px; }
.yan-kart { border: 1px solid var(--cizgi); border-radius: 10px; padding: 1.5rem 1.6rem; background: #fff; }
.yan-kart h3 { font-size: 1.05rem; margin-bottom: 0.9rem; }
.yan-kart.koyu { background: var(--lacivert-derin); border-color: var(--lacivert-derin); color: #fff; }
.yan-kart.koyu h3 { color: #fff; }
.yan-kart.koyu p { color: rgba(255,255,255,0.75); font-size: 0.92rem; margin-bottom: 1.1rem; }
.yan-baglanti {
  display: flex; justify-content: space-between; align-items: center; gap: 0.6rem;
  padding: 0.6rem 0; border-bottom: 1px solid var(--cizgi);
  text-decoration: none; font-weight: 600; font-size: 0.95rem; color: var(--lacivert);
}
.yan-baglanti:last-child { border-bottom: none; }
.yan-baglanti:hover { color: var(--mavi); }
.yan-baglanti i { font-style: normal; color: var(--mavi); }
.yan-tel { display: block; margin-top: 0.9rem; color: #9FD6EF; font-weight: 700; text-decoration: none; }
.yan-not { font-size: 0.88rem; color: var(--metin-soluk); margin-top: 0.8rem; }

/* hizmet detay — zengin bölümler */
.hd-giris { display: grid; grid-template-columns: 1fr minmax(240px, 300px); gap: 3rem; align-items: center; }
.hd-rakam-kart {
  background: linear-gradient(150deg, var(--lacivert-derin), #14395c);
  color: #fff; border-radius: 16px; text-align: center;
  padding: 2.2rem 1.6rem;
  box-shadow: 0 18px 40px rgba(14, 34, 51, 0.28);
}
.hd-rakam-kart strong { display: block; font-size: clamp(2.4rem, 4vw, 3.4rem); font-weight: 800; letter-spacing: -0.02em; color: #9FD6EF; line-height: 1.1; }
.hd-rakam-kart span { display: block; margin-top: 0.5rem; font-size: 0.92rem; color: rgba(255, 255, 255, 0.75); }

.hd-adimlar-kap { background: var(--zemin-yumusak); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); padding: clamp(3rem, 6vw, 4.6rem) 0; }
.hd-adim-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; }
.hd-adim {
  position: relative; background: #fff; border: 1px solid var(--cizgi); border-radius: 12px;
  padding: 1.7rem 1.5rem 1.5rem; overflow: hidden;
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.hd-adim:hover { transform: translateY(-4px); box-shadow: var(--golge); }
.hd-adim-no {
  position: absolute; right: 0.6rem; top: -0.6rem;
  font-size: 4.2rem; font-weight: 800; color: var(--mavi); opacity: 0.09; line-height: 1;
}
.hd-adim h3 { font-size: 1.08rem; margin-bottom: 0.5rem; padding-right: 2rem; }
.hd-adim p { font-size: 0.92rem; color: var(--metin-soluk); }

.hd-kapsam { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.onay-liste.iki-kolon { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.6rem; margin-bottom: 1.7rem; }
.hd-galeri { position: relative; min-height: 380px; }
.hd-foto { position: absolute; object-fit: cover; border-radius: 12px; box-shadow: var(--golge); }
.hd-foto.f1 { width: 78%; aspect-ratio: 4 / 3; left: 0; top: 0; z-index: 1; }
.hd-foto.f2 {
  width: 52%; aspect-ratio: 4 / 3; right: 0; bottom: 0; z-index: 2;
  border: 5px solid #fff; box-shadow: 0 16px 34px rgba(24, 48, 56, 0.24);
}
.hd-sss-kap { background: var(--zemin-yumusak); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); padding: clamp(3rem, 6vw, 4.6rem) 0; }
.hd-diger-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.4rem; }
.hd-diger-izgara .hizmet-gorsel img { aspect-ratio: 16 / 9; }
@media (max-width: 900px) {
  .hd-giris, .hd-kapsam { grid-template-columns: 1fr; }
  .hd-galeri { min-height: 0; height: 300px; }
  .onay-liste.iki-kolon { grid-template-columns: 1fr; }
}

/* hizmetler sayfası — zengin zikzak bloklar */
.hizmet-blok-kap { padding: clamp(2.2rem, 4.5vw, 3.6rem) 0; }
.hizmet-blok-kap:nth-of-type(even) { background: var(--zemin-yumusak); }
.hizmet-blok {
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
}
.hizmet-blok-kap.ters .hb-galeri { order: 2; }
.hizmet-blok-kap.ters .hb-icerik { order: 1; }
.hb-galeri { position: relative; padding: 0 2.2rem 2.6rem 0; }
.hizmet-blok-kap.ters .hb-galeri { padding: 0 0 2.6rem 2.2rem; }
.hb-no {
  position: absolute; top: -2.4rem; left: -0.6rem; z-index: 0;
  font-size: 7rem; font-weight: 800; line-height: 1;
  color: var(--mavi); opacity: 0.08; letter-spacing: -0.04em;
}
.hb-ana {
  position: relative; z-index: 1; width: 100%;
  aspect-ratio: 16 / 11; object-fit: cover;
  border-radius: 14px; box-shadow: var(--golge);
}
.hb-kucuk {
  position: absolute; z-index: 2; right: 0; bottom: 0;
  width: 44%; aspect-ratio: 4 / 3; object-fit: cover;
  border-radius: 12px; border: 5px solid #fff;
  box-shadow: 0 14px 30px rgba(24, 48, 56, 0.22);
}
.hizmet-blok-kap.ters .hb-kucuk { right: auto; left: 0; }
.hb-rozet {
  position: absolute; z-index: 3; left: 1.4rem; top: 1.4rem;
  background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(4px);
  border-radius: 12px; padding: 0.65rem 1rem;
  box-shadow: 0 10px 24px rgba(24, 48, 56, 0.18);
}
.hizmet-blok-kap.ters .hb-rozet { left: auto; right: 1.4rem; }
.hb-rozet strong { display: block; font-size: 1.35rem; font-weight: 800; color: var(--mavi); line-height: 1.1; }
.hb-rozet small { font-size: 0.72rem; color: var(--metin-soluk); }
.hb-icerik h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); margin: 0.2rem 0 0.3rem; }
.hb-slogan { font-weight: 600; color: var(--mavi); margin-bottom: 0.8rem; }
.hb-ozet { color: var(--metin-soluk); margin-bottom: 1.1rem; }
.hb-icerik .onay-liste { margin-bottom: 1.5rem; }
.hb-icerik .onay-liste li { font-size: 0.95rem; }
.hb-ctalar { display: flex; align-items: center; gap: 1.6rem; flex-wrap: wrap; }
@media (max-width: 900px) {
  .hizmet-blok { grid-template-columns: 1fr; }
  .hizmet-blok-kap.ters .hb-galeri { order: 0; padding: 0 0 2.6rem 0; }
  .hizmet-blok-kap.ters .hb-icerik { order: 1; }
  .hb-galeri { padding-right: 0; }
  .hb-no { font-size: 5rem; top: -1.6rem; }
}

/* hizmet listesi (hizmetler sayfası) */
.hizmet-liste { display: flex; flex-direction: column; gap: 1.6rem; margin-top: 2.6rem; }
.hizmet-satir {
  display: grid; grid-template-columns: 340px 1fr; gap: 2rem;
  text-decoration: none; border: 1px solid var(--cizgi); border-radius: 12px;
  overflow: hidden; background: #fff;
  transition: box-shadow var(--gecis), transform var(--gecis);
}
.hizmet-satir:hover { box-shadow: var(--golge); transform: translateY(-3px); }
.hizmet-satir-gorsel img { width: 100%; height: 100%; object-fit: cover; min-height: 220px; }
.hizmet-satir-govde { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.8rem 2rem 1.8rem 0; }
.hizmet-no { font-weight: 800; color: var(--mavi); opacity: 0.55; font-size: 0.95rem; }
.hizmet-satir-ad { font-weight: 700; font-size: 1.35rem; color: var(--lacivert); }
.hizmet-satir-ozet { color: var(--metin-soluk); font-size: 0.97rem; flex: 1; }

/* ---------- SSS ---------- */
.sss-liste { display: flex; flex-direction: column; gap: 0.9rem; }
.sss-madde { border: 1px solid var(--cizgi); border-radius: 10px; background: #fff; }
.sss-madde[open] { box-shadow: var(--golge); }
.sss-madde summary {
  list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 0.9rem;
  padding: 1.1rem 1.4rem; font-weight: 600; font-size: 1.02rem; color: var(--lacivert);
}
.sss-madde summary::-webkit-details-marker { display: none; }
.sss-no { color: var(--mavi); font-weight: 800; flex-shrink: 0; }
.sss-isaret { margin-left: auto; position: relative; width: 14px; height: 14px; align-self: center; flex-shrink: 0; }
.sss-isaret::before, .sss-isaret::after { content: ""; position: absolute; background: var(--mavi); transition: transform 0.25s; }
.sss-isaret::before { left: 0; right: 0; top: 6px; height: 2px; }
.sss-isaret::after { top: 0; bottom: 0; left: 6px; width: 2px; }
.sss-madde[open] .sss-isaret::after { transform: scaleY(0); }
.sss-cevap { padding: 0 1.4rem 1.3rem 3.4rem; color: var(--metin-soluk); font-size: 0.97rem; }

/* ---------- iletişim ---------- */
.iletisim-yerlesim { grid-template-columns: 1.3fr 1fr; }
.form-kap { border: 1px solid var(--cizgi); border-radius: 12px; padding: 2rem 2.2rem; background: #fff; }
.form-baslik { font-size: 1.3rem; margin-bottom: 1.4rem; }
.form-kap label { display: block; font-weight: 600; font-size: 0.86rem; color: var(--lacivert); margin-bottom: 1rem; }
.form-sira { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.form-kap input:not([type="checkbox"]), .form-kap select, .form-kap textarea {
  display: block; width: 100%; margin-top: 0.35rem;
  font-family: var(--font); font-size: 1rem; color: var(--metin);
  border: 1.5px solid #CBD5DB; border-radius: 7px; padding: 0.7rem 0.85rem;
  background: #fff;
}
.form-kap input:focus, .form-kap select:focus, .form-kap textarea:focus {
  outline: none; border-color: var(--mavi); box-shadow: 0 0 0 3px rgba(0, 112, 160, 0.14);
}
.onay { display: flex !important; gap: 0.7rem; align-items: flex-start; font-weight: 400 !important; font-size: 0.88rem !important; color: var(--metin-soluk) !important; }
.onay input { margin-top: 0.28rem; }
.onay a { color: var(--mavi); }
.form-hata { background: #FBEDEA; border: 1px solid #E5A093; color: #B3352A; border-radius: 8px; padding: 0.8rem 1.1rem; margin-bottom: 1.2rem; font-size: 0.93rem; }
.form-basari { text-align: center; padding: 3rem 1rem; }
.form-basari h2 { color: var(--mavi); font-size: 1.8rem; margin-bottom: 0.7rem; }
.form-basari p { color: var(--metin-soluk); margin-bottom: 1.6rem; }
.iletisim-bilgi { display: flex; flex-direction: column; gap: 1.4rem; }
.iletisim-bilgi address { font-style: normal; line-height: 1.8; }

/* ---------- footer ---------- */
.alt { background: #fff; border-top: 1px solid var(--cizgi); margin-top: clamp(3rem, 6vw, 5rem); }
.alt-ust {
  max-width: var(--orta); margin: 0 auto;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem;
  padding: clamp(2.6rem, 5vw, 4rem) clamp(1.1rem, 3vw, 2rem);
}
.alt-kolon h3 { font-size: 1.02rem; margin-bottom: 1rem; color: var(--lacivert); }
.alt-kolon a { display: block; padding: 0.34rem 0; text-decoration: none; font-size: 0.94rem; color: var(--metin-soluk); width: fit-content; }
.alt-kolon a:hover { color: var(--mavi); }
.alt-adres address { font-style: normal; font-size: 0.94rem; color: var(--metin-soluk); margin-bottom: 0.7rem; line-height: 1.8; }
.alt-bant { background: var(--lacivert-derin); }
.alt-bant { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.3rem clamp(1.1rem, 3vw, 2rem); }
.alt-logo { height: 36px; width: auto; filter: brightness(0) invert(1); }
.alt-sosyal { display: flex; gap: 1.1rem; }
.alt-sosyal a { color: rgba(255, 255, 255, 0.8); transition: color var(--gecis); }
.alt-sosyal a:hover { color: #fff; }
.alt-kunye {
  max-width: var(--orta); margin: 0 auto;
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding: 1.1rem clamp(1.1rem, 3vw, 2rem);
  font-size: 0.84rem; color: var(--metin-soluk);
}
.alt-kunye-linkler { display: flex; gap: 1.6rem; }
.alt-kunye a { color: var(--metin-soluk); text-decoration: none; }
.alt-kunye a:hover { color: var(--mavi); }

/* ---------- animasyon ---------- */
.gorunum { opacity: 0; transform: translateY(26px); }
.gorunum.geldi { opacity: 1; transform: none; transition: opacity 0.65s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1); }

/* ---------- duyarlı ---------- */
@media (max-width: 1180px) {
  .nav, .ust-tel, .ust-cta { display: none; }
  .hamburger {
    display: flex; flex-direction: column; gap: 5px; margin-left: auto;
    background: none; border: none; cursor: pointer; padding: 8px;
  }
  .hamburger span { width: 25px; height: 2.5px; background: var(--lacivert); border-radius: 2px; transition: transform 0.3s, opacity 0.3s; }
  .hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
  .hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
}
@media (min-width: 1181px) { .mobil-menu { display: none; } }
@media (max-width: 900px) {
  .rakam-sira { grid-template-columns: repeat(3, 1fr); gap: 1.6rem 1rem; }
  .harita-ic, .tanitim-ic, .yanyana, .iletisim-yerlesim { grid-template-columns: 1fr; }
  .yan-panel { position: static; }
  .hizmet-satir { grid-template-columns: 1fr; }
  .hizmet-satir-govde { padding: 0 1.6rem 1.6rem; }
  .alt-ust { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .rakam-sira { grid-template-columns: repeat(2, 1fr); }
  .form-sira { grid-template-columns: 1fr; }
  .alt-ust { grid-template-columns: 1fr; }
  .slider { height: 68vh; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001s !important; transition-duration: 0.001s !important; }
  .gorunum { opacity: 1; transform: none; }
  html { scroll-behavior: auto; }
}