/* Global Typography Styles - Elegant & Refined Lettering */

/* Import Google Fonts - Thin, Elegant, Lettering Style */
@import url('https://fonts.googleapis.com/css2?family=Poiret+One&family=Raleway:wght@100;200;300;400;500;600&family=Josefin+Sans:wght@100;200;300;400;500;600&family=Montserrat:wght@100;200;300;400;500;600&family=Noto+Sans:wght@400;500;700&display=swap');

/* Apply Noto Sans as the primary font for body text */
body {
  font-family: 'Noto Sans', sans-serif;
}

/* Main Headings - Poiret One (Elegant, Thin, Lettering Style) */
h1, 
.heading-style-h1,
.hero-title,
.section-title,
.new-brand-name {
  font-family: 'Poiret One', 'Josefin Sans', sans-serif;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-size: clamp(2rem, 7vw, 4rem);
  line-height: 1.2;
}

/* Secondary Headings - Josefin Sans (Thin, Modern) */
h2,
.heading-style-h2 {
  font-family: 'Josefin Sans', sans-serif;
  font-weight: 300;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: clamp(1.6rem, 5vw, 3rem);
  line-height: 1.3;
}

/* Tertiary Headings - Raleway (Light, Sophisticated) */
h3,
.heading-style-h3 {
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: clamp(1.3rem, 4vw, 2.2rem);
  line-height: 1.4;
}

/* Smaller Headings */
h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

h4 {
  font-size: clamp(1.3rem, 3.5vw, 2.2rem);
}

h5 {
  font-size: clamp(1.15rem, 3vw, 1.7rem);
}

h6 {
  font-size: clamp(1rem, 2.5vw, 1.4rem);
}

/* Monospace elements use a monospace fallback */
code, pre, 
.code-text,
.track-number,
.monospace {
  font-family: 'Courier New', 'Courier', monospace;
  font-weight: 500;
}

/* Display text - Elegant & Thin */
.display-text {
  font-family: 'Poiret One', 'Josefin Sans', sans-serif;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-size: clamp(2.5rem, 8vw, 5rem);
  line-height: 1.1;
}

/* Navigation and UI elements - Light & Refined */
.nav-link,
.button,
.text-style-link,
.new-nav-link,
.mobile-menu-link {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-size: clamp(0.9rem, 2vw, 1.1rem);
}

/* Footer text */
.footer_component,
.text-size-regular {
  font-family: 'Noto Sans', sans-serif;
  font-weight: 400;
}

/* Slider and track titles - Thin & Elegant */
.slider-list_title,
.track-name {
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 2.5vw, 1.4rem);
}

/* Release titles - Light & Stylish */
.release-title {
  font-family: 'Josefin Sans', sans-serif;
  font-weight: 300;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: clamp(0.9rem, 2vw, 1.2rem);
}

/* Product titles - Refined presence */
.product-title {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: clamp(0.85rem, 2vw, 1.15rem);
}

/* Cart and Modal titles - Elegant & Prominent */
.cart-title,
.cart-sidebar-header h2,
.subscribe-modal-title {
  font-family: 'Poiret One', sans-serif;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-size: clamp(1.5rem, 5vw, 2.5rem);
}

/* Brand name - Elegant Lettering */
.new-brand-name {
  font-family: 'Poiret One', 'Josefin Sans', sans-serif;
  font-weight: 400;
  letter-spacing: 0.15em;
  font-size: clamp(1.3rem, 4vw, 2.2rem);
}

/* Buttons - Light but Clear CTA */
.subscribe-button,
.cart-sidebar-checkout,
.cart-checkout-button {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-size: clamp(0.9rem, 2vw, 1.1rem);
}
