/* Elowide Projects - Frontend styles
   Brand colors:
   Primary: #6001d3
   Accent:  #fd346e
*/
.elw-projects-section{max-width:1200px;margin:70px auto;padding:24px 18px 48px;font-family:inherit;position:relative}
.elw-projects-header{text-align:center;margin-bottom:18px}
.elw-projects-title{font-size:34px;color:#6001d3;margin:0 0 8px;font-weight:700}
.elw-projects-subtitle{color:#444;max-width:820px;margin:0 auto 22px;font-size:15}

/* When AJAX is running we add a blur class to the section */
.elw-projects-section.elw-blur{filter:blur(2.5px);pointer-events:none;opacity:0.95;transition:filter .12s ease}

/* Filter bar - pill buttons centered */
.elw-filter-bar{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:28px;padding:6px}
.elw-filter-btn{background:#fff;border:2px solid #e6e6e6;padding:8px 16px;border-radius:999px;font-weight:600;color:#333;cursor:pointer;transition:all .18s ease}
.elw-filter-btn:hover{border-color:#fd346e;color:#fd346e}
.elw-filter-btn.active{background:#6001d3;border-color:#6001d3;color:#fff;box-shadow:0 6px 18px rgba(96,1,211,0.12)}

/* Grid & cards - default to 2 columns */
.elw-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
@media(max-width:900px){.elw-grid{grid-template-columns:1fr}}

/* Two-column variant (used by projects_grid shortcode) */
.elw-grid.elw-grid-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.elw-grid.elw-grid-2{grid-template-columns:1fr}}

/* Card visual - light border & hover lift */
.elw-card{background:#fff;border-radius:12px;overflow:hidden;border:2px solid #e7e7e7;display:flex;flex-direction:column;box-shadow:0 8px 18px rgba(0,0,0,0.04);transition:transform .22s ease, box-shadow .22s ease}
.elw-card:hover{transform:translateY(-8px) scale(1.01);box-shadow:0 18px 40px rgba(96,1,211,0.08)}
.elw-card.elw-featured{box-shadow:0 14px 36px rgba(96,1,211,0.06);border-width:2px}

/* Media container: fixed height; image positioned absolute.
   We rely on JavaScript to animate transform; keep image behavior predictable.
*/
.elw-card-media{height:320px;position:relative;overflow:hidden;background:#fafafa}
.elw-card-media img.elw-screenshot{position:absolute;left:0;top:0;width:100%;height:auto;display:block;transform:translateY(0);will-change:transform}

/* content area */
.elw-card-body{display:flex;justify-content:space-between;align-items:flex-start;padding:16px 18px}
.elw-left{max-width:68%}
.elw-title{font-size:18px;margin:0 0 6px;color:#222}
.elw-title .elw-title-link, .elw-title-link{color:inherit;text-decoration:none}
.elw-title-link:hover{text-decoration:underline}
.elw-client-url{font-size:13px;color:#6b6b6b}
.elw-client{display:block;font-weight:700;color:#222}
.elw-url{display:block;color:#6001d3;text-decoration:none;margin-top:4px;word-break:break-all}

.elw-right{text-align:right;min-width:120px}
.elw-meta-date,.elw-meta-cat{font-size:13px;color:#888}

/* description - hidden by default */
.elw-desc{padding:14px 18px 18px;color:#444;border-top:1px solid #fafafa;background:#fff}
.elw-desc-toggle{padding:12px 18px 20px}
.elw-more-btn{background:#fff;border:1px solid #e6e6e6;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;color:#333;display:inline-flex;align-items:center}
.elw-arrow{display:inline-block;margin-left:8px;transition:transform .2s}
.elw-arrow.open{transform:rotate(180deg)}

/* placeholder */
.elw-noimg{height:320px;display:flex;align-items:center;justify-content:center;color:#999}

/* Load more button style */
#elw-load-more{background:#6001d3;color:#fff;border:0;padding:12px 18px;border-radius:10px;cursor:pointer;font-weight:700}
#elw-load-more:hover{background:#fd346e}

/* Inline projects wrapper (used by projects_grid) */
.elw-projects-inline{max-width:1200px;margin:30px auto;padding:6px}

/* small screens */
@media (max-width:480px){
	.elw-projects-title{font-size:22px}
	.elw-card-media{height:260px}
	.elw-noimg{height:260px}
}