.photo-narrative{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;align-items:start;position:relative;margin-top:40px}.photo-story-stage{position:sticky;top:40px;min-width:0;overflow:hidden;aspect-ratio:4/5;border:1px solid color-mix(in srgb,var(--ink) 30%,transparent);background:var(--ink)}.photo-story-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}.photo-story-stage img.is-active{opacity:1}.photo-story-count{position:absolute;bottom:18px;left:18px;background:#111d;color:white;padding:10px 16px;font:500 13px/1.5 Inter,sans-serif}.photo-story-steps{min-width:0}.photo-story-step{min-height:70vh;display:flex;flex-direction:column;justify-content:center;padding:70px 0;border-top:1px solid color-mix(in srgb,var(--ink) 30%,transparent)}.photo-story-step:last-child{border-bottom:1px solid color-mix(in srgb,var(--ink) 30%,transparent)}.photo-story-step>small{font:500 11px/1.6 Inter,sans-serif;letter-spacing:.08em}.photo-story-step h3{font:400 clamp(30px,3.3vw,48px)/1.15 var(--display);margin:23px 0}.photo-story-step p{font-size:15px;line-height:1.85;max-width:38ch}.photo-story-step img{display:none}.photo-story-step a{align-self:start;font:500 12px/1.5 Inter,sans-serif;border-bottom:1px solid;padding:12px 0;min-height:44px;margin-top:16px}.photo-story-intro{font:400 13px/1.8 Inter,sans-serif;margin-top:20px;max-width:650px}.identity-06 .photo-story-stage{border-radius:45% 45% 22px 22px;border:3px solid}.identity-02 .photo-story-stage,.identity-09 .photo-story-stage,.identity-21 .photo-story-stage{border:4px solid;box-shadow:8px 8px 0 var(--accent)}.identity-19 .photo-story-stage{border-radius:48% 48% 0 0}.identity-05 .photo-story-stage,.identity-22 .photo-story-stage{border:5px double}.identity-28 .photo-story-stage{border:12px solid #fffbea;box-shadow:3px 5px 15px #0002}.identity-12 .photo-story-stage{border:1px dashed}.identity-13 .photo-story-step{border-top:3px double}.identity-18 .photo-story-step>small{background:var(--ink);color:var(--base);padding:8px 12px;align-self:start}.identity-25 .photo-story-step{background:repeating-linear-gradient(transparent 0 31px,#70997515 31px 32px)}.car-restoration{display:grid;grid-template-columns:.8fr 1.2fr;gap:6%;align-items:center;margin:35px 0 65px}.car-restoration .photo-compare{max-width:640px;aspect-ratio:12/7}.car-restoration .compare-controls{gap:12px;flex-wrap:wrap}.car-restoration .compare-controls p{order:3;flex-basis:100%}.car-restoration h3{font:400 35px/1.15 var(--display);margin:0 0 20px}.car-restoration p{font-size:14px}.car-restoration .photo-credit{font-size:11px}.car-workshop-label{padding-top:30px;border-top:1px solid;font:500 12px/1.6 Inter,sans-serif}
.photo-story-stage{aspect-ratio:3/2;top:clamp(30px,19vh,180px)}.photo-story-stage img{object-position:50% 45%}.car-restoration .photo-compare{aspect-ratio:3/2}.car-story-pins{position:absolute;inset:0;opacity:0;transition:opacity .35s;pointer-events:none}.photo-narrative[data-phase="1"] .car-story-pins{opacity:1}.car-story-pins span{position:absolute;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:2px solid white;background:#1414148f;color:white;font:500 16px/1 Inter,sans-serif;box-shadow:0 0 0 12px #ffffff16;transform:translate(-50%,-50%)}.car-damage-panel{left:52%;top:48%}.car-damage-light{left:63%;top:52%}
@media(max-width:700px){.photo-narrative{display:block;margin-top:30px}.photo-story-stage{display:none}.photo-story-step{display:block;min-height:0;padding:35px 0 45px}.photo-story-step img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:50% 45%;margin:25px 0}.photo-story-step h3{font-size:32px;margin:20px 0}.photo-story-step p{font-size:14px}.car-restoration{grid-template-columns:1fr;gap:30px;margin:30px 0 50px}.car-restoration h3{font-size:30px}.photo-showcase .photo-heading h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){.photo-story-stage{display:none}.photo-narrative{display:block;max-width:950px}.photo-story-steps{display:grid;gap:40px}.photo-story-step{min-height:0;padding:30px 0;display:grid;grid-template-columns:1fr 1fr;gap:15px 35px;align-items:center}.photo-story-step img{display:block;grid-column:2;grid-row:1/5;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;margin:0}.photo-story-step h3,.photo-story-step p,.photo-story-step a{margin:0;grid-column:1}.photo-story-stage img{transition:none}}
@media(prefers-reduced-motion:reduce) and (max-width:700px){.photo-story-step{display:block}.photo-story-step img{margin:25px 0}.photo-story-step h3{margin:20px 0}.photo-story-step a{display:inline-block;margin-top:15px}}
.car-restoration .compare-after,.car-photo-story .photo-story-stage img:not(:first-of-type){mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201536%201024%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22edge%22%20x%3D%22-5%25%22%20y%3D%22-5%25%22%20width%3D%22110%25%22%20height%3D%22110%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%223%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22white%22%20filter%3D%22url%28%23edge%29%22%20d%3D%22M120%20460%20286%20380%20365%20270%20590%20260%20866%20260%20955%20387%201360%20444%201408%20510%201420%20680%201290%20738%201150%20775%20840%20840%20603%20845%20480%20770%20220%20746%20120%20642Z%22%2F%3E%3C%2Fsvg%3E%0A");mask-size:100% 100%;mask-repeat:no-repeat}.car-photo-story .photo-story-stage{background-image:image-set(url('assets/photography/car-before-768.webp') 1x,url('assets/photography/car-before-1536.webp') 2x);background-size:cover;background-position:center}
/* The green coupe uses its own full-frame sequence, not the other demo’s car mask. */
body.identity-22 .car-restoration .compare-after,body.identity-22 .car-photo-story .photo-story-stage img:not(:first-of-type){mask-image:none}
body.identity-22 .car-photo-story .photo-story-stage{background-image:none}