/* ==========================================================================
   ÖNCE SAĞLIK — ana stil
   Ölçek birimi: 1u = referans tasarımdaki 1px (1024px'te). Kolon 956u,
   üst sınırda 1320px. Tüm boşluk / yarıçap / punto değerleri aşağıdaki
   ölçeklerden gelir; ham sayı yalnızca ölçek tanımlarında bulunur.
   ========================================================================== */

:root {
  --u: clamp(1px, 100vw / 1024, 1.38075px);

  /* --- Boşluk ölçeği (4'ün katları) --- */
  --s-1: calc(4 * var(--u));
  --s-2: calc(8 * var(--u));
  --s-3: calc(12 * var(--u));
  --s-4: calc(16 * var(--u));
  --s-5: calc(20 * var(--u));
  --s-6: calc(24 * var(--u));
  --s-8: calc(32 * var(--u));
  --s-10: calc(40 * var(--u));

  /* --- Yarıçap ölçeği --- */
  --r-1: calc(8 * var(--u));
  --r-2: calc(12 * var(--u));
  --r-3: calc(16 * var(--u));
  --r-pill: 999px;

  /* --- Punto ölçeği (mobilde taban değerler devreye girer) --- */
  --t-2xs: max(10px, calc(7 * var(--u)));     /* rozet */
  --t-xs:  max(12px, calc(10.5 * var(--u)));  /* meta, çip, kicker, alt bilgi */
  --t-sm:  max(13px, calc(11 * var(--u)));    /* menü, küçük gövde, buton */
  --t-md:  max(16px, calc(12 * var(--u)));    /* gövde */
  --t-lg:  calc(14 * var(--u));               /* kart başlığı */
  --t-xl:  calc(17 * var(--u));               /* yan kart / kenar çubuğu başlığı */
  --t-2xl: calc(21 * var(--u));               /* bölüm başlığı */
  --t-3xl: calc(24 * var(--u));               /* blok başlığı */
  --t-4xl: calc(46 * var(--u));               /* hero */
  --t-title: clamp(30px, calc(34 * var(--u)), 48px); /* makale başlığı */
  --nav-h: calc(66 * var(--u));               /* header yüksekliği */
  --chapter-nav-h: calc(52 * var(--u));       /* bölüm gezgini yüksekliği */

  /* --- İkon ölçeği --- */
  --i-sm: calc(12 * var(--u));
  --i-md: calc(16 * var(--u));
  --i-lg: calc(20 * var(--u));
  --i-xl: calc(28 * var(--u));

  /* --- Kontrol boyutları --- */
  --ctl: calc(32 * var(--u));      /* dairesel kontrol */
  --btn: calc(34 * var(--u));      /* buton */
  --btn-sm: calc(30 * var(--u));

  /* --- Renk rolleri --- */
  --paper: #ffffff;
  --tint: #f3f6fa;
  --surface: #f4f7fb;
  --surface-2: #e8eef6;
  --line: #e3e9f1;
  --navy: #10203c;
  --ink: #1b2a44;
  --body: #4b5b74;
  --muted: #536178;
  --faint: #56657f;

  /* --- Marka --- */
  --brand-blue: #2a7de1;
  --brand-green: #17a673;
  --brand-grad: linear-gradient(135deg, var(--brand-blue), var(--brand-green));
  --accent: #2358c2;             /* bağlantı, aktif durum, sıra numarası */
  --accent-soft: #e8effc;

  /* --- Kategori renkleri (soft zeminde ≥ 5:1) --- */
  --c-green: #1f7a4d; --c-green-soft: #e6f4ec;
  --c-blue:  #2358c2; --c-blue-soft:  #e8effc;
  --c-pink:  #b8306b; --c-pink-soft:  #fbe6ef;
  --c-gold:  #8a5f00; --c-gold-soft:  #fff3d6;

  --shadow: 0 var(--s-2) var(--s-6) rgba(16, 32, 60, .07);
  --shadow-sm: 0 2px 8px rgba(16, 32, 60, .12);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur-fast: .12s;
  --dur: .2s;
  --dur-slow: .45s;

  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --font-display: "Sora", var(--font);   /* başlıklar */
  color-scheme: light;
}

:root[data-theme="dark"] {
  --paper: #0f1524;
  --tint: #161e30;
  --surface: #161e30;
  --surface-2: #1d2740;
  --line: #273249;
  --navy: #eef2f8;
  --ink: #e6ebf3;
  --body: #b7c2d3;
  --muted: #9aa7bb;
  --faint: #9aa7bb;
  --accent: #7fb0f5;
  --accent-soft: #1c2a47;
  --c-green: #7fd4a8; --c-green-soft: #16301f;
  --c-blue:  #8fb6f2; --c-blue-soft:  #1a2b4a;
  --c-pink:  #f0a0c4; --c-pink-soft:  #3a1a2a;
  --c-gold:  #f2cf7a; --c-gold-soft:  #3a2e10;
  --shadow: 0 var(--s-2) var(--s-6) rgba(0, 0, 0, .35);
  color-scheme: dark;
}

/* --- Kategori → renk eşlemesi (tek kaynak) --- */
[data-cat="genel"], [data-cat="beslenme"], [data-cat="yasam"] { --c: var(--c-green); --c-soft: var(--c-green-soft); }
[data-cat="dis"], [data-cat="erkek"], [data-cat="cocuk"]      { --c: var(--c-blue);  --c-soft: var(--c-blue-soft); }
[data-cat="estetik"], [data-cat="cilt"], [data-cat="sac"], [data-cat="kadin"] { --c: var(--c-pink); --c-soft: var(--c-pink-soft); }
[data-cat="faydali"]                                            { --c: var(--c-gold);  --c-soft: var(--c-gold-soft); }

/* ---------- Sıfırlama ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--nav-h) + var(--s-2)); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; font-family: var(--font); font-size: var(--t-md); line-height: 1.5;
  color: var(--ink); background: var(--paper);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; color: inherit; cursor: pointer; touch-action: manipulation; }
a, button, input, select, textarea { touch-action: manipulation; }
button:disabled { cursor: default; }
h1, h2, h3, p, ul, ol, dl, dd { margin: 0; }
svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: var(--r-1); }
[hidden] { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }

.container { width: min(calc(956 * var(--u)), calc(100% - 32px)); margin-inline: auto; }
.section { margin-top: var(--s-8); }

/* ==========================================================================
   İLKELLER
   ========================================================================== */
/* --- Buton ailesi --- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  height: var(--btn); padding: 0 var(--s-5); border-radius: var(--r-pill); border: 1px solid transparent;
  font-size: var(--t-sm); font-weight: 600; letter-spacing: -.005em; white-space: nowrap;
  transition: background var(--dur) ease, border-color var(--dur) ease, transform var(--dur) var(--ease);
}
.btn svg { font-size: var(--i-sm); }
.btn:hover { transform: translateY(-1px); }
.btn:active, .circle:active, .chip:active, .cat:active, .guide-card:active { transform: scale(.97); transition-duration: var(--dur-fast); }
.btn-primary { background: var(--navy); color: var(--paper); }
.btn-primary:hover { background: #1b2f56; }
:root[data-theme="dark"] .btn-primary:hover { background: #ffffff; }
.btn-ghost { background: var(--accent-soft); border-color: var(--line); color: var(--navy); font-weight: 500; }
.btn-ghost:hover { border-color: var(--accent); }
.btn-sm { height: var(--btn-sm); padding: 0 var(--s-4); }

/* --- Dairesel kontrol ailesi --- */
.circle {
  width: var(--ctl); height: var(--ctl); border-radius: 50%; border: 1px solid transparent;
  display: grid; place-items: center; font-size: var(--i-md); color: var(--navy); background: transparent;
  transition: background var(--dur) ease, border-color var(--dur) ease, transform var(--dur) var(--ease), opacity var(--dur) ease;
}
.circle--ghost:hover { background: var(--tint); }
.circle--paper { background: var(--paper); border-color: var(--line); }
.circle--paper:hover { border-color: var(--accent); }
.circle--navy { background: var(--navy); color: var(--paper); }
.circle--navy:hover { background: #1b2f56; }
:root[data-theme="dark"] .circle--navy:hover { background: #ffffff; }
.circle--sm { width: calc(26 * var(--u)); height: calc(26 * var(--u)); font-size: var(--i-sm); box-shadow: var(--shadow-sm); }
.circle:disabled, .circle[aria-disabled="true"] { opacity: .35; transform: none; pointer-events: none; }
.circle.is-idle { display: none; }

/* --- Rozet --- */
.tag {
  display: inline-block; padding: calc(2.5 * var(--u)) var(--s-2) calc(2 * var(--u));
  border-radius: var(--r-pill); font-size: var(--t-2xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; line-height: 1.3;
  background: var(--c-soft, var(--tint)); color: var(--c, var(--ink));
}
.tag--on-photo { background: var(--navy); color: var(--paper); }
:root[data-theme="dark"] .tag--on-photo { background: #0f1524; color: #eef2f8; }

/* --- Meta, kicker, bölüm başlığı --- */
.meta { font-size: var(--t-xs); color: var(--faint); letter-spacing: -.005em; }
.meta i { font-style: normal; margin: 0 var(--s-2); }
.kicker { display: block; font-size: var(--t-xs); color: var(--body); margin-bottom: var(--s-1); }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: var(--ctl); }
.section-head h2 { font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.section-head--sub h2 { font-size: var(--t-xl); }
.link-more { display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--t-xs); font-weight: 500; color: var(--accent); }
.link-more svg { font-size: var(--i-sm); }
.link-more:hover { text-decoration: underline; text-underline-offset: 3px; }

/* --- Görsel geçişi (tek teknik: mask) --- */
.fade-img { position: absolute; top: 0; right: 0; bottom: 0; height: 100%; object-fit: cover; }
.fade-img--l { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 55%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 30%, #000 55%); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 40; transition: box-shadow var(--dur) ease, border-color var(--dur) ease;
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid transparent;
}
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 var(--s-1) var(--s-4) rgba(16, 32, 60, .05); }
.header-inner { display: flex; align-items: center; gap: var(--s-2); height: calc(66 * var(--u)); min-width: 0; }
.logo { display: flex; align-items: center; flex: none; }
.logo-img { height: calc(38 * var(--u)); width: auto; }
:root[data-theme="dark"] .logo-img { filter: brightness(0) invert(1); }

.main-nav { display: flex; align-items: center; flex: 1 1 auto; min-width: 0; gap: var(--s-4); margin-left: var(--s-6); font-size: var(--t-sm); font-weight: 500; letter-spacing: -.01em; color: var(--navy); white-space: nowrap; }
.main-nav > a, .nav-more > button { position: relative; padding: var(--s-1) 0; background: none; border: 0; transition: color var(--dur) ease; }
.main-nav > a::after, .nav-more > button::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform var(--dur) var(--ease); }
.main-nav > a:hover, .nav-more > button:hover, .main-nav > a[aria-current="page"] { color: var(--accent); }
.main-nav > a:hover::after, .main-nav > a[aria-current="page"]::after { transform: scaleX(1); }
.nav-more { position: relative; }
.nav-more > button { display: inline-flex; align-items: center; gap: var(--s-1); }
.nav-more > button svg { font-size: var(--i-sm); transition: transform var(--dur) var(--ease); }
.nav-more.is-open > button svg { transform: rotate(180deg); }
.nav-menu {
  position: absolute; left: 0; top: calc(100% + var(--s-2)); min-width: calc(180 * var(--u)); padding: var(--s-2); list-style: none;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-2); box-shadow: var(--shadow);
  opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity var(--dur) ease, transform var(--dur) var(--ease);
}
.nav-more.is-open .nav-menu { opacity: 1; transform: none; pointer-events: auto; }
.nav-menu .only-narrow { display: none; }
.nav-menu a { display: block; padding: var(--s-2) var(--s-3); border-radius: var(--r-1); font-weight: 500; }
.nav-menu a:hover { background: var(--tint); color: var(--accent); }

.header-actions { display: flex; align-items: center; flex: none; gap: var(--s-1); margin-left: auto; }
.header-actions .btn { margin-left: var(--s-2); }
.nav-toggle { display: none; }
.nav-toggle .icon-close, .nav-toggle[aria-expanded="true"] .icon-open { display: none; }
.nav-toggle[aria-expanded="true"] .icon-close { display: block; }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero { display: grid; grid-template-columns: minmax(0, 1fr) calc(302 * var(--u)); column-gap: var(--s-6); width: min(calc(956 * var(--u)), calc(100% - 32px)); margin: 0 auto; height: calc(392 * var(--u)); }
.hero-main { position: relative; display: grid; grid-template-columns: calc(318 * var(--u)) 1fr; grid-template-rows: 100%; border-radius: var(--r-3); overflow: hidden; background: var(--surface); }
.hero-content { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; padding: var(--s-10) 0 var(--s-8) var(--s-6); }
.eyebrow { font-size: var(--t-xs); font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.hero h1 { margin-top: var(--s-4); font-size: var(--t-4xl); line-height: 1.04; font-weight: 700; letter-spacing: -.035em; color: var(--navy); text-wrap: balance; }
.hero-content > p { margin-top: var(--s-3); max-width: calc(282 * var(--u)); font-size: var(--t-sm); line-height: 1.45; color: var(--body); }
.hero-content .btn { margin-top: var(--s-5); }
.hero-editorial { display: flex; align-items: center; gap: var(--s-2); margin-top: auto; padding-top: var(--s-5); max-width: calc(300 * var(--u)); font-size: var(--t-xs); line-height: 1.4; color: var(--muted); }
.hero-editorial svg { font-size: var(--i-md); color: var(--brand-green); }
.hero-editorial a { color: var(--ink); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line); }
.hero-editorial a:hover { text-decoration-color: currentColor; }

.hero-visual { position: relative; min-height: 0; }
.hero-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 25%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 36%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 36%); }

/* yan kartlar */
.hero-side { display: grid; grid-template-rows: 1fr 1fr 1.15fr; row-gap: var(--s-2); padding-top: var(--s-3); }
.side-card { position: relative; display: flex; align-items: center; overflow: hidden; border-radius: var(--r-2); padding: 0 var(--s-5); background: var(--surface); transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease; }
.side-card--green { background: color-mix(in srgb, var(--c-green-soft) 55%, var(--paper)); }
.side-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.side-card:hover .circle { transform: translateX(2px); }
.side-card .fade-img { width: 62%; }
.side-card-body { position: relative; z-index: 2; max-width: 64%; }
.side-card .kicker--brand { font-size: var(--t-xs); letter-spacing: .2em; text-transform: uppercase; color: var(--c-green); font-weight: 500; }
.side-card h2 { font-size: var(--t-xl); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: var(--navy); text-wrap: balance; }
.side-card .circle { position: absolute; z-index: 2; right: var(--s-5); bottom: var(--s-4); }

/* ==========================================================================
   KATEGORİLER
   ========================================================================== */
.categories { display: grid; grid-template-columns: repeat(11, 1fr); gap: var(--s-2); margin-top: var(--s-5); }
.cat {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: calc(64 * var(--u)); padding: var(--s-2) var(--s-1); border-radius: var(--r-2); border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--paper), var(--surface)); font-size: max(11px, calc(9.5 * var(--u))); line-height: 1.2; font-weight: 500; color: var(--ink); text-align: center;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease, border-color var(--dur) ease;
}
.cat:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--c) 35%, var(--line)); }
.cat svg { font-size: var(--i-lg); color: var(--c); }

/* ==========================================================================
   ÖNE ÇIKANLAR
   ========================================================================== */
.featured-grid { display: grid; grid-template-columns: calc(384 * var(--u)) calc(259 * var(--u)) calc(268 * var(--u)); column-gap: var(--s-6); margin-top: var(--s-4); min-height: calc(320 * var(--u)); }

.feature-card { position: relative; border-radius: var(--r-3); overflow: hidden; background: var(--surface-2); }
.feature-card .fade-img { width: 60%; object-position: 62% 30%; }
.feature-body { position: relative; z-index: 2; height: 100%; padding: var(--s-6) var(--s-5) var(--s-5); display: flex; flex-direction: column; align-items: flex-start; }
.feature-body h3 { margin-top: var(--s-3); max-width: calc(250 * var(--u)); font-size: var(--t-3xl); line-height: 1.15; font-weight: 700; letter-spacing: -.025em; color: var(--navy); text-wrap: balance; }
.feature-body p { margin-top: var(--s-2); max-width: calc(215 * var(--u)); font-size: var(--t-sm); line-height: 1.45; color: var(--body); }
.author { display: flex; align-items: center; gap: var(--s-2); margin-top: auto; padding-top: var(--s-4); }
.author img { width: var(--ctl); height: var(--ctl); border-radius: 50%; object-fit: cover; border: 2px solid var(--paper); background: var(--surface-2); }
.author strong { display: block; font-size: var(--t-xs); font-weight: 600; color: var(--navy); line-height: 1.2; }
.author span { display: block; font-size: var(--t-xs); color: var(--muted); margin-top: 2px; }
.feature-body .meta { margin-top: var(--s-2); }
.feature-card > .circle { position: absolute; z-index: 2; right: var(--s-5); bottom: var(--s-5); }

.mini-list { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); row-gap: var(--s-2); min-height: 0; }
.mini-card { position: relative; display: block; padding-left: calc(112 * var(--u)); overflow: hidden; min-height: 0; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-2); transition: box-shadow var(--dur) ease, transform var(--dur) var(--ease); }
.mini-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.mini-card > img { position: absolute; left: 0; top: 0; width: calc(112 * var(--u)); height: 100%; object-fit: cover; background: var(--surface-2); }
.mini-body { height: 100%; padding: var(--s-3) var(--s-2) var(--s-3) var(--s-3); display: flex; flex-direction: column; align-items: flex-start; }
.mini-body h3 { margin-top: var(--s-2); font-size: var(--t-sm); line-height: 1.3; font-weight: 700; letter-spacing: -.025em; color: var(--navy); text-wrap: balance; }
.mini-body .meta { margin-top: auto; padding-top: var(--s-2); }

.expert-card { position: relative; border-radius: var(--r-3); overflow: hidden; background: linear-gradient(160deg, var(--surface) 0%, var(--surface-2) 100%); padding: var(--s-6) var(--s-5) var(--s-5); display: flex; flex-direction: column; }
.expert-card .fade-img { width: 56%; height: 78%; object-position: 60% 12%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.7) 30%, #000 55%), linear-gradient(180deg, #000 80%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.7) 30%, #000 55%), linear-gradient(180deg, #000 80%, transparent 100%);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
.expert-body { position: relative; z-index: 2; max-width: 60%; }
.expert-body h3 { font-size: var(--t-3xl); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.expert-body p { margin-top: var(--s-2); font-size: var(--t-sm); line-height: 1.45; color: var(--body); }
.expert-body .btn { margin-top: var(--s-4); }
.expert-note { position: relative; z-index: 2; display: flex; align-items: flex-start; gap: var(--s-2); margin-top: auto; padding-top: var(--s-6); font-size: var(--t-xs); line-height: 1.4; color: var(--muted); }
.expert-note svg { font-size: var(--i-md); color: var(--brand-green); margin-top: 1px; }

/* ==========================================================================
   GÜNCEL İÇERİKLER + EN ÇOK OKUNANLAR
   ========================================================================== */
.latest { display: grid; grid-template-columns: calc(699 * var(--u)) 1fr; }
.latest-main { padding-right: var(--s-4); min-width: 0; }
.popular { border-left: 1px solid var(--line); padding-left: var(--s-3); }
.slider-nav { display: flex; gap: var(--s-1); }

.filter-chips { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-3); }
.chip { display: inline-flex; align-items: center; min-height: calc(28 * var(--u)); padding: 0 var(--s-4); border: 0; border-radius: var(--r-pill); background: var(--tint); color: var(--ink); font-size: var(--t-xs); font-weight: 500; letter-spacing: -.005em; transition: background var(--dur) ease, color var(--dur) ease; }
.chip:hover { background: var(--surface-2); }
.chip[aria-pressed="true"] { background: var(--navy); color: var(--paper); }

.post-grid { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: var(--s-4); margin-top: var(--s-5); }
.post-card { display: block; }
.post-thumb { position: relative; aspect-ratio: 166 / 128; border-radius: var(--r-2); overflow: hidden; background: var(--surface-2); }
.post-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.post-card:hover .post-thumb img { transform: scale(1.04); }
.post-thumb .tag { position: absolute; left: var(--s-2); bottom: var(--s-2); }
.post-card h3 { margin-top: var(--s-3); font-size: var(--t-lg); line-height: 1.3; font-weight: 700; letter-spacing: -.025em; color: var(--navy); text-wrap: balance; transition: color var(--dur) ease; }
.post-card:hover h3 { color: var(--accent); }
.post-card .meta { margin-top: var(--s-2); }
.post-empty { margin-top: var(--s-5); padding: var(--s-6); border: 1px dashed var(--line); border-radius: var(--r-2); text-align: center; color: var(--muted); font-size: var(--t-sm); }

.popular-list { list-style: none; margin: var(--s-2) 0 0; padding: 0; }
.popular-list li + li { border-top: 1px solid var(--line); }
.popular-list a { display: grid; grid-template-columns: var(--ctl) calc(44 * var(--u)) 1fr; align-items: center; column-gap: var(--s-3); padding: var(--s-2) 0; min-height: calc(52 * var(--u)); }
.popular-list .rank { width: var(--ctl); height: var(--ctl); border-radius: var(--r-1); background: var(--accent-soft); display: grid; place-items: center; font-size: var(--t-sm); font-weight: 600; color: var(--accent); }
.popular-list img { width: calc(44 * var(--u)); height: calc(44 * var(--u)); border-radius: var(--r-1); object-fit: cover; background: var(--surface-2); }
.popular-title { font-size: var(--t-xs); line-height: 1.35; font-weight: 500; letter-spacing: -.01em; color: var(--ink); transition: color var(--dur) ease; }
.popular-list a:hover .popular-title { color: var(--accent); }

/* ==========================================================================
   BÜLTEN
   ========================================================================== */
.newsletter-inner { position: relative; display: grid; grid-template-columns: 1fr calc(332 * var(--u)); align-items: center; column-gap: var(--s-8); min-height: calc(155 * var(--u)); padding: var(--s-6) var(--s-8); border-radius: var(--r-3); overflow: hidden; background: linear-gradient(90deg, var(--surface) 0%, var(--surface-2) 55%, var(--surface) 100%); }
.newsletter-img { position: absolute; left: 36%; top: 0; width: 28%; height: 100%; object-fit: cover; object-position: center 40%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%); }
.newsletter-text { position: relative; z-index: 2; max-width: calc(300 * var(--u)); }
.newsletter-text h2 { font-size: var(--t-3xl); line-height: 1.18; font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.newsletter-text p { margin-top: var(--s-3); font-size: var(--t-sm); line-height: 1.45; color: var(--body); }
.newsletter-form { position: relative; z-index: 2; }
.input-group { display: flex; align-items: center; height: calc(40 * var(--u)); padding: 0 var(--s-1) 0 var(--s-5); background: var(--paper); border: 1px solid transparent; border-radius: var(--r-pill); box-shadow: var(--shadow); transition: box-shadow var(--dur) ease, border-color var(--dur) ease; }
.input-group:focus-within { box-shadow: 0 0 0 3px var(--accent-soft), var(--shadow); border-color: var(--accent); }
.was-validated .input-group:has(input:invalid) { border-color: var(--c-pink); }
.input-group input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: var(--t-sm); color: var(--ink); }
.input-group input::placeholder { color: var(--faint); }
.input-group .btn { height: var(--btn-sm); }
.consent { display: flex; align-items: flex-start; gap: var(--s-2); margin-top: var(--s-3); padding-left: var(--s-2); font-size: var(--t-xs); line-height: 1.4; color: var(--body); cursor: pointer; }
.consent input { width: calc(14 * var(--u)); height: calc(14 * var(--u)); margin: 2px 0 0; accent-color: var(--accent); flex: none; }
.consent a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.form-status { margin-top: var(--s-2); padding-left: var(--s-2); font-size: var(--t-xs); font-weight: 500; }
.form-status[data-kind="error"] { color: var(--c-pink); }
.form-status[data-kind="ok"] { color: var(--c-green); }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer { margin-top: var(--s-8); border-top: 1px solid var(--line); }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: var(--s-6); min-height: calc(92 * var(--u)); }
.footer-flow { display: flex; align-items: center; gap: var(--s-3); font-size: var(--t-md); font-weight: 500; color: var(--ink); letter-spacing: -.01em; }
.footer-flow svg { font-size: var(--i-md); color: var(--muted); }
.social { display: flex; gap: var(--s-1); }
.social .circle svg { fill: currentColor; stroke: none; font-size: var(--i-sm); }
.social .circle:hover { color: var(--accent); }
.footer-motto { display: flex; align-items: center; gap: var(--s-3); font-size: var(--t-xs); line-height: 1.3; letter-spacing: -.01em; color: var(--ink); }
.footer-motto svg { font-size: calc(36 * var(--u)); stroke: none; }
.footer-motto .leaf-a { fill: color-mix(in srgb, var(--brand-green) 35%, var(--paper)); }
.footer-motto .leaf-b { fill: var(--brand-green); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: calc(58 * var(--u)); border-top: 1px solid var(--line); font-size: var(--t-xs); color: var(--muted); }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--s-6); }
.footer-links a:hover { color: var(--accent); }

/* ==========================================================================
   DUYARLI
   ========================================================================== */
@media (max-width: 1180px) {
  .main-nav { gap: var(--s-3); }
  .main-nav > .only-wide { display: none; }
  .nav-menu .only-narrow { display: list-item; }
}
@media (max-width: 1023px) {
  :root { --u: 1px; --chapter-nav-h: 64px; }
  .container, .hero { width: calc(100% - 32px); }
  .hero { height: auto; grid-template-columns: 1fr 300px; }
  .hero-main { min-height: 392px; }

  /* mobil menü */
  .nav-toggle { display: grid; }
  .main-nav { position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: var(--s-2) var(--s-4) var(--s-4); background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); font-size: var(--t-md); display: none; }
  .main-nav.is-open { display: flex; }
  .main-nav > a, .nav-more > button { padding: var(--s-3) 0; border-bottom: 1px solid var(--line); text-align: left; width: 100%; }
  .main-nav > a::after, .nav-more > button::after { display: none; }
  .nav-more > button { justify-content: space-between; }
  .nav-menu { position: static; min-width: 0; padding: 0 0 var(--s-2) var(--s-3); border: 0; box-shadow: none; opacity: 1; transform: none; pointer-events: auto; display: none; }
  .nav-more.is-open .nav-menu { display: block; }
  .site-header { border-bottom-color: var(--line); }

  .categories { grid-template-columns: repeat(6, 1fr); }
  .featured-grid { grid-template-columns: 1fr 1fr; min-height: 0; row-gap: var(--s-5); }
  .feature-card { min-height: 320px; }
  .expert-card { grid-column: 1 / -1; min-height: 280px; }
  .expert-card .fade-img { width: 40%; }
  .latest { grid-template-columns: 1fr; }
  .latest-main { padding-right: 0; }
  .popular { border-left: 0; padding-left: 0; margin-top: var(--s-8); }

  /* yatay kaydırmalı içerik satırı; oklar bunu kaydırır */
  .post-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--s-4); padding-bottom: var(--s-2); scrollbar-width: none; }
  .post-grid::-webkit-scrollbar { display: none; }
  .post-card { flex: 0 0 min(72vw, 300px); scroll-snap-align: start; }

  .newsletter-inner { grid-template-columns: 1fr; min-height: 0; padding: var(--s-6); row-gap: var(--s-5); }
  .newsletter-img { display: none; }
  .newsletter-text { max-width: none; }
  .footer-top { flex-wrap: wrap; gap: var(--s-5) var(--s-8); padding: var(--s-6) 0; }

  /* dokunma hedefleri */
  .circle, .chip, .comment-actions button { min-width: 40px; min-height: 40px; }
  .circle--sm { width: 40px; height: 40px; }
}
@media (max-width: 760px) {
  .hero { grid-template-columns: 1fr; }
  .hero-main { grid-template-columns: 1fr; grid-template-rows: auto 320px; min-height: 0; }
  .hero-content { padding: var(--s-8) var(--s-5) var(--s-6); }
  .hero h1 { font-size: clamp(34px, 11vw, 46px); }
  .hero-content > p { max-width: 36ch; }
  .hero-visual img { mask-image: linear-gradient(180deg, transparent 0%, #000 30%); -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%); object-position: 50% 30%; }
  .hero-side { grid-template-rows: none; row-gap: var(--s-2); padding: var(--s-2) 0 0; }
  .side-card { min-height: 112px; }
  .categories { grid-template-columns: repeat(3, 1fr); }
  .featured-grid { grid-template-columns: 1fr; }
  .feature-body h3, .feature-body p { max-width: none; }
  .expert-body { max-width: 68%; }
  .header-actions .btn { font-size: 0; gap: 0; padding: 0; width: var(--btn); }
  .header-actions .btn svg { font-size: var(--i-md); }
  .footer-bottom { flex-direction: column; align-items: flex-start; padding: var(--s-4) 0 var(--s-6); }
  .footer-links { gap: var(--s-3) var(--s-5); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   MAKALE SAYFASI
   ========================================================================== */
.read-progress { position: fixed; top: 0; left: 0; z-index: 60; height: 3px; width: 100%; background: transparent; pointer-events: none; }
.read-progress > span { display: block; height: 100%; width: 0; background: var(--brand-grad); transition: width .1s linear; }

.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) max(calc(257 * var(--u)), 332px); margin-top: var(--s-6); align-items: start; }
.article-col { padding-right: var(--s-4); min-width: 0; }
.article-side { align-self: stretch; border-left: 1px solid var(--line); padding-left: var(--s-3); }

/* --- Başlık bloğu --- */
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1); font-size: var(--t-xs); color: var(--muted); }
.crumbs svg { font-size: var(--i-sm); color: var(--faint); }
.crumbs a:hover { color: var(--accent); }
.article-head { margin-top: var(--s-4); }
.article-head .tag { margin-bottom: var(--s-3); }
.article-title { font-size: var(--t-title); line-height: 1.12; font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; max-width: 22ch; }
.article-deck { margin-top: var(--s-3); max-width: 62ch; font-size: var(--t-md); line-height: 1.55; color: var(--body); }

.article-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-3) var(--s-4); margin-top: var(--s-5); padding: var(--s-4) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.article-meta .author { margin: 0; padding: 0; }
.meta-list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); font-size: var(--t-xs); color: var(--faint); }
.meta-list span { display: inline-flex; align-items: center; gap: var(--s-1); }
.meta-list svg { font-size: var(--i-sm); }
.meta-list a:hover { color: var(--accent); }
.share { display: flex; align-items: center; gap: var(--s-1); }
.share .circle svg.brand { fill: currentColor; stroke: none; font-size: var(--i-sm); }
.share .circle[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent); }
.share-status { font-size: var(--t-xs); color: var(--c-green); font-weight: 500; }

/* --- Tıbbi inceleme kutusu --- */
.review-box { display: flex; gap: var(--s-3); align-items: flex-start; margin-top: var(--s-5); padding: var(--s-4) var(--s-5); border-radius: var(--r-2); background: color-mix(in srgb, var(--c-green-soft) 60%, var(--paper)); border: 1px solid color-mix(in srgb, var(--brand-green) 25%, var(--line)); }
.review-box > svg { font-size: var(--i-lg); color: var(--c-green); margin-top: 2px; }
.review-box strong { display: block; font-size: var(--t-sm); font-weight: 600; color: var(--navy); }
.review-box p { margin-top: var(--s-1); font-size: var(--t-xs); line-height: 1.45; color: var(--body); }
.review-box a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }

/* --- Görsel --- */
.article-figure { margin: var(--s-6) 0 0; }
.article-figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r-3); background: var(--surface-2); }
.article-figure figcaption { margin-top: var(--s-2); font-size: var(--t-xs); color: var(--faint); }

/* --- Bölüm gezgini --- */
.chapter-nav { position: sticky; top: var(--nav-h); min-height: var(--chapter-nav-h); z-index: 30; display: flex; gap: var(--s-2); overflow-x: auto; scrollbar-width: none; margin-top: var(--s-6); padding: var(--s-3) 0; background: color-mix(in srgb, var(--paper) 92%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.chapter-nav::-webkit-scrollbar { display: none; }
.chapter-nav ul { list-style: none; display: flex; gap: var(--s-2); margin: 0; padding: 0; width: max-content; }
.chapter-nav li { flex: none; }
.chapter-nav .chip { flex: none; text-decoration: none; }
.chapter-nav .chip[aria-current="true"] { background: var(--navy); color: var(--paper); }

/* --- Gövde tipografisi --- */
.article-body { margin-top: var(--s-6); }
.article-body > p, .chapter > p { max-width: 68ch; font-size: var(--t-md); line-height: 1.7; color: var(--ink); }
.article-body > p + p, .chapter > p + p { margin-top: var(--s-4); }
.article-body .lede { font-size: calc(var(--t-md) * 1.08); color: var(--ink); }
.chapter { margin-top: var(--s-10); scroll-margin-top: calc(var(--nav-h) + var(--chapter-nav-h) + var(--s-2)); }
.chapter-kicker { display: block; font-size: var(--t-xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.chapter h2 { margin-top: var(--s-2); font-size: var(--t-3xl); line-height: 1.15; font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.chapter > p:first-of-type { margin-top: var(--s-4); }
.tip { display: grid; grid-template-columns: var(--ctl) 1fr; column-gap: var(--s-3); margin-top: var(--s-6); max-width: 68ch; }
.tip-num { width: var(--ctl); height: var(--ctl); border-radius: var(--r-1); background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; font-size: var(--t-sm); font-weight: 600; }
.tip h3 { font-size: var(--t-xl); line-height: 1.25; font-weight: 700; letter-spacing: -.02em; color: var(--navy); padding-top: calc(var(--ctl) / 2 - .62em); }
.tip p { margin-top: var(--s-2); font-size: var(--t-md); line-height: 1.65; color: var(--ink); }
.tip p + p { margin-top: var(--s-2); }
.cite { font-size: .75em; vertical-align: super; line-height: 0; color: var(--accent); font-weight: 600; margin-left: 2px; }
.cite:hover { text-decoration: underline; }
.chapter-summary { margin-top: var(--s-6); max-width: 68ch; padding: var(--s-4) var(--s-5); border-radius: var(--r-2); background: var(--surface); }
.chapter-summary strong { display: flex; align-items: center; gap: var(--s-2); font-size: var(--t-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.chapter-summary strong svg { font-size: var(--i-sm); }
.chapter-summary ul { margin: var(--s-2) 0 0; padding-left: 1.1em; font-size: var(--t-sm); line-height: 1.5; color: var(--ink); }
.chapter-summary li + li { margin-top: var(--s-1); }

/* --- Uyarı, kaynakça, yazar --- */
.notice { display: flex; gap: var(--s-3); margin-top: var(--s-10); max-width: 68ch; padding: var(--s-4) var(--s-5); border-radius: var(--r-2); background: var(--c-gold-soft); color: var(--ink); }
.notice > svg { font-size: var(--i-lg); color: var(--c-gold); margin-top: 2px; }
.notice strong { display: block; font-size: var(--t-sm); font-weight: 600; color: var(--navy); }
.notice p { margin-top: var(--s-1); font-size: var(--t-xs); line-height: 1.5; color: var(--body); }
.sources { margin-top: var(--s-10); max-width: 68ch; scroll-margin-top: calc(var(--nav-h) + var(--chapter-nav-h) + var(--s-2)); }
.sources h2, .comments h2, .related .section-head h2 { font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.sources ol { margin: var(--s-4) 0 0; padding-left: 1.6em; font-size: var(--t-xs); line-height: 1.5; color: var(--body); }
.sources li { padding-left: var(--s-1); scroll-margin-top: calc(var(--nav-h) + var(--chapter-nav-h) + var(--s-2)); }
.sources li + li { margin-top: var(--s-2); }
.sources li:target { background: var(--accent-soft); border-radius: var(--r-1); }
.sources a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.article-tags { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-8); }
.article-tags .chip { text-decoration: none; }
.article-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-3); margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--line); }
.article-foot .meta-list { color: var(--muted); }
.author-card { display: grid; grid-template-columns: calc(72 * var(--u)) 1fr; column-gap: var(--s-4); align-items: start; margin-top: var(--s-8); padding: var(--s-5); border-radius: var(--r-3); background: var(--surface); }
.author-card img { width: calc(72 * var(--u)); height: calc(72 * var(--u)); border-radius: 50%; object-fit: cover; border: 3px solid var(--paper); background: var(--surface-2); }
.author-card .kicker { margin-bottom: 2px; }
.author-card strong { font-size: var(--t-xl); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.author-card p { margin-top: var(--s-2); font-size: var(--t-sm); line-height: 1.55; color: var(--body); }
.author-card .link-more { margin-top: var(--s-3); }

/* --- Yorumlar --- */
.comments { margin-top: var(--s-10); scroll-margin-top: calc(var(--nav-h) + var(--chapter-nav-h) + var(--s-2)); }
.comments-note { margin-top: var(--s-2); font-size: var(--t-xs); color: var(--muted); }
.comment-list { list-style: none; margin: var(--s-5) 0 0; padding: 0; }
.comment { display: grid; grid-template-columns: var(--ctl) 1fr; column-gap: var(--s-3); padding: var(--s-4) 0; border-top: 1px solid var(--line); }
.comment img { width: var(--ctl); height: var(--ctl); border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.comment-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-1) var(--s-2); }
.comment-head strong { font-size: var(--t-sm); font-weight: 600; color: var(--navy); }
.comment-head .tag { transform: translateY(-1px); }
.comment-head time { font-size: var(--t-xs); color: var(--faint); }
.comment p { margin-top: var(--s-1); font-size: var(--t-sm); line-height: 1.6; color: var(--ink); max-width: 68ch; }
.comment-actions { display: flex; gap: var(--s-3); margin-top: var(--s-2); }
.comment-actions button { display: inline-flex; align-items: center; gap: var(--s-1); min-height: var(--ctl); border: 0; background: none; padding: 0; font-size: var(--t-xs); font-weight: 500; color: var(--muted); }
.comment-actions button svg { font-size: var(--i-sm); }
.comment-actions button:hover, .comment-actions button[aria-pressed="true"] { color: var(--accent); }
.comment--reply { margin-left: calc(var(--ctl) + var(--s-3)); border-top: 1px dashed var(--line); }
.comment-form { margin-top: var(--s-5); padding: var(--s-5); border-radius: var(--r-3); background: var(--surface); }
.comment-form h3 { font-size: var(--t-xl); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); margin-top: var(--s-4); }
.field { display: flex; flex-direction: column; gap: var(--s-1); }
.field label { font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.field input, .field textarea { font: inherit; font-size: var(--t-sm); color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-2); padding: var(--s-2) var(--s-3); min-height: calc(40 * var(--u)); transition: border-color var(--dur) ease, box-shadow var(--dur) ease; }
.field textarea { min-height: calc(120 * var(--u)); resize: vertical; }
.field input:focus, .field textarea:focus { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 28%, transparent); }
.was-validated .field input:invalid, .was-validated .field textarea:invalid { border-color: var(--c-pink); }
.field-full { grid-column: 1 / -1; }
.comment-form .consent { padding-left: 0; }
.comment-form .form-status { padding-left: 0; }
.comment-form .btn { margin-top: var(--s-4); }

/* --- Kenar çubuğu --- */
.side-block + .side-block, .side-block + .side-sticky > .side-block:first-child { margin-top: var(--s-6); padding-top: var(--s-6); border-top: 1px solid var(--line); }
.side-block > h2, .toc summary h2, .article-col > .section > .section-head h2 { font-size: var(--t-xl); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.toc summary { list-style: none; pointer-events: none; }
.toc summary::-webkit-details-marker { display: none; }
.toc ol { list-style: none; margin: var(--s-3) 0 0; padding: 0; }
.toc li + li { margin-top: 2px; }
.toc a { display: grid; grid-template-columns: calc(24 * var(--u)) 1fr; column-gap: var(--s-2); align-items: center; padding: var(--s-2) var(--s-2); border-radius: var(--r-1); font-size: var(--t-xs); font-weight: 500; line-height: 1.3; color: var(--body); transition: background var(--dur) ease, color var(--dur) ease; }
.toc a span:first-child { font-size: var(--t-2xs); font-weight: 600; letter-spacing: .04em; color: var(--faint); text-align: center; }
.toc a:hover { background: var(--tint); color: var(--navy); }
.toc a[aria-current="true"] { background: var(--accent-soft); color: var(--accent); }
.toc a[aria-current="true"] span:first-child { color: var(--accent); }
.toc .toc-sub { font-size: var(--t-xs); }
.toc-time { display: flex; align-items: center; gap: var(--s-1); margin-top: var(--s-3); font-size: var(--t-xs); color: var(--faint); }
.toc-time svg { font-size: var(--i-sm); }
.ad-slot { display: grid; place-items: center; gap: var(--s-1); margin: 0 auto; border: 1px dashed var(--line); border-radius: var(--r-2); background: var(--tint); color: var(--faint); font-size: var(--t-xs); }
.ad-slot span:first-child { font-size: var(--t-2xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.ad-slot--rect { width: 300px; height: 250px; max-width: 100%; }
.ad-slot--tower { width: 300px; height: 600px; max-width: 100%; }
.side-newsletter p { margin-top: var(--s-2); font-size: var(--t-xs); line-height: 1.45; color: var(--body); }
.side-newsletter .field { margin-top: var(--s-3); }
.side-newsletter .consent { padding-left: 0; }
.side-newsletter .btn { width: 100%; margin-top: var(--s-3); }
.side-newsletter .form-status { padding-left: 0; }
.side-sticky { position: sticky; top: calc(var(--nav-h) + var(--s-4)); }

/* --- İlgili içerikler --- */
.related { margin-top: var(--s-10); }
.related .post-grid { margin-top: var(--s-4); }

/* --- Yukarı --- */
.to-top { position: fixed; right: var(--s-5); bottom: var(--s-5); z-index: 35; opacity: 0; transform: translateY(8px); pointer-events: none; box-shadow: var(--shadow); }
.to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }

@media (max-width: 1023px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-col { padding-right: 0; }
  .article-side { border-left: 0; padding-left: 0; margin-top: var(--s-10); padding-top: var(--s-8); border-top: 1px solid var(--line); }
  .side-sticky { position: static; }
  .toc { display: none; }
  .article-meta { padding: var(--s-3) 0; }
  .field-row { grid-template-columns: 1fr; }
  .comment--reply { margin-left: var(--s-4); }
  .to-top { right: var(--s-4); bottom: var(--s-4); }
}
@media (max-width: 760px) {
  .article-title { max-width: none; }
  .tip { column-gap: var(--s-2); }
  .author-card { grid-template-columns: 1fr; row-gap: var(--s-3); }
}
@media print {
  .site-header, .chapter-nav, .article-side, .share, .comments, .related, .site-footer, .to-top, .read-progress { display: none !important; }
  .article-layout { grid-template-columns: 1fr; }
  a { color: inherit; }
}

/* ==========================================================================
   DISPLAY YAZI TİPİ — başlıklar Sora, gövde Inter
   ========================================================================== */
.hero h1, .section-head h2, .side-card h2, .feature-body h3, .expert-body h3, .mini-body h3, .post-card h3,
.newsletter-text h2, .article-title, .chapter h2, .tip h3, .sources h2, .comments h2, .author-card strong,
.side-block > h2, .toc summary h2, .comment-form h3, .category-head h1, .guide-card h3, .author-id h1, .post-row h3, .author-card-sm strong, .page-head h1, .policy-strip h2, .error-card h1, .error-card h2 {
  font-family: var(--font-display); letter-spacing: -.02em;
}
.category-head h1 { letter-spacing: -.03em; }
.hero h1 { letter-spacing: -.03em; }
.feature-body h3 { max-width: calc(300 * var(--u)); }
.expert-body h3 { font-size: calc(22 * var(--u)); }
.mini-body h3 { letter-spacing: -.025em; }

/* ==========================================================================
   KATEGORİ SAYFASI
   ========================================================================== */
.category-head { display: grid; grid-template-columns: calc(64 * var(--u)) 1fr; column-gap: var(--s-4); align-items: center; margin-top: var(--s-4); }
.category-icon { width: calc(64 * var(--u)); height: calc(64 * var(--u)); border-radius: var(--r-3); background: var(--c-soft); color: var(--c); display: grid; place-items: center; font-size: var(--i-xl); }
.category-icon svg { stroke-width: 1.75; }
.category-head h1 { font-size: var(--t-title); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.category-head p { margin-top: var(--s-2); max-width: 64ch; font-size: var(--t-md); line-height: 1.5; color: var(--body); }
.category-head .meta-list { margin-top: var(--s-2); }

.guide-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-3); margin-top: var(--s-4); }
.guide-card { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-4); border-radius: var(--r-3); background: var(--surface); border: 1px solid transparent; transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease, border-color var(--dur) ease; }
.guide-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line); }
.guide-card .tip-num { margin-bottom: var(--s-1); }
.guide-card h3 { font-size: var(--t-lg); line-height: 1.25; font-weight: 700; letter-spacing: -.02em; color: var(--navy); text-wrap: balance; }
.guide-card p { font-size: var(--t-xs); line-height: 1.45; color: var(--body); }
.guide-card .meta { margin-top: auto; padding-top: var(--s-2); }

.expert-row { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); margin: var(--s-3) 0 0; padding: var(--s-4) var(--s-5); border-radius: var(--r-3); border: 1px solid var(--line); }
.expert-row .author { flex: 1 1 calc(180 * var(--u)); padding: 0; margin: 0; }
.expert-row .author img { width: calc(40 * var(--u)); height: calc(40 * var(--u)); }
.expert-row .author span { display: block; }
.expert-row .author em { display: block; font-style: normal; font-size: var(--t-xs); color: var(--faint); margin-top: 2px; }
.expert-row .link-more { align-self: center; margin-left: auto; }

.category-posts .post-grid { grid-template-columns: repeat(3, 1fr); row-gap: var(--s-6); margin-top: var(--s-5); }
.category-posts .section-head .meta { font-weight: 500; }
.pagination { display: flex; align-items: center; justify-content: center; gap: var(--s-1); margin-top: var(--s-8); }
.pagination .chip { min-width: calc(36 * var(--u)); justify-content: center; text-decoration: none; }
.pagination .chip[aria-current="page"] { background: var(--navy); color: var(--paper); }
.pagination .gap { padding: 0 var(--s-1); color: var(--faint); }

.subtopics { list-style: none; margin: var(--s-3) 0 0; padding: 0; }
.subtopics a { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); padding: var(--s-2); border-radius: var(--r-1); font-size: var(--t-xs); font-weight: 500; color: var(--body); transition: background var(--dur) ease, color var(--dur) ease; }
.subtopics a:hover { background: var(--tint); color: var(--navy); }
.subtopics a[aria-current="true"] { background: var(--accent-soft); color: var(--accent); }
.subtopics .count { font-size: var(--t-2xs); font-weight: 600; color: var(--muted); background: var(--tint); border-radius: var(--r-pill); padding: 2px var(--s-2); }
.subtopics a[aria-current="true"] .count { background: var(--paper); color: var(--accent); }

@media (max-width: 1023px) {
  .guide-grid { grid-template-columns: repeat(2, 1fr); }
  .subtopics-block { display: none; }
  .subtopics a, .link-more { min-height: 40px; }
  .link-more { padding-block: var(--s-2); }
  .category-posts .post-grid { display: grid; grid-template-columns: repeat(2, 1fr); overflow: visible; scroll-snap-type: none; padding-bottom: 0; }
  .category-posts .post-card { flex: none; }
  .expert-row .link-more { margin-left: 0; flex-basis: 100%; }
}
@media (max-width: 760px) {
  .category-head { grid-template-columns: calc(48 * var(--u)) 1fr; align-items: start; }
  .category-icon { width: calc(48 * var(--u)); height: calc(48 * var(--u)); border-radius: var(--r-2); font-size: var(--i-lg); }
  .guide-grid { grid-template-columns: 1fr; gap: var(--s-2); }
  .guide-card { flex-direction: row; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); }
  .guide-card .tip-num { margin: 0; flex: none; }
  .guide-card h3 { flex: 1; font-size: var(--t-sm); }
  .guide-card p { display: none; }
  .guide-card .meta { margin: 0; padding: 0; flex: none; }
  .category-posts .post-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   PROFESYONEL KATMAN — erişilebilirlik, arama, footer, hareket
   ========================================================================== */
/* atlama bağlantısı */
.skip-link { position: fixed; top: var(--s-2); left: var(--s-2); z-index: 100; padding: var(--s-2) var(--s-4); border-radius: var(--r-pill); background: var(--navy); color: var(--paper); font-size: var(--t-sm); font-weight: 600; transform: translateY(-200%); transition: transform var(--dur) var(--ease); }
.skip-link:focus { transform: none; outline-offset: 2px; }
main:focus { outline: none; }

/* arama diyaloğu */
.search-dialog { width: min(640px, calc(100% - 32px)); margin: 10vh auto auto; padding: 0; border: 0; border-radius: var(--r-3); background: var(--paper); color: var(--ink); box-shadow: 0 var(--s-6) calc(60 * var(--u)) rgba(16, 32, 60, .25); }
.search-dialog::backdrop { background: rgba(16, 32, 60, .45); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.search-dialog[open] { animation: dialog-in var(--dur-slow) var(--ease); }
@keyframes dialog-in { from { opacity: 0; transform: translateY(-8px) scale(.98); } to { opacity: 1; transform: none; } }
.search-box { padding: var(--s-4) var(--s-4) var(--s-3); }
.search-field { display: flex; align-items: center; gap: var(--s-3); padding: 0 var(--s-2) 0 var(--s-4); height: calc(52 * var(--u)); border-radius: var(--r-2); background: var(--tint); }
.search-field > svg { font-size: var(--i-lg); color: var(--muted); }
.search-field input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: var(--t-md); color: var(--ink); }
.search-field input::placeholder { color: var(--faint); }
.search-field input::-webkit-search-cancel-button { -webkit-appearance: none; }
.search-hint { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-top: var(--s-3); font-size: var(--t-xs); color: var(--muted); }
.search-results { list-style: none; margin: var(--s-3) 0 0; padding: 0; max-height: 50vh; overflow: auto; }
.search-results:empty { display: none; }
.search-results a { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--s-3); padding: var(--s-3); border-radius: var(--r-2); color: var(--ink); }
.search-results a:hover, .search-results li[aria-selected="true"] a { background: var(--tint); }
.search-results strong { display: block; font-size: var(--t-sm); font-weight: 600; color: var(--navy); }
.search-results strong mark { background: var(--accent-soft); color: var(--accent); border-radius: 3px; padding: 0 2px; }
.search-results .search-cat { font-size: var(--t-xs); color: var(--muted); }
.search-results .tag { justify-self: end; }
.search-empty { margin: var(--s-4) var(--s-2) var(--s-2); font-size: var(--t-sm); color: var(--muted); }
body.dialog-open { overflow: hidden; }

/* footer — kurumsal düzen */
.footer-grid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: var(--s-8) var(--s-6); padding: var(--s-10) 0 var(--s-8); }
.footer-brand > p { margin-top: var(--s-4); max-width: 34ch; font-size: var(--t-sm); line-height: 1.5; color: var(--body); }
.footer-brand .footer-flow { margin-top: var(--s-4); font-size: var(--t-sm); }
.footer-brand .social { margin-top: var(--s-4); }
.footer-col h2 { font-size: var(--t-xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.footer-col ul { list-style: none; margin: var(--s-3) 0 0; padding: 0; }
.footer-col li + li { margin-top: var(--s-1); }
.footer-col a { display: inline-block; padding: var(--s-1) 0; font-size: var(--t-sm); color: var(--ink); transition: color var(--dur) ease; }
.footer-col a:hover { color: var(--accent); }
.footer-bottom { align-items: flex-start; padding: var(--s-4) 0 var(--s-6); }
.footer-disclaimer { display: flex; align-items: flex-start; gap: var(--s-2); max-width: 70ch; margin: 0; font-size: var(--t-xs); line-height: 1.5; color: var(--muted); }
.footer-disclaimer svg { font-size: var(--i-sm); flex: none; margin-top: 3px; color: var(--c-gold); }

/* bölüm belirme hareketi — tek, sakin an */
.js .reveal { opacity: 0; transform: translateY(12px); transition: opacity var(--dur-slow) ease, transform var(--dur-slow) var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }

/* buton yükleniyor durumu */
.btn[aria-busy="true"] { opacity: .7; pointer-events: none; }

@media (max-width: 1023px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .footer-grid { grid-template-columns: 1fr; gap: var(--s-6); padding: var(--s-8) 0 var(--s-6); }
  .search-dialog { margin-top: var(--s-4); }
}
@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; }
  .search-dialog[open] { animation: none; }
}

/* tema düğmesi ikonları */
[data-theme-toggle] .icon-dark, :root[data-theme="dark"] [data-theme-toggle] .icon-light { display: none; }
:root[data-theme="dark"] [data-theme-toggle] .icon-dark { display: block; }

/* çerez bildirimi */
.cookie-bar { position: fixed; left: 50%; bottom: var(--s-4); z-index: 50; transform: translateX(-50%); width: min(720px, calc(100% - 32px)); display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-3) var(--s-3) var(--s-3) var(--s-5); border-radius: var(--r-3); background: var(--paper); border: 1px solid var(--line); box-shadow: 0 var(--s-3) var(--s-10) rgba(16, 32, 60, .18); animation: cookie-in var(--dur-slow) var(--ease); }
.cookie-bar p { font-size: var(--t-xs); line-height: 1.5; color: var(--body); }
.cookie-bar a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.cookie-actions { display: flex; gap: var(--s-2); flex: none; }
@keyframes cookie-in { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (max-width: 760px) { .cookie-bar { flex-direction: column; align-items: stretch; padding: var(--s-4); bottom: var(--s-3); } .cookie-actions .btn { flex: 1; } }
@media (prefers-reduced-motion: reduce) { .cookie-bar { animation: none; } }

/* 404 */
.error-page { display: grid; place-items: center; min-height: calc(100vh - var(--nav-h) - 400px); padding: var(--s-10) 0; }
.error-card { max-width: 56ch; text-align: center; }
.error-code { display: inline-block; font-family: var(--font-display); font-size: calc(72 * var(--u)); font-weight: 700; letter-spacing: -.04em; line-height: 1; background: var(--brand-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.error-card h1 { margin-top: var(--s-4); font-family: var(--font-display); font-size: var(--t-3xl); letter-spacing: -.03em; color: var(--navy); }
.error-card > p { margin-top: var(--s-3); font-size: var(--t-md); line-height: 1.55; color: var(--body); }
.error-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-3); margin-top: var(--s-6); }
.error-links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-2) var(--s-4); margin-top: var(--s-6); font-size: var(--t-sm); color: var(--accent); }
.error-links a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ==========================================================================
   YAZAR PROFİLİ
   ========================================================================== */
.author-hero { display: grid; grid-template-columns: calc(120 * var(--u)) 1fr; column-gap: var(--s-6); align-items: start; margin-top: var(--s-5); }
.author-photo { width: calc(120 * var(--u)); height: calc(120 * var(--u)); border-radius: var(--r-3); object-fit: cover; background: var(--surface-2); }
.author-id h1 { margin-top: 0; font-size: var(--t-title); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.author-title { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); margin-top: var(--s-2); font-size: var(--t-md); color: var(--body); }
.tag--board { display: inline-flex; align-items: center; gap: var(--s-1); }
.tag--board svg { font-size: var(--i-sm); }
.author-bio { margin-top: var(--s-3); max-width: 62ch; font-size: var(--t-md); line-height: 1.55; color: var(--ink); }
.spec-chips { margin-top: var(--s-4); }
.spec-chips ul { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0; padding: 0; }
.spec-chips .chip { background: var(--c-soft); color: var(--c); text-decoration: none; }
.author-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-top: var(--s-4); }
.author-actions .share { position: relative; }
.author-actions .share-status { position: absolute; left: 0; top: calc(100% + 2px); white-space: nowrap; }
.author-hero .meta-list { margin-top: var(--s-4); }
.author-top { display: grid; grid-template-columns: 1.5fr 1fr; column-gap: var(--s-6); margin-top: var(--s-4); min-height: calc(260 * var(--u)); }
.author-top .mini-list { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.author-top .feature-body h3 { font-size: var(--t-2xl); }
.author-top .feature-body h3 a:hover { color: var(--accent); }
.post-list { list-style: none; margin: var(--s-4) 0 0; padding: 0; }
.post-list li + li { border-top: 1px solid var(--line); }
.post-row { display: grid; grid-template-columns: calc(96 * var(--u)) 1fr var(--ctl); align-items: center; column-gap: var(--s-4); padding: var(--s-3) 0; }
.post-row img { width: calc(96 * var(--u)); height: calc(72 * var(--u)); border-radius: var(--r-2); object-fit: cover; background: var(--surface-2); }
.post-row h3 { margin-top: var(--s-1); font-size: var(--t-lg); line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--navy); text-wrap: balance; transition: color var(--dur) ease; }
.post-row:hover h3 { color: var(--accent); }
.post-row .meta { margin-top: var(--s-1); }
.post-row .circle { transition: transform var(--dur) var(--ease), background var(--dur) ease; }
.post-row:hover .circle { background: var(--tint); transform: translateX(2px); }
.bio-list { list-style: none; margin: var(--s-3) 0 0; padding: 0; }
.bio-list li { display: grid; grid-template-columns: var(--i-md) 1fr; column-gap: var(--s-3); padding: var(--s-2) 0; }
.bio-list li + li { border-top: 1px solid var(--line); }
.bio-list svg { font-size: var(--i-md); color: var(--muted); margin-top: 3px; }
.bio-list strong { display: block; font-size: var(--t-xs); font-weight: 600; color: var(--muted); }
.bio-list span { display: block; margin-top: 2px; font-size: var(--t-sm); line-height: 1.45; color: var(--ink); }
.bio-list a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.policy-card { display: flex; gap: var(--s-3); align-items: flex-start; }
.policy-card > svg { font-size: var(--i-lg); color: var(--c-green); margin-top: 2px; }
.policy-card strong, .policy-card h2 { display: block; font-size: var(--t-sm); font-weight: 600; letter-spacing: 0; color: var(--navy); }
.policy-card p { margin-top: var(--s-1); font-size: var(--t-xs); line-height: 1.5; color: var(--body); }
.policy-card a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 1023px) { .author-top { grid-template-columns: 1fr; row-gap: var(--s-4); min-height: 0; } .author-top .feature-card { min-height: calc(320 * var(--u)); } }
@media (max-width: 760px) {
  .author-hero { grid-template-columns: calc(72 * var(--u)) 1fr; column-gap: var(--s-4); row-gap: 0; }
  .author-id { display: contents; }
  .author-photo { width: calc(72 * var(--u)); height: calc(72 * var(--u)); border-radius: var(--r-2); grid-row: 1 / span 3; }
  .author-bio, .spec-chips, .author-actions, .author-hero .meta-list { grid-column: 1 / -1; }
  .author-bio { margin-top: var(--s-4); }
  .author-top .feature-body h3, .author-top .feature-body p { max-width: 62%; }
  .post-row { grid-template-columns: calc(80 * var(--u)) 1fr; }
  .post-row .circle { display: none; }
  .post-row img { width: calc(80 * var(--u)); height: calc(60 * var(--u)); }
}

/* ==========================================================================
   YAZARLAR DİZİNİ
   ========================================================================== */
.authors-page { margin-top: var(--s-6); }
.page-head { margin-top: var(--s-4); max-width: 72ch; }
.page-head h1 { font-family: var(--font-display); font-size: var(--t-title); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.page-head > p { margin-top: var(--s-3); font-size: var(--t-md); line-height: 1.55; color: var(--body); }
.page-head .meta-list { margin-top: var(--s-3); }
.authors-page .chapter-nav { margin-top: var(--s-5); }
.author-group { margin-top: var(--s-8); scroll-margin-top: calc(var(--nav-h) + var(--chapter-nav-h) + var(--s-2)); }
#g-kurul .author-grid { grid-template-columns: repeat(4, 1fr); }
#g-kurul .author-card-sm { grid-template-columns: calc(48 * var(--u)) 1fr var(--ctl); column-gap: var(--s-2); }
#g-kurul .author-card-sm img { width: calc(48 * var(--u)); height: calc(48 * var(--u)); }
.author-group .section-head h2 { font-size: var(--t-xl); }
.group-desc { margin-top: var(--s-1); max-width: 64ch; font-size: var(--t-sm); color: var(--body); }
.author-grid { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-3); margin: var(--s-4) 0 0; padding: 0; }
.author-card-sm { display: grid; grid-template-columns: calc(56 * var(--u)) 1fr var(--ctl); align-items: center; column-gap: var(--s-3); padding: var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); transition: box-shadow var(--dur) ease, transform var(--dur) var(--ease), border-color var(--dur) ease; }
.author-card-sm:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.author-grid > li, .author-card-sm > div { min-width: 0; }
.author-card-sm .tag--board { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.author-card-sm img { width: calc(56 * var(--u)); height: calc(56 * var(--u)); border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.author-card-sm strong { display: block; font-family: var(--font-display); font-size: var(--t-sm); font-weight: 700; letter-spacing: -.01em; color: var(--navy); }
.author-card-sm span { display: block; font-size: var(--t-xs); color: var(--body); }
.author-card-sm .meta { margin-top: 2px; }
.author-card-sm .tag--board { display: inline-flex; width: max-content; max-width: 100%; white-space: nowrap; margin-top: var(--s-1); }
.author-card-sm .circle { transition: transform var(--dur) var(--ease), background var(--dur) ease; }
.author-card-sm:hover .circle { background: var(--tint); transform: translateX(2px); }
.policy-strip { display: grid; grid-template-columns: var(--i-lg) 1fr auto; align-items: center; column-gap: var(--s-4); margin-top: var(--s-10); padding: var(--s-5) var(--s-6); border-radius: var(--r-3); background: color-mix(in srgb, var(--c-green-soft) 60%, var(--paper)); }
.policy-strip > svg { font-size: var(--i-lg); color: var(--c-green); }
.policy-strip h2 { font-family: var(--font-display); font-size: var(--t-xl); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.policy-strip p { margin-top: var(--s-1); max-width: 70ch; font-size: var(--t-sm); line-height: 1.5; color: var(--body); }
@media (max-width: 1023px) { .author-grid, #g-kurul .author-grid { grid-template-columns: repeat(2, 1fr); } .policy-strip { grid-template-columns: var(--i-lg) 1fr; } .policy-strip .btn { grid-column: 2; justify-self: start; margin-top: var(--s-2); } }
@media (max-width: 760px) { .author-grid, #g-kurul .author-grid { grid-template-columns: 1fr; } .author-card-sm { grid-template-columns: calc(56 * var(--u)) 1fr; } .author-card-sm .circle { display: none; } }

/* ==========================================================================
   HAKKIMIZDA + ARAMA SONUÇLARI
   ========================================================================== */
.contact-list { list-style: none; margin: var(--s-5) 0 0; padding: 0; max-width: 68ch; border-top: 1px solid var(--line); }
.contact-list li { display: grid; grid-template-columns: 1.1fr 1fr 1.2fr; gap: var(--s-3); padding: var(--s-3) 0; border-bottom: 1px solid var(--line); font-size: var(--t-sm); }
.contact-list strong { font-weight: 600; color: var(--navy); }
.contact-addr { color: var(--muted); overflow-wrap: anywhere; }
.contact-list li > span:last-child { color: var(--body); }
.contact-note { margin-top: var(--s-3); max-width: 68ch; font-size: var(--t-xs); color: var(--muted); }
.policy-card .link-more, .policy-card .btn { margin-top: var(--s-3); }

.search-page { margin-top: var(--s-6); }
.search-form { margin-top: var(--s-4); max-width: 720px; }
.search-field--page { height: calc(56 * var(--u)); background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow); transition: box-shadow var(--dur) ease, border-color var(--dur) ease; }
.search-field--page:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent), var(--shadow); }
.search-summary { margin-top: var(--s-3); font-size: var(--t-sm); color: var(--body); }
.search-summary strong { color: var(--navy); }
.search-filters { margin-top: var(--s-5); }
.search-list { margin-top: var(--s-4); max-width: 900px; }
.search-list .post-row mark { background: var(--accent-soft); color: var(--accent); border-radius: 3px; padding: 0 2px; }
.search-list .post-row { grid-template-columns: 1fr var(--ctl); }
.search-list .post-row .tag mark { background: transparent; color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.search-none { padding: var(--s-8) 0; max-width: 60ch; }
.search-none-title { font-family: var(--font-display); font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
.search-none > p { margin-top: var(--s-2); font-size: var(--t-md); line-height: 1.5; color: var(--body); }
.search-none .search-hint { margin-top: var(--s-4); }
.search-none .error-links { justify-content: flex-start; margin-top: var(--s-4); }
.search-title { text-wrap: balance; }
@media (max-width: 760px) { .contact-list li { grid-template-columns: 1fr; gap: var(--s-1); } .search-field--page .btn { padding: 0 var(--s-3); } .search-list .post-row { grid-template-columns: 1fr; } .search-field--page { padding-left: var(--s-3); } }

/* ── Rehber (dizin) ─────────────────────────────────────────── */
.dir-page { padding-block: var(--s-4) var(--s-10); }
.dir-head { display: grid; gap: var(--s-6); margin-top: var(--s-4); padding: var(--s-6); border-radius: var(--r-3); background: linear-gradient(135deg, #f6f6fb, #f3f7fb); }
.dir-head h1 { font-family: var(--font-display); font-size: var(--t-3xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.dir-head p { margin-top: var(--s-2); max-width: 62ch; color: var(--body); font-size: var(--t-sm); line-height: 1.6; }
.dir-search { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: var(--s-3); align-items: end; }
.dir-search .btn { height: var(--ctl); }
.dir-page .field label, .dir-filters .field label { display: block; margin-bottom: var(--s-1); font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.dir-page select, .dir-filters select, .appointment select, .appointment input:not([type="checkbox"]), .appointment textarea, .dir-page input[type="search"] {
  width: 100%; min-height: var(--ctl); padding: 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: var(--ink); font: inherit; font-size: var(--t-sm); }
.dir-page select, .appointment select { appearance: none; padding-right: calc(var(--s-3) + 20px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310203c' 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 var(--s-3) center; background-size: 16px; }
.appointment textarea { padding: var(--s-2) var(--s-3); min-height: calc(72 * var(--u)); resize: vertical; }
.dir-page select:focus-visible, .dir-filters select:focus-visible, .appointment :is(input, select, textarea):focus-visible, .dir-page input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.dir-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--s-3); margin-top: var(--s-4); list-style: none; padding: 0; }
.dir-tiles--8 { grid-template-columns: repeat(4, 1fr); }
.dir-tile { display: grid; justify-items: start; gap: var(--s-1); height: 100%; padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-2); background: linear-gradient(135deg, #f6f6fb, #f3f7fb); color: var(--ink); transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease, border-color var(--dur) ease; }
.dir-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--c) 35%, var(--line)); }
.dir-tile svg { font-size: var(--i-xl); color: var(--c); margin-bottom: var(--s-1); }
.dir-tile strong { font-family: var(--font-display); font-size: var(--t-sm); font-weight: 700; letter-spacing: -.01em; color: var(--navy); }
.dir-tile span { font-size: var(--t-xs); color: var(--muted); }
.pro-grid, .center-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); margin-top: var(--s-4); list-style: none; padding: 0; }
.center-list { grid-template-columns: 1fr; }
.center-list--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pro-grid--1 { grid-template-columns: 1fr; }
.pro-card, .center-card { display: grid; grid-template-columns: calc(64 * var(--u)) minmax(0, 1fr) var(--ctl); align-items: center; column-gap: var(--s-3); height: 100%; padding: var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: inherit; transition: box-shadow var(--dur) ease, transform var(--dur) var(--ease), border-color var(--dur) ease; }
.center-card { grid-template-columns: calc(96 * var(--u)) minmax(0, 1fr) var(--ctl); }
.center-list--3 .center-card { grid-template-columns: 1fr; grid-template-rows: auto 1fr auto; row-gap: var(--s-2); }
.center-list--3 .center-card img { width: 100%; aspect-ratio: 16/10; height: auto; }
.center-list--3 .center-card .circle { justify-self: end; }
.pro-card:hover, .center-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: color-mix(in srgb, var(--c, var(--accent)) 30%, var(--line)); }
.pro-card img { width: calc(64 * var(--u)); height: calc(64 * var(--u)); border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.center-card img { width: calc(96 * var(--u)); height: calc(72 * var(--u)); border-radius: var(--r-2); object-fit: cover; background: var(--surface-2); }
.pro-body { min-width: 0; }
.pro-body strong { display: block; font-family: var(--font-display); font-size: var(--t-sm); font-weight: 700; letter-spacing: -.01em; color: var(--navy); }
.pro-body > span { display: block; font-size: var(--t-xs); color: var(--body); }
.pro-body .meta { display: inline-flex; align-items: center; gap: 4px; margin-top: 2px; color: var(--muted); }
.pro-body .meta svg { font-size: var(--i-sm); }
.pro-body .tag { margin-bottom: var(--s-1); }
.pro-badges { display: flex; flex-wrap: wrap; gap: var(--s-1); margin-top: var(--s-2); }
.badge { display: inline-flex; align-items: center; gap: 4px; min-height: calc(22 * var(--u)); padding: 0 var(--s-2); border-radius: var(--r-pill); background: var(--tint); color: var(--body); font-size: calc(var(--t-xs) * .92); font-weight: 500; white-space: nowrap; }
.badge svg { font-size: calc(var(--i-sm) * .9); }
.badge--verified { background: var(--c-green-soft); color: var(--c-green); }
.badge--online { background: var(--c-blue-soft); color: var(--c-blue); }
.pro-card .circle, .center-card .circle { transition: transform var(--dur) var(--ease), background var(--dur) ease; }
.pro-card:hover .circle, .center-card:hover .circle { background: var(--tint); transform: translateX(2px); }
.pro-grid--compact .pro-card { padding: var(--s-2); grid-template-columns: calc(44 * var(--u)) minmax(0, 1fr) var(--ctl); }
.pro-grid--compact .pro-card img { width: calc(44 * var(--u)); height: calc(44 * var(--u)); }
.pro-grid--compact .pro-badges { display: none; }
.center-list--compact .center-card { padding: var(--s-2); grid-template-columns: calc(64 * var(--u)) minmax(0, 1fr) var(--ctl); }
.center-list--compact .center-card img { width: calc(64 * var(--u)); height: calc(48 * var(--u)); }
.center-list--compact .pro-badges, .center-list--compact .tag { display: none; }
.chip-n { margin-left: 4px; color: var(--muted); font-weight: 400; }
.tup-block { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--s-6); padding: var(--s-6); border-radius: var(--r-3); background: linear-gradient(135deg, var(--c-pink-soft), #f6f6fb 70%); }
.tup-intro h2 { margin-top: var(--s-3); font-family: var(--font-display); font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.tup-intro p { margin-top: var(--s-3); font-size: var(--t-sm); line-height: 1.6; color: var(--body); }
.tup-links { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-4); }
.tup-lists h3 { font-size: var(--t-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: var(--s-4); }
.tup-lists h3:first-child { margin-top: 0; }
.tup-lists .pro-grid, .tup-lists .center-list { margin-top: var(--s-2); }
.dir-cta { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-top: var(--s-6); padding: var(--s-5) var(--s-6); border-radius: var(--r-3); background: var(--navy); color: var(--paper); }
.dir-cta h2 { font-family: var(--font-display); font-size: var(--t-xl); font-weight: 700; letter-spacing: -.02em; }
.dir-cta p { margin-top: var(--s-1); font-size: var(--t-sm); opacity: .85; }
.dir-cta .btn-primary { background: var(--paper); color: var(--navy); }
.dir-cta--side { display: block; margin-top: 0; padding: var(--s-4); background: var(--accent-soft); color: var(--ink); }
.dir-cta--side h2 { font-size: var(--t-md); color: var(--navy); }
.dir-cta--side p { color: var(--body); opacity: 1; margin-bottom: var(--s-3); }
.dir-filters { display: flex; flex-wrap: wrap; align-items: end; gap: var(--s-3); margin-top: var(--s-5); padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface); }
.dir-filters .field { flex: 1 1 160px; }
.dir-filters .btn { height: var(--ctl); }
.check-inline { display: inline-flex; align-items: center; gap: var(--s-2); min-height: var(--ctl); font-size: var(--t-sm); color: var(--ink); cursor: pointer; }
.check-inline input { width: 18px; height: 18px; accent-color: var(--accent); }
.check-inline span { display: inline-flex; align-items: center; gap: 4px; }
.check-inline svg { font-size: var(--i-sm); color: var(--c-blue); }
.dir-layout { margin-top: var(--s-5); }
.dir-count { margin-top: var(--s-2); }
.side-cities ul { list-style: none; padding: 0; margin-top: var(--s-2); }
.side-cities li + li { border-top: 1px solid var(--line); }
.side-cities a { display: flex; justify-content: space-between; align-items: center; min-height: calc(36 * var(--u)); padding: 0 var(--s-2); border-radius: var(--r-2); color: var(--ink); font-size: var(--t-sm); }
.side-cities a:hover, .side-cities a[aria-current="true"] { background: var(--tint); color: var(--navy); font-weight: 600; }
.side-cities .n { font-size: var(--t-xs); color: var(--muted); font-weight: 400; }
/* profil */
.profile-head { display: grid; grid-template-columns: calc(150 * var(--u)) minmax(0, 1fr); gap: var(--s-5); align-items: start; margin-top: var(--s-4); }
.profile-head--center { grid-template-columns: 1fr; }
.profile-photo { width: calc(150 * var(--u)); aspect-ratio: 1; border-radius: var(--r-3); object-fit: cover; background: var(--surface-2); }
.profile-head h1 { margin-top: var(--s-2); font-family: var(--font-display); font-size: var(--t-3xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.profile-title { display: flex; align-items: center; gap: 6px; margin-top: var(--s-1); font-size: var(--t-md); color: var(--body); }
.profile-title svg { font-size: var(--i-sm); color: var(--muted); flex: none; }
.profile-head .pro-badges { margin-top: var(--s-3); }
.profile-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-top: var(--s-4); }
.profile-actions .share { margin-left: auto; }
.profile-body section + section { margin-top: var(--s-6); }
.profile-body h2 { margin-bottom: var(--s-3); }
.services-list { list-style: none; padding: 0; display: grid; gap: var(--s-2); }
.services-list--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.services-list li { display: flex; align-items: center; gap: var(--s-2); min-height: calc(40 * var(--u)); padding: 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface); font-size: var(--t-sm); color: var(--ink); }
.services-list svg { font-size: var(--i-sm); color: var(--c-green); flex: none; }
.services-list em { margin-left: auto; font-style: normal; font-size: var(--t-xs); color: var(--muted); white-space: nowrap; }
.services-list em + em { margin-left: var(--s-3); }
.price-note { margin-top: var(--s-3); font-size: var(--t-xs); color: var(--muted); }
.amenities { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-3); }
.amenities li { display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-xs); color: var(--body); }
.amenities svg { font-size: var(--i-sm); color: var(--c-green); }
.center-cover { margin-top: var(--s-4); border-radius: var(--r-3); overflow: hidden; aspect-ratio: 16/7; background: var(--surface-2); }
.center-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.location-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--s-5); align-items: start; }
.info-list { display: grid; gap: var(--s-3); }
.info-list > div { display: grid; grid-template-columns: var(--i-md) 1fr; gap: var(--s-2); font-size: var(--t-sm); color: var(--ink); }
.info-list dt svg { font-size: var(--i-md); color: var(--muted); }
.info-list dd a { color: var(--accent); font-weight: 500; }
.hours-row { display: flex; justify-content: space-between; gap: var(--s-3); font-size: var(--t-xs); color: var(--body); }
.hours-table { width: 100%; border-collapse: collapse; font-size: var(--t-sm); }
.hours-table th, .hours-table td { padding: var(--s-2) 0; border-bottom: 1px solid var(--line); text-align: left; }
.hours-table th { font-weight: 500; color: var(--ink); }
.hours-table td { text-align: right; color: var(--body); }
.contact-card h2, .appointment h2, .side-cities h2 { font-family: var(--font-display); font-size: var(--t-md); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.appointment { border: 1px solid var(--line); border-radius: var(--r-2); padding: var(--s-4); background: var(--surface); }
.appointment > p { margin-top: var(--s-1); font-size: var(--t-xs); color: var(--muted); }
.appointment form { display: grid; gap: var(--s-3); margin-top: var(--s-3); }
.appointment .field-row--2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); }
.appointment .field label { display: block; margin-bottom: 4px; font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.appointment .btn { width: 100%; justify-content: center; }
.nav-accent { color: var(--accent) !important; font-weight: 600; }
@media (max-width: 1100px) { .dir-tiles { grid-template-columns: repeat(3, 1fr); } .dir-tiles--8 { grid-template-columns: repeat(4, 1fr); } .dir-search { grid-template-columns: 1fr 1fr; } .tup-block { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .pro-grid, .center-list--3 { grid-template-columns: 1fr; } .dir-layout { grid-template-columns: 1fr; } .location-grid { grid-template-columns: 1fr; } .services-list--grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .dir-tiles, .dir-tiles--8 { grid-template-columns: repeat(2, 1fr); } .dir-search { grid-template-columns: 1fr; } .profile-head { grid-template-columns: 1fr; } .profile-photo { width: calc(120 * var(--u)); } .dir-cta { flex-direction: column; align-items: flex-start; } .center-card { grid-template-columns: calc(72 * var(--u)) minmax(0, 1fr) var(--ctl); } .center-card img { width: calc(72 * var(--u)); height: calc(54 * var(--u)); } .appointment .field-row--2 { grid-template-columns: 1fr; } }

/* ── Takvimli randevu ─────────────────────────────────────────── */
.booking { border: 1px solid var(--line); border-radius: var(--r-2); padding: var(--s-4); background: var(--surface); }
.booking h2 { font-family: var(--font-display); font-size: var(--t-md); font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.booking > p { margin-top: var(--s-1); font-size: var(--t-xs); color: var(--muted); }
.week-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); margin-top: var(--s-3); }
.week-nav strong { font-size: var(--t-sm); font-weight: 600; color: var(--ink); }
.week-nav [aria-disabled="true"] { opacity: .35; pointer-events: none; }
.day-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: var(--s-2); list-style: none; padding: 0; }
.day { display: grid; justify-items: center; gap: 1px; padding: var(--s-2) 2px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: var(--ink); text-align: center; transition: background var(--dur) ease, border-color var(--dur) ease; }
.day span { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.day strong { font-family: var(--font-display); font-size: var(--t-sm); font-weight: 700; color: var(--navy); }
.day em { font-style: normal; font-size: 10px; color: var(--c-green); white-space: nowrap; }
.day[data-empty="true"] { background: var(--surface-2); }
.day[data-empty="true"] em { color: var(--faint); }
.day:hover { border-color: var(--accent); }
.day[aria-current="date"] { background: var(--navy); border-color: var(--navy); }
.day[aria-current="date"] span, .day[aria-current="date"] strong, .day[aria-current="date"] em { color: var(--paper); }
.booking form { display: grid; gap: var(--s-3); margin-top: var(--s-3); }
.booking fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.booking legend { font-size: var(--t-xs); font-weight: 600; color: var(--ink); margin-bottom: var(--s-2); padding: 0; }
.slot-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.slot { position: relative; display: block; }
.slot input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.slot span { display: flex; align-items: center; justify-content: center; min-height: calc(36 * var(--u)); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); font-size: var(--t-sm); font-variant-numeric: tabular-nums; color: var(--ink); transition: background var(--dur) ease, border-color var(--dur) ease, color var(--dur) ease; }
.slot:hover span { border-color: var(--accent); }
.slot input:checked + span { background: var(--navy); border-color: var(--navy); color: var(--paper); font-weight: 600; }
.slot input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 1px; }
.slot[data-taken="true"] span { background: var(--surface-2); color: var(--faint); text-decoration: line-through; border-style: dashed; }
.slot[data-taken="true"] input { cursor: not-allowed; }
.slot-legend { margin-top: var(--s-2); }
.mode-pick { display: grid; gap: var(--s-1); }
.mode-pick .check-inline { min-height: auto; }
.mode-pick input:disabled + span { opacity: .45; }
.booking .field label { display: block; margin-bottom: 4px; font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.booking input:not([type="checkbox"]):not([type="radio"]), .booking textarea { width: 100%; min-height: var(--ctl); padding: 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: var(--ink); font: inherit; font-size: var(--t-sm); }
.booking textarea { padding: var(--s-2) var(--s-3); min-height: calc(60 * var(--u)); resize: vertical; }
.booking :is(input, textarea):focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.booking .btn { width: 100%; justify-content: center; }
.booking .btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.appt-page { padding-block: var(--s-8) var(--s-10); }
.appt-card { max-width: calc(560 * var(--u)); margin-inline: auto; padding: var(--s-6); border: 1px solid var(--line); border-radius: var(--r-3); background: var(--paper); box-shadow: var(--shadow-sm); }
.appt-head { margin-top: var(--s-3); }
.appt-head h1 { margin-top: var(--s-2); font-family: var(--font-display); font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; color: var(--navy); text-wrap: balance; }
.appt-card[data-status="cancelled"] .appt-head h1 { text-decoration: line-through; color: var(--muted); }
.appt-body { display: grid; gap: var(--s-4); margin-top: var(--s-4); }
.appt-provider { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3); border-radius: var(--r-2); background: var(--surface); }
.appt-provider img { width: calc(48 * var(--u)); height: calc(48 * var(--u)); border-radius: 50%; object-fit: cover; }
.appt-provider strong { display: block; font-family: var(--font-display); font-size: var(--t-sm); color: var(--navy); }
.appt-provider span { font-size: var(--t-xs); color: var(--body); }
.appt-actions { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.appt-actions form { display: contents; }
.btn-danger { color: var(--c-pink); }
@media (max-width: 640px) { .slot-grid { grid-template-columns: repeat(3, 1fr); } .appt-card { padding: var(--s-4); } }

/* ── Rehber başvurusu / harita ─────────────────────────────── */
.apply-page { padding-block: var(--s-4) var(--s-10); }
.apply-layout { display: grid; grid-template-columns: minmax(0, 1fr) max(calc(257 * var(--u)), 332px); gap: var(--s-8); margin-top: var(--s-4); align-items: start; }
.apply-form form { display: grid; gap: var(--s-4); margin-top: var(--s-5); max-width: 62ch; }
.apply-form .field-row--2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.apply-form .field label { display: block; margin-bottom: 4px; font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.apply-form input:not([type="checkbox"]):not([type="radio"]), .apply-form select, .apply-form textarea { width: 100%; min-height: var(--ctl); padding: 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: var(--ink); font: inherit; font-size: var(--t-sm); }
.apply-form textarea { padding: var(--s-2) var(--s-3); resize: vertical; }
.apply-form :is(input, select, textarea):focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.apply-form fieldset { border: 0; padding: 0; margin: 0; }
.apply-form legend { font-size: var(--t-xs); font-weight: 600; color: var(--ink); margin-bottom: var(--s-2); padding: 0; }
.kind-pick { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.kind { position: relative; display: block; }
.kind input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.kind span { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: var(--s-3); padding: var(--s-3) var(--s-4); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); transition: border-color var(--dur) ease, background var(--dur) ease; }
.kind span svg { grid-row: 1 / 3; font-size: var(--i-lg); color: var(--accent); align-self: center; }
.kind strong { font-family: var(--font-display); font-size: var(--t-sm); color: var(--navy); }
.kind em { font-style: normal; font-size: var(--t-xs); color: var(--muted); }
.kind input:checked + span { border-color: var(--navy); background: var(--accent-soft); }
.kind input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 1px; }
.steps { padding-left: 1.2em; margin-top: var(--s-2); display: grid; gap: var(--s-2); font-size: var(--t-sm); color: var(--body); }
.steps strong { color: var(--ink); }
.center-map { margin: var(--s-4) 0 0; border-radius: var(--r-2); overflow: hidden; border: 1px solid var(--line); background: var(--surface-2); }
.center-map iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.center-map figcaption { padding: var(--s-2) var(--s-3); font-size: var(--t-xs); color: var(--muted); }
.location-grid .center-map { grid-column: 1 / -1; }
@media (max-width: 900px) { .apply-layout { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .apply-form .field-row--2, .kind-pick { grid-template-columns: 1fr; } }

/* ── Randevu: geniş düzen (ana sütun) ─────────────────────────── */
.profile-photo { height: calc(150 * var(--u)); } /* height="480" özniteliğini ezer; kare kalır */
.booking--wide { margin-top: var(--s-6); padding: var(--s-5) var(--s-6); background: var(--paper); scroll-margin-top: var(--s-6); }
.booking-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-4); flex-wrap: wrap; }
.booking-head .kicker { display: block; font-size: var(--t-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.booking--wide h2 { margin-top: var(--s-1); font-size: var(--t-2xl); }
.booking--wide > .booking-head p { margin-top: var(--s-2); max-width: 56ch; font-size: var(--t-sm); color: var(--body); }
.booking-steps { display: flex; gap: var(--s-2); list-style: none; padding: 0; margin: 0; }
.booking-steps li { display: inline-flex; align-items: center; gap: var(--s-2); min-height: calc(32 * var(--u)); padding: 0 var(--s-3) 0 var(--s-1); border-radius: var(--r-pill); background: var(--tint); font-size: var(--t-xs); font-weight: 500; color: var(--muted); }
.booking-steps li span { display: inline-grid; place-items: center; width: calc(24 * var(--u)); height: calc(24 * var(--u)); border-radius: 50%; background: var(--paper); font-weight: 700; color: var(--muted); }
.booking-steps li[aria-current="step"] { background: var(--navy); color: var(--paper); }
.booking-steps li[aria-current="step"] span { background: var(--paper); color: var(--navy); }
.booking--wide form { display: block; margin-top: var(--s-5); }
.booking-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(calc(260 * var(--u)), .9fr); gap: var(--s-6); align-items: start; }
.booking-cal { display: grid; gap: var(--s-4); }
.booking--wide .week-nav { margin-top: 0; }
.booking--wide .week-nav strong { font-family: var(--font-display); font-size: var(--t-md); }
.booking--wide .day-strip { gap: var(--s-2); margin-top: 0; }
.booking--wide .day { padding: var(--s-2) var(--s-1) var(--s-2); gap: 2px; min-height: calc(64 * var(--u)); }
.booking--wide .day span { font-size: var(--t-xs); }
.booking--wide .day strong { font-size: var(--t-lg); line-height: 1.1; }
.booking--wide .day em { font-size: var(--t-xs); }
.booking--wide .slots legend { display: flex; align-items: baseline; gap: var(--s-2); font-size: var(--t-sm); margin-bottom: var(--s-3); }
.slot-group + .slot-group { margin-top: var(--s-3); }
.slot-group h3 { font-size: var(--t-xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: var(--s-2); }
.booking--wide .slot-grid { grid-template-columns: repeat(6, 1fr); gap: var(--s-2); }
.booking--wide .slot span { min-height: calc(40 * var(--u)); font-size: var(--t-sm); }
.slots-empty { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-4); border: 1px dashed var(--line); border-radius: var(--r-2); background: var(--surface); font-size: var(--t-sm); color: var(--body); }
.slots-empty svg { font-size: var(--i-md); color: var(--muted); }
.booking--wide .mode-pick { display: flex; flex-wrap: wrap; gap: var(--s-4); }
.booking--wide .mode-pick legend { margin-bottom: var(--s-2); width: 100%; }
.mode-fixed { display: inline-flex; align-items: center; gap: 6px; }
.mode-fixed svg { font-size: var(--i-sm); }
.booking-form { display: grid; gap: var(--s-3); padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface); position: sticky; top: var(--s-4); }
.booking-summary { display: grid; grid-template-columns: var(--i-lg) 1fr; gap: var(--s-2); align-items: center; padding: var(--s-3); border-radius: var(--r-2); background: var(--paper); border: 1px solid var(--line); }
.booking-summary svg { font-size: var(--i-lg); color: var(--accent); }
.booking-summary strong { display: block; font-family: var(--font-display); font-size: var(--t-sm); color: var(--navy); }
.booking-summary span { display: block; font-size: var(--t-xs); color: var(--muted); }
.booking-privacy { display: flex; align-items: center; gap: 6px; justify-content: center; }
.booking-privacy svg { font-size: var(--i-sm); color: var(--c-green); }
.side-book { border: 1px solid var(--line); border-radius: var(--r-2); padding: var(--s-4); background: var(--surface); }
.side-book h2 { font-family: var(--font-display); font-size: var(--t-md); font-weight: 700; color: var(--navy); }
.side-book p { margin-top: var(--s-2); font-size: var(--t-xs); color: var(--body); }
.side-book p .meta { display: block; }
.side-book p strong { display: block; font-family: var(--font-display); font-size: var(--t-sm); color: var(--navy); margin-top: 2px; }
.side-book .btn { width: 100%; justify-content: center; margin-top: var(--s-3); }
@media (max-width: 1100px) { .booking-grid { grid-template-columns: 1fr; } .booking-form { position: static; } }
@media (max-width: 640px) { .booking--wide { padding: var(--s-4); } .booking--wide .slot-grid { grid-template-columns: repeat(4, 1fr); } .booking--wide .day { min-height: calc(56 * var(--u)); } .booking--wide .day em { display: none; } .booking-head { flex-direction: column; } }

/* ── Kategori ↔ rehber köprüsü ─────────────────────────────── */
.cat-directory { padding: var(--s-5); border-radius: var(--r-3); background: linear-gradient(135deg, #f6f6fb, #f3f7fb); }
.cat-directory .group-desc { margin-top: var(--s-2); max-width: 70ch; font-size: var(--t-sm); color: var(--body); }
.cat-directory .pro-grid + .center-list { margin-top: var(--s-3); }
.kadro-note { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-bottom: var(--s-3); }
.kadro-note svg { font-size: var(--i-sm); color: var(--accent); }
.kadro-note a { color: var(--accent); font-weight: 500; }
.side-related h2 { font-family: var(--font-display); font-size: var(--t-md); font-weight: 700; color: var(--navy); margin-bottom: var(--s-2); }

/* ── Rehber: tek sektör düzeni ──────────────────────────────── */
.dir-tiles--3 { grid-template-columns: repeat(3, 1fr); }
.dir-tile--wide span { line-height: 1.45; }
@media (max-width: 900px) { .dir-tiles--3 { grid-template-columns: 1fr; } }

/* ── Ana sayfa: rehber şeridi ve seçkiler ─────────────────── */
.home-dir { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--s-6); align-items: center; padding: var(--s-6); border-radius: var(--r-3); background: var(--navy); color: var(--paper); }
.home-dir .kicker { display: block; font-size: var(--t-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: color-mix(in srgb, var(--paper) 65%, transparent); }
.home-dir h2 { margin-top: var(--s-2); font-family: var(--font-display); font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; text-wrap: balance; }
.home-dir-text p { margin-top: var(--s-2); font-size: var(--t-sm); line-height: 1.6; color: color-mix(in srgb, var(--paper) 80%, transparent); max-width: 44ch; }
.home-dir-stats { display: flex; gap: var(--s-5); margin-top: var(--s-4); list-style: none; padding: 0; }
.home-dir-stats strong { display: block; font-family: var(--font-display); font-size: var(--t-xl); font-weight: 700; }
.home-dir-stats span { font-size: var(--t-xs); color: color-mix(in srgb, var(--paper) 70%, transparent); }
.home-dir-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--s-3); align-items: end; padding: var(--s-4); border-radius: var(--r-2); background: var(--paper); color: var(--ink); }
.home-dir-form .field label { display: block; margin-bottom: 4px; font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.home-dir-form select { width: 100%; min-height: var(--ctl); padding: 0 calc(var(--s-3) + 20px) 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--r-2); background: var(--paper); color: var(--ink); font: inherit; font-size: var(--t-sm); appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310203c' 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 var(--s-3) center; background-size: 16px; }
.home-dir-form select:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.home-dir-form .btn { height: var(--ctl); }
.home-dir-quick { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); font-size: var(--t-xs); color: var(--muted); }
.home-dir-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: var(--s-4); align-items: start; }
.home-dir-grid .pro-grid, .home-dir-grid .center-list { margin-top: var(--s-4); }
.home-dir-note { display: flex; align-items: center; gap: 6px; margin-top: var(--s-3); }
.home-dir-note svg { font-size: var(--i-sm); color: var(--c-green); }
@media (max-width: 1100px) { .home-dir { grid-template-columns: 1fr; } .home-dir-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .home-dir { padding: var(--s-4); } .home-dir-form { grid-template-columns: 1fr; } .home-dir-stats { gap: var(--s-4); } }

/* ── Denetim düzeltmeleri (WCAG 2.2 hedef boyutu, kontrast, tutarlılık) ── */
.crumbs a, .link-more, .error-links a, .center-map figcaption a, .kadro-note a, .meta-list a, .toc-time a { display: inline-flex; align-items: center; min-height: 24px; }
.crumbs { row-gap: 0; }
.article-meta .author strong a, .appt-provider strong a, .expert-row strong a, .review-box a, .comment-head a { display: inline-block; padding-block: 3px; }
.center-map figcaption { color: var(--body); }
.chip .count, .chip-n { font-size: calc(11 * var(--u)); }
.consent input, .check-inline input, .mode-pick input { width: 20px; height: 20px; flex: none; }
.crumbs svg { color: var(--muted); }

/* ── Mobil dokunma hedefleri (≥44px; Apple HIG / MD) ────────── */
@media (max-width: 767px) {
  .btn { min-height: 44px; }
  .btn-sm { min-height: 40px; }
  .circle { width: 44px; height: 44px; }
  .chip { min-height: 44px; }
  .crumbs a { min-height: 32px; }
  .day-strip { gap: 4px; }
  .booking--wide .day { min-width: 44px; padding-inline: 2px; }
  .booking--wide .slot span { min-height: 44px; }
  .dir-search select, .dir-search input, .dir-filters select, .dir-filters input, .home-dir-form select,
  .apply-form select, .apply-form input:not([type="checkbox"]):not([type="radio"]),
  .booking input:not([type="checkbox"]):not([type="radio"]), .appointment select, .appointment input:not([type="checkbox"]),
  .search-field--page input, .newsletter-form input, .side-newsletter input, .comment-form input, .comment-form textarea { min-height: 44px; }
  .dir-filters .btn, .dir-search .btn, .home-dir-form .btn { height: auto; min-height: 44px; }
  .cookie-actions .btn { min-height: 40px; }
  .footer-cols a, .footer-links a, .footer-bottom a, .site-footer nav a, footer ul a { display: inline-block; padding-block: 6px; }
  .side-cities a { min-height: 44px; }
  .hours-table th, .hours-table td { padding-block: var(--s-3); }
}
@media (max-width: 767px) {
  .header-actions .btn { min-width: 44px; justify-content: center; }
  .link-more { min-height: 40px; }
  .footer-col a, .footer-links a { padding-block: 8px; }
}
