/* Approved Consumer Insights visual refinement, synced from V1.
   Page-scoped content styles only; formal Banner and shared shell are unchanged.
   KEY CHALLENGES is supplied by key-challenges-refinement.css. */

/* 03 · The first pause: a full-width cool white field, without card wrappers. */
.wy-consumer-insights #value{
  background:var(--wy-g25);
  padding-block:var(--wy-s9);
}
.wy-consumer-insights #value .ci-values>article{border-top:0;padding-top:0}
.wy-consumer-insights #value .ci-values .h3{margin-block:var(--wy-s6) var(--wy-s4)}

/* 04 · Preserve the alternating 5 + 1 + 6 grid and every 16:10 media frame. */
.wy-consumer-insights #services{
  background:var(--wy-g0);
  padding-block:var(--wy-s9) var(--wy-s10);
}
.wy-consumer-insights #services .sec-head{margin-bottom:var(--wy-s9)}
.wy-consumer-insights .ci-features{gap:var(--wy-s9)}
/* A small pause between the two pairs gives the long section a readable beat. */
.wy-consumer-insights .ci-feature:nth-child(3){margin-block-start:var(--wy-s5)}
.wy-consumer-insights .ci-feature__media{
  border:1px solid color-mix(in srgb,var(--wy-primary) 8%,var(--wy-g0));
  border-radius:var(--wy-r-2xl);
  background:
    radial-gradient(100% 110% at 8% 0%,color-mix(in srgb,var(--wy-g0) 90%,transparent),transparent 68%),
    linear-gradient(145deg,
      color-mix(in srgb,var(--wy-primary-subtle) 64%,var(--wy-g0)),
      color-mix(in srgb,var(--wy-blue-subtle) 72%,var(--wy-g0)));
  box-shadow:inset 0 1px 0 var(--wy-g0);
}
.wy-consumer-insights .ci-placeholder>figcaption{gap:var(--wy-s3)}
.wy-consumer-insights .ci-placeholder__title{color:var(--wy-g700)}

/* 05 · A diffuse brand field with white endpoints; no extra graphical layers. */
.wy-consumer-insights #whyg{
  padding-block:var(--wy-s10);
  background-color:var(--wy-g0);
  background-image:
    linear-gradient(180deg,var(--wy-g0),transparent 16%,transparent 84%,var(--wy-g0)),
    radial-gradient(ellipse 80% 120% at 12% 45%,
      color-mix(in srgb,var(--wy-primary-subtle) 72%,transparent),transparent 78%),
    radial-gradient(ellipse 85% 130% at 92% 58%,
      color-mix(in srgb,var(--wy-blue-subtle) 66%,transparent),transparent 80%);
}
.wy-consumer-insights #whyg .ci-reasons{gap:var(--wy-s7)}
.wy-consumer-insights #whyg .ci-reasons>article{align-items:start}
.wy-consumer-insights #whyg .ci-reasons .ci-line-icon{margin-top:var(--wy-s1)}
.wy-consumer-insights #whyg .ci-reasons .body{margin-top:var(--wy-s4)}

/* 06 · Quiet reading before the existing uninterrupted CTA/footer gradient. */
.wy-consumer-insights #faq{
  background:var(--wy-g0);
  padding-block:var(--wy-s9) var(--wy-s10);
}
.wy-consumer-insights #faq .sec-head{margin-bottom:var(--wy-s8)}
.wy-consumer-insights #faq .faq__item{
  border-bottom-color:color-mix(in srgb,var(--wy-g100) 72%,var(--wy-g0));
}
.wy-consumer-insights #faq .faq__icon{
  background:var(--wy-g25);color:var(--wy-g600);
}
.wy-consumer-insights #faq .faq__item[open] .faq__icon,
.wy-consumer-insights #faq .faq__q:is(:hover,:focus-visible) .faq__icon{
  background:var(--wy-primary-subtle);color:var(--wy-primary);
}
.wy-consumer-insights #faq .faq__a{padding-bottom:var(--wy-s7)}

/* Existing tablet/mobile thresholds only; no token or responsive-system edits. */
@media(max-width:1199px){
  .wy-consumer-insights :is(#value,#whyg){padding-block:var(--wy-s8)}
  .wy-consumer-insights #services{padding-block:var(--wy-s8) var(--wy-s9)}
  .wy-consumer-insights #services .sec-head{margin-bottom:var(--wy-gap-head)}
  .wy-consumer-insights .ci-features{gap:var(--wy-s8)}
  .wy-consumer-insights #faq{padding-block:var(--wy-s8) var(--wy-s9)}
}
@media(max-width:767px){
  html body.wy-consumer-insights #value,
  html body.wy-consumer-insights #whyg{padding-block:var(--wy-s8)!important}
  html body.wy-consumer-insights #faq{padding-bottom:var(--wy-s8)!important}
  .wy-consumer-insights #value .ci-values{gap:var(--wy-s7)}
  .wy-consumer-insights #value .ci-values .h3{margin-top:var(--wy-s5)}
  .wy-consumer-insights .ci-feature:nth-child(3){margin-block-start:var(--wy-s4)}
  .wy-consumer-insights #whyg .ci-reasons{gap:var(--wy-s6)}
  .wy-consumer-insights #faq .faq__a{padding-bottom:var(--wy-s6)}
}
