/* Footer — loads after epk.css. Matches hero nav type; clear vertical rhythm. */

.tp-sync-page .tp-footer-panel {
  margin: clamp(24px, 5vw, 48px) auto clamp(12px, 3vw, 24px) !important;
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.tp-sync-page .tp-footer-panel__plate {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: min(720px, 100%) !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: clamp(24px, 5vw, 40px) clamp(20px, 4vw, 32px) clamp(32px, 6vw, 52px) !important;
  box-sizing: border-box !important;
  gap: 0 !important;
}

/* —— CTA: avatar, streaming line, button —— */
.tp-sync-page .tp-footer-cta {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 clamp(48px, 9vw, 72px) !important;
  padding: 0 !important;
}

.tp-sync-page .tp-footer-cta .tp-footer-panel__avatar-wrap {
  width: clamp(96px, 12vw, 128px) !important;
  margin: 0 0 clamp(14px, 3vw, 20px) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
}

.tp-sync-page .tp-footer-cta .tp-footer-panel__line {
  margin: 0 0 clamp(14px, 3vw, 18px) !important;
  font-size: clamp(10px, 1.8vw, 12px) !important;
  letter-spacing: 0.22em !important;
}

.tp-sync-page .tp-footer-cta .tp-footer-panel__button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  min-width: min(200px, 70vw) !important;
  max-width: min(260px, 82vw) !important;
  width: auto !important;
  padding: 10px 20px !important;
  font-size: clamp(9px, 1.9vw, 11px) !important;
  letter-spacing: 0.2em !important;
  line-height: 1.25 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35) !important;
  transform: none !important;
}

.tp-sync-page .tp-footer-cta .tp-footer-panel__button:hover,
.tp-sync-page .tp-footer-cta .tp-footer-panel__button:focus-visible {
  transform: translateY(-2px) !important;
}

/* —— Chapter nav (match hero nav typography) —— */
.tp-sync-page .tp-footer-chapters {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 clamp(40px, 8vw, 64px) !important;
  padding: 0 clamp(4px, 1.5vw, 12px) !important;
  box-sizing: border-box !important;
}

.tp-sync-page .tp-footer-chapters__row {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 clamp(0.35em, 1.6vw, 0.9em) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 100% !important;
}

.tp-sync-page .tp-footer-chapters__link {
  font-family: inherit !important;
  font-size: clamp(8px, 1.85vw, 11px) !important;
  font-weight: 200 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.46) !important;
  text-decoration: none !important;
  border: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
  transition: color 0.22s ease, text-shadow 0.22s ease, transform 0.22s ease !important;
}

.tp-sync-page .tp-footer-chapters__link:hover,
.tp-sync-page .tp-footer-chapters__link:focus-visible {
  color: #fff !important;
  transform: scale(1.06) !important;
  text-shadow:
    0 0 2px rgba(255, 255, 255, 1),
    0 0 6px rgba(255, 255, 255, 1),
    0 0 14px rgba(255, 255, 255, 0.98),
    0 0 28px rgba(255, 255, 255, 0.88) !important;
  outline: none !important;
}

.tp-sync-page .tp-footer-chapters__dot {
  color: rgba(255, 255, 255, 0.38) !important;
  font-size: clamp(8px, 1.85vw, 11px) !important;
  font-weight: 200 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
  user-select: none !important;
  pointer-events: none !important;
}

/* —— Bottom stack: logo, then legal (last on page) —— */
.tp-sync-page .tp-footer-bottom {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0 max(24px, calc(16px + env(safe-area-inset-bottom, 0px))) !important;
  gap: 0 !important;
}

.tp-sync-page .tp-footer-bottom .tp-footer-panel__wordmark-img {
  display: block !important;
  width: clamp(36px, 5vw, 48px) !important;
  height: auto !important;
  margin: 0 0 clamp(20px, 4.5vw, 32px) !important;
  opacity: 0.92 !important;
}

.tp-sync-page .tp-footer-bottom .tp-footer-panel__legal {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4em 0.75em !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: clamp(9px, 1.65vw, 10px) !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  line-height: 1.5 !important;
}

.tp-sync-page .tp-footer-bottom .tp-footer-panel__legal a {
  color: rgba(255, 255, 255, 0.42) !important;
  text-decoration: none !important;
  border: 0 !important;
  padding: 0 !important;
}

.tp-sync-page .tp-footer-bottom .tp-footer-panel__legal a:hover,
.tp-sync-page .tp-footer-bottom .tp-footer-panel__legal a:focus-visible {
  color: rgba(232, 203, 168, 0.95) !important;
  outline: none !important;
}

.tp-sync-page .tp-footer-bottom .tp-footer-panel__legal span[aria-hidden] {
  color: rgba(255, 255, 255, 0.25) !important;
}

/* Mobile: match hero nav mobile sizing */
@media (max-width: 380px) {
  .tp-sync-page .tp-footer-chapters {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    justify-content: flex-start !important;
  }
  .tp-sync-page .tp-footer-chapters::-webkit-scrollbar {
    display: none;
  }
  .tp-sync-page .tp-footer-chapters__row {
    justify-content: flex-start !important;
    width: max-content !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 12px !important;
  }
}

@media (max-width: 767px) {
  .tp-sync-page .tp-footer-cta {
    margin-bottom: clamp(40px, 10vw, 56px) !important;
  }

  .tp-sync-page .tp-footer-cta .tp-footer-panel__button {
    min-width: min(180px, 78vw) !important;
    max-width: min(240px, 88vw) !important;
    padding: 9px 16px !important;
    font-size: clamp(8px, 2.2vw, 10px) !important;
    letter-spacing: 0.14em !important;
  }

  .tp-sync-page .tp-footer-chapters {
    margin-bottom: clamp(36px, 9vw, 52px) !important;
  }

  .tp-sync-page .tp-footer-chapters__row {
    flex-wrap: nowrap !important;
    gap: 0 clamp(0.22em, 1.2vw, 0.5em) !important;
    padding: 0 clamp(2px, 1vw, 8px) !important;
    box-sizing: border-box !important;
  }

  .tp-sync-page .tp-footer-chapters__link {
    font-size: clamp(6.5px, 2.2vw, 9px) !important;
    letter-spacing: 0.08em !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.88) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95) !important;
  }

  .tp-sync-page .tp-footer-chapters__dot {
    font-size: clamp(6.5px, 2.2vw, 9px) !important;
    color: rgba(255, 255, 255, 0.5) !important;
  }

  .tp-sync-page .tp-footer-bottom .tp-footer-panel__wordmark-img {
    margin-bottom: clamp(18px, 5vw, 28px) !important;
  }
}

@media (min-width: 1024px) {
  .tp-sync-page .tp-footer-cta .tp-footer-panel__button {
    min-width: min(220px, 32vw) !important;
    max-width: min(260px, 36vw) !important;
    padding: 10px 22px !important;
    font-size: 11px !important;
  }
}