*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
--c-primary:#00a9e0;
--c-primary-dark:#0090c0;
--c-green:#5bc500;
--c-bg:#f8f9fb;
--c-white:#fff;
--c-text:#2c2c2c;
--c-muted:#86888c;
--c-border:#e6e6e6;
--font:'DM Sans',system-ui,-apple-system,sans-serif;
--container:1100px;
--radius:10px;
}

html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--font);color:var(--c-text);background:var(--c-bg);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--c-primary);text-decoration:none;transition:color .2s}
a:hover{color:var(--c-primary-dark)}
img{max-width:100%;height:auto;display:block}

.container{max-width:var(--container);margin:0 auto;padding:0 20px}

/* ── Header ──────────────────── */
.site-header{background:var(--c-white);border-bottom:1px solid var(--c-border);position:sticky;top:0;z-index:100}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{font-weight:700;font-size:1.25rem;color:var(--c-text);letter-spacing:-.02em}
.logo:hover{color:var(--c-primary)}

.header-nav{display:flex;gap:24px}
.header-nav a{font-size:.875rem;font-weight:600;color:var(--c-muted)}
.header-nav a:hover{color:var(--c-primary)}

/* ── Footer ──────────────────── */
.site-footer{background:var(--c-text);color:rgba(255,255,255,.5);padding:28px 0;margin-top:60px;text-align:center;font-size:.82rem}

/* ── Responsive ──────────────── */
@media(max-width:768px){
.header-nav{gap:14px}
.header-nav a{font-size:.78rem}
.logo{font-size:1.1rem}
}

@media(max-width:480px){
.header-nav{display:none}
}