:root{
  --bg:#f6f8fb;
  --card:#ffffff;
  --accent:#005ea6;
  --text:#0b1a2b;
}
*{box-sizing:border-box}
body{font-family:Segoe UI, Roboto, Arial, sans-serif;background:var(--bg);color:var(--text);margin:0}
.container{max-width:1000px;margin:0 auto;padding:24px}
.site-header{background:linear-gradient(90deg,var(--accent),#0077c8);color:#fff;padding:28px 0}
.site-header h1{margin:0;font-size:1.6rem}
.tag{opacity:.95;margin-top:6px}
.intro p{line-height:1.6}
.experiments{margin-top:20px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:12px}
.card{background:var(--card);padding:16px;border-radius:8px;text-decoration:none;color:inherit;box-shadow:0 1px 3px rgba(10,20,30,.06);transition:transform .12s,box-shadow .12s}
.card:hover{transform:translateY(-4px);box-shadow:0 6px 18px rgba(10,20,30,.12)}
.card h3{margin:0 0 8px 0;font-size:1.05rem}
.contact ul{padding-left:1.1rem}
.site-footer{padding:18px 0;text-align:center;font-size:.9rem;color:#415566;background:transparent;margin-top:28px}

@media (max-width:520px){.site-header{padding:18px 0}.container{padding:16px}}