/* Produktseite: dieselbe ruhige Typografie und Bildbehandlung wie die Startseite. */
.how-eyebrow{margin:0 0 .85rem;color:var(--forest);font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.how-hero{display:grid;gap:2.5rem;align-items:center;padding-block:clamp(3.5rem,6vw,6rem)}
.how-hero__copy h1{max-width:15ch;font-family:var(--sans);font-size:clamp(2.65rem,5vw,4.75rem);font-weight:700;line-height:1.04;letter-spacing:-.055em}
.how-hero__copy h1 em{display:block;margin-top:.14em;color:var(--forest);font-family:var(--serif);font-weight:400;letter-spacing:-.035em}
.how-hero__copy .lead{max-width:34rem;margin:1.6rem 0 1.3rem;font-size:clamp(1.08rem,1.5vw,1.23rem)}
.how-hero__link{font-size:.94rem;font-weight:600}
.how-hero__figure,.how-figure{margin:0}
.how-hero__figure img,.how-figure img{width:100%;height:auto;aspect-ratio:1672/941;object-fit:cover;border-radius:1.2rem;background:#f8ecdc;box-shadow:0 1.6rem 3rem -1.6rem rgba(41,68,55,.35),0 0 0 1px rgba(41,68,55,.06)}
.how-rules,.how-feeds,.how-confirmation,.how-plan,.how-child,.how-closing{padding-block:clamp(3.5rem,6vw,5.75rem)}
.how-rules .section-head{margin-bottom:2.5rem}
.how-rules .h2,.how-feeds .h2,.how-confirmation .h2,.how-plan .h2,.how-child .h2,.how-closing .h2{font-family:var(--sans);font-size:clamp(1.85rem,3.4vw,2.8rem);font-weight:700;letter-spacing:-.045em;line-height:1.12}
.how-rule-grid{display:grid;gap:1.8rem}
.how-rule{padding-top:1.25rem;border-top:2px solid var(--sage-line)}
.how-rule span{color:var(--forest);font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.how-rule h3{margin:.75rem 0 .45rem;font-family:var(--sans);font-size:1.17rem;font-weight:700;letter-spacing:-.02em}
.how-rule p{max-width:23rem;color:var(--ink-2);font-size:.96rem;line-height:1.55}
.how-rules__note{max-width:48rem;margin:2rem 0 0;color:var(--ink-2);font-size:.94rem}
.how-feeds .split,.how-confirmation .split,.how-plan .split,.how-child .split{align-items:center}
.how-feeds .lead,.how-confirmation .lead,.how-plan .lead,.how-child .lead{max-width:32rem}
.how-feeds .split>div>p:not(.how-eyebrow),.how-confirmation .split>div>p:not(.how-eyebrow),.how-plan .split>div>p:not(.how-eyebrow),.how-child .split>div>p:not(.how-eyebrow){line-height:1.55}
.how-feeds .how-figure{margin-top:0}
.how-status{padding:clamp(1.4rem,3vw,2.2rem);border:1px solid var(--line-strong);border-radius:var(--radius-lg);background:var(--paper-alt);box-shadow:var(--shadow)}
.how-status__label{margin:0 0 1.25rem;color:var(--forest);font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.how-status__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1.5rem;padding:1rem 1.1rem;border:1px solid var(--line-strong);border-radius:.9rem;background:#fff;color:var(--ink-2);font-size:.94rem}
.how-status__row span:last-child{color:var(--ink-3)}
.how-status__row--active{border-color:var(--sage-line);background:var(--sage-soft)}
.how-status__row--active strong{color:var(--forest)}
.how-status__arrow{margin:.35rem 0;text-align:center;color:var(--sage-ink);font-size:1.4rem;line-height:1.2}
.how-status__caption,.how-example-caption,.how-child__caption{margin:1rem 0 0;color:var(--ink-3);font-size:.78rem;line-height:1.45}
.how-plan__figure{margin-top:2rem}
.how-plan__example{padding:clamp(1.4rem,3vw,2.2rem);border-color:var(--line-strong);background:var(--paper-alt)}
.how-plan__goal{margin:0 0 1.5rem;color:var(--ink-2);font-size:.92rem}
.how-plan__bars{display:grid;gap:1.25rem}
.how-plan__bars .ui-row{margin-bottom:.4rem}
.how-plan__bars .ui-bar{background:var(--sage-soft)}
.how-child .how-eyebrow{color:#b8d2bc}
.how-child .lead,.how-child .split>div:first-child>p:not(.how-eyebrow){color:var(--on-dark-2)}
.how-child__example{padding:clamp(1.4rem,3vw,2.2rem);border-radius:var(--radius-lg);background:var(--paper-alt);color:var(--ink);box-shadow:0 1.25rem 3rem -2rem rgba(0,0,0,.3)}
.how-child__example .how-status__label{color:var(--forest)}
.how-child__time,.how-child__next{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.35rem 1.5rem;align-items:baseline}
.how-child__time{margin:0 0 .75rem;font-size:.97rem}
.how-child__time strong{color:var(--forest);font-size:1.25rem}
.how-child__next{margin-top:1.5rem;padding-top:1.15rem;border-top:1px solid var(--line);font-size:.93rem}
.how-child__next strong{color:var(--forest)}
.how-child__caption{color:var(--ink-3)}
.how-closing{display:flex;flex-direction:column;align-items:flex-start;gap:1.7rem}
.how-closing p:not(.how-eyebrow){max-width:37rem;margin:.9rem 0 0;color:var(--ink-2)}
.how-closing .actions{margin:0}
@media(min-width:54em){.how-hero{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2.5rem,5vw,5rem)}.how-rule-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.8rem,3vw,3rem)}.how-closing{flex-direction:row;align-items:center;justify-content:space-between}.how-closing .actions{flex:none}}
