/* =====================================================================
   Buton kose yaricapi
   ---------------------------------------------------------------------
   Tema, skin-10 icin --btn-radius: 50px (tam pill) tanimliyor. Header'daki
   arama dugmesi, hamburger ve "Randevu Al" 12px kullaniyor; tutarlilik icin
   butun .btn ogeleri de 12px'e cekildi. Tek degisken tum butonlari kapsar.
   ------------------------------------------------------------------ */
html[data-theme-color="skin-10"] {
	--btn-radius: 12px;
}
/* =====================================================================
   Trea Kids - Projeye ozel ek yardimci siniflar

   Tema stil dosyasi (style.css) onceden derlenmis bir Tailwind ciktisidir;
   yalnizca temada kullanilan siniflari icerir. Bu dosya, projede ihtiyac
   duyulan ancak derlenmis ciktida bulunmayan siniflari tanimlar.
   Tema dosyasi hic degistirilmemistir; bu dosya ondan sonra yuklenir.

   Olcek: --spacing = .25rem  (Tailwind varsayilani)
   Kirilim noktalari: sm 576 · md 768 · lg 992 · xl 1199 · 2xl 1400 · 2xxl 1481
   ===================================================================== */

/* =====================================================================
   Marka rengi (primary) — #2062C5 mavi  ->  #4335B2 mor

   Trea Kids logosundaki mor tonuyla uyum icin. Tema, skin-10 kapsaminda
   renk degiskenlerini tanimlar; ayni seciciyi kullanip (site.css tema
   dosyasindan sonra yuklendigi icin) degerleri eziyoruz. Tema dosyasi
   degistirilmedi.

   Turev renkler (koyu/acik ton, arka planlar, golgeler) rastgele
   secilmedi: eski paletin primary'e gore HSL farklari olculup ayni
   farklar yeni renge uygulandi, boylece tasarimin ton dengesi korunur.
   ===================================================================== */
html[data-theme-color="skin-10"],
:root {
	--primary:       #4335B2;
	--primarydark:   #382AA1;
	--primary-rgb:   67, 53, 178;
	--primarylight:  #EFEFFD;

	/* Markanin ikinci rengi. Ana eylemler (butonlar, baglantilar) mor
	   kalir; pembe yalnizca ikincil aksan olarak kullanilir -- vurgu
	   cizgileri, sayilar, donusumlu kart ikonlari ve aktif durumlar.
	   Boylece "hangisi tiklanabilir" hiyerarsisi bozulmaz. */
	--vurgu:         #F353A0;
	--vurgudark:     #E03B8C;
	--vurgu-rgb:     243, 83, 160;
	--vurgulight:    #FEF0F7;

	/* Cocuk paletinin iki tamamlayicisi. Mor ve pembeyle birlikte kart
	   ikonlari, adim numaralari ve istatistiklerde 4'lu donusum kurar.
	   Dolu gunes zemininde beyaz metin okunmaz (kontrast ~1.9): gunes
	   uzerinde daima koyu (--secondary) metin/ikon kullanilir. */
	--gunes:         #FFB020;
	--gunesdark:     #C77700;
	--gunes-rgb:     255, 176, 32;
	--guneslight:    #FFF4DE;
	--turkuaz:       #21BAA9;
	--turkuazdark:   #12867A;
	--turkuaz-rgb:   33, 186, 169;
	--turkuazlight:  #E3F7F4;

	--light:         #F7F6FE;
	--body-bg:       #F7F6FE;

	--accordion-shadow: 2px 2px 0px #E2E3F4;
	--icon-bx-gradient: 180deg, #FFFFFF 0%, #F0EEFD 100%;
	--service-card-gradient: linear-gradient(90deg, rgba(67, 53, 178, 0.85) 0%, rgba(14, 8, 46, 0.65) 100%);
	--shadow-20:     0px 20px 40px rgba(67, 53, 178, 0.1);

	/* Hizmet/hakkimizda listelerindeki onay isareti (SVG data URI, dolgu rengi gomulu) */
	--background-image-circle-check-4: url('data:image/svg+xml,%3Csvg%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M7.58333%2022.75H18.4167C19.5659%2022.75%2020.6681%2022.2935%2021.4808%2021.4808C22.2935%2020.6681%2022.75%2019.5659%2022.75%2018.4167V13.1625C22.75%2012.8752%2022.6359%2012.5996%2022.4327%2012.3965C22.2295%2012.1933%2021.954%2012.0792%2021.6667%2012.0792C21.3793%2012.0792%2021.1038%2012.1933%2020.9006%2012.3965C20.6975%2012.5996%2020.5833%2012.8752%2020.5833%2013.1625V18.4167C20.5833%2018.9913%2020.3551%2019.5424%2019.9487%2019.9487C19.5424%2020.3551%2018.9913%2020.5833%2018.4167%2020.5833H7.58333C7.0087%2020.5833%206.4576%2020.3551%206.05127%2019.9487C5.64494%2019.5424%205.41667%2018.9913%205.41667%2018.4167V7.58333C5.41667%207.0087%205.64494%206.4576%206.05127%206.05127C6.4576%205.64494%207.0087%205.41667%207.58333%205.41667H13C13.2873%205.41667%2013.5629%205.30253%2013.766%205.09937C13.9692%204.8962%2014.0833%204.62065%2014.0833%204.33333C14.0833%204.04602%2013.9692%203.77047%2013.766%203.5673C13.5629%203.36414%2013.2873%203.25%2013%203.25H7.58333C6.43406%203.25%205.33186%203.70655%204.5192%204.5192C3.70655%205.33186%203.25%206.43406%203.25%207.58333V18.4167C3.25%2019.5659%203.70655%2020.6681%204.5192%2021.4808C5.33186%2022.2935%206.43406%2022.75%207.58333%2022.75Z%22%20fill%3D%22%234335B2%22/%3E%3Cpath%20d%3D%22M21.9801%204.64868L12.9992%2013.6403L9.43506%2010.0653C9.23106%209.86135%208.95438%209.74675%208.66589%209.74675C8.3774%209.74675%208.10072%209.86135%207.89672%2010.0653C7.69273%2010.2693%207.57812%2010.546%207.57812%2010.8345C7.57812%2010.9774%207.60626%2011.1188%207.66093%2011.2508C7.71559%2011.3828%207.79572%2011.5027%207.89672%2011.6037L12.2301%2015.937C12.3308%2016.0386%2012.4506%2016.1191%2012.5826%2016.1741C12.7146%2016.2291%2012.8562%2016.2575%2012.9992%2016.2575C13.1422%2016.2575%2013.2838%2016.2291%2013.4158%2016.1741C13.5479%2016.1191%2013.6677%2016.0386%2013.7684%2015.937L23.5184%206.18701C23.7224%205.98302%2023.837%205.70634%2023.837%205.41784C23.837%205.12935%2023.7224%204.85267%2023.5184%204.64868C23.3144%204.44468%2023.0377%204.33008%2022.7492%204.33008C22.4607%204.33008%2022.1841%204.44468%2021.9801%204.64868Z%22%20fill%3D%22%234335B2%22/%3E%3C/svg%3E');
}

/* --- Yazi tipleri ----------------------------------------------------
   Tema `html[data-theme-color="skin-10"]` kapsaminda --font-base ve
   --font-title'i "DM Sans", :root kapsaminda da --font-sub-title'i
   "Playfair Display" olarak tanimlar. Ayni secicileri kullanip (site.css
   tema dosyasindan sonra yuklendigi icin) degerleri eziyoruz.
   Tema dosyasi degistirilmedi.

   Figtree  : sicak geometrik sans - govde metinleri ve arayuz
   Baloo 2  : dolgun, yuvarlak uclu baslik sesi (kiril: Manrope'a duser)
   Fraunces : yumusak italik serif - .font-sub-title vurgu metinleri
   Yazi tipi dosyalari assets/fonts/ altinda kendi sunucumuzda barinir.
   -------------------------------------------------------------------- */
html[data-theme-color="skin-10"],
:root {
	--font-base:      "Figtree", ui-sans-serif, system-ui, sans-serif;
	--font-title:     "Baloo 2", "Figtree", ui-sans-serif, system-ui, sans-serif;
	--font-sub-title: "Fraunces", Georgia, serif;
	--font-poppins:   "Figtree", ui-sans-serif, system-ui, sans-serif;
}

::selection { background: rgba(var(--vurgu-rgb), .25); }

/* Basinca minik "squish": tum buton turlerinde dokunsal geri bildirim */
.btn:active,
.tk-btn:active,
.tk-filtre__dugme:active { transform: scale(.96); }

/* =====================================================================
   Dalga bolum ayiraci
   ---------------------------------------------------------------------
   Zemin degisen bolum gecislerinde duz cizgi yerine yumusak bir dalga.
   Dalganin rengi USTTEKI bolumun zeminidir; bolum kendi zeminini korur.
   Tema her <section>'a position:relative verdigi icin ::before yeterli,
   HTML'de yalnizca sinif gerekir. Ust dolgular (py-*) dalgadan genis
   oldugundan icerikle cakismaz.
   ------------------------------------------------------------------ */
.tk-dalga::before,
.tk-dalga--beyaz::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	right: 0;
	height: clamp(26px, 4vw, 48px);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0,0 H1200 V22 C1050,40 900,10 750,22 C600,34 450,8 300,20 C150,32 60,14 0,26 Z' fill='%23F7F6FE'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	pointer-events: none;
}
.tk-dalga--beyaz::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0,0 H1200 V22 C1050,40 900,10 750,22 C600,34 450,8 300,20 C150,32 60,14 0,26 Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
}

/* Figtree'nin x-yuksekligi DM Sans'tan buyuk; buyuk basliklarda harf
   araligini hafifce sikistirmak daha dengeli bir goruntu veriyor. */
h1, h2 {
	letter-spacing: -.015em;
}

/* =====================================================================
   Baslik olcegi (proje geneli tutarlilik)
   ---------------------------------------------------------------------
   Tema, basliklara ortak font (--font-title) ve 600 agirlik veriyor ama
   boyutlari her sayfada ayri ayri Tailwind siniflariyla yaziyordu; ayni
   islevdeki basliklar sayfadan sayfaya farkli boyutlara dusuyordu.
   Asagidaki alti kademe tek kaynak: her baslik islevine gore bir kademe
   secer, boyutu bir daha sayfa icinde tanimlanmaz.

     1  Sunum basligi  40 -> 80   hero, tam sayfa duyuru ekranlari
     2  Sayfa basligi  32 -> 56   ic sayfa banner h1, yazi basligi
     3  Bolum basligi  28 -> 48   section h2
     4  Grup basligi   21 -> 28   kart / fiyat / liste grubu basliklari
     5  Kart basligi   18 -> 20   ekip, hizmet, kenar cubugu, akordiyon
     6  Kucuk baslik   16         yorum sahibi, etiket, alt bilgi satiri

   Akiskan clamp() degerleri temanin eski kirilim degerlerine denk gelir
   (or. kademe 3: 640px'de 32px, 1024px'de 39px) - tek fark, 1481px ustu
   icin temanin 55px'lik sicramasi 48px'e cekildi. Boylece bolum basligi
   sayfa basligindan (56px) buyuk kalmiyor.
   ------------------------------------------------------------------ */
:root {
	--tk-baslik-1: clamp(2.5rem,  3.2vw + 1.6rem, 5rem);
	--tk-baslik-2: clamp(2rem,    2.05vw + 1.52rem, 3.5rem);
	--tk-baslik-3: clamp(1.75rem, 1.7vw  + 1.35rem, 3rem);
	--tk-baslik-4: clamp(1.3125rem, 0.6vw + 1.1rem, 1.75rem);
	--tk-baslik-5: clamp(1.125rem, 0.16vw + 1.08rem, 1.25rem);
	--tk-baslik-6: 1rem;
}

.tk-baslik-2,
.tk-baslik-3,
.tk-baslik-4,
.tk-baslik-5,
.tk-baslik-6 {
	font-family: var(--font-title);
	font-weight: 600;
}

.tk-baslik-2 { font-size: var(--tk-baslik-2); line-height: 1.22; letter-spacing: -.008em; }
.tk-baslik-3 { font-size: var(--tk-baslik-3); line-height: 1.22; letter-spacing: -.006em; }
.tk-baslik-4 { font-size: var(--tk-baslik-4); line-height: 1.32; }
.tk-baslik-5 { font-size: var(--tk-baslik-5); line-height: 1.4; }
.tk-baslik-6 { font-size: var(--tk-baslik-6); line-height: 1.45; }

/* Fraunces optik boyut ekseni: kucuk puntolarda daha okunur bicim */
.font-sub-title {
	font-variation-settings: "opsz" 24;
	letter-spacing: .005em;
}

/* --- Konum ---------------------------------------------------------- */
.bottom-10 { bottom: calc(var(--spacing) * 10); }
.z--1      { z-index: -1; }

.ltr\:right-10:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) { right: calc(var(--spacing) * 10); }
.ltr\:right-6:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *)  { right: calc(var(--spacing) * 6); }
.rtl\:left-10:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)  { left: calc(var(--spacing) * 10); }
.rtl\:left-6:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)   { left: calc(var(--spacing) * 6); }

/* --- Bosluk (padding / margin) -------------------------------------- */
.py-12\.5 { padding-block: calc(var(--spacing) * 12.5); }
.mb-12\.5 { margin-bottom: calc(var(--spacing) * 12.5); }
.mb-0\.5  { margin-bottom: calc(var(--spacing) * 0.5); }
.mt-1\.5  { margin-top: calc(var(--spacing) * 1.5); }
.mt-3\.75 { margin-top: calc(var(--spacing) * 3.75); }
.\!mx-0   { margin-inline: 0 !important; }

/* --- Boyut ---------------------------------------------------------- */
.w-32      { width: calc(var(--spacing) * 32); }
.min-w-20  { min-width: calc(var(--spacing) * 20); }
.max-w-32  { max-width: calc(var(--spacing) * 32); }
.max-w-90  { max-width: calc(var(--spacing) * 90); }
.max-w-160 { max-width: calc(var(--spacing) * 160); }
.max-w-225 { max-width: calc(var(--spacing) * 225); }
.min-h-125 { min-height: calc(var(--spacing) * 125); }
.max-h-14  { max-height: calc(var(--spacing) * 14); }
.max-h-16  { max-height: calc(var(--spacing) * 16); }

/* --- Tipografi ------------------------------------------------------ */
.text-xxl      { font-size: 1.375rem; line-height: 1.4; }
.leading-10    { line-height: calc(var(--spacing) * 10); }
.leading-snug  { line-height: 1.375; }
.break-word    { overflow-wrap: break-word; word-break: break-word; }
.opacity-70    { opacity: .7; }

/* --- Kose yaricapi -------------------------------------------------- */
.rounded-tr-xxl { border-top-right-radius: var(--radius-xxl, 15px); }

/* --- Renk / saydamlik ----------------------------------------------- */
.bg-primary\/10   { background-color: color-mix(in oklab, var(--primary) 10%, transparent); }
.bg-black\/40     { background-color: color-mix(in oklab, #000 40%, transparent); }
.text-primary\/20 { color: color-mix(in oklab, var(--primary) 20%, transparent); }
.text-white\/20   { color: color-mix(in oklab, #fff 20%, transparent); }
.\!text-white\/90 { color: color-mix(in oklab, #fff 90%, transparent) !important; }
.from-black\/70   { --tw-gradient-from: color-mix(in oklab, #000 70%, transparent);
                    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); }
.to-transparent   { --tw-gradient-to: transparent;
                    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); }

/* --- Tema uyumsuzlugu duzeltmesi ------------------------------------
   Temanin derlenmis CSS'i "src/images/..." yolundan uretilmis, HTML ise
   "physiotherapy/images/..." yazar. Bu yuzden asagidaki uc sinif tema
   demosunda da hicbir zaman eslesmez. Ayni kurallari HTML'de kullanilan
   sinif adiyla yeniden tanimliyoruz. (Footer'daki bone.png deseni istek
   uzerine kaldirildi; yalnizca iki maske kurali kaldi.)
   -------------------------------------------------------------------- */
.mask-\[url\(\'\.\.\/\.\.\/physiotherapy\/images\/background\/img1\.png\'\)\] {
	mask-image: url('../img/background/img1.png');
}
.mask-\[url\(\'\.\.\/\.\.\/physiotherapy\/images\/background\/img2\.png\'\)\] {
	mask-image: url('../img/background/img2.png');
}

/* --- Izgara bosluklari ---------------------------------------------- */
.\!\[--tw-gutter-y\:30px\] { --tw-gutter-y: 30px !important; }
.\!\[--tw-gutter-y\:24px\] { --tw-gutter-y: 24px !important; }

/* --- Etkilesim ------------------------------------------------------ */
.hover\:scale-105:hover {
	--tw-scale-x: 105%; --tw-scale-y: 105%; --tw-scale-z: 105%;
	scale: var(--tw-scale-x) var(--tw-scale-y);
}
.group:hover .group-hover\:translate-y-0 {
	--tw-translate-y: 0;
	translate: var(--tw-translate-x, 0) var(--tw-translate-y);
}

/* --- Altbilgi sosyal medya butonlari --------------------------------
   Tema'da 32px'lik ciplak ikonlardi (zemin sadece hover'da beliriyordu),
   altbilgide kayboluyorlardi. Header'daki sosyal butonlarla ayni dil:
   yuvarlak acik zemin, marka renginde ikon, hover'da dolu zemin.
   (Header'in ust seridi koyu oldugu icin orada zemin yari saydam beyaz;
   altbilgi acik oldugundan burada --primarylight kullanilir.)
   -------------------------------------------------------------------- */
.tk-sosyal ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.tk-sosyal a {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	font-size: 17px;
	color: var(--primary);
	background: var(--primarylight);
	transition: background .25s, color .25s;
}
.tk-sosyal a:hover,
.tk-sosyal a:focus-visible {
	background: var(--primary);
	color: #fff;
}
.tk-sosyal a:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }

/* --- Altbilgi tanitim metni: en fazla 3 satir ------------------------
   Tema `max-w-90` (360px) veriyordu; 124 karakterlik metin 4 satira
   tasiyordu. Genislik `em` biriminde tanimlandi: yazi boyutuyla
   olceklendigi icin satir basina dusen karakter sayisi sabit kalir ve
   metin her ekranda ayni sekilde 3 satira oturur.
   line-clamp, panelden daha uzun bir metin girilirse altbilgi duzeninin
   bozulmamasi icin yapisal guvence olarak durur.
   -------------------------------------------------------------------- */
.tk-footer-aciklama {
	max-width: 21em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
}

/* --- Zengin metin tipografisi ---------------------------------------
   Veritabanindan gelen icerik (yazi govdesi, hizmet aciklamasi, ozgecmis)
   utility sinifi tasimaz; bu blok o icerige temel tipografiyi verir.
   -------------------------------------------------------------------- */
.dz-page-text > *:first-child { margin-top: 0; }
.dz-page-text > *:last-child  { margin-bottom: 0; }

.dz-page-text p {
	font-size: 1.0625rem;
	line-height: 1.75;
	margin-bottom: 1.25rem;
	color: var(--body-color);
}

.dz-page-text h2,
.dz-page-text h3,
.dz-page-text h4,
.dz-page-text h5 {
	font-family: var(--font-title);
	color: var(--secondary, #0b1c39);
	line-height: 1.3;
	margin: 2.25rem 0 1rem;
}
/* Yonetilen icerik de ayni olcegi kullanir (kademe 4 -> 6) */
.dz-page-text h2 { font-size: var(--tk-baslik-4); letter-spacing: -.015em; }
.dz-page-text h3 { font-size: var(--tk-baslik-5); }
.dz-page-text h4 { font-size: var(--tk-baslik-6); }
.dz-page-text h5 { font-size: var(--tk-baslik-6); }

.dz-page-text ul,
.dz-page-text ol {
	margin: 0 0 1.5rem;
	padding-inline-start: 1.5rem;
}
.dz-page-text ul { list-style: disc; }
.dz-page-text ol { list-style: decimal; }
.dz-page-text li {
	font-size: 1.0625rem;
	line-height: 1.7;
	margin-bottom: .5rem;
	color: var(--body-color);
}
.dz-page-text li::marker { color: var(--vurgu); }
/* Menuden gelen bolum baglantilari sabit basligin altinda kalmasin */
.dz-page-text h2[id],
.dz-page-text h3[id] { scroll-margin-top: calc(var(--tk-header-yuk) + 24px); }

.dz-page-text a {
	color: var(--primary);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.dz-page-text a:hover { text-decoration: none; }

.dz-page-text strong,
.dz-page-text b { font-weight: 600; color: var(--secondary, #0b1c39); }

.dz-page-text blockquote {
	position: relative;
	background: var(--light, #f4f7fb);
	border-radius: 15px;
	padding: 1.5rem 1.75rem;
	margin: 1.75rem 0;
	border-inline-start: 4px solid var(--primary);
}
.dz-page-text blockquote p { margin-bottom: 0; font-size: 1.0625rem; }

.dz-page-text img,
.dz-page-text figure img {
	max-width: 100%;
	height: auto;
	border-radius: 15px;
	margin: 1.5rem 0;
}
.dz-page-text figure { margin: 1.5rem 0; }
.dz-page-text figcaption {
	font-size: .875rem;
	text-align: center;
	color: var(--body-color);
	margin-top: .5rem;
}

.dz-page-text hr {
	border: 0;
	border-top: 1px solid rgba(0, 0, 0, .1);
	margin: 2rem 0;
}

.dz-page-text table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.5rem 0;
	font-size: .9375rem;
}
.dz-page-text th,
.dz-page-text td {
	border: 1px solid rgba(0, 0, 0, .1);
	padding: .75rem 1rem;
	text-align: start;
}
.dz-page-text th { background: var(--light, #f4f7fb); font-weight: 600; }

/* Yatay tasan tablolar sayfayi kaydirmasin */
.dz-page-text { overflow-x: auto; }

/* --- Kirilim noktalari ---------------------------------------------- */
@media (width < 992px) {
	.max-lg\:mb-10 { margin-bottom: calc(var(--spacing) * 10); }
}

@media (width >= 576px) {
	.sm\:max-w-40       { max-width: calc(var(--spacing) * 40); }
	.sm\:rounded-tr-3xl { border-top-right-radius: var(--radius-3xl, 1.5rem); }
}

@media (width >= 992px) {
	.lg\:ps-10    { padding-inline-start: calc(var(--spacing) * 10); }
	.lg\:ps-12\.5 { padding-inline-start: calc(var(--spacing) * 12.5); }
	.lg\:p-12\.5  { padding: calc(var(--spacing) * 12.5); }
	.lg\:top-30   { top: calc(var(--spacing) * 30); }
	.lg\:w-80     { width: calc(var(--spacing) * 80); }
	.lg\:text-end { text-align: end; }
}

@media (width >= 1199px) {
	.xl\:text-5xxl { font-size: var(--text-5xxl); }
}

@media (width >= 1481px) {
	.\32xxl\:p-10   { padding: calc(var(--spacing) * 10); }
	.\32xxl\:p-12\.5 { padding: calc(var(--spacing) * 12.5); }
}

/* =====================================================================
   Temanin derlenmis CSS'inde karsiligi olmayan siniflar
   ---------------------------------------------------------------------
   Tema paketi yalnizca kendi demo sayfalarinda gecen siniflari derlemis;
   asagidakiler isaretlemede kullaniliyor ama hicbir kural uretmiyordu.
   ------------------------------------------------------------------ */

/* Cerceveli birincil buton - sitedeki 7 ikincil CTA bunu kullaniyor,
   kural olmadigi icin .btn'in gri varsayilanina dusuyorlardi. */
.btn-outline-primary {
	border-color: var(--color-primary);
	background-color: transparent;
	color: var(--color-primary);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus-visible {
	border-color: var(--color-primary);
	background-color: var(--color-primary);
	color: var(--color-white, #fff);
}

/* Saydam beyaz metin (one cikan fiyat kartindaki kademelenme) */
.\!text-white\/80 { color: rgb(255 255 255 / 0.8) !important; }
.\!text-white\/95 { color: rgb(255 255 255 / 0.95) !important; }

/* Govde metni satir araligi */
.leading-\[1\.6\] { line-height: 1.6; }

/* =====================================================================
   Hakkimizda gorseli
   ---------------------------------------------------------------------
   Onceden uc parcali bir kolajdi (biri buyuk, ikisi kucuk; ikisi maskeli).
   Tek gorsele indirildi ve kolajin kapladigi alanin tamamini doldurur.
   992px ustunde yukseklik metin sutununa esitlenir, boylece "Daha Fazla"
   butonu ile gorselin alt kenari ayni hizada kalir; altinda sutunlar alt
   alta gectigi icin sabit bir en-boy orani kullanilir.
   ------------------------------------------------------------------ */
.tk-kolaj__gorsel {
	overflow: hidden;
	border-radius: 45% 55% 52% 48% / 55% 46% 54% 45%;
	aspect-ratio: 4 / 3;
	background: var(--primarylight);
}
.tk-kolaj__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (min-width: 992px) {
	.tk-kolaj { position: relative; height: 100%; display: grid; place-items: center; }
	.tk-kolaj__gorsel { width: 100%; max-width: 600px; aspect-ratio: 1 / 1; }
}

/* =====================================================================
   Bento izgara - anasayfa hizmetler listesi
   ---------------------------------------------------------------------
   6 hizmet, esit kartlar yerine farkli boyutta dosemelerle gosterilir.
   Yerlesim (>=1200px, 4 sutun x 3 satir):

       1 1 2 2      1: 2x2 (one cikan)   2: 2x1
       1 1 3 4      3: 1x1               4: 1x1
       5 5 6 6      5: 2x1               6: 2x1

   768-1199px'de 2 sutun, 768px altinda tek sutun olur.
   Dosemeler otomatik yerlesir; sira degisirse yerlesim de kayar, bu yuzden
   hizmet sayisi 6 olarak sabittir (bkz. index.php $oneCikanlar).
   ------------------------------------------------------------------ */
/* Bento duzeni 768px'ten itibaren anlam kazanir. Altinda tek sutunda
   220px'lik yuksek karolar cikiyor ve 6 hizmet ekran boyu uzuyordu; bu
   nedenle mobilde sira disi yerlesim birakilip normal iki sutunlu kart
   listesine donuluyor (hizmetler sayfasindaki .tk-hizmet-izgara ile ayni dil). */
.tk-bento {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: auto;
}
.tk-bento > .tk-bento__oge > .tk-bento__ic { aspect-ratio: 4 / 5; height: auto; }

.tk-bento__oge { min-width: 0; }

.tk-bento__ic {
	display: block;                /* <a> oldugu icin gerekli */
	position: relative;
	height: 100%;
	overflow: hidden;
	border-radius: 24px;
	isolation: isolate;
	background: var(--secondary, #0b1c39);
}

.tk-bento__gorsel,
.tk-bento__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
}
.tk-bento__gorsel img {
	object-fit: cover;
	transition: transform .6s ease;
}
.tk-bento__ic:hover .tk-bento__gorsel img { transform: scale(1.04); }

/* Metin okunurlugu icin ust ve alt karartma */
.tk-bento__perde {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(11, 8, 40, .34) 0, rgba(11, 8, 40, 0) 74px),
		linear-gradient(0deg,   rgba(11, 8, 40, .82) 0, rgba(11, 8, 40, .45) 62px, rgba(11, 8, 40, 0) 148px);
}

.tk-bento__no {
	position: absolute;
	top: 22px;
	inset-inline-start: 26px;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: .04em;
	color: rgb(255 255 255 / .85);
}

.tk-bento__metin {
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	padding: 26px;
}
@media (max-width: 767px) {
	.tk-bento__ic { border-radius: 18px; }
	.tk-bento__metin { padding: 14px; }
	.tk-bento__ad { font-size: 15.5px; }
	.tk-bento__no { top: 12px; inset-inline-start: 14px; font-size: 15px; }
	.tk-bento__ok { width: 34px; height: 34px; inset-inline-end: 12px; top: 12px; }
}

.tk-bento__ad { margin: 0; color: #fff; }

.tk-bento__ozet {
	margin: 6px 0 0;
	font-size: 15px;
	line-height: 1.5;
	color: rgb(255 255 255 / .8);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}

.tk-bento__ok {
	position: absolute;
	top: 20px;
	inset-inline-end: 20px;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: #fff;
	background: rgb(255 255 255 / .18);
	backdrop-filter: blur(4px);
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .35s, transform .35s, background .35s;
}
.tk-bento__ic:hover .tk-bento__ok {
	opacity: 1;
	transform: translateY(0);
	background: var(--primary);
}
.tk-bento__ic:focus-visible .tk-bento__ok { opacity: 1; transform: translateY(0); }
.tk-bento__ic:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }

/* Dar kartta ozet okunmuyor (tanimdan sonra gelmeli ki dislama gecerli olsun) */
@media (max-width: 767px) {
	.tk-bento__ozet { display: none; }
}

/* 768px altinda bento yerlesimi yok; ilk karta ozel satir uzatmasi da
   kaldirildi (iki sutunlu listede bosluk biraktiriyordu). */
@media (min-width: 768px) {
	.tk-bento > .tk-bento__oge:first-child { grid-row: span 2; }
}

/* 1200px altinda one cikan disindaki dosemeler kisa; ozet tek satir kalsin
   ki perde goruntuyu fazla kapatmasin. */
@media (max-width: 1199px) {
	.tk-bento > .tk-bento__oge:not(:first-child) .tk-bento__ozet { -webkit-line-clamp: 1; line-clamp: 1; }
}

/* --- 2 sutun (bento duzeni buradan itibaren) -------------------------- */
@media (min-width: 768px) {
	.tk-bento { gap: 20px; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 205px; }
	.tk-bento > .tk-bento__oge > .tk-bento__ic { aspect-ratio: auto; height: 100%; }
	.tk-bento > .tk-bento__oge:first-child { grid-column: span 2; grid-row: span 2; }
	.tk-bento > .tk-bento__oge:last-child  { grid-column: span 2; }
}

/* --- 4 sutun -------------------------------------------------------- */
@media (min-width: 1200px) {
	.tk-bento { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 218px; }
	.tk-bento > .tk-bento__oge:nth-child(1) { grid-column: span 2; grid-row: span 2; }
	.tk-bento > .tk-bento__oge:nth-child(2) { grid-column: span 2; grid-row: span 1; }
	.tk-bento > .tk-bento__oge:nth-child(3),
	.tk-bento > .tk-bento__oge:nth-child(4) { grid-column: span 1; }
	.tk-bento > .tk-bento__oge:nth-child(5),
	.tk-bento > .tk-bento__oge:nth-child(6) { grid-column: span 2; }

	/* One cikan disindaki tum dosemelerde ozet tek satir
	   (218px'lik dosemede baslik + 1 satir ozet 117px yer kaplar) */
	.tk-bento__oge:not(:first-child) .tk-bento__ozet { -webkit-line-clamp: 1; line-clamp: 1; }
	/* Kucuk karelerde uzun bir hizmet adi gelirse baslik iki satiri asmasin */
	.tk-bento__oge:nth-child(3) .tk-bento__ad,
	.tk-bento__oge:nth-child(4) .tk-bento__ad {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		overflow: hidden;
	}
	/* One cikan dosemede daha genis nefes alani */
	.tk-bento > .tk-bento__oge:nth-child(1) .tk-bento__metin { padding: 32px; }
	.tk-bento > .tk-bento__oge:nth-child(1) .tk-bento__ozet { font-size: 16px; -webkit-line-clamp: 3; line-clamp: 3; }
}

/* =====================================================================
   Bolum basligi bileseni
   ---------------------------------------------------------------------
   Etiket satiri (eyebrow) once italik serbest metin, sonra nokta + hap
   seklinde bir kapsuldu. Kapsul basligin yaninda fazla yer kapliyor ve
   uzun etiketlerde ("Trea Kids Cocuk Danisma Merkezi") agir duruyordu.
   Editoryal bir bicime gecildi: kisa yatay marka cizgisi + versal metin.
   Zemin rengi kullanilmadigi icin hem beyaz (#FFF) hem acik mor (#F7F6FE)
   bolumlerde ayni sekilde okunuyor.
   ------------------------------------------------------------------ */
.tk-etiket {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--font-base);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--primary);
}
.tk-etiket::before {
	content: "";
	flex: 0 0 auto;
	width: 28px;
	height: 2px;
	border-radius: 2px;
	background: var(--vurgu);
}
/* Ortalanmis bolum basliklarinda cizgi iki yana da gelir */
.tk-bolum-basi--orta .tk-etiket::after {
	content: "";
	flex: 0 0 auto;
	width: 28px;
	height: 2px;
	border-radius: 2px;
	background: var(--vurgu);
}

.tk-bolum-basi .tk-etiket { margin-bottom: 16px; }
.tk-bolum-basi h2,
.tk-bolum-basi h3 { margin: 0; }

/* Ortalanmis bolum basliklari: dengeli satir kirilimi ve daha genis nefes */
.tk-bolum-basi--orta {
	max-width: 56rem;
	margin-inline: auto;
	margin-bottom: 32px;
	text-align: center;
}
.tk-bolum-basi--orta h2 { text-wrap: balance; }

@media (min-width: 640px) {
	.tk-bolum-basi--orta { margin-bottom: 48px; }
}

/* Satir varyanti: baslik solda, "tumunu gor" eylemi sagda.
   Buton listenin altinda ortali durmak yerine baslikla ayni hizada olur;
   dar ekranda alta kayar ve sola dayali kalir. */
.tk-bolum-basi--satir {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px 40px;
	margin-bottom: 32px;
}
.tk-bolum-basi--satir .tk-bolum-basi__metin { max-width: 42rem; }
.tk-bolum-basi--satir .tk-bolum-basi__eylem { flex: 0 0 auto; }

@media (min-width: 640px) {
	.tk-bolum-basi--satir { margin-bottom: 48px; }
}

/* Etiketten sonra gelen aciklama paragrafi basliga yapismasin */
.tk-bolum-basi h2 + p,
.tk-bolum-basi h3 + p { margin-top: 14px; }

/* Hakkimizda satiri: sutunlardaki mb-7.5 (30px) yalnizca altta fazladan bosluk
   biraktigi icin bolumun ust/alt boslugu esit gorunmuyordu. */
@media (min-width: 992px) {
	.tk-hakkimizda > div { margin-bottom: 0; }
}

/* Hakkimizda bolumu: gorsel icerik alanindan 28px tastigi icin gorunen ust/alt
   bosluk diger bolumlerden 28px eksik kaliyordu; dolguya ayni miktar eklendi. */
@media (min-width: 992px) {
	.tk-bolum--hakkimizda { padding-block: calc(var(--spacing) * 12.5 + 50px); }
}
@media (min-width: 1280px) {
	.tk-bolum--hakkimizda { padding-block: calc(var(--spacing) * 17.5 + 50px); }
}
@media (min-width: 1481px) {
	.tk-bolum--hakkimizda { padding-block: calc(var(--spacing) * 25 + 50px); }
}

/* Kendi form dogrulamamiz (tarayici balonlari kapatildi - site.js) */
.tk-form-hata {
	display: block;
	margin-top: 6px;
	font-size: 13.5px;
	line-height: 1.4;
	color: #d92d20;
}
.tk-alan--hatali {
	border-color: #d92d20 !important;
	box-shadow: 0 0 0 3px rgba(217, 45, 32, .12);
}
/* Bos alanlarda mesaj yer tutucu olarak alanin icinde gosterilir */
.tk-alan--hatali::placeholder { color: #d92d20 !important; opacity: 1; }
.tk-alan--hatali:focus { outline-color: #d92d20; }

/* =====================================================================
   Bildirimler (toast)
   ---------------------------------------------------------------------
   Sunucu tarafi mesajlar sayfa icine blok olarak basiliyordu; site.js
   bunlari buradaki toast'lara donusturur. Sag altta yigilir, mobilde tam
   genisliktedir ve fare uzerindeyken kapanma sayaci durur.
   ------------------------------------------------------------------ */
.tk-toast-kap {
	position: fixed;
	/* Modal (3000) ve arama katmani (1400) dahil her seyin ustunde kalmali;
	   aksi halde randevu sihirbazi acikken bildirim ortunun altinda kaliyor. */
	z-index: 4000;
	inset-inline-end: 24px;
	/* "Yukari cik" butonu sag altta 20px kenar boslugu ve 50px capinda duruyor;
	   toast yigini onun uzerinden baslar. */
	bottom: 86px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: min(380px, calc(100vw - 32px));
	pointer-events: none;
}

.tk-toast {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 14px 14px 16px;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 14px 40px rgba(11, 8, 40, .16), 0 2px 6px rgba(11, 8, 40, .06);
	color: var(--secondary, #0b1c39);
	font-size: 15px;
	line-height: 1.45;
	pointer-events: auto;
	opacity: 0;
	transform: translateY(14px) scale(.98);
	transition: opacity .28s ease, transform .28s cubic-bezier(.2, .8, .3, 1);
}
.tk-toast--acik { opacity: 1; transform: translateY(0) scale(1); }

/* Sol kenardaki durum seridi */
.tk-toast::before {
	content: "";
	position: absolute;
	inset-block: 10px;
	inset-inline-start: 0;
	width: 4px;
	border-radius: 0 4px 4px 0;
	background: currentColor;
	color: inherit;
}
.tk-toast--basarili::before { background: var(--primary); }
.tk-toast--hata::before     { background: #d92d20; }

.tk-toast__ikon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
}
.tk-toast--basarili .tk-toast__ikon { color: var(--primary); background: rgba(var(--primary-rgb), .1); }
.tk-toast--hata .tk-toast__ikon     { color: #d92d20;       background: rgba(217, 45, 32, .1); }

.tk-toast__metin { flex: 1 1 auto; padding-top: 3px; }

.tk-toast__kapat {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	margin-top: 2px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--color-bodycolor);
	transition: background .2s, color .2s;
}
.tk-toast__kapat:hover { background: rgba(11, 8, 40, .07); color: var(--secondary, #0b1c39); }
.tk-toast__kapat:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* 640px altinda "yukari cik" butonu gizli (max-sm:hidden), toast asagi inebilir */
@media (max-width: 639px) {
	.tk-toast-kap { inset-inline: 16px; width: auto; bottom: 16px; }
}

/* Buton yukleniyor durumu (e-bulten gonderimi) */
.tk-yukleniyor { pointer-events: none; opacity: .9; }
.tk-yukleniyor > * { visibility: hidden; }
.tk-yukleniyor::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 2px solid currentColor;
	border-top-color: transparent;
	animation: tkDon .7s linear infinite;
}
@keyframes tkDon { to { transform: rotate(360deg); } }

/* Bilgi turu bildirim (or. zaten kayitli e-posta) */
.tk-toast--bilgi::before   { background: #64748b; }
.tk-toast--bilgi .tk-toast__ikon { color: #475569; background: rgba(100, 116, 139, .12); }

/* Alt bilgi kredi satiri */
.tk-kredi {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--color-bodycolor);
	font-size: 15px;
}
.tk-kredi a {
	display: inline-flex;
	align-items: center;
	color: var(--secondary, #0b1c39);
	font-weight: 600;
	transition: color .25s, opacity .25s;
}
.tk-kredi a:hover { color: var(--primary); }
.tk-kredi img {
	height: 22px;
	width: auto;
	display: block;
	opacity: .85;
	transition: opacity .25s;
}
.tk-kredi a:hover img { opacity: 1; }

/* Telif satiri kredi satiriyla ayni tonda olsun (once koyu lacivertti) */
.tk-telif {
	color: var(--color-bodycolor);
	font-size: 15px;
}

/* =====================================================================
   Surec adimlari (anasayfa "Nasil Ilerliyoruz?")
   ---------------------------------------------------------------------
   Onceden dort ozdes beyaz kutuydu; adimlar arasinda gorsel bag yoktu.
   Artik kartlarin arasindan gecen kesikli bir bag cizgisi adimlari bir
   akis olarak okutuyor. Cizgi izgaranin arkasinda durur, kartlar opak
   oldugu icin yalnizca aradaki bosluklarda gorunur.
   ------------------------------------------------------------------ */
.tk-surec {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tk-surec__adim {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	padding: 30px;
	border-radius: 26px 26px 26px 8px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .10);
	box-shadow: 0 10px 30px rgba(11, 8, 40, .05);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.tk-surec__adim:hover {
	transform: translateY(-4px);
	border-color: rgba(var(--primary-rgb), .28);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .10);
}

.tk-surec__no {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin-bottom: 18px;
	border-radius: 50%;
	background: var(--primary);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .02em;
	box-shadow: 0 0 0 6px rgba(var(--primary-rgb), .08);
}

.tk-surec__adim:nth-child(4n+2) .tk-surec__no {
	background: var(--vurgu);
	box-shadow: 0 0 0 6px rgba(var(--vurgu-rgb), .10);
}
.tk-surec__adim:nth-child(4n+2):hover { border-color: rgba(var(--vurgu-rgb), .35); }
.tk-surec__adim:nth-child(4n+3) .tk-surec__no {
	background: var(--gunes);
	color: var(--secondary);
	box-shadow: 0 0 0 6px rgba(var(--gunes-rgb), .14);
}
.tk-surec__adim:nth-child(4n+3):hover { border-color: rgba(var(--gunes-rgb), .5); }
.tk-surec__adim:nth-child(4n) .tk-surec__no {
	background: var(--turkuaz);
	box-shadow: 0 0 0 6px rgba(var(--turkuaz-rgb), .12);
}
.tk-surec__adim:nth-child(4n):hover { border-color: rgba(var(--turkuaz-rgb), .45); }
.tk-surec__adim:nth-child(even) { border-radius: 26px 26px 8px 26px; }

.tk-surec__ad { margin: 0 0 8px; }

.tk-surec__ozet {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--color-bodycolor);
}

/* Bag cizgisi - dikey (tek sutun) */
@media (max-width: 639px) {
	.tk-surec::before {
		content: "";
		position: absolute;
		z-index: 0;
		inset-inline-start: 54px;
		top: 54px;
		bottom: 54px;
		width: 2px;
		background: repeating-linear-gradient(180deg,
			rgba(var(--primary-rgb), .3) 0 6px, transparent 6px 13px);
	}
}

@media (min-width: 640px) {
	.tk-surec { grid-template-columns: repeat(2, 1fr); }
}

/* Bag cizgisi - yatay (dort sutun); ilk ve son rozetin merkezleri arasi */
/* Bag cizgisi - yatay (dort sutun); ilk ve son rozetin merkezleri arasi */
@media (min-width: 992px) {
	.tk-surec { grid-template-columns: repeat(4, 1fr); }
	.tk-surec::before {
		content: "";
		position: absolute;
		z-index: 0;
		top: 54px;
		inset-inline-start: 54px;
		inset-inline-end: calc((100% - 72px) / 4 - 54px);
		height: 2px;
		background: repeating-linear-gradient(90deg,
			rgba(var(--primary-rgb), .3) 0 6px, transparent 6px 13px);
	}
}

/* =====================================================================
   SSS bolumu (tema kaliba gore: solda baslik + akordiyon, sagda gorsel)
   ---------------------------------------------------------------------
   Gorsel, akordiyon sutunu kadar yukselir; kendi orani satir yuksekligini
   belirlemesin diye 992px ustunde akistan cikarilir (Hakkimizda gorseliyle
   ayni yontem).
   ------------------------------------------------------------------ */
/* Mobilde gorsel gizlenir: dar ekranda 3/4 oranindaki gorsel ekranin
   buyuk bolumunu kaplayip sorulari asagi itiyordu. */
@media (max-width: 991px) {
	.tk-sss__sutun { display: none; }
}

.tk-sss__gorsel {
	overflow: hidden;
	/* Organik "blob" cerceve: dikdortgen kutu yerine yumusak, el yapimi
	   bir form. Ayni oran korunur, gorsel object-fit ile doldurur. */
	border-radius: 58% 42% 55% 45% / 44% 50% 50% 56%;
	aspect-ratio: 3 / 4;
	background: var(--primarylight);
}
.tk-sss__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (min-width: 992px) {
	/* Sutun esnemesin: yuksekligi akordiyona bagli kalmasin */
	.tk-sss > div:last-child { align-self: flex-start; }
	.tk-sss__gorsel {
		aspect-ratio: 3 / 4;
		will-change: transform;
	}
}

/* =====================================================================
   Akordiyon (SSS)
   ---------------------------------------------------------------------
   Tema baslik satirina "bg-light" veriyor; bizim --light degerimiz sayfa
   zeminiyle (#F7F6FE) ayni oldugu icin arka plan gorunmuyordu. Bolum kimi
   sayfada beyaz, kimi sayfada acik mor zeminde durdugu icin tek bir tonla
   her ikisinde de okunmuyor: soru satiri beyaz karta alindi, cevap ise
   marka tonuna. Boylece iki zeminde de ayrisiyorlar.
   ------------------------------------------------------------------ */
.myAccordion .accordion-header {
	background: #fff !important;
	border: 1px solid rgba(var(--primary-rgb), .14);
	box-shadow: 0 2px 10px rgba(11, 8, 40, .04);
	transition: background .25s, border-color .25s, box-shadow .25s;
}
.myAccordion .accordion-header:hover {
	border-color: rgba(var(--primary-rgb), .3);
	box-shadow: 0 6px 18px rgba(11, 8, 40, .07);
}
.myAccordion .accordion-header.open {
	background: var(--primarylight) !important;
	border-color: rgba(var(--primary-rgb), .24);
	box-shadow: inset 3px 0 0 var(--vurgu);
}

/* Cevap: marka tonunda zemin, cerceve yok */
.myAccordion .accordion-content > div {
	background: rgba(var(--primary-rgb), .06) !important;
	border: 0;
}

/* Acilma animasyonu.
   Tema .accordion-content'e yalnizca "transition-duration: 500ms" veriyor;
   transition-property tanimsiz oldugu icin "all" gecerli oluyor ve arka plan,
   cerceve gibi ozellikler de max-height ile birlikte animasyona giriyor.
   Burada yalnizca max-height animasyonlaniyor, icerik ise kisa bir belirme
   hareketiyle geliyor. */
.myAccordion .accordion-content {
	transition: max-height .4s cubic-bezier(.25, .8, .3, 1) !important;
}
.myAccordion .accordion-content > div {
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .3s ease .06s, transform .3s ease .06s;
}
.myAccordion .accordion-header.open + .accordion-content > div {
	opacity: 1;
	transform: translateY(0);
}

/* =====================================================================
   Buton hover davranisi (tek dil)
   ---------------------------------------------------------------------
   Sitede uc ayri davranis vardi: temanin .btn-hover parlama supurmesi,
   hero butonlarinda renk + golge, cerceveli butonda dolgu. Hepsi ayni
   harekete baglandi: 2px yukselme + golge + mevcut renk gecisi.
   ------------------------------------------------------------------ */
.btn,
.tk-btn {
	transition: background-color .3s ease, border-color .3s ease, color .3s ease,
	            transform .3s ease, box-shadow .3s ease;
}
.btn:hover,
.tk-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(var(--primary-rgb), .26);
}
.btn:active,
.tk-btn:active { transform: translateY(0); }

/* Acik zeminli butonlarda marka golgesi yerine notr golge */
.btn-white:hover,
.tk-btn--hayalet:hover { box-shadow: 0 10px 26px rgba(0, 0, 0, .18); }

/* Temada .btn-white'in hover durumu yok; digerleri hover'da renk degistirirken
   bu buton yalnizca yukseliyordu. Marka tonuna donen bir durum eklendi. */
.btn-white:hover {
	background-color: var(--primarylight);
	border-color: var(--primarylight);
	color: var(--primary);
}

/* Temanin parlama supurmesi devre disi (yalnizca bazi butonlarda vardi) */
.btn-hover::after { display: none !important; }

.btn:focus-visible,
.tk-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }

/* Alt bolum logosu */
.tk-footer-logo { display: block; width: 220px; max-width: 100%; height: auto; }
/* Baglanti kutusu logonun disina tasmasin */
.footer-top-logo { display: inline-block; width: fit-content; }
@media (max-width: 639px) {
	.tk-footer-logo { width: 180px; }
}

/* Alt bilgi seridi: sayfanin kendi zemin tonuyla ayrisir, boylece footer
   beyaz icerik alani olarak kalir ve sayfa net bir sekilde kapanir.
   (Ayirici cizgi kaldirildi; ayrimi renk yapiyor.) */
.footer-bottom { background: var(--light); }

/* =====================================================================
   Ekip kartlari (anasayfa)
   ---------------------------------------------------------------------
   Onceden gorsel ve isim ayri iki baglantiydi, kartin geri kalani olu
   alandi. Artik kartin tamami tek baglantidir; bento dosemeleriyle ayni
   hover dili (hafif kalkma + ok isareti) kullanilir.
   ------------------------------------------------------------------ */
.tk-ekip {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px;
}
.tk-ekip__oge { flex: 0 1 calc(50% - 12px); min-width: 0; }
@media (min-width: 992px) {
	.tk-ekip__oge { flex: 0 1 calc(25% - 18px); }
}
/* Dar ekranda da iki sutun kalir: tek sutunda kartlar 3/4 orandaki fotograf
   yuzunden ekran boyu uzuyor ve liste okunmaz hale geliyordu. Kartlar
   daraldigi icin fotograf orani ve yazi olculeri de kuculur. */
@media (max-width: 479px) {
	.tk-ekip { gap: 14px; }
	.tk-ekip__oge { flex: 0 1 calc(50% - 7px); }
	.tk-ekip__gorsel { aspect-ratio: 4 / 5; }
	.tk-ekip__kart { border-radius: 18px; }
	.tk-ekip__ok { width: 32px; height: 32px; inset-inline-end: 10px; bottom: 10px; }
	.tk-ekip__ok svg { width: 17px; height: 17px; }
	.tk-ekip__metin { padding: 12px 12px 16px; }
	.tk-ekip__ad { font-size: 15.5px; }
	.tk-ekip__unvan { font-size: 12.5px; line-height: 1.35; }
}

.tk-ekip__kart {
	/* Satirdaki kartlar en uzun olanin yuksekligini alsin: oge zaten esit
	   yukseklikte (flex stretch), kart da onu doldurur ve metin alani buyur. */
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 24px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .10);
	box-shadow: 0 10px 30px rgba(11, 8, 40, .05);
	overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.tk-ekip__kart:hover {
	transform: translateY(-4px);
	border-color: rgba(var(--primary-rgb), .28);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .10);
}
.tk-ekip__kart:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }

.tk-ekip__gorsel {
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: var(--primarylight);
}
.tk-ekip__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	/* Fotograflarin kadraji birbirinden farkli; yuzler ayni hizada dursun */
	object-fit: cover;
	object-position: 50% 18%;
	transition: transform .6s ease;
}
.tk-ekip__kart:hover .tk-ekip__gorsel img { transform: scale(1.05); }

.tk-ekip__ok {
	position: absolute;
	inset-inline-end: 14px;
	bottom: 14px;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #fff;
	background: var(--primary);
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .3s, transform .3s;
}
.tk-ekip__kart:hover .tk-ekip__ok,
.tk-ekip__kart:focus-visible .tk-ekip__ok { opacity: 1; transform: translateY(0); }

.tk-ekip__metin {
	display: block;
	flex: 1 1 auto;
	padding: 18px 20px 22px;
	text-align: center;
}
.tk-ekip__ad {
	margin: 0 0 4px;
	color: var(--secondary);
	transition: color .25s;
}
.tk-ekip__kart:hover .tk-ekip__ad { color: var(--primary); }
.tk-ekip__unvan {
	display: block;
	font-size: 15px;
	line-height: 1.45;
	color: var(--color-bodycolor);
}

/* =====================================================================
   Sayfa sonu cagri bolumu (CTA)
   ---------------------------------------------------------------------
   Onceden koyu ortulu bir arka plan fotografi uzerinde ortali baslik ve
   buton vardi; agir duruyor ve sayfadan sayfaya metni degisiyordu. Artik
   fotograf yok: marka renginde tek bir panel, solda baslik sagda eylem.
   Icerik her sayfada aynidir (bkz. includes/partials/cta.php).
   ------------------------------------------------------------------ */
.tk-cta {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 28px 40px;
	padding: 48px;
	border-radius: 32px;
	background: var(--primary);
	color: #fff;
}
/* Yumusak isik lekesi - duz zemini kirar */
@keyframes tkSuzul {
	from { transform: translateY(0) rotate(-6deg); }
	to   { transform: translateY(-9px) rotate(10deg); }
}

/* Kosede suzulen minik yildiz - koyu kutuya oyuncu bir imza */
.tk-cta::after {
	content: "";
	position: absolute;
	top: 26px;
	inset-inline-end: 30px;
	width: 30px;
	height: 30px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13.1 6.9 17.1 10.9 24 12 17.1 13.1 13.1 17.1 12 24 10.9 17.1 6.9 13.1 0 12 6.9 10.9 10.9 6.9 12 0Z' fill='%23FFB020'/%3E%3C/svg%3E") center / contain no-repeat;
	opacity: .8;
	animation: tkSuzul 5.5s ease-in-out infinite alternate;
	pointer-events: none;
}

.tk-cta::before {
	content: "";
	position: absolute;
	inset-inline-end: -80px;
	top: -120px;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, 0) 70%);
	pointer-events: none;
}

.tk-cta__metin { position: relative; max-width: 46rem; }

.tk-cta__etiket {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
	font-family: var(--font-base);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.2;
	color: #fff;
}
.tk-cta__etiket::before {
	content: "";
	flex: 0 0 auto;
	width: 28px;
	height: 2px;
	border-radius: 2px;
	background: var(--vurgu);
}

.tk-cta__baslik { margin: 0; color: #fff; }

.tk-cta__ozet {
	margin: 14px 0 0;
	font-size: 16px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .82);
}

/* Eylem alani: tek basina duran buton zayif kaliyordu, hafif bir panele alindi */
.tk-cta__eylem {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex: 0 0 auto;
	min-width: 320px;
	padding: 24px;
	border-radius: 22px;
	background: rgba(255, 255, 255, .10);
	border: 1px solid rgba(255, 255, 255, .18);
	backdrop-filter: blur(4px);
}
.tk-cta__eylem .btn { width: 100%; justify-content: center; }

@media (max-width: 575px) {
	.tk-cta__eylem { min-width: 0; width: 100%; padding: 18px; }
}
/* Iletisim listesi: telefon, e-posta, konum */
.tk-cta__iletisim {
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 12px;
}
.tk-cta__iletisim li {
	display: flex;
	align-items: center;
	gap: 11px;
	font-size: 15.5px;
	line-height: 1.35;
	color: #fff;
}
.tk-cta__iletisim i {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	font-size: 12.5px;
	background: rgba(255, 255, 255, .16);
}
.tk-cta__iletisim a {
	color: #fff;
	font-weight: 600;
	word-break: break-word;
	transition: opacity .25s;
}
.tk-cta__iletisim a:hover { opacity: .8; }

@media (max-width: 991px) {
	.tk-cta { padding: 36px; border-radius: 26px; }
}
@media (max-width: 575px) {
	.tk-cta { padding: 28px 24px; border-radius: 22px; }
	.tk-cta__eylem { width: 100%; }
}

/* CTA bolumu de footer de beyaz oldugu icin arada gorsel bir sinir yoktu */
.page-wraper footer { border-top: 1px solid rgba(var(--primary-rgb), .12); }

/* =====================================================================
   Modal + Randevu sihirbazi
   ---------------------------------------------------------------------
   Solda adim rayi, sagda form. 900px altinda ray ustte yatay bir serit
   olur, 640px altinda tam ekrana yakin calisir.
   ------------------------------------------------------------------ */
body.tk-modal-acik { overflow: hidden; }

.tk-modal {
	position: fixed;
	inset: 0;
	z-index: 3000;
	display: grid;
	place-items: center;
	padding: 24px;
}
.tk-modal__ortu {
	position: absolute;
	inset: 0;
	background: rgba(11, 8, 40, .55);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity .26s ease;
}
.tk-modal.acik .tk-modal__ortu { opacity: 1; }

.tk-modal__kutu {
	position: relative;
	display: grid;
	grid-template-columns: 320px 1fr;
	width: min(1000px, 100%);
	max-height: min(760px, calc(100vh - 48px));
	border-radius: 28px;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 40px 90px rgba(11, 8, 40, .35);
	opacity: 0;
	transform: translateY(18px) scale(.985);
	transition: opacity .26s ease, transform .26s cubic-bezier(.2, .8, .3, 1);
}
.tk-modal.acik .tk-modal__kutu { opacity: 1; transform: none; }

.tk-modal__kapat {
	position: absolute;
	top: 16px;
	inset-inline-end: 16px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: rgba(11, 8, 40, .06);
	color: var(--secondary);
	transition: background .25s, color .25s;
}
.tk-modal__kapat:hover { background: var(--primary); color: #fff; }

/* --- Sol ray --- */
.tk-sihirbaz__ray {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 36px 30px;
	background: var(--primary);
	color: #fff;
	overflow: hidden;
}
.tk-sihirbaz__ray::before {
	content: "";
	position: absolute;
	inset-inline-end: -90px;
	top: -110px;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, 0) 70%);
}
.tk-sihirbaz__etiket {
	position: relative;
	color: #fff;
	margin-bottom: 14px;
	align-self: flex-start;
}
.tk-sihirbaz__ray-baslik { position: relative; margin: 0 0 26px; color: #fff; }

.tk-sihirbaz__adimlar { position: relative; margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.tk-sihirbaz__adim {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px;
	border-radius: 14px;
	transition: background .25s;
}
.tk-sihirbaz__adim.aktif { background: rgba(255, 255, 255, .13); }
.tk-sihirbaz__no {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	font-size: 14px;
	font-weight: 600;
	background: rgba(255, 255, 255, .16);
	border: 1px solid rgba(255, 255, 255, .22);
	transition: background .25s, color .25s;
}
.tk-sihirbaz__adim.aktif .tk-sihirbaz__no { background: #fff; color: var(--primary); }
.tk-sihirbaz__adim.tamam .tk-sihirbaz__no { background: rgba(255, 255, 255, .9); color: var(--primary); }
.tk-sihirbaz__adim-metin { display: grid; line-height: 1.3; }
.tk-sihirbaz__adim-metin strong { font-size: 15.5px; font-weight: 600; }
.tk-sihirbaz__adim-metin small { font-size: 13px; color: rgba(255, 255, 255, .7); }
.tk-sihirbaz__not {
	position: relative;
	margin: auto 0 0;
	padding-top: 22px;
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 255, 255, .68);
}

/* --- Sag govde --- */
.tk-sihirbaz__govde {
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	padding: 40px 40px 0;
}
.tk-sihirbaz { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.tk-sihirbaz__sayfa { display: none; flex: 1; }
.tk-sihirbaz__sayfa.aktif { display: block; animation: tkAdimGel .3s ease; }
@keyframes tkAdimGel { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.tk-sihirbaz__baslik { margin: 0 0 6px; }
.tk-sihirbaz__ozet { margin: 0 0 18px; font-size: 15px; color: var(--color-bodycolor); }

/* Adim uyarisi: "tumu istege bagli" bilgisi aciklama paragrafinin icinde
   kayboluyordu; kendi satirinda, marka zeminli bir seride alindi.
   Ad "__not" degil: sol raydaki dipnot o sinifi kullaniyor. */
.tk-sihirbaz__uyari {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 24px;
	padding: 11px 14px;
	border-radius: 12px;
	background: rgba(var(--primary-rgb), .07);
	border: 1px solid rgba(var(--primary-rgb), .14);
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--secondary);
}
.tk-sihirbaz__uyari svg { flex: 0 0 auto; margin-top: 2px; color: var(--primary); }
.tk-sihirbaz__uyari b { font-weight: 600; color: var(--primary); }
.tk-gizli-alan { position: absolute; left: -9999px; }

/* Hizmet secim kartlari */
.tk-secim { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.tk-secim__oge input { position: absolute; opacity: 0; pointer-events: none; }
.tk-secim__kutu {
	display: flex;
	align-items: center;
	gap: 11px;
	height: 100%;
	padding: 14px 16px;
	border-radius: 14px;
	border: 1px solid rgba(var(--primary-rgb), .14);
	background: #fff;
	font-size: 15px;
	line-height: 1.3;
	cursor: pointer;
	transition: border-color .2s, background .2s, box-shadow .2s;
}
.tk-secim__kutu i { color: var(--primary); font-size: 16px; width: 20px; text-align: center; }
.tk-secim__oge:hover .tk-secim__kutu { border-color: rgba(var(--primary-rgb), .35); }
.tk-secim__oge input:checked + .tk-secim__kutu {
	border-color: var(--vurgu);
	background: rgba(var(--vurgu-rgb), .07);
	box-shadow: 0 0 0 1px var(--vurgu) inset;
}
.tk-secim__oge input:checked + .tk-secim__kutu i { color: var(--vurgu); }
.tk-secim__oge input:focus-visible + .tk-secim__kutu { outline: 2px solid var(--primary); outline-offset: 2px; }

/* Alanlar */
.tk-alanlar { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.tk-alan { display: flex; flex-direction: column; min-width: 0; }
.tk-alan--tam { grid-column: 1 / -1; }
.tk-alan label { margin-bottom: 8px; font-size: 14px; font-weight: 500; color: var(--secondary); }
.tk-alan label span { color: #d92d20; }
.tk-alan input,
.tk-alan select,
.tk-alan textarea {
	width: 100%;
	padding: 13px 16px;
	border-radius: 12px;
	border: 1px solid rgba(var(--primary-rgb), .16);
	background: #fff;
	font-size: 15px;
	color: var(--secondary);
	transition: border-color .2s, box-shadow .2s;
}
.tk-alan input:focus,
.tk-alan select:focus,
.tk-alan textarea:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .12);
}
.tk-alan textarea { resize: vertical; }

/* Select: tarayicinin kendi oku alanin en sagina yapisiyor. Ok kapatilip
   yerine ayni renkte bir SVG chevron konuyor; sagdan 16px bosluk kaliyor. */
.tk-alan select {
	appearance: none;
	-webkit-appearance: none;
	padding-inline-end: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237E7E7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	background-size: 15px;
}
[dir="rtl"] .tk-alan select { background-position: left 16px center; }
.tk-alan select::-ms-expand { display: none; }

/* Son adimdaki ozet */
.tk-sihirbaz__ozet-kutu {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	margin-top: 24px;
	padding: 16px 18px;
	border-radius: 14px;
	background: rgba(var(--primary-rgb), .06);
}
.tk-sihirbaz__ozet-kutu span { display: grid; gap: 2px; }
.tk-sihirbaz__ozet-kutu small { font-size: 12.5px; color: var(--color-bodycolor); }
.tk-sihirbaz__ozet-kutu b { font-size: 14.5px; font-weight: 600; color: var(--secondary); }

/* Alt cubuk */
.tk-sihirbaz__alt {
	position: sticky;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 28px;
	padding: 18px 0 24px;
	background: #fff;
	border-top: 1px solid rgba(var(--primary-rgb), .1);
}
.tk-sihirbaz__sayac { font-size: 14px; color: var(--color-bodycolor); }
.tk-sihirbaz__sayac b { color: var(--secondary); }
.tk-sihirbaz__dugmeler { display: flex; gap: 10px; }
.tk-sihirbaz__alt .btn { padding-block: 13px; font-size: 16px; }

/* --- Basari ekrani --- */
.tk-sihirbaz__bitti {
	display: grid;
	justify-items: center;
	text-align: center;
	gap: 0;
	padding: 40px 0 48px;
	margin: auto 0;
}
.tk-sihirbaz__tik {
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	margin-bottom: 20px;
	border-radius: 50%;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .1);
}
/* Halka ve tik cizilerek gelir */
.tk-tik__halka {
	stroke-dasharray: 145;
	stroke-dashoffset: 145;
	animation: tkTikHalka .55s cubic-bezier(.3, .8, .3, 1) forwards;
	opacity: .35;
}
.tk-tik__cizgi {
	stroke-dasharray: 40;
	stroke-dashoffset: 40;
	animation: tkTikCizgi .35s cubic-bezier(.3, .8, .3, 1) .35s forwards;
}
@keyframes tkTikHalka { to { stroke-dashoffset: 0; } }
@keyframes tkTikCizgi { to { stroke-dashoffset: 0; } }

.tk-sihirbaz__bitti h3 { margin: 0 0 8px; }
.tk-sihirbaz__bitti-ozet { margin: 0 0 26px; max-width: 30rem; color: var(--color-bodycolor); }

/* Gonderilen bilgilerin ozeti */
.tk-bitti-ozet {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px 30px;
	width: 100%;
	max-width: 34rem;
	margin-bottom: 30px;
	padding: 18px 20px;
	border-radius: 16px;
	background: rgba(var(--primary-rgb), .06);
	text-align: start;
}
.tk-bitti-ozet span { display: grid; gap: 2px; }
.tk-bitti-ozet small { font-size: 12.5px; color: var(--color-bodycolor); }
.tk-bitti-ozet b { font-size: 14.5px; font-weight: 600; color: var(--secondary); }

.tk-bitti-eylem { display: grid; justify-items: center; gap: 14px; }
.tk-bitti-telefon {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14.5px;
	color: var(--color-bodycolor);
	transition: color .25s;
}
.tk-bitti-telefon b { color: var(--secondary); font-weight: 600; }
.tk-bitti-telefon:hover,
.tk-bitti-telefon:hover b { color: var(--primary); }
.tk-bitti-telefon i { font-size: 12px; color: var(--primary); }

/* --- Duyarli --- */
@media (max-width: 899px) {
	.tk-modal { padding: 0; }
	.tk-modal__kutu {
		grid-template-columns: 1fr;
		width: 100%;
		max-height: 100vh;
		height: 100vh;
		border-radius: 0;
	}
	/* Mobilde kapatma dugmesi mor rayin uzerine denk geliyor; koyu ikon
	   okunmuyordu. Beyaz varyanta cevrilir. */
	.tk-modal__kapat {
		background: rgba(255, 255, 255, .18);
		color: #fff;
	}
	.tk-modal__kapat:hover,
	.tk-modal__kapat:focus-visible { background: rgba(255, 255, 255, .32); color: #fff; }

	.tk-sihirbaz__ray { padding: 26px 24px 20px; }
	.tk-sihirbaz__ray-baslik { margin-bottom: 18px; }
	/* Mobilde adimlar kutu yerine baglantili gosterge olur: numaralar bir
	   hat uzerinde dizilir, gecilen adimlar dolar. Kart zemini kalkinca
	   yer de kazanilir. */
	.tk-sihirbaz__adimlar {
		grid-auto-flow: column;
		grid-auto-columns: 1fr;
		gap: 0;
		counter-reset: adim;
	}
	.tk-sihirbaz__adim {
		position: relative;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		padding: 0;
		background: none !important;
		text-align: center;
	}
	/* Adimlar arasi hat: her ogenin solundan onceki numaraya uzanir */
	.tk-sihirbaz__adim::before {
		content: "";
		position: absolute;
		top: 15px;
		inset-inline-end: 50%;
		width: 100%;
		height: 2px;
		background: rgba(255, 255, 255, .22);
	}
	.tk-sihirbaz__adim:first-child::before { display: none; }
	.tk-sihirbaz__adim.aktif::before,
	.tk-sihirbaz__adim.tamam::before { background: rgba(255, 255, 255, .85); }

	.tk-sihirbaz__no {
		position: relative;
		z-index: 1;
		width: 32px;
		height: 32px;
		font-size: 13.5px;
	}
	.tk-sihirbaz__adim-metin { justify-items: center; }
	.tk-sihirbaz__adim-metin strong {
		font-size: 13px;
		font-weight: 500;
		color: rgba(255, 255, 255, .68);
		transition: color .25s, font-weight .25s;
	}
	.tk-sihirbaz__adim.aktif .tk-sihirbaz__adim-metin strong { color: #fff; font-weight: 700; }
	.tk-sihirbaz__adim.tamam .tk-sihirbaz__adim-metin strong { color: rgba(255, 255, 255, .9); }
	.tk-sihirbaz__adim-metin small { display: none; }
	.tk-sihirbaz__not { display: none; }
	.tk-sihirbaz__govde { padding: 28px 24px 0; }
}
@media (max-width: 575px) {
	.tk-secim { grid-template-columns: 1fr; }
	.tk-alanlar { grid-template-columns: 1fr; }
	.tk-sihirbaz__alt { flex-direction: column-reverse; align-items: stretch; }
	.tk-sihirbaz__dugmeler { flex-direction: column-reverse; }
	.tk-sihirbaz__alt .btn { width: 100%; justify-content: center; }
	.tk-sihirbaz__sayac { text-align: center; }
}

/* Tarih/saat alanlarinin takvim simgesi.
   Tema simgeyi inset:0 ile alanin tamamina yayiyor ve "background: transparent"
   ile gorunmez kiliyordu: hem alanin her yerine tiklamak seciciyi aciyor hem de
   ortada bir simge kalmiyordu. Simge kendi olcusune dondurulup marka renginde
   bir ikon verildi. */
.tk-alan input[type="date"]::-webkit-calendar-picker-indicator,
.tk-alan input[type="time"]::-webkit-calendar-picker-indicator {
	position: static;
	inset: auto;
	width: 18px;
	height: 18px;
	margin: 0;
	padding: 0;
	transform: none;
	background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%234335B2%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M8%203v4M16%203v4M3%2010h18%27%2F%3E%3C%2Fsvg%3E") center / 18px 18px no-repeat;
	opacity: .65;
	cursor: pointer;
	transition: opacity .2s;
}
.tk-alan input[type="date"]::-webkit-calendar-picker-indicator:hover,
.tk-alan input[type="time"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* --- Hizmet secim kartlari: bilgi dugmesi + acilan bilgi paneli --- */
.tk-secim__oge { position: relative; }
.tk-secim__etiket { display: block; height: 100%; }
.tk-secim__kutu { padding-inline-end: 46px; }
.tk-secim__ad { min-width: 0; }

.tk-secim__bilgi {
	position: absolute;
	inset-inline-end: 10px;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--color-bodycolor);
	transition: background .2s, color .2s;
}
.tk-secim__bilgi:hover,
.tk-secim__bilgi.acik {
	background: rgba(var(--primary-rgb), .12);
	color: var(--primary);
}
.tk-secim__bilgi:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }


/* Hizmet bilgisi: bilgi dugmesinin uzerinde acilan ipucu */
.tk-ipucu {
	position: fixed;
	z-index: 10;
	width: min(320px, calc(100vw - 32px));
	padding: 14px 16px;
	border-radius: 14px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .16);
	box-shadow: 0 16px 40px rgba(11, 8, 40, .14);
	/* Acilirken ve kapanirken ayni gecis; olcum bozulmasin diye yalnizca
	   dikey oteleme kullaniliyor (olcek transformu genisligi degistirirdi). */
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .18s ease, transform .18s cubic-bezier(.2, .8, .3, 1);
}
.tk-ipucu.acik { opacity: 1; transform: translateY(0); }
.tk-ipucu.altta { transform: translateY(-6px); }
.tk-ipucu.altta.acik { transform: translateY(0); }

.tk-ipucu h4 { margin: 0 0 5px; font-size: 15px; font-weight: 600; color: var(--secondary); }
.tk-ipucu p  { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--color-bodycolor); }

.tk-ipucu__ok {
	position: absolute;
	bottom: -6px;
	width: 12px;
	height: 12px;
	margin-inline-start: -6px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .16);
	border-top: 0;
	border-inline-start: 0;
	transform: rotate(45deg);
	border-radius: 0 0 3px 0;
}
	.tk-ipucu.altta .tk-ipucu__ok {
	bottom: auto;
	top: -6px;
	border: 1px solid rgba(var(--primary-rgb), .16);
	border-bottom: 0;
	border-inline-end: 0;
	border-radius: 3px 0 0 0;
}

/* =====================================================================
   Telefon alani: ulke secici + alan kodu + numara
   ---------------------------------------------------------------------
   Alan cercevesi sarmalayiciya tasindi, girdi seffaf birakildi. Boylece
   olcum gerekmiyor (modal gizliyken genislik 0 olculdugu icin onceki
   yontem sihirbazda bozuluyordu).
   ------------------------------------------------------------------ */
.tk-tel {
	display: flex;
	align-items: stretch;
	width: 100%;
	border-radius: 12px;
	border: 1px solid rgba(var(--primary-rgb), .16);
	background: #fff;
	transition: border-color .2s, box-shadow .2s;
	overflow: hidden;
}
.tk-tel:focus-within {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .12);
}

.tk-tel__kod {
	position: relative;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 0 12px 0 14px;
	border-inline-end: 1px solid rgba(var(--primary-rgb), .16);
	font-size: 15px;
	font-weight: 600;
	color: var(--secondary);
	background: rgba(var(--primary-rgb), .04);
	cursor: pointer;
}
.tk-tel__ulke {
	position: absolute;
	inset: 0;
	width: 100%;
	opacity: 0;
	cursor: pointer;
}
.tk-tel__ok {
	width: 0;
	height: 0;
	border-inline: 4px solid transparent;
	border-top: 5px solid var(--color-bodycolor);
}
.tk-tel__bayrak {
	width: 22px;
	height: 16px;
	border-radius: 3px;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(11, 8, 40, .12);
	display: block;
}

/* Girdi: cerceve ve zemin sarmalayicida, burada notr birakilir */
.tk-tel__girdi,
.tk-alan .tk-tel__girdi {
	flex: 1;
	min-width: 0;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: none !important;
	padding-inline: 14px !important;
}


/* =====================================================================
   Sabit butonlar (sol alt): WhatsApp + Randevu
   ---------------------------------------------------------------------
   Sag altta temanin "yukari cik" butonu ve toast yigini var; bu yuzden
   sol alta konumlandirildi. Durus halinde yalnizca ikon; uzerine
   gelindiginde genisleyip yaziyi acar. Modal acikken gizlenir.
   ------------------------------------------------------------------ */
.tk-sabit {
	position: fixed;
	z-index: 1500;
	inset-inline-start: 24px;
	bottom: 24px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	transition: opacity .25s ease, transform .25s ease;
}

.tk-sabit__dugme {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0;
	height: 58px;
	padding-inline: 18px;
	border-radius: 50px;
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	transition: gap .3s ease, padding-inline .3s ease, background .3s ease,
	            box-shadow .3s ease, filter .3s ease;
}
.tk-sabit__dugme:hover { color: #fff; }
.tk-sabit__dugme:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }

.tk-sabit__yazi {
	max-width: 0;
	overflow: hidden;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	opacity: 0;
	transition: max-width .3s ease, opacity .25s ease;
}
.tk-sabit__dugme:hover .tk-sabit__yazi,
.tk-sabit__dugme:focus-visible .tk-sabit__yazi { max-width: 160px; opacity: 1; }
.tk-sabit__dugme:hover,
.tk-sabit__dugme:focus-visible { gap: 10px; padding-inline: 20px 24px; }

/* --- Randevu --- */
.tk-sabit__dugme--randevu {
	background: var(--primary);
	box-shadow: 0 12px 30px rgba(var(--primary-rgb), .38);
	animation: tkHale 4.5s ease-in-out infinite;
}
.tk-sabit__dugme--randevu:hover { background: var(--primarydark, #382AA1); animation: none; }
@keyframes tkHale {
	0%, 100% { box-shadow: 0 12px 30px rgba(var(--primary-rgb), .34); }
	50%      { box-shadow: 0 14px 40px rgba(var(--primary-rgb), .5); }
}

/* Isik supurmesi yalnizca randevu butonunda */
.tk-sabit__dugme--randevu::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	inset-inline-start: 0;
	width: 45%;
	background: linear-gradient(100deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, .38) 50%,
		rgba(255, 255, 255, 0) 100%);
	transform: translateX(-160%);
	animation: tkSupurme 4.5s cubic-bezier(.4, 0, .2, 1) infinite;
	pointer-events: none;
}
.tk-sabit__dugme--randevu:hover::before { animation: none; opacity: 0; }
@keyframes tkSupurme {
	0%, 55%   { transform: translateX(-160%); }
	85%, 100% { transform: translateX(360%); }
}

/* --- WhatsApp --- */
.tk-sabit__dugme--wa {
	background: #25D366;
	box-shadow: 0 10px 26px rgba(37, 211, 102, .34);
}
.tk-sabit__dugme--wa:hover { background: #1FB855; box-shadow: 0 14px 34px rgba(37, 211, 102, .45); }
.tk-sabit__dugme--wa i { font-size: 24px; }

/* Modal acikken gizlenir */
/* Mobil menu ya da modal acikken sabit butonlar ve dil seridi gizlenir;
   aksi halde acilan panelin uzerinde duruyorlar. */
body.tk-menu-acik .tk-sabit,
body.tk-menu-acik .tk-dil-oneri,
body.tk-modal-acik .tk-dil-oneri {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

body.tk-modal-acik .tk-sabit {
	opacity: 0;
	pointer-events: none;
	transform: translateY(10px);
}

@media (max-width: 575px) {
	.tk-sabit { inset-inline-start: 16px; bottom: 16px; gap: 10px; }
	.tk-sabit__dugme { height: 52px; padding-inline: 15px; }
	.tk-sabit__dugme--wa i { font-size: 22px; }
}

/* =====================================================================
   Hizmet izgarasi (bento disi sayfalar)
   ---------------------------------------------------------------------
   Kart tasarimi anasayfadaki bento dosemesiyle ayni (hizmet-kart.php);
   burada yalnizca yerlesim esit sutunlara duser.
   ------------------------------------------------------------------ */
/* Mobilde de iki sutun: tek sutunda 10 hizmet ekran boyu uzuyordu
   (anasayfadaki .tk-bento ile ayni dil). */
.tk-hizmet-izgara {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}
.tk-hizmet-izgara .tk-bento__ic { aspect-ratio: 4 / 5; }
@media (min-width: 640px) { .tk-hizmet-izgara { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (min-width: 992px) { .tk-hizmet-izgara { grid-template-columns: repeat(3, 1fr); } }

/* =====================================================================
   Ic sayfa basligi (banner.php)
   ---------------------------------------------------------------------
   Onceki tasarim iki dekoratif gorsel, buyuk bir bulanik leke ve genis
   bir yukseklikle sayfanin ustunu doldururdu. Sade bir baslik alanina
   cevrildi: ekmek kirintisi + H1 + tek satir aciklama. Header icerigin
   uzerine bindigi icin ust bosluk buradan verilir.
   ------------------------------------------------------------------ */
.tk-sayfa-basi {
	position: relative;
	/* Dolu renk zemini: beyaz bant yerine sayfaya girerken gercek bir
	   renk ani. Soluk lekelerle "kirli beyaz" gorunumu denendi ve
	   birakildi -- renk ya vardir ya yoktur. */
	background: linear-gradient(152deg, #EFEDFE 0%, #FBEEF6 48%, #FFF6E4 100%);
	padding-block: calc(var(--tk-header-yuk) + 52px) 76px;
	/* Alt kenar dalgali kesilir: dikdortgen bant biter, altindaki bolum
	   zemini ne renkse dogrudan gorunur. Ust kisim tam opak maskeyle
	   korunur; dalga sabit 44px yuksekliginde kalir, bolum uzadikca
	   orani bozulmaz. */
	--tk-dalga: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 44' preserveAspectRatio='none'%3E%3Cpath d='M0,0 H1200 V18 C1040,44 890,6 730,20 C570,34 420,4 260,18 C150,28 70,14 0,26 Z' fill='%23000'/%3E%3C/svg%3E");
	-webkit-mask-image: linear-gradient(#000, #000), var(--tk-dalga);
	        mask-image: linear-gradient(#000, #000), var(--tk-dalga);
	-webkit-mask-size: 100% calc(100% - 43px), 100% 44px;
	        mask-size: 100% calc(100% - 43px), 100% 44px;
	-webkit-mask-position: top, bottom;
	        mask-position: top, bottom;
	-webkit-mask-repeat: no-repeat, no-repeat;
	        mask-repeat: no-repeat, no-repeat;
}
.tk-sayfa-basi > .container { position: relative; }


/* Ekmek kirintisi */
.tk-kirinti ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: var(--color-bodycolor);
}
.tk-kirinti li { display: flex; align-items: center; gap: 10px; }
/* Ayirac noktalari paletin dort tonunda doner */
.tk-kirinti li + li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--vurgu);
}
.tk-kirinti li:nth-child(3)::before { background: var(--gunes); }
.tk-kirinti li:nth-child(4)::before { background: var(--turkuaz); }
.tk-kirinti li:nth-child(5)::before { background: var(--primary); }
.tk-kirinti a { color: var(--color-bodycolor); transition: color .25s; }
.tk-kirinti a:hover { color: var(--primary); }
.tk-kirinti [aria-current="page"] { color: var(--secondary); font-weight: 600; }

/* Sarmalayici yalnizca konumlanma icin: nokta izgarasi buna gore durur */
.tk-sayfa-basi__ic { position: relative; }

.tk-sayfa-basi__baslik { margin: 0; max-width: 22ch; }
/* Son kelime vurgusu: hero'daki ayni dil. Firca darbesi ve yildiz
   kelimeye tutunur, bosluga serpistirilmez. <em> banner.php'de otomatik
   olarak son kelimeye sarilir. */
.tk-sayfa-basi__baslik em {
	font-style: normal;
	position: relative;
	display: inline-block;
	padding-bottom: .04em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M4 10 C40 4 85 11 120 7 C150 4 176 6 196 9' fill='none' stroke='%23F353A0' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") bottom center / 100% .13em no-repeat;
}
.tk-sayfa-basi__baslik em::after {
	content: "";
	position: absolute;
	/* Kelimenin ust hizasinda: daha yukarisi cok satirli basliklarda
	   ustteki satira giriyor. */
	top: -.04em;
	inset-inline-end: -.62em;
	width: .32em;
	height: .32em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13.1 6.9 17.1 10.9 24 12 17.1 13.1 13.1 17.1 12 24 10.9 17.1 6.9 13.1 0 12 6.9 10.9 10.9 6.9 12 0Z' fill='%23FFB020'/%3E%3C/svg%3E") center / contain no-repeat;
	animation: tkSuzul 4.5s ease-in-out infinite alternate;
}
.tk-sayfa-basi__aciklama {
	margin: 16px 0 0;
	max-width: 46rem;
	font-size: 17px;
	line-height: 1.6;
	color: var(--color-bodycolor);
	/* Her sayfada tam iki satir: uzun metinler kesilir, kisa metinler
	   icin yer ayrilir. Aksi halde bolum yuksekligi sayfadan sayfaya
	   degisiyordu (hizmet ozetinde 2, ekip unvaninda 1, yazi ozetinde
	   4 satir). Tam metin DOM'da kalir; yalnizca gorsel olarak kirpilir. */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
	min-height: 3.2em;
}

@media (max-width: 767px) {
	.tk-sayfa-basi { padding-block: calc(var(--tk-header-yuk) + 34px) 62px; }
	.tk-sayfa-basi__aciklama { font-size: 16px; }
}

/* Banner'i olmayan sayfalarda (404) header icerigin uzerine biner; ust bosluk
   burada verilir, boylece bolumun kendi dolgusu simetrik kalabilir. */
.tk-header-bosluk { padding-top: var(--tk-header-yuk); }

/* =====================================================================
   Hata sayfasi (404)
   ---------------------------------------------------------------------
   Temanin mavi "glitch" gorseli kaldirildi (marka paletinde degildi);
   kod, sayfanin kendi tipografisiyle yaziliyor.
   ------------------------------------------------------------------ */
.tk-hata {
	display: grid;
	justify-items: center;
	text-align: center;
	max-width: 40rem;
	margin-inline: auto;
	padding-block: 40px;
}
.tk-hata__kod {
	font-size: clamp(6rem, 16vw, 11rem);
	font-weight: 700;
	line-height: .9;
	letter-spacing: -.04em;
	color: transparent;
	background: linear-gradient(180deg,
		rgba(var(--primary-rgb), .28) 0%,
		rgba(var(--primary-rgb), .06) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	margin-bottom: 8px;
}
.tk-hata__baslik { margin: 0; }
.tk-hata__aciklama {
	margin: 16px 0 32px;
	font-size: 17px;
	line-height: 1.6;
	color: var(--color-bodycolor);
}
.tk-hata__eylem { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* =====================================================================
   Galeri: bento izgara + filtre + buyutec
   ---------------------------------------------------------------------
   Dosemeler 6'li bir desende tekrar eder; bu sayede fotograf sayisi kac
   olursa olsun duzen bozulmaz.
   ------------------------------------------------------------------ */
.tk-filtre {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-bottom: 40px;
}
.tk-filtre__dugme {
	padding: 11px 22px;
	border-radius: 12px;
	border: 1px solid rgba(var(--primary-rgb), .16);
	background: #fff;
	font-size: 15px;
	font-weight: 500;
	color: var(--secondary);
	transition: background .25s, color .25s, border-color .25s, box-shadow .25s;
}
.tk-filtre__dugme:hover { border-color: rgba(var(--vurgu-rgb), .45); color: var(--vurgudark); }
.tk-filtre__dugme.aktif {
	background: var(--vurgu);
	border-color: var(--vurgu);
	color: #fff;
	box-shadow: 0 8px 20px rgba(var(--vurgu-rgb), .30);
}

/* --- Masonry izgara ------------------------------------------------- */
/* Sutunlar site.js tarafindan olusturulur; her sutunun son dosemesi kalan
   yuksekligi doldurur, boylece tum sutunlar ayni hizada biter. */
.tk-galeri {
	display: flex;
	align-items: stretch;
	gap: 16px;
}
.tk-galeri__sutun {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
@media (min-width: 768px)  { .tk-galeri, .tk-galeri__sutun { gap: 18px; } }
@media (min-width: 1200px) { .tk-galeri, .tk-galeri__sutun { gap: 20px; } }

.tk-galeri__oge {
	margin: 0;
	min-width: 0;
	opacity: 1;
	transform: none;
	transition: opacity .25s ease, transform .3s ease;
}
.tk-galeri__oge.cikiyor,
.tk-galeri__oge.giriyor { opacity: 0; transform: scale(.94); }
.tk-galeri__oge[hidden] { display: none; }

/* Kalan bosluk sutundaki tum dosemelere paylastirilir; tek bir doseme
   asiri uzamaz, sutunlar yine ayni hizada biter. */
.tk-galeri__sutun .tk-galeri__oge { flex: 1 1 auto; min-height: 0; }
.tk-galeri__sutun .tk-galeri__baglanti { height: 100%; }
.tk-galeri__sutun .tk-galeri__baglanti img { height: 100%; object-fit: cover; }

.tk-galeri__baglanti {
	position: relative;
	display: block;
	border-radius: 20px;
	overflow: hidden;
	background: var(--primarylight);
	transition: transform .3s ease;
}
/* Duvara asilmis fotograf hissi: donusumlu hafif egim, hover'da duzelir.
   Egim filtre animasyonunun transformuyla cakismasin diye ogeye degil
   icteki baglantiya verilir. */
.tk-galeri__oge:nth-child(odd)  .tk-galeri__baglanti { transform: rotate(-1.1deg); }
.tk-galeri__oge:nth-child(even) .tk-galeri__baglanti { transform: rotate(1.1deg); }
.tk-galeri__oge:hover .tk-galeri__baglanti { transform: rotate(0deg) scale(1.02); }
/* Masonry etkisi gorselin kendi oranindan gelir */
.tk-galeri__baglanti img {
	display: block;
	width: 100%;
	height: auto;
	transition: transform .6s cubic-bezier(.2, .8, .3, 1);
}
.tk-galeri__baglanti:hover img { transform: scale(1.06); }

.tk-galeri__ortu {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: rgba(11, 8, 40, .38);
	opacity: 0;
	transition: opacity .3s ease;
}
.tk-galeri__baglanti:hover .tk-galeri__ortu,
.tk-galeri__baglanti:focus-visible .tk-galeri__ortu { opacity: 1; }
.tk-galeri__buyut {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	color: var(--primary);
	background: #fff;
	transform: scale(.85);
	transition: transform .3s cubic-bezier(.2, .8, .3, 1);
}
.tk-galeri__baglanti:hover .tk-galeri__buyut { transform: scale(1); }

/* =====================================================================
   Buyutec (lightbox)
   ------------------------------------------------------------------ */
.tk-buyutec {
	position: fixed;
	inset: 0;
	z-index: 3500;
	display: grid;
	place-items: center;
	padding: 24px;
	opacity: 0;
	transition: opacity .26s ease;
}
.tk-buyutec.acik { opacity: 1; }
.tk-buyutec__ortu {
	position: absolute;
	inset: 0;
	background: rgba(8, 6, 26, .92);
	backdrop-filter: blur(4px);
}

.tk-buyutec__cerceve {
	position: relative;
	margin: 0;
	display: grid;
	justify-items: center;
	gap: 16px;
	max-width: min(1100px, 92vw);
}
.tk-buyutec__cerceve img {
	display: block;
	max-width: 100%;
	max-height: 76vh;
	border-radius: 18px;
	box-shadow: 0 30px 70px rgba(0, 0, 0, .5);
}
.tk-buyutec__cerceve.gel-sag { animation: tkGelSag .32s cubic-bezier(.2, .8, .3, 1); }
.tk-buyutec__cerceve.gel-sol { animation: tkGelSol .32s cubic-bezier(.2, .8, .3, 1); }
@keyframes tkGelSag { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes tkGelSol { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }

.tk-buyutec__alt {
	display: flex;
	align-items: center;
	gap: 16px;
	color: rgba(255, 255, 255, .8);
	font-size: 14.5px;
}
.tk-buyutec__sayac { color: rgba(255, 255, 255, .6); }

.tk-buyutec__kapat,
.tk-buyutec__ok {
	position: absolute;
	z-index: 2;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	color: #fff;
	background: rgba(255, 255, 255, .12);
	backdrop-filter: blur(4px);
	transition: background .25s, transform .25s;
}
.tk-buyutec__kapat:hover,
.tk-buyutec__ok:hover { background: var(--primary); }
.tk-buyutec__kapat:focus-visible,
.tk-buyutec__ok:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.tk-buyutec__kapat { top: 22px; inset-inline-end: 22px; width: 46px; height: 46px; }
.tk-buyutec__ok { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; }
.tk-buyutec__ok--geri  { inset-inline-start: 22px; }
.tk-buyutec__ok--ileri { inset-inline-end: 22px; }
.tk-buyutec__ok:hover { transform: translateY(-50%) scale(1.06); }

@media (max-width: 767px) {
	.tk-buyutec { padding: 14px; }
	.tk-buyutec__cerceve img { max-height: 68vh; }
	.tk-buyutec__ok { width: 44px; height: 44px; }
	.tk-buyutec__ok--geri  { inset-inline-start: 10px; }
	.tk-buyutec__ok--ileri { inset-inline-end: 10px; }
	.tk-buyutec__kapat { top: 14px; inset-inline-end: 14px; width: 40px; height: 40px; }
}

/* =====================================================================
   "Neden Trea Kids" kartlari
   ---------------------------------------------------------------------
   Onceki tasarim ortali metin, dort ayni onay ikonu ve ince gri cerceve
   kullaniyordu; sitenin kart diline (sola dayali, 24px kose, marka tonlu
   cerceve, hover'da kalkma) uyarlandi. Her maddeye kendi ikonu verildi.
   ------------------------------------------------------------------ */
.tk-neden {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}
@media (min-width: 640px) { .tk-neden { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .tk-neden { grid-template-columns: repeat(4, 1fr); } }

.tk-neden__oge {
	display: flex;
	flex-direction: column;
	padding: 30px;
	border-radius: 26px 26px 26px 8px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .10);
	box-shadow: 0 10px 30px rgba(11, 8, 40, .05);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.tk-neden__oge:hover {
	transform: translateY(-4px);
	border-color: rgba(var(--primary-rgb), .28);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .10);
}

.tk-neden__ikon {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 20px;
	border-radius: 16px;
	font-size: 20px;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .1);
	transition: background .3s ease, color .3s ease;
}
.tk-neden__oge:hover .tk-neden__ikon { background: var(--primary); color: #fff; }

/* Kartlar 4'lu renk donusumuyle gelir: mor - pembe - gunes - turkuaz.
   Dolu gunes zeminde ikon koyu kalir (kontrast). */
.tk-neden__oge:nth-child(4n+2) .tk-neden__ikon { color: var(--vurgu); background: rgba(var(--vurgu-rgb), .12); }
.tk-neden__oge:nth-child(4n+2):hover .tk-neden__ikon { background: var(--vurgu); color: #fff; }
.tk-neden__oge:nth-child(4n+2):hover { border-color: rgba(var(--vurgu-rgb), .35); }

.tk-neden__oge:nth-child(4n+3) .tk-neden__ikon { color: var(--gunesdark); background: rgba(var(--gunes-rgb), .18); }
.tk-neden__oge:nth-child(4n+3):hover .tk-neden__ikon { background: var(--gunes); color: var(--secondary); }
.tk-neden__oge:nth-child(4n+3):hover { border-color: rgba(var(--gunes-rgb), .5); }

.tk-neden__oge:nth-child(4n) .tk-neden__ikon { color: var(--turkuazdark); background: rgba(var(--turkuaz-rgb), .14); }
.tk-neden__oge:nth-child(4n):hover .tk-neden__ikon { background: var(--turkuaz); color: #fff; }
.tk-neden__oge:nth-child(4n):hover { border-color: rgba(var(--turkuaz-rgb), .45); }

.tk-neden__oge:nth-child(even) { border-radius: 26px 26px 8px 26px; }

.tk-neden__ad { margin: 0 0 8px; }
.tk-neden__ozet {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--color-bodycolor);
}

/* =====================================================================
   Yaklasim kartlari (Hakkimizda: amac + misyon)
   ---------------------------------------------------------------------
   Serbest HTML metin blogu yerine iki yapilandirilmis kart; sitenin
   diger kartlariyla ayni dil (24px kose, marka tonlu cerceve, hover'da
   kalkma, yuvarlatilmis kare ikon).
   ------------------------------------------------------------------ */
.tk-bolum-basi__ozet { margin-top: 16px; }
.tk-bolum-basi__ozet p {
	margin: 0;
	font-size: 16.5px;
	line-height: 1.65;
	color: var(--color-bodycolor);
}

.tk-yaklasim {
	display: grid;
	grid-template-columns: 1fr;
	gap: 26px;
	margin-top: 40px;
}

/* Soldaki gorsel, sag sutunun yuksekligini takip eder (Hakkimizda gorseliyle
   ayni yontem: 992px ustunde akistan cikarilir, altinda sabit oran). */
.tk-yaklasim__gorsel {
	overflow: hidden;
	border-radius: 24px;
	aspect-ratio: 10 / 9;
	background: var(--primarylight);
}
.tk-yaklasim__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
@media (min-width: 992px) {
	.tk-yaklasim-duzen > div:last-child { position: relative; }
	.tk-yaklasim-duzen > div { margin-bottom: 0; }
	.tk-yaklasim__gorsel { position: absolute; inset: -50px 0; aspect-ratio: auto; }
}

/* Sade sunum: kart kabugu yok, bloklar ince bir cizgiyle ayrilir.
   Ikon basligin icinde durur; boylece baslik ve paragraf ayni sol
   kenardan baslar, metin girintili gorunmez. */
.tk-yaklasim__oge + .tk-yaklasim__oge {
	padding-top: 26px;
	border-top: 1px solid rgba(var(--primary-rgb), .14);
}

.tk-yaklasim__ad {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 10px;
}
.tk-yaklasim__ikon {
	flex: 0 0 auto;
	font-size: 16px;
	color: var(--primary);
}
.tk-yaklasim__metin {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--color-bodycolor);
}


/* =====================================================================
   Rakamlarla (Hakkimizda)
   ---------------------------------------------------------------------
   Ortali duz metin yerine marka tonunda tek bir panel; hero'daki sayi
   seridiyle ayni dil.
   ------------------------------------------------------------------ */
/* Oge sayisi degisebiliyor (bir rakam kaldirildi); sabit 4 sutun yerine
   ogeler esit paylasan bir satir kullanilir, bos hucre kalmaz. */
.tk-sayilar {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	margin: 0;
	padding: 40px 20px;
	list-style: none;
	border-radius: 28px;
	background: rgba(var(--primary-rgb), .06);
	border: 1px solid rgba(var(--primary-rgb), .12);
}
@media (min-width: 768px) { .tk-sayilar { padding: 48px 24px; } }

.tk-sayilar li {
	flex: 1 1 50%;                 /* dar ekranda ikili, genis ekranda tek satir */
	display: grid;
	gap: 6px;
	justify-items: center;
	text-align: center;
	padding: 18px 12px;
	position: relative;
}
@media (min-width: 768px) { .tk-sayilar li { flex: 1 1 0; } }

/* Sutun ayraclari */
.tk-sayilar li + li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 14%;
	height: 72%;
	width: 1px;
	background: rgba(var(--primary-rgb), .16);
}
@media (max-width: 767px) {
	.tk-sayilar li:nth-child(odd)::before { display: none; }
}

.tk-sayilar strong {
	font-size: clamp(2rem, 3.4vw, 2.75rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -.02em;
	color: var(--vurgudark);
}
/* Acik zeminde koyu turevler kullanilir (buyuk metin icin 3:1 tabani) */
.tk-sayilar li:nth-child(4n+2) strong { color: var(--gunesdark); }
.tk-sayilar li:nth-child(4n+3) strong { color: var(--turkuazdark); }
.tk-sayilar li:nth-child(4n)   strong { color: var(--primary); }
.tk-sayilar span {
	font-size: 15px;
	line-height: 1.45;
	color: var(--color-bodycolor);
	text-wrap: balance;
}

/* Yaklasim bolumu: alt eylemler */
.tk-yaklasim__eylem {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 26px;
	margin-top: 34px;
}
.tk-yaklasim__bag {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 16px;
	font-weight: 600;
	color: var(--secondary);
	transition: color .25s, gap .25s;
}
.tk-yaklasim__bag i { font-size: 13px; color: var(--primary); transition: transform .25s; }
.tk-yaklasim__bag:hover { color: var(--primary); gap: 13px; }
.tk-yaklasim__bag:hover i { transform: translateX(2px); }

/* =====================================================================
   Ekip uyesi ozgecmisi
   ---------------------------------------------------------------------
   Metin duz bir blok halindeydi; alt basliklar kalin bir satirdan,
   egitim listesi de duz madde isaretlerinden ibaretti. Bloklar ayrildi,
   egitim listesi marka tonunda bir panele alindi.
   ------------------------------------------------------------------ */
.tk-uye-ozgecmis > *:first-child { margin-top: 0; }
.tk-uye-ozgecmis > *:last-child  { margin-bottom: 0; }

/* Alt basliklar: ustunde ince ayrac ve kisa marka cizgisi */
.tk-uye-ozgecmis h3 {
	position: relative;
	margin: 32px 0 14px;
	padding-top: 24px;
	border-top: 1px solid rgba(var(--primary-rgb), .14);
	font-size: 18px;
	font-weight: 600;
	color: var(--secondary);
}
.tk-uye-ozgecmis h3::before {
	content: "";
	position: absolute;
	top: -1px;
	inset-inline-start: 0;
	width: 40px;
	height: 2px;
	background: var(--primary);
}
.tk-uye-ozgecmis > h3:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.tk-uye-ozgecmis > h3:first-child::before { display: none; }

/* Egitim listesi: panel + marka tonunda isaretler */
.tk-uye-ozgecmis ul {
	margin: 0 0 4px;
	padding: 6px 0;
	list-style: none;
	border-radius: 16px;
	background: rgba(var(--primary-rgb), .06);
	overflow: hidden;
}
.tk-uye-ozgecmis ul li {
	position: relative;
	margin: 0;
	padding: 14px 24px 14px 50px;
	font-size: 15.5px;
	line-height: 1.5;
	color: var(--secondary);
}
.tk-uye-ozgecmis ul li + li { border-top: 1px solid rgba(var(--primary-rgb), .12); }
.tk-uye-ozgecmis ul li::before {
	content: "";
	position: absolute;
	inset-inline-start: 24px;
	top: 20px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--primary);
	box-shadow: 0 0 0 4px rgba(var(--primary-rgb), .14);
}

.tk-uye-ozgecmis p {
	margin: 0 0 14px;
	font-size: 15.5px;
	line-height: 1.75;
	color: var(--color-bodycolor);
}

/* Uye detayinda gorsel, metin uzun oldugunda ekranda kalsin.
   Yapisma site.js icindeki yapiskanlar() ile saglanir (ScrollSmoother
   transform kullandigi icin native sticky calismiyor). */
.tk-uye-yan { will-change: transform; }



/* =====================================================================
   Hizmet detay sayfasi
   ---------------------------------------------------------------------
   Eski tema kalibindaki ince gri cerceveli yan kutular ve fazladan yer
   tutucu gorsel kaldirildi; yan sutun sitenin kart diline getirildi ve
   okuma boyunca ekranda kalacak sekilde yapiskan yapildi.
   ------------------------------------------------------------------ */
.tk-hizmet-detay__gorsel {
	border-radius: 24px;
	overflow: hidden;
	margin-bottom: 34px;
	background: var(--primarylight);
}
.tk-hizmet-detay__gorsel img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.tk-hizmet-detay__metin > *:first-child { margin-top: 0; }
.tk-hizmet-detay__eylem {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 26px;
	margin-top: 34px;
}

/* --- Yan sutun --- */
.tk-yan { display: grid; gap: 24px; will-change: transform; }

.tk-yan__kart {
	padding: 26px;
	border-radius: 24px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .10);
	box-shadow: 0 10px 30px rgba(11, 8, 40, .05);
}
.tk-yan__baslik { margin: 0 0 6px; }

/* Hizmet satirlari: mega menudeki dille ayni (yuvarlatilmis kare ikon) */
.tk-yan__liste { display: grid; gap: 4px; margin: 8px 0 0; padding: 0; list-style: none; }
.tk-yan__liste a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border-radius: 12px;
	font-size: 15px;
	color: var(--secondary);
	transition: background .25s, color .25s;
}
.tk-yan__ikon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 11px;
	font-size: 14px;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .1);
	transition: background .25s, color .25s;
}
.tk-yan__ad { flex: 1; min-width: 0; line-height: 1.3; }
.tk-yan__ok {
	flex: 0 0 auto;
	font-size: 12px;
	color: var(--primary);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s, transform .25s;
}
.tk-yan__liste a:hover { background: rgba(var(--primary-rgb), .07); color: var(--primary); }
.tk-yan__liste a:hover .tk-yan__ikon { background: var(--primary); color: #fff; }
.tk-yan__liste a:hover .tk-yan__ok { opacity: 1; transform: translateX(0); }

/* Yan sutundaki cagri kutusu */
.tk-yan__cagri {
	position: relative;
	overflow: hidden;
	padding: 28px;
	border-radius: 24px;
	background: var(--primary);
	color: #fff;
}
.tk-yan__cagri::before {
	content: "";
	position: absolute;
	inset-inline-end: -70px;
	top: -90px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 70%);
	pointer-events: none;
}
.tk-yan__etiket {
	position: relative;
	margin-bottom: 14px;
	color: #fff;
}
.tk-yan__cagri-baslik { position: relative; margin: 0 0 18px; color: #fff; }

.tk-yan__iletisim {
	position: relative;
	display: grid;
	gap: 12px;
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}
.tk-yan__iletisim li { display: flex; align-items: center; gap: 11px; font-size: 15px; }
.tk-yan__iletisim i {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 12px;
	background: rgba(255, 255, 255, .16);
}
.tk-yan__iletisim a { color: #fff; font-weight: 600; word-break: break-word; transition: opacity .25s; }
.tk-yan__iletisim a:hover { opacity: .8; }
.tk-yan__cagri .btn { position: relative; width: 100%; justify-content: center; }


/* =====================================================================
   Iletisim sayfasi
   ---------------------------------------------------------------------
   Solda iletisim kanallari + calisma saatleri, sagda beyaz kart icinde
   form; altta kose yuvarlatilmis harita ve uzerine binen adres karti.
   Form alanlari randevu sihirbaziyla ayni (.tk-alanlar / .tk-alan)
   bilesenleri kullanir; telefon alani site.js tarafindan ulke seciciye
   donusturulur.
   ------------------------------------------------------------------ */
.tk-iletisim {
	display: grid;
	gap: 32px;
	align-items: stretch;
}
@media (min-width: 992px) {
	.tk-iletisim { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: 40px; }
}
@media (min-width: 1400px) {
	.tk-iletisim { gap: 60px; }
}

/* --- Sol sutun ---
   Iki sutun ayni yukseklikte bitsin diye her iki taraf da dikey flex; artan
   bosluk solda kanal kutucuklarina, sagda mesaj alanina dagitilir. */
.tk-iletisim__bilgi { display: flex; flex-direction: column; }
/* Etiket flex ogesi olarak satiri kaplamasin */
.tk-iletisim__bilgi > .tk-etiket { align-self: flex-start; }
.tk-iletisim__baslik { margin: 16px 0 0; }
.tk-iletisim__ozet {
	max-width: 34rem;
	margin: 14px 0 0;
	font-size: 16.5px;
	line-height: 1.65;
}

/* Kanallar: alt alta uzun bir liste yerine iki sutunlu kutucuklar */
.tk-iletisim__kanallar {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
	flex: 1 1 auto;
	align-content: stretch;
}
.tk-iletisim__kanal {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	height: 100%;
	padding: 20px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .1);
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.tk-iletisim__kanal:hover {
	border-color: rgba(var(--primary-rgb), .3);
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(var(--primary-rgb), .1);
}
.tk-iletisim__ikon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 14px;
	font-size: 17px;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .09);
	transition: background-color .25s ease, color .25s ease;
}
.tk-iletisim__kanal:hover .tk-iletisim__ikon { background: var(--primary); color: #fff; }

.tk-iletisim__metin { display: grid; gap: 3px; min-width: 0; }
.tk-iletisim__ad {
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--color-bodycolor);
}
.tk-iletisim__deger {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--secondary);
	word-break: break-word;
	transition: color .25s ease;
}
.tk-iletisim__kanal:hover .tk-iletisim__deger { color: var(--primary); }

/* Ok sag ust kosede durur, yalnizca uzerine gelindiginde gorunur */
.tk-iletisim__ok {
	position: absolute;
	inset-block-start: 24px;
	inset-inline-end: 20px;
	font-size: 14px;
	color: var(--primary);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s ease, transform .25s ease;
}
.tk-iletisim__kanal:hover .tk-iletisim__ok { opacity: 1; transform: translateX(0); }

@media (max-width: 479px) {
	.tk-iletisim__kanallar { grid-template-columns: 1fr; }
}

/* Calisma saatleri */
.tk-iletisim__saat {
	margin-top: 12px;
	padding: 20px 22px;
	border-radius: 16px;
	background: rgba(var(--primary-rgb), .07);
	border: 1px solid rgba(var(--primary-rgb), .1);
}
.tk-iletisim__saat-baslik {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 12px;
	color: var(--secondary);
}
.tk-iletisim__saat-baslik i { font-size: 15px; color: var(--primary); }
.tk-iletisim__saat ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.tk-iletisim__saat li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	font-size: 15px;
	color: var(--color-bodycolor);
}
.tk-iletisim__saat li + li { padding-top: 9px; border-top: 1px dashed rgba(var(--primary-rgb), .18); }
.tk-iletisim__saat b { font-weight: 600; color: var(--secondary); white-space: nowrap; }

/* Sosyal hesaplar */
.tk-iletisim__sosyal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 26px;
}
.tk-iletisim__sosyal > span {
	margin-inline-end: 4px;
	font-size: 15px;
	color: var(--color-bodycolor);
}
.tk-iletisim__sosyal a {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	font-size: 17px;                  /* altbilgideki .tk-sosyal ile ayni olcu */
	color: var(--primary);
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .14);
	transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}
/* Altbilgideki .tk-sosyal ile ayni davranis: yalnizca zemin ve ikon rengi degisir */
.tk-iletisim__sosyal a:hover,
.tk-iletisim__sosyal a:focus-visible { background: var(--primary); color: #fff; border-color: var(--primary); }
.tk-iletisim__sosyal a:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }

/* --- Sag sutun: form karti --- */
.tk-iletisim__form {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 30px 24px;
	border-radius: 24px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .08);
	box-shadow: 0 26px 60px rgba(11, 8, 40, .07);
}
@media (min-width: 640px)  { .tk-iletisim__form { padding: 34px; } }
@media (min-width: 1200px) { .tk-iletisim__form { padding: 42px; } }

.tk-iletisim__form-baslik { margin: 0; }
.tk-iletisim__form-ozet { margin: 8px 0 26px; font-size: 15.5px; }

.tk-iletisim__uyari {
	margin-bottom: 22px;
	padding: 14px 18px;
	border-radius: 14px;
	font-size: 15px;
	line-height: 1.5;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .09);
}
.tk-iletisim__uyari--hata { color: #d92d20; background: rgba(217, 45, 32, .08); }
.tk-iletisim__uyari ul { margin: 0; padding-inline-start: 18px; list-style: disc; }

.tk-iletisim__form form { display: flex; flex-direction: column; flex: 1 1 auto; }
.tk-iletisim__form .tk-alanlar { flex: 1 1 auto; margin-bottom: 26px; }
@media (min-width: 576px) {
	/* Son satir (mesaj) artan boslugu alir */
	.tk-iletisim__form .tk-alanlar { grid-template-rows: auto auto minmax(150px, 1fr); }
}
.tk-iletisim__form textarea { flex: 1 1 auto; }

.tk-iletisim__gonder {
	margin-top: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding-top: 24px;
	border-top: 1px solid rgba(var(--primary-rgb), .1);
}
.tk-iletisim__not {
	flex: 1 1 220px;
	margin: 0;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--color-bodycolor);
}
.tk-iletisim__gonder .btn { flex: 0 0 auto; }

@media (max-width: 575px) {
	.tk-iletisim__gonder .btn { width: 100%; justify-content: center; }
}

/* --- Harita --- */
.tk-harita {
	position: relative;
	margin-top: 32px;
	border-radius: 24px;
	overflow: hidden;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .1);
	box-shadow: 0 26px 60px rgba(11, 8, 40, .06);
}
@media (min-width: 992px) {
	.tk-harita { margin-top: 48px; }
}
.tk-harita__kanvas {
	width: 100%;
	height: 340px;
	background: var(--light, #f7f6fe);
	z-index: 0;                       /* leaflet panelleri karti asmasin */
}
@media (min-width: 768px) {
	.tk-harita__kanvas { height: 460px; }
}

/* --- Leaflet'i tema diline uydur --- */
.tk-harita .leaflet-container {
	font-family: inherit;
	font-size: 14px;
	background: var(--light, #f7f6fe);
}
/* Surukleme kapali oldugu icin "el" imleci gosterilmez */
.tk-harita .leaflet-grab,
.tk-harita .leaflet-container { cursor: default; }
.tk-harita .leaflet-marker-icon { cursor: pointer; }

/* Altlik acik gri CARTO; once griye indirilip sonra markanin mor tonuna
   boyaniyor. Boylece harita sarı/yesil kendi renkleri yerine sitenin
   leylak paletinde duruyor. Isaretci ve kontroller ayri panellerde
   oldugu icin bu suzgecten etkilenmez. */
.tk-harita .leaflet-tile-pane {
	filter: grayscale(1) brightness(.96) contrast(1.12)
	        sepia(.3) hue-rotate(205deg) saturate(1.2);
}

/* Yakinlastirma dugmeleri */
.tk-harita .leaflet-control-zoom {
	border: 0;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(11, 8, 40, .14);
}
.tk-harita .leaflet-control-zoom a {
	width: 38px;
	height: 38px;
	line-height: 36px;
	color: var(--secondary);
	background: #fff;
	border-bottom-color: rgba(var(--primary-rgb), .12);
	transition: background-color .2s ease, color .2s ease;
}
.tk-harita .leaflet-control-zoom a:hover { background: var(--primary); color: #fff; }
.tk-harita .leaflet-bar a.leaflet-disabled { color: rgba(var(--primary-rgb), .3); background: #fff; }

/* Kaynak gosterimi */
.tk-harita .leaflet-control-attribution {
	padding: 3px 10px;
	border-radius: 10px 0 0 0;
	font-size: 11px;
	background: rgba(255, 255, 255, .88);
	color: var(--color-bodycolor);
}
.tk-harita .leaflet-control-attribution a { color: var(--primary); }

/* Isaretci */
.tk-harita__isaret { background: none; border: 0; }
.tk-harita__isaret svg {
	position: relative;
	display: block;
	filter: drop-shadow(0 6px 10px rgba(11, 8, 40, .28));
}
.tk-harita__nabiz {
	position: absolute;
	left: 50%;
	bottom: -6px;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	border-radius: 50%;
	background: rgba(var(--primary-rgb), .35);
	animation: tkHaritaNabiz 2.2s ease-out infinite;
}
@keyframes tkHaritaNabiz {
	0%   { transform: scale(.4); opacity: .9; }
	70%  { transform: scale(2.6); opacity: 0; }
	100% { transform: scale(2.6); opacity: 0; }
}

/* Balon */
.tk-harita__balon .leaflet-popup-content-wrapper {
	padding: 4px;
	border-radius: 16px;
	box-shadow: 0 18px 44px rgba(11, 8, 40, .18);
}
.tk-harita__balon .leaflet-popup-content {
	display: grid;
	gap: 6px;
	margin: 14px 16px;
	line-height: 1.55;
}
.tk-harita__balon strong { font-size: 15.5px; color: var(--secondary); }
.tk-harita__balon span { font-size: 14px; color: var(--color-bodycolor); }
.tk-harita__balon a {
	justify-self: start;
	margin-top: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--primary);
}
.tk-harita__balon .leaflet-popup-tip { box-shadow: none; }

.tk-harita__kart {
	position: relative;
	z-index: 1;
	padding: 22px 24px;
	background: #fff;
	border-top: 1px solid rgba(var(--primary-rgb), .1);
}
@media (min-width: 768px) {
	.tk-harita__kart {
		position: absolute;
		inset-block-start: 24px;
		inset-inline-start: 24px;
		width: 320px;
		border: 0;
		border-radius: 18px;
		box-shadow: 0 18px 44px rgba(11, 8, 40, .14);
	}
}
.tk-harita__ad {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--primary);
}
.tk-harita__adres {
	margin: 0 0 16px;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--secondary);
}
.tk-harita__yol {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 15px;
	font-weight: 600;
	color: var(--primary);
	transition: gap .25s ease;
}
.tk-harita__yol i { font-size: 13px; }
.tk-harita__yol:hover { gap: 14px; }


/* =====================================================================
   Arama sonuclari (arama.php)
   ------------------------------------------------------------------ */
.tk-arama-form {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 46rem;
	margin: 0 auto 28px;
	padding: 8px 8px 8px 20px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .14);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .06);
	transition: border-color .2s, box-shadow .2s;
}
.tk-arama-form:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .12); }
.tk-arama-form > i { font-size: 15px; color: var(--color-bodycolor); }
.tk-arama-form input {
	flex: 1;
	min-width: 0;
	border: 0;
	background: none;
	outline: none;
	font-family: inherit;
	font-size: 16px;
	color: var(--secondary);
}
.tk-arama-form .btn { flex: 0 0 auto; }

.tk-arama-not {
	max-width: 46rem;
	margin: 0 auto 36px;
	font-size: 15.5px;
	color: var(--color-bodycolor);
	text-align: center;
}

.tk-arama-bos {
	max-width: 34rem;
	margin: 0 auto;
	padding: 56px 28px;
	border-radius: 24px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .1);
	text-align: center;
}
.tk-arama-bos > i { font-size: 34px; color: rgba(var(--primary-rgb), .3); }
.tk-arama-bos h2 { margin: 16px 0 10px; }
.tk-arama-bos p { margin: 0 0 22px; }

.tk-arama-grup + .tk-arama-grup { margin-top: 44px; }
.tk-arama-grup > h2 { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.tk-arama-grup > h2 span {
	padding: 3px 11px;
	border-radius: 20px;
	background: rgba(var(--primary-rgb), .09);
	color: var(--primary);
	font-size: 13.5px;
	font-weight: 700;
}

.tk-sonuc { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.tk-sonuc a {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .1);
	transition: border-color .25s, transform .25s, box-shadow .25s;
}
.tk-sonuc a:hover {
	border-color: rgba(var(--primary-rgb), .3);
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(var(--primary-rgb), .1);
}
.tk-sonuc__ikon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 14px;
	font-size: 17px;
	color: var(--primary);
	background: rgba(var(--primary-rgb), .09);
	transition: background-color .25s, color .25s;
}
.tk-sonuc a:hover .tk-sonuc__ikon { background: var(--primary); color: #fff; }
.tk-sonuc__gorsel { flex: 0 0 auto; }
.tk-sonuc__gorsel img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.tk-sonuc__metin { display: grid; gap: 3px; min-width: 0; }
.tk-sonuc__ad { font-size: 16.5px; font-weight: 600; color: var(--secondary); transition: color .25s; }
.tk-sonuc a:hover .tk-sonuc__ad { color: var(--primary); }
.tk-sonuc__ozet { font-size: 14.5px; line-height: 1.5; color: var(--color-bodycolor); }
/* Dar ekranda ozet 5 satira kadar uzayip karti sisiriyordu */
@media (max-width: 767px) {
	.tk-sonuc__ozet {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		overflow: hidden;
	}
}
.tk-sonuc__ok {
	margin-inline-start: auto;
	font-size: 14px;
	color: var(--primary);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s, transform .25s;
}
.tk-sonuc a:hover .tk-sonuc__ok { opacity: 1; transform: translateX(0); }

.tk-arama-sss { display: grid; gap: 12px; }
.tk-arama-sss article {
	padding: 20px 22px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .1);
}
.tk-arama-sss h3 { margin: 0 0 8px; }
.tk-arama-sss p { margin: 0; font-size: 15.5px; line-height: 1.65; }


/* =====================================================================
   Dil onerisi seridi
   ---------------------------------------------------------------------
   Masaustunde alt ortada yuzen kucuk bir kart. Mobilde ayni kart ekranin
   ortasini kapatip sol alttaki sabit butonlarla cakistigi icin orada
   ekranin altina yapisan tam genislikte bir serit olur.
   ------------------------------------------------------------------ */
.tk-dil-oneri {
	position: fixed;
	z-index: 1460;
	inset-inline: 0;
	bottom: 24px;
	width: fit-content;
	max-width: calc(100vw - 32px);
	margin-inline: auto;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 12px 12px 18px;
	border-radius: 18px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .12);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .16);
	font-size: 15px;
	color: var(--secondary);
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .3s ease, transform .3s cubic-bezier(.2, .8, .3, 1);
}
.tk-dil-oneri.acik { opacity: 1; transform: none; }

.tk-dil-oneri img {
	flex: 0 0 auto;
	width: 24px;
	height: 17px;
	border-radius: 3px;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(11, 8, 40, .12);
}
.tk-dil-oneri > span { white-space: nowrap; }

.tk-dil-oneri__btn {
	flex: 0 0 auto;
	padding: 9px 18px;
	border-radius: 12px;
	background: var(--primary);
	color: #fff;
	font-size: 14.5px;
	font-weight: 600;
	white-space: nowrap;
	transition: background .25s;
}
.tk-dil-oneri__btn:hover { background: var(--primarydark); color: #fff; }

.tk-dil-oneri__kapat {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--color-bodycolor);
	cursor: pointer;
	transition: background .2s, color .2s;
}
.tk-dil-oneri__kapat:hover { background: var(--light); color: var(--secondary); }

/* --- Mobil: ekranin altina yapisan serit --- */
@media (max-width: 640px) {
	.tk-dil-oneri {
		inset-inline: 0;
		bottom: 0;
		width: auto;
		max-width: none;
		margin-inline: 0;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 10px 12px;
		padding: 12px 46px 12px 16px;
		border-radius: 0;
		border: 0;
		border-top: 1px solid rgba(var(--primary-rgb), .14);
		box-shadow: 0 -8px 30px rgba(11, 8, 40, .10);
		font-size: 14px;
		opacity: 1;
		transform: translateY(100%);
		transition: transform .32s cubic-bezier(.2, .8, .3, 1);
	}
	.tk-dil-oneri.acik { transform: none; }
	.tk-dil-oneri > span { white-space: normal; flex: 1 1 auto; min-width: 0; line-height: 1.4; }
	.tk-dil-oneri__btn { padding: 8px 14px; font-size: 13.5px; }
	.tk-dil-oneri__kapat {
		position: absolute;
		inset-inline-end: 8px;
		top: 50%;
		transform: translateY(-50%);
	}
	/* Serit gorunurken sabit butonlar onun uzerine cikar. Seridin yuksekligi
	   metin uzunluguna gore degistigi icin JS olcup --tk-serit-yuk'e yaziyor. */
	body.tk-dil-oneri-var .tk-sabit { bottom: calc(var(--tk-serit-yuk, 84px) + 14px); }
}

/* =====================================================================
   Mobil dokunma hedefleri
   ---------------------------------------------------------------------
   Satir ici metin baglantilarinin tiklanabilir yuksekligi 13-21px'e kadar
   dusuyordu. Dokunmatikte rahat hedef icin dikey dolgu eklenir; satir
   yuksekligi degismedigi icin duzen etkilenmez.
   ------------------------------------------------------------------ */
@media (max-width: 991px) {
	/* li flex kalmali: ayirac noktasi ::before ile basiliyor ve inline-block
	   olunca genislik/yukseklik uygulanmadigi icin kayboluyordu. */
	.tk-kirinti li { padding-block: 5px; }
	.tk-kirinti a { display: inline-block; }
	/* Tema li'lere 9px dikey dolgu veriyor; baglantiya dokunma dolgusu
	   eklenince aradaki bosluk 28px'e cikiyordu. Dolgu baglantiya tasindi. */
	.list-hover1 li { padding-block: 0; }
	.list-hover1 a,
	.tk-yaklasim__bag,
	.tk-telif a,
	.tk-kredi a,
	.tk-cta__iletisim a,
	.tk-nav__iletisim a {
		display: inline-block;
		padding-block: 6px;
	}
}


/* =====================================================================
   KVKK onay kutulari ve yasal metin sayfalari
   ------------------------------------------------------------------ */
/* Izgara disinda duran onay kutusu (randevu sihirbazi) kendi ust boslugunu
   tasir; .tk-alanlar icindekiler zaten izgara gap'ini alir. */
.tk-sihirbaz__sayfa > .tk-onay { margin-top: 18px; }

/* Sihirbazin alt cubugu yapiskan; hataya odaklanip kaydirildiginda alan
   cubugun altinda kalmasin diye kaydirma payi birakilir. */
.tk-sihirbaz .tk-alan,
.tk-sihirbaz .tk-onay,
.tk-sihirbaz__ozet-kutu { scroll-margin-bottom: 110px; }

.tk-onay__etiket {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--color-bodycolor);
	cursor: pointer;
}
.tk-onay__etiket input {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: var(--primary);
	cursor: pointer;
}
/* .tk-alan label span kurali zorunlu alan yildizini kirmiziya boyuyor;
   onay metni ondan etkilenmesin. */
.tk-onay .tk-onay__etiket > span { color: var(--color-bodycolor); }
.tk-onay__etiket a { color: var(--primary); font-weight: 600; text-decoration: underline; }
.tk-onay__etiket a:hover { opacity: .8; }
.tk-onay__etiket b { color: #d92d20; font-weight: 600; }
/* Isaretlenmeden gonderilirse tarayici degil kendi uyarimiz calisir */
.tk-onay input.tk-alan--hatali { outline: 2px solid #d92d20; outline-offset: 2px; }

/* Altbilgideki e-bulten onayi (acik zemin) */
.tk-bulten-onay {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--color-bodycolor);
	cursor: pointer;
}
.tk-bulten-onay input {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	margin-top: 1px;
	accent-color: var(--primary);
	cursor: pointer;
}
.tk-bulten-onay a { color: var(--primary); font-weight: 600; text-decoration: underline; }

/* --- Yasal metin sayfalari (sayfa.php) --- */
.tk-yasal {
	max-width: 100%;
	font-size: 16px;
	line-height: 1.75;
	color: var(--color-bodycolor);
}
.tk-yasal h2 {
	margin: 40px 0 14px;
	font-family: var(--font-title);
	font-size: var(--tk-baslik-4);
	font-weight: 600;
	line-height: 1.3;
	color: var(--secondary);
}
.tk-yasal h2:first-child { margin-top: 0; }
.tk-yasal h3 {
	margin: 26px 0 10px;
	font-size: var(--tk-baslik-5);
	font-weight: 600;
	color: var(--secondary);
}
.tk-yasal p { margin: 0 0 16px; }
.tk-yasal ul, .tk-yasal ol { margin: 0 0 18px; padding-inline-start: 22px; }
.tk-yasal li { margin-bottom: 8px; }
.tk-yasal li::marker { color: var(--vurgu); }
.tk-yasal strong { color: var(--secondary); font-weight: 600; }
.tk-yasal a { color: var(--primary); font-weight: 500; text-decoration: underline; }
.tk-yasal a:hover { opacity: .8; }

.tk-yasal table {
	width: 100%;
	margin: 0 0 22px;
	border-collapse: collapse;
	font-size: 14.5px;
}
.tk-yasal thead th {
	padding: 12px 14px;
	text-align: start;
	font-weight: 600;
	color: var(--secondary);
	background: rgba(var(--primary-rgb), .07);
	border-bottom: 1px solid rgba(var(--primary-rgb), .14);
}
.tk-yasal tbody td {
	padding: 12px 14px;
	vertical-align: top;
	border-bottom: 1px solid rgba(var(--primary-rgb), .1);
}
@media (max-width: 640px) {
	.tk-yasal table, .tk-yasal thead, .tk-yasal tbody, .tk-yasal tr, .tk-yasal th, .tk-yasal td { display: block; }
	.tk-yasal thead { display: none; }
	.tk-yasal tbody tr {
		margin-bottom: 14px;
		padding: 4px 0;
		border: 1px solid rgba(var(--primary-rgb), .12);
		border-radius: 14px;
		background: #fff;
	}
	.tk-yasal tbody td { border: 0; padding: 8px 14px; }
	.tk-yasal tbody td:first-child { font-weight: 600; color: var(--secondary); }
}


/* Altbilgi alt seridi: telif solda, yasal metinler ortada, kredi sagda */
.tk-alt-serit {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
}
.tk-alt-serit__sol,
.tk-alt-serit__sag { flex: 1 1 0; min-width: 0; }
.tk-alt-serit__sag { display: flex; justify-content: flex-end; }

.tk-yasal-bag {
	flex: 0 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}
.tk-yasal-bag a { color: var(--color-bodycolor); transition: color .2s; }
.tk-yasal-bag a:hover { color: var(--primary); }

@media (max-width: 1199px) {
	.tk-alt-serit { flex-direction: column; text-align: center; gap: 12px; }
	.tk-alt-serit__sol,
	.tk-alt-serit__sag { flex: 0 0 auto; width: 100%; justify-content: center; }
	.tk-yasal-bag a { display: inline-block; padding-block: 5px; }
}


/* =====================================================================
   Saglik yazilari
   ------------------------------------------------------------------ */
.tk-yazilar {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}
@media (min-width: 768px)  { .tk-yazilar { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (min-width: 1200px) { .tk-yazilar { grid-template-columns: repeat(3, 1fr); } }

.tk-yazi-kart { min-width: 0; }
.tk-yazi-kart:nth-child(even) .tk-yazi-kart__ic { border-radius: 22px 22px 8px 22px; }
.tk-yazi-kart__ic {
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 22px 22px 22px 8px;
	overflow: hidden;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .10);
	box-shadow: 0 10px 30px rgba(11, 8, 40, .05);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.tk-yazi-kart__ic:hover {
	transform: translateY(-4px);
	border-color: rgba(var(--primary-rgb), .28);
	box-shadow: 0 18px 44px rgba(11, 8, 40, .10);
}
.tk-yazi-kart__gorsel {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--primarylight);
}
.tk-yazi-kart__gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s ease;
}
.tk-yazi-kart__ic:hover .tk-yazi-kart__gorsel img { transform: scale(1.05); }

.tk-yazi-kart__govde {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 18px 20px 20px;
}
.tk-yazi-kart__ust {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	font-size: 13px;
	color: var(--color-bodycolor);
}
.tk-yazi-kart__ad {
	margin: 0;
	color: var(--secondary);
	transition: color .25s;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
}
.tk-yazi-kart__ic:hover .tk-yazi-kart__ad { color: var(--primary); }
.tk-yazi-kart__ozet {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--color-bodycolor);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}
.tk-yazi-kart__oku {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	padding-top: 12px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--primary);
}
.tk-yazi-kart__oku i { font-size: 13px; color: var(--vurgu); transition: transform .25s; }
.tk-yazi-kart__ic:hover .tk-yazi-kart__oku i { transform: translateX(4px); }

@media (max-width: 767px) {
	.tk-yazi-kart__govde { padding: 12px 14px 16px; gap: 6px; }
	.tk-yazi-kart__ad { font-size: 15px; }
	.tk-yazi-kart__ozet { display: none; }
	.tk-yazi-kart__ust { font-size: 12px; }
	.tk-yazi-kart__oku { font-size: 13.5px; padding-top: 8px; }
}

/* --- Sayfalama --- */
.tk-sayfalama {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: 44px;
}
.tk-sayfalama a {
	display: grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	padding: 0 12px;
	border-radius: 12px;
	background: #fff;
	border: 1px solid rgba(var(--primary-rgb), .12);
	font-size: 15px;
	font-weight: 600;
	color: var(--secondary);
	transition: background .2s, color .2s, border-color .2s;
}
.tk-sayfalama a:hover { background: var(--primarylight); color: var(--primary); border-color: rgba(var(--primary-rgb), .3); }
.tk-sayfalama a.aktif { background: var(--vurgu); border-color: var(--vurgu); color: #fff; }
.tk-sayfalama__ok i { font-size: 14px; }

/* --- Yazi detayi --- */
.tk-yazi { max-width: 100%; }
.tk-yazi__ust {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 20px;
	margin-bottom: 24px;
}
/* Yazi kategorileri: birden fazla etiket yan yana gelebiliyor. Marka
   cizgisi yalnizca ilkinde durur, digerleri orta noktayla ayrilir --
   aksi halde her etiketin onunde ayri bir cizgi olusuyordu. */
.tk-yazi__etiketler {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.tk-yazi__etiketler .tk-etiket + .tk-etiket::before {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	opacity: .55;
}
.tk-yazi__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14.5px;
	color: var(--color-bodycolor);
}
.tk-yazi__meta li { display: inline-flex; align-items: center; gap: 8px; }
.tk-yazi__meta i { font-size: 14px; color: var(--vurgu); }

/* Etiketlerle meta arasinda ve meta ogeleri arasinda ince dikey ayirac */
.tk-yazi__etiketler + .tk-yazi__meta::before,
.tk-yazi__meta li + li::before {
	content: "";
	width: 1px;
	align-self: center;
	height: 15px;
	background: rgba(var(--primary-rgb), .22);
}
.tk-yazi__meta li + li::before { margin-inline-end: 12px; }
@media (max-width: 640px) {
	.tk-yazi__etiketler + .tk-yazi__meta::before { display: none; }
}

.tk-yazi__kapak {
	margin: 0 0 34px;
	border-radius: 24px;
	overflow: hidden;
	background: var(--primarylight);
}
.tk-yazi__kapak img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.tk-yazi__govde { font-size: 16.5px; line-height: 1.8; color: var(--color-bodycolor); }
.tk-yazi__govde h2 {
	margin: 42px 0 14px;
	font-family: var(--font-title);
	font-size: var(--tk-baslik-4);
	font-weight: 600;
	line-height: 1.3;
	color: var(--secondary);
}
.tk-yazi__govde h3 {
	margin: 30px 0 10px;
	font-size: var(--tk-baslik-5);
	font-weight: 600;
	color: var(--secondary);
}
.tk-yazi__govde h2:first-child, .tk-yazi__govde h3:first-child { margin-top: 0; }
.tk-yazi__govde p { margin: 0 0 18px; }
.tk-yazi__govde ul, .tk-yazi__govde ol { margin: 0 0 20px; padding-inline-start: 22px; }
.tk-yazi__govde li { margin-bottom: 9px; }
.tk-yazi__govde li::marker { color: var(--vurgu); }
.tk-yazi__govde strong { color: var(--secondary); font-weight: 600; }
.tk-yazi__govde a { color: var(--primary); font-weight: 500; text-decoration: underline; }
.tk-yazi__govde a:hover { opacity: .8; }
.tk-yazi__govde img {
	display: block;
	width: 100%;
	max-width: 560px;
	height: auto;
	margin: 8px auto 26px;
	border-radius: 20px;
}
.tk-yazi__govde hr {
	margin: 34px 0;
	border: 0;
	border-top: 1px solid rgba(var(--primary-rgb), .14);
}
.tk-yazi__govde blockquote {
	margin: 0 0 24px;
	padding: 18px 22px;
	border-inline-start: 3px solid var(--vurgu);
	border-radius: 0 14px 14px 0;
	background: rgba(var(--primary-rgb), .06);
}
.tk-yazi__govde table { width: 100%; margin: 0 0 24px; border-collapse: collapse; font-size: 15px; }
.tk-yazi__govde th {
	padding: 12px 14px;
	text-align: start;
	font-weight: 600;
	color: var(--secondary);
	background: rgba(var(--primary-rgb), .07);
	border-bottom: 1px solid rgba(var(--primary-rgb), .14);
}
.tk-yazi__govde td { padding: 12px 14px; vertical-align: top; border-bottom: 1px solid rgba(var(--primary-rgb), .1); }
@media (max-width: 640px) {
	.tk-yazi__govde { font-size: 16px; }
	.tk-yazi__govde img { border-radius: 14px; margin-bottom: 20px; }
	.tk-yazi__kapak { border-radius: 16px; margin-bottom: 26px; }
	.tk-yazi__kapak img { aspect-ratio: 4 / 3; }
	.tk-yazi__govde table { display: block; overflow-x: auto; }
}

/* =====================================================================
   NEXT STEP Program (anasayfa, hero alti)
   ---------------------------------------------------------------------
   Uc katmanda anlatir: akis (degerlendirme > hedef > sure), dort sure
   secenegi, "kesin sure degerlendirmede belirlenir" notu. Her kart
   paletin bir tonuyla hafifce boyanir; sure cizelgesi dort hafta
   bloğundan kacinin dolu oldugunu gosterir -- karsilastirma tek bakista
   okunur. Kartlar esit yukseklikte: sira bir derece degil, bir uzunluk.
   ------------------------------------------------------------------ */
.tk-program__giris {
	max-width: 46rem;
	margin: 16px auto 0;
	font-size: 17px;
	line-height: 1.65;
	color: var(--color-bodycolor);
}

/* --- Akis: once hedef, sonra sure ---
   Her genislikte ayni yapi: numara dairesi ustte, etiket altinda,
   daireler kivrimli dalgayla birbirine bagli. Dalga bir dairenin
   kenarindan baslar, sonrakinin kenarinda biter; karo tek periyotluk,
   yatayda tekrarlanir. Ust hizali: iki satirlik etiket daireyi kaydirmaz. */
.tk-program__akis {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: start;
	max-width: 720px;
	margin: -8px auto 44px;
	padding: 0;
	list-style: none;
	text-align: center;
}
.tk-program__akis li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding-inline: 6px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--secondary);
}
.tk-program__akis li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 13px;
	left: calc(50% + 30px);
	right: calc(-50% + 30px);
	height: 12px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='M0 6 Q5 0 10 6 T20 6' fill='none' stroke='%23F353A0' stroke-opacity='.7' stroke-width='2'/%3E%3C/svg%3E") left center / 20px 12px repeat-x;
}
.tk-program__akis-no {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--primary);
	box-shadow: 0 0 0 6px var(--primarylight);
	font-family: var(--font-title);
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}

/* --- Kartlar --- */
.tk-program__liste {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.tk-program__kart {
	--renk: var(--primary);
	--renk-rgb: var(--primary-rgb);
	--renk-yazi: var(--primary);
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 28px 26px 26px;
	border-radius: 26px 26px 26px 8px;
	background: rgba(var(--renk-rgb), .07);
	border: 1px solid rgba(var(--renk-rgb), .16);
	scroll-margin-top: calc(var(--tk-header-yuk) + 24px);
	transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.tk-program__kart:nth-child(even) { border-radius: 26px 26px 8px 26px; }
.tk-program__kart:nth-child(2) { --renk: var(--vurgu);   --renk-rgb: var(--vurgu-rgb);   --renk-yazi: var(--vurgudark); }
.tk-program__kart:nth-child(3) { --renk: var(--gunes);   --renk-rgb: var(--gunes-rgb);   --renk-yazi: var(--gunesdark); }
.tk-program__kart:nth-child(4) { --renk: var(--turkuaz); --renk-rgb: var(--turkuaz-rgb); --renk-yazi: var(--turkuazdark); }
.tk-program__kart:hover {
	transform: translateY(-4px);
	background: rgba(var(--renk-rgb), .11);
	box-shadow: 0 18px 40px rgba(var(--renk-rgb), .16);
}

.tk-program__ust {
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.tk-program__sayi {
	font-family: var(--font-title);
	font-size: clamp(3.25rem, 4.4vw, 4.25rem);
	font-weight: 700;
	line-height: .9;
	color: var(--renk-yazi);
}
.tk-program__birim {
	font-family: var(--font-title);
	font-size: 20px;
	font-weight: 600;
	color: var(--secondary);
}

/* Sure cizelgesi: dort hafta, doldurulan kadari programin uzunlugu */
.tk-program__cizelge {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 5px;
	margin: 16px 0 20px;
}
.tk-program__cizelge span {
	height: 8px;
	border-radius: 8px;
	background: rgba(var(--renk-rgb), .2);
}
.tk-program__cizelge span.dolu { background: var(--renk); }

.tk-program__ad {
	margin: 0 0 14px;
	font-size: var(--tk-baslik-5);
	line-height: 1.3;
	color: var(--secondary);
}
.tk-program__maddeler {
	display: grid;
	gap: 8px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}
.tk-program__maddeler li {
	position: relative;
	padding-inline-start: 22px;
	font-size: 14.5px;
	line-height: 1.45;
	color: var(--secondary);
}
.tk-program__maddeler li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: .3em;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--renk) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5l4 4 8-9' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat;
}
.tk-program__ozet {
	margin: auto 0 0;
	padding-top: 16px;
	border-top: 1px dashed rgba(var(--renk-rgb), .4);
	font-size: 14px;
	line-height: 1.55;
	color: #5E5E66;
}

/* --- Not: kesin sure degerlendirmede --- */
.tk-program__not {
	display: flex;
	align-items: center;
	gap: 18px 28px;
	margin-top: 32px;
	padding: 22px 26px;
	border-radius: 22px;
	background: var(--light);
	border: 1px dashed rgba(var(--primary-rgb), .3);
}
.tk-program__not-ikon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 50px;
	height: 50px;
	border-radius: 16px 16px 16px 5px;
	background: #fff;
	box-shadow: 0 6px 16px rgba(11, 8, 40, .07);
	font-size: 20px;
	color: var(--primary);
}
.tk-program__not p {
	flex: 1 1 auto;
	margin: 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--secondary);
}
.tk-program__not strong { color: var(--primary); font-weight: 700; }
.tk-program__not .btn { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 1199px) {
	.tk-program__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
	.tk-program__not { flex-wrap: wrap; }
	.tk-program__not p { flex-basis: calc(100% - 80px); }
	.tk-program__not .btn { margin-inline-start: 78px; }
}
@media (max-width: 640px) {
	.tk-program__giris { font-size: 15.5px; }
	/* Akis: ayni yapi, daha kucuk olculer */
	.tk-program__akis { margin-bottom: 30px; }
	.tk-program__akis li { gap: 9px; padding-inline: 4px; font-size: 13px; }
	.tk-program__akis li:not(:last-child)::after {
		top: 11px;
		left: calc(50% + 25px);
		right: calc(-50% + 25px);
	}
	.tk-program__akis-no {
		width: 34px;
		height: 34px;
		box-shadow: 0 0 0 5px var(--primarylight);
		font-size: 15px;
	}

	.tk-program__liste { gap: 10px; }
	.tk-program__kart { padding: 18px 14px 16px; border-radius: 20px 20px 20px 6px; }
	.tk-program__kart:nth-child(even) { border-radius: 20px 20px 6px 20px; }
	.tk-program__sayi { font-size: 2.6rem; }
	.tk-program__birim { font-size: 15px; }
	.tk-program__cizelge { margin: 10px 0 12px; gap: 4px; }
	.tk-program__cizelge span { height: 6px; }
	.tk-program__ad { font-size: 15px; margin-bottom: 8px; }
	/* Dar kartta maddeler yerine tek cumlelik ozet: ayni bilgi, yarim yer */
	.tk-program__maddeler { display: none; }
	.tk-program__ozet { padding-top: 10px; font-size: 13px; }

	/* Mobilde ikon yan sutun olarak kalinca metin dar bir kolona
	   sikisiyordu. Ikon sola yuzer: vurgu satiri yaninda baslar, metin
	   ikonun altindan tam genislikte akar; buton en altta tam genislik. */
	.tk-program__not { display: block; padding: 18px; }
	.tk-program__not-ikon {
		float: left;
		width: 40px;
		height: 40px;
		margin: 2px 12px 6px 0;
		font-size: 16px;
	}
	.tk-program__not p { font-size: 14.5px; }
	.tk-program__not strong { display: block; margin-bottom: 2px; }
	.tk-program__not .btn {
		clear: both;
		display: flex;
		width: 100%;
		margin: 16px 0 0;
		justify-content: center;
	}
}