/*
 * base.css
 * Reset, typographie globale, éléments génériques.
 */

*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--header-height);
}

body {
	font-family: var(--font-body);
	background: var(--bg);
	color: var(--text);
	line-height: 1.7;
	overflow-x: hidden;
	transition: background var(--transition-med), color var(--transition-med);
}

h1, h2, h3 {
	font-family: var(--font-display);
	line-height: 1.2;
}

a {
	color: inherit;
	text-decoration: none;
}

button {
	font: inherit;
	color: inherit;
	background: none;
	border: none;
	cursor: pointer;
}

img, svg, canvas {
	display: block;
	max-width: 100%;
}

::selection {
	background: var(--accent);
	color: #ffffff;
}

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-track {
	background: var(--bg-alt);
}

::-webkit-scrollbar-thumb {
	background: var(--surface-hover);
	border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--accent);
}

.accent {
	color: var(--accent);
}

.container {
	width: min(var(--container-max), 100% - 3rem);
	margin-inline: auto;
}

/* Sur les appareils à pointeur fin, le curseur natif est remplacé
   par le curseur personnalisé (voir cursor.js). */
@media (hover: hover) and (pointer: fine) {
	body.has-custom-cursor,
	body.has-custom-cursor a,
	body.has-custom-cursor button,
	body.has-custom-cursor input,
	body.has-custom-cursor textarea {
		cursor: none;
	}
}