/* ===========================================================================
   base.css — 리셋 + 한글 조판
   =========================================================================== */

/* Pretendard — 폰트만 외부 요청을 허용한다(tokens.css 주석 참고) */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css');

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

html, body, h1, h2, h3, h4, p, figure, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }

html { -webkit-text-size-adjust: 100%; }

body {
  background: var(--c-bg);
  color: var(--c-text);
  font-family: var(--font);
  font-size: var(--fs-base);
  line-height: 1.5;
  /* 없으면 한글이 어절 중간에서 끊긴다 */
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}

img, svg { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

/* 브라우저 기본값은 그냥 display:none 이라 flex/grid 요소에서 무시된다.
   못 박아 두지 않으면 숨겼는데 그대로 보이는 일이 생긴다. */
[hidden] { display: none !important; }

/* 화면에는 없지만 스크린리더에는 읽히는 텍스트 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

:focus-visible { outline: 2px solid var(--c-blue); outline-offset: 2px; }