/* photo-band.php bileşeninin stilleri */
.pb-wrap{
  background:#fff;
  padding:28px 0 0;
  overflow:hidden;
}
.pb-inner{
  position:relative;
  max-height:360px;
  overflow:hidden;
  border-radius:var(--radius-lg);
  box-shadow:0 8px 40px rgba(26,58,107,.14);
  border:3px solid var(--cream-dk);
  outline:4px solid #fff;
  outline-offset:-10px;
}
.pb-inner img{
  width:100%;
  height:360px;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:transform .5s ease;
}
.pb-inner:hover img{transform:scale(1.02)}

.pb-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(15,35,71,.55) 0%, transparent 55%);
  pointer-events:none;
}
.pb-title{
  position:absolute;bottom:20px;left:24px;right:24px;
  color:#fff;
  font-family:var(--f-head);
  font-size:clamp(.95rem,2.5vw,1.35rem);
  font-weight:900;
  line-height:1.3;
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}

.pb-placeholder{
  width:100%;height:360px;
  background:linear-gradient(135deg,var(--cream) 0%,var(--cream-dk) 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  color:var(--gray-400);
}
.pb-placeholder i{font-size:2.5rem;color:var(--gray-200)}
.pb-placeholder span{font-size:.85rem;font-weight:600}

@media(max-width:768px){
  .pb-wrap{padding:20px 0 0}
  .pb-inner{max-height:220px;border-radius:var(--radius);outline-offset:-6px}
  .pb-inner img{height:220px}
  .pb-placeholder{height:220px}
  .pb-title{font-size:.9rem;bottom:14px;left:16px;right:16px}
}
@media(max-width:480px){
  .pb-inner{max-height:180px}
  .pb-inner img{height:180px}
  .pb-placeholder{height:180px}
}
