/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */




 @font-face {
	font-family: 'Futura';
	src: url('/wp-content/uploads/2026/09/FuturaPT-Bold.woff2') format('woff2'),
		url('/wp-content/uploads/2026/09/FuturaPT-Bold.woff') format('woff');
	font-weight: 700; 
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   Couleurs — palette globale Brizy (style « Overpass »)
   Valeurs figées : si la palette change dans Brizy, les mettre à jour ici.
   ========================================================================== */

:root {
	--koch-violet: #A170D9;
	--koch-noir: #04030E;
	--koch-bleu: #004A90;
	--koch-vert-eau: #B8E6E1;
	--koch-rose: #F5D4D1;
	--koch-gris-clair: #EBEBEB;
	--koch-gris: #666666;
	--koch-blanc: #FDFDFD;
	--title-font: "Bebas neue";
	--text-font: "Baskerville";
}


/* ==========================================================================
   Dark mode — [koch_darkmode]
   Actif quand <html> porte la classe .koch-dark (toggle du menu).

   Dans Brizy, sur une section / ligne / colonne :
   Paramètres avancés → Classe CSS → koch-bg-1, koch-bg-2, koch-bg-3…
   En mode sombre, le fond prend la nuance de la classe. Sans classe, le
   fond ne change pas.

   En mode sombre, dans le contenu Brizy : texte et SVG en blanc, boutons
   intacts. Header / footer Blocksy inchangés.
   Classe « koch-keep » : l'élément garde ses couleurs d'origine.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Toggle — contour arrondi, icônes au trait, pastille pleine sur le mode actif
   Dark (maquette) : contour + soleil blancs, pastille blanche + lune bleue
   Light (maquette) : contour + lune bleus, pastille bleue + soleil blanc
   -------------------------------------------------------------------------- */

.koch-darkmode-toggle {
	--track-w: 64px;
	--track-h: 32px;
	--border: 2px;
	--knob: calc(var(--track-h) - var(--border) * 2);
	--icon: 16px;
	--line: var(--koch-bleu);      /* contour + icône inactive */
	--knob-bg: var(--koch-bleu);   /* pastille */
	--knob-icon: #ffffff;          /* icône dans la pastille */

	display: inline-flex;
	align-items: center;
	padding: 0;
	margin: 0;
	background: none;
	border: 0;
	cursor: pointer;
	line-height: 1;
	vertical-align: middle;
	-webkit-tap-highlight-color: transparent;
}

.koch-dark .koch-darkmode-toggle {
	--line: #ffffff;
	--knob-bg: #ffffff;
	--knob-icon: var(--koch-bleu);
}

.koch-darkmode-toggle__track {
	position: relative;
	display: block;
	box-sizing: border-box;
	width: var(--track-w);
	height: var(--track-h);
	border: var(--border) solid var(--line);
	border-radius: 999px;
	background: transparent;
	transition: border-color .3s ease;
}

.koch-darkmode-toggle__knob {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--knob);
	height: var(--knob);
	border-radius: 50%;
	background: var(--koch-bleu);
	box-shadow: 0 4px 12px rgba(0, 47, 179, .25);
	transition: transform .3s cubic-bezier(.4, 0, .2, 1), background-color .3s ease, box-shadow .3s ease;
}

.koch-dark .koch-darkmode-toggle__knob {
	background: #fff;
}

.koch-dark .koch-darkmode-toggle__knob {
	box-shadow: none;
	transform: translateX(calc(var(--track-w) - var(--border) * 2 - var(--knob)));
}

/* Icônes au trait, centrées sur leur moitié ; au-dessus de la pastille */
.koch-darkmode-toggle__icon {
	position: absolute;
	top: 50%;
	z-index: 1;
	width: var(--icon);
	height: var(--icon);
	margin-top: calc(var(--icon) / -2);
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	pointer-events: none;
	transition: color .3s ease;
}

.koch-darkmode-toggle__icon--sun {
	left: calc((var(--knob) - var(--icon)) / 2);
	color: var(--knob-icon);  /* light : dans la pastille */
}

.koch-darkmode-toggle__icon--moon {
	right: calc((var(--knob) - var(--icon)) / 2);
	color: var(--line);
}

.koch-dark .koch-darkmode-toggle__icon--sun {
	color: var(--line);
}

.koch-dark .koch-darkmode-toggle__icon--moon {
	color: var(--knob-icon);  /* dark : dans la pastille */
}

.koch-darkmode-toggle:focus-visible .koch-darkmode-toggle__track {
	outline: 2px solid var(--koch-bleu);
	outline-offset: 3px;
}

/* Élément de menu Blocksy */
.koch-darkmode-item {
	display: flex;
	align-items: center;
}

/* Transition douce au moment du switch uniquement */
.koch-theme-transition,
.koch-theme-transition *:not(.koch-darkmode-toggle *) {
	transition: background-color .3s ease, color .3s ease, fill .3s ease, stroke .3s ease !important;
}

/* --------------------------------------------------------------------------
   Toggle — contour arrondi, icônes au trait, pastille pleine sur le mode actif
   Dark (maquette) : contour + soleil blancs, pastille blanche + lune bleue
   Light (maquette) : contour + lune bleus, pastille bleue + soleil blanc
   -------------------------------------------------------------------------- */

.gform_button {
	font-family: "Futura", sans-serif !important;
	color: #fff !important;
	background-color: var(--koch-bleu) !important;
	padding: 12px 30px !important;
	font-size: 16px !important;
	border-radius: 0 !important;
	border: none !important;
	transition: background-color .5s !important;
}

.gform_wrapper .gform_button:hover {
	background-color: color-mix(in srgb, var(--koch-bleu) 60%, transparent) !important;
}


/* --------------------------------------------------------------------------
   Nuances de noir — une classe = une nuance
   Actives uniquement en mode sombre (.koch-dark). Ne touchent que le fond
   de l'élément qui porte la classe, pas celui de ses lignes / colonnes.
   Pour ajouter une nuance : copier un bloc, changer le numéro et le hex.
   -------------------------------------------------------------------------- */

.koch-dark .koch-bg-1 > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-1 > .brz-bg > .brz-bg-color { background-color: #04030E !important; }

@media only screen and (max-width: 1000px) {

.koch-dark .koch-bg-1-only-responsive > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-1-only-responsive > .brz-bg > .brz-bg-color { background-color: #04030E !important; }

}


/* koch-bg-1-mobile : même nuance que koch-bg-1, en mobile uniquement */
@media only screen and (max-width: 768px) {
	.koch-dark .koch-bg-1-mobile > .brz-section__content > .brz-bg > .brz-bg-color,
	.koch-dark .koch-bg-1-mobile > .brz-bg > .brz-bg-color { background-color: #04030E !important; }

	/* Texte en blanc sur ce fond, même dans une zone no-color / koch-bg-6 */
	.koch-dark .koch-bg-1-mobile,
	.koch-dark .koch-bg-1-mobile .no-color,
	.koch-dark .koch-bg-1-mobile .koch-bg-6 {
		--koch-dark-text: #ffffff;
	}
}

/* koch-bg-1-tablette : en tablette uniquement, en dark, fond #04030E plein
   (même nuance que koch-bg-1) et texte en blanc */
@media only screen and (min-width: 769px) and (max-width: 1000px) {
	.koch-dark .koch-bg-1-tablette > .brz-section__content > .brz-bg > .brz-bg-color,
	.koch-dark .koch-bg-1-tablette > .brz-bg > .brz-bg-color {
		background-color: #04030E !important;
		background-image: none !important;
	}

	.koch-dark .koch-bg-1-tablette,
	.koch-dark .koch-bg-1-tablette .no-color,
	.koch-dark .koch-bg-1-tablette .koch-bg-6 {
		--koch-dark-text: #ffffff;
	}
}

.koch-dark .koch-bg-2 > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-2 > .brz-bg > .brz-bg-color { background-color: #5A5A5A !important; }

.koch-dark .koch-bg-3 > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-3 > .brz-bg > .brz-bg-color { background-color: #3B3B3B !important; }

.koch-dark .koch-bg-5 > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-5 > .brz-bg > .brz-bg-color { background-color: #232323 !important; }

.koch-dark .koch-bg-6 > .brz-section__content > .brz-bg > .brz-bg-color,
.koch-dark .koch-bg-6 > .brz-bg > .brz-bg-color { background-color: #FDFDFD !important; }

/* koch-bg-6 = fond clair en dark : texte et titres restent foncés
   (redéfinit la couleur utilisée par les règles « texte blanc » du dark mode) */
.koch-dark .koch-bg-6 {
	--koch-dark-text: var(--koch-noir);
}

/* .no-color : texte et titres restent noirs en dark (boutons non touchés) */
.koch-dark .no-color {
	--koch-dark-text: var(--koch-noir);
}

/* Bloc à fond foncé posé dans une koch-bg-6 (ex. encart bleu) :
   classe Brizy « koch-text-light » → son texte repasse en blanc en dark */
.koch-dark .koch-text-light {
	--koch-dark-text: #ffffff;
}

/* .blue-case (encart bleu) : texte et titres toujours blancs, light comme dark
   (hors boutons) */
.blue-case {
	--koch-dark-text: #ffffff; /* prioritaire sur une koch-bg-6 parente */
}

.blue-case .brz-rich-text,
.blue-case .brz-rich-text * {
	color: #ffffff !important;
}

/* gradient-light : en dark, le dégradé Brizy (transparent → #04030E) passe
   en transparent → blanc, pour se fondre dans une colonne koch-bg-6 voisine */
.koch-dark .gradient-light > .brz-bg > .brz-bg-color,
.koch-dark .gradient-light > .brz-section__content > .brz-bg > .brz-bg-color {
	background-image: linear-gradient(90deg, rgba(253, 253, 253, 0) 54%, #FDFDFD 97%) !important;
}

/* Tablette + mobile (breakpoint Brizy 991px) : colonnes empilées → dégradé
   vertical (180deg), vers la colonne du dessous. Light et dark. */
@media (max-width: 991px) {
	.gradient-light > .brz-bg > .brz-bg-color,
	.gradient-light > .brz-section__content > .brz-bg > .brz-bg-color {
		background-image: linear-gradient(180deg, rgba(4, 3, 14, 0) 54%, #04030E 97%) !important;
	}

	.koch-dark .gradient-light > .brz-bg > .brz-bg-color,
	.koch-dark .gradient-light > .brz-section__content > .brz-bg > .brz-bg-color {
		background-image: linear-gradient(180deg, rgba(253, 253, 253, 0) 54%, #FDFDFD 97%) !important;
	}
}

/* gradient-koch-mobile (dark) :
   - mobile : le dégradé réglé dans Brizy (couleur globale 8 = blanc →
     transparent) passe en #04030E, positions de Brizy inchangées
   - tablette : dégradé #04030E en bas → transparent en haut.
     Placé après koch-bg-1-tablette : l'emporte si les deux classes sont
     sur le même élément. */
@media only screen and (max-width: 768px) {
	.koch-dark .gradient-koch-mobile > .brz-bg > .brz-bg-color,
	.koch-dark .gradient-koch-mobile > .brz-section__content > .brz-bg > .brz-bg-color {
		--brz-global-color8: 4, 3, 14;
	}
}

@media only screen and (min-width: 769px) and (max-width: 1000px) {
	.koch-dark .gradient-koch-mobile > .brz-bg > .brz-bg-color,
	.koch-dark .gradient-koch-mobile > .brz-section__content > .brz-bg > .brz-bg-color {
		background-color: transparent !important;
		background-image: linear-gradient(0deg, #04030E 3%, rgba(4, 3, 14, 0) 36%) !important;
	}
}


/* --------------------------------------------------------------------------
   Contenu Brizy en mode sombre : texte et SVG en blanc
   Le header / footer Blocksy ne sont pas touchés (leur fond reste clair).
   Exclus : boutons, toggle, éléments .koch-keep
   -------------------------------------------------------------------------- */

html.koch-dark {
	--koch-dark-text: #ffffff;
	--koch-dark-svg: #ffffff;
}

/* Texte */
.koch-dark .brz .brz-rich-text:not(.koch-keep *),
.koch-dark .brz .brz-rich-text *:not(.koch-keep *),
.koch-dark .brz .brz-counter:not(.koch-keep *),
.koch-dark .brz .brz-countdown2:not(.koch-keep *),
.koch-dark .brz .brz-accordion:not(.koch-keep *),
.koch-dark .brz .brz-tabs:not(.koch-keep *) {
	color: var(--koch-dark-text) !important;
}

/* Texte affiché par un élément « Shortcode » ou « Code embarqué » Brizy
   (mentions légales, confidentialité) :
   titres et texte suivent la même couleur. Widgets aux couleurs propres
   exclus (avis Google, Trustindex, réalisations, carousel) */
.koch-dark .brz :is(.brz-wp-shortcode, .brz-embed-code) :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, td, th, blockquote, strong, em, b, i, span):not(.koch-keep *):not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel-nav *):not(.brz-btn *):not(button *):not(.koch-dark .gform_wrapper .gform-field-label__text ) {
	color: var(--koch-dark-text) !important;
}

/* Icônes Brizy */
.koch-dark .brz .brz-icon:not(.brz-btn .brz-icon):not(.koch-keep *) {
	color: var(--koch-dark-svg) !important;
}

/* SVG inline dans le contenu Brizy */
.koch-dark .brz-root__container svg:not(.brz-btn *):not(button *):not(.koch-keep *) {
	color: var(--koch-dark-svg);
}

.koch-dark .brz-root__container svg:not(.brz-btn *):not(button *):not(.koch-keep *) [fill]:not([fill="none"]),
.koch-dark .brz-root__container svg:not(.brz-btn *):not(button *):not(.koch-keep *) [style*="fill"]:not([style*="fill:none"]):not([style*="fill: none"]) {
	fill: var(--koch-dark-svg) !important;
}

.koch-dark .brz-root__container svg:not(.brz-btn *):not(button *):not(.koch-keep *) [stroke]:not([stroke="none"]) {
	stroke: var(--koch-dark-svg) !important;
}

/* SVG en <img> dans le contenu Brizy (pictos) : la couleur est peinte à
   travers le SVG utilisé comme masque — l'URL est posée par scripts/script.js
   Exclu : le ti-header (Trustindex) */
.koch-dark .brz-root__container img.koch-svg-img:not(.brz-btn img):not(.koch-keep *):not(.ti-header *) {
	background-color: var(--koch-dark-svg);
	-webkit-mask: var(--koch-src) center / contain no-repeat;
	mask: var(--koch-src) center / contain no-repeat;
	object-position: -99999px 0;
}

/* ==========================================================================
   Home hero — tuyauterie en décor
   Brizy : Paramètres avancés → Classe CSS → home-hero (sur la section).
   Le décor passe au-dessus du fond Brizy (clair / sombre) et sous le contenu.
   ========================================================================== */

.home-hero > .brz-section__content::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	background: url("../../uploads/2026/10/pipes4-scaled.webp") center / cover no-repeat !important;
	pointer-events: none !important;
	opacity : 0.8;
	
}

.home-hero > .brz-section__content > .brz-container,
.home-hero > .brz-section__content > .brz-container-wrap {
	position: relative !important;
	z-index: 1 !important;
}

.koch-dark .home-hero > .brz-section__content::after {
	opacity: .4 !important;
}

/* ==========================================================================
   Accompagnement — lignes en décor (même principe que home-hero)
   Brizy : Classe CSS → accompagnement-after (sur la section).
   ========================================================================== */

.accompagnement-after > .brz-section__content::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	/* Taille du décor : --koch-lines-size (100% = pile la largeur de l'écran ;
	   au-delà, l'image grandit en gardant ses proportions, bords rognés) */
	background: url("../../uploads/2026/09/lines-2-scaled.webp") center / var(--koch-lines-size, 150%) auto no-repeat !important;
	pointer-events: none !important;
}

.accompagnement-after > .brz-section__content > .brz-container,
.accompagnement-after > .brz-section__content > .brz-container-wrap {
	position: relative !important;
	z-index: 1 !important;
}

.koch-dark .accompagnement-after > .brz-section__content::after {
	opacity: .1 !important;
}

/* --------------------------------------------------------------------------
   Logo SVG (header, footer, menu mobile) : blanc en mode sombre
   -------------------------------------------------------------------------- */

.koch-dark .site-logo-container img {
	filter: brightness(0) invert(1);
}

/* --------------------------------------------------------------------------
   Liens du menu header (+ sous-menus, menu mobile) : blancs en mode sombre
   -------------------------------------------------------------------------- */

html.koch-dark {
	--koch-dark-menu: #ffffff;        /* liens du menu */
	--koch-dark-menu-active: #002FB3; /* hover + page active */
}

.koch-dark .ct-header .ct-menu-link,
.koch-dark .ct-header .ct-toggle-dropdown-desktop,
.koch-dark #offcanvas .ct-menu-link,
.koch-dark #offcanvas .ct-toggle-dropdown-mobile {
	color: var(--koch-dark-menu) !important;
}

.koch-dark .ct-header .ct-menu-link:hover,
.koch-dark .ct-header .ct-menu-link:focus-visible,
.koch-dark .ct-header .current-menu-item > .ct-menu-link,
.koch-dark .ct-header .current-menu-ancestor > .ct-menu-link,
.koch-dark #offcanvas .ct-menu-link:hover,
.koch-dark #offcanvas .current-menu-item > .ct-menu-link,
.koch-dark #offcanvas .current-menu-ancestor > .ct-menu-link {
	color: var(--koch-bleu) !important;
}

.koch-dark .ct-header .ct-header-trigger {
	color: #ffffff !important;
	--theme-icon-color: #ffffff;
}

/* Menu mobile (#offcanvas, tablette + mobile) : son panneau garde un fond
   clair → liens, logo et bouton fermer restent noirs en mode sombre */
.koch-dark #offcanvas {
	--koch-dark-menu: var(--koch-noir);
}

.koch-dark #offcanvas .site-logo-container img {
	filter: none;
}

.koch-dark #offcanvas .ct-toggle-close {
	color: var(--koch-noir) !important;
	--theme-icon-color: var(--koch-noir);
}

/* --------------------------------------------------------------------------
   Header sticky : fond noir en mode sombre
   -------------------------------------------------------------------------- */

.koch-dark .ct-header [data-sticky*="yes"] [data-row],
.koch-dark .ct-header [data-sticky*="yes"] [data-row] > div {
	background-color: #000000 !important;
	background-image: none !important;
}

.koch-dark .ct-header [data-sticky*="yes"] [data-row] {
	--theme-box-shadow: 0 10px 20px rgba(0, 0, 0, .4);
}

/* ==========================================================================
   Carousel — [koch_carousel] + [koch_carousel_nav]
   ========================================================================== */

.koch-carousel {
	--koch-carousel-gap: 24px;
	overflow: hidden;
}

.koch-carousel .slick-list {
	margin-left: calc(var(--koch-carousel-gap) / -2);
}

.koch-carousel__slide {
	padding: 0 calc(var(--koch-carousel-gap) / 2);
}

.koch-carousel__slide img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: var(--koch-carousel-ratio, 4/5);
	object-fit: cover;
}

/* Tablette : les photos prennent toute la hauteur de leur colonne Brizy
   (hauteur calculée par scripts/script.js → --koch-carousel-h), même
   largeur, image rognée sur les côtés si besoin */
@media only screen and (min-width: 769px) and (max-width: 1000px) {
	.koch-carousel__slide img {
		aspect-ratio: auto;
		height: var(--koch-carousel-h, 450px);
		object-fit: cover;
	}
}

/* Avant l'initialisation de Slick : pas d'empilement des photos */
.koch-carousel__track:not(.slick-initialized) {
	display: flex;
}

.koch-carousel__track:not(.slick-initialized) .koch-carousel__slide {
	flex: 0 0 50%;
}

/* Navigation : flèches à gauche, compteur à droite */
.koch-carousel-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.koch-carousel-nav__arrows {
	display: flex;
	gap: 8px;
}

.koch-carousel-nav__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid var(--koch-bleu);
	background: transparent;
	color: inherit;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s;
}


.koch-dark .koch-carousel-nav__btn {
border: 1px solid var(--koch-blanc);
}


.koch-carousel-nav__btn:hover,
.koch-carousel-nav__btn:focus-visible {
	background-color: var(--koch-bleu);
}

.koch-carousel-nav__btn:hover svg,
.koch-carousel-nav__btn:focus-visible svg {
	stroke: var(--koch-blanc);
}

.koch-carousel-nav__btn svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: var(--koch-bleu);
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
	
}

.koch-dark .koch-carousel-nav__btn svg {
	stroke: var(--koch-blanc);
}

.koch-carousel-nav__count {
	font-weight: 800!important;
    font-family: "Futura" !important;
}


.koch-dark .koch-carousel-nav__count  {
	color: var(--koch-blanc);
}

@media (max-width: 767px) {
	.koch-carousel {
		--koch-carousel-gap: 16px;
	}

	.koch-carousel__track:not(.slick-initialized) .koch-carousel__slide {
		flex-basis: 100%;
	}
}

/* --------------------------------------------------------------------------
   Boutons .btn-dark-custom : texte + bordure blancs en mode sombre
   Hors survol uniquement — le hover réglé dans Brizy reste intact.
   -------------------------------------------------------------------------- */

.koch-dark .brz .brz-btn.btn-dark-custom:not(:hover):not(:focus-visible),
.koch-dark .brz .btn-dark-custom .brz-btn:not(:hover):not(:focus-visible) {
	color: #ffffff !important;
	border-color: #ffffff !important;
}

.koch-dark .brz .brz-btn.btn-dark-custom:not(:hover):not(:focus-visible) *,
.koch-dark .brz .btn-dark-custom .brz-btn:not(:hover):not(:focus-visible) * {
	color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   Images de fond de section : version sombre
   Classe Brizy sur la section → image remplacée en mode sombre
   (cadrage / taille / position : ceux réglés dans Brizy)
   -------------------------------------------------------------------------- */

.koch-dark .light-pictures-1 > .brz-section__content > .brz-bg > .brz-bg-image,
.koch-dark .light-pictures-1 > .brz-bg > .brz-bg-image {
	background-image: url("../../uploads/2026/10/maison_nuit_2-scaled.webp") !important;
}

.koch-dark .light-pictures-2 > .brz-section__content > .brz-bg > .brz-bg-image,
.koch-dark .light-pictures-2 > .brz-bg > .brz-bg-image {
	background-image: url("../../uploads/2026/09/dark-pictures-2.webp") !important;
}

.koch-dark .light-pictures-3 > .brz-section__content > .brz-bg > .brz-bg-image,
.koch-dark .light-pictures-3 > .brz-bg > .brz-bg-image {
	background-image: url("../../uploads/2026/09/house-dark.webp") !important;
}

/* --------------------------------------------------------------------------
   Icônes SVG custom Brizy (.brz-icon-svg-custom) : blanches en mode sombre
   Brizy peint ces icônes avec background-color à travers un masque SVG.
   Au survol d'un bouton, le hover Brizy reste intact.
   -------------------------------------------------------------------------- */

.koch-dark .brz .brz-icon-svg-custom:not(.brz-btn:hover *):not(.koch-keep *) {
	background-color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   Débord plein écran — classes Brizy .full-left / .full-right
   (section, ligne ou colonne). Le fond s'étire jusqu'au bord gauche / droit
   de l'écran ; la distance est calculée par scripts/script.js.
   -------------------------------------------------------------------------- */

/* En mobile (colonnes empilées), les deux côtés débordent */
.full-left > .brz-bg,
.full-left > .brz-section__content > .brz-bg,
.full-right > .brz-bg,
.full-right > .brz-section__content > .brz-bg {
	left: calc(-1 * var(--koch-bleed-left, 0px)) !important;
	right: calc(-1 * var(--koch-bleed-right, 0px)) !important;
}

/* --------------------------------------------------------------------------
   Accordéons (FAQ) en mode sombre : titres + séparateurs en blanc
   -------------------------------------------------------------------------- */

.koch-dark .brz .brz-accordion__nav:not(.koch-keep *),
.koch-dark .brz .brz-accordion__nav-title:not(.koch-keep *),
.koch-dark .brz .brz-accordion__nav-title *:not(.koch-keep *) {
	color: #ffffff !important;
}

.koch-dark .faq-border .brz-accordion__item:not(:last-child) {
	border-bottom-color: #ffffff !important;
}

.faq-border .brz-accordion__nav-title {
	line-height: 25px!important;
}	
@media only screen and (max-width: 768px) {
.faq-border .brz-accordion__nav-title {
	line-height: 21px!important;
	
}
	.faq-border .brz-tp-lg-paragraph {
		padding-top: 10px!important;
	}
}
/* --------------------------------------------------------------------------
   Éléments visibles selon le mode — classes Brizy
   .light-carousel : mode clair uniquement / .dark-carousel : mode sombre uniquement
   Replié (hauteur 0) plutôt que display:none : le slider garde sa largeur et
   reste bien calculé quand il réapparaît.
   -------------------------------------------------------------------------- */

.koch-dark .light-carousel,
html:not(.koch-dark) .dark-carousel {
	height: 0 !important;
	min-height: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	overflow: hidden !important;
	visibility: hidden !important;
}

/* --------------------------------------------------------------------------
   Avis Google : fond des avis (.grw-backgnd) noir en mode sombre
   Sélecteur renforcé pour battre .wp-gr:not(.wp-dark) .grw-review-inner.grw-backgnd
   du plugin (background !important)
   -------------------------------------------------------------------------- */

.koch-dark .wp-gr.rpi .grw-review-inner.grw-backgnd,
.koch-dark .wp-gr.rpi .grw-backgnd {
	background: #000000 !important;
}

/* Contenu des avis (noms + texte) en blanc en mode sombre
   Sélecteur renforcé pour battre le color !important du plugin sur le nom */
.koch-dark .wp-gr.rpi .grw-review-inner,
.koch-dark .wp-gr.rpi .grw-review-inner *,
.koch-dark .wp-gr.rpi .grw-review-inner a.wp-google-name {
	color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   Liste .custom-list (classe Brizy sur un bloc texte)
   Chaque ligne en carte : fond clair / sombre, sans puce, 10px entre les lignes
   -------------------------------------------------------------------------- */

.custom-list ul {
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.custom-list li {
	margin: 0 !important;
	padding: 12px 20px !important;
	list-style: none !important;
	background-color: #FDFDFD !important;
	width: fit-content!important;
}

.custom-list li::marker,
.custom-list li::before {
	content: none !important;
}

.koch-dark .custom-list li {
	background-color: #04030E !important;
}

/* ==========================================================================
   Footer Koch — footer.php
   Padding haut : 75px desktop / 60px tablette / 40px mobile
   ========================================================================== */

.koch-footer {
	--kf-bg: #ffffff;
	--kf-text: var(--koch-noir);
	--kf-box: #f5f5f5;
	--kf-line: rgba(4, 3, 14, .15);

	padding: 75px 0 40px;
	background: var(--kf-bg);
	color: var(--kf-text);
	font-family: var(--text-font);
	font-size: 14px;
	line-height: 1.5;
}

.koch-dark .koch-footer {
	--kf-bg: #000000;
	--kf-text: #ffffff;
	--kf-box: #3B3B3B;
	--kf-line: rgba(255, 255, 255, .2);
}

.koch-footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.koch-footer p {
	margin: 0;
}

/* Textes du footer en 16px : éléments de liste (les grands titres gardent
   leur taille via .koch-footer__title) et paragraphes sans classe */
.koch-footer li,
.koch-footer p:not([class]) {
	font-size: 16px;
}

.koch-footer a {
	color: inherit;
	text-decoration: none;
	transition: color .2s ease;
}

.koch-footer a:hover {
	color: var(--koch-bleu); /* #002FB3 */
}

/* Liens des listes (colonnes + encadré) : pas de couleur au survol,
   léger glissement vers la droite */
.koch-footer .koch-footer__col ul a,
.koch-footer ul.koch-footer__col a {
	display: inline-block;
	transition: transform .2s ease;
}

.koch-footer .koch-footer__col ul a:hover,
.koch-footer ul.koch-footer__col a:hover {
	color: inherit;
	transform: translateX(5px);
}

/* Colonne Réalisation / L'entreprise / Contact / Professionnels :
   bleu au survol, sans glissement */
.koch-footer ul.koch-footer__col--main a {
	transition: color .2s ease;
}

.koch-footer ul.koch-footer__col--main a:hover {
	color: var(--koch-bleu);
	transform: none;
}

/* Mentions légales : légère opacité au survol, sans couleur ni mouvement */
.koch-footer .koch-footer__legal a {
	transition: opacity .2s ease;
}

.koch-footer .koch-footer__legal a:hover {
	color: inherit;
	opacity: .7;
}

.koch-footer__title {
	display: inline-block;
	font-family: var(--title-font);
	font-size: 19px;
	line-height: 1.2;
	text-transform: uppercase;
}

/* Certifications */
.koch-footer__labels {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 60px !important;
}

.koch-footer__labels img {
	display: block;
	width: auto;
	height: 65px;
}

/* Bloc principal : coordonnées | navigation */
.koch-footer__main {
	display: grid;
	grid-template-columns: minmax(200px, 1fr) 3fr;
	gap: 40px;
}

.koch-footer__contact {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.koch-footer__logo img {
	display: block;
	height: auto;
	max-width: 70px;
}

/* Dark : logo Koch + Wanner en blanc. Sondenecker reste identique
   (pas de classe koch-footer__invert) */
.koch-dark .koch-footer__logo img,
.koch-dark .koch-footer__partners-logos img.koch-footer__invert {
	filter: brightness(0) invert(1);
}

.koch-footer__phone {
	margin-top: 20px;
	font-family: var(--title-font);
	font-size: 30px;
	line-height: 1;
}

/* Colonnes du menu */
.koch-footer__menu {
	display: grid;
	grid-template-columns: repeat(3, 1fr) auto;
	gap: 30px;
	margin-bottom: 30px;
}

.koch-footer__col ul,
ul.koch-footer__col {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.koch-footer__col .koch-footer__title {
	margin-bottom: 14px;
}

.koch-footer__col--main .koch-footer__title {
	margin-bottom: 0;
}

/* Encadré gris */
.koch-footer__box {
	display: grid;
	grid-template-columns: repeat(3, 1fr) auto;
	align-items: center;
	gap: 20px;
	padding: 20px;
	background: var(--kf-box);
}

.koch-footer__box ul.koch-footer__col {
	gap: 18px;
}

.koch-footer__partners-logos {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 10px;
}

.koch-footer__partners-logos img {
	display: block;
	width: auto;
	height: 30px;
}

.koch-footer__partner-name {
	font-family: var(--title-font);
	font-size: 26px;
}

/* Mentions */
.koch-footer__legal {
	margin-top: 30px !important;
	padding-top: 20px;
	border-top: 1px solid var(--kf-line);
	font-size: 15px;
	text-align: center;
}

.koch-footer__agency {
	margin-left: 6px;
}

/* Tablette */
@media (max-width: 1000px) {
	.koch-footer {
		padding-top: 60px;
	}

	/* Tablette : logos sur 4 colonnes */
	.koch-footer__labels {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		justify-items: center;
		gap: 30px 20px;
		margin-bottom: 50px !important;
	}

	.koch-footer__labels img {
		max-width: 100%;
		height: auto;
		max-height: 65px;
	}

	.koch-footer__main {
		grid-template-columns: 1fr;
	}

	.koch-footer__menu,
	.koch-footer__box {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Mobile */
@media (max-width: 768px) {
	.koch-footer {
		padding-top: 40px;
	}

	/* Mobile : logos sur 3 colonnes */
	.koch-footer__labels {
		grid-template-columns: repeat(3, 1fr);
		gap: 20px 14px;
		margin-bottom: 40px !important;
	}

	.koch-footer__labels img {
		max-height: 48px;
	}

	.koch-footer__menu,
	.koch-footer__box {
		grid-template-columns: 1fr;
	}

	.koch-footer__box {
		padding: 24px;
	}
}

/* --------------------------------------------------------------------------
   .hover-effect (classe Brizy : section, ligne ou colonne)
   Au survol, zoom doux sur l'image de fond, recadrée dans son bloc
   -------------------------------------------------------------------------- */

.hover-effect > .brz-bg,
.hover-effect > .brz-section__content > .brz-bg {
	overflow: hidden !important;
}

.hover-effect > .brz-bg > .brz-bg-image,
.hover-effect > .brz-section__content > .brz-bg > .brz-bg-image {
	transition: transform .6s ease !important;
	will-change: transform;
}

.hover-effect:hover > .brz-bg > .brz-bg-image,
.hover-effect:hover > .brz-section__content > .brz-bg > .brz-bg-image {
	transform: scale(1.08);
}

/* --------------------------------------------------------------------------
   .tablette-dispo (classe Brizy sur la colonne de chaque carte)
   Tablette uniquement : les cartes se rangent sur 2 colonnes
   -------------------------------------------------------------------------- */

@media only screen and (min-width: 769px) and (max-width: 1000px) {
	.brz-column__items:has(> .brz-row__container .tablette-dispo) {
		display: flex !important;
		flex-flow: row wrap !important;
		column-gap: 10px !important;
	}

	/* Les autres éléments (titres, texte, bouton) gardent toute la largeur */
	.brz-column__items:has(> .brz-row__container .tablette-dispo) > * {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.brz-column__items:has(> .brz-row__container .tablette-dispo) > .brz-row__container:has(.tablette-dispo) {
		flex: 0 0 calc(50% - 5px) !important;
		width: calc(50% - 5px) !important;
		max-width: calc(50% - 5px) !important;
	}

	.tablette-dispo {
		flex: 1 1 100% !important;
		max-width: 100% !important;
	}
}

/* --------------------------------------------------------------------------
   Boutons Brizy : jamais plus larges que leur conteneur.
   S'il manque de place, le texte passe à la ligne au lieu de déborder.
   -------------------------------------------------------------------------- */

.brz .brz-btn {
	max-width: 100% !important;
	height: auto !important;
	white-space: normal !important;
	text-align: center;
}

.brz .brz-btn .brz-span,
.brz .brz-btn .brz-text__editor {
	white-space: normal !important;
	overflow-wrap: break-word;
}

.brz .brz-wrapper-clone {
	max-width: 100%;
	flex-wrap: wrap;
}
/* ==========================================================================
   Réalisations — [koch_realisations] (shortcodes/realisations.php)
   Grille 4 colonnes pleine largeur. Vignette : services + titre en bas,
   bouton « + ». Avec filtres="oui" : barre de filtres + Isotope (.is-isotope)
   ========================================================================== */

.koch-realisations {
        --kr-cols: 4;
        --kr-gap: 1px;
        --kr-ratio: 1 / 1;

        display: grid;
        grid-template-columns: repeat(var(--kr-cols), 1fr);
        gap: var(--kr-gap);
        /* Pleine largeur d'écran : marges calculées par scripts/script.js */
        width: var(--kr-width, 100%);
        margin: 0 0 0 var(--kr-shift, 0px) !important;
        padding: 0 !important;
        list-style: none !important;
}

.koch-realisations__item {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
}

/* Isotope positionne les vignettes : largeurs en %, gouttière en padding */
.koch-realisations.is-isotope {
        display: block;
}

.koch-realisations.is-isotope .koch-realisations__item {
        width: calc(100% / var(--kr-cols));
        padding: 0 var(--kr-gap) var(--kr-gap) 0 !important;
        box-sizing: border-box;
}

.koch-realisations__link {
        position: relative;
        display: block;
        overflow: hidden;
        aspect-ratio: var(--kr-ratio);
        text-decoration: none !important;
}

.koch-realisations__img {
        display: block;
        width: 100%;
        height: 100% !important;
        object-fit: cover;
        transition: transform .6s ease;
}

.koch-realisations__link:hover .koch-realisations__img,
.koch-realisations__link:focus-visible .koch-realisations__img {
        transform: scale(1.05);
}

/* Bandeau bas : dégradé, services + titre à gauche, « + » à droite */
.koch-realisations__infos {
        position: absolute;
        inset: auto 0 0 0;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 16px;
        padding: 70px 16px 16px;
        background: linear-gradient(180deg, rgba(4, 3, 14, 0) 0%, rgba(4, 3, 14, .8) 100%);
}

.koch-realisations__services {
        display: block;
        margin-bottom: 4px;
        font-family: var(--title-font);
        font-size: 20px;
        line-height: 1.2;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: #fff !important;
}

.koch-realisations__title {
        display: block;
        font-family: var(--title-font);
        font-size: 27px;
        line-height: 1.05;
        text-transform: uppercase;
        color: #ffffff !important;
}

.koch-realisations__plus {
        display: flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        font-family: "Futura", sans-serif;
        font-size: 20px;
        line-height: 1;
        color: #ffffff !important;
        background: var(--koch-bleu);
        transition: background-color .3s ease;
}

.koch-realisations__link:hover .koch-realisations__plus,
.koch-realisations__link:focus-visible .koch-realisations__plus {
        background: color-mix(in srgb, var(--koch-bleu) 70%, #ffffff);
}

/* Barre de filtres (filtres="oui") */
.koch-realisations-filtres {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin: 0 0 30px;
}

.koch-realisations-filtres__btn {
        min-height: 0;
        margin: 0;
        padding: 6px 14px !important;
        font-family: "Futura", sans-serif !important;
        font-size: 14px !important;
        font-weight: 600;
        line-height: 1.2;
        color: var(--koch-bleu) !important;
        background: transparent !important;
        border: 1px solid var(--koch-bleu) !important;
        cursor: pointer;
        transition: background-color .3s ease, color .3s ease;
}

.koch-realisations-filtres__btn:hover,
.koch-realisations-filtres__btn.is-active {
        color: #ffffff !important;
        background: var(--koch-bleu) !important;
}

.koch-realisations-filtres__btn:focus-visible {
        outline: 2px solid var(--koch-bleu);
        outline-offset: 2px;
}

/* Dark : contour blanc ; actif = fond blanc, texte bleu */
.koch-dark .koch-realisations-filtres__btn {
        color: #ffffff !important;
        border-color: #ffffff !important;
}

.koch-dark .koch-realisations-filtres__btn:hover,
.koch-dark .koch-realisations-filtres__btn.is-active {
        color: var(--koch-bleu) !important;
        background: #ffffff !important;
}

/* Tablette : 2 colonnes */
@media only screen and (max-width: 1000px) {
        .koch-realisations {
                --kr-cols: 2;
        }
	
.koch-realisations__title {
        font-size: 24px;
        line-height: 24px;
    
}
}

/* Mobile : 1 colonne */
@media only screen and (max-width: 768px) {
        .koch-realisations {
                --kr-cols: 1;
                --kr-ratio: 4 / 3;
        }
	.koch-realisations__title {
        font-size: 20px;
        line-height: 20px;
}
.koch-realisations__services {
        font-size: 16px;

}

}

/* Dégradé noir du bas vers le milieu de la vignette */
.koch-realisations__link::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, rgba(4, 3, 14, .9) 0%, rgba(4, 3, 14, .55) 30%, rgba(4, 3, 14, 0) 65%);
        pointer-events: none;
}

/* Bandeau bas : services + titre à gauche, « + » à droite */
.koch-realisations__infos {
        position: absolute;
        inset: auto 0 0 0;
        z-index: 1;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 16px;
        padding: 16px;
}

/* --------------------------------------------------------------------------
   Contenu des shortcodes et codes embarqués (mentions légales,
   confidentialité) : mêmes typos que Brizy
   Titres h1→h6 et texte reprennent les styles globaux Brizy (variables
   --brz-headingN… et --brz-paragraph…), avec les tailles tablette (≤ 991px)
   et mobile (≤ 767px). Widgets aux styles propres exclus.
   -------------------------------------------------------------------------- */

.brz :is(.brz-wp-shortcode, .brz-embed-code) h1:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading1fontfamily) !important;
	text-transform: var(--brz-heading1texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h2:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading2fontfamily) !important;
	text-transform: var(--brz-heading2texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h3:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading3fontfamily) !important;
	text-transform: var(--brz-heading3texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h4:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading4fontfamily) !important;
	text-transform: var(--brz-heading4texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h5:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading5fontfamily) !important;
	text-transform: var(--brz-heading5texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h6:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-heading6fontfamily) !important;
	text-transform: var(--brz-heading6texttransform) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) :is(p, li, dt, dd, td, th, blockquote):not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-family: var(--brz-paragraphfontfamily) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h1:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading1fontsize) !important;
	line-height: var(--brz-heading1lineheight) !important;
	font-weight: var(--brz-heading1fontweight) !important;
	letter-spacing: var(--brz-heading1letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h2:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading2fontsize) !important;
	line-height: var(--brz-heading2lineheight) !important;
	font-weight: var(--brz-heading2fontweight) !important;
	letter-spacing: var(--brz-heading2letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h3:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading3fontsize) !important;
	line-height: var(--brz-heading3lineheight) !important;
	font-weight: var(--brz-heading3fontweight) !important;
	letter-spacing: var(--brz-heading3letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h4:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading4fontsize) !important;
	line-height: var(--brz-heading4lineheight) !important;
	font-weight: var(--brz-heading4fontweight) !important;
	letter-spacing: var(--brz-heading4letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h5:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading5fontsize) !important;
	line-height: var(--brz-heading5lineheight) !important;
	font-weight: var(--brz-heading5fontweight) !important;
	letter-spacing: var(--brz-heading5letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) h6:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-heading6fontsize) !important;
	line-height: var(--brz-heading6lineheight) !important;
	font-weight: var(--brz-heading6fontweight) !important;
	letter-spacing: var(--brz-heading6letterspacing) !important;
}

.brz :is(.brz-wp-shortcode, .brz-embed-code) :is(p, li, dt, dd, td, th, blockquote):not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
	font-size: var(--brz-paragraphfontsize) !important;
	line-height: var(--brz-paragraphlineheight) !important;
	font-weight: var(--brz-paragraphfontweight) !important;
	letter-spacing: var(--brz-paragraphletterspacing) !important;
}

@media (max-width: 991px) {
	.brz :is(.brz-wp-shortcode, .brz-embed-code) h1:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading1tabletfontsize) !important;
		line-height: var(--brz-heading1tabletlineheight) !important;
		font-weight: var(--brz-heading1tabletfontweight) !important;
		letter-spacing: var(--brz-heading1tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h2:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading2tabletfontsize) !important;
		line-height: var(--brz-heading2tabletlineheight) !important;
		font-weight: var(--brz-heading2tabletfontweight) !important;
		letter-spacing: var(--brz-heading2tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h3:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading3tabletfontsize) !important;
		line-height: var(--brz-heading3tabletlineheight) !important;
		font-weight: var(--brz-heading3tabletfontweight) !important;
		letter-spacing: var(--brz-heading3tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h4:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading4tabletfontsize) !important;
		line-height: var(--brz-heading4tabletlineheight) !important;
		font-weight: var(--brz-heading4tabletfontweight) !important;
		letter-spacing: var(--brz-heading4tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h5:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading5tabletfontsize) !important;
		line-height: var(--brz-heading5tabletlineheight) !important;
		font-weight: var(--brz-heading5tabletfontweight) !important;
		letter-spacing: var(--brz-heading5tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h6:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading6tabletfontsize) !important;
		line-height: var(--brz-heading6tabletlineheight) !important;
		font-weight: var(--brz-heading6tabletfontweight) !important;
		letter-spacing: var(--brz-heading6tabletletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) :is(p, li, dt, dd, td, th, blockquote):not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-paragraphtabletfontsize) !important;
		line-height: var(--brz-paragraphtabletlineheight) !important;
		font-weight: var(--brz-paragraphtabletfontweight) !important;
		letter-spacing: var(--brz-paragraphtabletletterspacing) !important;
	}
}

@media (max-width: 767px) {
	.brz :is(.brz-wp-shortcode, .brz-embed-code) h1:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading1mobilefontsize) !important;
		line-height: var(--brz-heading1mobilelineheight) !important;
		font-weight: var(--brz-heading1mobilefontweight) !important;
		letter-spacing: var(--brz-heading1mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h2:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading2mobilefontsize) !important;
		line-height: var(--brz-heading2mobilelineheight) !important;
		font-weight: var(--brz-heading2mobilefontweight) !important;
		letter-spacing: var(--brz-heading2mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h3:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading3mobilefontsize) !important;
		line-height: var(--brz-heading3mobilelineheight) !important;
		font-weight: var(--brz-heading3mobilefontweight) !important;
		letter-spacing: var(--brz-heading3mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h4:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading4mobilefontsize) !important;
		line-height: var(--brz-heading4mobilelineheight) !important;
		font-weight: var(--brz-heading4mobilefontweight) !important;
		letter-spacing: var(--brz-heading4mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h5:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading5mobilefontsize) !important;
		line-height: var(--brz-heading5mobilelineheight) !important;
		font-weight: var(--brz-heading5mobilefontweight) !important;
		letter-spacing: var(--brz-heading5mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) h6:not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-heading6mobilefontsize) !important;
		line-height: var(--brz-heading6mobilelineheight) !important;
		font-weight: var(--brz-heading6mobilefontweight) !important;
		letter-spacing: var(--brz-heading6mobileletterspacing) !important;
	}

	.brz :is(.brz-wp-shortcode, .brz-embed-code) :is(p, li, dt, dd, td, th, blockquote):not(.wp-gr *):not(.ti-widget *):not(.koch-realisations *):not(.koch-carousel *):not(.koch-carousel-nav *) {
		font-size: var(--brz-paragraphmobilefontsize) !important;
		line-height: var(--brz-paragraphmobilelineheight) !important;
		font-weight: var(--brz-paragraphmobilefontweight) !important;
		letter-spacing: var(--brz-paragraphmobileletterspacing) !important;
	}
}

/* Trustindex : en-tête « Avis Google » en forme de pilule (radius max) */
.ti-widget.ti-goog .ti-header.ti-header-grid.source-Google,
.ti-widget .ti-header.ti-header-grid.source-Google {
	border-radius: 999px !important;
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   HOME
   -------------------------------------------------------------------------- */

/* Pages 635, 295, 367 (sans margin-top négatif : le header ne passe pas
   sur un visuel) : header noir en mode sombre, texte + logo déjà blancs */
.koch-dark .page-id-635 .ct-header [data-row],
.koch-dark .page-id-635 .ct-header [data-row] > div,
.koch-dark .page-id-295 .ct-header [data-row],
.koch-dark .page-id-295 .ct-header [data-row] > div,
.koch-dark .page-id-367 .ct-header [data-row],
.koch-dark .page-id-367 .ct-header [data-row] > div {
	background-color: #000000 !important;
	background-image: none !important;
}

/* Pages exclues du margin-top négatif : 635, 295, 367 */
@media only screen and (min-width: 1001px) {
	body:not(.page-id-635):not(.page-id-295):not(.page-id-367) #main {
		margin-top: -150px!important;
	}
}


/* Desktop : header en pleine largeur, logo et toggle près des bords de
   l'écran (marge latérale réglable : --koch-header-gutter) */
.ct-header [data-device="desktop"] .ct-container {
	--koch-header-gutter: 30px;
	width: 100% !important;
	max-width: none !important;
	padding-left: var(--koch-header-gutter) !important;
	padding-right: var(--koch-header-gutter) !important;
}

/* Tablette + mobile : header opaque (plus de margin-top négatif sur #main)
   fond blanc en light, noir en dark */
@media only screen and (max-width: 1000px) {
	.ct-header [data-row],
	.ct-header [data-row] > div {
		background-color: #ffffff !important;
		background-image: none !important;
	}

	.koch-dark .ct-header [data-row],
	.koch-dark .ct-header [data-row] > div {
		background-color: #000000 !important;
	}
}



@media only screen and (max-width: 1000px) {

}

.plus-btn .brz-text__editor {
	display: none!important;
}

.align-btn .brz-column__items  {

display: flex!important;
    flex-direction: row!important;
    align-items: center!important;
    justify-content: end!important;
    gap: 10px!important;
	
}

.ti-widget.ti-goog .ti-header {
	padding: 10px!important;
}

.ti-widget.ti-goog .ti-platform-icon {
	width: 25px!important;
}

.ti-widget.ti-goog .ti-widget-container {
	margin: 0px!important;
}

.ti-widget.ti-goog .ti-widget-container {
	margin: 0px!important;
}

.wp-google-time, .grw-img-wrap, .rpi-stars, .grw-review svg {
	display: none!important;
}

.wp-google-name {
	color: var(--koch-noir)!important;
	font-family: var(--title-font)!important;
}

.wp-google-text {
	font-family: var(--text-font)!important;
}

.faq-border .brz-accordion__item:not(:last-child) {
    border-bottom: 1px solid var(--koch-noir) !important;
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
}

.brz-icon-text {
	align-items: center!important;
}

@media (max-width: 768px) {
	.brz-btn span {
    white-space: normal!important;
    overflow-wrap: break-word!important;
    word-break: break-word!important;
    box-sizing: border-box!important;
	text-align: left!important;
	}
}

.rpi-logo-google {
	display: none!important;
}

/* ==========================================================================
   Gravity Forms — champs en blanc (light) / #04030E (dark)
   ========================================================================== */

.gform_wrapper {
	--theme-form-field-background-initial-color: #ffffff;
	--theme-form-field-background-focus-color: #ffffff;
}

.gform_wrapper :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="hidden"]), textarea, select) {
	background-color: #ffffff !important;
	border-radius: 0px!important;
	border: 1px solid #A3A3A7!important;
}

.koch-dark .gform_wrapper {
	--theme-form-field-background-initial-color: var(--koch-noir);
	--theme-form-field-background-focus-color: var(--koch-noir);
	--theme-form-text-initial-color: #ffffff;
	--theme-form-text-focus-color: #ffffff;
}

.koch-dark .gform_wrapper :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="hidden"]), textarea, select) {
	background-color: var(--koch-noir) !important;
	color: #ffffff !important;
	border: 1px solid #A3A3A7!important;
}

.koch-dark .gform_wrapper :is(input, textarea)::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

.koch-dark .gform_wrapper :is(label, legend, .gfield_description, .gfield_consent_label, .gfield_consent_label a) {
	color: #ffffff;
}

.gform_wrapper ::placeholder {
	font-family: var(--text-font)!important;
	color: #5D5D64!important; 
	opacity: 1!important;
}

.gform_wrapper .gform-field-label__text, .gform_wrapper .gform-field-label__text a  {
	font-family: var(--text-font)!important;
	color: #04030E!important; 
}


.koch-dark .gform_wrapper ::placeholder, .koch-dark .gform_wrapper .gform-field-label__text, .koch-dark .gform_wrapper .gform-field-label__text a {
	font-family: var(--text-font)!important;
	color: #A3A3A7!important;  
	opacity: 1!important;
}

/* Case de consentement : sans fond, bordure identique aux champs,
   coche dessinée dans la couleur de la bordure */
.gform_wrapper .ginput_container_consent input[type="checkbox"] {
        -webkit-appearance: none;
        appearance: none;
        position: relative;
        flex-shrink: 0;
        width: 18px;
        height: 18px;
        margin: 0 10px 0 0;
        padding: 0;
        vertical-align: middle;
        background: transparent !important;
        border: 1px solid #A3A3A7;
        border-radius: 0px!important;
        cursor: pointer;
}

.gform_wrapper .ginput_container_consent input[type="checkbox"]:checked {
        border-color: 1px solid #A3A3A7!important;
}

.gform_wrapper .ginput_container_consent input[type="checkbox"]::before {
        content: "";
        position: absolute;
        inset: 0;
        width: 9px;
        height: 5px;
        margin: auto;
        border: 1px solid #A3A3A7;
        border-top: none;
        border-right: none;
        transform: translateY(-1px) rotate(-45deg);
        opacity: 0;
}

.gform_wrapper .ginput_container_consent input[type="checkbox"]:checked::before {
        opacity: 1;
}

.gform_wrapper .ginput_container_consent input[type="checkbox"]:focus-visible {
        outline: 2px solid var(--koch-bleu);
        outline-offset: 2px;
}

.gform-field-label__text {
	    position: relative!important;
    top: 2px!important;
}

.gform-footer{
	padding-bottom: 0px!important;

}

#gform_submit_button_1 {

	margin-bottom: 0px!important;
}

.koch-dark .brz .brz-video:not(.koch-keep *) .brz-video-custom-video-controls {
	background-color: #232323 !important;
}

.koch-dark .brz .brz-video:not(.koch-keep *) :is(.brz-video-custom-play, .brz-video-custom-pause, .brz-video-custom-mute, .brz-video-custom-unmute, .brz-video-custom-fullscreen-icon, .brz-video-custom-current-time, .brz-video-custom-total-time) {
	color: #ffffff !important;
}

.koch-dark .brz .brz-video:not(.koch-keep *) .brz-video-custom-slider::before {
	background-color: rgba(255, 255, 255, .25) !important;
}

.koch-dark .brz .brz-video:not(.koch-keep *) .brz-video-custom-slider .brz-video-custom-progress {
	background-color: #ffffff !important;
}

/* Logo épinglé (header sticky « shrink ») : Blocksy le fait partir de la hauteur du
   logo normal (119px) pour descendre à 44 % (52px) au fil du scroll — trop gros au
   début. Taille finale inchangée ; le départ est ramené à ~72px :
   finale + (hauteur Blocksy - finale) × --koch-logo-depart */
.ct-header [data-sticky*="yes"] [data-id="logo"] .site-logo-container {
	--koch-logo-depart: 0.3; /* 0 = taille finale dès le début, 1 = comportement Blocksy */
	--koch-logo-fin: calc(var(--logo-max-height, 50px) * var(--logo-sticky-shrink, 1));
	height: calc(var(--koch-logo-fin) + (var(--logo-shrink-height, var(--koch-logo-fin)) - var(--koch-logo-fin)) * var(--koch-logo-depart));
}

#gform_confirmation_message_1 {
	font-family: var(--text-font)!important;
	text-align: center!important;
	padding: 100px 20px!important;
}

.koch-dark #gform_confirmation_message_1 {
	color: #fff!important;
}