.portfolio-page { color:var(--navy); background:var(--white); }
.portfolio-page { --chapter-height:calc(100svh - var(--site-header-height, 76px)); }
html:has(.portfolio-page) { scroll-padding-top:var(--site-header-height, 76px); }
.project-chapter { position:relative; min-height:var(--chapter-height); overflow:hidden; background:var(--white); }
.project-chapter:nth-of-type(even) { background:color-mix(in srgb, var(--navy) 4%, var(--white)); }
.project-chapter-layout { width:min(1400px, 88%); min-height:inherit; margin:auto; padding:112px 0 52px; display:flex; flex-direction:column; justify-content:center; gap:36px; box-sizing:border-box; }
.project-chapter-images { display:grid; grid-template-columns:1.35fr 1.35fr .7fr; align-items:center; gap:24px; }
.project-chapter-image { --enter-x:0px; --enter-y:54px; --enter-angle:0deg; --rest-angle:0deg; --enter-scale:.95; margin:0; min-width:0; overflow:hidden; border-radius:0; aspect-ratio:3 / 2; transform:rotate(var(--rest-angle)); }
.project-chapter-image--2 { margin-top:32px; }
.project-chapter-image--3 { aspect-ratio:3 / 4; }
.project-chapter-image img { display:block; width:100%; height:100%; object-fit:cover; }
.project-chapter-copy { position:relative; text-align:center; }
.project-chapter-copy h2 { margin:0; font-size:5rem; line-height:1.05; color:inherit; overflow-wrap:break-word; }
.project-chapter-copy p { margin:20px auto 0; max-width:42ch; padding:0 12px; font-size:var(--type-body); line-height:1.5; color:inherit; }
.project-chapter-copy .button { margin-top:24px; max-width:100%; }
.project-chapter-number { text-align:center; font-size:var(--type-small); font-variant-numeric:tabular-nums; color:var(--muted); }
.project-services { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; }
.project-chapter--services .project-chapter-copy h2 { max-width:22ch; margin-inline:auto; }
.project-services .project-chapter-copy h3 { margin:0; font-size:var(--type-body); font-weight:600; line-height:1.4; }
.project-services .project-chapter-copy p { margin-top:12px; }
@media(max-width:760px) { .project-services { grid-template-columns:minmax(0,1fr); gap:32px; } }

/* Each project has its own composition; buttons and typography stay shared. */

.project-chapter--thesis .project-chapter-layout { max-width:1120px; display:grid; grid-template-columns:1.1fr 1fr; align-content:center; align-items:center; gap:48px; }
.project-type-study { font-size:5rem; line-height:1; font-family:var(--font-display); }
.project-type-study span, .project-type-food span { display:block; }
.project-type-study span:nth-child(2) { padding-left:24px; font-style:italic; }
.project-type-study span:nth-child(3) { padding-top:20px; border-top:1px solid var(--button-outline); margin-top:20px; }
.project-chapter--thesis .project-chapter-copy { text-align:left; }
.project-chapter--thesis .project-chapter-copy h2 { font-size:3.5rem; }
.project-chapter--thesis .project-chapter-copy p { padding:0; margin-left:0; }
.project-chapter--thesis .project-chapter-number { grid-column:1 / -1; }

.project-chapter--engagement .project-chapter-images { max-width:1100px; width:100%; margin:auto; grid-template-columns:1.3fr 1fr; gap:18px 28px; }
.project-chapter--engagement .project-chapter-image { aspect-ratio:auto; }
.project-chapter--engagement .project-chapter-image img { height:auto; object-fit:contain; }
.project-chapter--engagement .project-chapter-image--1 { grid-row:1 / 3; --enter-x:-80px; --enter-y:0px; }
.project-chapter--engagement .project-chapter-image--2 { width:78%; margin:0; justify-self:end; --enter-x:60px; --enter-y:-25px; }
.project-chapter--engagement .project-chapter-image--3 { width:68%; --enter-x:60px; --enter-y:25px; }

.project-chapter--brix .project-chapter-images { width:min(1060px, 100%); margin:auto; grid-template-columns:1fr 1.3fr .85fr; gap:32px; }
.project-chapter--brix .project-chapter-image { aspect-ratio:1; border-radius:50%; background:#eef0f2; border:1px solid rgba(24,43,86,.12); padding:5%; box-sizing:border-box; --enter-scale:.65; --enter-angle:-25deg; }
.project-chapter--brix .project-chapter-image img { object-fit:contain; }
.project-chapter--brix .project-chapter-image--2 { margin:0; --enter-y:-65px; --enter-angle:20deg; }
.project-chapter--brix .project-chapter-image--3 { --enter-y:70px; }

.project-chapter--portraits .project-chapter-images { width:min(900px, 100%); margin:auto; grid-template-columns:repeat(3, 1fr); gap:20px; }
.project-chapter--portraits .project-chapter-image { aspect-ratio:4 / 5; --enter-y:0px; --enter-scale:1.06; }
.project-chapter--portraits .project-chapter-image--2 { margin:0 0 36px; }
.project-chapter--portraits .project-chapter-image--1 { --enter-x:-60px; }
.project-chapter--portraits .project-chapter-image--3 { --enter-x:60px; }

.project-chapter--animals .project-chapter-layout { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; align-content:center; gap:40px; }
.project-chapter--animals .project-chapter-images { grid-template-columns:1fr .7fr; gap:16px; }
.project-chapter--animals .project-chapter-image--1 { grid-column:1 / -1; --enter-x:-60px; --enter-y:0px; }
.project-chapter--animals .project-chapter-image--2 { margin:0; --enter-y:65px; }
.project-chapter--animals .project-chapter-image--3 { width:72%; justify-self:end; --enter-y:-45px; }
.project-chapter--animals .project-chapter-number { grid-column:1 / -1; }

.project-chapter--event .project-chapter-images { width:min(1050px, 100%); margin:auto; grid-template-columns:1.7fr 1fr; gap:18px; }
.project-chapter--event .project-chapter-image--1 { grid-row:1 / 3; aspect-ratio:4 / 3; --enter-scale:1.08; --enter-y:0px; }
.project-chapter--event .project-chapter-image--2 { margin:0; --enter-x:80px; --enter-y:0px; }
.project-chapter--event .project-chapter-image--3 { aspect-ratio:3 / 2; --enter-x:100px; --enter-y:0px; }

.project-chapter--craft .project-chapter-images { width:min(1000px, 100%); margin:auto; grid-template-columns:1.2fr .8fr .8fr; gap:32px; padding:16px; box-sizing:border-box; align-items:end; }
.project-chapter--craft .project-chapter-image--1 { --rest-angle:-4deg; --enter-angle:-12deg; --enter-y:40px; aspect-ratio:4 / 5; }
.project-chapter--craft .project-chapter-image--2 { --rest-angle:6deg; --enter-angle:18deg; --enter-y:-65px; aspect-ratio:3 / 4; margin:0 0 70px; }
.project-chapter--craft .project-chapter-image--3 { --rest-angle:-3deg; --enter-angle:-15deg; --enter-y:80px; }

.project-type-food { font-size:5rem; line-height:1.08; width:min(1040px, 100%); margin:auto; }
.project-type-food span:nth-child(1) { color:var(--navy); }
.project-type-food span:nth-child(2) { text-align:center; color:var(--muted); font-style:italic; }
.project-type-food span:nth-child(3) { text-align:right; }
.project-chapter--food .project-chapter-copy { border-top:1px solid var(--button-outline); padding-top:28px; }
.chapter-navigation { position:fixed; right:12px; top:50%; transform:translateY(-50%); z-index:20; display:grid; transition:opacity .2s; }
.chapter-navigation a { width:28px; height:28px; display:grid; place-items:center; color:var(--navy); border-radius:50%; }
.chapter-navigation span { width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.3; transition:transform .3s, opacity .3s; }
.chapter-navigation [aria-current="step"] span { opacity:1; transform:scale(1.7); }
.chapter-navigation a:hover span { opacity:1; }
.chapter-navigation[hidden] { display:none; }
@media (hover:none) and (min-height:650px) and (prefers-reduced-motion:no-preference) {
    html:has([data-story-deck]) { scroll-snap-type:y proximity; }
    .project-chapter { scroll-snap-align:start; }
    .portfolio-page .site-footer-editorial { scroll-snap-align:start; }
}
@media (prefers-reduced-motion:no-preference) {
    .story-deck-ready .project-chapter-image { transform:translate(var(--enter-x), var(--enter-y)) rotate(var(--enter-angle)) scale(var(--enter-scale)); opacity:.25; transition:transform 1.1s cubic-bezier(.2,.7,.2,1), opacity .8s ease; }
    .story-deck-ready .project-chapter-image--2 { transition-delay:.1s; }
    .story-deck-ready .project-chapter-image--3 { transition-delay:.18s; }
    .story-deck-ready .project-chapter-copy { transform:translateY(30px); opacity:.4; transition:transform .9s ease,opacity .9s ease; }
    .story-deck-ready .is-current .project-chapter-image { transform:rotate(var(--rest-angle)); opacity:1; }
    .story-deck-ready .is-current .project-chapter-copy { transform:none; opacity:1; }
    .story-deck-ready .project-type-study span, .story-deck-ready .project-type-food span { opacity:.15; transform:translateX(-36px); transition:transform 1s cubic-bezier(.2,.7,.2,1), opacity .8s ease; }
    .story-deck-ready .project-type-food span:nth-child(2) { transform:translateX(60px); }
    .story-deck-ready .project-type-study span:nth-child(2), .story-deck-ready .project-type-food span:nth-child(2) { transition-delay:.12s; }
    .story-deck-ready .project-type-study span:nth-child(3), .story-deck-ready .project-type-food span:nth-child(3) { transition-delay:.24s; }
    .story-deck-ready .is-current :is(.project-type-study, .project-type-food) span { opacity:1; transform:none; }
}
@media (max-width:1000px) {
    .project-chapter-copy h2 { font-size:3.5rem; }
    .project-chapter-images { gap:16px; }
    .project-type-study, .project-type-food { font-size:3.5rem; }
    .project-chapter--thesis .project-chapter-copy h2 { font-size:2.75rem; }
    .project-chapter--animals .project-chapter-layout { grid-template-columns:1fr; }
    .project-chapter--animals .project-chapter-images { max-width:640px; margin:auto; }
}
@media (max-width:600px) {
    .project-chapter-layout { width:88%; padding:100px 0 36px; gap:28px; }
    .project-chapter-images { grid-template-columns:1fr .55fr; gap:12px; align-items:center; }
    .project-chapter-image--1 { grid-column:1; grid-row:1; }
    .project-chapter-image--2 { grid-column:1; grid-row:2; margin-top:0; }
    .project-chapter-image--3 { grid-column:2; grid-row:1 / 3; }
    .project-chapter-copy h2 { font-size:2.5rem; line-height:1.1; }
    .project-chapter-copy p { margin-top:14px; max-width:30ch; }
    .chapter-navigation { right:0; }
    .chapter-navigation a { width:24px; height:26px; }
    .project-chapter .project-chapter-image { grid-column:auto; grid-row:auto; }
    .project-chapter--thesis .project-chapter-layout { grid-template-columns:1fr; gap:32px; }
    .project-type-study { font-size:3.5rem; }
    .project-chapter--thesis .project-chapter-copy h2 { font-size:2.5rem; }
    .project-chapter--engagement .project-chapter-images { gap:14px; }
    .project-chapter--engagement .project-chapter-image--1 { grid-column:1 / -1; }
    .project-chapter--engagement .project-chapter-image--2, .project-chapter--engagement .project-chapter-image--3 { width:100%; }
    .project-chapter--brix .project-chapter-images { gap:10px; }
    .project-chapter--portraits .project-chapter-images { gap:10px; }
    .project-chapter--animals .project-chapter-image--1 { grid-column:1 / -1; }
    .project-chapter--event .project-chapter-images { grid-template-columns:1fr 1fr; gap:12px; }
    .project-chapter--event .project-chapter-image--1 { grid-column:1 / -1; aspect-ratio:3 / 2; }
    .project-chapter--craft .project-chapter-images { grid-template-columns:1fr 1fr; gap:18px; padding:8px; }
    .project-chapter--craft .project-chapter-image--2 { margin-bottom:24px; }
    .project-chapter--craft .project-chapter-image--3 { width:60%; grid-column:1 / -1; justify-self:center; margin-top:-12px; }
    .project-type-food { font-size:2.5rem; }
}

/* Fit the composition, not the photos: natural ratios and readable copy remain intact. */
.story-deck-ready .project-chapter-layout {
    display:grid;
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:minmax(160px, 1fr) auto auto;
    height:max(var(--chapter-height), var(--chapter-min-height, 0px));
    min-height:0;
    padding:24px 0;
    gap:20px;
    align-content:stretch;
}
.story-visual-stage { position:relative; min-width:0; min-height:0; align-self:stretch; }
.story-visual-stage > [data-story-visual] {
    position:absolute;
    top:50%;
    left:50%;
    margin:0;
    width:100%;
    transform:translate(-50%, -50%) scale(var(--visual-scale, 1));
    transform-origin:center;
}
@media (min-width:601px) {
    .story-deck-ready .project-chapter--thesis .project-chapter-layout { grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr); grid-template-rows:minmax(160px, 1fr) auto; }
}
@media (min-width:1001px) {
    .story-deck-ready .project-chapter--animals .project-chapter-layout { grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); grid-template-rows:minmax(160px, 1fr) auto; }
}
@media (max-width:600px) {
    .story-deck-ready .project-chapter-layout { padding:16px 0; gap:16px; }
    .project-chapter-copy .button { margin-top:18px; }
}
