/* TTH - Tableaux interactifs & visioconference
   Palette du site : fond blanc, bandes #F6F9FC, titres #161616, texte #707070,
   filets #E5E5E5. Rouge #F50000 reserve aux filets, boutons et survols.
   Navy #131F35 pour les petits libelles (le rouge sur blanc ne passe pas AA). */

/* Le theme pose overflow:hidden sur .site, ce qui annule position:sticky pour
   tous ses descendants. overflow-x:clip conserve le rognage horizontal voulu
   par le theme sans creer de conteneur de defilement. Limite a cette page. */
body.tth-tbi-page .site {
	overflow-x: clip !important;
	overflow-y: visible !important;
}

/* Paragraphe vide laisse par les filtres de contenu du theme et de Mailmunch,
   juste apres la derniere section : il n'ajoute qu'une marge parasite. */
body.tth-tbi-page .wrapper > p:empty {
	display: none;
}

.tbi {
	--paper: #ffffff;
	--band: #f6f9fc;
	--ink: #161616;
	--navy: #131f35;
	--body: #707070;
	--red: #f50000;
	--line: #e5e5e5;

	position: relative;
	width: 100%;
	background: var(--paper);
	color: var(--ink);
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}

.tbi *,
.tbi *::before,
.tbi *::after {
	box-sizing: border-box;
}

.tbi p,
.tbi h1,
.tbi h2,
.tbi h3,
.tbi h4,
.tbi ul {
	margin: 0;
	padding: 0;
}

.tbi ul {
	list-style: none;
}

.tbi a {
	text-decoration: none;
}

/* Le theme force `color` et `border-*` sur tout <a> avec une specificite
   qu'un selecteur ID + !important ne bat pas. Toute couleur de texte de lien
   vit donc sur un <span> interne, et le souligne actif passe par box-shadow.
   Ne pas remettre la couleur sur le <a> : elle sera ignoree. */
.tbi-btn__l,
.tbi-nav__l,
.tbi-card__tl,
.tbi-card__ll {
	display: inline;
	transition: color .16s ease;
}

.tbi-wrap {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 clamp(20px, 5vw, 64px);
}

/* Cibles d'ancre : degager la hauteur de la barre collante a l'arrivee,
   qu'on vienne d'un lien #marque-… externe ou du scrollIntoView interne. */
.tbi-brand,
#marques,
#solutions,
#catalogues,
#devis {
	scroll-margin-top: calc(var(--tbi-navtop, 0px) + 84px);
}

/* Filet rouge, seul ornement de la page. */
.tbi-rule {
	display: block;
	width: 56px;
	height: 3px;
	background: var(--red);
	margin: 0 0 26px;
}

/* ---------------------------------------------------------------- Boutons */

.tbi-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 30px;
	border: 1px solid transparent;
	border-radius: 0;
	font: inherit;
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.tbi-btn--solid {
	background: var(--red);
	color: #fff;
}

.tbi-btn--solid .tbi-btn__l {
	color: #fff;
}

.tbi-btn--solid:hover,
.tbi-btn--solid:focus-visible {
	background: var(--navy);
	color: #fff;
}

.tbi-btn--ghost {
	background: transparent;
	color: var(--navy);
	border-color: var(--line);
}

.tbi-btn--ghost .tbi-btn__l {
	color: var(--navy);
}

.tbi-btn--ghost:hover,
.tbi-btn--ghost:focus-visible {
	border-color: var(--navy);
	background: var(--band);
}

/* ------------------------------------------------------------------ Hero */

.tbi-hero {
	background: var(--paper);
	padding: clamp(56px, 9vw, 104px) 0 clamp(48px, 7vw, 84px);
	border-bottom: 1px solid var(--line);
	overflow: hidden;
}

.tbi-hero__kicker {
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--body);
	margin-bottom: 24px !important;
}

.tbi-hero__title {
	font-size: clamp(2.2rem, 5.2vw, 4.2rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -.025em;
	color: var(--ink);
	margin-bottom: 28px !important;
}

.tbi-hero__title span {
	color: var(--navy);
}

.tbi-hero__text {
	max-width: 62ch;
	font-size: clamp(.98rem, 1.2vw, 1.08rem);
	line-height: 1.72;
	color: var(--body);
}

.tbi-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 38px;
}

/* -------------------------------------------------- Barre de marques */

.tbi-nav {
	position: sticky;
	top: var(--tbi-navtop, 0px);
	z-index: 40;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--line);
}

.tbi-nav__inner {
	display: flex;
	align-items: stretch;
	gap: clamp(6px, 2vw, 34px);
	overflow-x: auto;
	scrollbar-width: none;
}

.tbi-nav__inner::-webkit-scrollbar {
	display: none;
}

.tbi-nav__item {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	padding: 20px 4px;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	transition: box-shadow .18s ease;
	white-space: nowrap;
}

.tbi-nav__item .tbi-nav__l {
	color: var(--body);
}

.tbi-nav__item:hover .tbi-nav__l,
.tbi-nav__item.is-active .tbi-nav__l {
	color: var(--navy);
}

/* Souligne de l'onglet actif : box-shadow, car le theme force border-color. */
.tbi-nav__item.is-active {
	box-shadow: inset 0 -2px 0 var(--red);
}

.tbi-nav__devis {
	flex: 0 0 auto;
	margin-left: auto;
	align-self: center;
	padding: 11px 22px;
	background: var(--red);
	color: #fff;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background .18s ease;
}

.tbi-nav__devis .tbi-nav__l {
	color: #fff;
}

.tbi-nav__devis:hover {
	background: var(--navy);
}

/* ------------------------------------------------------- Bloc marque */

.tbi-brand {
	padding: clamp(56px, 8vw, 96px) 0 clamp(48px, 7vw, 84px);
	background: var(--paper);
	border-bottom: 1px solid var(--line);
}

.tbi-brand:nth-of-type(even) {
	background: var(--band);
}

.tbi-brand__head {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(28px, 5vw, 76px);
	align-items: start;
	padding-bottom: clamp(34px, 4.5vw, 56px);
}

/* Les logos fournis sont dessines pour un fond clair : aucun filtre. */
.tbi-brand__logo,
.tbi-brand__logo--invert {
	display: block;
	width: auto;
	max-width: 260px;
	max-height: 62px;
	height: auto;
	object-fit: contain;
	object-position: left center;
}

.tbi-brand__logo--invert {
	filter: brightness(0) invert(1);
}

/* Logo-symbole (ex. IQBoard) accompagne du nom : lockup horizontal. */
.tbi-brand__lockup {
	display: inline-flex;
	align-items: center;
	gap: 14px;
}

.tbi-brand__logo--mark {
	max-width: 74px;
	max-height: 56px;
}

.tbi-brand__logoname {
	font-size: clamp(1.5rem, 3vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -.01em;
	line-height: 1;
	color: var(--ink);
}

.tbi-brand__wordmark {
	display: block;
	font-size: clamp(1.7rem, 3.6vw, 2.6rem);
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1;
	color: var(--ink);
}

.tbi-brand__baseline {
	margin-top: 18px !important;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--navy);
	line-height: 1.7;
}

.tbi-brand__intro p {
	font-size: clamp(.96rem, 1.15vw, 1.05rem);
	line-height: 1.78;
	color: var(--body);
}

/* Les 3 points cles : une seule rangee, encadree de filets, chaque point
   precede d'un petit tiret rouge. display:flex retire aussi la puce que le
   theme force sur les <li>. */
.tbi-brand__facts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 30px !important;
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.tbi-brand__facts li {
	list-style: none;
	display: flex;
	align-items: flex-start;
	gap: 11px;
	padding: 20px 24px;
	font-size: .86rem;
	font-weight: 600;
	line-height: 1.45;
	color: var(--ink);
	border-right: 1px solid var(--line);
}

.tbi-brand__facts li::marker {
	content: "";
}

.tbi-brand__facts li::before {
	content: "";
	flex: 0 0 auto;
	width: 16px;
	height: 2px;
	margin-top: 8px;
	background: var(--red);
}

.tbi-brand__facts li:first-child {
	padding-left: 0;
}

.tbi-brand__facts li:last-child {
	border-right: 0;
	padding-right: 0;
}

.tbi-brand__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: clamp(34px, 4.5vw, 56px);
	padding-top: 30px;
	border-top: 1px solid var(--line);
}

.tbi-brand__foot p {
	font-size: clamp(1.05rem, 1.7vw, 1.4rem);
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--ink);
}

/* ---------------------------------------------------------- Sliders */

.tbi-rail-wrap + .tbi-rail-wrap {
	margin-top: clamp(36px, 4.5vw, 58px);
}

.tbi-rail__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--line);
	margin-bottom: 24px;
}

.tbi-rail__label {
	display: flex;
	align-items: baseline;
	gap: 12px;
	font-size: .86rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--navy);
}

.tbi-rail__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 20px;
	padding: 0 7px;
	background: var(--red);
	color: #fff;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .04em;
}

.tbi-rail__nav {
	display: flex;
	gap: 8px;
}

.tbi-arrow {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	padding: 0;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 0;
	color: var(--navy);
	cursor: pointer;
	transition: background .16s ease, border-color .16s ease, color .16s ease, opacity .16s ease;
}

.tbi-arrow svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: square;
}

.tbi-arrow:hover:not(:disabled) {
	background: var(--red);
	border-color: var(--red);
	color: #fff;
}

.tbi-arrow:disabled {
	opacity: .3;
	cursor: default;
}

.tbi-rail {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding-bottom: 4px;
}

.tbi-rail::-webkit-scrollbar {
	display: none;
}

.tbi-rail:focus-visible {
	outline: 2px solid var(--red);
	outline-offset: 4px;
}

/* ----------------------------------------------------- Carte produit */

.tbi-card {
	flex: 0 0 clamp(228px, 23vw, 292px);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--line);
	transition: border-color .18s ease, box-shadow .18s ease;
}

.tbi-card:hover {
	border-color: var(--red);
	box-shadow: 0 6px 22px rgba(19, 31, 53, .09);
}

/* Les photos produit sont detourees sur blanc : elles se fondent dans la carte. */
.tbi-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: #fff;
	overflow: hidden;
}

.tbi-card__img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 14px;
	transition: transform .35s ease;
}

.tbi-card:hover .tbi-card__img {
	transform: scale(1.045);
}

.tbi-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 16px 18px;
	border-top: 1px solid var(--line);
}

.tbi-card__kicker {
	font-size: .64rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--navy);
	margin-bottom: 9px !important;
}

.tbi-card__title {
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.42;
	letter-spacing: -.005em;
	color: var(--ink);
	margin-bottom: 16px !important;
}

.tbi-card__tl {
	color: var(--ink);
}

.tbi-card__title a:hover .tbi-card__tl {
	color: var(--red);
}

.tbi-card__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--line);
}

.tbi-card__link {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tbi-card__ll {
	color: var(--body);
}

.tbi-card__link:hover .tbi-card__ll {
	color: var(--navy);
}

.tbi-card__quote {
	padding: 8px 14px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 0;
	color: var(--navy);
	font: inherit;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.tbi-card__quote:hover {
	background: var(--red);
	border-color: var(--red);
	color: #fff;
}

/* ------------------------------------------------- Titres de section */

.tbi-sec__head {
	max-width: 62ch;
	padding-bottom: clamp(30px, 4vw, 48px);
}

.tbi-sec__head--center {
	max-width: 64ch;
	margin: 0 auto;
	text-align: center;
}

.tbi-sec__head--center .tbi-rule {
	margin-left: auto;
	margin-right: auto;
}

.tbi-sec__title {
	font-size: clamp(1.55rem, 2.6vw, 2rem);
	font-weight: 700;
	line-height: 1.32;
	letter-spacing: -.015em;
	color: var(--ink);
	margin-bottom: 16px !important;
}

.tbi-sec__text {
	font-size: clamp(.96rem, 1.15vw, 1.05rem);
	line-height: 1.72;
	color: var(--body);
}

/* ---------------------------------------------------------- Cas d'usage */

.tbi-cases {
	background: var(--band);
	padding: clamp(56px, 8vw, 96px) 0;
	border-bottom: 1px solid var(--line);
}

.tbi-case {
	flex: 0 0 clamp(258px, 27vw, 336px);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	padding: 26px;
	background: #fff;
	border: 1px solid var(--line);
	transition: border-color .18s ease, box-shadow .18s ease;
}

.tbi-case:hover {
	border-color: var(--red);
	box-shadow: 0 6px 22px rgba(19, 31, 53, .09);
}

/* Carte cliquable (accueil) : lien etale par-dessus, sans texte, pour ne pas
   subir la surcharge de couleur que le theme force sur tout <a>. */
.tbi-case--link {
	position: relative;
	cursor: pointer;
}

.tbi-case__cover {
	position: absolute;
	inset: 0;
	z-index: 2;
}

.tbi-case--link .tbi-case__title {
	transition: color .18s ease;
}

.tbi-case--link:hover .tbi-case__title {
	color: var(--red);
}

.tbi-case__media {
	margin-bottom: 20px;
}

.tbi-case__img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.tbi-case__icon {
	display: block;
	width: 68px;
	height: 68px;
	fill: none;
	stroke: var(--navy);
	stroke-width: 1.3;
	stroke-linecap: square;
	stroke-linejoin: miter;
}

.tbi-case__icon .a {
	stroke: var(--red);
	stroke-width: 2.4;
}

.tbi-case__title {
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--ink);
	margin-bottom: 12px !important;
}

.tbi-case__text {
	font-size: .92rem;
	line-height: 1.66;
	color: var(--body);
}

/* ---------------------------------------------------------- Catalogues */

.tbi-cata {
	padding: clamp(56px, 8vw, 96px) 0;
	background: var(--paper);
	border-bottom: 1px solid var(--line);
}

.tbi-cata__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1px;
	background: var(--line);
	border: 1px solid var(--line);
}

.tbi-cata__card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: clamp(26px, 3.2vw, 42px) clamp(22px, 2.6vw, 32px);
	background: #fff;
	transition: background .18s ease;
}

.tbi-cata__card:not(.is-empty):hover {
	background: var(--band);
}

.tbi-cata__brand {
	font-size: clamp(1.1rem, 1.7vw, 1.4rem);
	font-weight: 700;
	letter-spacing: -.012em;
	color: var(--ink);
}

.tbi-cata__label {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--navy);
}

.tbi-cata__card.is-empty .tbi-cata__label {
	color: var(--body);
}

.tbi-cata__card.is-empty {
	background: var(--band);
	opacity: .72;
}

.tbi-cata__arrow {
	width: 26px;
	height: 26px;
	margin-top: 10px;
	color: var(--red);
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: square;
	transition: transform .2s ease;
}

.tbi-cata__card:hover .tbi-cata__arrow {
	transform: translateX(7px);
}

/* --------------------------------------------------------------- Devis */

.tbi-devis {
	padding: clamp(56px, 8vw, 96px) 0 clamp(64px, 9vw, 108px);
	background: var(--band);
}

.tbi-devis.is-flash {
	animation: tbi-flash 1s ease;
}

@keyframes tbi-flash {
	0%, 100% { box-shadow: inset 0 0 0 0 rgba(245, 0, 0, 0); }
	22%      { box-shadow: inset 0 0 0 3px var(--red); }
	70%      { box-shadow: inset 0 0 0 3px var(--red); }
}

.tbi-devis__grid {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
	gap: clamp(30px, 4.5vw, 72px);
	align-items: start;
}

.tbi-devis__list {
	margin-top: 26px !important;
	border-top: 1px solid var(--line);
}

.tbi-devis__list li {
	padding: 14px 0;
	border-bottom: 1px solid var(--line);
	font-size: .9rem;
	font-weight: 600;
	color: var(--ink);
}

.tbi-devis__list li::before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 2px;
	margin-right: 14px;
	vertical-align: middle;
	background: var(--red);
}

.tbi-devis__warn {
	color: var(--red);
	font-weight: 700;
}

/* Contact Form 7 dans le bloc devis. */
.tbi-devis .wpcf7 {
	background: #fff;
	border: 1px solid var(--line);
	padding: clamp(22px, 3vw, 36px);
}

.tbi-devis .wpcf7-form p {
	margin: 0;
}

.tbi-f-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px 24px;
}

.tbi-f-full {
	grid-column: 1 / -1;
}

.tbi-devis .tbi-f label {
	display: block;
	margin-bottom: 8px;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--body);
}

.tbi-devis .tbi-f input[type="text"],
.tbi-devis .tbi-f input[type="email"],
.tbi-devis .tbi-f input[type="tel"],
.tbi-devis .tbi-f input[type="number"],
.tbi-devis .tbi-f select,
.tbi-devis .tbi-f textarea {
	width: 100%;
	padding: 12px 14px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 0;
	color: var(--ink);
	font: inherit;
	font-size: 1rem;
	transition: border-color .18s ease, box-shadow .18s ease;
	appearance: none;
	-webkit-appearance: none;
}

.tbi-devis .tbi-f select {
	background-image: linear-gradient(45deg, transparent 50%, #131f35 50%), linear-gradient(135deg, #131f35 50%, transparent 50%);
	background-position: calc(100% - 18px) 21px, calc(100% - 12px) 21px;
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 34px;
	cursor: pointer;
}

.tbi-devis .tbi-f textarea {
	min-height: 118px;
	resize: vertical;
}

.tbi-devis .tbi-f input:focus,
.tbi-devis .tbi-f select:focus,
.tbi-devis .tbi-f textarea:focus {
	outline: 0;
	border-color: var(--red);
	box-shadow: 0 0 0 3px rgba(245, 0, 0, .12);
}

.tbi-devis .tbi-f input::placeholder,
.tbi-devis .tbi-f textarea::placeholder {
	color: #a5a5a5;
}

/* Champ piege a robots. */
.tbi-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.tbi-f-submit {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-top: 6px !important;
}

.tbi-devis .wpcf7-submit {
	padding: 16px 36px;
	background: var(--red);
	border: 0;
	border-radius: 0;
	color: #fff;
	font: inherit;
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .18s ease;
}

.tbi-devis .wpcf7-submit:hover {
	background: var(--navy);
}

.tbi-devis .wpcf7-spinner {
	margin: 0;
}

.tbi-devis .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: .76rem;
	color: #c00000;
}

.tbi-devis .wpcf7-response-output {
	grid-column: 1 / -1;
	margin: 20px 0 0 !important;
	padding: 13px 17px !important;
	border: 1px solid var(--line) !important;
	font-size: .9rem;
	color: var(--ink);
}

.tbi-devis form.invalid .wpcf7-response-output,
.tbi-devis form.failed .wpcf7-response-output {
	border-color: #c00000 !important;
}

.tbi-devis form.sent .wpcf7-response-output {
	border-color: #1f8b3a !important;
}

/* ------------------------------- Teaser d'accueil : vignettes marque */

.tbi-home {
	background: var(--paper);
	padding: clamp(52px, 7vw, 88px) 0;
}

/* Teaser d'accueil "cas d'usage" : bande vraiment pleine largeur (full-bleed),
   quel que soit le conteneur Elementor (max-width 1320). Le debordement 100vw
   est rogne par le overflow:hidden que le theme met sur .site. */
.tbi-home-cases {
	width: 100vw;
	max-width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}

.tbi-home-cases .tbi-rail__count {
	display: none;
}

.tbi-sec__title span {
	color: var(--navy);
}

.tbi-tile {
	flex: 0 0 clamp(238px, 24vw, 306px);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
}

.tbi-tile__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	background: var(--band);
	overflow: hidden;
}

.tbi-tile__img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 10px;
	transition: transform .35s ease;
}

.tbi-tile:hover .tbi-tile__img {
	transform: scale(1.06);
}

.tbi-tile__badge {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 5px 11px;
	background: var(--navy);
	color: #fff;
	font-size: .66rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	line-height: 1.4;
}

.tbi-tile__body {
	display: block;
	padding: 18px 8px 0;
	text-align: center;
}

.tbi-tile__name {
	display: block;
	font-size: 1.02rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--navy);
	transition: color .18s ease;
}

.tbi-tile:hover .tbi-tile__name {
	color: var(--red);
}

.tbi-tile__sub {
	display: block;
	margin-top: 7px;
	font-size: .86rem;
	line-height: 1.5;
	color: var(--body);
}

.tbi-rail__nav--center {
	justify-content: center;
	margin-top: 28px;
}

.tbi-home__cta {
	margin-top: clamp(28px, 3.5vw, 40px);
	text-align: center;
}

/* -------------------------------------------------------- Responsive */

@media (max-width: 1024px) {
	.tbi-brand__head,
	.tbi-devis__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Sur mobile les 3 points restent en rangee, texte et espacement resserres. */
@media (max-width: 560px) {
	.tbi-brand__facts li {
		flex-direction: column;
		gap: 8px;
		padding: 14px 10px;
		font-size: .72rem;
		line-height: 1.4;
	}

	.tbi-brand__facts li::before {
		margin-top: 0;
	}
}

@media (max-width: 640px) {
	.tbi-f-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbi-rail__nav {
		display: none;
	}

	.tbi-brand__foot {
		flex-direction: column;
		align-items: flex-start;
	}

	.tbi-brand__foot .tbi-btn {
		width: 100%;
	}

	.tbi-hero__cta .tbi-btn {
		flex: 1 1 100%;
	}

	.tbi-nav__devis {
		margin-left: 12px;
	}

	/* Plus d'air vertical sur mobile. */
	.tbi-hero {
		padding-top: 76px;
		padding-bottom: 68px;
	}

	.tbi-brand {
		padding-top: 68px;
		padding-bottom: 64px;
	}

	.tbi-brand__head {
		gap: 34px;
		padding-bottom: 44px;
	}

	.tbi-brand__baseline {
		margin-top: 22px !important;
	}

	.tbi-cases,
	.tbi-cata,
	.tbi-devis {
		padding-top: 68px;
		padding-bottom: 68px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tbi *,
	.tbi *::before,
	.tbi *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
	}

	.tbi-rail {
		scroll-behavior: auto;
	}
}