/* ============================================================
   "Ne Dediler?" — ana sayfa video vitrini + musteri yorumlari.
   Yalnizca ana sayfada yuklenir (duzen.php: $buSablon === 'anasayfa').
   Site tasarim belirtecleriyle calisir; koyu tema kendiliginden uyar.
   ============================================================ */

/* --- Dikkat cekici, sinematik KOYU zemin ---
   Bolum komsu beyaz bolumlerden ve mavi ".band"tan ayrissin diye ayri bir
   indigo/mor/mavi gradyan tasir; video kartlari ve kirmizi oynat dugmeleri
   koyu zeminde cok daha cok one cikar. Ic kartlar/oklar/noktalar burada
   bilincli olarak ACIK renge sabitlenir (her iki temada okunur kalir). */
.nd-sec{
  position:relative; overflow:hidden; isolation:isolate;
  border-block:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(78% 130% at 82% -12%, rgba(124,58,237,.42), transparent 55%),
    radial-gradient(72% 130% at -2% 112%, rgba(21,128,208,.44), transparent 55%),
    linear-gradient(135deg, #151a3a 0%, #1d1247 52%, #0e2a52 100%);
  color:#fff;
}
.nd-sec .wrap{position:relative; z-index:1}
.nd-sec .head h2{color:#fff}
.nd-sec .eyebrow{color:#cdbcff}
.nd-sec .eyebrow::before{background:#F58A2E}
.nd-sec .lede{color:rgba(255,255,255,.84)}

/* Oklar — koyu zeminde beyaz */
.nd-sec .nd-ok{background:#fff; border-color:rgba(255,255,255,.55); color:#14233b}
.nd-sec .nd-ok:hover{background:#eef4fb}

/* Yorum kartlari — koyu zeminde ACIK kart (her temada okunur) */
.nd-sec .nd-yorum{
  background:#fff; border-color:rgba(255,255,255,.30);
  box-shadow:0 26px 54px -30px rgba(0,0,0,.75);
}
.nd-sec .nd-yorum__metin{color:#33506B}
.nd-sec .nd-yorum__metin::before{color:#0C5FAE}
.nd-sec .nd-yorum__kisi{color:#0F2438}
.nd-sec .nd-yorum__site{color:#5F7692}
.nd-sec .nd-yorum__site a{color:#0C5FAE}

/* Noktalar */
.nd-sec .nd-nokta button{background:rgba(255,255,255,.34)}
.nd-sec .nd-nokta button[aria-current="true"]{background:#fff}

.nd-rail-sar{position:relative; margin-top:8px}

/* --- Video seridi --- */
.nd-rail{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory;
  scroll-behavior:smooth; padding:6px 2px 14px;
  scrollbar-width:none; -ms-overflow-style:none;
}
.nd-rail::-webkit-scrollbar{display:none}

.nd-video{
  flex:0 0 auto; width:212px; aspect-ratio:9/16; position:relative;
  border-radius:16px; overflow:hidden; border:1px solid var(--line);
  background:#0b0f14; box-shadow:var(--shadow-card); scroll-snap-align:start;
}
@media (max-width:640px){ .nd-video{width:158px} }

.nd-video__kart{
  position:absolute; inset:0; display:block; width:100%; height:100%;
  background:transparent; border:0; cursor:pointer;
  padding:0; -webkit-appearance:none; appearance:none;
}
.nd-video__kart:focus-visible{outline:3px solid var(--brand); outline-offset:2px}
.nd-video__thumb{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block; transition:transform .35s ease;
}
.nd-video__kart:hover .nd-video__thumb{transform:scale(1.05)}

/* YouTube kirmizi oynat dugmesi */
.nd-video__oynat{
  position:absolute; inset:0; margin:auto; width:62px; height:44px;
  border-radius:12px; background:#f00;
  box-shadow:0 6px 20px -6px rgba(0,0,0,.6);
  display:grid; place-items:center; transition:transform .2s ease, background .2s ease;
  pointer-events:none;
}
.nd-video__oynat::after{
  content:""; width:0; height:0; margin-left:3px;
  border-style:solid; border-width:9px 0 9px 15px;
  border-color:transparent transparent transparent #fff;
}
.nd-video__kart:hover .nd-video__oynat{transform:scale(1.08); background:#ff1a1a}

/* Not: isim/kurum metin katmani KALDIRILDI — kapak gorseline zaten
   tasarlaniyor, ustune ikinci kez basmak tekrar oluyordu. */

/* Tiklaninca yerine oturan oynatici (YouTube iframe ya da <video>) */
.nd-video__cerceve{position:absolute; inset:0; width:100%; height:100%; border:0; display:block; object-fit:cover; background:#000}

/* --- Oklar (video + yorum ortak) --- */
.nd-ok{
  position:absolute; top:calc(50% - 14px); transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  background:var(--surface); border:1px solid var(--line-2);
  box-shadow:var(--shadow-lift); color:var(--text);
  display:grid; place-items:center; cursor:pointer; z-index:4;
  transition:background .15s ease, transform .15s ease;
}
.nd-ok:hover{background:var(--surface-2)}
.nd-ok:active{transform:translateY(-50%) scale(.94)}
.nd-ok svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round}
.nd-ok--geri{left:-10px}
.nd-ok--ileri{right:-10px}
.nd-ok[hidden]{display:none}
@media (max-width:640px){ .nd-ok{display:none} }

/* --- Yorum seridi --- */
.nd-yorumlar{margin-top:30px}
.nd-yrail{
  display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory;
  scroll-behavior:smooth; padding:6px 2px;
  scrollbar-width:none; -ms-overflow-style:none;
  /* Kartlar en uzun karta gore GERILMESIN; her biri kendi metni kadar
     yuksek olsun (yoksa kisa yorumun altinda bosluk kaliyordu). */
  align-items:flex-start;
}
.nd-yrail::-webkit-scrollbar{display:none}

.nd-yorum{
  flex:0 0 auto; width:min(500px, 84%); scroll-snap-align:center;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:17px 24px; box-shadow:var(--shadow-card);
  text-align:center; display:block;
}
.nd-yorum__metin{margin:0; color:var(--text-2); line-height:1.58; font-size:.9rem}
.nd-yorum__metin::before{content:"\201C"; color:var(--brand); font:800 1.25em/0 var(--f-display); vertical-align:-.32em; margin-right:.1em}
.nd-yorum__kisi{margin-top:12px; font:800 .9rem/1.3 var(--f-display); color:var(--text); letter-spacing:.3px}
.nd-yorum__site{margin-top:2px; font-size:.8rem; color:var(--muted)}
.nd-yorum__site a{color:var(--brand); text-decoration:none}
.nd-yorum__site a:hover{text-decoration:underline}

/* Nokta gostergesi (yorumlar) */
.nd-nokta{display:flex; justify-content:center; gap:8px; margin-top:18px}
.nd-nokta button{
  width:8px; height:8px; padding:0; border:0; border-radius:50%;
  background:var(--line-2); cursor:pointer; transition:background .2s ease, transform .2s ease;
}
.nd-nokta button[aria-current="true"]{background:var(--brand); transform:scale(1.35)}

/* --- Mobil: yorum kutulari ve yazilar biraz daha kucuk --- */
@media (max-width:640px){
  .nd-yorumlar{margin-top:22px}
  .nd-yorum{width:min(420px, 80%); padding:16px 18px; border-radius:14px}
  .nd-yorum__metin{font-size:.86rem; line-height:1.58}
  .nd-yorum__metin::before{font-size:1.2em}
  .nd-yorum__kisi{margin-top:11px; font-size:.86rem}
  .nd-yorum__site{font-size:.76rem}
  .nd-yrail{gap:14px}
}