/* ==========================================================================
exw-carousel.css
- Minimal Slick core + ExoWeb "support strip" styling
- Works without slick.css
========================================================================== */

/* --- Slick core (minimum required) --- */
.slick-slider {
	position: relative;
	display: block;
	box-sizing: border-box;
	user-select: none;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
}

.slick-list {
	position: relative;
	display: block;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

.slick-list:focus {
	outline: none;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
	transform: translate3d(0, 0, 0);
}

.slick-track {
	position: relative;
	top: 0;
	left: 0;
	display: block;
}

.slick-track:before,
.slick-track:after {
	display: table;
	content: "";
}
.slick-track:after {
	clear: both;
}

.slick-slide {
	display: none;
	float: left;
	height: 100%;
	min-height: 1px;
}

.slick-initialized .slick-slide {
	display: block;
}

.slick-slide img {
	display: block;
}
.slick-slide.slick-loading img {
	display: none;
}

.slick-loading .slick-track {
	visibility: hidden;
}

.slick-vertical .slick-slide {
	display: block;
	height: auto;
	border: 1px solid transparent;
}

/* Hide arrows/dots (marquee strip) */
.exw-clients .slick-arrow,
.exw-clients .slick-dots {
	display: none !important;
}

/* --- ExoWeb strip wrapper --- */
.exw-support-strip {
	/* Ajuste selon ton footer */
	padding: 18px 0;
}

.exw-support-strip{
	/* force une vraie hauteur visuelle */
	padding: 18px 0 !important;
	min-height: 120px !important;
	overflow: hidden;
}

/* important: ne pas laisser le thème écraser le track/list */
.exw-support-strip .slick-list{
	overflow: hidden !important;
	padding: 0 75px !important;   /* comme ton new.exoweb.ca */
}

#clients.exw-clients .slick-track{
	display: flex !important;
	align-items: center !important;
}

/* Si ton thème donne une width minuscule aux slides */
#clients.exw-clients .slick-slide{
	width: 260px !important;      /* ajuste: 220–320 */
	padding: 0 !important;
}

/* taille des logos */
#clients.exw-clients .exw-client{
	height: 120px !important;
	width: 240px !important;
	margin: 0 25px !important;

	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;

	opacity: .85;
	filter: grayscale(100%) brightness(1.15) contrast(1.05);
	transition: transform .25s ease, filter .25s ease, opacity .25s ease;
}

#clients.exw-clients .exw-client:hover{
	opacity: 1;
	filter: grayscale(0%) brightness(1.1) contrast(1.1);
	transform: translateY(-2px);
}

.exw-clients {
	width: 100%;
}

/* Track en flex pour centrer verticalement les logos */
.exw-clients .slick-track {
	display: flex !important;
	align-items: center;
}

/* Laisse Slick calculer les widths mais garde un layout stable */
.exw-clients .slick-slide {
	height: auto;
}

/* --- Logo tiles --- */
.exw-client {
	/* Taille de base */
	width: 170px;         /* Slick utilise cette largeur en variableWidth */
	height: 60px;

	/* Spacing */
	margin: 0 22px;

	/* Logo via background-image par classe */
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;

	/* Visuel */
	opacity: 0.90;
	transition: opacity .18s ease, transform .18s ease;

	/* Empêche la sélection accidentelle */
	user-select: none;
}

.exw-client:hover {
	opacity: 1;
	transform: translateY(-1px);
}

/* Améliore la netteté dans certains cas */
.exw-clients,
.exw-clients * {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* --- Responsive tweaks --- */
@media (max-width: 1199px) {
	.exw-client {
		width: 160px;
		height: 56px;
		margin: 0 18px;
	}
}

@media (max-width: 991px) {
	.exw-support-strip {
		padding: 14px 0;
	}
	.exw-client {
		width: 145px;
		height: 52px;
		margin: 0 16px;
	}
}

@media (max-width: 767px) {
	.exw-client {
		width: 132px;
		height: 48px;
		margin: 0 14px;
	}
}

@media (max-width: 480px) {
	.exw-client {
		width: 118px;
		height: 44px;
		margin: 0 12px;
	}
}

/* --- Example logo mapping (à adapter à tes paths) --- */
.exw-client.cloudlinux  {
	background-image: url("../images/carousel/cloudlinux-small.png");
}
.exw-client.litespeed   {
	background-image: url("../images/carousel/litespeed-small.png");
}
.exw-client.directadmin {
	background-image: url("../images/carousel/directadmin-small.png");
}
.exw-client.imunify360  {
	background-image: url("../images/carousel/imunify360.webp");
}
.exw-client.php         {
	background-image: url("../images/carousel/logo_php8.svg");
}
.exw-client.redis       {
	background-image: url("../images/carousel/logo_redis.svg");
}
.exw-client.wordpress   {
	background-image: url("../images/carousel/logo_wordpress.svg");
}
.exw-client.joomla      {
	background-image: url("../images/carousel/logo_joomla.svg");
}
.exw-client.drupal      {
	background-image: url("../images/carousel/logo_drupal.svg");
}
.exw-client.magento     {
	background-image: url("../images/carousel/logo_magento_greytext.svg");
}
.exw-client.mysql       {
	background-image: url("../images/carousel/mysql-mariadb-small.png");
}
.exw-client.phpmyadmin  {
	background-image: url("../images/carousel/phpmyadmin-small.png");
}
.exw-client.jquery      {
	background-image: url("../images/carousel/logo_jquery_greytext.svg");
}
.exw-client.installatron{
	background-image: url("../images/carousel/installatron-small.png");
}
.exw-client.sucuri      {
	background-image: url("../images/carousel/sucuri-small.png");
}
.exw-client.letsencrypt {
	background-image: url("../images/carousel/logo_letsencrypt.svg");
}
.exw-client.jetbackup   {
	background-image: url("../images/carousel/logo_jetbackup_grey_light.svg");
}
.exw-client.spamexperts {
	background-image: url("../images/carousel/logo_spamexperts.png");
}
.exw-client.nodejs      {
	background-image: url("../images/carousel/logo_nodejs.svg");
}
.exw-client.python      {
	background-image: url("../images/carousel/logo_python.svg");
}
.exw-client.git         {
	background-image: url("../images/carousel/logo_git.svg");
}