:root {
  --font-heading: 'STIX Two Text', sans-serif;
  --font-primary: 'Heebo', sans-serif;
  --text-bolder-weight: inherit;
  --btn-radius: .4em;
  --news-form-input-radius: .4em; }

.radius-component {
  border-radius: 0.4em; }

.btn {
  --btn-radius: .4em; }

.form-control--alt {
  --form-control-radius: .4em; }

:root, [data-theme="default"], .mega-nav--expanded[data-theme="white"], .main-nav:not(.mega-nav--overlay) .search-input .search-form, .main-nav:not(.mega-nav--overlay).main-nav--desktop .main-nav__item > .main-nav__sub-nav-wrapper {
  --color-primary-darker: #2a2c3f;
  --color-primary-dark: #303348;
  --color-primary: #3d405b;
  --color-primary-light: #63667b;
  --color-primary-lighter: #77798c;
  --color-bg: #ffffff;
  --color-contrast-lowest: #f9f9fa;
  --color-contrast-lower: #f5f5f6;
  --color-contrast-low: #dedee3;
  --color-contrast-medium: #9e9fad;
  --color-contrast-high: #3d405b;
  --color-contrast-higher: #3d405b;
  --color-border: #dedee3; }

.main-nav--desktop .main-nav__item > .main-nav__sub-nav-wrapper {
  color: var(--color-contrast-higher); }

.js .hero-carousel .carousel__control {
  background-color: rgba(255, 255, 255, 0.85); }

.product-v3__cta-clone, .bg-contrast-lower .carousel__control {
  background-color: rgba(255, 255, 255, 0.9); }

.drawer__content, .modal__content {
  background-color: white; }

.carousel__control {
  background-color: rgba(255, 255, 255, 0.9); }

.color-swatches__swatch::before {
  border-color: rgba(61, 64, 91, 0.1); }
  .color-swatches__swatch::before:hover {
    border-color: rgba(61, 64, 91, 0.3); }

.mega-nav__search-input .form-control {
  background-color: rgba(61, 64, 91, 0.05) !important; }

[data-theme="footer"] {
  --color-primary-darker: #2a2c3f;
  --color-primary-dark: #303348;
  --color-primary: #3d405b;
  --color-primary-light: #63667b;
  --color-primary-lighter: #77798c;
  --color-bg: #3d405b;
  --color-contrast-lowest: #464963;
  --color-contrast-lower: #4e5169;
  --color-contrast-low: #5d6076;
  --color-contrast-medium: #8a8c9c;
  --color-contrast-high: #ffffff;
  --color-contrast-higher: #ffffff;
  --color-border: #5d6076; }
  [data-theme="footer"] .js .hero-carousel .carousel__control {
    background-color: rgba(61, 64, 91, 0.85); }
  [data-theme="footer"] .product-v3__cta-clone, [data-theme="footer"] .bg-contrast-lower .carousel__control {
    background-color: rgba(61, 64, 91, 0.9); }
  [data-theme="footer"] .drawer__content, [data-theme="footer"] .modal__content {
    background-color: #3d405b; }
  [data-theme="footer"] .carousel__control {
    background-color: rgba(61, 64, 91, 0.9); }
  [data-theme="footer"] .color-swatches__swatch::before {
    border-color: rgba(255, 255, 255, 0.1); }
    [data-theme="footer"] .color-swatches__swatch::before:hover {
      border-color: rgba(255, 255, 255, 0.3); }
  [data-theme="footer"] .mega-nav__search-input .form-control {
    background-color: rgba(255, 255, 255, 0.05) !important; }

.prod-card__img-link img, .prod-card__img-link .media-wrapper--empty, .product-intro__media-wrapper img, .product-bundles img {
  background-color: var(--color-bg); }

[data-theme="white"] {
  --color-primary-darker: #2a2c3f;
  --color-primary-dark: #303348;
  --color-primary: #3d405b;
  --color-primary-light: #63667b;
  --color-primary-lighter: #77798c;
  --color-bg: #3d405b;
  --color-contrast-lowest: #464963;
  --color-contrast-lower: #4e5169;
  --color-contrast-low: #5d6076;
  --color-contrast-medium: #8a8c9c;
  --color-contrast-high: #ffffff;
  --color-contrast-higher: #ffffff;
  --color-border: #5d6076; }
  [data-theme="white"] .js .hero-carousel .carousel__control {
    background-color: rgba(61, 64, 91, 0.85); }
  [data-theme="white"] .product-v3__cta-clone, [data-theme="white"] .bg-contrast-lower .carousel__control {
    background-color: rgba(61, 64, 91, 0.9); }
  [data-theme="white"] .drawer__content, [data-theme="white"] .modal__content {
    background-color: #3d405b; }
  [data-theme="white"] .carousel__control {
    background-color: rgba(61, 64, 91, 0.9); }
  [data-theme="white"] .color-swatches__swatch::before {
    border-color: rgba(255, 255, 255, 0.1); }
    [data-theme="white"] .color-swatches__swatch::before:hover {
      border-color: rgba(255, 255, 255, 0.3); }
  [data-theme="white"] .mega-nav__search-input .form-control {
    background-color: rgba(255, 255, 255, 0.05) !important; }

.main-nav:not(.mega-nav--overlay), .main-nav.mega-nav--overlay.mega-nav--expanded, .main-nav.mega-nav--overlay.is-sticky {
  --color-bg: #ffffff;
  --color-contrast-lowest: #f5f5f6;
  --color-contrast-lower: #ebebee;
  --color-contrast-low: #dedee3;
  --color-contrast-medium: #b1b2bd;
  --color-contrast-high: #3d405b;
  --color-contrast-higher: #3d405b;
  --color-border: #dedee3;
  color: #3d405b;
  background-color: #ffffff; }
  .main-nav:not(.mega-nav--overlay).mega-nav--expanded, .main-nav.mega-nav--overlay.mega-nav--expanded.mega-nav--expanded, .main-nav.mega-nav--overlay.is-sticky.mega-nav--expanded {
    background-color: #ffffff; }
  .main-nav:not(.mega-nav--overlay).mega-nav--desktop .mega-nav__tabs-controls, .main-nav.mega-nav--overlay.mega-nav--expanded.mega-nav--desktop .mega-nav__tabs-controls, .main-nav.mega-nav--overlay.is-sticky.mega-nav--desktop .mega-nav__tabs-controls {
    border-right: 1px solid rgba(61, 64, 91, 0.1); }
  .main-nav:not(.mega-nav--overlay) .js .hero-carousel .carousel__control, .main-nav.mega-nav--overlay.mega-nav--expanded .js .hero-carousel .carousel__control, .main-nav.mega-nav--overlay.is-sticky .js .hero-carousel .carousel__control {
    background-color: rgba(255, 255, 255, 0.85); }
  .main-nav:not(.mega-nav--overlay) .product-v3__cta-clone, .main-nav.mega-nav--overlay.mega-nav--expanded .product-v3__cta-clone, .main-nav.mega-nav--overlay.is-sticky .product-v3__cta-clone, .main-nav:not(.mega-nav--overlay) .bg-contrast-lower .carousel__control, .main-nav.mega-nav--overlay.mega-nav--expanded .bg-contrast-lower .carousel__control, .main-nav.mega-nav--overlay.is-sticky .bg-contrast-lower .carousel__control {
    background-color: rgba(255, 255, 255, 0.9); }
  .main-nav:not(.mega-nav--overlay) .drawer__content, .main-nav.mega-nav--overlay.mega-nav--expanded .drawer__content, .main-nav.mega-nav--overlay.is-sticky .drawer__content, .main-nav:not(.mega-nav--overlay) .modal__content, .main-nav.mega-nav--overlay.mega-nav--expanded .modal__content, .main-nav.mega-nav--overlay.is-sticky .modal__content {
    background-color: white; }
  .main-nav:not(.mega-nav--overlay) .carousel__control, .main-nav.mega-nav--overlay.mega-nav--expanded .carousel__control, .main-nav.mega-nav--overlay.is-sticky .carousel__control {
    background-color: rgba(255, 255, 255, 0.9); }
  .main-nav:not(.mega-nav--overlay) .color-swatches__swatch::before, .main-nav.mega-nav--overlay.mega-nav--expanded .color-swatches__swatch::before, .main-nav.mega-nav--overlay.is-sticky .color-swatches__swatch::before {
    border-color: rgba(61, 64, 91, 0.1); }
    .main-nav:not(.mega-nav--overlay) .color-swatches__swatch::before:hover, .main-nav.mega-nav--overlay.mega-nav--expanded .color-swatches__swatch::before:hover, .main-nav.mega-nav--overlay.is-sticky .color-swatches__swatch::before:hover {
      border-color: rgba(61, 64, 91, 0.3); }
  .main-nav:not(.mega-nav--overlay) .mega-nav__search-input .form-control, .main-nav.mega-nav--overlay.mega-nav--expanded .mega-nav__search-input .form-control, .main-nav.mega-nav--overlay.is-sticky .mega-nav__search-input .form-control {
    background-color: rgba(61, 64, 91, 0.05) !important; }

.pre-header {
  --color-bg: #e07a5f;
  --color-contrast-lower: #e2856d;
  --color-contrast-low: #e5907a;
  --color-contrast-medium: #ecaf9f;
  --color-contrast-high: #ffffff;
  --color-contrast-higher: #ffffff;
  color: #ffffff;
  background-color: #e07a5f; }
  .pre-header .js .hero-carousel .carousel__control {
    background-color: rgba(224, 122, 95, 0.85); }
  .pre-header .product-v3__cta-clone, .pre-header .bg-contrast-lower .carousel__control {
    background-color: rgba(224, 122, 95, 0.9); }
  .pre-header .drawer__content, .pre-header .modal__content {
    background-color: #e07a5f; }
  .pre-header .carousel__control {
    background-color: rgba(224, 122, 95, 0.9); }
  .pre-header .color-swatches__swatch::before {
    border-color: rgba(255, 255, 255, 0.1); }
    .pre-header .color-swatches__swatch::before:hover {
      border-color: rgba(255, 255, 255, 0.3); }
  .pre-header .mega-nav__search-input .form-control {
    background-color: rgba(255, 255, 255, 0.05) !important; }

.bg {
  background-color: var(--color-bg); }

.bg-contrast-lower {
  background-color: var(--color-contrast-lower); }

.bg-contrast-low {
  background-color: var(--color-contrast-low); }

.bg-contrast-medium {
  background-color: var(--color-contrast-medium); }

.bg-contrast-high {
  background-color: var(--color-contrast-high); }

.bg-contrast-higher {
  background-color: var(--color-contrast-higher); }

.bg-primary-darker {
  background-color: var(--color-primary-darker); }

.bg-primary-dark {
  background-color: var(--color-primary-dark); }

.bg-primary {
  background-color: var(--color-primary); }

.bg-primary-light {
  background-color: var(--color-primary-light); }

.bg-primary-lighter {
  background-color: var(--color-primary-lighter); }

h1, h2, h3, h4, .heading-control {
  font-family: var(--font-heading);
  font-weight: 400; }

.footer__logo {
  height: 32px; }

.js .hero-carousel .carousel__control, .js .hero-carousel .carousel__control:hover {
  background-color: #ffffff;
  color: #3d405b; }

.main-nav__logo {
  height: 32px; }
@media (min-width: 64rem) {
  .main-nav__logo {
    height: 38px; } }

.main-nav {
  height: calc(32px + 15px); }
@media (min-width: 64rem) {
  .main-nav {
    height: calc(38px + 25px); } }
.main-nav.main-nav--position-below {
  height: auto; }
  .main-nav.main-nav--position-below .main-nav__container {
    height: calc(38px + 30px);
    height: calc(32px + 30px); }
  @media (min-width: 64rem) {
    .main-nav.main-nav--position-below .main-nav__container {
      min-height: 60px;
      height: calc(38px + 30px); } }

:root {
  --mega-nav-height: calc(32px + 30px); }
@media (min-width: 64rem) {
  :root {
    --mega-nav-height: calc(38px + 30px); } }