*{box-sizing:border-box}html{background:#020817;color:#fff;font-family:Inter,system-ui,sans-serif}body{margin:0;min-height:100vh;background:radial-gradient(circle at 15% 10%,#0b326844,transparent 30rem),radial-gradient(circle at 85% 25%,#6125a233,transparent 28rem),#020817;color:#eef5ff}a{color:inherit;text-decoration:none}.portfolio-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px clamp(18px,5vw,70px);background:#020817e8;border-bottom:1px solid #123464;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:2px solid #19d9ff;color:#25d7ff;font-weight:800;box-shadow:0 0 18px #1fcaff66}.brand strong{display:block;font-size:16px;letter-spacing:1.5px}.brand small{display:block;color:#8fa4c7;font-size:8px;letter-spacing:2.3px;margin-top:2px}.back-btn{padding:11px 16px;border:1px solid #31518b;border-radius:999px;background:#07152b;color:#dceaff;font-size:13px;transition:.2s}.back-btn:hover{border-color:#37cfff;box-shadow:0 0 20px #27aaff44}.portfolio-shell{width:min(1180px,calc(100% - 34px));margin:0 auto;padding:72px 0 90px}.portfolio-heading{text-align:center;margin:0 auto 36px;max-width:760px}.eyebrow{display:inline-block;color:#40d9ff;font-size:11px;letter-spacing:5px;margin-bottom:12px}.portfolio-heading h1{margin:0;font-size:clamp(34px,7vw,64px);line-height:1.02;background:linear-gradient(100deg,#fff 15%,#13d7ff 52%,#d82eff);-webkit-background-clip:text;color:transparent}.portfolio-heading p{color:#9cafca;line-height:1.7}.portfolio-filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:0 0 26px;padding:4px}.portfolio-filter{appearance:none;border:1px solid #274c82;border-radius:999px;background:#07152b;color:#b9cae4;padding:9px 15px;font:600 12px Inter,system-ui,sans-serif;cursor:pointer;transition:.2s}.portfolio-filter:hover{border-color:#39ccff;color:#fff;box-shadow:0 0 18px #1aa8ff33}.portfolio-filter.active{border-color:#39ccff;color:#fff;background:linear-gradient(100deg,#0d6bd8,#6537dd);box-shadow:0 0 22px #287cff44}.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.portfolio-card{overflow:hidden;border:1px solid #123d73;border-radius:22px;background:linear-gradient(150deg,#07162cdd,#07101ddd);box-shadow:0 18px 50px #0008}.media-stage{position:relative;aspect-ratio:9/16;background:linear-gradient(145deg,#173365,#341744);display:grid;place-items:center;overflow:hidden}.portfolio-card.landscape .media-stage{aspect-ratio:16/10}.poster{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:transparent;color:#fff}.poster img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}.poster-fallback{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(145deg,#173365,#341744)}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:#031426d9;border:1px solid #53dcff;box-shadow:0 0 26px #19c4ff66;font-size:24px}.media-stage video{width:100%;height:100%;display:block;object-fit:contain;background:#000}.media-stage img.still{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}.card-info{padding:18px}.category{font-size:11px;color:#47d7ff;text-transform:uppercase;letter-spacing:1.2px}.card-info h2{font-size:18px;margin:7px 0 8px}.card-info p{font-size:13px;color:#9fb0c9;line-height:1.55;margin:0}.loading-card,.empty-card{grid-column:1/-1;padding:40px;text-align:center;border:1px solid #143a69;border-radius:22px;background:#071327;color:#aabbd4}.coming-soon{color:#d98cff}@media(max-width:900px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.portfolio-filters{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px;scrollbar-width:none}.portfolio-filters::-webkit-scrollbar{display:none}.portfolio-filter{flex:0 0 auto}.portfolio-nav{padding:12px 14px}.brand strong{font-size:13px}.back-btn{font-size:11px;padding:9px 12px}.portfolio-shell{width:min(100% - 28px,1180px);padding-top:48px}.portfolio-grid{grid-template-columns:1fr}.portfolio-heading{text-align:left}.portfolio-card{border-radius:18px}.media-stage{aspect-ratio:9/14}}
