/* ========================================
   INFINITE BEAUTY - MAIN STYLESHEET
   Modular CSS Architecture
   ======================================== */

/* CSS Imports - порядок важен! */
@import url('base.css');
@import url('utilities.css');
@import url('layout.css');
@import url('search.css');
@import url('privacy.css');

/* ========================================
   CSS VARIABLES (Design System)
   ======================================== */

:root {
  /* Teal Color Palette */
  --primary-teal: #7ebdc2;
  --primary-dark: #6dabad;
  --primary-light: #a6d4d7;
  --primary-extra-light: #e7f5f6;

  /* Dark Contrasting Colors for Text */
  --text-primary: #1a1a2e;
  --text-secondary: #16213e;
  --heading-color: #0f3460;
  --neutral-gray: #4a5568;

  /* Accent Colors */
  --accent-gold: #d4af37;
  --accent-coral: #ff6b6b;
  --accent-purple: #6c63ff;

  /* Background Colors */
  --bg-cream: #faf7f3;
  --bg-light: #f9fafb;
  --bg-dark: #0a0e27;
  --white: #ffffff;

  /* Typography */
  --font-heading: 'Cormorant Garamond', serif;
  --font-body: 'Montserrat', sans-serif;

  /* Font Sizes - Responsive */
  --h1: clamp(1.5rem, 5vw, 3.8rem);
  --h2: clamp(2rem, 4vw, 3rem);
  --h3: clamp(1.5rem, 3vw, 2rem);
  --h4: clamp(1.25rem, 2.5vw, 1.5rem);
  --body: 1.125rem;
  --small: 0.875rem;

  --border-radius: 20px;
}