/* ==========================================================================
   US readability layer
   Loaded AFTER stencil.css. Raises the type scale and opens up leading to
   match US B2B SaaS conventions (Zoom / Webex):
     - body copy ~18px @ 1.65 line-height
     - lead / subhead paragraphs 21px
     - no body text below 15px
     - constrained measure (~72ch) for comfortable reading
   Does not touch layout, colors or structure.
   ========================================================================== */

/* --- Base rhythm ------------------------------------------------------- */
.vsp-page{
  font-size:18px;
  line-height:1.65;
  letter-spacing:-0.003em;
}

/* Default body copy */
.vsp-page p,
.vsp-page li,
.vsp-page label,
.vsp-page td,
.vsp-page th{
  font-size:18px;
  line-height:1.65;
}

/* --- Headings ---------------------------------------------------------- */
.vsp-page h1,
.vsp-page h2,
.vsp-page h3,
.vsp-page h4,
.vsp-page h5{
  line-height:1.2;
  letter-spacing:-0.022em;
}

/* Section lead-in paragraphs: larger, tighter measure */
.vsp-page .section-desc,
.vsp-page .sol-hero .section-desc{
  font-size:21px;
  line-height:1.6;
  max-width:74ch;
}

/* --- Hero -------------------------------------------------------------- */
.vsp-page .hero-tag{
  font-size:15px;
  letter-spacing:.06em;
}

/* Longer eyebrow label: keep the dot from squashing and let text wrap on narrow screens */
.vsp-page .hero-tag{
  flex-wrap:wrap;
  max-width:100%;
  text-align:left;
}
.vsp-page .hero-tag .hero-tag-dot{
  flex:0 0 auto;
}

.vsp-page .hero-role span,
.vsp-page .hero-role{
  font-size:18px;
  line-height:1.55;
}

.vsp-page .hero-stats .hero-stat-num{
  font-size:26px;
}
.vsp-page .hero-stat-label{
  font-size:15px;
  line-height:1.45;
}

/* --- Eyebrow / all-caps labels ----------------------------------------- */
.vsp-page .section-eyebrow{
  font-size:15px;
  letter-spacing:.14em;
  font-weight:600;
}

/* Long all-caps labels need extra tracking to stay readable */
.vsp-page .mgr-image-caption,
.vsp-page .sol-col-sub,
.vsp-page .stencil-eyebrow-caps{
  letter-spacing:.04em;
}

/* --- Cards, lists, metrics --------------------------------------------- */
.vsp-page .pain-desc,
.vsp-page .sol-card-body p,
.vsp-page .feature-list-item,
.vsp-page .review-item-text,
.vsp-page .func-img-point{
  font-size:17px;
  line-height:1.6;
}

.vsp-page .mgr-issue p,
.vsp-page .mgr-issue span{
  font-size:17px;
  line-height:1.6;
}

.vsp-page .pain-metric-num,
.vsp-page .pain-metric-label{
  font-size:15px;
}

/* Large stat numbers benefit from tighter tracking */
.vsp-page .pain-card-stat,
.vsp-page .manager-stat-num,
.vsp-page .mgr-issue-head + div span{
  letter-spacing:-0.02em;
}

/* Customer name plates: longer names (e.g. PEPPERL+FUCHS) must never clip
   inside the fixed-height, overflow:hidden logo band. */
.vsp-page .case-card-img{
  padding:0 14px;
}
.vsp-page .case-card-logo{
  max-width:100%;
  text-align:center;
  line-height:1.2;
  overflow-wrap:break-word;
  font-size:clamp(19px,min(2.6vw,2.6cqw),28px);
}

/* --- Buttons & CTAs ---------------------------------------------------- */
.vsp-page .btn-primary,
.vsp-page .cta-btn,
.vsp-page .button--moema{
  font-size:18px;
  letter-spacing:.01em;
}

/* --- Form inputs ------------------------------------------------------- */
.vsp-page input,
.vsp-page textarea,
.vsp-page select{
  font-size:18px;
  line-height:1.5;
}

.vsp-page ::placeholder{
  font-size:17px;
  opacity:.62;
}

/* --- FAQ --------------------------------------------------------------- */
.vsp-page .faq-question span{
  font-size:19px;
  line-height:1.45;
}
.vsp-page .faq-answer{
  font-size:18px;
  line-height:1.7;
  max-width:74ch;
}

/* --- Tablet / phone ---------------------------------------------------- */
@media (max-width:900px){
  .vsp-page{font-size:17px}
  .vsp-page p,
  .vsp-page li,
  .vsp-page td{font-size:17px}
  .vsp-page .section-desc{font-size:19px}
  .vsp-page .faq-question span{font-size:18px}
}

@media (max-width:560px){
  .vsp-page{font-size:16px}
  .vsp-page p,
  .vsp-page li,
  .vsp-page td{font-size:16px;line-height:1.6}
  .vsp-page .section-desc{font-size:18px}
  .vsp-page .pain-desc,
  .vsp-page .sol-card-body p,
  .vsp-page .mgr-issue p,
  .vsp-page .mgr-issue span{font-size:16px}
}