.epm-wrap{width:100%}

.epm-filters{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  margin:0 0 18px;
  position:relative;
  z-index:9999; /* keep dropdown above grid */
}
.epm-filters select{
  width:100%;
  padding:10px 12px;
  border:1px solid #e6e6e6;
  border-radius:10px;
  background:#fff;
}
@media(max-width:767px){
  .epm-filters{grid-template-columns:1fr;}
}

.epm-grid{
  display:grid;
  gap:28px;
}

.epm-grid[data-cols="1"]{grid-template-columns:repeat(1,1fr)}
.epm-grid[data-cols="2"]{grid-template-columns:repeat(2,1fr)}
.epm-grid[data-cols="3"]{grid-template-columns:repeat(3,1fr)}
.epm-grid[data-cols="4"]{grid-template-columns:repeat(4,1fr)}
.epm-grid[data-cols="5"]{grid-template-columns:repeat(5,1fr)}
.epm-grid[data-cols="6"]{grid-template-columns:repeat(6,1fr)}

@media(max-width:1024px){
  .epm-grid{grid-template-columns:repeat(var(--epm-cols-t,2),1fr)}
}
@media(max-width:767px){
  .epm-grid{grid-template-columns:repeat(var(--epm-cols-m,1),1fr)}
}

/* We set CSS vars via JS-less: using attributes in inline style is complex; fallback via media queries below */
.epm-grid[data-cols-t="1"]{--epm-cols-t:1}
.epm-grid[data-cols-t="2"]{--epm-cols-t:2}
.epm-grid[data-cols-t="3"]{--epm-cols-t:3}
.epm-grid[data-cols-t="4"]{--epm-cols-t:4}
.epm-grid[data-cols-m="1"]{--epm-cols-m:1}
.epm-grid[data-cols-m="2"]{--epm-cols-m:2}
.epm-grid[data-cols-m="3"]{--epm-cols-m:3}

.epm-card{
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  transition:transform .25s ease, box-shadow .25s ease;
  border:1px solid rgba(0,0,0,.05);
}
.epm-card:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 38px rgba(0,0,0,.12);
}
.epm-thumb{position:relative}
.epm-thumb img{
  width:100%;
  height:190px;
  object-fit:cover;
  display:block;
}
.epm-thumb-ph{
  height:190px;
  background:linear-gradient(135deg,#f2f2f2,#e9e9e9);
}
.epm-badge{
  position:absolute;
  top:12px;
  left:12px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  background:#e75e07;
  color:#fff;
  box-shadow:0 8px 18px rgba(0,0,0,.15);
}
.epm-featured{
  outline:2px solid rgba(231,94,7,.35);
  outline-offset:-2px;
}
.epm-body{padding:18px}
.epm-logo{max-height:38px;display:block;margin-bottom:10px}
.epm-title{margin:0 0 10px;font-size:18px;line-height:1.25}

.epm-meta{
  list-style:none;
  padding:0;
  margin:0 0 10px;
  font-size:13px;
  color:#555;
}
.epm-meta li{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
}
.epm-dot{
  width:6px;height:6px;border-radius:50%;
  background:#cfcfcf;display:inline-block;
  flex:0 0 6px;
}

.epm-ico{
  width:14px;height:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 14px;
}
.epm-ico-svg svg{
  width:14px;height:14px;
  display:block;
  fill:currentColor;
}

.epm-scope{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.6;
  font-style:italic;
  color:#333;
  display:flex;
  gap:8px;
  align-items:flex-start;
}
.epm-scope strong{font-style:normal}

.epm-min-row{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0}
.epm-min-pill{
  display:inline-flex;
  padding:6px 10px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:999px;
  font-size:12px;
  background:#fafafa;
}


/* ===== FIXED RESPONSIVE GRID ===== */
.epm-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  gap:28px;
}

@media (max-width:1024px){
  .epm-grid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width:767px){
  .epm-grid{
    grid-template-columns:1fr !important;
  }
}

/* ===== FILTERS 3-IN-A-ROW (DESKTOP) ===== */
.epm-filters{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  gap:14px;
  align-items:center;
}

.epm-filters select{
  width:100% !important;
}

@media (max-width:767px){
  .epm-filters{
    grid-template-columns:1fr !important;
  }
}


/* ===== LOAD MORE BUTTON ===== */
.epm-loadmore-wrap{
  text-align:center;
  margin-top:40px;
}
.epm-loadmore{
  padding:14px 34px;
  border-radius:999px;
  border:1px solid #e75e07;
  background:#e75e07;
  color:#fff;
  font-weight:600;
  cursor:pointer;
  transition:all .25s ease;
}
.epm-loadmore:hover{
  background:#fff;
  color:#e75e07;
}
