/* Gesundheitsparadies – editorial article system
 * One responsive source of truth for article pages.
 */

.gp-single-main{
  width:min(100%,var(--gp-shell));
  margin-inline:auto;
  padding:clamp(.9rem,2.2vw,1.6rem) var(--gp-gutter) var(--gp-section-space);
}

.gp-knowledge-article{width:100%;min-width:0}

.gp-article-hero{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(20rem,.9fr);
  gap:clamp(1.75rem,4.2vw,4.5rem);
  align-items:center;
  overflow:hidden;
  padding:clamp(1.75rem,3.8vw,3.75rem);
  border:1px solid color-mix(in srgb,var(--gp-brand) 10%,var(--gp-line));
  border-radius:clamp(1.35rem,2vw,1.85rem);
  background:linear-gradient(135deg,#FFFEFB 0%,#F8FBF8 58%,#EEF6F1 100%);
  box-shadow:0 1rem 3rem rgba(29,52,69,.065);
}

.gp-article-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:min(30rem,42vw);
  aspect-ratio:1.9;
  left:-5rem;
  bottom:-5rem;
  background:url("motifs/editorial-branch.svg") center/contain no-repeat;
  opacity:.1;
  pointer-events:none;
}

.gp-article-hero-copy{min-width:0;max-width:48rem}

.gp-article-topic-chip{
  display:inline-flex;
  align-items:center;
  min-height:2.25rem;
  margin-bottom:clamp(.9rem,1.6vw,1.2rem);
  padding:.45rem .8rem;
  border:1px solid color-mix(in srgb,var(--gp-brand) 22%,var(--gp-line));
  border-radius:999rem;
  background:var(--gp-brand-soft);
  color:var(--gp-brand-dark);
  font-size:.78rem;
  font-weight:800;
  line-height:1.2;
  text-decoration:none;
}

a.gp-article-topic-chip:hover{border-color:color-mix(in srgb,var(--gp-brand) 42%,var(--gp-line));background:#fff}

a.gp-article-topic-chip:focus-visible{outline:var(--gp-focus);outline-offset:.2rem}

.gp-article-title{
  max-width:18ch;
  margin:0;
  color:var(--gp-ink);
  font-family:var(--gp-display);
  font-size:clamp(2.2rem,3.2vw,3.85rem);
  font-weight:650;
  letter-spacing:-.045em;
  line-height:1.02;
  text-wrap:balance;
}

.gp-article-lead{
  max-width:66ch;
  margin:clamp(1rem,2vw,1.35rem) 0 0;
  color:var(--gp-text);
  font-size:clamp(1rem,1.35vw,1.12rem);
  line-height:1.68;
  text-wrap:pretty;
}

.gp-article-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem 1rem;
  margin-top:1.15rem;
  color:var(--gp-muted);
  font-size:.78rem;
  line-height:1.55;
}

.gp-article-meta strong{color:var(--gp-text);font-weight:750}
.gp-article-header-actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.15rem}
.gp-article-header-actions a,.gp-article-header-actions button{min-height:2.75rem}

.gp-article-hero-media{
  position:relative;
  min-width:0;
  margin:0;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--gp-line) 82%,transparent);
  border-radius:clamp(1rem,1.6vw,1.4rem);
  background:var(--gp-brand-soft);
  box-shadow:0 1.1rem 2.8rem rgba(28,49,42,.085);
}

.gp-article-hero-image{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
}

.gp-article-hero-media figcaption{
  padding:.65rem .85rem;
  color:var(--gp-muted);
  font-size:.72rem;
  line-height:1.5;
}

.gp-article-hero-visual{
  position:relative;
  display:grid;
  place-items:center;
  min-height:20rem;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--gp-brand) 12%,var(--gp-line));
  border-radius:clamp(1rem,1.6vw,1.4rem);
  background:radial-gradient(circle at 60% 35%,#fff 0%,#F4F9F5 46%,#E8F2EC 100%);
}
.gp-article-hero-visual::before{content:"";position:absolute;inset:0;background:url("motifs/editorial-branch.svg") 70% 74%/88% auto no-repeat;opacity:.22}
.gp-article-hero-visual::after{content:"Wissen, das einordnet";position:relative;max-width:10ch;color:#537463;font-family:var(--gp-display);font-size:clamp(1.5rem,2.6vw,2.25rem);font-style:italic;line-height:1.08;text-align:center}

.gp-article-trustbar{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:clamp(.85rem,1.7vw,1.25rem) 0 0;
  padding:.75rem .9rem;
  border:1px solid var(--gp-line);
  border-radius:var(--gp-radius-lg);
  background:#fff;
  box-shadow:var(--gp-shadow-xs);
}
.gp-article-trustbar>div{display:grid;grid-template-columns:2.5rem minmax(0,1fr);column-gap:.7rem;align-items:center;padding:.5rem .9rem}
.gp-article-trustbar>div+div{border-left:1px solid var(--gp-line-soft)}
.gp-article-trustbar>div>span{grid-row:1/3;display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:#EEF6F0;color:#5E8D70}
.gp-article-trustbar svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8}
.gp-article-trustbar strong{align-self:end;color:var(--gp-ink);font-size:.82rem;line-height:1.3}
.gp-article-trustbar small{align-self:start;margin-top:.1rem;color:var(--gp-muted);font-size:.69rem;line-height:1.4}

.gp-article-summary{
  max-width:58rem;
  margin:clamp(1.15rem,2.6vw,1.85rem) auto 0;
  padding:clamp(1.2rem,2.5vw,1.7rem);
  border:1px solid #D7E5DB;
  border-radius:var(--gp-radius-lg);
  background:linear-gradient(135deg,#F8FCF8,#EEF7F1);
  box-shadow:0 .55rem 1.6rem rgba(31,54,47,.035);
}

.gp-article-summary h2{
  margin:.25rem 0 .5rem;
  color:var(--gp-ink);
  font-family:var(--gp-display);
  font-size:clamp(1.1rem,1.5vw,1.3rem);
  line-height:1.25;
  text-wrap:balance;
}

.gp-article-summary p{max-width:72ch;margin:0;color:var(--gp-text);font-size:.96rem;line-height:1.7;text-wrap:pretty}

.gp-article-mobile-toc{display:none}

.gp-article-layout{
  display:grid;
  grid-template-columns:minmax(0,48rem) minmax(13rem,17rem);
  justify-content:center;
  gap:clamp(2.25rem,5vw,5rem);
  margin-top:clamp(1.75rem,3.3vw,3rem);
}

.gp-article-column{min-width:0}

.gp-article-body{
  max-width:68ch;
  color:var(--gp-text);
  font-size:clamp(1rem,.97rem + .16vw,1.07rem);
  line-height:1.74;
}

.gp-article-body>*{max-width:100%}
.gp-article-body>*+*{margin-top:1.05em}
.gp-article-body p{margin-bottom:0;text-wrap:pretty}

.gp-article-body h2,
.gp-article-body h3,
.gp-article-body h4{
  color:var(--gp-ink);
  font-family:var(--gp-display);
  text-wrap:balance;
  scroll-margin-top:7rem;
}

.gp-article-body h2{
  margin-top:2.15em;
  margin-bottom:.58em;
  font-size:clamp(1.55rem,2.25vw,2rem);
  font-weight:850;
  letter-spacing:-.025em;
  line-height:1.17;
}

.gp-article-body h3{
  margin-top:1.65em;
  margin-bottom:.5em;
  font-size:clamp(1.22rem,1.65vw,1.45rem);
  font-weight:820;
  line-height:1.25;
}

.gp-article-body h4{margin-top:1.5em;margin-bottom:.45em;font-size:1.08rem;line-height:1.3}
.gp-article-body ul,.gp-article-body ol{padding-left:1.35rem}
.gp-article-body li+li{margin-top:.35em}
.gp-article-body a{color:var(--gp-brand-dark);font-weight:700;text-underline-offset:.16em}
.gp-article-body a:hover{text-decoration-thickness:.12em}
.gp-article-body a:focus-visible{outline:var(--gp-focus);outline-offset:.15rem;border-radius:.15rem}

.gp-article-body blockquote{
  margin:1.75em 0;
  padding:clamp(1rem,2.2vw,1.35rem) clamp(1.1rem,2.6vw,1.55rem);
  border-left:.22rem solid var(--gp-brand);
  border-radius:0 var(--gp-radius-sm) var(--gp-radius-sm) 0;
  background:linear-gradient(90deg,var(--gp-brand-soft),#fff);
  color:var(--gp-text);
}

.gp-article-body blockquote>*:first-child{margin-top:0}
.gp-article-body blockquote>*:last-child{margin-bottom:0}

.gp-article-body img{height:auto;border-radius:var(--gp-radius-md)}
.gp-article-body figure{margin-inline:0}
.gp-article-body figcaption{margin-top:.55rem;color:var(--gp-muted);font-size:.78rem;line-height:1.5}

.gp-article-body table{
  display:block;
  width:max-content;
  max-width:100%;
  overflow-x:auto;
  border-collapse:collapse;
  -webkit-overflow-scrolling:touch;
}

.gp-article-body th,.gp-article-body td{padding:.7rem .8rem;border-bottom:1px solid var(--gp-line);text-align:left;vertical-align:top}
.gp-article-body th{color:var(--gp-ink);font-size:.9rem;font-weight:800;background:var(--gp-soft)}

.gp-article-sidebar{display:grid;align-content:start;gap:1rem;min-width:0}

.gp-article-toc,.gp-article-side-card{
  padding:1.1rem;
  border:1px solid var(--gp-line);
  border-radius:var(--gp-radius-md);
  background:#fff;
  box-shadow:0 .5rem 1.6rem rgba(31,54,47,.04);
}

.gp-article-toc{position:sticky;top:6.75rem;max-height:calc(100vh - 8rem);overflow:auto;scrollbar-width:thin}
.gp-article-toc-title,.gp-article-side-card h2{margin:0 0 .75rem;color:var(--gp-ink);font-family:var(--gp-display);font-size:.98rem;font-weight:820;line-height:1.3}
.gp-article-toc-list{display:grid;gap:.28rem;margin:0;padding:0;list-style:none;counter-reset:gp-toc}
.gp-article-toc-item{margin:0;color:var(--gp-muted);font-size:.78rem;line-height:1.42}
.gp-article-toc-item--h3{padding-left:.75rem}

.gp-article-toc-item a{
  display:block;
  padding:.38rem .45rem;
  border-radius:.45rem;
  color:var(--gp-text);
  text-decoration:none;
}
.gp-article-toc-item a:hover{background:var(--gp-brand-soft);color:var(--gp-brand-dark)}
.gp-article-toc-item a:focus-visible{outline:var(--gp-focus);outline-offset:.1rem}

.gp-article-side-card p{margin:0 0 .75rem;color:var(--gp-muted);font-size:.82rem;line-height:1.6}
.gp-article-side-card a{color:var(--gp-brand-dark);font-size:.8rem;font-weight:800;text-underline-offset:.15em}
.gp-article-side-card--soft{background:#fff}

.gp-article-extension{margin-top:clamp(2rem,4vw,3.25rem)}

.gp-article-source-basis,
.gp-article-recommendation,
.gp-article-sources,
.gp-article-update,
.gp-article-related,
.gp-article-newsletter{
  margin-top:clamp(1.85rem,3.5vw,3rem);
  padding-top:clamp(1.25rem,2.4vw,1.8rem);
  border-top:1px solid var(--gp-line);
}

.gp-article-source-basis h2,
.gp-article-recommendation h2,
.gp-article-sources h2,
.gp-article-update h2,
.gp-article-related h2,
.gp-article-newsletter h2{
  margin:.28rem 0 .75rem;
  color:var(--gp-ink);
  font-family:var(--gp-display);
  font-size:clamp(1.4rem,2vw,1.75rem);
  font-weight:850;
  letter-spacing:-.02em;
  line-height:1.2;
  text-wrap:balance;
}

.gp-article-source-basis>p,.gp-partner-disclosure{max-width:70ch;color:var(--gp-muted);font-size:.9rem;line-height:1.7}
.gp-article-method-link a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--gp-brand-dark);font-weight:800}

.gp-article-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.75rem;
  margin:1.2rem 0;
}

.gp-article-facts div{min-width:0;padding:.9rem;border:1px solid color-mix(in srgb,var(--gp-brand) 18%,var(--gp-line));border-radius:var(--gp-radius-sm);background:var(--gp-brand-soft)}
.gp-article-facts dt{color:var(--gp-muted);font-size:.72rem;line-height:1.4}
.gp-article-facts dd{margin:.2rem 0 0;color:var(--gp-ink);font-size:.84rem;font-weight:800;line-height:1.45;overflow-wrap:anywhere}

.gp-source-list{display:grid;gap:.75rem;margin:1rem 0 0;padding:0;list-style:none}
.gp-source-item{padding:1rem;border:1px solid var(--gp-line);border-radius:var(--gp-radius-sm);background:#fff}
.gp-source-main{display:flex;flex-wrap:wrap;align-items:baseline;gap:.45rem .7rem}
.gp-source-main a{color:var(--gp-ink);font-size:.86rem;font-weight:760;line-height:1.5;text-decoration-thickness:.06em;text-underline-offset:.15em;overflow-wrap:anywhere}
.gp-source-type{flex:0 0 auto;color:var(--gp-brand-dark);font-size:.68rem;font-weight:850;text-transform:uppercase;letter-spacing:.045em}
.gp-source-meta{display:flex;flex-wrap:wrap;gap:.3rem .75rem;margin-top:.45rem;color:var(--gp-muted);font-size:.72rem;line-height:1.45}

.gp-article-newsletter{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:1.25rem;
  overflow:hidden;
  padding:clamp(1.25rem,3vw,2rem);
  border:1px solid color-mix(in srgb,var(--gp-brand) 18%,var(--gp-line));
  border-radius:var(--gp-radius-lg);
  background:linear-gradient(135deg,var(--gp-brand-soft),#fff);
}

.gp-article-newsletter::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:12rem;
  aspect-ratio:1;
  right:-3rem;
  bottom:-5rem;
  background:url("motifs/botanical-sprig.svg") center/contain no-repeat;
  opacity:.07;
  transform:rotate(14deg);
  pointer-events:none;
}

.gp-article-newsletter p{max-width:62ch;margin:0;color:var(--gp-text);font-size:.9rem;line-height:1.65}


/* Related content is a real editorial component, not a raw generic grid. */
.gp-content-engine-related{margin-top:1rem}
.gp-content-engine-related>.gp-card{position:relative;display:flex;min-width:0;min-height:12.5rem;overflow:hidden;flex-direction:column;gap:.65rem;padding:1.2rem 1.25rem;border:1px solid #D7E5DB;border-radius:1.1rem;background:linear-gradient(145deg,#FFFFFF 0%,#F8FBF8 62%,#F2F7F3 100%);box-shadow:0 .55rem 1.6rem rgba(31,54,47,.04)}
.gp-content-engine-related>.gp-card::after{content:"";position:absolute;right:-1.5rem;bottom:-1.8rem;width:8rem;height:5rem;background:url("motifs/editorial-branch.svg") center/contain no-repeat;opacity:.08;pointer-events:none}
.gp-content-engine-related h3{position:relative;z-index:1;margin:.05rem 0 0;font-family:var(--gp-display);font-size:clamp(1.08rem,1rem + .3vw,1.24rem);font-weight:650;line-height:1.3}
.gp-content-engine-related h3 a{color:var(--gp-ink);text-decoration:none}
.gp-content-engine-related h3 a:hover,.gp-content-engine-related h3 a:focus-visible{color:var(--gp-brand-dark);outline:none}
.gp-content-engine-related>.gp-card>p{position:relative;z-index:1;margin:0;color:#586E79;font-size:.88rem;line-height:1.62}
.gp-content-engine-related>.gp-card>p:last-child{margin-top:auto;padding-top:.35rem}
.gp-content-engine-related>.gp-card>p:last-child a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--gp-brand-text);font-size:.82rem;font-weight:820;text-decoration:none}
.gp-content-engine-related>.gp-card>p:last-child a::after{content:" →"}

/* Product/provider recommendation cards rendered by content hooks. */

@media(max-width:64rem){
  .gp-article-hero{grid-template-columns:1fr;gap:1.5rem}
  .gp-article-title{max-width:20ch}
  .gp-article-hero-media{max-width:50rem}
  .gp-article-hero-image{aspect-ratio:16/9}
  .gp-article-layout{grid-template-columns:minmax(0,48rem);gap:0}
  .gp-article-trustbar{grid-template-columns:1fr}.gp-article-trustbar>div+div{border-left:0;border-top:1px solid var(--gp-line-soft)}
  .gp-article-sidebar{display:none}
  .gp-article-mobile-toc{display:block;max-width:56rem;margin:1rem auto 0;padding:.3rem .85rem;border:1px solid var(--gp-line);border-radius:var(--gp-radius-sm);background:#fff}
  .gp-article-mobile-toc>summary{display:flex;align-items:center;min-height:2.75rem;color:var(--gp-ink);font-size:.86rem;font-weight:800;cursor:pointer}
  .gp-article-mobile-toc .gp-article-toc{position:static;max-height:none;margin:0;padding:.2rem 0 .8rem;border:0;border-radius:0;box-shadow:none;overflow:visible}
}

@media(max-width:48rem){
  .gp-single-main{padding-top:1rem}
  .gp-article-hero{padding:clamp(1.15rem,5vw,1.6rem);border-radius:var(--gp-radius-lg)}
  .gp-article-hero::before{width:18rem;right:-7rem;bottom:-8rem}
  .gp-article-title{max-width:none;font-size:clamp(2rem,8.7vw,2.85rem);letter-spacing:-.04em;line-height:1.04}
  .gp-article-hero-visual{min-height:14rem}
  .gp-article-lead{font-size:.98rem;line-height:1.66}
  .gp-article-meta{font-size:.75rem}
  .gp-article-summary{padding:1.1rem}
  .gp-article-layout{margin-top:1.75rem}
  .gp-article-body{font-size:1rem;line-height:1.74}
  .gp-article-body h2{margin-top:1.9em}
  .gp-article-facts{grid-template-columns:1fr}
  .gp-article-newsletter{grid-template-columns:1fr}
  .gp-source-main{display:grid;gap:.3rem}
}

@media(max-width:30rem){
  .gp-article-hero-media,.gp-article-hero-image{border-radius:var(--gp-radius-md)}
  .gp-article-topic-chip{font-size:.74rem}
  .gp-article-meta{display:grid;gap:.3rem}
  .gp-article-body ul,.gp-article-body ol{padding-left:1.2rem}
  .gp-article-newsletter{padding:1.1rem}
  .gp-article-trustbar{padding:.45rem}.gp-article-trustbar>div{padding:.65rem .55rem}
}

/* GP 229: responsive cards for editorial Ratgeber crosslinks (not sponsored ranking). */
.gp-article-recommendation .gp-content-engine-products,.gp-article-related .gp-content-engine-related{align-items:stretch}
.gp-article-recommendation .gp-content-engine-products .gp-card,.gp-article-related .gp-content-engine-related .gp-card{height:100%;min-width:0;overflow:hidden}
.gp-article-recommendation .gp-content-card__bottom{margin-top:auto}