/* Cinematic enhancement of the readable, fully visible family album. */
.story-cover{padding:0;background:#e9dfcf}
.story-cover-stage{position:relative;min-height:calc(100svh - var(--nav-height));padding:65px 6% 70px;display:flex;align-items:center;background:radial-gradient(ellipse at 72% 42%,#fff9ec,transparent 54%),linear-gradient(110deg,#e9dfcf,#f3ece0 45%,#e6d9c4)}
.story-cover-stage:after{content:'';position:absolute;inset:20px;border:1px solid #ac916140;pointer-events:none}
.story-cover-inner{max-width:1370px;width:100%;min-height:520px;position:relative;z-index:1;perspective:1400px;gap:6%}
.story-cover h1{font-size:clamp(50px,5.8vw,86px);line-height:1.08;letter-spacing:-.06em;margin:16px 0 28px}
.story-cover-copy{z-index:5;transform:translate3d(0,calc(var(--cover-p,0) * -60px),0)}
.story-cover-collage{min-height:490px;transform-style:preserve-3d;perspective:1400px}
.story-cinema .story-cover-collage{opacity:var(--enter-p,1);transform:translate3d(0,calc((1 - var(--enter-p,1)) * 80px),0) rotateY(calc((1 - var(--enter-p,1)) * -24deg));transform-origin:left center}
.story-cover-photo{box-shadow:0 24px 55px #49341b30,0 1px 3px #49341b2b;backface-visibility:hidden;will-change:transform;animation:none!important;transition:none!important}
.story-motion .story-cover-photo{opacity:1!important}
.story-motion .story-cover-photo-elita{transform:translate3d(calc(var(--cover-p,0) * -60px),calc(var(--cover-p,0) * -95px),0) rotate(calc(-8deg - var(--cover-p,0) * 9deg)) rotateY(calc(var(--cover-p,0) * 17deg))}
.story-motion .story-cover-photo-recipe{transform:translate3d(calc(var(--cover-p,0) * -65px),calc(var(--cover-p,0) * 30px),60px) rotate(calc(5deg - var(--cover-p,0) * 18deg))}
.story-motion .story-cover-photo-oma{transform:translate3d(calc(var(--cover-p,0) * 55px),calc(var(--cover-p,0) * -15px),30px) rotate(calc(8deg + var(--cover-p,0) * 10deg)) rotateY(calc(var(--cover-p,0) * -13deg))}
.story-scroll-cue{display:flex;align-items:center;gap:13px;font-size:10px!important;color:var(--muted);letter-spacing:.06em;margin-top:26px}
.story-scroll-cue>span[aria-hidden]{display:block;width:1px;height:32px;background:#a68b6090;position:relative;overflow:hidden}
.story-scroll-cue>span[aria-hidden]:after{content:'';position:absolute;top:-20px;width:1px;height:20px;background:var(--ink);animation:story-scroll-line 1.7s ease-in-out infinite}
@keyframes story-scroll-line{to{transform:translateY(65px)}}
.story-index{align-items:center;gap:30px;padding:0 4%;overflow-y:hidden}
.story-index-kicker{font-size:9px!important;color:var(--accent);text-transform:uppercase;letter-spacing:.15em;white-space:nowrap;margin:0!important}
.story-index-inner{flex:1}.story-index a{min-height:74px;padding:20px 13px;font-size:11px}
.story-progress{display:block;position:absolute;height:2px;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none}.story-progress>span{display:block;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;opacity:.55}
.story-index a:after{content:'';position:absolute;inset:auto 13px 0;height:2px;background:var(--accent);transform:scaleX(var(--chapter-p,0));transform-origin:left}
.story-index a[aria-current=location]:after{inset:auto 13px 0;transform:scaleX(max(.08,var(--chapter-p,0)))}
.story-index a .story-index-number{transition:color .25s,background .25s;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;flex-shrink:0}
.story-index a[aria-current=location] .story-index-number{color:var(--ink);background:#b99b6d2e}
.story-index a.story-chapter-complete .story-index-number{color:var(--accent)}
.story-spread{scroll-margin-top:calc(var(--nav-height) + var(--index-height));background:var(--paper)!important;border-bottom:none}.story-spread:before{display:none}
.story-scene{position:relative}
.story-stage{position:relative;min-height:650px;display:flex;align-items:center;overflow:hidden;background:radial-gradient(ellipse at 90% 10%,#dbc9ad44,transparent 50%),var(--paper)}
.story-stage:after{content:'';position:absolute;inset:20px;border:1px solid #b8a78e50;pointer-events:none;z-index:0}
.story-stage-inner{position:relative;z-index:2;max-width:1320px;width:100%;margin:auto;padding:50px 6.5%;perspective:1700px}
.story-era{position:absolute;font-family:var(--font-display);font-size:clamp(130px,22vw,340px);line-height:1;letter-spacing:-.05em;right:-.015em;top:9%;color:#99836413;pointer-events:none;transform:translate3d(calc((1 - var(--scene-p,0)) * 70px),calc(var(--scene-p,0) * -45px),0);white-space:nowrap;z-index:0}
.story-heading{max-width:850px;margin-bottom:27px;padding-left:60px}.story-heading h2{font-size:clamp(33px,3.4vw,50px);line-height:1.17}.story-heading .story-eyebrow{font-size:9px;margin-bottom:11px}.story-number{font-size:36px}
.story-spread-layout{gap:10%;transform-style:preserve-3d}.story-text p{font-size:14px;line-height:1.9}.story-text p:first-child{font-size:16px;line-height:1.85}
.story-media{perspective:1400px;transform-style:preserve-3d;position:relative}
.story-media:before,.story-media:after{content:'';position:absolute;inset:5px 2px -5px;background:#e0d3bc;border:1px solid #bca88855;transform:translateY(calc(var(--photo-lift,0) * 6px)) rotate(calc(-3deg - var(--photo-lift,0) * 1.5deg));z-index:-1}.story-media:after{transform:translateY(calc(var(--photo-lift,0) * 3px)) rotate(calc(3deg + var(--photo-lift,0) * 1deg));background:#efe3cf;inset:4px 0 -4px}
.story-media figure{--photo-direction:1;--photo-angle:-1deg;transform-origin:50% 65%;box-shadow:0 calc(18px + var(--photo-lift,0) * 20px) calc(35px + var(--photo-lift,0) * 18px) #352b2130;backface-visibility:hidden;transform:rotate(-1deg)}.story-media img{height:310px;max-height:none;object-fit:contain;background:#ebe2d3}
#story-family .story-stage,#story-generations .story-stage{background:radial-gradient(ellipse at 75% 15%,#6f563b55,transparent 60%),#352b22;color:#f4ead8}
#story-family .story-stage .story-eyebrow,#story-generations .story-stage .story-eyebrow{color:#cfb386}
#story-family .story-heading h2 em,#story-generations .story-heading h2 em{color:#d6ba89}
#story-family .story-text,#story-generations .story-text{color:#d7c9b5}
#story-family .story-text p:first-child,#story-generations .story-text p:first-child{color:#f4ead8}
#story-family .story-era,#story-generations .story-era{color:#e4c99a12}
#story-family .story-media figure,#story-generations .story-media figure{--photo-direction:-1;--photo-angle:1deg;transform-origin:50% 65%}
.story-archive{position:relative;padding:66px 5.5% 78px;max-width:1440px;margin:auto;background:var(--paper)}
.story-archive-title{display:flex;align-items:center;gap:22px;margin:0 0 32px;font-size:12px!important;letter-spacing:.1em;text-transform:uppercase;font-family:var(--font-body);color:var(--muted);line-height:1.5}
.story-archive-title:after{content:'';height:1px;background:var(--line);flex:1}
.story-thumbnails{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 23px;perspective:1500px;padding:0}
.story-thumbnails figure{--tilt:-2deg;border:1px solid #c6b59955;position:relative;box-shadow:0 7px 20px #49341b20;transform:rotate(var(--tilt));transition:transform .5s,box-shadow .5s}
.story-thumbnails figure:nth-child(3n+2){--tilt:2deg}.story-thumbnails figure:nth-child(4n){--tilt:1deg;margin-top:20px}.story-thumbnails figure:nth-child(4n+2){margin-top:12px}
.story-thumbnails figure:before{content:'';position:absolute;left:34%;top:-10px;width:32%;height:21px;background:#bdac8870;transform:rotate(-3deg);z-index:2;pointer-events:none}
.story-thumbnails img{height:210px;aspect-ratio:auto;object-fit:contain;background:#ebe3d6}.story-thumbnails figcaption{font-size:10px!important;line-height:1.6!important;padding:13px 2px;min-height:52px}
.story-thumbnails figure:hover,.story-thumbnails figure:focus-within{transform:translateY(-9px) rotate(0);box-shadow:0 20px 30px #49341b27;z-index:4}
.story-photo-button{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;position:relative;color:inherit}
.story-photo-button img{width:100%;display:block}.story-photo-button:after{content:'+';position:absolute;right:9px;bottom:9px;width:30px;height:30px;display:grid;place-items:center;color:#fff9ee;background:#30271ead;border:1px solid #fff7e166;border-radius:50%;font:300 21px/1 var(--font-body);opacity:0;transition:opacity .25s}
.story-photo-button:hover:after,.story-photo-button:focus-visible:after{opacity:1}
.story-milestones{max-width:1250px;margin:0 auto;padding:20px 6% 75px;border:0;gap:40px}.story-milestone h3{font-size:26px;margin:0 0 22px}.story-milestone img{height:280px;object-fit:contain}.story-milestone figure{transform:rotate(-1deg)}.story-milestone:nth-child(2) figure{transform:rotate(1deg)}
.story-album .story-closing{position:relative;padding:110px 7% 120px;overflow:hidden}.story-closing:before{content:'Elsje';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-8deg);font:italic 25vw/1 var(--font-display);color:#d4b8870a;pointer-events:none}.story-closing-inner{position:relative}.story-closing h2{font-size:clamp(36px,4.8vw,65px)}.story-closing h2 em{color:#d6ba89}
/* Scroll driven scenes: content stays in normal document order. */
.story-cinema .story-cover{min-height:160svh}.story-cinema .story-cover-stage{position:sticky;top:var(--nav-height)}
.story-cinema .story-scene{height:165svh;min-height:1070px}.story-cinema .story-stage{position:sticky;top:calc(var(--nav-height) + var(--index-height));height:calc(100svh - var(--nav-height) - var(--index-height));min-height:555px}
.story-cinema .story-media figure,.story-cinema #story-family .story-media figure,.story-cinema #story-generations .story-media figure{transform:translate3d(calc(var(--turn,0) * var(--photo-direction) * 24px),calc(var(--turn,0) * 26px - var(--photo-lift,0) * 18px),calc(var(--photo-lift,0) * 48px)) rotateY(calc(var(--turn,0) * var(--photo-direction) * -24deg)) rotateX(calc(var(--turn,0) * 7deg)) rotate(calc(var(--photo-angle) - var(--turn,0) * var(--photo-direction) * 3deg));will-change:transform}
.story-cinema .story-media .story-photo-button:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 25%,#fff8e850 43%,#fffdfb85 50%,transparent 67%);background-size:260% 100%;background-position:calc((1 - var(--photo-entry,1)) * 100%) 0;opacity:calc(var(--photo-lift,0) * .55)}
.story-media .story-photo-button:after{z-index:2}
.story-unpinned .story-cover{min-height:0}.story-unpinned .story-cover-stage{position:relative;top:auto}.story-unpinned .story-scene{height:auto;min-height:0}.story-unpinned .story-stage{position:relative;top:auto;height:auto;min-height:0}
.story-motion .story-cover-copy{opacity:1!important;transition:none!important;transform:translate3d(0,calc(var(--cover-p,0) * -60px),0)}
.story-motion .story-heading,.story-motion .story-text,.story-motion .story-media,.story-motion .story-archive-title,.story-motion .story-milestone,.story-motion .story-closing-inner{opacity:1!important;transform:none!important;transition:none!important}
.story-motion .story-thumbnails figure{opacity:0;transform:translate3d(0,32px,0) rotateX(6deg) rotate(calc(var(--tilt) * 1.5));transition:transform .75s cubic-bezier(.16,.7,.18,1),opacity .45s;transition-delay:var(--story-delay,0ms)}
.story-motion .story-thumbnails figure.story-visible{opacity:1;transform:translate3d(0,0,0) rotateX(0deg) rotate(var(--tilt))}
.story-motion .story-thumbnails figure.story-visible:hover,.story-motion .story-thumbnails figure:focus-within{opacity:1;transform:translateY(-6px) rotate(0);transition-delay:0ms}
.story-lightbox{border:0;padding:0;background:transparent;width:min(94vw,1500px);max-width:none;max-height:94svh;color:#fff8eb;overflow:visible}
.story-lightbox::backdrop{background:#1c1711f2;backdrop-filter:blur(12px)}.story-lightbox[open]{animation:story-viewer-in .3s ease both}
.story-lightbox-close{position:absolute;right:0;top:-2px;border:1px solid #d8c7a355;background:#32281e;color:#fff8eb;padding:10px 17px;cursor:pointer;font:12px var(--font-body);z-index:2}
.story-lightbox figure{margin:52px 0 0}.story-lightbox img{width:100%;height:70svh;object-fit:contain;background:transparent}.story-lightbox figcaption{text-align:center;font-size:12px;line-height:1.6;color:#dbcebd;max-width:780px;margin:18px auto}
.story-lightbox-nav{display:flex;align-items:center;justify-content:center;gap:25px}.story-lightbox-nav button{border:1px solid #d8c7a355;background:transparent;color:#f7eddd;padding:12px 22px;font:12px var(--font-body);cursor:pointer}.story-lightbox-nav span{font-size:11px;color:#c9b79a;min-width:54px;text-align:center}
.story-photo-open{overflow:hidden}

@keyframes story-viewer-in{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@media(min-width:1600px){.story-stage-inner{padding-left:30px;padding-right:30px}.story-cover-stage{padding-left:max(6%,calc((100% - 1370px)/2));padding-right:max(6%,calc((100% - 1370px)/2))}.story-media img{height:350px}}
@media(max-width:1100px){.story-cover h1{font-size:58px}.story-cover-collage{min-height:430px}.story-cover-photo-recipe{top:198px}.story-cover-photo-oma{top:165px}.story-index-kicker{display:none}.story-stage-inner{padding:35px 6%}.story-media img{height:270px}.story-heading{margin-bottom:25px}.story-thumbnails{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.story-cover h1{font-size:47px}.story-cover-collage{min-height:390px}.story-cover-photo-recipe{top:170px}.story-cover-photo-oma{top:142px}.story-heading h2{font-size:35px}.story-text p{font-size:13px}.story-text p:first-child{font-size:15px}.story-spread-layout{gap:7%}.story-index a{font-size:10px;gap:9px;padding:18px 9px}.story-media img{height:240px}}
@media(max-width:650px){.story-cover-stage{padding:42px 7% 30px;min-height:900px}.story-cover-stage:after{inset:11px}.story-cover-inner{min-height:0;gap:24px}.story-cover-copy{transform:translateY(calc(var(--cover-p,0) * -20px))}.story-cover h1{font-size:44px;margin:10px 0 19px}.story-cover-collage{min-height:365px;max-width:360px;margin:12px auto 0}.story-cover-photo-elita{width:74%;top:8px;left:3%}.story-cover-photo-recipe{width:37%;top:165px;left:7%}.story-cover-photo-oma{width:41%;top:133px;right:4%}.story-scroll-cue{margin-top:18px;font-size:9px!important}.story-cinema .story-cover{min-height:0}.story-cinema .story-cover-stage{position:relative;top:auto}.story-index{gap:0;padding:0 5%}.story-index-inner{flex:none}.story-index a{flex:0 0 140px;min-height:65px;padding:16px 10px;font-size:10px}.story-stage{min-height:0}.story-stage:after{inset:11px}.story-stage-inner{padding:40px 8% 42px}.story-heading{padding-left:39px;margin-bottom:25px}.story-number{font-size:27px}.story-heading h2{font-size:30px}.story-heading .story-eyebrow{font-size:8px}.story-spread-layout{gap:31px}.story-text p{font-size:13px;line-height:1.85}.story-text p:first-child{font-size:15px}.story-media img{height:280px}.story-era{font-size:34vw;top:24%;right:-4%}.story-cinema .story-scene{height:auto;min-height:0}.story-cinema .story-stage{position:relative;top:auto;height:auto;min-height:0}.story-archive{padding:37px 6% 47px}.story-archive-title{font-size:9px!important;letter-spacing:.08em;gap:15px;margin-bottom:25px}.story-thumbnails{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 16px}.story-thumbnails img{height:170px}.story-thumbnails figcaption{font-size:9px!important;padding:11px 1px;min-height:55px}.story-thumbnails figure:nth-child(4n),.story-thumbnails figure:nth-child(4n+2){margin-top:13px}.story-photo-button:after{opacity:1;width:24px;height:24px;font-size:17px;right:5px;bottom:5px}.story-milestones{padding:0 7% 48px;gap:32px}.story-milestone h3{font-size:23px}.story-milestone img{height:240px}.story-album .story-closing{padding:66px 8% 76px}.story-closing h2{font-size:37px}.story-lightbox{width:92vw}.story-lightbox img{height:62svh}.story-lightbox-nav{gap:13px}.story-lightbox-nav button{padding:12px 16px;font-size:11px}.story-lightbox figcaption{font-size:11px;margin:16px auto}}
@media(max-width:360px){.story-cover-stage{padding-top:35px;min-height:830px}.story-cover h1{font-size:38px}.story-cover-collage{min-height:325px}.story-cover-photo-recipe{top:147px}.story-cover-photo-oma{top:123px}.story-heading h2{font-size:27px}.story-media img{height:240px}.story-thumbnails img{height:145px}.story-thumbnails{gap:21px 12px}}
@media(max-width:650px){
  .story-motion .story-cover-copy{transform:none!important}
  .story-cinema .story-media figure,.story-cinema #story-family .story-media figure,.story-cinema #story-generations .story-media figure{transform:translate3d(0,calc(var(--turn,0) * 16px - var(--photo-lift,0) * 8px),0) rotate(calc(var(--photo-angle) - var(--turn,0) * var(--photo-direction) * 2deg))}
  .story-index a:after,.story-index a[aria-current=location]:after{left:10px;right:10px}
  .story-motion .story-thumbnails figure{transform:translate3d(0,22px,0) rotate(var(--tilt));transition-duration:.6s,.35s}
}
@media(max-height:780px) and (min-width:651px){.story-cinema .story-stage{min-height:470px}.story-stage-inner{padding-top:24px;padding-bottom:24px}.story-heading h2{font-size:33px}.story-media img{height:210px}.story-heading{margin-bottom:20px}.story-text p:first-child{font-size:14px}.story-text p{font-size:13px}.story-cover h1{font-size:55px}.story-cover-stage{padding-top:35px;padding-bottom:35px}.story-cover-inner{min-height:460px}}
@media(prefers-reduced-motion:reduce){.story-cover-copy{transform:none}.story-cover-photo-elita{transform:rotate(-8deg)}.story-cover-photo-recipe{transform:rotate(5deg)}.story-cover-photo-oma{transform:rotate(8deg)}.story-motion .story-thumbnails figure{opacity:1;transform:none}}

@media(max-height:600px){.story-lightbox{overflow:auto}.story-lightbox img{height:max(80px,calc(94svh - 180px))}}