/* Elementor Category Posts Display - Styles */
.ecpd-wrapper { --ecpd-gap: 20px; --ecpd-radius: 12px; }
.ecpd-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ecpd-list { display: flex; flex-direction: column; gap: 20px; }

.ecpd-item {
  background: #fff;
  border: 1px solid #eee;
  border-radius: var(--ecpd-radius);
  overflow: hidden;
  transition: all .4s cubic-bezier(.2,.8,.2,1);
  position: relative;
  display: flex;
  flex-direction: column;
}
.ecpd-thumb { position: relative; overflow: hidden; line-height: 0; }
.ecpd-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease, filter .6s ease; display:block; }
.ecpd-no-thumb { background: #f3f4f6; aspect-ratio: 16/9; display:flex; align-items:center; justify-content:center; color:#9ca3af; font-size:14px; }

.ecpd-content { padding: 20px; flex: 1; display:flex; flex-direction:column; }
.ecpd-meta { font-size: 12px; color: #6b7280; margin-bottom: 8px; letter-spacing:.3px; }
.ecpd-title { margin: 0 0 10px; font-size: 20px; line-height: 1.3; font-weight:700; }
.ecpd-title a { text-decoration:none; color:#111827; transition: color .3s; }
.ecpd-excerpt { font-size: 14px; color:#4b5563; line-height:1.6; margin-bottom:14px; flex:1; }
.ecpd-readmore { display:inline-block; font-size:13px; font-weight:600; color:#2563eb; text-decoration:none; margin-top:auto; }
.ecpd-readmore:hover { color:#1d4ed8; }
.ecpd-cat-badge { position:absolute; top:12px; right:12px; background:#111827; color:#fff; font-size:11px; padding:4px 10px; border-radius:20px; z-index:2; }

/* Ratios */
.ecpd-ratio-1-1 .ecpd-thumb { aspect-ratio: 1/1; }
.ecpd-ratio-4-3 .ecpd-thumb { aspect-ratio: 4/3; }
.ecpd-ratio-16-9 .ecpd-thumb { aspect-ratio: 16/9; }
.ecpd-ratio-21-9 .ecpd-thumb { aspect-ratio: 21/9; }
.ecpd-ratio-auto .ecpd-thumb { aspect-ratio: auto; }

/* Hover Effects */
.ecpd-hover-lift .ecpd-item:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.ecpd-hover-zoom-in .ecpd-item:hover .ecpd-thumb img { transform: scale(1.08); }
.ecpd-hover-zoom-out .ecpd-thumb img { transform: scale(1.08); }
.ecpd-hover-zoom-out .ecpd-item:hover .ecpd-thumb img { transform: scale(1); }
.ecpd-hover-grayscale .ecpd-thumb img { filter: grayscale(100%); }
.ecpd-hover-grayscale .ecpd-item:hover .ecpd-thumb img { filter: grayscale(0%); }
.ecpd-hover-overlay-slide .ecpd-overlay-bg { position:absolute; inset:0; background: linear-gradient(transparent, rgba(37,99,235,.85)); opacity:0; transform: translateY(20%); transition: all .4s; }
.ecpd-hover-overlay-slide .ecpd-item:hover .ecpd-overlay-bg { opacity:1; transform: translateY(0); }

/* Layouts */
.ecpd-layout-grid-minimal .ecpd-item { border:none; box-shadow:none; background:transparent; }
.ecpd-layout-grid-minimal .ecpd-content { padding: 14px 0 0; }
.ecpd-layout-grid-overlay .ecpd-item { position:relative; min-height: 300px; }
.ecpd-layout-grid-overlay .ecpd-thumb { position:absolute; inset:0; }
.ecpd-layout-grid-overlay .ecpd-content { position:absolute; bottom:0; left:0; right:0; background: linear-gradient(transparent, rgba(0,0,0,.8)); color:#fff; z-index:2; }
.ecpd-layout-grid-overlay .ecpd-title a, .ecpd-layout-grid-overlay .ecpd-excerpt, .ecpd-layout-grid-overlay .ecpd-meta { color:#fff; }
.ecpd-layout-grid-overlay .ecpd-readmore { color:#fff; border:1px solid rgba(255,255,255,.5); padding:6px 14px; border-radius:20px; }

.ecpd-layout-list-side .ecpd-item { flex-direction: row; }
.ecpd-layout-list-side .ecpd-thumb { width: 35%; flex-shrink:0; }
.ecpd-layout-list-side .ecpd-content { width:65%; }

.ecpd-layout-list-zigzag .ecpd-item:nth-child(even) { flex-direction: row-reverse; }
.ecpd-layout-list-zigzag .ecpd-item { flex-direction: row; }
.ecpd-layout-list-zigzag .ecpd-thumb { width: 45%; }
.ecpd-layout-list-zigzag .ecpd-content { width:55%; padding:30px; justify-content:center; }

.ecpd-layout-masonry .ecpd-grid { display: block; column-count: 3; column-gap: 20px; }
.ecpd-layout-masonry .ecpd-item { break-inside: avoid; margin-bottom: 20px; }

/* Entry Animations */
.ecpd-anim-fade .ecpd-item { animation: ecpdFade .6s both; }
.ecpd-anim-fade-up .ecpd-item { animation: ecpdFadeUp .7s both; }
.ecpd-anim-scale .ecpd-item { animation: ecpdScale .6s both; }
.ecpd-anim-slide .ecpd-item { animation: ecpdSlide .6s both; }
@keyframes ecpdFade { from{opacity:0} to{opacity:1} }
@keyframes ecpdFadeUp { from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)} }
@keyframes ecpdScale { from{opacity:0; transform:scale(.9)} to{opacity:1; transform:scale(1)} }
@keyframes ecpdSlide { from{opacity:0; transform:translateX(-20px)} to{opacity:1; transform:translateX(0)} }

/* Responsive */
@media(max-width:1024px){ .ecpd-grid{ grid-template-columns: repeat(2,1fr) !important; } .ecpd-layout-masonry .ecpd-grid{ column-count:2; } }
@media(max-width:767px){
  .ecpd-grid{ grid-template-columns: 1fr !important; }
  .ecpd-layout-masonry .ecpd-grid{ column-count:1; }
  .ecpd-layout-list-side .ecpd-item, .ecpd-layout-list-zigzag .ecpd-item{ flex-direction:column !important; }
  .ecpd-layout-list-side .ecpd-thumb, .ecpd-layout-list-side .ecpd-content, .ecpd-layout-list-zigzag .ecpd-thumb, .ecpd-layout-list-zigzag .ecpd-content{ width:100%; }
}

.ecpd-empty { padding:40px; text-align:center; background:#f9fafb; border:1px dashed #d1d5db; border-radius:12px; color:#6b7280; }
