/* font-family */
@font-face {
    font-family: 'D2Coding';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/D2Coding/D2Coding.woff2') format('woff2'), url('../fonts/D2Coding/D2Coding.woff') format('woff');
}
@font-face {
    font-family: 'D2Coding';
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/D2Coding/D2CodingBold.woff2') format('woff2'), url('../fonts/D2Coding/D2CodingBold.woff') format('woff');
}

@font-face {
    font-family: 'NanumGothicCoding';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/NanumGothicCoding/NanumGothicCoding.woff2') format('woff2'), url('../fonts/NanumGothicCoding/NanumGothicCoding.woff') format('woff');
}
@font-face {
    font-family: 'NanumGothicCoding';
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/NanumGothicCoding/NanumGothicCoding-Bold.woff2') format('woff2'), url('../fonts/NanumGothicCoding/NanumGothicCoding-Bold.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-display: swap;
    src: local('Pretendard ExtraBold'), url('../fonts/Pretendard-ExtraBold.woff2') format('woff2'), url('../fonts/Pretendard-ExtraBold.woff') format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-display: swap;
    src: local('Pretendard Bold'), url('../fonts/Pretendard-Bold.woff2') format('woff2'), url('../fonts/Pretendard-Bold.woff') format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-display: swap;
    src: local('Pretendard SemiBold'), url('../fonts/Pretendard-SemiBold.woff2') format('woff2'), url('../fonts/Pretendard-SemiBold.woff') format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-display: swap;
    src: local('Pretendard Medium'), url('../fonts/Pretendard-Medium.woff2') format('woff2'), url('../fonts/Pretendard-Medium.woff') format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-display: swap;
    src: local('Pretendard Light'), url('../fonts/Pretendard-Regular.woff2') format('woff2'), url('../fonts/Pretendard-Regular.woff') format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-display: swap;
    src: local('Pretendard Light'), url('../fonts/Pretendard-Light.woff2') format('woff2'), url('../fonts/Pretendard-Light.woff') format('woff');
}

/* --- reset css --- */
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-weight: 500;
    font-family: var(--bp-font-primary), sans-serif;
}
a{
   text-decoration: none;
    color:inherit;
}
img{
    border: none;
    display: block;
    max-width: 100%;
    height: auto;
}
ul,li,ol,li{
    list-style: none;
}
button, input{
    border: none;
    background: none;
}
input:focus-visible{
    outline: none;
}

/* ── 글로벌 :focus / :focus-visible 정책 ──
   마우스 클릭 등 비키보드 포커스에는 outline 을 노출하지 않고,
   키보드 네비게이션(Tab) 으로 도달했을 때만 BPack 브랜드 outline 을 표시.
   라우트 변경 후 <FocusOnNavigate Selector="h1" /> 에 의해 h1 이 자동 포커스되며
   브라우저 기본 흰색 outline 박스가 노출되는 문제도 함께 해결한다. WCAG 2.4.7. */
:focus {
    outline: none;
}
:focus-visible {
    outline: 2px solid var(--bp-primary-500);
    outline-offset: 4px;
    border-radius: 4px;
}

/* h1 / [tabindex="-1"] 은 비-인터랙티브 요소.
   <FocusOnNavigate Selector="h1" /> 의 programmatic focus 는 스크린리더 a11y 전용 —
   시각 outline 은 불필요(사용자가 클릭/Tab 으로 도달할 일이 없음).
   상위 `:focus { outline: none }` 정책에 맡기되, 향후 누군가 h1 outline 을
   다시 추가하지 않도록 명시 룰로 가드한다. */
h1:focus,
h1:focus-visible,
[tabindex="-1"]:focus,
[tabindex="-1"]:focus-visible {
    outline: none;
}