/* =========================================================
   Ecopharmagri Blog Archive — page-only styles
   Uses css/style.css as the source of truth for theme/fonts.
   ========================================================= */
.blog-archive-page { min-height: 100vh; background: var(--body-bg); color: var(--body-text); }
.dark .blog-archive-page { background: var(--night-body); color: var(--night-text); }
.archive-hero {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(42px, 7vw, 88px) 20px clamp(48px, 7vw, 82px);
  background:
    radial-gradient(ellipse at 12% 18%, rgba(245,158,11,.20), transparent 35%),
    radial-gradient(ellipse at 86% 80%, rgba(22,163,74,.15), transparent 34%),
    var(--surface);
  border-bottom: 1px solid var(--border);
}
.dark .archive-hero { background: radial-gradient(ellipse at 12% 18%, rgba(245,158,11,.13), transparent 35%), radial-gradient(ellipse at 86% 80%, rgba(22,163,74,.20), transparent 34%), #102719; border-color: var(--night-border); }
.archive-hero-inner { width:min(100%, 1080px); margin:auto; text-align:center; }
.breadcrumbs { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; margin:0 0 22px; color:#64748b; font-size:.88rem; font-weight:700; }
.dark .breadcrumbs { color:#aab8ae; }
.breadcrumbs a { color:var(--brand-dark); transition:color .2s ease; }
.dark .breadcrumbs a { color:#86d39a; }
.breadcrumbs .crumb-separator { color:var(--brand); }
.archive-kicker { display:inline-flex; align-items:center; gap:9px; padding:8px 15px; border:1px solid rgba(22,163,74,.18); border-radius:999px; background:rgba(22,163,74,.09); color:#16803d; font-size:.9rem; font-weight:800; }
.dark .archive-kicker { color:#9ce5ac; background:rgba(22,163,74,.14); border-color:rgba(134,211,154,.22); }
.archive-kicker svg { width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8; }
.archive-hero h1 { max-width:900px; margin:18px auto 14px; color:var(--body-text); font-size:clamp(2rem,5vw,3.7rem); font-weight:900; line-height:1.25; letter-spacing:-.035em; }
.dark .archive-hero h1 { color:#f4f8f5; }
.archive-hero h1 span { color:var(--brand-dark); }
.dark .archive-hero h1 span { color:#f6b83f; }
.archive-hero p { max-width:720px; margin:0 auto; color:#64748b; font-size:clamp(.98rem,1.6vw,1.12rem); line-height:2; }
.dark .archive-hero p { color:#b4c4b9; }
.archive-stats { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:26px; }
.archive-stat { display:inline-flex; align-items:center; gap:8px; padding:8px 13px; border:1px solid var(--border); border-radius:12px; background:var(--surface); color:var(--body-text); font-size:.86rem; font-weight:700; }
.archive-stat svg { width:17px;height:17px;stroke:var(--brand-dark);fill:none;stroke-width:1.8; }
.dark .archive-stat { background:#173321; border-color:var(--night-border); color:#e2eee5; }
.dark .archive-stat svg { stroke:#f6b83f; }
.archive-main { width:min(100% - 32px, 1280px); margin:34px auto 72px; }
.archive-toolbar { display:grid; grid-template-columns:minmax(220px,1fr) auto; align-items:center; gap:18px; padding:18px; margin-bottom:24px; border:1px solid var(--border); border-radius:18px; background:var(--surface); box-shadow:0 12px 32px rgba(0,0,0,.035); }
.dark .archive-toolbar { background:#112719; border-color:var(--night-border); box-shadow:0 12px 32px rgba(0,0,0,.18); }
.archive-search { position:relative; min-width:0; }
.archive-search svg { position:absolute; inset-inline-start:15px; top:50%; width:19px;height:19px; transform:translateY(-50%); stroke:#87958a;fill:none;stroke-width:2; pointer-events:none; }
.archive-search input { width:100%; min-height:48px; padding:10px 46px 10px 14px; border:1px solid var(--border); border-radius:12px; outline:none; background:var(--body-bg); color:var(--body-text); font:inherit; font-size:.95rem; transition:border-color .2s, box-shadow .2s; }
.archive-search input:focus { border-color:var(--brand-dark); box-shadow:0 0 0 3px rgba(22,163,74,.12); }
.dark .archive-search input { background:#0c2114; border-color:var(--night-border); color:#f1f5f2; }
.archive-filters { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.archive-filter { min-height:42px; padding:8px 14px; border:1px solid var(--border); border-radius:11px; background:transparent; color:var(--body-text); font:inherit; font-size:.9rem; font-weight:800; cursor:pointer; transition:background .2s,color .2s,border-color .2s,transform .2s; }
.archive-filter:hover { transform:translateY(-1px); border-color:var(--brand-dark); }
.archive-filter.active { border-color:var(--brand-dark); background:var(--brand-dark); color:#fff; }
.dark .archive-filter { border-color:var(--night-border); color:#e2eee5; }
.dark .archive-filter.active { border-color:#2b9850; background:#23783c; color:#fff; }
.archive-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 0 22px; }
.archive-section-heading h2 { margin:0; color:var(--body-text); font-size:clamp(1.35rem,2.5vw,2rem); font-weight:900; }
.dark .archive-section-heading h2 { color:#f2f7f3; }
.archive-section-heading p { margin:4px 0 0; color:#7b8790; font-size:.92rem; }
.dark .archive-section-heading p { color:#a7b7ac; }
.archive-results-count { flex:none; color:var(--brand-dark); font-size:.9rem; font-weight:800; }
.dark .archive-results-count { color:#f6b83f; }
.archive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.archive-card { --blog-delay:0s; min-width:0; overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--border); border-radius:20px; background:var(--surface); box-shadow:0 12px 30px rgba(0,0,0,.045); transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease; }
.archive-card:hover { transform:translateY(-7px); border-color:rgba(22,163,74,.38); box-shadow:0 22px 42px rgba(16,70,35,.12); }
.dark .archive-card { background:#112719; border-color:var(--night-border); box-shadow:0 14px 32px rgba(0,0,0,.18); }
.archive-card[hidden] { display:none !important; }
.archive-card-image { position:relative; height:245px; overflow:hidden; background:#e8efe8; }
.dark .archive-card-image { background:#0d2014; }
.archive-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
.archive-card:hover .archive-card-image img { transform:scale(1.055); }
.archive-card-image::after { content:""; position:absolute; inset:35% 0 0; background:linear-gradient(to top,rgba(3,20,10,.48),transparent); pointer-events:none; }
.archive-category { position:absolute; z-index:1; top:15px; inset-inline-start:15px; display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border:1px solid rgba(255,255,255,.4); border-radius:999px; background:rgba(8,45,20,.78); color:#fff; font-size:.77rem; font-weight:800; backdrop-filter:blur(8px); }
.archive-card-content { display:flex; flex:1; flex-direction:column; padding:21px; }
.archive-meta { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:12px; color:#7b8790; font-size:.8rem; font-weight:700; }
.archive-meta span { display:inline-flex; align-items:center; gap:5px; }
.archive-meta svg { width:15px;height:15px;stroke:var(--brand-dark);fill:none;stroke-width:1.8; }
.dark .archive-meta { color:#a8b8ad; }
.dark .archive-meta svg { stroke:#f6b83f; }
.archive-card h3 { margin:0 0 10px; font-size:1.22rem; font-weight:900; line-height:1.65; color:var(--body-text); }
.dark .archive-card h3 { color:#f1f7f2; }
.archive-card p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; min-height:5.25em; margin:0 0 18px; color:#697780; font-size:.93rem; line-height:1.8; }
.dark .archive-card p { color:#b1c0b6; }
.archive-card-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:15px; border-top:1px solid var(--border); }
.dark .archive-card-bottom { border-color:rgba(255,255,255,.1); }
.archive-author { display:flex; align-items:center; gap:9px; min-width:0; color:#65736a; font-size:.8rem; font-weight:800; }
.dark .archive-author { color:#bdcbbf; }
.archive-author-avatar { display:grid; place-items:center; width:34px;height:34px; flex:0 0 34px; border-radius:11px; background:rgba(22,163,74,.12); color:var(--brand-dark); font-weight:900; }
.dark .archive-author-avatar { background:rgba(22,163,74,.2); color:#a1e6ad; }
.archive-read-link { display:inline-flex; align-items:center; gap:7px; flex:none; color:var(--brand-dark); font-size:.9rem; font-weight:900; }
.archive-read-link svg { width:17px;height:17px; stroke:currentColor;fill:none;stroke-width:2; transition:transform .2s; }
.archive-read-link:hover svg { transform:translateX(-3px); }
.dark .archive-read-link { color:#f6b83f; }
.archive-empty { display:none; padding:34px 18px; border:1px dashed var(--border); border-radius:16px; text-align:center; color:#7b8790; }
.archive-empty.show { display:block; }
.archive-pagination { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:34px; }
.archive-page-number { display:grid; place-items:center; width:42px;height:42px; border:1px solid var(--border); border-radius:12px; background:var(--surface); color:var(--body-text); font-weight:800; }
.archive-page-number.active { background:var(--brand-dark); color:#fff; border-color:var(--brand-dark); }
.dark .archive-page-number { background:#112719; border-color:var(--night-border); color:#e2eee5; }
.dark .archive-page-number.active { background:#23783c; color:#fff; }
@media (max-width:1050px) { .archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .archive-toolbar { grid-template-columns:1fr; } .archive-filters { justify-content:flex-start; } }
@media (max-width:640px) {
 .archive-hero { padding:38px 16px 44px; }
 .archive-main { width:min(100% - 24px,1280px); margin-top:22px; }
 .archive-toolbar { padding:12px; gap:12px; border-radius:15px; }
 .archive-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .archive-filter { width:100%; font-size:.86rem; }
 .archive-section-heading { align-items:flex-start; flex-direction:column; gap:6px; }
 .archive-grid { grid-template-columns:1fr; gap:16px; }
 .archive-card-image { height:clamp(210px,62vw,300px); }
 .archive-card-content { padding:17px; }
 .archive-card h3 { font-size:1.12rem; }
 .archive-card p { min-height:0; }
 .archive-pagination { margin-top:24px; }
}