/*
 * YBT Laboratuvar teması
 * Yaşam Bilimleri ve Teknolojileri Laboratuvarı — İstanbul Yeni Yüzyıl Üniversitesi
 */

/* Yazı tipi
   ----------------------------------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/InterVariable.woff2") format("woff2");
}

@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/InterVariable-Italic.woff2") format("woff2");
}

/* Değişkenler
   ----------------------------------------- */
:root {
  --mavi: #0066cc;
  --mavi-vurgu: #0071e3;
  --mavi-koyu-zemin: #2997ff;

  --murekkep: #1d1d1f;
  --metin: #333336;
  --metin-ikincil: #58585d;
  --metin-soluk: #6e6e73;
  --metin-koyu-zemin: #a1a1a6;
  --metin-soluk-koyu: #86868b;

  --beyaz: #ffffff;
  --gri-zemin: #f5f5f7;
  --cizgi: #e0e0e0;
  --cizgi-acik: #f0f0f0;
  --cizgi-orta: #e8e8ed;
  --koyu-zemin: #272729;
  --siyah: #000000;

  --yaricap-kucuk: 8px;
  --yaricap-orta: 11px;
  --yaricap: 18px;
  --yaricap-buyuk: 28px;
  --yaricap-hap: 999px;

  --golge-foto: 3px 5px 30px rgba(0, 0, 0, 0.22);

  --yazi-baslik: "SF Pro Display", system-ui, -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
  --yazi-govde: "SF Pro Text", system-ui, -apple-system, BlinkMacSystemFont, "Inter", sans-serif;

  --genislik: 1200px;
  --dar-genislik: 760px;
  --baslik-yuksekligi: 72px;
  --yonetim-cubugu: 0px;
  --gecis: cubic-bezier(0.28, 0.11, 0.32, 1);
}

/* Temel
   ----------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

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

body {
  margin: 0;
  background: var(--beyaz);
  color: var(--murekkep);
  font-family: var(--yazi-govde);
  font-size: 17px;
  line-height: 1.47;
  letter-spacing: -0.022em;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss03";
}

body.admin-bar {
  --yonetim-cubugu: 32px;
}

body.menu-acik {
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: var(--mavi);
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: var(--yazi-baslik);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.015em;
}

p {
  margin: 0 0 1em;
}

[hidden] {
  display: none !important;
}

:focus-visible {
  outline: 2px solid var(--mavi-vurgu);
  outline-offset: 2px;
  border-radius: 4px;
}

button,
input,
select,
textarea {
  font: inherit;
  letter-spacing: inherit;
}

.kapsayici {
  max-width: var(--genislik);
  margin: 0 auto;
  padding: 0 24px;
}

.kapsayici--dar {
  max-width: calc(var(--dar-genislik) + 48px);
}

.gizli-metin,
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  top: 8px;
  left: 8px;
  z-index: 100;
  width: auto;
  height: auto;
  padding: 8px 15px;
  margin: 0;
  clip: auto;
  clip-path: none;
  border-radius: var(--yaricap-kucuk);
  background: var(--beyaz);
  color: var(--murekkep);
}

.icerige-gec {
  position: absolute;
  top: -60px;
  left: 16px;
  z-index: 100;
  padding: 8px 15px;
  border-radius: var(--yaricap-kucuk);
  background: var(--beyaz);
  color: var(--murekkep);
}

.icerige-gec:focus {
  top: calc(var(--yonetim-cubugu) + 8px);
}

.ikon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ust-baslik {
  display: inline-block;
  font-family: var(--yazi-baslik);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--metin-soluk);
}

/* Düğmeler
   ----------------------------------------- */
.dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 11px 22px;
  border: 1px solid transparent;
  border-radius: var(--yaricap-hap);
  font: 400 17px/1.17 var(--yazi-govde);
  letter-spacing: -0.022em;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 0.15s var(--gecis), background-color 0.2s, color 0.2s, border-color 0.2s;
}

.dugme:active {
  transform: scale(0.95);
}

.dugme .ikon {
  width: 16px;
  height: 16px;
}

.dugme--birincil {
  background: var(--mavi);
  color: var(--beyaz);
}

.dugme--birincil:hover {
  background: var(--mavi-vurgu);
}

.dugme--ikincil {
  border-color: var(--mavi);
  background: transparent;
  color: var(--mavi);
}

.dugme--ikincil:hover {
  background: var(--mavi);
  color: var(--beyaz);
}

.dugme--kucuk {
  min-height: 36px;
  padding: 7px 16px;
  font-size: 14px;
  letter-spacing: -0.016em;
}

.ok-baglanti {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--mavi);
}

.ok-baglanti .ikon {
  width: 15px;
  height: 15px;
  transition: transform 0.2s var(--gecis);
}

.ok-baglanti:hover {
  text-decoration: underline;
}

.ok-baglanti:hover .ikon {
  transform: translateX(3px);
}

/* Üst şerit ve başlık
   ----------------------------------------- */
.ust-serit {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(245, 245, 247, 0.8);
  font-size: 12px;
  letter-spacing: -0.01em;
  color: var(--metin);
}

.ust-serit .kapsayici {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 36px;
}

.ust-serit a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--metin);
}

.ust-serit a:hover {
  color: var(--murekkep);
}

.ust-serit .ikon {
  width: 13px;
  height: 13px;
  color: var(--metin-soluk);
}

.ust-serit__iletisim {
  display: flex;
  gap: 22px;
}

.site-basligi {
  position: sticky;
  top: var(--yonetim-cubugu);
  z-index: 60;
  border-bottom: 1px solid var(--cizgi-orta);
  background: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

body.menu-acik .site-basligi,
body.arama-acik .site-basligi {
  background: var(--beyaz);
}

.gezinme {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: var(--baslik-yuksekligi);
}

.marka {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  color: var(--murekkep);
}

.marka__logo {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: contain;
}

.marka__metin {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding-left: 14px;
  border-left: 1px solid var(--cizgi);
  line-height: 1.2;
}

.marka__kurum {
  font-size: 11px;
  color: var(--metin-soluk);
}

.marka__ad {
  font-family: var(--yazi-baslik);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.gezinme__sag {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.ana-menu {
  display: flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ana-menu a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 13px;
  border-radius: var(--yaricap-hap);
  font-size: 14px;
  letter-spacing: -0.016em;
  color: var(--metin);
  transition: background-color 0.2s, color 0.2s;
}

.ana-menu a:hover {
  background: var(--gri-zemin);
  color: var(--murekkep);
}

.ana-menu > li > a[aria-current="page"],
.ana-menu > li.aktif > a {
  font-weight: 600;
  color: var(--murekkep);
}

.ana-menu .ikon {
  width: 13px;
  height: 13px;
  margin-left: 3px;
}

.acilir {
  position: relative;
}

.alt-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 5;
  min-width: 300px;
  margin: 0;
  padding: 8px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: var(--yaricap);
  background: rgba(255, 255, 255, 0.97);
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.2s var(--gecis), transform 0.2s var(--gecis), visibility 0.2s;
}

.acilir:hover > .alt-menu,
.acilir:focus-within > .alt-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.alt-menu a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: auto;
  padding: 10px 14px;
  border-radius: var(--yaricap-orta);
  font-weight: 600;
  color: var(--murekkep);
}

.alt-menu small {
  font-size: 12px;
  font-weight: 400;
  color: var(--metin-soluk);
}

.dil-secimi {
  display: inline-flex;
  padding: 3px;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin);
}

.dil-secimi a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  min-height: 30px;
  padding: 0 8px;
  border-radius: var(--yaricap-hap);
  font-size: 12px;
  font-weight: 600;
  color: var(--metin-ikincil);
}

.dil-secimi a:hover {
  color: var(--murekkep);
}

.dil-secimi a.secili {
  background: var(--beyaz);
  color: var(--murekkep);
}

.dil-secimi a.ceviri-yok {
  opacity: 0.6;
}

.simge-dugmesi {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--murekkep);
  cursor: pointer;
  transition: background-color 0.2s;
}

.simge-dugmesi:hover {
  background: var(--gri-zemin);
}

.simge-dugmesi .ikon {
  width: 18px;
  height: 18px;
}

/* Hamburger: iki çizgi, açılınca çarpıya döner */
.menu-dugmesi {
  display: none;
  position: relative;
  width: 44px;
  height: 44px;
  margin-right: -10px;
  border: 0;
  background: transparent;
  color: var(--murekkep);
  cursor: pointer;
}

.menu-dugmesi span {
  position: absolute;
  left: 13px;
  width: 18px;
  height: 1.5px;
  border-radius: 2px;
  background: currentColor;
  transition: transform 0.3s var(--gecis), top 0.3s var(--gecis);
}

.menu-dugmesi span:first-child {
  top: 18px;
}

.menu-dugmesi span:last-child {
  top: 25px;
}

.menu-dugmesi[aria-expanded="true"] span:first-child {
  top: 21.5px;
  transform: rotate(45deg);
}

.menu-dugmesi[aria-expanded="true"] span:last-child {
  top: 21.5px;
  transform: rotate(-45deg);
}

/* Mobil menü paneli: başlığın dışında durur, böylece backdrop-filter konumunu bozmaz */
.mobil-menu,
.arama-paneli {
  position: fixed;
  top: var(--panel-ust, calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu)));
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 55;
  overflow-y: auto;
  background: var(--beyaz);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s var(--gecis), visibility 0.25s;
}

.mobil-menu {
  padding: 16px 0 40px;
}

.mobil-menu.acik,
.arama-paneli.acik {
  opacity: 1;
  visibility: visible;
}

.mobil-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mobil-menu__link {
  display: block;
  padding: 8px 0;
  font-family: var(--yazi-baslik);
  font-size: 28px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--murekkep);
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 0.3s var(--gecis), transform 0.3s var(--gecis);
}

.mobil-menu.acik .mobil-menu__link {
  opacity: 1;
  transform: none;
}

.mobil-menu.acik li:nth-child(2) > .mobil-menu__link {
  transition-delay: 0.03s;
}

.mobil-menu.acik li:nth-child(3) > .mobil-menu__link {
  transition-delay: 0.06s;
}

.mobil-menu.acik li:nth-child(4) > .mobil-menu__link {
  transition-delay: 0.09s;
}

.mobil-menu.acik li:nth-child(n + 5) > .mobil-menu__link {
  transition-delay: 0.12s;
}

.mobil-menu__link[aria-current="page"] {
  color: var(--mavi);
}

.mobil-menu .mobil-menu__alt {
  margin-bottom: 8px;
}

.mobil-menu__alt a {
  display: block;
  padding: 6px 0 6px 2px;
  font-size: 15px;
  color: var(--metin-ikincil);
}

.mobil-menu__alt a:hover,
.mobil-menu__alt a[aria-current="page"] {
  color: var(--murekkep);
}

.mobil-menu__alt-bilgi {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid var(--cizgi);
  font-size: 14px;
}

.mobil-menu__alt-bilgi .dil-secimi {
  align-self: flex-start;
  margin-top: 16px;
}

/* Arama paneli */
.arama-paneli {
  padding: 48px 0;
}

.arama-paneli__ic {
  max-width: 680px;
  margin: 0 auto;
}

.arama-paneli__baslik {
  margin-bottom: 20px;
  font-size: 28px;
}

.arama-paneli .arama {
  width: 100%;
}

.arama-paneli .arama input {
  height: 56px;
  font-size: 21px;
  padding-left: 52px;
}

.arama-paneli .arama .ikon {
  left: 20px;
  width: 18px;
  height: 18px;
}

.arama-paneli__ipucu {
  margin: 14px 0 0;
  font-size: 14px;
  color: var(--metin-soluk);
}

/* Karşılama (anasayfa)
   ----------------------------------------- */
.karsilama {
  padding-top: 88px;
  background: var(--beyaz);
  text-align: center;
}

.karsilama--gorselsiz {
  padding-bottom: 96px;
}

.karsilama__kurum {
  margin: 0 0 14px;
  color: var(--metin-soluk);
}

.karsilama h1,
.karsilama__baslik {
  max-width: 900px;
  margin: 0 auto;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.06;
  letter-spacing: -0.012em;
}

.karsilama__aciklama {
  max-width: 640px;
  margin: 20px auto 0;
  font-family: var(--yazi-baslik);
  font-size: 21px;
  line-height: 1.43;
  letter-spacing: 0.011em;
  color: var(--metin-ikincil);
}

.karsilama__dugmeler {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 32px;
}

.karsilama__gorsel {
  max-width: 1080px;
  margin: 64px auto 0;
}

.karsilama__gorsel img {
  width: 100%;
  aspect-ratio: 2 / 1;
  object-fit: cover;
  object-position: center 55%;
  border-radius: var(--yaricap) var(--yaricap) 0 0;
}

.karsilama--yuzen {
  padding-bottom: 96px;
}

.karsilama--yuzen .karsilama__gorsel img {
  border-radius: var(--yaricap);
  box-shadow: var(--golge-foto);
}

.karsilama--gri {
  background: var(--gri-zemin);
}

.karsilama--koyu,
.karsilama--siyah {
  background: var(--koyu-zemin);
  color: var(--beyaz);
}

.karsilama--siyah {
  background: var(--siyah);
}

.karsilama--koyu .karsilama__kurum,
.karsilama--siyah .karsilama__kurum,
.karsilama--koyu .karsilama__aciklama,
.karsilama--siyah .karsilama__aciklama {
  color: var(--metin-koyu-zemin);
}

/* Rakamlar
   ----------------------------------------- */
.rakamlar {
  padding: 96px 0 104px;
  background: var(--siyah);
  color: var(--gri-zemin);
  text-align: center;
}

.rakamlar--koyu {
  background: var(--koyu-zemin);
}

.rakamlar h2 {
  margin-bottom: 64px;
  font-size: clamp(32px, 3.6vw, 48px);
  line-height: 1.08;
}

.rakamlar__liste {
  display: grid;
  grid-template-columns: repeat(var(--sutun, 4), 1fr);
  gap: 40px;
  max-width: 1040px;
  margin: 0 auto;
}

.rakam {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.rakam__etiket {
  font-weight: 600;
}

.rakam__deger {
  margin: 12px 0 10px;
  font-family: var(--yazi-baslik);
  font-size: clamp(56px, 6.4vw, 88px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.015em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  background: linear-gradient(180deg, #ffffff 0%, #b8b8bd 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.rakam__not {
  font-size: 14px;
  letter-spacing: -0.016em;
  color: var(--metin-soluk-koyu);
}

/* Bölümler
   ----------------------------------------- */
.bolum {
  padding: 96px 0;
  background: var(--gri-zemin);
}

.bolum--beyaz {
  background: var(--beyaz);
}

.bolum--koyu {
  background: var(--koyu-zemin);
  color: var(--beyaz);
}

.bolum--siyah {
  background: var(--siyah);
  color: var(--beyaz);
}

.bolum--sikisik {
  padding: 80px 0;
}

.bolum--ust-bosluksuz {
  padding-top: 0;
}

.bolum--alt-bosluksuz {
  padding-bottom: 0;
}

.bolum-basi {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 48px;
}

.bolum-basi h2 {
  margin-top: 6px;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.08;
  letter-spacing: -0.01em;
}

.bolum-basi p {
  max-width: 440px;
  margin: 0;
  font-family: var(--yazi-baslik);
  font-size: 19px;
  line-height: 1.42;
  letter-spacing: 0.005em;
  color: var(--metin-ikincil);
}

.bolum-basi--orta {
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.bolum-basi--orta p {
  max-width: 640px;
}

.bolum--koyu .ust-baslik,
.bolum--siyah .ust-baslik,
.bolum--koyu .bolum-basi p,
.bolum--siyah .bolum-basi p {
  color: var(--metin-koyu-zemin);
}

.bolum--koyu a:not(.dugme),
.bolum--siyah a:not(.dugme) {
  color: var(--mavi-koyu-zemin);
}

/* Kartlar (çalışma alanları) */
.alanlar {
  display: grid;
  grid-template-columns: repeat(var(--sutun, 4), 1fr);
  gap: 20px;
}

.alan-karti {
  display: flex;
  flex-direction: column;
  padding: 28px 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  color: var(--murekkep);
}

.bolum:not(.bolum--beyaz) .alan-karti {
  background: var(--beyaz);
}

.bolum--koyu .alan-karti,
.bolum--siyah .alan-karti {
  background: rgba(255, 255, 255, 0.06);
  color: var(--beyaz);
}

.alan-karti__ikon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 28px;
  border-radius: var(--yaricap-orta);
  background: var(--beyaz);
}

.bolum:not(.bolum--beyaz) .alan-karti__ikon {
  background: var(--gri-zemin);
}

.bolum--koyu .alan-karti__ikon,
.bolum--siyah .alan-karti__ikon {
  background: rgba(255, 255, 255, 0.1);
}

.alan-karti__ikon .ikon {
  width: 24px;
  height: 24px;
  stroke-width: 1.4;
}

.alan-karti__sira {
  font-size: 12px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.alan-karti h3 {
  margin: 4px 0 8px;
  font-size: 21px;
  line-height: 1.19;
  letter-spacing: 0.005em;
}

.alan-karti p {
  margin: 0;
  font-size: 14px;
  line-height: 1.43;
  letter-spacing: -0.016em;
  color: var(--metin-ikincil);
}

.bolum--koyu .alan-karti p,
.bolum--siyah .alan-karti p,
.bolum--koyu .alan-karti__sira,
.bolum--siyah .alan-karti__sira {
  color: var(--metin-koyu-zemin);
}

.alan-karti__baglanti {
  margin-top: auto;
  padding-top: 18px;
  font-size: 14px;
}

a.alan-karti {
  transition: transform 0.2s var(--gecis);
}

a.alan-karti:active {
  transform: scale(0.98);
}

/* Grup kartları */
.gruplar {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.grup-karti {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 40px;
  border-radius: var(--yaricap-buyuk);
  background: var(--beyaz);
  color: var(--murekkep);
  transition: transform 0.3s var(--gecis);
}

.bolum--beyaz .grup-karti:not(.grup-karti--koyu) {
  background: var(--gri-zemin);
}

.grup-karti:hover {
  transform: scale(1.01);
}

.grup-karti:active {
  transform: scale(0.99);
}

.grup-karti__kod {
  position: absolute;
  top: 28px;
  right: 32px;
  font-family: var(--yazi-baslik);
  font-size: 80px;
  font-weight: 600;
  line-height: 0.85;
  letter-spacing: -0.03em;
  color: var(--gri-zemin);
}

.bolum--beyaz .grup-karti:not(.grup-karti--koyu) .grup-karti__kod {
  color: var(--beyaz);
}

.grup-karti__etiket {
  font-size: 14px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.grup-karti h3 {
  position: relative;
  max-width: 72%;
  margin: 8px 0 14px;
  font-size: 34px;
  line-height: 1.12;
}

.grup-karti p {
  max-width: 460px;
  color: var(--metin-ikincil);
}

.grup-karti__alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 24px;
  border-top: 1px solid var(--cizgi-acik);
}

.bolum--beyaz .grup-karti:not(.grup-karti--koyu) .grup-karti__alt {
  border-top-color: var(--cizgi);
}

.grup-karti__ekip {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--metin-soluk);
}

.avatarlar {
  display: flex;
}

.avatarlar span,
.avatarlar img {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-left: -9px;
  border: 2px solid var(--beyaz);
  border-radius: 50%;
  background: #6e6e73;
  font-size: 11px;
  font-weight: 600;
  color: var(--beyaz);
  object-fit: cover;
}

.avatarlar > :first-child {
  margin-left: 0;
}

.avatarlar > :nth-child(1) {
  background: #1d1d1f;
}

.avatarlar > :nth-child(2) {
  background: #424245;
}

.avatarlar > :nth-child(3) {
  background: #6e6e73;
}

.avatarlar > :nth-child(4) {
  background: #86868b;
}

.bolum--beyaz .grup-karti:not(.grup-karti--koyu) .avatarlar > * {
  border-color: var(--gri-zemin);
}

.grup-karti--koyu {
  background: var(--koyu-zemin);
  color: var(--beyaz);
}

.grup-karti--koyu .grup-karti__kod {
  color: rgba(255, 255, 255, 0.06);
}

.grup-karti--koyu .grup-karti__etiket,
.grup-karti--koyu p,
.grup-karti--koyu .grup-karti__ekip {
  color: var(--metin-koyu-zemin);
}

.grup-karti--koyu .grup-karti__alt {
  border-top-color: rgba(255, 255, 255, 0.1);
}

.grup-karti--koyu .ok-baglanti {
  color: var(--mavi-koyu-zemin);
}

.grup-karti--koyu .avatarlar > * {
  border-color: var(--koyu-zemin);
}

/* Yayınlar */
.yayin-listesi {
  margin: 0;
  padding: 0;
  list-style: none;
}

.yayin {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  align-items: start;
  gap: 28px;
  padding: 28px 0;
  border-top: 1px solid var(--cizgi);
}

.yayin:last-child {
  border-bottom: 1px solid var(--cizgi);
}

.yayin__yil {
  font-family: var(--yazi-baslik);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--metin-soluk);
}

.yayin__baslik {
  margin: 0 0 8px;
  font-family: var(--yazi-baslik);
  font-size: 21px;
  font-weight: 600;
  line-height: 1.24;
  letter-spacing: 0.005em;
}

.yayin__baslik a {
  color: inherit;
}

.yayin__baslik a:hover {
  color: var(--mavi);
}

.yayin__yazarlar,
.yayin__dergi {
  margin: 0;
  font-size: 14px;
  letter-spacing: -0.016em;
}

.yayin__yazarlar {
  margin-bottom: 2px;
  color: var(--metin);
}

.yayin__yazarlar b {
  font-weight: 600;
  color: var(--murekkep);
}

.yayin__dergi {
  color: var(--metin-soluk);
}

.yayin__dergi em {
  color: var(--metin);
}

.yayin__doi-metni {
  font-size: 12px;
  overflow-wrap: anywhere;
}

.yayin__yan {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.etiket {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: var(--yaricap-kucuk);
  background: var(--gri-zemin);
  font-size: 12px;
  font-weight: 600;
  color: var(--metin);
  white-space: nowrap;
}

.etiket--koyu {
  background: var(--murekkep);
  color: var(--beyaz);
}

.etiket--cerceve {
  border: 1px solid var(--cizgi);
  background: transparent;
}

.durum {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--metin);
  white-space: nowrap;
}

.durum::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--metin-soluk);
}

.durum--devam::before,
.durum--kullanimda::before {
  background: var(--mavi);
}

.durum--planlanan::before,
.durum--bakimda::before {
  background: transparent;
  box-shadow: inset 0 0 0 1.5px var(--metin-soluk);
}

.doi-baglanti {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 14px;
  border: 1px solid var(--mavi);
  border-radius: var(--yaricap-hap);
  font-size: 14px;
  color: var(--mavi);
  white-space: nowrap;
  transition: background-color 0.2s, color 0.2s, transform 0.15s;
}

.doi-baglanti:hover {
  background: var(--mavi);
  color: var(--beyaz);
}

.doi-baglanti:active {
  transform: scale(0.95);
}

.doi-baglanti .ikon {
  width: 13px;
  height: 13px;
}

/* Altyapı özeti */
.altyapi-ozeti {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  align-items: center;
  gap: 64px;
}

.altyapi-ozeti h2 {
  margin: 6px 0 16px;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.08;
}

.altyapi-ozeti__metin > p {
  color: var(--metin-ikincil);
}

.foto-mozaik {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 12px;
  height: 500px;
}

.foto-mozaik img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--yaricap);
  box-shadow: var(--golge-foto);
}

.foto-mozaik img:first-child {
  grid-row: span 2;
}

.foto-mozaik--1 {
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}

.foto-mozaik--1 img:first-child {
  grid-row: auto;
}

.foto-mozaik--2 {
  grid-template-rows: 1fr;
}

.foto-mozaik--2 img:first-child {
  grid-row: auto;
}

.kategori-listesi {
  margin: 28px 0 32px;
  padding: 0;
  list-style: none;
}

.kategori-listesi li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 15px 0;
  border-bottom: 1px solid var(--cizgi);
  font-weight: 600;
}

.kategori-listesi a {
  color: inherit;
}

.kategori-listesi a:hover {
  color: var(--mavi);
}

.kategori-listesi span:last-child {
  font-size: 14px;
  font-weight: 400;
  color: var(--metin-soluk);
  white-space: nowrap;
}

/* İletişim çağrısı */
.iletisim-cagrisi {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  align-items: center;
  gap: 48px;
  padding: 64px;
  border-radius: var(--yaricap-buyuk);
  background: var(--koyu-zemin);
  color: var(--beyaz);
}

.iletisim-cagrisi--tek {
  grid-template-columns: 1fr;
}

.iletisim-cagrisi .ust-baslik {
  color: var(--metin-koyu-zemin);
}

.iletisim-cagrisi h2 {
  margin: 8px 0 12px;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.1;
}

.iletisim-cagrisi p {
  margin: 0;
  color: var(--metin-koyu-zemin);
}

.iletisim-cagrisi__kanallar {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.iletisim-cagrisi__kanallar > * {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border-radius: var(--yaricap);
  background: rgba(255, 255, 255, 0.06);
  color: var(--beyaz);
  overflow-wrap: anywhere;
  transition: background-color 0.2s, transform 0.15s;
}

.iletisim-cagrisi__kanallar a:hover,
.iletisim-cagrisi__kanallar a:focus-visible {
  background: rgba(255, 255, 255, 0.12);
}

.iletisim-cagrisi__kanallar a:active {
  transform: scale(0.98);
}

.iletisim-cagrisi__kanallar .ikon {
  color: var(--mavi-koyu-zemin);
}

.iletisim-cagrisi__kanallar small {
  display: block;
  font-size: 12px;
  color: var(--metin-koyu-zemin);
}

/* Metin bölümleri */
.metin-blok {
  max-width: var(--dar-genislik);
}

.metin-blok--orta {
  margin: 0 auto;
}

.metin-blok--genis {
  max-width: none;
}

.metin-blok > h2 {
  margin: 6px 0 24px;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.08;
}

.metin-gorsel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 64px;
}

.metin-gorsel--ters .metin-gorsel__gorsel {
  order: 2;
}

.metin-gorsel h2 {
  margin: 6px 0 20px;
  font-size: clamp(30px, 3vw, 40px);
  line-height: 1.1;
}

.metin-gorsel__gorsel img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--yaricap);
  box-shadow: var(--golge-foto);
}

.metin-gorsel .dugme {
  margin-top: 8px;
}

/* Sık sorulan sorular */
.sss {
  max-width: var(--dar-genislik);
  margin: 0 auto;
  border-top: 1px solid var(--cizgi);
}

.sss details {
  border-bottom: 1px solid var(--cizgi);
}

.sss summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 0;
  font-family: var(--yazi-baslik);
  font-size: 19px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}

.sss summary::-webkit-details-marker {
  display: none;
}

.sss summary .ikon {
  width: 18px;
  height: 18px;
  color: var(--metin-soluk);
  transition: transform 0.25s var(--gecis);
}

.sss details[open] summary .ikon {
  transform: rotate(180deg);
}

.sss__cevap {
  padding: 0 0 24px;
  color: var(--metin);
}

/* İç sayfa başı
   ----------------------------------------- */
.sayfa-basi {
  padding: 72px 0 64px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: var(--gri-zemin);
  text-align: center;
}

.yol {
  margin-bottom: 24px;
  font-size: 12px;
  color: var(--metin-soluk);
}

.yol ol {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}

.yol li {
  display: inline-flex;
  flex-shrink: 0;
  gap: 6px;
}

.yol li:last-child {
  flex-shrink: 1;
  min-width: 0;
}

.yol li:last-child span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.yol li + li::before {
  content: "›";
}

.yol a {
  color: var(--metin-soluk);
}

.yol a:hover {
  color: var(--murekkep);
  text-decoration: underline;
}

.sayfa-basi .ust-baslik {
  margin-bottom: 6px;
  font-size: 21px;
  line-height: 1.19;
}

.sayfa-basi h1 {
  max-width: 980px;
  margin: 0 auto;
  font-size: 56px;
  line-height: 1.07;
  letter-spacing: -0.005em;
}

.sayfa-basi--uzun h1 {
  font-size: 40px;
  line-height: 1.12;
}

.sayfa-basi__aciklama {
  max-width: 760px;
  margin: 14px auto 0;
  font-family: var(--yazi-baslik);
  font-size: 28px;
  line-height: 1.14;
  letter-spacing: 0.007em;
}

.sayfa-basi--uzun .sayfa-basi__aciklama {
  font-size: 19px;
  line-height: 1.42;
  color: var(--metin-ikincil);
}

.sayfa-basi__rakamlar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 64px;
  margin-top: 40px;
}

.sayfa-basi__rakamlar b {
  display: block;
  font-family: var(--yazi-baslik);
  font-size: 40px;
  font-weight: 600;
  line-height: 1.1;
  white-space: nowrap;
}

.sayfa-basi__rakamlar span {
  font-size: 14px;
  color: var(--metin-soluk);
}

.sayfa-basi .arama {
  margin: 32px auto 0;
  width: 420px;
}

.sayfa-basi .arama input {
  background: var(--beyaz);
}

/* İç sayfaların içerik bölümü beyaz, kartlar gri */
.icerik {
  padding: 96px 0;
  background: var(--beyaz);
}

.icerik--sikisik {
  padding: 64px 0;
}

/* Yan menülü düzen (grup sayfaları) */
.yan-duzen {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: 64px;
}

.sayfa-ici-menu {
  position: sticky;
  top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 28px);
}

.sayfa-ici-menu p {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.sayfa-ici-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sayfa-ici-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 40px;
  padding: 0 14px;
  border-radius: var(--yaricap-orta);
  font-size: 14px;
  color: var(--metin);
  transition: background-color 0.2s, color 0.2s;
}

.sayfa-ici-menu a:hover,
.sayfa-ici-menu a.aktif {
  background: var(--gri-zemin);
  color: var(--murekkep);
}

.sayfa-ici-menu a.aktif {
  font-weight: 600;
}

.sayfa-ici-menu small {
  font-size: 12px;
  font-weight: 400;
  color: var(--metin-soluk);
}

.icerik-blok {
  margin-bottom: 56px;
  padding-bottom: 56px;
  border-bottom: 1px solid var(--cizgi-orta);
  scroll-margin-top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 28px);
}

.icerik-blok:last-of-type {
  border-bottom: 0;
}

.icerik-blok > h2 {
  margin-bottom: 6px;
  font-size: 40px;
}

.icerik-blok__aciklama {
  margin-bottom: 32px;
  font-family: var(--yazi-baslik);
  font-size: 19px;
  color: var(--metin-ikincil);
}

.icerik-blok .yayin-listesi {
  padding: 0 28px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.icerik-blok .yayin:first-child {
  border-top: 0;
}

.icerik-blok .yayin:last-child {
  border-bottom: 0;
}

/* Araştırma konuları */
.konular {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.konu {
  padding: 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.konu h3 {
  margin-bottom: 8px;
  font-size: 19px;
  line-height: 1.24;
}

.konu p {
  margin: 0;
  font-size: 15px;
  color: var(--metin-ikincil);
}

/* Ekip */
.rol-basligi {
  margin: 36px 0 14px;
  font-size: 14px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.grup-basligi {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 8px;
  padding-top: 8px;
}

.grup-basligi h2 {
  font-size: 34px;
  line-height: 1.12;
}

.grup-basligi .ok-baglanti {
  flex-shrink: 0;
  white-space: nowrap;
}

.grup-basligi h2 small {
  display: block;
  margin-bottom: 4px;
  font-size: 17px;
  color: var(--metin-soluk);
}

.ekip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px;
}

.kisi {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  padding: 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.kisi__ust {
  display: flex;
  align-items: center;
  gap: 16px;
}

.kisi__avatar {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 56px;
  height: 56px;
  overflow: hidden;
  border-radius: 50%;
  background: #6e6e73;
  font-family: var(--yazi-baslik);
  font-size: 19px;
  font-weight: 600;
  color: var(--beyaz);
}

.kisi__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kisi h3 {
  font-size: 19px;
  line-height: 1.2;
}

.kisi h3 a {
  color: inherit;
}

.kisi h3 a:hover {
  color: var(--mavi);
}

.kisi__unvan {
  font-size: 14px;
  color: var(--metin-ikincil);
}

.kisi__baglantilar {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 14px;
  letter-spacing: -0.016em;
}

.kisi__baglantilar a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  overflow-wrap: anywhere;
}

.kisi__baglantilar a:hover {
  text-decoration: underline;
}

.kisi__baglantilar .ikon {
  width: 14px;
  height: 14px;
}

.kisa-etiket {
  display: inline-grid;
  flex-shrink: 0;
  place-items: center;
  min-width: 22px;
  height: 16px;
  padding: 0 4px;
  border-radius: 4px;
  background: var(--murekkep);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--beyaz);
}

.kisi--lider {
  flex-direction: row;
  align-items: center;
  gap: 28px;
  padding: 28px 32px;
}

.kisi--lider .kisi__avatar {
  width: 96px;
  height: 96px;
  background: var(--murekkep);
  font-size: 30px;
}

.kisi--lider h3 {
  font-size: 28px;
}

.kisi--lider .kisi__baglantilar {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 12px;
}

.kisi__rol {
  display: block;
  margin-bottom: 2px;
  font-size: 12px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.kisi--ogrenci .kisi__avatar {
  background: #86868b;
}

.kisi--arastirmaci .kisi__avatar {
  background: #424245;
}

.kisi--ayrildi {
  opacity: 0.85;
}

/* Hazırlanıyor kutusu */
.bos-durum {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  font-size: 14px;
  color: var(--metin-ikincil);
}

.bos-durum__ikon {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--yaricap-orta);
  background: var(--beyaz);
  color: var(--metin-soluk);
}

.bos-durum b {
  display: block;
  font-size: 17px;
  color: var(--murekkep);
}

.bos-durum p {
  margin: 0;
}

/* Diğer grup bağlantısı */
.diger-grup {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 32px;
  border-radius: var(--yaricap-buyuk);
  background: var(--koyu-zemin);
  color: var(--beyaz);
  transition: transform 0.3s var(--gecis);
}

.diger-grup + .diger-grup {
  margin-top: 12px;
}

.diger-grup:hover {
  transform: scale(1.01);
}

.diger-grup__etiket {
  font-size: 14px;
  font-weight: 600;
  color: var(--metin-koyu-zemin);
}

.diger-grup h3 {
  margin-top: 4px;
  font-size: 24px;
  line-height: 1.2;
}

.diger-grup .ok-baglanti {
  flex-shrink: 0;
  color: var(--mavi-koyu-zemin);
}

/* Projeler */
.projeler {
  display: grid;
  grid-template-columns: repeat(var(--sutun, 2), 1fr);
  gap: 16px;
}

.proje-karti {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  color: var(--murekkep);
  transition: transform 0.2s var(--gecis);
}

.bolum:not(.bolum--beyaz) .proje-karti {
  background: var(--beyaz);
}

a.proje-karti:active {
  transform: scale(0.98);
}

.proje-karti__ust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
}

.proje-karti h3 {
  font-size: 21px;
  line-height: 1.24;
}

a.proje-karti:hover h3 {
  color: var(--mavi);
}

.proje-karti p {
  margin: 0;
  font-size: 14px;
  color: var(--metin-ikincil);
}

.proje-karti__alt {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin-top: auto;
  padding-top: 6px;
  font-size: 13px;
  color: var(--metin-soluk);
}

/* Filtre ve arama
   ----------------------------------------- */
.arac-cubugu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 40px;
}

.arac-cubugu p {
  margin: 0;
  color: var(--metin-ikincil);
}

.filtreler {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filtre {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 12px 18px;
  border: 2px solid transparent;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin);
  font: 400 14px/1.29 var(--yazi-govde);
  letter-spacing: -0.016em;
  color: var(--murekkep);
  cursor: pointer;
  transition: transform 0.15s var(--gecis), border-color 0.2s;
}

.filtre:active {
  transform: scale(0.95);
}

.filtre span {
  color: var(--metin-soluk);
}

.filtre[aria-pressed="true"] {
  border-color: var(--mavi-vurgu);
  background: var(--beyaz);
}

.secim-kutusu {
  min-height: 44px;
  padding: 0 40px 0 18px;
  border: 0;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")
    no-repeat right 16px center / 14px;
  font-size: 14px;
  color: var(--murekkep);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.arama {
  position: relative;
  display: block;
  width: 300px;
  max-width: 100%;
}

.arama input {
  width: 100%;
  height: 44px;
  padding: 12px 20px 12px 42px;
  border: 1px solid transparent;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin);
  font: 400 17px var(--yazi-govde);
  letter-spacing: -0.022em;
  color: var(--murekkep);
  -webkit-appearance: none;
  appearance: none;
}

.arama input::placeholder {
  color: var(--metin-soluk);
}

.arama input:focus {
  outline: 2px solid var(--mavi-vurgu);
  outline-offset: 0;
  background: var(--beyaz);
}

.arama .ikon {
  position: absolute;
  top: 50%;
  left: 16px;
  width: 15px;
  height: 15px;
  color: var(--metin-soluk);
  transform: translateY(-50%);
  pointer-events: none;
}

.arama-formu {
  display: flex;
  gap: 10px;
  max-width: 560px;
}

.arama-formu .arama {
  flex: 1;
  width: auto;
}

.sonuc-yok {
  display: none;
  padding: 48px;
  text-align: center;
  color: var(--metin-ikincil);
}

.kaynak-notu {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 32px 0 0;
  font-size: 12px;
  color: var(--metin-soluk);
}

.kaynak-notu .ikon {
  width: 14px;
  height: 14px;
}

/* Yayınlar sayfası */
.yil-grubu h2 {
  margin: 48px 0 4px;
  font-size: 28px;
  line-height: 1.14;
}

.yil-grubu:first-child h2 {
  margin-top: 0;
}

.yayin-karti {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  margin-top: 12px;
  padding: 26px 28px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.yayin-karti .etiket {
  background: var(--beyaz);
}

.yayin-karti .etiket--koyu {
  background: var(--murekkep);
}

.yayin-karti__ust {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

/* Altyapı sayfası
   ----------------------------------------- */
.kategori-basligi {
  margin: 0 0 40px;
  font-size: 40px;
  line-height: 1.1;
  text-align: center;
}

.kategoriler {
  display: grid;
  grid-template-columns: repeat(var(--sutun, 5), 1fr);
  gap: 20px;
  margin-bottom: 64px;
}

.kategori-karti {
  display: flex;
  flex-direction: column;
  min-height: 274px;
  padding: 24px;
  border: 1px solid var(--cizgi);
  border-radius: var(--yaricap);
  background: var(--beyaz);
  color: var(--murekkep);
  transition: border-color 0.2s, transform 0.15s;
}

.kategori-karti:hover {
  border-color: #d2d2d7;
}

.kategori-karti:active {
  transform: scale(0.98);
}

.kategori-karti .ikon {
  width: 34px;
  height: 34px;
  margin-bottom: 36px;
  stroke-width: 1.3;
}

.kategori-karti b {
  font-size: 17px;
  line-height: 1.24;
}

.kategori-karti span {
  margin-top: 6px;
  font-size: 14px;
  letter-spacing: -0.016em;
  color: var(--metin-ikincil);
}

.kategori-karti em {
  margin-top: auto;
  padding-top: 24px;
  font-size: 14px;
  font-style: normal;
  color: var(--mavi);
}

.kategori-karti em::after {
  content: " ›";
}

.kategori-karti:hover em {
  text-decoration: underline;
}

.cihaz-grubu {
  margin-bottom: 56px;
  scroll-margin-top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 24px);
}

.cihaz-grubu__basi {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.cihaz-grubu__basi h2 {
  font-size: 28px;
  line-height: 1.14;
}

.cihaz-grubu__basi span {
  font-size: 14px;
  color: var(--metin-soluk);
  white-space: nowrap;
}

.cihaz-grubu__aciklama {
  margin: -6px 0 16px;
  color: var(--metin-ikincil);
}

.cihaz-tablosu {
  width: 100%;
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.cihaz-tablosu th {
  padding: 14px 24px;
  border-bottom: 1px solid #e5e5ea;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--metin-soluk);
  text-align: left;
}

.cihaz-tablosu td {
  padding: 15px 24px;
  border-bottom: 1px solid var(--cizgi-orta);
  vertical-align: top;
}

.cihaz-tablosu tr:last-child td {
  border-bottom: 0;
}

.cihaz-tablosu__ad {
  width: 42%;
  font-weight: 600;
}

.cihaz-tablosu__ad a {
  color: inherit;
}

.cihaz-tablosu__ad a:hover {
  color: var(--mavi);
  text-decoration: underline;
}

.cihaz-tablosu__ad .durum {
  display: flex;
  margin-top: 4px;
  font-weight: 400;
}

.cihaz-tablosu__model {
  color: var(--metin);
}

.cihaz-tablosu .cihaz-tablosu__adet {
  width: 90px;
  text-align: right;
}

.cihaz-tablosu__adet span {
  display: inline-grid;
  place-items: center;
  min-width: 32px;
  height: 28px;
  padding: 0 8px;
  border-radius: var(--yaricap-kucuk);
  background: var(--beyaz);
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.cihaz-tablosu tr.gizli {
  display: none;
}

.bilgi-kutusu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 40px;
  padding: 28px 32px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.bilgi-kutusu--bitisik {
  margin-top: 0;
}

.bilgi-kutusu b {
  display: block;
  font-family: var(--yazi-baslik);
  font-size: 21px;
}

.bilgi-kutusu p {
  margin: 0;
  font-size: 14px;
  color: var(--metin-ikincil);
}

.bolum:not(.bolum--beyaz) .bilgi-kutusu {
  background: var(--beyaz);
}

/* Detay sayfaları (cihaz, proje, yayın)
   ----------------------------------------- */
.detay-duzen {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  align-items: start;
  gap: 56px;
}

.detay-duzen__ana > * + * {
  margin-top: 48px;
}

.detay-duzen__ana h2 {
  margin-bottom: 16px;
  font-size: 28px;
  line-height: 1.14;
}

.detay-gorsel img {
  width: 100%;
  border-radius: var(--yaricap);
  box-shadow: var(--golge-foto);
}

.bilgi-karti {
  position: sticky;
  top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 28px);
  padding: 28px;
  border-radius: var(--yaricap-buyuk);
  background: var(--gri-zemin);
}

.bilgi-karti h2 {
  margin-bottom: 8px;
  font-size: 21px;
}

.bilgi-listesi {
  margin: 0;
}

.bilgi-listesi div {
  padding: 14px 0;
  border-top: 1px solid var(--cizgi);
}

.bilgi-listesi div:first-child {
  border-top: 0;
}

.bilgi-listesi dt {
  margin-bottom: 2px;
  font-size: 12px;
  color: var(--metin-soluk);
}

.bilgi-listesi dd {
  margin: 0;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.bilgi-listesi dd a:hover {
  text-decoration: underline;
}

.bilgi-karti .dugme {
  width: 100%;
  margin-top: 16px;
}

.atif-kutusu {
  position: relative;
  padding: 24px 28px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.atif-kutusu__metin {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.atif-kutusu__alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.kopyalandi {
  font-size: 14px;
  color: var(--metin-soluk);
}

.ozet {
  font-size: 17px;
  line-height: 1.6;
  color: var(--metin);
}

.etiket-listesi {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.etiket-listesi li {
  padding: 6px 14px;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin);
  font-size: 14px;
  color: var(--metin);
}

.ilgili-baglantilar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Kişi profili */
.profil {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  align-items: start;
  gap: 56px;
}

.profil__kart {
  position: sticky;
  top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 28px);
  padding: 28px;
  border-radius: var(--yaricap-buyuk);
  background: var(--gri-zemin);
  text-align: center;
}

.profil__foto {
  display: grid;
  place-items: center;
  width: 160px;
  height: 160px;
  margin: 0 auto 20px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--murekkep);
  font-family: var(--yazi-baslik);
  font-size: 48px;
  font-weight: 600;
  color: var(--beyaz);
}

.profil__foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profil__kart .kisi__baglantilar {
  align-items: flex-start;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--cizgi);
  text-align: left;
}

.profil__ana > * + * {
  margin-top: 48px;
}

.profil__ana h2 {
  margin-bottom: 16px;
  font-size: 28px;
  line-height: 1.14;
}

.egitim-listesi {
  margin: 0;
  padding: 0;
  list-style: none;
}

.egitim-listesi li {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 16px;
  padding: 16px 0;
  border-top: 1px solid var(--cizgi);
}

.egitim-listesi li:last-child {
  border-bottom: 1px solid var(--cizgi);
}

.egitim-listesi b {
  display: block;
}

.egitim-listesi span {
  font-size: 14px;
  color: var(--metin-ikincil);
}

.egitim-listesi time {
  font-family: var(--yazi-baslik);
  font-weight: 600;
  color: var(--metin-soluk);
}

.profil__ana .yayin-listesi {
  padding: 0 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.profil__ana .yayin:first-child {
  border-top: 0;
}

.profil__ana .yayin:last-child {
  border-bottom: 0;
}

/* Hakkımızda
   ----------------------------------------- */
.hakkimizda-duzen {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: start;
  gap: 64px;
}

.uzun-metin p {
  margin-bottom: 24px;
  font-size: 19px;
  line-height: 1.58;
  letter-spacing: 0.005em;
  color: var(--metin);
}

.uzun-metin p:first-child {
  font-family: var(--yazi-baslik);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.42;
  color: var(--murekkep);
}

.uzun-metin a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.kunye {
  position: sticky;
  top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 28px);
  padding: 32px;
  border-radius: var(--yaricap-buyuk);
  background: var(--gri-zemin);
}

.kunye h2 {
  margin-bottom: 16px;
  font-size: 24px;
}

.kunye__satir {
  display: flex;
  gap: 16px;
  padding: 16px 0;
  border-top: 1px solid var(--cizgi);
}

.kunye__ikon {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--yaricap-orta);
  background: var(--beyaz);
}

.kunye__satir small {
  display: block;
  font-size: 12px;
  color: var(--metin-soluk);
}

.galeri {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 240px 240px;
  gap: 12px;
  margin: 0;
}

.galeri figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: var(--yaricap);
  box-shadow: var(--golge-foto);
}

.galeri figure:first-child {
  grid-row: span 2;
}

.galeri figure:nth-child(4) {
  grid-column: span 2;
}

.galeri img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--gecis);
}

.galeri figure:hover img {
  transform: scale(1.03);
}

.galeri figcaption {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 4px 10px;
  border-radius: var(--yaricap-hap);
  background: rgba(210, 210, 215, 0.8);
  font-size: 12px;
  color: var(--murekkep);
}

.galeri--izgara {
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: none;
  grid-auto-rows: 240px;
}

.galeri--izgara figure:first-child,
.galeri--izgara figure:nth-child(4) {
  grid-row: auto;
  grid-column: auto;
}

/* Haberler
   ----------------------------------------- */
.haber-izgarasi {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px 20px;
}

.haber-karti {
  display: flex;
  flex-direction: column;
  color: var(--murekkep);
}

.haber-karti__gorsel {
  margin-bottom: 18px;
  overflow: hidden;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  aspect-ratio: 16 / 10;
}

.haber-karti__gorsel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--gecis);
}

.haber-karti:hover .haber-karti__gorsel img {
  transform: scale(1.03);
}

.haber-karti__gorsel--bos {
  display: grid;
  place-items: center;
  color: var(--metin-soluk);
}

.haber-karti__gorsel--bos .ikon {
  width: 36px;
  height: 36px;
  stroke-width: 1.2;
}

.haber-karti__ust {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin-bottom: 8px;
  font-size: 13px;
  color: var(--metin-soluk);
}

.haber-karti__ust b {
  font-weight: 600;
  color: var(--metin);
}

.haber-karti h3,
.haber-karti h2 {
  font-size: 21px;
  line-height: 1.24;
}

.haber-karti:hover h3,
.haber-karti:hover h2 {
  color: var(--mavi);
}

.haber-karti p {
  margin: 10px 0 0;
  font-size: 15px;
  color: var(--metin-ikincil);
}

.haber-karti--one-cikan {
  grid-column: span 3;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: center;
  gap: 40px;
}

.haber-karti--one-cikan .haber-karti__gorsel {
  margin: 0;
}

.haber-karti--one-cikan h2 {
  font-size: 34px;
  line-height: 1.12;
}

/* Sayfalama */
.sayfalama {
  margin-top: 56px;
}

.sayfalama .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.sayfalama .page-numbers {
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  height: 44px;
  padding: 0 14px;
  border-radius: var(--yaricap-hap);
  font-size: 15px;
  color: var(--murekkep);
}

.sayfalama a.page-numbers:hover {
  background: var(--gri-zemin);
}

.sayfalama .page-numbers.current {
  background: var(--murekkep);
  color: var(--beyaz);
}

.sayfalama .page-numbers.dots {
  min-width: auto;
  padding: 0 4px;
}

/* Makale (tek yazı) */
.makale-basi {
  padding: 72px 0 48px;
  background: var(--beyaz);
  text-align: center;
}

.makale-basi .yol {
  margin-bottom: 20px;
}

.makale-basi__ust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 14px;
  margin-bottom: 14px;
  font-size: 14px;
  color: var(--metin-soluk);
}

.makale-basi__ust a {
  font-weight: 600;
}

.makale-basi h1 {
  max-width: 900px;
  margin: 0 auto;
  font-size: clamp(34px, 4.4vw, 52px);
  line-height: 1.08;
}

.makale-basi__ozet {
  max-width: 680px;
  margin: 18px auto 0;
  font-family: var(--yazi-baslik);
  font-size: 21px;
  line-height: 1.43;
  color: var(--metin-ikincil);
}

.makale-gorsel {
  max-width: 1080px;
  margin: 0 auto 56px;
}

.makale-gorsel img {
  width: 100%;
  border-radius: var(--yaricap);
}

.makale-gorsel figcaption {
  margin-top: 10px;
  font-size: 13px;
  color: var(--metin-soluk);
  text-align: center;
}

.makale {
  padding-bottom: 104px;
}

.makale-alt {
  max-width: var(--dar-genislik);
  margin: 48px auto 0;
  padding-top: 32px;
  border-top: 1px solid var(--cizgi);
}

.makale-alt > * + * {
  margin-top: 24px;
}

.paylas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--metin-soluk);
}

.paylas a,
.paylas button {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--cizgi);
  border-radius: var(--yaricap-hap);
  background: transparent;
  font-size: 14px;
  color: var(--murekkep);
  cursor: pointer;
}

.paylas a:hover,
.paylas button:hover {
  border-color: var(--murekkep);
}

.yazi-gecisi {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-width: var(--dar-genislik);
  margin: 48px auto 0;
}

.yazi-gecisi a {
  display: block;
  padding: 20px 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  color: var(--murekkep);
}

.yazi-gecisi a:hover b {
  color: var(--mavi);
}

.yazi-gecisi span {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  color: var(--metin-soluk);
}

.yazi-gecisi .sonraki {
  grid-column: 2;
  text-align: right;
}

/* İçerik gövdesi (blok düzenleyici çıktısı)
   ----------------------------------------- */
.icerik-govdesi {
  max-width: var(--dar-genislik);
  margin: 0 auto;
  font-size: 18px;
  line-height: 1.65;
  letter-spacing: -0.01em;
  color: var(--metin);
  overflow-wrap: break-word;
}

.icerik-govdesi--genis {
  max-width: none;
}

.icerik-govdesi--ayrik {
  margin-bottom: 64px;
}

.icerik-govdesi > * {
  margin-top: 0;
  margin-bottom: 1.2em;
}

.icerik-govdesi > :last-child {
  margin-bottom: 0;
}

.icerik-govdesi h2,
.icerik-govdesi h3,
.icerik-govdesi h4,
.icerik-govdesi h5,
.icerik-govdesi h6 {
  margin-top: 1.8em;
  margin-bottom: 0.6em;
  color: var(--murekkep);
}

.icerik-govdesi h2 {
  font-size: 32px;
  line-height: 1.15;
}

.icerik-govdesi h3 {
  font-size: 24px;
  line-height: 1.2;
}

.icerik-govdesi h4 {
  font-size: 20px;
}

.icerik-govdesi h5,
.icerik-govdesi h6 {
  font-size: 17px;
}

.icerik-govdesi a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.icerik-govdesi strong,
.icerik-govdesi b {
  font-weight: 600;
  color: var(--murekkep);
}

.icerik-govdesi ul,
.icerik-govdesi ol {
  padding-left: 1.3em;
}

.icerik-govdesi li + li {
  margin-top: 0.4em;
}

.icerik-govdesi blockquote,
.icerik-govdesi .wp-block-quote {
  margin-left: 0;
  margin-right: 0;
  padding: 4px 0 4px 24px;
  border-left: 3px solid var(--murekkep);
  font-family: var(--yazi-baslik);
  font-size: 22px;
  line-height: 1.4;
  color: var(--murekkep);
}

.icerik-govdesi blockquote cite,
.icerik-govdesi .wp-block-quote cite {
  display: block;
  margin-top: 10px;
  font-family: var(--yazi-govde);
  font-size: 14px;
  font-style: normal;
  color: var(--metin-soluk);
}

.icerik-govdesi .wp-block-pullquote {
  padding: 40px 0;
  border-top: 1px solid var(--cizgi);
  border-bottom: 1px solid var(--cizgi);
  text-align: center;
}

.icerik-govdesi .wp-block-pullquote blockquote {
  padding: 0;
  border: 0;
  font-size: 28px;
}

.icerik-govdesi figure {
  margin-left: 0;
  margin-right: 0;
}

.icerik-govdesi img {
  border-radius: var(--yaricap-kucuk);
}

.icerik-govdesi figcaption,
.icerik-govdesi .wp-element-caption,
.wp-caption-text,
.gallery-caption {
  margin-top: 8px;
  font-size: 14px;
  color: var(--metin-soluk);
  text-align: center;
}

.icerik-govdesi hr,
.icerik-govdesi .wp-block-separator {
  margin: 2.4em auto;
  border: 0;
  border-top: 1px solid var(--cizgi);
}

.icerik-govdesi table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}

.icerik-govdesi th,
.icerik-govdesi td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--cizgi);
  text-align: left;
  vertical-align: top;
}

.icerik-govdesi th {
  font-size: 13px;
  font-weight: 600;
  color: var(--metin-soluk);
}

.icerik-govdesi .wp-block-table {
  overflow-x: auto;
}

.icerik-govdesi code,
.icerik-govdesi kbd {
  padding: 2px 6px;
  border-radius: 6px;
  background: var(--gri-zemin);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.86em;
}

.icerik-govdesi pre {
  overflow-x: auto;
  padding: 20px 24px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
  font-size: 14px;
  line-height: 1.6;
}

.icerik-govdesi pre code {
  padding: 0;
  background: none;
}

.icerik-govdesi .wp-block-button__link,
.icerik-govdesi .wp-element-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 11px 22px;
  border-radius: var(--yaricap-hap);
  background: var(--mavi);
  font-size: 17px;
  line-height: 1.17;
  color: var(--beyaz);
  text-decoration: none;
}

.icerik-govdesi .wp-block-button__link:hover {
  background: var(--mavi-vurgu);
}

.icerik-govdesi .is-style-outline .wp-block-button__link {
  border: 1px solid var(--mavi);
  background: transparent;
  color: var(--mavi);
}

.icerik-govdesi .wp-block-file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 18px 22px;
  border-radius: var(--yaricap);
  background: var(--gri-zemin);
}

.icerik-govdesi .wp-block-file .wp-block-file__button {
  margin-left: auto;
  padding: 8px 16px;
  border-radius: var(--yaricap-hap);
  background: var(--mavi);
  color: var(--beyaz);
  text-decoration: none;
}

.icerik-govdesi details {
  padding: 16px 0;
  border-bottom: 1px solid var(--cizgi);
}

.icerik-govdesi summary {
  font-weight: 600;
  cursor: pointer;
}

.icerik-govdesi .wp-block-embed iframe {
  max-width: 100%;
}

.icerik-govdesi .wp-block-gallery {
  gap: 12px;
}

.alignleft {
  float: left;
  margin: 0.3em 1.6em 1em 0;
}

.alignright {
  float: right;
  margin: 0.3em 0 1em 1.6em;
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.icerik-govdesi .alignwide {
  width: min(1080px, calc(100vw - 48px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

.icerik-govdesi .alignfull {
  width: 100vw;
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

.icerik-govdesi .alignfull img,
.icerik-govdesi .alignwide img {
  width: 100%;
}

.wp-caption {
  max-width: 100%;
}

.sticky,
.bypostauthor {
  position: relative;
}

/* Yorumlar */
.yorumlar {
  max-width: var(--dar-genislik);
  margin: 64px auto 0;
  padding-top: 48px;
  border-top: 1px solid var(--cizgi);
}

.yorumlar__baslik {
  margin-bottom: 24px;
  font-size: 28px;
}

.yorum-listesi,
.yorum-listesi .children {
  margin: 0;
  padding: 0;
  list-style: none;
}

.yorum-listesi .children {
  margin-left: 28px;
}

.yorum-listesi .comment-body {
  padding: 20px 0;
  border-bottom: 1px solid var(--cizgi);
}

.yorum-listesi .comment-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--metin-soluk);
}

.yorum-listesi .comment-author {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  color: var(--murekkep);
}

.yorum-listesi .avatar {
  border-radius: 50%;
}

.yorum-listesi .says {
  display: none;
}

.yorum-listesi .comment-metadata a {
  color: var(--metin-soluk);
}

.yorum-listesi .reply a {
  font-size: 14px;
}

.comment-respond {
  margin-top: 40px;
}

.comment-reply-title {
  margin-bottom: 16px;
  font-size: 24px;
}

.comment-form p {
  margin-bottom: 16px;
}

.comment-form label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--cizgi);
  border-radius: var(--yaricap-orta);
  background: var(--beyaz);
  font-size: 16px;
  color: var(--murekkep);
}

.comment-form .comment-form-cookies-consent {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}

.comment-form .comment-form-cookies-consent label {
  font-weight: 400;
}

.comment-form input[type="submit"] {
  min-height: 44px;
  padding: 11px 22px;
  border: 0;
  border-radius: var(--yaricap-hap);
  background: var(--mavi);
  font-size: 17px;
  color: var(--beyaz);
  cursor: pointer;
}

/* Arama sonuçları ve 404 */
.sonuc-listesi {
  max-width: 880px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.sonuc {
  padding: 24px 0;
  border-bottom: 1px solid var(--cizgi);
}

.sonuc:first-child {
  border-top: 1px solid var(--cizgi);
}

.sonuc__tur {
  margin-bottom: 6px;
}

.sonuc h2 {
  font-size: 21px;
  line-height: 1.24;
}

.sonuc h2 a {
  color: var(--murekkep);
}

.sonuc h2 a:hover {
  color: var(--mavi);
}

.sonuc p {
  margin: 8px 0 0;
  font-size: 15px;
  color: var(--metin-ikincil);
}

.sonuc__adres {
  display: block;
  margin-top: 6px;
  font-size: 13px;
  color: var(--metin-soluk);
  overflow-wrap: anywhere;
}

.hata-sayfasi {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}

.hata-sayfasi .arama-formu {
  margin: 32px auto 0;
}

.hata-sayfasi__baglantilar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

.hata-sayfasi__baglantilar a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 18px;
  border-radius: var(--yaricap-hap);
  background: var(--gri-zemin);
  font-size: 15px;
  color: var(--murekkep);
}

.hata-sayfasi__baglantilar a:hover {
  background: var(--cizgi-orta);
}

/* Alt bilgi
   ----------------------------------------- */
.alt-bilgi {
  padding-top: 56px;
  border-top: 1px solid var(--cizgi);
  background: var(--gri-zemin);
  font-size: 12px;
  letter-spacing: -0.01em;
  color: var(--metin);
}

.alt-bilgi__sutunlar {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 40px;
  padding-bottom: 32px;
  border-bottom: 1px solid #d2d2d7;
}

.alt-bilgi__marka {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.alt-bilgi__marka img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: contain;
}

.alt-bilgi__marka b {
  font-family: var(--yazi-baslik);
  font-size: 15px;
  line-height: 1.25;
  color: var(--murekkep);
}

.alt-bilgi__tanim {
  max-width: 340px;
  line-height: 1.5;
  color: var(--metin-soluk);
}

.alt-bilgi h2 {
  margin-bottom: 6px;
  font-family: var(--yazi-govde);
  font-size: 12px;
  letter-spacing: -0.01em;
}

.alt-bilgi ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.alt-bilgi li {
  line-height: 2.41;
}

.alt-bilgi a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--metin);
}

.alt-bilgi a:hover {
  color: var(--murekkep);
  text-decoration: underline;
}

.alt-bilgi .ikon {
  width: 13px;
  height: 13px;
  color: var(--metin-soluk);
}

.sosyal-baglantilar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.alt-bilgi .sosyal-baglantilar a {
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid #d2d2d7;
  border-radius: var(--yaricap-hap);
  font-size: 12px;
}

.alt-bilgi .sosyal-baglantilar a:hover {
  border-color: var(--murekkep);
  text-decoration: none;
}

.alt-bilgi__alt {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 16px;
  padding: 18px 0 24px;
  color: var(--metin-soluk);
}

.alt-bilgi__alt a {
  color: var(--metin-soluk);
}

.alt-bilgi__yasal {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
}

.alt-bilgi__yasal li {
  line-height: 1.5;
}

.yukari-cik {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 40;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: rgba(210, 210, 215, 0.64);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: var(--murekkep);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s, transform 0.15s;
}

.yukari-cik.gorunur {
  opacity: 1;
  visibility: visible;
}

.yukari-cik:active {
  transform: scale(0.95);
}

/* Kaydırınca beliren öğeler (yalnızca JS çalışıyorsa gizlenir) */
.js .belir {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.7s var(--gecis), transform 0.7s var(--gecis);
}

.js .belir.gorundu {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  .js .belir {
    opacity: 1;
    transform: none;
  }
}

/* Tablet
   ----------------------------------------- */
@media (max-width: 1100px) {
  .ana-menu,
  .gezinme__sag > .dil-secimi {
    display: none;
  }

  .menu-dugmesi {
    display: block;
  }

  .alanlar {
    grid-template-columns: repeat(2, 1fr);
  }

  .altyapi-ozeti,
  .iletisim-cagrisi,
  .hakkimizda-duzen,
  .metin-gorsel {
    grid-template-columns: 1fr;
  }

  .metin-gorsel--ters .metin-gorsel__gorsel {
    order: 0;
  }

  .kategoriler {
    grid-template-columns: repeat(3, 1fr);
  }

  .alt-bilgi__sutunlar {
    grid-template-columns: 1fr 1fr;
  }

  .yan-duzen {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }

  /* Grup sayfasında yan menü yatay şeride dönüşür */
  .sayfa-ici-menu {
    top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu));
    z-index: 20;
    margin: 0 -24px;
    padding: 8px 24px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: rgba(255, 255, 255, 0.9);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
  }

  .sayfa-ici-menu p,
  .sayfa-ici-menu small {
    display: none;
  }

  .sayfa-ici-menu ul {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .sayfa-ici-menu ul::-webkit-scrollbar {
    display: none;
  }

  .sayfa-ici-menu a {
    min-height: 36px;
    border-radius: var(--yaricap-hap);
    white-space: nowrap;
  }

  .icerik--yan-menulu {
    padding-top: 0;
  }

  .icerik-blok {
    scroll-margin-top: calc(var(--baslik-yuksekligi) + var(--yonetim-cubugu) + 64px);
  }

  .kunye,
  .bilgi-karti,
  .profil__kart {
    position: static;
  }

  .detay-duzen,
  .profil {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
  }

  .profil__kart {
    display: grid;
    grid-template-columns: 120px 1fr;
    align-items: center;
    gap: 8px 24px;
    text-align: left;
  }

  .profil__foto {
    grid-row: span 3;
    width: 120px;
    height: 120px;
    margin: 0;
    font-size: 36px;
  }

  .profil__kart .kisi__baglantilar {
    grid-column: 1 / -1;
  }

  .haber-izgarasi {
    grid-template-columns: repeat(2, 1fr);
  }

  .haber-karti--one-cikan {
    grid-column: span 2;
  }
}

@media (max-width: 833px) {
  .rakamlar__liste {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 56px;
  }

  .sayfa-basi h1 {
    font-size: 40px;
  }

  .sayfa-basi--uzun h1 {
    font-size: 32px;
  }

  .sayfa-basi__aciklama {
    font-size: 24px;
  }

  .gruplar,
  .projeler,
  .konular {
    grid-template-columns: 1fr;
  }

  .haber-karti--one-cikan {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

@media (max-width: 782px) {
  body.admin-bar {
    --yonetim-cubugu: 46px;
  }
}

@media (max-width: 600px) {
  .grup-basligi {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .grup-basligi h2 {
    font-size: 28px;
  }

  body.admin-bar {
    --yonetim-cubugu: 0px;
  }
}

/* Telefon
   ----------------------------------------- */
@media (max-width: 720px) {
  :root {
    --baslik-yuksekligi: 64px;
  }

  body {
    font-size: 16px;
  }

  .kapsayici {
    padding: 0 20px;
  }

  .ust-serit {
    display: none;
  }

  .marka {
    gap: 12px;
  }

  .marka__logo {
    width: 38px;
    height: 38px;
  }

  .marka__metin {
    padding-left: 12px;
  }

  .marka__ad {
    font-size: 14px;
  }

  .marka__kurum {
    font-size: 10px;
  }

  .gezinme {
    gap: 12px;
  }

  .gezinme__sag {
    gap: 0;
  }

  .arama-paneli {
    padding: 28px 0;
  }

  .arama-paneli__baslik {
    font-size: 24px;
  }

  .arama-paneli .arama input {
    height: 50px;
    font-size: 17px;
  }

  .karsilama {
    padding-top: 48px;
  }

  .karsilama--gorselsiz,
  .karsilama--yuzen {
    padding-bottom: 56px;
  }

  .karsilama h1,
  .karsilama__baslik {
    font-size: 34px;
    line-height: 1.12;
  }

  .karsilama__aciklama {
    font-size: 17px;
    line-height: 1.47;
  }

  .karsilama__dugmeler {
    flex-direction: column;
    align-items: stretch;
    max-width: 320px;
    margin-right: auto;
    margin-left: auto;
  }

  .karsilama__gorsel {
    margin-top: 40px;
  }

  .karsilama__gorsel img {
    aspect-ratio: 4 / 3;
  }

  .rakamlar {
    padding: 64px 0 72px;
  }

  .rakamlar h2 {
    margin-bottom: 44px;
    font-size: 28px;
  }

  .rakam__etiket {
    font-size: 15px;
  }

  .rakam__deger {
    font-size: 52px;
  }

  .rakam__not {
    font-size: 12px;
  }

  .bolum,
  .icerik {
    padding: 64px 0;
  }

  .bolum--ust-bosluksuz,
  .icerik--yan-menulu {
    padding-top: 0;
  }

  .bolum--alt-bosluksuz {
    padding-bottom: 0;
  }

  .bolum-basi {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 32px;
  }

  .bolum-basi--orta {
    align-items: center;
  }

  .bolum-basi h2 {
    font-size: 30px;
  }

  .bolum-basi p {
    font-size: 17px;
  }

  .alanlar {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .alan-karti {
    display: grid;
    grid-template-columns: 48px 1fr;
    column-gap: 16px;
    padding: 20px;
  }

  .alan-karti__ikon {
    grid-row: span 3;
    margin-bottom: 0;
  }

  .alan-karti__baglanti {
    grid-column: 2;
  }

  .grup-karti {
    padding: 28px 24px;
  }

  .grup-karti h3 {
    max-width: none;
    padding-right: 72px;
    font-size: 26px;
  }

  .grup-karti__kod {
    top: 24px;
    right: 20px;
    font-size: 48px;
  }

  .yayin {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 24px 0;
  }

  .yayin__yil {
    font-size: 17px;
  }

  .yayin__baslik {
    font-size: 18px;
  }

  .yayin__yan {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    margin-top: 4px;
  }

  .icerik-blok .yayin-listesi,
  .profil__ana .yayin-listesi {
    padding: 0 20px;
  }

  .yayin-karti {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 22px 20px;
  }

  .foto-mozaik {
    height: 300px;
  }

  .altyapi-ozeti {
    gap: 40px;
  }

  .iletisim-cagrisi {
    gap: 28px;
    padding: 32px 24px;
    border-radius: var(--yaricap);
  }

  .metin-gorsel {
    gap: 32px;
  }

  .sss summary {
    font-size: 17px;
  }

  .sayfa-basi {
    padding: 48px 0 44px;
  }

  .sayfa-basi .ust-baslik {
    font-size: 17px;
  }

  .sayfa-basi h1 {
    font-size: 32px;
    line-height: 1.12;
  }

  .sayfa-basi--uzun h1 {
    font-size: 26px;
    line-height: 1.18;
  }

  .sayfa-basi__aciklama {
    font-size: 19px;
    line-height: 1.3;
  }

  .sayfa-basi__rakamlar {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: center;
    gap: 24px;
    margin-top: 32px;
  }

  .sayfa-basi__rakamlar b {
    font-size: 30px;
  }

  .sayfa-basi .arama {
    width: 100%;
  }

  .sayfa-ici-menu {
    margin: 0 -20px;
    padding: 8px 20px;
  }

  .icerik-blok {
    margin-bottom: 44px;
    padding-bottom: 44px;
  }

  .icerik-blok > h2 {
    font-size: 30px;
  }

  .icerik-blok__aciklama {
    font-size: 17px;
  }

  .ekip {
    grid-template-columns: 1fr;
  }

  .kisi--lider {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 24px;
  }

  .kisi--lider .kisi__avatar {
    width: 72px;
    height: 72px;
    font-size: 24px;
  }

  .kisi--lider h3 {
    font-size: 24px;
  }

  .kisi--lider .kisi__baglantilar {
    flex-direction: column;
    gap: 2px;
  }

  .grup-basligi h2 {
    font-size: 26px;
  }

  .diger-grup {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
  }

  .diger-grup h3 {
    font-size: 20px;
  }

  .arac-cubugu {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    margin-bottom: 28px;
  }

  .arama {
    width: 100%;
  }

  .arama-formu {
    flex-direction: column;
  }

  .yil-grubu h2 {
    font-size: 24px;
  }

  .kategori-basligi {
    margin-bottom: 28px;
    font-size: 28px;
  }

  .kategoriler {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 48px;
  }

  .kategori-karti {
    min-height: 0;
    padding: 18px;
  }

  .kategori-karti .ikon {
    width: 28px;
    height: 28px;
    margin-bottom: 20px;
  }

  .kategori-karti b {
    font-size: 15px;
  }

  .kategori-karti span,
  .kategori-karti em {
    font-size: 13px;
  }

  .kategori-karti em {
    padding-top: 16px;
  }

  .cihaz-grubu__basi h2 {
    font-size: 22px;
  }

  /* Tablo telefonda satır kartlarına dönüşür */
  .cihaz-tablosu thead {
    display: none;
  }

  .cihaz-tablosu,
  .cihaz-tablosu tbody,
  .cihaz-tablosu tr,
  .cihaz-tablosu td {
    display: block;
    width: auto;
  }

  .cihaz-tablosu tr {
    position: relative;
    padding: 14px 64px 14px 18px;
    border-bottom: 1px solid var(--cizgi-orta);
  }

  .cihaz-tablosu tr:last-child {
    border-bottom: 0;
  }

  .cihaz-tablosu td {
    padding: 0;
    border: 0;
  }

  .cihaz-tablosu__ad {
    font-size: 15px;
  }

  .cihaz-tablosu__model {
    margin-top: 2px;
    font-size: 14px;
    color: var(--metin-ikincil);
  }

  .cihaz-tablosu .cihaz-tablosu__adet {
    position: absolute;
    top: 50%;
    right: 18px;
    width: auto;
    transform: translateY(-50%);
  }

  .bilgi-kutusu {
    padding: 24px;
  }

  .bilgi-kutusu .dugme {
    width: 100%;
  }

  .uzun-metin p {
    font-size: 17px;
  }

  .uzun-metin p:first-child {
    font-size: 19px;
    line-height: 1.47;
  }

  .kunye,
  .bilgi-karti {
    padding: 24px;
  }

  .galeri,
  .galeri--izgara {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: none;
    grid-auto-rows: 140px;
  }

  .galeri figure:first-child {
    grid-column: span 2;
    grid-row: span 1;
  }

  .galeri:not(.galeri--izgara) figure:first-child {
    grid-row: span 1;
    height: 200px;
  }

  .galeri--izgara figure:first-child {
    grid-column: span 2;
  }

  .profil__kart {
    grid-template-columns: 88px 1fr;
    padding: 20px;
  }

  .profil__foto {
    width: 88px;
    height: 88px;
    font-size: 28px;
  }

  .egitim-listesi li {
    grid-template-columns: 56px 1fr;
  }

  .haber-izgarasi {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .haber-karti--one-cikan {
    grid-column: auto;
  }

  .haber-karti--one-cikan h2 {
    font-size: 26px;
  }

  .makale-basi {
    padding: 48px 0 36px;
  }

  .makale-basi__ozet {
    font-size: 18px;
  }

  .makale-gorsel {
    margin-bottom: 40px;
  }

  .icerik-govdesi {
    font-size: 17px;
  }

  .icerik-govdesi h2 {
    font-size: 26px;
  }

  .icerik-govdesi h3 {
    font-size: 21px;
  }

  .alignleft,
  .alignright {
    float: none;
    margin: 0 0 1em;
  }

  .yazi-gecisi {
    grid-template-columns: 1fr;
  }

  .yazi-gecisi .sonraki {
    grid-column: auto;
  }

  .yorum-listesi .children {
    margin-left: 14px;
  }

  .alt-bilgi {
    padding-top: 40px;
  }

  .alt-bilgi__sutunlar {
    gap: 28px 20px;
  }

  .alt-bilgi__sutunlar > div:first-child {
    grid-column: 1 / -1;
  }

  .alt-bilgi__alt {
    flex-direction: column;
  }
}

@media (max-width: 380px) {
  .marka__kurum {
    display: none;
  }

  .marka__ad {
    font-size: 13px;
  }

  .marka__logo {
    width: 34px;
    height: 34px;
  }

  .karsilama h1,
  .karsilama__baslik {
    font-size: 30px;
  }

  .rakam__deger {
    font-size: 44px;
  }

  .kategoriler {
    grid-template-columns: 1fr;
  }

  .sayfa-basi__rakamlar {
    gap: 20px;
  }

  .sayfa-basi__rakamlar b {
    font-size: 26px;
  }
}

/* Yazdırma
   ----------------------------------------- */
@media print {
  .ust-serit,
  .site-basligi,
  .mobil-menu,
  .arama-paneli,
  .alt-bilgi,
  .yukari-cik,
  .sayfa-ici-menu,
  .arac-cubugu,
  .kategoriler,
  .paylas,
  .yazi-gecisi,
  .yorumlar,
  .icerige-gec {
    display: none !important;
  }

  body {
    font-size: 11pt;
    color: #000;
  }

  .sayfa-basi,
  .bolum,
  .icerik,
  .rakamlar {
    padding: 16pt 0;
    background: none;
    color: #000;
  }

  .rakam__deger {
    background: none;
    color: #000;
  }

  .yan-duzen,
  .detay-duzen,
  .profil {
    display: block;
  }

  .cihaz-tablosu,
  .yayin-karti,
  .kisi {
    background: none;
    break-inside: avoid;
  }

  .js .belir {
    opacity: 1;
    transform: none;
  }

  a[href^="http"]:not(.doi-baglanti)::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #555;
  }
}
