/* Sertifikalar & Referanslar sayfaları için: sadece mevcut değişkenleri kullanır */
.page-shell{min-height:100vh; color:var(--text);}
.page-section{max-width:var(--container,1100px); margin:0 auto; padding:48px 20px;}
.page-title{font-size:clamp(28px,3vw,40px); margin:0 0 20px 0; line-height:1.2}
.page-sub{color:var(--muted); margin-bottom:28px}

.grid{display:grid; gap:20px; grid-template-columns:repeat(auto-fill,minmax(240px,1fr));}

.card{
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius,12px);
  padding:18px;
  box-shadow: var(--shadow, 0 10px 30px rgba(17,35,52,.08));
  transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease;
}
.card:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-strong, 0 20px 50px rgba(17,35,52,.14));
  border-color: color-mix(in srgb, var(--brand) 18%, var(--border));
}
.card h3{margin:0 0 8px 0; font-size:18px}
.card p{margin:0 0 10px 0; color:var(--muted)}

.card a.btn{
  display:inline-block;
  text-decoration:none;
  border:1px solid var(--brand);
  padding:10px 14px;
  border-radius: var(--radius,12px);
  background: transparent;
  color: var(--brand);
}
.card a.btn:hover{
  background: var(--brand);
  color:#fff;
}

.logo{
  display:flex; align-items:center; justify-content:center;
  height:120px; border:1px dashed var(--border);
  border-radius: var(--radius,12px);
  background: color-mix(in srgb, var(--surface) 96%, #fff);
}
.logo img{max-width:100%; max-height:90px; height:auto}

.badge{
  display:inline-block; font-size:12px; padding:6px 10px; border-radius:999px;
  background: color-mix(in srgb, var(--surface) 92%, #f1f5f9);
  color: var(--text);
  border:1px solid var(--border);
  opacity:.85;
}

.page-section a{color:inherit}

@media (max-width:640px){
  .page-section{padding:28px 16px}
}