/* NOA — kaydırınca açılan bilgi bölümü (Veri Sağlayıcılarımız + Topluluğa Kattıklarımız) */

.noa-info {
  --noa-bg: var(--noa-page, #121924);   /* sitenizin arka planı */
  --noa-line: rgba(240, 239, 228, 0.07);
  --noa-text: #ffffff;
  --noa-muted: rgba(240, 239, 228, 0.72);
  --noa-blue: #5484ff;        /* NOA mavisi */
  --noa-font-title: 'Rajdhani', system-ui, sans-serif;
  --noa-font-body: 'Rajdhani', system-ui, -apple-system, 'Segoe UI', sans-serif;
  position: relative;
  overflow: hidden;
  background: transparent;    /* arkada sitenin ortam animasyonu görünür */
  color: var(--noa-text);
  font-weight: 500;
  padding: clamp(48px, 7vw, 96px) 16px clamp(64px, 8vw, 112px);
  font-family: var(--noa-font-body);
  isolation: isolate;
}
.noa-info__rings {
  position: absolute; inset: 0; width: 100%; height: 100%;   /* bölüm kadar; halkaları JS ortalar */
  pointer-events: none; z-index: -1;
  opacity: 0; transition: opacity 1.6s ease;
}
.noa-info.is-live .noa-info__rings { opacity: 1; }
/* halkalar bölüm kenarlarında keskin kesilmesin: üst ve alt kenarda erir */
.noa-info__rings { -webkit-mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); mask-image: linear-gradient(transparent, #000 16%, #000 84%, transparent); }
.noa-info__block { max-width: 1780px; margin: 0 auto; }
.noa-info__block + .noa-info__block { margin-top: clamp(56px, 7vw, 96px); }

/* ---- başlık: yukarı süzülür, altında ince mavi çizgi açılır ---- */
.noa-info__title {
  position: relative;
  margin: 0 0 clamp(24px, 3vw, 40px);
  text-align: center;
  font-family: var(--noa-font-title);
  font-weight: 700;
  font-size: clamp(25px, 2.4vw, 34px);
  letter-spacing: 0.01em;
}
.noa-info__title--big { font-size: clamp(32px, 3.8vw, 54px); }
.noa-info__title::after {
  content: ''; display: block; height: 2px; width: 56px; margin: 14px auto 0;
  background: linear-gradient(90deg, transparent, var(--noa-blue), transparent);
  transform: scaleX(0); transition: transform 0.9s cubic-bezier(.2, .7, .2, 1) 0.35s;
}
.noa-info__title.is-in::after { transform: scaleX(1); }

/* ---- ortak "görününce aç" hareketi ---- */
.noa-info [data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.8s ease, transform 0.9s cubic-bezier(.2, .7, .2, 1);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.noa-info [data-reveal].is-in { opacity: 1; transform: none; }

/* ---- veri sağlayıcıları ---- */
.noa-info__providers {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--noa-line);
}
.noa-card {
  position: relative; overflow: hidden;
  display: grid; place-items: center;
  min-height: clamp(120px, 10vw, 178px);
  padding: 20px;
  border-right: 1px solid var(--noa-line);
}
.noa-card:last-child { border-right: 0; }
.noa-card img {
  max-width: min(220px, 80%); max-height: 64px; width: auto; height: auto; object-fit: contain;
  opacity: 0.94;
  transition: filter 0.4s ease, opacity 0.4s ease, transform 0.4s ease;
}
/* tek seferlik ışık süpürmesi */
.noa-card::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(240, 239, 228, 0.09) 50%, transparent 65%);
  transform: translateX(-120%);
}
.noa-card.is-in::before { animation: noa-sweep 1.3s cubic-bezier(.4, 0, .2, 1) calc(0.45s + var(--i, 0) * 90ms) 1 both; }
@keyframes noa-sweep { to { transform: translateX(120%); } }
/* hover: hafif yükselme + mavi iz */
.noa-card::after {
  content: ''; position: absolute; left: 50%; bottom: 0; width: 60%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--noa-blue), transparent);
  transform: translateX(-50%) scaleX(0); transition: transform 0.45s ease;
}
.noa-card:hover::after { transform: translateX(-50%) scaleX(1); }
.noa-card:hover img { opacity: 1; filter: brightness(1.15); transform: translateY(-2px); }

/* ---- istatistikler ---- */
.noa-info__stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1500px; margin: 0 auto;
}
.noa-stat { text-align: center; }
.noa-stat__value {
  font-family: var(--noa-font-title);
  font-weight: 700;
  font-size: clamp(40px, 4.1vw, 62px);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.noa-stat__label { margin-top: 10px; font-size: 16px; letter-spacing: 0.02em; color: var(--noa-muted); }
.noa-stat__bar {
  position: relative; width: 168px; max-width: 70%; height: 3px; margin: 26px auto 0;
  background: rgba(240, 239, 228, 0.08); border-radius: 2px; overflow: visible;
}
.noa-stat__bar::before {
  content: ''; position: absolute; inset: 0; border-radius: 2px;
  background: linear-gradient(90deg, #ffffff, #ffffff 70%, var(--noa-blue));
  transform-origin: left; transform: scaleX(0);
  transition: transform 1.4s cubic-bezier(.2, .7, .2, 1) calc(0.25s + var(--i, 0) * 120ms);
}
.noa-stat__bar::after {   /* çubuğun ucunda küçük mavi nokta */
  content: ''; position: absolute; right: -3px; top: 50%; width: 7px; height: 7px; border-radius: 50%;
  background: var(--noa-blue); box-shadow: 0 0 10px var(--noa-blue);
  transform: translateY(-50%) scale(0);
  transition: transform 0.4s ease calc(1.5s + var(--i, 0) * 120ms);
}
.noa-stat.is-in .noa-stat__bar::before { transform: scaleX(1); }
.noa-stat.is-in .noa-stat__bar::after { transform: translateY(-50%) scale(1); }

/* ---- duyarlı ---- */
@media (max-width: 1100px) {
  .noa-info__providers { grid-template-columns: repeat(3, 1fr); }
  .noa-card { border-bottom: 1px solid var(--noa-line); }
  .noa-card:nth-child(3n) { border-right: 0; }
  .noa-info__stats { grid-template-columns: repeat(2, 1fr); row-gap: 48px; }
}
@media (max-width: 560px) {
  .noa-info__providers { grid-template-columns: repeat(2, 1fr); }
  .noa-card { min-height: 92px; padding: 14px; }
  .noa-card img { max-width: 82%; max-height: 40px; }
  .noa-card:nth-child(3n) { border-right: 1px solid var(--noa-line); }
  .noa-card:nth-child(2n) { border-right: 0; }
  .noa-card:last-child { grid-column: 1 / -1; }
  .noa-info__stats { gap: 16px; row-gap: 40px; }
  .noa-stat__value { font-size: clamp(28px, 8vw, 38px); }
  .noa-stat__label { font-size: 14px; }
}

/* ---- hareketi azalt tercihi: her şey doğrudan son halinde ---- */
@media (prefers-reduced-motion: reduce) {
  .noa-info [data-reveal], .noa-info [data-reveal].is-in { opacity: 1; transform: none; transition: none; }
  .noa-card::before { display: none; }
  .noa-info__title::after, .noa-stat__bar::before { transform: scaleX(1); transition: none; }
  .noa-stat__bar::after { transform: translateY(-50%) scale(1); transition: none; }
}