/* Rozvržení: kontejner, hlavička, patička */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--space-3);
}

.site-header {
  position: sticky; top: 0; z-index: 50;
  height: var(--header-h);
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
.header-inner {
  height: 100%;
  display: flex; align-items: center; justify-content: space-between;
}
.brand { font-weight: 600; text-decoration: none; letter-spacing: -0.01em; }

.nav { display: flex; gap: var(--space-3); }
.nav a {
  text-decoration: none; color: var(--muted);
  font-size: 0.95rem; transition: color 0.15s;
}
.nav a:hover, .nav a.is-active { color: var(--ink); }

.nav-toggle {
  display: none;
  font: inherit; color: inherit;
  background: none; border: 1px solid var(--line);
  border-radius: var(--radius); padding: 0.3rem 0.8rem; cursor: pointer;
}

.site-footer { border-top: 1px solid var(--line); padding-block: var(--space-3); color: var(--muted); font-size: 0.9rem; }
.footer-inner { display: flex; flex-direction: column; gap: var(--space-1); }
.footer-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); }
.footer-note { margin: 0; max-width: 70ch; font-size: 0.85rem; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--ink); }

@media (max-width: 720px) {
  .nav-toggle { display: block; }
  .nav {
    position: absolute; top: var(--header-h); left: 0; right: 0;
    flex-direction: column; gap: 0;
    background: var(--bg); border-bottom: 1px solid var(--line);
    padding: var(--space-1) var(--space-3);
    display: none;
  }
  .nav.is-open { display: flex; }
  .nav a { padding: 0.7rem 0; }
}