/* Stable category palettes: purple = anxiety/depression, green = worry/boundaries,
   brown = self-esteem/burnout. The same variables color the cover and page. */
.booklet-theme-purple {
  --theme-pale: #eeeaf4;
  --theme-mid: #e3ddeb;
  --theme-card: #faf7fc;
  --theme-deep: #3d3153;
  --theme-muted: #675c78;
  --theme-line: rgba(61, 49, 83, .16);
  --theme-shadow: rgba(61, 49, 83, .12);
}
.booklet-theme-green {
  --theme-pale: #e4ebe0;
  --theme-mid: #d5e0d0;
  --theme-card: #f7faf5;
  --theme-deep: #263c31;
  --theme-muted: #536b5f;
  --theme-line: rgba(38, 60, 49, .16);
  --theme-shadow: rgba(38, 60, 49, .12);
}
.booklet-theme-brown {
  --theme-pale: #f3e4d6;
  --theme-mid: #ead1bd;
  --theme-card: #fff8f1;
  --theme-deep: #4b3026;
  --theme-muted: #765849;
  --theme-line: rgba(75, 48, 38, .16);
  --theme-shadow: rgba(75, 48, 38, .12);
}

/* Quiet editorial treatment inspired by the supplied reference. */
.inside-product {
  background:
    radial-gradient(ellipse at 14% 18%, rgba(232, 194, 103, .15), transparent 34%),
    radial-gradient(ellipse at 82% 68%, rgba(111, 145, 126, .15), transparent 38%),
    linear-gradient(115deg, #f0f0e9 0%, #f6f2e8 48%, #eef0e9 100%);
  overflow: hidden;
  position: relative;
}
.booklet-theme-purple .inside-product,
.booklet-theme-green .inside-product,
.booklet-theme-brown .inside-product {
  background:
    radial-gradient(ellipse at 14% 18%, color-mix(in srgb, var(--theme-mid) 58%, transparent), transparent 34%),
    radial-gradient(ellipse at 82% 68%, color-mix(in srgb, var(--theme-deep) 10%, transparent), transparent 38%),
    linear-gradient(115deg, var(--theme-pale), #fffaf3 52%, var(--theme-pale));
}
.inside-product::before {
  background: rgba(255, 250, 240, .32);
  border-radius: 50%;
  content: "";
  filter: blur(55px);
  height: 420px;
  left: 35%;
  pointer-events: none;
  position: absolute;
  top: -170px;
  width: 520px;
}
.inside-product .section-shell { position: relative; z-index: 1; }
.inside-product .product-heading { margin-bottom: 58px; }
.inside-product .product-heading h2 { color: #19332c; }
.inside-product .product-heading > p:not(.eyebrow) {
  color: #66736e;
  font-size: 17px;
  line-height: 1.7;
  max-width: 700px;
}
.booklet-theme-purple .inside-product .product-heading h2,
.booklet-theme-green .inside-product .product-heading h2,
.booklet-theme-brown .inside-product .product-heading h2 { color: var(--theme-deep); }
.booklet-theme-purple .inside-product .product-heading > p:not(.eyebrow),
.booklet-theme-green .inside-product .product-heading > p:not(.eyebrow),
.booklet-theme-brown .inside-product .product-heading > p:not(.eyebrow) { color: var(--theme-muted); }
.booklet-inside,
.booklet-inside.booklet-inside-four {
  gap: 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.booklet-inside-count-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.booklet-inside-count-5,
.booklet-inside-count-10 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.booklet-inside-count-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.booklet-inside-count-8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.booklet-inside article,
.booklet-inside article:nth-child(n) {
  background: rgba(255, 251, 242, .93);
  border: 1px solid rgba(25, 51, 44, .14);
  border-radius: 0;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset, 0 18px 38px rgba(25, 51, 44, .13), 8px 10px 0 rgba(25, 51, 44, .035);
  display: flex;
  flex-direction: column;
  min-height: 320px;
  overflow: hidden;
  padding: 30px;
  position: relative;
  transform: none;
}
.booklet-theme-purple .booklet-inside article,
.booklet-theme-green .booklet-inside article,
.booklet-theme-brown .booklet-inside article {
  background: var(--theme-card);
  border-color: var(--theme-line);
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 18px 38px var(--theme-shadow), 8px 10px 0 color-mix(in srgb, var(--theme-deep) 4%, transparent);
}
.booklet-inside article::before {
  background: radial-gradient(circle at 100% 0, rgba(233, 185, 73, .1), transparent 48%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}
.booklet-inside article::after { display: none; }
.booklet-inside article:nth-child(4n + 2)::before,
.booklet-inside article:nth-child(4n + 3)::before {
  background: radial-gradient(circle at 100% 0, rgba(102, 139, 119, .1), transparent 48%);
}
.booklet-inside article:hover {
  border-color: rgba(25, 51, 44, .14);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset, 0 18px 38px rgba(25, 51, 44, .13), 8px 10px 0 rgba(25, 51, 44, .035);
}
.booklet-inside span {
  color: #9b741f;
  font: italic 500 19px/1 "Fraunces", serif;
  letter-spacing: .02em;
  position: relative;
}
.booklet-theme-purple .booklet-inside span,
.booklet-theme-green .booklet-inside span,
.booklet-theme-brown .booklet-inside span,
.booklet-theme-purple .booklet-extras .eyebrow,
.booklet-theme-green .booklet-extras .eyebrow,
.booklet-theme-brown .booklet-extras .eyebrow { color: var(--theme-deep); }
.booklet-inside h3 {
  color: #19332c;
  font-size: clamp(25px, 2.15vw, 34px);
  line-height: 1.03;
  margin: auto 0 20px;
  max-width: 520px;
  position: relative;
}
.booklet-theme-purple .booklet-inside h3,
.booklet-theme-green .booklet-inside h3,
.booklet-theme-brown .booklet-inside h3 { color: var(--theme-deep); }
.booklet-inside article p {
  color: #66736e;
  font-size: 15px;
  line-height: 1.62;
  margin: 0;
  max-width: 590px;
  position: relative;
}
.booklet-theme-purple .booklet-inside article p,
.booklet-theme-green .booklet-inside article p,
.booklet-theme-brown .booklet-inside article p { color: var(--theme-muted); }
.booklet-extras {
  border-color: rgba(25, 51, 44, .14);
  margin-top: 70px;
  padding-top: 46px;
}
.booklet-extras > div {
  gap: 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.booklet-extras span {
  background: rgba(255, 251, 242, .88);
  border: 1px solid rgba(25, 51, 44, .11);
  border-radius: 0;
  box-shadow: 0 12px 26px rgba(25, 51, 44, .09);
  color: #31493f;
  font-size: 15px;
  line-height: 1.5;
  padding: 22px 24px;
}
.booklet-theme-purple .booklet-extras span,
.booklet-theme-green .booklet-extras span,
.booklet-theme-brown .booklet-extras span {
  background: var(--theme-card);
  border-color: var(--theme-line);
  box-shadow: 0 12px 26px var(--theme-shadow);
  color: var(--theme-deep);
}

.booklet-theme-purple .product-details,
.booklet-theme-green .product-details,
.booklet-theme-brown .product-details { background: var(--theme-mid); }
.booklet-theme-purple .final-purchase,
.booklet-theme-green .final-purchase,
.booklet-theme-brown .final-purchase {
  background: var(--theme-deep);
  color: #fffaf0;
}
.booklet-theme-purple .final-purchase .eyebrow,
.booklet-theme-green .final-purchase .eyebrow,
.booklet-theme-brown .final-purchase .eyebrow,
.booklet-theme-purple .final-purchase h2,
.booklet-theme-green .final-purchase h2,
.booklet-theme-brown .final-purchase h2 { color: #fffaf0; }
.booklet-theme-purple .final-purchase .purchase-buttons a,
.booklet-theme-green .final-purchase .purchase-buttons a,
.booklet-theme-brown .final-purchase .purchase-buttons a {
  background: var(--theme-pale);
  color: var(--theme-deep);
}
.booklet-theme-purple .final-purchase .purchase-buttons .purchase-secondary,
.booklet-theme-green .final-purchase .purchase-buttons .purchase-secondary,
.booklet-theme-brown .final-purchase .purchase-buttons .purchase-secondary {
  background: transparent;
  border-color: rgba(255,250,240,.72);
  color: #fffaf0;
}
.booklet-extras span:hover {
  box-shadow: 0 12px 26px rgba(25, 51, 44, .09);
}

/* Match the dimensional Resource Library book treatment on the hero. */
.booklet-visual {
  --book-stage: #e4ebe0;
  --book-cover: #cbd7c3;
  --book-edge: #aab9a2;
  --book-ink: #263c31;
  --book-shadow: rgba(38, 60, 49, .25);
  background:
    radial-gradient(circle at 50% 48%, rgba(255, 255, 255, .45) 0 24%, transparent 24.5%),
    var(--book-stage);
  overflow: hidden;
  perspective: 1200px;
}

.booklet-visual::before {
  background: transparent;
  border: 1px solid rgba(38, 60, 49, .2);
  height: 360px;
  left: 50%;
  right: auto;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 360px;
}

.booklet-visual::after {
  background: rgba(255, 255, 255, .38);
  border-radius: 50%;
  content: "";
  height: 210px;
  position: absolute;
  right: -62px;
  top: -54px;
  width: 210px;
}

.booklet-cover {
  background:
    radial-gradient(circle at 108% 37%, transparent 0 108px, color-mix(in srgb, currentColor 22%, transparent) 109px 110px, transparent 111px),
    var(--book-cover);
  box-shadow: 12px 12px 0 var(--book-edge), 25px 34px 58px var(--book-shadow);
  color: var(--book-ink);
  overflow: hidden;
  transform: rotate(-3deg);
}

.booklet-cover::before,
.booklet-cover::after {
  content: "";
  position: absolute;
}

.booklet-cover::before {
  background: rgba(255, 255, 255, .78);
  bottom: -10px;
  box-shadow: 0 1px 0 rgba(25, 51, 44, .13), 0 4px 0 rgba(25, 51, 44, .08);
  height: 10px;
  left: 8px;
  transform: skewX(-42deg);
  width: calc(100% - 8px);
}

.booklet-cover::after {
  background: linear-gradient(90deg, color-mix(in srgb, currentColor 34%, transparent), rgba(255, 255, 255, .2));
  height: calc(100% - 5px);
  right: -8px;
  top: 8px;
  transform: skewY(-48deg);
  width: 8px;
}

.booklet-cover small,
.booklet-cover strong,
.booklet-cover p,
.booklet-cover span {
  position: relative;
  z-index: 2;
}

.booklet-cover strong {
  display: block;
  font-size: clamp(40px, 4vw, 55px);
  letter-spacing: -.04em;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.booklet-cover p {
  border-top: 1px solid currentColor;
  margin-top: 24px;
  padding-top: 15px;
}

.booklet-cover > span:last-child {
  font-weight: 600;
}

.booklet-cover .updated-version-sticker {
  right: 8px;
}

.booklet-flower { display: none; }

.theme-anxiety {
  --book-stage: #eeeaf4;
  --book-cover: #d9d1e7;
  --book-edge: #bcb1cd;
  --book-ink: #3d3153;
  --book-shadow: rgba(61, 49, 83, .24);
}
.theme-purple {
  --book-stage: #eeeaf4;
  --book-cover: #d9d1e7;
  --book-edge: #bcb1cd;
  --book-ink: #3d3153;
  --book-shadow: rgba(61, 49, 83, .24);
}
.theme-green {
  --book-stage: #e4ebe0;
  --book-cover: #cbd7c3;
  --book-edge: #aab9a2;
  --book-ink: #263c31;
  --book-shadow: rgba(38, 60, 49, .22);
}
.theme-brown {
  --book-stage: #f3e4d6;
  --book-cover: #e8c6a8;
  --book-edge: #cbaa8e;
  --book-ink: #4b3026;
  --book-shadow: rgba(75, 48, 38, .22);
}
.book-worry-less {
  --book-stage: #e4ebe0;
  --book-cover: #cbd7c3;
  --book-edge: #aab9a2;
  --book-ink: #263c31;
  --book-shadow: rgba(38, 60, 49, .25);
}

.book-anxiety-journal .product-details {
  background: #e3ddeb;
}
.theme-esteem {
  --book-stage: #f3e4d6;
  --book-cover: #e8c6a8;
  --book-edge: #cbaa8e;
  --book-ink: #4b3026;
  --book-shadow: rgba(75, 48, 38, .22);
}
.theme-boundaries {
  --book-stage: #e4ebe0;
  --book-cover: #cbd7c3;
  --book-edge: #aab9a2;
  --book-ink: #263c31;
  --book-shadow: rgba(38, 60, 49, .22);
}
.theme-depression {
  --book-stage: #e7ece9;
  --book-cover: #c8d7d1;
  --book-edge: #a8bbb3;
  --book-ink: #294039;
  --book-shadow: rgba(41, 64, 57, .22);
}
.theme-burnout {
  --book-stage: #f2e9df;
  --book-cover: #dfc9b3;
  --book-edge: #c2a88f;
  --book-ink: #503a2d;
  --book-shadow: rgba(80, 58, 45, .22);
}
.theme-calm {
  --book-stage: #e9ede5;
  --book-cover: #d2dac9;
  --book-edge: #b2bea9;
  --book-ink: #334335;
  --book-shadow: rgba(51, 67, 53, .22);
}
.standalone-book-visual .preview-sheet { display: none; }

.workbook-preview {
  background:
    radial-gradient(ellipse at 18% 20%, rgba(232, 194, 103, .1), transparent 34%),
    radial-gradient(ellipse at 84% 75%, rgba(111, 145, 126, .11), transparent 38%);
}
.booklet-theme-purple .workbook-preview,
.booklet-theme-green .workbook-preview,
.booklet-theme-brown .workbook-preview {
  background:
    radial-gradient(ellipse at 18% 20%, color-mix(in srgb, var(--theme-mid) 55%, transparent), transparent 34%),
    radial-gradient(ellipse at 84% 75%, color-mix(in srgb, var(--theme-deep) 9%, transparent), transparent 38%);
}
.page-previews { gap: 22px; }
.page-previews article {
  background: rgba(255, 251, 242, .92);
  border-color: rgba(25, 51, 44, .13);
  box-shadow: 0 18px 38px rgba(25, 51, 44, .11), 8px 10px 0 rgba(25, 51, 44, .03);
  min-height: 390px;
  padding: 38px;
}
.page-previews small {
  color: #9b741f;
  font: italic 500 18px/1 "Fraunces", serif;
}
.page-previews h3 {
  color: #19332c;
  font-size: clamp(30px, 3vw, 42px);
}
.page-previews p { color: #66736e; font-size: 15px; line-height: 1.6; }
.booklet-theme-purple .page-previews article,
.booklet-theme-green .page-previews article,
.booklet-theme-brown .page-previews article {
  background: var(--theme-card);
  border-color: var(--theme-line);
  box-shadow: 0 18px 38px var(--theme-shadow), 8px 10px 0 color-mix(in srgb, var(--theme-deep) 4%, transparent);
}
.booklet-theme-purple .page-previews small,
.booklet-theme-green .page-previews small,
.booklet-theme-brown .page-previews small,
.booklet-theme-purple .page-previews h3,
.booklet-theme-green .page-previews h3,
.booklet-theme-brown .page-previews h3 { color: var(--theme-deep); }
.booklet-theme-purple .page-previews p,
.booklet-theme-green .page-previews p,
.booklet-theme-brown .page-previews p { color: var(--theme-muted); }

.booklet-theme-purple .product-checks p::before,
.booklet-theme-green .product-checks p::before,
.booklet-theme-brown .product-checks p::before { color: var(--theme-deep); }
.booklet-theme-purple .purchase-buttons a,
.booklet-theme-green .purchase-buttons a,
.booklet-theme-brown .purchase-buttons a { background: var(--theme-deep); }
.booklet-theme-purple .purchase-buttons .purchase-secondary,
.booklet-theme-green .purchase-buttons .purchase-secondary,
.booklet-theme-brown .purchase-buttons .purchase-secondary {
  background: transparent;
  border-color: var(--theme-deep);
  color: var(--theme-deep);
}

/* Motion is reserved for elements that can actually be clicked. */
.purchase-buttons a {
  box-shadow: 0 8px 18px rgba(25, 51, 44, .16);
  position: relative;
  transition: box-shadow .28s ease, transform .28s ease, background-color .28s ease;
}
.purchase-buttons a:hover,
.purchase-buttons a:focus-visible {
  box-shadow: 0 15px 28px rgba(25, 51, 44, .23);
  transform: translateY(-4px);
}
.purchase-buttons .purchase-secondary:hover,
.purchase-buttons .purchase-secondary:focus-visible { background: rgba(255, 255, 255, .48); }

.purchase-buttons a:active {
  box-shadow: 0 5px 12px rgba(25, 51, 44, .15);
  transform: translateY(-1px);
}
.purchase-buttons a:focus-visible,
.journey-back:focus-visible,
.site-footer a:focus-visible {
  outline: 3px solid rgba(233, 185, 73, .75);
  outline-offset: 4px;
}
.journey-back { transition: color .25s ease, transform .25s ease; }
.journey-back:hover,
.journey-back:focus-visible {
  color: #84652f;
  transform: translateX(-4px);
}
.site-footer .footer-links a {
  text-decoration-color: transparent;
  text-underline-offset: 5px;
  transition: color .25s ease, text-decoration-color .25s ease;
}
.site-footer .footer-links a:hover,
.site-footer .footer-links a:focus-visible {
  color: #84652f;
  text-decoration-color: currentColor;
}

@media (max-width: 1100px) {
  .booklet-inside,
  .booklet-inside.booklet-inside-four,
  .booklet-inside-count-4,
  .booklet-inside-count-5,
  .booklet-inside-count-6,
  .booklet-inside-count-8,
  .booklet-inside-count-10 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 850px) {
  .booklet-inside,
  .booklet-inside.booklet-inside-four,
  .booklet-extras > div { grid-template-columns: 1fr; }
  .booklet-inside article,
  .booklet-inside article:nth-child(n) { min-height: 265px; padding: 36px; }
  .booklet-inside h3 { font-size: clamp(31px, 8vw, 42px); }
}
@media (prefers-reduced-motion: reduce) {
  .purchase-buttons a,
  .journey-back,
  .site-footer .footer-links a { transition: none; }
  .purchase-buttons a:hover,
  .purchase-buttons a:focus-visible,
  .purchase-buttons a:active,
  .journey-back:hover,
  .journey-back:focus-visible { transform: none; }
}
