/* GUYZ - Global Design System */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400;1,600&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');

:root {
  --color-primary: #1A1A2E;
  --color-primary-light: #2A2A4E;
  --color-secondary: #E8D5B7;
  --color-secondary-light: #F2E6D0;
  --color-secondary-dark: #C4AD8A;
  --color-accent: #FF6B35;
  --color-accent-hover: #FF8A5C;
  --color-bg: #0B0B14;
  --color-bg-alt: #0F0F1A;
  --color-surface: #16162A;
  --color-surface-hover: #1E1E38;
  --color-surface-glass: rgba(22, 22, 42, 0.65);
  --color-surface-glass-hover: rgba(30, 30, 56, 0.8);
  --color-text: #F5F5F7;
  --color-text-secondary: #B0B0C8;
  --color-text-muted: #6E6E8A;
  --color-text-inverse: #0B0B14;
  --color-border: rgba(255, 255, 255, 0.06);
  --color-border-light: rgba(255, 255, 255, 0.1);
  --color-border-accent: rgba(232, 213, 183, 0.2);
  --color-success: #34D399;
  --color-warning: #FBBF24;
  --color-error: #F87171;
  --color-kakao: #FEE500;
  --color-kakao-text: #191919;
  --font-primary: 'Pretendard Variable', 'Pretendard', -apple-system, sans-serif;
  --font-display: 'Playfair Display', 'Georgia', serif;
  --text-xs: clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
  --text-sm: clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
  --text-base: clamp(0.9rem, 0.85rem + 0.25vw, 1rem);
  --text-lg: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  --text-xl: clamp(1.15rem, 1.05rem + 0.5vw, 1.25rem);
  --text-2xl: clamp(1.4rem, 1.2rem + 1vw, 1.5rem);
  --text-3xl: clamp(1.7rem, 1.4rem + 1.5vw, 1.875rem);
  --text-4xl: clamp(2rem, 1.5rem + 2.5vw, 2.5rem);
  --text-5xl: clamp(2.5rem, 1.8rem + 3.5vw, 3.5rem);
  --text-6xl: clamp(3rem, 2rem + 5vw, 5rem);
  --text-hero: clamp(3.5rem, 2.5rem + 6vw, 7rem);
  --font-light: 300; --font-normal: 400; --font-medium: 500;
  --font-semibold: 600; --font-bold: 700; --font-extrabold: 800;
  --leading-tight: 1.2; --leading-snug: 1.35; --leading-normal: 1.6;
  --tracking-wide: 0.025em; --tracking-wider: 0.05em; --tracking-widest: 0.12em;
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem;
  --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem;
  --space-section: clamp(4rem, 8vw, 8rem);
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px;
  --radius-xl: 16px; --radius-2xl: 24px; --radius-full: 9999px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.5);
  --shadow-xl: 0 16px 50px rgba(0,0,0,0.6);
  --shadow-glow: 0 0 30px rgba(232,213,183,0.1);
  --blur-sm: 4px; --blur-md: 12px; --blur-lg: 24px; --blur-xl: 40px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-fast: 150ms; --duration-normal: 300ms; --duration-slow: 500ms;
  --z-dropdown: 100; --z-sticky: 200; --z-overlay: 300; --z-modal: 400; --z-top: 9999;
  --container-xl: 1280px; --container-2xl: 1440px;
  --container-padding: clamp(1rem, 4vw, 2rem);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body {
  font-family: var(--font-primary); font-size: var(--text-base);
  line-height: var(--leading-normal); color: var(--color-text);
  background: var(--color-bg); overflow-x: hidden; min-height: 100vh;
}
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background: var(--color-bg); }
::-webkit-scrollbar-thumb { background: var(--color-text-muted); border-radius: var(--radius-full); }
::selection { background: var(--color-secondary); color: var(--color-text-inverse); }
a { color:inherit; text-decoration:none; transition: color var(--duration-fast) var(--ease-out); }
img, video { max-width:100%; height:auto; display:block; }
ul, ol { list-style:none; }
button, input, textarea, select { font:inherit; color:inherit; background:none; border:none; outline:none; }
button { cursor:pointer; }

.font-display { font-family: var(--font-display); }
.text-gradient { background: linear-gradient(135deg, var(--color-secondary), var(--color-accent)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.text-gradient-gold { background: linear-gradient(135deg, var(--color-secondary-dark), var(--color-secondary), var(--color-secondary-light)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.container { width:100%; max-width: var(--container-xl); margin:0 auto; padding:0 var(--container-padding); }
.container-lg { max-width: var(--container-2xl); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
.section { padding: var(--space-section) 0; }
.section-header { margin-bottom: var(--space-12); }
.section-label { display:inline-block; font-size: var(--text-xs); font-weight: var(--font-semibold); letter-spacing: var(--tracking-widest); text-transform:uppercase; color: var(--color-secondary); margin-bottom: var(--space-4); }
.section-title { font-family: var(--font-display); font-size: var(--text-4xl); font-weight: var(--font-bold); line-height: var(--leading-tight); }
.section-subtitle { font-size: var(--text-lg); color: var(--color-text-secondary); margin-top: var(--space-4); max-width:600px; }
.bg-noise::before { content:''; position:absolute; inset:0; opacity:0.03; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E"); pointer-events:none; z-index:0; }
