/* Lindsey's colours: metallic gold buttons and merlot headlines. */
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/fonts/cormorant-garamond-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/fonts/cormorant-garamond-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --lm-gold: linear-gradient(135deg, #B8902F 0%, #E8CC73 50%, #B8902F 100%);
  --lm-gold-hover: linear-gradient(135deg, #A67F24 0%, #DDBE5E 50%, #A67F24 100%);
  --lm-button-text: #1C1830;
  --lm-merlot: #4F141B;
}

/* Every button. Dark words keep them easy to read on gold. */
.dp-btn,
.btn,
#payBtn,
#fe2-pop .fe2-pop-go {
  background: var(--lm-gold) !important;
  color: var(--lm-button-text) !important;
  border: 0 !important;
}
.dp-btn:hover,
.btn:hover,
#payBtn:hover,
#fe2-pop .fe2-pop-go:hover {
  background: var(--lm-gold-hover) !important;
}

/* Headlines on light backgrounds. */
.dp h1, .dp h2, .dp h3,
.co h1, .co h2,
.co-head h1, .co-card h2, .co-recap h2,
main h1, main h2, main h3,
#fe2-pop .fe2-pop-title {
  color: var(--lm-merlot) !important;
}

/* The band across the top of the sales page. */
.dp-announce {
  background: var(--lm-merlot) !important;
}

/* On the sales page only: the line about who this is for takes the name's place
   at the very top, above the band. Change these words here and in page.qualifier
   together. The footer still names the business. */
.site-head:has(+ main.dp) .wordmark {
  display: none;
}
.site-head:has(+ main.dp)::after {
  content: "For the woman who knows something must change, even if she cannot yet fully explain what the new chapter should look like";
  display: block;
  max-width: 720px;
  margin: 0 auto;
  color: var(--lm-merlot);
  font-size: 19px;
  font-style: italic;
  font-weight: 600;
  line-height: 1.45;
}
.dp-hero .dp-qualifier {
  display: none;
}

/* Every headline in Cormorant Garamond. It is a light, small face, so the sizes
   go up a little to stay as strong as before. */
.dp h1, .dp h2, .dp h3,
.co h1, .co h2,
.co-head h1, .co-card h2, .co-recap h2,
main h1, main h2, main h3,
.dp-faq summary,
#fe2-pop .fe2-pop-title {
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
.dp h1 {
  font-size: clamp(44px, 7vw, 66px) !important;
  line-height: 1.22 !important; /* Room so the marker colour does not cut the letters. */
}
.dp h2 {
  font-size: clamp(34px, 5vw, 48px) !important;
}
.dp h3 {
  font-size: 27px !important;
}
.dp-faq summary {
  font-size: 24px !important;
}
.co-head h1 {
  font-size: 30px !important;
}
.co-card h2, .co-recap h2 {
  font-size: 25px !important;
}

/* All three places that show the guarantee. */
.dp-guarantee-box,
.dp-mini-guarantee,
.dp-guarantee-panel {
  background: var(--lm-merlot) !important;
  border-color: var(--lm-merlot) !important;
  color: #F5EFDC !important;
}
.dp-guarantee-box strong,
.dp-mini-guarantee strong,
.dp-guarantee-panel strong {
  color: #E6C07B !important;
}

/* Every place the main price shows. */
.dp-price .dp-now,
.dp-just,
.price .now,
.co-price {
  color: var(--lm-merlot) !important;
}

/* The offer name at the top of the price box. */
.dp-pricebox h3 {
  text-align: center !important;
}

/* Check marks are merlot on light backgrounds and gold on merlot ones. */
.dp-checks li::before,
.co-includes svg {
  color: var(--lm-merlot) !important;
}
.dp-guarantee-panel .dp-checks li::before {
  color: #E6C07B !important;
}

/* The small labels above each section, like What you get. */
.dp-eyebrow,
.dp-path .dp-eyebrow {
  background: var(--lm-merlot) !important;
  color: #F5EFDC !important;
  display: table !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* The Path section. Its label flips to cream so it shows on merlot. */
.dp-path {
  background: var(--lm-merlot) !important;
}
.dp-path .dp-module {
  background: #6A2630 !important;
}
.dp-path .dp-eyebrow {
  background: #F5EFDC !important;
  color: var(--lm-merlot) !important;
}

/* Headlines on the deep bands stay white, because merlot would not show there. */
.dp-path h2, .dp-path h3,
.dp-guarantee-panel h2 {
  color: #FFFFFF !important;
}
