/* ==========================================================================
   USER FEEDBACK PAGE — banner + "leave a review" CTA
   Core .feedback-grid / .feedback-card / .lightbox styles are shared in
   components.css. This file holds what's unique to this page.
   ========================================================================== */

.page-banner {
  padding-top: calc(var(--nav-h) + var(--sp-7));
  padding-bottom: var(--sp-4);
  text-align: center;
  background: radial-gradient(ellipse 70% 60% at 50% 0%, var(--accent-soft), transparent 65%);
}
.page-banner .eyebrow { justify-content: center; }
.page-banner h1 { font-size: var(--fs-3xl); }
.page-banner p { max-width: 560px; margin-inline: auto; font-size: var(--fs-md); }

/* The banner above already provides generous top spacing, so this section
   only needs a small nudge before the gallery, not the site-wide --sp-8. */
.feedback-section { padding-top: var(--sp-3); }

.review-cta {
  margin-top: var(--sp-7);
  text-align: center;
  border: 1px dashed var(--line);
  border-radius: var(--radius-lg);
  padding: var(--sp-6) var(--sp-4);
}

.review-cta h3 { margin-bottom: var(--sp-2); }
.review-cta p { color: var(--text-1); max-width: 480px; margin: 0 auto var(--sp-4); }
