/* Simple, responsive CSS for LogStudio site */
:root{--bg:#f7f9fb;--card:#fff;--accent:#2b7cff;--muted:#6b7280;--shadow:0 2px 8px rgba(0,0,0,0.1)}
*{box-sizing:border-box}
body{font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; background:var(--bg); color:#0f172a; line-height:1.6}
.container{max-width:900px; margin:0 auto; padding:20px}
.site-header{background:linear-gradient(90deg,#fff,#f8fbff); border-bottom:1px solid #e6eefc; box-shadow:var(--shadow)}
.site-header .container{display:flex; align-items:center; justify-content:space-between; padding:16px 20px}
.logo{font-weight:700; margin:0; font-size:1.5em}
nav a{margin-left:16px; color:var(--muted); text-decoration:none; transition:all 0.2s; padding:4px 8px; border-radius:4px}
nav a:hover{color:var(--accent); background:rgba(43, 124, 255, 0.1)}
nav a:hover{color:var(--accent)}
.hero{padding:60px 40px; background:linear-gradient(135deg, #fff 0%, #f8fbff 100%); border-radius:12px; margin:40px 0; box-shadow:var(--shadow)}
.hero h2{margin:0 0 16px; color:#07133a; font-size:2em}
.hero p{margin:16px 0}
.btn{display:inline-block; padding:6px 12px; background:var(--accent); color:#fff; border-radius:4px; text-decoration:none; transition:background 0.2s}
.btn:hover{background:#1a5bbf}
.features, .usage, .downloads-list{background:var(--card); padding:24px; border-radius:12px; margin-bottom:24px; box-shadow:var(--shadow)}
.features h3{margin-top:0; font-size:1.25em}
.feature-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); gap:20px; margin-top:20px}
.feature{background:var(--card); padding:20px; border-radius:12px; box-shadow:var(--shadow); transition:transform 0.2s, box-shadow 0.2s}
.feature:hover{transform:translateY(-2px); box-shadow:0 4px 16px rgba(0,0,0,0.15)}
.feature h4{margin:0 0 8px; font-size:1.1em; color:var(--accent)}
.feature p{margin:0; color:var(--muted)}
.site-footer{padding:20px 0; color:var(--muted); text-align:center; background:#fff; border-top:1px solid #e6eefc}
.dl-row{display:flex; align-items:center; gap:12px; margin-top:8px}
.muted{color:var(--muted); font-size:0.95em}
.note{font-size:0.95em; color:var(--muted)}
@media (max-width:640px){
  .site-header .container{flex-direction:column; align-items:flex-start}
  nav{margin-top:8px}
  .hero{padding:40px 20px}
}