/* ============================================================
   PROJELER — bilgin.studio/tr/projeler/ birebir uyarlama
   Ölçüler siteden okunarak alındı.
   ============================================================ */

.pr-sayfa{
  background:#F0F0F0;
  font-family:var(--font);
  font-weight:300; font-size:16px; line-height:24px; color:#414145;
}

/* --- kapsayıcılar (module-inside > container-masonry) --- */
/* bilgin: .module-inside padding 0 20px, max-width YOK — ızgara akışkan */
.pr-inside{ max-width:none; margin:0 0 40px; padding:0 20px; }
.page{ padding-inline:0; }

/* --- filtre çubuğu --- */
.pr-filtre{ margin:0 0 20px; text-align:left; }
.pr-filtre ul{ list-style:none; margin:0; padding:0; }
.pr-filtre li{ display:inline-block; margin:0 20px; padding:0; }
.pr-filtre a{
  font-family:var(--font);
  font-size:12px; font-weight:700; line-height:18px;
  color:#DD5656; text-decoration:none; letter-spacing:normal;
  cursor:pointer; background:none; border:0; padding:0;
  transition:opacity .3s ease;
}
/* Sayaç etikete yapışık duruyordu ("PROJELER9"); ayrıldı ve üst indise alındı. */
.pr-filtre a sup{ font-size:10px; font-weight:700; vertical-align:super;
  margin-left:4px; opacity:.7; }
.pr-filtre a:hover{ opacity:.65; }
.pr-filtre a.pasif{ color:#414145; }

/* --- ızgara: masonry karşılığı --- */
.pr-grid{
  margin:-15px -10px;
  display:grid; grid-template-columns:repeat(3,1fr);
  align-items:start;
}
.pr-item{ padding:15px 10px; }
.pr-inside2{ position:relative; overflow:hidden; }

/* --- kapak: 1:1 kare, iki katmanlı --- */
.pr-brick{ position:relative; padding-top:100%; overflow:hidden; background:#e4e4e4; }
.pr-brick img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:50% 50%;
}
.pr-brick img.kat1{ z-index:2; filter:grayscale(1); transition:opacity .5s; opacity:1; }
.pr-brick img.kat2{ z-index:1; }
.pr-inside2:hover .pr-brick img.kat1{ opacity:0; }

/* Dokunmatik cihazda hover yok: gri katman hiç kalkmıyor, kartlar sonsuza kadar
   gri kalıyordu. Fare olmayan cihazlarda renkli katman doğrudan gösterilir. */
@media (hover: none){
  .pr-brick img.kat1{ opacity:0; }
}
.pr-mask{ position:absolute; inset:0; z-index:3; display:block; }

/* --- kapak altı metin --- */
.pr-metin{ padding:0; }   /* bilgin: metin blogu gorsele bitisik, ust bosluk YOK
                             (gorsel alti 642 = baslik ustu 642) */
.pr-tit{
  font-family:var(--font);
  font-size:18px; font-weight:700; line-height:27px;
  color:#313139; margin:0;
}
.pr-tit a{ color:#414145; text-decoration:none; transition:color .3s ease; }
.pr-tit a:hover{ color:#DD5656; }
.pr-des{
  font-family:var(--font);
  font-size:12px; font-weight:600; line-height:18px; color:#414145; margin:0;
}
.pr-cate{
  display:block; margin:0 0 0 -3px;
  font-family:var(--font);
  font-size:12px; font-weight:300; line-height:18px; color:#414145;
}
.pr-cate a{ display:inline-block; margin:0 3px; color:#414145; text-decoration:none; transition:color .3s ease; }
.pr-cate a:hover{ color:#DD5656; }

/* --- gizlenen kart --- */
.pr-item.gizli{ display:none; }

/* --- kırılma noktaları (sitedeki gibi) --- */
@media (max-width:1024px){
  .pr-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px){
  .pr-sayfa{ font-size:12px; line-height:18px; }
  .pr-grid{ grid-template-columns:1fr; }
  .pr-filtre li{ margin:0 14px 6px 0; }
  .pr-tit{ font-size:14px; line-height:21px; }
}

/* --- müşteriden bilgi bekleyen satırlar --- */
/* Ölçüler bilgin ile aynı; yalnızca renk soluk ve kesikli çizgi ile işaretli,
   böylece gerçek içerikle karışmıyor. Metin girilince sınıf kendiliğinden düşüyor. */
/* text-decoration kullaniliyor: kutu olculerini HIC degistirmiyor,
   boylece satir ritmi bilgin ile birebir kaliyor */
.pr-des.bekliyor, .pr-cate.bekliyor{ color:#A8A8AE; }
.pr-des.bekliyor, .pr-cate.bekliyor span{
  text-decoration:underline dashed #CFCFD4; text-underline-offset:3px; }
.pr-cate.bekliyor span{ display:inline-block; margin:0 3px; }