/*
 * Mivure — mobile-only responsive fixes
 * All rules MUST be inside @media — never affect desktop (≥1280px layout)
 */

/* ── Mobile navigation (<1280px — matches legacy hamburger breakpoint) ── */
@media (max-width: 1279px) {
	body._lock {
		overflow: hidden;
	}

	.menu__body._active {
		left: 0 !important;
	}

	.menu__icon._active span {
		transform: scale(0) translate(0, -50%);
	}

	.menu__icon._active::before {
		top: 50%;
		transform: rotate(-45deg) translate(0, -50%);
	}

	.menu__icon._active::after {
		bottom: 50%;
		transform: rotate(45deg) translate(0, 50%);
	}

	.menu__body {
		top: 80px !important;
		display: flex;
		flex-direction: column;
		padding-bottom: 2rem;
		background: var(--mv-bg) !important;
	}

	.menu__list {
		flex: 1 1 auto;
		padding: 1rem 0;
	}

	.menu__list > li {
		border-bottom: 1px solid var(--mv-border);
	}

	.menu__link,
	.main-menu-link {
		display: block;
		padding: 1rem 1.5rem !important;
		font-size: 1rem !important;
	}
}

/* Header CTAs — only hide desktop buttons on phones (legacy: 768px) */
@media (max-width: 768px) {
	.header-btn__wrapper {
		display: none !important;
	}

	.header-btn__mobile {
		display: flex !important;
		flex-direction: column;
		gap: 0.75rem;
		padding: 1.5rem;
		margin-top: auto;
	}

	.header-btn__mobile .sign-up-btn,
	.header-btn__mobile .log-in-btn {
		width: 100%;
		justify-content: center;
	}

	.header__container {
		padding: 0 1rem;
		min-height: 64px;
	}

	.header__logo img {
		width: 40px !important;
		height: 40px !important;
		max-width: 40px !important;
	}
}

/* ── Homepage ── */
@media (max-width: 1279px) {
	.main-wrapper--text {
		flex: 1 1 100% !important;
		max-width: 100% !important;
		margin-right: 0 !important;
	}

	.main-collaboration__img {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		height: auto !important;
	}

	.main-wrapper {
		flex-wrap: wrap;
	}
}

@media (max-width: 768px) {
	.home .main-wrapper,
	.page-home-new .main-wrapper,
	.main-wrapper {
		margin-top: 72px !important;
	}

	.section-2 .s2-block,
	.home .section-2 .s2-block,
	.page-home-new .section-2 .s2-block {
		width: 100% !important;
		max-width: 100%;
	}

	.faq-accordions {
		grid-template-columns: 1fr !important;
	}

	.home .cta .section-wrapper,
	.page-home-new .cta .section-wrapper {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.entry-content table,
	.text-content table {
		display: block;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 480px) {
	.section-wrapper {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}

	.main-btm-content .form-block__flex {
		flex-direction: column;
	}

	.main-btm-content .form-block__flex input,
	.main-btm-content .form-block__flex button {
		width: 100%;
	}
}

/* ── Breadcrumbs ── */
@media (max-width: 640px) {
	.breadcrumbs {
		padding-top: calc(72px + 1rem);
	}

	.breadcrumbs__list {
		font-size: 0.8125rem;
	}
}

/* ── Blog & help listing ── */
@media (max-width: 767px) {
	.page-title {
		padding: 1rem 0 1.5rem;
	}

	.page-title__wrapper {
		flex-direction: column;
		align-items: stretch;
	}

	.search-block {
		flex: 1 1 100%;
		max-width: none;
	}

	.blog-list {
		grid-template-columns: 1fr;
	}

	.help-center__list {
		grid-template-columns: 1fr;
	}

	.blog-category__list ul {
		gap: 0.375rem;
	}
}

/* ── Single post / help — phones & small tablets only ── */
@media (max-width: 767px) {
	.single-help-center__wrapper,
	.single-blog__wrapper {
		gap: 1.5rem;
	}

	.layout-sidebar {
		order: -1;
	}

	.help-center__back a {
		margin-bottom: 1rem;
	}

	.title-block h1 {
		font-size: clamp(1.5rem, 5vw, 2rem);
	}

	.text-content h2,
	.entry-content h2 {
		font-size: 1.375rem;
	}

	.text-content h3,
	.entry-content h3 {
		font-size: 1.125rem;
	}

	.help-center__soc-like {
		flex-direction: column;
		gap: 1rem;
	}

	.single-page__next-link .next-link__wrapper {
		flex-wrap: wrap;
	}
}

/* ── Pricing — tablets & phones ── */
@media (max-width: 991px) {
	.compare-table-wrap {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		margin: 0 -0.25rem;
		padding-bottom: 0.5rem;
	}

	.compare-table {
		min-width: 36rem;
	}

	.pricing-hero__title {
		font-size: clamp(1.75rem, 5vw, 2.25rem);
	}

	.pricing-cards {
		margin-left: -1rem;
		margin-right: -1rem;
		padding-left: 1rem;
		border-radius: 0;
	}

	.pricing-card {
		flex: 0 0 min(88vw, 320px);
	}
}

@media (max-width: 640px) {
	.pricing-breadcrumbs {
		padding-top: calc(72px + 1rem);
	}

	.pricing-hero {
		padding-top: 1.5rem;
	}
}

/* ── Footer ── */
@media (max-width: 767px) {
	.footer.footer--light {
		padding: 3rem 0 1.5rem;
	}

	.footer-light__top {
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
		margin-bottom: 2rem;
	}

	.footer-light__tagline {
		margin-left: 0 !important;
		max-width: none;
	}

	.footer-tg-link {
		margin-left: 0 !important;
	}

	.footer-light__menus {
		grid-template-columns: 1fr 1fr;
		gap: 1.5rem 1rem;
		margin-bottom: 2rem;
	}

	.footer-light__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
	}
}

@media (max-width: 400px) {
	.footer-light__menus {
		grid-template-columns: 1fr;
	}
}
