/*
  Gallery Page Styles — a2znews.com/network/
  Enhanced property showcase with category colors and animated counters
  Target: PageSpeed 95+, zero external deps
*/

/* ===== GALLERY HERO ===== */
.gallery-hero{background:linear-gradient(135deg,#0d0d1a 0%,#1a1a2e 50%,#0d1a12 100%);border-bottom:2px solid #538d4e;padding:4.5rem 5% 3.5rem;text-align:center;position:relative;overflow:hidden}
.gallery-hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 30% 20%,rgba(83,141,78,.08) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(106,170,100,.06) 0%,transparent 50%);pointer-events:none}
.gallery-hero-inner{position:relative;z-index:1;max-width:800px;margin:0 auto}
.gallery-hero h1{font-size:2.8rem;font-weight:800;margin-bottom:.75rem;letter-spacing:-.5px;color:#fff}
.gallery-hero p{font-size:1.1rem;color:#8888a8;max-width:640px;margin:0 auto 2.5rem;line-height:1.7}

/* Animated Counters */
.hero-counters{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center}
.hero-counter{text-align:center;min-width:120px}
.counter-num{font-size:2.5rem;font-weight:800;color:#6aaa64;display:inline;line-height:1.1;font-variant-numeric:tabular-nums}
.counter-plus{font-size:1.8rem;font-weight:700;color:#6aaa64}
.counter-label{display:block;font-size:12px;color:#8888a8;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}

@media(max-width:640px){
  .gallery-hero{padding:3rem 5% 2.5rem}
  .gallery-hero h1{font-size:1.8rem}
  .gallery-hero p{font-size:.95rem;margin-bottom:2rem}
  .hero-counters{gap:1.25rem}
  .counter-num{font-size:1.8rem}
  .counter-plus{font-size:1.3rem}
  .hero-counter{min-width:100px}
}

/* ===== FILTER BAR ENHANCEMENTS ===== */
.filter-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.filter-count{display:inline-block;background:rgba(255,255,255,.08);padding:1px 7px;border-radius:10px;font-size:11px;margin-left:4px;font-weight:600}
.filter-btn.active .filter-count{background:rgba(255,255,255,.2)}

/* ===== GALLERY GRID ===== */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}

@media(max-width:1024px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.gallery-grid{grid-template-columns:1fr}}

/* ===== GALLERY CARD ===== */
.gallery-card{background:#0d0d1a;border:1px solid #1e1e38;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s,transform .2s,box-shadow .2s}
.gallery-card:hover{border-color:#538d4e;transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.3)}
.card-top-border{height:3px;width:100%}
.card-header{display:flex;align-items:center;gap:12px;padding:1.25rem 1.25rem .5rem}
.card-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.card-header h3{font-size:1rem;font-weight:700;color:#fff;margin:0;line-height:1.2}
.card-domain{font-size:12px;color:#666680;font-weight:400}
.card-badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;margin:0 1.25rem .5rem;width:fit-content}
.card-desc{font-size:13px;color:#8888a8;line-height:1.65;padding:0 1.25rem;flex:1;margin:0}
.card-link{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;padding:1rem 1.25rem .75rem;margin-top:auto;text-decoration:none;transition:opacity .15s}
.card-link:hover{opacity:.8;text-decoration:none}
.card-link svg{transition:transform .15s}
.card-link:hover svg{transform:translate(2px,-2px)}