/* ============================================
   AdGrowthly — Design Tokens v2.0
   Aesthetic: Korean Editorial Mono
   흑백 + 전기 그린 단일 악센트
   ============================================ */

:root {
    /* ── 핵심 색상: 3가지만 ── */
    --ag-black:        #0A0A0A;
    --ag-white:        #FFFFFF;
    --ag-green:        #00E87A;   /* 유일한 악센트 — 성장/생동감 */
    --ag-green-muted:  #E8FFF4;   /* 그린 배경 틴트 */

    /* ── 회색 스케일 ── */
    --ag-gray-50:  #FAFAFA;
    --ag-gray-100: #F5F5F5;
    --ag-gray-200: #E8E8E8;
    --ag-gray-300: #D0D0D0;
    --ag-gray-400: #A0A0A0;
    --ag-gray-500: #6B6B6B;
    --ag-gray-700: #3A3A3A;
    --ag-gray-900: #0A0A0A;

    /* ── 플랫폼 색상 (라인 악센트용만) ── */
    --ag-insta:   #E1306C;
    --ag-youtube: #FF0000;
    --ag-tiktok:  #EE1D52;
    --ag-x:       #14171A;

    /* ── 배경 ── */
    --ag-bg:         #FFFFFF;
    --ag-bg-alt:     #F5F5F5;
    --ag-bg-dark:    #0A0A0A;

    /* ── 타이포그래피 ── */
    --ag-font-display: 'Syne', 'Pretendard Variable', sans-serif;
    --ag-font-base:    'Pretendard Variable', 'Pretendard',
                       -apple-system, 'Apple SD Gothic Neo', sans-serif;
    --ag-font-mono:    'JetBrains Mono', 'Fira Mono', monospace;

    --ag-text-xs:   0.75rem;
    --ag-text-sm:   0.875rem;
    --ag-text-base: 1rem;
    --ag-text-lg:   1.125rem;
    --ag-text-xl:   1.25rem;
    --ag-text-2xl:  1.5rem;
    --ag-text-3xl:  1.875rem;
    --ag-text-4xl:  2.25rem;
    --ag-text-5xl:  3rem;
    --ag-text-6xl:  3.75rem;
    --ag-text-7xl:  4.5rem;
    --ag-text-8xl:  6rem;

    --ag-weight-400: 400;
    --ag-weight-500: 500;
    --ag-weight-600: 600;
    --ag-weight-700: 700;
    --ag-weight-800: 800;
    --ag-weight-900: 900;

    --ag-leading-none:    1;
    --ag-leading-tight:   1.1;
    --ag-leading-snug:    1.3;
    --ag-leading-normal:  1.6;
    --ag-leading-relaxed: 1.8;

    --ag-tracking-tighter: -0.05em;
    --ag-tracking-tight:   -0.03em;
    --ag-tracking-snug:    -0.01em;
    --ag-tracking-wide:    0.04em;
    --ag-tracking-wider:   0.08em;

    /* ── 간격 ── */
    --ag-sp-1:  0.25rem;
    --ag-sp-2:  0.5rem;
    --ag-sp-3:  0.75rem;
    --ag-sp-4:  1rem;
    --ag-sp-5:  1.25rem;
    --ag-sp-6:  1.5rem;
    --ag-sp-8:  2rem;
    --ag-sp-10: 2.5rem;
    --ag-sp-12: 3rem;
    --ag-sp-16: 4rem;
    --ag-sp-20: 5rem;
    --ag-sp-24: 6rem;
    --ag-sp-32: 8rem;

    /* ── 레이아웃 ── */
    --ag-container: 1200px;
    --ag-px:        clamp(1.25rem, 5vw, 2.5rem);

    /* ── 테두리 ── */
    --ag-border:       1.5px solid #0A0A0A;
    --ag-border-light: 1px solid #E8E8E8;
    --ag-border-green: 1.5px solid #00E87A;

    /* ── 반경 — 양극단만 ── */
    --ag-r-none: 0px;
    --ag-r-sm:   4px;
    --ag-r-full: 9999px;

    /* ── 그림자: flat offset 방식 (editorial) ── */
    --ag-sh-flat:    4px 4px 0px #0A0A0A;
    --ag-sh-flat-lg: 8px 8px 0px #0A0A0A;
    --ag-sh-flat-green: 4px 4px 0px #00E87A;

    /* ── 모션 ── */
    --ag-ease:        cubic-bezier(0.4, 0, 0.2, 1);
    --ag-ease-out:    cubic-bezier(0, 0, 0.2, 1);
    --ag-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ag-dur-fast:    120ms;
    --ag-dur:         220ms;
    --ag-dur-slow:    380ms;

    /* ── Z-index ── */
    --ag-z-nav: 1000;
}