:root{
  --bg:#fafafa;
  --card:#fff;
  --accent:#2b6cb0;
  --text:#1a202c;
  --muted:#6b7280;
  --max-width:1000px;
  --gap:1.25rem;
  --radius:12px;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: system-ui,-apple-system,"Segoe UI",Roboto, "Helvetica Neue", Arial;
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.container{max-width:var(--max-width);margin:0 auto;padding:1rem;}

.skip-link{
  position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{position:static;width:auto;height:auto;padding:.5rem;background:#000;color:#fff;}

.site-header{background:var(--card);border-bottom:1px solid #eee;}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0;}
.site-title{font-size:1.125rem;margin:0;}
.menu-toggle{display:inline-block;padding:.5rem;border:0;background:transparent;cursor:pointer;}

.site-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1rem;}
.site-nav a{text-decoration:none;color:var(--accent);}

.page-grid{display:block;padding:1.25rem 0;}
.post{background:var(--card);padding:1.25rem;border-radius:var(--radius);box-shadow:0 4px 12px rgba(11,15,20,0.03);}
.post-title{font-size:clamp(1.4rem,2.5vw,2rem);margin:0 0 .35rem;}
.post-meta{color:var(--muted);font-size:.95rem;margin-bottom:1rem;}
.post-content img{max-width:100%;height:auto;border-radius:8px;margin:1rem 0;display:block;}

.sidebar{margin-top:1rem;padding:1rem;background:var(--card);border-radius:var(--radius);box-shadow:0 4px 12px rgba(11,15,20,0.03);}

.site-footer{padding:1rem 0;text-align:center;color:var(--muted);margin-top:1rem;}

/* Larger screens: two-column layout */
@media (min-width:900px){
  .page-grid{display:grid;grid-template-columns:1fr 300px;gap:var(--gap);align-items:start;}
  .menu-toggle{display:none;}
}

/* small responsive tweaks */
@media (max-width:600px){
  .site-nav{display:none;}
  .site-nav.open{display:block;}
  .site-nav ul{flex-direction:column;gap:.5rem;}
}
