:root {
  --store-color-primary: #3E4A31;
  --store-color-secondary: #171717;
  --store-color-background: #FFFFFF;
  --store-color-surface: #FFFFFF;
  --store-color-text: #171717;
  --store-color-muted: #6B6B6B;
  --store-color-heading: #171717;
  --store-color-price: #C4301C;
  --store-color-border: #E0E0E0;
  --store-header-background: #FFFFFF;
  --store-header-text: #171717;
  --store-button-primary-background: #171717;
  --store-button-primary-text: #FFFFFF;
  --store-button-primary-hover-background: #3E4A31;
  --store-button-primary-hover-text: #FFFFFF;
  --store-button-secondary-background: #FFFFFF;
  --store-button-secondary-text: #171717;
  --store-button-secondary-hover-background: #EDEDED;
  --store-button-secondary-hover-text: #171717;
  --store-font-family: 'Instrument Sans', sans-serif;
  --store-heading-font-family: 'Instrument Sans', sans-serif;
  --store-accent-font-family: 'Instrument Serif', serif;
  --store-accent-font-style: italic;
  --store-accent-font-weight: 400;
  --store-color-soft: #F3F3F3;
  --store-radius: 14px;
  --store-container-width: 1360px;
  --store-subtitle-order: -1;
  --store-subtitle-transform: uppercase;
  --store-subtitle-size: 11px;
  --store-subtitle-tracking: 0.16em;
  --store-section-title-size: clamp(28px, 3.4vw, 44px);
  --store-section-title-weight: 500;
  --store-section-title-size-mobile: 28px;
  --store-section-title-leading: 1.08;
  --store-soft-backdrop: var(--store-color-surface);
  --store-soft-bubbles: hidden;
  --store-button-arrow: inline-block;
}

.store-container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--store-container-width);
  margin-inline: auto;
  padding-inline: 16px;
}

@media (min-width: 768px) {
  .store-container {
    padding-inline: 24px;
  }
}
