/* =====================================
   Large Laptop (1200px)
===================================== */

@media(max-width:1200px) {

	.container {

		width: 95%;

	}

	.hero h1 {

		font-size: 58px;

		line-height: 65px;

	}

	.section-title h2,
	.process-title h2,
	.why-content h2 {

		font-size: 40px;

	}

}


/* =====================================
   Tablet (992px)
===================================== */

@media(max-width:992px) {

	.topbar {

		display: none;

	}

	.nav {

		flex-wrap: wrap;

	}

	nav {

		width: 100%;
		margin-top: 0px;

	}

	nav ul {

		justify-content: center;

		flex-wrap: wrap;

	}

	.hero {

		padding: 80px 0;

	}

	.hero-grid {

		grid-template-columns: 1fr;

		text-align: center;

	}

	.hero-image {

		margin-top: 50px;

	}

	.hero-btn {

		justify-content: center;

	}

	.feature-grid {

		grid-template-columns: repeat(2, 1fr);

	}

	.service-grid {

		grid-template-columns: repeat(2, 1fr);

	}

	.process-wrapper {

		flex-wrap: wrap;

		gap: 40px;

	}

	.process-item {

		width: 45%;

	}

	.process-line {

		display: none;

	}

	.why-grid {

		grid-template-columns: 1fr;

	}

	.counter-grid {

		grid-template-columns: repeat(2, 1fr);

	}

	.brand-grid {

		grid-template-columns: repeat(3, 1fr);

	}

	.testimonial-grid {

		grid-template-columns: 1fr;

	}

	.footer-grid {

		grid-template-columns: repeat(2, 1fr);

	}

}

/* =====================================
   Mobile
===================================== */

@media(max-width:768px) {

	.logo h2 {

		font-size: 24px;

	}

	.logo p {

		display: none;

	}

	nav ul {

		flex-direction: column;

		text-align: center;

	}

	nav li {

		margin: 12px 0;

	}

	.btn {

		display: none;

	}

	.hero {

		padding: 70px 0;

	}

	.hero h1 {

		font-size: 42px;

		line-height: 50px;

	}

	.hero h5 {

		font-size: 20px;

	}

	.hero p {

		font-size: 16px;

		line-height: 30px;

	}

	.hero ul li {

		font-size: 16px;

	}

	.hero-btn {

		flex-direction: column;

	}

	.call-btn,
	.chat-btn {

		width: 100%;

		text-align: center;

	}

	.feature-grid {

		grid-template-columns: 1fr;

	}

	.service-grid {

		grid-template-columns: 1fr;

	}

	.process-item {

		width: 100%;

	}

	.why-list {

		grid-template-columns: 1fr;

	}

	.counter-grid {

		grid-template-columns: 1fr;

	}

	.brand-grid {

		grid-template-columns: repeat(2, 1fr);

	}

	.footer-grid {

		grid-template-columns: 1fr;

	}

	.copyright {

		flex-direction: column;

		text-align: center;

		gap: 20px;

	}

	.footer-logo {

		justify-content: center;

	}

	.social {

		justify-content: center;

	}

}
/* =====================================
   Small Mobile
===================================== */

@media(max-width:480px) {

	.hero h1 {

		font-size: 34px;

		line-height: 42px;

	}

	.section-title h2,
	.process-title h2,
	.why-content h2 {

		font-size: 30px;

		line-height: 40px;

	}

	.section-title p,
	.process-title p {

		font-size: 16px;

	}

	.feature-box,
	.service-card,
	.testimonial-card {

		padding: 25px;

	}

	.brand-grid {

		grid-template-columns: 1fr;

	}

	.counter h3 {

		font-size: 28px;

	}

}