:root {
  --bg:#f7f6f2;
  --surface:#eeece5;
  --ink:#202c3b;
  --muted:#5c6570;
  --line:#d9d6ca;
  --accent:#825d31;
  --on-accent:#ffffff;
  --radius:3px;
  --photo-bg:#efeeeb;
  --badge-bg:#825d31;
  --badge-ink:#ffffff;
  --utility-bg:#202c3b;
  --utility-ink:#f7f6f2;
}

html[data-theme=dark] {
  --bg:#101926;
  --surface:#1c293b;
  --ink:#f8f1e5;
  --muted:#b8c5d6;
  --line:#3c4b62;
  --accent:#d9b47a;
  --on-accent:#242015;
  --radius:3px;
  --photo-bg:#efeeeb;
  --badge-bg:#d9b47a;
  --badge-ink:#242015;
  --utility-bg:#f8f1e5;
  --utility-ink:#101926;
}

.brand-name,h1,h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
}

.brand-name {
  font-size:33px;
  letter-spacing:.13em;
}

.brand-mark {
  border:1px solid var(--accent);
  background:transparent;
  color:var(--accent);
  border-radius:50%;
}

.hero {
  grid-template-columns:1fr 1.1fr;
}

.hero-copy h1 {
  font-size:clamp(2.9rem,4.1vw,4.4rem);
  line-height:1.08;
}

.hero-art {
  margin:20px;
  border:1px solid var(--line);
}

.hero-serial {
  letter-spacing:.15em;
}

.hero-copy .button {
  font-weight:400;
  letter-spacing:.07em;
}

.category {
  background:transparent;
  border-block:1px solid var(--line);
  border-inline:0;
}

.product-info {
  text-align:center;
}

.product-bottom {
  justify-content:center;
  gap:20px;
}

.product-note {
  font-size:.76rem;
  letter-spacing:.03em;
}

.section-head .eyebrow {
  letter-spacing:.16em;
}

@media(max-width:760px) {
  .hero {
    grid-template-columns:1fr;
  }
  .hero-art {
    margin:0 18px 18px;
  }
  .brand-name {
    font-size:25px;
  }
  .brand small {
    font-size:5px;
  }
}