/* ═══════════════════════════════════════════════════════════════
   AimHome Realty — Ajax Street Match
   Page-specific styles layered on top of _template/css/style.css
   SNRS Innovations Inc.
═══════════════════════════════════════════════════════════════ */


/* ─── Hero: data-forward feel ────────────────────────────────── */

/*
  This page is about real numbers — the headline is direct and
  punchy. Tighter max-width keeps it from wrapping too wide.
*/
.hero__headline {
  max-width: 20ch;
}


/* ─── Value Cards: chart/data SVG strokes ────────────────────── */

.value-card__icon svg rect,
.value-card__icon svg line,
.value-card__icon svg path,
.value-card__icon svg circle {
  stroke: var(--color-navy);
  fill: none;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Bar chart cards — fill the bars with navy at low opacity */
.value-card:first-child .value-card__icon svg rect {
  fill: rgba(31, 78, 121, 0.15);
  stroke: var(--color-navy);
}


/* ─── Neighbourhood tags (reuse markham pattern) ─────────────── */

.neighbourhood-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-block-start: var(--space-4);
  margin-block-end: var(--space-8);
}

.neighbourhood-tag {
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-navy);
  background: rgba(31, 78, 121, 0.08);
  border: 1px solid rgba(31, 78, 121, 0.18);
  border-radius: var(--radius-full);
  padding: 0.3rem 0.85rem;
}


/* ─── Value hook border ──────────────────────────────────────── */

.value-hook {
  border-bottom: 1px solid rgba(31, 78, 121, 0.08);
}


/* ─── Testimonials: slightly larger quote on desktop ─────────── */

@media (min-width: 1024px) {
  .testimonial__quote {
    font-size: var(--text-xl);
  }
}