/* --- 1. Widescreen Layout Fix --- */
/* This expands the narrow container and removes the excess white space on the sides */
#wrapper, .container {
	width: 95% !important;
	max-width: 1400px !important;
	margin: 0 auto !important;
}

/* --- 2. 3-Across Pricing Grid --- */
/* Target the order boxes specifically for the WordPress plans */
.orderbox {
	width: 31.5% !important; /* Forces 3 to fit even with margins */
	float: left !important;
	margin-right: 1.5% !important;
	margin-bottom: 25px !important;
	min-height: 320px !important;
	box-sizing: border-box !important;

	/* Style using Diytel Blue (#89c1ff) */
	border: 2px solid #89c1ff !important; 
	border-radius: 12px !important;
	background: #ffffff !important;
	padding: 20px !important;
}

/* Remove margin from the 3rd box in every row to prevent wrapping */
.orderbox:nth-of-type(3n) {
	margin-right: 0 !important;
}

/* 3. Kill the 'clear' divs that were dropping boxes to the next line */
.clear, div[style*="clear"] {
	display: none !important;
}

/* 4. Ensure the forms don't break the float */
form[method="post"] {
	display: inline;
}

/* 5. Mobile Responsiveness: Stack boxes on small screens */
@media (max-width: 900px) {
	.orderbox {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
	}
}
