/* 재미나 활동지 — 라이브 전용 덧칠
 * ---------------------------------------------------------------------------
 * ★ zemina-contents.css 를 고치지 않는다. 그 파일은 스테이징(home.html)에서 문자 그대로
 *   옮겨온 것이라, 손대는 순간 원본과 갈라져 "스테이징에서 본 것 = 라이브"가 깨진다.
 *   라이브에만 필요한 것은 전부 이 파일에 둔다.
 */

/* 좌측 상단 와그작 로고 — 여기서 와그작 홈으로 돌아간다.
   원본 헤더는 `header{padding:22px 24px 8px;text-align:left}` 로 brand 하나만 있었다.
   flex 로 바꿔 로고를 왼쪽에 세우되 padding 은 그대로 둔다. */
header {
  display: flex;
  align-items: center;
  gap: 14px;
}

.zm-wz-home {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  /* 로고가 알록달록해서 크림 종이 톤을 누르지 않도록 살짝 낮춘다. 호버에 또렷해진다. */
  opacity: 0.9;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.zm-wz-home:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.zm-wz-home:focus-visible {
  outline: 2px solid #3e6152;
  outline-offset: 4px;
  border-radius: 4px;
}

.zm-wz-home img {
  display: block;
  height: 20px;
  width: auto;
}

@media (max-width: 560px) {
  header {
    gap: 10px;
  }

  .zm-wz-home img {
    height: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .zm-wz-home,
  .zm-wz-home:hover {
    transition: none;
    transform: none;
  }
}