/* Large tablets / small laptops */
@media (max-width: 1100px) {
	.hero {
		grid-template-columns: 1fr;
	}

	.profile-card {
		flex-direction: row;
		align-items: center;
	}

	.profile-image-wrap {
		flex: 0 0 220px;
	}

	.project-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.resume-card {
		align-items: flex-start;
		flex-direction: column;
	}

	.resume-actions {
		justify-content: flex-start;
	}
}

/* Tablets */
@media (max-width: 860px) {
	.top-nav {
		align-items: stretch;
		border-radius: 20px;
		flex-direction: column;
		gap: 0.75rem;
		padding: 0.85rem;
		top: 0.5rem;
	}

	.brand-chip {
		justify-content: center;
	}

	.nav-actions {
		justify-content: center;
	}

	.nav-actions li {
		display: flex;
	}

	.nav-actions .ghost-btn,
	.nav-actions .solid-btn {
		min-width: 120px;
	}

	.hero {
		margin-top: 1.25rem;
	}

	.hero-content,
	.profile-card,
	.projects-section,
	.resume-card {
		border-radius: 18px;
	}

	.hero-content {
		padding: 1.35rem;
	}

	.tech-tabs {
		grid-template-columns: 1fr;
	}

	.project-grid {
		grid-template-columns: 1fr;
	}

	.overlay-card {
		padding: 1rem 0.95rem 0.9rem;
	}
}

/* Mobile */
@media (max-width: 600px) {
	body {
		font-size: 15px;
	}

	.top-nav {
		width: calc(100% - 1rem);
	}

	.nav-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		width: 100%;
	}

	.nav-actions li {
		width: 100%;
	}

	.nav-actions .ghost-btn,
	.nav-actions .solid-btn,
	.nav-link-btn {
		width: 100%;
	}

	.hero {
		padding: 0 0.5rem;
	}

	.main-content {
		padding: 0 0.5rem;
	}

	.hero-title {
		min-height: 2.8em;
	}

	.hero-cta {
		flex-direction: column;
	}

	.hero-cta .ghost-btn,
	.hero-cta .solid-btn {
		width: 100%;
	}

	.profile-card {
		flex-direction: column;
	}

	.profile-image-wrap {
		flex: 0 0 auto;
		width: 100%;
	}

	.project-actions {
		flex-direction: column;
	}

	.project-actions a {
		width: 100%;
	}

	.resume-actions {
		flex-direction: column;
		width: 100%;
	}

	.resume-actions .ghost-btn,
	.resume-actions .solid-btn {
		width: 100%;
	}

	.contact-item {
		align-items: flex-start;
	}

	.contact-item span {
		word-break: break-word;
	}

	.overlay-panel {
		padding: 0.65rem;
	}

	.overlay-card {
		max-height: 92vh;
	}
}

/* Very small screens */
@media (max-width: 420px) {
	.nav-actions {
		grid-template-columns: 1fr;
	}

	.hero-title {
		font-size: 1.7rem;
	}

	.skill-pill {
		font-size: 0.82rem;
	}

	.project-body {
		padding: 0.8rem;
	}
}