/* General content page. Loaded after ib-base.css, which carries the tokens,
   buttons, nav and footer this shares with the home and contact pages.

   The prose block styles whatever the CMS editor produced, so the rules below
   are element selectors inside .ib-prose rather than classes on the markup. */

.ib-site--doc .ib-navcap {
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.ib-site--doc a {
	color: #1C75BC;
}

.ib-site--doc a:hover,
.ib-site--doc a:focus {
	color: #f47b20;
}

.ib-site--doc a.ib-btn,
.ib-site--doc a.ib-chip-link,
.ib-site--doc a.ib-nav__cta,
.ib-site--doc .ib-crumbs a {
	color: var(--ib-ink);
}

.ib-site--doc a.ib-btn--primary,
.ib-site--doc a.ib-btn--primary:hover,
.ib-site--doc a.ib-nav__cta:not(.ib-nav__cta--outline) {
	color: #fff;
}

.ib-site--doc a.ib-btn:hover,
.ib-site--doc a.ib-chip-link:hover,
.ib-site--doc a.ib-nav__cta:hover {
	color: var(--ib-ink);
}

/* HEAD */
.ib-doc__head {
	padding-top: clamp(120px, 12vw, 170px);
	padding-bottom: clamp(34px, 4vw, 52px);
}

.ib-crumbs {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 12.5px;
	color: rgba(10, 10, 10, 0.45);
	margin-bottom: 22px;
}

.ib-site--doc .ib-crumbs a {
	color: rgba(10, 10, 10, 0.55);
}

.ib-site--doc .ib-crumbs a:hover {
	color: var(--ib-ink);
}

.ib-doc__title {
	font-weight: 300;
	font-size: clamp(2rem, 5.4vw, 4rem);
	letter-spacing: -0.03em;
	line-height: 1;
	margin: 0 0 22px;
	max-width: 940px;
	text-wrap: balance;
}

.ib-doc__lead {
	font-size: 17px;
	line-height: 1.6;
	color: var(--ib-muted);
	margin: 0;
	max-width: 680px;
	text-wrap: pretty;
}

/* BANNER */
.ib-doc__banner {
	padding-bottom: clamp(30px, 4vw, 48px);
}

.ib-doc__banner-frame {
	border-radius: var(--ib-radius-lg);
	overflow: hidden;
	background: #eaf2f6;
}

.ib-doc__banner-frame img {
	width: 100%;
	height: clamp(220px, 32vw, 420px);
	object-fit: cover;
	object-position: center 62%;
	display: block;
}

/* BODY */
.ib-doc__body {
	padding-bottom: clamp(64px, 8vw, 110px);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 46px;
	align-items: start;
}

.ib-prose {
	max-width: 720px;
	min-width: 0;
	font-size: 15.5px;
	line-height: 1.75;
	color: rgba(10, 10, 10, 0.62);
}

.ib-doc__aside {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 420px;
	min-width: 0;
}

/* PROSE
   Everything below targets editor output. Headings carry scroll-margin so the
   fixed nav does not cover them when an anchor link lands. */
.ib-prose h2,
.ib-prose h3,
.ib-prose h4 {
	color: var(--ib-ink);
	scroll-margin-top: 110px;
}

.ib-prose h2 {
	font-weight: 300;
	font-size: clamp(1.5rem, 2.6vw, 2.1rem);
	letter-spacing: -0.02em;
	line-height: 1.1;
	margin: 34px 0 14px;
}

.ib-prose h3 {
	font-weight: 400;
	font-size: 1.25rem;
	letter-spacing: -0.01em;
	line-height: 1.25;
	margin: 30px 0 12px;
}

.ib-prose h4 {
	font-weight: 500;
	font-size: 1rem;
	margin: 24px 0 10px;
}

.ib-prose > *:first-child {
	margin-top: 0;
}

.ib-prose p {
	margin: 0 0 16px;
	text-wrap: pretty;
}

.ib-prose ul,
.ib-prose ol {
	margin: 0 0 20px;
	padding-left: 0;
	display: grid;
	gap: 10px;
	list-style: none;
}

.ib-prose ol {
	counter-reset: ib-prose-item;
}

.ib-prose li {
	position: relative;
	padding-left: 22px;
	line-height: 1.6;
}

/* Blue dot for bullets, blue numeral for ordered lists -- the design's marker
   rather than the browser's. */
.ib-prose ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 6px;
	height: 6px;
	border-radius: 999px;
	background: #29ABE2;
}

.ib-prose ol > li::before {
	counter-increment: ib-prose-item;
	content: counter(ib-prose-item) ".";
	position: absolute;
	left: 0;
	top: 0;
	color: #29ABE2;
	font-weight: 500;
}

.ib-prose li > ul,
.ib-prose li > ol {
	margin: 10px 0 0;
}

.ib-prose blockquote {
	margin: 0 0 34px;
	padding: 24px 26px;
	background: #eaf6fc;
	border-radius: var(--ib-radius-lg);
	color: #333;
	font-size: 17px;
	line-height: 1.55;
	font-weight: 300;
	letter-spacing: -0.01em;
}

.ib-prose blockquote p {
	margin: 0;
}

.ib-prose blockquote p + p {
	margin-top: 12px;
}

.ib-prose img {
	max-width: 100%;
	height: auto;
	border-radius: var(--ib-radius-lg);
	display: block;
	margin: 0 0 20px;
}

/* Editor float classes from the old theme, kept so existing pages keep their
   intended layout. */
.ib-prose img.left,
.ib-prose .captionImage.left {
	float: left;
	margin: 0 20px 16px 0;
	max-width: 50%;
}

.ib-prose img.right,
.ib-prose .captionImage.right {
	float: right;
	margin: 0 0 16px 20px;
	max-width: 50%;
}

.ib-prose img.center,
.ib-prose .captionImage.center {
	margin-left: auto;
	margin-right: auto;
}

.ib-prose .captionImage .caption {
	font-size: 13px;
	color: var(--ib-muted);
	font-style: italic;
}

.ib-prose table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 20px;
	font-size: 14.5px;
}

.ib-prose th,
.ib-prose td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--ib-line);
	vertical-align: top;
}

.ib-prose th {
	font-weight: 500;
	color: var(--ib-ink);
}

.ib-prose hr {
	border: 0;
	border-top: 1px solid var(--ib-line);
	margin: 30px 0;
}

/* Wide editor content -- long tables, pasted embeds -- scrolls inside the
   column instead of pushing the page sideways. */
.ib-prose .table-wrap {
	overflow-x: auto;
}

.ib-prose iframe {
	max-width: 100%;
	border-radius: var(--ib-radius-lg);
}

/* ASIDE PANELS */
.ib-side {
	border: 1px solid var(--ib-line);
	border-radius: var(--ib-radius-lg);
	padding: 26px;
}

.ib-side--grey {
	background: var(--ib-surface);
	border-color: transparent;
}

.ib-side--tint {
	background: #eaf6fc;
	color: #333;
	border-color: transparent;
}

.ib-side h3 {
	font-size: 16px;
	font-weight: 500;
	margin: 0 0 14px;
}

.ib-side--tint h3 {
	margin-bottom: 8px;
	color: #333;
}

.ib-side__text {
	font-size: 14px;
	line-height: 1.6;
	color: rgba(51, 51, 51, 0.7);
	margin: 0 0 18px;
}

.ib-toc {
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 14px;
}

.ib-stats {
	display: grid;
	gap: 14px;
	margin-top: 16px;
}

.ib-stats__value {
	font-weight: 300;
	font-size: 26px;
	letter-spacing: -0.02em;
	line-height: 1.1;
}

.ib-stats__label {
	font-size: 13px;
	color: var(--ib-muted);
}

/* PDF DOWNLOAD */
.ib-pdf {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	flex-wrap: wrap;
	border: 1px solid var(--ib-line);
	border-radius: var(--ib-radius-lg);
	padding: 22px;
	margin: 0 0 30px;
}

.ib-pdf__thumb {
	flex: none;
	border-radius: var(--ib-radius);
	overflow: hidden;
	background: #eaf2f6;
}

.ib-pdf__thumb img {
	display: block;
	width: 150px;
	height: auto;
	margin: 0;
	border-radius: 0;
}

.ib-pdf__body {
	flex: 1 1 240px;
	min-width: 0;
}

.ib-pdf__body h2 {
	margin-top: 0;
	font-size: 1.35rem;
}

.ib-pdf__body > *:last-child {
	margin-bottom: 0;
}

.ib-pdf__actions {
	margin-top: 16px;
}

@media (max-width: 640px) {
	.ib-prose img.left,
	.ib-prose img.right,
	.ib-prose .captionImage.left,
	.ib-prose .captionImage.right {
		float: none;
		max-width: 100%;
		margin: 0 0 16px;
	}
}

.ib-doc__blocks {
	padding-bottom: clamp(64px, 8vw, 110px);
}