/* ---- VOLUNTEER LISTING SPECIFIC ---- */
.vol-hero-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:-60px; position:relative; z-index:10; padding:0 28px; max-width:1240px; margin-left:auto; margin-right:auto; margin-bottom:0; }
.vhs-card { background:#fff; border-radius:var(--radius); padding:28px; text-align:center; box-shadow:var(--shadow-lg); border-top:4px solid; }
.vhs-card:nth-child(1) { border-color:var(--blue-primary); }
.vhs-card:nth-child(2) { border-color:var(--green); }
.vhs-card:nth-child(3) { border-color:var(--gold); }
.vhs-card:nth-child(4) { border-color:#e91e63; }
.vhs-num { font-family:'Playfair Display',serif; font-size:2.6rem; font-weight:900; color:var(--blue-primary); }
.vhs-card:nth-child(2) .vhs-num { color:var(--green); }
.vhs-card:nth-child(3) .vhs-num { color:var(--gold-dark); }
.vhs-card:nth-child(4) .vhs-num { color:#e91e63; }
.vhs-label { font-size:13px; color:var(--text-mid); font-weight:600; margin-top:4px; }

/* Search & Filter Bar */
.filter-section { background:#fff; padding:32px 28px; border-bottom:1px solid #eef2f8; position:sticky; top:76px; z-index:100; box-shadow:0 4px 20px rgba(0,0,0,0.05); }
.filter-inner { max-width:1240px; margin:0 auto; display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.search-box { display:flex; align-items:center; background:var(--gray-bg); border:2px solid #e4e9f0; border-radius:10px; padding:0 16px; gap:10px; flex:1; min-width:220px; }
.search-box input { border:none; background:transparent; outline:none; padding:12px 0; font-family:'DM Sans',sans-serif; font-size:14px; width:100%; color:var(--text-dark); }
.search-box i { color:var(--text-mid); }
.filter-select { padding:13px 18px; border:2px solid #e4e9f0; border-radius:10px; font-family:'DM Sans',sans-serif; font-size:14px; outline:none; background:var(--gray-bg); color:var(--text-dark); cursor:pointer; }
.filter-select:focus { border-color:var(--blue-primary); }

/* Volunteer Cards Grid */
.vol-lts-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.vlts-card { background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); transition:all 0.35s; position:relative; }
.vlts-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-lg); }
.vlts-img-wrap { position:relative; height:200px; overflow:hidden; }
.vlts-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.55s; }
.vlts-card:hover .vlts-img-wrap img { transform:scale(1.07); }
.vlts-badge { position:absolute; top:12px; left:12px; padding:4px 12px; border-radius:20px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#fff; }
.vlts-stars-wrap { position:absolute; bottom:10px; right:12px; background:rgba(0,0,0,0.6); backdrop-filter:blur(4px); padding:4px 10px; border-radius:20px; display:flex; align-items:center; gap:4px; }
.vlts-stars-wrap span { color:var(--gold); font-size:12px; }
.vlts-stars-wrap em { color:#fff; font-size:11px; font-style:normal; }
.vlts-body { padding:22px; }
.vlts-body h3 { font-family:'Playfair Display',serif; font-size:1.12rem; font-weight:700; margin-bottom:2px; }
.vlts-body .role { font-size:12.5px; color:var(--blue-primary); font-weight:600; margin-bottom:10px; }
.vlts-body p { font-size:13px; color:var(--text-mid); line-height:1.7; margin-bottom:14px; }
.vlts-meta { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:12px; border-top:1px solid #eef2f8; }
.vlts-location { display:flex; align-items:center; gap:5px; font-size:12.5px; color:var(--text-mid); }
.vlts-location i { color:var(--green); font-size:11px; }
.vlts-hours { font-size:12px; color:var(--blue-primary); font-weight:600; background:var(--blue-pale); padding:3px 10px; border-radius:20px; }
.vol-ribbon { position:absolute; top:16px; right:-8px; background:var(--gold); color:#111; font-size:10.5px; font-weight:800; padding:4px 14px 4px 10px; border-radius:3px 0 0 3px; letter-spacing:0.5px; }
.vol-ribbon::after { content:''; position:absolute; right:-8px; top:0; border-left:8px solid var(--gold-dark); border-top:12px solid transparent; border-bottom:12px solid transparent; }

/* Featured volunteer */
.featured-vol { background:#fff; border-radius:20px; overflow:hidden; box-shadow:var(--shadow-lg); display:grid; grid-template-columns:380px 1fr; margin-bottom:48px; }
.featured-vol-img { position:relative; }
.featured-vol-img img { width:100%; height:100%; object-fit:cover; min-height:380px; }
.featured-label { position:absolute; top:20px; left:20px; background:var(--gold); color:#111; font-size:12px; font-weight:800; padding:6px 16px; border-radius:20px; letter-spacing:1px; text-transform:uppercase; }
.featured-vol-body { padding:44px; display:flex; flex-direction:column; justify-content:center; }
.featured-vol-body .quote-icon { font-size:50px; color:var(--blue-pale); line-height:1; margin-bottom:10px; }
.featured-vol-body .quote { font-size:1.1rem; font-style:italic; color:var(--text-mid); line-height:1.85; margin-bottom:22px; }
.featured-vol-body h3 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:800; margin-bottom:4px; }
.featured-vol-body .role { color:var(--blue-primary); font-weight:600; font-size:14px; margin-bottom:16px; }
.vol-tags { display:flex; gap:8px; flex-wrap:wrap; }
.vol-tag { padding:5px 14px; border-radius:20px; font-size:12px; font-weight:600; }

/* Department Sections */
.dept-title { display:flex; align-items:center; gap:14px; margin-bottom:28px; }
.dept-title .icon { width:44px; height:44px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:18px; color:#fff; flex-shrink:0; }
.dept-title h3 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:800; }
.dept-title .count { font-size:13px; color:var(--text-mid); font-weight:500; }

/* Join CTA inline */
.join-cta-box { background:linear-gradient(135deg,var(--blue-primary),var(--green)); border-radius:20px; padding:44px; color:#fff; text-align:center; margin-top:60px; }
.join-cta-box h3 { font-family:'Playfair Display',serif; font-size:2rem; font-weight:900; margin-bottom:12px; }
.join-cta-box p { opacity:0.9; max-width:560px; margin:0 auto 28px; line-height:1.75; }

/* Pagination */
.pagination { display:flex; gap:8px; justify-content:center; margin-top:48px; flex-wrap:wrap; }
.page-btn { width:42px; height:42px; border-radius:9px; border:2px solid #e4e9f0; background:#fff; color:var(--text-dark); font-weight:600; font-size:14px; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all 0.25s; }
.page-btn:hover, .page-btn.active { background:var(--blue-primary); color:#fff; border-color:var(--blue-primary); }
.page-btn.dots { border:none; background:transparent; cursor:default; }

@media(max-width:1100px) { .vol-lts-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:900px) {.filter-section { position:relative;} .vol-hero-stats { grid-template-columns:repeat(2,1fr); } .vol-lts-grid { grid-template-columns:repeat(2,1fr); } .featured-vol { grid-template-columns:1fr; } .featured-vol-img img { min-height:280px; } }
@media(max-width:600px) { .vol-lts-grid { grid-template-columns:1fr; } .vol-hero-stats { grid-template-columns:1fr 1fr; } }