@import url("https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,400;0,500;0,600;1,500&family=Jost:wght@300;400;500;600&display=swap");

:root {
  --cream: #f8f3ec !important;
  --parch: #f1dfdc !important;
  --ivory: #f8f3ec !important;
  --dark: #2b1a23 !important;
  --med: #604d56 !important;
  --taupe: #846d76 !important;
  --gold: #c9a15a !important;
  --gold-l: #d8bd86 !important;
  --lr: rgba(43, 26, 35, 0.15) !important;
  --mrc: #e8c9c5 !important;
  --b1: #6e2e46 !important;
  --b2: #4d1f31 !important;
  --b3: #8f5267 !important;
  --b4: #aa7485 !important;
  --b5: #725d66 !important;
  --razz: #6e2e46 !important;
  --font-display: "Cormorant", Georgia, serif !important;
  --font-script: "Cormorant", Georgia, serif !important;
  --font-body: "Jost", Arial, sans-serif !important;
  --radius: 1px !important;
  --shadow: 0 12px 34px rgba(43, 26, 35, 0.09) !important;
  --shadow-lg: 0 28px 70px rgba(43, 26, 35, 0.16) !important;
  --max-w: 1260px !important;
  --nav-h: 92px !important;
}

html {
  background: var(--cream);
}

body.legacy-page,
body.legacy-page input,
body.legacy-page textarea,
body.legacy-page select,
body.legacy-page button {
  font-family: var(--font-body) !important;
}

body.legacy-page * {
  font-family: var(--font-body) !important;
}

body.legacy-page {
  background: var(--cream) !important;
  color: var(--dark) !important;
  font-weight: 300;
}

body.legacy-page :where(p, a, li, span, label, input, textarea, select, button) {
  font-family: var(--font-body) !important;
}

body.legacy-page h1,
body.legacy-page h2,
body.legacy-page h3,
body.legacy-page h4,
body.legacy-page .serif {
  font-family: var(--font-display) !important;
  font-weight: 500 !important;
  letter-spacing: -0.035em !important;
  line-height: 1 !important;
}

body.legacy-page .sig,
body.legacy-page .signature {
  font-family: var(--font-script) !important;
  font-style: italic !important;
}

body.legacy-page .scripture,
body.legacy-page .ev-sub,
body.legacy-page .ev-scripture {
  font-family: var(--font-display) !important;
  font-style: italic !important;
}

body.legacy-page h1 {
  font-size: clamp(3.5rem, 7vw, 6.4rem) !important;
}

body.legacy-page h2 {
  font-size: clamp(2.7rem, 5vw, 4.5rem) !important;
}

body.legacy-page h3 {
  font-size: clamp(1.45rem, 2.4vw, 2rem) !important;
}

body.legacy-page p {
  line-height: 1.78;
}

body.legacy-page .hero-eyebrow,
body.legacy-page .micro,
body.legacy-page .ev-badge,
body.legacy-page .article-tag,
body.legacy-page .blog-tag {
  color: var(--b1) !important;
  font-family: var(--font-body) !important;
  font-size: 0.68rem !important;
  font-style: normal !important;
  font-weight: 600 !important;
  letter-spacing: 0.21em !important;
  text-transform: uppercase !important;
}

body.legacy-page .section-eyebrow,
body.legacy-page .kick {
  color: var(--b1) !important;
  font-family: var(--font-script) !important;
  font-size: 1.45rem !important;
  font-style: italic !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
}

body.legacy-page .section-eyebrow::after,
body.legacy-page .section-eyebrow::before {
  display: none !important;
  content: none !important;
}

body.legacy-page .container {
  max-width: var(--max-w) !important;
  padding-right: clamp(1.25rem, 5vw, 4rem) !important;
  padding-left: clamp(1.25rem, 5vw, 4rem) !important;
}

/* Shared header */
body.legacy-page .nav {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  z-index: 100 !important;
  height: var(--nav-h) !important;
  border-bottom: 1px solid var(--lr) !important;
  background: rgba(248, 243, 236, 0.97) !important;
  box-shadow: none !important;
}

body.legacy-page .nav-inner {
  display: flex !important;
  max-width: none !important;
  height: 100% !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 clamp(1.25rem, 5vw, 5rem) !important;
}

body.legacy-page .nav-logo {
  display: flex !important;
  align-items: center !important;
}

body.legacy-page .logo-img {
  width: 158px !important;
  height: 78px !important;
  object-fit: contain !important;
}

body.legacy-page .nav-links {
  display: flex !important;
  align-items: center !important;
  gap: clamp(1rem, 2.2vw, 2.2rem) !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.legacy-page .nav-links li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.legacy-page .nav-links a {
  color: var(--med) !important;
  font-size: 0.68rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
}

body.legacy-page .nav-links a::after {
  height: 1px !important;
  background: var(--gold) !important;
}

body.legacy-page .nav-toggle {
  display: none !important;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  border: 0;
  background: transparent;
  padding: 8px;
}

body.legacy-page .nav-toggle span {
  display: block;
  width: 23px;
  height: 1px;
  background: var(--dark);
}

/* Shared buttons and controls */
body.legacy-page .btn,
body.legacy-page button.cta {
  min-height: 47px;
  border-radius: 0 !important;
  padding: 0.82rem 1.55rem !important;
  font-family: var(--font-body) !important;
  font-size: 0.66rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

body.legacy-page .btn-primary,
body.legacy-page .btn-gold,
body.legacy-page button.cta {
  border: 1px solid var(--gold) !important;
  background: var(--gold) !important;
  color: var(--dark) !important;
  box-shadow: none !important;
}

body.legacy-page .btn-primary:hover,
body.legacy-page .btn-gold:hover,
body.legacy-page button.cta:hover {
  border-color: var(--b1) !important;
  background: var(--b1) !important;
  color: var(--cream) !important;
}

body.legacy-page .btn-outline {
  border: 1px solid var(--b1) !important;
  background: transparent !important;
  color: var(--b1) !important;
}

body.legacy-page input:not([type="hidden"]),
body.legacy-page textarea,
body.legacy-page select {
  border: 1px solid var(--lr) !important;
  border-radius: 0 !important;
  background: #fffdfa !important;
  color: var(--dark) !important;
  box-shadow: none !important;
}

body.legacy-page input:focus,
body.legacy-page textarea:focus,
body.legacy-page select:focus {
  border-color: var(--gold) !important;
  outline: 1px solid var(--gold) !important;
  outline-offset: 2px;
}

/* Shared editorial heroes */
body.legacy-page .page-hero,
body.legacy-page .article-hero,
body.legacy-page .quiz-hero,
body.legacy-page .ev-hero,
body.legacy-page .contact-hero,
body.legacy-page .about-hero {
  position: relative;
  margin: 0 !important;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem !important;
  background:
    radial-gradient(circle at 14% 20%, rgba(201, 161, 90, 0.15), transparent 29%),
    var(--b2) !important;
  color: var(--cream) !important;
  text-align: center !important;
}

body.legacy-page .page-hero h1,
body.legacy-page .article-hero h1,
body.legacy-page .quiz-hero h1,
body.legacy-page .ev-hero h1,
body.legacy-page .contact-hero h1,
body.legacy-page .about-hero h1 {
  max-width: 980px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  color: var(--cream) !important;
}

body.legacy-page .page-hero p,
body.legacy-page .article-hero p,
body.legacy-page .quiz-hero p,
body.legacy-page .ev-hero p,
body.legacy-page .contact-hero p,
body.legacy-page .about-hero p {
  max-width: 670px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  color: rgba(248, 243, 236, 0.7) !important;
}

/* Article system */
body.legacy-page .article-wrap {
  padding: clamp(4rem, 8vw, 7rem) 1.5rem 2rem !important;
}

body.legacy-page .article-body {
  max-width: 760px !important;
}

body.legacy-page .article-body p,
body.legacy-page .article-body li {
  color: var(--med) !important;
  font-size: 1.04rem !important;
  line-height: 1.9 !important;
}

body.legacy-page .article-body h2 {
  margin: 3.2rem 0 1.1rem !important;
  font-size: 2.3rem !important;
}

body.legacy-page .article-body .post-scripture {
  border: 0 !important;
  border-top: 1px solid var(--gold) !important;
  border-bottom: 1px solid var(--gold) !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 2rem 1rem !important;
  color: var(--b1) !important;
  font-family: var(--font-display) !important;
  font-size: 1.5rem !important;
}

body.legacy-page .article-cta {
  background: var(--b1) !important;
}

body.legacy-page .article-comments-inner,
body.legacy-page .blog-card,
body.legacy-page .faq-item,
body.legacy-page .contact-form,
body.legacy-page .bulk-form,
body.legacy-page .inquiry-form {
  border: 1px solid var(--lr) !important;
  border-radius: 0 !important;
  background: #fffdfa !important;
  box-shadow: none !important;
}

/* Product and collection pages */
body.legacy-page .product-hero,
body.legacy-page .p-hero,
body.legacy-page .bs-hero,
body.legacy-page .bw-hero,
body.legacy-page .z-hero {
  background-color: var(--parch) !important;
}

body.legacy-page .product-hero h1,
body.legacy-page .p-hero h1,
body.legacy-page .bs-hero h1,
body.legacy-page .bw-hero h1,
body.legacy-page .z-hero h1 {
  font-family: var(--font-display) !important;
}

body.legacy-page .bs-grid,
body.legacy-page .bw-grid,
body.legacy-page .merch-grid,
body.legacy-page .products-grid {
  gap: 1.5rem !important;
}

body.legacy-page .bs-card,
body.legacy-page .bw-card,
body.legacy-page .merch-card,
body.legacy-page .product-card {
  border: 1px solid var(--lr) !important;
  border-radius: 0 !important;
  background: #fffdfa !important;
  box-shadow: none !important;
}

body.legacy-page .bs-cover {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
}

body.legacy-page .lightbox,
body.legacy-page .modal {
  font-family: var(--font-body) !important;
}

/* Quiz */
body.legacy-page .stage {
  min-height: 720px;
  background:
    radial-gradient(circle at 20% 15%, rgba(201, 161, 90, 0.12), transparent 28%),
    var(--b2) !important;
}

body.legacy-page .screen {
  color: var(--cream) !important;
}

body.legacy-page .screen h1,
body.legacy-page .screen h2,
body.legacy-page .scripture {
  color: var(--cream) !important;
  font-family: var(--font-display) !important;
}

body.legacy-page .q-opt {
  border: 1px solid rgba(248, 243, 236, 0.22) !important;
  border-radius: 0 !important;
  background: rgba(248, 243, 236, 0.07) !important;
  color: var(--cream) !important;
}

body.legacy-page .q-opt:hover,
body.legacy-page .q-opt.is-picked {
  border-color: var(--gold) !important;
  background: rgba(201, 161, 90, 0.13) !important;
}

body.legacy-page .r-card {
  border: 1px solid rgba(248, 243, 236, 0.18) !important;
  border-radius: 0 !important;
  background: var(--b1) !important;
}

/* Events */
.events-rebuild {
  background: var(--cream);
}

.events-intro {
  display: grid;
  min-height: 560px;
  grid-template-columns: 1fr 1fr;
}

.events-intro-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--b2);
  padding: clamp(4rem, 8vw, 8rem);
  color: var(--cream);
}

.events-intro-copy h1 {
  color: var(--cream) !important;
}

.events-intro-copy > p:not(.section-eyebrow) {
  max-width: 620px;
  margin-top: 1.5rem;
  color: rgba(248, 243, 236, 0.72);
}

.events-intro-art {
  position: relative;
  min-height: 500px;
  background:
    linear-gradient(rgba(110, 46, 70, 0.18), rgba(110, 46, 70, 0.18)),
    url("collection-tea.jpg") center / cover;
}

.events-intro-art span {
  position: absolute;
  right: 2rem;
  bottom: 2rem;
  left: 2rem;
  border: 1px solid rgba(248, 243, 236, 0.65);
  padding: 1.2rem;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 1.8rem;
  text-align: center;
}

.events-types {
  padding: clamp(5rem, 9vw, 8rem) 5vw;
}

.events-types-head {
  max-width: 760px;
  margin: 0 auto 3.5rem;
  text-align: center;
}

.events-type-grid {
  display: grid;
  max-width: 1200px;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 0 auto;
  background: var(--lr);
}

.events-type {
  background: #fffdfa;
  padding: 2.5rem;
}

.events-type span {
  color: var(--gold);
  font-size: 0.65rem;
  letter-spacing: 0.18em;
}

.events-type h2 {
  margin: 1rem 0;
  font-size: 2rem !important;
}

.events-waitlist {
  background: var(--parch);
  padding: 5rem 5vw;
  text-align: center;
}

.events-waitlist form {
  display: flex;
  max-width: 600px;
  gap: 0.6rem;
  margin: 2rem auto 0;
}

.events-waitlist input {
  min-width: 0;
  flex: 1;
  padding: 0.85rem 1rem;
}

/* Shared footer */
body.legacy-page .footer {
  background: var(--dark) !important;
  padding: 5rem 0 2rem !important;
}

body.legacy-page .footer .container {
  max-width: var(--max-w) !important;
  margin: 0 auto !important;
}

body.legacy-page .footer-grid {
  display: grid !important;
  grid-template-columns: 1.5fr repeat(3, 1fr) !important;
  gap: 3rem !important;
  border-bottom: 1px solid rgba(248, 243, 236, 0.12) !important;
  margin-bottom: 2rem !important;
  padding-bottom: 3rem !important;
}

body.legacy-page .footer-logo {
  width: 180px !important;
  height: auto !important;
  filter: brightness(0) invert(1) !important;
}

body.legacy-page .footer-links h4,
body.legacy-page .footer-contact h4 {
  color: var(--gold-l) !important;
}

body.legacy-page .footer-links ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.legacy-page .footer-links a,
body.legacy-page .footer-contact p,
body.legacy-page .footer-brand p {
  color: rgba(248, 243, 236, 0.62) !important;
}

body.legacy-page .footer-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
}

@media (max-width: 900px) {
  body.legacy-page .nav {
    height: 82px !important;
  }

  body.legacy-page .nav-links {
    position: absolute !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 90 !important;
    display: none !important;
    top: 82px !important;
    gap: 0 !important;
    background: var(--cream) !important;
    padding: 1rem 1.5rem 2rem !important;
  }

  body.legacy-page .nav-links.open {
    display: flex !important;
  }

  body.legacy-page .nav-toggle {
    display: flex !important;
  }

  body.legacy-page .nav-links a {
    width: 100%;
    border-bottom: 1px solid var(--lr);
    padding: 0.8rem 0;
  }

  .events-intro {
    grid-template-columns: 1fr;
  }

  .events-type-grid {
    grid-template-columns: 1fr;
  }

  body.legacy-page .footer-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 600px) {
  body.legacy-page h1 {
    font-size: 3.5rem !important;
  }

  body.legacy-page h2 {
    font-size: 2.65rem !important;
  }

  .events-intro-art {
    min-height: 420px;
  }

  .events-waitlist form {
    flex-direction: column;
  }

  body.legacy-page .footer-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ---- v53: unified header/footer links, no browser-default blue/purple ---- */
body.legacy-page .nav a,
body.legacy-page .footer a { text-decoration: none !important; }
body.legacy-page .nav-links a { text-transform: uppercase !important; }
body.legacy-page .nav-links a:hover { color: var(--b1) !important; }
body.legacy-page .footer-links ul,
body.legacy-page .footer-contact { list-style: none; margin: 0; padding: 0; }
body.legacy-page .footer-links li { margin: 0; padding: 0; list-style: none; }
body.legacy-page .footer-links a:hover,
body.legacy-page .footer-contact a:hover { color: #fffdfa !important; }
body.legacy-page .footer-contact a { color: rgba(248, 243, 236, 0.66) !important; }
body.legacy-page .footer-social { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; margin-top: 1.2rem; }
body.legacy-page .footer-social a {
  color: var(--gold-l) !important;
  font-size: 0.64rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase;
}
body.legacy-page .footer-social a:hover { color: #fffdfa !important; }
body.legacy-page .footer-legal { display: flex; flex-wrap: wrap; gap: 0.4rem 1.4rem; }
body.legacy-page .footer-legal a {
  color: rgba(248, 243, 236, 0.5) !important;
  font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase;
}
body.legacy-page .footer-legal a:hover { color: #fffdfa !important; }

/* Quiz page: readable labels on the mulberry background */
body.legacy-page .micro { color: var(--gold-l) !important; }
body.legacy-page .reassure { color: rgba(248, 243, 236, 0.78) !important; }

/* Mobile readability floor (v67) */
@media (max-width: 760px) {
  body.legacy-page .email-note, body.legacy-page .contact-note, body.legacy-page .micro, body.legacy-page .reassure, body.legacy-page .fine { font-size: 12.5px; }
  body.legacy-page .footer h4, body.legacy-page .footer-links h4, body.legacy-page .footer-contact h4 { font-size: 12.5px; }
  body.legacy-page .footer a, body.legacy-page .footer p, body.legacy-page .footer li { font-size: 13.5px; }
  body.legacy-page .footer-bottom p, body.legacy-page .footer-legal a { font-size: 12.5px; }
  body.legacy-page .footer-social a { font-size: 12px; }
  body.legacy-page .btn, body.legacy-page button.btn { font-size: 12.5px; }
  body.legacy-page .post-tag, body.legacy-page .article-tag, body.legacy-page .mini-tag { font-size: 12px; }
  body.legacy-page .post-meta, body.legacy-page .article-meta, body.legacy-page .mini-meta { font-size: 13px; }
  body.legacy-page .post-img { font-size: 12px; }
  body.legacy-page .cat-btn { font-size: 13px; }
  body.legacy-page .blog-read { font-size: 13.5px; }
  body.legacy-page .bw-tile .num, body.legacy-page .bw-kick, body.legacy-page .fmt, body.legacy-page .section-eyebrow { font-size: 12.5px; }
  body.legacy-page .pdp-back a, body.legacy-page .pdp-series, body.legacy-page .pdp-series a, body.legacy-page .pdp-note { font-size: 14px; }
  body.legacy-page .pdp-scripture span, body.legacy-page .post-scripture span, body.legacy-page .article-body span { font-size: 13px; }
  body.legacy-page label, body.legacy-page .cm-label { font-size: 13.5px; }
  body.legacy-page .faq-group-title { font-size: 13px; }
  body.legacy-page .article-back { font-size: 13.5px; }
  body.legacy-page .ref, body.legacy-page .vref, body.legacy-page .z-attr, body.legacy-page .z-cap, body.legacy-page .ch-kick, body.legacy-page .z-prole, body.legacy-page .z-series, body.legacy-page .z-price { font-size: 13px; }
  body.legacy-page .skip-link { font-size: 13px; }
  body.legacy-page .article-body li, body.legacy-page .article-body p { font-size: 16.5px; line-height: 1.8; }
}

@media (max-width: 760px) {
  body.legacy-page .btn, body.legacy-page a.btn, body.legacy-page button.btn { font-size: 12.5px !important; }
  body.legacy-page .article-tag { font-size: 12px !important; }
  body.legacy-page p.micro, body.legacy-page p.reassure { font-size: 12.5px !important; }
}
