/* "Thread Line" design (Dev chose direction C, 2026-10-17; design canvas https://claude.ai/artifact/QFmtApAEA3mbA17WB9EMyz).
   Bold orange, black ink, 2 px black outlines, an overlock zig-zag under the header, Archivo (expanded for headings)
   and DM Mono for part numbers. Loaded after every other stylesheet; removing this one file returns the old look.
   Contrast: text on orange is black (#111 on #F25900 ≈ 5.6:1); white only for big headings (≥ 24 px). */

@font-face { font-family: 'Archivo'; src: url('../fonts/archivo-thread.woff2') format('woff2'); font-weight: 400 800; font-stretch: 100% 118%; font-style: normal; font-display: swap; }
@font-face { font-family: 'DM Mono'; src: url('../fonts/dmmono-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'DM Mono'; src: url('../fonts/dmmono-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --t-orange: #F25900;
  --t-orange-ink: #B33E00;   /* orange text on white */
  --t-ink: #111111;
  --t-ink-2: #444444;
  --t-line: #111111;
  --t-soft: #F6F6F6;
  --t-cream: #FFF1E8;
  --t-green: #107C41;
  --t-ok-bg: #E3F2E8;
  --t-ok: #0F5A2D;
  --t-r: 18px;
  --t-font: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --t-mono: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ---------- 1. Type ---------- */
body { font-family: var(--t-font); color: var(--t-ink); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .block-header__title, .section-header__title, .block-categories__title, .mf-title, .product__title, .footer-links__title, .footer-contacts__title {
  font-family: var(--t-font); font-stretch: 116%; font-weight: 800; letter-spacing: -.02em; color: var(--t-ink);
}
.t-mono, .product-card__meta, .breadcrumb, .product__meta, .product-card__meta-title { font-family: var(--t-mono); }

/* ---------- 2. Header: orange bar, logo on black, black-outlined search ---------- */
.site__mobile-header .mobile-header { background: var(--t-orange) !important; box-shadow: none !important; }
.site__mobile-header .mobile-header__body { min-height: 60px; }
.site__mobile-header .mobile-header__menu-button { color: var(--t-ink); }
.site__mobile-header .mobile-header__menu-button svg { fill: var(--t-ink); }
.site__mobile-header .mobile-indicator__button { color: var(--t-ink); }
.site__mobile-header .mobile-indicator__icon svg { fill: var(--t-ink); }
.site__mobile-header .mobile-indicator__counter { background: var(--t-ink) !important; color: #fff !important; }
.t-logo { display: inline-flex; align-items: center; gap: 9px; color: var(--t-ink) !important; text-decoration: none !important; }
.t-logo__mark { width: 36px; height: 36px; border-radius: 10px; background: var(--t-ink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.t-logo__mark img { width: 24px; height: 24px; display: block; }
.t-logo__name { font: 800 16px/1 var(--t-font); font-stretch: 112%; letter-spacing: -.01em; white-space: nowrap; }
body.ss-scrolled .mobile-header { background: var(--t-orange) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }

/* always-visible search under the phone header */
.t-msearch { display: none; }
@media (max-width: 1199px) {
  .t-msearch { display: block; background: var(--t-orange); padding: 0 12px 12px; }
  .t-msearch form { display: flex; align-items: center; gap: 8px; background: #fff; border: 2px solid var(--t-ink); border-radius: 14px; padding: 0 5px 0 12px; height: 50px; }
  .t-msearch input { flex: 1; min-width: 0; border: 0; outline: 0; font: 500 15px var(--t-font); background: transparent; color: var(--t-ink); }
  .t-msearch input::placeholder { color: #5A5A5A; }
  .t-msearch button svg { fill: #fff; }
  .t-msearch button { width: 40px; height: 40px; border-radius: 10px; border: 0; background: var(--t-ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
  .site__mobile-header .mobile-indicator--search { display: none !important; }
}

/* desktop header: flat orange instead of the "spaceship" shapes */
.site__header .header { background: var(--t-orange) !important; }
.site__header .header__topbar-start-bg, .site__header .header__topbar-end-bg { background: var(--t-ink) !important; }
.site__header .header__topbar-start-bg::before, .site__header .header__topbar-end-bg::before,
.site__header .header__topbar-start-bg::after, .site__header .header__topbar-end-bg::after { background: var(--t-ink) !important; }
.site__header .header__navbar, .site__header .header__navbar a, .site__header .main-menu__link { color: var(--t-ink) !important; font-weight: 700; }
.site__header .header__search .search__body { border: 2px solid var(--t-ink); border-radius: 14px; overflow: hidden; background: #fff; }
.site__header .indicator__title, .site__header .indicator__value { color: var(--t-ink) !important; }
.site__header .indicator__counter { background: var(--t-ink) !important; color: #fff !important; }

/* overlock zig-zag where the orange header meets the page (not on the header itself, so the sticky header never moves the page) */
.site__body::before {
  content: ""; display: block; height: 14px;
  background: linear-gradient(135deg, var(--t-orange) 33%, transparent 33%) 0 0 / 14px 14px,
              linear-gradient(225deg, var(--t-orange) 33%, transparent 33%) 0 0 / 14px 14px;
  background-color: transparent;
}

/* ---------- 3. Buttons ---------- */
.btn-primary, .add-to-cart, .product-buy-strip__btn-cart, .checkout .btn-primary, .cart .btn-primary, .mf-pick .btn {
  background: var(--t-orange) !important; background-image: none !important; color: var(--t-ink) !important;
  border: 2px solid var(--t-ink) !important; border-radius: 12px !important; font-family: var(--t-font) !important;
  font-weight: 800 !important; font-stretch: 108%; box-shadow: none !important; text-transform: none !important;
}
.btn-primary:hover, .add-to-cart:hover, .mf-pick .btn:hover { transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--t-ink) !important; filter: none; }
.btn-secondary { background: #fff !important; color: var(--t-ink) !important; border: 2px solid var(--t-ink) !important; border-radius: 12px !important; font-weight: 800 !important; }

/* ---------- 4. Product cards ---------- */
.product-card { border: 2px solid var(--t-line) !important; border-radius: var(--t-r) !important; box-shadow: none !important; overflow: hidden; background: #fff; }
.product-card:hover { box-shadow: 5px 5px 0 var(--t-orange) !important; }
.product-card .product-card__image { background: var(--t-soft); border-bottom: 2px solid var(--t-line); margin: 0 !important; padding: 10px; }
.product-card .image__tag { mix-blend-mode: multiply; }
.product-card .product-card__name a { color: var(--t-ink) !important; font-weight: 800 !important; font-size: 14.5px; line-height: 1.3; }
.product-card .product-card__meta { color: var(--t-ink-2) !important; font-size: 11.5px !important; }
.product-card .product-card__meta a { color: var(--t-ink-2) !important; }
.product-card .product-card__price, .product-card .product-card__price--current, .product-card .product-card__price--new {
  color: var(--t-ink) !important; font-family: var(--t-font); font-stretch: 116%; font-weight: 800 !important; font-size: 20px !important; letter-spacing: -.02em;
}
.product-card .product-card__price--old { color: #6A6A6A !important; font-weight: 500 !important; }
.product-card .status-badge__body { background: var(--t-ink) !important; border-radius: 999px !important; box-shadow: none !important; }
.product-card .status-badge__text { color: #fff !important; font-family: var(--t-mono); font-weight: 500; letter-spacing: .02em; }
.product-card .add-to-cart { border-radius: 12px !important; }
.ss-request { border: 2px solid var(--t-ink) !important; color: var(--t-ink) !important; border-radius: 12px !important; font-weight: 800 !important; }
.ss-request:hover { background: var(--t-orange) !important; color: var(--t-ink) !important; }

/* ---------- 5. Section and page titles ---------- */
.section-header__title { font-size: 26px !important; }
.section-header__divider, .section-header__spring { border-color: var(--t-ink) !important; }
.section-header__divider { background: var(--t-ink) !important; height: 2px !important; }
.block-header__title { font-size: clamp(28px, 4vw, 44px) !important; line-height: 1.02; }
.breadcrumb, .breadcrumb a { color: var(--t-ink-2) !important; font-size: 12.5px; }
.decor, .decor__body, .decor__start, .decor__end, .decor__center { display: none !important; }

/* ---------- 6. Machine finder (home) ---------- */
.mf-card { border: 2px solid var(--t-line) !important; border-radius: var(--t-r) !important; box-shadow: none !important; }
.mf-card:hover { box-shadow: 5px 5px 0 var(--t-orange) !important; transform: translate(-2px, -2px); }
.mf-card__img { background: var(--t-soft) !important; border-bottom: 2px solid var(--t-line); }
.mf-card__model { font-stretch: 116%; font-weight: 800 !important; }
.mf-card__count, .mf-card__cta { color: var(--t-orange-ink) !important; font-weight: 800 !important; }
.mf-chip { border: 2px solid var(--t-ink) !important; border-radius: 999px !important; font-weight: 800 !important; color: var(--t-ink) !important; background: #fff !important; }
.mf-chip.is-on { background: var(--t-ink) !important; color: #fff !important; }
.mf-pick { border: 2px solid var(--t-ink) !important; border-radius: 20px !important; box-shadow: none !important; background: #fff !important; }
.mf-pick select { border: 2px solid var(--t-ink) !important; border-radius: 12px !important; }

/* ---------- 7. Footer: black ---------- */
.site-footer, .site__footer .site-footer { background: var(--t-ink) !important; color: #CFCFCF !important; }
.site-footer a, .site-footer .footer-links__link, .site-footer .footer-contacts__text { color: #E6E6E6 !important; }
.site-footer .footer-links__title, .site-footer .footer-contacts__title { color: #fff !important; }
.site-footer__bottom { background: #000 !important; color: #BDBDBD !important; }

/* ---------- 8. Phone action bar: Call · WhatsApp · Cart ---------- */
@media (max-width: 767px) {
  .ss-actionbar { border-top: 2px solid var(--t-ink); box-shadow: none !important; grid-template-columns: 1fr 1.3fr 54px; display: grid !important; }
  .ss-actionbar a { border-radius: 14px !important; font-weight: 800 !important; }
  .ss-actionbar__call { border: 2px solid var(--t-ink) !important; color: var(--t-ink) !important; }
  .ss-actionbar__wa { background: var(--t-green) !important; }
  .ss-actionbar__cart { background: var(--t-orange); color: var(--t-ink) !important; position: relative; }
  .ss-actionbar__cart b { position: absolute; top: 3px; right: 5px; min-width: 17px; height: 17px; border-radius: 9px; background: var(--t-ink); color: #fff; font: 500 10px/17px var(--t-mono); text-align: center; padding: 0 3px; }
}
.ss-actionbar__cart { display: none; }
@media (max-width: 767px) { .ss-actionbar__cart { display: flex; } }

/* ---------- 9. Home hero (views/home-hero.ts) ---------- */
body:has(.t-hero) .block-slideshow { display: none !important; }
.t-hero { background: var(--t-orange); padding: 18px 0 44px; position: relative; overflow: hidden; }
/* home: the orange header runs straight into the hero; the zig-zag sits under the hero instead */
body:has(.t-hero) .site__body::before { display: none; }
.t-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 14px; z-index: 2;
  background: linear-gradient(135deg, #fff 33%, transparent 33%) 0 0 / 14px 14px, linear-gradient(225deg, #fff 33%, transparent 33%) 0 0 / 14px 14px;
  transform: rotate(180deg); }
.t-hero__in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: center; position: relative; z-index: 1; }
@media (min-width: 992px) { .t-hero__in { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 30px; padding: 26px 0 30px; } }
.t-hero h1 { font-size: clamp(38px, 6.4vw, 84px); line-height: .94; margin: 0 0 14px; color: var(--t-ink); }
.t-hero h1 span { color: #fff; }
.t-hero__lede { font: 500 clamp(15.5px, 1.4vw, 19px)/1.5 var(--t-font); margin: 0 0 20px; max-width: 540px; color: var(--t-ink); }
.t-finder { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; background: var(--t-ink); border-radius: 20px; padding: 14px; max-width: 660px; }
@media (min-width: 768px) { .t-finder { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; } }
.t-finder label { display: block; font: 500 11.5px var(--t-mono); color: #C9C9C9; padding: 0 4px 6px; letter-spacing: .04em; }
.t-finder select { width: 100%; height: 50px; border-radius: 12px; border: 1.5px solid #3A3A3A; background: #1D1D1D; color: #fff; font: 700 15px var(--t-font); padding: 0 12px; }
.t-finder button { height: 52px; border-radius: 12px; border: 0; background: var(--t-orange); color: var(--t-ink); font: 800 16px var(--t-font); font-stretch: 112%; padding: 0 20px; white-space: nowrap; cursor: pointer; }
.t-hero__wa { display: inline-flex; align-items: center; gap: 10px; margin-top: 14px; color: var(--t-ink) !important; font-weight: 800; text-decoration: none !important; font-size: 16px; }
.t-hero__wa i { width: 40px; height: 40px; border-radius: 50%; background: var(--t-green); display: inline-flex; align-items: center; justify-content: center; }
.t-disc { position: relative; width: min(78vw, 440px); aspect-ratio: 1; justify-self: center; }
.t-disc__w { position: absolute; inset: 0; border-radius: 50%; background: #fff; border: 3px solid var(--t-ink); }
.t-disc__ring { position: absolute; inset: 4%; border-radius: 50%; border: 3px dashed var(--t-orange); }
.t-disc img { position: absolute; left: 50%; top: 50%; width: 74%; height: 74%; transform: translate(-50%, -50%); object-fit: contain; }
.t-tag { position: absolute; background: var(--t-ink); color: #fff; border-radius: 999px; padding: 8px 13px; font: 500 12.5px var(--t-mono); white-space: nowrap; text-decoration: none !important; }
.t-tag b { color: var(--t-orange); font-weight: 500; }
.t-tag:hover { color: #fff; }
.t-thread { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.t-thread path { fill: none; stroke: var(--t-ink); stroke-width: 3; stroke-linecap: round; }
.t-thread .t-st { stroke: #fff; stroke-dasharray: 2 15; animation: t-feed 7s linear infinite; }
@keyframes t-feed { to { stroke-dashoffset: -170; } }
.t-trust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 2px solid var(--t-ink); border-radius: 20px; overflow: hidden; margin: 26px 0 8px; list-style: none; padding: 0; }
@media (min-width: 992px) { .t-trust { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.t-trust li { padding: 14px 16px; border-right: 2px solid var(--t-ink); border-bottom: 2px solid var(--t-ink); margin: 0; }
.t-trust li a { color: inherit !important; text-decoration: none !important; display: block; }
.t-trust b { display: block; font: 800 22px/1.1 var(--t-font); font-stretch: 118%; letter-spacing: -.02em; }
.t-trust span { display: block; font-size: 13px; color: var(--t-ink-2); margin-top: 3px; font-weight: 500; }
@media (max-width: 991px) { .t-trust li:nth-child(2n) { border-right: 0; } .t-trust li:nth-last-child(-n+2) { border-bottom: 0; } }
@media (min-width: 992px) { .t-trust li { border-bottom: 0; } .t-trust li:last-child { border-right: 0; } }

@media (prefers-reduced-motion: reduce) { .t-thread .t-st { animation: none; } }

/* the empty spacer that sat between the old banner and the hero */
.block-space:has(+ .t-hero) { display: none; }

/* ---------- 10. Header fit-and-finish ---------- */
.site__header, .site__mobile-header { background: var(--t-orange) !important; }
.site__mobile-header .mobile-header__menu-button { background: transparent !important; border: 0 !important; }
.t-logo--lg { gap: 12px; }
.t-logo--lg .t-logo__mark { width: 46px; height: 46px; border-radius: 12px; }
.t-logo--lg .t-logo__mark img { width: 30px; height: 30px; }
.t-logo--lg .t-logo__name { font-size: 22px; }

/* ---------- 11. Fixes after the first look (2026-10-17) ---------- */
/* home: the empty spacer at the top of the page body showed as a white band under the header */
body:has(.t-hero) .site__body > .block-space--layout--divider-xs:first-child { display: none; }
/* product page "Part fit for" box: readable green on light green, outlined like the rest of design C */
.product__fit .status-badge__body { background: var(--t-ok-bg) !important; border: 2px solid var(--t-ink); border-radius: 14px !important; box-shadow: none !important; }
.product__fit .status-badge__text, .product__fit .status-badge__text a { color: var(--t-ok) !important; font-weight: 700; }
.product__fit .status-badge__icon svg { fill: var(--t-ok) !important; }
/* desktop header: the logo name at a size that leaves room for the menu */
.t-logo--lg .t-logo__name { font-size: 19px; }
.t-logo--lg .t-logo__mark { width: 42px; height: 42px; }
.site__header .header__navbar-departments .departments__button { white-space: nowrap; }
.site__header .main-menu__link, .site__header .header__navbar a { font-weight: 600 !important; font-size: 14.5px; white-space: nowrap; }
.site__header .departments__button-title { white-space: nowrap; }
.site__header .main-menu__list { flex-wrap: nowrap; }

/* ---------- 12. Product page (design C stage 2, 2026-10-17) ---------- */
.product-gallery__featured { border: 3px solid var(--t-ink); border-radius: 26px; overflow: hidden; background: #fff; position: relative; }
.product-gallery__featured::after { content: ""; position: absolute; inset: 10px; border: 2px dashed var(--t-orange); border-radius: 18px; pointer-events: none; }
.product-gallery__thumbnails-item { border: 2px solid var(--t-ink) !important; border-radius: 14px !important; overflow: hidden; }
.product-gallery__thumbnails-item--active { border-color: var(--t-orange) !important; box-shadow: 0 0 0 2px var(--t-orange); }
.product-gallery__zoom { background: var(--t-ink) !important; border-radius: 50% !important; }
.product-gallery__zoom svg { fill: #fff !important; }
.product-category-badge { display: inline-block; font: 500 11.5px var(--t-mono) !important; letter-spacing: .04em; text-transform: uppercase; border: 2px solid var(--t-ink) !important; border-radius: 999px !important; padding: 4px 10px !important; background: #fff !important; color: var(--t-ink) !important; }
.product__header.header__new h1, .product__title { font-size: clamp(26px, 3.2vw, 40px) !important; line-height: 1.04 !important; margin: 10px 0 12px !important; }
.product-mini-codes { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.product-mini-codes span { font: 500 12.5px var(--t-mono); border: 2px solid var(--t-ink); border-radius: 999px; padding: 5px 11px; background: #fff; color: var(--t-ink); }
.product-mini-codes strong { font-family: var(--t-font); font-weight: 700; margin-right: 2px; }
.t-fits { border: 2px solid var(--t-ink); border-radius: 18px; padding: 12px 14px; margin: 4px 0 14px; background: #fff; }
.t-fits__h { font-weight: 800; font-size: 15px; margin-bottom: 8px; }
.t-fits__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.t-chip { display: inline-flex; align-items: center; font: 500 12.5px var(--t-mono); border: 2px solid var(--t-ink); border-radius: 10px; padding: 5px 9px; color: var(--t-ink); background: #fff; }
.t-chip--main { background: var(--t-ink); color: #fff !important; text-decoration: none !important; font-family: var(--t-font); font-weight: 700; }
.t-chip--main:hover { background: var(--t-orange); color: var(--t-ink) !important; }
.t-more { display: contents; }
.t-more summary { display: inline-flex; align-items: center; cursor: pointer; list-style: none; font: 800 13px var(--t-font); color: var(--t-orange-ink); border: 2px solid var(--t-orange); border-radius: 10px; padding: 4px 9px; }
.t-more summary::-webkit-details-marker { display: none; }
.t-more[open] summary { display: none; }
.product-buy-strip { border: 3px solid var(--t-ink) !important; border-radius: 22px !important; padding: 18px !important; background: #fff !important; box-shadow: none !important; }
.product-buy-strip__prices { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.product-buy-strip__price-current { font-family: var(--t-font) !important; font-stretch: 118%; font-weight: 800 !important; font-size: clamp(34px, 4vw, 46px) !important; letter-spacing: -.03em; color: var(--t-ink) !important; }
.t-gst { font-size: 13.5px; color: var(--t-ink-2); font-weight: 600; }
.product-buy-strip__price-was { color: #6A6A6A !important; }
.product-buy-strip__save { background: var(--t-ink) !important; color: #fff !important; border-radius: 999px !important; font-family: var(--t-mono); font-weight: 500 !important; }
.product-buy-strip__stock--ok { background: var(--t-ok-bg); color: var(--t-ok) !important; border-radius: 999px; padding: 5px 11px; font-weight: 800 !important; }
.product-buy-strip__stock-dot { background: var(--t-ok) !important; }
.product-buy-strip__qty-row .input-number__input { border: 2px solid var(--t-ink) !important; border-radius: 12px !important; font-family: var(--t-mono); }
.product-buy-strip__btn-cart { height: 56px; font-size: 17px !important; border-width: 3px !important; }
.t-fitwa { display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; margin-top: 10px; border-radius: 12px; background: var(--t-green); color: #fff !important; font-weight: 800; font-size: 15.5px; text-decoration: none !important; }
.t-fitwa:hover { filter: brightness(1.08); color: #fff !important; }
.t-deliv { margin-top: 14px; border-top: 2px dashed #CFCFCF; padding-top: 12px; }
.t-deliv__l { display: block; font-weight: 800; font-size: 14.5px; margin-bottom: 8px; }
.t-deliv__row { display: flex; gap: 8px; }
.t-deliv__row input { flex: 1; min-width: 0; height: 48px; border: 2px solid var(--t-ink); border-radius: 12px; padding: 0 12px; font: 500 15px var(--t-mono); }
.t-deliv__row button { height: 48px; border: 0; border-radius: 12px; background: var(--t-ink); color: #fff; font: 800 15px var(--t-font); padding: 0 18px; cursor: pointer; }
.t-deliv__out { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--t-ink); min-height: 1px; }
.t-deliv__out b { color: var(--t-ok); }
.product-buy-strip__features { gap: 8px !important; }
.product-buy-strip__feature { border: 2px solid var(--t-ink) !important; border-radius: 14px !important; box-shadow: none !important; background: #fff !important; }
.product-buy-strip__feature-icon { background: var(--t-orange) !important; color: var(--t-ink) !important; border-radius: 10px !important; }
.product-buy-strip__feature-content h4 { font-weight: 800 !important; }
.product-tabs__list, .product-tabs .product-tabs__item a { font-weight: 800 !important; }
.product-tabs__item--active a, .product-tabs__item--active { border-color: var(--t-orange) !important; }
.spec__row, .product-spec-table td, .product-spec-table th { border-color: #DDD !important; }
.ss-fitcheck, .ss-paint-xsell { border: 2px solid var(--t-ink) !important; border-radius: 18px !important; }