:root{
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font-display: "MuseoModerno", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";
  }
  html, body { font-family: var(--font-sans); }
  h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); letter-spacing: 0.01em; }
  
  
  @media (max-width: 768px){
     
    .praxis-hero .h1 {
      font-size: clamp(2.1rem, 4.8vw, 3.2rem);
      line-height: 1.05;
    }
    
     .h2 {
       font-size: clamp(1.4rem, 3.2vw, 2.13rem);
      line-height: 0.9;
    }

}

/* ===== G5 Pill Mehr-Link ===== */
.mehr-pill{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.55rem 1rem;
  border-radius:999px;
  font-weight:700;
  background:rgb(22,160,216);
  color:white;
  margin-top: 10px;
}

.mehr-pill .badge{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,0.18);
  color:white;
  font-size:20px;
}

/* remove grey button borders */
button, a.button, .mehr-link {border:none !important; outline:none !important;}
button:focus, a:focus {outline:none !important; box-shadow:none !important;}


/* G5 fix: therapy buttons stay clickable but no native grey background */
.therapy-body > button {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 10px 0 0 !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  display: inline-block !important;
}

.therapy-body > button .mehr-pill {
  margin-top: 0 !important;
}