/* =====================================================================
   Revere Cigars — Brand Design System
   Source: brand-guidelines.html (https://reverecigars.com/wp-content/uploads/2026/04/brand-guidelines.html)
   Last updated: 2026-04-27
   ===================================================================== */

/* @property registrations for animatable CSS custom properties.
   Modern browsers (Chrome 85+, Edge 85+, Safari 16.4+, Firefox 128+) render the
   fire-of-liberty animated conic gradient. Older browsers fall back to a static
   gradient — still looks decent, just doesn't rotate. */
@property --revere-glow-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

/* ---------- Reset (scoped, not global — let WP/WooCommerce keep their resets) ---------- */
.revere *, .revere *::before, .revere *::after { box-sizing: border-box; }

/* ---------- Design tokens ---------- */
:root {
  --rose-gold: #CA8F65;
  --rose-gold-light: #d9a481;
  --rose-gold-deep: #a8714d;
  --cream: #f4dece;
  --charcoal: #2A2A2A;
  --charcoal-deep: #1f1f1f;
  --charcoal-soft: #353535;
  --bone: #FFFFFF;
  --smoke: #8E8E8E;
  --smoke-deep: #6a6a6a;

  --border: rgba(202, 143, 101, 0.18);
  --hairline: rgba(255, 255, 255, 0.06);
  --card-bg: rgba(255, 255, 255, 0.025);
  --card-border: rgba(255, 255, 255, 0.06);

  --positive: #7fae6a;
  --negative: #b9624c;

  --font-display: 'Jakobenz', 'Cinzel', Georgia, serif;
  --font-display-rough: 'Jakobenz Rough', 'Jakobenz', 'Cinzel', Georgia, serif;
  --font-tag: 'IM Fell English SC', Georgia, serif;
  --font-body: 'Inter', 'Helvetica Neue', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  --container-max: 1140px;
  --content-max: 960px;
}

/* ---------- Brand body baseline (only when .revere wrapper is on the page) ---------- */
body.revere-body {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: #b9b3ab;
  background-color: var(--charcoal);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

.revere {
  font-family: var(--font-body);
  color: #b9b3ab;
}

.revere a {
  color: var(--rose-gold);
  text-decoration: none;
  border-bottom: 1px solid var(--border);
  transition: color .15s ease, border-color .15s ease;
}
.revere a:hover { color: var(--rose-gold-light); border-bottom-color: var(--rose-gold-light); }
.revere a.plain { border-bottom: none; }

.revere strong { color: var(--cream); font-weight: 500; }

.revere .container { max-width: var(--container-max); margin: 0 auto; padding: 0 2rem; }
.revere .container.narrow { max-width: var(--content-max); }

/* ---------- Typography ---------- */
.revere h1, .revere h2, .revere h3, .revere h4 {
  color: var(--bone);
  font-family: var(--font-display);
  letter-spacing: 0.02em;
  line-height: 1.15;
  margin: 0 0 1rem;
  /* BeTheme parent sets text-align: left on h1-h4 explicitly, which breaks
     inheritance from centered parent containers (e.g. our section headers
     with text-align: center). Force inherit so the natural cascade works. */
  text-align: inherit;
}

.revere h1 {
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 3.6rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.revere h2 {
  font-weight: 600;
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  text-transform: uppercase;
}

.revere h3 {
  font-weight: 600;
  font-size: 1.4rem;
}

.revere h4 {
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold);
  margin-bottom: 0.75rem;
}

.revere p { max-width: 68ch; margin: 0 0 1rem; }
.revere p.full-width { max-width: none; }
.revere p.lead { font-size: 1.1rem; color: var(--cream); }

.revere .section-label {
  font-family: var(--font-tag);
  font-size: 0.85rem;
  letter-spacing: 0.28em;
  color: var(--rose-gold);
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.revere .keep-lit {
  font-family: var(--font-tag);
  font-size: 0.95rem;
  letter-spacing: 0.25em;
  color: var(--rose-gold);
  text-transform: uppercase;
  text-align: center;
}

.revere blockquote {
  font-family: var(--font-display);
  font-size: 1.15rem;
  color: var(--cream);
  border-left: 2px solid var(--rose-gold);
  padding: 0.5rem 0 0.5rem 1.5rem;
  margin: 1.5rem 0;
  line-height: 1.5;
  max-width: 65ch;
}

.revere blockquote.lounge { font-family: var(--font-body); font-style: italic; font-size: 1rem; }

.revere blockquote cite {
  display: block;
  font-style: normal;
  font-family: var(--font-body);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--smoke);
  margin-top: 0.65rem;
}

.revere code {
  font-family: var(--font-mono);
  color: var(--rose-gold);
  font-size: 0.85rem;
  background: rgba(202, 143, 101, 0.05);
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
}

/* ---------- Sections + dividers ---------- */
.revere section { padding: 4.5rem 0; border-bottom: 1px solid var(--border); }
.revere section:last-of-type { border-bottom: none; }

.revere .gold-divider { width: 80px; height: 1px; background: var(--rose-gold); margin: 2.5rem 0; opacity: 0.55; }
.revere .gold-divider.center { margin-left: auto; margin-right: auto; }

/* ---------- Buttons ---------- */
.revere a.btn,
.revere .btn {
  display: inline-block;
  font-family: var(--font-tag);
  font-size: 0.85rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.95rem 1.75rem;
  border-radius: 3px;
  border: 1px solid transparent !important;
  cursor: pointer;
  transition: transform .1s ease;
  text-decoration: none !important;
  position: relative;
  isolation: isolate;
}
.revere .btn:hover { transform: translateY(-1px); }
.revere .btn:active { transform: translateY(0); }

.revere .btn-primary,
.revere a.btn-primary,
.revere .btn-primary:hover,
.revere .btn-primary:focus,
.revere a.btn-primary:hover,
.revere a.btn-primary:focus {
  background: transparent;
  color: var(--charcoal) !important;  /* lock text color so generic a:hover doesn't bleed in */
  border-color: transparent;
}
.revere .btn-primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--rose-gold);
  border-radius: inherit;
  z-index: -1;
  transition: background .15s ease;
}
.revere .btn-primary:hover::after { background: var(--rose-gold-light); }

/* Fire-of-liberty glow on the primary CTA — hidden at rest, ignites on hover */
.revere .btn-primary::before {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 6px;
  background: conic-gradient(
    from var(--revere-glow-angle),
    hsl(0, 90%, 38%),
    hsl(15, 92%, 45%),
    hsl(28, 80%, 42%),
    hsl(8, 90%, 42%),
    hsl(20, 85%, 45%),
    hsl(0, 90%, 38%)
  );
  filter: blur(6px);
  opacity: 0;
  z-index: -2;
  animation: revere-fire-cycle 14s linear infinite paused;
  transition: opacity .25s ease, inset .25s ease, filter .25s ease;
}
.revere .btn-primary:hover::before {
  opacity: 0.78;
  inset: -5px;
  filter: blur(8px);
  animation-play-state: running;
}

.revere .btn-ghost,
.revere a.btn-ghost {
  background: transparent;
  color: var(--rose-gold) !important;
  border-color: var(--rose-gold) !important;
}
.revere .btn-ghost:hover,
.revere a.btn-ghost:hover {
  background: var(--rose-gold);
  color: var(--charcoal) !important;
}

.revere .btn-block { display: block; width: 100%; text-align: center; }

@keyframes revere-fire-cycle {
  to { --revere-glow-angle: 360deg; }
}

/* ---------- Forms ---------- */
.revere .form-row { margin-bottom: 1.25rem; }
.revere label {
  display: block;
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold);
  margin-bottom: 0.4rem;
}
.revere input[type="text"],
.revere input[type="email"],
.revere input[type="tel"],
.revere input[type="number"],
.revere input[type="search"],
.revere input[type="url"],
.revere textarea,
.revere select {
  width: 100%;
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  border-radius: 4px;
  padding: 0.7rem 0.85rem;
  color: var(--cream);
  font-family: var(--font-body);
  font-size: 0.95rem;
  transition: border-color .15s ease;
}
.revere input:focus, .revere textarea:focus, .revere select:focus {
  outline: none;
  border-color: var(--rose-gold);
}
.revere textarea { min-height: 140px; resize: vertical; }

/* ---------- Cards ---------- */
.revere .card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin: 1.5rem 0;
}
.revere .card-grid.three { grid-template-columns: repeat(3, 1fr); }

.revere .card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 1.5rem;
}
.revere .card .card-label {
  font-family: var(--font-tag);
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  color: var(--rose-gold);
  text-transform: uppercase;
  margin-bottom: 0.65rem;
}
.revere .card p { font-size: 0.92rem; line-height: 1.65; margin-bottom: 0; color: #aea79f; }
.revere .card.accent { border-left: 3px solid var(--rose-gold); border-radius: 0 6px 6px 0; }

/* ---------- Pillars ---------- */
.revere .pillar {
  background: var(--card-bg);
  border-left: 2px solid var(--rose-gold);
  padding: 1.75rem 2rem;
  margin: 1.25rem 0;
}
.revere .pillar-label {
  font-family: var(--font-tag);
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  color: var(--rose-gold);
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}
.revere .pillar h3 { font-size: 1.5rem; margin: 0 0 0.4rem; }
.revere .pillar-tagline {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1rem;
  color: var(--cream);
  margin-bottom: 1rem;
  letter-spacing: 0.01em;
}
.revere .pillar p { font-size: 0.94rem; line-height: 1.7; margin-bottom: 0.75rem; }
.revere .pillar .proof {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--hairline);
  list-style: none;
  padding-left: 0;
}
.revere .pillar .proof li {
  font-size: 0.85rem;
  padding: 0.25rem 0 0.25rem 1.25rem;
  position: relative;
  color: var(--smoke);
}
.revere .pillar .proof li::before { content: '\2014'; position: absolute; left: 0; color: var(--rose-gold); }

/* ---------- Hero / section / inline visuals ---------- */
.revere .hero-visual {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
  background: var(--charcoal-deep);
  width: 100%;
  height: 78vh;
  min-height: 540px;
}
.revere .hero-visual > video,
.revere .hero-visual > img.hero-bg {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 35%;
  filter: brightness(0.7) saturate(0.95);
  z-index: 1;
}
/* Full-area subtle mask for text legibility */
.revere .hero-visual::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, rgba(31,31,31,0.55) 0%, rgba(31,31,31,0.4) 45%, rgba(31,31,31,0.75) 100%);
  pointer-events: none;
  z-index: 2;
}
/* Soft bottom fade into next section */
.revere .hero-visual::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 22%;
  background: linear-gradient(180deg, rgba(31,31,31,0) 0%, var(--charcoal) 100%);
  pointer-events: none;
  z-index: 2;
}
/* Hero content — absolutely centered, no flex */
.revere .hero-visual .hero-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 4;
  width: 92%;
  max-width: 760px;
  text-align: center;
  padding: 0 1rem;
}
.revere .hero-visual .hero-content h1 { color: var(--bone); margin-bottom: 1rem; }

/* Product accent — pulled well in from the screen edge so it sits beside the text */
.revere .hero-visual .hero-product {
  position: absolute !important;
  right: 22% !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  height: 68% !important;
  max-height: 600px !important;
  width: auto !important;
  z-index: 3 !important;
  opacity: 0.94;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,0.7));
  pointer-events: none;
}
@media (max-width: 1440px) {
  .revere .hero-visual .hero-product { right: 12% !important; height: 60% !important; }
}
@media (max-width: 1100px) {
  .revere .hero-visual .hero-product { right: 4% !important; height: 50% !important; opacity: 0.85; }
}

/* Caption pinned to the bottom of hero (used by brand-guide-style heroes) */
.revere .hero-visual .caption {
  position: absolute;
  bottom: 1.5rem;
  left: 0; right: 0;
  text-align: center;
  z-index: 2;
  font-family: var(--font-tag);
  font-size: 0.85rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--rose-gold);
}

.revere .section-visual {
  margin: 1.5rem 0 2rem;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--card-border);
  position: relative;
}
.revere .section-visual img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16/7;
  object-fit: cover;
}
.revere .section-visual .overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(31,31,31,0) 45%, rgba(31,31,31,0.92) 100%);
  pointer-events: none;
}
.revere .section-visual .visual-caption {
  position: absolute; bottom: 1rem; left: 1.5rem; right: 1.5rem;
  font-family: var(--font-tag);
  font-size: 0.85rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--cream);
}

.revere .inline-visual {
  float: right;
  width: 220px;
  margin: 0 0 1rem 1.75rem;
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 1.25rem 1rem 1rem;
  text-align: center;
}
.revere .inline-visual img { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.revere .inline-visual .visual-meta {
  margin-top: 0.75rem;
  font-family: var(--font-tag);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--smoke);
}

/* ---------- Cigar block (used in single-product + lineup) ---------- */
.revere .cigar {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 2rem;
  margin: 1.5rem 0;
}
.revere .cigar-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem;
  border-bottom: 1px solid var(--hairline);
  padding-bottom: 1rem;
  margin-bottom: 1.25rem;
}
.revere .cigar-header h3 { margin: 0; font-size: 1.6rem; }
.revere .cigar-header .pull {
  margin: 0.35rem 0 0;
  color: var(--cream);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 0.95rem;
}
.revere .cigar-meta {
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  color: var(--rose-gold);
  text-transform: uppercase;
}

.revere .cigar-box-shot {
  margin: 0 0 2rem;
  background: transparent;
  border: none;
}
.revere .cigar-box-shot img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 520px;
  margin: 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 40px rgba(0, 0, 0, 0.55));
}

.revere .cigar-stick {
  float: right;
  width: 150px;
  margin: 0 0 1rem 1.75rem;
  text-align: center;
}
.revere .cigar-stick img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.5));
}
.revere .cigar-stick .stick-meta {
  margin-top: 0.85rem;
  font-family: var(--font-tag);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--smoke);
}

.revere .cigar-spec {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem 1.5rem;
  margin: 1.25rem 0;
  padding: 1.25rem;
  background: var(--charcoal-deep);
  border-radius: 4px;
}
.revere .cigar-spec dt {
  font-family: var(--font-tag);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  color: var(--smoke);
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}
.revere .cigar-spec dd { font-size: 0.92rem; color: var(--cream); margin: 0; }

/* ---------- Checklist + word lists ---------- */
.revere .checklist { list-style: none; padding: 0; margin: 0.5rem 0 1.25rem; }
.revere .checklist li {
  padding: 0.5rem 0 0.5rem 1.75rem;
  position: relative;
  font-size: 0.92rem;
  color: #aea79f;
}
.revere .checklist li::before {
  content: '';
  position: absolute; left: 0; top: 0.95rem;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--rose-gold);
}
.revere .checklist.avoid li::before { background: var(--negative); }
.revere .checklist.positive li::before { background: var(--positive); }

.revere .word-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1rem 0 2rem; }
.revere .word-list span {
  background: rgba(202, 143, 101, 0.08);
  border: 1px solid rgba(202, 143, 101, 0.18);
  border-radius: 3px;
  padding: 0.35rem 0.7rem;
  font-size: 0.82rem;
  color: var(--cream);
}

/* ---------- Site chrome: nav + footer ---------- */
.revere-nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: rgba(31, 31, 31, 0.95) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border) !important;
  display: block !important;
  width: 100% !important;
  min-height: 88px;
}
.revere-nav .nav-inner {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0.85rem 2rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem;
}
.revere-nav .brand-link {
  display: inline-flex !important;
  align-items: center !important;
  border-bottom: none !important;
  flex-shrink: 0;
  text-decoration: none !important;
}
.revere-nav .brand-link img {
  height: 72px !important;
  width: auto !important;
  max-width: none !important;
  display: block !important;
  border: none !important;
}
.revere-nav ul.menu {
  display: flex;
  gap: 1.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.revere-nav ul.menu a {
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cream);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}
.revere-nav ul.menu a:hover,
.revere-nav ul.menu a.current { color: var(--rose-gold); border-bottom-color: var(--rose-gold); }

.revere-nav .nav-cart {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold);
  border-bottom: none;
}
.revere-nav .nav-toggle { display: none; background: none; border: 0; color: var(--cream); cursor: pointer; padding: 0.25rem; }

.revere-footer {
  background: var(--charcoal-deep);
  border-top: 1px solid var(--border);
  padding: 4rem 0 2rem;
  margin-top: 4rem;
  text-align: center;
}
.revere-footer .keep-lit-foot {
  font-family: var(--font-tag);
  color: var(--rose-gold);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  font-size: 0.85rem;
  margin: 1.5rem 0;
}

.revere-footer .footer-name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--cream);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.revere-footer p { font-size: 0.85rem; color: var(--smoke); max-width: none; margin: 0.25rem auto; }
.revere-footer .footer-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  text-align: left;
  max-width: var(--container-max);
  margin: 0 auto 2rem;
  padding: 0 2rem;
}
.revere-footer .footer-cols h4 { color: var(--rose-gold); margin-bottom: 0.85rem; }
.revere-footer .footer-cols ul { list-style: none; padding: 0; margin: 0; }
.revere-footer .footer-cols li { padding: 0.25rem 0; }
.revere-footer .footer-cols a { color: var(--cream); border-bottom: none; }
.revere-footer .footer-cols a:hover { color: var(--rose-gold); }
.revere-footer .copy { padding: 0 2rem; font-size: 0.75rem; color: var(--smoke-deep); }
.revere-footer .footer-mark {
  display: block;
  margin: 1rem auto 0.5rem;
  width: 32px;
  height: 32px;
  opacity: 0.75;
}
.revere-footer .copy-keys {
  display: inline-block;
  vertical-align: middle;
  height: 18px;
  width: auto;
  margin-left: 0.55rem;
  opacity: 0.7;
}

/* ---------- Product grid (lineup landing) ---------- */
.revere .product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
  margin: 2.5rem 0;
}
.revere .product-card {
  position: relative;
  isolation: isolate;
  border-radius: 10px;
  text-align: center;
  transition: transform .25s ease;
}

/* Fire-of-liberty glow ring — dialed back, deep ember palette (no yellow) */
.revere .product-card::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 12px;
  background: conic-gradient(
    from var(--revere-glow-angle),
    hsl(0, 90%, 38%),
    hsl(15, 92%, 45%),
    hsl(28, 80%, 42%),
    hsl(8, 90%, 42%),
    hsl(20, 85%, 45%),
    hsl(0, 90%, 38%)
  );
  filter: blur(6px);
  opacity: 0.32;
  z-index: -2;
  animation: revere-fire-cycle 16s linear infinite;
}

/* Solid backdrop so the glow doesn't bleed through the card surface */
.revere .product-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  border-radius: 10px;
  z-index: -1;
  transition: background .2s ease, border-color .2s ease;
}

.revere .product-card:hover { transform: translateY(-4px); }
.revere .product-card:hover::before {
  filter: blur(16px);
  opacity: 0.95;
  inset: -6px;
  animation-duration: 4s;
}
.revere .product-card:hover::after {
  background: var(--charcoal);
  border-color: rgba(202, 143, 101, 0.35);
}

.revere .product-card a {
  display: block;
  border-bottom: none;
  padding: 2rem 1.5rem 1.75rem;
  color: var(--cream);
  border-radius: 10px;
}
.revere .product-card img { display: block; width: 100%; height: clamp(300px, 32vw, 420px); object-fit: contain; margin-bottom: 1rem; }
.revere .product-card h3 { font-size: 1.25rem; margin-bottom: 0.25rem; }
.revere .product-card .product-meta {
  font-family: var(--font-tag);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold);
}
.revere .product-card .product-price {
  margin-top: 0.75rem;
  font-family: var(--font-mono);
  font-size: 0.95rem;
  color: var(--bone);
}

/* ---------- WooCommerce skin (cart / checkout / my-account / wishlist) ---------- */

/* Prices and product names use brand fonts wherever WC renders them */
body.revere-body .woocommerce ul.products li.product .price,
body.revere-body .woocommerce div.product p.price,
body.revere-body .woocommerce div.product span.price,
body.revere-body .woocommerce-page .price {
  color: var(--rose-gold);
  font-family: var(--font-mono);
}

/* Notices: replace WC default green/red bars with our card system */
body.revere-body .woocommerce-info,
body.revere-body .woocommerce-message,
body.revere-body .woocommerce-error {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-top: 3px solid var(--rose-gold);
  border-radius: 4px;
  color: var(--cream);
  padding: 1rem 1.25rem 1rem 3.25rem;
  font-family: var(--font-body);
  font-size: 0.95rem;
  margin-bottom: 1.5rem;
}
body.revere-body .woocommerce-message { border-top-color: var(--positive); }
body.revere-body .woocommerce-error  { border-top-color: var(--negative); }
body.revere-body .woocommerce-info::before,
body.revere-body .woocommerce-message::before,
body.revere-body .woocommerce-error::before {
  color: var(--rose-gold);
  top: 1rem;
  left: 1rem;
}
body.revere-body .woocommerce-message::before { color: var(--positive); }
body.revere-body .woocommerce-error::before  { color: var(--negative); }
body.revere-body .woocommerce-info a,
body.revere-body .woocommerce-message a,
body.revere-body .woocommerce-error a {
  color: var(--rose-gold);
  border-bottom: 1px solid var(--border);
}

/* Buttons — full brand-button treatment */
body.revere-body .woocommerce button.button,
body.revere-body .woocommerce a.button,
body.revere-body .woocommerce input.button,
body.revere-body .woocommerce #respond input#submit,
body.revere-body .woocommerce button.button.alt,
body.revere-body .woocommerce a.button.alt,
body.revere-body .woocommerce input.button.alt,
body.revere-body .woocommerce #place_order {
  background: var(--rose-gold);
  color: var(--charcoal) !important;
  font-family: var(--font-tag);
  font-size: 0.85rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.95rem 1.75rem;
  border-radius: 3px;
  border: 1px solid var(--rose-gold);
  text-decoration: none !important;
  transition: background .15s ease, border-color .15s ease, transform .1s ease;
  cursor: pointer;
}
body.revere-body .woocommerce button.button:hover,
body.revere-body .woocommerce a.button:hover,
body.revere-body .woocommerce input.button:hover,
body.revere-body .woocommerce button.button.alt:hover,
body.revere-body .woocommerce a.button.alt:hover,
body.revere-body .woocommerce #place_order:hover {
  background: var(--rose-gold-light);
  border-color: var(--rose-gold-light);
  color: var(--charcoal) !important;
  transform: translateY(-1px);
}
body.revere-body .woocommerce button.button:disabled,
body.revere-body .woocommerce button.button.disabled {
  background: var(--charcoal-soft);
  border-color: var(--card-border);
  color: var(--smoke) !important;
  cursor: not-allowed;
}

/* All form inputs (cart, checkout, my-account, login) */
body.revere-body .woocommerce form .form-row input.input-text,
body.revere-body .woocommerce form .form-row textarea,
body.revere-body .woocommerce form .form-row select,
body.revere-body .woocommerce-form-login input.input-text,
body.revere-body .woocommerce-form-register input.input-text,
body.revere-body .woocommerce-EditAccountForm input.input-text,
body.revere-body .woocommerce-cart input[type="text"],
body.revere-body .woocommerce-checkout input[type="text"],
body.revere-body .woocommerce-checkout input[type="email"],
body.revere-body .woocommerce-checkout input[type="tel"],
body.revere-body .woocommerce-checkout input[type="password"],
body.revere-body .woocommerce-checkout textarea,
body.revere-body .woocommerce-checkout select {
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  border-radius: 4px;
  color: var(--cream);
  font-family: var(--font-body);
  font-size: 0.95rem;
  padding: 0.7rem 0.85rem;
  width: 100%;
  box-sizing: border-box;
}
body.revere-body .woocommerce form .form-row input.input-text:focus,
body.revere-body .woocommerce form .form-row textarea:focus,
body.revere-body .woocommerce form .form-row select:focus,
body.revere-body .woocommerce-checkout input:focus,
body.revere-body .woocommerce-checkout textarea:focus,
body.revere-body .woocommerce-checkout select:focus {
  outline: none;
  border-color: var(--rose-gold);
}
body.revere-body .woocommerce form .form-row label,
body.revere-body .woocommerce-form label,
body.revere-body .woocommerce-checkout label {
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rose-gold);
  margin-bottom: 0.4rem;
  display: block;
}
body.revere-body .woocommerce form .form-row .required {
  color: var(--negative);
  text-decoration: none;
  margin-left: 0.2rem;
}

/* Quantity widget — BeTheme outputs:
     <a class="quantity-change minus"><i class="icon-minus"></i></a>
     <input class="qty" type="number" value="1">
     <a class="quantity-change plus"><i class="icon-plus"></i></a>
   BeTheme's parent CSS positions the +/- buttons absolutely, which makes them
   overlap the input when we're not using BeTheme's surrounding wrapper. Force
   flex + static positioning + explicit gap to lay them out side-by-side. */
body.revere-body .woocommerce .quantity {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  position: relative !important;
  vertical-align: middle;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.revere-body .woocommerce .quantity > * {
  position: static !important; /* defeat BeTheme's absolute positioning */
  flex: 0 0 auto;
  margin: 0 !important;
  vertical-align: middle;
}

body.revere-body .woocommerce .quantity input.qty {
  background: var(--charcoal-deep) !important;
  border: 1px solid var(--card-border) !important;
  color: var(--cream) !important;
  text-align: center !important;
  font-family: var(--font-mono) !important;
  font-size: 1rem !important;
  padding: 0 0.4rem !important;
  width: 60px !important;
  height: 42px !important;
  line-height: 40px !important;
  border-radius: 4px !important;
  -moz-appearance: textfield;
  box-sizing: border-box !important;
  order: 2;
}
body.revere-body .woocommerce .quantity input.qty::-webkit-inner-spin-button,
body.revere-body .woocommerce .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

body.revere-body .woocommerce .quantity .quantity-change,
body.revere-body .woocommerce .quantity a.quantity-change {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  background: var(--charcoal-deep) !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 4px !important;
  color: var(--rose-gold) !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer;
  user-select: none;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-indent: 0 !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
}
body.revere-body .woocommerce .quantity .quantity-change.minus { order: 1; }
body.revere-body .woocommerce .quantity .quantity-change.plus  { order: 3; }
body.revere-body .woocommerce .quantity .quantity-change:hover {
  background: var(--charcoal-soft) !important;
  color: var(--rose-gold-light) !important;
  border-color: var(--rose-gold) !important;
}
body.revere-body .woocommerce .quantity .quantity-change i {
  display: inline-block;
  font-style: normal;
  vertical-align: middle;
}
/* If BeTheme's icon-font hasn't loaded, fall back to + and - characters */
body.revere-body .woocommerce .quantity .quantity-change.minus i.icon-minus::before { content: '−'; }
body.revere-body .woocommerce .quantity .quantity-change.plus  i.icon-plus::before  { content: '+'; }

/* Add to cart row on single product pages — keep button readable.
   BeTheme's parent layout flexes the quantity widget + add-to-cart + wishlist
   heart into a single row, which shrinks the button until "Add to cart" wraps
   vertically (one word per line). Force the button to keep its text on one
   line and not get crushed by its flex siblings. */
body.revere-body .woocommerce form.cart .single_add_to_cart_button,
body.revere-body .woocommerce form.variations_form .single_add_to_cart_button {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 12rem;
  white-space: nowrap;
  padding: 0.95rem 1.75rem !important;
}
/* Wishlist heart should also not flex-grow */
body.revere-body .woocommerce form.cart .mfn-wish-button,
body.revere-body .woocommerce form.variations_form .mfn-wish-button {
  flex: 0 0 auto;
  margin-left: 0.5rem;
}
/* If the form row doesn't have enough horizontal room, let it wrap to a new
   line gracefully instead of squishing children */
body.revere-body .woocommerce form.cart,
body.revere-body .woocommerce form.variations_form {
  flex-wrap: wrap;
  row-gap: 0.75rem;
}

/* Cart-row thumbnail rendered by our filter (functions.php) */
body.revere-body .woocommerce .product-thumbnail .revere-cart-thumb,
body.revere-body .woocommerce .product-thumbnail img {
  max-width: 80px;
  height: auto;
  border-radius: 4px;
  background: var(--charcoal-deep);
  padding: 4px;
  border: 1px solid var(--card-border);
}

/* Cart table */
body.revere-body .woocommerce-cart-form table.cart,
body.revere-body .woocommerce table.shop_table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
  color: var(--cream);
  margin-bottom: 1.5rem;
  border: 1px solid var(--card-border);
  border-radius: 6px;
  overflow: hidden;
}
body.revere-body .woocommerce table.shop_table th {
  background: var(--charcoal-deep);
  color: var(--rose-gold);
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 1rem;
  text-align: left;
  border-bottom: 1px solid var(--card-border);
}
body.revere-body .woocommerce table.shop_table td {
  padding: 1rem;
  border-bottom: 1px solid var(--hairline);
  color: var(--cream);
  background: transparent;
  vertical-align: middle;
}
body.revere-body .woocommerce table.shop_table tr:last-child td { border-bottom: none; }
body.revere-body .woocommerce table.shop_table tr:hover td { background: rgba(202, 143, 101, 0.04); }

body.revere-body .woocommerce-cart-form .product-thumbnail img {
  max-width: 64px;
  height: auto;
  border-radius: 4px;
}
body.revere-body .woocommerce-cart-form .product-name a {
  color: var(--cream);
  text-decoration: none;
  border-bottom: none;
  font-family: var(--font-display);
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
body.revere-body .woocommerce-cart-form .product-name a:hover {
  color: var(--rose-gold);
}
body.revere-body .woocommerce a.remove {
  color: var(--smoke) !important;
  font-size: 1.4rem;
  font-weight: normal;
  border: none;
  background: transparent;
}
body.revere-body .woocommerce a.remove:hover {
  color: var(--negative) !important;
  background: transparent;
}

/* Coupon row at bottom of cart */
body.revere-body .woocommerce-cart-form .coupon {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
body.revere-body .woocommerce-cart-form .coupon input.input-text {
  width: auto;
  flex: 1;
  max-width: 240px;
}

/* Cart totals + checkout review boxes */
body.revere-body .cart_totals,
body.revere-body .woocommerce-checkout-review-order {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 1.5rem;
}
body.revere-body .cart_totals h2,
body.revere-body #order_review_heading {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--bone);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}
body.revere-body .cart_totals .order-total .amount,
body.revere-body .woocommerce-checkout-review-order .order-total .amount {
  color: var(--bone);
  font-size: 1.15rem;
  font-family: var(--font-mono);
  font-weight: 600;
}

body.revere-body .wc-proceed-to-checkout { padding-top: 1rem; }
body.revere-body .wc-proceed-to-checkout .checkout-button {
  display: block;
  text-align: center;
  width: 100%;
  font-size: 0.9rem;
  padding: 1.1rem 1.5rem;
}

/* Checkout: 2-column layout (billing left, order review right).
   Right column needs to be wide enough to comfortably show the order summary
   plus the credit-card form (Auth.net renders 4 fields with side-by-side
   pairs). Bumped from 1.5fr/1fr to 1.15fr/1fr. */
body.revere-body .woocommerce-checkout {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 2.5rem;
}
body.revere-body .woocommerce-checkout .col2-set,
body.revere-body .woocommerce-checkout .woocommerce-billing-fields,
body.revere-body .woocommerce-checkout .woocommerce-shipping-fields,
body.revere-body .woocommerce-checkout .woocommerce-additional-fields {
  grid-column: 1;
}
body.revere-body .woocommerce-checkout #order_review_heading,
body.revere-body .woocommerce-checkout #order_review {
  grid-column: 2;
}
body.revere-body .woocommerce-checkout h3 {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--bone);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}
body.revere-body .woocommerce-checkout #order_review { position: sticky; top: 110px; }

/* Payment methods */
body.revere-body #payment {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 1.25rem;
  margin-top: 1rem;
}
body.revere-body #payment ul.payment_methods {
  border-bottom: 1px solid var(--card-border);
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
body.revere-body #payment ul.payment_methods li {
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  border-radius: 4px;
  padding: 0.85rem 1rem;
  margin-bottom: 0.5rem;
  list-style: none;
}
body.revere-body #payment ul.payment_methods li label {
  font-family: var(--font-body);
  font-size: 0.95rem;
  letter-spacing: 0;
  text-transform: none;
  color: var(--cream);
  display: inline;
  margin-left: 0.4rem;
}
body.revere-body #payment ul.payment_methods .payment_box {
  background: var(--charcoal);
  border-radius: 4px;
  padding: 1rem;
  margin-top: 0.75rem;
  color: var(--cream);
  font-size: 0.9rem;
}
body.revere-body #payment .place-order { padding-top: 1rem; }

/* Auth.net plugin's payment_box has inline-styled width/margin constraints that
   make the credit-card form look narrow inside our brand card. Override the
   inline 40px left margin on the field wrapper, the inline 90% input width,
   and pair Card# + CVV (and Expiry Month + Year) side-by-side so the form
   fills the payment card cleanly. */
body.revere-body #payment .payment_method_anet .woocommerce-billing-fields__field-wrapper_credit_card {
  margin-left: 0 !important;
}
body.revere-body #payment .payment_method_anet .text-input-credit-card {
  width: 100% !important;
  box-sizing: border-box;
}
body.revere-body #payment .payment_method_anet .form-row-pair {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1rem;
}
body.revere-body #payment .payment_method_anet .form-row-pair > .form-row {
  flex: 1 1 calc(50% - 0.5rem);
  min-width: 11rem;
  margin-bottom: 0.75rem;
}

/* My Account: side-nav layout */
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation {
  width: 220px;
  float: left;
  margin-right: 2.5rem;
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation ul li {
  border-bottom: 1px solid var(--hairline);
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 0.85rem 0;
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cream);
  text-decoration: none;
  border-bottom: none;
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  color: var(--rose-gold);
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-content {
  margin-left: 260px;
}
body.revere-body .woocommerce-account .woocommerce-MyAccount-content h2,
body.revere-body .woocommerce-account .woocommerce-MyAccount-content h3 {
  font-family: var(--font-display);
  color: var(--bone);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 1rem;
}

/* Login + register columns side-by-side */
body.revere-body .u-columns.col2-set {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
}
body.revere-body .u-columns.col2-set h2 {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--bone);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}
body.revere-body .lost_password a { color: var(--rose-gold); border-bottom: 1px solid var(--border); }

/* Order summary tables (both order received + order review) */
body.revere-body .woocommerce-checkout-review-order-table tfoot th,
body.revere-body .cart_totals .shop_table th {
  background: var(--charcoal-deep);
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--smoke);
}
body.revere-body .woocommerce-order-overview {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 6px;
  padding: 1.5rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin: 1.5rem 0;
}
body.revere-body .woocommerce-order-overview li {
  font-family: var(--font-tag);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--smoke);
  border: none;
  padding: 0;
}
body.revere-body .woocommerce-order-overview li strong {
  display: block;
  font-family: var(--font-mono);
  color: var(--cream);
  font-size: 1rem;
  letter-spacing: 0;
  text-transform: none;
  margin-top: 0.25rem;
}

/* Wishlist (YITH) — basic skin */
body.revere-body .yith-wcwl-wishlist-new,
body.revere-body table.shop_table_responsive {
  background: transparent;
  color: var(--cream);
}
body.revere-body .yith-wcwl-wishlist-new input[type="text"] {
  background: var(--charcoal-deep);
  border: 1px solid var(--card-border);
  color: var(--cream);
}

/* Responsive collapse */
@media (max-width: 880px) {
  body.revere-body .woocommerce-checkout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  body.revere-body .woocommerce-checkout #order_review_heading,
  body.revere-body .woocommerce-checkout #order_review { grid-column: 1; position: static; }
  body.revere-body .u-columns.col2-set { grid-template-columns: 1fr; }
  body.revere-body .woocommerce-account .woocommerce-MyAccount-navigation {
    width: 100%;
    float: none;
    margin: 0 0 1.5rem;
  }
  body.revere-body .woocommerce-account .woocommerce-MyAccount-content { margin-left: 0; }
  body.revere-body .woocommerce table.shop_table thead { display: none; }
  body.revere-body .woocommerce table.shop_table tr { display: block; padding: 1rem; border-bottom: 1px solid var(--card-border); }
  body.revere-body .woocommerce table.shop_table td { display: block; border: none; padding: 0.35rem 0; }
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .revere .product-grid { grid-template-columns: 1fr 1fr; }
  .revere-footer .footer-cols { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .revere .container { padding: 0 1.25rem; }
  .revere section { padding: 3rem 0; }
  .revere .card-grid, .revere .card-grid.three { grid-template-columns: 1fr; }
  .revere .product-grid { grid-template-columns: 1fr; }
  .revere-footer .footer-cols { grid-template-columns: 1fr; }
  /* Two-column section layouts collapse to single column on mobile */
  main.revere section .container[style*="grid-template-columns: 1fr 1fr"],
  main.revere section .container[style*="grid-template-columns: 1fr 1.6fr"] {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  .revere .inline-visual { float: none; width: 100%; margin: 1rem 0; }
  .revere .cigar-stick { float: none; width: 60%; margin: 1rem auto; }
  .revere .hero-visual { min-height: 88vh; }
  .revere .hero-visual .hero-product { display: none; }
  .revere .section-visual img { aspect-ratio: 4/3; }
  .revere .cigar-header { flex-direction: column; align-items: flex-start; }

  .revere-nav .nav-inner { flex-wrap: wrap; }
  .revere-nav ul.menu { display: none; flex-basis: 100%; flex-direction: column; gap: 0.6rem; padding-top: 0.75rem; border-top: 1px solid var(--hairline); }
  .revere-nav.open ul.menu { display: flex; }
  .revere-nav .nav-toggle { display: inline-flex; }
}

/* Stack billing + ship-to/order-notes into one column on the left side of checkout
   (BeTheme/WC default puts .col-1 billing and .col-2 ship-to+notes side-by-side) */
body.revere-body .woocommerce-checkout .col2-set {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
body.revere-body .woocommerce-checkout .col2-set .col-1,
body.revere-body .woocommerce-checkout .col2-set .col-2 {
  width: 100%;
  max-width: 100%;
  float: none;
  padding-left: 0;
  padding-right: 0;
}