/* Homepage hero (Design C "Bento"): grid backdrop, blue + red, vertical 3:4 video testimonials. Loads after home-modern.css. */
.hero-c { position: relative; isolation: isolate; background:
    radial-gradient(900px 480px at 100% 0%, rgba(36,87,245,.10), transparent 60%),
    radial-gradient(700px 400px at 0% 100%, rgba(226,30,38,.08), transparent 60%),
    #FBF9F7 !important; }
.hero-c::before { z-index: -1; background-image: linear-gradient(rgba(23,24,28,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(23,24,28,.045) 1px, transparent 1px) !important; background-size: 56px 56px !important; -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%) !important; mask-image: linear-gradient(180deg, #000, transparent 85%) !important; }
.hero-c-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(26px, 4vw, 56px); align-items: center; }
.hero-c-copy, .hero-c-right { min-width: 0; }

/* headline: three fixed lines, "Real Estate" highlighted, brand line in blue */
.hero-c .hero-h1 { letter-spacing: -.045em; }
.hero-c .hero-h1 .hl { background: linear-gradient(95deg, #E21E26 0%, #FF4B3A 60%, #FF7A45 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.hero-c .hero-h1-sub { color: var(--blue); }

/* four pointers: tidy 2 x 2 grid */
.hero-c .hero-checks-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 22px; margin: 0 0 8px; max-width: 560px; }
.hero-c .hero-checks-grid li { align-items: flex-start; line-height: 1.35; }
.hero-c .hero-checks-grid svg { margin-top: 2px; }

/* testimonial card: vertical 3:4 video on the left, quote on the right */
.hero-c .hp { max-width: 540px; margin: 0 auto; }
.hero-c .hp::before { display: none; }
.hero-c .hp-card { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); border-radius: 28px; background: #fff; border: 1px solid rgba(23,24,28,.08); box-shadow: 0 2px 4px rgba(23,24,28,.04), 0 36px 70px -34px rgba(23,24,28,.4); }
.hero-c .hp-media { aspect-ratio: 3 / 4; height: auto; min-height: 0; }
.hero-c .hp-video { object-fit: cover; }   /* keeps the speaker's face in frame */
.hero-c .hp-play { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
.hero-c .hp-metric { left: 10px; top: 10px; padding: 6px 10px; font-size: 11.5px; }
.hero-c .hp-metric b { font-size: 14.5px; }
.hero-c .hp-body { display: flex; flex-direction: column; justify-content: center; padding: 20px 20px 20px 22px; }
.hero-c .hp-q { font-size: 15.5px; min-height: 0; margin: 8px 0 14px; }
.hero-c .hp-who { padding-top: 12px; }
.hero-c .hp-tabs { margin-top: 14px; }
.hero-c .hp-tab { background: #fff; box-shadow: none; border-color: rgba(23,24,28,.1); }
.hero-c .hp-tab.is-on { box-shadow: 0 8px 20px -10px rgba(226,30,38,.5); }
.hero-c-trust { justify-content: center; margin-top: 18px; }

@media (max-width: 960px) {
  .hero-c-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .hero-c .hero-checks-grid { gap: 10px 14px; font-size: 13px; }
  .hero-c .hp-card { grid-template-columns: minmax(0, 1fr); }
  .hero-c .hp-media { width: 72%; margin: 0 auto; border-radius: 0 0 22px 22px; }
  .hero-c .hp-body { padding: 16px 16px 18px; }
}