/* Base Styles - Typography, Body, HTML */

/* Font Imports */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Work+Sans:wght@200;300;400;500;600;700&display=swap');

html {
  font-size: 16px;
  overflow-x: hidden;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: var(--color-bg);
  color: var(--color-text);
  overflow-x: hidden;
}

/* Responsive Typography Classes */
.text-display-large {
  font-size: clamp(3rem, 8vw, 6rem);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.text-display-medium {
  font-size: clamp(2.5rem, 6vw, 4rem);
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.text-headline {
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.text-title {
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  line-height: 1.4;
  font-weight: 500;
}

.text-body {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.6;
  font-weight: 400;
}

.text-caption {
  font-size: clamp(0.875rem, 1.5vw, 1rem);
  line-height: 1.5;
  font-weight: 400;
}

/* Text Shadows */
.text-shadow-sm { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
.text-shadow-md { text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15); }
.text-shadow-lg { text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); }

/* No scrollbar utility */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Selection */
::selection {
  background: rgba(132, 39, 214, 0.2);
  color: var(--color-text);
}