/* =============================================================================
   Obsidyen — ön yüz stilleri
   Kural: yükseklik gölgeyle değil, yüzey rengiyle anlatılır.
          Kromatik renkler yalnız tam dolgulu kartlarda kullanılır.
          Gösteri başlıkları asla kalınlaştırılmaz (ağırlık 300).
   ========================================================================== */

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

body {
  margin: 0;
  background: var(--color-obsidian);
  color: var(--color-ash);
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  font-weight: var(--font-weight-regular);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

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

a { color: var(--color-cloud); text-decoration: none; transition: color var(--gecis-hizli), opacity var(--gecis-hizli); }
a:hover { color: var(--color-pure); }

:focus-visible { outline: 2px solid var(--color-pure); outline-offset: 3px; border-radius: 4px; }

.gizli-metin {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.atla {
  position: absolute; left: -9999px; top: 12px; z-index: 200;
  background: var(--color-pure); color: var(--color-void);
  padding: 10px 18px; border-radius: var(--radius-buttons); font-size: var(--text-body-sm);
}
.atla:focus { left: 12px; }

/* --- Kapsayıcı ----------------------------------------------------------- */
.kapsa { width: 100%; max-width: var(--page-max-width); margin-inline: auto; padding-inline: 24px; }
.tam-genislik { width: 100%; }

/* --- Tipografi ----------------------------------------------------------- */
.gosteri {
  font-family: var(--font-display);
  font-weight: var(--font-weight-light);
  color: var(--color-pure);
  margin: 0;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.gosteri em { font-style: italic; }
.gosteri--display    { font-size: var(--text-display);    line-height: var(--leading-display); }
.gosteri--display-sm { font-size: var(--text-display-sm); line-height: var(--leading-display-sm); }
.gosteri--heading-lg { font-size: var(--text-heading-lg); line-height: var(--leading-heading-lg); }

.etiket {
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: var(--leading-mono-label);
  letter-spacing: 0.182em;
  text-transform: uppercase;
  color: var(--color-fog);
  margin: 0 0 var(--spacing-12);
}
.etiket a { color: inherit; }

.rozet {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--text-mono-label);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #fafafa;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: var(--radius-pill);
  padding: 8px 24px;
  margin: 0 0 var(--spacing-24);
}

.onculuk { font-size: var(--text-subheading); font-weight: var(--font-weight-light); line-height: var(--leading-subheading); color: var(--color-ash); }
p { margin: 0 0 var(--spacing-16); }
p:last-child { margin-bottom: 0; }

/* --- Düğmeler ------------------------------------------------------------ */
.dugme {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-sans); font-size: var(--text-body); font-weight: var(--font-weight-regular);
  padding: 12px 18px; border-radius: var(--radius-buttons);
  border: 1px solid transparent; cursor: pointer; text-align: center;
  transition: background-color var(--gecis-hizli), color var(--gecis-hizli), border-color var(--gecis-hizli), opacity var(--gecis-hizli);
}
.dugme--birincil { background: var(--color-pure); color: var(--color-void); }
.dugme--birincil:hover { background: var(--color-cloud); color: var(--color-void); }
.dugme--hayalet { background: transparent; color: var(--color-pure); border-color: rgba(255,255,255,.7); }
.dugme--hayalet:hover { background: rgba(255,255,255,.08); color: var(--color-pure); }
.dugme--buyuk { padding: 15px 26px; }
.dugme--tam { width: 100%; justify-content: center; }

/* Ok işareti — yazı tipinde olmadığı için çizim olarak basılır */
.ok {
  width: 15px; height: 12px; flex: none; font-size: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 16'%3E%3Cpath d='M11.3 0 9.9 1.4 16.5 8H0v2h16.5l-6.6 6.6 1.4 1.4L20 9z'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 16'%3E%3Cpath d='M11.3 0 9.9 1.4 16.5 8H0v2h16.5l-6.6 6.6 1.4 1.4L20 9z'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform var(--gecis-hizli);
}
.dugme:hover .ok, a:hover > .ok { transform: translateX(3px); }

/* --- Üst çubuk (buzlu cam) ----------------------------------------------- */
.ust { position: sticky; top: 0; z-index: 100; padding: 12px 24px; }
.ust__cam {
  max-width: var(--page-max-width); margin-inline: auto;
  display: flex; align-items: center; gap: var(--spacing-16);
  padding: 10px 10px 10px 18px;
  background: rgba(15, 16, 17, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-cards);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
}
.ust--kaydi .ust__cam { background: rgba(9, 10, 11, 0.88); }

.marka { display: flex; align-items: center; gap: 10px; margin-right: auto; color: var(--color-pure); }
.marka__logo { max-height: 30px; width: auto; }
.marka__ad { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 20px; letter-spacing: -0.01em; }
.marka__isaret { width: 10px; height: 10px; border-radius: 50%; background: var(--color-iris-gleam); flex: none; }

.ust__gezinti { display: flex; align-items: center; gap: 6px; }
.nav-dugme {
  font-size: var(--text-body-sm); color: var(--color-cloud);
  padding: 9px 12px; border-radius: var(--radius-navitems);
  border: 1px solid transparent; transition: background-color var(--gecis-hizli), border-color var(--gecis-hizli);
}
.nav-dugme:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.18); }
.nav-dugme--aktif { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.25); color: var(--color-pure); }

.ust__eylem { display: flex; align-items: center; gap: 10px; }
.ust__eylem .dugme { padding: 10px 16px; font-size: var(--text-body-sm); }
.ust__menu {
  display: none; width: 40px; height: 40px; background: transparent;
  border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius-navitems);
  cursor: pointer; padding: 0; place-items: center; gap: 5px;
}
.ust__cizgi { display: block; width: 16px; height: 1px; background: var(--color-pure); transition: transform var(--gecis-hizli), opacity var(--gecis-hizli); }
.ust__menu[aria-expanded="true"] .ust__cizgi:first-child { transform: translateY(3px) rotate(45deg); }
.ust__menu[aria-expanded="true"] .ust__cizgi:last-child  { transform: translateY(-3px) rotate(-45deg); }

.mobil {
  max-width: var(--page-max-width); margin: 8px auto 0;
  background: rgba(9,10,11,.96); border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-cards); padding: 12px;
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
}
.mobil nav { display: flex; flex-direction: column; }
.mobil a { padding: 12px 14px; border-radius: var(--radius-navitems); font-size: var(--text-body); }
.mobil a:hover { background: rgba(255,255,255,.06); }
.mobil .dugme { margin-top: 8px; }

/* --- Bölüm iskeleti ------------------------------------------------------ */
.bolum { padding-block: var(--section-gap); }
.bolum--bos { min-height: 60vh; display: grid; place-items: center; text-align: center; }
.bosluk--tight { padding-block: var(--spacing-40); }
.bosluk--loose { padding-block: var(--spacing-140); }
.yuzey--obsidian { background: var(--color-obsidian); }
.yuzey--abyss    { background: var(--color-abyss); }
.yuzey--graphite { background: var(--color-graphite); }
.yuzey--silver   { background: var(--color-silver); color: var(--color-void); }
.yuzey--silver .gosteri, .yuzey--silver a { color: var(--color-void); }
.yuzey--silver .etiket { color: #4a4a4a; }

.bolum__bas { max-width: 760px; margin-bottom: var(--spacing-48); }
.bolum--kartlar .bolum__bas, .bolum--adimlar .bolum__bas, .bolum--sss .bolum__bas,
.bolum--akis .bolum__bas, .bolum--iletisim .bolum__bas { margin-inline: auto; text-align: center; }
.bolum__bas--yatay {
  max-width: none; display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--spacing-24); text-align: left;
}
.bolum__giris { margin-top: var(--spacing-20); font-size: var(--text-subheading); font-weight: var(--font-weight-light); }
.bos-not { color: var(--color-fog); }

/* --- Kahraman ------------------------------------------------------------ */
.kahraman { position: relative; padding-block: 140px 120px; overflow: hidden; }
.kahraman--gokyuzu { background: var(--grad-gok); }
/* Gökyüzü degradesi tek başına metni yutuyor: üstte koyu perde, altta tuvale erime */
.kahraman--gokyuzu::before {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg,
    rgba(15,16,17,.88) 0%, rgba(15,16,17,.62) 30%,
    rgba(15,16,17,.55) 62%, rgba(15,16,17,.92) 88%, var(--color-obsidian) 100%);
}
.kahraman__zemin { position: absolute; inset: 0; z-index: 0; }
.kahraman__zemin img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.75) brightness(.85); }
.kahraman__perde {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(15,16,17,.55) 0%, rgba(15,16,17,.35) 45%, var(--color-obsidian) 100%);
}
.kahraman__ic { position: relative; z-index: 1; }
.kahraman--center .kahraman__ic { text-align: center; }
.kahraman--center .kahraman__alt, .kahraman--center .eylemler { margin-inline: auto; }
.kahraman__alt { max-width: 560px; margin-top: var(--spacing-24); }
.eylemler { display: flex; flex-wrap: wrap; gap: var(--element-gap); margin-top: var(--spacing-40); }
.kahraman--center .eylemler { justify-content: center; }

/* --- Izgara ve renkli kartlar -------------------------------------------- */
.izgara { display: grid; gap: var(--element-gap); }
.izgara--1 { grid-template-columns: 1fr; }
.izgara--2 { grid-template-columns: repeat(2, 1fr); }
.izgara--3 { grid-template-columns: repeat(3, 1fr); }
.izgara--4 { grid-template-columns: repeat(4, 1fr); }

.kart {
  display: flex; flex-direction: column; gap: var(--spacing-12);
  padding: var(--card-padding); border-radius: var(--radius-featurecards);
  background: var(--color-graphite); color: var(--color-pure);
  min-height: 240px; transition: transform var(--gecis-hizli), filter var(--gecis-hizli);
}
a.kart:hover { transform: translateY(-3px); filter: brightness(1.06); color: var(--color-pure); }
.kart__baslik { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: var(--text-heading-lg); line-height: var(--leading-heading-lg); margin: 0; letter-spacing: -0.01em; }
.kart__metin { font-size: var(--text-body); color: inherit; opacity: .88; }
.kart__bag { margin-top: auto; padding-top: var(--spacing-16); display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-body-sm); }

.kart--iris-gleam   { background: var(--color-iris-gleam); }
.kart--cyan-signal  { background: var(--color-cyan-signal); }
.kart--pale-iris    { background: var(--color-pale-iris);   color: var(--color-void); }
.kart--deep-iris    { background: var(--color-deep-iris); }
.kart--orchid-bloom { background: var(--color-orchid-bloom); color: var(--color-void); }
.kart--periwinkle   { background: var(--color-periwinkle);  color: var(--color-void); }
.kart--silver       { background: var(--color-silver);      color: var(--color-void); }
.kart--sade         { background: var(--color-graphite); }
.kart--sade:hover   { background: var(--color-steel); }

/* --- Ters (açık) kart ---------------------------------------------------- */
.ters-kart {
  background: var(--color-silver); color: var(--color-void);
  border-radius: var(--radius-featurecards); padding: var(--spacing-60) var(--card-padding);
  text-align: center;
}
.ters-kart__baslik { color: var(--color-void); max-width: 720px; margin-inline: auto; }
.ters-kart__metin { margin-top: var(--spacing-20); color: #3a3a3a; max-width: 620px; margin-inline: auto; }
.rakamlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--spacing-32); margin: var(--spacing-48) 0 0; }
.rakam { text-align: center; }
.rakam__deger { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 56px; line-height: 1; color: var(--color-void); margin: 0; }
.rakam__etiket { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #4a4a4a; margin: 12px 0 0; }

/* --- Adımlar ------------------------------------------------------------- */
.adimlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: rgba(255,255,255,.08); border-radius: var(--radius-cards); overflow: hidden; }
.adim { display: flex; gap: var(--spacing-24); padding: var(--spacing-32); background: var(--color-obsidian); }
.adim__no { font-family: var(--font-mono); font-size: var(--text-mono-label); letter-spacing: .16em; color: var(--color-iris-gleam); padding-top: 6px; flex: none; }
.adim__baslik { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 26px; line-height: 1.15; color: var(--color-pure); margin: 0 0 10px; }
.adim__metin { color: var(--color-ash); }

/* --- Serbest metin ------------------------------------------------------- */
.metin--narrow { max-width: var(--okuma-genislik); }
.metin--wide   { max-width: var(--page-max-width); }
.zengin { margin-top: var(--spacing-24); font-size: var(--text-body); color: var(--color-ash); }
.metin--two .zengin { columns: 2; column-gap: var(--spacing-48); }
.zengin h2, .zengin h3, .zengin h4 { font-family: var(--font-display); font-weight: var(--font-weight-light); color: var(--color-pure); line-height: 1.2; margin: var(--spacing-32) 0 var(--spacing-12); }
.zengin h2 { font-size: 30px; } .zengin h3 { font-size: 24px; } .zengin h4 { font-size: 20px; }
.zengin ul, .zengin ol { padding-left: 22px; margin: 0 0 var(--spacing-16); }
.zengin li { margin-bottom: 8px; }
.zengin a { text-decoration: underline; text-underline-offset: 3px; }
.zengin blockquote { margin: var(--spacing-24) 0; padding-left: var(--spacing-20); border-left: 1px solid rgba(255,255,255,.2); color: var(--color-cloud); font-size: var(--text-subheading); font-weight: var(--font-weight-light); }
.zengin table { width: 100%; border-collapse: collapse; margin: var(--spacing-24) 0; font-size: var(--text-body-sm); }
.zengin th, .zengin td { border-bottom: 1px solid rgba(255,255,255,.12); padding: 10px 12px; text-align: left; }
.zengin th { color: var(--color-cloud); font-weight: var(--font-weight-medium); }
.zengin img { border-radius: var(--radius-cards); margin: var(--spacing-24) 0; }
.zengin hr { border: 0; border-top: 1px solid rgba(255,255,255,.12); margin: var(--spacing-32) 0; }
.yuzey--silver .zengin { color: #3a3a3a; }

/* --- SSS ----------------------------------------------------------------- */
.sss { max-width: 860px; margin-inline: auto; border-top: 1px solid rgba(255,255,255,.12); }
.sss__oge { border-bottom: 1px solid rgba(255,255,255,.12); }
.sss__soru {
  display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-20);
  padding: var(--spacing-24) 0; cursor: pointer; list-style: none;
  font-size: var(--text-subheading); font-weight: var(--font-weight-light); color: var(--color-pure);
}
.sss__soru::-webkit-details-marker { display: none; }
.sss__isaret { position: relative; width: 14px; height: 14px; flex: none; }
.sss__isaret::before, .sss__isaret::after { content: ''; position: absolute; background: var(--color-ash); transition: transform var(--gecis-hizli); }
.sss__isaret::before { top: 6px; left: 0; width: 14px; height: 1px; }
.sss__isaret::after  { left: 6px; top: 0; width: 1px; height: 14px; }
.sss__oge[open] .sss__isaret::after { transform: scaleY(0); }
.sss__cevap { padding: 0 0 var(--spacing-24); max-width: 720px; color: var(--color-ash); }

/* --- Eylem çağrısı ------------------------------------------------------- */
.cagri__ic { text-align: center; }
.cagri__metin { margin: var(--spacing-24) auto 0; max-width: 560px; }
.cagri__ic .dugme { margin-top: var(--spacing-40); }

/* --- Güven şeridi -------------------------------------------------------- */
.guven__ust { text-align: center; }
.guven { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--spacing-48); }
.defne { display: flex; align-items: center; gap: 10px; color: var(--color-cloud); }
.defne__ic { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.defne__ad { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: var(--text-subheading); }
.defne__not { font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--color-fog); }
.defne__logo { max-height: 34px; width: auto; opacity: .9; }
.defne__dal { width: 14px; height: 42px; opacity: .55; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 42'%3E%3Cpath d='M12 2C6 8 3 16 3 24s3 13 9 16c-4-5-6-10-6-16s2-13 6-22z'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 42'%3E%3Cpath d='M12 2C6 8 3 16 3 24s3 13 9 16c-4-5-6-10-6-16s2-13 6-22z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.defne__dal--sag { transform: scaleX(-1); }

/* --- Görsel şeridi ------------------------------------------------------- */
.serit { background: var(--grad-krom); border-radius: var(--radius-cards); padding: var(--spacing-60); display: grid; gap: var(--spacing-48); align-items: center; }
.serit--center { text-align: center; justify-items: center; }
.serit--left  { grid-template-columns: 1fr 1fr; }
.serit--right { grid-template-columns: 1fr 1fr; }
.serit--right .serit__yazi { order: -1; }
.serit__metin { margin-top: var(--spacing-20); }
.serit__gorsel img { border-radius: var(--radius-cards); width: 100%; }

/* --- Yazı kartları ------------------------------------------------------- */
.yazi-kart {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--color-graphite); border-radius: var(--radius-cards);
  padding: var(--spacing-24); color: var(--color-cloud);
  transition: background-color var(--gecis-hizli), transform var(--gecis-hizli);
}
.yazi-kart:hover { background: var(--color-steel); transform: translateY(-3px); }
.yazi-kart__gorsel { display: block; margin: calc(var(--spacing-24) * -1) calc(var(--spacing-24) * -1) var(--spacing-8); border-radius: var(--radius-cards) var(--radius-cards) 0 0; overflow: hidden; }
.yazi-kart__gorsel img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.yazi-kart__ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.yazi-kart__ust .etiket { margin: 0; }
.yazi-kart__tarih { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; color: var(--color-fog); }
.yazi-kart__baslik { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 24px; line-height: 1.2; color: var(--color-pure); }
.yazi-kart__ozet { font-size: var(--text-body-sm); color: var(--color-ash); }

.sayfalama { display: flex; gap: 8px; justify-content: center; margin-top: var(--spacing-48); }
.sayfalama__no { padding: 8px 14px; border-radius: var(--radius-navitems); border: 1px solid rgba(255,255,255,.15); font-size: var(--text-body-sm); }
.sayfalama__no--aktif { background: var(--color-pure); color: var(--color-void); border-color: var(--color-pure); }

.bolum--bas-alan { padding-block: 140px var(--spacing-40); }
.bolum--yazi { padding-block: 140px var(--section-gap); }
.yazi__tarih { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--color-fog); margin-top: var(--spacing-16); }
.yazi__kapak { margin: var(--spacing-32) 0; }
.yazi__kapak img { border-radius: var(--radius-cards); width: 100%; }
.yazi__geri { margin-top: var(--spacing-48); }

/* --- Kurum duyuru akışı -------------------------------------------------- */
.akis-kart { display: flex; flex-direction: column; background: var(--color-graphite); border-radius: var(--radius-cards); padding: var(--spacing-24); }
.akis-kart__bas { display: flex; align-items: baseline; gap: 10px; margin-bottom: var(--spacing-20); }
.akis-kart__kisa { font-family: var(--font-mono); font-size: 11px; font-weight: var(--font-weight-medium); letter-spacing: .16em; color: var(--color-cyan-signal); }
.akis-kart__ad { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 20px; color: var(--color-pure); margin: 0; }
.akis-kart__liste { flex: 1; }
.akis-kart__bos { font-size: var(--text-body-sm); color: var(--color-fog); }
.akis-kart__tumu { display: inline-flex; align-items: center; gap: 8px; margin-top: var(--spacing-20); font-size: var(--text-body-sm); color: var(--color-ash); }
.akis { list-style: none; margin: 0; padding: 0; }
.akis__oge { border-top: 1px solid rgba(255,255,255,.1); }
.akis__oge:first-child { border-top: 0; }
.akis__oge a { display: grid; gap: 4px; padding: 12px 0; }
.akis__tarih { font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; color: var(--color-fog); }
.akis__baslik { font-size: var(--text-body-sm); line-height: 1.45; color: var(--color-cloud); }
.akis__birim { font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--color-fog); }
.akis-not { margin-top: var(--spacing-24); font-size: var(--text-body-sm); color: var(--color-fog); text-align: center; }

/* --- İletişim ve form ---------------------------------------------------- */
.iletisim--ikili { display: grid; grid-template-columns: 340px 1fr; gap: var(--spacing-60); align-items: start; }
.iletisim__satir { margin-bottom: var(--spacing-24); }
.iletisim__satir .etiket { margin-bottom: 6px; }
.iletisim__harita { margin-top: var(--spacing-32); }

.form { display: grid; gap: var(--spacing-20); }
.form__ikili { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-20); }
.form__gizli { position: absolute; left: -9999px; }
.alan { display: grid; gap: 8px; }
.alan__ad { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--color-fog); }
.alan input, .alan textarea, .alan select {
  width: 100%; font-family: var(--font-sans); font-size: var(--text-body); color: var(--color-cloud);
  background: var(--color-void); border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-inputs); padding: 12px 16px;
  transition: border-color var(--gecis-hizli), background-color var(--gecis-hizli);
}
.alan textarea { resize: vertical; min-height: 120px; }
.alan input:focus, .alan textarea:focus { border-color: rgba(255,255,255,.45); outline: none; }
.alan input::placeholder, .alan textarea::placeholder { color: var(--color-fog); }
.onay { display: flex; gap: 12px; align-items: flex-start; font-size: var(--text-body-sm); color: var(--color-ash); }
.onay input { margin-top: 3px; accent-color: var(--color-iris-gleam); }
.form__not { font-size: var(--text-body-sm); color: var(--color-fog); }
.form .dugme { justify-self: start; }

/* --- Bildirimler --------------------------------------------------------- */
.bildirimler { position: fixed; z-index: 150; left: 50%; top: 88px; transform: translateX(-50%); display: grid; gap: 8px; width: min(92vw, 520px); }
.bildirim { padding: 14px 18px; border-radius: var(--radius-cards); font-size: var(--text-body-sm); background: var(--color-graphite); color: var(--color-cloud); border: 1px solid rgba(255,255,255,.12); }
.bildirim--basari { background: var(--color-pure); color: var(--color-void); border-color: var(--color-pure); }
.bildirim--hata   { background: #2a1618; color: #ffd9dc; border-color: #5a2a2f; }

/* --- Alt bilgi ----------------------------------------------------------- */
.alt { background: var(--color-abyss); padding-block: var(--spacing-60) var(--spacing-32); margin-top: var(--spacing-40); }
.alt__ust { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--spacing-48); }
.alt__ad { font-family: var(--font-display); font-weight: var(--font-weight-light); font-size: 24px; color: var(--color-pure); margin: 0 0 12px; }
.alt__not { font-size: var(--text-body-sm); max-width: 320px; }
.alt__sosyal { display: flex; flex-wrap: wrap; gap: 16px; margin-top: var(--spacing-20); font-size: var(--text-body-sm); }
.alt__gezinti { display: flex; flex-direction: column; gap: 10px; font-size: var(--text-body-sm); }
.alt__gezinti .etiket { margin-bottom: 4px; }
.alt__iletisim { font-size: var(--text-body-sm); }
.alt__iletisim p { margin-bottom: 8px; }
.alt__satir--sessiz { color: var(--color-fog); }
.alt__cizgi { height: 1px; background: rgba(255,255,255,.1); margin: var(--spacing-48) 0 var(--spacing-24); }
.alt__son { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; font-size: var(--text-body-sm); color: var(--color-fog); }
.alt__son p { margin: 0; }
.alt__kunye { color: var(--color-fog); }

/* --- WhatsApp düğmesi ---------------------------------------------------- */
.wa {
  position: fixed; right: 20px; bottom: 20px; z-index: 90;
  width: 52px; height: 52px; display: grid; place-items: center;
  border-radius: var(--radius-pill); background: var(--color-pure); color: var(--color-void);
  box-shadow: var(--shadow-lg);
}
.wa:hover { background: var(--color-cloud); color: var(--color-void); }

/* =============================================================================
   Duyarlılık
   ========================================================================== */
@media (max-width: 1100px) {
  :root { --text-display: 72px; --text-display-sm: 60px; --text-heading-lg: 32px; --section-gap: 64px; }
  .izgara--4 { grid-template-columns: repeat(2, 1fr); }
  .iletisim--ikili { grid-template-columns: 1fr; gap: var(--spacing-40); }
}

@media (max-width: 900px) {
  .ust__gezinti { display: none; }
  .ust__menu { display: inline-grid; }
  .izgara--3, .izgara--2 { grid-template-columns: repeat(2, 1fr); }
  .alt__ust { grid-template-columns: 1fr 1fr; }
  .serit--left, .serit--right { grid-template-columns: 1fr; }
  .serit--right .serit__yazi { order: 0; }
  .metin--two .zengin { columns: 1; }
  .bolum__bas--yatay { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 640px) {
  :root {
    --text-display: 46px; --text-display-sm: 42px; --text-heading-lg: 28px;
    --section-gap: 48px; --card-padding: 24px; --page-max-width: 100%;
  }
  .kapsa { padding-inline: 18px; }
  .ust { padding: 8px 12px; }
  .ust__eylem .dugme { display: none; }
  .izgara--2, .izgara--3, .izgara--4 { grid-template-columns: 1fr; }
  .alt__ust { grid-template-columns: 1fr; gap: var(--spacing-32); }
  .kahraman { padding-block: 110px 80px; }
  .bolum--bas-alan, .bolum--yazi { padding-top: 110px; }
  .form__ikili { grid-template-columns: 1fr; }
  .adim { flex-direction: column; gap: 12px; padding: var(--spacing-24); }
  .ters-kart { padding: var(--spacing-40) var(--spacing-24); }
  .rakam__deger { font-size: 42px; }
  .serit { padding: var(--spacing-32); }
  .guven { gap: var(--spacing-24); }
  .bildirimler { top: 76px; }
}

@media print {
  .ust, .alt, .wa, .bildirimler { display: none !important; }
  body { background: #fff; color: #000; }
}