/*---Marijan styles----*/
:root {
	--cream: #fbf5ec;
	--navy: #16206b;
	--navy-deep: #0f1546;
	--orange: #ff7a00;
	--orange-deep: #e86f00;
	--eyebrow: #c25f00;
	--ink: #141a3a;
	--muted: #4a4f66;
	--line: #e3d6c3
}

/* gradient */
.m-background {
	background: var(--cream) linear-gradient(120deg, #fdf9f3 0%, #fbf3e8 45%, #fae9d6 100%);
}

.w {
	max-width: 1200px;
	margin: auto;
	padding: 0 48px
}

/* buttons: primary orange, .navy secondary, .ghost on cream, .mbtn.ghost on navy */
.mbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 52px;
	padding: 0 30px;
	border-radius: 7px;
	font-weight: 600;
	font-size: 17px;
	background: var(--orange);
	color: #fff;
	box-shadow: 0 8px 20px #ff7a0033;
	transition: background .15s,box-shadow .15s;
}

	.mbtn:hover {
		background: #ec6f00;
		box-shadow: 0 10px 24px #ff7a0044
	}

	.mbtn.navy {
		background: var(--navy);
		box-shadow: none
	}

		.mbtn.navy:hover {
			background: #101860
		}

	.mbtn.ghost {
		background: none;
		border: 1.5px solid #fff;
		box-shadow: none;
		color: #fff
	}

		.mbtn.ghost:hover {
			background: #ffffff14
		}

.ghost:not(.mbtn) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	padding: 0 28px;
	border: 1.5px solid var(--line);
	border-radius: 7px;
	font-weight: 600;
	font-size: 17px;
	color: var(--ink);
	background: none;
	transition: background .15s
}

	.ghost:not(.mbtn):hover {
		background: #fff
	}

.mbtn:focus-visible, .ghost:focus-visible, header nav a:focus-visible, footer nav a:focus-visible, .si:focus-visible {
	outline: 2px solid var(--navy);
	outline-offset: 3px
}

.brand {
	display: flex;
	align-items: center;
	gap: 9px;
	font-weight: 700;
	font-size: 22px;
	letter-spacing: -.6px;
	color: var(--ink)
}

	.brand img {
		width: 34px
	}

	.brand b {
		color: var(--orange-deep);
		font-weight: 700
	}

.right {
	display: flex;
	gap: 26px;
	align-items: center
}

.si {
	font-size: 17px;
	font-weight: 600
}

/* eyebrow */
.ey {
	margin: 0 0 10px;
	font-size: 12px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--eyebrow)
}

/* closing band */
.cta {
	margin-top: 28px;
	background: var(--navy-deep);
	color: #fff;
	text-align: center;
	padding: 42px 20px 36px
}

	.cta h2 {
		margin: 0 0 28px;
		font-size: 46px;
		letter-spacing: -1.6px;
		font-weight: 650
	}

	.cta p {
		margin: -14px 0 28px;
		color: #b9bfe8;
		font-size: 18px
	}

	.cta .bts {
		display: flex;
		gap: 40px;
		justify-content: center;
		flex-wrap: wrap
	}

	.cta .btn {
		height: 56px;
		padding: 0 36px;
		font-size: 19px
	}

/* footer */
footer .w {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	height: 110px
}

footer nav {
	display: flex;
	gap: 52px;
	font-size: 16px
}

footer small {
	font-size: 14px;
	color: #6b7184
}

@media(max-width: 760px) {
	.w {
		padding: 0 22px
	}

	.brand {
		font-size: 19px
	}

	.cta h2 {
		font-size: 32px
	}

	.cta .bts {
		gap: 14px
	}

	.cta .mbtn {
		flex: 1 1 100%
	}

	footer .w {
		display: block;
		height: auto;
		padding-top: 28px;
		padding-bottom: 28px
	}

	footer nav {
		gap: 22px;
		margin: 18px 0;
		flex-wrap: wrap
	}
}