/** Shopify CDN: Minification failed

Line 122:19 Expected identifier but found whitespace
Line 122:20 Unexpected "1.8rem"

**/
/**
 * GMC Pro Typography System
 * Based on Figma design specs
 * Base: 1rem = 10px
 * Font: Neue Haas Grotesk Display Pro (single family)
 */

/* Font Import */
@import url('https://fonts.cdnfonts.com/css/neue-haas-grotesk-display-pro');

:root {
  /* ========================================
     FONT FAMILY
     ======================================== */
  --font-body: 'Neue Haas Grotesk Display Pro', sans-serif;

  /* ========================================
     FONT WEIGHTS
     Only two weights used in Figma design
     ======================================== */
  --font-weight-regular: 450;  /* 55 Roman - primary */
  --font-weight-medium: 500;   /* 65 Medium - product titles */

  /* ========================================
     FONT SIZES
     Matching Figma exactly
     ======================================== */
  --font-size-nav: 1.4rem;     /* 14px - Nav, buttons */
  --font-size-body: 1.6rem;    /* 16px - Body text */
  --font-size-sub: 1.8rem;     /* 18px - Subheading */
  --font-size-h3: 2.4rem;      /* 24px - Product titles */
  --font-size-h2: 3rem;        /* 30px - Section headers */
  --font-size-h1: 4.2rem;      /* 42px - Page titles */

  /* ========================================
     LINE HEIGHTS
     ======================================== */
  --line-height-tight: 0.95;   /* Product titles */
  --line-height-heading: 1;    /* Headings, nav, subheading */
  --line-height-body: 1.5;     /* Body text */

  /* ========================================
     LETTER SPACING
     Absolute pixel values from Figma
     ======================================== */
  --letter-spacing-h1: 0.42px;      /* H1 (42px × 1%) */
  --letter-spacing-h2: 0.3px;       /* H2 (30px × 1%) */
  --letter-spacing-h3: 0.72px;      /* H3/Product titles (24px × 3%) */
  --letter-spacing-sub: 0.9px;      /* Subheading (18px × 5%) */
  --letter-spacing-body: 0.32px;    /* Body (16px × 2%) */
  --letter-spacing-nav: 1.12px;     /* Nav, buttons (14px × 8%) */

  /* Legacy alias */
  --letter-spacing-tight: var(--letter-spacing-h1);

  /* ========================================
     BACKWARD COMPATIBILITY ALIASES
     Maps old variable names to new system
     ======================================== */
  /* Old font family vars → single family */
  --font-accent: var(--font-body);
  --font-accent-bold: var(--font-body);
  --font-base: var(--font-body);

  /* Old weight vars → simplified weights */
  --font-weight-100: var(--font-weight-regular);
  --font-weight-200: var(--font-weight-regular);
  --font-weight-300: var(--font-weight-regular);
  --font-weight-400: var(--font-weight-regular);
  --font-weight-500: var(--font-weight-medium);
  --font-weight-600: var(--font-weight-medium);
  --font-weight-700: var(--font-weight-medium);
  --font-weight-800: var(--font-weight-medium);
  --font-weight-900: var(--font-weight-medium);

  /* Old size vars → new scale */
  --font-size-3xs: var(--font-size-nav);
  --font-size-2xs: var(--font-size-nav);
  --font-size-xs: var(--font-size-body);
  --font-size-sm: var(--font-size-h2);
  --font-size-md: var(--font-size-h2);
  --font-size-lg: var(--font-size-h1);
  --font-size-xl: var(--font-size-h1);
  --font-size-2xl: var(--font-size-h1);
  --font-size-base: 1rem;

  /* Old line height vars */
  --line-height-snug: var(--line-height-heading);
  --line-height-normal: var(--line-height-body);

  /* Old letter spacing vars */
  --letter-spacing-normal: 0;
  --letter-spacing-wide: var(--letter-spacing-nav);
  --letter-spacing-wider: var(--letter-spacing-nav);
}

/* ==========================================
   MOBILE RESPONSIVE SIZES
   Per Figma: Only H1 and H2 scale on mobile.
   H3, Subheading, Body, Nav remain at desktop sizes.
   ========================================== */
@media (max-width: 749px) {
  :root {
    /* Only H1 and H2 scale down on mobile per Figma specs */
    --font-size-h2: 2rem;        /* 20px (desktop: 30px) */
    --font-size-h1: 3.2rem;      /* 32px (desktop: 42px) */

    /* H2 letter-spacing changes on mobile: 1% → 3% */
    --letter-spacing-h2: 0.6px;  /* 20px × 3% */
  }
}

/* @media (max-width: 375px) {
  :root {
    /* Further scale for very small screens */
    --font-size-h2: 1.8rem;      /* 18px */
    --font-size-h1: 2.8rem;      /* 28px */

    --letter-spacing-h2: 0.54px; /* 18px × 3% */
  }
} */

/* ==========================================
   CORE TYPOGRAPHY STYLES
   ========================================== */

/* H1 - Page Titles */
h1, .h1 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-h1);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-h1);
}

/* H2 - Section Headers */
h2, .h2 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-h2);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-h2);
}

/* H3 - Product Titles (uses medium weight) */
h3, .h3 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-h3);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-h3);
}

/* H4 - Subheading style */
h4, .h4 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-sub);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-sub);
}

/* H5 - Small heading */
h5, .h5 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-nav);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* Subheading - Uppercase accent */
.subheading {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-sub);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-sub);
  text-transform: uppercase;
}

/* Body Text */
body,
p,
.body,
li,
td,
div {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  letter-spacing: var(--letter-spacing-body);
}

/* Navigation & Buttons */
.nav,
.button,
.btn,
.button-label,
.shopify-challenge__button,
.customer button {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-nav);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* ==========================================
   UTILITY CLASSES
   ========================================== */

/* Font Weight */
.font-regular {
  font-weight: var(--font-weight-regular);
}

.font-medium {
  font-weight: var(--font-weight-medium);
}

/* Text Transform */
.text-uppercase {
  text-transform: uppercase;
}

.text-lowercase {
  text-transform: lowercase;
}

.text-capitalize {
  text-transform: capitalize;
}

/* Text Decoration */
.text-underline {
  text-decoration: underline;
}

/* Line Height */
.leading-tight {
  line-height: var(--line-height-tight);
}

.leading-heading {
  line-height: var(--line-height-heading) !important;
}

.leading-body {
  line-height: var(--line-height-body);
}

/* Letter Spacing */
.tracking-h1 {
  letter-spacing: var(--letter-spacing-h1);
}

.tracking-h2 {
  letter-spacing: var(--letter-spacing-h2);
}

.tracking-body {
  letter-spacing: var(--letter-spacing-body);
}

.tracking-h3 {
  letter-spacing: var(--letter-spacing-h3);
}

.tracking-sub {
  letter-spacing: var(--letter-spacing-sub);
}

.tracking-nav {
  letter-spacing: var(--letter-spacing-nav);
}

/* Font Size Utilities */
.text-nav {
  font-size: var(--font-size-nav);
}

.text-body {
  font-size: var(--font-size-body);
}

.text-sub {
  font-size: var(--font-size-sub);
}

.text-h3 {
  font-size: var(--font-size-h3);
}

.text-h2 {
  font-size: var(--font-size-h2);
}

.text-h1 {
  font-size: var(--font-size-h1);
}

/* ==========================================
   COMPONENT-SPECIFIC OVERRIDES
   ========================================== */

/* Announcement Bar */
.announcement-bar__message {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-nav);
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* Header Menu */
.header__menu-item span,
.header__secondary-menu .list-menu__item {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-nav);
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* Footer */
.footer-content a,
.footer-content span,
.footer-content small {
  font-family: var(--font-body);
  font-size: var(--font-size-nav);
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* Marquee */
.marquee-text-item span {
  font-family: var(--font-body);
  font-size: var(--font-size-h2);
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-h2);
}

/* Product Cards */
.card__heading,
.product-card__title {
  font-family: var(--font-body);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-h3);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-h3);
}

/* Rich Text */
.rte p:not(:last-of-type) {
  margin-bottom: 1.4rem;
}

/* Article Cards */
.article-card-new__title {
  font-family: var(--font-body);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-h3);
  line-height: var(--line-height-tight);
}

.article-card-new__excerpt {
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

.article-card-new__category span,
.article-card-new__label,
.article-card-new__date,
.article-card-new__author {
  font-family: var(--font-body);
  font-size: var(--font-size-nav);
  letter-spacing: var(--letter-spacing-nav);
  text-transform: uppercase;
}

/* Article Template */
.article-template__title {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
}

/* Video/Multicolumn Headings */
.video-with-text__heading,
.multicolumn-card__info .inline-richtext,
.steps-item__title {
  font-family: var(--font-body);
}

/* Steps Section */
.steps-item__number {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-h1);
  line-height: var(--line-height-heading) !important;
}

/* Downloadable Resources */
.downloadable-resources-title {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
}

/* Background Video Section */
.background-video-section__heading {
  font-family: var(--font-body);
  font-size: 7.5rem;
}

@media screen and (max-width: 1288px) {
  .background-video-section__heading {
    font-size: 4rem;
  }
}