/* Pneumologie hero refinement — intentionally scoped to this page only. */

/* Match the Pneumologie hero title to the visual scale used by the index hero. */
html body.pneumologie-page .pnh .pnh-title{
  font-size:var(--kls-h1) !important;
  line-height:1.04 !important;
  letter-spacing:-.5px !important;
  font-weight:400 !important;
}

/* Match the index-page hero CTA: same shape, colour, type scale and spacing.
   The CTA is deliberately text-only (no calendar/arrow artwork). */
html body.pneumologie-page .pnh .pnh-btn{
  width:auto !important;
  max-width:100% !important;
  min-height:0 !important;
  height:clamp(40px,3.26vw,54px) !important;
  padding:0 clamp(18px,1.67vw,30px) !important;
  border-radius:clamp(8px,.69vw,13px) !important;
  background:#4E7654 !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  gap:0 !important;
  font-family:'Jost',sans-serif !important;
  font-weight:500 !important;
  font-size:clamp(11px,.903vw,15px) !important;
  letter-spacing:clamp(1.1px,.097vw,1.7px) !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}
html body.pneumologie-page .pnh .pnh-btn:hover{
  background:#41654a !important;
  transform:translateY(-2px) !important;
  box-shadow:none !important;
}

/* Four hero benefits: equal icon scale, slightly larger than before,
   tighter/equal horizontal spacing and exact centering over each label. */
html body.pneumologie-page .pnh .pnh-feats{
  grid-template-columns:repeat(4,112px) !important;
  column-gap:12px !important;
  row-gap:18px !important;
  width:auto !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:center !important;
  align-items:start !important;
}
html body.pneumologie-page .pnh .pnh-f{
  width:112px !important;
  max-width:112px !important;
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  text-align:center !important;
}
html body.pneumologie-page .pnh .pnh-f img{
  width:56px !important;
  height:56px !important;
  flex:0 0 56px !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 0 12px !important;
  display:block !important;
}
html body.pneumologie-page .pnh .pnh-f span{
  width:100% !important;
  text-align:center !important;
}

/* Tablet: keep all four benefits in one compact, evenly spaced row when possible. */
@media (min-width:768px) and (max-width:1199.98px){
  html body.pneumologie-page .pnh .pnh-feats{
    grid-template-columns:repeat(4,minmax(96px,108px)) !important;
    column-gap:10px !important;
    width:auto !important;
    max-width:100% !important;
  }
  html body.pneumologie-page .pnh .pnh-f{
    width:108px !important;
    max-width:108px !important;
    font-size:13px !important;
  }
  html body.pneumologie-page .pnh .pnh-f img{
    width:54px !important;
    height:54px !important;
    flex-basis:54px !important;
  }
}

/* Mobile: intentional 2 × 2 layout with equal columns and touch-safe CTA. */
@media (max-width:767.98px){
  html body.pneumologie-page .pnh .pnh-title{
    font-size:clamp(28px,7vw,40px) !important;
    line-height:1.08 !important;
  }
  html body.pneumologie-page .pnh .pnh-btn{
    width:100% !important;
    max-width:360px !important;
    min-height:44px !important;
    height:auto !important;
    padding:12px 20px !important;
    white-space:normal !important;
    text-align:center !important;
  }
  html body.pneumologie-page .pnh .pnh-feats{
    grid-template-columns:repeat(2,112px) !important;
    gap:20px 14px !important;
    width:auto !important;
    max-width:100% !important;
  }
  html body.pneumologie-page .pnh .pnh-f{
    width:112px !important;
    max-width:112px !important;
    font-size:13px !important;
  }
  html body.pneumologie-page .pnh .pnh-f img{
    width:52px !important;
    height:52px !important;
    flex-basis:52px !important;
    margin-bottom:10px !important;
  }
}

@media (max-width:359.98px){
  html body.pneumologie-page .pnh .pnh-feats{
    grid-template-columns:repeat(2,minmax(0,104px)) !important;
    gap:18px 10px !important;
  }
  html body.pneumologie-page .pnh .pnh-f{
    width:104px !important;
    max-width:104px !important;
  }
}
