/* ==========================================================================
   KALAX — design verrouillé, aligné sur le site original (React + Tailwind v4).
   Palette réelle : accent sky-500 #0EA5E9, titres slate-900, texte slate-600,
   fonds alternés blanc / sky-50 / slate-50, footer slate-900, logo dégradé bleu.
   Valeurs extraites au Playwright depuis l'app Arena d'origine (cf. marqette/original).
   ========================================================================== */

:root {
	/* Couleurs (tokens theme.json, avec repli hex Tailwind) */
	--kx-accent:       var(--wp--preset--color--accent, #0EA5E9);       /* sky-500 */
	--kx-accent-dark:  var(--wp--preset--color--accent-dark, #0284C7);  /* sky-600 */
	--kx-accent-deep:  var(--wp--preset--color--accent-deep, #0C4A6E);  /* sky-900 */
	--kx-logo-blue:    var(--wp--preset--color--logo-blue, #1E40AF);    /* blue-800 */
	--kx-ink:          var(--wp--preset--color--ink, #0F172A);          /* slate-900 */
	--kx-slate:        var(--wp--preset--color--slate, #334155);        /* slate-700 */
	--kx-muted:        var(--wp--preset--color--muted, #475569);        /* slate-600 */
	--kx-muted-soft:   var(--wp--preset--color--muted-soft, #94A3B8);   /* slate-400 */
	--kx-sky-soft:     var(--wp--preset--color--sky-soft, #F0F9FF);     /* sky-50 */
	--kx-slate-soft:   var(--wp--preset--color--slate-soft, #F8FAFC);   /* slate-50 */
	--kx-line:         var(--wp--preset--color--line, #E2E8F0);         /* slate-200 */
	--kx-line-soft:    #F1F5F9;                                          /* slate-100 */
	--kx-sky-100:      #E0F2FE;
	--kx-sky-200:      #BAE6FD;

	--kx-radius:    0.75rem;   /* rounded-xl */
	--kx-radius-lg: 1rem;
	--kx-nav-h:     80px;

	--kx-shadow-sm: 0 1px 3px 0 rgba(15, 23, 42, .1), 0 1px 2px -1px rgba(15, 23, 42, .1);
	--kx-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, .1), 0 4px 6px -4px rgba(15, 23, 42, .1);
	--kx-shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, .12), 0 8px 10px -6px rgba(15, 23, 42, .1);
	--kx-shadow-sky: 0 10px 15px -3px rgba(14, 165, 233, .3), 0 4px 6px -4px rgba(14, 165, 233, .3);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: var(--kx-nav-h); }

body {
	margin: 0;
	/* Police globale identique à l'original (stack système Tailwind par défaut) */
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	color: var(--kx-muted);
	background: #fff;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 { color: var(--kx-ink); line-height: 1.15; margin: 0; }

.kx-container { width: min(1280px, 92vw); margin-inline: auto; }

/* Le contenu démarre sous la nav fixe ; sur l'accueil le hero passe DERRIÈRE la nav. */
.kx-main { padding-top: var(--kx-nav-h); }
body.home .kx-main { padding-top: 0; }

/* ---------- Eyebrow + en-têtes de section ---------- */
.kx-eyebrow {
	display: block;
	color: var(--kx-accent-dark);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 0.75rem;
}
.kx-section__head { max-width: 48rem; margin: 0 auto 3.5rem; text-align: center; }
.kx-section__head--left { margin-inline: 0; text-align: left; }
.kx-section__title { font-size: clamp(1.875rem, 3.5vw, 2.25rem); font-weight: 700; margin: 0 0 1rem; }
.kx-section__intro { color: var(--kx-muted); font-size: 1.125rem; margin: 0; }

/* ---------- Header / Nav (fixe, translucide, flou) ---------- */
.kx-header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: 50;
	background: rgba(255, 255, 255, 0.9);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	box-shadow: var(--kx-shadow-sm);
	border-bottom: 1px solid var(--kx-sky-100);
}
.kx-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: var(--kx-nav-h);
}
.kx-logo {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	line-height: 1;
	text-decoration: none;
}
.kx-logo__mark { display: block; }
.kx-logo__mark svg { display: block; }
.kx-logo__word {
	font-family: system-ui, -apple-system, sans-serif;
	font-weight: 900;                /* font-black */
	font-size: 2.2rem;
	line-height: 1;                  /* leading-none */
	letter-spacing: 0.15em;          /* tracking-[0.15em] */
	padding-left: 0.15em;            /* compense le letter-spacing pour centrer */
	color: #193CB8;                  /* blue-800 */
	-webkit-text-stroke: 1px rgba(59, 130, 246, 0.2);
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.05));   /* drop-shadow-sm */
}
.kx-header .kx-logo__mark svg { width: 56px; height: auto; }

.kx-logo--light .kx-logo__word { color: #fff; -webkit-text-stroke: 0; }

.kx-nav__list {
	display: flex;
	gap: 2rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.kx-nav__list a {
	color: var(--kx-muted);
	text-decoration: none;
	font-size: 1rem;
	font-weight: 500;
	transition: color 0.15s ease;
}
.kx-nav__list a:hover { color: var(--kx-accent-dark); }

/* Hamburger (mobile) */
.kx-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px; height: 44px;
	padding: 0; border: 0;
	background: transparent;
	cursor: pointer;
}
.kx-burger span {
	display: block;
	width: 26px; height: 2px;
	margin: 0 auto;
	background: var(--kx-ink);
	border-radius: 2px;
	transition: transform 0.25s ease, opacity 0.2s ease;
}
.is-nav-open .kx-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.is-nav-open .kx-burger span:nth-child(2) { opacity: 0; }
.is-nav-open .kx-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Boutons ---------- */
.kx-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 1rem 2rem;
	border-radius: 9999px;
	font-weight: 700;
	font-size: 1.125rem;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.kx-btn:hover { transform: translateY(-1px); }
.kx-btn--primary { background: var(--kx-accent); color: #fff; box-shadow: var(--kx-shadow-sky); }
.kx-btn--primary:hover { background: var(--kx-accent-dark); }
.kx-btn--ghost { background: rgba(255, 255, 255, 0.1); color: #fff; border-color: rgba(255, 255, 255, 0.3); }
.kx-btn--ghost:hover { background: rgba(255, 255, 255, 0.2); }
.kx-btn--light { background: #fff; color: var(--kx-accent-dark); }
.kx-btn--light:hover { background: var(--kx-sky-soft); }
.kx-btn--outline {
	background: transparent;
	color: var(--kx-accent-dark);
	border-color: var(--kx-sky-200);
	padding: 0.7rem 1.4rem;
	font-size: 1rem;
}
.kx-btn--outline:hover { background: var(--kx-sky-soft); border-color: var(--kx-accent); transform: none; }
.kx-btn--sm { padding: 0.7rem 1.4rem; font-size: 1rem; }

/* ---------- CTA (bande accent, bloc réutilisable) ---------- */
.kx-cta { background: linear-gradient(135deg, var(--kx-accent), var(--kx-accent-dark)); color: #fff; padding: 5rem 0; }
.kx-cta__inner { text-align: center; }
.kx-cta__title { color: #fff; font-size: clamp(1.875rem, 3.5vw, 2.25rem); margin: 0 0 0.8rem; }
.kx-cta__text { color: rgba(255, 255, 255, 0.9); max-width: 46ch; margin: 0 auto 2rem; }

/* ---------- Sections génériques ---------- */
.kx-section { padding: 6rem 0; background: #fff; }
.kx-section--sky { background: var(--kx-sky-soft); }
.kx-section--slate { background: var(--kx-slate-soft); }

/* ---------- HERO ---------- */
.kx-hero {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	padding: var(--kx-nav-h) 0 3rem;
	overflow: hidden;
	background: var(--kx-accent-deep);
}
.kx-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kx-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(12, 74, 110, 0.8) 0%, rgba(12, 74, 110, 0.4) 100%);
}
.kx-hero__inner { position: relative; width: min(1280px, 92vw); margin-inline: auto; color: #fff; }
.kx-hero__badge {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: 9999px;
	background: rgba(56, 189, 248, 0.2);
	border: 1px solid rgba(56, 189, 248, 0.3);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: var(--kx-sky-200);
	font-size: 0.875rem;
	font-weight: 500;
	margin-bottom: 1.5rem;
}
.kx-hero__title {
	color: #fff;
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 1.5rem;
	max-width: 20ch;
}
.kx-hero__subtitle {
	font-size: 1.25rem;
	line-height: 1.6;
	color: var(--kx-sky-100);
	margin: 0 0 2rem;
	max-width: 44ch;
}
.kx-hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 3.5rem; }

/* Stats hero */
.kx-hero__stats { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.kx-stat {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 1rem 1.25rem;
	border-radius: var(--kx-radius);
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.kx-stat__icon {
	display: grid; place-items: center;
	width: 44px; height: 44px;
	border-radius: 9999px;
	background: rgba(56, 189, 248, 0.2);
	color: var(--kx-sky-200);
	flex: none;
}
.kx-stat__num { font-size: 1.875rem; font-weight: 700; color: #fff; line-height: 1; }
.kx-stat__label { font-size: 0.875rem; color: var(--kx-sky-100); }

/* ---------- À PROPOS ---------- */
.kx-about__top { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; margin-bottom: 6rem; }   /* mb-24 */
.kx-about__media { position: relative; }
.kx-about__img {
	width: 100%;
	aspect-ratio: 7 / 6;          /* ~1.17, image presque carrée comme l'original */
	object-fit: cover;
	border-radius: var(--kx-radius-lg);
	box-shadow: var(--kx-shadow-xl);
	display: block;
}
.kx-about__badge {
	position: absolute;
	bottom: -1.5rem; right: -1.5rem;   /* bas-droite */
	background: var(--kx-accent);       /* carte bleue sky-500 */
	border-radius: 1rem;
	box-shadow: var(--kx-shadow-lg);
	padding: 1.25rem 1.5rem;
	text-align: center;
}
.kx-about__badge-num { font-size: 2.25rem; font-weight: 700; color: #fff; line-height: 1; }
.kx-about__badge-label { font-size: 0.875rem; color: rgba(255, 255, 255, 0.9); margin-top: 0.25rem; }
.kx-about__col h4 { display: flex; align-items: center; gap: 0.6rem; font-size: 1.25rem; margin: 0 0 0.75rem; }
.kx-about__col h4 .kx-ico { color: var(--kx-accent); }
.kx-about__col p { color: var(--kx-muted); margin: 0 0 1rem; }
.kx-about__vm { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1.5rem; }
.kx-about__vm .kx-about__card {
	background: var(--kx-sky-soft);
	border: 1px solid var(--kx-sky-100);
	border-radius: var(--kx-radius);
	padding: 1.5rem;
}

/* Valeurs */
.kx-values { text-align: center; padding: 4rem 0; border-top: 1px solid var(--kx-line-soft); }   /* py-16 border-t border-slate-100 */
.kx-values__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.kx-value {
	background: transparent;
	border: 1px solid var(--kx-line-soft);     /* border-slate-100 */
	border-radius: 1.5rem;                      /* rounded-3xl */
	padding: 2rem;                              /* p-8 */
	text-align: center;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;   /* transition-all */
}
.kx-value:hover { border-color: var(--kx-sky-200); box-shadow: var(--kx-shadow-lg); }   /* hover:border-sky-200 hover:shadow-lg */
.kx-value__icon {
	display: grid; place-items: center;
	width: 64px; height: 64px;                  /* w-16 h-16 */
	margin: 0 auto 1.5rem;                      /* mx-auto mb-6 */
	border-radius: 1rem;                        /* rounded-2xl */
	transition: transform 0.15s ease;
}
.kx-value:hover .kx-value__icon { transform: scale(1.1); }   /* group-hover:scale-110 */
.kx-value__icon--yellow { background: #FEFCE8; color: #EAB308; }   /* yellow-50 / yellow-500 */
.kx-value__icon--blue   { background: #EFF6FF; color: #3B82F6; }   /* blue-50 / blue-500 */
.kx-value__icon--green  { background: #F0FDF4; color: #22C55E; }   /* green-50 / green-500 */
.kx-value__icon--purple { background: #FAF5FF; color: #A855F7; }   /* purple-50 / purple-500 */
.kx-value__icon--sky    { background: var(--kx-sky-soft); color: var(--kx-accent); }   /* sky */
.kx-value__title { font-size: 1.25rem; margin: 0 0 0.75rem; }      /* text-xl mb-3 */
.kx-value__text { color: var(--kx-muted); font-size: 0.95rem; margin: 0; }

/* ---------- ACTIVITÉS (2 colonnes : Commerce | Services) ---------- */
.kx-activities__split { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: stretch; }

.kx-commerce {
	display: flex;
	flex-direction: column;                          /* permet d'occuper toute la hauteur étirée */
	background: #fff;
	border: 1px solid var(--kx-sky-100);            /* border-sky-100 */
	border-radius: 1.5rem;                           /* rounded-3xl */
	padding: 3rem;                                   /* p-12 */
	box-shadow: 0 20px 25px -5px rgba(186, 230, 253, .5), 0 8px 10px -6px rgba(186, 230, 253, .5);   /* shadow-xl sky-200/50 */
}
.kx-commerce__icon {
	display: grid; place-items: center;
	width: 56px; height: 56px;                       /* w-14 */
	margin-bottom: 2rem;                             /* mb-8 */
	border-radius: 1rem;                             /* rounded-2xl */
	background: var(--kx-accent);                    /* bg-sky-500 */
	color: #fff;
}
.kx-commerce__title { font-size: 1.875rem; font-weight: 700; margin: 0 0 1.5rem; }   /* text-3xl mb-6 */
.kx-commerce__text { color: var(--kx-muted); }
.kx-commerce__text p { margin: 0 0 1.5rem; line-height: 1.75; font-size: 1.125rem; }   /* mb-6 leading-relaxed, agrandi */
.kx-commerce__quote {
	margin: 0 0 2rem;                                /* mb-8 */
	padding: 1.5rem;                                 /* p-6 */
	background: var(--kx-sky-soft);                  /* bg-sky-50 */
	border-left: 4px solid var(--kx-accent);         /* border-l-4 border-sky-500 */
	border-radius: 1rem;                             /* rounded-2xl */
	color: #075985;                                  /* text-sky-800 */
	font-style: italic;                              /* italic */
	font-weight: 500;                                /* font-medium */
	font-size: 1.0625rem;
	line-height: 1.7;
}
.kx-commerce__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem 1.5rem;
	margin: auto 0 0;                                /* ancre la liste en bas de la carte étirée */
	padding: 0;
	list-style: none;
}
.kx-commerce__list li {
	position: relative;
	padding-left: 1.25rem;                           /* gap-3 + puce */
	color: var(--kx-slate);                          /* text-slate-700 */
	font-weight: 500;                                /* font-medium */
	font-size: 1.0625rem;
}
.kx-commerce__list li::before {
	content: "";
	position: absolute;
	left: 0; top: 0.5em;
	width: 8px; height: 8px;
	border-radius: 9999px;
	background: #38BDF8;                              /* sky-400 */
}

.kx-services__title { font-size: 1.875rem; font-weight: 700; margin: 0 0 1rem; }   /* text-3xl mb-4 */
.kx-services__intro { color: var(--kx-muted); margin: 0 0 1.5rem; }
.kx-services__grid { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 1.5rem; }   /* gap-6, cartes de hauteur égale */
.kx-service {
	background: #fff;
	border: 1px solid var(--kx-line-soft);           /* border-slate-100 */
	border-radius: 1rem;                             /* rounded-2xl */
	padding: 1.5rem;                                 /* p-6 */
	box-shadow: var(--kx-shadow-sm);
	transition: box-shadow 0.15s ease;               /* transition-shadow (pas de translation) */
}
.kx-service:hover { box-shadow: 0 4px 6px -1px rgba(15, 23, 42, .1), 0 2px 4px -2px rgba(15, 23, 42, .1); }   /* hover:shadow-md */
.kx-service__icon {
	display: grid; place-items: center;
	width: 48px; height: 48px;                       /* w-12 */
	margin-bottom: 1rem;                             /* mb-4 */
	border-radius: 0.75rem;                          /* rounded-xl */
	background: var(--kx-sky-100);                   /* bg-sky-100 */
	color: var(--kx-accent-dark);                    /* text-sky-600 */
	transition: background 0.15s ease, color 0.15s ease;   /* transition-colors */
}
.kx-service:hover .kx-service__icon { background: var(--kx-accent); color: #fff; }   /* group-hover:bg-sky-500 text-white */
.kx-service__title { font-size: 1.125rem; margin: 0 0 0.5rem; }   /* text-lg mb-2 */
.kx-service__text { color: var(--kx-muted); font-size: 0.9rem; margin: 0; }

/* ---------- PRODUITS ---------- */
.kx-products__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.kx-product-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--kx-line-soft);          /* border-slate-100 */
	border-radius: 1.5rem;                           /* rounded-3xl */
	overflow: hidden;
	box-shadow: var(--kx-shadow-sm);
	transition: box-shadow 0.3s ease;                /* transition-all duration-300, sans translation */
}
.kx-product-card:hover { box-shadow: var(--kx-shadow-xl); }   /* hover:shadow-xl */
.kx-product-card__media { position: relative; height: 16rem; overflow: hidden; }   /* h-64 */
.kx-product-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease; }
.kx-product-card:hover .kx-product-card__media img { transform: scale(1.1); }   /* group-hover:scale-110 */
.kx-product-card__tags { position: absolute; top: 1rem; left: 1rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }   /* top-4 left-4 gap-2 */
.kx-tag {
	padding: 0.25rem 0.75rem;                        /* px-3 py-1 */
	border-radius: 9999px;                           /* rounded-full */
	background: rgba(255, 255, 255, 0.9);            /* bg-white/90 */
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	color: #0369A1;                                  /* text-sky-700 */
	font-size: 0.75rem;                              /* text-xs */
	font-weight: 700;                                /* font-bold */
	box-shadow: var(--kx-shadow-sm);                 /* shadow-sm */
}
.kx-product-card__body { padding: 2rem; display: flex; flex-direction: column; flex: 1; }   /* p-8 */
.kx-product-card__head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }   /* gap-2 mb-2 */
.kx-product-card__head .kx-ico { color: var(--kx-accent); }                 /* leaf sky-500 */
.kx-product-card__title { font-size: 1.5rem; margin: 0; }                   /* text-2xl */
.kx-product-card__sub { color: var(--kx-accent-dark); font-weight: 600; font-size: 0.875rem; margin: 0 0 1rem; }   /* text-sky-600 font-semibold text-sm mb-4 */
.kx-product-card__desc { color: var(--kx-muted); font-size: 0.875rem; line-height: 1.7; margin: 0 0 1.5rem; flex: 1; }   /* text-sm leading-relaxed mb-6 */
.kx-product-card--link { text-decoration: none; color: inherit; }
.kx-product-card__cta {
	display: block;
	width: 100%;
	padding: 0.75rem;                                /* py-3 */
	border: 1px solid var(--kx-sky-200);             /* border-sky-200 */
	border-radius: 0.75rem;                          /* rounded-xl */
	background: transparent;
	color: var(--kx-accent-dark);                    /* text-sky-600 */
	font-weight: 700;                                /* font-bold */
	text-align: center;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;   /* transition-colors */
}
.kx-product-card__cta:hover { background: var(--kx-accent); color: #fff; border-color: var(--kx-accent); }   /* hover:bg-sky-500 text-white */

/* ---------- PARTENAIRES ---------- */
.kx-partners__grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 1.5rem;
	align-items: stretch;
}
.kx-partner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 1.5rem 1rem;
	background: #fff;
	border: 1px solid var(--kx-line);
	border-radius: var(--kx-radius);
	min-height: 120px;
	text-decoration: none;
	transition: box-shadow 0.18s ease, transform 0.18s ease;
}
.kx-partner:hover { box-shadow: var(--kx-shadow-lg); transform: translateY(-3px); }
.kx-partner__logo { max-width: 100%; max-height: 48px; height: auto; object-fit: contain; }
.kx-partner__initial {
	display: grid; place-items: center;
	width: 48px; height: 48px;
	border-radius: 9999px;
	background: var(--kx-sky-soft);
	color: var(--kx-accent-dark);
	font-weight: 800;
	font-size: 1.25rem;
}
.kx-partner__name { font-size: 0.875rem; font-weight: 600; color: var(--kx-slate); text-align: center; }

/* ---------- CONTACT ---------- */
.kx-contact__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 3rem; align-items: start; }
.kx-contact__info {
	background: linear-gradient(135deg, var(--kx-accent), var(--kx-accent-dark));
	color: #fff;
	border-radius: 1.5rem;
	padding: 2.5rem;
}
.kx-contact__info h4 { color: #fff; font-size: 1.5rem; margin: 0 0 1.75rem; }
.kx-contact__row { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.kx-contact__ico {
	display: grid; place-items: center;
	width: 44px; height: 44px;
	flex: none;
	border-radius: var(--kx-radius);
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
}
.kx-contact__row p { margin: 0; }
.kx-contact__row p:first-child { font-weight: 700; color: #fff; }
.kx-contact__row p + p { color: rgba(255, 255, 255, 0.85); font-size: 0.95rem; }
.kx-contact__info a { color: #fff; }

.kx-form {
	background: #fff;
	border: 1px solid var(--kx-line);
	border-radius: var(--kx-radius-lg);
	padding: 2rem;
	box-shadow: var(--kx-shadow-lg);
}
.kx-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.kx-field { margin-bottom: 1.25rem; }
.kx-field label { display: block; font-size: 0.875rem; font-weight: 600; color: var(--kx-slate); margin-bottom: 0.4rem; }
.kx-field input,
.kx-field textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid var(--kx-line);
	border-radius: var(--kx-radius);
	font: inherit;
	color: var(--kx-ink);
	background: var(--kx-slate-soft);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.kx-field input:focus,
.kx-field textarea:focus {
	outline: none;
	border-color: var(--kx-accent);
	box-shadow: 0 0 0 3px rgba(186, 230, 253, 0.7);   /* ring sky-200 */
	background: #fff;
}
.kx-field textarea { min-height: 130px; resize: vertical; }
.kx-form .kx-btn--primary { width: 100%; justify-content: center; }

/* ---------- Pages internes / fiche produit (conservées) ---------- */
.kx-page-head { padding: 3rem 0 1rem; }
.kx-page-title { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.kx-entry { padding-bottom: 3rem; }
.kx-product { padding: 3rem 0; }
.kx-product__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.kx-product__img { width: 100%; border-radius: var(--kx-radius-lg); box-shadow: var(--kx-shadow-lg); display: block; }
.kx-product__title { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0 0 1.2rem; }
.kx-product__badge {
	display: inline-block;
	background: var(--kx-sky-soft);
	color: var(--kx-accent-dark);
	font-size: 0.8rem;
	font-weight: 600;
	padding: 0.3rem 0.85rem;
	border-radius: 9999px;
	margin-bottom: 1rem;
}
.kx-product__meta { list-style: none; padding: 0; margin: 0 0 1.5rem; color: var(--kx-muted); }
.kx-product__meta li { padding: 0.4rem 0; border-bottom: 1px solid var(--kx-line-soft); }
.kx-product__desc { margin-bottom: 2rem; color: var(--kx-slate); }
.kx-product__related { margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--kx-line); }
.kx-product__related .kx-section__title { text-align: left; }
.kx-empty { text-align: center; color: var(--kx-muted); }

/* ---------- Footer (slate-900) ---------- */
.kx-footer { background: var(--kx-ink); color: #fff; }   /* bg-slate-900 text-white */
.kx-footer__brand { text-align: center; padding: 5rem 0 1.5rem; }   /* pt-20 */
.kx-footer__brand .kx-logo { margin: 0 auto; }
.kx-footer__brand .kx-logo__mark svg { width: 64px; }
.kx-footer__tagline {
	color: #38BDF8;
	font-weight: 700;
	font-style: italic;
	font-size: 1.3rem;
	margin: 1rem 0 1.25rem;
}
.kx-footer__rule { width: 80px; height: 3px; background: var(--kx-accent); border: 0; margin: 0 auto; border-radius: 3px; }
.kx-footer__top {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem;
	padding: 3rem 0;
}
.kx-footer__about { color: #94A3B8; margin: 0 0 1.25rem; max-width: 32ch; font-size: 1rem; line-height: 1.7; }
.kx-footer__socials { display: flex; gap: 0.75rem; }
.kx-footer__socials a {
	display: grid; place-items: center;
	width: 40px; height: 40px;
	border-radius: 9999px;
	background: #1E293B;
	color: #fff;
	transition: background 0.15s ease;
}
.kx-footer__socials a:hover { background: var(--kx-accent); }
.kx-footer__title { color: #fff; font-size: 1.125rem; font-weight: 700; margin: 0 0 1.25rem; }
.kx-footer__list { list-style: none; margin: 0; padding: 0; font-size: 1rem; }
.kx-footer__list li { margin: 0 0 0.75rem; display: flex; align-items: center; gap: 0.6rem; color: #94A3B8; }
.kx-footer a { color: #94A3B8; text-decoration: none; transition: color 0.15s ease; }
.kx-footer a:hover { color: #fff; }
.kx-footer__contact .kx-ico { color: var(--kx-accent); flex: none; }
.kx-footer__dot { width: 18px; height: 18px; flex: none; display: inline-grid; place-items: center; }
.kx-footer__dot::before { content: ""; width: 11px; height: 11px; border-radius: 9999px; background: var(--kx-accent); }
.kx-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding: 2rem 0 2.5rem;   /* pb-10 sous le copyright */
	font-size: 0.875rem;
	color: #64748B;
	text-align: center;
}

/* ---------- Modal « Demander un devis » + toast ---------- */
.kx-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; }
.kx-modal[hidden] { display: none; }
.kx-modal__overlay { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.6); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.kx-modal__dialog {
	position: relative;
	width: min(560px, 100%);
	max-height: 90vh;
	overflow-y: auto;
	background: #fff;
	border-radius: var(--kx-radius-lg);
	box-shadow: var(--kx-shadow-xl);
	padding: 2rem;
	animation: kx-modal-in 0.2s ease;
}
@keyframes kx-modal-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.kx-modal__close {
	position: absolute; top: 0.75rem; right: 1rem;
	width: 36px; height: 36px;
	border: 0; background: transparent;
	font-size: 1.75rem; line-height: 1;
	color: var(--kx-muted-soft); cursor: pointer; border-radius: 9999px;
}
.kx-modal__close:hover { background: var(--kx-slate-soft); color: var(--kx-ink); }
.kx-modal__title { font-size: 1.5rem; margin: 0 0 0.25rem; }
.kx-modal__sub { color: var(--kx-muted); margin: 0 0 1.5rem; font-size: 0.95rem; }
.kx-form--modal .kx-btn--primary { width: 100%; justify-content: center; }
.kx-form--modal input[readonly] { background: var(--kx-sky-soft); color: var(--kx-accent-dark); font-weight: 600; cursor: default; }
.kx-qty { display: flex; gap: 0.5rem; }
.kx-qty input { flex: 1 1 auto; min-width: 0; }
.kx-qty select {
	flex: 0 0 auto;
	padding: 0.75rem 0.85rem;
	border: 1px solid var(--kx-line);
	border-radius: var(--kx-radius);
	background: var(--kx-slate-soft);
	font: inherit;
	color: var(--kx-ink);
	cursor: pointer;
}

.kx-toast {
	position: fixed; left: 50%; bottom: 1.5rem; transform: translate(-50%, 1rem);
	background: var(--kx-ink); color: #fff;
	padding: 0.85rem 1.4rem; border-radius: 9999px;
	box-shadow: var(--kx-shadow-xl); font-size: 0.95rem; font-weight: 500;
	z-index: 110; opacity: 0; transition: opacity 0.25s ease, transform 0.25s ease;
}
.kx-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.kx-toast--error { background: #B91C1C; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px) {
	.kx-about__top { grid-template-columns: 1fr; gap: 2.5rem; }
	.kx-about__badge { right: 1rem; bottom: 1rem; }
	.kx-about__vm { grid-template-columns: 1fr; }
	.kx-activities__split { grid-template-columns: 1fr; gap: 2rem; }
	.kx-values__grid { grid-template-columns: repeat(2, 1fr); }
	.kx-services__grid { grid-template-columns: repeat(2, 1fr); }
	.kx-products__grid { grid-template-columns: repeat(2, 1fr); }
	.kx-partners__grid { grid-template-columns: repeat(3, 1fr); }
	.kx-contact__grid { grid-template-columns: 1fr; gap: 2rem; }
	.kx-footer__top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

@media (max-width: 860px) {
	.kx-burger { display: flex; }
	.kx-nav {
		position: absolute;
		top: 100%; left: 0; right: 0;
		background: rgba(255, 255, 255, 0.97);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		border-top: 1px solid var(--kx-sky-100);
		box-shadow: var(--kx-shadow-lg);
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.28s ease;
	}
	.kx-header.is-nav-open .kx-nav { max-height: 70vh; overflow-y: auto; }
	.kx-nav__list { flex-direction: column; gap: 0; padding: 0.5rem 0; }
	.kx-nav__list li { width: 100%; }
	.kx-nav__list a { display: block; padding: 0.95rem 6vw; font-size: 1.05rem; border-bottom: 1px solid var(--kx-line-soft); }
}

@media (max-width: 640px) {
	.kx-section { padding: 4rem 0; }
	.kx-values__grid,
	.kx-services__grid,
	.kx-products__grid { grid-template-columns: 1fr; }
	.kx-commerce__list { grid-template-columns: 1fr; }
	.kx-partners__grid { grid-template-columns: repeat(2, 1fr); }
	.kx-footer__top { grid-template-columns: 1fr; }
	.kx-form__row { grid-template-columns: 1fr; }
	.kx-hero__actions .kx-btn { flex: 1 1 100%; justify-content: center; }
	.kx-product__grid { grid-template-columns: 1fr; gap: 2rem; }
}