/* Card chrome extras — base .curlo-card / __header / __body come from the brand kit. */

.curlo-card__header-label {
	margin-left: 0.4rem;
}

.curlo-file-icon {
	width: 1em;
	height: 1em;
	vertical-align: -0.12em;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.wp-block-curlo-card.curlo-card {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.entry-content > .wp-block-curlo-card,
.site-main > .wp-block-curlo-card {
	width: calc(100% - 48px);
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}

/* Brand kit hardcodes background: var(--curlo-surface). Surfaces win unless a WP color is set. */
.wp-block-curlo-card.curlo-card--none:not(.has-background) {
	background: transparent;
}

.wp-block-curlo-card.curlo-card--ink:not(.has-background) {
	background: var(--curlo-ink);
}

.wp-block-curlo-card.curlo-card--surface:not(.has-background) {
	background: var(--curlo-surface);
}

.wp-block-curlo-card.curlo-card--surface-2:not(.has-background) {
	background: var(--curlo-surface-2);
}

.wp-block-curlo-card.curlo-card--pro:not(.has-background),
.wp-block-curlo-card.curlo-card--code:not(.has-background) {
	background-color: var(--curlo-code-bg, #0b0e14);
}

.wp-block-curlo-card.curlo-card--pro,
.wp-block-curlo-card.curlo-card--code {
	color: var(--curlo-code-text, #e6edf3);
	border-color: rgba(255, 255, 255, 0.12);
}

.wp-block-curlo-card.curlo-card--pro {
	background-image:
		radial-gradient(650px circle at 12% -5%, rgb(20 53 31 / 0.28), transparent 60%),
		radial-gradient(700px circle at 100% 10%, rgb(16 35 58 / 0.28), transparent 55%);
}

.wp-block-curlo-card.curlo-card--pro.has-background,
.wp-block-curlo-card.curlo-card--code.has-background {
	background-image: none;
}

.curlo-card--pro .curlo-card__header,
.curlo-card--code .curlo-card__header {
	background: rgba(255, 255, 255, 0.04);
	border-bottom-color: rgba(255, 255, 255, 0.12);
	color: var(--curlo-code-muted, #7e8ca0);
}

.curlo-card--pro .curlo-eyebrow,
.curlo-card--code .curlo-eyebrow {
	color: var(--curlo-green, #4ade80);
}

.curlo-card--pro .curlo-card__body,
.curlo-card--code .curlo-card__body,
.curlo-card--pro .curlo-card__body p,
.curlo-card--code .curlo-card__body p {
	color: var(--curlo-code-text, #e6edf3);
}

/* Keep nested blocks from adding double top/bottom margin inside the body. */
.curlo-card__body {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.curlo-card__body > :first-child {
	margin-top: 0;
}

.curlo-card__body > :last-child {
	margin-bottom: 0;
}

.curlo-card__body h1,
.curlo-card__body h2,
.curlo-card__body h3,
.curlo-card__body h4,
.curlo-card__body p,
.curlo-card__body li {
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

/* Brand kit buttons are nowrap — they overflow or clip inside cards. */
.curlo-card .curlo-btn {
	max-width: 100%;
	min-width: 0;
	height: auto;
	white-space: normal;
	overflow-wrap: anywhere;
	text-align: center;
}

@media (max-width: 782px) {
	.curlo-card__body {
		padding: 1.1rem;
	}

	.curlo-card__body h1,
	.curlo-card__body h2,
	.curlo-card__body h3 {
		font-size: clamp(1.25rem, 1.05rem + 2vw, 1.75rem);
		letter-spacing: -0.02em;
	}

	.curlo-card .curlo-btn {
		display: flex;
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}
}
