/* Praxoria Startseite – v561: Warum Praxoria als eigenständiger Qualitätskompass, ohne Schritt- oder Matrixlogik. */

html body.home.homeRefinedV561 .whyBand{
  --why-paper: rgba(255,255,255,.62);
  --why-hair: color-mix(in oklab, var(--border) 64%, transparent);
  margin-top: clamp(58px, 7vw, 104px) !important;
  padding: clamp(44px, 6vw, 82px) 0 clamp(54px, 6.5vw, 92px) !important;
  background:
    radial-gradient(860px 320px at 10% 18%, color-mix(in oklab, var(--accent) 7%, transparent), transparent 65%),
    radial-gradient(720px 360px at 92% 56%, color-mix(in oklab, var(--accent2) 5%, transparent), transparent 66%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 45%, rgba(255,255,255,.12)) !important;
}

html body.home.homeRefinedV561 .whyBand::before{
  display:none !important;
}

html body.home.homeRefinedV561 .whyTitleBlock{
  grid-template-columns: minmax(0, 760px) minmax(180px, 420px) !important;
  gap: clamp(28px, 6vw, 96px) !important;
  align-items:end !important;
  margin-bottom: clamp(28px, 4.6vw, 58px) !important;
}

html body.home.homeRefinedV561 .whyTitleBlock h2{
  font-size: clamp(44px, 5vw, 72px) !important;
  margin-bottom: clamp(14px, 2vw, 22px) !important;
}

html body.home.homeRefinedV561 .whyTitleBlock h2::after{
  width:min(310px, 52vw) !important;
  height:2px !important;
  opacity:.74 !important;
}

html body.home.homeRefinedV561 .whyTitleBlock .sub.homeLead{
  max-width: 760px !important;
  font-size: clamp(19px, 1.38vw, 24px) !important;
  line-height:1.58 !important;
}

html body.home.homeRefinedV561 .whyLineStage{
  justify-self:end !important;
  width:min(100%, 390px) !important;
  height:88px !important;
  opacity:.34 !important;
  transform:translateY(-4px) rotate(-1.2deg) !important;
}

html body.home.homeRefinedV561 .whyBand.isFlowComplete .whyLineStage{
  opacity:.48 !important;
}

html body.home.homeRefinedV561 .whyDrawLine path{
  stroke-width:5 !important;
  opacity:.22 !important;
}

html body.home.homeRefinedV561 .whyPillars{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(300px, .95fr) minmax(0, 1fr) !important;
  grid-template-rows: minmax(232px, auto) minmax(232px, auto) !important;
  gap: clamp(16px, 2.2vw, 26px) !important;
  align-items:stretch !important;
  margin:0 !important;
  padding: clamp(18px, 2.5vw, 30px) !important;
  border:1px solid color-mix(in oklab, var(--border) 58%, transparent) !important;
  border-radius: clamp(30px, 3.5vw, 46px) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.68), rgba(255,255,255,.28)),
    radial-gradient(520px 260px at 18% 18%, color-mix(in oklab, var(--accent) 6%, transparent), transparent 70%),
    radial-gradient(620px 280px at 92% 90%, color-mix(in oklab, var(--accent2) 5%, transparent), transparent 72%) !important;
  box-shadow: 0 24px 80px rgba(20,30,42,.045) !important;
  overflow:hidden !important;
}

html body.home.homeRefinedV561 .whyPillars::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  left: clamp(34px, 4vw, 58px) !important;
  right: clamp(34px, 4vw, 58px) !important;
  top: 50% !important;
  height:1px !important;
  background:linear-gradient(90deg,
    color-mix(in oklab, var(--accent) 16%, transparent),
    color-mix(in oklab, var(--accent3) 14%, transparent) 50%,
    color-mix(in oklab, var(--accent2) 16%, transparent)) !important;
  opacity:.56 !important;
  transform: translateY(-50%) !important;
  pointer-events:none !important;
}

html body.home.homeRefinedV561 .whyPillars::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  inset:auto clamp(26px, 3vw, 46px) clamp(22px, 2.6vw, 38px) auto !important;
  width:min(28vw, 390px) !important;
  height:140px !important;
  border-radius:999px !important;
  background:radial-gradient(closest-side, color-mix(in oklab, var(--accent3) 6%, transparent), transparent 70%) !important;
  opacity:.8 !important;
  pointer-events:none !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar{
  --pillar-accent: var(--accent);
  position:relative !important;
  z-index:1 !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:auto !important;
  padding: clamp(26px, 3vw, 40px) !important;
  border:1px solid color-mix(in oklab, var(--border) 52%, transparent) !important;
  border-radius: clamp(24px, 2.7vw, 34px) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.76), rgba(255,255,255,.5)),
    radial-gradient(380px 200px at 15% 0%, color-mix(in oklab, var(--pillar-accent) 6%, transparent), transparent 68%) !important;
  box-shadow: 0 18px 54px rgba(20,30,42,.043) !important;
  overflow:hidden !important;
  transform:none !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar.p1{
  grid-column:1 !important;
  grid-row:1 / span 2 !important;
  padding: clamp(30px, 3.4vw, 48px) !important;
}
html body.home.homeRefinedV561 .whyPillars .pillar.p2{
  grid-column:2 !important;
  grid-row:1 !important;
  transform:none !important;
}
html body.home.homeRefinedV561 .whyPillars .pillar.p3{
  grid-column:2 !important;
  grid-row:2 !important;
  transform:none !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar + .pillar{
  border-left:1px solid color-mix(in oklab, var(--border) 52%, transparent) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  right:clamp(20px, 2.4vw, 34px) !important;
  top:clamp(18px, 2.2vw, 30px) !important;
  width:clamp(78px, 9vw, 142px) !important;
  height:clamp(78px, 9vw, 142px) !important;
  border-radius:50% !important;
  border:1px solid color-mix(in oklab, var(--pillar-accent) 18%, transparent) !important;
  background:radial-gradient(circle at 50% 50%, color-mix(in oklab, var(--pillar-accent) 9%, transparent), transparent 62%) !important;
  opacity:.55 !important;
  pointer-events:none !important;
  transition: opacity .45s ease, transform .45s ease !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:clamp(24px, 3vw, 40px) !important;
  top:clamp(22px, 2.5vw, 34px) !important;
  width:clamp(48px, 5vw, 84px) !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg, var(--pillar-accent), transparent) !important;
  opacity:.74 !important;
}

@media (hover:hover){
  html body.home.homeRefinedV561 .whyPillars .pillar:hover{
    box-shadow: 0 24px 72px rgba(20,30,42,.065) !important;
    transform:translateY(-2px) !important;
  }
  html body.home.homeRefinedV561 .whyPillars .pillar:hover::after{
    opacity:.76 !important;
    transform:scale(1.03) !important;
  }
}

html body.home.homeRefinedV561 .whyPillars .pillar .k{
  margin: clamp(18px, 2.4vw, 30px) 0 clamp(16px, 2vw, 24px) !important;
  font-size: clamp(12px, .82vw, 14px) !important;
  letter-spacing:.24em !important;
  font-weight:850 !important;
  color: color-mix(in oklab, var(--pillar-accent) 76%, var(--ink)) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar h3{
  max-width: 12.5em !important;
  font-size: clamp(25px, 2.1vw, 34px) !important;
  line-height:1.08 !important;
  letter-spacing:-.04em !important;
  margin:0 !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar.p1 h3{
  font-size:clamp(31px, 2.8vw, 44px) !important;
  max-width:10.5em !important;
}

html body.home.homeRefinedV561 .whyPillars .pillar p{
  margin: clamp(18px, 2.1vw, 26px) 0 0 !important;
  font-size: clamp(16.5px, 1.08vw, 20px) !important;
  line-height:1.58 !important;
  color: color-mix(in oklab, var(--ink) 76%, var(--muted)) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarMeta{
  margin-top:auto !important;
  padding-top: clamp(18px, 2vw, 26px) !important;
  border-top: 1px solid color-mix(in oklab, var(--pillar-accent) 18%, var(--border) 74%) !important;
  gap:.35rem .78rem !important;
  font-size: clamp(12px, .78vw, 14px) !important;
  font-weight:800 !important;
  color: color-mix(in oklab, var(--ink) 61%, var(--muted)) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview{
  margin-top: clamp(16px, 1.8vw, 22px) !important;
  padding: 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview .pk{
  display:inline-flex !important;
  align-items:center !important;
  gap:.55em !important;
  margin:0 0 9px !important;
  font-size: clamp(11px, .74vw, 12.5px) !important;
  line-height:1.2 !important;
  letter-spacing:.22em !important;
  font-weight:850 !important;
  color: color-mix(in oklab, var(--pillar-accent) 66%, var(--ink)) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview .pk::before{
  content:"" !important;
  width:.55em !important;
  height:.55em !important;
  border-radius:50% !important;
  background:var(--pillar-accent) !important;
  opacity:.54 !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview .pv{
  max-width: 31rem !important;
  font-size: clamp(15.5px, 1vw, 18px) !important;
  line-height:1.42 !important;
  font-weight:760 !important;
  color: color-mix(in oklab, var(--ink) 84%, var(--muted)) !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview .pd{
  margin-top: 10px !important;
  font-size: clamp(14px, .91vw, 16px) !important;
  line-height:1.42 !important;
}

html body.home.homeRefinedV561 .whyPillars .pillarPreview .pd span{
  font-weight:740 !important;
  color: color-mix(in oklab, var(--ink) 72%, var(--muted)) !important;
  box-shadow: inset 0 -.24em 0 color-mix(in oklab, var(--pillar-accent) 10%, transparent) !important;
}

html body.home.homeRefinedV561 .whyAfter{
  margin-top: clamp(64px, 7vw, 106px) !important;
}

@media (max-width: 1080px){
  html body.home.homeRefinedV561 .whyTitleBlock{
    grid-template-columns:1fr !important;
  }
  html body.home.homeRefinedV561 .whyLineStage{
    justify-self:start !important;
    width:min(100%, 320px) !important;
    height:64px !important;
  }
  html body.home.homeRefinedV561 .whyPillars{
    grid-template-columns:1fr !important;
    grid-template-rows:auto !important;
    padding:14px !important;
    border-radius:30px !important;
  }
  html body.home.homeRefinedV561 .whyPillars::before,
  html body.home.homeRefinedV561 .whyPillars::after{
    display:none !important;
  }
  html body.home.homeRefinedV561 .whyPillars .pillar,
  html body.home.homeRefinedV561 .whyPillars .pillar.p1,
  html body.home.homeRefinedV561 .whyPillars .pillar.p2,
  html body.home.homeRefinedV561 .whyPillars .pillar.p3{
    grid-column:auto !important;
    grid-row:auto !important;
    padding:clamp(26px, 5vw, 40px) !important;
  }
}

@media (max-width: 720px){
  html body.home.homeRefinedV561 .whyBand{
    padding-top:34px !important;
  }
  html body.home.homeRefinedV561 .whyTitleBlock h2{
    font-size: clamp(38px, 12vw, 54px) !important;
  }
  html body.home.homeRefinedV561 .whyTitleBlock .sub.homeLead{
    font-size:18px !important;
  }
  html body.home.homeRefinedV561 .whyPillars{
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  html body.home.homeRefinedV561 .whyPillars .pillar::after{
    width:88px !important;
    height:88px !important;
  }
}