/* =========================================================
   ALTUNBİZ – Neden Bölümü (neden.css)
   Yalın, premium görünüm + hafif etkileşimler
   ========================================================= */

/* ---- Değişkenler (fallback’li) ---- */
:root{
  --accent: #e67e22;
  --accent-dark: #cf6d19;
  --dark: #020c3a;
  --ink: #110c42;        /* Başlık rengi (senin tercih) */
  --muted: #6b7280;      /* Açıklamalar */
  --card: #ffffff;
  --card-border: #eef2f7;
  --section-bg: #f7f9fc; /* Bölüm zemini */
  --shadow: 0 10px 30px rgba(2,12,58,.06);
  --shadow-hover: 0 16px 40px rgba(2,12,58,.12);
}

/* ---- Bölüm zemin & spacing ---- */
#neden-altunbiz{
  background: var(--section-bg);
  padding-top: 3rem;
  padding-bottom: 3rem;
  border-top: 1px solid #f0f3f8;
  border-bottom: 1px solid #eef2f7;
}

/* ---- Başlık & alt metin ---- */
#neden-altunbiz .text-center h2{
  color: var(--ink);
  letter-spacing: .2px;
  font-weight: 800;
  position: relative;
  display: inline-block;
  padding-bottom: .35rem;
}
#neden-altunbiz .text-center h2::after{
  content:"";
  position:absolute;
  left:50%; transform:translateX(-50%);
  bottom:0;
  width: 110px; height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--accent-dark));
  border-radius: 2px;
  box-shadow: 0 3px 10px rgba(230,126,34,.25);
}

#neden-altunbiz .text-center p{
  color: var(--muted);
  margin-top: .75rem;
}

/* ---- Kartlar ---- */
#neden-altunbiz .card{
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
#neden-altunbiz .card:hover{
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: rgba(230,126,34,.35);
}

/* ---- İkon Rozeti ---- */
#neden-altunbiz .card .display-5{
  line-height: 1;
}
#neden-altunbiz .card .display-5 i{
  /* Dairesel rozet */
  display:inline-flex;
  align-items:center; justify-content:center;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ffffff, #f3f6fb);
  color: var(--dark);
  border: 1px solid var(--card-border);
  box-shadow: 0 6px 16px rgba(2,12,58,.08) inset, 0 6px 18px rgba(2,12,58,.06);
  transition: transform .28s ease, box-shadow .28s ease, color .28s ease, border-color .28s ease;
  font-size: 1.35em; /* FA ikonunu biraz büyütür */
}
#neden-altunbiz .card:hover .display-5 i{
  color: var(--accent);
  transform: translateY(-2px) scale(1.04);
  border-color: rgba(230,126,34,.45);
  box-shadow: 0 6px 18px rgba(2,12,58,.06) inset, 0 14px 26px rgba(230,126,34,.18);
}

/* ---- Başlık & paragraf (kart içi) ---- */
#neden-altunbiz h5{
  color: var(--ink);
  margin-top: .25rem;
  margin-bottom: .35rem;
  letter-spacing: .2px;
}
#neden-altunbiz p{
  color: var(--muted);
}

/* ---- Odak (erişilebilirlik) ---- */
#neden-altunbiz .card:focus-within,
#neden-altunbiz .card:focus{
  outline: 3px solid rgba(230,126,34,.35);
  outline-offset: 2px;
}

/* ---- Responsive ayarlar ---- */
@media (min-width: 992px){
  #neden-altunbiz{ padding-top: 3.5rem; padding-bottom: 3.5rem; }
}
@media (max-width: 575.98px){
  #neden-altunbiz .card{ padding: 1.25rem !important; }
  #neden-altunbiz .text-center h2{ font-size: 1.4rem; }
}

/* ---- Hareketi azalt (OS tercihine saygı) ---- */
@media (prefers-reduced-motion: reduce){
  #neden-altunbiz .card,
  #neden-altunbiz .card .display-5 i,
  #neden-altunbiz .text-center h2::after{
    transition: none !important;
  }
}