/* Local Lato fonts (LatoWebMedium/Heavy/Bold/Black) are loaded via latofonts.css */

/* ===== v2: DESIGN TOKENS — pixel-accurate from ileatherman.ru ===== */
:root {
  --brand-teal: #82B4BD;
  --brand-teal-light: #ECF4F5;
  --brand-dark: #333333;
  --brand-darker: #222222;
  --brand-yellow: #FFCF06;
  --brand-white: #FFFFFF;
  --brand-gray: #6E6E6E;
  --brand-light-gray: #FAFAFA;
  --brand-border: #DDDDDD;
  --cta-orange: #E67E22;
  --cta-orange-hover: #D35400;
  --success-green: #27AE60;
  --star-gold: #F1C40F;
  --price-color: rgb(57, 59, 66);
  --max-width: 1400px;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* Mobile reset — apply ONLY on the homepage so we don't break Bootstrap layout
   on category/product/cart/account pages. */
@media (max-width: 991px) {
  body.common-home { min-width: 0 !important; max-width: 100vw !important; overflow-x: hidden; }
  body.common-home > #content,
  body.common-home > .container,
  body.common-home .row {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

/* Match v48 prototype typography */
body {
  font-family: 'Lato', 'LatoWebMedium', Arial, sans-serif;
  color: var(--brand-dark);
  background: var(--brand-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  overflow-x: hidden;
}

/* Apply theme-wide container override ONLY inside our new design wrappers.
   Bootstrap's fixed-width .container is preserved for catalog/product/cart pages. */
.top-bar > .container,
.header > .container,
.cat-nav > .container,
.footer__main > .container,
.hero > .container,
.trust-bar > .container,
.categories > .container,
.why-us > .container,
.compare > .container,
.reviews > .container,
.faq > .container,
.seo-text > .container,
.subscribe > .container {
  width: auto !important;
  max-width: var(--max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box;
}

/* Kill Bootstrap clearfix pseudo-elements inside our flex-based blocks */
.top-bar > .container::before,    .top-bar > .container::after,
.header > .container::before,     .header > .container::after,
.cat-nav > .container::before,    .cat-nav > .container::after,
.footer__main > .container::before, .footer__main > .container::after,
.hero > .container::before,       .hero > .container::after,
.trust-bar > .container::before,  .trust-bar > .container::after,
.categories > .container::before, .categories > .container::after,
.why-us > .container::before,     .why-us > .container::after,
.compare > .container::before,    .compare > .container::after,
.reviews > .container::before,    .reviews > .container::after,
.faq > .container::before,        .faq > .container::after,
.seo-text > .container::before,   .seo-text > .container::after,
.subscribe > .container::before,  .subscribe > .container::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 768px) {
  .top-bar > .container,
  .header > .container,
  .cat-nav > .container,
  .footer__main > .container,
  .hero > .container,
  .trust-bar > .container,
  .categories > .container,
  .why-us > .container,
  .compare > .container,
  .reviews > .container,
  .faq > .container,
  .seo-text > .container,
  .subscribe > .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
@media (max-width: 480px) {
  .top-bar > .container,
  .header > .container,
  .cat-nav > .container,
  .footer__main > .container,
  .hero > .container,
  .trust-bar > .container,
  .categories > .container,
  .why-us > .container,
  .compare > .container,
  .reviews > .container,
  .faq > .container,
  .seo-text > .container,
  .subscribe > .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img { max-width: 100%; height: auto; }
a { text-decoration: none; color: inherit; }

/* Reset Bootstrap's default heading margins inside our new design blocks (h1-h6 get margin-top:20px from Bootstrap's _type.scss) */
.hero h1, .hero h2, .hero h3,
.trust-bar h1, .trust-bar h2, .trust-bar h3,
.categories h1, .categories h2, .categories h3,
.why-us h1, .why-us h2, .why-us h3,
.compare h1, .compare h2, .compare h3,
.reviews h1, .reviews h2, .reviews h3,
.faq h1, .faq h2, .faq h3,
.seo-text h1, .seo-text h2, .seo-text h3,
.subscribe h1, .subscribe h2, .subscribe h3,
.footer h1, .footer h2, .footer h3, .footer h4 {
  margin-top: 0;
}