#mobile-menu-toggle:not(:checked) ~ #mobile-menu {
  display: none;
}

#mobile-menu-toggle:checked ~ #mobile-menu {
  display: block;
}

#mobile-menu-toggle:not(:checked) ~ label .close-icon {
  display: none;
}

#mobile-menu-toggle:checked ~ label .hamburger-icon {
  display: none;
}

#mobile-menu-toggle:checked ~ label .close-icon {
  display: block;
}

#mobile-menu-toggle {
  display: none;
}

.kita-page {
  background: #f9f4e8;
}

.kita-margin {
  margin: 0 auto;
  max-width: 1200px;
  padding: 0 80px;
}

.chapter-number {
  font-family: "Coming Soon", serif;
  color: #4a586d;
  opacity: 0.6;
}

@media (max-width: 768px) {
  .kita-margin {
    padding: 0 40px;
  }
}

@media (max-width: 480px) {
  .kita-margin {
    padding: 0 20px;
  }
}

.color-swatch {
  width: 80px;
  height: 80px;
  border-radius: 12px;
  border: 2px solid rgba(31, 30, 29, 0.1);
  margin-bottom: 8px;
}

.font-demo {
  padding: 20px;
  background: #f9f4e8;
  border-radius: 12px;
  margin-bottom: 16px;
  border: 1px solid rgba(31, 30, 29, 0.1);
}

.usage-example {
  padding: 16px;
  background: #faf9f5;
  border-radius: 8px;
  border: 1px solid rgba(31, 30, 29, 0.1);
  margin-top: 12px;
}
