/*
Theme Name: Concept Sport
Theme URI: https://conceptsportautomobiles.fr
Author: CHALAL
Description: Thème à blocs pour Concept Sport Automobiles, magazine dédié aux concept cars, aux préparateurs et à l'histoire de l'automobile.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: concept-sport
*/

/* La bande de course : signature du thème */
.cs-bande {
	height: 10px;
	border: 0;
	margin: 0;
	background: linear-gradient(to bottom,
		var(--wp--preset--color--bleu) 0 50%,
		var(--wp--preset--color--rouge) 50% 100%);
}
.cs-bande--fine { height: 6px; }

/* En-tête */
.cs-entete { border-bottom: 1px solid var(--wp--preset--color--filet); }
.cs-logo a, .cs-logo {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 800;
	font-size: 1.9rem;
	line-height: 1;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--bleu);
}

.cs-nav a { text-decoration: none; }
.cs-nav a:hover, .cs-nav .current-menu-item > a { color: var(--wp--preset--color--rouge); }

/* Rubrique (catégorie) affichée en pastille sobre */
.cs-rubrique a {
	display: inline-block;
	padding: 0.15em 0.6em;
	background: var(--wp--preset--color--bleu);
	color: #fff;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 600;
	font-size: 0.95rem;
	letter-spacing: 0.04em;
}
.cs-rubrique a:hover { background: var(--wp--preset--color--rouge); }

/* Vignettes et titres d'articles */
.cs-vignette img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cs-carte .wp-block-post-title a { text-decoration: none; }
.cs-carte .wp-block-post-title a:hover { color: var(--wp--preset--color--rouge); }
.cs-carte .wp-block-post-featured-image { overflow: hidden; }
.cs-carte .wp-block-post-featured-image img { transition: transform .4s ease; }
.cs-carte:hover .wp-block-post-featured-image img { transform: scale(1.03); }

/* Accueil : ouverture pleine largeur */
.cs-une { position: relative; }
.cs-une .wp-block-post-featured-image { margin: 0; }
.cs-une .wp-block-post-featured-image img { width: 100%; height: min(72vh, 620px); object-fit: cover; }
.cs-une-texte {
	background: var(--wp--preset--color--bleu);
	color: #fff;
}
.cs-une-texte a { color: #fff; text-decoration: none; }
.cs-une-texte a:hover { text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: var(--wp--preset--color--rouge); }

/* Texte d'article */
.cs-article .wp-block-post-content > p:first-of-type::first-line { font-weight: 700; }
.cs-article .wp-block-post-content h2 { margin-top: 2.2em; }
.cs-article .wp-block-post-content blockquote {
	border-left: 6px solid var(--wp--preset--color--rouge);
	margin-left: 0;
	padding-left: 1.2rem;
	font-style: italic;
}

/* Formulaire de contact */
.cs-form { display: grid; gap: 1.1rem; max-width: 640px; }
.cs-form label { display: grid; gap: 0.35rem; font-family: var(--wp--preset--font-family--titre); font-weight: 600; font-size: 1.1rem; letter-spacing: 0.03em; }
.cs-form input[type=text], .cs-form input[type=email], .cs-form textarea {
	font: inherit;
	font-family: var(--wp--preset--font-family--texte);
	font-weight: 400;
	letter-spacing: 0;
	padding: 0.7rem 0.8rem;
	border: 2px solid var(--wp--preset--color--encre);
	background: #fff;
	border-radius: 0;
}
.cs-form input:focus, .cs-form textarea:focus, .cs-form button:focus-visible {
	outline: 3px solid var(--wp--preset--color--rouge);
	outline-offset: 2px;
}
.cs-form button {
	justify-self: start;
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 800;
	font-size: 1.25rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 0.7rem 1.8rem;
	border: 0;
	background: var(--wp--preset--color--rouge);
	color: #fff;
	cursor: pointer;
}
.cs-form button:hover { background: var(--wp--preset--color--bleu); }
.cs-form .cs-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cs-msg { padding: 0.9rem 1rem; border-left: 6px solid var(--wp--preset--color--bleu); background: #fff; max-width: 640px; }
.cs-msg--erreur { border-left-color: var(--wp--preset--color--rouge); }

/* Pied de page */
.cs-pied a { color: #fff; text-decoration: none; }
.cs-pied a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--rouge); text-decoration-thickness: 2px; }

@media (max-width: 781px) {
	.cs-une .wp-block-post-featured-image img { height: 48vh; }
}
@media (prefers-reduced-motion: reduce) {
	.cs-carte .wp-block-post-featured-image img { transition: none; }
}