@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;700&family=Inter:wght@400;500;700&display=swap");

:root {
	--font-base: "Cairo", sans-serif;
	--font-secondary: "Inter", sans-serif;
	--Text-Color: #1b1a19;
	--Text-Grey: #384d60;
	--White: #fff;
	--Color: #e6ecf4;
	--Border: #d4dbe4;
	--Link: #116ccb;
	/* Lightrun Colors */
	--Primary-20: #E7EDF8;
	--Primary-30: #CFDBF6;
	--Primary-60: #3468D8;
	--Primary-80: #324F90;

	--Grey-40: #D2D4D6;
	--Grey-60: #989C9E;
	--Grey-70: #797A7B;
	--Grey-80: #565758;
	--Grey-90: #353535;

	--Stroke-hover: #D4DBE4;
}

body {
	font-family: var(--font-secondary);
}

.flex {
	display: flex;
}

a.md-header__button.md-logo {
	padding: 0;
	margin: 0;
}

.md-header__inner {
	flex-wrap: wrap;
	padding: 40px 100px 8px 36px;
	max-width: 100%;
	justify-content: space-between;
}

.md-header {
	background: #f3f6fd;
}

.md-tabs {
	background: #f3f6fd;
	border-bottom: 1px solid var(--Border);
	box-shadow: none;
	/* position: sticky;
	top: 75px; */
	font-family: Inter;
}

.md-tabs__list {
	margin: 10px 0 0;
	padding: 0;
	gap: 34px;
	list-style: none;
	display: flex;
}

.md-tabs__list .md-tabs__item a {
	color: var(--Grey-80);
	font-size: 15px;
	font-weight: 500;
	line-height: normal;
	padding: 0 0 10px;
	display: block;
	position: relative;
	margin: 0;
	transition: all 0.5s;
}

.md-tabs__list .md-tabs__item a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	border-bottom: 3px solid var(--Primary-60);
	width: 0;
	transition: all 0.5s;
}

.md-tabs__list .md-tabs__item a:hover {
	color: var(--Primary-60);
}

.md-tabs__list .md-tabs__item a:hover::after {
	width: 100%;
}

.md-tabs__list .md-tabs__item a.md-tabs__link--active {
	color: #116ccb;
	font-weight: 700;
}

.md-tabs__list .md-tabs__item a.md-tabs__link--active::after {
	width: 100%;
	border-bottom-color: #116ccb;
}

.md-search {
	position: absolute;
	top: 50px;
	padding: 0;
	right: 82px;
	transition: all 0.5s;
}

.md-header--shadow .md-search {
	top: 13px;
}

.md-search__form {
	border-radius: 4px;
	border: 1px solid #d9d9d9;
	background: var(--White);
	height: 44px;
	min-width: 321px;
	display: flex;
	align-items: center;
	margin: 0;
}

.md-search__input::placeholder {
	color: var(--Grey-70);
	font-family: var(--font-secondary);
	font-size: 16px;
}

.md-search__input {
	font-size: 16px;
	height: 44px;
	color: var(--Text-Color);
}

.md-search__form .md-search__suggest {
	padding-left: 37px;
}

.md-social__link {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--Primary-80);
	border: 1px solid var(--Primary-80);
	border-radius: 50%;
}

.md-social {
	padding: 0;
	margin: 0;
	display: flex;
	gap: 18px;
}

.md-social__link svg {
	max-height: 1rem;
	height: 1rem;
}

/*Homepage*/
.wrap {
	max-width: 1320px;
	margin: 0 auto;
}

.hero {
	background-image: url(/assets/images/hero-bg.jpg);
	background-repeat: no-repeat;
	background-size: 100%;
	padding: 95px 0 59px;
	color: var(--Text-Grey);
	position: relative;
	background-position: center;
	background-size: cover;
}

.hero h1 {
	color: var(--Text-Grey);
	font-family: var(--font-base);
	font-size: 44px;
	font-weight: 700;
	line-height: 60px;
	margin: 0 0 0px;
	letter-spacing: normal;
}

.hero p {
	font-family: var(--font-secondary);
	font-size: 18px;
	line-height: 26px;
	margin: 0;
}

.hero__txt {
	max-width: 706px;
}

.section-title {
	display: flex;
	align-items: baseline;
	gap: 15px;
	margin-bottom: 24px;
}

.md-typeset .section-title h2 {
	color: var(--Grey-90);
	font-family: var(--font-base);
	font-size: 24px;
	font-weight: 700;
	flex: 0 0 auto;
	margin: 0;
	line-height: 45px;
	letter-spacing: normal;
}

.section-title::after {
	content: "";
	border-bottom: 1px solid var(--Border);
	width: 100%;
}

.links {
	margin-bottom: 43px;
}

.links ul.links-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
}

.links-list {
	display: flex;
	gap: 20px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.links ul.links-list>li {
	width: calc(100% / 4);
	margin: 0;
}

.md-typeset .links-list h3 {
	color: var(--Grey-90);
	font-family: var(--font-secondary);
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: normal;
	margin-top: 0;
}

.links-list a {
	display: block;
	color: var(--Link);
	font-family: Inter;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
}

/*new vers*/
.md-header__title {
	display: none;
}

.md-tabs__list {
	margin: 0;
}

.md-tabs__item {
	padding: 0;
	height: auto;
}

[dir="ltr"] .md-tabs__list {
	margin: 0;
}

.md-tabs .md-grid {
	max-width: 100%;
	padding: 0 99px;
}

.md-main__inner.md-grid {
	max-width: 100%;
	margin: 0;
	padding-left: 32px;
	padding-right: 32px;
}

.md-content__inner::before {
	display: none;
}

.links+hr {
	display: none;
}

.md-header__button.md-logo img {
	height: 28px;
}

.md-search__inner {
	width: 321px;
}

[dir="ltr"] .md-search__icon[for="__search"] svg {
	width: 25px;
	height: 27px;
}

[dir="ltr"] .md-search__icon[for="__search"] {
	left: 7px;
}

[dir="ltr"] .md-search__input {
	padding-left: 37px;
}

.hero__txt .btn-wrap {
	margin-top: 23px;
}

.btn-wrap {
	gap: 20px;
	align-items: center;
}

.btn.btn--blue.btn--rocket {
	display: flex;
	background: #3468d8;
	height: 40px;
	line-height: 40px;
	border-radius: 2px;
	padding: 0 25px;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	gap: 10px;
}

.btn.btn--blue.btn--rocket .icon {
	background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.17567 4.46617C6.07878 6.82003 4.63973 10.2018 4.50611 10.5204L0.785156 8.9272L4.9481 4.76426C5.43121 4.28115 6.13017 4.06529 6.80858 4.19892L8.17567 4.46617ZM10.2109 15.4132C10.2109 15.4132 14.0552 13.8199 16.2651 11.61C21.8157 6.0594 20.8906 1.72171 20.5926 0.745217C19.6161 0.43685 15.2784 -0.47797 9.72778 5.07262C7.51782 7.28258 5.92459 11.1269 5.92459 11.1269L10.2109 15.4132ZM16.8716 13.1621C14.5177 15.259 11.136 16.698 10.8173 16.8317L12.4106 20.5526L16.5735 16.3897C17.0566 15.9066 17.2725 15.2076 17.1388 14.5292L16.8716 13.1621ZM7.98037 16.4411C7.98037 17.2942 7.63089 18.0651 7.07583 18.6202C5.86292 19.8331 0.785156 20.5526 0.785156 20.5526C0.785156 20.5526 1.50468 15.4748 2.71759 14.2619C3.27264 13.7069 4.04356 13.3574 4.89671 13.3574C6.603 13.3574 7.98037 14.7348 7.98037 16.4411ZM12.0919 7.19007C12.0919 6.0594 13.017 5.1343 14.1477 5.1343C15.2784 5.1343 16.2035 6.0594 16.2035 7.19007C16.2035 8.32075 15.2784 9.24585 14.1477 9.24585C13.017 9.24585 12.0919 8.32075 12.0919 7.19007Z' fill='white'/%3E%3C/svg%3E");
	width: 21px;
	height: 21px;
	background-repeat: no-repeat;
}

.btn.btn--blue.btn--rocket:hover {
	text-decoration: none;
}

a,
.md-typeset a {
	color: var(--Primary-60);
}

.btn-wrap a {
	font-size: 16px;
}

.md-source-file {
	display: none;
}

.md-feedback {
	display: none;
}

.resources .wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 43px;
}

.resources-block {
	width: calc(50% - 22px);
}

.resources-list {
	border: 1px solid #d4dbe4;
}

.resources-block h2 {
	text-align: center;
	font-family: var(--font-base);
	font-size: 24px;
	font-weight: 700;
	line-height: 26px;
	margin: 0 0 17px;
	color: #1a3c5a;
}

.resources-block ul.resources-list {
	border: 1px solid #d4dbe4;
	margin: 0;
	justify-content: space-between;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	padding: 19px 6px 12px;
	border-radius: 4px;
}

.resources-block ul.resources-list li.title {
	width: 100%;
	text-align: center;
	color: #757780;
	font-size: 16px;
	line-height: 26px;
	margin-bottom: 11px;
}

.resources-block ul.resources-list li {
	margin: 0;
}

.resources-block ul.resources-list li:not(.title) {
	width: calc(100% / 4);
}

.resources-block ul.resources-list li:not(.title) a {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 5px 5px 20px;
	transition: all 0.5s;
	border-radius: 4px;
	text-align: center;
	font-size: 16px;
	height: 100px;
}

.resources-icon {
	height: 48px;
	width: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.resources-block ul.resources-list li+li.title {
	margin-top: 15px;
}

.new {
	position: relative;
}

.new::before {
	content: "New";
	position: absolute;
	background: linear-gradient(71.93deg, #1c4366 2.37%, #0670bd 99.09%);
	box-shadow: 0px 2px 2px 0px #00000040;
	width: 48px;
	height: 22px;
	text-align: center;
	border-radius: 4px;
	line-height: 22px;
	color: #f3f6fd;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.resources-icon.new::before {
	right: -45px;
	top: 0;
}

.resources-block ul.resources-list li:not(.title) a:hover {
	background: #f9fafc;
	text-decoration: none;
}

.popular h2 {
	text-align: center;
	margin: 0 0 20px;
	font-family: var(--font-base);
	font-size: 24px;
	font-weight: 700;
	line-height: 26px;
	color: #1a3c5a;
	width: 100%;
}

.popular {
	margin-top: 4px;
	margin-bottom: 80px;
}

.popular .wrap {
	display: flex;
	flex-wrap: wrap;
}

.popular-links {
	width: calc(100% / 3);
	border: 1px solid #d4dbe4;
	padding: 27px;
	border-left: none;
}

.popular-links a {
	display: block;
	font-size: 16px;
	line-height: 30px;
}

h2+.popular-links {
	border-left: 1px solid #d4dbe4;
	border-radius: 4px 0 0 4px;
}

.popular-links .new::before {
	position: inherit;
	order: 100;
}

.popular-links .new {
	display: flex;
	align-items: center;
	gap: 15px;
}

.popular-links:last-child {
	border-radius: 0 4px 4px 0;
}

.md-footer {
	background: #fff;
	color: #1a3c5a;
	font-size: 16px;
}

.md-footer-meta {
	background: no-repeat;
}

.md-footer-meta__inner {
	padding: 0;
}

.md-footer__links {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: auto auto;
	flex: 1;
}

.md-footer-meta .md-footer-meta__inner.md-grid {
	padding-top: 52px;
}

.md-footer__links li {
	display: flex;
	gap: 17px;
	margin-bottom: 15px;
}

.subscribe-form h3 {
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	letter-spacing: 0.01em;
	margin: 0 0 4px;
}

.subscribe-form p {
	margin: 0 0 17px;
}

.subscribe-form__form {
	border: 1px solid #d4dbe4;
	border-radius: 4px;
	width: 509px;
	display: flex;
	justify-content: space-between;
	padding: 0px 18px;
	margin-bottom: 12px;
}

.subscribe-form__form input {
	height: 38px;
}

.subscribe-form__form button {
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	letter-spacing: 0.01em;
	color: #aeb0bc;
	cursor: pointer;
}

.md-footer__links li p {
	margin: 0;
}

.md-footer-bottom p {
	margin: 0;
	font-size: 14px;
}

.md-footer-bottom {
	padding: 42px 0;
}

.md-typeset a:focus,
.md-typeset a:hover {
	color: #116ccb;
	text-decoration: underline;
}

.md-footer a:hover {
	text-decoration: underline;
}

@media (max-width: 1460px) {

	.wrap,
	.md-footer-meta__inner {
		padding-left: 16px;
		padding-right: 16px;
	}
}

@media screen and (max-width: 1200px) {
	a.md-header__button.md-logo {
		display: block;
		order: 1;
	}

	.md-header__button {
		order: -1;
	}

	.md-search {
		position: relative;
		top: 0;
		right: 0;
		order: 2;
	}

	.md-header__inner {
		padding: 15px 10px;
	}

	.md-icon svg,
	.md-icon svg path {
		fill: #384d60;
	}

	.hero {
		background: rgb(243, 246, 253);
		background: linear-gradient(180deg,
				rgba(243, 246, 253, 1) 77%,
				rgba(255, 255, 255, 0) 100%);
	}

	.hero {
		padding: 21px 0 53px;
	}

	.hero__txt {
		max-width: 100%;
	}

	.md-header__title+.md-header__button.md-icon {
		order: 2;
	}
}

@media screen and (max-width: 991px) {
	.hero h1 {
		font-size: 32px;
		line-height: 37px;
		color: #1a3c5a;
		margin-bottom: 14px;
		max-width: 90%;
	}

	.hero p {
		font-size: 16px;
		line-height: 24px;
	}

	.hero__txt .btn-wrap {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.resources-block {
		width: 100%;
	}

	.resources-block ul.resources-list li:not(.title) {
		width: calc(100% / 2);
	}

	.popular-links {
		width: 100%;
		border-bottom: none;
		border-top: none;
		border-radius: 0;
		border-left: 1px solid #d4dbe4;
		padding: 0 15px;
	}

	h2+.popular-links {
		border-top: 1px solid #d4dbe4;
		padding-top: 10px;
	}

	.popular-links:last-child {
		border-bottom: 1px solid #d4dbe4;
		padding-bottom: 10px;
	}

	.popular {
		margin-bottom: 39px;
	}

	.links ul.links-list>li {
		width: 100%;
	}

	.links ul.links-list {
		flex-direction: column;
		gap: 32px;
	}

	.md-footer {
		margin: 0 16px;
	}

	.md-footer-meta .md-footer-meta__inner.md-grid {
		padding: 20px 0 0;
	}

	.subscribe-form {
		width: 100%;
		top: 0;
		margin-top: 36px;
	}

	.subscribe-form__form {
		width: 100%;
	}

	.md-footer-meta__inner {
		padding-left: 0;
		padding-right: 0;
	}

	.md-footer-bottom p {
		margin-bottom: 16px;
	}

	.md-sidebar.md-sidebar--primary {
		display: block;
	}

	.md-sidebar__inner .md-header__logo img {
		filter: brightness(0) invert(1);
	}

	.md-header--shadow {
		box-shadow: none;
	}

	.md-footer__links {
		grid-template-columns: auto;
	}
}

/* Toc styles */

.md-nav--secondary[data-md-component="toc"] {
	padding: 1px;

}

.md-nav--secondary[data-md-component="toc"]>.md-nav__list::before {
	content: "On this page";
	font-weight: 600;
	font-weight: 400;
	font-size: 12px;
	font-family: var(--font-secondary);
	padding-left: 0.6rem;
	color: var(--Grey-60);
	text-transform: uppercase;
}

.md-nav--secondary[data-md-component="toc"] .md-nav__list {
	border-left: 1px solid var(--Stroke-hover);
	padding-bottom: 0.6rem;
}

.md-nav--secondary[data-md-component="toc"] .md-nav__item:has(.md-nav__link--active) {
	border-left: 3px solid var(--Link);
	margin-left: -2px;
	padding-left: calc(0.6rem - 1px);
}

/* End Toc styles */

/* Typography styles */

.md-typeset h1 {
	color: var(--Grey-90);
	font-family: var(--font-base);
	font-size: 32px;
	font-weight: 700;
	line-height: 30px;
	margin: 32px 0 8px;
}

.md-typeset h2 {
	color: var(--Grey-90);
	font-family: var(--font-base);
	font-size: 24px;
	font-weight: 700;
	line-height: 23px;
	margin: 32px 0 8px;
}

.md-typeset h3 {
	color: var(--Grey-80);
	font-family: var(--font-secondary);
	font-size: 18px;
	font-weight: 600;
	line-height: 23px;
	margin: 32px 0 8px;
}

.md-typeset {
	color: var(--Grey-80);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
}

/* End Typography styles */

/* Nav Styles */

.md-sidebar__scrollwrap {
	scrollbar-color: var(--Primary-30) #0000;
}

.md-nav__link {
	color: var(--Grey-80) !important;
	font-family: var(--font-secondary);
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
}

.md-nav__link a {
	color: var(--Grey-80);
}

.md-nav__link:hover,
.md-nav__link:focus {
	color: var(--Grey-90);
}

.md-nav[data-md-level="1"]>.md-nav__list>.md-nav__item--active {
	border-left: 3px solid var(--Link);
}

.md-nav__item--section>.md-nav>.md-nav__list .md-nav__item {
	padding-left: 8px;
}

.md-nav__item .md-nav__link--active {
	color: var(--Primary-60);
	font-weight: 600;
	margin-left: -3px;
}

.md-nav__item .md-nav__link--active a {
	color: var(--Primary-60);
}

.md-nav--lifted>.md-nav__list>.md-nav__item--active>.md-nav__link {
	color: var(--Grey-90);
	font-family: var(--font-base);
	font-size: 18px;
	font-weight: 700;
	line-height: 23px;
}

.md-nav[data-md-level="1"] {
	margin-top: 12px;
}

/* End Nav Styles */

/* Footer Styles */

.md-footer .md-grid {
	max-width: unset;
}

.md-footer {
	padding-bottom: 32px;
	border-top: 1px solid var(--Grey-40);
	margin: 50px 0 0 0;
}

.md-footer-nav {
	padding-left: 24px;
	padding-right: 24px;
}

.md-footer-meta {
	padding-left: 24px;
	padding-right: 24px;
}

.md-footer__title {
	color: var(--Grey-80);
	font-size: 14px;
	line-height: 21px;
}

.md-footer__direction {
	text-transform: uppercase;
	color: var(--Grey-60);
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 0.12px;
	opacity: 1;
	padding: 0;
	position: inherit;
	margin-top: 0;
}

.md-footer__title .md-ellipsis {
	display: flex;
	flex-direction: column;
}

.md-footer__button.md-icon {
	color: var(--Grey-40);
	border: 2px solid var(--Grey-40);
	border-radius: 50%;
}

.md-footer-nav .md-footer__link:hover {
	text-decoration: none;
}

.md-footer-nav .md-footer__link {
	align-items: center;
}

.md-footer__links img {
	width: 24px;
	height: 24px;
}

.md-copyright {
	font-size: 12px;
	color: var(--Grey-90);
}

/* End Footer Styles */

.md-content__inner {
	padding-left: 24px;
	padding-right: 24px;
}

.md-content__inner:has(.hero) {
	padding: 0;
	margin: 0;
}

.md-main__inner.md-grid:has(.hero) {
	padding: 0;
}

.md-main .md-content {
	border-left: 1px solid var(--Grey-40);
}

@media screen and (max-width: 76.1875em) {
	.md-main .md-content {
		border-left: none;
	}

	.md-nav--primary .md-nav__item {
		border: none;
	}

	.md-nav--primary .md-nav__link {
		padding: 0;
	}

	.md-nav--primary {
		background-color: #F3F6FD;
	}

	.md-nav--primary .md-nav__title[for="__drawer"] {
		display: none;
	}

	.md-sidebar--primary .md-sidebar__scrollwrap {
		background-color: #F3F6FD;
		scrollbar-color: var(--Primary-30) #0000;
	}

	.md-nav--primary.md-nav::before {
		content: '';
		background: url('/assets/images/logo-color.svg');
		width: 43px;
		height: 21px;
		display: block;
		margin: 26px 16px 16px auto;
		position: absolute;
		right: 0;
		z-index: 999;
	}

	.md-nav.md-nav--primary>ul.md-nav__list {
		padding-top: 3rem;
	}

	.md-nav--primary .md-nav__title~.md-nav__list {
		background-color: #F3F6FD;
		padding: 0 16px;
		box-shadow: none;
	}

	.md-nav--primary .md-nav__title {
		background-color: #F3F6FD;
		color: var(--Grey-90);
		font-family: var(--font-base);
		font-size: 18px;
		font-weight: 700;
		line-height: 23px;
		padding-top: 3rem;
		height: auto;
	}

	.md-nav--primary .md-nav__link[for="__toc"] .md-nav__icon {
		display: none;
	}
}

.hero__txt h1 {
	font-size: 40px;
}