/* HairSense fixes overlay (v99001) — added during review pass */
/* Anchor offset so deep-links don't hide under the sticky header */
[id]{ scroll-margin-top: 96px; }
/* Footer links must stay visible at every viewport width (resize/hover bug) */
.site-footer a{ opacity:1 !important; visibility:visible !important; }
/* Stronger visual hierarchy on service/info cards */
.service-card h3, .clean-block h3{ font-size: clamp(1.2rem, 1.05rem + .5vw, 1.5rem); font-weight:700; line-height:1.25; }
/* Primary CTAs: solid + comfortable tap target (mobile) */
.btn.btn-primary{ min-height:48px; display:inline-flex; align-items:center; justify-content:center; }

/* Fasermerkmale: text block matches image height on desktop, stacks on mobile */
@media (min-width: 761px){
  .knowledge-morphology-layout{ align-items: stretch !important; }
  .knowledge-morphology-layout .morphology-info-box{
    align-self: stretch !important;
    display:flex; flex-direction:column; justify-content:center;
  }
}

/* Sticky CTA (mobile only): full-width bottom bar, flush to the screen edges */
.hs-sticky-cta{
  position:fixed !important; left:0; right:0; bottom:0; z-index:1200;
  width:100%; margin:0 !important; border-radius:0 !important;
  text-align:center; justify-content:center;
  padding:16px 20px calc(16px + env(safe-area-inset-bottom, 0px));
  box-shadow:0 -4px 16px rgba(0,0,0,.18);
  transform:translateY(140%); transition:transform .3s ease;
}
.hs-sticky-cta.show{ transform:translateY(0); }
@media (min-width:761px){ .hs-sticky-cta{ display:none !important; } }
body.hs-cta-pad{ padding-bottom:72px; }
@media (min-width:761px){ body.hs-cta-pad{ padding-bottom:0; } }

/* Morphology diagram: plain rectangle image (card already provides the rounded frame),
   vertically centered so top/bottom space is equal when the card stretches to text height */
.knowledge-morphology-layout .knowledge-morphology-diagram{
  display:flex; align-items:center; justify-content:center;
  padding: clamp(16px, 2vw, 28px);
}
.knowledge-morphology-diagram img{
  border:0 !important; border-radius:0 !important; box-shadow:none !important;
  background:transparent !important; width:100% !important; height:auto !important;
}

/* --- Header over the video hero: force legible white on ALL elements (robust against overrides) --- */
.site-header.over-video .brand,
.site-header.over-video .nav-links a,
.site-header.over-video .nav-cta a.btn,
.site-header.over-video .nav-cta a.btn span,
.site-header.over-video .btn-ghost,
.site-header.over-video .btn-small,
.site-header.over-video [data-lang-switch] a,
.site-header.over-video [data-lang-switch] span,
.site-header.over-video [data-lang-switch] button{ color:#fff !important; }
.site-header.over-video .nav-cta a.btn,
.site-header.over-video .btn-ghost,
.site-header.over-video [data-lang-switch] a,
.site-header.over-video [data-lang-switch] button{ border-color:rgba(255,255,255,0.7) !important; }
/* Nav underline (active + hover) white over the hero — never blue */
.site-header.over-video .nav-links a.active::after,
.site-header.over-video .nav-links a:hover::after{ background:#fff !important; }
.site-header.over-video .nav-links a:hover{ color:#fff !important; text-decoration:none !important; }

/* Overview strip image: hide it entirely in collapsed/handy view (nav hamburger, <=1220px);
   it stays on desktop. Avoids the oversized editorial photo on phones/tablets. */
@media (max-width: 1220px){
  .two-col-image:has(> img[src*="strip-textile"]){ display:none !important; }
  img[src*="strip-textile"]{ display:none !important; }
}