/* Shared responsive CSS for static YDHR site */
:root{
  --accent:#005a9c;
  --muted:#5b6b78;
  --bg:#f7fafc;
  --card:#ffffff;
  --radius:12px;
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; background:var(--bg); color:#0b1220; line-height:1.5}
.container{width:min(1100px,94%); margin:0 auto; padding:1.25rem 0}
header{background:white; border-bottom:1px solid #e6eef6; position:sticky; top:0; z-index:20}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 0}
.brand{display:flex; gap:.75rem; align-items:center}
.brand .logo{width:56px; height:56px; border-radius:10px; background:var(--accent); color:white; display:flex; align-items:center; justify-content:center; font-weight:700}
nav ul{list-style:none; display:flex; gap:1rem; margin:0; padding:0; align-items:center}
nav a{color:var(--accent); font-weight:600; text-decoration:none}
.hero{background:linear-gradient(180deg, rgba(0,90,156,0.06), transparent); padding:2rem 0; border-bottom:1px solid #eef6fb}
.hero h1{margin:0 0 .5rem; font-size:clamp(1.6rem,2.7vw,2.4rem)}
.lead{color:var(--muted); margin:0 0 1rem}
.grid{display:grid; gap:1rem}
.grid-2{grid-template-columns:1fr 380px; align-items:start}
.card{background:var(--card); padding:1rem; border-radius:var(--radius); box-shadow:0 6px 22px rgba(9,30,60,0.04); border:1px solid #eef6fb}
.cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
.post-list{display:grid; gap:0.75rem}
.footer{background:#041126; color:#cfe7ff; padding:1.25rem 0; margin-top:2rem}
.footer a{color:#94c5ff}
.meta{font-size:.95rem; color:var(--muted)}
.kv{display:flex; gap:1rem; flex-wrap:wrap}
.btn{display:inline-block; padding:.6rem .9rem; border-radius:999px; background:var(--accent); color:white; font-weight:700; text-decoration:none}
.small{font-size:.95rem}
@media (max-width:880px){
  .grid-2{grid-template-columns:1fr}
  .cards-3{grid-template-columns:1fr 1fr}
}
@media (max-width:520px){
  nav ul{display:none}
  .cards-3{grid-template-columns:1fr}
}