/* =====================================================================
   bytonyacall.com — overrides on top of the Helen template kit
   Helen's layout and components stay as
   shipped. Type is swapped to her Instagram look (Playfair Display + Jost), orange becomes cranberry, both
   themes follow the cover palette (light is the default), plus the few
   custom pieces (cover cards, buy chips, launch state, email forms).
   ===================================================================== */

/* ---------- type: matched to her Instagram grid ----------
   High-contrast serif with italic emphasis, spaced caps for labels,
   plain sans for reading text. Helen's Phudu / Instrument Sans are
   replaced through the two variables its stylesheet now reads. */
:root {
  --font-display: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Jost', 'Instrument Sans', system-ui, sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-weight: 500; letter-spacing: 0; }
.hname { font-weight: 500; text-transform: uppercase; letter-spacing: .06em; font-size: clamp(2.5rem, 6vw, 5.2rem); line-height: 1.04; }
.hrole { font-style: italic; font-weight: 400; font-size: clamp(1.15rem, 2.2vw, 1.7rem); letter-spacing: 0; }
.hgreet, .stag, .exlbl, .tlyr, .pfcat, .dlbl, .ctlbl, .hcl, .abbl, .scrltxt, .pre-sub { font-family: var(--font-body); letter-spacing: .18em; }
.stitle, .stitles { font-weight: 500; letter-spacing: -.005em; line-height: 1.08; font-size: clamp(2.1rem, 4vw, 3.3rem); }
.stitle em, .stitles em { font-style: italic; font-weight: 600; }
.stitle span, .stitles span { font-style: italic; }
.nlogo, .ftlogo, .pre-mark { font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: 1.05rem; }
.ftlogo { font-size: 1.3rem; }
.nlogo em, .ftlogo em { font-style: normal; }
.pre-n { font-weight: 500; letter-spacing: 0; }
.hwm, .bgn, .tstdq, .svbgn { font-weight: 600; letter-spacing: -.02em; }
.mqit { font-family: var(--font-body); font-weight: 500; letter-spacing: .16em; text-transform: uppercase; font-size: .78rem; }
.tlrole, .edudeg, .pfttl, .svnm, .sbttl, .modal-title { font-weight: 500; letter-spacing: 0; }
.tlrole { font-size: 1.25rem; line-height: 1.3; }
.svnm { font-size: 1.3rem; }
.pfttl { font-size: 1.2rem; }
.ctemail { font-weight: 500; letter-spacing: 0; text-transform: none; font-size: clamp(1.2rem, 2.6vw, 1.9rem); }
.abbn, .hcv, .astn { font-weight: 600; letter-spacing: 0; }
#mob a { font-weight: 500; letter-spacing: .02em; }
.btd, .bto, .bta, .hirebtn, .chip, .pftag, .sktab, .pfbtn, .nlinks a, .form-control, .form-label { font-family: var(--font-body); }
.btd, .bto, .bta, .hirebtn { font-weight: 500; letter-spacing: .04em; }
.abbio, .hdesc, .sdesc, .tlp, .svdesc { font-weight: 300; }
.abbio strong { font-weight: 500; }

/* ---------- palette ---------- */
:root {
  --ac: #9B3140;            /* cranberry replaces Helen's #FF4D1C */
  --ac2: 155, 49, 64;
  --ac-deep: #7A2432;
  --gold: #C8A275;
  --dark: #1B1E1E;          /* preloader, marquee, quote band, footer (light theme) */

  /* light theme = the brief's cover palette */
  --bg: #FDFBF5;
  --bg2: #F4EFE6;
  --bg3: #EAE2D4;
  --card: #FFFFFF;
  --text: #2A2522;
  --text2: #544C39;
  --text3: #6B6455;   /* 5:1 on the shaded ground for the small labels */
  --border: #E4DCCB;
  --nav: rgba(253, 251, 245, .95);
}
[data-theme=dark] {
  --bg: #0E1010;            /* Helen's near-black, in the cover's warm-neutral hue */
  --bg2: #151818;
  --bg3: #1E2222;
  --card: #151818;
  --text: #FDFBF5;          /* cover cream */
  --text2: #C9C2B5;
  --text3: #6F6A5F;
  --border: #262B2B;
  --nav: rgba(14, 16, 16, .95);
}
[data-theme=dark] #mob,
[data-theme=dark] .mqsec,
[data-theme=dark] .tstsec,
[data-theme=dark] #footer { background: #090B0B; }

/* Helen hard-codes a few oranges / greens; bring them onto the palette */
.bta:hover { background: var(--ac-deep); }
.skfill { background: linear-gradient(90deg, var(--ac), var(--gold)); }
.avail { color: var(--ac); background: rgba(var(--ac2), .12); border-color: rgba(var(--ac2), .3); }
[data-theme=dark] .avail { color: #E6A8B1; }
.adot { background: var(--ac); box-shadow: 0 0 8px rgba(var(--ac2), .7); }
.tststars { display: none; }
.stag--ondark { background: rgba(var(--ac2), .22); color: #E6A8B1; }

/* ---------- launch state switch ---------- */
html[data-launch="pre"]  [data-show="live"] { display: none !important; }
html[data-launch="live"] [data-show="pre"]  { display: none !important; }
.pending-note { font-size: .8rem; color: var(--text3); margin: -22px 0 26px; }

/* ---------- sections that reuse Helen's section styles ---------- */
#book, #author, #podcast { padding: 120px 0; background: var(--bg); }
#inside, #books, #stay, #live { padding: 120px 0; background: var(--bg2); }
#books { background: var(--bg); }
#stay { background: var(--bg2); }
.tstsec { padding: 120px 0; background: var(--dark); position: relative; overflow: hidden; }
.abcnt--left { padding-left: 0; padding-right: 40px; }
@media (max-width: 991px) { .abcnt--left { padding-right: 0; margin-top: 0; margin-bottom: 40px; } }

/* hero: Tonya in Helen's organic circle. The photo was extended with its own backdrop above and beside her,
   so the curve clears her whole head; only the tips of her elbows meet the edge. */
.hblob.hblob--circle { max-width: 480px; aspect-ratio: 4 / 5; }
.hblob--circle img { object-position: 50% 0; scale: 1; }
/* the name watermark: two lines offset equally left and right, the pair centred on the hero both ways,
   very light. Flex layout (not a translate) so Helen's mouse parallax can't knock it off centre. */
.hwm.hwm--split { top: 0; right: 0; bottom: 0; left: 0; transform: none; display: flex; flex-direction: column; justify-content: center; align-items: center;
  font-size: clamp(8rem, 20vw, 22rem); line-height: .84; letter-spacing: -.02em; white-space: nowrap;
  color: color-mix(in srgb, var(--bg3) 55%, var(--bg)); }
.hwm--split span { display: block; }
/* "TONYA" is wider than "CALL.", so the offsets are unequal (in em, so they scale with the type):
   the second line sits .54em to the right of the first and the pair's outer edges are symmetric on the hero. */
.hwm--split span:first-child { transform: translateX(-.13em); }
.hwm--split span:last-child  { transform: translateX(.41em); }
@media (min-width: 992px) and (max-width: 1199px) { .hblob.hblob--circle { max-width: 420px; } }
/* Helen hides the portrait under 992px; Tonya's shows on every size, leading the page on phones */
@media (max-width: 991px) {
  #hero { min-height: 0; padding: 96px 0 64px; }
  #hero .row { flex-direction: column; }
  .hzone { display: block; order: -1; max-width: 430px; margin: 0 auto 34px; padding: 0 24px; }
  .hblob.hblob--circle { max-width: 380px; }
  .hbtns { margin-bottom: 28px; }
  .scrl { display: none; }
  .hwm.hwm--split { font-size: 23vw; }
}
@media (max-width: 575px) {
  .hzone { padding: 0 12px; margin-bottom: 28px; }
  .hblob.hblob--circle { max-width: 320px; }
  .hname { font-size: clamp(2.4rem, 12vw, 3.2rem); }
}

/* the book: the cover is a real object, not a cropped photo */
.abwrap--cover { text-align: center; }
.abimg--cover { height: auto; width: min(100%, 380px); margin: 0 auto; border-radius: 6px; box-shadow: var(--s3); }
/* the launch-date badge sits beneath the cover, never over it */
.abwrap--cover .abbadge.abbadge--below { position: static; display: inline-flex; align-items: baseline; gap: 10px; margin: 22px auto 0; padding: 12px 22px; }
.abwrap--cover .abbadge--below .abbn { font-size: 1.9rem; }
@media (max-width: 991px) { .abwrap { margin-bottom: 8px; } }
.abimg { object-position: 50% 22%; }
.abbadge--quote .abbn { font-size: 2.4rem; }

/* buy component */
.buy { margin-bottom: 26px; }
.buy .exlbl { margin-bottom: 12px; }
.buy .chips { margin-bottom: 0; }
a.chip { cursor: pointer; color: var(--text); }
a.chip[aria-disabled="true"] { opacity: .45; border-style: dashed; pointer-events: none; }

/* event card and book card images */
.pfcard--event, .pfcard--book { cursor: default; }
.pfcard--event .pfimgbox img { object-position: 50% 20%; }
.pfimgbox--white { background: #fff; padding: 26px; }
.pfimgbox--white img { object-fit: contain; }
.pfcard--event:hover, .pfcard--book:hover { transform: none; box-shadow: var(--s2); }
.pfcard--event:hover .pfimgbox img, .pfcard--book:hover .pfimgbox img { transform: none; }
.evline { font-family: var(--font-display); font-style: italic; font-size: 1.3rem; font-weight: 400; color: var(--text) !important; line-height: 1.4; }

/* quotes from the book: one at a time, attributed to the book, not a person */
.bkq__book { display: flex; flex-direction: column; gap: 22px; }
.bkq__book img { width: 150px; height: auto; border-radius: 4px; box-shadow: 0 24px 40px -18px rgba(0, 0, 0, .7); }
.bkq__h { font-size: clamp(1.9rem, 3vw, 2.5rem) !important; margin-bottom: 0; }
.bkq { margin: 0; padding: 6px 0 44px; }
.bkq__txt { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.6rem, 3.2vw, 2.6rem); line-height: 1.22; letter-spacing: -.01em; color: rgba(255, 255, 255, .94); margin: 0 0 22px; }
.bkq__txt::before { content: "\201C"; } .bkq__txt::after { content: "\201D"; }
.bkq__src { font-family: var(--font-body); font-size: .74rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.bkq__src cite { font-style: italic; text-transform: none; letter-spacing: .02em; font-family: var(--font-display); font-size: 1rem; }
#quotes .swiper-pagination { text-align: left; bottom: 0; }
@media (max-width: 991px) {
  .bkq__book { flex-direction: row; align-items: center; gap: 18px; }
  .bkq__book img { width: 84px; }
}

/* forms (Helen inputs + a row layout) */
.form__row { display: flex; gap: 10px; align-items: stretch; }
.form__row .form-control { flex: 1 1 auto; min-width: 0; }
.bta--auto { width: auto; flex: none; white-space: nowrap; }
.form__note { font-size: .78rem; color: var(--text3); margin: 0; }
.form__thanks { font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; color: var(--ac); margin: 8px 0 0; }
[data-theme=dark] .form__thanks { color: var(--gold); }
.form-control[aria-invalid="true"] { border-color: var(--ac); }
.form--inline { margin-top: 8px; max-width: 520px; }
#stay .ctval a:hover { color: var(--ac); }
@media (max-width: 575px) { .form__row { flex-direction: column; } .bta--auto { width: 100%; } }

/* motion: respect reduced-motion for the template's loops */
@media (prefers-reduced-motion: reduce) {
  .noise, .mqtrack, .adot, .scrlbar { animation: none !important; }
}

/* ---------- mobile menu: hamburger toggles and shows an X while open ---------- */
.ham { position: relative; z-index: 999; }
.ham span { transition: transform .3s, opacity .2s; }
.ham.on { background: rgba(255, 255, 255, .08); }
.ham.on span:nth-child(1) { transform: translateY(7px) rotate(45deg); background: #fff; }
.ham.on span:nth-child(2) { opacity: 0; }
.ham.on span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); background: #fff; }
body.menu-open { overflow: hidden; }
#mob { padding: 90px 24px 40px; }

/* ---------- accessibility: contrast for the small stuff ---------- */
.mqit { color: rgba(255, 255, 255, .62); }
.tstrole { color: var(--gold); }
.bgn::before { content: attr(data-n); }
.ftnav a { color: rgba(255, 255, 255, .72); }
.ftcopy { color: rgba(255, 255, 255, .6); }
.ftcopy em { color: var(--gold); }

/* quote slider dots: a finger-sized tap target */
.swiper-pagination-bullet { width: 12px; height: 12px; margin: 0 8px !important; position: relative; }
.swiper-pagination-bullet::after { content: ""; position: absolute; inset: -8px; }
.swiper-pagination-bullet-active { width: 28px; }

/* Say More: square podcast art shown whole */
.abimg.abimg--square { height: auto; aspect-ratio: 1 / 1; object-fit: cover; object-position: center; }

/* ---------- the launch banner sits on the bottom edge of the screen at first view ----------
   Sticky to the bottom: on open it rides the bottom of the viewport (on every device), then settles
   into its own place under the hero once the reader scrolls there. On desktop the hero is sized to
   exactly one screen above it, so nothing overlaps at all. */
:root { --mq-h: 52px; }
.mqsec { position: sticky; bottom: 0; z-index: 60; height: var(--mq-h); padding: 0; display: flex; align-items: center; }
@media (min-width: 992px) {
  #hero { min-height: calc(100vh - var(--mq-h)); min-height: calc(100svh - var(--mq-h)); padding: 104px 0 64px; }
  .scrl { bottom: 14px; }
}
/* keep the back-to-top button clear of the banner while it's pinned */
#btt { bottom: calc(var(--mq-h) + 16px); }
/* short laptop screens: tighten the hero so all of it clears the banner */
@media (min-width: 992px) and (max-height: 820px) {
  #hero { padding: 88px 0 24px; }
  .avail { margin-bottom: 14px; }
  .hname { margin-bottom: 8px; }
  .hrole { margin-bottom: 14px; }
  .hdesc { margin-bottom: 22px; }
  .hbtns { margin-bottom: 18px; }
  .pending-note { margin: -4px 0 14px; }
  .scrl { display: none; }
  .hblob.hblob--circle { max-width: min(440px, calc((100svh - 190px) * .8)); }
}

/* ---------- Lived Mastery pop-up ---------- */
.lm-pop { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; }
.lm-pop[hidden] { display: none; }
.lm-pop__scrim { position: absolute; inset: 0; background: rgba(27, 30, 30, .55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  opacity: 0; transition: opacity .5s ease; }
.lm-pop__card { position: relative; width: min(760px, 100%); max-height: calc(100svh - 40px); overflow: auto;
  display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: center;
  background: var(--card); border-radius: var(--r); box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .55);
  opacity: 0; transform: translateY(18px) scale(.98); transition: opacity .55s ease, transform .6s cubic-bezier(.2, .8, .2, 1); outline: none; }
.lm-pop.is-in .lm-pop__scrim { opacity: 1; }
.lm-pop.is-in .lm-pop__card { opacity: 1; transform: none; }
.lm-pop__img { align-self: stretch; }
.lm-pop__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; display: block; border-radius: var(--r) 0 0 var(--r); }
.lm-pop__body { padding: 34px 34px 28px; }
.lm-pop__title { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.15; margin: 6px 0 10px; color: var(--text); }
.lm-pop__lede { color: var(--text2); font-size: .98rem; line-height: 1.6; margin: 0 0 14px; }
.lm-pop .pftags { margin-bottom: 22px; }
.lm-pop__cta { width: 100%; justify-content: center; }
.lm-pop__later { display: block; margin: 12px auto 0; background: none; border: 0; padding: 6px 10px; font-family: var(--font-body); font-size: .85rem;
  color: var(--text3); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.lm-pop__later:hover { color: var(--text); }
.lm-pop__x { position: absolute; top: 12px; right: 12px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border);
  background: rgba(255, 255, 255, .92); color: var(--text); display: grid; place-items: center; cursor: pointer; font-size: .95rem;
  transition: background .2s, color .2s, border-color .2s; }
.lm-pop__x:hover { background: var(--ac); border-color: var(--ac); color: #fff; }
.lm-pop__x:focus-visible, .lm-pop__later:focus-visible, .lm-pop__cta:focus-visible { outline: 2px solid var(--ac); outline-offset: 3px; }
body.lm-pop-open { overflow: hidden; }
body.lm-pop-open, body.lm-pop-open .lm-pop { cursor: auto; }
@media (max-width: 640px) {
  .lm-pop { padding: 14px; align-items: end; }
  .lm-pop__card { grid-template-columns: 1fr; max-height: calc(100svh - 28px); }
  .lm-pop__img { height: 34svh; }
  .lm-pop__img img { border-radius: var(--r) var(--r) 0 0; object-position: 50% 12%; }
  .lm-pop__body { padding: 20px 20px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .lm-pop__scrim, .lm-pop__card { transition: none; }
}

/* phones: no loading curtain, the hero paints as soon as it arrives (desktop keeps Helen's intro) */
@media (max-width: 767px) { #pre { display: none; } }