.projects-container{width:100%;max-width:1280px;margin-left:auto;margin-right:auto}.projects-header{margin-bottom:70px}.projects-list{flex-direction:column;gap:120px;display:flex}.project-item{grid-template-columns:1.6fr 1fr;align-items:center;gap:70px;display:grid}.project-item:nth-child(2n) .project-showcase{order:2}.project-showcase{padding:0 14% 7% 0;position:relative}.project-item:nth-child(2n) .project-showcase{padding:0 0 7% 14%}.project-showcase .device-phone{z-index:3;width:24%;max-width:none;margin:0;position:absolute;bottom:0;right:0}.project-item:nth-child(2n) .project-showcase .device-phone{left:0;right:auto}.project-showcase .device-phone .device-screen{border-width:5px;border-radius:28px;padding:8px 6px;box-shadow:inset 0 0 0 1px #ffffff0a,0 30px 50px -15px #000000f2}.project-showcase .device-phone .device-shot{border-radius:18px}.project-showcase .device-phone .device-url{padding:2px 8px;font-size:9px}.project-showcase .device-phone .device-glow{display:none}.project-item:hover .device-monitor{transform:translateY(-8px)}.project-item:hover .device-phone{transform:translateY(-16px)}.project-item:hover .device-glow{opacity:.5}.project-item:hover .device-monitor .device-shot img{object-position:bottom center}.project-item:hover .device-phone .device-shot img{object-position:bottom left}.project-meta{flex-direction:column;align-items:flex-start;gap:14px;display:flex}.project-index{font-family:var(--heading-font);color:#0000;-webkit-text-stroke:1px var(--accent-color-3);font-size:64px;font-weight:700;line-height:1}.project-title{color:var(--primary);margin:0}.project-devices{flex-wrap:wrap;gap:10px;margin:6px 0 14px;display:flex}.project-devices span{background:var(--accent-color-4);border:1px solid var(--accent-color-3);color:var(--text-color);font-size:var(--font-size-xs);border-radius:100px;align-items:center;gap:8px;padding:6px 14px;display:inline-flex}.project-devices i{color:var(--accent-color)}.project-meta .btn{align-self:auto}@media (max-width:1200px){.project-item{grid-template-columns:1.3fr 1fr;gap:50px}}@media (max-width:992px){.projects-list{gap:90px}.project-item{grid-template-columns:1fr;gap:36px}.project-item:nth-child(2n) .project-showcase{order:0}.project-meta{text-align:center;align-items:center}}@media (max-width:576px){.projects-header{margin-bottom:50px}.project-showcase .device-phone .device-screen{border-width:3px;border-radius:18px;padding:5px 4px}.project-showcase .device-phone .device-shot{border-radius:12px}.project-showcase .device-phone .device-bar{display:none}.project-index{font-size:48px}}
