/*
Theme Name:   Rebuilto Child
Description:  Thème enfant de Rebuilto pour le site de Tropic Holding (Aurelius-DC). Le thème parent charge lui-même cette feuille de style (inc/class-main.php).
Author:       Aurelius-DC
Template:     rebuilto
Version:      1.14.0
Text Domain:  rebuilto-child
*/

/*
 * Focus visible au clavier. Le thème le retire partout (`:focus { outline: none }` dans son style.css) :
 * un visiteur au clavier ne voyait pas où il se trouvait (constaté le 2026-10-12). Clavier seulement
 * (`:focus-visible`) : le rendu à la souris ne change pas. Couleur du texte de l'élément, donc contrastée
 * avec son fond.
 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* Boutons : contour à l'intérieur, sur le fond du bouton (à l'extérieur, de la couleur du texte, il disparaîtrait
   sur une page de la même couleur — texte blanc sur page blanche). */
.elementor-button:focus-visible,
button:focus-visible,
input[type="submit"]:focus-visible {
	outline-offset: -5px;
}

/*
 * Accueil : fin du titre du bandeau en orange (« faire germer l’industrie », 2026-10-14), comme l'ancienne formule
 * défilante ; orange #D95300 sur le voile du diaporama : 4,34:1 sur #191919, titre de grande taille (AA : 3:1).
 */
.tropic-titre-accueil .tropic-orange {
	color: var(--e-global-color-orange, #D95300);
}

/*
 * Typographie française : la feuille de base du thème met une capitale à chaque mot de tous les boutons
 * (`.elementor-button { text-transform: capitalize }`, usage anglais). En français, seule la première lettre
 * est en capitale : les textes sont écrits ainsi, sans transformation.
 */
body .elementor-button,
body .button-style span {
	text-transform: none;
}

/*
 * Zones sombres (en-tête, sections noires, méga-menu, pied de page) : le vert de la charte (#226E49) n'y a que
 * 2,8:1 de contraste sur #191919 ; on y emploie sa nuance claire du kit, « Vert clair » (#2E9462, 4,6:1), et un
 * survol plus clair (#37A86F, 5,9:1). Texte secondaire : le gris du kit (#707070, choisi pour les fonds clairs)
 * n'a que 3,55:1 sur #191919 (pied de page : libellés, copyright, liens légaux, constaté le 2026-10-13) ; on y
 * reprend le gris de la démo, #888888 (5,25:1 sur #191919, 5,9:1 sur noir). Classe posée sur les conteneurs concernés.
 */
.tropic-sombre {
	--primary: var(--e-global-color-vert_clair, #2E9462);
	--primary_hover: #37A86F;
	--e-global-color-primary: var(--e-global-color-vert_clair, #2E9462);
	--e-global-color-primary_hover: #37A86F;
	--text_light: #888888;
	--e-global-color-text_light: #888888;
}

/* Cartes des filiales (logos sur fond blanc) : voile en dégradé limité au bas de la carte, sous le titre blanc,
   au lieu du voile noir à 40 % sur toute la carte (pensé pour des photos). Carrousels marqués `tropic-cartes-logos`
   et archive d'un pays (/pays/<pays>/, cible du fil d'Ariane des fiches filiales). */
.tropic-cartes-logos .project-item[class*="project-style"] .project-post-thumbnail::before,
.tax-rebuilto_project_cat .project-item[class*="project-style"] .project-post-thumbnail::before {
	background-color: transparent; /* règle du thème plus spécifique (.project-item.project-style-1 …) : à neutraliser */
	background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.35) 32%, rgba(0, 0, 0, 0) 58%);
}

/*
 * Bandeau de titre des pages intérieures (modèle de fil d'Ariane du thème) : photo par défaut. La démo n'en avait
 * aucune (fond gris). Une fiche peut la remplacer dans ses réglages Elementor (« Breadcrumb Settings » du thème,
 * règle `.elementor-page-<id> .breadcrumb-wrap`, plus forte). Pas dans les réglages du modèle 620 lui-même : le
 * thème y écrit l'identifiant de la page en cours au moment où la feuille du modèle est générée (`get_the_ID()`,
 * inc/elementor/modules/page-settings.php) — la règle par défaut et celle de la fiche devenaient identiques et la
 * dernière chargée (le modèle) l'emportait (constaté le 2026-10-13). Voile noir à 60 % : conteneur du modèle.
 */
.breadcrumb-wrap {
	background: #191919 url("assets/images/bandeau-defaut-1920.jpg") center center / cover no-repeat;
}

@media (max-width: 767px) {
	.breadcrumb-wrap {
		background-image: url("assets/images/bandeau-defaut-800.jpg");
	}
}

/*
 * Fiche d'identité des filiales (widget « Project Information » du thème) : libellés à 25 % de la largeur, soit
 * 85 px sur mobile — « Pôle d’intervention » y était coupé en plein mot (« d’interventi / on », constaté le
 * 2026-10-13 à 390 px). 40 % sur mobile.
 */
@media (max-width: 767px) {
	.sinlge-project-meta .meta-item .title {
		flex-basis: 40%;
		max-width: 40%;
	}
}

/*
 * Menus déroulants de l'en-tête sur fond noir (réglages du widget de menu, entete-pied/construire.py) : filets
 * entre les entrées et page en cours lisibles sur ce fond. Le thème prévoit des filets clairs (--border) et la
 * page en cours en noir (--accent, !important) pour un menu sur fond blanc.
 */
.tropic-sombre .main-navigation ul.menu li.menu-item .sub-menu .menu-item {
	border-bottom-color: rgba(255, 255, 255, 0.12);
}

.tropic-sombre .main-navigation ul.menu li.menu-item .sub-menu .menu-item.current-menu-item > a span,
.tropic-sombre .main-navigation ul.menu li.menu-item .sub-menu .menu-item.current-menu-parent > a span,
.tropic-sombre .main-navigation ul.menu li.menu-item .sub-menu .menu-item.current-menu-ancestor > a span {
	color: var(--primary) !important;
}

/*
 * Frise historique (widget « Scroll Timeline », page Qui sommes-nous) : le thème étire l'image de l'étape sur toute
 * la hauteur de la liste (1 500 px pour 9 étapes) en mode « cover » — pensé pour des photos, il rognait les cartes
 * logo des filiales (« TAC Logi… », constaté le 2026-10-13). Carte entière, collée sous l'en-tête pendant le défilement.
 */
.tropic-frise .scroll-timeline-image img {
	position: sticky;
	top: 140px;
	height: auto;
	max-height: 460px;
	object-fit: contain;
}

/*
 * Liens dans les textes courants (mentions légales, politique, coordonnées) : distingués par la seule couleur, noir
 * sur texte gris #555 (2,8:1 < 3:1, WCAG 1.4.1, constaté le 2026-10-13) → soulignés. Boutons exclus.
 */
.elementor-widget-text-editor a:not(.elementor-button) {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

/* Message « aucun article » de la page Actualités (code court du thème enfant, inc/actualites.php). */
.tropic-aucun-article {
	margin: 0;
}

/*
 * Lettre d'information (bandeau sombre de l'accueil, formulaire Contact Form 7 « Newsletter (FR) ») : champ blanc
 * arrondi et bouton rond à enveloppe, comme le formulaire Mailchimp de la démo Home 1 ; case d'accord en clair.
 */
.tropic-newsletter-form {
	max-width: 740px;
}

.tropic-newsletter-champ {
	position: relative;
}

.tropic-newsletter-champ .wpcf7-form-control-wrap {
	display: block;
}

.tropic-newsletter-champ input[type="email"] {
	width: 100%;
	height: 64px;
	padding: 0 84px 0 28px;
	border: 0;
	border-radius: 32px;
	background: #fff;
	color: #000;
	font-size: 15px;
}

.tropic-newsletter-champ input[type="email"]::placeholder {
	color: #555;
	opacity: 1;
}

.tropic-newsletter-bouton {
	position: absolute;
	top: 6px;
	right: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--primary);
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	transition: background-color 0.2s;
}

.tropic-newsletter-bouton:hover,
.tropic-newsletter-bouton:focus-visible {
	background: var(--primary_hover, #1a5a3b);
}

.tropic-newsletter-form .tropic-accord {
	margin-top: 18px;
	color: #c8c8c8;
	font-size: 14px;
}

.tropic-newsletter-form .tropic-accord a {
	color: #fff;
	text-decoration: underline;
}

.tropic-newsletter-form .wpcf7-not-valid-tip,
.tropic-sombre .wpcf7-not-valid-tip {
	color: #ff9a8f; /* rouge de Contact Form 7 (#dc3232) : 3,9:1 sur le fond sombre, sous le seuil */
}

.tropic-newsletter .wpcf7 form .wpcf7-response-output {
	margin: 18px 0 0;
	color: #fff;
}

/* Retour du lien de confirmation de la lettre d'information (inc/newsletter.php). */
.tropic-avis {
	position: relative;
	z-index: 1000;
	padding: 14px 20px;
	background: var(--primary);
	color: #fff;
	font-size: 15px;
	text-align: center;
}

.tropic-avis-expiree {
	background: #191919;
}

/* Case d'accord des formulaires (contact, lettre d'information) : retrait de 1 em de Contact Form 7 retiré, la case
   s'aligne sur les champs. */
.tropic-accord .wpcf7-list-item {
	margin-left: 0;
}

/* Formulaire de contact : les rangées du thème (`.ct-form .row`) sont décalées de -10 px, rattrapés par les colonnes
   (`[class*=column-]`, 10 px) ; la rangée de la case d'accord n'a pas de colonne → même marge intérieure. */
.ct-form .row.tropic-accord {
	padding: 0 10px;
}

/*
 * Page 404 et recherche (404.php, search.php, content-none.php, inc/recherche.php). « 404 » en orange de la charte
 * (accent décoratif ; le rouge #DE3431 du thème est hors charte) ; titre passé de H2 à H1 avec la taille d'un H2 du
 * thème (50 px, 36 px sur petit écran comme le thème). Bandeau de la 404 = celui des articles : bouton
 * « Toutes les actualités » masqué.
 */
.error404 .page-content .error-heading {
	color: var(--e-global-color-orange, #D95300);
}

.error404 .page-content .error-title {
	font-size: 50px;
	line-height: 1.08;
}

@media (max-width: 568px) {
	.error404 .page-content .error-title {
		font-size: 36px;
	}
}

.error404 .breadcrumb-wrap .elementor-widget-rebuilto-button {
	display: none;
}

/* Pastille de l'icône en vert, comme les autres boutons du site (noire dans le gabarit du thème). */
.error404 .error-button .elementor-button i {
	background-color: var(--primary);
}

.error404 .error-button .elementor-button:hover i,
.error404 .error-button .elementor-button:focus-visible i {
	background-color: var(--primary_hover, #1a5a3b);
}

.tropic-recherche {
	max-width: 880px;
	margin: 0 auto 48px;
	text-align: center;
}

.search-results .tropic-recherche {
	margin-bottom: 60px;
}

.tropic-recherche .search-form {
	display: flex;
	gap: 10px;
	max-width: 560px;
	margin: 24px auto 32px;
}

.tropic-recherche .search-form label {
	flex: 1;
	margin: 0;
}

.tropic-recherche .search-field {
	width: 100%;
	height: 56px;
	padding: 0 24px;
	border: 1px solid #c4c4c4;
	border-radius: 28px;
	background: #fff;
	color: #000;
	font-size: 15px;
}

.tropic-recherche .search-field::placeholder {
	color: #555;
	opacity: 1;
}

.tropic-recherche .search-submit {
	height: 56px;
	padding: 0 28px;
	border: 0;
	border-radius: 28px;
	background: var(--primary);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s;
}

.tropic-recherche .search-submit:hover,
.tropic-recherche .search-submit:focus-visible {
	background: var(--primary_hover, #1a5a3b);
}

.tropic-liens-utiles ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tropic-liens-utiles a {
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid #c4c4c4;
	border-radius: 24px;
	color: #191919;
	font-size: 15px;
	transition: border-color 0.2s, color 0.2s;
}

.tropic-liens-utiles a:hover,
.tropic-liens-utiles a:focus-visible {
	border-color: var(--primary);
	color: var(--primary);
}

/* Résultats de recherche : la pastille de date du thème n'a de sens que pour un article (pôles, filiales : date de
   création de la fiche). */
.search-results article:not(.type-post) .posted-on-square {
	display: none;
}

@media (max-width: 567px) {
	.tropic-recherche .search-form {
		flex-direction: column;
	}
}

/*
 * Panneau du menu mobile fermé : le thème le pousse seulement hors de l'écran (translate) — ses liens restaient
 * atteignables à la touche Tab, invisibles (constaté le 2026-10-14). Masqué une fois l'animation de fermeture
 * finie (visibilité retardée de 0,25 s), visible dès l'ouverture. Voir assets/js/menu-mobile.js.
 */
.rebuilto-mobile-nav {
	visibility: hidden;
	transition: transform 0.25s ease, visibility 0s linear 0.25s;
}

.mobile-nav-active .rebuilto-mobile-nav {
	visibility: visible;
	transition: transform 0.25s ease, visibility 0s linear 0s;
}

/*
 * Numéros de téléphone (liens « tel: ») dans les encarts à icône des zones sombres — pied de page, encart « Une
 * question ? » des fiches pôles : couleur du texte de l'encart (le thème met les liens en noir, illisibles sur
 * #191919, constaté le 2026-10-14) ; soulignés au survol et au focus.
 */
.tropic-sombre .elementor-icon-box-description a {
	color: inherit;
}

.tropic-sombre .elementor-icon-box-description a:hover,
.tropic-sombre .elementor-icon-box-description a:focus-visible {
	text-decoration: underline;
}

/* Lien d'évitement « Aller au contenu » (inc/accessibilite.php) : hors de l'écran, affiché au focus. */
.tropic-evitement {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100000;
	padding: 0.75em 1.5em;
	background: #fff;
	color: #226e49;
	font-weight: 600;
	text-decoration: underline;
	transform: translateY(-120%);
}

.tropic-evitement:focus {
	transform: none;
	outline: 2px solid #226e49;
	outline-offset: -4px;
}

#contenu:focus {
	outline: none;
}

/*
 * Appels finals (bloc a-propos-06 de la démo : surtitre, titre, bouton rond de 180 px qui suit la souris) sur tablette :
 * la colonne du titre et le bouton se partageaient une largeur fixe, le widget du bouton tombait à 100 px et le rond
 * débordait de 50 à 80 px hors de l'écran (coupé), le titre se coupait en plein mot (« CANDIDATUR / E ») — constaté
 * à la recette du 2026-10-15, 22 pages, de 768 à ~985 px. Sur tablette, bouton sous le texte, comme sur mobile.
 */
@media (min-width: 768px) and (max-width: 1024px) {
	.e-con:has(> .elementor-widget-rebuilto-button-mousemove) {
		flex-wrap: wrap;
		flex: 1 1 0;
		min-width: 0;
	}

	.e-con:has(> .elementor-widget-rebuilto-button-mousemove) > .elementor-widget-rebuilto-button-mousemove {
		flex: 0 0 100%;
		margin-top: 30px;
	}

	.e-con:has(> .elementor-widget-rebuilto-button-mousemove) > :not(.elementor-widget-rebuilto-button-mousemove) {
		flex: 1 1 100%;
		max-width: 100%;
	}

	/* Surtitre à la hauteur de la première ligne du titre (centré, il tombait entre le titre et le bouton). */
	.e-con-inner:has(> .e-con > .elementor-widget-rebuilto-button-mousemove) {
		align-items: flex-start;
	}

	.e-con-inner:has(> .e-con > .elementor-widget-rebuilto-button-mousemove) > .e-con:first-child {
		padding-top: 20px;
	}
}

/*
 * Cartes des pôles (rebuilto-services, style 1 « à effet », accueil et page Pôles) : quatre cartes sur toute la
 * largeur, titres de 20 à 28 px — de 768 à ~1300 px, « hydroélectricité » était plus large que sa carte et passait
 * sous la carte voisine (recette du 2026-10-15). Tablette : deux cartes par ligne ; ordinateur : titre proportionné
 * à la largeur d'une carte (un quart de l'écran), 28 px au plus. Survol (titre agrandi à 36 px par le thème, carte
 * élargie à 37,5 % de l'écran) : même plafond, calculé sur la carte survolée.
 */
@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-widget-rebuilto-services.elementor-style-effect-yes.elementor-service-style-1 .d-grid {
		flex-wrap: wrap;
	}

	.elementor-widget-rebuilto-services.elementor-style-effect-yes.elementor-service-style-1 .d-grid .grid-item {
		flex: 0 0 50%;
		width: 50%;
	}

	.elementor-widget-rebuilto-services.elementor-style-effect-yes.elementor-service-style-1 .service-item .service-inner:hover .service-title {
		font-size: min(36px, calc((50vw - 64px) / 10));
	}
}

@media (min-width: 1025px) {
	.elementor-widget-rebuilto-services.elementor-style-effect-yes.elementor-service-style-1 .service-item .service-title {
		font-size: min(28px, calc((25vw - 64px) / 10));
	}

	.elementor-widget-rebuilto-services.elementor-style-effect-yes.elementor-service-style-1 .service-item .service-inner:hover .service-title {
		font-size: min(36px, calc((37.5vw - 64px) / 10));
	}
}

/*
 * Entrée « Contact » du menu principal (classe tropic-menu-mobile, build/menus/creer_menu_fr.php) : panneau du menu
 * mobile seulement — sur ordinateur, le bouton « Nous contacter » de l'en-tête en tient lieu (2026-10-15).
 */
.main-navigation .menu-item.tropic-menu-mobile {
	display: none;
}