/* PortföyPilot — "Editorial Estate"
   Fildişi kağıt zemin, koyu orman yeşili, kiremit ve altın. Serif başlıklar, geniş boşluk. */

:root {
  --zemin: #f7f4ee;
  --zemin-2: #efeae1;
  --yuzey: #fffdf9;
  --yuzey-2: #f4f0e8;
  --metin: #16241e;
  --metin-2: #5c6b63;
  --metin-3: #8b978f;
  --cizgi: #e0d9cc;
  --vurgu: #14453a;
  --vurgu-2: #c2683f;
  --vurgu-metin: #f7f4ee;
  --basari: #2f7d5c;
  --uyari: #b5811d;
  --hata: #b23b3b;
  --bilgi: #2b6b8f;

  --orman: #14453a;
  --orman-koyu: #0d2e26;
  --kiremit: #c2683f;
  --altin: #c9a227;

  --r-s: 5px; --r: 9px; --r-l: 14px; --r-xl: 20px;
  --golge: 0 2px 10px rgba(22, 36, 30, .05), 0 12px 30px rgba(22, 36, 30, .06);
  --golge-l: 0 30px 70px rgba(22, 36, 30, .16);
  --font-bas: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --font-govde: ui-sans-serif, system-ui, "Segoe UI", Roboto, sans-serif;
  --kenar: clamp(18px, 3vw, 40px);
}

body { background: var(--zemin); }

/* kağıt dokusu + yumuşak ışık */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(1100px 620px at 88% -8%, rgba(194, 104, 63, .09), transparent 62%),
    radial-gradient(900px 560px at 4% 102%, rgba(20, 69, 58, .08), transparent 60%);
}
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .09 0 0 0 0 .15 0 0 0 0 .12 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

h1, h2, h3 { letter-spacing: -.015em; }
.serif { font-family: var(--font-bas); }
.italik { font-family: var(--font-bas); font-style: italic; }
.etiketli { font-size: 11px; text-transform: uppercase; letter-spacing: .16em; font-weight: 700; color: var(--metin-3); }

/* ============================================================ UYGULAMA KABUĞU */
.ep-kabuk { display: grid; grid-template-columns: 258px minmax(0, 1fr); min-height: 100vh; }

.ep-rail {
  background: var(--orman); color: #dfe8e2; padding: 26px 18px 20px;
  display: flex; flex-direction: column; gap: 26px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
  border-right: 1px solid var(--orman-koyu);
}
.ep-rail::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .16); border-color: var(--orman); }

.ep-marka { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.ep-marka-im {
  width: 42px; height: 42px; flex: none; border-radius: 11px; display: grid; place-items: center;
  background: linear-gradient(150deg, var(--kiremit), #a8512e); box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
}
.ep-marka-im svg { width: 22px; height: 22px; }
.ep-marka b { font-family: var(--font-bas); font-size: 21px; font-weight: 600; letter-spacing: -.02em; display: block; line-height: 1.1; }
.ep-marka span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .15em; color: rgba(223, 232, 226, .5); }

.ep-nav { display: grid; gap: 2px; }
.ep-nav-baslik { font-size: 10px; text-transform: uppercase; letter-spacing: .16em; color: rgba(223, 232, 226, .38); padding: 14px 12px 6px; font-weight: 700; }
.ep-nav a {
  display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: var(--r);
  color: rgba(223, 232, 226, .74); text-decoration: none; font-size: 14px; font-weight: 550;
  transition: background var(--gecis), color var(--gecis); position: relative;
}
.ep-nav a svg { width: 17px; height: 17px; flex: none; opacity: .8; }
.ep-nav a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.ep-nav a.aktif { background: rgba(255, 255, 255, .11); color: #fff; }
.ep-nav a.aktif::before {
  content: ""; position: absolute; left: -18px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 20px; border-radius: 0 3px 3px 0; background: var(--kiremit);
}
.ep-nav a .sayi {
  margin-left: auto; font-size: 11px; font-weight: 700; background: rgba(255, 255, 255, .13);
  padding: 1px 7px; border-radius: 99px; min-width: 22px; text-align: center;
}
.ep-nav a.aktif .sayi { background: var(--kiremit); color: #fff; }

.ep-rail-alt { margin-top: auto; display: grid; gap: 10px; }
.ep-kullanici {
  display: flex; align-items: center; gap: 10px; padding: 11px; border-radius: var(--r);
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .08);
}
.ep-avatar {
  width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: var(--altin); color: var(--orman-koyu); font-weight: 800; font-size: 13px;
}
.ep-kullanici div { min-width: 0; }
.ep-kullanici b { display: block; font-size: 13px; color: #fff; font-weight: 650; }
.ep-kullanici span { font-size: 11px; color: rgba(223, 232, 226, .5); }

/* ------------------------------------------------------------------ üst bar */
.ep-ana { min-width: 0; display: flex; flex-direction: column; }
.ep-ust {
  display: flex; align-items: center; gap: 16px; padding: 16px var(--kenar);
  border-bottom: 1px solid var(--cizgi); background: rgba(247, 244, 238, .84);
  backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 20;
}
.ep-ust h1 { font-family: var(--font-bas); font-size: 24px; font-weight: 600; }
.ep-ust .yol { font-size: 11px; text-transform: uppercase; letter-spacing: .14em; color: var(--metin-3); font-weight: 700; }
.ep-ust-arama { margin-left: auto; width: min(320px, 34vw); }
.ep-mobil-menu { display: none; }

.ep-icerik { padding: var(--kenar); display: grid; gap: 20px; align-content: start; flex: 1; }
.ep-bolum { display: grid; gap: 18px; align-content: start; }

/* --------------------------------------------------------------- başlık şeridi */
.ep-serit { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.ep-serit h2 { font-family: var(--font-bas); font-size: 21px; font-weight: 600; }
.ep-serit p { margin: 3px 0 0; font-size: 13px; color: var(--metin-2); }

/* ------------------------------------------------------------------- ölçütler */
.db-olcut {
  border-radius: var(--r-l); background: var(--yuzey);
  border: 1px solid var(--cizgi); box-shadow: var(--golge);
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.db-olcut:hover { transform: translateY(-2px); box-shadow: 0 18px 40px rgba(22, 36, 30, .1); }
.db-olcut::after {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--vurgu); opacity: .8;
}
.db-olcut.kiremit::after { background: var(--kiremit); }
.db-olcut.altin::after { background: var(--altin); }
.db-olcut.mavi::after { background: var(--bilgi); }
.db-olcut-deger { font-family: var(--font-bas); font-weight: 600; }

/* --------------------------------------------------------------------- kart */
.db-kart { background: var(--yuzey); border-radius: var(--r-l); border: 1px solid var(--cizgi); }
.db-kart-bas h3 { font-family: var(--font-bas); font-size: 17px; font-weight: 600; letter-spacing: -.01em; }

.ep-izgara { display: grid; gap: 18px; }
.ep-izgara.iki { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
.ep-izgara.iki-esit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ep-izgara.uc { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ------------------------------------------------------------- portföy kartı */
.ep-portfoy-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(295px, 1fr)); gap: 18px; }
.ep-ilan {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-l);
  overflow: hidden; box-shadow: var(--golge); cursor: pointer;
  transition: transform .28s cubic-bezier(.2, .9, .3, 1), box-shadow .28s, border-color .28s;
  display: flex; flex-direction: column;
}
.ep-ilan:hover { transform: translateY(-4px); box-shadow: 0 24px 54px rgba(22, 36, 30, .14); border-color: #cfc5b3; }
.ep-ilan-gorsel {
  height: 152px; position: relative; overflow: hidden;
  background: linear-gradient(145deg, hsl(var(--ton, 160) 30% 42%), hsl(calc(var(--ton, 160) + 28) 34% 27%));
}
.ep-ilan-gorsel::after {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .09) 1px, transparent 1px);
  background-size: 26px 26px; opacity: .55;
  transition: transform .6s cubic-bezier(.2, .9, .3, 1);
}
.ep-ilan:hover .ep-ilan-gorsel::after { transform: scale(1.14) rotate(1.5deg); }
.ep-ilan-ev { position: absolute; inset: 0; display: grid; place-items: center; opacity: .3; }
.ep-ilan-ev svg { width: 66px; height: 66px; stroke: #fff; fill: none; stroke-width: 1.1; }
.ep-ilan-tip {
  position: absolute; left: 12px; top: 12px; z-index: 2;
  background: rgba(255, 253, 249, .95); color: var(--orman);
  padding: 4px 10px; border-radius: 99px; font-size: 11px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .08em;
}
.ep-ilan-durum { position: absolute; right: 12px; top: 12px; z-index: 2; }
.ep-ilan-kod {
  position: absolute; right: 12px; bottom: 11px; z-index: 2; color: rgba(255, 255, 255, .82);
  font-size: 11px; font-weight: 700; letter-spacing: .09em; font-family: var(--font-mono);
}
.ep-ilan-govde { padding: 15px 16px 16px; display: grid; gap: 9px; flex: 1; align-content: start; }
.ep-ilan-govde h3 {
  font-family: var(--font-bas); font-size: 16.5px; font-weight: 600; line-height: 1.32;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ep-ilan-yer { font-size: 12.5px; color: var(--metin-2); display: flex; align-items: center; gap: 5px; }
.ep-ilan-fiyat { font-family: var(--font-bas); font-size: 22px; font-weight: 600; color: var(--orman); letter-spacing: -.02em; }
.ep-ilan-fiyat small { font-size: 12px; color: var(--metin-2); font-family: var(--font-govde); font-weight: 600; }
.ep-ilan-ozet {
  display: flex; gap: 14px; flex-wrap: wrap; padding-top: 11px; margin-top: auto;
  border-top: 1px solid var(--cizgi); font-size: 12.5px; color: var(--metin-2);
}
.ep-ilan-ozet span { display: flex; align-items: center; gap: 5px; }
.ep-ilan-ozet b { color: var(--metin); font-weight: 650; }

/* -------------------------------------------------------------------- filtre */
.ep-filtre {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 11px;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-l); padding: 15px;
}
.ep-filtre .db-alan-etiket { font-size: 11px; }
.ep-filtre select, .ep-filtre input { min-height: 37px; font-size: 13.5px; }

/* --------------------------------------------------------------- ilan detayı */
.ep-detay-ust {
  margin: -20px -20px 18px; padding: 24px 20px 20px; color: #fff; position: relative; overflow: hidden;
  background: linear-gradient(145deg, hsl(var(--ton, 160) 30% 38%), hsl(calc(var(--ton, 160) + 28) 34% 22%));
}
.ep-detay-ust::after {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
  background-size: 30px 30px;
}
.ep-detay-ust > * { position: relative; z-index: 1; }
.ep-detay-ust h2 { font-family: var(--font-bas); font-size: 24px; font-weight: 600; margin: 8px 0 4px; }
.ep-detay-ust .fiyat { font-family: var(--font-bas); font-size: 32px; font-weight: 600; margin-top: 10px; }
.ep-detay-ust .yer { color: rgba(255, 255, 255, .78); font-size: 13.5px; }

.ep-ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: var(--r); overflow: hidden; }
.ep-ozellik { background: var(--yuzey); padding: 11px 13px; }
.ep-ozellik span { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--metin-3); font-weight: 700; }
.ep-ozellik b { font-size: 14.5px; font-weight: 650; }

.ep-etiketler { display: flex; flex-wrap: wrap; gap: 7px; }
.ep-etiket {
  padding: 5px 11px; border-radius: 99px; font-size: 12px; font-weight: 600;
  background: color-mix(in srgb, var(--orman) 8%, transparent); color: var(--orman);
  border: 1px solid color-mix(in srgb, var(--orman) 16%, transparent);
}

/* ------------------------------------------------------------- eşleştirme */
.ep-eslesme { display: grid; gap: 10px; }
.ep-eslesme-satir {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 13px; align-items: center;
  padding: 12px; border: 1px solid var(--cizgi); border-radius: var(--r); background: var(--yuzey);
  transition: border-color var(--gecis), transform var(--gecis); cursor: pointer;
}
.ep-eslesme-satir:hover { border-color: var(--kiremit); transform: translateX(3px); }
.ep-skor {
  width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; flex: none;
  font-weight: 800; font-size: 14px; font-family: var(--font-bas);
  background: conic-gradient(var(--skor-renk) calc(var(--skor) * 1%), color-mix(in srgb, var(--metin) 8%, transparent) 0);
  position: relative; color: var(--skor-renk);
}
.ep-skor::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--yuzey); }
.ep-skor span { position: relative; z-index: 1; }
.ep-eslesme-satir h4 { font-size: 14px; font-weight: 650; margin-bottom: 3px; }
.ep-eslesme-neden { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.ep-neden { font-size: 11px; padding: 2px 8px; border-radius: 99px; font-weight: 650; }
.ep-neden.artı { background: color-mix(in srgb, var(--basari) 13%, transparent); color: var(--basari); }
.ep-neden.eksi { background: color-mix(in srgb, var(--hata) 11%, transparent); color: var(--hata); }

/* --------------------------------------------------------------------- takvim */
.ep-takvim { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: var(--r); overflow: hidden; }
.ep-takvim-gun-adi { background: var(--yuzey-2); padding: 9px 6px; text-align: center; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--metin-3); }
.ep-takvim-hucre {
  background: var(--yuzey); min-height: 96px; padding: 7px; display: grid; gap: 4px; align-content: start;
  cursor: pointer; transition: background var(--gecis); position: relative;
}
.ep-takvim-hucre:hover { background: var(--yuzey-2); }
.ep-takvim-hucre.disay { background: var(--zemin-2); }
.ep-takvim-hucre.disay .gun { color: var(--metin-3); }
.ep-takvim-hucre.bugun { background: color-mix(in srgb, var(--kiremit) 8%, var(--yuzey)); }
.ep-takvim-hucre.bugun .gun {
  background: var(--kiremit); color: #fff; width: 23px; height: 23px; border-radius: 50%;
  display: grid; place-items: center; font-weight: 800;
}
.ep-takvim-hucre .gun { font-size: 12.5px; font-weight: 650; color: var(--metin-2); }
.ep-randevu-pul {
  font-size: 10.5px; padding: 3px 6px; border-radius: 4px; font-weight: 650;
  background: color-mix(in srgb, var(--orman) 11%, transparent); color: var(--orman);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-left: 2px solid var(--orman);
}
.ep-randevu-pul.Tapu { background: color-mix(in srgb, var(--altin) 18%, transparent); color: #7a610f; border-left-color: var(--altin); }
.ep-randevu-pul.Değerleme { background: color-mix(in srgb, var(--bilgi) 13%, transparent); color: var(--bilgi); border-left-color: var(--bilgi); }
.ep-randevu-pul.tamam { opacity: .5; text-decoration: line-through; }

/* --------------------------------------------------------------------- zaman */
.ep-zaman { display: grid; gap: 0; position: relative; }
.ep-zaman::before { content: ""; position: absolute; left: 16px; top: 8px; bottom: 8px; width: 1px; background: var(--cizgi); }
.ep-zaman-oge { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 11px 0; position: relative; }
.ep-zaman-im {
  width: 33px; height: 33px; border-radius: 50%; display: grid; place-items: center; font-size: 14px;
  background: var(--yuzey); border: 1px solid var(--cizgi); z-index: 1;
}
.ep-zaman-oge h4 { font-size: 13.5px; font-weight: 650; }
.ep-zaman-oge p { margin: 2px 0 0; font-size: 12.5px; color: var(--metin-2); }
.ep-zaman-oge time { font-size: 11px; color: var(--metin-3); font-weight: 600; }

/* --------------------------------------------------------------------- görev */
.ep-gorev { display: flex; align-items: flex-start; gap: 11px; padding: 11px 0; border-bottom: 1px solid var(--cizgi); }
.ep-gorev:last-child { border-bottom: 0; }
.ep-gorev input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--orman); flex: none; cursor: pointer; }
.ep-gorev.bitti b { text-decoration: line-through; color: var(--metin-3); }
.ep-gorev b { font-size: 13.5px; font-weight: 600; display: block; line-height: 1.4; }
.ep-gorev small { font-size: 11.5px; color: var(--metin-3); }
.ep-gorev .gecti { color: var(--hata); font-weight: 700; }

/* --------------------------------------------------------------------- araçlar */
.ep-arac-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.ep-sonuc-kutu {
  background: linear-gradient(145deg, var(--orman), var(--orman-koyu)); color: #eef4f0;
  border-radius: var(--r-l); padding: 18px; display: grid; gap: 12px;
}
.ep-sonuc-satir { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13.5px; }
.ep-sonuc-satir span { color: rgba(238, 244, 240, .68); }
.ep-sonuc-satir b { font-variant-numeric: tabular-nums; font-weight: 650; }
.ep-sonuc-satir.buyuk { border-top: 1px solid rgba(255, 255, 255, .16); padding-top: 12px; margin-top: 2px; }
.ep-sonuc-satir.buyuk b { font-family: var(--font-bas); font-size: 25px; font-weight: 600; color: var(--altin); }
.ep-metin-cikti {
  width: 100%; min-height: 210px; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.65;
  background: var(--zemin-2); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 13px; resize: vertical; color: var(--metin);
}

/* ------------------------------------------------------------------- QR kutu */
.ep-qr-kart { display: grid; justify-items: center; gap: 12px; text-align: center; }
.ep-qr-kart .db-qr-kutu { box-shadow: var(--golge); border: 1px solid var(--cizgi); }
.ep-qr-kart .db-qr { width: 150px; }

/* ================================================================ TANITIM SAYFASI */
.tn-govde { --kenar: clamp(20px, 5vw, 64px); }
.tn-kap { width: min(1220px, calc(100% - 2 * var(--kenar))); margin-inline: auto; }

.tn-ust {
  position: sticky; top: 0; z-index: 40; backdrop-filter: blur(16px);
  background: rgba(247, 244, 238, .82); border-bottom: 1px solid transparent; transition: border-color .3s;
}
.tn-ust.kaydi { border-bottom-color: var(--cizgi); }
.tn-ust-ic { display: flex; align-items: center; gap: 22px; padding: 15px 0; }
.tn-ust nav { display: flex; gap: 4px; margin-left: auto; }
.tn-ust nav a { padding: 8px 14px; border-radius: 99px; text-decoration: none; font-size: 14px; font-weight: 600; color: var(--metin-2); transition: var(--gecis); }
.tn-ust nav a:hover { background: var(--yuzey-2); color: var(--metin); }
.tn-marka { display: flex; align-items: center; gap: 11px; text-decoration: none; color: var(--metin); }
.tn-marka .ep-marka-im { width: 38px; height: 38px; }
.tn-marka b { font-family: var(--font-bas); font-size: 20px; font-weight: 600; }

.tn-kahraman { padding: clamp(48px, 8vw, 96px) 0 clamp(40px, 6vw, 72px); display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); gap: 52px; align-items: center; }
.tn-kahraman h1 {
  font-family: var(--font-bas); font-size: clamp(38px, 5.6vw, 68px); font-weight: 600;
  line-height: 1.04; letter-spacing: -.03em; margin: 16px 0 20px;
}
.tn-kahraman h1 em { font-style: italic; color: var(--kiremit); }
.tn-kahraman .lede { font-size: clamp(16px, 1.7vw, 19px); color: var(--metin-2); line-height: 1.62; max-width: 52ch; }
.tn-rozet {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 99px;
  background: color-mix(in srgb, var(--kiremit) 10%, transparent); color: #9a4f2d;
  border: 1px solid color-mix(in srgb, var(--kiremit) 24%, transparent);
  font-size: 12px; font-weight: 700; letter-spacing: .04em;
}
.tn-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.tn-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 52px;
  padding: 0 26px; border-radius: 99px; text-decoration: none; font-weight: 650; font-size: 15.5px;
  border: 1px solid transparent; cursor: pointer; transition: transform var(--gecis), box-shadow var(--gecis), background var(--gecis);
}
.tn-btn.ana { background: var(--orman); color: #f7f4ee; box-shadow: 0 12px 30px rgba(20, 69, 58, .28); }
.tn-btn.ana:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(20, 69, 58, .36); }
.tn-btn.ikinci { background: transparent; color: var(--metin); border-color: var(--cizgi); }
.tn-btn.ikinci:hover { background: var(--yuzey); transform: translateY(-2px); }
.tn-alt-not { margin-top: 16px; font-size: 12.5px; color: var(--metin-3); }

/* kahraman görseli — sahte panel */
.tn-gorsel { position: relative; }
.tn-panel {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-xl);
  box-shadow: var(--golge-l); overflow: hidden; transform: perspective(1400px) rotateY(-7deg) rotateX(3deg);
  animation: tnSuz 7s ease-in-out infinite;
}
@keyframes tnSuz { 0%, 100% { transform: perspective(1400px) rotateY(-7deg) rotateX(3deg) translateY(0); } 50% { transform: perspective(1400px) rotateY(-7deg) rotateX(3deg) translateY(-14px); } }
.tn-panel-bas { background: var(--orman); padding: 13px 16px; display: flex; align-items: center; gap: 8px; }
.tn-panel-bas i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .3); }
.tn-panel-bas span { color: rgba(255, 255, 255, .72); font-size: 11.5px; margin-left: 8px; font-family: var(--font-mono); }
.tn-panel-govde { padding: 18px; display: grid; gap: 14px; }
.tn-mini-olcut { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tn-mini-olcut div { background: var(--yuzey-2); border-radius: var(--r); padding: 11px 12px; border: 1px solid var(--cizgi); }
.tn-mini-olcut span { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; color: var(--metin-3); font-weight: 700; }
.tn-mini-olcut b { display: block; font-family: var(--font-bas); font-size: 20px; font-weight: 600; margin-top: 3px; }
.tn-yuzen {
  position: absolute; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-l);
  padding: 12px 15px; box-shadow: var(--golge-l); display: flex; align-items: center; gap: 11px;
}
.tn-yuzen b { font-size: 13.5px; font-weight: 650; display: block; }
.tn-yuzen span { font-size: 11.5px; color: var(--metin-2); }
.tn-yuzen.bir { left: -34px; bottom: 62px; animation: tnSuz2 5.4s ease-in-out infinite; }
.tn-yuzen.iki { right: -20px; top: 44px; animation: tnSuz2 6.6s ease-in-out infinite .8s; }
@keyframes tnSuz2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
.tn-yuzen i {
  width: 33px; height: 33px; border-radius: 9px; display: grid; place-items: center; font-style: normal;
  background: color-mix(in srgb, var(--basari) 14%, transparent); color: var(--basari); font-weight: 800;
}

.tn-logolar { display: flex; gap: 34px; flex-wrap: wrap; align-items: center; justify-content: center; padding: 26px 0 46px; opacity: .55; }
.tn-logolar span { font-family: var(--font-bas); font-size: 17px; font-weight: 600; color: var(--metin-2); }

.tn-bolum { padding: clamp(52px, 7vw, 92px) 0; }
.tn-bolum-bas { max-width: 640px; margin-bottom: 42px; }
.tn-bolum-bas h2 { font-family: var(--font-bas); font-size: clamp(28px, 3.6vw, 42px); font-weight: 600; letter-spacing: -.025em; line-height: 1.12; margin: 12px 0 14px; }
.tn-bolum-bas p { color: var(--metin-2); font-size: 16.5px; line-height: 1.62; }
.tn-bolum.koyu { background: var(--orman); color: #e7eeea; margin-inline: calc(-1 * var(--kenar)); padding-inline: var(--kenar); }
.tn-bolum.koyu h2 { color: #fff; }
.tn-bolum.koyu p { color: rgba(231, 238, 234, .72); }
.tn-bolum.koyu .etiketli { color: var(--altin); }

.tn-ozellikler { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.tn-ozellik {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-l); padding: 24px;
  transition: transform .3s cubic-bezier(.2, .9, .3, 1), box-shadow .3s;
}
.tn-ozellik:hover { transform: translateY(-5px); box-shadow: var(--golge-l); }
.tn-ozellik-im {
  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 15px;
  background: color-mix(in srgb, var(--orman) 8%, transparent); color: var(--orman);
}
.tn-ozellik-im svg { width: 22px; height: 22px; }
.tn-ozellik h3 { font-family: var(--font-bas); font-size: 19px; font-weight: 600; margin-bottom: 8px; }
.tn-ozellik p { color: var(--metin-2); font-size: 14.5px; line-height: 1.6; margin: 0; }

.tn-adimlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 26px; counter-reset: adim; }
.tn-adim { counter-increment: adim; position: relative; padding-top: 52px; }
.tn-adim::before {
  content: counter(adim, decimal-leading-zero); position: absolute; top: 0; left: 0;
  font-family: var(--font-bas); font-size: 40px; font-weight: 600; color: var(--altin); opacity: .9;
}
.tn-adim h3 { font-size: 17px; margin-bottom: 7px; font-family: var(--font-bas); font-weight: 600; }
.tn-adim p { font-size: 14px; margin: 0; }

.tn-fiyat-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; align-items: start; }
.tn-fiyat {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-xl); padding: 28px;
  display: grid; gap: 16px; position: relative; transition: transform .3s, box-shadow .3s;
}
.tn-fiyat:hover { transform: translateY(-4px); box-shadow: var(--golge-l); }
.tn-fiyat.one {
  border-color: var(--orman); box-shadow: 0 20px 50px rgba(20, 69, 58, .16);
  background: linear-gradient(180deg, color-mix(in srgb, var(--orman) 4%, var(--yuzey)), var(--yuzey));
}
.tn-fiyat-rozet {
  position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  background: var(--kiremit); color: #fff; padding: 5px 15px; border-radius: 99px;
  font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap;
}
.tn-fiyat h3 { font-family: var(--font-bas); font-size: 22px; font-weight: 600; }
.tn-fiyat .tutar { font-family: var(--font-bas); font-size: 42px; font-weight: 600; letter-spacing: -.03em; line-height: 1; }
.tn-fiyat .tutar small { font-size: 15px; color: var(--metin-2); font-family: var(--font-govde); font-weight: 600; }
.tn-fiyat ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.tn-fiyat li { display: flex; gap: 10px; font-size: 14px; color: var(--metin-2); line-height: 1.45; }
.tn-fiyat li::before { content: "✓"; color: var(--basari); font-weight: 800; flex: none; }

.tn-sss { display: grid; gap: 0; max-width: 800px; }
.tn-sss details { border-bottom: 1px solid var(--cizgi); padding: 18px 0; }
.tn-sss summary { cursor: pointer; font-family: var(--font-bas); font-size: 17.5px; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.tn-sss summary::-webkit-details-marker { display: none; }
.tn-sss summary::after { content: "+"; font-size: 22px; color: var(--kiremit); font-weight: 400; transition: transform .25s; flex: none; }
.tn-sss details[open] summary::after { transform: rotate(45deg); }
.tn-sss p { margin: 12px 0 0; color: var(--metin-2); font-size: 15px; line-height: 1.68; max-width: 70ch; }

.tn-son {
  text-align: center; background: linear-gradient(150deg, var(--orman), var(--orman-koyu));
  color: #fff; border-radius: var(--r-xl); padding: clamp(42px, 6vw, 72px) var(--kenar); margin-bottom: 60px;
  position: relative; overflow: hidden;
}
.tn-son::after {
  content: ""; position: absolute; inset: 0; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 42px 42px;
}
.tn-son > * { position: relative; z-index: 1; }
.tn-son h2 { font-family: var(--font-bas); font-size: clamp(28px, 4vw, 46px); font-weight: 600; margin-bottom: 14px; letter-spacing: -.025em; }
.tn-son p { color: rgba(255, 255, 255, .74); font-size: 16.5px; max-width: 54ch; margin: 0 auto 30px; }
.tn-son .tn-btn.ana { background: var(--altin); color: var(--orman-koyu); }
.tn-son .tn-btn.ikinci { border-color: rgba(255, 255, 255, .3); color: #fff; }
.tn-son .tn-btn.ikinci:hover { background: rgba(255, 255, 255, .1); }

.tn-alt { border-top: 1px solid var(--cizgi); padding: 34px 0; display: flex; gap: 22px; flex-wrap: wrap; justify-content: space-between; align-items: center; font-size: 13.5px; color: var(--metin-2); }
.tn-alt a { color: var(--metin-2); text-decoration: none; }
.tn-alt a:hover { color: var(--orman); }
.tn-alt-baglanti { display: flex; gap: 18px; flex-wrap: wrap; }

/* ------------------------------------------------------------------ duyarlı */
@media (max-width: 1180px) {
  .ep-izgara.iki, .ep-izgara.uc { grid-template-columns: 1fr; }
  .tn-kahraman { grid-template-columns: 1fr; gap: 40px; }
  .tn-yuzen { display: none; }
  .tn-panel { transform: none; animation: none; }
}
@media (max-width: 900px) {
  .ep-kabuk { grid-template-columns: 1fr; }
  .ep-rail {
    position: fixed; inset: 0 auto 0 0; width: 262px; z-index: 60; height: 100vh;
    transform: translateX(-100%); transition: transform .3s cubic-bezier(.2, .9, .3, 1); box-shadow: var(--golge-l);
  }
  .ep-rail.acik { transform: none; }
  .ep-mobil-menu { display: inline-flex; }
  .ep-ust-arama { width: 100%; order: 5; margin-left: 0; }
  .ep-ust { flex-wrap: wrap; }
  .ep-perde { position: fixed; inset: 0; background: rgba(22, 36, 30, .45); z-index: 55; }
}
@media (max-width: 700px) {
  .db-form { grid-template-columns: 1fr; }
  .ep-takvim-hucre { min-height: 62px; }
  .ep-takvim-hucre .ep-randevu-pul { font-size: 0; padding: 3px; height: 7px; border-radius: 3px; }
  .tn-ust nav { display: none; }
  .ep-izgara.iki-esit { grid-template-columns: 1fr; }
}