/* ==========================================================================
   KF Elements — Reviews Band
   --------------------------------------------------------------------------
   A thin band of two slots. Deliberately quiet: it sits between a hero and a
   booking form, so it is one line of type per slot and nothing that competes.

   No font request, no image, no @import — a social-proof band that fetches
   anything is exactly the failure the widget's consent gate exists to prevent.
   ========================================================================== */

/* THE PADDING IS DECLARED HERE, and that is why it has to read the frame's
   tokens itself. `.kfe .kfe-reviews` is (0,2,0) and shadows `.kfe-section`'s
   own token padding at (0,1,0) (base.css:76-83), so an instance's
   `section_padding` would write its two tokens and paint nothing at all. The
   fallback is 5vh — this band's own value, not `--kfe-section-pad` (13vh),
   which is what `.kfe-section` would have given it and never did. */
.kfe .kfe-reviews { padding: var(--kfe-section-pad-start, 5vh) 0 var(--kfe-section-pad-end, 5vh); }

/* The head above the slots. This widget printed no heading before, so every
   level carries the class and there is no bare tag to pair with. */
.kfe .kfe-reviews .head { text-align: var(--kfe-head-align, start); margin-bottom: 26px; }
.kfe .kfe-reviews .head .kfe-reviews-title {
  font-family: var(--kfe-font-heading);
  font-weight: var(--kfe-heading-weight);
  letter-spacing: -0.01em;
  color: var(--kfe-heading, var(--kfe-primary));
  margin: 0;
  font-size: var(--kfe-title-size, var(--kfe-h2-size, clamp(1.6rem, 2.9vw, 2.1rem)));
  line-height: 1.2;
}
.kfe .kfe-reviews .kfe-reviews-intro {
  max-width: 660px;
  margin: 12px auto 0;
  color: var(--kfe-body, var(--kfe-muted));
  font-size: var(--kfe-body-size, 16px);
  line-height: 1.6;
}
.kfe .kfe-reviews .kfe-reviews-intro p + p { margin-top: 1em; }
.kfe .kfe-reviews .kfe-reviews-more { text-align: var(--kfe-head-align, start); margin-top: 22px; }
.kfe .kfe-reviews.kfe-dark .head .kfe-reviews-title { color: #fff; }
.kfe .kfe-reviews.kfe-dark .kfe-reviews-intro { color: var(--kfe-on-dark); }

.kfe .kfe-reviews .kfe-reviews-slots {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px 42px;
}

.kfe .kfe-reviews .kfe-reviews-slot { min-width: 0; }

.kfe .kfe-reviews .kfe-reviews-line {
  font-size: 15px;
  line-height: 1.5;
  color: var(--kfe-muted);
  text-align: center;
}
.kfe .kfe-reviews .kfe-reviews-line .count { color: var(--kfe-primary); font-weight: 400; }
.kfe .kfe-reviews .kfe-reviews-line a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--kfe-line); }
.kfe .kfe-reviews .kfe-reviews-line a:hover { color: var(--kfe-accent); }

/* The brand line: the provider's name, drawn as the pack's arrow link. The
   rule above is (0,3,1) and stays untouched, so this one carries the class on
   the anchor to outrank it rather than by changing it. */
.kfe .kfe-reviews .kfe-reviews-line .kfe-reviews-brand,
.kfe .kfe-reviews .kfe-reviews-line a.kfe-reviews-brand {
  color: var(--kfe-link, var(--kfe-accent));
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
  .kfe .kfe-reviews .kfe-reviews-line a.kfe-reviews-brand { border-bottom-color: color-mix(in srgb, var(--kfe-link, var(--kfe-accent)) 35%, transparent); }
}
/* Unlinked (no URL, or one esc_url() refused): the name alone, with the rule
   kept for the line's rhythm but drawn in nothing. */
.kfe .kfe-reviews .kfe-reviews-line span.kfe-reviews-brand { border-bottom-color: transparent; }
.kfe .kfe-reviews .kfe-reviews-line a.kfe-reviews-brand:hover,
.kfe .kfe-reviews .kfe-reviews-line a.kfe-reviews-brand:focus-visible {
  color: var(--kfe-accent-deep, var(--kfe-link, var(--kfe-accent)));
  border-bottom-color: currentColor;
}
.kfe .kfe-reviews.kfe-dark .kfe-reviews-line .kfe-reviews-brand,
.kfe .kfe-reviews.kfe-dark .kfe-reviews-line a.kfe-reviews-brand { color: #fff; }

/* dark-ground flips */
.kfe .kfe-reviews.kfe-dark .kfe-reviews-line { color: var(--kfe-on-dark); }
.kfe .kfe-reviews.kfe-dark .kfe-reviews-line .count { color: #fff; }

@media (max-width: 560px) {
  .kfe .kfe-reviews .kfe-reviews-slots { flex-direction: column; gap: 10px; }
}

/* RTL — no tracking on the count line either (see base.css). */
html[dir="rtl"] body .kfe .kfe-reviews .kfe-reviews-line { letter-spacing: 0; line-height: 1.8; }