/* Premium Font Library - Pre-installed Fonts */
/* All fonts are locally hosted for optimal performance */

/* ============================================
   LUXURY / HIGH-FASHION
   ============================================ */

/* Playfair Display */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/luxury/playfair-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/luxury/playfair-700.woff2') format('woff2');
}

/* Cormorant Garamond */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/luxury/cormorant-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/luxury/cormorant-700.woff2') format('woff2');
}

/* ============================================
   MINIMAL / MODERN
   ============================================ */

/* Inter */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/minimal/inter-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/minimal/inter-700.woff2') format('woff2');
}

/* Poppins */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/minimal/poppins-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/minimal/poppins-700.woff2') format('woff2');
}

/* DM Sans */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/minimal/dm-sans-400.woff2') format('woff2');
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/minimal/dm-sans-700.woff2') format('woff2');
}

/* ============================================
   STREETWEAR / BOLD
   ============================================ */

/* Bebas Neue */
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/streetwear/bebas-neue-400.woff2') format('woff2');
}

/* Oswald */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/streetwear/oswald-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/streetwear/oswald-700.woff2') format('woff2');
}

/* Anton */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/streetwear/anton-400.woff2') format('woff2');
}

/* ============================================
   EDITORIAL / MAGAZINE
   ============================================ */

/* Libre Baskerville */
@font-face {
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/editorial/libre-baskerville-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/editorial/libre-baskerville-700.woff2') format('woff2');
}

/* Lora */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/editorial/lora-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/editorial/lora-700.woff2') format('woff2');
}

/* ============================================
   CLEAN UI / NEUTRAL
   ============================================ */

/* Work Sans */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/clean/work-sans-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/clean/work-sans-700.woff2') format('woff2');
}

/* Source Sans 3 */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/clean/source-sans-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/clean/source-sans-700.woff2') format('woff2');
}

/* ============================================
   DEFAULT FONTS (Already in project)
   ============================================ */

/* Syne - Keep existing */
/* Manrope - Keep existing */

/* ============================================
   CSS VARIABLES FOR DYNAMIC TYPOGRAPHY
   ============================================ */

:root {
  /* Primary and Secondary Fonts - Controlled by Admin */
  --font-primary: 'Syne', sans-serif;
  --font-secondary: 'Manrope', sans-serif;
  
  /* Section-specific fonts */
  --font-headings: var(--font-primary);
  --font-body: var(--font-secondary);
  --font-buttons: var(--font-secondary);
  --font-nav: var(--font-secondary);
  --font-product-title: var(--font-primary);
  --font-product-price: var(--font-secondary);
  --font-announcement: var(--font-secondary);
  --font-banner: var(--font-primary);
  --font-footer: var(--font-secondary);
  
  /* Font weights */
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  
  /* Letter spacing */
  --spacing-tight: -0.02em;
  --spacing-normal: 0;
  --spacing-wide: 0.05em;
  --spacing-wider: 0.1em;
  --spacing-widest: 0.2em;
  
  /* Line heights */
  --leading-none: 1;
  --leading-tight: 1.1;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --leading-loose: 2;
}

/* Typography utility classes */
.font-primary { font-family: var(--font-primary); }
.font-secondary { font-family: var(--font-secondary); }
.font-headings { font-family: var(--font-headings); }
.font-body { font-family: var(--font-body); }
.font-buttons { font-family: var(--font-buttons); }