/* Technologies page styles (placeholder) */
.tech-category { overflow: hidden; }
.tech-category svg { display: block; width: 100%; height: auto; }

/* Technologies styles extracted from main stylesheet */
.technologies { background: var(--gray-100); }
.tech-categories { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
.tech-category { background: var(--gray-100); padding: var(--spacing-md); border-radius: 1rem; box-shadow: var(--shadow-md); }
.tech-category-image { width: 100%; height: 160px; margin: -var(--spacing-md) -var(--spacing-md) var(--spacing-md) -var(--spacing-md); border-radius: 1rem 1rem 0 0; overflow: hidden; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--primary-light) 0%, var(--accent-color) 100%); transition: var(--transition-normal); }
.tech-category-image svg { width: 100%; height: 100%; object-fit: cover; transition: var(--transition-normal); }
.tech-category:hover .tech-category-image svg { transform: scale(1.1) rotate(2deg); filter: brightness(1.15); }
.tech-category h3 { margin-bottom: var(--spacing-md); color: var(--primary-color); text-align: center; }
.tech-icons { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); justify-content: center; }
.tech-item { flex: 0 0 auto; min-width: 100px; max-width: 120px; display: flex; flex-direction: column; align-items: center; gap: var(--spacing-sm); padding: var(--spacing-sm); background: var(--white); border-radius: 0.75rem; transition: var(--transition-normal); box-shadow: var(--shadow-sm); }
.tech-item:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.tech-item i { font-size: 2.5rem; color: var(--primary-color); transition: var(--transition-fast); }
.tech-item:hover i { color: var(--primary-dark); transform: scale(1.1); }
.tech-item span { font-weight: 600; color: var(--text-primary); font-size: 0.875rem; }

/* Developer Cycle Section */
.developer-cycle-section { margin-top: var(--spacing-xl); margin-bottom: var(--spacing-xl); display: flex; justify-content: center; align-items: center; }
.developer-cycle-image { width: 100%; max-width: 100%; height: auto; display: block; border-radius: 1rem; box-shadow: var(--shadow-lg); transition: var(--transition-normal); }
.developer-cycle-image:hover { transform: translateY(-5px); box-shadow: var(--shadow-xl); filter: brightness(1.05); }

/* Tech Stats Section */
.tech-stats { margin-top: var(--spacing-xl); background: linear-gradient(135deg, var(--primary-dark) 0%, var(--accent-color) 100%); border-radius: 1rem; padding: var(--spacing-lg); display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--spacing-md); text-align: center; color: var(--white); box-shadow: var(--shadow-xl); }
.tech-stats .stat-item { background: transparent; box-shadow: none; padding: 0; transform: none; }
.tech-stats .stat-number { color: var(--white); font-size: 2.5rem; margin-bottom: 0.5rem; }
.tech-stats .stat-label { color: rgba(255, 255, 255, 0.9); font-size: 1rem; }

/* Responsive design for technologies */
@media (max-width: 1024px) {
	.tech-categories { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
	.tech-stats { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
}

@media (max-width: 768px) {
	.tech-categories { grid-template-columns: 1fr; gap: 1.25rem; }
	.tech-category { padding: 1.25rem; }
	.tech-category-image { height: 140px; }
	.tech-stats { grid-template-columns: repeat(2, 1fr); gap: 1rem; padding: 1.5rem; }
	.tech-stats .stat-number { font-size: 2rem; }
}

@media (max-width: 480px) {
	.tech-item { min-width: 80px; max-width: 100px; padding: 0.5rem; }
	.tech-item i { font-size: 2rem; }
	.tech-item span { font-size: 0.75rem; }
	.tech-stats { grid-template-columns: 1fr; gap: 1rem; }
}