/* ============================================================
   Report (Solutions > REPORT) — page-specific styles.
   Loaded AFTER home-v2.css + about-us.css + industrial-services.css.
   NOT a straight clone of the Industries template: hero has a single body
   paragraph, Section 4 = "How Pontem Helps" (Collect/Organize/Visualize/
   Enable), Section 5 = "How Organizations Use Better Reporting" with only
   FOUR feature blocks (4th = AI, image-right), and there is NO Specialized
   Experience section. Reuses every other .rd-is-* structural class as-is.
   Footer uses the shared --v2-lav (#E8DCF2) background already — matches
   the figma frame, no override needed.
   Text on colored/dark bg keeps an EXPLICIT color (see CLAUDE.md §6).
   ============================================================ */

/* ---- Hero (reuses .rd-about-hero; photo is 582x345 visible box, native png 1160x726) ---- */
.rd-rp-hero { background: #F4F7FF; padding-top: 183px; padding-bottom: 128px; }  /* R3: uniform hero bg #F4F7FF (matches the mockup + every other page) */
.rd-rp-hero .rd-about-hero-inner { grid-template-columns: minmax(0, 494px) 582px; gap: 42px; align-items: start; justify-content: start; }  /* copy column flexes so the laptop is never clipped at 981-1140px widths (was 494px fixed -> clipped up to 142px) */
.rd-rp-hero .rd-about-hero-copy { margin-top: 73px; }
.rd-rp-hero h1 { max-width: 420px; margin-bottom: 22px; font-size: 41px; letter-spacing: 3.5px; color: var(--v2-dark); }
.rd-rp-hero h1 span { display: block; color: var(--v2-purple); }
.rd-rp-hero .rd-about-hero-copy p { max-width: 500px; margin-bottom: 0; font-size: 18px; line-height: 1.55; color: var(--v2-text); }
.rd-rp-hero .rd-about-hero-media { align-self: start; margin-top: 93px; }
.rd-rp-hero .rd-about-hero-media img { aspect-ratio: 1160 / 726; object-fit: cover; }
.rd-rp-hero .rd-about-hero-square { top: -98px; left: 116px; width: 660px; height: 296px; }
.rd-rp-hero .rd-about-hero-dots {
  top: 100px; left: 600px; width: 140px; height: 150px;
  background-image: radial-gradient(var(--v2-purple-50) 2px, transparent 2.6px);
  background-size: 16px 16px;
}
.rd-rp-hero-btns { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 30px; }
.rd-page .rd-rp-hero-btns .rd-btn { border-color: var(--v2-purple); color: var(--v2-purple); background: transparent; }
.rd-page .rd-rp-hero-btns .rd-btn:hover { background: var(--v2-purple-10); }

/* ---- 2. Does This Sound Familiar: callout uses regular weight (only the trailing sentence is bold) ---- */
.rd-rp-pains .rd-callout { font-weight: 400; }
.rd-rp-pains .rd-callout b { font-weight: 700; }

/* ---- 3. Better Reporting Creates Better Outcomes (tighter tracking than the Industries default) ---- */
.rd-rp-better .rd-is-better-h { letter-spacing: 1px; }

/* ---- 5. How Organizations Use Better Reporting: per-block image widths
   (the extracted rp-feat-* screenshots differ in native aspect ratio,
   so each block needs its own display width to match the figma render) ---- */
.rd-rp-improve .rd-rp-feat-1 .rd-is-feat-img img { width: 382px; }
.rd-rp-improve .rd-rp-feat-2 .rd-is-feat-img img { width: 296px; }
.rd-rp-improve .rd-rp-feat-3 .rd-is-feat-img img { width: 388px; }
.rd-rp-improve .rd-rp-feat-4 .rd-is-feat-img img { width: 330px; }
.rd-rp-improve .rd-is-feat-row { grid-template-columns: 419px 245px 339px; }

/* ---- 10. CTA: paragraph column is wider on this page (matches figma's 4-line wrap) ---- */
.rd-rp-cta .rd-cta-copy p { max-width: 400px; }

@media (max-width: 980px) {
  .rd-rp-hero .rd-about-hero-inner { grid-template-columns: 1fr; }
  .rd-rp-hero .rd-about-hero-media { margin-top: 0; }
}

/* mobile (additive) */
@media (max-width: 980px) {
  .rd-rp-improve .rd-is-feat-row { grid-template-columns: 1fr; }
  .rd-rp-hero .rd-about-hero-media { align-self: auto; margin-top: 0; }
  .rd-rp-hero { padding-top: 145px; }                       /* R2: consistent mobile hero clearance (base 183 was leaking to mobile = too far) */
  .rd-rp-hero .rd-about-hero-copy { margin-top: 0; }        /* R2: reset the 73px desktop copy offset that was pushing mobile text way down */
}