.project-page{background:#f0f9ff;min-height:100vh;display:flex}.project-sidebar{color:#fff;z-index:10;background:#000;flex-shrink:0;width:45vw;height:100vh;padding:80px 48px;position:fixed;top:0;left:0;overflow-y:auto}.back-link{color:#fff;font-family:var(--font-inter),system-ui,sans-serif;opacity:.8;align-items:center;gap:8px;font-size:14px;text-decoration:none;transition:opacity .2s;display:inline-flex}.back-link:hover{opacity:1}.project-detail-title{font-family:var(--font-sentient),Georgia,serif;letter-spacing:-.01em;margin:0 0 16px;font-size:40px;font-weight:500;line-height:1.1}.project-detail-meta{font-family:var(--font-inter),system-ui,sans-serif;opacity:.6;margin:0 0 32px;font-size:14px}.project-detail-description{font-family:var(--font-inter),system-ui,sans-serif;opacity:.9;margin:0 0 64px;font-size:16px;line-height:1.6}.project-section{margin-bottom:56px;transition:opacity .3s}.project-section h2{font-family:var(--font-sentient),Georgia,serif;margin:0 0 20px;font-size:18px;font-weight:500}.project-section p{font-family:var(--font-inter),system-ui,sans-serif;opacity:.8;margin:0 0 16px;font-size:16px;line-height:1.7}.italic-note{opacity:.7;border-left:2px solid #0000;padding:12px 16px;font-style:italic;transition:all .4s}.italic-note.highlighted{opacity:1;background:#ffffff1a;border-left-color:#dc6803}.project-impact-list{opacity:.8;font-family:var(--font-inter),system-ui,sans-serif;padding-left:20px;font-size:16px;line-height:1.7;list-style-type:disc}.project-impact-list li{margin-bottom:12px}.project-divider{border:none;border-top:1px solid #fff3;width:100%;margin:64px 0;position:relative}.project-divider:before,.project-divider:after{content:"";background:#fff6;width:1px;height:8px;position:absolute;top:-4px}.project-divider:before{left:0}.project-divider:after{right:0}.project-content{background:#f0f9ff;flex:1;justify-content:center;align-items:center;height:100vh;margin-left:45vw;padding:20px;display:flex;position:relative;overflow:hidden}.media-control-overlay{opacity:0;pointer-events:none;z-index:20;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:absolute;inset:0}.project-content:hover .media-control-overlay{opacity:1}.media-control-btn{-webkit-backdrop-filter:blur(10px);color:#fff;cursor:pointer;pointer-events:all;background:#00000073;border:1px solid #ffffff2e;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;transition:background .2s,transform .15s;display:flex}.media-control-btn:hover{background:#000000a6;transform:scale(1.08)}.media-control-btn svg{flex-shrink:0;width:14px;height:14px}.project-image-container{background:#f0f9ff;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.project-detail-image-wrapper{background:#f0f9ff;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.project-screenshot{object-fit:contain;border-radius:6px;width:auto;max-width:100%;height:auto;max-height:100%}.back-link{z-index:30;position:fixed;top:52px;left:48px}@media (max-width:1200px){.back-link{top:44px;left:40px}.project-sidebar{width:380px;padding:64px 40px}.project-content{margin-left:380px;padding:48px}}@media (max-width:900px){.back-link{top:40px;left:36px}.project-sidebar{width:50vw;padding:60px 28px}.project-content{margin-left:50vw}.project-detail-title{font-size:32px}}@media (max-width:768px){.back-link{z-index:100;background:#000;border-bottom:1px solid #ffffff14;align-items:center;gap:8px;width:100%;height:52px;margin-bottom:0;padding:0 20px;display:inline-flex;position:fixed;top:0;left:0;right:0}.project-content{z-index:50;width:100%;height:46vh;margin-left:0;padding:8px;position:fixed;top:52px;left:0;right:0;overflow:hidden}.project-sidebar{z-index:10;width:100%;height:calc(100dvh - 52px - 46vh);padding:24px 20px 80px;position:fixed;top:calc(52px + 46vh);left:0;right:0;overflow:hidden auto}.project-detail-title{margin-bottom:8px;font-size:22px;line-height:1.2}.project-detail-meta{margin-bottom:16px;font-size:12px}.project-detail-description{margin-bottom:32px;font-size:13px;line-height:1.55}.project-section{margin-bottom:32px}.project-section h2{letter-spacing:.01em;margin-bottom:8px;font-size:14px}.project-section p{font-size:13px;line-height:1.6}.italic-note{padding:10px 12px;font-size:12px}.media-control-overlay{opacity:0;transition:opacity .25s}.media-control-overlay.visible{opacity:1}.media-control-btn{width:32px;height:32px}.media-control-btn svg{width:12px;height:12px}}
