
:root {
  color-scheme: dark;
}

* { box-sizing: border-box; }

html {
  background: #100e0c;
}

body.public-gold-page {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(ellipse at 50% 0%,
      #35291b 0%, #1c1712 36%, #100e0c 85%);
  color: #dfd2bb;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px;
  line-height: 1.55;
}

.public-shop {
  width: min(100%, 760px);
  margin: 0 auto;
  padding: 18px 14px 38px;
}

.public-shop a {
  color: #dfb86e;
  text-decoration-color: #95774a;
  text-underline-offset: 3px;
}

.public-shop__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 18px;
  padding-bottom: 13px;
  border-bottom: 1px solid #655032;
}

.public-shop__brand {
  color: #ebc681 !important;
  font-size: 23px;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: .4px;
}

.public-shop__back {
  font-size: 13px;
}

.public-shop__hero,
.public-shop__section,
.public-shop > section {
  margin: 0 0 14px;
  padding: 18px 16px;
  background: linear-gradient(155deg, #29221a, #17130f);
  border: 1px solid #695333;
  border-radius: 11px;
  box-shadow: inset 0 1px 0 #5e492b55,
              0 5px 18px #0005;
}

.public-shop__hero {
  text-align: center;
  border-color: #947143;
  background: linear-gradient(170deg, #35281a, #18130f);
}

.public-shop__eyebrow {
  color: #c5a66f;
  font-size: 12px;
  letter-spacing: .45px;
}

.public-shop h1,
.public-shop h2,
.public-shop h3 {
  color: #ebc888;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.public-shop h1 {
  font-size: clamp(23px, 5vw, 31px);
  margin: 10px 0 13px;
}

.public-shop h2 {
  font-size: clamp(18px, 4vw, 22px);
  margin: 0 0 12px;
}

.public-shop h3 {
  font-size: 17px;
}

.public-shop p {
  margin: 0 0 12px;
}

.public-shop p:last-child {
  margin-bottom: 0;
}

.public-shop__price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 18px auto 3px;
  padding: 11px 15px;
  width: fit-content;
  background: #3b2c19;
  border: 1px solid #ad8243;
  border-radius: 9px;
}

.public-shop__price strong {
  color: #ffd27c;
  font-size: 25px;
}

.public-shop__price span {
  color: #e0c99f;
  font-size: 14px;
}

.public-shop__table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.public-shop__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.public-shop__table th,
.public-shop__table td {
  padding: 10px 6px;
  border-bottom: 1px solid #5b472c;
  text-align: left;
  white-space: nowrap;
}

.public-shop__table th {
  color: #edc681;
  background: #392b1b;
  font-size: 12px;
}

.public-shop__table td {
  color: #e3d4b8;
}

.public-shop__table tbody tr:nth-child(even) {
  background: #ffffff07;
}

.public-shop ul,
.public-shop ol {
  padding-left: 22px;
  margin: 10px 0;
}

.public-shop li {
  margin-bottom: 8px;
}

.public-shop button,
.public-shop .btn {
  background: linear-gradient(#edba59, #bf862e);
  color: #241808;
  border: 1px solid #f2c875;
  border-radius: 8px;
  padding: 10px 15px;
  font-weight: bold;
}

.public-shop footer {
  color: #bba987;
  font-size: 13px;
  text-align: center;
}

@media (max-width: 430px) {
  .public-shop {
    padding: 12px 10px 28px;
  }

  .public-shop__hero,
  .public-shop__section,
  .public-shop > section {
    padding: 15px 11px;
  }

  .public-shop__table {
    font-size: 12px;
  }

  .public-shop__table th,
  .public-shop__table td {
    padding: 9px 4px;
  }
}
