/* Styles specific to the Pet Mat ROI Calculator (products/mat-roi.html) */

/* ── HERO (light Gen-4, matches products/mat.html palette) ── */
.mat-roi-hero {
  background-color: var(--color-offwhite);
  padding: 5rem 2rem 4rem;
}

.mat-roi-hero-inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.mat-roi-hero-sub {
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--color-text-secondary);
  max-width: 560px;
  margin: 0 auto;
}

/* ── In-calculator image (CatOnAMat) ── */
.mat-roi-image {
  border-radius: 8px;
  margin-top: 1.5rem;
  width: 100%;
}