#cqpfolio{
  --bg: #232323; --panel: #191919; --r:20px; --shadow:0 18px 44px rgba(2,8,20,.35);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",Inter,system-ui;
  background: var(--bg);
  color:#fff; padding:clamp(28px,4vw,64px) 12px;
}
#cqpfolio .cqp-shell{max-width:1180px;margin:0 auto;}
#cqpfolio .cqp-head{text-align:center;margin-bottom:24px;}
#cqpfolio .cqp-title{display:flex;justify-content:center;align-items:center;gap:10px;font-weight:900;font-size:clamp(26px,3vw,34px);color: #ffffff;}
#cqpfolio .cqp-bh img{width:30px;height:auto;transition:.2s;filter:drop-shadow(0 2px 8px rgba(255,255,255,.18));}
#cqpfolio .cqp-bh:hover img{transform:translateY(-1px) scale(1.06);}
#cqpfolio .cqp-sub{margin:0;color:#919191;font-weight:600;font-size:15px;}
#cqpfolio .cqp-link{color:#7aa2ff;text-decoration:none;font-weight:800;}
#cqpfolio .cqp-link:hover{color:#ffffff;text-decoration:none;font-weight:800;}

#cqpfolio .cqp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,18px);perspective:1200px;}
#cqpfolio .cqp-card{position:relative;border-radius:var(--r);overflow:hidden;background:var(--panel);box-shadow:var(--shadow);aspect-ratio:4/3;transform-style:preserve-3d;opacity:0;filter:blur(8px);}
#cqpfolio .cqp-figure,#cqpfolio .cqp-figure img{width:100%;height:100%;object-fit:cover;display:block;margin:0;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
#cqpfolio .cqp-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:12px;padding:18px 16px 20px;background:linear-gradient(180deg,rgba(6,10,24,.55)0%,rgba(5,6,14,.98)100%);color:#fff;text-align:center;opacity:0;transition:.35s;backdrop-filter:saturate(120%) blur(0);}
#cqpfolio .cqp-overlay>*{position:relative;z-index:1;}
#cqpfolio .cqp-spot{position:absolute;inset:-4%;z-index:0;pointer-events:none;background:radial-gradient(560px 400px at var(--mx,50%) var(--my,60%),rgba(120,160,255,.20)0%,rgba(120,160,255,.13)28%,rgba(120,160,255,.07)56%,transparent 80%);filter:blur(12px);mix-blend-mode:screen;opacity:.42;transition:opacity .25s ease,filter .25s ease;}
#cqpfolio .cqp-card:hover .cqp-spot{opacity:.62!important;}
#cqpfolio .cqp-namebox{width:86%;overflow:hidden;mask-image:linear-gradient(to right,transparent 0%,black 12%,black 88%,transparent 100%);}
#cqpfolio .cqp-name{margin:0;font-weight:900;letter-spacing:.3px;font-size:clamp(16px,1.6vw,20px);white-space:nowrap;}
#cqpfolio .cqp-name span{display:inline-block;animation:cqp-marquee 12s linear infinite;}
@keyframes cqp-marquee{to{transform:translateX(-50%)}}
#cqpfolio .cqp-meta{display:flex;flex-direction:column;align-items:center;gap:6px;}
#cqpfolio .cqp-btn{padding:10px 24px;border-radius:999px;border:1.6px solid rgba(255,255,255,.5);background:rgba(255,255,255,.12);color:#fff;font-weight:400; font-size: small;text-decoration:none;backdrop-filter:blur(12px) brightness(1.15);opacity:0;transform:translateY(10px) scale(.98);transition:.3s;}
#cqpfolio .cqp-btn:hover{backdrop-filter:blur(2px) brightness(3.25);opacity:1%;transform:translateY(10px) scale(.98);transition:.3s;}
#cqpfolio .cqp-card:hover .cqp-overlay{opacity:1;backdrop-filter:saturate(130%) blur(4px);}
#cqpfolio .cqp-card:hover .cqp-btn{opacity:1;transform:translateY(0) scale(1.02);}
#cqpfolio .cqp-card:hover .cqp-figure img{transform:scale(1.08);}
@keyframes cqp-in{0%{opacity:0;filter:blur(10px);transform:translateY(10px)}100%{opacity:1;filter:blur(0);transform:translateY(0)}}
@media(max-width:980px){#cqpfolio .cqp-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:640px){#cqpfolio .cqp-grid{grid-template-columns:1fr;}}
@media(prefers-reduced-motion:no-preference){#cqpfolio .cqp-card.cqp-ready{animation:cqp-in .7s cubic-bezier(.2,.8,.2,1) both;}}

.behancelogo {filter: grayscale(1) brightness(99);}