.latest-creations{padding:65px clamp(24px,6vw,96px) 120px;font-family:system-ui,sans-serif}
.latest-heading{max-width:720px;text-align:center;margin:0 auto 40px}.latest-heading h2{font-size:clamp(28px,3.5vw,48px);font-weight:600;letter-spacing:-.045em;line-height:1.15;margin:0}
.latest-heading p{font-size:14px;line-height:1.7;color:#777971;margin:14px auto 0;max-width:55ch}
.creation-gallery{display:flex;gap:8px;height:400px;width:100%;max-width:1200px;margin:0 auto}
.creation-panel{position:relative;flex:1 1 0;min-width:0;height:100%;padding:0;border:0;border-radius:12px;overflow:hidden;cursor:pointer;background:#d8d8d3;transition:flex-grow .5s cubic-bezier(.22,.7,.3,1);text-align:left}
.creation-panel img{height:100%;width:100%;object-fit:cover;object-position:center;display:block}
.creation-panel span{position:absolute;bottom:16px;left:16px;right:16px;font:500 12px/1.4 system-ui;color:#fff;background:#171917d9;border-radius:20px;padding:8px 12px;white-space:nowrap;width:max-content;max-width:calc(100% - 32px);opacity:0;transition:opacity .25s;overflow:hidden}
.creation-panel.is-active{flex-grow:5}.creation-panel.is-active span,.creation-panel:focus-visible span{opacity:1}
.creation-panel:focus-visible{outline:3px solid #3b82f6;outline-offset:4px}
@media(max-width:700px){.creation-gallery{height:320px;gap:5px}.creation-panel{border-radius:8px}.creation-panel.is-active{flex-grow:12}.latest-creations{padding-inline:20px}}
@media(prefers-reduced-motion:reduce){.creation-panel,.creation-panel span{transition:none}}

/* Slightly layered cards before expansion. */
.creation-gallery{gap:0;isolation:isolate}
.creation-panel{box-shadow:-7px 0 16px #00000018;z-index:1}
.creation-panel+.creation-panel{margin-left:-24px}
.creation-panel.is-active,.creation-panel:focus-visible{z-index:10}
@media(max-width:700px){.creation-gallery{gap:0}.creation-panel+.creation-panel{margin-left:-12px}}

/* Actual projects retain the original overlapping, expanding gallery. */
.creation-panel img{object-position:top center}
.creation-panel span{opacity:1;font-weight:600;letter-spacing:.01em}
.project-preview{width:min(1160px,94vw);max-height:90svh;box-sizing:border-box;padding:0;border:1px solid #ffffff45;border-radius:18px;background:#efeee9;color:#20231f;box-shadow:0 24px 90px #0005}
.project-preview::backdrop{background:#111b;backdrop-filter:blur(7px)}
.project-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;position:sticky;top:0;background:#efeee9;z-index:1}
.project-preview h3{font:600 22px/1.2 system-ui;margin:0}.project-preview p{font:12px system-ui;color:#74776e;margin:7px 0 0}
.project-preview-close{border:1px solid #aaa8;border-radius:30px;background:transparent;padding:10px 16px;cursor:pointer;color:inherit}
.project-preview-image{display:block;width:100%;height:auto}
.project-preview-close:focus-visible{outline:2px solid #008d77;outline-offset:3px}

.creation-panel{background:#efeee9}
.creation-panel video{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}
.project-preview video{width:100%;max-height:75svh;aspect-ratio:16/9;object-fit:contain;background:#111;display:block}

.project-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:52px;height:52px;padding-left:3px;border-radius:50%;background:#111c;color:white;font:20px/1 system-ui;box-shadow:0 4px 22px #0003;pointer-events:none;border:1px solid #fff8}
.creation-panel:hover .project-play,.gallery-photo:hover .project-play{background:#008d77}
.style-gallery .gallery-photo{position:relative}
.style-gallery .style-card img{aspect-ratio:16/9;object-fit:contain;display:block;width:100%;border-radius:18px}
.creation-panel img{object-fit:cover;object-position:top center}