/* Real photographs, kept whole, in a little paper scrapbook. */
html{scrollbar-gutter:stable}
.portrait-arch img{aspect-ratio:.704;object-fit:cover;object-position:center 53%}
.memory-photo img{aspect-ratio:.77;object-fit:cover;object-position:center 65%}
.family-story{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:center;gap:clamp(45px,7vw,100px);max-width:1080px}
.family-letter{max-width:570px}
.family-portrait{position:relative;margin:0;background:#fcf9ef;padding:12px 12px 0;transform:rotate(-3deg);box-shadow:0 12px 35px #74533b16;border:1px solid #e8dfcc;max-width:370px;justify-self:center}
.family-portrait img{width:100%;height:auto;border-radius:160px 160px 3px 3px}
.family-portrait figcaption{font:500 17px/1.5 var(--serif);text-align:center;color:var(--brown);padding:21px 8px 24px}
.milestones-section{padding:84px 0 82px;background:#eee7d9;border-block:1px solid #ddd4bf}
.scrapbook-wrap{max-width:1080px}
.milestones-heading{padding-right:110px}
.milestones-heading .eyebrow{margin-bottom:17px}
.milestones-heading h2{font-size:clamp(37px,4.5vw,56px);margin-bottom:20px}
.scrapbook-intro{max-width:480px;font-size:14px;line-height:1.9;color:var(--muted);margin-bottom:16px}
.scrapbook-hint{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--brown);margin-bottom:42px}
.scrapbook-hint>span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #bcaf90;border-radius:50%;font-size:15px}
.scrapbook-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 27px;align-items:start;padding:8px 4px}
.scrapbook-card{position:relative;min-width:0;margin:0;padding:11px 11px 20px;border:1px solid #e2d7c0;border-radius:4px;background:#fcf9ef;box-shadow:0 8px 20px #74533b0c;rotate:-1.2deg}
.scrapbook-card:nth-child(3n+2){rotate:1.2deg}
.scrapbook-card:nth-child(3n){rotate:-.4deg}
.scrapbook-card::before{content:'';position:absolute;width:66px;height:18px;top:-9px;left:calc(50% - 33px);z-index:1;background:#bbc39d9c;rotate:-5deg;clip-path:polygon(2% 0,98% 4%,96% 28%,100% 57%,97% 100%,0 94%,4% 62%,1% 30%);pointer-events:none}
.scrapbook-card:nth-child(even)::before{background:#d5b98d99;rotate:4deg}
.scrapbook-photo{display:block;position:relative;border-radius:3px;overflow:hidden;background:#fbf2dc;outline-offset:5px;text-decoration:none}
.scrapbook-photo img{width:100%;aspect-ratio:4/5;object-fit:contain}
.photo-expand{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--forest);background:#fffaf0e8;border:1px solid #f5f1e1;font-size:20px;transition:background .2s}
.scrapbook-photo:hover .photo-expand{background:#dce6c9}
.scrapbook-card figcaption{padding:19px 9px 0}
.memory-kicker{display:flex;gap:9px;align-items:center;font-size:7px;line-height:1.6;font-weight:600;letter-spacing:.95px;color:var(--brown);margin-bottom:10px}
.memory-kicker>span{font:500 16px/1 var(--serif);color:#9a8c68;letter-spacing:0}
.scrapbook-card h3{font:500 25px/1.16 var(--serif);letter-spacing:-.65px;color:var(--forest);margin:0 0 9px}
.scrapbook-card p{font-size:12px;line-height:1.7;color:var(--muted);margin:0}
.scrapbook-ending{display:flex;align-items:center;justify-content:center;gap:12px;font:500 19px/1.5 var(--serif);color:var(--brown);text-align:center;margin:43px 0 0}
.scrapbook-ending svg{width:18px;height:20px;flex:none;color:#829568;rotate:-15deg}
html.photo-active{overflow:hidden}
.photo-dialog{padding:0;border:1px solid #e6dcc4;border-radius:14px;background:#fbf7eb;color:var(--forest);width:min(780px,calc(100% - 40px));max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;box-shadow:0 25px 90px #10281f50}
.photo-dialog::backdrop{background:#152f27dc;backdrop-filter:blur(7px)}
.photo-viewer{padding:13px 22px 18px}
.photo-viewer-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.photo-viewer-bar>span{font-size:9px;letter-spacing:1.3px;color:var(--brown)}
.photo-dialog button{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid #c2cbae;border-radius:50%;background:transparent;color:var(--forest);cursor:pointer;font:400 23px/1 var(--sans)}
.photo-dialog button:hover{background:#e1e7d4}
.photo-dialog .photo-close{width:36px;height:36px;font-size:15px}
.photo-stage{display:flex;align-items:center;justify-content:center;height:min(58dvh,650px);border-radius:6px;background:#efe9d950;overflow:hidden}
.photo-stage img{width:100%;height:100%;object-fit:contain}
.photo-viewer-caption{text-align:center;padding:17px 0 12px}
.photo-viewer-caption h2{font-size:29px;line-height:1.15;margin-bottom:7px;letter-spacing:-.8px}
.photo-viewer-caption p{font-size:12px;line-height:1.6;color:var(--muted);margin:0}
.photo-viewer-nav{display:flex;justify-content:center;align-items:center;gap:23px}
.photo-viewer-nav>span{font-size:11px;font-variant-numeric:tabular-nums;color:var(--brown);min-width:40px;text-align:center}
@media(min-width:761px){.family-letter .little-heart{margin-bottom:17px}.family-letter h2{font-size:42px}.family-letter>p:not(.eyebrow){font-size:13px}}
@media(max-width:760px){
  .family-story{grid-template-columns:1fr;gap:45px}.family-letter{grid-row:1}.family-portrait{max-width:300px;width:calc(100% - 26px)}
  .family-portrait figcaption{font-size:15px;padding:18px 5px 21px}
  .milestones-section{padding:62px 0}.milestones-heading{padding-right:32px}.milestones-heading h2{font-size:38px}
  .scrapbook-intro{font-size:12px}.scrapbook-hint{font-size:10px;margin-bottom:32px}
  .scrapbook-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 15px;padding:5px 0}
  .scrapbook-card{padding:7px 7px 15px;rotate:-1deg}.scrapbook-card:nth-child(even){rotate:1deg}
  .scrapbook-card figcaption{padding:14px 3px 0}.scrapbook-card::before{width:48px;left:calc(50% - 24px);height:14px;top:-7px}
  .memory-kicker{font-size:6px;letter-spacing:.5px;gap:6px;align-items:start;margin-bottom:8px}.memory-kicker>span{font-size:13px}
  .scrapbook-card h3{font-size:20px;letter-spacing:-.5px;margin-bottom:7px}.scrapbook-card p{font-size:10px;line-height:1.65}
  .photo-expand{width:26px;height:26px;font-size:17px;right:6px;bottom:6px}
  .scrapbook-ending{font-size:16px;gap:8px;margin-top:32px}
  .photo-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}.photo-viewer{padding:10px 12px 15px}
  .photo-viewer-bar>span{font-size:8px;letter-spacing:1px}.photo-stage{height:55dvh}
  .photo-viewer-caption{padding:15px 0 12px}.photo-viewer-caption h2{font-size:25px}.photo-viewer-caption p{font-size:11px}
}
@media(max-width:360px){.scrapbook-grid{gap:24px 11px}.scrapbook-card{padding:5px 5px 13px}.scrapbook-card h3{font-size:18px}.memory-kicker{font-size:5.5px;letter-spacing:.3px}}
@media print{.photo-dialog,.photo-expand,.scrapbook-hint{display:none!important}.scrapbook-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.scrapbook-card{break-inside:avoid;rotate:none;box-shadow:none}.family-story{grid-template-columns:1fr 1fr}.family-portrait{max-width:220px}}

/* Three newer portraits share one composition; the original safari pair lead. */
.family-story{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:65px}
.family-portraits{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);gap:18px;align-items:center;max-width:460px}
.family-portraits .family-portrait{width:100%;max-width:none;min-width:0}
.family-portrait-main{grid-row:1 / span 2;grid-column:1;padding:9px 9px 0}
.family-portrait-main figcaption{font-size:14px;padding:16px 4px 20px}
.family-portrait-mini{grid-column:2;padding:7px 7px 0;transform:rotate(5deg)}
.family-portrait-mini:last-child{transform:rotate(-4deg)}
.family-portrait-mini img{border-radius:4px}
.family-portrait-mini figcaption{font-size:12px;padding:12px 0 14px;line-height:1.4}

/* A centered, touch-scrollable row keeps the next little adventure in view. */
.scrapbook-track{--memory-width:350px;position:relative;display:flex;align-items:center;gap:16px;width:100%;padding:30px max(0px,calc((100% - var(--memory-width))/2)) 36px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);outline-offset:-3px}
.scrapbook-track::-webkit-scrollbar{display:none}
.scrapbook-track .scrapbook-card{flex:0 0 var(--memory-width);scroll-snap-align:center;scroll-snap-stop:always;rotate:-5deg;padding:10px 10px 0;border:1px solid #b5bf9d;border-radius:24px;background:#faf5e8;overflow:hidden}
.scrapbook-track .scrapbook-card::before{display:none}
.scrapbook-track .scrapbook-card:nth-child(even){rotate:5deg}
.scrapbook-track.carousel-ready .scrapbook-card{scale:.88;opacity:.7;translate:0 10px;transition:scale .65s cubic-bezier(.2,.75,.25,1),opacity .65s ease,rotate .65s ease,translate .65s ease,box-shadow .65s ease}
.scrapbook-track.carousel-ready .scrapbook-card.is-current{scale:1;opacity:1;rotate:0deg;translate:0 -5px;box-shadow:0 20px 38px #514b342a}
.scrapbook-track .scrapbook-photo{border-radius:15px 15px 5px 5px}
.scrapbook-track .scrapbook-card:focus-within{opacity:1}
.scrapbook-track .scrapbook-card h3{font-size:26px;color:#fff8e8}
.scrapbook-track .scrapbook-card p{font-size:12px;color:#e4e9d5}
.scrapbook-track .scrapbook-card figcaption{min-height:141px;margin:10px -10px 0;padding:17px 24px 22px;background:#38543f;position:relative}
.scrapbook-track .memory-kicker{font-size:7px;letter-spacing:1.2px;color:#d8dfbc;margin-bottom:10px}
.scrapbook-track .memory-kicker>span{font-size:16px;color:#f4d896;border:1px solid #c7d4a960;border-radius:50%;width:28px;height:28px;display:grid;place-items:center}
.scrapbook-controls{margin-top:6px}
.scrapbook-nav{display:flex;align-items:center;justify-content:center;gap:20px;max-width:390px;margin:0 auto 12px}
.scrapbook-nav>button{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid #a6b58c;border-radius:50%;background:#f8f4e8;color:var(--forest);font-size:24px;cursor:pointer;transition:background .2s,translate .2s}
.scrapbook-nav>button:hover:not(:disabled){background:#dce5cb;translate:0 -2px}
.scrapbook-nav>button:disabled{opacity:.35;cursor:default}
.memory-position{text-align:center;margin:0;color:var(--brown);min-width:0;line-height:1.5}
.memory-position>span{display:block;font:500 13px/1.5 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:2px;min-width:65px}
.scrapbook-nav>.memory-auto{width:36px;height:36px;font-size:14px;background:#dce5c9}
.memory-auto[aria-pressed="true"]{border:2px solid #b0be96}
.scrapbook-controls[data-auto-running="true"] .memory-auto{animation:memory-pulse 5s linear infinite}
@keyframes memory-pulse{0%{box-shadow:0 0 0 0 #718b5c40}95%,100%{box-shadow:0 0 0 7px #718b5c00}}
.memory-dots{display:flex;justify-content:center;gap:2px}
.memory-dots button{display:grid;place-items:center;width:26px;height:30px;border:0;padding:0;background:transparent;cursor:pointer}
.memory-dots button::after{content:'';width:7px;height:7px;border-radius:50%;background:#b8b59a;transition:width .25s,background .25s}
.memory-dots button[aria-current="true"]::after{width:20px;background:var(--forest);border-radius:8px}
.scrapbook-ending{margin-top:27px}
.music-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 12px;border:1px solid #9fab8b;border-radius:30px;background:#f7f3e8f2;color:var(--forest);font:400 10px/1.5 var(--sans);backdrop-filter:blur(6px);cursor:pointer}
.music-toggle>span:first-child{font-size:16px;line-height:1}
.music-toggle[aria-pressed="true"]>span:first-child{color:#6c844c}
.welcome-music{position:absolute;z-index:5;left:20px;bottom:20px;background:#f7f3e8e8}
.welcome-music-note{display:block;margin-top:15px;color:#dbe3c1;font-size:10px;letter-spacing:.1px}
@media(max-width:760px){
  .hero{row-gap:84px;padding-bottom:78px}
  .hero-portrait{width:calc(100% - 44px);max-width:330px}
  .portrait-arch img{aspect-ratio:auto;height:auto;object-fit:contain}.memory-photo img{aspect-ratio:.84;object-position:center 61%}
  .family-story{grid-template-columns:1fr;gap:44px}.family-portraits{max-width:420px;margin:auto;gap:13px}.family-portrait-main figcaption{font-size:12px}.family-portrait-mini figcaption{font-size:10px}
  .scrapbook-track{--memory-width:min(340px,78vw);width:calc(100% + 48px);margin-left:-24px;gap:12px;padding:26px max(0px,calc((100% + 48px - var(--memory-width))/2)) 32px}
  .scrapbook-track .scrapbook-card{padding:8px 8px 0;border-radius:21px}.scrapbook-track .scrapbook-card figcaption{min-height:141px;margin:8px -8px 0;padding:16px 18px 20px}
  .scrapbook-track .scrapbook-card h3{font-size:24px}.scrapbook-track .scrapbook-card p{font-size:12px}
  .scrapbook-track .photo-expand{width:32px;height:32px;right:9px;bottom:9px;font-size:20px}
  .scrapbook-nav{max-width:330px;gap:16px}
  .music-toggle{min-height:34px;padding:7px 10px;font-size:9px;gap:5px}.welcome-music{left:17px;bottom:17px}
  .welcome-music-note{font-size:9px;max-width:230px;margin:14px auto 0}
}
@media(max-width:380px){.scrapbook-track{width:calc(100% + 40px);margin-left:-20px;padding-inline:max(0px,calc((100% + 40px - var(--memory-width))/2))}.memory-dots{gap:0}.memory-dots button{width:23px}.scrapbook-track .scrapbook-card h3{font-size:22px}.welcome-music-note{font-size:8px}}
html[data-motion="off"] .scrapbook-track .scrapbook-card{transition:none}
.scrapbook-track.continuous-reel{scroll-snap-type:none;scroll-behavior:auto}
.scrapbook-track.continuous-reel .scrapbook-card{scroll-snap-align:none}
.scrapbook-track.carousel-ready.continuous-reel .scrapbook-card{scale:var(--memory-scale,.89);opacity:var(--memory-opacity,.68);rotate:var(--memory-tilt,0deg);translate:0 var(--memory-lift,9px);transition:none;box-shadow:0 14px 30px #514b341c}
.photo-dialog[open]{animation:photo-open .38s cubic-bezier(.2,.75,.25,1)}
.photo-dialog[open]::backdrop{animation:photo-backdrop-in .35s ease}
.photo-dialog.is-closing::backdrop{animation:photo-backdrop-out .2s ease forwards}
.photo-content{touch-action:pan-y pinch-zoom}
@keyframes photo-open{from{opacity:0;transform:translateY(22px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes photo-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes photo-backdrop-out{to{opacity:0}}
html[data-motion="off"] .photo-dialog,html[data-motion="off"] .photo-dialog::backdrop,html[data-motion="off"] .memory-auto{animation:none}
@media(prefers-reduced-motion:reduce){.scrapbook-track .scrapbook-card{transition:none}}
@media print{.scrapbook-card[data-loop-copy]{display:none!important}.scrapbook-track.carousel-ready.continuous-reel .scrapbook-card{scale:1;opacity:1;rotate:0deg;translate:none}}
@media print{.scrapbook-controls,.music-toggle,.welcome-music-note{display:none!important}.scrapbook-track{display:grid;width:100%;margin:0;padding:0;overflow:visible;mask-image:none;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}.scrapbook-track.carousel-ready .scrapbook-card{scale:1;opacity:1;rotate:none}.scrapbook-track .scrapbook-card figcaption{min-height:0}.family-story{grid-template-columns:1fr 1fr}.family-letter{grid-row:auto}}