/* ==========================================================================
   TOUAX MODULAR BUILDING — FEUILLE DE STYLE
   --------------------------------------------------------------------------
   Les pages sont construites avec les éléments natifs WP Bakery / Salient :
   rangées, rangées intérieures, colonnes, Text Block, Button, Image, Divider,
   Toggles, Tabbed Section, Clients.

   Couleurs de fond, marges, colonnes, bordures : réglées dans chaque élément.
   Ce fichier ne contient que :
   1. La charte (police, titres, textes, boutons) — appliquée à tout le site
   2. Les classes à poser dans « Extra class name » :

      Élément Text Block
        tx-eyebrow   surtitre en capitales avec petit trait jaune
        tx-lead      chapô (texte d'introduction plus grand)
        tx-stat      chiffre clé : <strong>1853</strong> puis le libellé
        tx-num       numéro jaune (01, 02…)
        tx-meta      ligne « Secteur • Lieu • Année » en petites capitales
        tx-small     petit texte (mentions)
        tx-contact   liste de coordonnées (sur fond bleu)

      Colonne (onglet « Extra class name » de la colonne)
        tx-card      carte : survol de la bordure en bleu
        tx-step      étape : filet bleu en haut
        tx-step-last étape finale : filet jaune en haut
        tx-benefit   bénéfice : filet vertical à droite (sauf le dernier)
        tx-light-box encadré blanc dans une section bleue (textes foncés)

      Rangée (champ « Extra Class Name » de la rangée)
        tx-dark      section sur fond bleu profond (textes clairs)
        tx-footer    rangées du pied de page

      Image with Animation : tx-img-full (image à la largeur de la colonne)
      Tabbed Section : tx-ranges      (les Toggles / FAQ sont stylés partout)

   3. Le responsive (tablette, mobile)
   ========================================================================== */


/* 0. RÉGLAGES DE LA CHARTE ------------------------------------------------ */
:root {
	--tx-blue: #003375;
	--tx-blue-deep: #001B4C;
	--tx-yellow: #F5B000;
	--tx-yellow-hover: #E0A100;
	--tx-text: #333333;
	--tx-grey: #F3F5F7;
	--tx-line: #D9E0E8;
	--tx-muted: #5A6B80;
	--tx-font: "Montserrat", Arial, Helvetica, sans-serif;
}


/* 1. CHARTE ---------------------------------------------------------------- */

/* Police */
html body,
html body p,
html body li,
html body input,
html body select,
html body textarea,
html body button,
html body .nectar-button,
html body h1, html body h2, html body h3,
html body h4, html body h5, html body h6 {
	font-family: var(--tx-font);
}

/* Textes */
html body,
html body p {
	font-size: 16px;
	line-height: 26px;
	color: var(--tx-text);
}
html body p { font-weight: 400; }

/* Titres : bleu TOUAX par défaut */
html body h1 { font-size: 56px; line-height: 62px; font-weight: 800; letter-spacing: -0.5px; color: var(--tx-blue); }
html body h2 { font-size: 40px; line-height: 46px; font-weight: 800; letter-spacing: -0.3px; color: var(--tx-blue); }
html body h3 { font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: 0; color: var(--tx-blue); }
html body h4 { font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: 0; color: var(--tx-blue); }
html body h5 { font-size: 18px; line-height: 24px; font-weight: 700; letter-spacing: 0; color: var(--tx-blue); }
html body h6 { font-size: 15px; line-height: 20px; font-weight: 700; letter-spacing: 0; color: var(--tx-blue); }

/* Boutons Salient (élément Button) */
html body .nectar-button {
	font-weight: 700;
	font-size: 14px;
	letter-spacing: .6px;
	text-transform: uppercase;
	border-radius: 3px !important;
	box-shadow: none !important;
}
html body .nectar-button.medium { padding: 15px 28px; }

/* Liens dans les textes */
html body .wpb_text_column a { color: var(--tx-blue); font-weight: 700; }
html body .wpb_text_column a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Sections sur fond bleu profond */
.tx-dark h1, .tx-dark h2, .tx-dark h3, .tx-dark h4, .tx-dark h5, .tx-dark h6 { color: #FFFFFF; }
.tx-dark p, .tx-dark li { color: rgba(255, 255, 255, .86); }
.tx-dark .wpb_text_column a { color: #FFFFFF; }


/* 2. CLASSES À POSER ------------------------------------------------------- */

/* Surtitre */
.wpb_text_column.tx-eyebrow p {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--tx-blue);
}
.wpb_text_column.tx-eyebrow p::before {
	content: "";
	flex: none;
	width: 24px;
	height: 2px;
	background: var(--tx-yellow);
}
.tx-dark .wpb_text_column.tx-eyebrow p { color: #FFFFFF; }

/* Chapô */
.wpb_text_column.tx-lead p { font-size: 19px; line-height: 30px; font-weight: 500; }

/* Chiffre clé */
.wpb_text_column.tx-stat p { font-size: 13px; line-height: 19px; font-weight: 500; padding: 0; }
.wpb_text_column.tx-stat strong {
	display: block;
	font-size: 40px;
	line-height: 44px;
	font-weight: 800;
	color: var(--tx-blue);
}

/* Numéro */
.wpb_text_column.tx-num p {
	padding: 0;
	font-size: 14px;
	line-height: 20px;
	font-weight: 800;
	letter-spacing: 1px;
	color: var(--tx-yellow);
}
.wpb_text_column.tx-num.tx-num--big p { font-size: 40px; line-height: 44px; color: var(--tx-blue); }

/* Secteur • Lieu • Année */
.wpb_text_column.tx-meta p {
	padding: 0;
	font-size: 13px;
	line-height: 19px;
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: var(--tx-blue);
}

/* Petit texte */
.wpb_text_column.tx-small p { font-size: 13px; line-height: 19px; color: var(--tx-muted); }

/* Coordonnées */
.wpb_text_column.tx-contact p {
	padding: 18px 0;
	margin: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .18);
	font-size: 14px;
	line-height: 22px;
}
.wpb_text_column.tx-contact p:first-child { border-top: 1px solid rgba(255, 255, 255, .18); }
.wpb_text_column.tx-contact strong { display: block; color: #FFFFFF; font-size: 16px; }

/* Carte */
.wpb_column.tx-card > .vc_column-inner { transition: border-color .15s ease; }
.wpb_column.tx-card:hover > .vc_column-inner { border-color: var(--tx-blue) !important; }

/* Étapes */
.wpb_column.tx-step > .vc_column-inner { border-top: 2px solid var(--tx-blue); padding-top: 24px; }
.wpb_column.tx-step-last > .vc_column-inner { border-top: 2px solid var(--tx-yellow); padding-top: 24px; }

/* Bénéfices */
.wpb_column.tx-benefit > .vc_column-inner { border-right: 1px solid var(--tx-line); padding-right: 24px; }

/* FAQ (élément Toggles) — s'applique à tous les Toggles du site */
html body .toggles .toggle { border-color: var(--tx-line) !important; }
html body .toggles .toggle > .toggle-title a.toggle-heading {
	font-family: var(--tx-font);
	font-size: 19px;
	line-height: 26px;
	font-weight: 700;
	color: var(--tx-blue) !important;
	padding-top: 22px;
	padding-bottom: 22px;
}
html body .toggles .toggle > .toggle-title i { color: var(--tx-blue) !important; }

/* Gammes (élément Tabbed Section, style « Vertical Modern ») — classe : tx-ranges */
html body .tx-ranges .wpb_tabs_nav li a,
html body .tx-ranges .wpb_tabs_nav li a.active-tab {
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	padding: 20px 0 !important;
	border-bottom: 1px solid rgba(255, 255, 255, .18);
	font-family: var(--tx-font);
	font-size: 24px;
	line-height: 30px;
	font-weight: 800;
	color: rgba(255, 255, 255, .55) !important;
}
html body .tx-ranges .wpb_tabs_nav li a:hover,
html body .tx-ranges .wpb_tabs_nav li a.active-tab { color: #FFFFFF !important; }
html body .tx-ranges .wpb_tabs_nav li a.active-tab span {
	box-shadow: inset 0 -3px 0 var(--tx-yellow);
	padding-bottom: 4px;
}
html body .tx-ranges .wpb_tabs_nav li a:before,
html body .tx-ranges .wpb_tabs_nav li a:after { display: none !important; }

/* Image pleine largeur de sa colonne (élément Image with Animation) — classe : tx-img-full */
.tx-img-full,
.tx-img-full .inner,
.tx-img-full .hover-wrap,
.tx-img-full .hover-wrap-inner { width: 100% !important; max-width: 100% !important; }
.tx-img-full img { width: 100% !important; height: auto; display: block; }

/* 3. RESPONSIVE ------------------------------------------------------------ */
@media (max-width: 1100px) {
	html body h1 { font-size: 44px; line-height: 50px; }
	html body h2 { font-size: 34px; line-height: 40px; }
	html body h3 { font-size: 24px; line-height: 30px; }
	html body h4 { font-size: 20px; line-height: 26px; }
	.wpb_column.tx-benefit > .vc_column-inner { border-right: 0; padding-right: 0; }
}

@media (max-width: 690px) {
	html body h1 { font-size: 34px; line-height: 40px; }
	html body h2 { font-size: 28px; line-height: 34px; }
	html body h3 { font-size: 21px; line-height: 27px; }
	html body h4 { font-size: 18px; line-height: 24px; }
	html body, html body p { font-size: 15px; line-height: 24px; }
	.wpb_text_column.tx-lead p { font-size: 17px; line-height: 27px; }
	.wpb_text_column.tx-stat strong { font-size: 32px; line-height: 36px; }
	.wpb_column.tx-benefit > .vc_column-inner { border-bottom: 1px solid var(--tx-line); padding-bottom: 16px; }
	html body .nectar-button { width: 100%; text-align: center; }
}

/* Encadré blanc dans une section bleue (ex. formulaire) — classe de colonne : tx-light-box */
.tx-dark .tx-light-box h1, .tx-dark .tx-light-box h2, .tx-dark .tx-light-box h3,
.tx-dark .tx-light-box h4, .tx-dark .tx-light-box h5, .tx-dark .tx-light-box h6 { color: var(--tx-blue); }
.tx-dark .tx-light-box p, .tx-dark .tx-light-box li, .tx-dark .tx-light-box label { color: var(--tx-text); }
.tx-dark .tx-light-box .wpb_text_column.tx-small p { color: var(--tx-muted); }

/* Pied de page (Section globale « Pied de page TOUAX ») — classe de rangée : tx-footer */
.tx-footer p { font-size: 14px; line-height: 26px; }
.tx-footer .wpb_text_column a { font-weight: 400; color: rgba(255, 255, 255, .82); }
.tx-footer .wpb_text_column a:hover { color: #FFFFFF; }
.tx-footer .wpb_text_column strong { color: #FFFFFF; }
.tx-footer .wpb_text_column.tx-small p,
.tx-footer .wpb_text_column.tx-small a { font-size: 13px; color: rgba(255, 255, 255, .7); }

/* Menu : élément « Demander un devis » en bouton — classe CSS du lien de menu : tx-menu-cta
   (Apparence > Menus > Options de l'écran > cocher « Classes CSS ») */
html body #header-outer #top nav > ul > li.tx-menu-cta > a {
	background: var(--tx-yellow);
	color: var(--tx-blue-deep) !important;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .6px;
	text-transform: uppercase;
	border-radius: 3px;
	padding: 12px 20px !important;
	margin-left: 12px;
	line-height: 1.2;
}
html body #header-outer #top nav > ul > li.tx-menu-cta > a:hover { background: var(--tx-yellow-hover); }
html body #header-outer #top nav > ul > li.tx-menu-cta > a .menu-title-text:after { display: none; }

/* Chiffres clés animés (élément Milestone) */
html body .nectar-milestone .number,
html body .nectar-milestone .number span { font-family: var(--tx-font); font-weight: 800; letter-spacing: -0.5px; }
html body .nectar-milestone .subject {
	font-family: var(--tx-font);
	font-size: 13px;
	line-height: 19px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: var(--tx-text);
	margin-top: 4px;
}
@media (max-width: 690px) {
	html body .nectar-milestone .number,
	html body .nectar-milestone .number span { font-size: 32px !important; line-height: 36px !important; }
}

/* Logos clients (élément Clients) : même hauteur visuelle pour tous les logos */
html body .clients > div { display: flex; align-items: center; justify-content: center; min-height: 96px; }
html body .clients > div img {
	width: auto !important;
	max-width: 78% !important;
	max-height: 52px !important;
	margin: 0 auto;
}
@media (max-width: 690px) {
	html body .clients > div { min-height: 72px; }
	html body .clients > div img { max-height: 40px !important; }
}

/* Bouton contour (style « See Through ») : remplissage bleu au survol */
html body .nectar-button.see-through,
html body .nectar-button.regular { transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease !important; }
html body .nectar-button.see-through:hover {
	background-color: var(--tx-blue) !important;
	border-color: var(--tx-blue) !important;
	color: #FFFFFF !important;
}
html body .nectar-button.see-through:hover span { color: #FFFFFF !important; }
html body .nectar-button.regular:hover { transform: translateY(-2px); }


/* Formulaire de devis (Forminator) */
html body .tx-form .forminator-ui.forminator-custom-form{font-family:var(--tx-font)!important;margin:0!important}
html body .tx-form .forminator-ui .forminator-row{margin-bottom:18px!important}
html body .tx-form .forminator-ui .forminator-label{font-family:var(--tx-font)!important;font-size:13px!important;font-weight:600!important;color:var(--tx-blue-deep)!important;margin-bottom:6px!important;line-height:1.4!important}
html body .tx-form .forminator-ui .forminator-required{color:var(--tx-yellow)!important}
html body .tx-form .forminator-ui .forminator-input,html body .tx-form .forminator-ui .forminator-textarea,html body .tx-form .forminator-ui .select2-selection--single{font-family:var(--tx-font)!important;font-size:15px!important;color:var(--tx-text)!important;background:#fff!important;border:1px solid var(--tx-line)!important;border-radius:3px!important;padding:12px 14px!important;min-height:48px!important;box-shadow:none!important;transition:border-color .25s ease,box-shadow .25s ease}
html body .tx-form .forminator-ui .forminator-textarea{min-height:130px!important}
html body .tx-form .forminator-ui .select2-selection--single .select2-selection__rendered{padding:0!important;line-height:22px!important;color:var(--tx-text)!important}
html body .tx-form .forminator-ui .select2-selection__arrow{top:50%!important;transform:translateY(-50%)!important;right:12px!important}
html body .tx-form .forminator-ui .forminator-input:focus,html body .tx-form .forminator-ui .forminator-textarea:focus,html body .tx-form .forminator-ui .select2-container--open .select2-selection--single{border-color:var(--tx-blue)!important;box-shadow:0 0 0 3px rgba(0,51,117,.12)!important;outline:none!important}
html body .tx-form .forminator-ui ::placeholder{color:#8A96A8!important;opacity:1}
html body .tx-form .forminator-ui .forminator-radio{font-family:var(--tx-font)!important;font-size:15px!important;color:var(--tx-text)!important;margin-right:18px!important}
html body .tx-form .forminator-ui .forminator-radio-bullet,html body .tx-form .forminator-ui .forminator-checkbox-box{border:1px solid var(--tx-line)!important;background:#fff!important}
html body .tx-form .forminator-ui input:checked+.forminator-radio-bullet{border-color:var(--tx-blue)!important}
html body .tx-form .forminator-ui input:checked+.forminator-radio-bullet:before{background:var(--tx-blue)!important}
html body .tx-form .forminator-ui input:checked+.forminator-checkbox-box{background:var(--tx-blue)!important;border-color:var(--tx-blue)!important;color:#fff!important}
html body .tx-form .forminator-ui .forminator-checkbox-label,html body .tx-form .forminator-ui .forminator-checkbox-label p{font-size:13px!important;line-height:1.5!important;color:var(--tx-muted)!important}
html body .tx-form .forminator-ui .forminator-error-message{font-family:var(--tx-font)!important;font-size:12px!important;background:transparent!important;color:#C0392B!important;padding:4px 0 0!important}
html body .tx-form .forminator-ui .forminator-has_error .forminator-input,html body .tx-form .forminator-ui .forminator-has_error .forminator-textarea{border-color:#C0392B!important}
html body .tx-form .forminator-ui .forminator-button-submit{font-family:var(--tx-font)!important;background:var(--tx-yellow)!important;color:var(--tx-blue-deep)!important;font-size:14px!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.04em!important;border:0!important;border-radius:3px!important;padding:16px 30px!important;box-shadow:none!important;transition:background-color .25s ease,transform .25s ease}
html body .tx-form .forminator-ui .forminator-button-submit:hover{background:var(--tx-yellow-hover)!important;transform:translateY(-2px)}
html body .tx-form .forminator-ui .forminator-response-message{font-family:var(--tx-font)!important;border-radius:3px!important}
html body .tx-form .forminator-ui .forminator-response-message.forminator-success{background:#EAF3EC!important;color:#1E6B34!important}
@media (max-width:690px){html body .tx-form .forminator-ui .forminator-button-submit{width:100%!important}}

/* =========================================================================
   Effets de la page d'accueil (pilotés par assets/js/touax-effects.js)
   La classe tx-fx est posée sur <html> seulement si les animations sont
   autorisées : sans elle, tout s'affiche dans son état final.
   ========================================================================= */

/* 1. Photo du premier écran — classe de colonne : tx-hero-media */
html[data-tx-fx]:not(.tx-hero-run) .tx-hero-media .column-image-bg { opacity: 0; animation: txShow .4s ease 2.5s forwards; }
.tx-hero-run:not(.tx-hero-done) .tx-hero-media .column-image-bg { opacity: 0; filter: saturate(.2) contrast(.9); transition: opacity 1.4s ease, filter 1.8s ease; }
.tx-hero-run.tx-hero-reveal .tx-hero-media .column-image-bg { opacity: 1; filter: none; }
.tx-hero-media .tx-sketch { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 2; transition: opacity 1.1s ease .5s; }
.tx-hero-media .tx-sketch svg { position: absolute; display: block; }
.tx-hero-media .tx-sketch line { fill: none; stroke: var(--tx-blue); stroke-width: 1; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: .75; }
.tx-hero-media .tx-sketch.is-drawing line { animation: txDraw .7s cubic-bezier(.4, 0, .2, 1) forwards; }
.tx-hero-reveal .tx-hero-media .tx-sketch { opacity: 0; }
@keyframes txDraw { to { stroke-dashoffset: 0; } }
@keyframes txShow { to { opacity: 1; } }

/* 2. Arguments — classe de rangée : tx-grid-lines */
.wpb_column.tx-benefit > .vc_column-inner { border-right: 0; position: relative; padding-top: 32px; }
.tx-grid-lines .wpb_column.tx-benefit:not(:last-child) > .vc_column-inner::after {
	content: ""; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: var(--tx-line);
	transform-origin: top; transition: transform .55s cubic-bezier(.4, 0, .2, 1);
}
.tx-grid-lines .divider-wrap .divider-border { transform-origin: left; transition: transform .9s cubic-bezier(.4, 0, .2, 1); }
.tx-grid-lines .tx-benefit .wpb_wrapper { transition: opacity .6s ease, transform .6s ease; }
html[data-tx-fx] .tx-grid-lines:not(.is-drawn) .divider-wrap .divider-border { transform: scaleX(0); }
html[data-tx-fx] .tx-grid-lines:not(.is-drawn) .wpb_column.tx-benefit > .vc_column-inner::after { transform: scaleY(0); }
html[data-tx-fx] .tx-grid-lines:not(.is-drawn) .tx-benefit .wpb_wrapper { opacity: 0; transform: translateY(12px); }
.tx-grid-lines .tx-benefit:nth-child(1) > .vc_column-inner::after { transition-delay: .85s; }
.tx-grid-lines .tx-benefit:nth-child(2) > .vc_column-inner::after { transition-delay: 1.25s; }
.tx-grid-lines .tx-benefit:nth-child(3) > .vc_column-inner::after { transition-delay: 1.65s; }
.tx-grid-lines .tx-benefit:nth-child(1) .wpb_wrapper { transition-delay: .5s; }
.tx-grid-lines .tx-benefit:nth-child(2) .wpb_wrapper { transition-delay: .9s; }
.tx-grid-lines .tx-benefit:nth-child(3) .wpb_wrapper { transition-delay: 1.3s; }
.tx-grid-lines .tx-benefit:nth-child(4) .wpb_wrapper { transition-delay: 1.7s; }

/* 3. Secteurs — classe de colonne : tx-card--fill */
.tx-card--fill > .vc_column-inner { transition: border-color .4s ease; }
.tx-card--fill .column-bg-overlay-wrap::after {
	content: ""; position: absolute; inset: 0; background: var(--tx-blue); border-radius: inherit;
	transform-origin: left; transition: transform .6s cubic-bezier(.65, 0, .35, 1), opacity .3s ease;
}
.tx-card--fill .wpb_wrapper { position: relative; z-index: 1; }
.tx-card--fill h5, .tx-card--fill .tx-small p { color: #FFFFFF !important; transition: color .25s ease .45s; }
.tx-card--fill .tx-small p { margin-bottom: 0; }
.tx-card--fill .nectar_icon_wrap { margin-bottom: 0 !important; }
html body .tx-card--fill .nectar_icon svg, html body .tx-card--fill .nectar_icon svg path { fill: var(--tx-yellow) !important; transition: fill .25s ease .45s; }
.tx-card--fill > .vc_column-inner { border-color: var(--tx-blue) !important; }
/* avant le remplissage */
html[data-tx-fx] .tx-card--fill:not(.is-filled) .column-bg-overlay-wrap::after { transform: scaleX(0); }
html[data-tx-fx] .tx-card--fill:not(.is-filled) > .vc_column-inner { border-color: var(--tx-line) !important; }
html[data-tx-fx] .tx-card--fill:not(.is-filled) h5 { color: var(--tx-blue) !important; }
html[data-tx-fx] .tx-card--fill:not(.is-filled) .tx-small p { color: var(--tx-text) !important; }
html[data-tx-fx] body .tx-card--fill:not(.is-filled) .nectar_icon svg, html[data-tx-fx] body .tx-card--fill:not(.is-filled) .nectar_icon svg path { fill: var(--tx-blue) !important; }
/* survol et focus clavier : la carte redevient blanche */
.tx-card--fill.is-filled:hover .column-bg-overlay-wrap::after,
.tx-card--fill.is-filled:focus-within .column-bg-overlay-wrap::after,
html:not([data-tx-fx]) .tx-card--fill:hover .column-bg-overlay-wrap::after { opacity: 0; }
.tx-card--fill.is-filled:hover h5, .tx-card--fill.is-filled:focus-within h5,
html:not([data-tx-fx]) .tx-card--fill:hover h5 { color: var(--tx-blue) !important; transition-delay: 0s; }
.tx-card--fill.is-filled:hover .tx-small p, .tx-card--fill.is-filled:focus-within .tx-small p,
html:not([data-tx-fx]) .tx-card--fill:hover .tx-small p { color: var(--tx-text) !important; transition-delay: 0s; }
html body .tx-card--fill.is-filled:hover .nectar_icon svg path, html body .tx-card--fill.is-filled:focus-within .nectar_icon svg path,
html:not([data-tx-fx]) body .tx-card--fill:hover .nectar_icon svg path { fill: var(--tx-blue) !important; transition-delay: 0s; }

/* 4. Gammes — soulignement jaune qui se dessine, contenu en fondu */
html body .tx-ranges .wpb_tabs_nav li a.active-tab span { box-shadow: none; }
html body .tx-ranges .wpb_tabs_nav li a span { position: relative; display: inline-block; padding-bottom: 4px; transition: transform .3s ease, color .3s ease; }
html body .tx-ranges .wpb_tabs_nav li a span::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--tx-yellow);
	transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}
html body .tx-ranges .wpb_tabs_nav li a.active-tab span { transform: translateX(8px); }
html body .tx-ranges .wpb_tabs_nav li a.active-tab span::after { transform: scaleX(1); }
html[data-tx-fx] .tx-ranges .wpb_tab.visible-tab { animation: txRise .25s ease-out both; }
@keyframes txRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Tablette et mobile */
@media (max-width: 1100px) {
	.tx-grid-lines .wpb_column.tx-benefit > .vc_column-inner::after { display: none; }
	.wpb_column.tx-benefit > .vc_column-inner { padding-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.tx-hero-media .tx-sketch { display: none; }
	.tx-hero-media .column-image-bg { opacity: 1 !important; filter: none !important; animation: none !important; }
}

/* Photo du premier écran sur mobile : bâtiment entier */
@media (max-width: 1100px) {
	.tx-hero-media .column-image-bg { background-size: cover !important; }
}

/* Esquisse du premier écran : traits à main levée */
.tx-hero-media .tx-sketch path { fill: none; stroke: var(--tx-blue); stroke-linecap: round; }

/* Photo « Qui sommes-nous » : la photo vide glisse et se cale, puis le bâtiment apparaît en fondu
   classe de l'image : tx-build-reveal */
.tx-build-frame { opacity: 0; transform: translateX(-80px); transition: opacity .9s ease, transform .9s cubic-bezier(.22, .8, .25, 1); }
.tx-build-frame.is-in { opacity: 1; transform: none; }
.tx-build-host { position: relative; }
.tx-build { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 2; border-radius: inherit; }
.tx-build__ground { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; margin: 0 !important; }
.tx-build__house { position: absolute; inset: 0; opacity: 0; }
.tx-build.is-playing .tx-build__house { opacity: 1; transition: opacity 1s ease 1.15s; }
.tx-build__layer { position: absolute; background-size: 100% 100%; background-repeat: no-repeat; }
@media (prefers-reduced-motion: reduce) { .tx-build { display: none; } .tx-build-frame { opacity: 1; transform: none; } }