/* =======================================================
   Creativeflow – Base CSS  v0.2.1
   Palette: Cavendish Yellow (#FFE01B) × Monotone
   Grid  : 8-Point  (spacing: 8 / 16 / 24 …)
======================================================= */

/* =======================================================
   BASE  v0.3   (Reset · Tokens · Utilities)
   Palette: Cavendish Yellow (#FFE01B) × Monotone
======================================================= */

/* ---------- 0. Reset -------------------------------- */
*,
*::before,
*::after{
  box-sizing:border-box;
  margin:0;
  padding:0
}
html{
  font-size:16px
}
html{ 
  scrollbar-gutter: stable; 
}
img{
  max-width:100%;
  display:block
}

/* ---------- 1. Web Fonts (Variable 단일 선언) -------- */
@font-face{
  font-family:"Pretendard";
  src:url("../fonts/PretendardVariable.woff2") format("woff2");
  font-weight:100 900;
  font-display:swap;
}
@font-face{
  font-family:"Inter";
  src:url("../fonts/Inter-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight:100 700;
  font-display:swap;
}
@font-face{
  font-family:"Noto Sans KR";
  src:url("../fonts/NotoSansKR-VariableFont_wght.ttf") format("truetype");
  font-weight:100 700;
  font-display:swap;
}
@font-face{
  font-family:"Space Grotesk";
  src:url("../fonts/SpaceGrotesk-VariableFont_wght.ttf") format("truetype");
  font-weight:300 800;
  font-display:swap;
}
@font-face{
  font-family:"Montserrat";
  src:url("../fonts/Montserrat-Regular.woff") format("woff");
  font-weight:400 700;
  font-display:swap;
}


/* ---------- 2. CSS Variables ----------------------- */

:root{
  /* Colors */
  --c-yellow   : #dafb71;     /* primary accent */
  --c-black    : #111111;     /* neutral text */
  --c-gray-100 : #F8F8F8;
  --c-gray-200 : #E4E4E4;
  --c-gray-300 : #D1D1D1;
  --c-gray-400 : #B0B0B0;
  --c-gray-500 : #909090;
  --c-gray-600 : #6E6E6E;
  --c-gray-700 : #5A5A5A;
  --c-gray-800 : #39352C;
  --c-white    : #FFFFFF;
  --c-error    : #FF5858;

  /* Typography */
  --ff-display : "Pretendard", "Playfair Display", system-ui, sans-serif;
  --ff-body    : "Inter", "Noto Sans KR", sans-serif;
  --ff-mono    : "Space Grotesk", monospace;
  --ff-en      : "Montserrat", sans-serif;

  /* Sizing & Radius */
  --radius-lg  : 24px;
  --shadow-sm  : 0 4px 12px rgba(0,0,0,.08);

  /* Grid */
  --g-unit     : 8px;
}

/* ---------- 3. Global Styles ----------------------- */

body{ 
  font-family:var(--ff-display);
  font-weight: 600;
  letter-spacing: -0.01em;     
  color:var(--c-black);
  background:var(--c-white);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

/* ---------- 4. Utilities --------------------------- */
.text-center{
  text-align:center
}