html{max-width:100%;overflow-x:hidden}.hero-copy h1{max-width:820px}.hero-visual{isolation:isolate}.hero-visual:after{content:"";position:absolute;inset:60px;border:1px solid rgba(227,182,94,.07);border-radius:50%;z-index:-1;box-shadow:0 0 90px rgba(227,182,94,.07)}
.project{transition:border-color .3s,transform .3s,box-shadow .3s}.project:hover{border-color:#454b59;box-shadow:0 30px 80px rgba(0,0,0,.24)}.project-canvas{padding:28px}.canvas-flow{background:radial-gradient(circle at 25% 20%,#3d4566,#151922 65%)}.canvas-luma{background:linear-gradient(145deg,#87958d,#d8cbb9)}.canvas-clean{background:linear-gradient(145deg,#a8c4b4,#dce8df)}.canvas-pulse{background:linear-gradient(145deg,#b6c5df,#e1dcef)}.canvas-debug{background:linear-gradient(145deg,#c8c1e5,#d9eee8)}
.live-project-shot{display:block;position:relative;width:min(560px,112%);max-width:none;padding-top:27px;background:#171b25;border:1px solid rgba(255,255,255,.16);border-radius:13px;box-shadow:0 32px 75px rgba(0,0,0,.38);overflow:hidden;transform:rotate(-1.25deg);transition:transform .35s,box-shadow .35s}.live-project-shot:before{content:"•  •  •";position:absolute;top:5px;left:13px;color:#747b8e;letter-spacing:3px;font-size:13px}.live-project-shot:after{content:"LIVE PROJECT";position:absolute;top:9px;right:13px;color:#7d8494;font:700 7px Manrope,sans-serif;letter-spacing:.14em}.live-project-shot img{display:block;width:100%;height:auto;border-top:1px solid rgba(255,255,255,.08);transition:transform .45s}.live-project-shot:hover{transform:rotate(0) translateY(-5px);box-shadow:0 38px 90px rgba(0,0,0,.48)}.live-project-shot:hover img{transform:scale(1.015)}.shot-featured{width:min(780px,112%);transform:rotate(1deg)}
.project-topline .demo-label{display:flex;align-items:center;gap:7px}.project-topline .demo-label i{width:7px;height:7px;border-radius:50%;background:#53d393;box-shadow:0 0 0 4px rgba(83,211,147,.1)}.project-copy>p:not(.project-subtitle){min-height:78px}.project-featured .project-copy>p:not(.project-subtitle){min-height:0}.tag-list li{background:rgba(255,255,255,.015)}
@media(max-width:900px){.project-featured .project-canvas{min-height:460px}.shot-featured{width:min(680px,104%)}.project-copy>p:not(.project-subtitle){min-height:0}}
@media(max-width:560px){.hero-visual{overflow:hidden}.project{max-width:100%}.project-canvas{padding:16px}.project-small .project-canvas{height:300px}.live-project-shot,.shot-featured{width:100%;max-width:100%;transform:none;box-shadow:0 24px 55px rgba(0,0,0,.38)}.project-featured .project-canvas{min-height:350px}.project-copy h3{margin-top:48px}}