/* ========== Core Reset & Tokens ========== */
:root{
/* 색상 토큰 */
--bg:#f8f8fb; --panel:#ffffff; --ink:#1b1f23; --muted:#6b7380;
--brand:#533388; --brand-ink:#241136; --line:#e9e9ef;
/* 라운드 & 간격 */
--radius:14px; --radius-sm:10px; --radius-xs:8px;
--space-1:6px; --space-2:10px; --space-3:14px; --space-4:18px;
--space-5:22px; --space-6:28px; --space-7:36px;
/* 섀도우 */
--shadow-1:0 2px 8px rgba(0,0,0,.06);
--shadow-2:0 8px 24px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
margin:0; background:#fff; color:var(--ink);
font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans KR",sans-serif;
-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%; display:block}
a{color:inherit}


/* 타이포 스케일 */
h1{font-size:clamp(28px,3.2vw,40px); margin:.2em 0}
h2{font-size:clamp(22px,2.4vw,28px); margin:.7em 0 .4em}
h3{font-size:18px; margin:.6em 0 .3em}
p{line-height:1.65; margin:.6em 0}
small{font-size:12px; color:var(--muted)}


/* 반응형 브레이크포인트 */
@media (max-width:1100px){:root{--space-7:28px}}
@media (max-width:768px){:root{--space-6:22px}}
@media (max-width:520px){:root{--space-5:18px}}


/* 유틸리티 */
.hidden{display:none!important}
.mt-0{margin-top:0!important}
.mb-0{margin-bottom:0!important}
.text-muted{color:var(--muted)!important}
.round{border-radius:var(--radius)}
.shadow-1{box-shadow:var(--shadow-1)}
.shadow-2{box-shadow:var(--shadow-2)}