:root {
  --gb-ink: #090908;
  --gb-muted: #514c45;
  --gb-ivory: #f8f5ef;
  --gb-paper: #fffdf9;
  --gb-line: #ded7ca;
  --gb-gold: #b9934b;
  --gb-gold-dark: #8f6c2f;
  --gb-success: #48634f;
  --gb-serif: "Lora", Georgia, "Times New Roman", serif;
  --gb-sans: "Manrope", Arial, Helvetica, sans-serif;
  --gb-shadow: 0 18px 50px rgba(32, 26, 17, .08);
}

html { scroll-behavior: smooth; }
body {
  background: var(--gb-paper);
  color: var(--gb-ink);
  font-family: var(--gb-sans);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .01em;
}

@media (min-width: 1200px) {
  .goodbrands-theme .container {
    width: calc(100% - 64px);
    max-width: 1380px;
  }
}

a { color: inherit; transition: color .2s ease, opacity .2s ease; }
a:hover, a:focus { color: var(--gb-gold-dark); text-decoration: none; }

.gb-announcement {
  background: #e8d8c2;
  color: #292526;
  padding: 8px 16px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 12px;
  font-weight: 600;
}
.gb-announcement span { color: #a87931; }

#top {
  background: #fafafa;
  border: 0;
  border-bottom: 1px solid var(--gb-line);
  min-height: 36px;
  padding: 0;
}
#top .container { padding-top: 2px; }
#top .btn-link, #top-links a {
  color: #35322e;
  text-shadow: none;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
}
header {
  background: #fff;
  border-bottom: 1px solid var(--gb-line);
}
header .container {
  padding-bottom: 14px;
  padding-top: 14px;
}
header .row {
  align-items: center;
  display: grid;
  gap: 28px;
  grid-template-columns: 330px minmax(280px, 1fr) 240px;
  margin: 0;
  min-height: 78px;
  position: relative;
}
header .row > div {
  float: none;
  min-height: 0;
  padding: 0;
  position: static;
  width: auto;
}
.gb-header-logo {
  grid-column: 1;
  max-width: 330px;
}
.gb-header-search {
  grid-column: 2;
  position: static !important;
  transform: none;
  width: auto !important;
}
.gb-header-cart {
  display: block;
  grid-column: 3;
}
#logo { margin: 0; text-align: left; }
#logo a { display: inline-block; color: var(--gb-ink); }
#logo img {
  display: inline-block;
  height: auto;
  max-height: 76px;
  max-width: 320px;
  object-fit: contain;
  width: 100%;
}
#logo .gb-wordmark {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}
.gb-monogram {
  font-family: var(--gb-serif);
  font-size: 52px;
  letter-spacing: -.18em;
  margin-left: -.18em;
}
.gb-name {
  margin-top: 7px;
  font-family: var(--gb-serif);
  font-size: 19px;
  letter-spacing: .34em;
  text-transform: uppercase;
}
.gb-tagline {
  color: var(--gb-muted);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .24em;
  margin-top: 9px;
  text-transform: uppercase;
}

#search .input-lg {
  border: 1px solid #ece8e5;
  border-radius: 0;
  box-shadow: none;
  height: 42px;
  padding-left: 14px;
  background: #faf9f9;
  font-size: 14px;
  font-weight: 500;
}
#search .btn-lg {
  background: #faf9f9;
  border: 1px solid #ece8e5;
  border-left: 0;
  border-radius: 0;
  color: var(--gb-ink);
  height: 42px;
}
#cart > .btn {
  background: #fff;
  border: 1px solid var(--gb-ink);
  border-radius: 0;
  box-shadow: none;
  color: var(--gb-ink);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  min-height: 42px;
  text-shadow: none;
  width: 100%;
}

#menu {
  background: #fff;
  border: 0;
  border-radius: 0;
  border-top: 1px solid var(--gb-line);
  border-bottom: 1px solid var(--gb-line);
  box-shadow: none;
  min-height: 48px;
  margin-bottom: 0;
  max-width: none;
  padding-left: max(16px, calc((100% - 1380px) / 2 + 32px));
  padding-right: max(16px, calc((100% - 1380px) / 2 + 32px));
  width: 100%;
}
#menu .nav > li > a {
  color: var(--gb-ink);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .11em;
  padding: 16px 18px 14px;
  text-shadow: none;
  text-transform: uppercase;
}
#menu .nav > li > a:hover, #menu .nav > li.open > a {
  background: transparent;
  color: var(--gb-gold-dark);
}
#menu .dropdown-menu {
  border: 1px solid var(--gb-line);
  border-radius: 0;
  box-shadow: var(--gb-shadow);
  padding: 16px;
}
#menu .dropdown-menu a {
  color: #292724;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.45;
  padding: 10px 14px;
}
@media (min-width: 768px) {
  #menu .nav {
    display: flex;
    float: none;
    flex-wrap: wrap;
    justify-content: center;
  }
}

.gb-hero {
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  max-width: 1440px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #070707, #171513);
  color: #fff;
  text-align: center;
}
.gb-hero__content {
  padding: 48px 28px;
  position: relative;
  width: 100%;
  z-index: 2;
}
.gb-eyebrow {
  color: var(--gb-gold-dark);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .25em;
  text-transform: uppercase;
}
.gb-hero h1 {
  font-family: var(--gb-serif);
  color: #fff;
  font-size: clamp(44px, 4vw, 62px);
  font-weight: 500;
  line-height: 1.05;
  margin: 16px 0 18px;
}
.gb-hero p {
  color: #eeeae4;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.65;
  margin-left: auto;
  margin-right: auto;
  max-width: 680px;
}
.gb-button, .btn-primary, .btn-default.gb-dark {
  background: var(--gb-ink);
  border: 1px solid var(--gb-ink);
  border-radius: 0;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  margin-top: 20px;
  padding: 15px 26px;
  text-shadow: none;
  text-transform: uppercase;
}
.gb-button:hover, .btn-primary:hover, .btn-primary:focus {
  background: var(--gb-gold-dark);
  border-color: var(--gb-gold-dark);
  color: #fff;
}
.gb-button--light { background: transparent; color: var(--gb-ink); }
.gb-hero .gb-button {
  background: transparent;
  border-color: #fff;
}
.gb-hero .gb-button:hover,
.gb-hero .gb-button:focus {
  background: #fff;
  border-color: #fff;
  color: #090908;
}

.gb-category-showcase {
  background: var(--gb-paper);
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 1380px;
  padding: 18px 0 0;
}
.gb-category-card {
  align-items: center;
  background: #f3ece4;
  border-bottom: 2px solid transparent;
  color: var(--gb-ink);
  display: flex;
  font-size: 14px;
  font-weight: 600;
  justify-content: center;
  letter-spacing: .07em;
  min-height: 92px;
  padding: 16px 10px;
  text-align: center;
  text-transform: uppercase;
}
.gb-category-card:nth-child(even) { background: #ece1d3; }
.gb-category-card:hover,
.gb-category-card:focus {
  border-bottom-color: var(--gb-gold);
  color: var(--gb-gold-dark);
}

.gb-benefits {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--gb-line);
  background: var(--gb-paper);
}
.gb-benefit { padding: 28px 18px; text-align: center; border-right: 1px solid var(--gb-line); }
.gb-benefit:last-child { border-right: 0; }
.gb-benefit strong {
  display: block;
  font-family: var(--gb-serif);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 5px;
}
.gb-benefit span { color: #59534b; font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }

#content { min-height: 500px; }
#content > h2, .gb-section-title {
  font-family: var(--gb-serif);
  font-size: 42px;
  font-weight: 600;
  letter-spacing: .01em;
  margin: 65px 0 32px;
  text-align: center;
}
#content > h2:after, .gb-section-title:after {
  background: var(--gb-gold);
  content: "";
  display: block;
  height: 1px;
  margin: 17px auto 0;
  width: 70px;
}
.breadcrumb {
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  margin: 18px 0;
  padding: 12px 0;
  text-transform: uppercase;
}
.breadcrumb > li + li:before { color: var(--gb-gold); content: "—"; }

.product-layout { margin-bottom: 30px; }
.product-thumb {
  background: #fff;
  border: 0;
  margin-bottom: 15px;
  overflow: hidden;
  position: relative;
}
.product-thumb .image { background: var(--gb-ivory); overflow: hidden; position: relative; }
.product-thumb .image img { transition: transform .55s cubic-bezier(.2,.6,.3,1); width: 100%; }
.product-thumb:hover .image img { transform: scale(1.035); }
.product-thumb .caption { min-height: 140px; padding: 19px 8px 10px; text-align: center; }
.product-thumb h4 {
  font-family: var(--gb-serif);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 9px;
}
.product-thumb .description { color: var(--gb-muted); font-size: 13px; font-weight: 500; line-height: 1.65; }
.product-thumb .price {
  color: var(--gb-ink);
  font-family: var(--gb-sans);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .04em;
}
.product-thumb .price-old { color: #a49c90; margin-left: 7px; }
.product-thumb .price-new { color: var(--gb-gold-dark); }
.product-thumb .button-group {
  background: rgba(255,253,249,.96);
  border: 0;
  bottom: 0;
  display: flex;
  left: 0;
  opacity: 0;
  position: absolute;
  transform: translateY(10px);
  transition: .25s ease;
  width: 100%;
}
.product-thumb:hover .button-group { opacity: 1; transform: translateY(0); }
.product-thumb .button-group button {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--gb-line);
  color: var(--gb-ink);
  font-size: 11px;
  letter-spacing: .08em;
  min-height: 45px;
  text-shadow: none;
  text-transform: uppercase;
}
.product-thumb .button-group button:hover { background: var(--gb-ink); color: #fff; }
.rating .fa-star, .rating .fa-star-o { color: var(--gb-gold); }

.gb-brands { background: var(--gb-ivory); padding: 70px 0; margin-top: 50px; text-align: center; }
.gb-brands__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--gb-line); max-width: 900px; margin: 35px auto 0; }
.gb-brand { background: var(--gb-paper); padding: 55px 20px; }
.gb-brand strong { display: block; font-family: var(--gb-serif); font-size: 34px; font-weight: 600; }
.gb-brand span { color: var(--gb-muted); font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }

.form-control {
  border-color: var(--gb-line);
  border-radius: 0;
  box-shadow: none;
}
.form-control:focus { border-color: var(--gb-gold); box-shadow: 0 0 0 2px rgba(185,147,75,.12); }
.btn { border-radius: 0; }
.btn-danger { border-radius: 0; }
.list-group a { border-color: var(--gb-line); }
.list-group a.active, .list-group a.active:hover { background: var(--gb-ink); border-color: var(--gb-ink); }
.pagination > li > a, .pagination > li > span { color: var(--gb-ink); border-color: var(--gb-line); }
.pagination > .active > span { background: var(--gb-ink); border-color: var(--gb-ink); }
.nav-tabs { border-color: var(--gb-line); }
.nav-tabs > li > a { border-radius: 0; text-transform: uppercase; letter-spacing: .06em; font-size: 12px; font-weight: 600; }

footer {
  background: var(--gb-ink);
  color: #eeeae3;
  font-family: var(--gb-sans);
  font-size: 17px;
  font-weight: 500;
  margin-top: 70px;
  padding: 62px 0 25px;
}
footer h5 {
  color: #fff;
  font-family: var(--gb-sans);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: .02em;
  margin-bottom: 16px;
}
footer a,
footer p {
  color: #eeeae3;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.9;
}
footer a:hover,
footer a:focus { color: #d6b56f; }
footer hr { border-color: #34322f; }
.gb-footer-mark {
  color: #fff;
  font-family: var(--gb-sans);
  font-size: 29px;
  font-weight: 600;
  letter-spacing: .12em;
  margin-bottom: 12px;
  text-transform: uppercase;
}
.gb-footer-note {
  color: #d8d2c9;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: .05em;
  text-transform: uppercase;
}

@media (max-width: 991px) {
  #logo { margin-bottom: 0; }
  header .row {
    gap: 18px;
    grid-template-columns: 250px minmax(220px, 1fr) 190px;
  }
  .gb-header-logo { max-width: 250px; }
  .gb-hero { min-height: 290px; }
  .gb-hero__content { width: 100%; }
  .gb-benefits { grid-template-columns: repeat(2, 1fr); }
  .gb-category-showcase { grid-template-columns: repeat(3, 1fr); }
  .gb-benefit:nth-child(2) { border-right: 0; }
  .gb-benefit:nth-child(-n+2) { border-bottom: 1px solid var(--gb-line); }
}
@media (max-width: 767px) {
  .goodbrands-theme .container {
    padding-left: 16px;
    padding-right: 16px;
    width: 100%;
  }
  .gb-announcement {
    font-size: 10px;
    letter-spacing: .05em;
    padding: 7px 10px;
  }
  #top {
    min-height: 34px;
  }
  #top .container {
    padding-left: 10px;
    padding-right: 10px;
  }
  #top .btn-link,
  #top-links a {
    font-size: 12px;
    letter-spacing: 0;
  }
  #top .list-inline {
    margin-bottom: 0;
  }
  #top-links .hidden-xs,
  #top .btn-link .hidden-xs {
    display: none !important;
  }
  header .container {
    padding-bottom: 10px;
    padding-top: 10px;
  }
  header .row {
    align-items: center;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 52px;
    gap: 0;
    margin: 0;
    min-height: 74px;
    position: relative;
  }
  header .row > div {
    float: none;
    min-height: 0;
    padding: 0;
    position: static;
    width: auto;
  }
  header .row > .gb-header-logo {
    grid-column: 2;
    grid-row: 1;
  }
  header .row > .gb-header-search {
    grid-column: 1;
    grid-row: 1;
    position: static !important;
    right: auto;
    top: auto;
    transform: none;
    width: auto !important;
  }
  header .row > .gb-header-cart {
    display: block;
    grid-column: 3;
    grid-row: 1;
  }
  #logo {
    margin: 0;
    text-align: center;
  }
  #logo img {
    height: auto;
    max-height: 54px;
    max-width: 210px;
    width: 100%;
  }
  #search {
    margin: 0;
    position: static;
  }
  #search .input-group {
    position: static;
  }
  #search .input-lg {
    background: var(--gb-paper);
    border: 1px solid var(--gb-line);
    display: none;
    font-size: 16px;
    height: 46px;
    left: 0;
    padding: 8px 52px 8px 13px;
    position: absolute;
    top: 76px;
    width: 100%;
    z-index: 50;
  }
  #search .btn-lg {
    border: 0;
    font-size: 20px;
    height: 46px;
    padding: 10px;
    width: 46px;
  }
  header.gb-search-open .row {
    margin-bottom: 52px;
  }
  header.gb-search-open #search .input-lg {
    display: block;
  }
  header.gb-search-open #search .btn-lg {
    border-left: 1px solid var(--gb-line);
    position: absolute;
    right: 0;
    top: 76px;
    z-index: 51;
  }
  #cart {
    margin: 0;
  }
  #cart > .btn {
    border: 0;
    font-size: 0;
    height: 46px;
    min-height: 46px;
    padding: 10px;
    width: 46px;
  }
  #cart > .btn .fa {
    font-size: 20px;
  }
  .gb-monogram { font-size: 42px; }
  .gb-name { font-size: 15px; }
  #menu { margin-bottom: 0; }
  #menu .navbar-header { background: var(--gb-paper); }
  #menu .btn-navbar { background: var(--gb-ink); border-color: var(--gb-ink); border-radius: 0; }
  #menu .navbar-collapse { border-color: var(--gb-line); }
  #menu .nav > li > a {
    color: var(--gb-ink);
    font-size: 16px;
    padding: 14px 15px;
  }
  #menu .dropdown-menu a { font-size: 16px; }
  .gb-hero {
    align-items: center;
    background: linear-gradient(135deg, #070707, #171513);
    min-height: 310px;
  }
  .gb-hero__content { padding: 40px 22px; width: 100%; }
  .gb-hero h1 { font-size: 40px; }
  .gb-benefits { grid-template-columns: 1fr 1fr; }
  .gb-category-showcase {
    grid-template-columns: repeat(2, 1fr);
    padding-top: 10px;
  }
  .gb-category-card {
    font-size: 13px;
    min-height: 72px;
  }
  .gb-benefit { padding: 21px 8px; }
  .gb-benefit strong { font-size: 16px; }
  #content > h2, .gb-section-title { font-size: 34px; margin-top: 45px; }
  .product-thumb .button-group { opacity: 1; position: static; transform: none; }
  .product-thumb .caption { min-height: 120px; }
  .gb-brands__grid { grid-template-columns: 1fr; }
  footer { font-size: 16px; text-align: center; }
  footer h5 { font-size: 20px; margin-top: 24px; }
  footer a, footer p { font-size: 16px; }
}

@media (max-width: 420px) {
  .gb-announcement {
    font-size: 9px;
    letter-spacing: .025em;
  }
  #logo img {
    max-height: 48px;
    max-width: 185px;
  }
}
