/* ============================================================
   LEAD FINDER — page-specific styles. Tokens only.
   Desktop values match Figma 8221:948; mobile 8954:4416.
   Chrome (announce bar, dropdown internals, drill-ins, mobile
   menu) copied from pages/home/page.css verbatim.
   ============================================================ */

/* ---------- SECTION RHYTHM ----------
   Desktop seams measured from Figma 8206:748 (previous section
   bottom → next section icon top). Mobile = locked 80px. */
@media (min-width: 768px) {
  #trust { margin-top: 152px; }
  #why { margin-top: 86px; }
  #what { margin-top: 86px; }
  #tour { margin-top: 88px; }
  #bigger { margin-top: 86px; }
  #add-ons { margin-top: 90px; }
  #testimonials { margin-top: 90px; }
  #faq { margin-top: 90px; }
  #book-a-demo { margin-top: 90px; padding-bottom: 90px; }
}
@media (max-width: 767px) {
  #trust, #why, #what, #tour, #bigger, #add-ons,
  #testimonials, #faq, #book-a-demo { margin-top: 80px; }
  #book-a-demo { padding-bottom: var(--bh-space-40); }
}

/* ---------- Announcement bar (copied from home) ---------- */
.bh-announce {
  background: var(--bh-dark);
  padding-block: 9px;
  text-align: center;
}
.bh-announce p {
  font-size: var(--bh-fs-fine);
  font-weight: var(--bh-w-semibold);
  line-height: 17px; /* Figma: announce bar 35px = 9 + 17 + 9 */
  color: rgba(255,255,255,0.92);
}
@media (max-width: 767px) {
  .bh-announce { padding-inline: var(--bh-space-16); }
  .bh-announce p { font-size: 11px; }
}

/* ---------- Dropdown internals (copied from home) ---------- */
.bh-dd-cols { display: flex; gap: var(--bh-space-30); align-items: stretch; }
.bh-dd-col { flex: 1 1 220px; min-width: 0; }
.bh-dd-colhead { display: flex; align-items: center; gap: var(--bh-space-12); margin-bottom: var(--bh-space-12); color: inherit; text-decoration: none; }
.bh-dd-product { display: block; font-family: var(--bh-font-display); font-weight: var(--bh-w-xbold); font-size: 17px; color: var(--bh-ink); }
.bh-dd-sub { display: block; font-size: 12px; font-weight: var(--bh-w-medium); color: var(--bh-body); }
.bh-dd-rule { border: 0; border-top: 1px solid #EFECF3; margin: var(--bh-space-12) 0; }
.bh-dd-tile--lg { width: 40px; height: 40px; }
.bh-dd-tile--xl { width: 64px; height: 64px; }
.bh-dd-item .bh-dd-tile { width: 34px; height: 34px; }
.bh-dd-about .bh-dd-item .bh-dd-tile, .bh-dd-resources .bh-dd-item .bh-dd-tile { width: 40px; height: 40px; }
.bh-dd-item .bh-dd-name { font-size: var(--bh-fs-body-sm); font-weight: var(--bh-w-semibold); }
/* keep name + ADD-ON pill on ONE line; long names without a pill may still wrap (review A2) */
.bh-dd-item { display: flex; align-items: center; flex-wrap: nowrap; }
.bh-dd-item:has(.bh-tag--addon) .bh-dd-name { white-space: nowrap; }
.bh-dd-item .bh-tag--addon {
  flex: 0 0 auto; white-space: nowrap;
  /* same chip as the mobile drill rows (review A2) */
  background: #F2F1F4; border: none; border-radius: var(--bh-r-6);
  padding: 3px 7px; font-size: 10px; font-weight: var(--bh-w-medium);
  letter-spacing: 0; text-transform: none; color: #828794;
}
.bh-dd-featured--crm { min-height: 390px; }
.bh-dd-featured-btn { min-width: 150px; height: 44px; padding-block: 0; font-size: 15px; }
.bh-dd-about, .bh-dd-resources {
  border-radius: var(--bh-r-20);   /* was 24 - off the 8/12/16/20 scale */
}
.bh-dd-eyebrow {
  font-size: 11px; font-weight: var(--bh-w-bold); letter-spacing: 1px;
  text-transform: uppercase; color: #99A2B3; margin-bottom: var(--bh-space-12);
}
.bh-dd-eyebrow--white { color: var(--bh-white); letter-spacing: 1.5px; font-size: 12px; }
.bh-dd-eyebrow--pink { color: var(--bh-pink); letter-spacing: 1.5px; font-size: 12px; }
.bh-dd-item { position: relative; }
.bh-dd-item .bh-tag--addon { margin-left: var(--bh-space-8); }

.bh-dd-featured {
  flex: 0 0 340px; border-radius: var(--bh-r-16); overflow: hidden;
  position: relative; display: flex; flex-direction: column;
  padding: var(--bh-space-24); gap: var(--bh-space-12);
}
.bh-dd-featured--crm {
  background: linear-gradient(233.8deg, #4C1D95 14.5%, var(--bh-violet) 85.5%);
  position: relative;
}
.bh-dd-featured--crm::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 128px 128px;
  opacity: 0.10; mix-blend-mode: multiply;
}
.bh-dd-featured--crm > * { position: relative; z-index: 1; }
.bh-dd-featured-title { font-family: var(--bh-font-display); font-weight: var(--bh-w-xbold); font-size: 24px; color: var(--bh-white); }
.bh-dd-featured-title--lg { font-size: 30px; max-width: 380px; }
.bh-dd-featured-desc { font-size: var(--bh-fs-body-sm); font-weight: var(--bh-w-medium); color: var(--bh-white-85); }
.bh-dd-featured-btn { background: var(--bh-white); color: #6D28D9; margin-top: auto; align-self: flex-start; padding: var(--bh-space-12) var(--bh-space-24); }
.bh-dd-featured--news, .bh-dd-featured--pillow { padding: 0; border: 1px solid rgba(0,0,0,0.06); border-radius: var(--bh-r-20); }
.bh-dd-featured--pillow { flex: 1 1 auto; }
.bh-dd-featured-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bh-dd-featured-overlay {
  position: relative; z-index: 1; display: flex; flex-direction: column; gap: var(--bh-space-12);
  justify-content: flex-end; height: 100%; min-height: 300px; padding: var(--bh-space-24);
  background: linear-gradient(180deg, rgba(20,13,31,0) 35%, rgba(20,13,31,0.92) 100%);
  border-radius: inherit;
}
.bh-dd-featured--pillow .bh-dd-featured-overlay {
  justify-content: center; align-items: flex-start;
  background: linear-gradient(90deg, rgba(26,15,36,0.94) 0%, rgba(26,15,36,0.72) 42%, rgba(26,15,36,0) 72%);
}
.bh-dd-featured--news .bh-dd-featured-title { font-size: 20px; }
.bh-dd-featured-link { font-size: 13px; font-weight: var(--bh-w-bold); color: var(--bh-pink); }
/* PMI news card — exact Figma spec (8528:2979 / 2981 / 2982 / 2983):
   32px side padding, 35px bottom, eyebrow 16 above the title, title 44 above the link,
   eyebrow + link both #F24476. */
.bh-dd-featured--news .bh-dd-featured-overlay {
  gap: 0; padding: var(--bh-space-24) var(--bh-space-32) 35px;
}
.bh-dd-featured--news .bh-dd-eyebrow--pink { color: var(--bh-pink); margin-bottom: var(--bh-space-16); }
.bh-dd-featured--news .bh-dd-featured-title { margin-bottom: 44px; }
/* the whole card is the hit area; the "Read the story" link carries it */
.bh-dd-featured--news { position: relative; }
.bh-dd-featured--news .bh-dd-featured-link::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.bh-dd-featured--pillow .bh-btn { align-self: flex-start; }
/* nav dropdown: extra air above the Pillow Talk Subscribe button (2026-08-27) */
.bh-dd-featured--pillow .bh-dd-featured-overlay .bh-btn { margin-top: var(--bh-space-12); }

/* ---------- Mobile menu internals (copied from home) ---------- */
.bh-mm-list { padding: var(--bh-space-16) var(--bh-space-24) 0; }
.bh-mm-list a {
  display: flex; align-items: center; justify-content: space-between;
  height: 64px; border-bottom: 1px solid #ECECEF;
  font-size: 22px; font-weight: var(--bh-w-semibold); color: var(--bh-ink);
}
.bh-mm-chev { font-size: 24px; font-weight: var(--bh-w-medium); color: var(--bh-body); }
.bh-drill { padding: 0 var(--bh-space-20) var(--bh-space-24); }
.bh-drill-header { margin: 0 calc(-1 * var(--bh-space-20)) var(--bh-space-16); }
.bh-drill-back {
  font-size: 18px; font-weight: var(--bh-w-semibold); color: var(--bh-ink);
  padding-block: var(--bh-space-12);
}
.bh-drill-title { font-size: 26px; font-weight: var(--bh-w-xbold); color: var(--bh-ink); margin-bottom: var(--bh-space-16); }
.bh-drill-group {
  font-size: 12px; font-weight: var(--bh-w-xbold); letter-spacing: 0.6px;
  color: #828794; text-transform: uppercase; margin: var(--bh-space-20) 0 var(--bh-space-12);
}
.bh-drill-row { display: flex; align-items: center; gap: var(--bh-space-12); padding-block: var(--bh-space-8); }
.bh-drill-name { display: block; font-size: 16px; font-weight: var(--bh-w-semibold); color: var(--bh-ink); }
.bh-drill-desc { display: block; font-size: 12.5px; font-weight: var(--bh-w-medium); color: #828794; }
.bh-tag--addon-m { background: #F2F1F4; border-radius: var(--bh-r-6); padding: 3px 7px; font-size: 10px; font-weight: var(--bh-w-medium); color: #828794; }
.bh-drill-card {
  display: block; border-radius: 18px; padding: var(--bh-space-24);
  margin-top: var(--bh-space-24); position: relative; overflow: hidden;
}
.bh-drill-card--crm { background: linear-gradient(90deg, var(--bh-violet) 0%, #6D32D5 100%); }
.bh-drill-card--news { background: var(--bh-dark); }
.bh-drill-card--pillow { background: var(--bh-dark); }
.bh-drill-card-eyebrow { font-size: 11px; font-weight: var(--bh-w-xbold); letter-spacing: 1px; color: rgba(255,255,255,0.85); margin-bottom: var(--bh-space-8); }
.bh-drill-card-eyebrow--pink { color: var(--bh-pink); }
.bh-drill-card-title { display: flex; align-items: center; gap: var(--bh-space-12); font-size: 20px; font-weight: var(--bh-w-xbold); color: var(--bh-white); margin-bottom: var(--bh-space-8); }
.bh-drill-card-desc { font-size: 13.5px; color: var(--bh-white-85); margin-bottom: var(--bh-space-12); }
.bh-drill-card-link { font-size: var(--bh-fs-body-sm); font-weight: var(--bh-w-semibold); color: var(--bh-pink); }
.bh-drill-card-btn { padding: 9px var(--bh-space-16); font-size: 13px; border-radius: 10px; display: inline-flex; }
.bh-mm-header {
  display: flex; align-items: center; justify-content: space-between;
  height: 72px; padding: 0 18px 0 22px;
  border-bottom: 1px solid #ECECEF;
}
.bh-mm-header img { height: 22.8px; width: auto; }
.bh-mm-header-right { display: flex; align-items: center; gap: var(--bh-space-12); }
.bh-mm-cta { padding: 10px var(--bh-space-16); border-radius: 10px; font-size: var(--bh-fs-body-sm); font-weight: var(--bh-w-semibold); }
.bh-mm-close { font-size: 20px; color: var(--bh-ink); padding: var(--bh-space-8); line-height: 1; }
.bh-mobile-menu {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
}

/* ---------- Hero (split: copy left, clay right) ---------- */
.hero { padding-top: 31px; }
.hero-inner { position: relative; }
.hero-copy { max-width: 640px; padding-left: var(--bh-space-20); position: relative; z-index: 1; }
.hero-eyebrow { display: block; }
.hero-h1 {
  font-size: 99px;
  letter-spacing: -2.8px;
  line-height: 96px;
  margin-top: var(--bh-space-24);
}
.hero-dot { color: var(--bh-accent); }
.hero-sub {
  font-size: 22px; font-weight: var(--bh-w-medium); color: var(--bh-body);
  line-height: 1.32; max-width: 560px; margin-top: var(--bh-space-32);
}
.hero-chips { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 108px; } /* Figma: chips pinned at y600; LF sub is 2 lines */
.hero-chip {
  display: inline-flex; align-items: center; gap: 10px;
  height: 40px; padding: 0 var(--bh-space-16);
  background: var(--bh-white); border: 1px solid var(--bh-border);
  border-radius: var(--bh-r-12);
  font-size: 15px; font-weight: var(--bh-w-semibold); color: var(--bh-ink);
}
.hero-chip-check {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--bh-accent); color: var(--bh-white);
  font-size: 9px; font-weight: var(--bh-w-bold);
}
.hero-cta-row { display: flex; align-items: center; gap: var(--bh-space-24); margin-top: var(--bh-space-36); }
.hero-cta { min-width: 186px; height: 56px; font-size: 17.5px; padding-inline: var(--bh-space-24); }

/* The composed art is wide (1.84), so the old fixed 660x680 box rendered it short. The sub
   copy wraps differently per width, so the box tracks the viewport and is capped at 680 —
   measured clear of the copy at 1440 / 1366 / 1280. Height follows the image aspect. */
.hero-clay { position: absolute; right: 16px; top: 96px; width: min(680px, 48vw); height: auto; z-index: 0; }
.hero-clay img { width: 100%; height: auto; display: block; }
@media (max-width: 1279px) {
  .hero-clay { position: static; width: auto; height: auto; margin-top: var(--bh-space-30); }
  .hero-clay img { height: auto; }
}
@media (max-width: 767px) {
  .hero { padding-top: var(--bh-space-36); text-align: center; }
  /* Figma mobile order: eyebrow, h1, sub, clay, chips, CTA, proof */
  .hero-inner { display: flex; flex-direction: column; align-items: center; }
  .hero-copy { display: contents; }
  .hero-eyebrow { order: 1; }
  .hero-h1 { order: 2; font-size: 40px; letter-spacing: -1.2px; line-height: 1.2; margin-top: var(--bh-space-16); }
  .hero-sub { order: 3; font-size: 16px; line-height: 1.44; margin-top: var(--bh-space-16); margin-inline: auto; }
  .hero-clay { order: 4; margin-top: var(--bh-space-16); width: 100%; }
  .hero-clay img { width: 100%; max-height: 300px; object-fit: contain; }
  .hero-chips { order: 5; justify-content: center; gap: 8px; margin-top: var(--bh-space-16); }
  .hero-chip { height: 35px; padding: 0 var(--bh-space-16); border-radius: 10px; font-size: 13px; font-weight: var(--bh-w-bold); gap: 10px; }
  .hero-chip-check { width: 14px; height: 14px; font-size: 9px; }
  .hero-cta-row { order: 6; flex-direction: column; gap: var(--bh-space-16); margin-top: var(--bh-space-16); }
  .hero-cta { min-width: 147px; height: 50px; font-size: 15px; }
  .hero-cta .hero-cta-arrow { display: none; }

}

/* ---------- Trust strip ---------- */
.trust-label {
  text-align: center;
  font-size: var(--bh-fs-fine); font-weight: var(--bh-w-xbold);
  letter-spacing: 1.5px; text-transform: uppercase; color: var(--bh-body);
}
.trust-grid {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: var(--bh-space-16);
  max-width: 1256px; margin: var(--bh-space-30) auto 0;
}
.trust-chip {
  display: flex; align-items: center; justify-content: center;
  height: 92px; background: var(--bh-white);
  border: 1px solid var(--bh-border); border-radius: var(--bh-r-12);
  box-shadow: var(--bh-shadow-lift);
}
.trust-chip img { max-width: 140px; max-height: 52px; width: auto; height: auto; object-fit: contain; }
@media (max-width: 767px) {
  .trust-label { font-size: 11.5px; color: #999EAB; }
  .trust-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: var(--bh-space-30); }
  .trust-chip { height: 62px; border-radius: 10px; border-color: #edf0f5; box-shadow: none; }
  .trust-chip img { max-width: 79px; max-height: 30px; }
}

/* ---------- Why (3 value cards) ---------- */
.why-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--bh-space-30);
  max-width: 1260px; margin: var(--bh-space-40) auto 0;
}
.why-card {
  background: var(--bh-white); border-radius: var(--bh-r-16);
  box-shadow: var(--bh-shadow-card);
  padding: 28px; min-height: 210px;
}
.why-icon { width: 52px; height: 52px; object-fit: contain; }
.why-title {
  font-family: var(--bh-font-body); font-weight: var(--bh-w-bold);
  font-size: 22px; letter-spacing: 0; color: var(--bh-ink);
  margin-top: var(--bh-space-20);
}
.why-desc { font-size: 15px; line-height: 24px; margin-top: var(--bh-space-8); }
@media (max-width: 1023px) {
  .why-grid { grid-template-columns: 1fr; gap: var(--bh-space-16); margin-top: var(--bh-space-16); }
  .why-card { padding: var(--bh-space-20); min-height: 0; }
  .why-icon { width: 48px; height: 48px; }
  .why-title { font-family: var(--bh-font-display); font-weight: var(--bh-w-black); font-size: 19px; margin-top: var(--bh-space-12); }
  .why-desc { font-size: 16px; line-height: 1.44; }
}

/* ---------- What it does (8 feature cards) ---------- */
.what-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: var(--bh-space-20);
  margin-top: var(--bh-space-40);
}
.what-card {
  background: var(--bh-white); border-radius: var(--bh-r-16);
  box-shadow: var(--bh-shadow-card);
  padding: 28px; text-align: center;
  display: flex; flex-direction: column; align-items: center;
}
.what-icon { width: 52px; height: 52px; object-fit: contain; }
.what-title {
  font-family: var(--bh-font-body); font-weight: var(--bh-w-bold);
  font-size: 21px; letter-spacing: 0; color: var(--bh-ink);
  margin-top: var(--bh-space-16);
}
.what-desc { font-size: 15px; line-height: 24px; margin-top: var(--bh-space-16); }
@media (max-width: 1023px) {
  .what-grid { grid-template-columns: 1fr; gap: var(--bh-space-16); margin-top: var(--bh-space-16); }
  .what-card { padding: 28px var(--bh-space-24); }
}

/* ---------- Product tour ---------- */
.tour-frame {
  max-width: 1100px; margin: 44px auto 0;
  background: var(--bh-white);
  border: 1px solid var(--bh-border); border-radius: var(--bh-r-16);
  box-shadow: var(--bh-shadow-card);
  overflow: hidden;
}
.tour-bar {
  display: flex; align-items: center; gap: var(--bh-space-8);
  height: 38px; padding-left: 18px;
  background: #F7F8FB;
}
.tour-bar span { width: 10px; height: 10px; border-radius: 50%; }
.tour-bar span:nth-child(1) { background: #FA7370; }
.tour-bar span:nth-child(2) { background: #FCC24A; }
.tour-bar span:nth-child(3) { background: #59CC6B; }
.tour-frame img { width: 100%; height: auto; }
@media (max-width: 767px) {
  .tour-frame { margin-top: var(--bh-space-16); border-radius: var(--bh-r-8); }
  .tour-bar { height: 12px; padding-left: 6px; gap: 3px; }
  .tour-bar span { width: 4px; height: 4px; }
}

/* ---------- Bigger picture + Add-ons (tool cards) ---------- */
.bigger-h2 { font-size: 52px; letter-spacing: -1.8px; }
.addons-h2 { font-size: 48px; letter-spacing: -2px; }
.bigger-sub { font-size: 18px; line-height: 28px; max-width: 760px; }
.tool-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--bh-space-40);
  max-width: 1300px; margin: 47px auto 0;
}
.tool-grid--included { margin-top: var(--bh-space-60); }
.tool-card {
  background: var(--bh-white);
  border: 1px solid var(--bh-border-pill); border-radius: var(--bh-r-16);
  box-shadow: var(--bh-shadow-card);
  overflow: hidden;
  display: flex; flex-direction: column;
}
.tool-img { width: 100%; height: 270px; object-fit: cover; }
.tool-content { padding: 26px 34px 34px; display: flex; flex-direction: column; align-items: flex-start; flex: 1; }
.tool-pill {
  display: inline-flex; align-items: center; justify-content: center;
  height: 26px; padding: 0 var(--bh-space-12);
  /* uppercase caps sat 2px high in the 26px pill (5 above / 7 below); an explicit
     line-height equal to the fixed height centres them exactly (6 / 6). */
  line-height: 26px;
  border-radius: var(--bh-r-8);
  font-size: 11px; font-weight: var(--bh-w-xbold); letter-spacing: 0.5px;
}
.tool-pill--included { background: var(--bh-white); border: 1.5px solid var(--bh-accent); color: var(--bh-accent); }
.tool-pill--addon { background: var(--bh-accent); color: var(--bh-white); }
.tool-title {
  font-size: 27px; letter-spacing: 0; color: var(--bh-ink);
  margin-top: 14px;
}
.tool-desc { font-size: 16px; line-height: 22px; margin-top: 14px; }
.tool-bullets { margin-top: 14px; }
.tool-bullets li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 16px; color: var(--bh-ink); line-height: 21px;
}
.tool-bullets li + li { margin-top: var(--bh-space-12); }
.tool-check {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--bh-accent); color: var(--bh-white);
  font-size: 12px; font-weight: var(--bh-w-bold);
}
.tool-btn { margin-top: 38px; height: 51px; padding-inline: var(--bh-space-32); font-size: 16px; }
@media (max-width: 1023px) {
  .bigger-h2 { font-size: 26px; letter-spacing: -0.5px; }
  .addons-h2 { font-size: 26px; letter-spacing: -0.5px; }
  .bigger-sub { font-size: 16px; line-height: 1.4; }
  .tool-grid { grid-template-columns: 1fr; gap: var(--bh-space-16); margin-top: var(--bh-space-20); }
  .tool-grid--included { margin-top: var(--bh-space-20); }
  .tool-img { height: 147px; }
  .tool-content { padding: 26px 34px 34px; }
  .tool-title { font-size: 22px; }
  .tool-desc { font-size: 16px; line-height: 1.38; margin-top: var(--bh-space-12); }
  .tool-bullets { margin-top: var(--bh-space-12); }
  .tool-btn { margin-top: var(--bh-space-24); height: 46px; font-size: 15px; }
}

/* ---------- Testimonials (2-slide carousel) ---------- */
.testi-carousel { position: relative; margin-top: var(--bh-space-32); }
.testi-slide { display: flex; flex-direction: column; align-items: center; text-align: center; padding-block: var(--bh-space-30) 0; }
.testi-quote {
  font-family: var(--bh-font-display); font-weight: var(--bh-w-semibold);
  font-size: 36px; line-height: 53px; color: var(--bh-ink); max-width: 940px;
}
.testi-caption { display: flex; flex-direction: column; align-items: center; margin-top: 27px; }
.testi-avatar { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; }
.testi-name { font-size: 21px; font-weight: var(--bh-w-bold); color: var(--bh-ink); margin-top: var(--bh-space-16); }
.testi-role { font-size: 15.5px; color: var(--bh-body); margin-top: var(--bh-space-4); }
.testi-arrow {
  position: absolute; top: 26%; z-index: 2;
  width: 56px; height: 56px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: var(--bh-w-bold);
}
.testi-arrow--prev { left: var(--bh-space-20); background: var(--bh-white); border: 1.5px solid var(--bh-border); color: var(--bh-ink); }
.testi-arrow--next { right: var(--bh-space-20); background: var(--bh-accent); color: var(--bh-white); }
.testi-arrow .arrow-glyph-mobile { display: none; }
.testi-nav-row { display: contents; }
.testi-carousel .bh-car-controls { margin-top: var(--bh-space-48); }
@media (max-width: 767px) {
  /* Figma tool-page mobile: quote sits directly on the page bg — no card */
  .testi-carousel { margin-top: var(--bh-space-16); padding: 0; }
  .testi-slide { padding: 26px var(--bh-space-24) 0; }
  .testi-quote { font-family: var(--bh-font-body); font-weight: var(--bh-w-medium); font-size: 16px; line-height: 1.5; }
  .testi-quote::before { content: '“'; }
  .testi-quote::after { content: '”'; }
  .testi-caption { margin-top: var(--bh-space-20); }
  .testi-avatar { width: 46px; height: 46px; }
  .testi-name { font-size: 15px; margin-top: var(--bh-space-8); }
  .testi-role { font-size: 13px; }
  .testi-nav-row {
    display: flex; align-items: center; justify-content: center;
    gap: var(--bh-space-16); margin: var(--bh-space-20) 0 var(--bh-space-24);
  }
  .testi-arrow { position: static; width: 42px; height: 42px; background: var(--bh-white); border: 1px solid #E5E5F0; color: var(--bh-accent); font-size: 18px; }
  .testi-arrow .arrow-glyph-desktop { display: none; }
  .testi-arrow .arrow-glyph-mobile { display: inline; }
  .testi-carousel .bh-car-controls { margin-top: 0; }
}

/* ---------- FAQ ---------- */
.faq-list { max-width: 1000px; margin: var(--bh-space-32) auto 0; }
.faq .bh-acc-item { border-color: #E5E8EE; }
.faq .bh-acc-item + .bh-acc-item { margin-top: 14px; }
.faq .bh-acc-item.is-open { border-color: #E5E8EE; box-shadow: var(--bh-shadow-card); }
.faq .bh-acc-toggle { padding: var(--bh-space-20) var(--bh-space-24) var(--bh-space-20) 28px; }
.faq .bh-acc-glyph {
  width: 30px; height: 30px; background: transparent; font-size: 0;
}
.faq .bh-acc-glyph::before { content: '+'; font-size: 18px; }
.faq .bh-acc-item.is-open .bh-acc-glyph { background: var(--bh-accent); color: var(--bh-white); transform: none; }
.faq .bh-acc-item.is-open .bh-acc-glyph::before { content: '−'; }
.faq .bh-acc-body > * { padding: 0 60px var(--bh-space-24) 28px; font-size: var(--bh-fs-body); line-height: 1.45; }
@media (max-width: 767px) {
  .faq-list { margin-top: var(--bh-space-16); }
  .faq .bh-acc-item + .bh-acc-item { margin-top: var(--bh-space-16); }
  .faq .bh-acc-toggle { padding: var(--bh-space-16) var(--bh-space-16) var(--bh-space-16) var(--bh-space-20); font-size: 16px; }
  .faq .bh-acc-glyph { width: 26px; height: 26px; }
  .faq .bh-acc-body > * { padding: 0 var(--bh-space-20) var(--bh-space-20); font-size: 16px; }
}

/* ---------- CTA banner ---------- */
.cta-banner {
  position: relative; overflow: hidden; border-radius: var(--bh-r-16);
  min-height: 560px;
  background: linear-gradient(90deg, #053A2D 0%, #0A6952 50%, var(--bh-green) 100%);
  box-shadow: var(--bh-shadow-lift);
  display: flex; align-items: center;
}
.cta-copy { position: relative; z-index: 1; max-width: 700px; padding: var(--bh-space-60) 72px; }
.cta-h { font-size: 52px; letter-spacing: -1px; line-height: 1.02; color: var(--bh-white); }
.cta-body { font-size: 20px; line-height: 1.46; color: var(--bh-white-85); max-width: 520px; margin-top: var(--bh-space-24); }
.cta-btn { background: var(--bh-white); color: var(--bh-accent); margin-top: var(--bh-space-24); min-width: 169px; height: 60px; font-size: 18px; }
.cta-photo { position: absolute; right: 0; top: 0; height: 100%; }
.cta-photo img { height: 100%; width: auto; object-fit: cover; }
@media (max-width: 1023px) {
  .cta-banner {
    min-height: 400px; border-radius: var(--bh-r-16);
    background: linear-gradient(131.2deg, #053A2D 0%, #0A6952 50%, var(--bh-green) 100%);
    align-items: flex-start;
  }
  .cta-copy { padding: var(--bh-space-40) var(--bh-space-24); }
  .cta-h { font-size: 30px; letter-spacing: -0.5px; line-height: 1.04; }
  .cta-body { font-size: 16px; color: var(--bh-white); margin-top: var(--bh-space-16); }
  .cta-btn { margin-top: var(--bh-space-16); min-width: 143px; height: 46px; font-size: 15px; }
  .cta-photo { top: auto; bottom: 0; height: 218px; }
  .cta-photo img { height: 218px; width: 215px; object-fit: contain; object-position: bottom right; }
}

/* ---------- Footer page-level tweaks (copied from home) ---------- */
.bh-footer-tagline { font-size: var(--bh-fs-body-sm); color: rgba(244,242,248,0.75); }
.bh-footer-social { display: flex; gap: var(--bh-space-16); align-items: flex-end; margin-top: var(--bh-space-8); }
/* social glyph art has differing heights — normalise so baselines align (review A6) */
.bh-footer-social a { display: inline-flex; align-items: flex-end; }
/* keep each glyph at its designed size; only align their baselines (review A6) */
.bh-footer-social img { display: block; }
/* the narrow "f" makes the f→YouTube gap read wider than in→f even at equal
   spacing, so YouTube is pulled in optically (review A6) */
.bh-footer-social a:last-child { margin-left: -5px; }
.bh-footer-brand { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.bh-footer-form { display: flex; gap: var(--bh-space-8); align-items: flex-start; flex-wrap: wrap; }
.bh-footer-form .bh-field { width: 220px; }
.bh-footer-input { width: 100%; height: 44px; padding-block: 0; border-radius: var(--bh-r-8); font-size: 13px; }
.bh-footer-signup { height: 44px; min-width: 120px; padding: 0 var(--bh-space-24); border-radius: var(--bh-r-8); font-size: 13px; }
.bh-footer-legal { display: flex; gap: var(--bh-space-30); }
@media (max-width: 767px) {
  .bh-footer-form { width: 100%; }
  .bh-footer-form .bh-field { width: 100%; }
  .bh-footer-input { width: 100%; height: 46px; }
  .bh-footer-signup { width: 100%; height: 46px; }
  .bh-footer-tagline { font-size: 16px; }
  .bh-footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- LF-only: hero line break (desktop 2 lines, mobile 1) ---------- */
@media (max-width: 767px) { .hero-br { display: none; } }

/* THE BIGGER PICTURE: the card for the page you are already on was replaced by its parent
   plan. Filled accent pill so it reads as the plan, not another INCLUDED tool. */
.tool-pill--plan { background: var(--bh-accent); color: var(--bh-white); border: 1.5px solid var(--bh-accent); }

/* === CTA banner - width-proof geometry (2026-08-26, W01) ===
   Same root cause as the other pages, but here .cta-photo is a WRAPPER around the
   img, so the cap goes on the wrapper and the img fills it. */
.cta-copy  { max-width: min(700px, 54%); }
.cta-photo { max-width: 44%; overflow: hidden; }
.cta-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center right; }
@media (max-width: 1023px) {
  .cta-copy  { max-width: 100%; }
  .cta-photo { width: 61.4%; max-width: 215px; height: auto; }
  .cta-photo img { width: 100%; height: auto; object-fit: contain; object-position: bottom right; }
}
@media (min-width: 700px) and (max-width: 1023px) {
  .cta-copy { max-width: 62%; }
}

/* === logo strip - width-proof grid (2026-08-26, W02) ===
   `repeat(6, 1fr)` cannot shrink: a 1fr track has an implicit min-width:auto, so
   six 140px logos hold the row at ~840px and it overflows a 720px container at 768.
   minmax(0, 1fr) allows the track to shrink; the 768-1023 rule gives the tablet
   band its own 5-up layout instead of inheriting the desktop 6-up. */
.trust-grid, .trusted-grid, ul.trust-logos {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.trust-chip img, .trusted-tile img, .trusted-chip img { max-width: 100%; }
@media (min-width: 768px) and (max-width: 1023px) {
  .trust-grid, .trusted-grid, ul.trust-logos {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
  }
  .trust-chip, .trusted-tile, .trusted-chip { height: 68px; }
  .trust-chip img, .trusted-tile img, .trusted-chip img { max-width: 92px; max-height: 34px; }
}

/* === logo rows - contain, centred, optically even (2026-08-26) ===
   A grid cannot centre a short final row - the tracks are fixed, so the leftover
   logos range left. Flex-wrap with the same per-item basis keeps full rows identical
   and centres whatever is left over. */
.trust-grid, .trusted-grid, ul.trust-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.trust-grid > *, .trusted-grid > *, ul.trust-logos > * {
  flex: 0 1 calc((100% - 5 * var(--bh-space-16)) / 6);
  min-width: 0;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .trust-grid > *, .trusted-grid > *, ul.trust-logos > * {
    flex: 0 1 calc((100% - 4 * 12px) / 5);
  }
}
@media (max-width: 767px) {
  .trust-grid > *, .trusted-grid > *, ul.trust-logos > * {
    flex: 0 1 calc((100% - 2 * 10px) / 3);
  }
}