.ate-badge {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 500px;
	transform: rotate(-2.5deg);
}

.ate-badge * {
	box-sizing: border-box;
}

.ate-badge__filter-def {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.ate-badge__rough {
	position: absolute;
	inset: 0;
	background-color: #abff4f;
	border-radius: 0;
}

.ate-badge__inner {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 32px 40px;
	word-break: break-word;
}

.ate-badge__title,
.ate-badge__subtitle {
	margin: 0;
	width: 100%;
	color: #1a1a1a;
}

.ate-badge__title {
	margin-top: 24px;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 40px;
	line-height: 0.975;
	text-transform: uppercase;
}

.ate-badge__subtitle {
	margin-top: 24px;
	font-family: "DM Sans", sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.275;
}

.ate-badge__title:first-child,
.ate-badge__subtitle:first-child {
	margin-top: 0;
}

/* The title is a <p>: keep theme / Elementor Kit paragraph spacing
   (e.g. ".elementor-kit-5 p { margin-block-end }") out of the badge.
   Space between title and subtitle comes only from "Space above". */
.ate-badge :is(.ate-badge__title, .ate-badge__subtitle) {
	margin-bottom: 0;
}

/* Subtitle is rich text (WYSIWYG): paragraphs, lists, links, headings.
   Its inner elements always take the subtitle's own typography and color
   (set in Style → Subtitle), so theme / Elementor Kit rules for p, li, h*
   can't restyle the badge. The .ate-badge prefix outranks Kit selectors
   like ".elementor-kit-5 p". */
.ate-badge .ate-badge__subtitle :is(p, ul, ol, li, blockquote, h1, h2, h3, h4, h5, h6, span) {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	font-style: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	color: inherit;
}

.ate-badge .ate-badge__subtitle :is(p, ul, ol, blockquote, h1, h2, h3, h4, h5, h6) {
	margin: 0 0 0.6em;
	padding: 0;
}

.ate-badge .ate-badge__subtitle :is(ul, ol) {
	padding-left: 1.25em;
}

.ate-badge .ate-badge__subtitle li {
	margin: 0;
}

/* No gap after the last block (also inside the desktop/mobile text wrappers). */
.ate-badge .ate-badge__subtitle > :last-child,
.ate-badge .ate-badge__subtitle > div > :last-child {
	margin-bottom: 0;
}

.ate-badge .ate-badge__subtitle :is(strong, b) {
	font-weight: 800;
}

.ate-badge .ate-badge__subtitle em {
	font-style: italic;
}

.ate-badge .ate-badge__subtitle a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.ate-badge .ate-badge__subtitle a:hover {
	text-decoration-thickness: 2px;
}