/* =========================================================
   LOGMIS — Footer : largeurs de colonnes (maquette Figma 533:6059)
   Le footer est monté dans Ohio Theme Settings (chrome = Ohio).
   Ohio impose 4 zones de widgets en .vc_col-md-3 (25% figé) et
   n'offre AUCUNE option UI de largeur de colonne. La maquette
   demande ~20/40/20/20.
   → On surcharge UNIQUEMENT en desktop (>=992px, breakpoint md
     d'Ohio) ; en dessous on laisse le responsive natif d'Ohio
     (vc_col-sm-6 puis empilement). Ciblé sur #colophon : aucun
     effet de bord ailleurs sur le site.
   ========================================================= */

/* Conteneur du footer : on pilote le système natif d'Ohio via SES
   variables CSS (plutôt que de surcharger chaque propriété). Ça vaut
   pour TOUTES les .page-container du footer (colonnes, scroll-top,
   copyright), à TOUTES les tailles, et respecte le moteur de grille
   d'Ohio (les marges/gouttières des .vc_row en dépendent aussi).
   Le réglage UI "Wrap Container Width" ne persistait pas en base
   (option NULL) → on fige ici. Le fond #23282d reste pleine largeur
   (porté par #colophon) ; seul le contenu est borné + centré. */
#colophon {
	--clb-container-width: 1400px;       /* largeur max du contenu */
	--clb-container-side-gutter: 24px;   /* gouttiere gauche/droite, toutes tailles */
}
#colophon .page-container {
	margin-inline: auto;                 /* centrage (securite) */
}

@media (min-width: 992px) {
	#colophon .widgets-column:nth-child(1) { width: 20%; } /* Logo */
	#colophon .widgets-column:nth-child(2) { width: 40%; } /* Conformité Légale */
	#colophon .widgets-column:nth-child(3) { width: 20%; } /* Solutions Métiers */
	#colophon .widgets-column:nth-child(4) { width: 20%; } /* Téléchargements Support */
}

/* =========================================================
   Responsive — sous le desktop, Ohio empile les colonnes
   nativement (vc_col-sm-6 = 2x2 en tablette, puis pleine largeur
   en mobile). On ajoute ce qui manque : l'air vertical entre
   colonnes empilées + l'empilement de la barre copyright.
   ========================================================= */

/* Tablette + mobile (<992) : espace vertical entre colonnes passées à la ligne */
@media (max-width: 991px) {
	#colophon .widgets-column { margin-bottom: 32px; }
}

/* Mobile (<576) : barre copyright gauche/droite -> pile alignée à gauche */
@media (max-width: 575px) {
	#colophon .site-footer-copyright .holder {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}
}

/* =========================================================
   Typographie & couleurs — CONFORMITÉ MAQUETTE (Figma 533:6059)
   Figé en CSS car les réglages typo de l'UI Ohio ne persistent pas.
   Valeurs exactes relevées via get_design_context. Tout est scopé
   #colophon (+ classes) → spécificité suffisante pour l'emporter
   sur la typo dynamique d'Ohio, sans effet de bord ailleurs.
   ========================================================= */

/* Titres de colonnes (Conformité Légale / Solutions Métiers / Téléchargements Support)
   Poppins Medium 14 · UPPERCASE · tracking 1.25 · blanc 50% */
#colophon .widgets-column .widget-title {
	margin: 0 0 8px;
	font-family: "Poppins", sans-serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1.25px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

/* Liens des colonnes (menus Solutions / Téléchargements)
   Poppins Regular 16 · blanc · tracking -0.15 · padding vertical 4 */
#colophon .widgets-column a {
	display: block;
	padding: 4px 0;
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: -0.15px;
	color: #fff;
}

/* Barre copyright — texte + liens : Poppins Light 14 · blanc 80% */
#colophon .site-footer-copyright,
#colophon .site-footer-copyright a {
	font-family: "Poppins", sans-serif;
	font-weight: 300;
	font-size: 14px;
	line-height: 16px;
	color: rgba(255, 255, 255, 0.8);
}

/* Bouton « Remonter en haut » : pastille ronde + label (maquette) */
#colophon .scroll-top {
	display: flex;
	align-items: center;
	gap: 12px;                                  /* spacing/2 (pastille <-> label) */
}
#colophon .scroll-top .icon-button {
	width: 40px;
	height: 40px;
	border-radius: 18px;
	background: rgba(136, 136, 137, 0.08);      /* grey/neutral 8% */
}
#colophon .scroll-top .scroll-top-holder {
	font-family: "Poppins", sans-serif;
	font-weight: 500;                           /* Medium */
	font-size: 16px;
	line-height: 1.3;
	letter-spacing: -0.4px;
	color: rgba(255, 255, 255, 0.75);           /* white/lighter */
}