/* Home Team Construction — reviews

   COMPONENT 03 — GOOGLE REVIEWS (Trustindex)
   SHIPPING SOURCE OF TRUTH.
   CORRECTION to an earlier revision: "Hear From Our Clients" does not head an
   Elementor template. It heads a Trustindex Google-reviews widget
   (cdn.trustindex.io/loader.js?c256a945...). There is no video section.
   The widget's markup belongs to Trustindex and arrives from their CDN, so it
   is restyled, never replaced — same rule as the Elementor Pro forms. What
   this block owns is the header above it and the frame around it.
   THREE FIXES THE BLOCK CANNOT MAKE ON ITS OWN, see NOTES:
   1. cdn.trustindex.io is currently loaded as text/rocketlazyloadscript, so
   WP Rocket defers it until first interaction. The reviews are invisible
   on load. Exclude that host from delay-JS.
   2. The homepage loads loader.js TWICE, with two different widget ids
   (72b207c5... in the hero region, c256a945... here). One is enough.
   3. Trustindex's own layout is chosen in their dashboard, not in CSS. Pick
   a square-cornered, minimal layout so it agrees with radius 0.

   Ported from deliverables/review.html <template id="cmp-reviews">.
   Tokens come from tokens.css; only local overrides are declared here.
*/

/* Home Team Construction — 03 Google reviews */
/* WHITE, not --htc-bg-light. Owner decision, 2026-09-02, and a departure from
   the artifact: reviews and the stat band were both bg-light and adjacent, so
   the two ran together as one grey mass from the hero all the way to the trust
   block. White here leaves the stat band as the only grey on the page, which
   is what makes it read as a separator rather than as a background. */
.htc-reviews{
  box-sizing:border-box;
  width:100%;
  background:var(--htc-white);
  padding:var(--htc-s7) var(--htc-s4);
  font-family:var(--htc-font-body);
}

.htc-reviews *,
.htc-reviews *::before,
.htc-reviews *::after{ box-sizing:border-box; }

.htc-reviews__inner{ max-width:var(--htc-container); margin:0 auto; }

/* The standard eyebrow, identical to trust, outcomes, how we work and the rest
   — the rule is the ::before, not an element of its own. This section used to
   carry the bare rule with no text beside it, which was the artifact declining
   to write copy it did not own; see parts/reviews.php for the copy note.

   hero-service and hero-location still use the rule-alone treatment and should
   keep it: on those pages the line that would be the eyebrow has been promoted
   to the h1, so the slot is empty for a reason rather than by omission. */
.htc-reviews__eyebrow{
  display:flex;
  align-items:center;
  gap:var(--htc-s2);
  margin:0 0 var(--htc-s2);
  font-size:var(--htc-eyebrow);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1.3;
  color:var(--htc-red);
}
.htc-reviews__eyebrow::before{
  content:"";
  flex:0 0 auto;
  width:24px;
  height:2px;
  background:var(--htc-red);
}

.htc-reviews__title{
  margin:0 0 var(--htc-s5);
  font-size:var(--htc-h2);
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.015em;
  color:var(--htc-black);
  max-width:20ch;
  text-wrap:balance;
}

/* Reserved height. Trustindex injects asynchronously; without a floor the
   sections below jump when it arrives. Sized to the widget's typical rendered
   height so the reflow is small rather than a page-length shove. */
.htc-reviews__slot{ min-height:340px; }

@media (max-width:1150px){
  .htc-reviews{ padding:var(--htc-s6) var(--htc-s3); }
}

@media (max-width:767px){
  .htc-reviews{ padding:var(--htc-s5) var(--htc-s3); }
  .htc-reviews__title{ max-width:none; }
  .htc-reviews__slot{ min-height:420px; }
}
