/* ---------- Tokens (Diarus Akademik Paleti) ---------- */
:root{
  --brand:#002147; --brand-600:#001735; --accent:#B8860B; --gold:#C8A951;
  --bg:#fff; --ink:#111827; --muted:#6B7280; --line:#E6EAF1; --card:#F8FAFC;
  --success:#2E7D32; --warning:#F59E0B; --error:#B22222;
  --shadow:0 6px 24px rgba(0,0,0,.06);
  --radius:14px; --radius-sm:10px;
  --space:clamp(12px,1.6vw,20px);
  --space-lg:clamp(18px,2.2vw,28px);
  --space-xl:clamp(26px,3vw,40px);
  --focus:0 0 0 3px rgba(0,33,71,.22), 0 0 0 5px rgba(0,33,71,.28);
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;color:var(--ink);background:var(--bg);
  font:400 15px/1.6 "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}

/* Linkler */
a{color:var(--brand);text-decoration:none}
a:not(.btn):hover{color:var(--brand-600);text-decoration:underline}

/* Butonlar */
.btn{display:inline-flex;align-items:center;justify-content:center;
  padding:10px 14px;border-radius:12px;border:1px solid transparent;
  font-weight:600;line-height:1.2;cursor:pointer}
.btn--primary{background:var(--brand);color:#fff;border-color:var(--brand);
  transition:background .2s ease,box-shadow .2s ease,transform .15s ease}
.btn--primary:hover,.btn--primary:focus{
  background:var(--brand-600);color:#fff;transform:translateY(-1px);
  box-shadow:0 4px 10px rgba(0,0,0,.15)}
.btn--ghost{background:#fff;border-color:var(--line)}
.btn--ghost:hover{background:#f1f5f9}
.btn--accent{background:var(--accent);color:#0a1a12;border-color:var(--accent)}
.btn--accent:hover{filter:brightness(.95)}
.btn--sm{padding:5px 6px;font-size:.8rem;border-radius:6px}
.btn:hover,.btn:focus{text-decoration:none}

/* Erişilebilirlik / yardımcı */
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:8px}
.container{width:min(1280px,95%);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip-link{position:absolute;left:-9999px;top:0;background:#fff;padding:8px 12px;border-radius:8px;box-shadow:var(--shadow)}
.skip-link:focus{left:12px;top:12px;z-index:9999}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--brand);
  border-bottom:1px solid rgba(255,255,255,.06);color:#fff}
.header-inner{display:flex;align-items:flex-end;gap:20px;padding:0;min-height:72px}
.brand img{display:block}

/* NAV (yalnızca birinci seviye ul'ü flex yap) */
.site-nav{margin-left:auto}
.site-nav > ul{
  list-style:none;display:flex;align-items:flex-end;gap:18px;
  padding:0 0 10px;margin:0}
.site-nav > ul > li{display:flex;align-items:flex-end;position:relative}
.site-nav > ul > li > a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;              /* metin ↔ chevron arası */
  padding:8px 14px;      /* tek padding değeri */
  color:#e7edf6;
  border-radius:8px;
  line-height:1.1;
    white-space: nowrap;   /* ← EKLE */
}
.site-nav > ul > li > a:hover{
  background:rgba(255,255,255,.08);color:#fff;text-decoration:none}

/* ---------- Dropdown (Hakkında) ---------- */
.has-submenu{position:relative}


/* Şık chevron: currentColor ile boyanır */

.has-submenu > a::after{
  content:"";                 /* <-- eksikti, ekle */
  display:inline-block;
  width:12px; height:12px;
  margin-left:2px;
  opacity:.95;
  background:#e7edf6;
  transition:transform .2s ease, background .2s ease, opacity .2s ease;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M2 2l4 4 4-4' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M2 2l4 4 4-4' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
}


/* Varsayılan: kapalı */
.dropdown{
  position:absolute;left:0;top:100%;min-width:220px;z-index:60;
  background:#fff;color:var(--ink);border:1px solid #E6EAF1;border-radius:12px;
  box-shadow:0 12px 24px rgba(0,0,0,.18);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .15s ease,transform .15s ease,visibility .15s linear;
  pointer-events:none;
}
/* İç liste DİKEY kalsın */
.dropdown ul{list-style:none;margin:0;padding:0}
.dropdown li{display:block}
.dropdown a{color:var(--ink);display:block;padding:10px 12px;border-radius:8px}
.dropdown a:hover{background:#F1F5F9;color:var(--brand);text-decoration:none}

/* Açık durum (hover/focus veya .open sınıfı) */
.has-submenu:hover > .dropdown,
.has-submenu:focus-within > .dropdown,
.has-submenu.open > .dropdown{
  opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
}
/* Chevron dönsün */
/* BUNU BUL ve SADECE rotate bırak */
.has-submenu:hover > a::after,
.has-submenu:focus-within > a::after,
.has-submenu.open > a::after{
  transform: rotate(180deg);  /* önce: translateY(-50%) rotate(180deg) */
  background:#fff;
  opacity:1;
}


/* ---------- Hero ---------- */
.hero{
  padding:var(--space-xl) 0 var(--space-lg);
  background:
    radial-gradient(1200px 400px at 20% -10%, rgba(0,33,71,.14), transparent 70%),
    linear-gradient(#f7f9fc, #ffffff)}
.hero h1{margin:0 0 8px;font-weight:800;letter-spacing:.2px;color:var(--brand)}
.lead{color:var(--muted);margin:0 0 var(--space)}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}








/* Hero2 */
/* Hero2 */
.hero2 {
  padding: var(--space-xl) 0 var(--space-lg);
  background:
    radial-gradient(1200px 400px at 20% -10%, rgba(0,33,71,.14), transparent 70%),
    linear-gradient(#f7f9fc, #ffffff);
}

.hero2-grid {
  display: grid;
  grid-template-columns: 1fr 280px;  /* yazı | kapak */
  align-items: center;
  gap: 30px;
}

.hero2 h1 {
  margin: 0 0 8px;
  font-weight: 800;
  letter-spacing: .2px;
  color: var(--brand);
}

.hero2 .lead {
  color: var(--muted);
  margin: 0 0 var(--space);
}

.hero2-cover img {
  width: 100%;
  border-radius: 8px;
  display: block;
}

/* Mobilde alta düşsün */
@media (max-width: 768px) {
  .hero2-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .hero2-cover {
    max-width: 240px;
    margin: 0 auto;
  }
}















/* ---------- Layout ---------- */
.layout{display:grid;gap:var(--space);grid-template-columns:1fr;align-items:start;padding:var(--space-lg) 0 var(--space-xl)}
.content{order:1}.sidebar{order:2}
@media (min-width:992px){.layout{grid-template-columns:minmax(0,1fr) 300px}.sidebar{position:sticky;top:84px}}

/* ---------- Cards ---------- */
/* ---------- Cards ---------- */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(14px,1.4vw,18px);
  margin-bottom: 9px; /* ← bloklar arası boşluk */
}

@media (max-width: 768px) {
  .card {
    margin-bottom: 3px; /* ← mobilde biraz daha az boşluk */
  }
}

.card__header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.card__header h2{margin:0;font-size:1.2rem;position:relative;padding-bottom:6px}
.card__header h2::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:3px;background:linear-gradient(90deg,var(--gold),transparent);border-radius:3px}
.link{font-weight:700;color:var(--brand)}
.link:hover{color:var(--brand-600)}
.card__body p {
  margin-bottom: 12px;
  color: var(--ink);
}





/* Dergimiz Hakkında grid */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 2fr; /* solda küçük resim, sağda geniş yazı */
  gap: 16px;
  align-items: start;
}

.about-image img {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  display: block;
}

.about-text p {
  margin: 0 0 10px;
  color: var(--ink); /* normal gövde yazı rengi */
}

@media (max-width: 720px) {
  .about-grid {
    grid-template-columns: 1fr; /* mobilde üst üste gelsin */
  }
}








/* Tek sütun son sayı kartı için küçük dokunuşlar */
.card--issue-single .article--single{
  border:1px dashed var(--line);
  border-radius: var(--radius-sm);
  padding:12px;
  margin-bottom: 12px;
}

.card--issue-single .article__title {
  font-size: 1rem;   /* sadece tek sütunlu şablon için */
}


.meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  align-items:center;
  margin-bottom:8px;
}

.doi {
  font-weight:400;          /* normal, kalın değil */
  font-size: 0.9rem;        /* biraz küçük */
  color: var(--muted);      /* gri/silik */
  text-decoration:none;
}
.doi:hover {
  color: var(--brand);      /* hover’da maviye dönsün */
  text-decoration: underline;
}

.doi-line {
  margin: 6px 0;
}

.doi-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);        /* ORCID gibi silik */
  font-size: 0.9rem;          /* küçük */
  font-weight: normal;
  text-decoration: none;
}

.doi-link:hover {
  color: var(--brand-600);
  text-decoration: underline;
}

.doi-icon {
  flex-shrink: 0;
}

.doi-text {
  line-height: 1.2;
}


.id-link{
  display:inline-flex; align-items:center; gap:6px;
  color: var(--muted); font-size: .9rem; text-decoration:none;
}
.id-link:hover{ color: var(--brand-600); text-decoration: underline; }
.icon{
  display:inline-block; width:14px; height:14px; flex-shrink:0;
}












.byline {
  display:flex; align-items:center; gap:8px;
  color: var(--muted);
  font-size: 0.9rem;       /* biraz küçülttüm */
  font-weight:400;         /* bold değil */
}

.orcid {
  display:inline-flex; align-items:center; gap:6px;
  text-decoration:none;
  color: var(--muted);     /* gri/silik */
  font-size: 0.9rem;
}
.orcid:hover { color: var(--brand); text-decoration: underline; }
.orcid-icon { display:inline-block; }


.orcid-link{
  display:inline-flex; align-items:center;
  text-decoration:none; line-height:1;
}
.orcid-icon{
  display:inline-block; width:16px; height:16px; flex-shrink:0;
}

/* İsteğe bağlı: hover’da çok hafif büyüsün */
.orcid-link:hover .orcid-icon{ transform: scale(1.05); }














/* ---------- Lists / Badges ---------- */
.list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.badges{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0}
.badges li{border:1px solid var(--line);padding:6px 10px;border-radius:999px;font-weight:700;background:#fff}

/* ---------- Articles Grid ---------- */
.issue-meta{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);margin-bottom:10px}
.articles-grid{display:grid;gap:14px}
@media (min-width:720px){.articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.article{border:1px dashed var(--line);border-radius:var(--radius-sm);padding:12px}
.article__title{margin:0 0 6px;font-size: 1rem;  font-weight: 600;   line-height:1.3}
.article__title a{text-decoration: none;color:var(--brand)}
.article__title a:hover{color:var(--brand-600)}
.article__meta{margin:0 0 8px;color:var(--muted);font-size:.95rem}
.article__abs{margin:0 0 10px}
.article__cta .btn{margin-right:6px}

















/* ---------- Tabs ---------- */
.tab-menu{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff}
.tab-buttons{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-bottom:1px solid var(--line);background:linear-gradient(#fff,#f6f9fc)}
.tab-buttons [role="tab"]{appearance:none;border:1px solid var(--line);background:#fff;padding:9px 12px;border-radius:10px;font-weight:700;cursor:pointer}
.tab-buttons [aria-selected="true"]{border-color:var(--brand);color:#fff;background:var(--brand);box-shadow:0 1px 0 0 var(--gold) inset}
.tab-content{padding:12px}
.tab-pane{display:block}
.tab-pane:not(.is-active){display:none}



.badges a:hover {
  text-decoration: none; /* alt çizgiyi kapat */
}


.badges li { padding: 0; border: none; background: none; } /* kutuyu sıfırla */

.badges li a {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  font-weight: 700;
  color: var(--brand);
  background: #fff;
  border: 1px solid var(--line);
  text-decoration: none;         /* alt çizgi olmasın */
  transition: background 0.3s ease, color 0.3s ease, transform 0.2s ease;
}

.badges li a:hover {
  background: var(--brand);
  color: #fff;
  transform: translateY(-2px);
}









/* ---------- Footer ---------- */
.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:20px 0;color:#e7edf6;background:var(--brand)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:10px}
.footer-nav{list-style:none;display:flex;gap:14px;margin:0;padding:0}
.site-footer a{color:#e7edf6}
.site-footer a:hover{color:#fff}

/* ---------- Mobile Nav ---------- */
.nav-toggle{display:none;background:none;border:1px solid rgba(255,255,255,.2);padding:8px 10px;border-radius:10px;color:#fff}
.nav-toggle__bar,.nav-toggle__bar::before,.nav-toggle__bar::after{background:#fff}
.nav-toggle__bar{display:block;width:22px;height:2px;position:relative}
.nav-toggle__bar::before,.nav-toggle__bar::after{content:"";position:absolute;left:0;right:0;height:2px}
.nav-toggle__bar::before{top:-6px}.nav-toggle__bar::after{top:6px}

@media (max-width:991px){
  .nav-toggle{display:inline-block}
  .site-nav{
    position:fixed;inset:56px 0 auto 0;background:var(--brand);
    transform:translateY(-20px);opacity:0;pointer-events:none;transition:.2s}
  .site-nav.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
  .site-nav > ul{flex-direction:column;align-items:stretch;padding:12px}
  .site-nav > ul > li{justify-content:stretch}
  .site-nav > ul > li > a{padding:12px 14px}
   white-space: normal;   /* ← EKLE: küçük ekranda satır kırılabilir */

  /* Mobilde dropdown başlangıçta kapalı, .open olduğunda aç */
  .dropdown{
    position:static;min-width:0;border-radius:10px;box-shadow:none;
    border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);
    margin:6px 0 0 0;padding:6px;opacity:0;visibility:hidden;transform:none;pointer-events:none}
  .has-submenu.open > .dropdown{opacity:1;visibility:visible;pointer-events:auto}
  .dropdown a{color:#e7edf6;padding:10px 12px}
  .dropdown a:hover{background:rgba(255,255,255,.10);color:#fff}
}












/* === Mobile Drawer (sağdan kayan) === */
@media (max-width: 991px){


 
 
  /* Header & Toggle hizası */
  .header-inner{
    align-items: center;       /* burger ve logo dikey ortalı */
    min-height: 64px;
  }
  .nav-toggle{
    display:flex;
    align-self:center;
    position:relative;
    margin-left:auto;
    width:32px; height:24px;
    flex-direction:column; justify-content:space-between;
    background:none; border:none; padding:0; cursor:pointer;
    z-index:1201;              /* hepsinin üstünde */
  }
  .nav-toggle .bar{
    height:3px; width:100%;
    background:#fff; border-radius:2px;
    transition:transform .3s ease, opacity .2s ease, background .2s ease;
  }
  /* Hamburger → Çarpı animasyonu */
  .nav-toggle.active .bar:nth-child(1){ transform:translateY(10px) rotate(45deg); }
  .nav-toggle.active .bar:nth-child(2){ opacity:0; }
  .nav-toggle.active .bar:nth-child(3){ transform:translateY(-10px) rotate(-45deg); }

  /* Drawer panel: sağdan içeri */
  .site-nav.drawer{
    position:fixed; top:0; right:0; bottom:0;
    width:min(320px, 85vw);
    background: var(--brand);
    transform: translateX(100%);
    transition: transform .3s ease;
    box-shadow: -8px 0 24px rgba(0,0,0,.2);
     z-index: 1201 !important;      
     pointer-events: auto;
  }
  .site-nav.drawer.is-open{ transform: translateX(0); }

  /* Menü listesi dikey */
  .site-nav.drawer > ul{
    display:flex; flex-direction:column; align-items:stretch;
    gap:0; padding:72px 12px 16px; margin:0; list-style:none;
  }
  .site-nav.drawer > ul > li{ display:block }
  .site-nav.drawer > ul > li > a{
    display:flex; align-items:center; justify-content:flex-start;
    padding:12px 14px;
    color:#e7edf6; border-radius:10px;
  }
  .site-nav.drawer > ul > li > a:hover{
    background:rgba(255,255,255,.10); color:#fff; text-decoration:none;
  }

  /* Alt menü: varsayılan kapalı, .open ile aç */
  .site-nav.drawer .dropdown{
    position:static; min-width:0; border-radius:10px; box-shadow:none;
    border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.06);
    margin:6px 0 0 0; padding:6px;
    max-height:0; overflow:hidden;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:max-height .25s ease, opacity .2s ease, visibility .2s linear;
  }
  .site-nav.drawer .has-submenu.open > .dropdown{
    max-height:500px;          /* yeterli büyük değer */
    opacity:1; visibility:visible; pointer-events:auto;
  }
  .site-nav.drawer .dropdown a{ color:#e7edf6; }
  .site-nav.drawer .dropdown a:hover{ background:rgba(255,255,255,.10); color:#fff; }

  /* Ekran karartma (overlay) — sadece açıkken tıklama alsın */
  .nav-overlay{
    z-index: 1200 !important;                           /* drawer'dan düşük */
    opacity: 0; visibility: hidden;
    pointer-events: none;                                /* kapalıyken tıklama almaz */
    position: fixed; inset: 0;
    background: rgba(0,0,0,.45);
    transition: opacity .3s ease, visibility .3s ease;
  }
  .nav-overlay.is-open{
    opacity: 1; visibility: visible;
    pointer-events: auto;                                /* sadece açıkken tıklanır */
  }


  /* Arkaplan kaymasın */
  body.menu-open{ overflow:hidden; }
}










p {
  text-align: justify;
  text-justify: inter-word; /* kelime aralarında hizalasın */
}
