@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --ch-ink: var(--theme-palette-color-1, #0b0b0d);
  --ch-accent: var(--theme-palette-color-2, #0b6bcb);
  --ch-line: var(--theme-palette-color-5, #e2e4e8);
  --ch-mist: var(--theme-palette-color-6, #f6f7f8);
  --ch-ground: var(--theme-palette-color-7, #edeef0);
  --ch-paper: var(--theme-palette-color-8, #fff);
  --ch-text-2: var(--theme-palette-color-9, #4a4e55);
  --ch-field: var(--theme-palette-color-10, #b9bdc3);
  --ch-line-2: var(--theme-palette-color-11, #d9dce0);
  --ch-accent-tint: var(--theme-palette-color-12, #e8f1fb);
  --ch-accent-dark: var(--theme-palette-color-13, #7db8ff);
  --ch-save: var(--theme-palette-color-14, #157f3b);
  --ch-star: var(--theme-palette-color-15, #f39c3c);
  --ch-ink-hover: var(--theme-palette-color-16, #2a2c31);
  --ch-error: #b3261e;

  --ch-font: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --ch-stretch-display: 110%;
  --ch-stretch-title: 106%;
  --ch-stretch-h3: 104%;
  --ch-fs-xs: 12px;
  --ch-fs-s: 13px;
  --ch-fs-ui: 15px;
  --ch-fs-body: 16px;
  --ch-fs-lead: 18px;
  --ch-fs-h3: 22px;
  --ch-fs-price: 30px;
  --ch-fs-h2: 36px;
  --ch-fs-h1: 52px;
  --ch-w-regular: 400;
  --ch-w-medium: 500;
  --ch-w-ui: 600;
  --ch-w-bold: 700;
  --ch-w-h3: 750;
  --ch-w-display: 800;
  --ch-track-h1: -0.03em;
  --ch-track-h2: -0.02em;
  --ch-lh-body: 1.6;

  --ch-radius-s: 10px;
  --ch-radius: 16px;
  --ch-radius-l: 20px;
  --ch-radius-pill: 999px;

  --ch-space-1: 4px;
  --ch-space-2: 8px;
  --ch-space-3: 12px;
  --ch-space-4: 16px;
  --ch-space-5: 24px;
  --ch-space-6: 32px;
  --ch-space-7: 48px;
  --ch-space-8: 64px;
  --ch-gap: 24px;
  --ch-section: clamp(48px, 7vw, 96px);
  --ch-width: 1390px;
  --ch-wide: 1590px;
  --ch-block-gap: 24px;
  --ch-narrow: 900px;

  --ch-target: 44px;
  --ch-btn-h: 52px;
  --ch-btn-h-s: 48px;
  --ch-chip-h: 40px;
  --ch-field-h: 48px;
  --ch-focus-width: 2px;
  --ch-focus-color: var(--ch-ink);
  --ch-focus-offset: 3px;
  --ch-shadow: 0 6px 24px rgba(11, 11, 13, .08);

  --ch-black: var(--ch-ink);
  --ch-white: var(--ch-paper);
  --ch-surface: var(--ch-mist);
  --ch-ink-2: var(--ch-text-2);
  --ch-muted: var(--ch-text-2);
  --ch-navy: var(--ch-ink);
  --ch-ok: var(--ch-save);
}

h1, h2 { font-stretch: var(--ch-stretch-display); }
h3 { font-stretch: var(--ch-stretch-h3); }
h4, h5, h6 { font-stretch: var(--ch-stretch-title); }

:focus-visible { outline: var(--ch-focus-width) solid var(--ch-focus-color); outline-offset: var(--ch-focus-offset); }
:is(input, select, textarea):focus-visible { outline: var(--ch-focus-width) solid var(--ch-focus-color); outline-offset: 1px; }
.ct-pseudo-input:has(:focus-visible) { outline: var(--ch-focus-width) solid var(--ch-focus-color); outline-offset: 1px; }
.ct-pseudo-input :is(input, select):focus-visible { outline: none; }
.ch-on-dark { --ch-focus-color: var(--ch-paper); --ch-accent: var(--ch-accent-dark); }

.ch-wrap { max-width: var(--ch-width); margin-inline: auto; padding-inline: var(--theme-content-edge-spacing, 20px); box-sizing: border-box; }
.ch-wrap--wide { max-width: var(--ch-wide); }
.ch-narrow { max-width: var(--ch-narrow); margin-inline: auto; }
.ch-section { padding-block: var(--ch-section); }
.ch-surface { background: var(--ch-surface); }
.ch-card { background: var(--ch-paper); border-radius: var(--ch-radius); }
.ch-promo { background: var(--ch-ink); color: var(--ch-paper); border-radius: var(--ch-radius); --ch-focus-color: var(--ch-paper); --ch-accent: var(--ch-accent-dark); }
.ch-num { font-variant-numeric: tabular-nums; }
.ch-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ch-title { display: block; margin: 0 0 .6em; font-weight: var(--ch-w-display); font-stretch: var(--ch-stretch-display); letter-spacing: var(--ch-track-h2); line-height: 1.1; color: var(--ch-ink); font-size: clamp(24px, 2.6vw, var(--ch-fs-h2)); }
.ch-title--center { text-align: center; }

.ch-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: var(--ch-btn-h-s); padding: 0 22px; border-radius: var(--ch-radius-pill); background: var(--ch-paper); color: var(--ch-ink); font-weight: var(--ch-w-bold); font-size: var(--ch-fs-ui); line-height: 1.2; text-decoration: none; border: 1px solid var(--ch-ink); box-sizing: border-box; transition: background .2s, color .2s; }
.ch-btn:hover { background: var(--ch-ink); color: var(--ch-paper); }
.ch-btn--dark { min-height: var(--ch-btn-h); padding: 0 26px; background: var(--ch-ink); color: var(--ch-paper); border-color: var(--ch-ink); }
.ch-btn--dark:hover { background: var(--ch-ink-hover); border-color: var(--ch-ink-hover); }
.ch-btn svg { width: 16px; height: 16px; }

.ch-pill { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: var(--ch-radius-pill); background: var(--ch-accent); color: var(--ch-paper); font-size: var(--ch-fs-xs); font-weight: var(--ch-w-bold); line-height: 1.35; white-space: nowrap; }
.ch-pill--soft { background: var(--ch-accent-tint); color: var(--ch-ink); }
.ch-pill--save { background: var(--ch-save); }
.ch-chip { display: inline-flex; align-items: center; gap: 6px; min-height: var(--ch-chip-h); padding: 0 14px; border-radius: var(--ch-radius-pill); border: 1.5px solid var(--ch-line-2); background: var(--ch-paper); color: var(--ch-ink); font: inherit; font-size: var(--ch-fs-s); font-weight: var(--ch-w-ui); cursor: pointer; }
.ch-chip:is([aria-pressed="true"], [aria-checked="true"], .is-selected) { background: var(--ch-ink); border-color: var(--ch-ink); color: var(--ch-paper); }

.star-rating { --star-rating-initial-color: var(--ch-star); --star-rating-inactive-color: var(--ch-line-2); }
.required, :is(.form-row, .comment-form, label) .required { color: var(--ch-error); }
.woocommerce-error { background: var(--ch-paper); color: var(--ch-ink); border: 2px solid var(--ch-error); border-radius: var(--ch-radius); }
.woocommerce-error::before { color: var(--ch-error); }
.wc-empty-cart-message .cart-empty { background: var(--ch-paper); color: var(--ch-ink); border: 1px solid var(--ch-line); border-radius: var(--ch-radius); }
.ct-variation-swatches button.ct-swatch-container, .password-input .show-password-input { color: var(--ch-ink); }

.ch-stars { display: inline-flex; gap: 2px; color: var(--ch-star); }
.ch-stars svg { width: 15px; height: 15px; fill: currentColor; }

.ch-faq { display: grid; gap: 10px; }
.ch-faq details { background: var(--ch-paper); border: 1px solid var(--ch-line); border-radius: var(--ch-radius); }
.ch-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: var(--ch-target); padding: 16px 20px; box-sizing: border-box; font-weight: var(--ch-w-bold); font-size: var(--ch-fs-ui); color: var(--ch-ink); }
.ch-faq summary::-webkit-details-marker { display: none; }
.ch-faq summary::after { content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform .2s; }
.ch-faq details[open] summary::after { transform: rotate(45deg); }
.ch-faq summary h3, .ch-faq summary .ch-faq__q { margin: 0; font-size: inherit; font-weight: inherit; font-stretch: inherit; line-height: 1.4; }
.ch-faq__a { padding: 0 20px 18px; font-size: 14px; line-height: var(--ch-lh-body); color: var(--ch-text-2); }
.ch-faq__a p { margin: 0 0 .8em; }
.ch-faq__a p:last-child { margin-bottom: 0; }

@media (prefers-reduced-motion: reduce) {
  .ch-btn, .ch-faq summary::after { transition: none; }
}
.products .product [data-swatches-type="image"] .ct-swatch-container .ct-swatch { --swatch-size: 40px; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: var(--ch-paper); box-shadow: 0 0 0 1px var(--ch-line); transition: box-shadow .15s; }
.products .product [data-swatches-type="image"] .ct-swatch-container .ct-swatch img { width: 100%; height: 100%; aspect-ratio: auto; border-radius: 8px; object-fit: contain; }
.products .product [data-swatches-type="image"] .ct-swatch-container:hover .ct-swatch { box-shadow: 0 0 0 1.5px var(--ch-field); }
.products .product [data-swatches-type="image"] .ct-swatch-container[aria-pressed="true"] .ct-swatch { box-shadow: 0 0 0 2px var(--ch-ink); }
.products .product [data-swatches-type="button"] .ct-swatch-container[aria-pressed="true"] .ct-swatch { border-color: var(--ch-ink); background-color: var(--ch-ink); color: var(--ch-paper); }
