/* ============================================
   TALK WITH TASHA — Brand System
   ============================================ */

:root {
  --chest-black:    #0D0D0D;
  --refined-gold:   #C9A84C;
  --velvet-red:     #6B1427;
  --booking-red:    #C0182E;
  --pearl-cream:    #EDE8DF;
  --pearl-mid:      #C8BFB0;
  --wood-dark:      #5C3317;
  --wood-mid:       #8B5A2B;
  --wood-light:     #A0692F;
}

/* ── Global body ── */
body {
  background-color: var(--chest-black);
  color: var(--pearl-cream);
}

/* ── Headings — elegant serif feel ── */
h1, h2, h3, h4, h5, h6 {
  color: var(--pearl-cream);
  letter-spacing: 0.02em;
}

/* ── Gold headings on dark sections ── */
.gold-heading {
  color: var(--refined-gold);
}

/* ── Links ── */
a {
  color: var(--refined-gold);
  text-decoration: none;
}
a:hover {
  color: var(--pearl-cream);
}

/* ── Wood grain top bar ── */
.site-header::before {
  content: '';
  display: block;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--wood-dark),
    var(--wood-mid),
    var(--wood-light),
    var(--wood-mid),
    var(--wood-dark)
  );
}

/* ── Pearl strand divider (reusable class) ── */
.pearl-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin: 2rem auto;
  width: fit-content;
}
.pearl-divider .p {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(
    circle at 32% 28%,
    #ffffff 0%,
    var(--pearl-cream) 35%,
    var(--pearl-mid) 70%,
    #a09585 100%
  );
  box-shadow:
    inset -2px -2px 4px rgba(0,0,0,0.25),
    0 1px 3px rgba(0,0,0,0.3);
}
.pearl-divider .p-sm { width: 8px;  height: 8px;  }
.pearl-divider .p-lg { width: 16px; height: 16px; }
.pearl-divider .t {
  width: 10px;
  height: 1px;
  background: rgba(237,232,223,0.35);
}

/* ── Gold shimmer divider ── */
.gold-divider {
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--refined-gold),
    var(--pearl-cream),
    var(--refined-gold),
    transparent
  );
  border: none;
  margin: 2.5rem 0;
}

/* ── Primary booking button (Booking Red) ── */
.btn-book,
.wp-block-button__link,
input[type="submit"],
button[type="submit"] {
  background-color: var(--booking-red) !important;
  color: var(--pearl-cream) !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 14px 28px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  cursor: pointer !important;
  transition: background-color 0.3s ease, transform 0.2s ease !important;
}
.btn-book:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: var(--refined-gold) !important;
  color: var(--chest-black) !important;
  transform: scale(1.02) !important;
}

/* ── Treasure chest CTA button ── */
.btn-chest {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: var(--booking-red);
  color: var(--pearl-cream);
  border: none;
  border-radius: 8px;
  padding: 14px 28px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: all 0.4s ease;
  text-decoration: none;
}
.btn-chest:hover {
  background-color: var(--refined-gold);
  color: var(--chest-black);
  transform: scale(1.03);
}
.btn-chest .chest-default { display: inline; }
.btn-chest .chest-hover   { display: none;   }
.btn-chest:hover .chest-default { display: none;   }
.btn-chest:hover .chest-hover   { display: inline; }

/* ── Section backgrounds ── */
.section-dark   { background-color: var(--chest-black);  color: var(--pearl-cream); }
.section-velvet { background-color: var(--velvet-red);   color: var(--pearl-cream); }
.section-pearl  { background-color: var(--pearl-cream);  color: var(--chest-black); }
.section-gold   { background-color: var(--refined-gold); color: var(--chest-black); }

/* ── Nav ── */
.main-nav,
.site-header {
  background: transparent !important;
}
.main-nav a {
  color: var(--pearl-cream) !important;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.main-nav a:hover {
  color: var(--refined-gold) !important;
}

/* ── Footer ── */
.site-footer {
  background-color: #0A0A0A;
  color: rgba(237,232,223,0.5);
  border-top: 1px solid rgba(201,168,76,0.2);
  padding: 2rem;
  text-align: center;
  font-size: 12px;
}


/* ── Blockquote — gold left border, elegant italic ── */
blockquote {
  border-left: 3px solid var(--refined-gold);
  padding: 12px 20px;
  margin: 1.5rem 0;
  font-style: italic;
  color: var(--refined-gold);
}

/* ── Pullquote — your pearl moment ── */
.wp-block-pullquote {
  border-top: 2px solid var(--refined-gold);
  border-bottom: 2px solid var(--refined-gold);
  padding: 1.5rem 0;
  text-align: center;
  color: var(--refined-gold);
  font-style: italic;
}

/* ── Figcaption — soft, muted ── */
figcaption {
  font-style: italic;
  font-size: 12px;
  color: rgba(237,232,223,0.45);
  letter-spacing: 0.02em;
  margin-top: 6px;
}

/* ── Preformatted ── */
pre, code {
  font-family: 'Courier New', Courier, monospace;
  font-size: 13px;
  background: rgba(237,232,223,0.06);
  border: 1px solid rgba(201,168,76,0.2);
  border-radius: 4px;
  padding: 2px 6px;
  color: var(--pearl-cream);
}

/* ── Bold weight ── */
strong, b {
  font-weight: 700;
}

/* Make hamburger menu icon visible on dark header */
.header-hamburger span,
.header-hamburger span::before,
.header-hamburger span::after,
.hamburger-menu span,
.menu-toggle span,
button.menu-toggle,
.nav-toggle span {
  background-color: #C9A84C !important; /* gold to match your brand */
}

/* Make search icon visible on dark header */
.header-search svg,
.header-search-icon svg,
.search-toggle svg,
button[aria-label="Search"] svg,
.search-icon svg {
  stroke: #C9A84C !important;
  fill: #C9A84C !important;
  color: #C9A84C !important;
}

/* Fallback: target all header buttons/icons */
header button svg,
header .search svg,
header nav svg {
  stroke: #ffffff !important;
  color: #ffffff !important;
}