/* =====================================================================
   PowerMatch Report Modal — mockup theme (powermatch-report-modal.html)
   Scoped under #pm-report-modal so nothing leaks to Divi / landing page.
   ===================================================================== */

#pm-report-modal .pm-report-modal-content {
  padding: 0;
  color: var(--pm-text);
  font-family: var(--pm-font);
  -webkit-font-smoothing: antialiased;
}

#pm-report-modal .pm-report-modal-content::-webkit-scrollbar {
  width: 10px;
}
#pm-report-modal .pm-report-modal-content::-webkit-scrollbar-thumb {
  background: var(--pm-line);
  border-radius: 8px;
}

/* ---- Header band ---- */
#pm-report-modal .pm-head {
  display: flex;
  align-items: stretch;
  gap: clamp(14px, 3.2vw, 22px);
  padding: 30px 30px 26px;
  background: linear-gradient(180deg, rgba(122, 92, 255, .12), transparent), var(--pm-surface);
  border-bottom: 1px solid var(--pm-line);
  text-align: left;
}
#pm-report-modal .pm-head__badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 7px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--pm-good);
  background: rgba(58, 210, 159, .1);
  border: 1px solid rgba(58, 210, 159, .3);
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
}
#pm-report-modal .pm-head__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--pm-good);
  box-shadow: 0 0 8px var(--pm-good);
}
#pm-report-modal .pm-head__row {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#pm-report-modal .pm-head__icon-wrap {
  position: relative;
  flex: 0 0 auto;
  align-self: stretch;
  aspect-ratio: 1;
  width: auto;
  /* Fallback width if aspect-ratio-from-stretch fails — never collapse to 0 */
  min-width: clamp(96px, 7.5em, 128px);
  max-width: min(160px, 34%);
}
#pm-report-modal .pm-head__icon {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
#pm-report-modal .pm-head__text {
  min-width: 0;
}
#pm-report-modal .pm-head h1 {
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -.02em;
  margin: 0 0 6px;
  color: var(--pm-text);
}
#pm-report-modal .pm-head p {
  color: var(--pm-muted);
  font-size: 14px;
  max-width: unset;
  margin: 0;
}
#pm-report-modal .pm-head__jump {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 0;
  line-height: 1.45;
}
#pm-report-modal .pm-jump-link {
  color: var(--pm-accent);
  text-decoration: none;
  font-weight: 600;
}
#pm-report-modal .pm-jump-link:hover,
#pm-report-modal .pm-jump-link:focus-visible {
  text-decoration: underline;
}
#pm-report-modal .pm-jump-link:nth-of-type(1) {
  margin-left: 0.45em;
}
#pm-report-modal .pm-jump-sep {
  color: var(--pm-muted);
  margin: 0 .45em;
}

#pm-report-modal .pm-body {
  padding: 26px 30px 30px;
}

/* ---- Free insight ---- */
#pm-report-modal .pm-insight {
  background: linear-gradient(135deg, rgba(58, 210, 159, .08), rgba(122, 92, 255, .06));
  border: 1px solid rgba(58, 210, 159, .28);
  border-radius: var(--pm-radius-sm);
  padding: 20px;
}
#pm-report-modal .pm-insight__tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  color: var(--pm-good);
  margin-bottom: 10px;
}
#pm-report-modal .pm-insight__chip {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: rgba(58, 210, 159, .16);
  border: 1px solid rgba(58, 210, 159, .4);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}
#pm-report-modal .pm-insight__lead {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--pm-text);
  margin: 0 0 10px;
}
#pm-report-modal .pm-insight__lead strong {
  color: var(--pm-accent);
  font-weight: 600;
}
#pm-report-modal .pm-insight__detail {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--pm-muted);
}
#pm-report-modal .pm-insight__detail p {
  margin: 0;
}

/* ---- Master section heading ---- */
#pm-report-modal .pm-master-label {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--pm-text);
  margin: 30px 0 6px;
  text-align: center;
}
#pm-report-modal .pm-master-sub {
  font-size: 13.5px;
  color: var(--pm-muted);
  margin: 0 0 4px;
  text-align: center;
}

/* ---- Bordered modal sections (free / premium / toolkit) ---- */
#pm-report-modal .pm-modal-section {
  margin-top: 22px;
  padding: 20px 18px 18px;
  border: 1px solid rgba(224, 70, 126, .28);
  border-radius: var(--pm-radius);
  background:
    linear-gradient(180deg, rgba(224, 70, 126, .08), rgba(122, 92, 255, .04) 42%, transparent 78%),
    rgba(255, 255, 255, .02);
  box-shadow: 0 0 0 1px rgba(224, 70, 126, .06) inset;
}
#pm-report-modal .pm-body > .pm-modal-section:first-child {
  margin-top: 0;
}
#pm-report-modal .pm-section-eyebrow {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.35;
  color: var(--pm-accent);
}
#pm-report-modal .pm-section-label {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--pm-text);
  margin: 0 0 10px;
}
#pm-report-modal .pm-section-desc {
  margin: -4px 0 14px;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--pm-muted);
}
#pm-report-modal .pm-free-unlocked .pm-section-eyebrow,
#pm-report-modal .pm-free-unlocked .pm-section-label,
#pm-report-modal .pm-free-unlocked .pm-section-desc,
#pm-report-modal .pm-premium-insights .pm-intro-offer,
#pm-report-modal .pm-premium-insights .pm-section-label,
#pm-report-modal .pm-premium-insights .pm-section-desc,
#pm-report-modal .pm-toolkit-section .pm-section-eyebrow,
#pm-report-modal .pm-toolkit-section .pm-section-label,
#pm-report-modal .pm-toolkit-section .pm-section-desc {
  text-align: center;
}
#pm-report-modal .pm-premium-insights .pm-countdown {
  justify-content: center;
}
#pm-report-modal .pm-free-unlocked .pm-section-desc,
#pm-report-modal .pm-premium-insights .pm-section-desc,
#pm-report-modal .pm-toolkit-section .pm-section-desc {
  max-width: 36em;
  margin-left: auto;
  margin-right: auto;
}
#pm-report-modal .pm-toolkit-section .pm-fwgroup {
  margin-top: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
}
#pm-report-modal .pm-intro-offer {
  margin: 0 0 8px;
}
#pm-report-modal .pm-countdown {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.35;
  color: var(--pm-accent);
}
#pm-report-modal .pm-countdown__label,
#pm-report-modal .pm-countdown__value {
  font-weight: inherit;
  color: inherit;
  font-variant-numeric: tabular-nums;
}
#pm-report-modal .pm-countdown.is-expired {
  color: var(--pm-muted);
}

/* ---- Locked sections list ---- */
#pm-report-modal .pm-sections {
  margin-top: 0;
  display: grid;
  gap: 11px;
}

/* ---- Framework / toolkit group ---- */
#pm-report-modal .pm-fwgroup {
  margin-top: 18px;
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  background: rgba(255, 255, 255, .015);
  overflow: hidden;
}
#pm-report-modal .pm-fwgroup__head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 15px 17px;
  border-bottom: 1px solid var(--pm-line);
  background: linear-gradient(180deg, rgba(122, 92, 255, .06), transparent);
}
#pm-report-modal .pm-fwgroup__num {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--pm-accent-2), var(--pm-accent));
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
#pm-report-modal .pm-fwgroup__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--pm-text);
  line-height: 1.25;
}
#pm-report-modal .pm-fwgroup__heading {
  flex: 1;
  min-width: 0;
}
#pm-report-modal .pm-fwgroup__subtitle {
  display: block;
  margin-top: 3px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--pm-muted);
}
#pm-report-modal .pm-fwgroup__count {
  font-size: 11px;
  font-weight: 600;
  color: var(--pm-muted);
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--pm-line);
  padding: 3px 9px;
  border-radius: 999px;
  flex-shrink: 0;
}
#pm-report-modal .pm-fwgroup__body {
  padding: 14px 17px 17px;
  display: grid;
  gap: 11px;
}

/* ---- Cards ---- */
#pm-report-modal .pm-free-report .pm-card {
  background: var(--pm-surface);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius-sm);
  overflow: hidden;
  position: relative;
}
#pm-report-modal .pm-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
}
#pm-report-modal .pm-card__titlewrap {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
#pm-report-modal .pm-free-report .pm-card__title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--pm-text);
  line-height: 1.3;
  margin: 0;
}
#pm-report-modal .pm-card__body {
  padding: 0 14px 14px;
}
#pm-report-modal .pm-card__desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--pm-muted);
  margin: 0 0 10px;
}
#pm-report-modal .pm-card__text {
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--pm-muted);
  margin: 0;
}
#pm-report-modal .pm-card__text strong {
  color: var(--pm-text);
  font-weight: 600;
}

#pm-report-modal .pm-lockicon {
  width: 24px;
  height: 24px;
  border-radius: 7px;
  flex-shrink: 0;
  background: rgba(224, 70, 126, .14);
  border: 1px solid rgba(224, 70, 126, .3);
  display: flex;
  align-items: center;
  justify-content: center;
}
#pm-report-modal .pm-lockicon svg {
  width: 12px;
  height: 12px;
  color: var(--pm-accent);
}

#pm-report-modal .pm-state {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 3px 8px;
  border-radius: 999px;
  flex-shrink: 0;
  white-space: nowrap;
}
#pm-report-modal .pm-state--locked {
  color: var(--pm-accent);
  background: rgba(224, 70, 126, .12);
  border: 1px solid rgba(224, 70, 126, .28);
}

/* Locked analysis teaser cards */
#pm-report-modal .pm-sections .pm-card--locked {
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
#pm-report-modal .pm-sections .pm-card--locked:hover {
  border-color: var(--pm-accent);
  transform: translateY(-1px);
}
#pm-report-modal .pm-sections .pm-card--locked:focus-visible {
  outline: 2px solid var(--pm-accent);
  outline-offset: 2px;
}

#pm-report-modal .pm-blur {
  position: relative;
}
#pm-report-modal .pm-blur__lines {
  filter: blur(5px);
  opacity: .5;
  user-select: none;
  pointer-events: none;
}
#pm-report-modal .pm-blur__lines span {
  display: block;
  height: 8px;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--pm-muted), transparent);
  margin-bottom: 7px;
}
#pm-report-modal .pm-blur__lines span:nth-child(1) { width: 90%; }
#pm-report-modal .pm-blur__lines span:nth-child(2) { width: 74%; }
#pm-report-modal .pm-blur__lines span:nth-child(3) { width: 56%; }
#pm-report-modal .pm-card__reveal {
  margin-top: 9px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--pm-accent);
}

/* Toolkit locked preview cards */
#pm-report-modal .pm-toolkit .pm-fwgroup__body {
  grid-template-columns: 1fr 1fr;
  padding: 0;
}
#pm-report-modal .pm-toolkit .pm-card--lockedpreview .pm-blur {
  position: relative;
}
#pm-report-modal .pm-toolkit .pm-card--lockedpreview .pm-blur__lines {
  filter: blur(5px);
  opacity: .5;
  user-select: none;
}
#pm-report-modal .pm-toolkit .pm-card--lockedpreview .pm-blur::after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e0467e' stroke-width='2'><rect x='5' y='11' width='14' height='10' rx='2'/><path d='M8 11V7a4 4 0 0 1 8 0v4'/></svg>") no-repeat center;
  background-size: 20px;
  opacity: .85;
  pointer-events: none;
}
#pm-report-modal .pm-toolkit .pm-card--locked {
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
#pm-report-modal .pm-toolkit .pm-card--locked:hover {
  border-color: var(--pm-accent);
  transform: translateY(-1px);
}

/* Full free report block */
#pm-report-modal .pm-free-report .pm-ai-report {
  margin-top: 18px;
  padding: 20px;
  background: rgba(255, 255, 255, .02);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius-sm);
}
#pm-report-modal .pm-free-report .pm-redflags-report .pm-insight__tag {
  margin-bottom: 14px;
}
#pm-report-modal .pm-free-report .pm-ai-report > :last-child {
  margin-bottom: 0;
}
#pm-report-modal .pm-free-report .pm-redflags-report-cta {
  margin-top: 22px !important;
}

/* Sample report modal state */
#pm-report-modal.pm-report-modal--sample .pm-report-modal-body {
  display: block;
}
#pm-report-modal.pm-report-modal--sample .pm-report-modal-image {
  display: none;
}
#pm-report-modal.pm-report-modal--sample .pm-report-modal-content {
  padding: 0;
  overflow: hidden;
}
#pm-report-modal .pm-sample-report {
  display: flex;
  flex-direction: column;
  height: min(88vh, 900px);
  min-height: 460px;
  background: var(--pm-surface);
}
#pm-report-modal .pm-sample-report__viewer {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 460px;
  border: 0;
  background: #fff;
}

/* ---- Paywall ---- */
#pm-report-modal .pm-paywall {
  margin-top: 30px;
  background: radial-gradient(500px 200px at 50% 0%, rgba(224, 70, 126, .18), transparent 70%), var(--pm-surface-2);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  padding: 26px 24px;
  text-align: center;
}
#pm-report-modal .pm-paywall__icon {
  display: block;
  width: min(200px, 70%);
  height: auto;
  margin: 0 auto 18px;
}
#pm-report-modal .pm-paywall h2 {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -.02em;
  margin: 0 0 6px;
  color: var(--pm-text);
  text-align: center;
}
#pm-report-modal .pm-paywall__sub {
  font-size: 13.5px;
  color: var(--pm-muted);
  margin: 0 0 20px;
}
#pm-report-modal .pm-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 18px;
  text-align: left;
  max-width: 440px;
  margin: 0 auto 22px;
}
#pm-report-modal .pm-feature {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  color: var(--pm-text);
}
#pm-report-modal .pm-feature svg {
  width: 16px;
  height: 16px;
  color: var(--pm-good);
  flex-shrink: 0;
}
#pm-report-modal .pm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  max-width: 420px;
  background: linear-gradient(135deg, var(--pm-accent), var(--pm-accent-2));
  color: #fff;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  padding: 16px 22px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(224, 70, 126, .35);
  text-decoration: none;
}
#pm-report-modal .pm-report-modal-sticky-cta__btn {
  width: auto;
  max-width: none;
  font-size: 15px;
  line-height: 1.25;
  text-align: center;
}
#pm-report-modal .pm-report-modal-sticky-cta__btn--outline {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 12px;
  color: #fff;
  box-shadow: none;
  font-size: 14px;
  font-weight: 600;
  padding: 15px 16px;
  -webkit-appearance: none;
  appearance: none;
}
#pm-report-modal .pm-report-modal-sticky-cta__btn--outline:hover,
#pm-report-modal .pm-report-modal-sticky-cta__btn--outline:focus {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  filter: none;
}
#pm-report-modal .pm-btn:hover {
  filter: brightness(1.05);
  color: #fff;
}
#pm-report-modal .pm-btn.pm-cta--pulse {
  animation: pm-cta-pulse .9s ease;
}
@keyframes pm-cta-pulse {
  0%, 100% { transform: scale(1); }
  40% { transform: scale(1.03); }
  70% { transform: scale(0.99); }
}
#pm-report-modal .pm-price {
  font-size: 13px;
  color: var(--pm-muted);
  margin-top: 14px;
}
#pm-report-modal .pm-price b {
  color: var(--pm-text);
}

@media (max-width: 540px) {
  #pm-report-modal .pm-features,
  #pm-report-modal .pm-toolkit .pm-fwgroup__body {
    grid-template-columns: 1fr;
  }
  #pm-report-modal .pm-body {
    padding: 22px 18px 24px;
  }
  #pm-report-modal .pm-head {
    padding: 26px 18px 22px;
    gap: 12px;
  }
  #pm-report-modal .pm-head__icon-wrap {
    min-width: clamp(72px, 6.5em, 110px);
    max-width: min(120px, 30%);
  }
  #pm-report-modal .pm-head h1 {
    font-size: 22px;
  }
  #pm-report-modal .pm-sample-report {
    height: min(80vh, 700px);
    min-height: 360px;
  }
  #pm-report-modal .pm-sample-report__viewer {
    min-height: 360px;
  }
}
