/* =====================================================
   Style Variables - 스타일 변수
   색상, 폰트, 보더, 그림자 등 시각적 표현 관련
   ===================================================== */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');

:root {
    /* ========================================
       COLORS - Primary
       ======================================== */
    --s-color-primary: #1B4D3E;
    --s-color-primary-dark: #0F3429;
    --s-color-primary-darker: #082319;
    --s-color-primary-light: #2D7A5C;
    --s-color-primary-lighter: #4A9D7C;
    --s-color-primary-pale: #E6F2ED;

    /* ========================================
       COLORS - Accent
       ======================================== */
    --s-color-accent: #C9A962;
    --s-color-accent-light: #E0CA8E;
    --s-color-accent-dark: #9F8347;
    --s-color-teal: #0D9488;
    --s-color-teal-light: #14B8A6;

    /* ========================================
       COLORS - Background
       ======================================== */
    --s-bg-white: #FFFFFF;
    --s-bg-cream: #FDFCF9;
    --s-bg-light: #F7F9F8;
    --s-bg-section: #F0F4F2;
    --s-bg-dark: #0A1F18;
    --s-bg-darker: #061410;

    /* ========================================
       COLORS - Text
       ======================================== */
    --s-text-primary: #1A1F1C;
    --s-text-secondary: #4A524D;
    --s-text-muted: #7A857F;
    --s-text-light: #A8B0AB;
    --s-text-white: #FFFFFF;
    --s-text-on-primary: #FFFFFF;

    /* ========================================
       COLORS - Border
       ======================================== */
    --s-border-color: #D8E0DC;
    --s-border-light: #E8EDEA;
    --s-border-dark: #B8C4BE;

    /* ========================================
       COLORS - Status
       ======================================== */
    --s-color-success: #059669;
    --s-color-warning: #D97706;
    --s-color-error: #DC2626;
    --s-color-info: #0891B2;

    /* ========================================
       TYPOGRAPHY - Font Family
       ======================================== */
    /* --s-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif; */
    --s-font-display: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Apple SD Gothic Neo', 'Malgun Gothic', 'Nanum Gothic', 'Liberation Sans', 'Noto Sans KR', serif;
    /* --s-font-primary: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Pretendard', sans-serif; */
    --s-font-primary: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Apple SD Gothic Neo', 'Malgun Gothic', 'Nanum Gothic', 'Liberation Sans', 'Noto Sans KR', sans-serif;
    --s-font-mono: 'JetBrains Mono', 'SF Mono', 'Monaco', monospace;

    /* ========================================
       TYPOGRAPHY - Font Size
       ======================================== */
    --s-font-size-xs: 0.75rem;
    /* 12px */
    --s-font-size-sm: 0.875rem;
    /* 14px */
    --s-font-size-base: 1rem;
    /* 15px */
    --s-font-size-12: 1.2rem;
    /* 16px */
    --s-font-size-md: 1.125rem;
    /* 18px */
    --s-font-size-lg: 1.25rem;
    /* 20px */
    --s-font-size-xl: 1.5rem;
    /* 24px */
    --s-font-size-2xl: 2rem;
    /* 32px */
    --s-font-size-3xl: 2.75rem;
    /* 44px */
    --s-font-size-4xl: 3.5rem;
    /* 56px */
    --s-font-size-5xl: 4.5rem;
    /* 72px */
    --s-font-size-6xl: 6rem;
    /* 96px */

    /* ========================================
       TYPOGRAPHY - Font Weight
       ======================================== */
    --s-font-weight-light: 300;
    --s-font-weight-normal: 400;
    --s-font-weight-medium: 500;
    --s-font-weight-semibold: 600;
    --s-font-weight-bold: 700;

    /* ========================================
       TYPOGRAPHY - Line Height
       ======================================== */
    --s-line-height-tight: 1.1;
    --s-line-height-snug: 1.25;
    --s-line-height-normal: 1.5;
    --s-line-height-17: 1.7;
    --s-line-height-relaxed: 1.75;
    --s-line-height-loose: 2;

    /* ========================================
       TYPOGRAPHY - Letter Spacing
       ======================================== */
    --s-letter-spacing-tight: -0.02em;
    --s-letter-spacing-normal: 0;
    --s-letter-spacing-wide: 0.05em;
    --s-letter-spacing-wider: 0.1em;
    --s-letter-spacing-widest: 0.2em;

    /* ========================================
       BORDERS & RADIUS
       ======================================== */
    --s-border-width: 1px;
    --s-border-width-thick: 2px;

    --s-radius-sm: 4px;
    --s-radius-md: 8px;
    --s-radius-lg: 12px;
    --s-radius-xl: 16px;
    --s-radius-2xl: 24px;
    --s-radius-full: 9999px;

    /* ========================================
       SHADOWS
       ======================================== */
    --s-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --s-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.06);
    --s-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.08);
    --s-shadow-xl: 0 24px 48px rgba(0, 0, 0, 0.12);
    --s-shadow-glow: 0 0 40px rgba(27, 77, 62, 0.15);

    /* ========================================
       TRANSITIONS
       ======================================== */
    --s-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --s-transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    --s-transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);
    --s-transition-bounce: 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);

    /* ========================================
       ALPHA COLORS (투명도 색상)
       ======================================== */
    /* White with alpha */
    --s-white-alpha-98: rgba(255, 255, 255, 0.98);
    --s-white-alpha-90: rgba(255, 255, 255, 0.9);
    --s-white-alpha-80: rgba(255, 255, 255, 0.8);
    --s-white-alpha-70: rgba(255, 255, 255, 0.7);
    --s-white-alpha-60: rgba(255, 255, 255, 0.6);
    --s-white-alpha-50: rgba(255, 255, 255, 0.5);
    --s-white-alpha-40: rgba(255, 255, 255, 0.4);
    --s-white-alpha-30: rgba(255, 255, 255, 0.3);
    --s-white-alpha-20: rgba(255, 255, 255, 0.2);
    --s-white-alpha-10: rgba(255, 255, 255, 0.1);
    --s-white-alpha-05: rgba(255, 255, 255, 0.05);

    /* Black with alpha */
    --s-black-alpha-80: rgba(0, 0, 0, 0.8);
    --s-black-alpha-60: rgba(0, 0, 0, 0.6);
    --s-black-alpha-50: rgba(0, 0, 0, 0.5);
    --s-black-alpha-30: rgba(0, 0, 0, 0.3);
    --s-black-alpha-20: rgba(0, 0, 0, 0.2);
    --s-black-alpha-10: rgba(0, 0, 0, 0.1);
    --s-black-alpha-05: rgba(0, 0, 0, 0.05);

    /* ========================================
       GRADIENTS (자주 쓰는 그라디언트)
       ======================================== */
    --s-gradient-hero: linear-gradient(135deg, #061410 0%, #0A1F18 50%, #0D2920 100%);
    --s-gradient-primary: linear-gradient(135deg, var(--s-color-primary-dark) 0%, var(--s-color-accent) 100%);
    --s-gradient-overlay-dark: linear-gradient(180deg, rgba(6, 20, 16, 0.3) 0%, transparent 30%, rgba(6, 20, 16, 0.7) 100%);
}