/* ═══ Blog Index Styles ═══ */
:root{--teal:#2C7C73;--teal-dark:#1f5c55;--teal-light:#e8f4f3;--cream:#FDFBF7;--text:#1a1a1a;--muted:#555;--gray-700:#404040;--gray-400:#9CA3AF;--gray-300:#D1D5DB;--radius:12px}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Figtree",sans-serif;background:var(--cream);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:"Sora",sans-serif}

/* ═══ Navigation override ═══ */
.nav-links a.active{color:var(--teal)}

/* ═══ Blog Index ═══ */
.blog-header{max-width:760px;margin:0 auto;padding:48px 1.5rem 40px}
.blog-header h1{font-size:clamp(1.6rem,4vw,2.5rem);font-weight:700;color:var(--text);margin-bottom:8px}
.blog-header p{font-size:1rem;color:var(--muted);line-height:1.7}
.blog-list{max-width:760px;margin:0 auto;padding:0 1.5rem 64px}
.blog-card{display:block;background:#fff;border:1px solid #e8e8e8;border-radius:14px;padding:28px;margin-bottom:20px;text-decoration:none;transition:all .25s}
.blog-card:hover{border-color:var(--teal);transform:translateY(-2px);box-shadow:0 8px 24px rgba(44,124,115,0.12)}
.blog-card .card-cat{font-family:"Sora",sans-serif;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;color:var(--teal);margin-bottom:10px}
.blog-card h2{font-size:1.2rem;font-weight:700;color:var(--text);margin-bottom:8px;line-height:1.3}
.blog-card p{font-size:.95rem;color:var(--muted);line-height:1.7;margin-bottom:12px}
.blog-card .card-meta{font-size:13px;color:var(--gray-400);display:flex;align-items:center;gap:12px}
.blog-card .card-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--gray-300)}

/* ═══ Sticky Mobile CTA ═══ */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:99;background:var(--teal);padding:.75rem 1.5rem;text-align:center;box-shadow:0 -2px 12px rgba(0,0,0,.15)}
.sticky-cta a{color:#fff;font-family:'Sora',sans-serif;font-weight:600;font-size:.95rem;text-decoration:none}

/* ═══ Responsive ═══ */
@media(max-width:640px){
  .sticky-cta{display:block}
  .blog-header{padding:36px 20px 28px}
  .blog-list{padding:0 20px 48px}
  .blog-card{padding:22px}
}
