feat(themes): better neogothic theme

templates/custom/portfolio.tmpl

@@ -72,7 +72,6 @@
 		margin-bottom: 2rem;
 		background: var(--color-box-header);
 		padding: 1rem;
-		border-radius: 4px;
 		border: 1px solid var(--color-secondary);
 	}
 
@@ -126,14 +125,14 @@
 	.portfolio-card {
 		background-color: var(--color-box-body);
 		border: 1px solid var(--color-secondary);
-		border-radius: 6px;
 		display: flex;
 		flex-direction: column;
 		height: 380px;
 		position: relative;
-		transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
+		transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
 		overflow: hidden;
 		text-decoration: none !important;
+		cursor: pointer;
 	}
 
 	.portfolio-card:hover {
@@ -434,16 +433,18 @@ document.addEventListener('DOMContentLoaded', async () => {
 		filteredItems.forEach(item => {
 			const card = document.createElement('div');
 			card.className = 'portfolio-card';
-			
+
 			const langColor = getLangColor(item.language);
-			
-			card.style.setProperty('--hover-color', langColor);
-			card.addEventListener('mouseenter', () => {
-				card.style.borderColor = langColor;
-			});
-			card.addEventListener('mouseleave', () => {
-				card.style.borderColor = 'var(--color-secondary)';
-			});
+
+			const hexToRgb = (hex) => {
+				const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+				return result ?
+					`${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}` :
+					'138, 146, 153';
+			};
+
+			card.style.setProperty('--glow-color', langColor);
+			card.style.setProperty('--glow-rgb', hexToRgb(langColor));
 
 			let linksHtml = '';
 			linksHtml += `<a href="${item.url}" class="portfolio-link" style="color: ${langColor}" target="_blank">git</a>`;