/* ============================================================
   Render Repair — SEO content blocks
   Long-form text blocks, internal linking widgets, FAQ schema
   ============================================================ */

.seo-block {
  background: var(--rr-cream);
  padding: 48px 0;
}
.seo-block h2 { text-align: center; max-width: 720px; margin: 0 auto 1rem; }
.seo-block .lead { text-align: center; max-width: 680px; margin: 0 auto 2rem; color: var(--rr-mute); font-size: 1.05rem; }

.seo-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; max-width: 980px; margin: 0 auto; }
.seo-2col h3 { color: var(--rr-amber); font-size: 1.15rem; margin-bottom: .5rem; }
.seo-2col p { color: var(--rr-ink); font-size: .98rem; margin-bottom: 1rem; }
@media (max-width: 800px) { .seo-2col { grid-template-columns: 1fr; gap: 24px; } }

.internal-links {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px 28px;
  max-width: 980px; margin: 1.6rem auto 0;
  list-style: none; padding: 0;
}
.internal-links li a {
  display: block; padding: 8px 0; font-size: .92rem;
  color: var(--rr-navy); border-bottom: 1px dashed var(--rr-line);
}
.internal-links li a:hover { color: var(--rr-amber); }
@media (max-width: 700px) { .internal-links { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .internal-links { grid-template-columns: 1fr; } }

/* Why-us bar */
.why-us { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.why-us .item { padding: 20px; background: #fff; border: 1px solid var(--rr-line); border-radius: 12px; text-align: center; }
.why-us .ic { width: 50px; height: 50px; border-radius: 12px; margin: 0 auto 10px; background: var(--rr-amber-soft); color: var(--rr-amber); display: inline-flex; align-items: center; justify-content: center; }
.why-us .ic svg { width: 22px; height: 22px; }
.why-us h4 { margin-bottom: .35rem; font-size: .98rem; }
.why-us p { color: var(--rr-mute); margin-bottom: 0; font-size: .88rem; }
@media (max-width: 1099px) { .why-us { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px)  { .why-us { grid-template-columns: 1fr; } }

/* Service pricing tiers (rough indicative pricing) */
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.price-card {
  background: #fff; border: 1px solid var(--rr-line); border-radius: 16px;
  padding: 28px; position: relative;
  display: flex; flex-direction: column;
}
.price-card.popular { border-color: var(--rr-amber); transform: scale(1.02); box-shadow: var(--rr-shadow-lg); }
.price-card .pop {
  position: absolute; top: -12px; right: 22px;
  background: var(--rr-amber); color: #fff;
  font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 5px 12px; border-radius: 999px;
}
.price-card h3 { margin-bottom: .3rem; }
.price-card .price { font-family: 'Bricolage Grotesque', sans-serif; font-size: 2rem; font-weight: 800; color: var(--rr-amber); }
.price-card .price small { font-size: .8rem; color: var(--rr-mute); font-weight: 500; margin-left: 6px; }
.price-card ul { list-style: none; padding: 0; margin: 1rem 0 1.4rem; flex: 1; }
.price-card li { display: flex; gap: 8px; padding: 6px 0; font-size: .94rem; }
.price-card li::before { content: "✓"; color: var(--rr-amber); font-weight: 800; }
@media (max-width: 1099px) { .pricing-grid { grid-template-columns: 1fr; } .price-card.popular { transform: none; } }

/* Comparison table */
.compare {
  width: 100%; border-collapse: collapse;
  background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: var(--rr-shadow);
}
.compare th, .compare td { padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--rr-line); }
.compare th { background: var(--rr-cream-2); font-weight: 700; color: var(--rr-navy); }
.compare tr:last-child td { border-bottom: 0; }
@media (max-width: 600px) { .compare th, .compare td { padding: 10px 12px; font-size: .88rem; } }

/* Long-form content */
.content-narrow { max-width: 760px; margin: 0 auto; }
.content-narrow p { font-size: 1.04rem; line-height: 1.8; color: var(--rr-ink); }
.content-narrow h2 { margin-top: 2rem; }
.content-narrow ul li { margin-bottom: 6px; }
