/* WPNest — responsive breakpoints. */

/* Single-product layout collapses earlier than other 2-col grids — at tablet
   landscape / small laptop the gallery in 1.4fr next to the info column gets
   too narrow and the image looks tiny. Stack gallery above title sooner. */
@media (max-width: 1240px) {
	.prd-grid {
		grid-template-columns: 1fr;
	}
	.prd-gallery { position: static; }
	.prd-main-img {
		aspect-ratio: 4 / 3;
		max-width: 720px;
		margin: 0 auto;
	}
}

@media (max-width: 980px) {
	.hero-grid,
	.lm,
	.demo-block,
	.blog-feature {
		grid-template-columns: 1fr;
	}
	.featured-grid,
	.pricing-grid,
	.how,
	.blog-list,
	.blog-teaser,
	.xsell {
		grid-template-columns: 1fr 1fr;
	}
	.stats {
		grid-template-columns: 1fr 1fr;
	}
	.stat:nth-child(2) { border-right: 0; }
	.stat:nth-child(1),
	.stat:nth-child(2) { border-bottom: 1px solid var(--line); }
	.ftr-grid {
		grid-template-columns: 1fr 1fr;
	}
	.hero-visual { display: none; }
	.prd-tabs { margin-top: 56px; }
	.how-step .arrow { display: none; }
	.lm { padding: 40px; }
}

@media (max-width: 640px) {
	.featured-grid,
	.pricing-grid,
	.how,
	.blog-list,
	.blog-teaser,
	.xsell,
	.stats,
	.ftr-grid {
		grid-template-columns: 1fr;
	}
	.nav { display: none; }
	.nav.open {
		display: flex;
		position: absolute;
		top: 68px;
		left: 0;
		right: 0;
		background: var(--card);
		border-bottom: 1px solid var(--line);
		flex-direction: column;
		gap: 0;
		padding: 12px;
	}
	.nav.open a {
		padding: 12px 14px;
		border-radius: 10px;
	}
	.nav-toggle { display: grid; place-items: center; }
	.stat {
		border-right: 0 !important;
		border-bottom: 1px solid var(--line);
	}
	.stat:last-child { border-bottom: 0; }
	.lm { padding: 32px; }
	.hero h1 { font-size: clamp(32px, 8vw, 48px); }
	.prd-info h1 { font-size: 28px; }
	.prd-licenses { grid-template-columns: 1fr; }
	.prd-cta-row { flex-direction: column; }
	.prd-trust-row { grid-template-columns: 1fr; }
	.lm form { flex-direction: column; }
	.lm form .btn { justify-content: center; }
	.cl-row { grid-template-columns: 1fr; gap: 8px; }
	.demo-block { grid-template-columns: 1fr; }
	.reviews-summary { grid-template-columns: 1fr; }
	.section { padding: 56px 0; }
	.hero { padding: 32px 0 48px; }
	.container { padding: 0 18px; }
}
