/* ── Research Hero ── */
.rhero {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
  padding: 48px 48px 0;
}

.rhero__heading {
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(2.2rem, 3.6vw, 3rem);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #111;
  margin-bottom: 16px;
}

.rhero__heading em {
  font-style: italic;
  color: #999;
}

.rhero__sub {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #555;
}

.rhero__img {
  position: absolute;
  top: 10px;
  right: 60px;
  width: 320px;
  height: auto;
  mix-blend-mode: multiply;
  pointer-events: none;
  /* Kenarlar arka plana doğru yumuşakça erisin, kutu görünmesin */
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at center, #000 45%, transparent 80%);
  mask-image: radial-gradient(ellipse 70% 70% at center, #000 45%, transparent 80%);
}

/* ── Section wrapper ── */
.section {
  max-width: 1440px;
  margin: 0 auto;
  padding: 40px 48px 0;
}

.section__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.section__title {
  font-size: 1rem;
  font-weight: 600;
  color: #111;
  letter-spacing: -0.01em;
}

.section__title--solo { margin-bottom: 18px; }

.section__link,
.panel__link {
  font-size: 0.82rem;
  color: #666;
  text-decoration: none;
  transition: color 0.15s;
}

.section__link:hover,
.panel__link:hover { color: #111; }

/* ── Featured Grid ── */
.featured-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.feat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 200px;
  padding: 22px 24px;
  border-radius: 16px;
  text-decoration: none;
  color: #fff;
  overflow: hidden;
  background: #1a1a1a;
  transition: transform 0.2s;
}

.feat-card:hover { transform: translateY(-3px); }

/* Distinct backgrounds per card */
.feat-card--dots {
  background: radial-gradient(circle at 70% 30%, #2a2a2a, #0d0d0d);
}
.feat-card--waves {
  background: linear-gradient(135deg, #0f1f14, #1a2a1e 60%, #0d0d0d);
}
.feat-card--cubes {
  background: linear-gradient(135deg, #0d1a2e, #13243f 60%, #0a0f1a);
}

.feat-tag {
  display: inline-block;
  width: fit-content;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color: #eee;
  margin-bottom: 16px;
  backdrop-filter: blur(4px);
}

.feat-tag--blue {
  background: #2563eb;
  color: #fff;
}

.feat-card__title {
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin-bottom: 12px;
}

.feat-card__desc {
  font-size: 0.85rem;
  line-height: 1.5;
  color: rgba(255,255,255,0.7);
  margin-bottom: auto;
  max-width: 80%;
}

.feat-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 0.72rem;
  color: rgba(255,255,255,0.6);
  margin-top: 20px;
}

.feat-card__arrow {
  position: absolute;
  bottom: 22px;
  right: 24px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  transition: background 0.15s;
}

.feat-card:hover .feat-card__arrow { background: rgba(255,255,255,0.25); }

/* ── Research Areas ── */
.areas-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.area-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.07);
  border-radius: 14px;
  padding: 22px;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.area-card:hover {
  border-color: rgba(0,0,0,0.14);
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

.area-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.area-icon--blue { background: #eef2ff; }
.area-icon--green { background: #ecfdf3; }
.area-icon--amber { background: #fffbeb; }
.area-icon--purple { background: #f5f0ff; }

.area-card h3 {
  font-size: 0.95rem;
  font-weight: 600;
  color: #111;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

.area-card p {
  font-size: 0.82rem;
  line-height: 1.55;
  color: #666;
  margin-bottom: 14px;
}

.area-card__link {
  font-size: 0.82rem;
  font-weight: 500;
  color: #3b6cf6;
  text-decoration: none;
}
.area-link--green { color: #16a34a; }
.area-link--amber { color: #d97706; }
.area-link--purple { color: #7c3aed; }

/* ── Bottom Grid ── */
.bottom-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  padding-bottom: 64px;
  align-items: start;
}

.panel {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.07);
  border-radius: 14px;
  padding: 22px;
  height: 100%;
}

.panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.panel__title {
  font-size: 0.95rem;
  font-weight: 600;
  color: #111;
  letter-spacing: -0.01em;
}

.panel__head .panel__title { margin-bottom: 0; }

.panel > .panel__title { margin-bottom: 16px; }

/* Technical Notes */
.note-list { display: flex; flex-direction: column; gap: 4px; }

.note {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0,0,0,0.05);
  text-decoration: none;
}
.note:last-child { border-bottom: none; }

.note__icon { font-size: 0.9rem; flex-shrink: 0; opacity: 0.6; }

.note__body { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.note__body strong { font-size: 0.82rem; color: #111; font-weight: 600; }
.note__body span { font-size: 0.76rem; color: #777; line-height: 1.4; }

.note__date { font-size: 0.72rem; color: #999; flex-shrink: 0; }

/* Directions */
.direction-list { list-style: none; display: flex; flex-direction: column; gap: 14px; }
.direction-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.82rem;
  color: #444;
  line-height: 1.4;
}
.check {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ecfdf3;
  color: #16a34a;
  font-size: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}

/* Publications */
.publication { display: flex; gap: 14px; }

.pub-cover {
  flex-shrink: 0;
  width: 84px;
  height: 116px;
  border-radius: 8px;
  background: linear-gradient(160deg, #1a1a1a, #000);
  display: flex;
  align-items: center;
  justify-content: center;
}
.pub-cover__logo { width: 40px; opacity: 0.8; filter: invert(1); }

.pub-info { flex: 1; }
.pub-info__title-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.pub-info__title-row strong { font-size: 0.85rem; color: #111; line-height: 1.25; }

.pub-version {
  font-size: 0.65rem;
  padding: 2px 7px;
  background: #f0f0ef;
  border-radius: 5px;
  color: #666;
  flex-shrink: 0;
}

.pub-info p { font-size: 0.78rem; color: #666; line-height: 1.5; margin-bottom: 12px; }

.pub-meta { display: flex; gap: 14px; font-size: 0.72rem; color: #888; margin-bottom: 14px; }

.pub-download {
  width: 100%;
  padding: 9px;
  background: #f3f3f2;
  border: none;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  color: #111;
  cursor: pointer;
  transition: background 0.15s;
}
.pub-download:hover { background: #e8e8e7; }

/* Timeline */
.timeline { display: flex; flex-direction: column; gap: 4px; }

.tl-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 4px 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.tl-item:last-child { border-bottom: none; }

.tl-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ccc;
  grid-row: 1 / 3;
}
.tl-dot--done { background: #16a34a; }
.tl-dot--progress { background: #2563eb; }

.tl-body { display: flex; flex-direction: column; gap: 1px; }
.tl-body strong { font-size: 0.8rem; color: #111; font-weight: 600; }
.tl-body span { font-size: 0.72rem; color: #888; }

.tl-date { font-size: 0.72rem; color: #999; text-align: right; grid-column: 3; grid-row: 1; }

.tl-status {
  font-size: 0.68rem;
  padding: 3px 9px;
  border-radius: 999px;
  background: #f0f0ef;
  color: #777;
  grid-column: 3;
  grid-row: 2;
  justify-self: end;
}
.tl-status--done { background: #ecfdf3; color: #16a34a; }
.tl-status--progress { background: #eff6ff; color: #2563eb; }

/* ── Responsive ── */
@media (max-width: 1100px) {
  .featured-grid { grid-template-columns: 1fr; }
  .areas-grid { grid-template-columns: repeat(2, 1fr); }
  .bottom-grid { grid-template-columns: repeat(2, 1fr); }
  .rhero__img { width: 220px; right: 30px; opacity: 0.7; }
}

@media (max-width: 640px) {
  .rhero, .section { padding-left: 20px; padding-right: 20px; }
  .rhero__img { display: none; }
  .areas-grid, .bottom-grid { grid-template-columns: 1fr; }
}