/*
Theme Name:   Astra Child – Ma Carte Contact
Theme URI:    https://ma-carte-contact.com/
Description:  Thème enfant d’Astra pour ma-carte-contact.com. La mise en page se règle dans Elementor (pages, et pied de page : Modèles > Modèles enregistrés > « Pied de page du site ») et dans Apparence > Personnaliser (en-tête, couleurs). Ce fichier ne contient que les retouches qu’aucun réglage natif ne permet : il peut rester presque vide.
Author:       Stea Web
Template:     astra
Version:      1.1.0
Text Domain:  astra-child
*/

/* Les ancres du menu (#fonctionnement, #faq…) arrivent avec un peu d'air au-dessus du titre. */
.e-con[id] {
	scroll-margin-top: 24px;
}

/* Titres équilibrés sur leurs lignes : jamais un mot seul sur la dernière ligne d'un titre.
   (Aucun réglage d'Elementor ne le permet ; sans effet sur un navigateur ancien, qui coupe comme avant.) */
.elementor-heading-title {
	text-wrap: balance;
}

/* Un lien dans un texte se repère sans dépendre de sa couleur (accessibilité).
   « .elementor » devant : sans lui, une règle d'Elementor de même poids retire le soulignement. */
.elementor .elementor-widget-text-editor a,
.ast-footer-copyright a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Une adresse e-mail ne se coupe jamais à son trait d'union (« contact@ma-carte- / contact.com » se lirait comme
   une césure, et serait recopiée fausse). */
.elementor-widget-text-editor a[href^="mailto:"] {
	white-space: nowrap;
}

/* Défilement doux vers les sections (#faq…), sauf si le visiteur a demandé de réduire les animations. Fait par
   le navigateur, il place aussi le clavier à la section atteinte (le « défilement fluide » d'Astra, désactivé dans
   Apparence > Personnaliser > Global > Divers, laissait le clavier en bas de page). */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* La zone cliquable du logo couvre toute l'image (et pas seulement une ligne de texte). */
.custom-logo-link {
	display: inline-block;
}

/* ---- Pied de page (modèle Elementor « Pied de page du site ») ----
   Aucun réglage d'Elementor ne couvre ces trois points ; tout le reste se règle dans l'éditeur. */

/* 1. Liens d'un texte sur le fond bleu nuit : le corail des liens du site y serait trop peu contrasté,
   au repos comme au survol. */
.mcc-pied .elementor-widget-text-editor a,
.mcc-pied .elementor-widget-text-editor a:hover,
.mcc-pied .elementor-widget-text-editor a:focus {
	color: var(--e-global-color-blanc, #FFFFFF);
}
.mcc-pied .elementor-icon-list-item > a:hover .elementor-icon-list-text {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* 2. Contour de focus visible au clavier sur le fond sombre. */
.mcc-pied a:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #FF8A65);
	outline-offset: 3px;
	border-radius: 4px;
}

/* 3. Liens assez hauts pour le doigt sur tablette et téléphone (44 px environ). La marge négative de la liste
   compense cette hauteur ajoutée, pour que listes et titres restent alignés comme réglé dans Elementor. */
.mcc-pied .elementor-icon-list-item > a {
	padding-block: 5px;
}
.mcc-pied .elementor-widget-icon-list .elementor-icon-list-items {
	margin-block: -5px;
}
@media (max-width: 1024px) {
	.mcc-pied .elementor-icon-list-item > a,
	.mcc-pied .mcc-liens-legaux a {
		display: inline-flex;
		padding-block: 11px;
	}
	.mcc-pied .elementor-widget-icon-list .elementor-icon-list-items {
		margin-block: -11px;
	}
}