/* ===========================================
   BASE.CSS - Foundation Layer
   CSS variables, reset, and font definitions
   =========================================== */

/* CSS Reset & Box Sizing */
*, ::after, ::before {
    box-sizing: border-box;
}

/* CSS Custom Properties (Variables) */
:root {
    /* Colors */
    --black: #555555;
    --darkgray: #717171;
    --gray: #a0a0a0;
    --lightgray: #f1f1f1;
    --white: #ffffff;
    --purple: rgb(109, 35, 255);
    --main-gradient: linear-gradient(45deg, #667eea 0%, #764ba2 100%);
    --error-red: #e74c3c;
    --success-green: #4CAF50;

    /* Typography */
    --menu-link: 'Sequel45';
    --header-bold: 'Sequel85';
    --header-normal: 'LeferiPointBlackOblique';
    --header-bold-oblique: 'LeferiPointBlackOblique';
    --font-primary: 'Poppins', 'Pretendard-Regular', sans-serif;
    --font-korean: 'GmarketSansBold', 'GmarketSans', sans-serif;

    /* Border Radius */
    --radius-large: 30px;
    --radius-medium: 20px;
    --radius-small-medium: 15px;
    --radius-small: 10px;
    --radius-pill: 60px;

    /* Spacing */
    --spacing-xs: 5px;
    --spacing-sm: 10px;
    --spacing-md: 16px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;

    /* Transitions */
    --transition-fast: 0.1s ease;
    --transition-normal: 0.2s ease;
    --transition-slow: 0.3s ease;
    --transition-gradient: 0.5s ease;

    /* Z-Index Scale */
    --z-base: 1;
    --z-low: 5;
    --z-medium-low: 10;
    --z-medium: 11;
    --z-medium-15: 15;
    --z-medium-20: 20;
    --z-medium-high: 30;
    --z-dropdown-low: 99;
    --z-dropdown: 100;
    --z-sticky: 500;
    --z-modal: 1000;
    --z-filter-overlay: 1999;
    --z-filter-panel: 2000;
    --z-tooltip: 5000;
    --z-max: 10000;

    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 5px 15px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.3);
    --shadow-panel: -5px 0 5px rgba(0, 0, 0, 0.1);
}

/* Font Face Definitions */
@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    unicode-range: U+AC00-D7A3;
}

@font-face {
    font-family: 'Pretendard-Bold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    unicode-range: U+AC00-D7A3;
}

@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GmarketSansBold';
    font-style: normal;
    font-weight: normal;
    src: url('./fonts/GmarketSansBold.otf');
}

/* Korean fallback for LeferiPointBlackOblique */
@font-face {
    font-family: 'LeferiPointBlackOblique';
    src: url('./fonts/GmarketSansBold.otf');
    unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F;
}

/* Korean fallback for Sequel45 (search input) */
@font-face {
    font-family: 'Sequel45';
    src: url('./fonts/GmarketSansBold.otf');
    unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F;
}

@font-face {
    font-family: 'LeferiPointBlackOblique';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/LeferiPoint-BlackObliqueA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    unicode-range: U+0000-00FF, U+0100-024F, U+0250-02AF, U+1E00-1EFF, U+2000-206F, U+2070-209F, U+20A0-20CF, U+2100-214F, U+2150-218F, U+2190-21FF, U+2200-22FF, U+2300-23FF, U+25A0-25FF, U+2600-26FF, U+2700-27BF, U+FB00-FB4F, U+FE20-FE2F;
}

@font-face {
    font-family: 'LeferiPointOblique';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/LeferiPoint-WhiteObliqueA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'LeferiPointBlack';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/LeferiPoint-BlackA.woff') format('woff');
    font-style: normal;
}

@font-face {
    font-family: 'Sequel95';
    src: url('./fonts/Sequel100Black-95.ttf');
}

@font-face {
    font-family: 'Sequel85';
    src: url('./fonts/Sequel100Black-85.ttf');
}

@font-face {
    font-family: 'Sequel75';
    src: url('./fonts/Sequel100Black-75.ttf');
}

@font-face {
    font-family: 'Sequel45';
    src: url('./fonts/Sequel100Black-45.ttf');
    unicode-range: U+0000-00FF, U+0100-024F, U+0250-02AF, U+1E00-1EFF, U+2000-206F, U+2070-209F, U+20A0-20CF, U+2100-214F, U+2150-218F, U+2190-21FF, U+2200-22FF, U+2300-23FF, U+25A0-25FF, U+2600-26FF, U+2700-27BF, U+FB00-FB4F, U+FE20-FE2F;
}

@font-face {
    font-family: 'Sequel55';
    src: url('./fonts/Sequel100Black-55.ttf');
}

@font-face {
    font-family: 'Sequel65';
    src: url('./fonts/Sequel100Black-65.ttf');
}

@font-face {
    font-family: 'OstrichRegular';
    src: url('./fonts/ostrich-sans-regular.woff');
}

@font-face {
    font-family: 'OstrichBlack';
    src: url('./fonts/ostrich-sans-black.woff');
}
