/* ==========================================================================
   EMC² Sonorisation — couche de marque (cosmétique)

   Cible : ce que le Customizer Kadence ne sait pas régler proprement
   (états focus, états hover précis, micro-typographie, harmonisation
   inputs/boutons). La palette et la typographie principales sont
   pilotées par le Customizer ; ici on s'appuie sur les variables
   --global-paletteN exposées par Kadence.
   ========================================================================== */

:root {
	/* Stack typographique de marque */
	--emc2-font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;

	/* Alias sémantiques sur la palette Kadence */
	--emc2-amber:        var(--global-palette1);
	--emc2-amber-dark:   var(--global-palette2);
	--emc2-anthracite:   var(--global-palette3);
	--emc2-text:         var(--global-palette4);
	--emc2-muted-strong: var(--global-palette5);
	--emc2-muted:        var(--global-palette6);
	--emc2-border:       var(--global-palette7);
	--emc2-surface-alt:  var(--global-palette8);
	--emc2-surface:      var(--global-palette9);
	--emc2-background:   var(--global-palette10);

	/* Texte sur fond ambre : anthracite (cf. brief, contraste AA) */
	--emc2-on-amber: var(--emc2-anthracite);

	/* Anneau de focus de marque */
	--emc2-focus-ring: 0 0 0 3px rgba(245, 158, 11, 0.35);
}

/* --------------------------------------------------------------------------
   Typographie : famille de fallback explicite + tracking serré sur titres
   -------------------------------------------------------------------------- */

body,
button,
input,
optgroup,
select,
textarea {
	font-family: var(--emc2-font-sans);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.entry-title {
	font-family: var(--emc2-font-sans);
	letter-spacing: -0.01em;
}

h1,
.has-huge-font-size,
.has-x-large-font-size {
	letter-spacing: -0.02em;
}

h2 {
	letter-spacing: -0.018em;
}

/* Utilitaire « eyebrow » : micro-titre en capitales espacées */
.emc2-eyebrow {
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-size: 0.78rem;
	color: var(--emc2-muted-strong);
}

/* --------------------------------------------------------------------------
   Liens : couleur ambre dark, soulignement aéré
   -------------------------------------------------------------------------- */

.entry-content a:not(.button):not(.wp-block-button__link),
.site-content a:not(.button):not(.wp-block-button__link) {
	color: var(--emc2-amber-dark);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	transition: color 0.15s ease;
}

.entry-content a:not(.button):not(.wp-block-button__link):hover,
.entry-content a:not(.button):not(.wp-block-button__link):focus-visible,
.site-content a:not(.button):not(.wp-block-button__link):hover,
.site-content a:not(.button):not(.wp-block-button__link):focus-visible {
	color: var(--emc2-anthracite);
}

/* --------------------------------------------------------------------------
   Focus visible (clavier) : anneau ambre cohérent partout
   -------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.button:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--emc2-amber);
	outline-offset: 2px;
	box-shadow: var(--emc2-focus-ring);
}

/* --------------------------------------------------------------------------
   Boutons : Gutenberg, Kadence, WooCommerce, formulaires natifs
   -------------------------------------------------------------------------- */

.wp-block-button .wp-block-button__link,
.button:not(.is-style-outline),
button[type="submit"]:not([class*="outline"]),
input[type="submit"],
.kt-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
	background-color: var(--emc2-amber);
	color: var(--emc2-on-amber);
	border: 1px solid var(--emc2-amber);
	font-weight: 600;
	letter-spacing: 0.005em;
	border-radius: 6px;
	transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.05s ease, box-shadow 0.15s ease;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.wp-block-button .wp-block-button__link:hover,
.button:not(.is-style-outline):hover,
button[type="submit"]:not([class*="outline"]):hover,
input[type="submit"]:hover,
.kt-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
	background-color: var(--emc2-amber-dark);
	border-color: var(--emc2-amber-dark);
	color: var(--emc2-on-amber);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(217, 119, 6, 0.22);
}

.wp-block-button .wp-block-button__link:active,
.button:active,
.kt-button:active {
	transform: translateY(0);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

/* Variante outline / fantôme : bordure anthracite, fond transparent */
.is-style-outline .wp-block-button__link,
.kt-button.kt-style-outline,
.button.alt-secondary {
	background-color: transparent;
	color: var(--emc2-anthracite);
	border: 1.5px solid var(--emc2-anthracite);
}

.is-style-outline .wp-block-button__link:hover,
.kt-button.kt-style-outline:hover,
.button.alt-secondary:hover {
	background-color: var(--emc2-anthracite);
	color: var(--emc2-surface);
	border-color: var(--emc2-anthracite);
}

/* --------------------------------------------------------------------------
   Champs de formulaire : harmonisation visuelle
   -------------------------------------------------------------------------- */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="time"],
select,
textarea {
	border: 1px solid var(--emc2-border);
	border-radius: 6px;
	background-color: var(--emc2-surface);
	color: var(--emc2-text);
	font-family: var(--emc2-font-sans);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="time"]:focus,
select:focus,
textarea:focus {
	border-color: var(--emc2-amber);
	outline: none;
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.18);
}

/* --------------------------------------------------------------------------
   Détails fins
   -------------------------------------------------------------------------- */

::selection {
	background-color: var(--emc2-amber);
	color: var(--emc2-on-amber);
}

hr {
	border: 0;
	border-top: 1px solid var(--emc2-border);
}

/* --------------------------------------------------------------------------
   Page d'accueil — checklist offre / liste zone / FAQ
   -------------------------------------------------------------------------- */

ul.emc2-checklist {
	list-style: none;
	padding-left: 0;
}
ul.emc2-checklist li {
	position: relative;
	padding-left: 1.75rem;
}
ul.emc2-checklist li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--emc2-amber);
	font-weight: 700;
}

ul.emc2-zone-list {
	list-style: none;
	padding-left: 0;
}
ul.emc2-zone-list li {
	position: relative;
	padding-left: 1.25rem;
}
ul.emc2-zone-list li::before {
	content: "·";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--emc2-amber);
	font-weight: 700;
	font-size: 1.4em;
	line-height: 1;
}

.emc2-faq details {
	border: 1px solid var(--emc2-border);
	border-radius: 8px;
	padding: 1rem 1.25rem;
	margin-bottom: 0.75rem;
	background: var(--emc2-surface);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.emc2-faq details:hover {
	border-color: var(--emc2-muted);
}
.emc2-faq details[open] {
	border-color: var(--emc2-amber);
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}
.emc2-faq summary {
	cursor: pointer;
	list-style: none;
	font-size: 17px;
	color: var(--emc2-anthracite);
	padding-right: 2rem;
	position: relative;
	user-select: none;
}
.emc2-faq summary::-webkit-details-marker {
	display: none;
}
.emc2-faq summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 24px;
	font-weight: 300;
	color: var(--emc2-amber);
	line-height: 1;
	transition: transform 0.2s ease;
}
.emc2-faq details[open] summary::after {
	content: "−";
	transform: translateY(-50%) rotate(180deg);
}
.emc2-faq details p {
	margin: 0.85rem 0 0;
	color: var(--emc2-muted-strong);
	font-size: 16px;
	line-height: 1.65;
}