/* ==========================================================================
   KESİAD — demo v2
   Beyaz zemin + logo laciverti. Kurumsal STK dili (EGİAD / EBSO / GESİAD çizgisi).
   Animasyon, geçiş efekti, parıltı kullanılmaz.
   ========================================================================== */

:root {
  --navy: #23285E;          /* logo laciverti */
  --navy-700: #2E3574;
  --navy-900: #171B44;
  --navy-050: #F1F3F9;
  --claret: #9C1E3D;        /* logo kırmızısı */
  --claret-700: #7E1631;
  --ink: #1A1E3C;
  --muted: #5F6788;
  --line: #E2E6F0;
  --line-2: #CDD4E4;
  --tint: #F5F7FB;
  --white: #FFFFFF;
  --pad: clamp(18px, 4vw, 56px);
  --maxw: 1360px;
  --r: 10px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  font-variant-numeric: tabular-nums;
}

img { max-width: 100%; display: block; }
a { color: inherit; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--pad); }

.eyebrow {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--claret);
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 24px;
  border-radius: 6px;
  background: var(--navy);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: .88rem;
  border: 1px solid var(--navy);
}
.btn:hover { background: var(--navy-900); border-color: var(--navy-900); }
.btn.outline { background: transparent; color: var(--navy); }
.btn.outline:hover { background: var(--navy); color: #fff; }
.btn.light { background: #fff; color: var(--navy); border-color: #fff; }
.btn.light:hover { background: var(--navy-050); }
.btn.claret { background: var(--claret); border-color: var(--claret); }
.btn.claret:hover { background: var(--claret-700); border-color: var(--claret-700); }

.more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-weight: 700;
  font-size: .84rem;
  color: var(--navy);
}
.more:hover { color: var(--claret); }

/* ---------- üst şerit ---------- */

.topbar { background: var(--navy); color: rgba(255, 255, 255, .82); font-size: .8rem; }

.topbar .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 42px;
  flex-wrap: wrap;
}

.topbar .tb-left { display: flex; gap: 22px; flex-wrap: wrap; align-items: center; }
.topbar .tb-right { display: flex; gap: 16px; align-items: center; }
.topbar a { text-decoration: none; }
.topbar a:hover { color: #fff; }
.topbar .sep { width: 1px; height: 18px; background: rgba(255, 255, 255, .25); }

.tb-social { display: flex; gap: 8px; }
.tb-social a {
  width: 30px; height: 30px;
  display: grid; place-items: center;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 5px;
  color: #fff;
}
.tb-social a:hover { background: var(--claret); border-color: var(--claret); }
.tb-social svg { width: 15px; height: 15px; fill: currentColor; }

/* ---------- başlık ---------- */

.header {
  background: #fff;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 80;
}

.header .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 88px;
}

.brand img { width: 210px; }

nav.main > ul {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  align-items: center;
  gap: 4px;
}

nav.main > ul > li { position: relative; }

nav.main > ul > li > a {
  display: block;
  padding: 32px 14px;
  text-decoration: none;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .045em;
  text-transform: uppercase;
  color: var(--navy);
  border-bottom: 3px solid transparent;
}

nav.main > ul > li > a:hover,
nav.main > ul > li > a[aria-current] { color: var(--claret); border-bottom-color: var(--claret); }

nav.main a.nav-home { padding-top: 29px; padding-bottom: 29px; }
nav.main a.nav-home .nav-home-i { display: block; }
nav.main a.nav-home svg { width: 19px; height: 19px; fill: currentColor; display: block; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

nav.main .drop {
  position: absolute;
  left: 0; top: 100%;
  min-width: 278px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: 0 14px 34px rgba(23, 27, 68, .12);
  list-style: none;
  margin: 0; padding: 8px 0;
  display: none;
  z-index: 90;
}
nav.main li:hover > .drop, nav.main li:focus-within > .drop { display: block; }
nav.main .drop a {
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  font-size: .86rem;
  font-weight: 600;
  color: var(--ink);
}
nav.main .drop a:hover { background: var(--navy-050); color: var(--navy); }

/* menüdeki öne çıkan buton */
nav.main li.nav-cta { margin-left: 12px; }
nav.main li.nav-cta > a {
  padding: 11px 20px;
  background: var(--claret);
  color: #fff;
  border-radius: 6px;
  border-bottom: 0;
}
nav.main li.nav-cta > a:hover,
nav.main li.nav-cta > a[aria-current] { background: var(--claret-700); color: #fff; border-bottom: 0; }

.mobile-nav { display: none; }
.mobile-nav li.m-cta a { color: var(--claret); font-weight: 800; }

/* ---------- hero slider (yalnızca görsel, container genişliğinde) ----------
   Salt CSS: radio + label. Geçiş efekti / otomatik oynatma yoktur, slayt anında değişir. */

.herobanner { padding: clamp(20px, 2.6vw, 34px) 0 0; }

.heroslider { position: relative; }

.hs-in { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.hs-frame {
  position: relative;
  border: 1px solid var(--line);
  border-radius: var(--r);
  overflow: hidden;
  background: var(--navy-050);
}

.hs-slide { display: none; margin: 0; }
.hs-slide > a { display: block; }
.hs-slide img { width: 100%; aspect-ratio: 12/5; object-fit: cover; }

#hs-1:checked ~ .hs-frame .hs-slide:nth-of-type(1),
#hs-2:checked ~ .hs-frame .hs-slide:nth-of-type(2),
#hs-3:checked ~ .hs-frame .hs-slide:nth-of-type(3),
#hs-4:checked ~ .hs-frame .hs-slide:nth-of-type(4),
#hs-5:checked ~ .hs-frame .hs-slide:nth-of-type(5),
#hs-6:checked ~ .hs-frame .hs-slide:nth-of-type(6) { display: block; }

.hs-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px; height: 52px;
  display: grid; place-items: center;
  background: rgba(35, 40, 94, .82);
  color: #fff;
  border-radius: 50%;
  cursor: pointer;
  z-index: 3;
  user-select: none;
}
.hs-arrow:hover { background: var(--claret); }
.hs-arrow svg { width: 18px; height: 18px; fill: currentColor; }
.hs-prev { left: 18px; }
.hs-next { right: 18px; }

.hs-dots { display: flex; justify-content: center; gap: 9px; margin-top: 15px; }
.hs-dots label {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--line-2);
  cursor: pointer;
  display: block;
}
.hs-dots label:hover { background: var(--muted); }
#hs-1:checked ~ .hs-dots label:nth-child(1),
#hs-2:checked ~ .hs-dots label:nth-child(2),
#hs-3:checked ~ .hs-dots label:nth-child(3),
#hs-4:checked ~ .hs-dots label:nth-child(4),
#hs-5:checked ~ .hs-dots label:nth-child(5),
#hs-6:checked ~ .hs-dots label:nth-child(6) { background: var(--claret); }

/* ---------- kurumsal kısayol kutuları ---------- */

.quick { padding: clamp(22px, 2.8vw, 38px) 0 clamp(30px, 3.6vw, 52px); }

.tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }

.tile {
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 18px 16px 16px;
  text-decoration: none;
  background: #fff;
  display: flex;
  flex-direction: column;
  min-height: 142px;
}
.tile:hover { border-color: var(--navy); }
.tile .n { font-size: .72rem; font-weight: 800; color: var(--claret); letter-spacing: .1em; }
.tile .t { margin-top: 9px; font-size: .97rem; font-weight: 700; color: var(--navy); line-height: 1.25; }
.tile .g { margin-top: auto; padding-top: 12px; font-size: .76rem; font-weight: 700; color: var(--muted); }
.tile:hover .g { color: var(--claret); }

/* ---------- bölüm başlığı ---------- */

section { padding: clamp(44px, 5.5vw, 84px) 0; }
section.tinted { background: var(--tint); }

.sec-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: clamp(22px, 2.6vw, 36px);
  flex-wrap: wrap;
}

.sec-top h2 {
  margin: 6px 0 0;
  font-size: clamp(1.45rem, 2.5vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--navy);
  line-height: 1.15;
}
.sec-top h2 em { font-style: normal; color: var(--claret); }

/* ---------- duyuru panosu ---------- */

.board { display: grid; grid-template-columns: 1.05fr 1.35fr; gap: 20px; }

.board-lead {
  background: var(--navy);
  color: #fff;
  border-radius: var(--r);
  padding: clamp(24px, 2.6vw, 36px);
  display: flex;
  flex-direction: column;
  text-decoration: none;
}
.board-lead:hover { background: var(--navy-900); }

.board-lead .tag {
  align-self: flex-start;
  background: var(--claret);
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 5px 11px;
  border-radius: 4px;
}
.board-lead h3 { margin: 18px 0 12px; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.22; font-weight: 800; letter-spacing: -.015em; }
.board-lead p { margin: 0 0 22px; color: rgba(255, 255, 255, .76); font-size: .94rem; }
.board-lead .b-meta { margin-top: auto; display: flex; align-items: center; gap: 14px; font-size: .82rem; color: rgba(255, 255, 255, .78); font-weight: 600; }
.board-lead .b-meta b { color: #fff; }

.board-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

.board-item {
  background: #fff;
  border: 1px solid var(--line);
  border-top: 3px solid var(--claret);
  border-radius: var(--r);
  padding: 20px 22px 22px;
  text-decoration: none;
  display: flex;
  flex-direction: column;
}
.board-item:hover { border-color: var(--line-2); box-shadow: 0 10px 26px rgba(23, 27, 68, .07); }
.board-item .d { font-size: .76rem; font-weight: 700; color: var(--claret); letter-spacing: .05em; }
.board-item h4 { margin: 9px 0 8px; font-size: 1rem; line-height: 1.3; font-weight: 700; color: var(--navy); }
.board-item p { margin: 0; font-size: .86rem; color: var(--muted); line-height: 1.5; }

/* ---------- haber / etkinlik ---------- */

.feature {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: clamp(24px, 3vw, 44px);
  align-items: center;
  margin-bottom: clamp(26px, 3vw, 44px);
}
.feature .fig { border-radius: var(--r); overflow: hidden; background: var(--navy-050); }
.feature .fig img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.feature h3 { margin: 14px 0 12px; font-size: clamp(1.3rem, 2.1vw, 1.9rem); line-height: 1.18; font-weight: 800; letter-spacing: -.018em; color: var(--navy); }
.feature p { margin: 0 0 22px; color: var(--muted); }

.datechip {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 74px;
  padding: 10px 0 11px;
  background: var(--navy);
  color: #fff;
  border-radius: 8px;
  line-height: 1.05;
}
.datechip .dd { font-size: 1.5rem; font-weight: 800; }
.datechip .mm { font-size: .64rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-top: 4px; color: rgba(255, 255, 255, .8); }
.datechip .yy { font-size: .64rem; font-weight: 600; color: rgba(255, 255, 255, .6); margin-top: 2px; }

.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r);
  overflow: hidden;
  text-decoration: none;
  display: flex;
  flex-direction: column;
}
.card:hover { border-color: var(--line-2); box-shadow: 0 12px 28px rgba(23, 27, 68, .08); }
.card .ph { position: relative; background: var(--navy-050); }
.card .ph img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.card .ph .datechip { position: absolute; left: 12px; bottom: -18px; width: 58px; padding: 8px 0 9px; }
.card .ph .datechip .dd { font-size: 1.15rem; }
.card .bd { padding: 30px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.card h4 { margin: 0 0 10px; font-size: .98rem; line-height: 1.32; font-weight: 700; color: var(--navy); }
.card p { margin: 0 0 14px; font-size: .84rem; color: var(--muted); line-height: 1.5; }
.card .go { margin-top: auto; font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--claret); }

.wrap > .years:first-child { margin-top: 0; }
.years { display: flex; flex-wrap: wrap; gap: 8px; margin-top: clamp(22px, 2.6vw, 34px); align-items: center; }
.years .lbl { font-size: .78rem; color: var(--muted); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-right: 6px; }
.years a.y, .years span.y {
  border: 1px solid var(--line-2);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: .8rem;
  color: var(--navy);
  font-weight: 600;
  background: #fff;
  text-decoration: none;
}
.years a.y:hover { border-color: var(--navy); }
.years .y b { color: var(--claret); margin-left: 5px; }

/* yıl ayracı (iç sayfa listeleri) */
.yearsep {
  display: flex; align-items: baseline; gap: 16px;
  margin: clamp(30px, 3.4vw, 48px) 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.yearsep:first-of-type { margin-top: 0; }
.yearsep h3 { margin: 0; font-size: 1.4rem; font-weight: 800; color: var(--navy); letter-spacing: -.01em; }
.yearsep span { font-size: .82rem; color: var(--muted); font-weight: 600; }

/* ---------- başkanın mesajı ---------- */

.president { background: var(--navy); color: #fff; }
.president .wrap { display: grid; grid-template-columns: 300px 1fr; gap: clamp(28px, 4vw, 68px); align-items: center; }

.pres-photo { text-align: center; }
.pres-photo img { width: 260px; height: 260px; border-radius: 50%; object-fit: cover; object-position: top center; margin: 0 auto; border: 5px solid rgba(255, 255, 255, .18); background: #fff; }
.pres-photo .nm { margin-top: 18px; font-size: 1.15rem; font-weight: 800; }
.pres-photo .rl { font-size: .85rem; color: rgba(255, 255, 255, .68); }

.pres-body h2 { margin: 12px 0 20px; font-size: clamp(1.5rem, 2.7vw, 2.2rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.16; }
.pres-body .eyebrow { color: #E8A9B8; }

.pres-empty { border-left: 3px solid rgba(255, 255, 255, .3); padding: 6px 0 6px 22px; max-width: 780px; }
.pres-empty .lines { display: grid; gap: 15px; margin-bottom: 20px; }
.pres-empty .lines i { display: block; height: 1px; background: rgba(255, 255, 255, .2); }
.pres-empty .lines i:nth-child(4) { width: 58%; }
.pres-empty p { margin: 0; color: rgba(255, 255, 255, .6); font-size: .9rem; }

.pres-sign { margin-top: 26px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

/* başkan iç sayfası — beyaz zemin */
.msgpage { display: grid; grid-template-columns: 300px 1fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
.msgpage .who img { width: 100%; border-radius: var(--r); border: 1px solid var(--line); }
.msgpage .who .nm { margin-top: 16px; font-size: 1.15rem; font-weight: 800; color: var(--navy); }
.msgpage .who .rl { font-size: .88rem; color: var(--muted); }
.msgpage .body h2 { margin: 10px 0 22px; font-size: clamp(1.5rem, 2.7vw, 2.2rem); font-weight: 800; color: var(--navy); letter-spacing: -.02em; line-height: 1.16; }
.msgpage .empty { border-left: 3px solid var(--line-2); padding: 8px 0 8px 24px; max-width: 820px; }
.msgpage .empty .lines { display: grid; gap: 16px; margin-bottom: 22px; }
.msgpage .empty .lines i { display: block; height: 1px; background: var(--line); }
.msgpage .empty .lines i:nth-child(5) { width: 55%; }
.msgpage .empty p { margin: 0; color: var(--muted); font-size: .92rem; }
.msgpage .sign { margin-top: 30px; font-size: 1.05rem; font-weight: 800; color: var(--navy); }
.msgpage .sign small { display: block; font-size: .84rem; font-weight: 600; color: var(--muted); }

/* ---------- e-dergi ---------- */

.mag { display: grid; grid-template-columns: 300px 1fr; gap: clamp(26px, 4vw, 60px); align-items: start; }

.mag-cover { position: relative; }
.mag-cover img { width: 100%; border-radius: var(--r); box-shadow: 0 20px 46px rgba(23, 27, 68, .18); }
.mag-cover .ribbon {
  position: absolute; top: 16px; left: -8px;
  background: var(--claret); color: #fff;
  font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  padding: 7px 14px; border-radius: 4px;
}

.mag-info h3 { margin: 12px 0 20px; font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 800; letter-spacing: -.025em; color: var(--navy); line-height: 1.05; }
.mag-facts { list-style: none; margin: 0 0 26px; padding: 0; max-width: 820px; }
.mag-facts li { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: .92rem; }
.mag-facts .k { color: var(--muted); }
.mag-facts .v { font-weight: 700; color: var(--navy); }

.mag-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-top: clamp(26px, 3vw, 40px); }
.mag-strip a { text-decoration: none; }
.mag-strip img { width: 100%; aspect-ratio: 210/297; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); }
.mag-strip .m { margin-top: 8px; font-size: .76rem; font-weight: 700; color: var(--navy); }
.mag-strip a:hover .m { color: var(--claret); }

.arch-year { display: grid; grid-template-columns: 96px 1fr; gap: 20px; padding: 24px 0; border-top: 1px solid var(--line); align-items: start; }
.arch-year .yr { font-size: 1.35rem; font-weight: 800; color: var(--navy); letter-spacing: -.01em; padding-top: 4px; }
.arch-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 16px; }
.arch-list a { text-decoration: none; }
.arch-list img { width: 100%; aspect-ratio: 210/297; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); }
.arch-list .m { margin-top: 7px; font-size: .78rem; font-weight: 700; color: var(--navy); }
.arch-list a:hover .m { color: var(--claret); }

/* ---------- kurumsal iç sayfa blokları ---------- */

.vm { display: grid; grid-template-columns: 1fr 1.35fr; gap: clamp(24px, 4vw, 56px); }
.vm .lead { margin: 0; font-size: 1.1rem; line-height: 1.55; color: var(--navy); font-weight: 600; }
.vm .body p { margin: 0 0 14px; color: var(--muted); }
.vm .eyebrow { margin-bottom: 10px; }

.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 22px; }
.person { text-align: center; }
.person img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top center; border-radius: 8px; border: 1px solid var(--line); background: var(--navy-050); }
.person .nm { margin-top: 11px; font-weight: 700; font-size: .95rem; color: var(--navy); line-height: 1.25; }
.person .rl { font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--claret); margin-top: 3px; }
.person .fm { font-size: .82rem; color: var(--muted); margin-top: 2px; }

.past { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 24px; }
.past-item { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: #fff; }
.past-item img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top center; filter: grayscale(1); background: var(--navy-050); }
.past-item .bd { padding: 16px 18px 18px; }
.past-item .yr { font-size: .78rem; font-weight: 800; color: var(--claret); letter-spacing: .04em; }
.past-item .nm { font-size: 1.02rem; font-weight: 800; color: var(--navy); line-height: 1.24; margin-top: 4px; }
.past-item .fm { font-size: .84rem; color: var(--muted); margin-top: 3px; }

.thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.thumbs a { text-decoration: none; }
.thumbs img { width: 100%; height: 240px; object-fit: cover; object-position: top center; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
.thumbs a:hover img { border-color: var(--navy); }

.note { color: var(--muted); max-width: 760px; }

.prose { max-width: 780px; }
.prose p { color: var(--muted); }
.prose h3 { color: var(--navy); font-size: 1.1rem; font-weight: 800; margin: 26px 0 10px; }

/* ---------- detay sayfası + yan liste ---------- */

.detay { display: grid; grid-template-columns: minmax(0, 1fr) 336px; gap: clamp(28px, 3.4vw, 54px); align-items: start; }

.side-box { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: #fff; }
.side-box + .side-box { margin-top: 22px; }
.side-box > h3 {
  margin: 0;
  padding: 15px 20px;
  background: var(--navy);
  color: #fff;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.side-list a {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 13px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  align-items: center;
}
.side-list a:last-child { border-bottom: 0; }
.side-list a:hover { background: var(--navy-050); }
.side-list img { width: 78px; height: 54px; object-fit: cover; border-radius: 6px; background: var(--navy-050); }
.side-list .d { display: block; font-size: .71rem; font-weight: 700; color: var(--claret); letter-spacing: .04em; }
.side-list .t { display: block; font-size: .87rem; font-weight: 700; color: var(--navy); line-height: 1.28; margin-top: 3px; }
.side-list.plain a { grid-template-columns: minmax(0, 1fr); }
.side-foot { padding: 14px 16px; border-top: 1px solid var(--line); }
.side-foot a { font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--claret); text-decoration: none; }
.side-foot a:hover { color: var(--navy); }

/* ---------- bilgilendirme kutusu ---------- */

.infobox {
  border: 1px dashed var(--line-2);
  border-radius: var(--r);
  padding: 24px 26px;
  background: var(--tint);
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.infobox .ic {
  width: 38px; height: 38px; flex: 0 0 auto;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  display: grid; place-items: center;
  font-weight: 800; font-size: 1.05rem;
}
.infobox h4 { margin: 0 0 6px; font-size: 1.02rem; color: var(--navy); font-weight: 800; }
.infobox p { margin: 0; color: var(--muted); font-size: .93rem; }

/* ---------- eğitim kartları ---------- */

.edu-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.edu-card {
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 24px 22px 22px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  background: #fff;
}
.edu-card:hover { border-color: var(--navy); box-shadow: 0 12px 28px rgba(23, 27, 68, .08); }
.edu-card .badge {
  align-self: flex-start;
  font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  padding: 5px 11px; border-radius: 4px;
  background: var(--navy-050); color: var(--navy);
}
.edu-card .badge.gecmis { background: #F3E8EC; color: var(--claret); }
.edu-card h3 { margin: 15px 0 10px; font-size: 1.06rem; font-weight: 800; color: var(--navy); line-height: 1.28; }
.edu-card p { margin: 0 0 18px; font-size: .88rem; color: var(--muted); line-height: 1.55; }
.edu-card .go { margin-top: auto; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--claret); }

/* ---------- eğitim + anket ---------- */

.two-up { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(22px, 3vw, 44px); align-items: start; }

.edu-list { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: #fff; }
.edu-list a { display: flex; align-items: center; gap: 16px; padding: 17px 22px; border-bottom: 1px solid var(--line); text-decoration: none; }
.edu-list a:last-child { border-bottom: 0; }
.edu-list a:hover { background: var(--navy-050); }
.edu-list .n { font-size: .78rem; font-weight: 800; color: var(--claret); width: 24px; }
.edu-list .t { font-weight: 700; font-size: .95rem; color: var(--navy); flex: 1; }
.edu-list .g { font-size: .74rem; font-weight: 700; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; }

.survey { background: var(--navy); color: #fff; border-radius: var(--r); padding: clamp(26px, 3vw, 40px); }
.survey h3 { margin: 12px 0 12px; font-size: clamp(1.3rem, 2.2vw, 1.8rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.18; }
.survey .eyebrow { color: #E8A9B8; }
.survey p { color: rgba(255, 255, 255, .75); margin: 0 0 20px; font-size: .94rem; }
.survey ol { list-style: none; margin: 0 0 24px; padding: 0; }
.survey ol li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; padding: 9px 0; border-top: 1px solid rgba(255, 255, 255, .15); font-size: .88rem; color: rgba(255, 255, 255, .9); }
.survey ol li span { color: #E8A9B8; font-weight: 700; font-size: .78rem; }
.survey ol li.more-line { color: rgba(255, 255, 255, .55); font-style: italic; }

/* anket iç sayfası */
.qform { max-width: 860px; }
.qbox { border: 1px solid var(--line); border-radius: var(--r); padding: 20px 22px; margin-bottom: 16px; background: #fff; }
.qbox .q { display: flex; gap: 12px; font-weight: 700; color: var(--navy); font-size: 1rem; margin-bottom: 14px; }
.qbox .q .n { color: var(--claret); }
.qbox input[type=text] { width: 100%; font: inherit; padding: 11px 13px; border: 1px solid var(--line-2); border-radius: 6px; }
.qbox input[type=text]:focus { outline: 2px solid var(--navy); outline-offset: -2px; }
.choices { display: grid; gap: 9px; }
.choices label { display: flex; align-items: flex-start; gap: 10px; font-size: .92rem; color: var(--ink); }
.choices input { margin-top: 4px; }

/* ---------- galeri ---------- */

.gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.gallery a { text-decoration: none; }
.gallery img { width: 100%; height: 190px; object-fit: cover; border-radius: var(--r); border: 1px solid var(--line); }
.gallery .cap { margin-top: 10px; font-size: .9rem; font-weight: 700; color: var(--navy); line-height: 1.3; }
.gallery .mt { font-size: .78rem; color: var(--muted); margin-top: 3px; }
.gallery a:hover .cap { color: var(--claret); }

/* ---------- iletişim ---------- */

.contact { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(26px, 4vw, 56px); align-items: start; }

.crow { display: grid; grid-template-columns: 104px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.crow .k { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding-top: 2px; }
.crow .v { font-weight: 600; color: var(--navy); }
.crow .v a { text-decoration: none; }
.crow .v a:hover { color: var(--claret); }

.social-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.social-row a {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 18px;
  border: 1px solid var(--line-2);
  border-radius: 6px;
  text-decoration: none;
  font-weight: 700;
  font-size: .82rem;
  color: var(--navy);
}
.social-row a:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.social-row svg { width: 16px; height: 16px; fill: currentColor; }

.map { border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
.map iframe { width: 100%; height: 420px; border: 0; display: block; }

.form-card { border: 1px solid var(--line); border-radius: var(--r); padding: clamp(22px, 3vw, 34px); background: #fff; }
.form-grid { display: grid; gap: 16px; }
.form-grid .lbl { display: block; margin-bottom: 6px; font-size: .82rem; font-weight: 700; color: var(--muted); }
.form-grid input, .form-grid textarea {
  width: 100%;
  font: inherit;
  padding: 12px 14px;
  border: 1px solid var(--line-2);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
}
.form-grid textarea { min-height: 150px; resize: vertical; }
.form-grid input:focus, .form-grid textarea:focus { outline: 2px solid var(--navy); outline-offset: -2px; }

/* ---------- iç sayfa başlığı ---------- */

.pagehead { background: var(--navy); color: #fff; padding: clamp(30px, 4vw, 58px) 0; }
.pagehead h1 { margin: 12px 0 10px; font-size: clamp(1.8rem, 3.2vw, 2.8rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.1; }
.pagehead .eyebrow { color: #E8A9B8; }
.pagehead .crumbs { font-size: .85rem; color: rgba(255, 255, 255, .68); }
.pagehead .crumbs a { text-decoration: none; }
.pagehead .crumbs a:hover { color: #fff; }
.pagehead .facts { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 16px; font-size: .88rem; color: rgba(255, 255, 255, .78); }
.pagehead .facts b { color: #fff; }
.pagehead p.lede { margin: 10px 0 0; max-width: 70ch; color: rgba(255, 255, 255, .8); }

/* ---------- altlık ---------- */

.foot { background: var(--navy-900); color: rgba(255, 255, 255, .8); }
.foot .cols {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.3fr;
  gap: clamp(22px, 3vw, 52px);
  padding: clamp(34px, 4vw, 60px) 0;
}
.foot img.logo { width: 210px; margin-bottom: 16px; }
.foot h4 { margin: 0 0 16px; font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.foot ul { list-style: none; margin: 0; padding: 0; }
.foot ul li { padding: 5px 0; }
.foot a { text-decoration: none; }
.foot a:hover { color: #fff; }
.foot p { margin: 0 0 12px; line-height: 1.7; font-size: .92rem; }
.foot-social { display: flex; gap: 10px; margin-top: 16px; }
.foot-social a { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .25); border-radius: 6px; color: #fff; }
.foot-social a:hover { background: var(--claret); border-color: var(--claret); }
.foot-social svg { width: 16px; height: 16px; fill: currentColor; }
.foot-bar {
  border-top: 1px solid rgba(255, 255, 255, .12);
  display: flex; flex-wrap: wrap; gap: 8px 24px;
  justify-content: space-between;
  padding: 16px 0;
  font-size: .82rem;
  color: rgba(255, 255, 255, .5);
}

/* ---------- duyarlı ---------- */

@media (max-width: 1240px) {
  .tiles { grid-template-columns: repeat(3, 1fr); }
  nav.main > ul > li > a { padding: 32px 10px; font-size: .74rem; }
  .brand img { width: 174px; }
}

@media (max-width: 1180px) {
  .cards { grid-template-columns: repeat(2, 1fr); }
  .mag-strip { grid-template-columns: repeat(4, 1fr); }
  .gallery { grid-template-columns: repeat(3, 1fr); }
  .foot .cols { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1100px) {
  .detay { grid-template-columns: 1fr; }
  .side-box { max-width: 620px; }
  .edu-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  .board { grid-template-columns: 1fr; }
  .feature, .vm, .two-up, .contact, .mag, .president .wrap, .msgpage { grid-template-columns: 1fr; }
  .pres-photo img { width: 190px; height: 190px; }
  .msgpage .who img { max-width: 280px; }
  .tiles { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  nav.main { display: none; }
  .header .wrap { min-height: 68px; }
  .mobile-nav { display: block; border-top: 1px solid var(--line); }
  .mobile-nav summary { padding: 13px var(--pad); font-weight: 800; font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); cursor: pointer; }
  .mobile-nav ul { list-style: none; margin: 0 0 10px; padding: 0; }
  .mobile-nav li a { display: block; padding: 10px var(--pad); border-top: 1px solid var(--line); text-decoration: none; font-size: .92rem; font-weight: 600; color: var(--navy); }
  .mobile-nav .sub a { padding-left: calc(var(--pad) + 18px); color: var(--muted); font-weight: 500; }
  .topbar .tb-left { display: none; }
  .topbar .wrap { justify-content: center; }
  .cards, .board-grid, .gallery, .tiles, .edu-cards { grid-template-columns: 1fr; }
  .past { grid-template-columns: 1fr 1fr; gap: 14px; }
  .hs-slide img { aspect-ratio: 3/2; }
  .hs-arrow { width: 40px; height: 40px; }
  .hs-arrow svg { width: 14px; height: 14px; }
  .hs-prev { left: 10px; }
  .hs-next { right: 10px; }
  .mag-strip { grid-template-columns: repeat(3, 1fr); }
  .arch-year { grid-template-columns: 1fr; gap: 12px; }
  .foot .cols { grid-template-columns: 1fr; }
  .crow { grid-template-columns: 1fr; gap: 4px; }
}

@media print {
  .topbar, .header, .mobile-nav { display: none; }
}