/* Semantic colors extend the original brand without changing stored content. */
:root {
  color-scheme: dark;
  --button-bg: #f2b33d;
  --button-ink: #170d0c;
  --text-strong: #dfcec7;
  --status-success: #b7d99a;
  --status-error: #ffb2a6;
  --header-bg: #170d0ce8;
  --header-border: #3a252288;
  --strip-bg: #1d100e;
  --products-bg: #1c100e;
  --section-bg: #1e110f;
  --hover-panel: #291714;
  --hover-border: #805045;
  --feature-bg: linear-gradient(110deg, #301915, #241413);
  --input-bg: #1b0f0d;
  --placeholder: #91786e;
  --menu-bg: #201210;
  --link-hover: #ffcf79;
  --control-border: #775027;
  --brand-surface: transparent;
  --brand-padding: 0;
}
:root[data-theme="light"] {
  color-scheme: light;
  --night: #fbf7ef;
  --panel: #fffaf4;
  --panel-light: #f3e9dc;
  --line: #ddcdbf;
  --red-text: #ba3129;
  --gold: #8c5b10;
  --white: #281715;
  --text: #655047;
  --muted: #786157;
  --text-strong: #49332b;
  --status-success: #3f6d26;
  --status-error: #a52e24;
  --header-bg: #fbf7eff2;
  --header-border: #ddcdbfbb;
  --strip-bg: #f2e8dc;
  --products-bg: #f7f0e5;
  --section-bg: #f2e8dc;
  --hover-panel: #f3e7d8;
  --hover-border: #a67a5a;
  --feature-bg: linear-gradient(110deg, #f3e3d3, #fffaf4);
  --input-bg: #fffdf8;
  --placeholder: #836f64;
  --menu-bg: #fffaf4;
  --link-hover: #a82c23;
  --control-border: #a58264;
  --brand-surface: #241413;
  --brand-padding: 5px 8px;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --night: #fbf7ef;
    --panel: #fffaf4;
    --panel-light: #f3e9dc;
    --line: #ddcdbf;
    --red-text: #ba3129;
    --gold: #8c5b10;
    --white: #281715;
    --text: #655047;
    --muted: #786157;
    --text-strong: #49332b;
    --status-success: #3f6d26;
    --status-error: #a52e24;
    --header-bg: #fbf7eff2;
    --header-border: #ddcdbfbb;
    --strip-bg: #f2e8dc;
    --products-bg: #f7f0e5;
    --section-bg: #f2e8dc;
    --hover-panel: #f3e7d8;
    --hover-border: #a67a5a;
    --feature-bg: linear-gradient(110deg, #f3e3d3, #fffaf4);
    --input-bg: #fffdf8;
    --placeholder: #836f64;
    --menu-bg: #fffaf4;
    --link-hover: #a82c23;
    --control-border: #a58264;
    --brand-surface: #241413;
    --brand-padding: 5px 8px;
  }
}
/* Product demos and original wordmarks retain their own contrast. */
.detail-visual {
  --panel: #241413;
  --white: #f8f2e8;
  --text: #c9b9b3;
  --muted: #a8958f;
  --line: #3a2522;
  --gold: #f2b33d;
  color: #f8f2e8;
}
.product-brand img.brand-wide {
  background-color: var(--brand-surface);
  padding: var(--brand-padding);
  border-radius: 5px;
  box-sizing: content-box;
}
.cta-section {
  --white: #f8f2e8;
  --text: #d8b2a2;
  --gold: #f2b33d;
  color: #f8f2e8;
}
.form-status {
  color: var(--status-success);
}
.form-status.error {
  color: var(--status-error);
}
.footer-bottom {
  align-items: center;
  flex-wrap: wrap;
}

.theme-switcher {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
}
.theme-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  min-width: 52px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  transition:
    background 0.15s,
    color 0.15s,
    border-color 0.15s;
}
.theme-trigger > span {
  display: inline-flex;
}
.theme-trigger:hover,
.theme-trigger[aria-expanded="true"] {
  color: var(--white);
  background: var(--panel);
  border-color: var(--line);
}
.theme-chevron {
  opacity: 0.55;
  transition: transform 0.15s;
}
.theme-trigger[aria-expanded="true"] .theme-chevron {
  transform: rotate(180deg);
}
.theme-menu {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  z-index: 50;
  width: 166px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow:
    0 12px 32px #00000020,
    0 2px 6px #0000000d;
  animation: theme-menu-in 0.14s ease-out;
}
.theme-menu button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  gap: 11px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--text);
  font-size: 13px;
  text-align: left;
}
.theme-menu button:hover,
.theme-menu button:focus-visible {
  background: var(--panel-light);
  color: var(--white);
  outline: none;
}
.theme-menu button[aria-checked="true"] {
  color: var(--gold);
}
.theme-check {
  margin-left: auto;
  opacity: 0;
}
.theme-menu button[aria-checked="true"] .theme-check {
  opacity: 1;
}
.theme-menu .theme-system-option {
  margin-top: 5px;
  position: relative;
}
.theme-system-option::before {
  content: "";
  height: 1px;
  position: absolute;
  left: 8px;
  right: 8px;
  top: -3px;
  background: var(--line);
}
@keyframes theme-menu-in {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@media (min-width: 641px) and (max-width: 850px) {
  .header-inner {
    gap: 12px;
  }
  .site-header nav {
    gap: 10px;
  }
}
@media (max-width: 640px) {
  .footer-bottom {
    align-items: flex-start;
  }
  .theme-switcher {
    align-self: center;
  }
  .header-inner {
    gap: 10px;
  }
  .theme-menu {
    right: 0;
    left: auto;
  }
  .theme-menu button {
    min-height: 44px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .theme-menu {
    animation: none;
  }
  .theme-chevron {
    transition: none;
  }
}
