/* WDT — sosyal medya kanıt bloğu: telefon mockup çerçevesi
   Ayrı dosya: /styles.css tarayıcıda 30 gün immutable cache'li, yeni kural oraya eklenirse eski ziyaretçiye ulaşmaz. */

.sosyal-proof .phones{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:clamp(16px,2.4vw,32px);
  margin-top:clamp(22px,3vw,38px);
  align-items:start;
}
.sosyal-proof .phone{margin:0;display:flex;flex-direction:column;gap:14px;min-width:0}
.sosyal-proof .phone-frame{
  position:relative;
  padding:9px;
  border-radius:38px;
  background:linear-gradient(155deg,#2b2723 0%,#141210 55%,#0c0b0a 100%);
  border:1px solid rgba(237,232,223,.16);
  box-shadow:0 26px 48px -26px rgba(0,0,0,.85), 0 1px 0 rgba(255,255,255,.06) inset;
}
.sosyal-proof .phone-frame::before{ /* konuşma çentiği */
  content:"";position:absolute;z-index:2;top:5px;left:50%;transform:translateX(-50%);
  width:46px;height:4px;border-radius:2px;background:rgba(0,0,0,.62);
}
.sosyal-proof .phone-frame::after{ /* yan tuş */
  content:"";position:absolute;right:-2px;top:24%;width:2px;height:52px;border-radius:2px;
  background:rgba(237,232,223,.22);
}
.sosyal-proof .phone-frame img{display:block;width:100%;height:auto;border-radius:30px;background:#000}
.sosyal-proof .phone-cap{display:flex;flex-direction:column;gap:3px;font-size:13.5px;line-height:1.35}
.sosyal-proof .phone-cap b{font-weight:600;letter-spacing:.01em;word-break:break-word}
.sosyal-proof .phone-cap span{color:var(--muted)}
.sosyal-proof .phone-cap em{font-style:normal;color:var(--accent);font-variant-numeric:tabular-nums}
.sosyal-proof .phones-total{
  display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;
  margin:clamp(20px,2.6vw,30px) 0 0;padding-top:16px;border-top:1px solid var(--line-soft);
  font-size:13.5px;color:var(--muted);
}
.sosyal-proof .phones-total b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
@media (max-width:560px){
  .sosyal-proof .phones{grid-template-columns:1fr;max-width:320px;gap:26px}
}