.project-frame{background:#061b3c}.project-frame:before,.project-frame:after{display:none}.project-frame img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease,filter .5s ease}.project-frame:after{display:block;inset:auto 0 0;height:42%;border:0;border-radius:0;background:linear-gradient(transparent,#031229a8);z-index:1}.project-frame span{z-index:2;text-shadow:0 2px 10px #020b1a}.project-card:hover .project-frame img{transform:scale(1.06);filter:saturate(1.08)}
.portfolio{background:#f8fbff;position:relative;overflow:hidden}.portfolio:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#1675e808 1px,transparent 1px),linear-gradient(90deg,#1675e808 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(90deg,#000,transparent 75%);pointer-events:none}.portfolio-heading,.portfolio-grid,.portfolio-note{position:relative;z-index:1}.portfolio-heading{display:grid;grid-template-columns:1fr .75fr;gap:50px;align-items:end}.portfolio-heading p:not(.eyebrow){margin:0;color:var(--muted);font-size:14px;line-height:1.7}.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:46px}.project-card{background:#fff;border:1px solid #dce6f2;padding:11px;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-8px);box-shadow:0 20px 38px #0a28441c}.project-frame{height:245px;position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#061b3c,#0c3266);overflow:hidden}.project-frame:before,.project-frame:after{content:'';position:absolute;border:1px solid #3faeff3b;border-radius:50%}.project-frame:before{width:230px;height:230px}.project-frame:after{width:135px;height:135px;box-shadow:0 0 0 46px #3faeff0a}.project-frame span{position:absolute;left:18px;top:17px;color:#77caff;font:700 16px Rajdhani;z-index:1}.project-frame i{font:300 54px/1 Sora,sans-serif;color:#72c9ff;z-index:1;font-style:normal;transition:transform .3s ease}.project-card:hover .project-frame i{transform:rotate(90deg)}.project-card>div:last-child{padding:20px 10px 13px}.project-card p{margin:0 0 7px;color:var(--blue);font-size:10px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}.project-card h3{font-size:27px;line-height:1;margin:0 0 9px}.project-card small{color:var(--muted);font-size:11px}.portfolio-note{max-width:660px;margin:28px 0 0;color:#65768d;font-size:12px;line-height:1.65}@media(max-width:700px){.portfolio-heading{grid-template-columns:1fr;gap:20px}.portfolio-grid{grid-template-columns:1fr}.project-frame{height:205px}}