/*
 * Global type, links, focus, and page title styles.
 */

body.vt-theme,
body.vt-theme *,
body.vt-theme *::before,
body.vt-theme *::after,
.editor-styles-wrapper,
.editor-styles-wrapper *,
.editor-styles-wrapper *::before,
.editor-styles-wrapper *::after {
	box-sizing: border-box;
}

:is(body.vt-theme, .editor-styles-wrapper) {
	background-color: var(--vt-canvas);
	color: var(--vt-ink);
	font-family: var(--vt-font-body);
}

body.vt-theme #main-container,
body.vt-theme main {
	background-color: var(--vt-canvas);
}

:is(body.vt-theme, .editor-styles-wrapper) :is(h1, h2, h3, h4, h5, h6, .site-title, .entry-title, .page-title, .wp-block-heading) {
	font-family: var(--vt-font-display);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--vt-heading);
	text-wrap: balance;
}

:is(body.vt-theme, .editor-styles-wrapper) h1,
:is(body.vt-theme, .editor-styles-wrapper) .page-title {
	font-size: clamp(2.1rem, 1.2rem + 2.8vw, 3.75rem);
	line-height: 1.08;
}

:is(body.vt-theme, .editor-styles-wrapper) h2 {
	font-size: clamp(1.7rem, 1.2rem + 1.4vw, 2.4rem);
}

:is(body.vt-theme, .editor-styles-wrapper) h3 {
	font-size: clamp(1.35rem, 1.1rem + 0.7vw, 1.75rem);
}

:is(body.vt-theme, .editor-styles-wrapper) :is(h5, h6) {
	font-family: var(--vt-font-body);
	letter-spacing: 0;
}

body.vt-theme .entry-content > :is(p, ul, ol, blockquote, pre):not(.alignwide):not(.alignfull) {
	max-width: var(--vt-measure);
}

:is(body.vt-theme, .editor-styles-wrapper) p,
:is(body.vt-theme, .editor-styles-wrapper) li {
	line-height: 1.7;
}

body.vt-theme .entry-content a:not(.wp-block-button__link):not(.button):not(.ct-button) {
	color: var(--vt-purple-rich);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

body.vt-theme .entry-content a:not(.wp-block-button__link):not(.button):not(.ct-button):is(:hover, :focus-visible) {
	color: var(--vt-purple-deep);
}

:is(body.vt-theme, .editor-styles-wrapper) :focus-visible {
	outline: 2px solid var(--vt-focus);
	outline-offset: 3px;
}

:is(body.vt-theme, .editor-styles-wrapper) :is(img, .wp-block-image, .ct-media-container) {
	border-radius: var(--vt-radius);
}

:is(body.vt-theme, .editor-styles-wrapper) .ct-media-container {
	overflow: hidden;
}

:is(body.vt-theme, .editor-styles-wrapper) figcaption {
	color: var(--vt-ink-soft);
	font-size: 0.92rem;
}