/* ==========================================================================
   Modern redesign overrides for the homepage
   Loaded after bootstrap.css / style.css / ectcart.css — overrides only.
   ========================================================================== */

:root {
  --ink: #16181d;
  --ink-soft: #5b6270;
  --paper: #ffffff;
  --line: #e7e8ec;
  --accent: #c8102e;
  --accent-dark: #a10d25;
  --surface: #f6f7f9;
  --footer-bg: #14161b;
  --footer-line: rgba(255, 255, 255, 0.08);
  --footer-text: #b7bac2;
  --radius: 14px;
  --shadow-sm: 0 1px 2px rgba(16, 18, 22, 0.06), 0 1px 1px rgba(16, 18, 22, 0.04);
  --shadow-md: 0 12px 24px -8px rgba(16, 18, 22, 0.18);
  --shadow-lg: 0 24px 48px -12px rgba(16, 18, 22, 0.28);
}

body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

/* -------------------------------------------------------------- header -- */

.navbar-fixed-top {
  background: var(--paper);
  box-shadow: none !important;
  border-bottom: 1px solid var(--line);
  position: relative;
  padding: 18px 0 0;
}

.navbar-fixed-top .logo {
  width: auto;
  padding-bottom: 22px;
}

.navbar-fixed-top .logo img {
  height: 64px;
  width: auto;
}

.secondary_menu {
  margin-top: 2px;
}

.secondary_menu li a {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--ink-soft);
}

.secondary_menu li a:hover {
  color: var(--ink);
}

.secondary_menu li::before {
  border-right: 1px solid var(--line);
  top: 2px;
}

.shopping-inline {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.shopping-inline a {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  transition: background 0.2s ease, color 0.2s ease;
}

.shopping-inline a:hover {
  background: var(--ink);
  color: var(--paper);
  text-decoration: none;
}

.shopping-inline .fa-shopping-cart {
  margin: 0 8px 0 0 !important;
}

@media all and (max-width: 940px) {
  .menu_block .container {
    padding-bottom: 16px;
  }

  .shopping-inline {
    position: static;
    transform: none;
    display: flex;
    justify-content: center;
    padding: 0 20px;
  }
}

.menu_block {
  background: var(--paper);
  height: auto;
}

#undefined-sticky-wrapper {
  top: 0;
  height: auto !important;
}

.is-sticky .menu_block {
  box-shadow: var(--shadow-sm);
}

nav.ectmegamenu {
  text-align: left;
  border-top: 1px solid var(--line);
}

.ectmegamenu > ul {
  padding: 0;
  margin-left: -20px;
}

.ectmegamenu > ul > li {
  background: transparent;
  padding: 0;
}

.ectmegamenu > ul > li a {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--ink);
  padding: 16px 20px;
  display: inline-block;
  position: relative;
}

.ectmegamenu > ul > li:hover {
  background: transparent !important;
}

.ectmegamenu > ul > li:hover > a {
  color: var(--accent);
}

.ectmegamenu > ul > li > ul > li:hover {
  background: transparent !important;
}

.ectmegamenu > ul > li > a::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 8px;
  height: 2px;
  background: var(--accent);
  transform: scaleX(0);
  transition: transform 0.2s ease;
}

.ectmegamenu > ul > li:hover > a::after {
  transform: scaleX(1);
}

.ectmegamenu > ul > li > ul {
  background: var(--paper);
  border: 0;
  border-radius: 12px;
  box-shadow: var(--shadow-md);
  padding: 20px 24px;
}

.ectmegamenu > ul > li > ul > li {
  padding-bottom: 0 !important;
}

.ectmegamenu > ul > li > ul > li a {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-soft);
  border-bottom: 0 !important;
  padding: 8px 0 !important;
  transition: color 0.15s ease;
}

.ectmegamenu > ul > li > ul > li a:hover,
.ectmegamenu > ul > li > ul > li > ul > li a:hover {
  background-color: transparent !important;
  background: transparent !important;
  color: var(--accent);
}

/* --------------------------------------------------------------- hero --- */

#home {
  background: var(--ink);
}

#myCarousel .item {
  position: relative;
}

#myCarousel .item > .container {
  position: absolute;
  inset: 0;
}

#myCarousel .item img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  filter: brightness(0.55);
}

#myCarousel .item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 11, 14, 0.75) 0%, rgba(10, 11, 14, 0.35) 55%, rgba(10, 11, 14, 0.15) 100%);
}

#myCarousel .carousel-caption {
  position: absolute;
  left: 15px;
  right: auto;
  bottom: auto;
  top: 50%;
  transform: translateY(-50%);
  max-width: 560px;
  text-align: left;
  text-shadow: none;
}

.hero-eyebrow {
  display: inline-block;
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #ff8a7a;
  margin-bottom: 16px;
}

.hero-title {
  font-family: "Inter", sans-serif;
  font-size: 44px;
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #fff;
  text-transform: none;
  margin: 0 0 18px;
}

.hero-subtitle {
  font-family: "Inter", sans-serif;
  font-size: 17px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.82);
  margin: 0 0 28px;
  max-width: 460px;
}

.hero-cta {
  display: inline-block;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #16181d;
  background: #fff;
  padding: 14px 28px;
  border-radius: 999px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.hero-cta:hover {
  color: #16181d;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

#myCarousel .carousel-indicators {
  bottom: 24px;
}

#myCarousel .carousel-indicators li {
  width: 8px;
  height: 8px;
  margin: 0 4px;
  background: rgba(255, 255, 255, 0.4);
  border: 0;
}

#myCarousel .carousel-indicators li.active {
  background: #fff;
  width: 24px;
  border-radius: 4px;
}

#myCarousel .carousel-control {
  width: 64px;
  background: none !important;
  opacity: 0.9;
}

#myCarousel .carousel-control .glyphicon {
  font-size: 22px;
  width: 44px;
  height: 44px;
  line-height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(4px);
  left: 0;
  margin-left: 0;
}

/* ---------------------------------------------------------- categories -- */

section {
  background: var(--paper);
}

div.hometext {
  padding: 56px 0 16px;
}

div.hometext h2 {
  border-bottom: 1px solid var(--line);
  font-family: "Inter", sans-serif;
  font-weight: 800;
  font-size: 36px;
  letter-spacing: -0.01em;
  color: var(--ink);
}

div.hometext h2 span {
  background: var(--paper);
  padding: 0 24px;
}

.featured_items {
  margin-top: 24px;
  padding-bottom: 220px;
}

.featured_items::after {
  content: "";
  display: table;
  clear: both;
}

.featured_items .col-sm-3 {
  padding: 10px !important;
}

.product-image-wrapper {
  border: 0;
  padding: 0;
  margin-bottom: 0;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.product-image-wrapper:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}

.single-products {
  aspect-ratio: 4 / 5;
  background: var(--surface);
}

.productinfo {
  height: 100%;
}

.productinfo img.lg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.single-products:hover .productinfo img.lg {
  transform: scale(1.06);
}

.productinfo h2 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  padding: 40px 18px 16px;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: #fff;
  text-align: left;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%);
}

.product-overlay {
  background: rgba(20, 22, 27, 0.55);
  transition: opacity 0.25s ease;
  opacity: 0;
  height: 100% !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.single-products:hover .product-overlay {
  opacity: 1;
}

.product-overlay .overlay-content {
  position: static;
}

.viewnow {
  top: 0;
  margin-bottom: 0;
  border: 1px solid #fff;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 10px 22px;
  background: transparent;
}

.overlay-content a:hover {
  background: #fff;
  color: var(--ink) !important;
  border-color: #fff;
}

/* -------------------------------------------------------------- footer -- */

footer {
  background: var(--footer-bg);
  color: var(--footer-text);
  padding: 64px 0 0;
}

footer .footit {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 20px;
}

.footlinks li {
  padding-bottom: 0;
  margin-bottom: 10px;
}

footer a {
  color: var(--footer-text);
  font-size: 14px;
}

footer a:hover {
  color: #fff;
}

footer .social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  margin-right: 8px;
  padding: 0;
  color: var(--footer-text);
  font-size: 14px;
  transition: background 0.2s ease, color 0.2s ease;
}

footer .social a:hover {
  background: var(--accent);
  color: #fff;
}

footer .ccards a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  width: auto;
  height: 28px;
  padding: 0 6px;
  margin-right: 8px;
  background: rgba(255, 255, 255, 0.08);
}

footer .ccards img {
  max-width: 28px;
  max-height: 18px;
  filter: none;
  opacity: 0.9;
}

footer .ccards img {
  max-width: 28px;
  max-height: 18px;
  filter: none;
  opacity: 0.9;
}

.copyright {
  margin-top: 48px;
  padding: 20px 0;
  background: transparent;
  border-top: 1px solid var(--footer-line);
  color: #74777f;
}

.copyright a {
  color: #74777f;
}

.copyright a:hover {
  color: #fff;
}

@media (max-width: 768px) {
  .hero-title {
    font-size: 30px;
  }
  #myCarousel .item img {
    height: 420px;
  }
  #myCarousel .carousel-caption {
    max-width: 90%;
  }
}

/* ---------------------------------------------------------- product grid -- */
/* Subgrid keeps name/image/price/rating/buttons locked to the same row
   across neighboring cards, even when title length or rating presence
   differs — each row's height is set by the tallest sibling in that row. */

div.products {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: auto auto auto auto auto auto;
  column-gap: 24px;
  row-gap: 0;
}

div.product {
  display: grid;
  grid-template-rows: subgrid;
  grid-template-columns: 1fr 1fr;
  column-gap: 12px;
  grid-row: span 6;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 24px !important;
  padding: 24px !important;
  background: var(--paper);
  border: 0 !important;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

div.product:hover {
  border: 0 !important;
  box-shadow: var(--shadow-md);
}

div.product > form {
  display: contents;
}

div.product div.prodname {
  grid-row: 1;
  grid-column: 1 / -1;
  align-self: start;
  float: none !important;
  width: auto !important;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: var(--ink);
  margin: 0 0 4px !important;
}

div.product div.prodname a {
  color: var(--ink);
}

div.product div.prodimage.allprodimages {
  grid-row: 2;
  grid-column: 1 / -1;
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  min-height: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  aspect-ratio: 1 / 1;
  background: var(--surface);
  border-radius: 10px;
  overflow: hidden;
  margin: 8px 0 !important;
}

div.product div.prodimage.allprodimages > a.ectlink {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

div.product img.prodimage {
  max-width: 82%;
  max-height: 82%;
  width: auto;
  height: auto;
  object-fit: contain;
}

div.product div.imagenavigator {
  flex: 0 0 auto;
  text-align: center;
  margin: 4px 0 0 !important;
}

div.product .imagenavigator input.previmg,
div.product .imagenavigator input.nextimg {
  border: 0;
  background: transparent;
  color: var(--ink-soft);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 4px 6px;
}

div.product .imagenavigator input.previmg:hover,
div.product .imagenavigator input.nextimg:hover {
  color: var(--accent);
  border: 0;
}

div.product .imagenavigator .extraimage {
  color: var(--ink-soft);
  font-size: 11px;
}

div.product div.listpricediv {
  grid-row: 3;
  grid-column: 1 / -1;
  align-self: start;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

div.product div.origprice {
  color: var(--ink-soft);
  font-weight: 400;
  font-size: 13px;
}

div.product div.prodprice {
  grid-row: 4;
  grid-column: 1 / -1;
  align-self: start;
  float: none !important;
  width: auto !important;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  margin: 4px 0 !important;
}

div.product .prodpricelabel {
  display: none;
}

div.product div.prodrating {
  grid-row: 5;
  grid-column: 1 / -1;
  align-self: start;
  float: none !important;
  width: auto !important;
  min-height: 20px;
  margin: 4px 0 12px !important;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  white-space: nowrap;
}

div.product div.prodrating .prodratingtext {
  display: inline-block;
  font-size: 12px;
  color: var(--ink-soft);
}

div.product div.prodrating a.prodratinglink {
  color: var(--ink-soft);
  white-space: nowrap;
}

div.product div.detaillink {
  grid-row: 6;
  grid-column: 1;
  align-self: end;
}

div.product div.qbuybutton {
  grid-row: 6;
  grid-column: 2;
  align-self: end;
}

div.product div.detaillink,
div.product div.qbuybutton {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

div.product input[type="button"].detaillink {
  width: 100% !important;
  background: transparent;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 13px;
  padding: 10px 12px !important;
}

div.product input[type="button"].detaillink:hover {
  background: var(--ink);
  color: var(--paper) !important;
}

div.product input[type="button"].qbuybutton {
  width: 100% !important;
  background: var(--accent);
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 13px;
  padding: 10px 12px !important;
}

div.product input[type="button"].qbuybutton:hover {
  background: var(--accent-dark);
}

@media (max-width: 600px) {
  div.products {
    grid-template-columns: 1fr;
  }
  div.product {
    grid-template-rows: subgrid;
    grid-row: span 6;
  }
}

/* sidebar panels */

#sidebar .sidepanel {
  background: var(--paper);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 20px !important;
  margin-bottom: 16px !important;
}

#sidebar .sidepanel h3 {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 12px;
}

#sidebar .categoriesrig li {
  border-bottom: 1px solid var(--line);
}

#sidebar .categoriesrig li a:hover {
  background: var(--surface);
  color: var(--ink);
}

/* ---------------------------------------------------------- quick buy modal -- */

div.qbopaque {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(22, 24, 29, 0.55);
  backdrop-filter: blur(2px);
  box-sizing: border-box;
}

div.qbuywrapper {
  position: relative;
  margin: 0;
  width: min(94vw, 480px);
  max-height: 88vh;
  padding: 32px;
  background: var(--paper);
  border-radius: 20px;
  box-shadow: var(--shadow-lg);
  font-family: "Inter", sans-serif;
}

/* ectstyleqbuy1.css floats every one of these 60% right — neutralize the
   whole family in one place so nothing slips back into the old 2-column
   image-left/info-right layout. */
div.qbuywrapper div.prodimage,
div.qbuywrapper div.prodname,
div.qbuywrapper div.prodid,
div.qbuywrapper div.prodsku,
div.qbuywrapper div.prodmanufacturer,
div.qbuywrapper div.proddescription,
div.qbuywrapper div.prodinstock,
div.qbuywrapper div.prodrating,
div.qbuywrapper div.prodminquant,
div.qbuywrapper div.proddateadded,
div.qbuywrapper div.prodoptions,
div.qbuywrapper div.csprodoptions,
div.qbuywrapper div.prodprice,
div.qbuywrapper div.listprice,
div.qbuywrapper div.prodcurrency,
div.qbuywrapper div.addtocart,
div.qbuywrapper div.detaillink,
div.qbuywrapper div.prodaddtocartquant,
div.qbuywrapper div.addtocartquant {
  float: none !important;
  width: auto !important;
  clear: none !important;
}

div.qbuywrapper div.scart.scclose {
  position: absolute;
  top: 16px;
  right: 16px;
  float: none;
  width: 32px;
  height: 32px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--surface);
  transition: background 0.15s ease;
  z-index: 1;
}

div.qbuywrapper div.scart.scclose:hover {
  background: var(--line);
}

div.qbuywrapper div.prodimage.allprodimages {
  float: none !important;
  width: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  aspect-ratio: 1 / 1;
  max-width: 260px;
  margin: 0 auto 12px !important;
  background: var(--surface);
  border-radius: 14px;
  overflow: hidden;
}

div.qbuywrapper div.prodimage.allprodimages > a.ectlink {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

div.qbuywrapper img.prodimage {
  max-width: 82%;
  max-height: 82%;
  width: auto;
  height: auto;
  object-fit: contain;
}

div.qbuywrapper div.imagenavigator {
  flex: 0 0 auto;
  text-align: center;
  margin: 4px 0 0 !important;
}

div.qbuywrapper .imagenavigator input.previmg,
div.qbuywrapper .imagenavigator input.nextimg {
  border: 0;
  background: transparent;
  color: var(--ink-soft);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 4px 6px;
}

div.qbuywrapper .imagenavigator input.previmg:hover,
div.qbuywrapper .imagenavigator input.nextimg:hover {
  color: var(--accent);
  border: 0;
}

div.qbuywrapper .imagenavigator .extraimage {
  color: var(--ink-soft);
  font-size: 11px;
}

div.qbuywrapper div.prodname {
  float: none !important;
  width: auto !important;
  text-align: center;
  font-weight: 700;
  font-size: 19px;
  color: var(--ink);
  margin: 0 0 4px !important;
}

div.qbuywrapper div.prodname a {
  color: var(--ink);
}

div.qbuywrapper div.prodid {
  float: none !important;
  width: auto !important;
  text-align: center;
  font-size: 12px;
  color: var(--ink-soft);
  margin: 0 0 16px !important;
}

div.qbuywrapper br {
  display: none;
}

div.qbuywrapper div.prodoptions {
  padding: 0 !important;
  margin: 0 0 16px !important;
}

div.qbuywrapper div.optioncontainer {
  gap: 12px;
  margin-bottom: 10px;
}

div.qbuywrapper div.optiontext {
  min-width: 64px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 13px;
  color: var(--ink);
  padding: 0;
}

div.qbuywrapper div.option {
  flex: 1 1 auto;
}

div.qbuywrapper select.prodoption {
  width: 100%;
  border-color: var(--line);
  color: var(--ink);
  font-family: "Inter", sans-serif;
}

div.qbuywrapper div.listpricediv {
  float: none !important;
  width: auto !important;
  text-align: center;
  margin: 0 !important;
}

div.qbuywrapper div.origprice {
  color: var(--ink-soft);
  font-weight: 400;
  font-size: 13px;
}

div.qbuywrapper div.prodprice {
  float: none !important;
  width: auto !important;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--ink);
  margin: 4px 0 16px !important;
}

div.qbuywrapper .prodpricelabel {
  display: none;
}

div.qbuywrapper div.detaillink.qbdetaillink {
  float: none !important;
  width: auto !important;
  text-align: center;
  margin: 0 0 16px !important;
}

div.qbuywrapper input[type="button"].detaillink {
  width: auto !important;
  min-width: 140px;
  background: transparent;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 13px;
  padding: 10px 20px !important;
}

div.qbuywrapper input[type="button"].detaillink:hover {
  background: var(--ink);
  color: var(--paper) !important;
}

div.qbuywrapper div.addtocartquant {
  gap: 10px;
  padding-top: 16px !important;
  border-top: 1px solid var(--line);
}

div.qbuywrapper input[type="text"].quantity0input {
  min-height: 44px;
  width: 56px;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-size: 14px;
}

div.qbuywrapper button.buybutton {
  min-height: 44px;
  width: 100%;
  background: var(--accent);
  color: #fff;
  border: 0;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
}

div.qbuywrapper button.buybutton:hover {
  background: var(--accent-dark);
}

@media (max-width: 560px) {
  div.qbuywrapper {
    width: 100%;
    padding: 24px;
    max-height: 92vh;
  }
}