/* layout.css - structure responsive */
.navbar { display: flex; align-items: center; background: var(--main); color: #fff; padding: 1em; }
.navbar .logo { height: 40px; margin-right: 1em; }
.navbar nav { display: flex; gap: 1em; }
.navbar a { color: #fff; font-weight: 500; }
footer { background: var(--main); color: #fff; text-align: center; padding: 1em 0; position: fixed; width: 100vw; bottom: 0; }
.main { max-width: 1200px; margin: 2em auto 4em auto; padding: 1em; }
@media (max-width: 700px) {
  .main { padding: .5em; }
  .navbar nav { flex-direction: column; gap: .5em; }
}