/* components/call-to-action: a button of the kit with more weight: a larger and bold label, more room round it
   and a taller target than the touch target, set apart from the text above and below. The colours, the hover
   and the focus are the button's own (components/button). */
@layer components {
	.dv-call-to-action {
		margin-block: var(--space-3) calc(var(--space-3) * 1.5);
	}

	.dv-call-to-action .dv-call-to-action-button {
		min-block-size: calc(var(--touch-target) * 1.25);
		padding: var(--space-2) calc(var(--space-3) * 1.5);
		font-size: calc(var(--font-size-control) * 1.15);
		font-weight: bold;
		border-radius: var(--radius-panel);
	}
}