/* =============================================================
   Dark theme override — applied site-wide.
   Scoped via body so it cleanly overrides the cream tokens in styles.css.
   ============================================================= */

body {
  --color-canvas: #0e0c0a;
  --color-surface-soft: #14110d;
  --color-surface-card: #1a1612;
  --color-surface-cream-strong: #1f1a15;
  --color-ink: #faf9f5;
  --color-body: rgba(250, 249, 245, 0.78);
  --color-body-strong: #faf9f5;
  --color-muted: rgba(250, 249, 245, 0.55);
  --color-hairline: rgba(250, 249, 245, 0.10);
  --color-primary: #c9a575;
  --color-primary-active: #b89364;
  --color-on-primary: #1a1210;
  --color-accent-amber: #c9a575;
  --color-success: #c9a575;
}

/* Top nav on dark */
.topnav { background: rgb(0, 0, 0); }

/* Footer on dark — solid black across all pages */
.footer { background: #000000; }

/* Brand wordmark logo */
.brand-logo {
  display: block;
  height: 76px;
  width: auto;
  object-fit: contain;
}
.nav-cta {
  background: transparent;
  color: var(--color-ink);
  border: 1px solid var(--color-primary);
}
.nav-cta:hover { background: rgba(201, 165, 117, 0.10); }
.nav-links a { color: rgba(250, 249, 245, 0.78); }
.nav-links a:hover { color: var(--color-ink); }
.nav-links a.active { color: var(--color-ink); border-bottom-color: var(--color-primary); }

/* Tag pill — recolored to gold */
.tag-pill.coral {
  background: rgba(201, 165, 117, 0.14);
  color: var(--color-primary);
}

/* Final CTA section — was coral, now dark elevated */
.section-coral { background: #1a1612; color: var(--color-ink); }
.section-coral h2 { color: var(--color-ink); }
.section-coral p { color: rgba(250, 249, 245, 0.78); }

/* FAQ accordion marker on dark cards */
.faq-summary .plus { border-color: var(--color-primary); }
.faq-summary .plus::before,
.faq-summary .plus::after { background: var(--color-primary); }
details[open] .faq-summary .plus {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
details[open] .faq-summary .plus::before { background: #0e0c0a; }

/* Returns step circles — were ink-on-cream; flip to gold-on-dark so digits read */
#returns ol li > span:first-child {
  background: var(--color-primary) !important;
  color: #0e0c0a !important;
}

/* Page intro divider line under hairline */
.page-intro { border-bottom-color: rgba(250, 249, 245, 0.08); }

/* Scroll reveal — fade + rise (used site-wide via assets/scroll-reveal.js) */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: opacity, transform;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}