/* SoleLuna Tech — özel bileşen stilleri (blog kartı, süreç, SSS).
   Site paletine uyumlu: navy #1b2a4a, gold #f4a72c. */

.sl-section { padding: 56px 0; }
.sl-section--alt { background: #f4f6fa; }

/* ---- Blog kartları (anasayfa son yazılar + blog listesi) ---- */
.sl-blog-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 24px; margin-top: 28px;
}
.sl-blog-card {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid #e3e8f0; border-radius: 14px; overflow: hidden;
  text-decoration: none; color: inherit;
  transition: box-shadow .18s ease, transform .12s ease;
}
.sl-blog-card:hover { box-shadow: 0 14px 34px rgba(16,24,40,.14); transform: translateY(-3px); color: inherit; }
.sl-blog-card .bc-cover { aspect-ratio: 16 / 9; background: #eef1f7 center/cover no-repeat; }
.sl-blog-card .bc-body { padding: 18px 20px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.sl-blog-card .bc-title { font-size: 18px; font-weight: 600; line-height: 1.32; color: #1b2a4a; }
.sl-blog-card .bc-summary { font-size: 14px; color: #5b6577; line-height: 1.55; }
.sl-blog-card .bc-date { font-size: 12px; color: #9aa3b2; margin-top: auto; padding-top: 6px; }
.sl-more { display: inline-flex; align-items: center; gap: 7px; margin-top: 26px;
  font-weight: 600; color: #d98e16; text-decoration: none; }
.sl-more:hover { color: #b9760f; }

/* ---- Çalışma Sürecimiz (adımlar) ---- */
.sl-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 22px; margin-top: 30px; }
.sl-step { position: relative; background: #fff; border: 1px solid #e3e8f0; border-radius: 14px; padding: 26px 22px; }
.sl-step .sl-step-no {
  width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 18px; color: #1b2a4a; background: rgba(244,167,44,.18); margin-bottom: 14px;
}
.sl-step h3 { font-size: 17px; margin: 0 0 8px; color: #1b2a4a; }
.sl-step p { font-size: 14px; color: #5b6577; line-height: 1.6; margin: 0; }

/* ---- SSS (akordeon, native details) ---- */
.sl-faq { max-width: 820px; margin: 30px auto 0; }
.sl-faq details {
  background: #fff; border: 1px solid #e3e8f0; border-radius: 12px;
  padding: 0 20px; margin-bottom: 14px; transition: box-shadow .15s ease;
}
.sl-faq details[open] { box-shadow: 0 8px 24px rgba(16,24,40,.08); }
.sl-faq summary {
  list-style: none; cursor: pointer; padding: 18px 0; font-size: 16px; font-weight: 600; color: #1b2a4a;
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.sl-faq summary::-webkit-details-marker { display: none; }
.sl-faq summary::after {
  content: "+"; font-size: 24px; font-weight: 400; color: #d98e16; line-height: 1; flex: none; transition: transform .2s ease;
}
.sl-faq details[open] summary::after { transform: rotate(45deg); }
.sl-faq .sl-faq-body { padding: 0 0 20px; font-size: 15px; line-height: 1.7; color: #5b6577; }

@media (max-width: 575px) {
  .sl-section { padding: 40px 0; }
}