/* ==========================================================================
   Indrajit Karmakar Theme - Responsive Breakpoints & Overrides
   ========================================================================== */

/* 1200px and below */
@media (max-width: 1200px) {
	.ik-cards-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.ik-values-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.ik-hero-title {
		font-size: 3.2rem;
	}
}

/* 992px and below (Tablets & Medium screens) */
@media (max-width: 992px) {
	.ik-nav,
	.ik-btn-header {
		display: none;
	}

	.ik-mobile-toggle {
		display: flex;
	}

	.ik-hero-grid,
	.ik-about-grid,
	.ik-contact-grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.ik-hero-visual-wrapper {
		order: 2;
		width: 100%;
		max-width: 100%;
	}

	.ik-hero-content {
		order: 1;
		width: 100%;
	}

	.ik-cards-grid-3 {
		grid-template-columns: 1fr;
	}

	.ik-footer-grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.ik-section {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	.ik-terminal-card {
		max-width: 100%;
	}
}

/* 768px and below (Small tablets & Mobile screens) */
@media (max-width: 768px) {
	.ik-hero-title {
		font-size: 2.4rem;
		line-height: 1.15;
	}

	.ik-section-title {
		font-size: 1.85rem;
	}

	.ik-cards-grid,
	.ik-values-grid,
	.ik-stats-grid {
		grid-template-columns: 1fr;
	}

	.ik-hero-actions {
		flex-direction: column;
		width: 100%;
		gap: 0.75rem;
	}

	.ik-hero-actions .ik-btn {
		width: 100%;
	}

	.ik-footer-bottom-inner {
		flex-direction: column;
		text-align: center;
		gap: 0.75rem;
	}

	.ik-cta-title {
		font-size: 1.85rem;
	}

	.ik-cta-card {
		padding: 2.5rem 1.25rem;
	}

	.ik-terminal-pipeline {
		display: none;
	}
}

/* 480px and below (Small mobile devices: 390px, 414px) */
@media (max-width: 480px) {
	.ik-hero-title {
		font-size: 2.1rem;
	}

	.ik-hero-subtitle {
		font-size: 1.1rem;
	}

	.ik-terminal-body {
		padding: 1rem;
		font-size: 0.8rem;
		word-break: break-word;
	}

	.ik-form-card {
		padding: 1.25rem;
	}

	.ik-container {
		padding-left: 1rem;
		padding-right: 1rem;
	}
}

/* 360px and 320px (Extra small mobile devices) */
@media (max-width: 360px) {
	.ik-hero-title {
		font-size: 1.85rem;
	}

	.ik-hero-subtitle {
		font-size: 0.98rem;
	}

	.ik-btn {
		padding: 0.65rem 1.2rem;
		font-size: 0.88rem;
	}

	.ik-terminal-body {
		font-size: 0.74rem;
		padding: 0.75rem;
	}
}
