/* Gutenberg components */
p.is-style-large {
	font-size: var(--text-l);
	line-height: var(--text-l-line-height);
}
p.is-style-extra-large {
	font-size: var(--text-xl);
	line-height: var(--text-xl-line-height);
}
p.is-style-talstreck {
	position: relative;
	padding-left: 30px;
}
p.is-style-talstreck::before {
	content: "—";
	position: absolute;
	left: 0;
	top: 15px;
	line-height: 0;
}
.highlight,
.is-style-highlight {
	font-size: var(--h6);
	text-transform: uppercase;
	letter-spacing: var(--h6-letter-spacing);
	font-weight: 500;
	color: var(--primary);
}
.wp-block-heading.is-style-h1 {
	font-size: var(--h1);
	line-height: var(--heading-line-height);
}
@media screen and (max-width: 1025px) {
	.samuraj-inner-section > h2.is-style-h1 {
		font-size: var(--h2);
	}
}

.wp-block-heading.is-style-h2 {
	font-size: var(--h2);
	line-height: var(--heading-line-height);
}
.wp-block-heading.is-style-h3 {
	font-size: var(--h3);
	line-height: var(--heading-line-height);
}
.wp-block-heading.is-style-h4 {
	font-size: var(--h4);
	line-height: var(--heading-line-height);
}
.h1--xl {
	font-size: 10rem;
}
@media screen and (max-width: 767px) {
	.h1--xl {
		font-size: 4.8rem;
	}
}
.box {
	box-shadow: var(--box-shadow-m);
	border-radius: var(--radius-l);
	background: white;
}
.bg--light .box {
	box-shadow: none;
}

/* Pills */
.bg--dark .pill {
	background: var(--primary-ultra-dark);
}
.pill {
	color: var(--base);
	background: var(--primary-ultra-light);
	border-radius: 50vmax;
	padding: 2px 12px;
	font-size: var(--h6);
	text-decoration: none !important;
	outline: none !important;
}
.pill--dark.pill--dark {
	background: var(--primary-dark);
	color: white;
}

@media screen and (min-width: 1026px) {
	a.pill.pill:is(:hover, :focus-visible) {
		background: var(--primary);
		color: white;
	}
	a.pill--dark.pill:is(:hover, :focus-visible) {
		background: var(--primary);
		color: white;
	}
}
@media screen and (min-width: 1026px) {
	.bg--dark a.pill.pill:is(:hover, :focus-visible) {
		background: white;
		color: var(--primary-ultra-dark);
	}
}
/* Hover utilities */
@media screen and (min-width: 1026px) {
	.clickable-hover-trigger:has(a.clickable-parent:is(:hover, :focus-visible)) .hover-scale {
		transform: translateZ(0) scale(1.06);
	}
}
/* Extra padding to align heading with text */
@media screen and (min-width: 1026px) {
	.pt-desktop {
		padding-top: var(--gap-xs7);
	}
}
ul.list--none.list--none.list--none {
	list-style: none;
}
