/* ==========================================================================
   AKEN — Akdeniz Kalkınma Enstitüsü
   Tasarım dili: "Harita Odası" — deniz haritası hassasiyeti, kurumsal lacivert,
   editorial serif + mühendislik sans/mono. Tüm görsel malzeme prosedürel SVG/CSS.
   ========================================================================== */

/* ---------- Tokenlar ---------- */
:root {
  /* Renk: logodan türetilmiş palet — derinleştirilmiş gece tonları */
  --ink:        #0E1B33;  /* metin — mürekkep laciverdi */
  --navy:       #12234A;  /* birincil lacivert */
  --navy-deep:  #0A1526;  /* koyu zemin bölümleri */
  --abyss:      #060D18;  /* en koyu katman — preloader, CTA */
  --sea:        #3060A0;  /* deniz mavisi (logo dalgası) */
  --sea-strong: #27508A;
  --mist:       #CBD9E9;  /* sis mavisi — ince çizgiler, kontur */
  --line:       #DFE6EF;  /* hairline */
  --paper:      #F5F7FA;  /* soğuk harita kağıdı */
  --white:      #FFFFFF;
  --accent:      #2F5A93;  /* aksan — logo dalga mavisinin koyusu */
  --accent-soft: #8FB2DC;  /* koyu zeminde aksan */
  --brass:       #C9A96A;  /* harita pirinci — yalnızca mikro detaylarda */

  /* Koyu zemin metinleri */
  --fog:        #E6EDF5;
  --fog-dim:    #A9BAD1;
  --line-dark:  rgba(233, 238, 245, .16);

  /* Işık ve derinlik */
  --aurora:       rgba(143, 178, 220, .13);
  --glow:         0 0 44px -14px rgba(48, 96, 160, .5);
  --shadow-card:  0 16px 36px -26px rgba(6, 13, 24, .3);
  --shadow-lift:  0 30px 58px -30px rgba(6, 13, 24, .42);

  /* Tipografi */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-sans: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", Consolas, "Courier New", monospace;

  --fs-hero:  clamp(3rem, 8vw, 5.75rem);
  --fs-h1:    clamp(2.4rem, 5vw, 4rem);
  --fs-h2:    clamp(2rem, 3.6vw, 2.75rem);
  --fs-h3:    clamp(1.25rem, 2vw, 1.5rem);
  --fs-lead:  clamp(1.125rem, 1.6vw, 1.3125rem);

  /* Ritim */
  --space-section: clamp(4.5rem, 10vw, 8rem);
  --container: 1240px;
  --gutter: clamp(1.25rem, 5vw, 3rem);

  --ease: cubic-bezier(.22, .61, .21, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
}

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

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

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin: 0 0 1rem;
  text-wrap: balance;
}

p { margin: 0 0 1.25rem; }
p:last-child { margin-bottom: 0; }

a { color: var(--sea-strong); text-decoration: none; }
a:hover { color: var(--navy); }

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

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

::selection { background: var(--navy); color: var(--white); }

:focus-visible {
  outline: 2px solid var(--sea);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ---------- Yardımcılar ---------- */
.container {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  background: var(--navy);
  color: var(--white);
  padding: .75rem 1.25rem;
  font-family: var(--font-mono);
  font-size: .8125rem;
}
.skip-link:focus {
  left: 0;
  color: var(--white);
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: none;
  color: var(--accent);
  margin-bottom: 1.5rem;
}
.eyebrow::before {
  content: "";
  width: 2.25rem;
  height: 1px;
  background: var(--accent);
  flex: none;
}

.lead {
  font-size: var(--fs-lead);
  line-height: 1.7;
  color: #2C3E5E;
}

/* Scroll reveal — yalnızca JS çalışıyorsa gizle (progressive enhancement) */
html.js .reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
  transition-delay: var(--reveal-delay, 0s);
}
html.js .reveal.in-view {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  html.js .reveal { opacity: 1; transform: none; }
}

/* Grativür / cetvel şeridi — imza motif */
.graticule {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding-block: .875rem;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .18em;
  text-transform: none;
  color: #64789A;
  overflow: hidden;
}
.graticule::before,
.graticule::after {
  content: "";
  flex: 1 1 0;
  height: 8px;
  background-image: repeating-linear-gradient(
    to right,
    var(--mist) 0, var(--mist) 1px, transparent 1px, transparent 12px
  );
  background-position: bottom;
  background-size: 100% 5px;
  background-repeat: no-repeat;
}
.graticule span { flex: none; }

/* Butonlar */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: .9375rem 1.75rem;
  border: 1px solid var(--navy);
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: none;
  color: var(--navy);
  background: transparent;
  cursor: pointer;
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn .btn-arrow { transition: transform .3s var(--ease); }
.btn:hover { background: var(--navy); color: var(--white); }
.btn:hover .btn-arrow { transform: translateX(4px); }

.btn--solid { background: var(--navy); color: var(--white); }
.btn--solid:hover { background: var(--sea-strong); border-color: var(--sea-strong); }

.btn--light { border-color: var(--fog); color: var(--fog); }
.btn--light:hover { background: var(--fog); color: var(--navy-deep); }

.arrow-link {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  font-family: var(--font-mono);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: none;
  color: var(--navy);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}
.arrow-link .btn-arrow { transition: transform .3s var(--ease); }
.arrow-link:hover { border-bottom-color: var(--accent); color: var(--navy); }
.arrow-link:hover .btn-arrow { transform: translateX(4px); }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(245, 247, 250, .92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s var(--ease), background .3s var(--ease);
}
.site-header.is-scrolled {
  border-bottom-color: var(--line);
  background: rgba(245, 247, 250, .97);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-block: 1rem;
}

/* Marka kilidi — verilen logo görseli */
.brand {
  display: inline-flex;
  align-items: center;
}
.brand-img {
  height: 54px;
  width: auto;
  display: block;
}
.brand-img--light { display: none; }

/* Navigasyon */
.site-nav { display: flex; align-items: center; }

.nav-list {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.2vw, 2rem);
}

.nav-link,
.sub-toggle {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: none;
  color: var(--ink);
  background: none;
  border: none;
  padding: .5rem 0;
  cursor: pointer;
  position: relative;
}
.nav-link::after,
.sub-toggle::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s var(--ease);
}
.nav-link:hover::after,
.nav-link[aria-current="page"]::after,
.has-sub.is-current > .sub-toggle::after,
.sub-toggle:hover::after {
  transform: scaleX(1);
}
.nav-link:hover, .sub-toggle:hover { color: var(--navy); }

.sub-toggle .caret {
  width: 8px;
  height: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .3s var(--ease);
  flex: none;
}

.has-sub { position: relative; }

.sub-menu {
  position: absolute;
  top: calc(100% + .75rem);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 250px;
  background: var(--white);
  border: 1px solid var(--line);
  border-top: 2px solid var(--navy);
  padding: .625rem 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  box-shadow: 0 18px 40px -20px rgba(12, 24, 48, .25);
}
.has-sub.open .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.has-sub.open .sub-toggle .caret { transform: rotate(225deg) translateY(-2px); }

.sub-menu a {
  display: block;
  padding: .625rem 1.375rem;
  font-family: var(--font-sans);
  font-size: .875rem;
  color: var(--ink);
  letter-spacing: .01em;
}
.sub-menu a:hover,
.sub-menu a[aria-current="page"] {
  background: var(--paper);
  color: var(--navy);
  box-shadow: inset 3px 0 0 var(--accent);
}

/* Mobil nav düğmesi */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 10px;
  background: none;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
}
@media (max-width: 480px) {
  .brand-img { height: 42px; }
}

.nav-toggle .bar {
  display: block;
  height: 1.5px;
  width: 100%;
  background: var(--navy);
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.nav-toggle[aria-expanded="true"] .bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

@media (max-width: 1120px) {
  .nav-toggle,
  .site-header .brand {
    position: relative;
    z-index: 110;
  }
  .nav-toggle { display: flex; }

  /* Menü açıkken: koyu overlay üstünde beyaz logo, şeffaf header */
  html.nav-open .site-header {
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
  }
  html.nav-open .brand-img--navy { display: none; }
  html.nav-open .brand-img--light { display: block; }
  html.nav-open .nav-toggle { border-color: var(--line-dark); }
  html.nav-open .nav-toggle .bar { background: var(--fog); }

  .site-nav {
    position: fixed;
    inset: 0;
    top: 0;
    z-index: -1;
    background: var(--navy-deep);
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s var(--ease), visibility .35s;
    overflow-y: auto;
    padding: 7.5rem var(--gutter) 3rem;
  }
  .site-nav.open {
    opacity: 1;
    visibility: visible;
    z-index: 90;
  }

  .nav-list {
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
    width: 100%;
  }
  .nav-list > li {
    width: 100%;
    border-bottom: 1px solid var(--line-dark);
  }
  .nav-link, .sub-toggle {
    width: 100%;
    justify-content: space-between;
    padding: 1.125rem 0;
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: none;
    color: var(--fog);
  }
  .nav-link::after, .sub-toggle::after { display: none; }
  .nav-link:hover, .sub-toggle:hover { color: var(--white); }
  .nav-link[aria-current="page"] { color: var(--accent-soft); }

  .sub-menu {
    position: static;
    transform: none;
    min-width: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0 0 1rem 1.25rem;
    display: none;
    opacity: 1;
    visibility: visible;
  }
  .has-sub.open .sub-menu { display: block; transform: none; }
  .sub-menu a {
    padding: .625rem 0;
    color: var(--fog-dim);
    font-size: 1.0625rem;
  }
  .sub-menu a:hover, .sub-menu a[aria-current="page"] {
    background: transparent;
    color: var(--accent-soft);
    box-shadow: none;
  }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer {
  background: var(--navy-deep);
  color: var(--fog-dim);
  margin-top: var(--space-section);
}
.page-yayinlar .site-footer {
  margin-top: 0;
  border-top: 1px solid var(--line-dark);
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 3rem;
  padding-block: 4.5rem 3.5rem;
}
.footer-brand .brand-img { height: 60px; }
.footer-brand p {
  margin-top: 1.5rem;
  font-size: .875rem;
  line-height: 1.8;
  max-width: 34ch;
}
.footer-col h4 {
  font-family: var(--font-mono);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: none;
  color: var(--accent-soft);
  margin-bottom: 1.375rem;
}
.footer-col li { margin-bottom: .75rem; }
.footer-col a {
  color: var(--fog-dim);
  font-size: .9375rem;
  transition: color .2s;
}
.footer-col a:hover { color: var(--white); }

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid var(--line-dark);
  padding-block: 1.5rem;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .08em;
}
.footer-bottom .coords { color: #6B84A6; }

@media (max-width: 900px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .footer-grid { grid-template-columns: 1fr; gap: 2.25rem; }
}

/* ==========================================================================
   Ana sayfa — hero
   ========================================================================== */
.hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(4rem, 10vw, 7.5rem) 0;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(90rem 42rem at 15% -5%, rgba(203, 217, 233, .38), transparent 62%);
  pointer-events: none;
}
.hero__inner {
  position: relative;
  z-index: 2;
  max-width: 720px;
}
.hero__logo {
  margin: 0 0 2.5rem;
}
.hero__logo img {
  width: min(600px, 100%);
  height: auto;
}
.hero__lead {
  max-width: 58ch;
  margin-bottom: 2.5rem;
}
.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: clamp(3.5rem, 8vw, 6rem);
}

/* Batimetri kontur alanı */
.hero__chart {
  position: absolute;
  top: 0;
  right: -8%;
  width: 62%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
.hero__chart svg { width: 100%; height: 100%; }
@media (max-width: 900px) {
  .hero__chart { opacity: .5; width: 100%; right: -30%; }
}

/* ---------- Ana sayfa bölümleri ---------- */
.section { padding-block: var(--space-section) 0; }

.section-head {
  max-width: 640px;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.section-head h2 { font-size: var(--fs-h2); color: var(--navy); }

/* Enstitü teaser: asimetrik bölünme */
.institute-split {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2.5rem, 6vw, 5.5rem);
  align-items: start;
}
.institute-split .section-head { margin-bottom: 1.75rem; }
@media (max-width: 860px) {
  .institute-split { grid-template-columns: 1fr; }
}

.panel-soft {
  background: var(--white);
  color: var(--ink);
  padding: clamp(2rem, 4vw, 3rem);
  position: relative;
  border: 1px solid var(--line);
  border-radius: 6px;
  box-shadow: 0 26px 52px -34px rgba(12, 24, 48, .3);
  overflow: hidden;
}
.panel-soft::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--accent);
}
.panel-soft > * { position: relative; }
.panel-soft h3 {
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: none;
  color: var(--accent);
  margin-bottom: 1rem;
}
.panel-soft p {
  font-family: var(--font-display);
  font-size: 1.1875rem;
  line-height: 1.6;
  color: var(--navy);
}
.panel-soft .mv-divider {
  height: 1px;
  background: var(--line);
  margin-block: 2rem;
}

/* Odak alanları — defter listesi */
.ledger { border-top: 1px solid var(--line); }
.ledger-row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) auto;
  gap: clamp(1.25rem, 4vw, 3.5rem);
  align-items: center;
  padding-block: 2.25rem;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  transition: background .3s var(--ease);
}
a.ledger-row:hover { background: var(--white); color: var(--ink); }
.ledger-row h3 {
  font-size: var(--fs-h3);
  color: var(--navy);
  margin: 0;
  transition: color .3s;
}
a.ledger-row:hover h3 { color: var(--sea-strong); }
.ledger-row p {
  font-size: .9375rem;
  color: #475A77;
  margin: 0;
}
.ledger-row .row-arrow {
  font-family: var(--font-display);
  font-size: 1.5rem;
  color: var(--mist);
  transition: color .3s, transform .3s var(--ease);
}
a.ledger-row:hover .row-arrow { color: var(--accent); transform: translateX(6px); }
@media (max-width: 760px) {
  .ledger-row { grid-template-columns: 1fr; gap: .625rem; }
  .ledger-row .row-arrow { display: none; }
}

/* Mediterranean Talks bandı */
.talks-band {
  position: relative;
  background: var(--paper);
  color: var(--ink);
  margin-top: var(--space-section);
  padding-block: var(--space-section);
  border-block: 1px solid var(--line);
  overflow: hidden;
}
.talks-band .container {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: center;
}
.talks-band .ghost-year {
  position: absolute;
  right: -1rem;
  bottom: -3rem;
  font-family: var(--font-display);
  font-size: clamp(10rem, 24vw, 20rem);
  font-weight: 600;
  line-height: 1;
  color: rgba(48, 96, 160, .07);
  user-select: none;
  pointer-events: none;
}
.talks-band .eyebrow { color: var(--accent); }
.talks-band .eyebrow::before { background: var(--accent); }
.talks-band h2 {
  color: var(--navy);
  font-size: var(--fs-h2);
  margin-bottom: 1.25rem;
}
.talks-band blockquote {
  margin: 0 0 2.5rem;
  max-width: 46ch;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3.4vw, 2.375rem);
  line-height: 1.35;
  font-weight: 400;
  color: var(--navy);
}
@media (max-width: 860px) {
  .talks-band .container { grid-template-columns: 1fr; }
}

/* Yayınlar teaser + kartlar */
.tile-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2rem;
  color: var(--ink);
  transition: transform .35s var(--ease), border-color .35s, box-shadow .35s var(--ease);
}
.tile:hover {
  transform: translateY(-6px);
  border-color: var(--sea);
  box-shadow: 0 24px 44px -28px rgba(12, 24, 48, .35);
  color: var(--ink);
}
.tile .tile-viz {
  height: 110px;
  display: flex;
  align-items: flex-end;
}
.tile .tile-viz svg { width: 100%; height: 100%; }
.tile h3 {
  font-size: 1.3125rem;
  color: var(--navy);
  margin: 0;
}
.tile p { font-size: .9375rem; color: #475A77; margin: 0; flex: 1; }
.tile .tile-cue {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: none;
  color: var(--accent);
  display: inline-flex;
  gap: .5rem;
}
.tile:hover .tile-cue .btn-arrow { transform: translateX(4px); }
.tile .tile-cue .btn-arrow { transition: transform .3s var(--ease); }
@media (max-width: 860px) {
  .tile-grid { grid-template-columns: 1fr; }
  .tile .tile-viz { height: 90px; }
}

/* ==========================================================================
   İç sayfa hero'su
   ========================================================================== */
.page-hero {
  position: relative;
  padding-block: clamp(3.5rem, 8vw, 6rem) clamp(2.5rem, 5vw, 4rem);
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}
.page-hero h1 {
  font-size: var(--fs-h1);
  color: var(--navy);
  max-width: 18ch;
  margin-bottom: 1.5rem;
}
.page-hero .lead { max-width: 62ch; }
.page-hero .hero-waves {
  position: absolute;
  right: var(--gutter);
  bottom: -14px;
  width: clamp(160px, 22vw, 300px);
  opacity: .16;
  pointer-events: none;
}

.page-hero--dark {
  background: var(--navy-deep);
  border-bottom: none;
}
.page-hero--dark h1 { color: var(--white); }
.page-hero--dark .lead { color: var(--fog-dim); }
.page-hero--dark .eyebrow { color: var(--accent-soft); }
.page-hero--dark .eyebrow::before { background: var(--accent-soft); }

/* İç sayfa hero'su + çerçeveli görsel (harita-odası paspartu) */
.page-hero.has-figure { padding-block: clamp(3rem, 7vw, 5rem) clamp(2.5rem, 5vw, 3.5rem); }
.page-hero__inner {
  display: grid;
  gap: clamp(2rem, 5vw, 3.5rem);
  align-items: center;
}
@media (min-width: 900px) {
  .page-hero.has-figure .page-hero__inner {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  }
  .page-hero.has-figure h1 { max-width: 14ch; }
}
.hero-figure {
  position: relative;
  margin: 0;
  padding: 10px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 28px 55px -32px rgba(12, 24, 48, .42);
}
.hero-figure img {
  width: 100%;
  aspect-ratio: 5 / 6;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}
.hero-figure figcaption {
  position: absolute;
  left: 22px;
  bottom: 22px;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .42rem .72rem;
  font-family: var(--font-mono);
  font-size: .66rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: none;
  color: var(--fog);
  background: rgba(12, 24, 48, .72);
  border: 1px solid rgba(233, 238, 245, .18);
  border-radius: 4px;
  backdrop-filter: blur(4px);
}
.hero-figure figcaption::before {
  content: "";
  width: 6px;
  height: 6px;
  border: 1px solid var(--accent-soft);
  transform: rotate(45deg);
  flex: none;
}
.page-hero--dark .hero-figure {
  background: rgba(233, 238, 245, .05);
  border-color: var(--line-dark);
}
@media (max-width: 899px) {
  .hero-figure { max-width: 560px; }
  .hero-figure img { aspect-ratio: 16 / 10; }
}

/* Ana sayfa — sinematik tam kaplama hero */
.hero--photo {
  display: flex;
  align-items: center;
  min-height: clamp(560px, 82vh, 820px);
  padding-block: clamp(5rem, 10vw, 7.5rem) clamp(3rem, 6vw, 4.5rem);
  background: var(--navy-deep);
}
.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hero--photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(8, 16, 30, .74) 0%, rgba(10, 20, 38, .5) 45%, rgba(12, 24, 48, .72) 100%),
    linear-gradient(90deg, rgba(8, 16, 30, .78) 0%, rgba(8, 16, 30, .28) 55%, rgba(8, 16, 30, .05) 100%);
}
.hero--photo .hero__chart { z-index: 1; opacity: .28; }
.hero--photo .container { position: relative; z-index: 2; }
.hero--photo .hero__inner { max-width: 760px; }
.hero--photo .hero__logo img { width: min(540px, 86%); }
.hero--photo .hero__lead { color: var(--fog); }
.hero--photo .graticule { color: var(--fog-dim); border-color: var(--line-dark); }
.hero--photo .graticule::before,
.hero--photo .graticule::after {
  background-image: repeating-linear-gradient(
    to right, var(--accent-soft) 0, var(--accent-soft) 1px, transparent 1px, transparent 12px);
  opacity: .5;
}
.hero--photo .hero__actions .btn { border-color: var(--fog); color: var(--fog); }
.hero--photo .hero__actions .btn:hover { background: var(--fog); color: var(--navy-deep); }
.hero--photo .hero__actions .btn:first-child {
  background: var(--white);
  color: var(--navy);
  border-color: var(--white);
}
.hero--photo .hero__actions .btn:first-child:hover {
  background: transparent;
  color: var(--fog);
}

/* ==========================================================================
   Enstitü sayfası
   ========================================================================== */
.article {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  gap: clamp(2.5rem, 6vw, 5.5rem);
  padding-top: var(--space-section);
}
.article__head {
  margin-bottom: clamp(2rem, 4vw, 3rem);
}
.article__head h1 {
  max-width: 18ch;
  margin-bottom: 0;
  color: var(--navy);
  font-size: var(--fs-h1);
}
.article__body .lead:first-child {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: var(--navy);
}
.article__body [data-content-body] > p:first-child {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  line-height: 1.6;
  color: var(--navy);
}
.article__aside {
  border-left: 1px solid var(--line);
  padding-left: clamp(1.5rem, 3vw, 2.5rem);
  align-self: start;
  position: sticky;
  top: 7rem;
}
.article__aside .fact {
  padding-block: 1.25rem;
  border-bottom: 1px solid var(--line);
}
.article__aside .fact:last-child { border-bottom: none; }
.article__aside .fact dt {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  text-transform: none;
  color: #64789F;
  margin-bottom: .375rem;
}
.article__aside .fact dd {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.375rem;
  color: var(--navy);
}
@media (max-width: 860px) {
  .article { grid-template-columns: 1fr; }
  .article__aside { position: static; border-left: none; padding-left: 0; border-top: 1px solid var(--line); padding-top: 1.5rem; }
}

/* Misyon / Vizyon çift paneli */
.mv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin-top: var(--space-section);
}
.mv-card {
  padding: clamp(2rem, 4vw, 3rem);
  position: relative;
}
.mv-card--mission {
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--ink);
}
.mv-card--vision {
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--ink);
}
.mv-card h2 {
  font-family: var(--font-mono);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: none;
  margin-bottom: 1.5rem;
}
.mv-card--mission h2 { color: var(--accent); }
.mv-card--vision h2 { color: var(--accent); }
.mv-card p {
  font-family: var(--font-display);
  font-size: clamp(1.125rem, 1.8vw, 1.375rem);
  line-height: 1.6;
  color: var(--navy);
}
@media (max-width: 800px) {
  .mv-grid { grid-template-columns: 1fr; }
}

/* Metodoloji listesi */
.method-list {
  margin-top: var(--space-section);
  border-top: 1px solid var(--line);
}
.method-item {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: clamp(1.25rem, 4vw, 3.5rem);
  padding-block: 2.5rem;
  border-bottom: 1px solid var(--line);
}
.method-item h3 {
  font-size: var(--fs-h3);
  color: var(--navy);
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 1rem;
}
.method-item h3 .tick {
  font-family: var(--font-mono);
  font-size: .75rem;
  color: var(--accent);
  letter-spacing: .1em;
  flex: none;
}
.method-item p { margin: 0; color: #475A77; }
@media (max-width: 760px) {
  .method-item { grid-template-columns: 1fr; gap: .75rem; }
}

/* ==========================================================================
   Stratejik Odak Alanları
   ========================================================================== */
.focus-section {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: clamp(2.5rem, 6vw, 5.5rem);
  align-items: center;
  padding-block: clamp(3rem, 7vw, 5.5rem);
  border-bottom: 1px solid var(--line);
}
.focus-section:last-of-type { border-bottom: none; }
.focus-section--flip .focus-figure { order: -1; }
.focus-section h2 {
  font-size: var(--fs-h2);
  color: var(--navy);
  max-width: 16ch;
}
.focus-section .focus-tag {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  text-transform: none;
  color: var(--accent);
  display: block;
  margin-bottom: 1rem;
}
.focus-figure {
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(1.5rem, 3vw, 2.5rem);
}
.focus-figure svg { width: 100%; height: auto; }
@media (max-width: 860px) {
  .focus-section { grid-template-columns: 1fr; }
  .focus-section--flip .focus-figure { order: 0; }
}

/* ==========================================================================
   Yönetişim / Mediterranean Talks
   ========================================================================== */
.talks-manifesto {
  background: var(--paper);
  color: var(--ink);
  margin-top: var(--space-section);
  padding-block: var(--space-section);
  border-block: 1px solid var(--line);
  position: relative;
  overflow: hidden;
}
.talks-manifesto .container {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: clamp(2.5rem, 6vw, 5rem);
}
.talks-manifesto .talks-label {
  position: sticky;
  top: 7rem;
  align-self: start;
}
.talks-manifesto .talks-label .year {
  font-family: var(--font-display);
  font-size: clamp(4rem, 8vw, 6.5rem);
  font-weight: 600;
  color: var(--sea);
  line-height: 1;
  display: block;
  margin-top: 1rem;
}
.talks-manifesto .talks-label .hero-figure {
  margin-top: 2rem;
}
.talks-manifesto h2 {
  color: var(--navy);
  font-size: var(--fs-h2);
}
.talks-manifesto .talks-text p {
  font-size: 1.0938rem;
  color: #2C3E5E;
}
.talks-manifesto .talks-text p:first-of-type {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.2vw, 1.625rem);
  line-height: 1.55;
  color: var(--navy);
}
@media (max-width: 860px) {
  .talks-manifesto .container { grid-template-columns: 1fr; }
  .talks-manifesto .talks-label { position: static; }
}

/* ==========================================================================
   Kurullar
   ========================================================================== */
.board-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 1.5rem;
  padding-top: var(--space-section);
}
.board-label {
  grid-column: 1 / -1;
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: none;
  color: var(--accent);
  border-bottom: 1px solid var(--line);
  padding-bottom: .875rem;
  margin: 1.5rem 0 0;
}
.person-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2rem 1.75rem;
  text-align: center;
}
.person-card .avatar {
  width: 92px;
  height: 92px;
  margin: 0 auto 1.375rem;
  border-radius: 50%;
  background: var(--paper);
  border: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
}
.person-card .avatar svg { width: 46px; height: 46px; }
.person-card .role {
  font-family: var(--font-display);
  font-size: 1.25rem;
  color: var(--navy);
  display: block;
  margin-bottom: .5rem;
}
.person-card .slot {
  font-family: var(--font-mono);
  font-size: .71875rem;
  letter-spacing: .16em;
  text-transform: none;
  color: #8CA0BC;
}

/* Komisyonlar */
.commission-layout {
  display: grid;
  grid-template-columns: minmax(0, 3.5fr) minmax(0, 8fr);
  gap: clamp(2.5rem, 5vw, 4.5rem);
  padding-top: var(--space-section);
}
.commission-index {
  position: sticky;
  top: 7rem;
  align-self: start;
  border-left: 1px solid var(--line);
}
.commission-index a {
  display: block;
  padding: .875rem 0 .875rem 1.375rem;
  font-size: .9063rem;
  color: #526387;
  line-height: 1.45;
  border-left: 2px solid transparent;
  margin-left: -1.5px;
  transition: color .2s, border-color .2s;
}
.commission-index a:hover { color: var(--navy); }
.commission-index a.active {
  color: var(--navy);
  border-left-color: var(--accent);
  font-weight: 500;
}
.commission {
  padding-bottom: clamp(3rem, 6vw, 5rem);
  margin-bottom: clamp(3rem, 6vw, 5rem);
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 7rem;
}
.commission:last-child { border-bottom: none; margin-bottom: 0; }
.commission h2 {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  color: var(--navy);
  max-width: 24ch;
}
.commission .commission-kicker {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  text-transform: none;
  color: var(--accent);
  display: block;
  margin-bottom: .875rem;
}
.commission h3 {
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: none;
  color: #64789F;
  margin: 2rem 0 .75rem;
}

/* Üye çizelgesi placeholder şeridi */
.member-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 1rem;
  margin-top: 2rem;
}
.member-slot {
  background: var(--white);
  border: 1px dashed var(--mist);
  border-radius: 6px;
  padding: 1.375rem 1rem;
  text-align: center;
}
.member-slot .avatar {
  width: 60px;
  height: 60px;
  margin: 0 auto .875rem;
  border-radius: 50%;
  background: var(--paper);
  border: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
}
.member-slot .avatar svg { width: 30px; height: 30px; }
.member-slot span {
  font-family: var(--font-mono);
  font-size: .65625rem;
  letter-spacing: .12em;
  text-transform: none;
  color: #8CA0BC;
  display: block;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .commission-layout { grid-template-columns: 1fr; }
  .commission-index { display: none; }
}

/* ==========================================================================
   Yayınlar
   ========================================================================== */
.terminal-body {
  background: var(--paper);
  color: var(--ink);
  padding-block: var(--space-section);
}
.terminal-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.terminal-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-height: 380px;
  padding: 2.25rem;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  overflow: hidden;
  transition: transform .35s var(--ease), border-color .35s, box-shadow .35s var(--ease);
}
.terminal-tile:hover {
  transform: translateY(-6px);
  border-color: var(--sea);
  box-shadow: 0 24px 44px -28px rgba(12, 24, 48, .35);
  color: var(--ink);
}
.terminal-tile .tile-id {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  color: var(--accent);
}
.terminal-tile .tile-viz { flex: 1; display: flex; align-items: center; }
.terminal-tile .tile-viz svg { width: 100%; height: auto; }
.terminal-tile h2 {
  font-size: 1.5rem;
  color: var(--navy);
  margin: 0;
}
.terminal-tile .tile-cue {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: none;
  color: var(--accent);
  display: inline-flex;
  gap: .5rem;
}
.terminal-tile .tile-cue .btn-arrow { transition: transform .3s var(--ease); }
.terminal-tile:hover .tile-cue .btn-arrow { transform: translateX(4px); }
@media (max-width: 860px) {
  .terminal-tiles { grid-template-columns: 1fr; }
  .terminal-tile { min-height: 0; }
}

/* Arşiv sayfaları */
.archive-list {
  padding-top: var(--space-section);
  max-width: 860px;
}
.pub-skeleton {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.75rem;
  align-items: center;
  padding: 1.75rem 0;
  border-bottom: 1px solid var(--line);
}
.pub-skeleton .doc-icon {
  width: 52px;
  height: 64px;
  border: 1px solid var(--mist);
  border-radius: 6px;
  background:
    linear-gradient(var(--mist), var(--mist)) 10px 14px / 24px 1.5px no-repeat,
    linear-gradient(var(--mist), var(--mist)) 10px 22px / 30px 1.5px no-repeat,
    linear-gradient(var(--mist), var(--mist)) 10px 30px / 30px 1.5px no-repeat,
    linear-gradient(var(--mist), var(--mist)) 10px 38px / 18px 1.5px no-repeat,
    var(--white);
}
.pub-skeleton .bar {
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, #E6ECF4 25%, #F1F5F9 50%, #E6ECF4 75%);
  background-size: 300% 100%;
  animation: shimmer 2.4s linear infinite;
}
.pub-skeleton .bar + .bar { margin-top: 10px; width: 62%; }
@keyframes shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.empty-state {
  margin-top: 3rem;
  border: 1px dashed var(--mist);
  border-radius: 6px;
  background: var(--white);
  padding: 2.5rem;
  display: flex;
  gap: 1.75rem;
  align-items: center;
}
.empty-state .pulse {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--accent);
  flex: none;
  animation: pulse 2s var(--ease) infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(47, 90, 147, .35); }
  50% { box-shadow: 0 0 0 9px rgba(47, 90, 147, 0); }
}
.empty-state p {
  margin: 0;
  font-family: var(--font-mono);
  font-size: .8438rem;
  letter-spacing: .06em;
  color: #526387;
}

/* ==========================================================================
   AKEN Akademi
   ========================================================================== */
.program-feature {
  margin-top: var(--space-section);
  background: var(--white);
  border: 1px solid var(--line);
}
.program-feature .program-text {
  padding: clamp(2rem, 5vw, 4rem);
  max-width: 920px;
}
.program-feature .program-text h2 {
  font-size: var(--fs-h2);
  color: var(--navy);
}
.discipline-list {
  display: flex;
  flex-wrap: wrap;
  gap: .625rem;
  margin-top: 2rem;
}
.discipline-list li {
  font-family: var(--font-mono);
  font-size: .71875rem;
  letter-spacing: .12em;
  text-transform: none;
  color: var(--navy);
  border: 1px solid var(--mist);
  border-radius: 6px;
  padding: .5rem .875rem;
  background: var(--paper);
}
/* ==========================================================================
   İletişim
   ========================================================================== */
.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2.5rem, 6vw, 5.5rem);
  padding-top: var(--space-section);
}
.contact-meta .meta-block {
  padding-block: 1.5rem;
  border-bottom: 1px solid var(--line);
}
.contact-meta .meta-block:first-child { padding-top: 0; }
.contact-meta h2 {
  font-family: var(--font-mono);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: none;
  color: var(--accent);
  margin-bottom: .625rem;
}
.contact-meta p, .contact-meta a {
  font-family: var(--font-display);
  font-size: 1.25rem;
  color: var(--navy);
}
.contact-meta a:hover { color: var(--sea-strong); }
.contact-meta .note {
  font-family: var(--font-sans);
  font-size: .8125rem;
  color: #64789F;
  margin-top: .375rem;
}

.contact-form {
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(1.75rem, 4vw, 3rem);
}
.contact-form .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.field { margin-bottom: 1.25rem; }
.field label {
  display: block;
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .18em;
  text-transform: none;
  color: #526387;
  margin-bottom: .5rem;
}
.field input,
.field textarea {
  width: 100%;
  padding: .875rem 1rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
  font-family: var(--font-sans);
  font-size: .9688rem;
  color: var(--ink);
  transition: border-color .2s;
}
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--sea);
  background: var(--white);
}
.field textarea { resize: vertical; min-height: 150px; }
.form-hint {
  font-size: .8125rem;
  color: #64789F;
  margin-top: 1rem;
}
@media (max-width: 860px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-form .form-row { grid-template-columns: 1fr; gap: 0; }
}

/* ---- Supabase dinamik içerik katmanı ---- */
.dynamic-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 2rem);
}
.dynamic-card {
  position: relative;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  background: var(--white);
  border: 1px solid var(--line);
}
.dynamic-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--sea);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform .3s var(--ease);
}
.dynamic-card:hover::before { transform: scaleY(1); }
.dynamic-card__meta {
  margin-bottom: .75rem;
  color: var(--accent);
  font: 500 .72rem var(--font-mono);
  letter-spacing: .06em;
  text-transform: none;
}
.dynamic-card h2 { margin-bottom: .75rem; font-size: clamp(1.45rem, 3vw, 2rem); }
.dynamic-card h2 a { color: inherit; text-decoration: none; }
.dynamic-card > p:not(.dynamic-card__meta) { color: #53637b; line-height: 1.65; }
.dynamic-status {
  display: grid;
  place-items: center;
  min-height: 180px;
  padding: 2rem;
  color: #67789c;
  background: var(--white);
  border: 1px dashed var(--mist);
  text-align: center;
}
.dynamic-status p { margin: 0; }
.dynamic-status--error { color: #8f3535; border-color: #d8aaaa; }
.detail-section { padding-top: clamp(3.5rem, 8vw, 7rem); }
.detail-article { max-width: 850px; margin: 0 auto; }
.detail-article > h1 { max-width: 780px; margin: 1.2rem 0; font-size: clamp(2.5rem, 7vw, 5rem); }
.detail-article > .lead { max-width: 760px; color: #4a5c76; }
.detail-article figure { margin: 2.5rem 0; }
.detail-article figure img { display: block; width: 100%; height: auto; background: var(--fog); }
.prose { margin-top: 2.5rem; color: #2e3d54; font-size: 1.0625rem; line-height: 1.8; }
.prose h2, .prose h3 { margin: 2.2rem 0 .8rem; }
.prose a { color: var(--sea-strong); }
.prose blockquote { margin: 1.8rem 0; padding: .5rem 0 .5rem 1.5rem; border-left: 3px solid var(--accent); font-family: var(--font-display); font-size: 1.35rem; }
.contact-honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.form-status { min-height: 1.4em; margin: 1rem 0 0; color: #67789c; font-size: .875rem; }
.form-status--success { color: #267050; }
.form-status--error { color: #983c3c; }
.contact-form button:disabled { opacity: .55; cursor: wait; }

@media (max-width: 760px) {
  .dynamic-list { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Yeni nesil katmanlar — preloader, gren, progress, CTA, tilt/spotlight
   ========================================================================== */

/* ---- Film greni (tüm site üzerinde, dekoratif) ---- */
.page-grain {
  position: fixed;
  inset: 0;
  z-index: 9990;
  pointer-events: none;
  opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

/* ---- Preloader: 1 sn logo açılışı + perde kalkışı ---- */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  background:
    linear-gradient(180deg, rgba(6, 13, 24, .76) 0%, rgba(8, 16, 30, .46) 46%, rgba(6, 13, 24, .82) 100%),
    linear-gradient(90deg, rgba(6, 13, 24, .78) 0%, rgba(6, 13, 24, .26) 55%, rgba(6, 13, 24, .05) 100%),
    url("../assets/images/hero-index.jpg") center / cover no-repeat;
  animation: preloader-lift 1.4s cubic-bezier(.76, 0, .24, 1) .05s forwards;
}
.preloader__inner {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 1.125rem;
  animation: preloader-fade .4s var(--ease) .82s forwards;
}
.preloader__logo {
  width: min(420px, 74vw);
  height: auto;
  opacity: 0;
  animation: preloader-in .8s var(--ease) .12s forwards;
}
.preloader__line {
  display: block;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-soft), transparent);
  animation: preloader-line 1s var(--ease) .4s forwards;
}
.preloader__coords {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .3em;
  text-transform: none;
  color: var(--mist);
  opacity: 0;
  animation: preloader-in .55s var(--ease) .55s forwards;
}
@keyframes preloader-in {
  from { opacity: 0; transform: translateY(10px) scale(.97); }
  to { opacity: 1; transform: none; }
}
@keyframes preloader-line { to { width: min(300px, 64vw); } }
@keyframes preloader-fade { to { opacity: 0; } }
@keyframes preloader-lift {
  0%, 45% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(-101%); opacity: 1; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  .preloader { display: none; }
}

/* ---- Okuma ilerleme çizgisi ---- */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  z-index: 150;
  pointer-events: none;
  background: rgba(48, 96, 160, .12);
}
.scroll-progress span {
  display: block;
  height: 100%;
  width: 100%;
  transform: scaleX(0);
  transform-origin: left;
  background: linear-gradient(90deg, var(--sea), var(--accent-soft));
  will-change: transform;
}

/* ---- Reveal varyantları: maske ve blur girişi ---- */
html.js .reveal--mask {
  opacity: 0;
  transform: none;
  clip-path: inset(0 0 100% 0);
  transition: clip-path .9s var(--ease), opacity .9s var(--ease);
  transition-delay: var(--reveal-delay, 0s);
}
html.js .reveal--mask.in-view { clip-path: inset(0 0 0 0); opacity: 1; }
html.js .reveal--blur {
  opacity: 0;
  transform: translateY(14px);
  filter: blur(10px);
  transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease);
  transition-delay: var(--reveal-delay, 0s);
}
html.js .reveal--blur.in-view { opacity: 1; transform: none; filter: blur(0); }
@media (prefers-reduced-motion: reduce) {
  html.js .reveal--mask,
  html.js .reveal--blur { opacity: 1; transform: none; clip-path: none; filter: none; }
}

/* ---- 3D tilt (JS --rx/--ry değişkenlerini sürer) ---- */
/* !important: reveal sınıfının transform'unu ezmemesi için (spesifiklik koruması) */
.tilt-card {
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) !important;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
  will-change: transform;
}
.tilt-card.is-hover { box-shadow: var(--shadow-lift); }
@media (hover: none) {
  .tilt-card { transform: none !important; }
}

/* ---- Spotlight: imleci izleyen kart ışığı ---- */
.spotlight-card { position: relative; }
.spotlight-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(460px circle at var(--mx, 50%) var(--my, 50%), rgba(48, 96, 160, .09), transparent 62%);
  opacity: 0;
  transition: opacity .45s var(--ease);
}
.spotlight-card:hover::after { opacity: 1; }
.spotlight-card > * { position: relative; z-index: 1; }

/* ---- Ken Burns: hero görselinde yavaş sinematik zoom ---- */
.hero__bg { animation: kenburns 16s var(--ease) both; }
@keyframes kenburns {
  from { transform: scale(1.03); }
  to { transform: scale(1.13); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__bg { animation: none; }
}

/* ---- Header: daha derin cam + gölge ---- */
.site-header {
  background: rgba(245, 247, 250, .82);
  backdrop-filter: blur(14px) saturate(1.35);
}
.site-header.is-scrolled {
  background: rgba(245, 247, 250, .95);
  box-shadow: 0 14px 34px -30px rgba(6, 13, 24, .4);
}
.sub-menu {
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(14px);
}

/* ---- Butonlar: dolgu-sweep + manyetik dönüş ---- */
.btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .35s var(--ease), color .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--navy);
  transform: translateY(102%);
  transition: transform .38s var(--ease);
}
.btn > * { position: relative; }
.btn:hover { background: transparent; color: var(--white); box-shadow: var(--glow); }
.btn:hover::before { transform: translateY(0); }

.btn--solid::before { background: var(--sea-strong); }
.btn--solid:hover { background: var(--navy); border-color: var(--sea-strong); color: var(--white); }

.btn--light::before { background: var(--fog); }
.btn--light:hover { color: var(--navy-deep); }

.hero--photo .hero__actions .btn::before { background: var(--fog); }
.hero--photo .hero__actions .btn:first-child::before { background: var(--navy-deep); }
.hero--photo .hero__actions .btn:first-child:hover { background: var(--white); }

.contact-form button.is-sending { opacity: .8; pointer-events: none; }
.contact-form button.is-sending::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 1.5px solid rgba(255, 255, 255, .45);
  border-top-color: var(--white);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .contact-form button.is-sending::after { animation: none; }
}

/* ---- Footer: aurora ışığı + konumlandırılmış içerik ---- */
.site-footer {
  position: relative;
  margin-top: 0;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(52rem 30rem at 85% -10%, rgba(48, 96, 160, .2), transparent 62%);
}
.site-footer .container { position: relative; }

/* ---- Ana sayfa hero: sinematik vinyet + derin gradyan ---- */
.hero--photo::before {
  background:
    linear-gradient(180deg, rgba(6, 13, 24, .7) 0%, rgba(8, 16, 30, .42) 46%, rgba(6, 13, 24, .8) 100%),
    linear-gradient(90deg, rgba(6, 13, 24, .74) 0%, rgba(6, 13, 24, .22) 55%, rgba(6, 13, 24, 0) 100%);
}
.hero--photo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(120% 100% at 50% 42%, transparent 58%, rgba(6, 13, 24, .55) 100%);
}

/* ---- Enstitü rakamları bandı ---- */
.stat-band {
  background: var(--white);
  border-block: 1px solid var(--line);
}
.stat-band__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.stat-cell {
  padding: clamp(2rem, 4vw, 3rem) clamp(1.25rem, 3vw, 2.5rem);
  border-left: 1px solid var(--line);
}
.stat-cell:first-child { border-left: none; }
.stat-cell__num {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(2.75rem, 5.5vw, 4.25rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--navy);
}
.stat-cell__num::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border: 1px solid var(--brass);
  transform: rotate(45deg);
  margin-left: .45em;
  vertical-align: .6em;
}
.stat-cell__num--plain::after { display: none; }
.stat-cell__label {
  display: block;
  margin-top: .875rem;
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .18em;
  text-transform: none;
  color: #64789F;
}
@media (max-width: 860px) {
  .stat-band__grid { grid-template-columns: 1fr 1fr; }
  .stat-cell:nth-child(3) { border-left: none; }
  .stat-cell:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 480px) {
  .stat-band__grid { grid-template-columns: 1fr; }
  .stat-cell { border-left: none; border-top: 1px solid var(--line); }
  .stat-cell:first-child { border-top: none; }
}

/* ---- Footer öncesi CTA bandı ---- */
.cta-band {
  position: relative;
  overflow: hidden;
  background: var(--navy-deep);
  color: var(--fog);
}
main + .cta-band {
  margin-top: clamp(3rem, 7vw, 6rem);
}
.cta-band::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(46rem 26rem at 12% 0%, var(--aurora), transparent 62%),
    radial-gradient(40rem 30rem at 95% 110%, rgba(48, 96, 160, .18), transparent 60%);
}
.cta-band__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  padding-block: clamp(3rem, 6vw, 4.75rem);
}
.cta-band h2 {
  margin: 0;
  font-size: var(--fs-h2);
  color: var(--white);
  max-width: 24ch;
}
.cta-band .eyebrow { color: var(--accent-soft); margin-bottom: 1rem; }
.cta-band .eyebrow::before { background: var(--accent-soft); }
.cta-band .btn { border-color: var(--fog); color: var(--fog); }
.cta-band .btn::before { background: var(--fog); }
.cta-band .btn:hover { color: var(--navy-deep); }
@media (max-width: 720px) {
  main + .cta-band { margin-top: 3rem; }
  .cta-band__inner { grid-template-columns: 1fr; }
}

/* ---- Bileşen yükseltmeleri ---- */
.ledger-row h3 { display: flex; align-items: baseline; gap: 1.1rem; }
.ledger-num {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .18em;
  color: var(--brass);
  flex: none;
}
a.ledger-row { transition: background .3s var(--ease), transform .3s var(--ease); }
a.ledger-row:hover { transform: translateX(6px); }

.talks-band blockquote { font-style: italic; }
.ghost-year,
.talks-manifesto .talks-label .year { will-change: transform; }
.talks-manifesto .talks-text p:first-of-type::first-letter {
  font-size: 3.3em;
  float: left;
  line-height: .8;
  padding: .06em .12em 0 0;
  color: var(--sea);
  font-weight: 600;
}

.person-card {
  transition: transform .4s var(--ease), border-color .4s, box-shadow .4s var(--ease);
}
.person-card:hover {
  transform: translateY(-6px);
  border-color: var(--mist);
  box-shadow: var(--shadow-lift);
}

.mv-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--sea), var(--accent-soft) 55%, transparent);
}
.mv-card > * { position: relative; z-index: 1; }

.terminal-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s var(--ease);
  background:
    radial-gradient(460px circle at var(--mx, 50%) var(--my, 50%), rgba(48, 96, 160, .1), transparent 62%),
    repeating-linear-gradient(0deg, rgba(48, 96, 160, .05) 0 1px, transparent 1px 4px);
}
.terminal-tile:hover::after { opacity: 1; }
.terminal-tile > * { position: relative; z-index: 1; }

.focus-figure { transition: border-color .4s var(--ease); }
.focus-figure:hover { border-color: var(--mist); }

.discipline-list li {
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}
.discipline-list li:hover {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white);
  transform: translateY(-2px);
}

.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--sea);
  background: var(--white);
  box-shadow: 0 0 0 3px rgba(48, 96, 160, .13), 0 12px 28px -22px rgba(6, 13, 24, .4);
}

/* Detay sayfaları: editoryal açılış paragrafı */
.detail-article .prose p:first-of-type {
  font-family: var(--font-display);
  font-size: 1.25rem;
  line-height: 1.65;
  color: var(--navy);
}

/* Admin'den gelen sosyal bağlantılar için ortak footer yüzeyi. */
.footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  margin-top: 1.25rem;
}
.footer-social a {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .12em;
  text-transform: none;
  color: var(--fog-dim);
}
.footer-social a:hover { color: var(--white); }