/* Egg chapter: page-owned compositions around the shared chapter and step system. */
.egg-hero { min-height: min(76vh,750px); }
.egg-hero .c-hero__media img { object-position: 61% 65%; }
.egg-hero::before { background: linear-gradient(90deg,rgba(16,15,13,.89),rgba(16,15,13,.42) 61%,rgba(16,15,13,.13)),linear-gradient(0deg,rgba(16,15,13,.4),transparent 50%); }
.egg-hero .kop1 { max-width: 12ch; }
.egg-hero .c-prog { margin-top: 18px; }
.egg-intro__heading { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,5fr); gap:var(--col-gap); align-items:end; margin-bottom:clamp(34px,5vw,72px); }
.egg-intro .s-sectionhead { margin:0; }
.egg-intro__heading > .intro { max-width:43ch; margin:0 0 6px; color:var(--mist); }
.egg-observed { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,2vw,30px); }
.egg-observed__frame,.egg-water figure { margin:0; }
.egg-observed__frame { min-width:0; }
.egg-observed__frame img { display:block; width:100%; height:clamp(250px,32vw,455px); object-fit:cover; filter:brightness(.9) saturate(.93); }
.egg-observed__frame:first-child img { object-position:60% 50%; }
.egg-observed__frame:nth-child(2) img { object-position:50% 57%; }
.egg-observed__frame:nth-child(3) img { object-position:50% 48%; }
.egg-observed__frame figcaption { display:grid; gap:8px; margin-top:15px; padding-top:13px; border-top:1px solid rgba(239,236,236,.25); color:var(--mist); font-size:var(--fs-caption); line-height:1.45; }
.egg-observed__frame figcaption span { color:var(--oker-licht); font-size:11px; font-weight:700; letter-spacing:.14em; }
.egg-water figcaption { margin-top:12px; font-size:var(--fs-caption); line-height:1.45; color:var(--mist); }
.egg-sequence .s-sectionhead { max-width: 900px; }
.egg-sequence__truth { max-width:60ch; margin:0 0 25px; color:var(--inkt-zacht); font-size:14px; line-height:1.5; }
.egg-sequence .c-steps { max-width: 1120px; }
.egg-sequence .c-steps__media img { height: auto; }
.egg-sequence .c-steps__item:first-child .c-steps__media img { aspect-ratio: 3/2; object-position: 50% 72%; }
.egg-sequence #collection-stage .c-steps__media img { aspect-ratio: 4/3; object-position: 50% 53%; }
.egg-sequence #incubation-stage .c-steps__media img { aspect-ratio: 4/3; object-position: 50% 63%; }
.egg-water__layout { display: grid; grid-template-columns: minmax(0,6fr) minmax(0,5fr); gap: var(--col-gap); align-items: center; }
.egg-water img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; filter: brightness(.86) saturate(.9); }
.egg-water__layout > div { display: grid; gap: 24px; justify-items: start; }
.egg-water__layout > div > p:not(.label) { color: var(--mist); max-width: 52ch; margin: 0; }
.egg-water .kop2 { max-width: 11ch; }
.egg-close .s-textlink { margin-top: 10px; }
.egg-hero__link { display:inline-flex; align-items:center; gap:18px; width:fit-content; min-height:44px; color:var(--wit); border-bottom:1px solid var(--oker-licht); font-size:13px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; text-decoration:none; }
.egg-hero__link span { color:var(--oker-licht); font-size:23px; line-height:1; }
.egg-sequence { scroll-margin-top:var(--kop-h); }
.egg-rail { position:sticky; top:var(--kop-h); z-index:4; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin:0 0 clamp(40px,6vw,80px); border-top:1px solid var(--steen-lijn); border-bottom:1px solid var(--steen-lijn); background:var(--steen); box-shadow:0 12px 25px rgba(23,21,15,.07); }
.egg-rail__fill { position:absolute; top:-2px; left:0; width:100%; height:3px; background:var(--oker-diep); transform:scaleX(0); transform-origin:left; pointer-events:none; }
.egg-rail__marker { display:none; position:absolute; z-index:5; top:-13px; left:12.5%; width:16px; height:22px; margin-left:-8px; border:2px solid var(--oker-diep); border-radius:55% 55% 48% 48%; background:var(--steen); box-shadow:0 0 0 4px var(--steen); pointer-events:none; }
.egg-motion .egg-rail__marker { display:block; will-change:transform; }
.egg-rail a { display:flex; align-items:center; min-height:60px; padding:8px 18px; color:var(--inkt-zacht); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; border-right:1px solid var(--steen-lijn); }
.egg-rail a:last-child { border-right:0; }
.egg-rail a[aria-current="step"] { color:var(--inkt); background:var(--steen-2); }
.egg-rail a:focus-visible,.egg-hero__link:focus-visible { outline:2px solid var(--oker-diep); outline-offset:3px; }
.egg-sequence .c-steps__item { scroll-margin-top:calc(var(--kop-h) + 80px); min-height:clamp(220px,24vw,360px); padding-bottom:clamp(36px,4vw,62px); border-bottom:1px solid var(--steen-lijn); }
.egg-sequence .c-steps__body::before { display:none; }
.egg-step__number { color:var(--oker-diep); font-size:12px; font-weight:700; letter-spacing:.14em; }
.egg-sequence .c-steps__title { font-size:clamp(26px,3.5vw,47px); }
.egg-sequence .c-steps__body > p { font-size:clamp(16px,1.4vw,18px); line-height:1.6; }
.egg-sequence .c-steps__body > .egg-step__note { max-width:52ch; margin-top:14px; padding-left:18px; border-left:2px solid var(--oker-diep); font-size:14px; }
.egg-sequence .c-steps__media img { object-fit:cover; }
@media(max-width:900px){
 .egg-intro__heading,.egg-water__layout { grid-template-columns:1fr; }
 .egg-observed { gap:14px; }
 .egg-observed__frame img { height:clamp(230px,35vw,360px); }
 .egg-water figure { max-width: 700px; }
}
@media(max-width:560px){
 .egg-hero { min-height: 690px; }
 .egg-hero .c-hero__media img { object-position: 54% 65%; }
 .egg-hero::before { background: linear-gradient(0deg,rgba(16,15,13,.9),rgba(16,15,13,.3) 84%); }
 .egg-observed { grid-template-columns:1fr; gap:35px; }
 .egg-observed__frame img { height:clamp(255px,75vw,350px); }
 .egg-observed__frame figcaption { margin-top:10px; padding-top:10px; }
 .egg-rail { margin-inline:calc(-1 * var(--gutter)); overflow-x:auto; grid-template-columns:repeat(4,minmax(125px,1fr)); }
 .egg-rail a { min-height:52px; padding-inline:13px; font-size:11px; }
 .egg-sequence .c-steps__item { min-height:0; }
}
@media(prefers-reduced-motion:reduce){.egg-rail__fill { display:none; }}