/* Scoped campaign styles; the site's Heebo and gold/navy palette are reused. */
.ht-membership-popup {
  --popup-ink: #f5efdf;
  --popup-muted: #c0bbaF;
  --popup-gold: #dfc07a;
  padding: 0;
  border: 1px solid #716349;
  border-radius: 22px;
  margin: auto;
  width: min(920px, calc(100% - 40px));
  max-width: none;
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  overflow: auto;
  overscroll-behavior: contain;
  color: var(--popup-ink);
  background: #101726;
  font-family: "Heebo", "Assistant", sans-serif;
  text-align: start;
  box-shadow: 0 32px 120px #0009;
  color-scheme: dark;
}
.ht-membership-popup:not([open]) { display: none; }
.ht-membership-popup[open] { animation: ht-membership-enter 220ms ease-out; }
.ht-membership-popup::backdrop { background: rgb(4 8 15 / 76%); backdrop-filter: blur(5px); }
.ht-membership-popup *, .ht-membership-popup *::before, .ht-membership-popup *::after { box-sizing: border-box; }
.ht-membership-popup p, .ht-membership-popup h2, .ht-membership-popup h3 { margin: 0; }
.ht-membership-popup a, .ht-membership-popup button { -webkit-tap-highlight-color: transparent; }
.ht-membership-popup button { font: inherit; cursor: pointer; }
.ht-membership-popup :is(a, button):focus-visible { outline: 3px solid #dfc07a; outline-offset: 4px; }
.ht-membership-popup__grid { display: grid; grid-template-columns: 1.25fr 1fr; grid-template-areas: "intro library" "offer library"; }
.ht-membership-popup__intro { grid-area: intro; padding: 38px 42px 0; }
.ht-membership-popup__eyebrow { color: var(--popup-gold); font-size: .8125rem; font-weight: 500; letter-spacing: .015em; }
.ht-membership-popup__eyebrow span { margin-inline: 8px; opacity: .65; }
.ht-membership-popup h2 { font-size: 3.15rem; line-height: 1.16; font-weight: 800; letter-spacing: -.035em; margin-block: 21px 16px; }
.ht-membership-popup h2 span { color: var(--popup-gold); }
.ht-membership-popup h2:focus { outline: none; }
.ht-membership-popup__lead { color: #ded9cd; font-size: 1.0625rem; line-height: 1.8; }
.ht-membership-popup__library { grid-area: library; padding: 66px 30px 28px; background: #eee8da; color: #172131; }
.ht-membership-popup__library-heading { display: flex; align-items: center; gap: 14px; padding-block-end: 20px; border-bottom: 1px solid #c9c2b3; }
.ht-membership-popup__library-mark { font: 600 3.6rem/1 "Playfair Display", Georgia, serif; color: #806436; }
.ht-membership-popup__library-kicker { font-size: .5625rem; font-weight: 600; letter-spacing: .12em; color: #675b48; text-align: start; margin-bottom: 5px !important; }
.ht-membership-popup h3 { font-size: 1.0625rem; font-weight: 700; line-height: 1.5; }
.ht-membership-popup__courses { list-style: none; margin: 0; padding: 0; }
.ht-membership-popup__courses li { display: flex; align-items: baseline; gap: 18px; padding-block: 12px; border-bottom: 1px solid #d4cdbf; }
.ht-membership-popup__course-number { font-size: .6875rem; font-weight: 500; color: #756343; font-variant-numeric: tabular-nums; }
.ht-membership-popup__courses strong { display: block; font-size: 1rem; font-weight: 700; line-height: 1.45; }
.ht-membership-popup__course-detail { display: block; margin-block-start: 2px; font-size: .8125rem; line-height: 1.5; color: #615c52; }
.ht-membership-popup__library-note { margin-block-start: 19px !important; color: #615c52; font-size: .8125rem; line-height: 1.7; }
.ht-membership-popup__offer { grid-area: offer; padding: 22px 42px 26px; }
.ht-membership-popup__price { display: flex; align-items: baseline; gap: 10px; }
.ht-membership-popup__price bdi { font-size: 3.5rem; font-weight: 700; line-height: 1.1; letter-spacing: -.04em; font-variant-numeric: lining-nums; }
.ht-membership-popup__price > span { font-size: 1rem; color: #ded9cd; }
.ht-membership-popup__billing { margin-block-start: 7px !important; color: var(--popup-muted); font-size: .8125rem; line-height: 1.65; }
.ht-membership-popup__flex { display: flex; align-items: center; gap: 6px; color: var(--popup-ink); font-size: .875rem; line-height: 1.5; margin-block: 13px 18px !important; }
.ht-membership-popup__flex svg { flex-shrink: 0; color: var(--popup-gold); }
.ht-membership-popup__join { display: flex; justify-content: center; align-items: center; gap: 18px; padding: 15px 18px; min-height: 56px; border: 1px solid #e7cc93; border-radius: 9px; background: #dfc07a; color: #101726; font-size: 1.0625rem; font-weight: 800; text-decoration: none; transition: background 160ms, box-shadow 160ms; }
.ht-membership-popup__join:hover { background: #efcf89; box-shadow: 0 5px 22px #dfc07a24; }
.ht-membership-popup__join:active { background: #cfae68; }
.ht-membership-popup__reassurance { text-align: center; font-size: .75rem; line-height: 1.7; color: var(--popup-muted); margin-block-start: 11px !important; }
.ht-membership-popup__secondary { display: flex; justify-content: center; align-items: center; gap: 20px; margin-block-start: 8px; }
.ht-membership-popup__secondary a, .ht-membership-popup__secondary button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; font-size: .8125rem; line-height: 1.5; color: #d4cdbf; background: none; border: 0; padding: 5px 0; }
.ht-membership-popup__secondary a { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #867a63; }
.ht-membership-popup__secondary :is(a, button):hover { color: #fff; }
.ht-membership-popup__scope { color: #aba79e; text-align: center; font-size: .6875rem; line-height: 1.6; }
.ht-membership-popup__close { position: absolute; inset-block-start: 10px; inset-inline-end: 10px; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid transparent; border-radius: 50%; background: transparent; color: #504b41; z-index: 1; }
.ht-membership-popup__close:hover { background: #dcd4c5; }
.ht-membership-popup__close:focus-visible { outline-color: #806436 !important; }
html.ht-membership-popup-open { overflow: hidden; scrollbar-gutter: stable; }
@keyframes ht-membership-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) {
  .ht-membership-popup { width: min(470px, calc(100% - 24px)); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); border-radius: 18px; }
  .ht-membership-popup__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "library" "offer"; }
  .ht-membership-popup__intro { padding: 25px 24px 0; }
  .ht-membership-popup__eyebrow { font-size: .6875rem; padding-inline-end: 22px; }
  .ht-membership-popup__eyebrow span { margin-inline: 5px; }
  .ht-membership-popup h2 { font-size: 2.25rem; line-height: 1.13; margin-block: 16px 12px; }
  .ht-membership-popup__lead { font-size: .9375rem; line-height: 1.7; }
  .ht-membership-popup__library { padding: 17px 24px 0; background: none; color: var(--popup-ink); }
  .ht-membership-popup__library-heading { border: 0; padding-block-end: 8px; }
  .ht-membership-popup__library-mark, .ht-membership-popup__library-kicker, .ht-membership-popup__course-number, .ht-membership-popup__course-detail, .ht-membership-popup__library-note { display: none; }
  .ht-membership-popup h3 { font-size: .75rem; font-weight: 400; color: var(--popup-muted); }
  .ht-membership-popup__courses { display: flex; flex-wrap: wrap; gap: 6px; }
  .ht-membership-popup__courses li { padding: 5px 9px; border: 1px solid #4b4a44; border-radius: 5px; background: #1b2230; }
  .ht-membership-popup__courses strong { font-size: .75rem; font-weight: 500; line-height: 1.45; }
  .ht-membership-popup__offer { padding: 20px 24px 20px; }
  .ht-membership-popup__price bdi { font-size: 2.875rem; }
  .ht-membership-popup__price > span { font-size: .875rem; }
  .ht-membership-popup__billing { font-size: .75rem; margin-block-start: 5px !important; }
  .ht-membership-popup__flex { font-size: .8125rem; margin-block: 9px 14px !important; }
  .ht-membership-popup__join { min-height: 52px; padding: 12px; font-size: 1rem; }
  .ht-membership-popup__reassurance { font-size: .6875rem; margin-block-start: 9px !important; }
  .ht-membership-popup__secondary { margin-block-start: 3px; gap: 16px; flex-wrap: wrap; }
  .ht-membership-popup__secondary a, .ht-membership-popup__secondary button { font-size: .75rem; }
  .ht-membership-popup__scope { font-size: .625rem; }
  .ht-membership-popup__close { color: #ded9cd; inset-block-start: 8px; inset-inline-end: 6px; }
  .ht-membership-popup__close:hover { background: #ffffff12; }
  .ht-membership-popup__close:focus-visible { outline-color: #dfc07a !important; }
}
@media (prefers-reduced-motion: reduce) { .ht-membership-popup[open] { animation: none; } .ht-membership-popup__join { transition: none; } }
html.a11y-no-motion .ht-membership-popup[open] { animation: none; }
@media (forced-colors: active) { .ht-membership-popup, .ht-membership-popup__join, .ht-membership-popup__close { border: 1px solid ButtonText; } .ht-membership-popup :is(a, button):focus-visible { outline-color: Highlight !important; } }
