:root {
  --brand-primary: #28312B;
  --brand-background: #F7F3EA;
  --brand-accent: #AD7654;
  --brand-secondary: #686D53;
  --brand-white: #FFFFFF;
  --brand-text: #28312B;
  --brand-primary-hover: #354239;
  --brand-accent-ink: #805339;
  --brand-border: color-mix(in srgb, var(--brand-primary) 16%, var(--brand-background));
  --background: var(--brand-background);
  --foreground: var(--brand-text);
  --card: var(--brand-white);
  --card-foreground: var(--brand-text);
  --popover: var(--brand-white);
  --popover-foreground: var(--brand-text);
  --primary: var(--brand-primary);
  --primary-foreground: var(--brand-white);
  --secondary: var(--brand-background);
  --secondary-foreground: var(--brand-text);
  --muted: var(--brand-background);
  --muted-foreground: var(--brand-secondary);
  --accent: var(--brand-secondary);
  --accent-foreground: var(--brand-white);
  --border: var(--brand-border);
  --input: var(--brand-border);
  --ring: var(--brand-primary);
  --copper: var(--brand-accent);
  --stone-deep: var(--brand-primary);
  --gradient-copper: linear-gradient(135deg, var(--brand-primary), var(--brand-primary-hover));
  --shadow-soft: 0 10px 30px -12px rgb(40 49 43 / 14%);
}

.brand-logo {
  display: block;
  width: 236px;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

.brand-header {
  background: var(--brand-background);
  padding-block: 14px;
}

.brand-lockup {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.brand-tagline {
  color: var(--brand-secondary);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .06em;
}

.brand-seller-logo {
  width: 96px;
  border-radius: 6px;
}

.brand-footer {
  --foreground: var(--brand-background);
  --muted-foreground: #E2DFD2;
  --border: rgb(247 243 234 / 20%);
  background: var(--brand-primary);
  color: var(--brand-white);
}

.brand-footer .brand-logo {
  width: 210px;
  padding: 10px;
  border-radius: 8px;
  background: var(--brand-background);
}

.brand-footer .brand-tagline {
  margin-top: 10px;
  color: var(--brand-background);
}

.offer-page .text-copper,
.advertorial-page .text-copper {
  color: var(--brand-accent-ink);
}

.offer-page .lucide-star,
.advertorial-page .lucide-star {
  color: #FFC107;
  fill: currentColor;
}

.offer-page #barra-fill,
.advertorial-page #barra-fill {
  background-image: linear-gradient(90deg, var(--brand-primary), var(--brand-accent));
}

.offer-page #cta-link,
.advertorial-page #advertorial-cta {
  background: var(--brand-primary);
  transition: background-color .2s, opacity .2s;
}

.offer-page #cta-link:hover,
.advertorial-page #advertorial-cta:hover {
  background: var(--brand-primary-hover);
  opacity: 1;
}

.offer-page #cta-link:focus-visible,
.advertorial-page #advertorial-cta:focus-visible {
  outline: 3px solid var(--brand-accent);
  outline-offset: 3px;
}

.offer-page [data-kit-option]:focus-visible,
.offer-page [data-kit-choose]:focus-visible {
  outline: 2px solid var(--brand-secondary);
  outline-offset: 3px;
}

.offer-page #cta-link[aria-disabled="true"],
.offer-page #cta-link[aria-disabled="true"]:hover {
  background: var(--brand-primary);
  cursor: not-allowed;
  opacity: .65;
}
