/* Gesundheitsparadies 271 – feinere Filterrhythmen + logischere Hero-Überblendung.
   Ziel: engere, professionellere Filterzeilen und eine Bildverschmelzung,
   die an der echten Textkante beginnt und den rechten Bildbereich samt Zitat schont. */

:root{
  --gp271-filter-line:#d9e5de;
  --gp271-filter-ink:#324d41;
  --gp271-filter-muted:#677a70;
  --gp271-filter-hover:#f4faf6;
  --gp271-filter-row:2.25rem;
}

/* ===== FILTER: gleiche Prinzipien für Gesundheitsprodukte + Gesundheitswissen ===== */
.gp-product-archive .gp-directory-filter-scrollbody,
.gp-knowledge-archive .gp-knowledge-filter-scrollbody{
  padding-top:.12rem;
}

.gp-product-archive .gp-directory-filter-group summary,
.gp-knowledge-archive .gp-knowledge-filter-group summary{
  min-height:2.55rem;
  padding:.02rem .08rem;
  font-size:.84rem;
}

.gp-product-archive .gp-directory-filter-options,
.gp-knowledge-archive .gp-knowledge-filter-options{
  padding:.02rem 0 .42rem;
}

.gp-product-archive .gp-directory-option-search,
.gp-knowledge-archive .gp-knowledge-option-search{
  min-height:2.45rem;
  margin:0 0 .18rem;
  border-color:var(--gp271-filter-line);
}

.gp-product-archive .gp-directory-option-search input,
.gp-knowledge-archive .gp-knowledge-option-search input{
  height:2.4rem;
  font-size:.75rem;
}

.gp-product-archive .gp-directory-option-scroll,
.gp-knowledge-archive .gp-knowledge-filter-options{
  display:grid;
  gap:0;
  align-content:start;
}

.gp-product-archive .gp-directory-check,
.gp-knowledge-archive .gp-knowledge-filter-option{
  box-sizing:border-box;
  display:grid;
  grid-template-columns:18px minmax(0,1fr) minmax(16px,auto);
  align-items:center;
  column-gap:8px;
  min-height:var(--gp271-filter-row);
  margin:0;
  padding:3px 4px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--gp271-filter-ink);
  font-size:.81rem;
  line-height:1.24;
}

.gp-product-archive .gp-directory-check + .gp-directory-check,
.gp-knowledge-archive .gp-knowledge-filter-option + .gp-knowledge-filter-option{
  margin-top:0;
}

.gp-product-archive .gp-directory-check:hover,
.gp-knowledge-archive .gp-knowledge-filter-option:hover{
  background:var(--gp271-filter-hover);
}

.gp-product-archive .gp-directory-check-box,
.gp-knowledge-archive .gp-knowledge-check{
  width:18px;
  height:18px;
  margin:0;
  align-self:center;
}

.gp-product-archive .gp-directory-check-name,
.gp-knowledge-archive .gp-knowledge-option-label{
  min-width:0;
  margin:0;
  color:var(--gp271-filter-ink);
  line-height:1.24;
  text-wrap:pretty;
  hyphens:auto;
}

.gp-product-archive .gp-directory-check-count,
.gp-knowledge-archive .gp-knowledge-option-count{
  min-width:16px;
  margin:0;
  padding:0;
  justify-self:end;
  color:var(--gp271-filter-muted);
  font-size:.72rem;
  line-height:1;
  text-align:right;
  font-variant-numeric:tabular-nums;
}

/* Desktop sidebars: innen etwas ruhiger, aber nicht wuchtig. */
@media (min-width:64.01rem){
  .gp-product-archive .gp-directory-sidebar,
  .gp-knowledge-archive .gp-knowledge-sidebar{
    padding:.95rem .95rem 1rem;
  }
}

/* ===== HERO-VERSCHMELZUNG: sauber vor der Textkante, rechter Bildraum bleibt frei ===== */
.gp-product-archive .gp-product-catalog-hero{
  --gp-hero-base:#f7f8f0;
  --gp-hero-fade-from:36%;
  --gp-hero-fade-to:55%;
  --gp-hero-image-pos:80% center;
}

.gp-product-archive .gp-product-catalog-hero__inner::before{
  background:linear-gradient(90deg,
    var(--gp-hero-base) 0%,
    var(--gp-hero-base) var(--gp-hero-fade-from),
    rgba(247,248,240,.94) calc(var(--gp-hero-fade-from) + 3%),
    rgba(247,248,240,.72) calc(var(--gp-hero-fade-from) + 9%),
    transparent var(--gp-hero-fade-to));
}

.gp-product-archive .gp-product-catalog-hero__media{
  width:69%;
}

.gp-product-archive .gp-product-catalog-hero__media img,
.gp-product-archive .gp-product-catalog-hero__media picture img,
.gp-product-archive .gp-product-catalog-hero__image{
  object-position:var(--gp-hero-image-pos) !important;
}

/* Die Textspalte bleibt bewusst schmal genug, damit die Überblendung dort beginnt,
   wo Inhalt endet – nicht erst nach den unteren Links. */
.gp-product-archive .gp-product-catalog-hero__copy{
  width:min(51%,48rem);
  max-width:min(51%,48rem);
}
.gp-product-archive .gp-product-catalog-hero__copy p{
  max-width:31rem;
}
.gp-product-archive .gp-product-catalog-hero__links{
  max-width:28rem;
}

/* Auf anderen geteilten Bereichen derselbe ruhige Übergangs-Grundsatz. */
@media (min-width:64.0625rem){
  .gp-knowledge-hero{
    --gp271-knowledge-base:#f2f8f8;
    background:var(--gp271-knowledge-base);
  }
  .gp-knowledge-hero .gp-knowledge-hero__media::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,
      var(--gp271-knowledge-base) 0%,
      var(--gp271-knowledge-base) 36%,
      rgba(242,248,248,.92) 43%,
      rgba(242,248,248,.68) 49%,
      transparent 56%);
    pointer-events:none;
  }
  .gp-core-hero.gp-core-hero--with-media{
    --gp271-core-base:#f9fcfb;
    background:var(--gp271-core-base);
  }
  .gp-core-hero.gp-core-hero--with-media .gp-core-hero__media::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,
      var(--gp271-core-base) 0%,
      var(--gp271-core-base) 36%,
      rgba(249,252,251,.92) 43%,
      rgba(249,252,251,.68) 49%,
      transparent 56%);
    pointer-events:none;
  }
}

@media (max-width:64rem){
  .gp-product-archive .gp-product-catalog-hero__copy{
    width:100%;
    max-width:none;
  }
}