.starter-project-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:24px}@media (min-width:768px){.starter-project-grid{grid-template-columns:repeat(3,1fr);gap:32px}}.starter-project-item--modern{background:#fff;border-radius:16px;overflow:hidden;border:1px solid #f3f4f6;box-shadow:0 1px 3px rgb(0 0 0 / .05);transition:all 0.3s ease;display:flex;flex-direction:column}.starter-project-item--modern:hover{box-shadow:0 20px 25px -5px rgb(0 0 0 / .1),0 8px 10px -6px rgb(0 0 0 / .1);transform:translateY(-8px)}.starter-project-modern-img-wrap{position:relative;height:220px;overflow:hidden}@media (min-width:768px){.starter-project-modern-img-wrap{height:250px}}.starter-project-modern-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease}.starter-project-item--modern:hover .starter-project-modern-img-wrap img{transform:scale(1.1)}.starter-project-category-badge{position:absolute;top:16px;left:16px;background:rgb(255 255 255 / .95);backdrop-filter:blur(4px);font-size:11px;font-weight:700;padding:6px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em;color:#1f2937;z-index:10}.starter-project-modern-content{padding:20px;display:flex;flex-direction:column;flex-grow:1}@media (min-width:768px){.starter-project-modern-content{padding:24px}}.starter-project-modern-title{font-size:18px;font-weight:700;color:#111827;margin:0 0 8px 0;transition:color 0.3s}@media (min-width:768px){.starter-project-modern-title{font-size:20px}}.starter-project-item--modern:hover .starter-project-modern-title{color:var(--st-blue,#4f46e5)}.starter-project-modern-desc{font-size:14px;color:#6b7280;line-height:1.6;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@media (min-width:768px){.starter-project-modern-desc{-webkit-line-clamp:2}}.starter-project-modern-link{margin-top:auto;display:inline-flex;align-items:center;font-size:13px;font-weight:700;color:var(--st-blue,#4f46e5);text-decoration:none}.starter-project-modern-link i{margin-left:4px;transition:transform 0.3s}.starter-project-item--modern:hover .starter-project-modern-link i{transform:translate(2px,-2px)}.starter-project-item--overlay{position:relative;height:350px;border-radius:16px;overflow:hidden;cursor:pointer;display:block;text-decoration:none}@media (min-width:768px){.starter-project-item--overlay{height:400px}}.starter-project-item--overlay img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease}.starter-project-item--overlay:hover img{transform:scale(1.1)}.starter-project-overlay-grad{position:absolute;inset:0;background:linear-gradient(to top,rgb(0 0 0 / .9),rgb(0 0 0 / .4),transparent);opacity:.8;transition:opacity 0.3s}.starter-project-item--overlay:hover .starter-project-overlay-grad{opacity:.95}.starter-project-overlay-content{position:absolute;inset:0;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}@media (min-width:768px){.starter-project-overlay-content{padding:32px}}.starter-project-overlay-inner{transform:translateY(0);transition:transform 0.4s ease}@media (min-width:992px){.starter-project-overlay-inner{transform:translateY(20px)}.starter-project-item--overlay:hover .starter-project-overlay-inner{transform:translateY(0)}}.starter-project-overlay-cat{display:block;color:#818cf8;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.starter-project-overlay-title{font-size:20px;font-weight:700;color:#fff;margin:0 0 8px 0;line-height:1.2}@media (min-width:768px){.starter-project-overlay-title{font-size:24px}}.starter-project-overlay-hidden{overflow:hidden;transition:all 0.4s ease 0.1s}@media (max-width:991px){.starter-project-overlay-hidden{height:auto;opacity:1}.starter-project-overlay-grad{opacity:.9}}@media (min-width:992px){.starter-project-overlay-hidden{height:0;opacity:0}.starter-project-item--overlay:hover .starter-project-overlay-hidden{height:auto;opacity:1}}.starter-project-overlay-desc{color:#d1d5db;font-size:14px;margin-bottom:16px;line-height:1.5}.starter-project-overlay-link{display:inline-block;color:#fff;font-size:13px;font-weight:700;border-bottom:1px solid #6366f1;padding-bottom:2px;text-decoration:none}.starter-project-overlay-icon{position:absolute;top:20px;right:20px;width:40px;height:40px;background:rgb(255 255 255 / .1);backdrop-filter:blur(4px);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;opacity:1;transform:translateY(0);transition:all 0.3s}@media (min-width:992px){.starter-project-overlay-icon{opacity:0;transform:translateY(-10px)}.starter-project-item--overlay:hover .starter-project-overlay-icon{opacity:1;transform:translateY(0)}}.starter-project-item--tech{position:relative;background:#111827;border-radius:12px;overflow:hidden;border:1px solid #1f2937;transition:border-color 0.3s;display:block;text-decoration:none}.starter-project-item--tech:hover{border-color:#6366f1}.starter-project-tech-img{position:relative;height:200px;overflow:hidden}@media (min-width:768px){.starter-project-tech-img{height:220px}}.starter-project-tech-img img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:opacity 0.3s}@media (max-width:767px){.starter-project-tech-img img{opacity:.6}}.starter-project-item--tech:hover .starter-project-tech-img img{opacity:1}.starter-project-tech-overlay{position:absolute;inset:0;background:rgb(99 102 241 / .2);mix-blend-mode:overlay;opacity:0;transition:opacity 0.3s}.starter-project-item--tech:hover .starter-project-tech-overlay{opacity:1}.starter-project-tech-content{padding:20px;position:relative}@media (min-width:768px){.starter-project-tech-content{padding:24px}}.starter-project-tech-icon{position:absolute;top:-24px;right:20px;background:#4f46e5;color:#fff;padding:8px;border-radius:8px;box-shadow:0 4px 6px rgb(0 0 0 / .3);transition:transform 0.3s;z-index:5}@media (min-width:768px){.starter-project-tech-icon{right:24px;padding:10px}}.starter-project-item--tech:hover .starter-project-tech-icon{transform:scale(1.1)}.starter-project-tech-cat{font-family:monospace;font-size:12px;color:#818cf8;margin-bottom:8px}.starter-project-tech-title{font-size:18px;font-weight:700;color:#fff;margin:0 0 12px 0;transition:color 0.3s}@media (min-width:768px){.starter-project-tech-title{font-size:20px}}.starter-project-item--tech:hover .starter-project-tech-title{color:#a5b4fc}.starter-project-tech-desc{color:#9ca3af;font-size:13px;margin-bottom:16px;padding-left:12px;border-left:2px solid #374151;transition:border-color 0.3s}@media (max-width:767px){.starter-project-tech-desc{border-color:#6366f1}}.starter-project-item--tech:hover .starter-project-tech-desc{border-color:#6366f1}.starter-project-tech-status{display:flex;align-items:center;font-family:monospace;font-size:11px;color:#6b7280;transition:color 0.3s}@media (max-width:767px){.starter-project-tech-status{color:#fff}}.starter-project-item--tech:hover .starter-project-tech-status{color:#fff}.starter-tech-dot{width:8px;height:8px;background:#22c55e;border-radius:50%;margin-right:8px;animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(34 197 94 / .7)}70%{box-shadow:0 0 0 6px #fff0}100%{box-shadow:0 0 0 0 #fff0}}