:root {
  --ink: #18202a;
  --muted: #69727d;
  --line: #e1e6e8;
  --surface: #f5f7f7;
  --teal: #087f75;
  --teal-dark: #05635b;
  --amber: #f2b544;
  --white: #fff;
}

html { min-height: 100%; }
body { color: var(--ink); background: var(--white); font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 1.55; }
a { color: var(--teal); }
a:hover, a:focus { color: var(--teal-dark); text-decoration: none; }
h1, h2, h3, h4, h5, h6 { color: var(--ink); font-weight: 700; letter-spacing: 0; }
.container { width: min(1180px, calc(100% - 32px)); }
.btn { border-radius: 5px; box-shadow: none; font-weight: 700; }
.btn-primary { background: var(--teal); border-color: var(--teal); color: var(--white); text-shadow: none; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: var(--teal-dark); border-color: var(--teal-dark); }
.form-control { border-color: #d6dcdf; border-radius: 5px; box-shadow: none; min-height: 40px; }
.form-control:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(8, 127, 117, .12); }
.demo-strip__inner:before, .demo-strip__inner:after,
.store-header__inner:before, .store-header__inner:after,
.store-nav-row:before, .store-nav-row:after,
.store-benefits__grid:before, .store-benefits__grid:after,
.store-footer__grid:before, .store-footer__grid:after { display: none !important; }

.demo-strip { background: #17212b; color: #eaf0f2; min-height: 38px; }
.demo-strip__inner { align-items: center; display: flex; gap: 12px; min-height: 38px; }
.demo-strip__inner > strong { background: var(--amber); border-radius: 3px; color: #17212b; font-size: 11px; padding: 3px 7px; }
.demo-strip__inner > span { font-size: 12px; }
.demo-strip__switches { align-items: center; display: flex; gap: 4px; margin-left: auto; }
.demo-strip__switches form { display: inline-block; }
.demo-strip__switches .btn-link { color: #fff; font-size: 12px; padding: 7px 8px; text-decoration: none; text-shadow: none; }
.demo-strip__switches .dropdown-menu { border-radius: 5px; }

.store-header { background: var(--white); border-bottom: 1px solid var(--line); }
.store-header__inner { align-items: center; display: grid; gap: 34px; grid-template-columns: 230px minmax(260px, 1fr) auto; min-height: 94px; }
.store-brand { align-items: center; color: var(--ink); display: inline-flex; gap: 11px; }
.store-brand:hover { color: var(--ink); }
.store-brand__mark { align-items: center; background: var(--teal); border-radius: 7px; color: var(--white); display: flex; font-size: 21px; height: 43px; justify-content: center; width: 43px; }
.store-brand__name { font-size: 25px; font-weight: 800; line-height: .9; }
.store-brand__name > span { color: var(--teal); }
.store-brand__name small { color: var(--muted); display: block; font-size: 9px; font-weight: 700; margin-top: 8px; text-transform: uppercase; }
.store-search #search { margin: 0; }
.store-search #search .input-lg { border-color: #d5dcde; height: 46px; padding: 0 15px; }
.store-search #search .btn-lg { background: var(--teal); border-color: var(--teal); color: #fff; height: 46px; padding: 10px 20px; text-shadow: none; }
.store-actions { align-items: center; display: flex; gap: 5px; }
.store-actions > a { align-items: center; color: var(--ink); display: flex; flex-direction: column; font-size: 11px; gap: 3px; justify-content: center; min-height: 48px; min-width: 56px; }
.store-actions > a i { color: var(--teal); font-size: 19px; }
.store-actions #cart { margin: 0; }
.store-actions #cart > .btn { background: #17212b; border: 0; border-radius: 5px; color: #fff; min-height: 45px; padding: 10px 13px; text-shadow: none; }
.store-actions #cart-total { white-space: nowrap; }

.store-nav-shell { background: var(--white); border-bottom: 1px solid var(--line); }
.store-nav-row { align-items: stretch; display: flex; min-height: 48px; }
.store-home-link { align-items: center; border-right: 1px solid var(--line); color: var(--ink); display: flex; font-weight: 700; gap: 8px; padding: 0 18px 0 0; }
.store-nav-row > #menu { background: transparent; background-image: none; border: 0; margin: 0; min-height: 48px; }
.store-nav-row > #menu { flex: 1; }
#menu .navbar-collapse { padding-left: 5px; padding-right: 0; }
#menu .nav { float: none; }
#menu .nav > li > a { color: var(--ink); font-size: 12px; font-weight: 700; min-height: 48px; padding: 14px 9px; text-shadow: none; }
#menu .nav > li > a:hover, #menu .nav > li.open > a { background: var(--surface); color: var(--teal); }
#menu .dropdown-menu { border: 1px solid var(--line); border-radius: 5px; box-shadow: 0 10px 28px rgba(23,33,43,.12); }
#menu .dropdown-inner li a:hover { background: var(--teal); }

.store-hero { background: #17212b; min-height: 460px; overflow: hidden; position: relative; }
.store-hero__media { background: url('../../../../../image/catalog/teststore/hero-techlab.png') center/cover no-repeat; inset: 0; position: absolute; }
.store-hero__media:after { background: rgba(23,33,43,.9); bottom: 0; content: ''; left: 0; position: absolute; top: 0; width: 58%; }
.store-hero__content { color: #fff; padding-bottom: 78px; padding-top: 72px; position: relative; }
.store-hero__content h1 { color: #fff; font-size: 46px; line-height: 1.1; margin: 10px 0 17px; max-width: 620px; }
.store-hero__content > p:not(.store-eyebrow) { color: #dce5e8; font-size: 17px; max-width: 560px; }
.store-hero__content .btn { margin-top: 17px; padding: 13px 21px; }
.store-hero__content .btn i { margin-left: 9px; }
.store-eyebrow { color: var(--amber); font-size: 12px; font-weight: 800; text-transform: uppercase; }

.store-benefits { background: #fff; border-bottom: 1px solid var(--line); }
.store-benefits__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.store-benefits__grid > div { align-items: center; border-right: 1px solid var(--line); display: flex; gap: 14px; min-height: 92px; padding: 17px 28px; }
.store-benefits__grid > div:first-child { border-left: 1px solid var(--line); }
.store-benefits__grid i { color: var(--teal); font-size: 24px; width: 28px; }
.store-benefits__grid strong, .store-benefits__grid small { display: block; }
.store-benefits__grid strong { font-size: 14px; }
.store-benefits__grid small { color: var(--muted); font-size: 12px; margin-top: 2px; }

.store-section { padding: 58px 0; }
.store-section--products { background: var(--surface); }
.store-section__heading { align-items: flex-end; display: flex; justify-content: space-between; margin-bottom: 25px; }
.store-section__heading p { color: var(--teal); font-size: 11px; font-weight: 800; margin: 0 0 4px; text-transform: uppercase; }
.store-section__heading h2 { font-size: 28px; margin: 0; }
.store-section__heading > a { font-weight: 700; }
.store-section__heading > a i { margin-left: 7px; }

.store-category-grid { display: grid; gap: 12px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.store-category { align-items: center; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); display: grid; gap: 12px; grid-template-columns: 56px minmax(0, 1fr) 14px; min-height: 82px; padding: 12px; transition: border-color .2s, box-shadow .2s, transform .2s; }
.store-category:hover { border-color: rgba(8,127,117,.55); box-shadow: 0 8px 22px rgba(23,33,43,.08); color: var(--ink); transform: translateY(-2px); }
.store-category img { height: 56px; object-fit: contain; width: 56px; }
.store-category strong, .store-category small { display: block; }
.store-category strong { font-size: 13px; line-height: 1.25; }
.store-category small { color: var(--muted); font-size: 11px; margin-top: 4px; }
.store-category > i { color: var(--teal); }

.store-product-grid { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.store-product { background: #fff; border: 1px solid var(--line); border-radius: 6px; display: flex; flex-direction: column; margin: 0; min-width: 0; overflow: hidden; transition: box-shadow .2s, transform .2s; }
.store-product:hover { box-shadow: 0 12px 28px rgba(23,33,43,.09); transform: translateY(-2px); }
.store-product__image { align-items: center; background: #fff; display: flex; height: 220px; justify-content: center; padding: 18px; }
.store-product__image img { height: 100%; max-width: 100%; object-fit: contain; }
.store-product__body { border-top: 1px solid #edf0f1; display: flex; flex: 1; flex-direction: column; padding: 17px; }
.store-product__model { color: var(--teal); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.store-product h3 { font-size: 15px; line-height: 1.35; margin: 6px 0 8px; min-height: 41px; }
.store-product h3 a { color: var(--ink); }
.store-product__body > p { color: var(--muted); font-size: 12px; min-height: 56px; }
.store-product__footer { align-items: center; display: flex; gap: 10px; justify-content: space-between; margin-top: auto; }
.store-product__footer > strong { color: var(--ink); font-size: 17px; }
.store-product__footer del { color: var(--muted); display: block; font-size: 11px; font-weight: 400; }
.store-product__footer .btn { height: 38px; min-width: 42px; }
.store-product__footer .btn span { display: none; }

.breadcrumb { background: transparent; margin: 20px 0; padding: 0; }
.breadcrumb > li + li:before { color: #a8b0b5; content: '/'; }
#content > h1, #content > h2 { font-size: 28px; margin-bottom: 24px; }
.product-thumb { border-color: var(--line); border-radius: 6px; overflow: hidden; }
.product-thumb .caption h4 a { color: var(--ink); font-weight: 700; }
.product-thumb .price { color: var(--ink); font-size: 17px; font-weight: 700; }
.product-thumb .button-group button { background: #fff; color: var(--ink); }
.product-thumb .button-group button:first-child { background: var(--teal); color: #fff; }
.pagination > .active > span, .pagination > .active > span:hover { background: var(--teal); border-color: var(--teal); }
.thumbnail { border-color: var(--line); border-radius: 6px; }
.nav-tabs > li.active > a { border-top: 3px solid var(--teal); }
.alert { border-radius: 5px; }

.store-footer { background: #17212b; color: #b9c3c7; margin-top: 55px; padding: 47px 0 38px; }
.store-home + .store-footer { margin-top: 0; }
.store-footer__grid { display: grid; gap: 48px; grid-template-columns: 1.5fr repeat(3, 1fr); }
.store-footer h5 { color: #fff; font-size: 13px; margin: 3px 0 16px; }
.store-footer li { margin-bottom: 7px; }
.store-footer a { color: #c8d0d3; }
.store-footer a:hover { color: #fff; }
.store-footer__brand p { font-size: 11px; margin: 16px 0 0; }
.store-brand--footer { color: #fff; }
.store-brand--footer:hover { color: #fff; }
.store-brand--footer .store-brand__name > span { color: var(--amber); }
.store-brand--footer .store-brand__mark { background: var(--amber); color: #17212b; }

@media (max-width: 991px) {
  .store-header__inner { gap: 18px; grid-template-columns: 190px 1fr; padding: 16px 0; }
  .store-search { grid-column: 1 / -1; grid-row: 2; }
  .store-actions { justify-self: end; }
  .store-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .store-benefits__grid > div { padding: 15px; }
}

@media (max-width: 767px) {
  .container { width: min(100% - 24px, 1180px); }
  .demo-strip__inner { align-items: flex-start; flex-wrap: wrap; gap: 7px; padding-bottom: 8px; padding-top: 8px; }
  .demo-strip__inner > span { flex: 1; line-height: 1.35; min-width: 170px; }
  .demo-strip__switches { flex-basis: 100%; margin-left: 0; }
  .demo-strip__switches .btn-link { padding: 2px 10px 2px 0; }
  .store-header__inner { grid-template-columns: 1fr auto; min-height: auto; }
  .store-brand__name { font-size: 22px; }
  .store-actions > a span { display: none; }
  .store-actions > a { min-width: 36px; }
  .store-actions > a:nth-child(2) { display: none; }
  .store-actions #cart > .btn { min-width: 45px; padding: 9px; }
  .store-actions #cart-total { font-size: 0; }
  .store-actions #cart-total i { font-size: 17px; }
  .store-nav-row { display: block; }
  .store-home-link { display: none; }
  .store-nav-row > #menu { margin: 0; width: 100%; }
  #menu .navbar-header { background: #17212b; border-radius: 0; }
  #menu .navbar-toggle { color: #fff; }
  #menu #category { color: #fff; }
  #menu .nav > li > a { min-height: 40px; padding: 10px 13px; }
  .store-hero { min-height: 405px; }
  .store-hero__media { background-position: 61% center; }
  .store-hero__media:after { background: rgba(23,33,43,.82); width: 100%; }
  .store-hero__content { padding-bottom: 52px; padding-top: 55px; }
  .store-hero__content h1 { font-size: 34px; }
  .store-hero__content > p:not(.store-eyebrow) { font-size: 15px; max-width: 90%; }
  .store-benefits__grid { grid-template-columns: 1fr; }
  .store-benefits__grid > div, .store-benefits__grid > div:first-child { border-bottom: 1px solid var(--line); border-left: 0; border-right: 0; min-height: 76px; }
  .store-section { padding: 42px 0; }
  .store-section__heading { align-items: flex-start; gap: 12px; }
  .store-section__heading h2 { font-size: 24px; }
  .store-category-grid { grid-template-columns: 1fr; }
  .store-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store-product__image { height: 170px; padding: 12px; }
  .store-product__body { padding: 13px; }
  .store-product__body > p { display: none; }
  .store-product h3 { font-size: 13px; min-height: 53px; }
  .store-product__footer > strong { font-size: 14px; }
  .store-footer__grid { gap: 30px; grid-template-columns: repeat(2, 1fr); }
  .store-footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 420px) {
  .store-product-grid { gap: 9px; }
  .store-product__image { height: 145px; }
  .store-product__footer .btn { min-width: 36px; padding: 8px; }
  .store-footer__grid { grid-template-columns: 1fr; }
  .store-footer__brand { grid-column: auto; }
}
