/* ── EuroSOR Articles Grid ─────────────────────────── */
.esa-grid-wrap{font-family:'Inter',system-ui,-apple-system,sans-serif;max-width:1200px;margin:0 auto;padding:0 24px}

/* ── Hero Banner ──────────────────────────────────── */
.esa-hero-banner{position:relative;border-radius:14px;overflow:hidden;margin-bottom:32px;padding:56px 48px;background:#1F2A44;background-image:url('https://images.unsplash.com/photo-1519677100203-a0e668c92439?w=1400&q=80');background-size:cover;background-position:center 40%}
.esa-hero-banner::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(31,42,68,.92) 0%,rgba(31,42,68,.75) 50%,rgba(31,42,68,.6) 100%)}
.esa-hero-inner{position:relative;z-index:2;max-width:600px}
.esa-hero-label{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:#FF7A1A;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.esa-hero-label::before{content:'';display:inline-block;width:24px;height:2px;background:#FF7A1A}
.esa-hero-title{font-size:34px;font-weight:800;color:#fff;line-height:1.15;margin:0 0 14px;letter-spacing:-.3px}
.esa-hero-desc{font-size:15px;color:#a8b8d0;line-height:1.7;margin:0 0 28px}
.esa-hero-stats{display:flex;gap:36px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.esa-hero-stat{display:flex;flex-direction:column}
.esa-hero-stat-num{font-size:26px;font-weight:800;color:#fff;line-height:1}
.esa-hero-stat-num::after{content:'';display:inline}
.esa-hero-stat-label{font-size:11px;color:#a8b8d0;text-transform:uppercase;letter-spacing:.04em;margin-top:6px}

/* ── Toolbar ──────────────────────────────────────── */
.esa-grid-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:20px}
.esa-grid-search{position:relative;flex:1;min-width:220px}
.esa-grid-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);pointer-events:none}
.esa-search-input{width:100%;padding:11px 14px 11px 42px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;background:#fff;transition:border-color .2s}
.esa-search-input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.1)}
.esa-grid-filter select{padding:11px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;background:#fff;cursor:pointer;min-width:180px}

/* ── Count ────────────────────────────────────────── */
.esa-grid-count{font-size:13px;color:#94a3b8;margin-bottom:16px}
.esa-grid-count span{font-weight:600;color:#64748b}

/* ── Grid ─────────────────────────────────────────── */
.esa-grid{display:grid;gap:20px}
.esa-grid>*:not(.esa-card):not(.esa-no-results){display:none!important}
.esa-cols-1{grid-template-columns:1fr}
.esa-cols-2{grid-template-columns:repeat(2,1fr)}
.esa-cols-3{grid-template-columns:repeat(3,1fr)}
.esa-cols-4{grid-template-columns:repeat(4,1fr)}

/* ── Card ─────────────────────────────────────────── */
.esa-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;text-decoration:none!important;color:inherit!important;transition:transform .25s,box-shadow .25s;animation:esaFadeUp .4s ease both}
.esa-card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,0,0,.08)}
.esa-card *{text-decoration:none!important}

/* Card image */
.esa-card-img{height:180px;background-size:cover;background-position:center;background-color:#f1f5f9;position:relative}
.esa-card-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 60%,rgba(0,0,0,.06) 100%)}

/* Card body */
.esa-card-body{padding:20px;display:flex;flex-direction:column;flex:1}
.esa-card-series{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#FF7A1A;margin-bottom:8px}
.esa-card-title{font-size:17px;font-weight:700;color:#1e293b!important;line-height:1.3;margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.esa-card-excerpt{font-size:13px;color:#64748b!important;line-height:1.65;margin:0 0 14px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Tags */
.esa-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.esa-card-tag{font-size:10px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:3px 10px;border-radius:20px;background:#f1f5f9;color:#475569!important;border:1px solid #e2e8f0}

/* Meta row */
.esa-card-meta{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid #f1f5f9}
.esa-card-date{font-size:12px;color:#94a3b8!important}
.esa-card-arrow{font-size:13px;font-weight:600;color:#2563eb!important;transition:transform .2s}
.esa-card:hover .esa-card-arrow{transform:translateX(3px)}

/* ── Load more ────────────────────────────────────── */
.esa-grid-footer{text-align:center;padding-top:28px}
.esa-load-more{display:inline-flex;align-items:center;gap:6px;padding:12px 28px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;font-size:14px;font-weight:600;color:#1e293b;cursor:pointer;transition:all .2s;font-family:inherit}
.esa-load-more:hover{background:#f8fafc;border-color:#cbd5e1}
.esa-load-more.loading{opacity:.6;pointer-events:none}

/* No results */
.esa-no-results{text-align:center;padding:48px 24px;color:#94a3b8;font-size:15px;grid-column:1/-1}

/* ── Fade in animation ────────────────────────────── */
@keyframes esaFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.esa-grid .esa-card:nth-child(1){animation-delay:.05s}
.esa-grid .esa-card:nth-child(2){animation-delay:.1s}
.esa-grid .esa-card:nth-child(3){animation-delay:.15s}
.esa-grid .esa-card:nth-child(4){animation-delay:.2s}
.esa-grid .esa-card:nth-child(5){animation-delay:.25s}
.esa-grid .esa-card:nth-child(6){animation-delay:.3s}

/* ── Responsive ───────────────────────────────────── */
@media(max-width:1024px){
  .esa-cols-4,.esa-cols-3{grid-template-columns:repeat(2,1fr)}
  .esa-hero-banner{padding:40px 32px}
  .esa-hero-title{font-size:28px}
}
@media(max-width:640px){
  .esa-cols-4,.esa-cols-3,.esa-cols-2{grid-template-columns:1fr}
  .esa-grid-toolbar{flex-direction:column}
  .esa-grid-search{width:100%}
  .esa-grid-filter select{width:100%}
  .esa-hero-banner{padding:32px 24px;border-radius:10px}
  .esa-hero-title{font-size:24px}
  .esa-hero-stats{flex-wrap:wrap;gap:20px}
  .esa-hero-desc{font-size:14px}
}
