/* AI app launch & SaaS consulting pages (2026 redesign). Loaded after the theme CSS on the
   pages that use it; everything is scoped under .mg so the classic hosting pages are untouched. */

.mg {
	padding: 18px 8px 28px;
	font-family: 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: #323232;
}
.mg h1, .mg h2, .mg h3 {
	margin: 0;
	font-family: 'ExpletusSans', Arial, sans-serif;
	color: #1E3557;
	line-height: 1.12;
	text-transform: none;
}
.mg h1 { font-size: 44px; font-weight: 900; }
.mg h2 { font-size: 30px; font-weight: 700; }
.mg h3 { font-size: 19px; font-weight: 700; }
.mg p {
	margin: 0;
	color: #3D4652;
	line-height: 1.55;
}
.mg a { color: #1E3557; }
.mg a:hover { color: #C63D25; }
.mg ul.mg-list {
	list-style: disc;
	margin: 0;
	padding-left: 20px;
}
.mg ul.mg-list li { margin-bottom: 6px; color: #3D4652; }
.mg .mg-accent { color: #C63D25; }
.mg .mg-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* Stacks */
.mg-stack { display: flex; flex-direction: column; gap: 14px; }
.mg-row { display: flex; flex-wrap: wrap; gap: 16px; }
.mg-row > * { flex: 1 1 260px; }
.mg-split { display: flex; flex-wrap: wrap; gap: 28px; align-items: center; }
.mg-split > .mg-split-main { flex: 999 1 480px; min-width: 0; }
.mg-split > .mg-split-side { flex: 1 1 240px; }
.mg-split img { display: block; max-width: 100%; height: auto; margin: 0 auto; }

/* Hero */
.mg-hero {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: center;
	background: #EAF3FC;
	border: 1px solid #B9D4EE;
	border-radius: 14px;
	padding: 36px 32px;
}
.mg-hero-mascot { align-items: flex-end; padding-bottom: 0; }
.mg-hero-mascot .mg-hero-text { padding-bottom: 36px; }
.mg-hero-text { flex: 999 1 460px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.mg-hero-side { flex: 1 1 240px; display: flex; flex-direction: column; align-items: center; }
.mg-hero-side img { display: block; max-width: 100%; height: auto; }
.mg-kicker {
	font-family: 'ExpletusSans', Arial, sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #C63D25 !important;
}
.mg-hand {
	font-family: 'ArchitectsDaughterRegular', cursive;
	font-size: 20px;
	color: #C63D25 !important;
}
.mg-lead { font-size: 17px; }

/* Thought bubble beside the mascot */
.mg-bubble {
	background: #fff;
	border: 2px solid #B9D4EE;
	border-radius: 36px;
	padding: 14px 20px;
	font-family: 'ArchitectsDaughterRegular', cursive;
	font-size: 19px;
	line-height: 1.3;
	color: #1E3557;
	text-align: center;
	max-width: 230px;
}
.mg-bubble-dots { display: flex; gap: 6px; align-items: flex-end; height: 24px; padding-left: 50px; }
.mg-bubble-dots span { display: block; border-radius: 50%; background: #fff; border: 2px solid #B9D4EE; }
.mg-bubble-dots span:first-child { width: 14px; height: 14px; }
.mg-bubble-dots span:last-child { width: 8px; height: 8px; }

/* Buttons and chips */
.mg-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.mg a.mg-btn {
	display: inline-block;
	box-sizing: border-box;
	min-height: 46px;
	padding: 13px 22px;
	border-radius: 10px;
	background: #1E3557;
	color: #fff;
	font-family: 'ExpletusSans', Arial, sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	text-decoration: none;
	text-align: center;
}
.mg a.mg-btn:hover { background: #2B4A75; color: #fff; }
.mg a.mg-btn-red { background: #C63D25; }
.mg a.mg-btn-red:hover { background: #A83321; }
.mg a.mg-btn-block { display: block; }
.mg-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mg-chips span { font-size: 13px; padding: 3px 11px; background: #fff; border: 1px solid #B9D4EE; border-radius: 999px; color: #1E3557; }
.mg-chips span.mg-chips-label { background: none; border: 0; padding-left: 0; color: #4F5A68; }

/* Sections */
.mg-section { padding: 36px 4px 8px; }
.mg-section > h2 { margin-bottom: 18px; }
.mg-section > p.mg-intro { margin: -8px 0 18px; }
.mg-tint {
	margin-top: 36px;
	padding: 36px 28px;
	background: #F2F5F9;
	border: 1px solid #DDE3EA;
	border-radius: 14px;
}
.mg-center { text-align: center; }

/* Cards */
.mg-card {
	box-sizing: border-box;
	background: #F4F8FD;
	border: 1px solid #D3E3F3;
	border-radius: 12px;
	padding: 20px;
}
.mg-card h3 { margin-bottom: 6px; }
.mg-card-white { background: #fff; border-color: #D6DCE4; }
.mg-card-accent { border: 2px solid #C63D25; padding: 19px; }
.mg-card .mg-big { font-family: 'ExpletusSans', Arial, sans-serif; font-size: 24px; font-weight: 900; color: #1E3557; display: block; margin-bottom: 4px; }
.mg-card-accent .mg-big { color: #C63D25; }

/* Numbered questions and steps */
.mg ol.mg-questions { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.mg ol.mg-questions li {
	display: flex;
	gap: 14px;
	align-items: center;
	background: #F4F8FD;
	border: 1px solid #D3E3F3;
	border-radius: 12px;
	padding: 13px 18px;
	font-weight: bold;
	color: #1E3557;
}
.mg-num {
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #1E3557;
	color: #fff;
	font-family: 'ExpletusSans', Arial, sans-serif;
	font-weight: 900;
	text-align: center;
	line-height: 34px;
}
.mg-num-red { background: #C63D25; }
.mg ol.mg-steps { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 20px; }
.mg ol.mg-steps li { flex: 1 1 190px; display: flex; flex-direction: column; gap: 6px; }
.mg ol.mg-steps strong { font-family: 'ExpletusSans', Arial, sans-serif; font-size: 17px; color: #1E3557; }
.mg ol.mg-steps .mg-num { width: 44px; height: 44px; line-height: 44px; font-size: 20px; }

/* Offer cards */
.mg-offers { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; }
.mg-offer {
	flex: 1 1 260px;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #D6DCE4;
	border-radius: 14px;
	overflow: hidden;
}
.mg-offer-head { background: #1E3557; padding: 14px 20px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.mg .mg-offer-head h3 { color: #fff; font-size: 21px; }
.mg-offer-head .mg-hand { color: #fff !important; font-size: 16px; }
.mg-offer-body { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex-grow: 1; }
.mg-offer-body .mg-btn { margin-top: auto; }
.mg-offer-featured { border: 2px solid #C63D25; }
.mg-offer-featured .mg-offer-head { background: #C63D25; }
.mg-price { font-family: 'ExpletusSans', Arial, sans-serif; font-size: 36px; font-weight: 900; line-height: 1; color: #C63D25; }
.mg-price small { font-family: Arial, sans-serif; font-size: 14px; font-weight: normal; color: #4F5A68; }
.mg p.mg-meta { font-size: 13px; color: #4F5A68; }

/* Price box beside a product hero */
.mg-pricebox {
	flex: 1 1 250px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: #fff;
	border: 1px solid #B9D4EE;
	border-radius: 14px;
	padding: 24px;
}
.mg-pricebox .mg-price { font-size: 46px; }
.mg-pricebox-featured { border: 2px solid #C63D25; padding: 23px; }

/* Hosting band, plans */
.mg-band {
	margin-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	background: #EAF3FC;
	border: 1px solid #B9D4EE;
	border-radius: 14px;
	padding: 24px;
}
.mg-band > .mg-stack { flex: 1 1 400px; gap: 8px; }
.mg-tiers { display: flex; flex-wrap: wrap; gap: 10px; }
.mg-tier { background: #fff; border: 1px solid #B9D4EE; border-radius: 12px; padding: 10px 18px; text-align: center; }
.mg-tier span { display: block; font-size: 12px; color: #4F5A68; }
.mg-tier strong { font-family: 'ExpletusSans', Arial, sans-serif; font-size: 20px; color: #1E3557; }
.mg-navy {
	margin-top: 24px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	background: #1E3557;
	border-radius: 14px;
	padding: 28px;
}
.mg-navy > .mg-stack { flex: 1 1 420px; gap: 8px; }
.mg .mg-navy h2, .mg .mg-navy h3 { color: #fff; }
.mg .mg-navy p { color: #D3DDE8; }
.mg .mg-navy a.mg-phone { color: #fff; font-family: 'ExpletusSans', Arial, sans-serif; font-size: 26px; font-weight: 700; text-decoration: none; }

/* Pricing table */
.mg-table-wrap { overflow-x: auto; border: 1px solid #D6DCE4; border-radius: 14px; }
.mg table.mg-table { width: 100%; border-collapse: collapse; margin: 0; border: 0; }
.mg table.mg-table th, .mg table.mg-table td { padding: 13px 16px; text-align: left; font-size: 14px; line-height: 1.4; vertical-align: top; }
.mg table.mg-table thead th { background: #1E3557; color: #fff; font-family: 'ExpletusSans', Arial, sans-serif; }
.mg table.mg-table tbody tr { border-top: 1px solid #E3E8EE; background: #fff; }
.mg table.mg-table tbody tr:nth-child(even) { background: #F7F9FC; }
.mg table.mg-table tbody th { font-family: 'ExpletusSans', Arial, sans-serif; }
.mg table.mg-table td.mg-table-price { font-weight: bold; color: #C63D25; white-space: nowrap; }

/* About */
.mg-est {
	flex: 0 0 132px;
	width: 132px;
	height: 132px;
	border-radius: 50%;
	background: #1E3557;
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-family: 'ExpletusSans', Arial, sans-serif;
}
.mg-est strong { font-size: 34px; font-weight: 900; line-height: 1; }
.mg-placeholder { border: 1px dashed #9FB6CC; border-radius: 14px; padding: 22px; background: #fff; }

/* Closing call to action */
.mg-cta {
	margin-top: 36px;
	padding: 44px 24px;
	background: #1E3557;
	border-radius: 14px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}
.mg .mg-cta h2 { color: #fff; font-size: 34px; max-width: 640px; }
.mg .mg-cta p { color: #D3DDE8; font-size: 16px; max-width: 540px; }
.mg .mg-cta .mg-hand { color: #F3C9BF !important; }
.mg-row > .mg-navy { margin-top: 0; }
.mg .mg-offer-head h3 { white-space: nowrap; }
.mg-offer-head .mg-hand { font-size: 15px; white-space: nowrap; }