/**
 * Motor Textile — дизайн-токени (головна + внутрішні сторінки).
 * Єдине джерело для --mt-*; mt_home.css / mt_inner.css спираються на ці змінні.
 */
:root,
body.mt-home-page,
body.mt-inner-page,
body.mt-shell-active,
.mt-home {
  --mt-brand: #d32f2f;
  --mt-brand-dark: #b71c1c;
  --mt-cta: #7c5e3c;
  --mt-cta-dark: #5e4830;
  --mt-interface: #7c5e3c;
  --mt-interface-dark: #5e4830;
  --mt-bronze: #7c5e3c;
  --mt-charcoal: #2c2c2e;
  --mt-charcoal-dark: #232325;
  --mt-red: var(--mt-brand);
  --mt-red-dark: var(--mt-brand-dark);
  --mt-black: var(--mt-charcoal);
  --mt-graphite: var(--mt-charcoal);
  /* B2B: антрацит — статичні акценти; бронза — лише hover/focus/active кнопок */
  --mt-accent-static: var(--mt-graphite);
  --mt-accent-interactive: var(--mt-bronze);
  --mt-gray: #717182;
  --mt-border: #e5e7eb;
  --mt-scrollbar-thumb: #dfe1e6;
  --mt-scrollbar-thumb-hover: #b8bcc4;
  --mt-soft: #f8f9fa;
  --mt-soft-2: #f8f9fa;
  --mt-ink: var(--mt-charcoal);
  --mt-muted: var(--mt-gray);
  --mt-white: #fff;
  --mt-page-bg: #f5f7fa;
  --mt-bg: var(--mt-page-bg);
  --mt-btn-bg: var(--mt-graphite);
  --mt-btn-bg-hover: var(--mt-bronze);
  --mt-btn-grad: var(--mt-btn-bg);
  --mt-btn-grad-hover: var(--mt-btn-bg-hover);
  --mt-btn-shadow: 0 1px 2px rgba(26, 26, 27, 0.06), 0 2px 6px rgba(44, 44, 46, 0.14);
  --mt-btn-shadow-hover: 0 4px 14px rgba(124, 94, 60, 0.26);
  /* Mono: мінімальне скруглення — єдине джерело для UI */
  --mt-radius-sm: 2px;
  --mt-radius-md: 4px;
  --mt-radius-lg: 6px;
  --mt-shadow-card: 0 18px 40px rgba(26, 26, 27, 0.1);
  --mt-font: inherit;
  --mt-price-weight: 600;
  --mt-price-weight-old: 500;
  /* Канон медіа картки товару: каталог, головна, галерея (див. Mt_storefront::PRODUCT_MEDIA_RATIO_*) */
  --mt-product-media-ratio: 5 / 3;
  /* Мобільна сітка категорії (product-grid): квадратне фото */
  --mt-product-media-ratio-mobile-grid: 1 / 1;
  /* PDP gallery thumbs — збіг з OpenCart ia_width/ia_height (74×74) */
  --mt-gallery-thumb-size: 74px;
  --mt-gallery-thumb-gap: 8px;
  /* Список категорії: менший за головну (.mt-home-product__price-now — 20px) */
  --mt-listing-price-size: 17px;
  --mt-home-price-size: 20px;
  /* PDP buy box: основна ціна */
  --mt-pdp-price-size: 28px;
  --mt-pdp-price-lh: 28px;
  --mt-pdp-price-color: #404040;
  --mt-pdp-price-font: Montserrat, sans-serif;
  /* PDP buy box CTA (B2B: graphite default, bronze hover) */
  --mt-pdp-cta-font: var(--mt-pdp-price-font);
  --mt-pdp-cta-size: 28px;
  --mt-pdp-cta-lh: 28px;
  --mt-pdp-cta-color: var(--mt-pdp-price-color);
  --mt-pdp-cta-primary-bg: var(--mt-graphite);
  --mt-pdp-cta-hover-bg: var(--mt-bronze);
  /* OCFilter category bar — заголовки груп (expanded grid на десктопі) */
  --mt-filter-label-size: 13px;
  --mt-filter-label-lh: 1.35;
  --mt-filter-label-color: #404040;
  --mt-filter-label-font: Montserrat, sans-serif;
  /* Типографіка картки: без стиснутого tracking */
  --mt-card-title-size: 16px;
  --mt-card-title-size-compact: 14px;
  --mt-card-title-weight: 400;
  --mt-card-title-lh: 1.5;
  --mt-card-title-tracking: 0;
  --mt-card-caption-padding: 16px 18px 17px;
  --mt-card-caption-padding-compact: 12px 14px 14px;
  --mt-card-stock-size-compact: 12px;
  --mt-card-price-lh: 1.4;
  --mt-card-price-tracking: 0;
  /* Tech / mono: SKU, артикули, коди (system stack; GF swap — лише --mt-font-mono) */
  --mt-font-mono: ui-monospace, "Cascadia Mono", Consolas, Monaco, monospace;
  --mt-tech-lh: 1.35;
  --mt-tech-size-sm: 11px;
  --mt-tech-weight-sm: 600;
  --mt-tech-tracking-sm: 0.03em;
  --mt-tech-size-md: 14px;
  --mt-tech-weight-md: 700;
  --mt-tech-tracking-md: 0.02em;
  /* AI chat widget (global.ai_chat_widget) */
  --mt-chat-msg-size: 14px;
  --mt-chat-msg-size-desktop: 15px;
  --mt-chat-msg-lh: 1.55;
  --mt-chat-msg-lh-desktop: 1.6;
  --mt-chat-title-size: 17px;
  --mt-chat-title-size-desktop: 18px;
  --mt-chat-subtitle-size: 13px;
  --mt-chat-subtitle-size-desktop: 14px;
  --mt-chat-subtitle-color: #c9a882;
  --mt-chat-prompt-size: 13px;
  --mt-chat-prompt-size-desktop: 14px;
  --mt-chat-msg-padding-y: 0.625rem;
  --mt-chat-msg-padding-x: 0.75rem;
  --mt-chat-msg-gap: 8px;
  --mt-chat-body-padding: 0.75rem 1rem;
  --mt-chat-input-size: 16px;
  --mt-chat-input-line-height: 1.5;
  --mt-chat-input-placeholder-size: 12px;
  --mt-chat-input-placeholder-size-desktop: 12px;
  --mt-chat-input-placeholder-color: #717182;
  --mt-chat-input-min-height: 48px;
  --mt-chat-input-max-height: 120px;
  --mt-chat-input-container-radius: 20px;
  --mt-chat-input-container-padding: 8px 10px 8px 14px;
  --mt-chat-header-avatar-size: 44px;
  --mt-chat-header-avatar-size-desktop: 48px;
  --mt-chat-header-online-size: 11px;
  --mt-chat-header-online-size-desktop: 12px;
  --mt-chat-header-padding: 0.875rem 1rem 0.75rem;
  --mt-chat-header-padding-desktop: 1rem 1.125rem 0.875rem;
  --mt-chat-header-brand-gap: 12px;
  --mt-chat-online: #53a974;
  --mt-chat-chips-bg: #f0f2f5;
  --mt-chat-bot-bubble-bg: #f8f9fa;
  --mt-chat-scroll-threshold: 72px;
  /* Shell Contract (global.ai_chat_widget) — MT-owned layout */
  --mt-chat-shell-radius: 12px;
  --mt-chat-shell-gap: 16px;
  --mt-chat-shell-max-height: min(560px, calc(100vh - 120px));
  --mt-chat-shell-max-height-desktop: min(640px, calc(100vh - 120px));
  --mt-chat-shell-max-height-mobile: min(560px, calc(100dvh - 100px));
  --mt-chat-footer-padding: 0.75rem 1rem 1rem;
  --mt-chat-footer-safe-bottom: env(safe-area-inset-bottom, 0px);
  /* ui.back_top — frost glass utility (див. components.yaml ui.back_top) */
  --mt-back-top-size: 44px;
  --mt-back-top-bg-idle: rgba(255, 255, 255, 0.52);
  --mt-back-top-bg-hover: rgba(255, 255, 255, 0.96);
  --mt-back-top-border-idle: rgba(229, 231, 235, 0.55);
  --mt-back-top-border-hover: var(--mt-border);
  --mt-back-top-icon-idle: rgba(44, 44, 46, 0.55);
  --mt-back-top-icon-hover: var(--mt-charcoal);
  --mt-back-top-blur: 8px;
  --mt-back-top-shadow-idle: 0 2px 8px rgba(26, 26, 27, 0.06);
  --mt-back-top-shadow-hover: var(--mt-btn-shadow);
  /* Плаваючі FAB: нижній відступ + safe-area; offset-up лише для chat при cs-fb-widget */
  --mt-floating-inset-mobile: calc(16px + env(safe-area-inset-bottom, 0px));
  --mt-floating-inset-desktop: calc(20px + env(safe-area-inset-bottom, 0px));
  --mt-chat-launcher-size: 60px;
  --mt-floating-offset-up: 72px;
  --mt-back-top-bottom-mobile: var(--mt-floating-inset-mobile);
  --mt-back-top-bottom-desktop: var(--mt-floating-inset-desktop);
  /* NS-стікери картки (Chameleon defaults; sync з dynamic_style / адмінка) */
  --mt-sticker-special: #e65a2e;
  --mt-sticker-popular: #53a974;
  --mt-sticker-bestseller: #e9a631;
  --mt-sticker-newproduct: #557dc0;
  --mt-sticker-text: #fff;
  /* Матове скло: низька opacity tint + білий frost + blur (не суцільна плашка) */
  --mt-sticker-glass-mix: 36%;
  --mt-sticker-glass-frost-strong: rgba(255, 255, 255, 0.44);
  --mt-sticker-glass-frost-soft: rgba(255, 255, 255, 0.1);
  --mt-sticker-glass-blur: 14px;
  --mt-sticker-glass-saturate: 165%;
  --mt-sticker-pad-y: 6px;
  --mt-sticker-pad-x: 10px;
  --mt-sticker-min-height: 22px;
  --mt-sticker-radius: 2px;
  --mt-sticker-letter-spacing: 0.05em;
  /* Soft badge на світлому фоні (buybox, не фото) */
  --mt-sticker-surface-bg-mix: 12%;
  --mt-sticker-surface-border-mix: 26%;
  --mt-sticker-surface-pad-y: 4px;
  --mt-sticker-surface-pad-x: 8px;
  --mt-sticker-surface-font-size: 11px;
  --mt-sticker-surface-line-height: 1;
  --mt-sticker-surface-font: var(--mt-pdp-price-font);
  --mt-sticker-surface-font-weight: 400;
  --mt-sticker-surface-letter-spacing: 0.35px;
  --mt-sticker-surface-text-color: #808080;
  --mt-sticker-surface-popular-color: var(--mt-sticker-surface-text-color);
  /* Buy box PDP */
  --mt-buybox-spec-label-size: 11px;
  --mt-buybox-spec-value-size: 15px;
  --mt-buybox-spec-value-weight: 500;
  --mt-buybox-spec-code-size: var(--mt-tech-size-md);
  --mt-buybox-toolbar-size: 11px;
  --mt-buybox-section-gap: 20px;
  --mt-buybox-status-in: #53a974;
  --mt-buybox-status-out: #c45c5c;
  /* Qty stepper — buybox outline secondary */
  --mt-qty-stepper-h: 44px;
  --mt-qty-btn-w: 44px;
  --mt-qty-input-w: 52px;
  --mt-qty-border: var(--mt-border);
  --mt-qty-divider: var(--mt-border);
  --mt-qty-bg: #fff;
  --mt-qty-btn-hover-bg: var(--mt-bronze);
  --mt-qty-font-size: 15px;
  --mt-qty-font-weight: 500;
  /* Висота sticky header shell (desktop однорядкова шапка) */
  --mt-shell-header-height: 76px;
  /* Shell logo — mobile (≤767px, shell_header.twig) */
  --mt-shell-logo-h-mobile: 52px;
  --mt-shell-logo-max-w-mobile: min(62vw, 220px);
  /* Footer nav: secondary typography + spacing (shell_footer.twig) */
  --mt-footer-nav-heading-weight: 600;
  --mt-footer-nav-link-weight: 400;
  --mt-footer-nav-link-color: #5a5a66;
  --mt-footer-nav-section-padding-y: 24px;
  --mt-footer-nav-grid-gap: 20px;
  --mt-footer-nav-link-gap: 4px;
  --mt-footer-nav-contact-gap: 10px;
  --mt-footer-nav-heading-gap: 8px;
  --mt-footer-nav-mobile-col-gap: 40px;
  --mt-footer-nav-contact-label-size: 12px;
  --mt-footer-contact-phone-weight: 500;
  --mt-footer-contact-label-size: 11px;
  --mt-footer-meta-label-weight: 500;
  /* Footer map card (локації) */
  --mt-footer-map-title-weight: 600;
  --mt-footer-location-label-weight: 500;
  --mt-footer-location-address-weight: 500;
  /* Shell footer — блок «Про компанію» (shell.footer.about) */
  --mt-footer-about-hero-size: clamp(18px, 1.6vw, 24px);
  --mt-footer-about-title-size: clamp(20px, 2vw, 24px);
  --mt-footer-about-title-weight: 700;
  --mt-footer-about-title-lh: 1.2;
  --mt-footer-about-title-tracking: -0.01em;
  --mt-footer-about-lead-size: clamp(16px, 1.2vw, 18px);
  --mt-footer-about-lead-weight: 500;
  --mt-footer-about-display-font: var(--mt-pdp-price-font);
  --mt-footer-about-tagline-size: 17px;
  --mt-footer-about-tagline-weight: 600;
  --mt-footer-about-subhead-size: 14px;
  --mt-footer-about-subhead-weight: 600;
  --mt-footer-about-subhead-tracking: 0;
  --mt-footer-about-cta-min-h: 48px;
  --mt-footer-about-stat-number-size: clamp(22px, 2.2vw, 28px);
  --mt-footer-about-stat-label-size: 12px;
  --mt-footer-about-logo-max-w: 300px;
  /* About us (/about_us) — prose на світлому фоні (hero, cards, service) */
  --mt-about-display-font: var(--mt-pdp-price-font);
  --mt-about-lead-color: var(--mt-ink);
  --mt-about-body-color: var(--mt-ink);
  --mt-about-subtitle-size: 11px;
  --mt-about-subtitle-weight: 800;
  --mt-about-subtitle-tracking: 0.06em;
  --mt-about-title-size: clamp(20px, 1.65vw, 26px);
  --mt-about-title-weight: 800;
  --mt-about-title-lh: 1.2;
  --mt-about-title-tracking: -0.01em;
  --mt-about-lead-size: clamp(16px, 1.15vw, 18px);
  --mt-about-lead-weight: 600;
  --mt-about-lead-lh: 1.55;
  --mt-about-hero-lead-weight: 400;
  --mt-about-hero-badge-size: 11px;
  --mt-about-hero-badge-weight: 400;
  --mt-about-hero-badge-color: var(--mt-muted);
  --mt-about-hero-badge-bg: transparent;
  --mt-about-hero-badge-border: rgba(44, 44, 46, 0.12);
  --mt-about-body-size: clamp(15px, 1.05vw, 16px);
  --mt-about-body-weight: 400;
  --mt-about-body-lh: 1.65;
  --mt-about-copy-gap: 10px;
  --mt-about-intro-subtitle-gap: 8px;
  --mt-about-intro-title-gap: 14px;
  --mt-about-intro-cert-gap: 18px;
  --mt-about-soft-header-gap: 20px;
  --mt-about-soft-cards-gap: 14px;
  --mt-about-card-cta-min-h: 44px;
  --mt-about-stat-number-size: clamp(20px, 2.4vw, 36px);
  --mt-about-stat-number-color: var(--mt-ink);
  --mt-about-stat-label-size: 11px;
  --mt-about-stat-label-weight: 400;
  --mt-about-stat-label-color: var(--mt-muted);
  /* Hero body (/about_us) — текстова колонка split-layout */
  --mt-about-hero-title-size: clamp(22px, 2.2vw, 32px);
  --mt-about-hero-title-lh: 1.15;
  --mt-about-hero-title-tracking: -0.02em;
  --mt-about-hero-body-gap: 14px;
  --mt-about-hero-body-padding-y: 24px;
  --mt-about-hero-body-padding-x: 20px;
  --mt-about-hero-actions-gap: 10px;
  --mt-about-hero-btn-min-h: 44px;
  /* CTA band (/about_us) — темна фінальна секція */
  --mt-about-cta-padding-y: 112px;
  --mt-about-cta-padding-x: 24px;
  --mt-about-cta-title-size: clamp(22px, 2vw, 28px);
  --mt-about-cta-lead-max: 36em;
  --mt-about-cta-actions-gap: 12px;
  --mt-about-cta-btn-min-h: 48px;
  --mt-about-cta-on-dark-title: #fff;
  --mt-about-cta-on-dark-lead: rgba(255, 255, 255, 0.82);
  --mt-about-cta-on-dark-subtitle: #c9a882;
  --mt-about-cta-accent-line: var(--mt-bronze);
  --mt-about-cta-shadow: 0 16px 40px rgba(26, 26, 27, 0.18);
  --mt-about-cta-glow: rgba(124, 94, 60, 0.14);
  /* Home lead band — alias до about CTA */
  --mt-home-lead-padding-y: var(--mt-about-cta-padding-y);
  --mt-home-lead-padding-x: var(--mt-about-cta-padding-x);
  --mt-home-lead-form-max: 560px;
  --mt-home-lead-form-gap: 18px;
  --mt-home-lead-actions-gap: 12px;
  --mt-home-lead-padding-extra: 100px;
  --mt-home-lead-copy-form-gap: 40px;
  --mt-home-lead-eyebrow-title-gap: 40px;
  --mt-home-lead-lead-weight: 500;
  --mt-home-lead-lead-max: 390px;
  --mt-home-lead-padding-x-mobile: 24px;
  --mt-home-lead-form-inset-x-mobile: 12px;
  --mt-home-lead-row-control-h: var(--mt-about-cta-btn-min-h);
  --mt-home-lead-submit-min-w: 240px;
  --mt-home-lead-submit-grad: linear-gradient(135deg, var(--mt-cta) 0%, var(--mt-cta-dark) 100%);
  --mt-home-lead-submit-grad-hover: linear-gradient(
    135deg,
    var(--mt-about-cta-on-dark-subtitle) 0%,
    var(--mt-cta) 100%
  );
  --mt-home-lead-submit-shadow: 0 4px 14px rgba(124, 94, 60, 0.38);
  --mt-home-lead-submit-shadow-hover: 0 8px 22px rgba(124, 94, 60, 0.5);
  /* About — dark emphasis card (service / quality standards) */
  --mt-about-emphasis-accent: var(--mt-about-cta-accent-line);
  --mt-about-emphasis-shadow: 0 12px 32px rgba(26, 26, 27, 0.16);
  --mt-about-emphasis-glow: var(--mt-about-cta-glow);
  --mt-about-emphasis-subtitle: var(--mt-about-cta-on-dark-subtitle);
  --mt-about-emphasis-title: var(--mt-about-cta-on-dark-title);
  --mt-about-emphasis-lead: var(--mt-about-cta-on-dark-lead);
  --mt-about-emphasis-item-bg: rgba(255, 255, 255, 0.055);
  --mt-about-emphasis-item-border: rgba(255, 255, 255, 0.1);
  --mt-about-emphasis-item-accent: rgba(201, 168, 130, 0.42);
  --mt-about-emphasis-icon-bg: rgba(201, 168, 130, 0.14);
  --mt-about-emphasis-icon-color: var(--mt-about-cta-on-dark-subtitle);
  --mt-about-emphasis-item-title: #fff;
  --mt-about-emphasis-item-desc: rgba(255, 255, 255, 0.74);
}

.mt-price-unit,
.mt-home-product__price-unit {
  font-size: 0.72em;
  font-weight: 500;
  color: var(--mt-gray, #717182);
  letter-spacing: 0;
  white-space: nowrap;
}

/* Картки товару: назва + ціна (модулі swiper, каталог, головна) */
.product-thumb .product-name a,
.mt-home-product__title,
.mt-home-product__body h3 {
  font-size: var(--mt-card-title-size);
  font-weight: var(--mt-card-title-weight);
  line-height: var(--mt-card-title-lh);
  letter-spacing: var(--mt-card-title-tracking);
  background: transparent;
  text-decoration: none;
  -webkit-line-clamp: 2;
}

@media (max-width: 767px) {
  :root,
  body.mt-home-page,
  body.mt-inner-page,
  body.mt-shell-active,
  .mt-home {
    --mt-card-title-size: var(--mt-card-title-size-compact);
  }
}

.product-thumb .product-name {
  min-height: 0;
  margin-bottom: 10px;
}

.product-thumb .price-actions-box .price,
.product-thumb .price-actions-box .price .price-new,
.product-thumb .price-actions-box .price .price-default,
.mt-home-product__price-now {
  font-family: var(--mt-font);
  letter-spacing: var(--mt-card-price-tracking);
  line-height: var(--mt-card-price-lh);
}

.product-thumb .price-actions-box .price .price-new,
.product-thumb .price-actions-box .price .price-default {
  font-size: var(--mt-listing-price-size);
  font-weight: var(--mt-price-weight);
}

.mt-home-product__price-now {
  font-size: var(--mt-home-price-size);
  font-weight: var(--mt-price-weight);
}

/* Tech-дані: SKU, коди (composable; компоненти — через var(--mt-tech-*)) */
.mt-tech-text {
  font-family: var(--mt-font-mono);
  line-height: var(--mt-tech-lh);
  font-variant-numeric: tabular-nums;
}

.mt-tech-text--sm {
  font-size: var(--mt-tech-size-sm);
  font-weight: var(--mt-tech-weight-sm);
  letter-spacing: var(--mt-tech-tracking-sm);
}

.mt-tech-text--md {
  font-size: var(--mt-tech-size-md);
  font-weight: var(--mt-tech-weight-md);
  letter-spacing: var(--mt-tech-tracking-md);
}

/* Quickview на картках товару вимкнено (режим не використовується) */
.product-thumb .addit-action .quickview,
.container-module .addit-action .quickview,
.product-thumb .btn-quickview,
.container-module .btn-quickview {
  display: none !important;
}