/* Praxoria Startseite – v564: Warum Praxoria als redaktionelles Qualitätsversprechen.
   Ziel: eigenständig, ruhig, nicht als weitere Dreispalten- oder Schrittlogik. */

html body.home.homeRefinedV564 .whyBand{
  --why-hair: color-mix(in oklab, var(--border) 72%, transparent);
  --why-ink-soft: color-mix(in oklab, var(--ink) 78%, var(--muted));
  --why-paper: color-mix(in oklab, #fff 92%, var(--surface));
  margin-top: clamp(58px, 7vw, 104px) !important;
  padding: clamp(54px, 6.4vw, 88px) 0 clamp(62px, 7vw, 96px) !important;
  background:
    radial-gradient(900px 360px at 2% 16%, color-mix(in oklab, var(--accent) 3.3%, transparent), transparent 72%),
    radial-gradient(840px 340px at 92% 86%, color-mix(in oklab, var(--accent2) 2.4%, transparent), transparent 74%) !important;
  overflow: visible !important;
}
html body.home.homeRefinedV564 .whyBand::before,
html body.home.homeRefinedV564 .whyBand::after{ display:none !important; }

html body.home.homeRefinedV564 .whyTitleBlock{
  display:block !important;
  margin-bottom: clamp(30px, 4.4vw, 54px) !important;
}
html body.home.homeRefinedV564 .whyTitleBlock .headBlock{ max-width: 1040px !important; }
html body.home.homeRefinedV564 .whyTitleBlock h2{
  max-width: 760px !important;
  margin:0 0 clamp(16px, 2vw, 24px) !important;
  font-size: clamp(44px, 5vw, 72px) !important;
  line-height:.98 !important;
  letter-spacing:-.055em !important;
}
html body.home.homeRefinedV564 .whyTitleBlock h2::after{
  width:min(300px, 54vw) !important;
  height:2px !important;
  opacity:.62 !important;
}
html body.home.homeRefinedV564 .whyTitleBlock .sub.homeLead{
  max-width: 850px !important;
  font-size: clamp(18px, 1.28vw, 22px) !important;
  line-height:1.62 !important;
  color: color-mix(in oklab, var(--ink) 82%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyLineStage{ display:none !important; }

html body.home.homeRefinedV564 .whyNarrative{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(320px, .88fr) minmax(420px, 1.12fr) !important;
  gap: clamp(34px, 5.4vw, 88px) !important;
  align-items:stretch !important;
  padding: clamp(34px, 4.6vw, 64px) 0 !important;
  border-top:1px solid var(--why-hair) !important;
  border-bottom:1px solid var(--why-hair) !important;
  background: transparent !important;
}
html body.home.homeRefinedV564 .whyNarrative::before{
  content:"" !important;
  position:absolute !important;
  left:clamp(220px, 33%, 420px) !important;
  top:clamp(34px, 4.6vw, 64px) !important;
  bottom:clamp(34px, 4.6vw, 64px) !important;
  width:1px !important;
  background:linear-gradient(180deg, transparent, color-mix(in oklab, var(--border) 58%, transparent), transparent) !important;
  opacity:.82 !important;
  pointer-events:none !important;
}

html body.home.homeRefinedV564 .whyPromisePanel{
  position:sticky !important;
  top:96px !important;
  align-self:start !important;
  padding: clamp(28px, 3.8vw, 46px) clamp(26px, 3.6vw, 44px) !important;
  border:1px solid color-mix(in oklab, var(--border) 66%, transparent) !important;
  border-radius:34px !important;
  background:
    linear-gradient(140deg, rgba(255,255,255,.88), rgba(255,255,255,.62)),
    radial-gradient(360px 220px at 6% 0%, color-mix(in oklab, var(--accent) 7%, transparent), transparent 70%) !important;
  box-shadow: 0 26px 70px rgba(15,23,42,.055) !important;
}
html body.home.homeRefinedV564 .whyPromisePanel::before{
  content:"" !important;
  position:absolute !important;
  inset:18px auto auto 20px !important;
  width:96px !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,
    color-mix(in oklab, var(--accent) 68%, transparent),
    color-mix(in oklab, var(--accent3) 55%, transparent),
    color-mix(in oklab, var(--accent2) 46%, transparent),
    transparent) !important;
}
html body.home.homeRefinedV564 .whyEditorialKicker{
  margin: clamp(16px, 2.4vw, 28px) 0 clamp(18px, 2.4vw, 26px) !important;
  font-size: clamp(11.5px, .78vw, 13px) !important;
  line-height:1.1 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  font-weight:850 !important;
  color: color-mix(in oklab, var(--ink) 54%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyPromiseQuote{
  margin:0 !important;
  max-width: 13.8em !important;
  font-size: clamp(28px, 2.9vw, 46px) !important;
  line-height:1.08 !important;
  letter-spacing:-.055em !important;
  font-weight:800 !important;
  color: color-mix(in oklab, var(--ink) 94%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyPromiseDetail{
  margin: clamp(18px, 2.5vw, 28px) 0 0 !important;
  max-width: 32rem !important;
  font-size: clamp(16px, 1.08vw, 18.5px) !important;
  line-height:1.62 !important;
  color: var(--why-ink-soft) !important;
}
html body.home.homeRefinedV564 .whyEditorialTrace{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin-top: clamp(24px, 3vw, 38px) !important;
  opacity:.74 !important;
}
html body.home.homeRefinedV564 .whyEditorialTrace span{
  display:block !important;
  height:4px !important;
  border-radius:999px !important;
}
html body.home.homeRefinedV564 .whyEditorialTrace span:nth-child(1){ width:44px !important; background:color-mix(in oklab, var(--accent) 70%, transparent) !important; }
html body.home.homeRefinedV564 .whyEditorialTrace span:nth-child(2){ width:64px !important; background:color-mix(in oklab, var(--accent3) 58%, transparent) !important; }
html body.home.homeRefinedV564 .whyEditorialTrace span:nth-child(3){ width:84px !important; background:color-mix(in oklab, var(--accent2) 52%, transparent) !important; }

html body.home.homeRefinedV564 .whyQualityWeave{
  position:relative !important;
  display:grid !important;
  gap:0 !important;
  padding: clamp(6px, 1vw, 10px) 0 !important;
  background:transparent !important;
}
html body.home.homeRefinedV564 .whyQualityWeave::before{
  content:"" !important;
  position:absolute !important;
  left:13px !important;
  top:clamp(26px, 3vw, 40px) !important;
  bottom:clamp(26px, 3vw, 40px) !important;
  width:1px !important;
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--accent) 46%, transparent),
    color-mix(in oklab, var(--accent3) 38%, transparent) 48%,
    color-mix(in oklab, var(--accent2) 38%, transparent)) !important;
  opacity:.34 !important;
}
html body.home.homeRefinedV564 .whyQualityNote{
  --pillar-accent: var(--accent);
  position:relative !important;
  display:grid !important;
  grid-template-columns:28px minmax(0,1fr) !important;
  gap: clamp(18px, 2.2vw, 28px) !important;
  padding: clamp(22px, 2.9vw, 36px) 0 !important;
  border:0 !important;
  border-bottom:1px solid var(--why-hair) !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.home.homeRefinedV564 .whyQualityNote:first-child{ padding-top:6px !important; }
html body.home.homeRefinedV564 .whyQualityNote:last-child{ padding-bottom:6px !important; border-bottom:0 !important; }
html body.home.homeRefinedV564 .whyQualityNote.p1{ --pillar-accent: var(--accent) !important; }
html body.home.homeRefinedV564 .whyQualityNote.p2{ --pillar-accent: var(--accent3) !important; }
html body.home.homeRefinedV564 .whyQualityNote.p3{ --pillar-accent: var(--accent2) !important; }
html body.home.homeRefinedV564 .whyQualityMark{
  position:relative !important;
  z-index:1 !important;
  width:27px !important;
  height:27px !important;
  margin-top:2px !important;
  border-radius:50% !important;
  background:color-mix(in oklab, var(--pillar-accent) 14%, #fff) !important;
  border:1px solid color-mix(in oklab, var(--pillar-accent) 34%, transparent) !important;
  box-shadow:0 0 0 7px color-mix(in oklab, var(--pillar-accent) 5%, transparent) !important;
}
html body.home.homeRefinedV564 .whyQualityMark::after{
  content:"" !important;
  position:absolute !important;
  inset:8px !important;
  border-radius:50% !important;
  background:color-mix(in oklab, var(--pillar-accent) 76%, var(--ink)) !important;
  opacity:.62 !important;
}
html body.home.homeRefinedV564 .whyQualityBody{
  display:grid !important;
  grid-template-columns:minmax(0, .84fr) minmax(250px, .72fr) !important;
  column-gap: clamp(26px, 4vw, 58px) !important;
  row-gap: clamp(12px, 1.7vw, 20px) !important;
  align-items:start !important;
}
html body.home.homeRefinedV564 .whyQualityBody .k{
  grid-column:1 !important;
  margin:0 0 10px !important;
  font-size: clamp(11.5px, .75vw, 12.8px) !important;
  line-height:1.1 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  font-weight:860 !important;
  color: color-mix(in oklab, var(--pillar-accent) 76%, var(--ink)) !important;
}
html body.home.homeRefinedV564 .whyQualityBody h3{
  grid-column:1 !important;
  margin:0 !important;
  max-width: 13em !important;
  font-size: clamp(24px, 2.08vw, 34px) !important;
  line-height:1.08 !important;
  letter-spacing:-.045em !important;
  color: color-mix(in oklab, var(--ink) 96%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyQualityBody > p:not(.whyHumanClaim){
  grid-column:1 !important;
  margin: clamp(12px, 1.5vw, 18px) 0 0 !important;
  max-width: 37rem !important;
  font-size: clamp(16px, 1vw, 18.5px) !important;
  line-height:1.58 !important;
  color: var(--why-ink-soft) !important;
}
html body.home.homeRefinedV564 .whyEvidenceLine{
  grid-column:2 !important;
  grid-row:1 / span 4 !important;
  align-self:center !important;
  padding: clamp(18px, 2.4vw, 26px) 0 clamp(16px, 2.2vw, 24px) clamp(18px, 2.6vw, 30px) !important;
  border-left:1px solid color-mix(in oklab, var(--pillar-accent) 26%, var(--border)) !important;
}
html body.home.homeRefinedV564 .whyEvidenceLine span{
  display:block !important;
  margin:0 0 10px !important;
  font-size: clamp(11px, .72vw, 12.2px) !important;
  line-height:1.1 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;
  font-weight:850 !important;
  color: color-mix(in oklab, var(--pillar-accent) 64%, var(--ink)) !important;
}
html body.home.homeRefinedV564 .whyEvidenceLine strong{
  display:block !important;
  max-width: 30rem !important;
  font-size: clamp(16px, 1.04vw, 18px) !important;
  line-height:1.48 !important;
  letter-spacing:-.018em !important;
  color: color-mix(in oklab, var(--ink) 88%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyHumanClaim{
  grid-column:2 !important;
  margin: clamp(12px, 1.5vw, 18px) 0 0 clamp(18px, 2.6vw, 30px) !important;
  max-width: 30rem !important;
  font-size: clamp(14.5px, .92vw, 16px) !important;
  line-height:1.42 !important;
  font-weight:760 !important;
  color: color-mix(in oklab, var(--ink) 70%, var(--muted)) !important;
}
html body.home.homeRefinedV564 .whyHumanClaim::before{
  content:"" !important;
  display:inline-block !important;
  width:24px !important;
  height:2px !important;
  margin:0 .7em .26em 0 !important;
  border-radius:999px !important;
  background:color-mix(in oklab, var(--pillar-accent) 34%, transparent) !important;
}

html body.home.homeRefinedV564 .whyAfter{ margin-top: clamp(56px, 6.8vw, 92px) !important; }

@media (max-width: 1120px){
  html body.home.homeRefinedV564 .whyNarrative{
    grid-template-columns:1fr !important;
  }
  html body.home.homeRefinedV564 .whyNarrative::before{ display:none !important; }
  html body.home.homeRefinedV564 .whyPromisePanel{ position:relative !important; top:auto !important; max-width:760px !important; }
}
@media (max-width: 820px){
  html body.home.homeRefinedV564 .whyBand{ padding-top:42px !important; }
  html body.home.homeRefinedV564 .whyNarrative{ padding:30px 0 !important; gap:28px !important; }
  html body.home.homeRefinedV564 .whyPromisePanel{ border-radius:26px !important; padding:28px 24px !important; }
  html body.home.homeRefinedV564 .whyPromiseQuote{ font-size: clamp(26px, 7vw, 34px) !important; }
  html body.home.homeRefinedV564 .whyQualityBody{ grid-template-columns:1fr !important; }
  html body.home.homeRefinedV564 .whyEvidenceLine{ grid-column:1 !important; grid-row:auto !important; margin-top:4px !important; padding:14px 0 0 !important; border-left:0 !important; border-top:1px solid color-mix(in oklab, var(--pillar-accent) 22%, var(--border)) !important; }
  html body.home.homeRefinedV564 .whyHumanClaim{ grid-column:1 !important; margin-left:0 !important; }
}
