/*ayfası başlık sistemi (inline'ları kaldırdık) ==== */
:root{
  --title-pad-x: 32px;
  --title-pad-b: 6px;
  --title-radius: 18px;
}

/* Ortak başlık stili */
.section-title{
  display: block;
  font-size: 2.1em;
  font-weight: 800;
  letter-spacing: 0.5px;
  padding: 0 var(--title-pad-x) var(--title-pad-b) var(--title-pad-x);
  width: fit-content;
  margin-left: 7vw;
  margin-right: auto;
  border-radius: var(--title-radius) var(--title-radius) 0 0;
  /* Başlıklar arası boşluk */
  margin-top: 50px;
  margin-bottom: 50px;
}

/* Renk varyantları */
.is-cyan{
  color: #38bdf8;
  border-bottom: 2px solid #38bdf8;
  background: rgba(56,189,248,0.07);
  text-shadow: 0 2px 12px rgba(56,189,248,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(56,189,248,0.10), 0 1px 0 #222;
}

.is-orange{
  color: #f59e42;
  border-bottom: 2px solid #f59e42;
  background: rgba(245,158,66,0.07);
  text-shadow: 0 2px 12px rgba(245,158,66,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(245,158,66,0.10), 0 1px 0 #222;
}

.is-purple{
  color: #a78bfa;
  border-bottom: 2px solid #a78bfa;
  background: rgba(167,139,250,0.07);
  text-shadow: 0 2px 12px rgba(167,139,250,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(167,139,250,0.10), 0 1px 0 #222;
}

.is-pink{
  color: #f472b6;
  border-bottom: 2px solid #f472b6;
  background: rgba(244,114,182,0.07);
  text-shadow: 0 2px 12px rgba(244,114,182,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(244,114,182,0.10), 0 1px 0 #222;
}

/* Yeni başlık renkleri */
.is-blue{
  color: #60a5fa;
  border-bottom: 2px solid #60a5fa;
  background: rgba(96,165,250,0.07);
  text-shadow: 0 2px 12px rgba(96,165,250,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(96,165,250,0.10), 0 1px 0 #222;
}

.is-green{
  color: #34d399;
  border-bottom: 2px solid #34d399;
  background: rgba(52,211,153,0.07);
  text-shadow: 0 2px 12px rgba(52,211,153,0.10), 0 1px 0 #222;
  box-shadow: 0 4px 24px 0 rgba(52,211,153,0.10), 0 1px 0 #222;
}

/* Kart içindeki küçük başlıklar farklı kalsın (dokunmuyoruz) */
.board-row-fixed h2{
  font-size: 1.18em;
  letter-spacing: .2px;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 10px;
}

/* Mobil düzen: resim bloğu alta geçsin (HTML'deki <style> kalktı) */
@media (max-width: 1000px) {
 .board-row-fixed {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
 .board-row-fixed > div:first-child {
    margin-left: 8vw !important;
    max-width: 420px !important;
    min-width: 180px !important;
    width: 100% !important;
  }
 .board-row-fixed > div:last-child {
    width: 100% !important;
    justify-content: center !important;
    margin-top: 24px !important;
    min-width: 0 !important;
  }
 .board-row-fixed > div:last-child > div {
    width: 100% !important;
    max-width: 700px !important;
    margin: 0 auto !important;
  }
 .board-row-fixed img {
    width: 100% !important;
    max-width: 700px !important;
    height: auto !important;
  }
}