/**
 * Global Styles
 *
 */

body {
	font-family: var(--font-body) !important;
}

/*
--------------------------------------
réglages thème
--------------------------------------
*/

.site-header:not(.dynamic-header),
.site-footer:not(.dynamic-footer) {
	max-width: 100% !important;
	padding: 0;
}

/*
--------------------------------------
typographie de base (cf. src/styles.css du prototype)
--------------------------------------
*/

h1,
h2,
h3,
h4 {
	font-family: var(--font-display);
	font-weight: 400;
	letter-spacing: -0.01em;
}

/*
--------------------------------------
custom template
--------------------------------------
*/

.content-container {
	width: 100%;
}

/*
--------------------------------------
utilities (Le Royaume de Brindille)
--------------------------------------
*/

.container-wide {
	max-width: 1280px;
	margin-inline: auto;
	padding-inline: 1.25rem;
}

.script {
	font-family: var(--font-script);
}

.btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	border-radius: 999px;
	padding: 0.875rem 1.75rem;
	font-family: var(--font-body);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--transition-normal);
}

.btn--accent {
	background-color: var(--forest);
	color: var(--cream);
}

.btn--accent:hover {
	background-color: color-mix(in oklch, var(--forest) 90%, white);
	color: var(--cream);
}

.btn--accent svg {
	transition: transform var(--transition-fast);
}

.btn--accent:hover svg {
	transform: translateX(3px);
}

/*
--------------------------------------
elements
--------------------------------------
*/

body {
	font: var(--font-text);
	color: var(--color-text);
}

a {
	color: var(--color-primary);
	transition: color var(--transition-normal);
}

a:hover {
	color: var(--color-secondary);
}

header ul,
footer ul {
	list-style-type: none;
	margin: 0;
}

.entry-content ul {
	list-style-type: disc;
	margin-left: 1em;
}

p {
	margin-bottom: 0;
}