/**
 * IMABI base styles (typography and post body)
 * @see blogs/ima-bi/design/imabi_design_spec.md §4
 */

/* IMABI scope inside SWELL post content */
.imabi-scope,
.post_content .imabi-scope,
.l-mainContent__inner .imabi-scope {
	box-sizing: border-box;
	color: var(--imabi-text-primary);
	font-family: var(--imabi-font-sans);
	letter-spacing: 0.02em;
}

/* Post lead paragraph */
.imabi-lead,
.post_content > .imabi-lead:first-of-type,
.post_content .wp-block-paragraph.imabi-lead {
	margin: 0 0 1.25em;
	color: var(--imabi-text-secondary);
	font-size: var(--imabi-fs-lead);
	font-weight: 400;
	line-height: var(--imabi-lh-body);
}

/* Post H2 inside SWELL .post_content */
.post_content .imabi-h2,
.post_content h2.imabi-h2,
.post_content .wp-block-heading.imabi-h2 {
	position: relative;
	margin: 40px 0 16px;
	padding-left: 12px;
	border: none;
	color: var(--imabi-text-primary);
	font-size: var(--imabi-fs-h2);
	font-weight: 700;
	line-height: var(--imabi-lh-heading);
}

.post_content .imabi-h2::before,
.post_content h2.imabi-h2::before {
	content: "";
	position: absolute;
	top: 0.15em;
	left: 0;
	width: 4px;
	height: calc(100% - 0.3em);
	border-radius: 2px;
	background: var(--imabi-accent);
}

/* SWELL default H2 accent line fallback */
.post_content .entry-content > h2:not(.imabi-h2),
.post_content > h2:not(.imabi-h2) {
	position: relative;
	margin-top: 40px;
	margin-bottom: 16px;
	padding-left: 12px;
	font-size: var(--imabi-fs-h2);
	line-height: var(--imabi-lh-heading);
}

.post_content .entry-content > h2:not(.imabi-h2)::before,
.post_content > h2:not(.imabi-h2)::before {
	content: "";
	position: absolute;
	top: 0.15em;
	left: 0;
	width: 4px;
	height: calc(100% - 0.3em);
	border-radius: 2px;
	background: var(--imabi-accent);
}

/* H3 */
.post_content .imabi-h3,
.post_content h3.imabi-h3,
.post_content .wp-block-heading.imabi-h3 {
	margin: 32px 0 12px;
	color: var(--imabi-text-primary);
	font-size: var(--imabi-fs-h3);
	font-weight: 600;
	line-height: var(--imabi-lh-heading);
}

.post_content .entry-content > h3:not(.imabi-h3),
.post_content > h3:not(.imabi-h3) {
	margin-top: 32px;
	margin-bottom: 12px;
	font-size: var(--imabi-fs-h3);
	font-weight: 600;
	line-height: var(--imabi-lh-heading);
}

/* H4 */
.post_content .imabi-h4,
.post_content h4.imabi-h4 {
	margin: 24px 0 8px;
	font-size: var(--imabi-fs-h4);
	font-weight: 600;
	line-height: var(--imabi-lh-heading);
}

/* Body paragraph with imabi markup */
.imabi-body,
.post_content .imabi-body {
	margin: 0 0 1.25em;
	font-size: var(--imabi-fs-body);
	font-weight: 400;
	line-height: var(--imabi-lh-body);
}

/* Caption and muted text */
.imabi-caption,
.imabi-text-muted {
	color: var(--imabi-text-muted);
	font-size: var(--imabi-fs-caption);
	font-weight: 400;
	line-height: 1.7;
}

.imabi-text-secondary {
	color: var(--imabi-text-secondary);
}

/* Single post title (H1) sizing */
.single .c-postTitle__ttl,
.single .entry-title {
	font-size: var(--imabi-fs-h1);
	font-weight: 700;
	line-height: 1.5;
}

/* In-body links (excluding CTA buttons) */
.post_content a:not([class*="imabi-cta"]):not(.imabi-btn):not(.imabi-product-card__link) {
	color: var(--imabi-text-primary);
	text-decoration: underline;
	text-decoration-color: var(--imabi-border);
	text-underline-offset: 0.15em;
}

.post_content a:not([class*="imabi-cta"]):not(.imabi-btn):not(.imabi-product-card__link):hover {
	color: var(--imabi-cta-secondary-text);
	text-decoration-color: var(--imabi-accent);
}

/* Lists */
.post_content .imabi-list,
.post_content ul.imabi-list {
	margin: 0 0 1.25em;
	padding-left: 1.25em;
	font-size: var(--imabi-fs-body);
	line-height: var(--imabi-lh-body);
}

.post_content .imabi-list li + li {
	margin-top: 0.35em;
}

@media (min-width: 768px) {
	.single .c-postTitle__ttl,
	.single .entry-title {
		font-size: var(--imabi-fs-h1);
	}
}
