/* ==========================================================================
   Arctic Cat Global Stylesheet

   Canonical global stylesheet for the Arctic Cat Experience theme.
   Legacy css/main.css should only forward to this file during transition.
   ========================================================================== */

/* Generic */
*,
*::before,
*::after {
  box-sizing: border-box;
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct box sizing in Firefox.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Remove the inheritance of text transform in Edge and Firefox.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers.
 */

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Arctic Cat foundation */
/* ==========================================================================
   Arctic Cat Tokens
   Global design values shared across templates, partials, and modules.

   Typography is intentionally explicit here:
   - Font loading is handled by Adobe Typekit in css/ac/_fonts.css.
   - The display face is Futura PT Condensed Extra Bold Italic, represented by
     Adobe's family name "futura-pt-condensed" with font-weight: 800 and
     font-style: italic.
   - Modules/components should consume these tokens instead of hard-coding
     font-family stacks.
   ========================================================================== */

:root {
  /* ==========================================================================
     Brand colors
     ========================================================================== */

  --ac-color-black: #111111;
  --ac-color-white: #FFFFFF;
  --ac-color-red: #C8102E;
  --ac-color-green: #66BC29;

  /* ==========================================================================
     Neutral palette
     ========================================================================== */

  --ac-color-gray-950: #111111;
  --ac-color-gray-900: #1f1f1f;
  --ac-color-gray-850: #202020;
  --ac-color-gray-800: #2b2b2b;
  --ac-color-gray-750: #303030;
  --ac-color-gray-700: #3f3f3f;
  --ac-color-gray-600: #555555;
  --ac-color-gray-500: #666666;
  --ac-color-gray-400: #8a8a8a;
  --ac-color-gray-300: #c8c8c2;
  --ac-color-gray-200: #deded9;
  --ac-color-gray-100: #F4F4F2;
  --ac-color-gray-050: #f8f8f6;

  /* ==========================================================================
     Semantic color roles
     ========================================================================== */

  --ac-surface: var(--ac-color-white);
  --ac-surface-muted: var(--ac-color-gray-100);
  --ac-surface-soft: var(--ac-color-gray-050);
  --ac-surface-strong: var(--ac-color-black);

  --ac-dark-surface: var(--ac-color-gray-850);
  --ac-dark-surface-card: var(--ac-color-gray-750);
  --ac-dark-surface-strong: #050505;

  --ac-text: var(--ac-color-black);
  --ac-text-muted: var(--ac-color-gray-500);
  --ac-text-inverse: var(--ac-color-white);
  --ac-text-inverse-muted: rgba(255, 255, 255, 0.72);

  --ac-border: var(--ac-color-gray-200);
  --ac-border-strong: var(--ac-color-gray-300);
  --ac-border-inverse: rgba(255, 255, 255, 0.09);
  --ac-border-inverse-strong: rgba(255, 255, 255, 0.22);

  --ac-accent: var(--ac-color-green);
  --ac-accent-hover: #7bdc33;
  --ac-danger: var(--ac-color-red);
  --ac-danger-inverse: #ff7a8a;

  /* ==========================================================================
     Font families
     ========================================================================== */

  --ac-font-body: "barlow", "Barlow", Arial, sans-serif;
  --ac-font-ui: "barlow", "Barlow", Arial, sans-serif;
  --ac-font-ui-condensed: "barlow-condensed", "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
  --ac-font-condensed: var(--ac-font-ui-condensed);

  /* Futura PT Condensed Extra Bold Italic via Adobe Typekit */
  --ac-font-display: "futura-pt-condensed", "Futura PT Condensed", "Barlow Condensed", "Arial Narrow", Arial, sans-serif;

  /* ==========================================================================
     Font weights and styles
     ========================================================================== */

  --ac-font-weight-normal: 400;
  --ac-font-weight-medium: 500;
  --ac-font-weight-bold: 700;
  --ac-font-weight-heavy: 800;

  --ac-font-style-normal: normal;
  --ac-font-style-display: italic;


  /* ==========================================================================
     Figma typography system
     ========================================================================== */

  /*
    Display styles
    Figma: Futura PT Condensed Extra Bold Oblique/Italic
  */
  --ac-type-display-weight: var(--ac-font-weight-heavy);
  --ac-type-display-style: var(--ac-font-style-display);

  --ac-type-display-01-family: var(--ac-font-display);
  --ac-type-display-01-size: 220px;
  --ac-type-display-01-line-height: 180px;
  --ac-type-display-01-weight: var(--ac-type-display-weight);
  --ac-type-display-01-style: var(--ac-type-display-style);
  --ac-type-display-01-letter-spacing: 0;

  --ac-type-display-02-family: var(--ac-font-display);
  --ac-type-display-02-size: 160px;
  --ac-type-display-02-line-height: 130px;
  --ac-type-display-02-weight: var(--ac-type-display-weight);
  --ac-type-display-02-style: var(--ac-type-display-style);
  --ac-type-display-02-letter-spacing: 0;

  --ac-type-display-03-family: var(--ac-font-display);
  --ac-type-display-03-size: 120px;
  --ac-type-display-03-line-height: 100px;
  --ac-type-display-03-weight: var(--ac-type-display-weight);
  --ac-type-display-03-style: var(--ac-type-display-style);
  --ac-type-display-03-letter-spacing: 0;

  /*
    Heading styles
    Figma: Futura PT Condensed Extra Bold Oblique/Italic
  */
  --ac-type-heading-weight: var(--ac-font-weight-heavy);
  --ac-type-heading-style: var(--ac-font-style-display);

  --ac-type-heading-h1-family: var(--ac-font-display);
  --ac-type-heading-h1-size: 70px;
  --ac-type-heading-h1-line-height: 60px;
  --ac-type-heading-h1-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h1-style: var(--ac-type-heading-style);
  --ac-type-heading-h1-letter-spacing: 0;

  --ac-type-heading-h2-family: var(--ac-font-display);
  --ac-type-heading-h2-size: 60px;
  --ac-type-heading-h2-line-height: 50px;
  --ac-type-heading-h2-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h2-style: var(--ac-type-heading-style);
  --ac-type-heading-h2-letter-spacing: 0;

  --ac-type-heading-h3-family: var(--ac-font-display);
  --ac-type-heading-h3-size: 50px;
  --ac-type-heading-h3-line-height: 40px;
  --ac-type-heading-h3-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h3-style: var(--ac-type-heading-style);
  --ac-type-heading-h3-letter-spacing: 0;

  --ac-type-heading-h4-family: var(--ac-font-display);
  --ac-type-heading-h4-size: 40px;
  --ac-type-heading-h4-line-height: 36px;
  --ac-type-heading-h4-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h4-style: var(--ac-type-heading-style);
  --ac-type-heading-h4-letter-spacing: 0;

  --ac-type-heading-h5-family: var(--ac-font-display);
  --ac-type-heading-h5-size: 32px;
  --ac-type-heading-h5-line-height: 28px;
  --ac-type-heading-h5-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h5-style: var(--ac-type-heading-style);
  --ac-type-heading-h5-letter-spacing: 0;

  --ac-type-heading-h6-family: var(--ac-font-display);
  --ac-type-heading-h6-size: 24px;
  --ac-type-heading-h6-line-height: 22px;
  --ac-type-heading-h6-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h6-style: var(--ac-type-heading-style);
  --ac-type-heading-h6-letter-spacing: 0;

  --ac-type-heading-h7-family: var(--ac-font-display);
  --ac-type-heading-h7-size: 18px;
  --ac-type-heading-h7-line-height: 17px;
  --ac-type-heading-h7-weight: var(--ac-type-heading-weight);
  --ac-type-heading-h7-style: var(--ac-type-heading-style);
  --ac-type-heading-h7-letter-spacing: 0;

  /*
    Body styles
    Figma: Barlow Medium
  */
  --ac-type-body-weight: var(--ac-font-weight-medium);
  --ac-type-body-style: var(--ac-font-style-normal);

  --ac-type-body-01-family: var(--ac-font-body);
  --ac-type-body-01-size: 28px;
  --ac-type-body-01-line-height: 36px;
  --ac-type-body-01-weight: var(--ac-type-body-weight);
  --ac-type-body-01-style: var(--ac-type-body-style);
  --ac-type-body-01-letter-spacing: 0;

  --ac-type-body-02-family: var(--ac-font-body);
  --ac-type-body-02-size: 24px;
  --ac-type-body-02-line-height: 32px;
  --ac-type-body-02-weight: var(--ac-type-body-weight);
  --ac-type-body-02-style: var(--ac-type-body-style);
  --ac-type-body-02-letter-spacing: 0;

  --ac-type-body-03-family: var(--ac-font-body);
  --ac-type-body-03-size: 18px;
  --ac-type-body-03-line-height: 24px;
  --ac-type-body-03-weight: var(--ac-type-body-weight);
  --ac-type-body-03-style: var(--ac-type-body-style);
  --ac-type-body-03-letter-spacing: 0;

  --ac-type-body-04-family: var(--ac-font-body);
  --ac-type-body-04-size: 16px;
  --ac-type-body-04-line-height: 21px;
  --ac-type-body-04-weight: var(--ac-type-body-weight);
  --ac-type-body-04-style: var(--ac-type-body-style);
  --ac-type-body-04-letter-spacing: 0;

  --ac-type-body-05-family: var(--ac-font-body);
  --ac-type-body-05-size: 11px;
  --ac-type-body-05-line-height: 16px;
  --ac-type-body-05-weight: var(--ac-type-body-weight);
  --ac-type-body-05-style: var(--ac-type-body-style);
  --ac-type-body-05-letter-spacing: 0;

  /*
    UI styles
    Figma: Barlow Condensed Medium
  */
  --ac-type-ui-weight: var(--ac-font-weight-medium);
  --ac-type-ui-style: var(--ac-font-style-normal);

  --ac-type-ui-01-family: var(--ac-font-ui-condensed);
  --ac-type-ui-01-size: 17px;
  --ac-type-ui-01-line-height: 24px;
  --ac-type-ui-01-weight: var(--ac-type-ui-weight);
  --ac-type-ui-01-style: var(--ac-type-ui-style);
  --ac-type-ui-01-letter-spacing: 0;

  --ac-type-ui-02-family: var(--ac-font-ui-condensed);
  --ac-type-ui-02-size: 14px;
  --ac-type-ui-02-line-height: 18px;
  --ac-type-ui-02-weight: var(--ac-type-ui-weight);
  --ac-type-ui-02-style: var(--ac-type-ui-style);
  --ac-type-ui-02-letter-spacing: 0;

  --ac-type-ui-03-family: var(--ac-font-ui-condensed);
  --ac-type-ui-03-size: 11px;
  --ac-type-ui-03-line-height: 12px;
  --ac-type-ui-03-weight: var(--ac-type-ui-weight);
  --ac-type-ui-03-style: var(--ac-type-ui-style);
  --ac-type-ui-03-letter-spacing: 0;

  /* ==========================================================================
     General type scale
     ========================================================================== */

  --ac-font-size-xs: 0.75rem;
  --ac-font-size-sm: 0.875rem;
  --ac-font-size-md: 1rem;
  --ac-font-size-lg: 1.125rem;
  --ac-font-size-xl: 1.5rem;
  --ac-font-size-2xl: 2rem;
  --ac-font-size-3xl: 3rem;
  --ac-font-size-4xl: 4rem;

  --ac-line-height-tight: 0.92;
  --ac-line-height-heading: 1;
  --ac-line-height-body: 1.45;

  --ac-letter-spacing-tight: -0.04em;
  --ac-letter-spacing-label: 0.075em;
  --ac-letter-spacing-nav: 0.045em;

  /* ==========================================================================
     Component typography tokens
     ========================================================================== */

  /*
    Utility nav links
    Figma: Barlow Condensed Medium 14
  */
  --ac-type-utility-nav-family: var(--ac-font-ui-condensed);
  --ac-type-utility-nav-size: 14px;
  --ac-type-utility-nav-weight: var(--ac-font-weight-medium);
  --ac-type-utility-nav-style: var(--ac-font-style-normal);
  --ac-type-utility-nav-letter-spacing: 0.045em;
  --ac-type-utility-nav-line-height: 1;

  /*
    Primary segment nav
    Figma: Barlow Condensed Medium 17
  */
  --ac-type-primary-nav-family: var(--ac-type-ui-01-family);
  --ac-type-primary-nav-size: var(--ac-type-ui-01-size);
  --ac-type-primary-nav-weight: var(--ac-type-ui-01-weight);
  --ac-type-primary-nav-style: var(--ac-type-ui-01-style);
  --ac-type-primary-nav-letter-spacing: var(--ac-type-ui-01-letter-spacing);
  --ac-type-primary-nav-line-height: var(--ac-type-ui-01-line-height);

  /*
    Side menu links
    Figma: Barlow Condensed Medium 17
  */
  --ac-type-side-menu-family: var(--ac-font-ui-condensed);
  --ac-type-side-menu-size: 17px;
  --ac-type-side-menu-weight: var(--ac-font-weight-medium);
  --ac-type-side-menu-style: var(--ac-font-style-normal);
  --ac-type-side-menu-letter-spacing: 0.045em;
  --ac-type-side-menu-line-height: 1;

  /*
    Horizontal category nav
    Figma: Barlow Condensed Medium 17
  */
  --ac-type-category-nav-family: var(--ac-font-ui-condensed);
  --ac-type-category-nav-size: 17px;
  --ac-type-category-nav-weight: var(--ac-font-weight-medium);
  --ac-type-category-nav-style: var(--ac-font-style-normal);
  --ac-type-category-nav-letter-spacing: 0.045em;
  --ac-type-category-nav-line-height: 1;

  /*
    Close / tertiary nav links
    Figma: Barlow Condensed Medium 17
  */
  --ac-type-close-link-family: var(--ac-font-ui-condensed);
  --ac-type-close-link-size: 17px;
  --ac-type-close-link-weight: var(--ac-font-weight-medium);
  --ac-type-close-link-style: var(--ac-font-style-normal);
  --ac-type-close-link-letter-spacing: 0.045em;
  --ac-type-close-link-line-height: 1;

  /*
    Card prices
    Figma: Barlow Condensed Medium 17
  */
  --ac-type-card-price-family: var(--ac-font-ui-condensed);
  --ac-type-card-price-size: 17px;
  --ac-type-card-price-weight: var(--ac-font-weight-medium);
  --ac-type-card-price-style: var(--ac-font-style-normal);
  --ac-type-card-price-letter-spacing: 0.025em;
  --ac-type-card-price-line-height: 1;

  /*
    Promo / paragraph body in mega nav
    Figma: Barlow Medium 18
  */
  --ac-type-promo-body-family: var(--ac-font-ui);
  --ac-type-promo-body-size: 18px;
  --ac-type-promo-body-weight: var(--ac-font-weight-medium);
  --ac-type-promo-body-style: var(--ac-font-style-normal);
  --ac-type-promo-body-letter-spacing: 0;
  --ac-type-promo-body-line-height: 1.35;

  /*
    Header CTA button
    Figma: Futura PT Condensed Extra Bold Italic 18
  */
  --ac-type-header-button-family: var(--ac-font-display);
  --ac-type-header-button-size: 18px;
  --ac-type-header-button-weight: var(--ac-font-weight-heavy);
  --ac-type-header-button-style: var(--ac-font-style-display);
  --ac-type-header-button-letter-spacing: 0;
  --ac-type-header-button-line-height: 1;

  /*
    Segment name and category title
    Figma: Futura PT Condensed Extra Bold Italic 30
  */
  --ac-type-segment-title-family: var(--ac-font-display);
  --ac-type-segment-title-size: 30px;
  --ac-type-segment-title-weight: var(--ac-font-weight-heavy);
  --ac-type-segment-title-style: var(--ac-font-style-display);
  --ac-type-segment-title-letter-spacing: 0;
  --ac-type-segment-title-line-height: 1;

  --ac-type-category-title-family: var(--ac-font-display);
  --ac-type-category-title-size: 30px;
  --ac-type-category-title-weight: var(--ac-font-weight-heavy);
  --ac-type-category-title-style: var(--ac-font-style-display);
  --ac-type-category-title-letter-spacing: 0;
  --ac-type-category-title-line-height: 1;

  /*
    2027 Model Lineup
    Figma: Futura PT Condensed Extra Bold Italic 40
  */
  --ac-type-lineup-heading-family: var(--ac-font-display);
  --ac-type-lineup-heading-size: 40px;
  --ac-type-lineup-heading-weight: var(--ac-font-weight-heavy);
  --ac-type-lineup-heading-style: var(--ac-font-style-display);
  --ac-type-lineup-heading-letter-spacing: 0;
  --ac-type-lineup-heading-line-height: 1;

  /*
    Promo headline
    Figma: Futura PT Condensed Extra Bold Italic 80
  */
  --ac-type-promo-heading-family: var(--ac-font-display);
  --ac-type-promo-heading-size: 80px;
  --ac-type-promo-heading-weight: var(--ac-font-weight-heavy);
  --ac-type-promo-heading-style: var(--ac-font-style-display);
  --ac-type-promo-heading-letter-spacing: 0;
  --ac-type-promo-heading-line-height: 1;

  /* ==========================================================================
     Layout
     ========================================================================== */
  --ac-content-width-reading: 760px;
  --ac-content-width-narrow: 1006px;
  
  --ac-container: 1440px;
  --ac-container-narrow: 1120px;
  --ac-container-wide: 1600px;
  --ac-container-padding: clamp(1rem, 2vw, 2rem);

  --ac-section-padding-sm: clamp(2rem, 4vw, 3.5rem);
  --ac-section-padding-md: clamp(3rem, 6vw, 5rem);
  --ac-section-padding-lg: clamp(4rem, 8vw, 7rem);

  /* Spacing */
  --ac-space-1: 0.25rem;
  --ac-space-2: 0.5rem;
  --ac-space-3: 0.75rem;
  --ac-space-4: 1rem;
  --ac-space-5: 1.25rem;
  --ac-space-6: 1.5rem;
  --ac-space-8: 2rem;
  --ac-space-10: 2.5rem;
  --ac-space-12: 3rem;
  --ac-space-16: 4rem;

  /* Radius */
  --ac-radius-sm: 2px;
  --ac-radius-md: 4px;
  --ac-radius-lg: 8px;
  --ac-radius-xl: 16px;
  --ac-radius-pill: 999px;

  /* Shadows */
  --ac-shadow-sm: 0 4px 14px rgba(0, 0, 0, 0.08);
  --ac-shadow-md: 0 12px 32px rgba(0, 0, 0, 0.12);
  --ac-shadow-lg: 0 28px 80px rgba(0, 0, 0, 0.42);

  /* ==========================================================================
     Motion
     ========================================================================== */
  --ac-motion-instant: 80ms;
  --ac-motion-fast: 120ms;
  --ac-motion-standard: 180ms;
  --ac-motion-medium: 240ms;
  --ac-motion-slow: 320ms;

  --ac-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ac-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ac-ease-in: cubic-bezier(0.32, 0, 0.67, 0);

  --ac-lift-xs: translateY(-1px);
  --ac-lift-sm: translateY(-2px);
  --ac-press-sm: translateY(1px) scale(0.985);

  --ac-reveal-distance: 12px;
  --ac-panel-distance: 6px;
  --ac-image-hover-scale: 1.025;

  /* Legacy aliases retained while existing modules are tokenized. */
  --ac-duration-fast: var(--ac-motion-fast);
  --ac-duration-base: var(--ac-motion-standard);
  --ac-duration-slow: var(--ac-motion-slow);
  --ac-ease: var(--ac-ease-standard);

  /* Z-index */
  --ac-z-header: 1000;
  --ac-z-drawer: 5000;
  --ac-z-modal: 9000;
  --ac-z-toast: 10000;

  /* Header / scroll */
  --ac-header-height: 58px;
  --ac-header-promo-height: 26px;
  --ac-header-utility-height: 28px;
  --ac-header-bg: #050505;
  --ac-header-utility-bg: #202020;
  --ac-header-promo-bg: #66BC29;
  --ac-header-text: var(--ac-color-white);
  --ac-header-muted: rgba(255, 255, 255, 0.72);
  --ac-header-offset: var(--ac-header-height);
  --ac-content-min-height: calc(100svh - var(--ac-header-offset));
  --ac-scroll-offset: var(--ac-header-offset);

  /* Buttons */
  --ac-button-radius: 0px;
  --ac-button-skew: 10deg;
  --ac-button-padding-y: 0.75rem;
  --ac-button-padding-x: 1rem;
  --ac-button-text-transform: uppercase;
  --ac-button-letter-spacing: 0;
  --ac-uppercase-text-transform: uppercase;
  --ac-uppercase-letter-spacing: 0;
  --ac-ui-text-transform: uppercase;
  --ac-ui-letter-spacing: 0;
  --ac-display-text-transform: uppercase;
  --ac-display-letter-spacing: 0;
  /* CTA compatibility tokens.
     Retained until shared CTA/button consumers outside this review scope are audited. */
  --ac-cta-min-height: 38px;
  --ac-cta-padding-y: 0.52rem;
  --ac-cta-padding-x: 1.25rem;
  --ac-cta-width: auto;
  --ac-button-accent-bg: var(--ac-accent, #66bc29);
  --ac-button-accent-text: var(--ac-color-black, #111111);
  --ac-button-accent-hover-bg: var(--ac-accent-hover, #7bdc33);
  --ac-button-accent-hover-text: var(--ac-color-black, #111111);

  /* Mega nav */
  --ac-mega-surface-bg: #202020;
  --ac-mega-surface-muted-bg: #303030;

  /* Focus */
  --ac-focus-ring: 2px solid var(--ac-accent);
  --ac-focus-offset: 3px;
  --ac-focus-shadow: 0 0 0 3px color-mix(in srgb, var(--ac-accent) 28%, transparent);

  /* ==========================================================================
     Forms

     Additive semantic contract shared by HubSpot-rendered forms and custom
     application modules. App markup and behavior remain app-owned.
     ========================================================================== */

  --ac-form-field-gap: var(--ac-space-6);

  --ac-form-label-font-family: var(--ac-type-ui-01-family);
  --ac-form-label-font-size: var(--ac-type-ui-01-size);
  --ac-form-label-font-style: var(--ac-type-ui-01-style);
  --ac-form-label-font-weight: var(--ac-type-ui-01-weight);
  --ac-form-label-line-height: var(--ac-type-ui-01-line-height);
  --ac-form-label-letter-spacing: var(--ac-type-ui-01-letter-spacing);
  --ac-form-label-text-transform: var(--ac-ui-text-transform);
  --ac-form-label-color: var(--ac-text);
  --ac-form-label-gap: var(--ac-space-2);

  --ac-form-hint-font-family: var(--ac-type-ui-02-family);
  --ac-form-hint-font-size: var(--ac-type-ui-02-size);
  --ac-form-hint-font-style: var(--ac-type-ui-02-style);
  --ac-form-hint-font-weight: var(--ac-type-ui-02-weight);
  --ac-form-hint-line-height: var(--ac-type-ui-02-line-height);
  --ac-form-hint-color: var(--ac-text-muted);
  --ac-form-hint-gap: var(--ac-space-2);

  --ac-form-error-font-family: var(--ac-type-ui-02-family);
  --ac-form-error-font-size: var(--ac-type-ui-02-size);
  --ac-form-error-font-style: var(--ac-type-ui-02-style);
  --ac-form-error-font-weight: var(--ac-type-ui-02-weight);
  --ac-form-error-line-height: var(--ac-type-ui-02-line-height);
  --ac-form-error-color: var(--ac-danger);
  --ac-form-error-gap: var(--ac-space-2);

  --ac-form-control-height: 3.5rem;
  --ac-form-control-min-height: var(--ac-form-control-height);
  --ac-form-control-min-height-lg: 3.75rem;
  --ac-form-control-padding-x: var(--ac-space-4);
  --ac-form-control-padding-y: var(--ac-space-3);
  --ac-form-control-padding-x-lg: var(--ac-space-5);
  --ac-form-control-padding-y-lg: var(--ac-space-4);
  --ac-form-control-font-family: var(--ac-type-body-04-family);
  --ac-form-control-font-size: max(16px, var(--ac-type-body-04-size));
  --ac-form-control-font-style: var(--ac-type-body-04-style);
  --ac-form-control-font-weight: var(--ac-type-body-04-weight);
  --ac-form-control-line-height: var(--ac-type-body-04-line-height);

  --ac-form-control-bg: var(--ac-surface);
  --ac-form-control-text: var(--ac-text);
  --ac-form-control-placeholder: var(--ac-text-muted);
  --ac-form-control-border-width: 1px;
  --ac-form-control-border-color: var(--ac-border-strong);
  --ac-form-control-radius: var(--ac-radius-sm);
  --ac-form-control-shadow: none;

  --ac-form-control-bg-hover: var(--ac-surface);
  --ac-form-control-text-hover: var(--ac-text);
  --ac-form-control-border-color-hover: var(--ac-color-gray-600);
  --ac-form-control-hover-shadow: none;

  --ac-form-control-bg-focus: var(--ac-surface);
  --ac-form-control-text-focus: var(--ac-text);
  --ac-form-control-border-color-focus: var(--ac-accent);
  --ac-form-control-focus-ring: var(--ac-focus-ring);
  --ac-form-control-focus-offset: var(--ac-focus-offset);
  --ac-form-control-focus-shadow: var(--ac-focus-shadow);

  --ac-form-control-bg-invalid: var(--ac-surface);
  --ac-form-control-text-invalid: var(--ac-text);
  --ac-form-control-border-color-invalid: var(--ac-danger);
  --ac-form-control-invalid-shadow: none;
  --ac-form-control-border-color-invalid-hover: var(--ac-danger);
  --ac-form-control-invalid-hover-shadow: none;
  --ac-form-control-border-color-invalid-focus: var(--ac-danger);
  --ac-form-control-invalid-focus-ring: 2px solid var(--ac-danger);
  --ac-form-control-invalid-focus-offset: var(--ac-focus-offset);
  --ac-form-control-invalid-focus-shadow:
    0 0 0 3px color-mix(in srgb, var(--ac-danger) 24%, transparent);

  --ac-form-control-bg-disabled: var(--ac-surface-muted);
  --ac-form-control-text-disabled: var(--ac-text-muted);
  --ac-form-control-border-color-disabled: var(--ac-border);
  --ac-form-control-disabled-opacity: 0.72;
  --ac-form-control-disabled-cursor: not-allowed;

  --ac-form-control-bg-readonly: var(--ac-surface-soft);
  --ac-form-control-text-readonly: var(--ac-text);
  --ac-form-control-border-color-readonly: var(--ac-border);

  --ac-form-affix-color: var(--ac-text-muted);
  --ac-form-affix-gap: var(--ac-space-2);
  --ac-form-affix-padding-x: var(--ac-form-control-padding-x);

  --ac-form-control-motion-duration: var(--ac-motion-fast);
  --ac-form-control-motion-easing: var(--ac-ease-out);

  /* Component aliases for current prototype compatibility */
  /* Legacy compatibility aliases.
     Retained temporarily for older custom components and embedded apps.
     Audit repository usage before removing these aliases. */
  --proto-surface: var(--ac-surface);
  --proto-surface-muted: var(--ac-surface-muted);
  --proto-surface-strong: var(--ac-surface-strong);
  --proto-soft: var(--ac-surface-soft);
  --proto-text: var(--ac-text);
  --proto-muted: var(--ac-text-muted);
  --proto-border: var(--ac-border);
  --proto-border-strong: var(--ac-border-strong);
  --proto-accent: var(--ac-accent);
  --proto-radius-md: var(--ac-radius-md);
  --proto-radius-lg: var(--ac-radius-lg);
  --proto-radius-xl: var(--ac-radius-xl);
}

@media (max-width: 767px) {
  :root {
    --ac-header-height: 60px;
    --ac-container-padding: 1rem;

    /* Responsive typography values adapted from the desktop Figma scale */
    --ac-type-display-01-size: 88px;
    --ac-type-display-01-line-height: 76px;
    --ac-type-display-02-size: 72px;
    --ac-type-display-02-line-height: 62px;
    --ac-type-display-03-size: 56px;
    --ac-type-display-03-line-height: 48px;

    --ac-type-heading-h1-size: 48px;
    --ac-type-heading-h1-line-height: 42px;
    --ac-type-heading-h2-size: 42px;
    --ac-type-heading-h2-line-height: 36px;
    --ac-type-heading-h3-size: 36px;
    --ac-type-heading-h3-line-height: 32px;
    --ac-type-heading-h4-size: 32px;
    --ac-type-heading-h4-line-height: 28px;
    --ac-type-heading-h5-size: 28px;
    --ac-type-heading-h5-line-height: 26px;
    --ac-type-heading-h6-size: 22px;
    --ac-type-heading-h6-line-height: 22px;
    --ac-type-heading-h7-size: 18px;
    --ac-type-heading-h7-line-height: 18px;

    --ac-type-body-01-size: 24px;
    --ac-type-body-01-line-height: 32px;
    --ac-type-body-02-size: 20px;
    --ac-type-body-02-line-height: 28px;
    --ac-type-body-03-size: 18px;
    --ac-type-body-03-line-height: 24px;
    --ac-type-body-04-size: 16px;
    --ac-type-body-04-line-height: 21px;
    --ac-type-body-05-size: 12px;
    --ac-type-body-05-line-height: 16px;

    --ac-type-ui-01-size: 16px;
    --ac-type-ui-01-line-height: 22px;
    --ac-type-ui-02-size: 14px;
    --ac-type-ui-02-line-height: 18px;
    --ac-type-ui-03-size: 11px;
    --ac-type-ui-03-line-height: 12px;

  }
}
/* ==========================================================================
   Arctic Cat Base
   Site-level primitives layered on top of reset/normalize.

   Typography architecture:
   - _tokens.css defines the Figma type system as CSS custom properties.
   - _base.css applies conservative defaults and exposes utility classes.
   - Components/modules should separate structure from typography by adding an
     .ac-type-* utility or by consuming the same --ac-type-* tokens locally.
   ========================================================================== */

html {
  scroll-padding-top: var(--ac-scroll-offset, 76px);
}

html.js {
  scroll-behavior: smooth;
}

body {
  background: var(--ac-surface);
  color: var(--ac-text);
  font-family: var(--ac-type-body-03-family, var(--ac-font-body));
  font-size: var(--ac-type-body-03-size, 18px);
  font-style: var(--ac-type-body-03-style, normal);
  font-weight: var(--ac-type-body-03-weight, 500);
  line-height: var(--ac-type-body-03-line-height, 24px);
  letter-spacing: var(--ac-type-body-03-letter-spacing, 0);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Page shell */

.ac-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--ac-surface);
}

.ac-main {
  flex: 1 1 auto;
}

/* Containers */

.ac-container {
  width: min(var(--ac-container), calc(100% - (var(--ac-container-padding) * 2)));
  margin-inline: auto;
}

.ac-container--narrow {
  width: min(var(--ac-container-narrow), calc(100% - (var(--ac-container-padding) * 2)));
  margin-inline: auto;
}

.ac-container--wide {
  width: min(var(--ac-container-wide), calc(100% - (var(--ac-container-padding) * 2)));
  margin-inline: auto;
}

/* Sections */

.ac-section {
  padding-block: var(--ac-section-padding-md);
}

.ac-section--sm {
  padding-block: var(--ac-section-padding-sm);
}

.ac-section--lg {
  padding-block: var(--ac-section-padding-lg);
}

/* Media */

img,
svg,
video,
canvas {
  max-width: 100%;
}

img,
video {
  height: auto;
}

img {
  display: block;
}

/* Interactive elements */

a {
  color: inherit;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

button:disabled,
[aria-disabled="true"] {
  cursor: not-allowed;
}

:focus {
  outline-color: var(--ac-accent);
}

:focus-visible {
  outline: var(--ac-focus-ring);
  outline-offset: var(--ac-focus-offset);
}

/* ==========================================================================
   Native text defaults
   ========================================================================== */

h1,
.h1 {
  font-family: var(--ac-type-heading-h1-family);
  font-size: var(--ac-type-heading-h1-size);
  font-style: var(--ac-type-heading-h1-style);
  font-weight: var(--ac-type-heading-h1-weight);
  line-height: var(--ac-type-heading-h1-line-height);
  letter-spacing: var(--ac-type-heading-h1-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h2,
.h2 {
  font-family: var(--ac-type-heading-h2-family);
  font-size: var(--ac-type-heading-h2-size);
  font-style: var(--ac-type-heading-h2-style);
  font-weight: var(--ac-type-heading-h2-weight);
  line-height: var(--ac-type-heading-h2-line-height);
  letter-spacing: var(--ac-type-heading-h2-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h3,
.h3 {
  font-family: var(--ac-type-heading-h3-family);
  font-size: var(--ac-type-heading-h3-size);
  font-style: var(--ac-type-heading-h3-style);
  font-weight: var(--ac-type-heading-h3-weight);
  line-height: var(--ac-type-heading-h3-line-height);
  letter-spacing: var(--ac-type-heading-h3-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h4,
.h4 {
  font-family: var(--ac-type-heading-h4-family);
  font-size: var(--ac-type-heading-h4-size);
  font-style: var(--ac-type-heading-h4-style);
  font-weight: var(--ac-type-heading-h4-weight);
  line-height: var(--ac-type-heading-h4-line-height);
  letter-spacing: var(--ac-type-heading-h4-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h5,
.h5 {
  font-family: var(--ac-type-heading-h5-family);
  font-size: var(--ac-type-heading-h5-size);
  font-style: var(--ac-type-heading-h5-style);
  font-weight: var(--ac-type-heading-h5-weight);
  line-height: var(--ac-type-heading-h5-line-height);
  letter-spacing: var(--ac-type-heading-h5-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h6,
.h6 {
  font-family: var(--ac-type-heading-h6-family);
  font-size: var(--ac-type-heading-h6-size);
  font-style: var(--ac-type-heading-h6-style);
  font-weight: var(--ac-type-heading-h6-weight);
  line-height: var(--ac-type-heading-h6-line-height);
  letter-spacing: var(--ac-type-heading-h6-letter-spacing);
  text-transform: var(--ac-display-text-transform, uppercase);
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin-block-start: 0;
}

/* ==========================================================================
   Type utility classes
   - Available to HubSpot modules, builder-authored markup, and React islands.
   ========================================================================== */

.ac-type-display-01,
.ac-type-display-02,
.ac-type-display-03,
.ac-type-heading-h1,
.ac-type-heading-h2,
.ac-type-heading-h3,
.ac-type-heading-h4,
.ac-type-heading-h5,
.ac-type-heading-h6,
.ac-type-heading-h7,
.ac-heading {
  text-transform: var(--ac-display-text-transform, uppercase);
  letter-spacing: var(--ac-display-letter-spacing, 0);
}

.ac-type-display-01 {
  font-family: var(--ac-type-display-01-family);
  font-size: var(--ac-type-display-01-size);
  font-style: var(--ac-type-display-01-style);
  font-weight: var(--ac-type-display-01-weight);
  line-height: var(--ac-type-display-01-line-height);
  letter-spacing: var(--ac-type-display-01-letter-spacing);
}

.ac-type-display-02 {
  font-family: var(--ac-type-display-02-family);
  font-size: var(--ac-type-display-02-size);
  font-style: var(--ac-type-display-02-style);
  font-weight: var(--ac-type-display-02-weight);
  line-height: var(--ac-type-display-02-line-height);
  letter-spacing: var(--ac-type-display-02-letter-spacing);
}

.ac-type-display-03 {
  font-family: var(--ac-type-display-03-family);
  font-size: var(--ac-type-display-03-size);
  font-style: var(--ac-type-display-03-style);
  font-weight: var(--ac-type-display-03-weight);
  line-height: var(--ac-type-display-03-line-height);
  letter-spacing: var(--ac-type-display-03-letter-spacing);
}

.ac-type-heading-h1 {
  font-family: var(--ac-type-heading-h1-family);
  font-size: var(--ac-type-heading-h1-size);
  font-style: var(--ac-type-heading-h1-style);
  font-weight: var(--ac-type-heading-h1-weight);
  line-height: var(--ac-type-heading-h1-line-height);
  letter-spacing: var(--ac-type-heading-h1-letter-spacing);
}

.ac-type-heading-h2 {
  font-family: var(--ac-type-heading-h2-family);
  font-size: var(--ac-type-heading-h2-size);
  font-style: var(--ac-type-heading-h2-style);
  font-weight: var(--ac-type-heading-h2-weight);
  line-height: var(--ac-type-heading-h2-line-height);
  letter-spacing: var(--ac-type-heading-h2-letter-spacing);
}

.ac-type-heading-h3 {
  font-family: var(--ac-type-heading-h3-family);
  font-size: var(--ac-type-heading-h3-size);
  font-style: var(--ac-type-heading-h3-style);
  font-weight: var(--ac-type-heading-h3-weight);
  line-height: var(--ac-type-heading-h3-line-height);
  letter-spacing: var(--ac-type-heading-h3-letter-spacing);
}

.ac-type-heading-h4 {
  font-family: var(--ac-type-heading-h4-family);
  font-size: var(--ac-type-heading-h4-size);
  font-style: var(--ac-type-heading-h4-style);
  font-weight: var(--ac-type-heading-h4-weight);
  line-height: var(--ac-type-heading-h4-line-height);
  letter-spacing: var(--ac-type-heading-h4-letter-spacing);
}

.ac-type-heading-h5 {
  font-family: var(--ac-type-heading-h5-family);
  font-size: var(--ac-type-heading-h5-size);
  font-style: var(--ac-type-heading-h5-style);
  font-weight: var(--ac-type-heading-h5-weight);
  line-height: var(--ac-type-heading-h5-line-height);
  letter-spacing: var(--ac-type-heading-h5-letter-spacing);
}

.ac-type-heading-h6 {
  font-family: var(--ac-type-heading-h6-family);
  font-size: var(--ac-type-heading-h6-size);
  font-style: var(--ac-type-heading-h6-style);
  font-weight: var(--ac-type-heading-h6-weight);
  line-height: var(--ac-type-heading-h6-line-height);
  letter-spacing: var(--ac-type-heading-h6-letter-spacing);
}

.ac-type-heading-h7 {
  font-family: var(--ac-type-heading-h7-family);
  font-size: var(--ac-type-heading-h7-size);
  font-style: var(--ac-type-heading-h7-style);
  font-weight: var(--ac-type-heading-h7-weight);
  line-height: var(--ac-type-heading-h7-line-height);
  letter-spacing: var(--ac-type-heading-h7-letter-spacing);
}

.ac-type-body-01 {
  font-family: var(--ac-type-body-01-family);
  font-size: var(--ac-type-body-01-size);
  font-style: var(--ac-type-body-01-style);
  font-weight: var(--ac-type-body-01-weight);
  line-height: var(--ac-type-body-01-line-height);
  letter-spacing: var(--ac-type-body-01-letter-spacing);
}

.ac-type-body-02 {
  font-family: var(--ac-type-body-02-family);
  font-size: var(--ac-type-body-02-size);
  font-style: var(--ac-type-body-02-style);
  font-weight: var(--ac-type-body-02-weight);
  line-height: var(--ac-type-body-02-line-height);
  letter-spacing: var(--ac-type-body-02-letter-spacing);
}

.ac-type-body-03 {
  font-family: var(--ac-type-body-03-family);
  font-size: var(--ac-type-body-03-size);
  font-style: var(--ac-type-body-03-style);
  font-weight: var(--ac-type-body-03-weight);
  line-height: var(--ac-type-body-03-line-height);
  letter-spacing: var(--ac-type-body-03-letter-spacing);
}

.ac-type-body-04 {
  font-family: var(--ac-type-body-04-family);
  font-size: var(--ac-type-body-04-size);
  font-style: var(--ac-type-body-04-style);
  font-weight: var(--ac-type-body-04-weight);
  line-height: var(--ac-type-body-04-line-height);
  letter-spacing: var(--ac-type-body-04-letter-spacing);
}

.ac-type-body-05 {
  font-family: var(--ac-type-body-05-family);
  font-size: var(--ac-type-body-05-size);
  font-style: var(--ac-type-body-05-style);
  font-weight: var(--ac-type-body-05-weight);
  line-height: var(--ac-type-body-05-line-height);
  letter-spacing: var(--ac-type-body-05-letter-spacing);
}

.ac-type-ui-01 {
  font-family: var(--ac-type-ui-01-family);
  font-size: var(--ac-type-ui-01-size);
  font-style: var(--ac-type-ui-01-style);
  font-weight: var(--ac-type-ui-01-weight);
  line-height: var(--ac-type-ui-01-line-height);
  letter-spacing: var(--ac-type-ui-01-letter-spacing);
  text-transform: var(--ac-ui-text-transform, uppercase);
}

.ac-type-ui-02 {
  font-family: var(--ac-type-ui-02-family);
  font-size: var(--ac-type-ui-02-size);
  font-style: var(--ac-type-ui-02-style);
  font-weight: var(--ac-type-ui-02-weight);
  line-height: var(--ac-type-ui-02-line-height);
  letter-spacing: var(--ac-type-ui-02-letter-spacing);
  text-transform: var(--ac-ui-text-transform, uppercase);
}

.ac-type-ui-03 {
  font-family: var(--ac-type-ui-03-family);
  font-size: var(--ac-type-ui-03-size);
  font-style: var(--ac-type-ui-03-style);
  font-weight: var(--ac-type-ui-03-weight);
  line-height: var(--ac-type-ui-03-line-height);
  letter-spacing: var(--ac-type-ui-03-letter-spacing);
  text-transform: var(--ac-ui-text-transform, uppercase);
}

/* Skip link */

.ac-skip-link {
  position: absolute;
  top: var(--ac-space-3);
  left: var(--ac-space-3);
  z-index: var(--ac-z-toast);
  transform: translateY(-150%);
  padding: 0.75rem 1rem;
  border-radius: var(--ac-radius-sm);
  background: var(--ac-surface-strong);
  color: var(--ac-text-inverse);
  font-family: var(--ac-type-ui-01-family);
  font-style: var(--ac-type-ui-01-style);
  font-size: var(--ac-type-ui-01-size);
  font-weight: var(--ac-type-ui-01-weight);
  letter-spacing: var(--ac-type-ui-01-letter-spacing);
  line-height: var(--ac-type-ui-01-line-height);
  text-decoration: none;
  text-transform: var(--ac-ui-text-transform, uppercase);
}

.ac-skip-link:focus,
.ac-skip-link:focus-visible {
  transform: translateY(0);
}

/* Accessible hiding */

.ac-sr-only,
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  clip: rect(0, 0, 0, 0);
}

.ac-sr-only-focusable:active,
.ac-sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  white-space: normal;
  clip: auto;
}

/* Common text helpers */

.ac-eyebrow {
  margin: 0 0 var(--ac-space-3);
  color: var(--ac-text-muted);
  font-family: var(--ac-type-ui-02-family);
  font-style: var(--ac-type-ui-02-style);
  font-size: var(--ac-type-ui-02-size);
  font-weight: var(--ac-type-ui-02-weight);
  letter-spacing: var(--ac-type-ui-02-letter-spacing);
  line-height: var(--ac-type-ui-02-line-height);
  text-transform: var(--ac-display-text-transform, uppercase);
}

.ac-heading {
  margin: 0;
  color: var(--ac-text);
  font-family: var(--ac-type-heading-h2-family);
  font-style: var(--ac-type-heading-h2-style);
  font-size: var(--ac-type-heading-h2-size);
  font-weight: var(--ac-type-heading-h2-weight);
  letter-spacing: var(--ac-type-heading-h2-letter-spacing);
  line-height: var(--ac-type-heading-h2-line-height);
}

.ac-heading--xl {
  font-family: var(--ac-type-display-03-family);
  font-size: var(--ac-type-display-03-size);
  font-style: var(--ac-type-display-03-style);
  font-weight: var(--ac-type-display-03-weight);
  line-height: var(--ac-type-display-03-line-height);
}

.ac-heading--lg {
  font-family: var(--ac-type-heading-h1-family);
  font-size: var(--ac-type-heading-h1-size);
  font-style: var(--ac-type-heading-h1-style);
  font-weight: var(--ac-type-heading-h1-weight);
  line-height: var(--ac-type-heading-h1-line-height);
}

.ac-heading--md {
  font-family: var(--ac-type-heading-h2-family);
  font-size: var(--ac-type-heading-h2-size);
  font-style: var(--ac-type-heading-h2-style);
  font-weight: var(--ac-type-heading-h2-weight);
  line-height: var(--ac-type-heading-h2-line-height);
}

.ac-heading--sm {
  font-family: var(--ac-type-heading-h4-family);
  font-size: var(--ac-type-heading-h4-size);
  font-style: var(--ac-type-heading-h4-style);
  font-weight: var(--ac-type-heading-h4-weight);
  line-height: var(--ac-type-heading-h4-line-height);
}

.ac-kicker {
  color: var(--ac-accent);
}

/* Surface helpers */

.ac-surface-muted {
  background: var(--ac-surface-muted);
}

.ac-surface-strong {
  background: var(--ac-surface-strong);
  color: var(--ac-text-inverse);
}

/* State helpers */

.ac-is-hidden {
  display: none !important;
}

.ac-no-scroll {
  overflow: hidden;
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  html.js {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}

.ac-icon {
  display: block;
  width: var(--ac-icon-size, 1em);
  height: var(--ac-icon-size, 1em);
  flex: 0 0 auto;
  color: currentColor;
}

/* HubSpot/DND compatibility */


/* CSS variables */

:root {
  --column-gap: 2.13%;
  --column-width-multiplier: 8.333;
}

/* Mobile layout */

.row-fluid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}


  .row-fluid .span1,
  .row-fluid .span2,
  .row-fluid .span3,
  .row-fluid .span4,
  .row-fluid .span5,
  .row-fluid .span6,
  .row-fluid .span7,
  .row-fluid .span8,
  .row-fluid .span9,
  .row-fluid .span10,
  .row-fluid .span11,
  .row-fluid .span12{
  min-height: 1px;
  width: 100%;
}

/* Desktop layout */

@media (min-width: 768px) {
  .row-fluid {
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  
    .row-fluid .span1 {
      width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span2 {
      width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span3 {
      width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span4 {
      width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span5 {
      width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span6 {
      width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span7 {
      width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span8 {
      width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span9 {
      width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span10 {
      width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span11 {
      width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
    }
  
}
.content-wrapper {
  margin: 0 auto;
  padding: 0 1rem;
}

@media screen and (min-width: 1380px) {
  .content-wrapper {
    padding: 0;
  }
}

.dnd-section > .row-fluid {
  margin: 0 auto;
}

.dnd-section .dnd-column {
  padding: 0 1rem;
}

@media (max-width: 767px) {
  .dnd-section .dnd-column {
    padding: 0;
  }
}
/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
/* ==========================================================================
   Arctic Cat Module Layout
   Shared structural primitives for authored modules.

   These classes intentionally expose a small set of named layout decisions.
   Module fields should select presets rather than emit arbitrary dimensions.
   ========================================================================== */

.ac-module {
  position: relative;
}

.ac-module__inner {
  width: min(var(--ac-module-max-width, var(--ac-container)), calc(100% - (var(--ac-container-padding) * 2)));
  margin-inline: auto;
}

.ac-module--width-reading {
  --ac-module-max-width: var(--ac-content-width-reading);
}

.ac-module--width-narrow {
  --ac-module-max-width: var(--ac-content-width-narrow);
}

.ac-module--width-standard {
  --ac-module-max-width: var(--ac-container);
}

.ac-module--width-wide {
  --ac-module-max-width: var(--ac-container-wide);
}

.ac-module--width-full .ac-module__inner {
  width: 100%;
  max-width: none;
}

.ac-module--align-left .ac-module__inner {
  margin-left: var(--ac-container-padding);
  margin-right: auto;
}

.ac-module--align-center .ac-module__inner {
  margin-inline: auto;
}

.ac-module--align-right .ac-module__inner {
  margin-left: auto;
  margin-right: var(--ac-container-padding);
}

.ac-module--text-left {
  text-align: left;
}

.ac-module--text-center {
  text-align: center;
}

.ac-module--text-right {
  text-align: right;
}

@media (max-width: 639px) {
  .ac-module--align-left .ac-module__inner,
  .ac-module--align-right .ac-module__inner {
    margin-inline: auto;
  }
}

/* Modules participate in the HubSpot DnD grid.
   The assigned DnD cell owns placement; module widths are max-width constraints. */
.ac-module {
  width: 100%;
  min-width: 0;
}

.ac-module__inner {
  max-width: 100%;
  min-width: 0;
}

.ac-module__panel {
  width: 100%;
  min-width: 0;
}


/* Elements */
/* ==========================================================================
   Base Typography Defaults

   Purpose:
   - Provide safe defaults for raw HTML and HubSpot rich text output.
   - Do not define Arctic Cat brand typography here.
   - Brand/component typography lives in:
     css/ac/_tokens.css
     css/ac/_base.css
     component/module CSS
   ========================================================================== */

/* Prevent long words/URLs from breaking responsive layouts. */

body {
  overflow-wrap: break-word;
}

/* Language-specific word breaking for CJK content. */

html[lang^="ja"] body,
html[lang^="zh"] body,
html[lang^="ko"] body {
  line-break: strict;
  overflow-wrap: normal;
  word-break: break-all;
}

/* Paragraphs */

p {
  margin: 0 0 1rem;
}

/* Anchors */

a {
  cursor: pointer;
}

/* Headings
   Keep these generic. Arctic Cat display headings should use classes/tokens. */

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 0.75em;
}

/* Avoid adding default bottom margins inside explicitly managed components. */

.ac-header h1,
.ac-header h2,
.ac-header h3,
.ac-header h4,
.ac-header h5,
.ac-header h6,
.ac-segment-nav h1,
.ac-segment-nav h2,
.ac-segment-nav h3,
.ac-segment-nav h4,
.ac-segment-nav h5,
.ac-segment-nav h6,
.ac-section h1,
.ac-section h2,
.ac-section h3,
.ac-section h4,
.ac-section h5,
.ac-section h6 {
  margin: 0;
}

/* Lists */

ul,
ol {
  margin: 0 0 1rem;
}

ul ul,
ol ul,
ul ol,
ol ol {
  margin: 0;
}

ul.no-list {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Code blocks */

pre {
  overflow: auto;
}

code {
  vertical-align: bottom;
}

/* Blockquotes */

blockquote {
  border-left: 2px solid;
  margin: 0 0 1rem;
  padding-left: 0.7rem;
}

/* Horizontal rules */

hr {
  border: none;
  border-bottom: 1px solid #ccc;
}

/* Image alt text */

img {
  font-size: 0.583rem;
  word-break: normal;
}
/* ==========================================================================
   Buttons

   Button ownership:
   - Native <button> reset behavior lives in ac/_base.css.
   - .button and .hs-button support HubSpot boilerplate/marketing content.
   - .ac-button is the Arctic Cat design-system button primitive.
   - App/module buttons should either use .ac-button intentionally or style their
     own component classes.
   ========================================================================== */

.button,
.hs-button {
  cursor: pointer;
  display: inline-block;
  text-align: center;
  text-decoration: none;
  transition:
    background-color var(--ac-motion-fast) var(--ac-ease-out),
    border-color var(--ac-motion-fast) var(--ac-ease-out),
    color var(--ac-motion-fast) var(--ac-ease-out),
    transform var(--ac-motion-standard) var(--ac-ease-out);
  white-space: normal;
}

.button:active,
.hs-button:active {
  transform: var(--ac-press-sm, translateY(1px) scale(0.985));
}

.button:focus-visible,
.hs-button:focus-visible {
  outline: var(--ac-focus-ring);
  outline-offset: var(--ac-focus-offset);
}

.button:disabled,
.button[aria-disabled="true"],
.hs-button:disabled,
.hs-button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

/* Arctic Cat button primitive */

.ac-button {
  appearance: none;
  -webkit-appearance: none;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: var(--ac-button-padding-y, 0.75rem) var(--ac-button-padding-x, 1rem);
  border: 1px solid var(--ac-surface-strong, #111111);
  border-radius: var(--ac-button-radius, var(--ac-radius-pill, 999px));
  background: var(--ac-surface-strong, #111111);
  color: var(--ac-text-inverse, #ffffff);
  cursor: pointer;
  font-family: var(--ac-type-header-button-family, var(--ac-font-display));
  font-size: var(--ac-type-header-button-size, 18px);
  font-style: var(--ac-type-header-button-style, italic);
  font-weight: var(--ac-type-header-button-weight, 800);
  letter-spacing: var(--ac-type-header-button-letter-spacing, 0.045em);
  line-height: var(--ac-type-header-button-line-height, 1);
  text-align: center;
  text-decoration: none;
  text-transform: var(--ac-button-text-transform, uppercase);
  transition:
    background-color var(--ac-motion-fast) var(--ac-ease-out),
    border-color var(--ac-motion-fast) var(--ac-ease-out),
    color var(--ac-motion-fast) var(--ac-ease-out),
    transform var(--ac-motion-standard) var(--ac-ease-out);
  position: relative;
}


.ac-button:hover,
.ac-button:focus-visible {
  color: var(--ac-text-inverse, #ffffff);
  text-decoration: none;
}

.ac-button:focus-visible {
  outline: var(--ac-focus-ring);
  outline-offset: var(--ac-focus-offset);
}

.ac-button:active {
  transform: var(--ac-press-sm, translateY(1px) scale(0.985));
}

.ac-button:disabled,
.ac-button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

.ac-button--secondary {
  background: transparent;
  color: var(--ac-text, #111111);
}

.ac-button--secondary:hover,
.ac-button--secondary:focus-visible {
  color: var(--ac-text, #111111);
}

.ac-button--dark {
  border-color: var(--ac-color-black, #111111);
  background: var(--ac-color-black, #111111);
  color: var(--ac-color-white, #ffffff);
}

.ac-button--dark:hover,
.ac-button--dark:focus-visible {
  border-color: var(--ac-color-gray-800, #2b2b2b);
  background: var(--ac-color-gray-800, #2b2b2b);
  color: var(--ac-color-white, #ffffff);
}

.ac-button--white {
  border-color: var(--ac-color-white, #ffffff);
  background: var(--ac-color-white, #ffffff);
  color: var(--ac-color-black, #111111);
}

.ac-button--white:hover,
.ac-button--white:focus-visible {
  border-color: var(--ac-color-gray-100, #f4f4f2);
  background: var(--ac-color-gray-100, #f4f4f2);
  color: var(--ac-color-black, #111111);
}

.ac-button--outline {
  border-color: var(--ac-border-strong, rgba(17, 17, 17, 0.35));
  background: transparent;
  color: var(--ac-text, #111111);
}

.ac-button--outline:hover,
.ac-button--outline:focus-visible {
  border-color: var(--ac-accent, #66bc29);
  color: var(--ac-accent-hover, #7bdc33);
}

.ac-button--ghost {
  border-color: transparent;
  background: rgba(255, 255, 255, 0.10);
  color: inherit;
}

.ac-button--ghost:hover,
.ac-button--ghost:focus-visible {
  border-color: var(--ac-border-inverse-strong, rgba(255, 255, 255, 0.22));
  background: rgba(255, 255, 255, 0.16);
  color: inherit;
}

.ac-button--accent {
  border-color: var(--ac-button-accent-bg, var(--ac-accent, #66bc29));
  background: var(--ac-button-accent-bg, var(--ac-accent, #66bc29));
  color: var(--ac-button-accent-text, var(--ac-color-black, #111111));
}

.ac-button--accent:hover,
.ac-button--accent:focus-visible {
  border-color: var(--ac-button-accent-hover-bg, var(--ac-accent-hover, #7bdc33));
  background: var(--ac-button-accent-hover-bg, var(--ac-accent-hover, #7bdc33));
  color: var(--ac-button-accent-hover-text, var(--ac-color-black, #111111));
}

.ac-button--outline-inverse {
  background: transparent;
  border-width: 2px;
  border-color: var(--ac-text-inverse, #ffffff);
  color: var(--ac-text-inverse, #ffffff);
}

.ac-button--outline-inverse:hover,
.ac-button--outline-inverse:focus-visible {
  border-color: var(--ac-accent, #66bc29);
  color: var(--ac-accent, #66bc29);
}


.ac-button--text {
  min-height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ac-text, #111111);
  text-decoration: underline;
  text-underline-offset: 0.18em;
  
}

.ac-button--text:hover,
.ac-button--text:focus-visible {
  color: var(--ac-text, #111111);
}

/* Optional angled treatment.
   Wrap label text in <span> so the text itself remains unskewed.
*/

.ac-button--angled {
  border-radius: var(--ac-button-radius, 0);
  transform: skewX(calc(var(--ac-button-skew, 10deg) * -1));
}

.ac-button--angled:hover,
.ac-button--angled:focus-visible {
  transform: skewX(calc(var(--ac-button-skew, 10deg) * -1)) var(--ac-lift-xs, translateY(-1px));
}

.ac-button--angled > span {
  display: inline-block;
  transform: skewX(var(--ac-button-skew, 10deg));
  pointer-events: none;
}

.ac-button--angled:active {
  transform: skewX(calc(var(--ac-button-skew, 10deg) * -1)) var(--ac-press-sm, translateY(1px) scale(0.985));
}

/* No-button reset for accessible buttons that should look like plain content. */

.no-button,
.no-button:hover,
.no-button:focus,
.no-button:focus-visible,
.no-button:active {
  appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0;
  text-align: inherit;
  text-decoration: none;
  text-transform: inherit;
  transition: none;
}


.ac-uppercase {
  text-transform: var(--ac-uppercase-text-transform, uppercase);
  letter-spacing: var(--ac-uppercase-letter-spacing, 0);
}
/* ==========================================================================
   Forms

   HubSpot marketing-form element defaults only.

   Custom application UI, React islands, header search, dealer locator, and
   custom lookup forms should own their form styles locally. Avoid broad
   native form selectors here.
   ========================================================================== */

/* Scheme mappings

   The token contract is intentionally separate from native control selectors.
   Custom applications opt into these values and retain ownership of markup.
*/

:where(.ac-form-scheme--dark, [data-ac-form-scheme='dark']) {
  --ac-form-label-color: var(--ac-text-inverse);
  --ac-form-hint-color: var(--ac-text-inverse-muted);
  --ac-form-error-color: var(--ac-danger-inverse);

  --ac-form-control-bg: var(--ac-dark-surface-card);
  --ac-form-control-text: var(--ac-text-inverse);
  --ac-form-control-placeholder: var(--ac-text-inverse-muted);
  --ac-form-control-border-color: var(--ac-border-inverse);
  --ac-form-control-bg-hover: var(--ac-dark-surface-card);
  --ac-form-control-text-hover: var(--ac-text-inverse);
  --ac-form-control-border-color-hover: var(--ac-border-inverse-strong);
  --ac-form-control-bg-focus: var(--ac-dark-surface-card);
  --ac-form-control-text-focus: var(--ac-text-inverse);
  --ac-form-control-bg-invalid: var(--ac-dark-surface-card);
  --ac-form-control-text-invalid: var(--ac-text-inverse);
  --ac-form-control-border-color-invalid: var(--ac-danger-inverse);
  --ac-form-control-border-color-invalid-hover: var(--ac-danger-inverse);
  --ac-form-control-border-color-invalid-focus: var(--ac-danger-inverse);
  --ac-form-control-invalid-focus-ring: 2px solid var(--ac-danger-inverse);
  --ac-form-control-bg-disabled: var(--ac-dark-surface);
  --ac-form-control-text-disabled: var(--ac-text-inverse-muted);
  --ac-form-control-border-color-disabled: var(--ac-border-inverse);
  --ac-form-control-bg-readonly: var(--ac-dark-surface);
  --ac-form-control-text-readonly: var(--ac-text-inverse);
  --ac-form-control-border-color-readonly: var(--ac-border-inverse);
  --ac-form-affix-color: var(--ac-text-inverse-muted);
}

/* Form fields */

.hs-form-field,
.hs_cos_wrapper_type_form .hs-form-field {
  margin-bottom: var(--ac-form-field-gap, 1.5rem);
}

/* Labels */

.hs-form label,
.password-prompt form label,
.hs_cos_wrapper_type_form form label {
  display: block;
  margin-bottom: var(--ac-form-label-gap, 0.5rem);
  color: var(--ac-form-label-color, var(--ac-text));
  font-family: var(--ac-form-label-font-family, var(--ac-font-body));
  font-size: var(--ac-form-label-font-size, 0.875rem);
  font-style: var(--ac-form-label-font-style, normal);
  font-weight: var(--ac-form-label-font-weight, 700);
  letter-spacing: var(--ac-form-label-letter-spacing, 0.08em);
  line-height: var(--ac-form-label-line-height, 1.25);
  text-transform: var(--ac-form-label-text-transform, uppercase);
}

/* Form title */

.form-title {
  margin-bottom: 0;
}

/* Help text */

.hs-form legend,
.hs_cos_wrapper_type_form form legend {
  margin-bottom: var(--ac-form-hint-gap, 0.5rem);
  color: var(--ac-form-hint-color, var(--ac-text-muted));
  font-family: var(--ac-form-hint-font-family, var(--ac-font-body));
  font-size: var(--ac-form-hint-font-size, 0.875rem);
  font-style: var(--ac-form-hint-font-style, normal);
  font-weight: var(--ac-form-hint-font-weight, 400);
  line-height: var(--ac-form-hint-line-height, 1.45);
}

/* Inputs */

.hs-form input[type=text],
.hs-form input[type=search],
.hs-form input[type=email],
.hs-form input[type=password],
.hs-form input[type=tel],
.hs-form input[type=number],
.hs-form input[type=file],
.hs-form select,
.hs-form textarea,
.hs_cos_wrapper_type_form form input[type=text],
.hs_cos_wrapper_type_form form input[type=search],
.hs_cos_wrapper_type_form form input[type=email],
.hs_cos_wrapper_type_form form input[type=password],
.hs_cos_wrapper_type_form form input[type=tel],
.hs_cos_wrapper_type_form form input[type=number],
.hs_cos_wrapper_type_form form select,
.hs_cos_wrapper_type_form form textarea,
.password-prompt #hs-pwd-widget-password,
.password-prompt input[name='password'][type='password'] {
  box-sizing: border-box;
  display: inline-block;
  min-height: var(--ac-form-control-min-height, 3.5rem);
  padding:
    var(--ac-form-control-padding-y, 0.75rem)
    var(--ac-form-control-padding-x, 1rem);
  width: 100%;
  background: var(--ac-form-control-bg, var(--ac-surface));
  border:
    var(--ac-form-control-border-width, 1px)
    solid
    var(--ac-form-control-border-color, var(--ac-border-strong));
  border-radius: var(--ac-form-control-radius, var(--ac-radius-sm));
  box-shadow: var(--ac-form-control-shadow, none);
  color: var(--ac-form-control-text, var(--ac-text));
  font-family: var(--ac-form-control-font-family, var(--ac-font-body));
  font-size: var(--ac-form-control-font-size, 1rem);
  font-style: var(--ac-form-control-font-style, normal);
  font-weight: var(--ac-form-control-font-weight, 400);
  line-height: var(--ac-form-control-line-height, 1.4);
  outline: none;
  transition:
    border-color var(--ac-form-control-motion-duration, 120ms) var(--ac-form-control-motion-easing, ease-out),
    box-shadow var(--ac-form-control-motion-duration, 120ms) var(--ac-form-control-motion-easing, ease-out),
    background-color var(--ac-form-control-motion-duration, 120ms) var(--ac-form-control-motion-easing, ease-out),
    color var(--ac-form-control-motion-duration, 120ms) var(--ac-form-control-motion-easing, ease-out);
}

.hs-form textarea,
.hs_cos_wrapper_type_form form textarea {
  min-height: 8rem;
  resize: vertical;
}

.hs-form input::placeholder,
.hs-form textarea::placeholder,
.hs_cos_wrapper_type_form form input::placeholder,
.hs_cos_wrapper_type_form form textarea::placeholder,
.password-prompt #hs-pwd-widget-password::placeholder,
.password-prompt input[name='password'][type='password']::placeholder {
  color: var(--ac-form-control-placeholder, var(--ac-text-muted));
  opacity: 1;
}

.hs-form input[type=text]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form input[type=search]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form input[type=email]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form input[type=password]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form input[type=tel]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form input[type=number]:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form select:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs-form textarea:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs_cos_wrapper_type_form form input:not([type=file]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs_cos_wrapper_type_form form select:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.hs_cos_wrapper_type_form form textarea:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.password-prompt #hs-pwd-widget-password:not([aria-invalid='true']):not(.invalid):not(:disabled):hover,
.password-prompt input[name='password'][type='password']:not([aria-invalid='true']):not(.invalid):not(:disabled):hover {
  background: var(--ac-form-control-bg-hover, var(--ac-form-control-bg));
  border-color: var(--ac-form-control-border-color-hover, var(--ac-form-control-border-color));
  box-shadow: var(--ac-form-control-hover-shadow, none);
  color: var(--ac-form-control-text-hover, var(--ac-form-control-text));
}

.hs-form input[type=text]:focus-visible,
.hs-form input[type=search]:focus-visible,
.hs-form input[type=email]:focus-visible,
.hs-form input[type=password]:focus-visible,
.hs-form input[type=tel]:focus-visible,
.hs-form input[type=number]:focus-visible,
.hs-form select:focus-visible,
.hs-form textarea:focus-visible,
.hs_cos_wrapper_type_form form input[type=text]:focus-visible,
.hs_cos_wrapper_type_form form input[type=search]:focus-visible,
.hs_cos_wrapper_type_form form input[type=email]:focus-visible,
.hs_cos_wrapper_type_form form input[type=password]:focus-visible,
.hs_cos_wrapper_type_form form input[type=tel]:focus-visible,
.hs_cos_wrapper_type_form form input[type=number]:focus-visible,
.hs_cos_wrapper_type_form form select:focus-visible,
.hs_cos_wrapper_type_form form textarea:focus-visible,
.password-prompt #hs-pwd-widget-password:focus-visible,
.password-prompt input[name='password'][type='password']:focus-visible {
  background: var(--ac-form-control-bg-focus, var(--ac-form-control-bg));
  border-color: var(--ac-form-control-border-color-focus, var(--ac-accent));
  box-shadow: var(--ac-form-control-focus-shadow, var(--ac-focus-shadow));
  color: var(--ac-form-control-text-focus, var(--ac-form-control-text));
  outline: var(--ac-form-control-focus-ring, var(--ac-focus-ring));
  outline-offset: var(--ac-form-control-focus-offset, var(--ac-focus-offset));
}

.hs-form input:disabled,
.hs-form select:disabled,
.hs-form textarea:disabled,
.hs_cos_wrapper_type_form form input:disabled,
.hs_cos_wrapper_type_form form select:disabled,
.hs_cos_wrapper_type_form form textarea:disabled,
.password-prompt #hs-pwd-widget-password:disabled,
.password-prompt input[name='password'][type='password']:disabled {
  background: var(--ac-form-control-bg-disabled, var(--ac-surface-muted));
  border-color: var(--ac-form-control-border-color-disabled, var(--ac-border));
  color: var(--ac-form-control-text-disabled, var(--ac-text-muted));
  cursor: var(--ac-form-control-disabled-cursor, not-allowed);
  opacity: var(--ac-form-control-disabled-opacity, 0.72);
}

.hs-form input[readonly],
.hs-form textarea[readonly],
.hs_cos_wrapper_type_form form input[readonly],
.hs_cos_wrapper_type_form form textarea[readonly],
.password-prompt #hs-pwd-widget-password[readonly],
.password-prompt input[name='password'][type='password'][readonly] {
  background: var(--ac-form-control-bg-readonly, var(--ac-surface-soft));
  border-color: var(--ac-form-control-border-color-readonly, var(--ac-border));
  color: var(--ac-form-control-text-readonly, var(--ac-text));
}

.hs-form fieldset,
.hs_cos_wrapper_type_form form fieldset {
  max-width: 100% !important;
}

/* Inputs - checkbox/radio */

.hs-form .inputs-list,
.hs_cos_wrapper_type_form form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-form .inputs-list > li,
.hs_cos_wrapper_type_form form .inputs-list > li {
  display: block;
  margin: 0.7rem 0;
}

.hs-form .inputs-list input,
.hs-form .inputs-list span,
.hs_cos_wrapper_type_form form .inputs-list input,
.hs_cos_wrapper_type_form form .inputs-list span {
  vertical-align: middle;
}

.hs-form input[type=checkbox],
.hs-form input[type=radio],
.hs_cos_wrapper_type_form form input[type=checkbox],
.hs_cos_wrapper_type_form form input[type=radio] {
  cursor: pointer;
  margin-right: 0.35rem;
}

/* Inputs - date picker */

.hs-dateinput {
  position: relative;
}

.hs-dateinput:before {
  content:'\01F4C5';
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}

.fn-date-picker .pika-table thead th {
  color: #FFF;
}

.fn-date-picker td.is-selected .pika-button {
  border-radius: 0;
  box-shadow: none;
}

.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
  border-radius: 0 !important;
  color: #FFF;
}

/* Inputs - file picker */

.hs-form input[type=file],
.hs_cos_wrapper_type_form form input[type=file] {
  background-color: transparent;
  border: initial;
  padding: initial;
}

/* Headings and text */

.hs-form .hs-richtext,
.hs-form .hs-richtext p,
.hs_cos_wrapper_type_form form .hs-richtext,
.hs_cos_wrapper_type_form form .hs-richtext p {
  font-size: 0.875rem;
  margin: 0 0 1.4rem;
}

.hs-form .hs-richtext img,
.hs_cos_wrapper_type_form form .hs-richtext img {
  max-width: 100% !important;
}

/* GDPR */

.hs-form .legal-consent-container .hs-form-booleancheckbox-display > span,
.hs-form .legal-consent-container .hs-form-booleancheckbox-display > span p,
.hs_cos_wrapper_type_form .legal-consent-container .hs-form-booleancheckbox-display > span,
.hs_cos_wrapper_type_form .legal-consent-container .hs-form-booleancheckbox-display > span p {
  margin-left: 1rem !important;
}

/* Validation */

.hs-form-required,
.hs-form .hs-form-required,
.hs_cos_wrapper_type_form .hs-form-required {
  color: var(--ac-form-error-color, var(--ac-danger));
}

.hs-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']),
.hs_cos_wrapper_type_form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']) {
  background: var(--ac-form-control-bg-invalid, var(--ac-form-control-bg));
  border-color: var(--ac-form-control-border-color-invalid, var(--ac-danger));
  box-shadow: var(--ac-form-control-invalid-shadow, none);
  color: var(--ac-form-control-text-invalid, var(--ac-form-control-text));
}

.hs-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']):hover,
.hs_cos_wrapper_type_form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']):hover {
  border-color: var(--ac-form-control-border-color-invalid-hover, var(--ac-danger));
  box-shadow: var(--ac-form-control-invalid-hover-shadow, none);
}

.hs-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']):focus-visible,
.hs_cos_wrapper_type_form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']):focus-visible {
  border-color: var(--ac-form-control-border-color-invalid-focus, var(--ac-danger));
  box-shadow: var(--ac-form-control-invalid-focus-shadow, none);
  outline: var(--ac-form-control-invalid-focus-ring, 2px solid var(--ac-danger));
  outline-offset: var(--ac-form-control-invalid-focus-offset, var(--ac-focus-offset));
}

.hs-form .hs-error-msg,
.hs_cos_wrapper_type_form .hs-error-msg {
  margin-top: var(--ac-form-error-gap, 0.5rem);
  color: var(--ac-form-error-color, var(--ac-danger));
  font-family: var(--ac-form-error-font-family, var(--ac-font-body));
  font-size: var(--ac-form-error-font-size, 0.875rem);
  font-style: var(--ac-form-error-font-style, normal);
  font-weight: var(--ac-form-error-font-weight, 400);
  line-height: var(--ac-form-error-line-height, 1.45);
}

/* Submit button */

.hs-form input[type=submit],
.password-prompt form input[type=submit],
.hs-form .hs-button,
.hs_cos_wrapper_type_form form input[type=submit],
.hs_cos_wrapper_type_form form .hs-button {
  cursor: pointer;
  display: inline-block;
  text-align: center;
  transition:
    background-color var(--ac-motion-fast) var(--ac-ease-out),
    border-color var(--ac-motion-fast) var(--ac-ease-out),
    color var(--ac-motion-fast) var(--ac-ease-out),
    transform var(--ac-motion-standard) var(--ac-ease-out);
  white-space: normal;
}
.hs-form input[type=submit]:active,
.password-prompt form input[type=submit]:active,
.hs-form .hs-button:active,
.hs_cos_wrapper_type_form form input[type=submit]:active,
.hs_cos_wrapper_type_form form .hs-button:active {
  transform: var(--ac-press-sm);
}

.hs-form input[type=submit]:focus-visible,
.password-prompt form input[type=submit]:focus-visible,
.hs-form .hs-button:focus-visible,
.hs_cos_wrapper_type_form form input[type=submit]:focus-visible,
.hs_cos_wrapper_type_form form .hs-button:focus-visible {
  outline: var(--ac-focus-ring);
  outline-offset: var(--ac-focus-offset);
}


/* Captcha */

.grecaptcha-badge {
  margin: 0 auto;
}


  /* Search button input field and suggestions */
  .body-container-wrapper .hs-search-field__button {
    padding: 15px;
  }

  .body-container-wrapper .hs-search-field__bar--button-inline .hs-search-field__button {
    margin-left: 6px;
    margin-bottom: 0;
  }

  .body-container-wrapper .hs-search-field__button svg {
    height: 15px;
    fill: #fff;
  }

  .body-container-wrapper .hs-search-field__bar > form > .hs-search-field__input {
    padding: 10px;
  }

  .body-container-wrapper .hs-search-field__suggestions li a {
    color: #494A52;
    padding: 0.35rem 0.7rem;
    text-decoration: none;
    transition: background-color var(--ac-motion-standard) var(--ac-ease-out);
  }


/* ==========================================================================
   Password prompt form bridge
   - Uses HubSpot's native password_prompt tag for form behavior and messages.
   - HubSpot emits inline password input height/margin styles, so this mirrors
     the Neambo pattern and overrides the generated system field directly.
   - Arctic Cat angled buttons require visible wrapper/span markup; the generated
     submit input remains the real submit control while the shell owns appearance.
   ========================================================================== */

.password-prompt form {
  display: grid;
  justify-items: center;
  gap: 0;
  margin-top: 0;
}

.password-prompt #hs-pwd-widget-password,
.password-prompt input[name='password'][type='password'] {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 100% !important;
  height: auto !important;
  min-height: var(--ac-form-control-min-height-lg, 3.75rem);
  margin: 0 0 var(--ac-space-xl, 2rem) !important;
  padding-top: var(--ac-form-control-padding-y-lg, var(--ac-space-md)) !important;
  padding-right: var(--ac-form-control-padding-x-lg, 1.25rem) !important;
  padding-bottom: var(--ac-form-control-padding-y-lg, var(--ac-space-md)) !important;
  padding-left: var(--ac-form-control-padding-x-lg, 1.25rem) !important;
  text-indent: 0;
}

.password-prompt__submit-shell {
  position: relative;
  width: fit-content;
  margin-inline: auto;
}

.password-prompt .password-prompt__submit-shell > span {
  font: inherit;
  line-height: inherit;
  text-transform: inherit;
}

.password-prompt .password-prompt__submit-shell input[type='submit'],
.password-prompt .password-prompt__submit-shell input[type='submit'].hs-button,
.password-prompt .password-prompt__submit-shell .hs-button.primary.large {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  transform: none !important;
  cursor: pointer;
  -webkit-clip-path: none !important;
  clip-path: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .hs-form input,
  .hs-form select,
  .hs-form textarea,
  .hs_cos_wrapper_type_form form input,
  .hs_cos_wrapper_type_form form select,
  .hs_cos_wrapper_type_form form textarea,
  .password-prompt input {
    transition-duration: 0.01ms;
  }
}

@media (forced-colors: active) {
  .hs-form input,
  .hs-form select,
  .hs-form textarea,
  .hs_cos_wrapper_type_form form input,
  .hs_cos_wrapper_type_form form select,
  .hs_cos_wrapper_type_form form textarea,
  .password-prompt input {
    forced-color-adjust: auto;
  }

  .hs-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']),
  .hs_cos_wrapper_type_form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea):is(.invalid.error, [aria-invalid='true']) {
    border-color: Mark;
  }
}
/* Table */

table {
  border-collapse: collapse;
  margin-bottom: 1.4rem;
  overflow-wrap: break-word;
}

/* Table cells */

td,
th {
  vertical-align: top;
}

/* Table header */

thead th {
  vertical-align: bottom;
}

/* Components */
/* Menu and simple menu */

.hs-menu-wrapper ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Horizontal menu */

.hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper {
  flex-direction: column;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-horizontal ul {
    flex-direction: column;
  }
}

/* Vertical menu */

.hs-menu-wrapper.hs-menu-flow-vertical ul {
  flex-direction: column;
}

/* Flyouts */

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
  display: inline-flex;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-vertical ul {
    display: flex;
  }
}

.hs-menu-wrapper.flyouts .hs-item-has-children {
  position: relative;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
  left: -9999px;
  opacity: 0;
  position: absolute;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper a {
  display: block;
  white-space: nowrap;
}

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 0;
  opacity: 1;
  top: 100%;
}

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 100%;
  opacity: 1;
  top: 0;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.flyouts .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
    left: 0;
    opacity: 1;
    position: relative;
    top: auto;
  }
}

/* CTA, logo, and rich text images */

.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
  height: auto;
  max-width: 100%;
}

/* Utilities */
/* For content that needs to be visually hidden but stay visible for screenreaders */

.show-for-sr {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

@media (max-width: 767px) {
  .show-for-sr--mobile {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
  }
}
/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
/* ==========================================================================
   Arctic Cat Module Utilities
   Shared spacing, surface, border, and content-behavior modifiers.
   ========================================================================== */

.ac-module--space-top-none { padding-top: 0; }
.ac-module--space-top-sm { padding-top: var(--ac-section-padding-sm); }
.ac-module--space-top-md { padding-top: var(--ac-section-padding-md); }
.ac-module--space-top-lg { padding-top: var(--ac-section-padding-lg); }

.ac-module--space-bottom-none { padding-bottom: 0; }
.ac-module--space-bottom-sm { padding-bottom: var(--ac-section-padding-sm); }
.ac-module--space-bottom-md { padding-bottom: var(--ac-section-padding-md); }
.ac-module--space-bottom-lg { padding-bottom: var(--ac-section-padding-lg); }

.ac-module--surface-transparent {
  background: transparent;
}

.ac-module--surface-white {
  --ac-module-surface-color: var(--ac-surface);

  color: var(--ac-text);
  background: var(--ac-module-surface-color);
}

.ac-module--surface-muted {
  --ac-module-surface-color: var(--ac-surface-muted);

  color: var(--ac-text);
  background: var(--ac-module-surface-color);
}

.ac-module--surface-dark {
  --ac-module-surface-color: var(--ac-dark-surface);

  color: var(--ac-text-inverse);
  background: var(--ac-module-surface-color);
}

.ac-module--surface-black {
  --ac-module-surface-color: var(--ac-dark-surface-strong);

  color: var(--ac-text-inverse);
  background: var(--ac-module-surface-color);
}

.ac-module.ac-module--surface-white,
.ac-module.ac-module--surface-muted,
.ac-module.ac-module--surface-dark,
.ac-module.ac-module--surface-black {
  isolation: isolate;
}

.ac-module.ac-module--surface-white::before,
.ac-module.ac-module--surface-muted::before,
.ac-module.ac-module--surface-dark::before,
.ac-module.ac-module--surface-black::before {
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  pointer-events: none;
  content: "";
  background: var(--ac-module-surface-color);
  transform: translateX(-50%);
}

/* Image heroes own a full-bleed media canvas and do not need the shared
   surface extension behind their clipped edge treatment. */
.ac-module.ac-editorial-hero--image::before {
  content: none;
}

.ac-module--scheme-light {
  color: var(--ac-text);
}

.ac-module--scheme-dark {
  color: var(--ac-text-inverse);
}

.ac-module--border-top {
  border-top: 1px solid var(--ac-border);
}

.ac-module--scheme-dark.ac-module--border-top,
.ac-module--surface-dark.ac-module--border-top,
.ac-module--surface-black.ac-module--border-top {
  border-top-color: var(--ac-border-inverse);
}

.ac-module--inset-compact .ac-module__panel {
  padding: var(--ac-space-6);
}

.ac-module--inset-standard .ac-module__panel {
  padding: clamp(var(--ac-space-6), 3vw, var(--ac-space-10));
}

.ac-module--inset-generous .ac-module__panel {
  padding: clamp(var(--ac-space-8), 5vw, var(--ac-space-16));
}

.ac-module--panel-border .ac-module__panel {
  border: 1px solid var(--ac-border);
}

.ac-module--scheme-dark.ac-module--panel-border .ac-module__panel,
.ac-module--surface-dark.ac-module--panel-border .ac-module__panel,
.ac-module--surface-black.ac-module--panel-border .ac-module__panel {
  border-color: var(--ac-border-inverse);
}

.ac-module [id] {
  scroll-margin-top: calc(var(--ac-scroll-offset) + var(--ac-space-4));
}