/* Token map: bg #fff page · surface #f7f7f7 product/newsletter · surface-alt #efefef utility · fg #000 logo/display · muted #141414 body/button · subtle #707070 caption · border #ddd rules · primary #ff0000 SALE only · link #141414 · radius button 2px else 0 · no shadow · type 40/1.2 display, 12/1.25 heading, 12/1.5 body · space 5px scale only. */

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/noto-sans-kr-korean-400-normal.woff2") format("woff2");
  unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F;
}

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/noto-sans-kr-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/outfit-latin-400-normal.woff2") format("woff2");
}

:root {
  --color-background: #ffffff;
  --color-surface: #f7f7f7;
  --color-surface-alt: #efefef;
  --color-foreground: #000000;
  --color-muted: #141414;
  --color-border: #dddddd;
  --color-primary: #ff0000;
  --color-on-primary: #ffffff;
  --color-link: #141414;
  --color-subtle: #707070;
  --color-cursor: #22c55e;

  --font-family: Outfit, "Noto Sans KR", "Malgun Gothic", Verdana, Dotum,
    AppleGothic, sans-serif;
  --font-logo: Outfit, "Noto Sans KR", sans-serif;
  --font-display: 40px;
  --font-body: 12px;
  --font-weight: 400;
  --lh-display: 1.2;
  --lh-heading: 1.25;
  --lh-body: 1.5;

  --space-5: 5px;
  --space-10: 10px;
  --space-15: 15px;
  --space-20: 20px;
  --space-30: 30px;
  --space-35: 35px;
  --space-40: 40px;
  --space-55: 55px;
  --space-60: 60px;
  --space-90: 90px;
  --space-100: 100px;
  --space-120: 120px;

  --content-max: 1200px;
  --bp: 1399px;

  --radius-none: 0px;
  --radius-xs: 2px;

  --duration: 200ms;
  --ease-in: cubic-bezier(0.4, 0, 1, 1);

  --btn-pad: 15px 18px 15px 21px;
  --icon: 20px;
  --header-offset: calc(var(--space-35) + var(--space-60) + var(--space-60));
  --swiper-theme-color: #000000;
}