:root{
  --ink:#0f172a; --sub:#475569; --bg:#f7fafc; --card:#ffffff; --accent:#0ea5e9;
}

/* Base */
*{box-sizing:border-box;margin:0;padding:0}
body{
  font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;
  color:var(--ink);
  background:
    radial-gradient(1200px 600px at 20% -10%, #e6f4ff 0%, transparent 60%),
    radial-gradient(800px 400px at 110% 20%, #eaf7ee 0%, transparent 60%),
    var(--bg);
}
a{color:inherit;text-decoration:none}
img{image-orientation:from-image}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}

/* Header */
.site-header{border-bottom:1px solid #e2e8f0;background:#fff;position:sticky;top:0;z-index:10}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.brand-mark{height:40px;width:auto;border-radius:8px}
.nav a{margin:0 8px;font-weight:500}
.nav a:hover{color:var(--accent)}
.btn{display:inline-block;padding:8px 14px;border-radius:8px;background:var(--accent);color:#fff;font-weight:600}

/* Hero */
.hero{position:relative}
.hero picture img{width:100%;height:52vh;object-fit:cover;display:block}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.15))}
.hero-inner{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px}
#tagline{color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.4);font-size:clamp(26px,4vw,48px);max-width:22ch}
.tag-sub{color:#e2e8f0;margin-top:8px}

/* CTA grid (two big tiles) */
.cta-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px;padding:28px 0 8px;
}
.cta-tile{
  background:var(--card);border:1px solid #e2e8f0;border-radius:16px;
  display:grid;place-items:center;padding:24px;transition:transform .15s ease, box-shadow .15s ease;
}
.cta-tile:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.05)}
.cta-tile img{width:min(360px,70%);height:auto;object-fit:contain;margin-bottom:10px}
.cta-tile span{font-weight:700}

/* Social bar */
.social-bar{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 0 36px;color:var(--sub)
}
.social{color:var(--accent);font-weight:600}
.social:hover{text-decoration:underline}

/* Footer */
.site-footer{border-top:1px solid #e2e8f0;padding:24px 0;text-align:center;color:var(--sub)}

/* Responsive */
@media (max-width:900px){
  .hero picture img{height:44vh}
  .cta-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .hero picture img{height:40vh}
}

.muted { color: var(--sub); }
.post-list { list-style: none; margin: 20px 0 0; padding: 0; }
.post-list li { padding: 10px 0; border-bottom: 1px solid #e2e8f0; }
.post-list a { color: var(--accent); font-weight: 600; }
.post-list a:hover { text-decoration: underline; }
.post-list .date { color: var(--sub); margin-left: 8px; font-size: 0.9em; }
main p { margin: 12px 0; }
main h2 { margin-top: 24px; }