/* ============================================================
   AIGENBERG · Base Tokens & Reset
   Bold & Minimal — pure monochrome, size-driven hierarchy
   ============================================================ */

:root {
    /* Color */
    --bg: #050505;
    --bg-elev: #0c0c0c;
    --fg: #ffffff;
    --fg-soft: rgba(255, 255, 255, 0.78);
    --muted: rgba(255, 255, 255, 0.55);
    --muted-2: rgba(255, 255, 255, 0.35);
    --rule: rgba(255, 255, 255, 0.08);
    --rule-strong: rgba(255, 255, 255, 0.18);
    --overlay: rgba(0, 0, 0, 0.92);

    /* Type */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --fs-display: clamp(72px, 9vw, 160px);
    --fs-h1: clamp(48px, 6vw, 96px);
    --fs-h2: clamp(36px, 4vw, 64px);
    --fs-h3: clamp(22px, 1.6vw, 28px);
    --fs-body-lg: 19px;
    --fs-body: 16px;
    --fs-body-sm: 14px;
    --fs-eyebrow: 11px;

    --fw-display: 800;
    --fw-bold: 700;
    --fw-medium: 500;
    --fw-regular: 400;
    --fw-light: 300;

    --lh-tight: 0.95;
    --lh-snug: 1.15;
    --lh-body: 1.65;

    --tracking-display: -0.03em;
    --tracking-eyebrow: 0.2em;

    /* Layout */
    --nav-h: 76px;
    --container: 1640px;
    --gutter: 60px;
    --section-y: clamp(100px, 12vw, 180px);

    /* Motion */
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

    /* Z */
    --z-nav: 1000;
    --z-modal: 2000;
    --z-toast: 3000;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--font-sans);
    background: var(--bg);
    color: var(--fg);
    font-weight: var(--fw-light);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
    transition: opacity 0.25s var(--ease-out);
}

ul {
    list-style: none;
}

button {
    font-family: inherit;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    padding: 0;
}

img,
svg {
    display: block;
    max-width: 100%;
}

/* ----- Language toggle ----- */
.lang-ko,
.lang-en {
    display: none;
}

.lang-ko.active,
.lang-en.active {
    display: block;
}

span.lang-ko.active,
span.lang-en.active {
    display: inline;
}

/* ----- Typography classes ----- */
.eyebrow {
    display: inline-block;
    font-size: var(--fs-eyebrow);
    font-weight: var(--fw-bold);
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--muted);
}

.display {
    font-size: var(--fs-display);
    font-weight: var(--fw-display);
    line-height: var(--lh-tight);
    letter-spacing: var(--tracking-display);
    text-transform: uppercase;
}

.h1 {
    font-size: var(--fs-h1);
    font-weight: var(--fw-display);
    line-height: var(--lh-tight);
    letter-spacing: -0.02em;
    text-transform: uppercase;
}

.h2 {
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    line-height: var(--lh-snug);
    letter-spacing: -0.015em;
}

.h3 {
    font-size: var(--fs-h3);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.005em;
}

.body-lg {
    font-size: var(--fs-body-lg);
    font-weight: var(--fw-light);
    line-height: var(--lh-body);
}

.body {
    font-size: var(--fs-body);
    font-weight: var(--fw-light);
    line-height: var(--lh-body);
}

.muted {
    color: var(--muted);
}

/* ----- Reduced motion ----- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}