/* =============================== RESPONSIVE =============================== */

@media (max-width: 767px) {
.section {padding: 40px 0;}
.heading {font-size: 24px;}
.mid-heading {font-size: 15px;}
.mt-50 {margin-top: 35px;}

.main-header {top: 8px;}
.header-inner {height: 70px;padding: 0 15px;}
.logo img {width: 135px;}
.header-nav {display: none;}
.header-right {display: none;}
.mobile-header-right {height: 70px;display: flex;align-items: center;justify-content: flex-end;gap: 10px;}
.mobile-call {width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;color: var(--black);border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 50%;text-decoration: none;}
.mobile-menu-btn {width: 40px;height: 40px;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 4px;padding: 0;
    border: 0;border-radius: 50%;background: var(--green);cursor: pointer;}
.mobile-menu-btn span {width: 18px;height: 2px;display: block;background: #fff;border-radius: 5px;}

.hero-content {width: 80%;}
.big-heading {font-size: 32px;}
.big-paragraph {font-size: 16px;line-height: 1.5;}
.feature-card {padding: 12px 0px;}
.key-feature {padding: 15px 0;}
.main-circle {width: 350px;height: 350px;}
.small-circle {width: 150px;height: 150px;top: auto;bottom: 0;right: 25px;}
.why-section {padding: 30px;}
.metric-card {padding: 18px;}
.stats-grid {gap: 5px;}
.stats-card {padding: 20px 20px;}
.stats-number {font-size: 24px;margin-bottom: 5px;}
.cta-orbit-section .w-50 {width: 90% !important;}
.icon-wordpress {top: 8%;right: 10%;}
.icon-html {top: 8%;left: 10%;}
.icon-figma {top: 3%;left: 50%;transform: translateX(-50%);}
.icon-css{bottom: 3%;left: 50%;transform: translateX(-50%);}
.icon-node {bottom: 8%;left: 10%;}
.icon-github {bottom: 8%;right: 10%;}
.product-buy-card h4 {font-size: 20px;}
.tech-title h3 {font-size: 24px;}
.tech-logo-item img {max-height: 40px;}
.testimonial-card {padding: 25px;}
.footer-section {padding: 40px 0 0;}
.footer-box,.footer-contact{margin-top: 20px;}
.footer-main {padding-bottom: 30px;}
.footer-bottom {flex-direction:column;gap: 10px;padding: 12px 0;align-items: flex-start;}
.portfolio-filters {flex-wrap: balance;}
.service-card {height: auto;margin-bottom: 10px;}
}