/* Sinister Star November popup. Existing copy, consent and claim flow stay intact. */
.promo-dialog {
  width: min(940px, calc(100vw - 40px));
  max-height: calc(100svh - 48px);
  border: 1px solid #4a3a38;
  border-top: 4px solid #ff3b30;
  background: #101010;
  scrollbar-color: #a9645e #191919;
  scrollbar-width: thin;
}
.promo-dialog::backdrop {
  background: rgb(0 0 0 / 86%);
  overflow: hidden;
  overscroll-behavior: contain;
}
.promo-dialog:modal { overscroll-behavior: contain; }
.promo-dialog-inner {
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1fr);
  grid-template-areas: 'logo form' 'headline form' 'deal form' 'deal dates' 'deal terms';
  grid-template-rows: auto auto 1fr auto auto;
  gap: 16px 52px;
  min-height: 510px;
  padding: 36px 40px;
}
.promo-dialog-inner::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0 auto 0 0;
  width: 44%;
  pointer-events: none;
  background: linear-gradient(180deg, #090909 0%, #09090920 58%, #09090960 100%), url('/effects/inquiry-blood-heavy.webp') center / cover no-repeat, #090909;
}
.promo-dialog .promo-logo {
  grid-area: logo;
  width: 136px;
  height: 110px;
  margin: 0;
  justify-self: start;
}
.promo-dialog h2 {
  grid-area: headline;
  font-size: clamp(40px, 4.2vw, 56px);
  line-height: .96;
  letter-spacing: -.02em;
  margin: 0;
  text-wrap: balance;
}
.promo-dialog .promo-deal {
  grid-area: deal;
  align-self: start;
  color: #ff5a50;
  font-size: 88px;
  line-height: 1;
  margin: 14px 0 0;
  letter-spacing: -.025em;
}
.promo-dialog .promo-deal span {
  max-width: 260px;
  font-size: 15px;
  line-height: 1.55;
  letter-spacing: 0;
  margin-top: 14px;
}
.promo-dialog form, .promo-dialog .promo-earned { grid-area: form; min-width: 0; align-self: start; }
.promo-dialog form > p:first-child { margin: 26px 0 24px; font-size: 17px; line-height: 1.55; }
.promo-dialog .promo-email { margin: 0 0 18px; gap: 9px; font-size: 15px; }
.promo-dialog .promo-email input {
  min-height: 54px;
  border-color: #77706d;
  border-radius: 3px;
  background: #1b1918;
  caret-color: #ff5a50;
  font-size: 16px;
  font-weight: 400;
}
.promo-dialog .promo-email input::placeholder { color: #bfb7b3; opacity: 1; }
.promo-dialog .promo-email input:focus { border-color: #f4f3ed; }
.promo-dialog .promo-consent {
  margin: 0 0 22px;
  gap: 12px;
  font-size: 13px;
  line-height: 1.65;
  color: #d3cbc7;
  cursor: pointer;
}
.promo-dialog .promo-consent input { margin: 3px 0 0; }
.promo-dialog a { text-underline-offset: 3px; }
.promo-dialog .promo-primary {
  width: 100%;
  min-height: 54px;
  border-radius: 4px;
  font-family: var(--font-body), sans-serif;
  font-size: 16px;
  transition: background-color 160ms ease-out;
}
.promo-dialog .promo-primary:hover { background: #ff766f; }
.promo-dialog .promo-primary:active { background: #ef2d23; }
.promo-dialog .promo-dates { grid-area: dates; margin: 0; color: #d3cbc7; font-size: 12px; line-height: 1.8; font-weight: 400; }
.promo-dialog .promo-terms { grid-area: terms; margin: 0; padding-top: 4px; border-color: #4a403c; }
.promo-dialog .promo-terms summary { min-height: 44px; padding: 11px 0; font-size: 13px; }
.promo-dialog .promo-terms p { color: #d3cbc7; font-size: 13px; margin: 4px 0 0; }
.promo-dialog .promo-close { top: 10px; right: 10px; z-index: 2; border-radius: 50%; background: #101010; }
.promo-dialog .promo-close:hover { background: #332421; }
.promo-dialog .promo-earned p:first-child { margin-top: 28px; }
.promo-dialog .promo-code { color: #ff766f; letter-spacing: .06em; overflow-wrap: anywhere; }
.promo-dialog .promo-secondary { border-radius: 3px; }
.promo-dialog ::selection { background: #ff3b30; color: #090909; }
.promo-dialog :focus-visible { outline: 2px solid #f4f3ed; outline-offset: 4px; }
.promo-dialog .promo-email input:focus-visible { outline-offset: 3px; }
.promo-banner {
  border: 1px solid #4a3a38;
  border-top: 3px solid #ff3b30;
  background: linear-gradient(90deg, #090909f5, #0909099c), url('/effects/inquiry-blood-heavy.webp') right 45% / 200px auto no-repeat, #090909;
  box-shadow: none;
}
.promo-banner .promo-primary { width: 100%; border-radius: 4px; }
.promo-banner strong { font-size: 32px; }
@media (prefers-reduced-motion: no-preference) {
  .promo-dialog[open] { animation: promo-reveal 240ms cubic-bezier(.16, 1, .3, 1); }
  @keyframes promo-reveal { from { opacity: .5; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width: 720px) {
  .promo-dialog { width: min(500px, calc(100vw - 24px)); max-height: calc(100svh - 24px); }
  .promo-dialog-inner {
    grid-template-columns: 74px minmax(0, 1fr);
    grid-template-areas: 'logo headline' 'deal deal' 'form form' 'dates dates' 'terms terms';
    grid-template-rows: auto;
    min-height: 0;
    padding: 28px 22px 20px;
    gap: 12px 14px;
  }
  .promo-dialog-inner::before { width: 100%; height: 240px; background-size: auto, 100% auto; background-position: center, center 32%; }
  .promo-dialog .promo-logo { width: 74px; height: 74px; align-self: center; }
  .promo-dialog h2 { font-size: clamp(31px, 8.7vw, 40px); align-self: center; margin-right: 10px; text-wrap: initial; }
  .promo-dialog .promo-deal { font-size: 68px; margin: 4px 0 0; }
  .promo-dialog .promo-deal span { max-width: none; font-size: 12px; margin-top: 7px; }
  .promo-dialog form > p:first-child { margin: 10px 0 18px; font-size: 14px; line-height: 1.5; }
  .promo-dialog .promo-consent { font-size: 12px; line-height: 1.6; margin-bottom: 18px; }
  .promo-dialog .promo-email { font-size: 14px; margin-bottom: 16px; }
  .promo-dialog .promo-dates { font-size: 11px; line-height: 1.8; }
  .promo-dialog .promo-close { top: 4px; right: 4px; width: 40px; height: 40px; }
  .promo-dialog .promo-earned p:first-child { margin-top: 10px; }
}
@media (max-width: 360px) {
  .promo-dialog-inner { padding-inline: 18px; column-gap: 10px; grid-template-columns: 60px minmax(0, 1fr); }
  .promo-dialog .promo-logo { width: 60px; height: 66px; }
  .promo-dialog h2 { font-size: 31px; }
  .promo-dialog .promo-deal { font-size: 60px; }
}