/* Praxoria Startseite – v522 Warum-Pfeiler: Hintergrund bereinigt,
   gleiche Vertikalität, Claim-Hervorhebung. */

body.homeRefinedV522{
  --why-canvas: color-mix(in oklab, var(--surface) 86%, var(--bg));
  --why-divider: color-mix(in oklab, var(--border) 42%, transparent);
  --why-divider-soft: color-mix(in oklab, var(--border) 28%, transparent);
}

/* Kein weißes Fremdpanel im Warum-Bereich. */
html body.home.homeRefinedV522 .whyBand{
  background: transparent !important;
  background-image: none !important;
  overflow: clip !important;
  margin-top: clamp(28px, 3.2vw, 48px) !important;
  padding-top: clamp(38px, 4.2vw, 62px) !important;
}

html body.home.homeRefinedV522 .whyPillars{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  margin-top: clamp(24px, 2.8vw, 38px) !important;
  border-top: 1px solid var(--why-divider) !important;
  border-bottom: 1px solid var(--why-divider) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body.home.homeRefinedV522 .whyPillars .pillar{
  display: flex !important;
  flex-direction: column !important;
  min-height: clamp(460px, 34vw, 560px) !important;
  padding: clamp(30px, 3.2vw, 48px) clamp(30px, 3.4vw, 52px) clamp(32px, 3.6vw, 54px) !important;
  background: transparent !important;
}

html body.home.homeRefinedV522 .whyPillars .pillar + .pillar{
  border-left: 1px solid var(--why-divider-soft) !important;
}

html body.home.homeRefinedV522 .pillar .k{
  margin-bottom: clamp(17px, 1.8vw, 23px) !important;
}

html body.home.homeRefinedV522 .pillar h3{
  min-height: 3.1em !important;
  display: flex !important;
  align-items: flex-start !important;
  margin-bottom: 0 !important;
}

html body.home.homeRefinedV522 .pillar > p{
  min-height: 7.5em !important;
  margin-top: clamp(10px, 1.2vw, 16px) !important;
}

html body.home.homeRefinedV522 .pillarMeta{
  min-height: 2.4em !important;
  margin-top: clamp(18px, 1.9vw, 24px) !important;
}

/* Die kursnahen Beispiele sitzen in allen Spalten auf gleicher Höhe. */
html body.home.homeRefinedV522 .pillarPreview{
  margin-top: auto !important;
  padding-left: clamp(18px, 1.55vw, 24px) !important;
  min-height: 14.6rem !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  border-left-width: 3px !important;
  border-left-color: color-mix(in oklab, var(--pillar-accent) 78%, white) !important;
}

html body.home.homeRefinedV522 .pillarPreview .pk{
  margin-bottom: clamp(.75rem, .9vw, 1rem) !important;
}

html body.home.homeRefinedV522 .pillarPreview .pv{
  min-height: 5.2em !important;
  font-size: clamp(1.02rem, 1.1vw, 1.2rem) !important;
  line-height: 1.38 !important;
}

/* Die Folgerung wird als humanistische Werbeaussage sichtbar,
   aber nicht als weitere Box oder Pill. */
html body.home.homeRefinedV522 .pillarPreview .pd{
  margin: clamp(1rem, 1.2vw, 1.25rem) 0 0 !important;
  color: var(--text) !important;
  font-size: clamp(1.02rem, 1.08vw, 1.16rem) !important;
  line-height: 1.36 !important;
  font-weight: 780 !important;
  letter-spacing: -.025em !important;
}

html body.home.homeRefinedV522 .pillarPreview .pd span{
  position: relative !important;
  z-index: 1 !important;
  display: inline !important;
  box-decoration-break: clone !important;
  -webkit-box-decoration-break: clone !important;
  padding: 0 .06em !important;
  background: linear-gradient(
    to top,
    color-mix(in oklab, var(--pillar-accent) 22%, transparent) 0 .52em,
    transparent .52em
  ) !important;
}

html body.home.homeRefinedV522 .whyLineStage{
  max-width: 760px !important;
  opacity: 0 !important;
}

html body.home.homeRefinedV522 .whyBand.isFlowComplete .whyLineStage{
  opacity: .72 !important;
}

html body.home.homeRefinedV522 .whyDrawLine path{
  stroke-width: 12 !important;
  opacity: .46 !important;
}

html body.home.homeRefinedV522 .whyAfter{
  margin-top: clamp(30px, 3.2vw, 46px) !important;
}

@media (max-width: 1100px){
  html body.home.homeRefinedV522 .whyPillars{
    grid-template-columns: 1fr !important;
  }
  html body.home.homeRefinedV522 .whyPillars .pillar{
    min-height: 0 !important;
    padding: 30px 0 34px !important;
  }
  html body.home.homeRefinedV522 .whyPillars .pillar + .pillar{
    border-left: 0 !important;
    border-top: 1px solid var(--why-divider-soft) !important;
  }
  html body.home.homeRefinedV522 .pillar h3,
  html body.home.homeRefinedV522 .pillar > p,
  html body.home.homeRefinedV522 .pillarMeta,
  html body.home.homeRefinedV522 .pillarPreview,
  html body.home.homeRefinedV522 .pillarPreview .pv{
    min-height: 0 !important;
  }
  html body.home.homeRefinedV522 .pillarPreview{
    margin-top: 24px !important;
  }
}

@media (max-width: 720px){
  html body.home.homeRefinedV522 .whyPillars{
    margin-top: 20px !important;
    background: transparent !important;
  }
  html body.home.homeRefinedV522 .whyPillars .pillar{
    padding-inline: 0 !important;
  }
}