/* ============================================================
   v257 · Process Intelligence
   Erfahrung schreibt die Betriebs-DNA fort.
   Drei Bewegungen: Lernaufgabe → überprüfte Erfahrung → Betriebs-DNA.
   ============================================================ */

:root{
  --pi257-bg:#0a0c0f;
  --pi257-white:#f5f2eb;
  --pi257-ink:rgba(242,238,230,.78);
  --pi257-muted:rgba(242,238,230,.58);
  --pi257-gold:#cbb77f;
  --pi257-gold-bright:#e2cd91;
  --pi257-line:rgba(203,183,127,.18);
  --pi257-line-strong:rgba(203,183,127,.42);
}

.pi257-page{
  background:var(--pi257-bg);
  color:var(--pi257-ink);
}
.pi257-page *{box-sizing:border-box}

/* Das v256-Hero-System bleibt geometrisch unangetastet. */
.pi257-wide{
  width:min(calc(100% - 48px),1180px);
  max-width:1180px!important;
  margin-inline:auto;
}

.pi257-section{
  position:relative;
  padding:104px 0;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.045);
  background:#0b0d11;
}

.pi257-page :is(.pi-section-head,.pi257-body,.pi257-learning-task,.pi257-flow,.pi257-object){
  hyphens:auto;
  -webkit-hyphens:auto;
}

.pi257-page .pi-section-head>.eyebrow{
  margin:0 0 22px;
  color:rgba(203,183,127,.86);
  font-size:max(11px,.72rem);
  font-weight:720;
  line-height:1.35;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.pi257-page .pi-section-head>.ledger-title{
  overflow-wrap:normal;
}

.pi257-intro,
.pi257-body{
  width:100%;
  max-width:var(--detail-body-width);
  margin-left:0;
  margin-right:0;
  text-align:left;
}

.pi257-intro{
  margin-top:25px;
  color:rgba(245,243,238,.9);
  font-size:clamp(1.05rem,1.3vw,1.2rem);
  line-height:1.64;
}

.pi257-body{
  margin-top:32px;
  margin-inline:auto;
}
.pi257-body p{
  margin:0;
  color:var(--pi257-ink);
  font-size:clamp(.99rem,1.06vw,1.08rem);
  line-height:1.72;
}
.pi257-body p+p{margin-top:17px}

/* 01 · Lernen mit Kontext */
.pi257-task{
  padding-top:116px;
  background:
    radial-gradient(76% 105% at 88% 4%,rgba(80,103,121,.11),transparent 58%),
    linear-gradient(180deg,#101821 0%,#0c1117 46%,#0b0d11 100%);
}

.pi257-learning-task{
  width:100%;
  max-width:var(--detail-copy-axis);
  margin:40px auto 0;
  padding:22px 24px 20px;
  border-left:1px solid rgba(203,183,127,.66);
  background:linear-gradient(90deg,rgba(203,183,127,.065),rgba(203,183,127,0) 78%);
}
.pi257-learning-task span,
.pi257-object-head span,
.pi257-object-axis small{
  color:var(--pi257-gold);
  font-size:max(11px,.72rem);
  font-weight:740;
  line-height:1.35;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.pi257-learning-task span{
  display:block;
  margin-bottom:10px;
}
.pi257-learning-task p{
  margin:0;
  color:var(--pi257-white);
  font-size:clamp(1.08rem,1.5vw,1.34rem);
  font-weight:650;
  line-height:1.5;
}
.pi257-learning-task footer{
  margin-top:16px;
  padding-top:15px;
  border-top:0;
  color:rgba(242,238,230,.66);
  font-size:max(11px,.9rem);
  line-height:1.58;
}

/* 02 · Überprüfte Betriebserfahrung */
.pi257-training{
  background:linear-gradient(180deg,#0b0d11 0%,#0c1015 52%,#0b0d11 100%);
}

.pi257-flow{
  display:grid;
  grid-template-columns:auto minmax(24px,1fr) auto minmax(24px,1fr) auto;
  align-items:center;
  gap:14px;
  width:100%;
  max-width:var(--detail-copy-axis);
  margin:40px auto 0;
  padding:22px 0 18px;
  border-top:1px solid var(--pi257-line-strong);
  border-bottom:1px solid var(--pi257-line);
}
.pi257-flow p{
  margin:0;
  color:rgba(245,242,235,.86);
  font-size:max(11px,.8rem);
  font-weight:680;
  line-height:1.5;
  letter-spacing:.02em;
  text-align:center;
}
.pi257-flow i{
  height:1px;
  background:linear-gradient(90deg,rgba(203,183,127,.18),rgba(203,183,127,.68));
}
.pi257-flow footer{
  grid-column:1/-1;
  margin-top:4px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.045);
  color:rgba(242,238,230,.64);
  font-size:max(11px,.9rem);
  line-height:1.58;
  text-align:center;
}

/* 03 · Versionierte Betriebs-DNA */
.pi257-intelligence{
  border-bottom:1px solid rgba(203,183,127,.12);
  background:
    radial-gradient(70% 105% at 12% 8%,rgba(74,96,114,.09),transparent 58%),
    #0b0d11;
}

.pi257-object{
  width:100%;
  max-width:1180px;
  margin:52px auto 0;
  border-top:1px solid var(--pi257-line-strong);
  border-bottom:1px solid var(--pi257-line-strong);
  background:
    radial-gradient(70% 85% at 90% 6%,rgba(203,183,127,.055),transparent 62%),
    linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,.003));
}
.pi257-object-head{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:28px;
  align-items:baseline;
  padding:25px 28px;
  border-bottom:1px solid rgba(255,255,255,.065);
}
.pi257-object-head strong{
  color:var(--pi257-white);
  font-size:1rem;
  font-weight:680;
  line-height:1.5;
}
.pi257-object-axis{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:0;
  padding:0;
  list-style:none;
}
.pi257-object-axis li{
  position:relative;
  min-width:0;
  padding:28px 28px 30px;
  border-left:1px solid rgba(255,255,255,.06);
}
.pi257-object-axis li:first-child{border-left:0}
.pi257-object-axis li:last-child{
  background:linear-gradient(135deg,rgba(203,183,127,.055),transparent 72%);
}
.pi257-step-number{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  margin-bottom:22px;
  border:1px solid rgba(203,183,127,.5);
  border-radius:50%;
  color:var(--pi257-gold-bright);
  font-size:max(11px,.72rem);
  font-weight:760;
}
.pi257-object-axis strong{
  display:block;
  margin-top:8px;
  color:var(--pi257-white);
  font-size:1rem;
  font-weight:680;
  line-height:1.48;
}
.pi257-object-axis p{
  margin:13px 0 0;
  color:rgba(242,238,230,.7);
  font-size:.94rem;
  line-height:1.62;
}
.pi257-object figcaption{
  padding:20px 28px;
  border-top:1px solid rgba(255,255,255,.055);
  color:rgba(242,238,230,.67);
  font-size:.92rem;
  line-height:1.62;
  text-align:center;
}
.pi257-object figcaption strong{
  color:var(--pi257-gold-bright);
  font-weight:690;
}

.pi257-next .detail-cta-copy>p:not(.eyebrow){max-width:760px!important}
.pi257-next .detail-cta-actions{margin-top:32px}

@media(max-width:860px){
  .pi257-section{padding:80px 0}
  .pi257-object-axis{grid-template-columns:1fr}
  .pi257-object-axis li{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.06);
  }
  .pi257-object-axis li:first-child{border-top:0}
}

@media(max-width:760px){
  .pi257-wide{width:min(calc(100% - 28px),1180px)}
  .pi257-section{padding:68px 0}
  .pi257-page .pi-section-head>.eyebrow{margin-bottom:18px}
  .pi257-intro{margin-top:20px;font-size:.98rem;line-height:1.66}
  .pi257-body{margin-top:27px}
  .pi257-body p{font-size:.96rem;line-height:1.7}
  .pi257-learning-task{margin-top:32px;padding:19px 18px 18px}
  .pi257-flow{
    grid-template-columns:1fr;
    gap:10px;
    padding:20px 16px 17px;
  }
  .pi257-flow i{
    width:1px;
    height:18px;
    justify-self:center;
    background:linear-gradient(180deg,rgba(203,183,127,.18),rgba(203,183,127,.68));
  }
  .pi257-flow footer{grid-column:1}
  .pi257-object{margin-top:44px}
  .pi257-object-head{grid-template-columns:1fr;gap:9px;padding:20px 18px}
  .pi257-object-axis li{padding:23px 18px 25px}
  .pi257-step-number{margin-bottom:18px}
  .pi257-object figcaption{padding:17px 18px;font-size:.86rem}
}

@media(max-width:480px){
  .pi257-section{padding:58px 0 64px}
  .pi257-object-axis li{padding-inline:16px}
}

@media(prefers-reduced-motion:reduce){
  .pi257-page *,
  .pi257-page *::before,
  .pi257-page *::after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }
}

/* Relevante UI-Texte bleiben mindestens 11 px. */
.pi257-page .hero-gold-claim,
.pi257-page .detail-page-nav__label,
.pi257-page .detail-page-next-label{
  font-size:max(11px,.69rem)!important;
}