/*
Theme Name: Archicool
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Author: HARVEST
Author URI: https://wordpress.org
Description:
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Template: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, accessibility-ready, blog, portfolio, news
*/

/* -------------------------------------------------------------------------- */
/* 0) Imports & resets                                                        */
/* -------------------------------------------------------------------------- */

/* Le navigateur garde le scroll vertical natif, on gère l'horizontal */
.slider-viewport {
  touch-action: pan-y;
  overscroll-behavior: contain; /* évite le rebond iOS/Android dans la section pin */
  -webkit-overflow-scrolling: touch;
}

html,
body {
  min-height: 100vh;
  width: 100% !important;
  overflow-x: hidden !important;
  overscroll-behavior: none;
  /* cursor: none; */
}

a,
a:focus,
a:active {
  outline: 0 !important;
  /* cursor: none; */
}

/* Liens WP + liens généraux */
.wp-block-navigation a:where(:not(.wp-element-button)):focus,
.wp-block-post-title a:where(:not(.wp-element-button)):focus,
.wp-block-site-title a:where(:not(.wp-element-button)):focus,
a:where(:not(.wp-element-button)):focus,
a {
  text-decoration: none !important;
}


#ui-datepicker-div.gravity-theme.ui-datepicker, #ui-datepicker-div.gform-theme--foundation.ui-datepicker{
	z-index: 1000000 !important;
	width: 250px;
}

.gform-theme--framework .gf_progressbar .percentbar_blue{
	background-color: var(--wp--preset--color--contrast) !important;
}

/* Admin bar */
.admin-bar .wp-site-blocks,
.admin-bar .wp-block-template-part {
  margin-top: 32px;
}

/* -------------------------------------------------------------------------- */
/* 1) États init / préchargement                                              */
/* -------------------------------------------------------------------------- */

/* La loading ne doit JAMAIS intercepter les clics une fois cachée */
.loading[hidden],
.loading.is-gone {
  display: none !important;
}

/* Quand l’overlay est à 0 d’opacité, on n’intercepte plus les clics */
.loading:not([data-active="1"]) {
  pointer-events: none !important;
}

.smooth-content {
  visibility: hidden;
}

.hw-product-cat-content{
	padding-bottom: 3vh;
}

.loading {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(26, 26, 26);
  overflow: hidden;
  z-index: 999999;
  opacity: 0;
  backdrop-filter: blur(2px);
  transition: opacity 0.3s ease; /* sécurité si JS en panne */
}

/* Ajustements single product */
.product .smooth-content:before {
  content: "";
  background-color: #fff;
  width: 100%;
  height: 30vh;
  display: block;
  position: absolute;
  top: 0;
  z-index: 1;
}
main .wp-block-group {
  z-index: 2;
}

/* -------------------------------------------------------------------------- */
/* 2) Header / navigation                                                     */
/* -------------------------------------------------------------------------- */

/* Anti-flicker logo pendant l'init */
html.is-prep header .heading .wp-block-site-logo,
html.is-prep header .heading .wp-block-site-logo img {
  transition: none !important;
}

/* Coup de pouce rendu (WebKit) */
header .heading .wp-block-site-logo {
  will-change: transform, opacity;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999999;
  background-color: transparent;
  transition: 0.3s all ease-in-out;
}

header .heading .wp-block-site-logo {
  height: 237px;
  width: 101px;
  transform-origin: top left;
  background-color: var(--wp--preset--color--contrast);
  mask-size: contain;
  transition: 0.4s all cubic-bezier(0.5, 0, 0.58, 1);
}

header .heading .wp-block-site-logo img {
  opacity: 0;
  height: 237px;
  width: 101px;
  transition: 0.4s all cubic-bezier(0.5, 0, 0.58, 1);
}

/* État scrolled */
header.main-tool-bar--scrolled .heading .wp-block-site-logo {
  height: 80px;
  transform-origin: top left;
}

/* Flou d'arrière-plan retiré le 16/09/2026 (demande client). L'en-tête a de
   toute façon un fond blanc opaque (.mainMenu), et le backdrop-filter faisait de
   l'en-tête le bloc conteneur du menu mobile (voir §31). */
header.main-tool-bar--scrolled,
body.woocommerce-page:not(.tax-product_cat) header {
  backdrop-filter: none;
}

header.main-tool-bar--scrolled .logo:before,
body.woocommerce-page:not(.tax-product_cat) .logo:before {
  background-color: #fff;
}

/* Gestion opacité logo image */
body:not(.woocommerce-page) header .wp-block-site-logo img, body.tax-product_cat header .wp-block-site-logo img {
  opacity: 0;
}
body:not(.woocommerce-page) header.main-tool-bar--scrolled .wp-block-site-logo img, body.tax-product_cat header.main-tool-bar--scrolled .wp-block-site-logo img {
  opacity: 1;
}

/* Overlay logo blanc (non scrolled) */
header.mainMenu .wp-block-site-logo a {
  display: block;
  position: relative;
}

body:not(.woocommerce-page) header .wp-block-site-logo a:after, body.tax-product_cat header .wp-block-site-logo a:after {
  content: "";
  position: absolute;
  inset: 9px;
  background: url("/wp-content/uploads/2025/12/logo_white.svg") no-repeat center center /
    contain;
  opacity: 1;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
body:not(.woocommerce-page) header.main-tool-bar--scrolled .wp-block-site-logo  a:after, body.tax-product_cat header.main-tool-bar--scrolled .wp-block-site-logo  a:after {
  opacity: 0;
}

body header .mm-entry-btn{
	color: white;
	text-transform: lowercase;
	font-weight: 500;
}
body header .mm-burger{
	border-color: white;
}
body header .mm-burger span{
	background: white;
}

body header.main-tool-bar--scrolled .mm-entry-btn, body header.main-tool-bar--scrolled .search-icon{
	color: var(--wp--preset--color--contrast, #116483);
}
@media (min-width: 768px) {
		body header.main-tool-bar--scrolled .wc-block-customer-account__account-icon, body header.main-tool-bar--scrolled .wc-block-mini-cart__quantity-badge{
			color: var(--wp--preset--color--contrast, #116483);
		}
}	

body header.main-tool-bar--scrolled .mm-burger{
	border-color: var(--wp--preset--color--contrast, #116483);
}
body header.main-tool-bar--scrolled .mm-burger span{
	background: var(--wp--preset--color--contrast, #116483);
}
body header.main-tool-bar--scrolled .mm-burger:hover span{
	background: white;
}
span:where(.wc-block-mini-cart__badge){
	color: var(--wp--preset--color--contrast, #116483) !important;
	background: white !important;
}
body header.main-tool-bar--scrolled  .wc-block-mini-cart__button  .wc-block-mini-cart__icon:hover{
	fill: white;
}

.gw-mm-item.has-children .gw-mm-item__link a{
	padding: 0 !important;
}



body.woocommerce-page:not(.tax-product_cat) .mainMenu, header.main-tool-bar--scrolled .mainMenu{
  color: #fff;
}

/* Alignement nav */
.wp-block-group.wp-block-group-is-layout-flex,
.mainMenu .wp-block-group.wp-block-group-is-layout-flex {
  align-items: stretch;
}

header .wp-block-navigation,
header .wp-block-navigation__container {
  display: flex;
  align-items: stretch;
}

/* Items (WP nav + Getwid) */
header .mainMenu .wp-block-navigation-item {
  align-self: stretch;
  display: flex;
}
header .mainMenu .wp-block-navigation-item__content {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
}

/* Lien nav WP */
header
  .mainMenu
  .wp-block-navigation
  .wp-block-navigation-item__content.wp-block-navigation-item__content {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Getwid: pleine largeur + répartition */
.mainMenu .wp-block-getwid-megamenu {
  flex: 1 1 auto;
  min-width: 0;
}

.mainMenu .wp-block-getwid-megamenu .gw-mm__wrapper,
.mainMenu .wp-block-getwid-megamenu .gw-mm__content-wrapper,
.mainMenu .wp-block-getwid-megamenu .gw-mm__content {
  width: 100%;
}

/* --- 1. ÉTAT INITIAL --- */
.mega-content-panel {
    display: block !important; /* On utilise block pour permettre les transitions */
    position: absolute;        /* On les superpose pour éviter les sauts */
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s;
    pointer-events: none;      /* Empêche de cliquer à travers un panneau invisible */
}

/* On prépare la colonne de droite pour la superposition */
.mega-menu-container .wp-block-column:last-child {
    position: relative;
    min-height: 400px; /* À ajuster selon ton contenu */
}

/* --- 2. AFFICHAGE DU CONTENT-0 (Défaut) --- */
.mega-menu-container .content-0 {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* --- 3. LOGIQUE DE SURVIE (C'est ici que ça se joue) --- */

/* Si on survole n'importe quel trigger OU n'importe quel panel spécifique, on cache le 0 */
.mega-menu-container:has(.trigger-group:hover) .content-0,
.mega-menu-container:has(.mega-content-panel:not(.content-0):hover) .content-0 {
    opacity: 0;
    visibility: hidden;
    transition-delay: 0s; /* Disparition immédiate du neutre */
}

/* AFFICHAGE DES CONTENUS SPÉCIFIQUES */
/* On ajoute un transition-delay de 0.2s au survol sortant pour laisser le temps à la souris de voyager */
.mega-menu-container:has(.trigger-1:hover) .content-1,
.mega-menu-container:has(.content-1:hover) .content-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 10;
    transition-delay: 0s; /* Apparition immédiate */
}

/* On ajoute un délai quand on QUITTE pour que le panneau reste affiché un court instant */
.mega-menu-container .content-1 {
    transition-delay: 0.3s; 
}

/* RÉPÉTER POUR LES AUTRES (Trigger 2, etc.) */
.mega-menu-container:has(.trigger-2:hover) .content-2,
.mega-menu-container:has(.content-2:hover) .content-2 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 10;
    transition-delay: 0s;
}
.mega-menu-container .content-2 { transition-delay: 0.3s; }

/* --- 4. MAINTIEN DU TRIGGER "ALLUMÉ" --- */
.mega-menu-container:has(.trigger-1:hover) .trigger-1 > div,
.mega-menu-container:has(.content-1:hover) .trigger-1 > div {
    background-color: #a6c8d6 !important;
    color: white !important;
}

/* Aligner les boutons sur la fiche produit */
.single-product .cart {
/*     display: flex; */
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.single-product .rent-btn-wrapper{
	margin-left: 131px;
}


.single-product button.open-quote-popin{
	float: left;
}

/* Forcer le bouton de location à ne pas envoyer le formulaire WooCommerce */
.open-rent-popin {
    cursor: pointer;
    border: none;
    padding: 0 20px;
    display: inline-block;
    font-family: "Poppins";
}

/* Style de la modale pour qu'elle passe au dessus de tout en FSE */
#location-modal {
    backdrop-filter: blur(5px);
}

/* Container du bouton de location sur la fiche produit */
.custom-location-container {
    display: block;
    width: 100%;
}

/* Style du bouton de location pour se démarquer du bouton d'achat */
.open-rent-popin {
    color: #fff !important;
    border: none;
    cursor: pointer;
    transition: opacity 0.2s;
    width: 100%; /* Par défaut en pleine largeur sur mobile */
/*     background-color: var(--wp--preset--color--accent-1); */
        align-items: center;
    display: flex !important;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
}



.upsells{
	background-color: rgba(255, 255, 255, 0.79);
	padding: 60px;
}

@media (min-width: 768px) {
    .open-rent-popin {
        width: auto; /* Reprend sa taille normale sur desktop */
    }
}

.open-rent-popin:hover {
    opacity: 0.8;
}

.woocommerce-variation-add-to-cart {
    display: flex !important;
    flex-wrap: wrap; /* Permet de revenir à la ligne sur petit mobile si besoin */
    align-items: center;
    gap: 10px; /* Espace entre les deux boutons */
}


.harvest-atc-buttons .open-rent-popin{
	 flex: 1; /* Optionnel : permet aux deux boutons de se partager l'espace */
}

/* Ajuster le bouton de location pour qu'il ne prenne pas toute la largeur */
.open-rent-popin {
    margin-top: 20px !important;
    width: auto !important;
   
    min-width: fit-content;
}

/* Correction pour mobile : empiler si l'écran est trop étroit */
@media (max-width: 480px) {
    .woocommerce-variation-add-to-cart {
        flex-direction: column;
        align-items: stretch;
    }
}


/* Container global de la modale pour GF */
.rental-form-container {
    padding-top: 15px;
}

/* Style des champs de texte */
.gform_wrapper input[type="text"], 
.gform_wrapper input[type="email"], 
.gform_wrapper input[type="tel"], 
.gform_wrapper textarea,
.gform_wrapper select {
 
    padding: 12px !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    margin-bottom: 3px !important;
    background: #f9f9f9 !important;
    font-size: 14px !important;
    line-height: normal !important;
}

.gform_wrapper textarea{
	width: 100%;
}

.gform_wrapper select {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}



/* Style des labels (Gaz mesuré, Nom, etc.) */
.gfield_label {
    display: block !important;
    font-weight: 600 !important;
    margin-bottom: 5px !important;
    font-size: 0.9rem !important;
}


/* Masquer les instructions inutiles (comme 'champs requis') pour épurer */
.gfield_required {
    color: #d63031;
    margin-left: 4px;
}

.gform_footer {
    padding: 0 !important;
    margin: 0 !important;
}






/* UL flex */
.gw-mm__content {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
  width: 100%;
}

/* Chaque item prend une part égale */
.mainMenu .wp-block-getwid-megamenu .gw-mm-item,
.gw-mm-item {
  flex: 1 1 0;
  display: flex;
  align-items: stretch;
  height: 100%;
}

/* Zone cliquable + toggle */
.gw-mm-item__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.gw-mm-item__link > a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  padding: 0 var(--wp--preset--spacing--30);
  text-align: center;
}

.gw-mm-item__toggle {
  display: flex;
  align-items: center;
  height: 100%;
  flex: 0 0 auto;
}

/* Hauteur “cellule” + séparation */
.mainMenu .wp-block-navigation-item,
.wp-block-getwid-megamenu-item > .gw-mm-item__link a {
  flex: 1 1 0;
  display: flex;
  border-right: 2px solid #fff;
}

/* CTA account/cart/search dans header */
.mainMenu .wp-block-woocommerce-customer-account,
.mainMenu .wc-block-mini-cart,
.mainMenu .wp-block-search {
  display: flex;
  align-items: center;
}

.wp-block-woocommerce-filled-mini-cart-contents-block{
	background-color: white;
}

header.open {
  height: 100%;
}

/* Hover & états actifs */
.wp-block-navigation
  .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {

}

.current-menu-item,
.post-type-archive-projets .projets,
.single-projets .projets {
}

/* Forcer l'ouverture (JS) */
.gw-mm-item.has-children.keep-open > .gw-mm-item__dropdown-wrapper {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto;
  height: auto;

}
.gw-mm-item__dropdown{
	  padding: 2px !important;
}

#amm-root{
  align-items: center;
}
@media (max-width: 768px) {
  header .MobileOff{
    display: none !important;    
  }
  #amm-root{
    padding-right: 20px;
    flex: 0;
  }
}
@media (min-width: 768px) {
  header .MobileOn{
    display: none !important;    
  }
}
 
/* -------------------------------------------------------------------------- */
/* 3) Hero / Intro                                                            */
/* -------------------------------------------------------------------------- */

section.intro {
  position: relative;
}
section.intro .title {
  position: relative;
  z-index: 2;
}
section.intro .two {
  position: relative;
  z-index: 3;
}
section.intro .lines {
  position: relative;
  z-index: 1;
}
section.two {
  margin-top: -50vh;
}

/* -------------------------------------------------------------------------- */
/* 4) Éléments graphiques (cercles, logo, marks, gradients)                    */
/* -------------------------------------------------------------------------- */

.circles {
  position: fixed;
  min-height: 100vh;
  width: 100vw;
}

.circle {
  position: absolute;
}
.circle svg {
  width: 100% !important;
  height: 30vw;
}
.circle.one {
  right: 5vw;
  top: 0;
  visibility: hidden;
}
.circle.two {
  left: 5vw;
  top: 50vh;
  visibility: hidden;
}

.logo:before {
  content: "";
  display: block;
  height: 100%;
  width: 400%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  background-color: transparent;
}
.logo .wp-block-site-logo {
  z-index: 2;
  position: relative;
}
.logo svg {
  fill: red;
}

/* Soulignement animé */
mark a {
  position: relative;
  text-decoration: none;
  background: linear-gradient(
      to right,
      var(--wp--preset--color--contrast),
      var(--wp--preset--color--contrast)
    ),
    linear-gradient(
      to right,
      var(--wp--preset--color--primary),
      var(--wp--preset--color--primary)
    );
  background-size: 100% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: all 400ms;
}

mark a:hover {
  color: var(--wp--preset--color--primary);
  background-size: 0 2px, 100% 2px;
}

.gradient {
  background: -webkit-linear-gradient(var(--wp--preset--color--base), #313131);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Boutons 

button:hover {
  background-color: var(--wp--preset--color--contrast) !important;
  color: #fff !important;
}*/

.download .wp-block-button__link{
	padding: 8px 17px !important;
	font-size: 0.8rem !important;
}


.add_to_cart_button:before{
	
}
.telechargement h4{
	margin-bottom: 5px !important;
}


/* -------------------------------------------------------------------------- */
/* 5) Curseur “flair” + sidecar                                                */
/* -------------------------------------------------------------------------- */

/* Desktop */
@media screen and (min-width: 600px) {
  :not(.wp-admin) .flair {
    position: fixed;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 10000;
    mix-blend-mode: difference;
  }

  .flair svg {
    width: 100%;
    height: 100%;
  }

  .flair #currentShape {
    fill: #ffd07b;
  }

  /* Ne pas masquer le curseur dans les inputs */
  :where(
      input[type="text"],
      input[type="search"],
      input[type="email"],
      input[type="number"],
      input[type="password"],
      textarea,
      [contenteditable="true"]
    ) {
    cursor: text !important;
  }

  .flair {
    pointer-events: none;
    cursor: none !important;
  }
}

/* Mobile */
@media screen and (max-width: 600px) {
  .flair {
    display: none;
  }
}

/* Vignette qui suit la souris */
.cursor-sidecar {
  position: fixed;
  top: 0;
  left: 8%;
  width: clamp(150px, 15vw, 300px);
  aspect-ratio: 1 / 1;
  background: center / cover no-repeat;
  border-radius: 50%;
  pointer-events: none;
  z-index: 100;
  opacity: 0;
  transform: translate(-50%, -50%);
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.35);
}

@media (pointer: coarse) {
  .cursor-sidecar {
    display: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 6) Texte scindé / animations de lignes                                     */
/* -------------------------------------------------------------------------- */

.lines {
  position: relative;
  will-change: transform;
}
.split-line,
.line-wrap,
.line {
  display: block;
  overflow: hidden;
}

.line-inner {
  display: inline-block;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Hover “exp” */
.exp .line {
  transition: all 0.5s ease-in-out;
  cursor: pointer;
  transform-origin: left;
}
.exp .line:hover {
  transform: scale(1.1);
}

/* -------------------------------------------------------------------------- */
/* 7) Blocs divers (citation, grilles, listes, etc.)                           */
/* -------------------------------------------------------------------------- */

.citation > div {
  background: linear-gradient(
    to right,
    var(--wp--preset--color--contrast) 50%,
    rgb(37, 37, 37) 50%
  );
  background-size: 200% 100%;
  background-position-x: 100%;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}
.light .citation > div {
  background: linear-gradient(
    to right,
    var(--wp--preset--color--base) 50%,
    rgb(37, 37, 37) 50%
  );
}

.siteWeb figure::before {
  content: "";
  display: block;
  width: 100%;
  height: 43px;
  background-color: #262626;
  border-radius: 25px 25px 0 0;
}

.grid img {
  border-radius: 20px;
}

/* Grid logos */
.wp-block-group.is-layout-grid {
  display: grid;
  align-items: center;
  justify-items: center;
  gap: 2rem;
}
.wp-block-group.is-layout-grid figure {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.wp-block-group.is-layout-grid img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.selected {
  color: var(--wp--preset--color--custom-rose-cp) !important;
}

.pages_title {
  position: relative;
  z-index: 100;
}

/* Effet machine à écrire : curseur clignotant */
.pages_title .tw-caret {
  display: inline-block;
  width: 0.06em;
  height: 1em;
  margin-left: 0.04em;
  vertical-align: -0.08em;
  background: currentColor;
  animation: tw-blink 1s steps(1) infinite;
}
/* Pendant la frappe : curseur plein, sans clignotement */
.pages_title.is-typing .tw-caret {
  animation: none;
  opacity: 1;
}
@keyframes tw-blink {
  0%, 49.99% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

.SiteVids video {
  border-radius: 0 !important;
}

/* Liste pages contenu */
.ListeInfos p {
  margin: 0;
}
.ListeInfos a {
  display: flex !important;
  text-decoration: none !important;
  margin: 0;
  padding-bottom: 10px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
  transition: transform 0.3s ease-in-out;
}
.ListeInfos a::after {
  content: "→";
  font-weight: 400;
  font-size: 40px;
  color: inherit;
}
.ListeInfos a:hover {
  color: var(--wp--preset--color--primary) !important;
  transform: translateX(5px);
}
.ListeInfos a:hover::after {
  transform: translateX(5px);
}
.ListeInfos .wp-block-navigation .wp-block-navigation-item{
	display: block !important;
}

.home-picto-prod{
  display: flex !important;
  align-items: center !important;
}

/* -------------------------------------------------------------------------- */
/* 8) Footer                                                                  */
/* -------------------------------------------------------------------------- */

@media (min-width: 1017px) {
  .bottom {
    margin-top: -100px;
    z-index: 300;
    position: relative;
  }
  .details .wp-block-group {
	  z-index: 2;
	  position: relative;
  }
  .details:before{
	   content: "";
	    background-color: var(--wp--preset--color--accent-4);
	    width: 100%;
	    height: 30vh;
	    display: block;
	    position: absolute;
	    top: 0;
	    z-index: 1;
  }
}

/* -------------------------------------------------------------------------- */
/* 9) Images “qui”                                                            */
/* -------------------------------------------------------------------------- */

.imgQui img {
  max-height: 90vh;
  vertical-align: top;
}

/* -------------------------------------------------------------------------- */
/* 10) Accordéon                                                              */
/* -------------------------------------------------------------------------- */

.accordion {
  width: 250px;
  margin: 15px;
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
}
.accordion-menu {
  padding: 10px;
  cursor: pointer !important;
  user-select: none;
  position: relative;
}
.accordion-content {
  height: 0;
  overflow: hidden;
  font-size: 14px;
}
.accordion-content.expanded {
  height: 0;
  overflow: hidden; /* semble volontaire */
}
.accordion-plus,
.accordion-minus {
  position: absolute;
  top: 7px;
  right: 8px;
}

/* -------------------------------------------------------------------------- */
/* 11) Formulaires (Gravity Forms)                                            */
/* -------------------------------------------------------------------------- */

.gform_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper .gform_page_footer input[type="submit"]:hover {
  transform: scale(1.05);
}

.gfield_required_text,
.gform_required_legend {
  display: none !important;
}

/* -------------------------------------------------------------------------- */
/* 12) Mise en page Contact                                                   */
/* -------------------------------------------------------------------------- */

.contact-page .circle.one,
.contact-page .circle.two {
  display: flex;
  position: relative !important;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  transform: rotate(90deg) !important;
}
.contact-page .circle.one {
  right: -13.7vw !important;
}
.contact-page .circle.two {
  left: -13.7vw;
  top: -7vh;
}

/* -------------------------------------------------------------------------- */
/* 13) Sections “for” (marquee + SVG latéraux)                                */
/* -------------------------------------------------------------------------- */

.panel .marquee-track {
  display: flex;
  gap: clamp(2rem, 6vw, 8rem);
  will-change: transform;
  transform: translate3d(0, 0, 0);
}

.panel .wp-block-heading {
/*   white-space: nowrap; */
  display: inline-block;
}

section.for {
  position: relative;
  overflow: visible;
}
section.for .panel {
  position: relative;
  z-index: 2;
}

section.for .svg1,
section.for .svg2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 0;
  display: grid;
  place-items: center;
}

section.for .svg1 {
  left: 0;
}
section.for .svg2 {
  right: 0;
}

section.for .svg1 svg,
section.for .svg2 svg {
  width: min(35vw, 50vw);
  height: auto;
  transform-box: fill-box;
  transform-origin: 50% 50%;
}

/* -------------------------------------------------------------------------- */
/* 14) Éléments décoratifs positionnés                                        */
/* -------------------------------------------------------------------------- */

.get-on-front {
  position: relative;
  z-index: 999 !important;
}

.ligne-verte,
.beige-ligne,
.bleu-ligne {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.ligne-verte2 {
  position: absolute;
  right: 10rem;
}

.ligne-verte {
  bottom: 10rem;
  width: 1rem;
}
.beige-ligne {
  bottom: 18rem;
  width: 2rem;
}
.bleu-ligne {
  bottom: -7rem;
  width: 2rem;
  z-index: 2;
}

.savoir-faire {
  position: relative;
  left: 2rem;
}
.creativite {
  position: relative;
  left: -2rem;
}

.lignes {
  position: relative;
  left: 18rem;
  top: 15rem;
}
.arcs-cercles {
  position: relative;
  left: -5rem;
  top: 9rem;
}

.arcs-cercles .wp-image-706 {
  width: 8rem !important;
}
.lignes .wp-image-699 {
  width: 10rem !important;
}

/* Heart anim */
.heart img {
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 30%;
  width: 40vh;
  animation: heartFadeInOut 2s infinite;
}

@keyframes heartFadeInOut {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(0.97);
  }
  35% {
    transform: scale(0.9);
  }
  45% {
    transform: scale(1.1);
  }
  55% {
    transform: scale(0.9);
  }
  65% {
    transform: scale(1.1);
  }
  75% {
    transform: scale(1.03);
  }
  100% {
    transform: scale(1);
  }
}

/* -------------------------------------------------------------------------- */
/* 15) Utilitaires perf                                                       */
/* -------------------------------------------------------------------------- */

[data-reveal],
[data-parallax],
[data-item] {
  will-change: transform, opacity;
  transform: translateZ(0);
}

/* -------------------------------------------------------------------------- */
/* 16) WooCommerce                                                             */
/* -------------------------------------------------------------------------- */

/* Onglets Woo (bloc product-details) */
.wp-block-woocommerce-product-details .tabs {
  display: none !important;
}
.wp-block-woocommerce-product-details .wc-tab {
  display: block !important;
}

.wc-flat-tabs {
  margin-top: 2rem;
}
.wc-flat-section {
  padding: 1rem 0;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.wc-flat-section:first-child {
  border-top: 0;
}
.wc-flat-title {
  margin: 0 0 0.5rem;
  font-size: 2.5rem;
  font-weight: 600;
  color: var(--wp--preset--color--accent-1) !important;
}

.split-list-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem 2rem;
}
.split-list-columns ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.split-list-columns li {
  margin-bottom: 0.5rem;
}
.split-col li ul {
  margin-left: 1rem;
}

.woocommerce div.product div.images {
  margin-bottom: 0 !important;
}

.woocommerce div.product .woocommerce-tabs .panel{
	margin: 0;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .zoomImg {
  background-color: var(--wp--preset--color--accent-6) !important;
}

.woocommerce .wp-block-woocommerce-product-image-gallery {
  max-width: 100%;
}
.woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image {
  overflow: visible !important;
}

/* Cart / checkout */
.wp-block-woocommerce-checkout-order-summary-block {
  background-color: var(--wp--preset--color--accent-6);
}
.wc-block-cart__main {
  background-color: #fff;
}

/* Cards produits (hover image + title) */
.wc-block-product .wp-block-tiptip-hyperlink-group-block {
  display: block;
  text-decoration: none;
  transition: transform 0.3s ease;
}
.wc-block-product .wp-block-cover {
  border-radius: 50%;
  overflow: hidden;
}
.wc-block-product .wp-block-cover__image-background {
  transition: transform 0.6s ease;
  transform-origin: center;
  will-change: transform;
}
.wc-block-product .wp-block-post-title {
  transition: transform 0.35s ease, color 0.3s ease;
  will-change: transform;
  min-height: 40px;
}
.wc-block-components-product-summary strong {
  font-weight: 600;
  color: var(--wp--preset--color--accent-1) !important;
}
.page-numbers{
padding: 2px 5px;
}

.page-numbers.current{
	background-color: var(--wp--preset--color--contrast); 
	color: white;
	
}
.page-numbers:hover{
	background-color: var(--wp--preset--color--accent-2);
}

/* Hover/focus desktop seulement */
@media (hover: hover) and (pointer: fine) {
  .wc-block-product
    .wp-block-tiptip-hyperlink-group-block:hover
    .wp-block-cover__image-background,
  .wc-block-product
    .wp-block-tiptip-hyperlink-group-block:focus-visible
    .wp-block-cover__image-background {
    transform: scale(1.06);
  }

  .wc-block-product .wp-block-tiptip-hyperlink-group-block:hover .wp-block-post-title,
  .wc-block-product
    .wp-block-tiptip-hyperlink-group-block:focus-visible
    .wp-block-post-title {
    transform: translateY(-6px);
  }

  .wc-block-product .wp-block-tiptip-hyperlink-group-block:hover {
    transform: translateY(-3px);
  }
}

/* Focus clavier */
.wc-block-product .wp-block-tiptip-hyperlink-group-block:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 16px;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .wc-block-product .wp-block-tiptip-hyperlink-group-block,
  .wc-block-product .wp-block-cover__image-background,
  .wc-block-product .wp-block-post-title {
    transition: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 17) Getwid Mega Menu : états + styles                                      */
/* -------------------------------------------------------------------------- */

/*
.wp-block-getwid-megamenu-item:hover > .gw-mm-item__link a,
.keep-open .gw-mm-item__link a {
  background-color: var(--wp--preset--color--accent-1);
}
*/

.gw-mm-item__dropdown-content {
  padding: 0 !important;
}
.gw-mm-item__dropdown .gw-mm-item__dropdown-wrapper .gw-mm-item__dropdown-content {
  padding: 0 !important;
  background-color: #fff;
}
.gw-mm-item__dropdown > * {
  margin-block-start: 0 !important;
}

.gw-mm.is-mobile.is-opened .gw-mm__content-wrapper {
  left: 0 !important;
  background: linear-gradient(90deg, rgb(0, 104, 96) 0%, rgb(1, 163, 139) 100%);
}

.wp-block-getwid-megamenu.is-mobile {
  padding: 40px;
}

/* Sous-menus alignés à droite sur certains items */
.societe .gw-mm-item__dropdown-wrapper,
.patients .gw-mm-item__dropdown-wrapper,
.technologie .gw-mm-item__dropdown-wrapper {
  width: 200px !important;
  right: 0 !important;
  left: auto !important;
}

.societe .gw-mm-item__dropdown a,
.patients .gw-mm-item__dropdown a,
.technologie .gw-mm-item__dropdown a {
  padding: 15px;
}

/* Mobile layout spacing */


/* Item contact (icône only) */
.wp-block-getwid-megamenu-item.contact > .gw-mm-item__link a {
  font-size: 0;
}
.wp-block-getwid-megamenu-item.contact > .gw-mm-item__link a:hover {
  background-color: transparent;
}
.wp-block-getwid-megamenu-item .gw-mm-item__link a:before {
  background-size: contain !important;
  display: block;
}

/* Menu couleurs hover */
.wp-block-navigation-item__content:hover a span {
  color: #fff;
}
.gw-mm-item__link{
  transition: 0.4s all cubic-bezier(0.43, 0.195, 0.02, 1);
}
.gaz .gw-mm-item__link:hover, .gaz.is-opened .gw-mm-item__link{
  background-color: var(--wp--preset--color--accent-2);
}
.poussiere .gw-mm-item__link:hover, .poussiere.is-opened .gw-mm-item__link{
  background-color: var(--wp--preset--color--accent-3);
}
.services .gw-mm-item__link:hover, .services.is-opened .gw-mm-item__link{
  background-color: var(--wp--preset--color--accent-1);
}

.gw-mm-item__link:hover{
	color: white;
}

.menuVert {
  border-radius: 0 0 0 40px;
}

/* -------------------------------------------------------------------------- */
/* 18) Blocs produits/catégories custom                                       */
/* -------------------------------------------------------------------------- */

.hw-product-categories--grid .hw-product-categories__grid {
  gap: 2px;
  background-color: var(--wp--preset--color--accent-2);
  border: 2px solid var(--wp--preset--color--accent-2);
}

.hw-product-categories--grid .hw-product-categories__grid li {
  background-color: rgba(255, 255, 255);
  backdrop-filter: blur(10px);
}

.hw-product-categories--grid .hw-product-categories__grid li a span {
  padding: 20px;
}

.hw-product-categories__name {
  margin-top: 0;
  color: var(--wp--preset--color--accent-2);
  background-color: rgba(153, 187, 202, 0.21);
}

.hw-product-categories__media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
  transition: 0.4s all cubic-bezier(0.43, 0.195, 0.02, 1);
}

.hw-product-categories__link {
  gap: 0 !important;
  padding: 0 !important;
  align-items: inherit;
}

.hw-product-categories__link:hover .hw-product-categories__media {
  background-color: rgba(153, 187, 202, 0.21);
}

.hw-product-categories__image {
  max-height: 100%;
  width: auto;
  display: block;
}

/* Vidéos */
.wp-block-video {
  overflow: hidden;
  border-radius: 50px;
}

/* Thumbs Woo */
.flex-control-thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}


.woocommerce div.product div.images .flex-control-thumbs li {
	width: inherit;
	float: inherit;
  background-color: #fff;
}

/* Divers */
.head {
  overflow: hidden;
}
.chiffres {
  backdrop-filter: blur(10px);
}



/* -------------------------------------------------------------------------- */
/* 19) Bannières / overlays                                                    */
/* -------------------------------------------------------------------------- */

.wp-block-cover.banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 42.81%,
    rgba(255, 255, 255, 0.24) 60.57%,
    rgba(255, 255, 255, 0.47) 78.26%,
    rgba(255, 255, 255, 1) 95.29%
  );
}

.wp-block-cover.bg_chiffres::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgb(255 255 255) 42.81%,
    rgb(255 255 255 / 27%) 60.57%,
    rgb(255 255 255 / 0%) 78.26%,
    rgb(255 255 255 / 0%) 95.29%
  );
}
.wp-block-cover.bg_histoire::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgb(255 255 255) 15%,
    rgb(255 255 255 / 0%) 60.57%,
    rgb(255 255 255 / 0%) 78.26%,
    rgb(255 255 255 / 0%) 95.29%
  );
}

/* -------------------------------------------------------------------------- */
/* 20) Intro : backgrounds animés                                             */
/* -------------------------------------------------------------------------- */

.intro {
  transition-delay: 1s;
  transition: 0.8s all cubic-bezier(0.43, 0.195, 0.02, 1);
  background: url(img/trefle.svg) no-repeat;
  background-size: contain;
  background-position: calc(50% + var(--bg-x, 0px)) calc(50% + var(--bg-y, 0px));
  position: relative;
  will-change: transform;
}

.intro.active-trigger {
  background-position: 85% 50%;
}

.intro:after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;

  transition: 0.8s all cubic-bezier(0.43, 0.195, 0.02, 1);
  transition-delay: 0.4s;

  background: url(img/produits.png) no-repeat 70% center;
  background-size: contain;

  --after-mx: 0px;
  --after-my: 0px;
  margin-left: var(--after-mx);
  margin-top: var(--after-my);
  margin-right: calc(var(--after-mx) * -1);
  margin-bottom: calc(var(--after-my) * -1);

  top: 0;
  right: 0;
  opacity: 0;
}

.active-trigger.intro:after {
  opacity: 1;
  top: -20px;
}

.bloc_services, .bloc_choix {
  margin-top: -20vh !important;
}

/* -------------------------------------------------------------------------- */
/* 21) Listes custom (role=list)                                              */
/* -------------------------------------------------------------------------- */

ul[role="list"] {
  columns: 1;
  column-gap: 2rem;
  list-style: none; /* on supprime les puces natives */
  margin: 0;
  padding: 10px 3px 27px 40px;
  list-style-position: outside;
}

ul[role="list"] li {
  position: relative;
  break-inside: avoid;
  margin-bottom: 0.5em;
  padding-left: 1.8em;
}

/* Puces (niveau 1/2/3) : mêmes dimensions, mais gardé tel quel */
ul[role="list"] > li::before,
ul[role="list"] > li > ul > li::before,
ul[role="list"] > li > ul > li > ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em;
  width: 1em;
  height: 1em;
}

/* -------------------------------------------------------------------------- */
/* 22) Défil / marquee                                                        */
/* -------------------------------------------------------------------------- */

.defil {
  overflow: hidden;
  white-space: nowrap;
  position: relative;
}

.defil-inner {
  display: inline-flex;
  align-items: center;
  animation: scrollLoop var(--speed, 40s) linear infinite;
}

.defil h2 {
  display: inline-block;
  padding-right: 4rem;
  white-space: nowrap;
  margin: 0;
}

@keyframes scrollLoop {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* -------------------------------------------------------------------------- */
/* 23) Dropdown interne (menu déroulant)                                      */
/* -------------------------------------------------------------------------- */

.gw-mm-item .gw-mm-item .gw-mm-item__dropdown-wrapper {
  opacity: 0;
  transition: 0.3s all ease-in-out;
  height: 0 !important;
}
.gw-mm-item .gw-mm-item:hover .gw-mm-item__dropdown-wrapper {
  opacity: 1;
  min-height: auto;
}

/* -------------------------------------------------------------------------- */
/* 24) Typo : sup                                                            */
/* -------------------------------------------------------------------------- */

h1 sup,
h2 sup,
h3 sup,
sup,
span.reg-mark {
  font-size: 0.6em;
  vertical-align: super;
}

sup {
  line-height: 0;
}

h1:has(span.reg-mark),
h2:has(span.reg-mark) {
  position: relative;
}

/* -------------------------------------------------------------------------- */
/* 25) Techno section overflow (desktop)                                      */
/* -------------------------------------------------------------------------- */

@media (min-width: 1024px) {
  .techno-section {
    position: relative;
    border-radius: 0 !important;
    background: transparent !important;
    z-index: 0;
  }

  .techno-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: 400px;
    background: var(--wp--preset--gradient--custom-jaune, inherit);
    max-height: 70%;
  }

  .techno-section .technos {
    position: relative;
  }
  .MobileOn{
    display: none ;
  }
  
  
}

/* Mobile : aucun débordement */
@media (max-width: 1023px) {
  .techno-section .technos {
    transform: none;
  }
  .techno-section {
    background: var(--wp--preset--gradient--custom-jaune, inherit) !important;
    border-radius: 400px;
  }
  .MobileBanner{
    display: flex;
    flex-direction: column;
    max-width:100% !important;
  }
 
  .MobileOff{
    display:none;
  }
  .BigMarge{
    padding-right: 0 !important;
    margin-top: -60px !important;
  }
  .BigMarge .wp-block-columns{
    padding: 0 !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 26) Divers UI                                                              */
/* -------------------------------------------------------------------------- */

body .wp-block-buttons .wp-block-button__link {
  width: auto !important;
}

.wp-block-button__link, .open-quote-popin, .open-rent-popin {
  position: relative;
  font-family: "Poppins";
}

.wc-block-product .wp-block-button__link{
	border: 4px solid var(--wp--preset--color--contrast) ;
}


.mapster-wp-maps {
  border-radius: 50% !important;
  overflow: hidden !important;
}

.variations th {
  padding: 0 !important;
}

/* Panels Woo tabs */
.woocommerce-Tabs-panel--description {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--accent-2) !important;
}
.woocommerce-Tabs-panel--description a{
	color: rgba(255, 255, 255, 0.96);
}

.woocommerce-Tabs-panel--additional_information,
.woocommerce-Tabs-panel--description,
.wp-block-woocommerce-product-specifications {
  padding: 4rem !important;
}
.woocommerce-Tabs-panel--additional_information, .wp-block-woocommerce-product-specifications {
  background-color: #fff;
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td,
.woocommerce table.shop_attributes td a,
.woocommerce table.shop_attributes td p {
  font-size: 14px;
}
.woocommerce table.shop_attributes th {
  text-align: left;
}
.woocommerce table.shop_attributes td {
  font-style: normal;
  text-align: right;
}

.BigImage{
  width: 700px;
}
.CadreImg{
    position: relative !important;
    display: inline-block; 
}

.CadreImg::after{
    content: "";
    position: absolute;
    display:block;
    top: 50px; 
    left: 50px;
    width: 20rem;
    height: 20rem;
    background-image: url('/wp-content/uploads/Rectangle.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 10;
    pointer-events: none;
}
.TopGroup{
  z-index: 5 !important;
}

/* -------------------------------------------------------------------------- */
/* 27) Mega dropdown custom (plein écran)                                     */
/* -------------------------------------------------------------------------- */

.wp-block-navigation-item.has-mega {
  position: relative;
}

.mega-dropdown {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 100%;
  width: 100vw;
  max-width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  background: #fff;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
  z-index: 40;
}

.mega-dropdown.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.mega-dropdown-inner {
  max-width: var(--wp--style--global--content-size, 1200px);
  height: 100%;
  margin: 0 auto;
  padding: 2.5rem 1.5rem;
  box-sizing: border-box;
  overflow-y: auto;
}

.mega-grid {
  height: 100%;
}
.mega-right {
  position: relative;
}

/* Menu vertical gauche */
.mega-left-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.mega-item {
  cursor: pointer;
}

.mega-item.is-active {
  font-weight: 600;
}
.mega-item.is-active > * {
  background: #111;
  color: #fff;
  border-radius: 999px;
  padding: 0.6rem 0.9rem;
}

/* Panneaux droite */
.mega-panel {
  display: none;
}
.mega-panel.is-visible {
  display: block;
}
.mega-panel h2,
.mega-panel h3 {
  margin-top: 0;
}

.mega-sub-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
}

/* =============================================
   BLOC NOS PRODUITS — Toggle gaz / poussières
   ============================================= */

.btn_gaz,
.btn_poussiere {
  cursor: pointer;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

/* Bouton gaz : bordure visible même à l'état inactif pour que la taille ne change pas */
.btn_gaz {
  border: 3px solid var(--wp--preset--color--accent-2, #99bbc9) !important;
}

.wp-block-group.btn_poussiere {
	color: #9c8e7d;
  border: 3px solid var(--wp--preset--color--accent-3, #9b8d7c) !important;
}



/* Contenu poussières masqué par défaut */
.content_poussiere {
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.content_gaz {
  transition: opacity 0.3s ease;
}




@media (max-width: 800px) {
  .mega-dropdown-inner {
    padding: 1.5rem 1rem;
  }
}

/* -------------------------------------------------------------------------- */
/* 28) Media queries                                                          */
/* -------------------------------------------------------------------------- */

@media (min-width: 783px) {
  ul[role="list"] {
    columns: 2;
  }
  ul[role="list"] ul {
    columns: 1;
  }

  /* Masquer le toggle desktop */
  .gw-mm-item__link .gw-mm-item__toggle {
    display: none;
  }
}

@media (max-width: 1213px) {
  .basline {
    min-width: 445px !important;
  }
}

@media (max-width: 650px) {
  .circle.one {
    top: 15vh;
    right: -47vw;
  }
  .circle.two {
    left: -15vw;
  }
  .circle svg {
    height: 60vw;
  }

  .creativite,
  .savoir-faire {
    left: 0 !important;
  }

  .bleu-ligne,
  .beige-ligne {
    display: none;
  }

  .ginput_container_consent {
    padding-top: 0 !important;
  }

  .intro .wp-block-heading {
    margin-top: 80vw;
  }
  .intro.active-trigger {
    background-position: inherit;
  }
  .intro:after {
    background-position: left top;
    right: 10%;
  }
}

@media (max-width: 400px) {
  .title {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Mega menu mobile (Getwid) */
@media (max-width: 783px) {
  .wp-block-getwid-megamenu-item > .gw-mm-item__link a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #fff;
    bottom: 0;
    left: 0;
  }

  .wp-block-getwid-megamenu-item > .gw-mm-item__link a {
    font-size: 22px !important;
    position: relative !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    padding-left: 30px !important;
  }

  .wp-block-getwid-megamenu-item > .gw-mm-item__link a:before {
    width: 50px !important;
    height: 50px !important;
    margin: 0 auto !important;
    margin-bottom: -15px !important;
    display: inline-block !important;
    margin-right: 30px !important;
  }

  .gw-mm__toggle {
    background: none;
    border: none;
    font-size: 0;
  }

  .gw-mm__toggle .dashicons-menu {
    background-color: transparent !important;
    color: transparent !important;
    width: 30px;
    height: 30px;
    background-image: url(/wp-content/uploads/2025/11/menu-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
  }

  .gw-mm.is-mobile.is-opened .gw-mm__content-wrapper {
    top: 100% !important;
  }

  :where(.wp-site-blocks *:focus) {
    outline-width: 0 !important;
  }

  .gw-mm__toggle.is-opened .dashicons-menu {
    background-image: url(/wp-content/uploads/2025/11/close_menu.svg) !important;
  }

  .gw-mm-item__link {
    position: relative;
  }

  .gw-mm-item__link .gw-mm-item__toggle {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
  }

  .gw-mm-item__dropdown-wrapper.is-opened .gw-mm-item__link .gw-mm-item__toggle {
    display: none !important;
  }

  .gw-mm-item__link .gw-mm-item__toggle .dashicons-arrow-down {
    right: 0;
    position: absolute;
  }

  .gw-mm-item__link .gw-mm-item__toggle .dashicons-arrow-down::before {
    background: url(/wp-content/uploads/2025/11/fleche_next.svg) no-repeat center
      center !important;
    content: "" !important;
    position: absolute !important;
    width: 10px !important;
    height: 35px !important;
    display: inline-block !important;
    scale: 1.4 !important;
    transition: transform 0.3s ease;
  }

  .gw-mm-item__link .gw-mm__toggle.is-opened .dashicons-arrow-down::before {
    transform: rotate(90deg) scale(1.4) !important;
    transition: transform 0.3s ease;
  }

  .gw-mm.is-mobile .gw-mm__content-wrapper {
    position: relative;
  }

  .wp-block-getwid-megamenu.is-mobile {
    padding-top: 40px;
    padding-left: 0;
  }

  /* Désactive les items suivants quand “produits” est ouvert */
  .wp-block-getwid-megamenu-item.produits.is-opened
    ~ .wp-block-getwid-megamenu-item
    .gw-mm-item__link
    a,
  .wp-block-getwid-megamenu-item.produits.is-opened
    ~ .wp-block-getwid-megamenu-item
    .gw-mm-item__link
    .gw-mm-item__toggle {
    pointer-events: none !important;
  }

  .wp-block-getwid-megamenu-item.produits .gw-mm-item__dropdown a {
    pointer-events: auto !important;
  }
}

.wc-block-product-gallery-thumbnails__thumbnail{
	background-color: rgba(255, 255, 255, 0.3);
}

.wc-block-product-gallery-thumbnails__thumbnail__image wc-block-product-gallery-thumbnails__thumbnail__image--is-active{
	background-color: white;
}

.price-from-label{
	display: block;
	font-size: 1rem;
}

 .harvest-btn {
            display: block;
            width: 100%;
            padding: 12px;
            cursor: pointer;
            font-weight: bold;
            text-align: center;
            box-sizing: border-box;
        }
        .harvest-btn--primary {
            background: var(--wp--preset--color--accent-6);
            color: var(--wp--preset--color--contrast);
            border: 3px solid var( --wp--preset--color--accent-1) !important;
            margin-top: 15px;
            max-width: 110px !important;
            text-align: left !important;
        }
        .harvest-btn--secondary, .harvest-btn--primary {
            background: var(--wp--preset--color--accent-6);
            color: var(--wp--preset--color--contrast) !important;
            border: 3px solid var(--wp--preset--color--contrast) !important;
            margin-top: 15px;
            max-width: 200px;
        }
        /* Quand les 2 sont dans le wrapper flex */
        .harvest-atc-buttons {
            display: flex;
            gap: 15px;
            margin-top: 15px;
        }
        .harvest-atc-buttons .harvest-btn {
            flex: 1;
            width: auto;
            margin-top: 0 !important;
        }


/* Header responsive */
@media (max-width: 1017px) {
  header main {
    padding-left: 0 !important;
  }
  header main .logo {
    padding: 0 0 0 5% !important;
  }
}
.ic-pdf-list{
 	gap: 10%;
	display: inline-flex;
}


/**
 * Fix de l'affichage de la page /mon-compte/edit-address/
 * Anatecs - thème Twenty Twenty-Five enfant
 */



.u-columns.woocommerce-Addresses {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: auto !important;
    grid-auto-rows: auto !important;
    gap: 1.5rem !important;
    margin-top: 1.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Force le placement des deux blocs côte à côte sur la même ligne */
.woocommerce-Address.u-column1.col-1 {
    grid-column: 1 !important;
    grid-row: 1 !important;
}
.woocommerce-Address.u-column2.col-2 {
    grid-column: 2 !important;
    grid-row: 1 !important;
}

/* Réorganise le bloc Adresse : titre, adresse, puis bouton Modifier en bas */
.woocommerce-Address {
    display: flex;
    flex-direction: column;
}

.woocommerce-Address-title.title {
    display: block; /* annule le flex row qu'on avait mis avant */
    background: transparent;
    padding: 0;
    margin-bottom: 0.75rem;
    order: 1;
}

.woocommerce-Address-title.title h2,
.woocommerce-Address-title.title h3 {
    margin: 0 0 0.5rem 0;
    font-size: 1.25rem;
    flex: none;
}

.woocommerce-Address address {
    order: 2;
    margin-bottom: 1rem;
    line-height: 1.6;
    font-style: normal;
}

/* Le bouton Modifier sort du header et passe en bas */
.woocommerce-Address > .edit {
    order: 3;
    align-self: flex-start;
    margin-top: 0.75rem;
    /* Garde le style bouton qu'on avait avant */
    display: inline-block;
    padding: 0.5rem 1rem;
    background: #116483;
    color: #fff !important;
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.85rem;
    transition: background 0.2s ease;
}

.woocommerce-Address > .edit:hover {
    background: #0d4f68;
}

@media (max-width: 768px) {
    .u-columns.woocommerce-Addresses {
        grid-template-columns: 1fr !important;
    }
    .woocommerce-Address.u-column1.col-1,
    .woocommerce-Address.u-column2.col-2 {
        grid-column: 1 !important;
    }
    .woocommerce-Address.u-column2.col-2 {
        grid-row: 2 !important;
    }
}

@media (max-width: 450px) {

	.logo{
		padding-top: 10px !important;
		padding-bottom: 10px !important;
	}
	#amm-root{
		height: 80px !important;
		min-height: 80px !important;
	}
}

/* =============================================================
   QTY STEPPER — Produits simples (fallback HTML classique WooCommerce)
   Aligne l'apparence sur le wc-block-components-quantity-selector
   des produits variables
   ============================================================= */

/* Wrapper : flex row, même bordure que le bloc Gutenberg */
/*
.single-product form.cart .quantity {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid rgba(17, 100, 131, 0.3);
  border-radius: 2px;
  height: 29px;
  overflow: hidden;
  background: transparent;
  position: relative;
}
*/

/* Input central */
/*
.single-product form.cart .quantity input.qty {
  -webkit-appearance: none;
  -moz-appearance: textfield;
  appearance: none;
  border: none;
  outline: none;
  width: 47px;
  height: 100%;
  text-align: center;
  font-size: 14px;
  font-family: inherit;
  color: var(--wp--preset--color--contrast, #116483);
  background: transparent;
  padding: 0;
  margin: 0;
  order: 2;
}
.single-product form.cart .quantity input.qty::-webkit-inner-spin-button,
.single-product form.cart .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
*/

/* Boutons −/+ injectés par JS */
/*
single-product form.cart .quantity .qty-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 100%;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--wp--preset--color--contrast, #116483);
  font-size: 18px;
  line-height: 1;
  padding: 0;
  transition: background 0.15s;
  flex-shrink: 0;
}
.single-product form.cart .quantity .qty-btn:hover {
  background: rgba(17, 100, 131, 0.08);
}
.single-product form.cart .quantity .qty-btn:disabled {
  opacity: 0.3;
  cursor: default;
}
.single-product form.cart .quantity .qty-btn--minus { order: 1; }
.single-product form.cart .quantity .qty-btn--plus  { order: 3; }
*/

/* Adresse de facturation verrouillée (numéro de TVA présent) */
.woocommerce-Address > .harvest-vat-notice {
    display: inline-block;
    margin-top: 0.75rem;
    padding: 0.5rem 1rem;
    background: #f0f0f0;
    color: #555;
    border-radius: 4px;
    font-size: 0.85rem;
    font-style: italic;
}
.woocommerce-Address > .harvest-vat-notice a {
    color: #116483;
    text-decoration: underline;
}

/* Pages projet : un cover seul dans une colonne prend la hauteur de la colonne voisine */
@media (min-width: 782px) {
	.single-projet .wp-block-columns:has(> .wp-block-column > .wp-block-cover:only-child) {
		align-items: stretch;
	}
	.single-projet .wp-block-columns > .wp-block-column:has(> .wp-block-cover:only-child) {
		align-self: stretch;
	}
	.single-projet .wp-block-columns > .wp-block-column > .wp-block-cover:only-child {
		height: 100%;
		min-height: 0 !important; /* écrase le min-height inline du bloc */
	}
}


/* Le trait sous les champs ne visait que `text` et `textarea` : le champ
   « Mon e-mail » ajouté le 18/09/2026 gardait donc la boîte grise par défaut
   de Gravity Forms. Les autres types qu'un formulaire peut recevoir plus tard
   (téléphone, site web, nombre) sont ajoutés au passage. */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="number"],
.gform_wrapper textarea{
    border-radius: 0 !important;
    border-bottom: 2px #000000 solid !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    background: none !important;
    padding-left: 0 !important;
    font-size: 0.8rem !important;
    box-shadow: none !important;
}


.gfield_label {
    font-size: 1.3rem !important;
    font-weight: 500 !important;
}
.gform_wrapper textarea{
    align-content: flex-end;
}


.gform_footer .gform_button {
    border: 1px #000000 solid !important;
    border-radius: 100px !important;
    padding: 0 30px !important;
    font-size: 1.3rem !important;
    background: #ffffff !important;
    margin: 40px 0 0 0 !important;
}


/* 1. On garde la colonne en position relative, mais on rend son fond transparent */
.wp-block-column.col-contact {
    position: relative;
    background-color: transparent !important; 
}

/* 2. On recrée le fond rose avec un ::after */
.wp-block-column.col-contact::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: var(--wp--preset--color--contrast); /* Utilise la variable de couleur WordPress de votre fond rose */
    z-index: -1 !important; /* On place le fond derrière le formulaire */
}

/* 3. On place votre cadre noir avec le ::before, ENCORE PLUS LOIN derrière */
.wp-block-column.col-contact::before {
    content: "";
    position: absolute;
    top: 5%;
    bottom: -20px;
    left: -20px;
    width: 95%;
    border: 3px solid black;
    z-index: -2 !important; /* -2 passe derrière le -1 du fond rose */
}
 
.wp-block-accordion-heading__toggle:hover{
  background-color: var(--wp--preset--color--contrast);
  border-radius: 500px !important;

}
.taxonomy-mission span{
  display: none;
}
.taxonomy-mission a {
    border: 1px #000000 solid !important;
    background: #ffffff;
    text-transform: uppercase;
    margin-right: 10px !important;
}
.taxonomy-mission .wp-block-tiptip-hyperlink-group-block{
  display: none !important;
}



/* nav */
header .wp-block-navigation a{
    display: flex !important;
    justify-content: flex-start !important;
}
header .wp-block-navigation span{
  position: relative;
}
header .wp-block-navigation span::before{
  content: "";
    background-image: url(/wp-content/uploads/2026/07/Ellipse-3.svg);
    position: absolute;
    width: 25px;
    top: calc(50% - 12.5px); /* centrée sur le libellé (était top:0, 2 px trop haut) */
    left: -35px;
    height: 25px;
    background-size: contain;
    background-repeat: no-repeat;
}
.wp-block-button a{
  padding-right: 100px;
}
/* Décoration ●●● : passée de ::before à ::after, car ::before porte désormais
   le disque du rollover (voir section 27). Position verticale figée pour tomber
   exactement là où elle était (top:15px dans un bouton de 50px). */
.wp-block-button a:after {
    content: "";
    position: absolute;
    z-index: 2;
    display: block;
    top: 50%;
    /* -9 et non -10 : top:50% se calcule sur la boite de padding (48px dans un
       bouton de 50px bordure comprise), on retombe ainsi pile sur les 15px
       d'origine. */
    right: 15px;
    margin-top: -9px;
    background-image: url(/wp-content/uploads/2026/07/3-ellipses.svg);
    width: 70px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none;
}

/* Relais de remplissage. Le disque de la section 27 est un CERCLE : sur un
   bouton large et bas (283 × 50 px), son bord laisse les deux coins hauts à
   découvert — kando pose pour ça un ::after de relais, ici occupé par la déco
   ●●●. On fait donc basculer le fond du bouton lui-même, mais UNIQUEMENT à la
   fin de la croissance du disque (transition de 0 s retardée de .4 s) ; au
   retour la bascule est instantanée, pour que le disque redescende sur du
   blanc au lieu de disparaître dans du rose. */
.wp-block-button a{
	transition: background-color 0s;
}
.wp-block-button a:hover,
.wp-block-button a:focus-visible{
	background-color: var(--ac-roll-fill) !important;
	transition: background-color 0s var(--ac-roll-dur);
}

.titre-souligne {
    text-decoration: underline;
    text-underline-offset: 8px; /* Écarte la ligne du texte pour plus d'élégance */
    text-decoration-thickness: 2px; /* Gère l'épaisseur du trait */
}

.nav-souligne {
    text-decoration: underline;
    text-underline-offset: 6px; /* Écarte la ligne du texte pour plus d'élégance */
    text-decoration-thickness: 1px; /* Gère l'épaisseur du trait */
}

/* -------------------------------------------------------------------------- */
/* 27) Rollover « bulle » — boutons & items de navigation                     */
/*                                                                            */
/* Principe repris de kando.care :                                            */
/*  - bouton : un disque de la couleur d'accent grandit depuis le bas et       */
/*    remplit la pastille, pendant que le libellé s'échappe par le haut puis   */
/*    revient par le bas, étiré verticalement ;                               */
/*  - item de nav : une pilule se déplie avec un ressort autour de la pastille */
/*    et du libellé, et la pastille grossit sur le même ressort.              */
/*                                                                            */
/* Le disque occupe ::before, la décoration ●●● des boutons a donc été         */
/* déplacée sur ::after (voir « nav » plus haut).                             */
/* -------------------------------------------------------------------------- */

:root {
  --ac-roll-fill: var(--wp--preset--color--contrast, #ffd5d2);
  --ac-roll-ease: cubic-bezier(.1, 0, .3, 1);
  /* ressort : cubic-bezier d'abord, courbe linear() plus fidèle si le
     navigateur la comprend (Safari 17.4+, Chrome 113+, Firefox 112+). */
  --ac-roll-spring: cubic-bezier(.175, .885, .32, 1.275);
  --ac-roll-dur: .4s;
}
@supports (transition-timing-function: linear(0 0%, 1 100%)) {
  :root {
    --ac-roll-spring: linear(0, .009, .035 2.1%, .141, .281 6.7%, .723 12.9%, .938 16.7%, 1.017, 1.077, 1.121, 1.149 24.3%, 1.159, 1.163, 1.161, 1.154 29.9%, 1.129 32.8%, 1.051 39.6%, 1.017 43.1%, .991, .977 51%, .974 53.8%, .975 57.1%, .997 69.8%, 1.003 76.9%, 1.004 83.8%, 1);
  }
}

/* --- Libellé : sort par le haut, revient par le bas ----------------------- */
@keyframes ac-roll-label-out {
  to { opacity: 0; transform: translate3d(0, -105%, 0) scale3d(1, 2, 1); }
}
@keyframes ac-roll-label-in {
  0% { opacity: 0; transform: translate3d(0, 100%, 0) scale3d(1, 2, 1); }
  to { opacity: 1; transform: translateZ(0); }
}

/* --- Boutons -------------------------------------------------------------- */
.wp-block-button a.wp-block-button__link {
  /* « clip » et non « hidden » : pas de conteneur de défilement créé. */
  overflow: clip;
  /* PAS de overflow-clip-margin ici : dans le contexte d'empilement isolé, un
     enfant en z-index négatif se peint AU-DESSUS de la bordure du bouton. Avec
     une marge de clip de 1 px le disque rose débordait donc sur la bordure
     noire, qui semblait « mangée » pendant le survol (constaté le 14/09/2026).
     Clippé à la boîte de padding, le remplissage s'arrête pile contre la
     bordure, sans liseré blanc (le padding-box est adjacent à la bordure). */
  /* Contexte d'empilement local : le disque en z-index:-1 se peint au-dessus
     du fond du bouton mais sous son contenu, sans toucher à l'échelle
     d'empilement du thème (pas de z-index posé sur le bouton). */
  isolation: isolate;
}

/* le disque qui grandit depuis le bas */
.wp-block-button a.wp-block-button__link::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -110% auto auto -10%;
  width: 120%;
  height: 0;
  /* padding-bottom en % se calcule sur la LARGEUR du parent : disque toujours
     parfaitement rond et toujours plus grand que le bouton. */
  padding-bottom: 120%;
  background: var(--ac-roll-fill);
  background-image: none;
  border-radius: 50%;
  transform: translate3d(0, 68%, 0) scale3d(0, 0, 0);
  transition: transform var(--ac-roll-dur) var(--ac-roll-ease);
  pointer-events: none;
}
.wp-block-button a.wp-block-button__link:hover::before,
.wp-block-button a.wp-block-button__link:focus-visible::before {
  transform: translateZ(0) scale3d(1, 1, 1);
}

/* libellé enveloppé par js/app.js (__acRollLabels) — sans ce span, le bouton
   garde simplement le disque, sans le va-et-vient du texte. */
.wp-block-button a.wp-block-button__link .ac-roll-label {
  display: inline-block;
  position: relative;
  z-index: 2;
}
.wp-block-button a.wp-block-button__link:hover .ac-roll-label,
.wp-block-button a.wp-block-button__link:focus-visible .ac-roll-label {
  animation: ac-roll-label-out .25s forwards, ac-roll-label-in .25s .25s forwards;
}

/* --- Items de navigation (pastilles) -------------------------------------- */
/* La pilule est portée par le LIBELLÉ et non par le lien : dans cette nav
   verticale, tous les liens font la largeur du plus long, une pilule posée sur
   le lien épouserait donc du vide à droite. Sur le libellé, elle se cale au mot
   (100 / 118 / 130 px pour Infos / Projets / Contact). */
header .wp-block-navigation .wp-block-navigation-item__label {
  isolation: isolate;
}
/* la pastille (::before, déclarée plus haut) repasse au-dessus de la pilule */
header .wp-block-navigation .wp-block-navigation-item__label::before {
  z-index: 1;
  transition: transform .7s var(--ac-roll-spring);
}
/* la pilule englobe la pastille (25 px posée à -35 px) ET le libellé.
   Marges ÉGALES sur les 4 côtés (8 px) : à gauche de la pastille (-35 - 8),
   à droite du mot, au-dessus et au-dessous (libellé de 28,8 px, 10 px entre
   deux items : 8 px n'empiète pas sur le texte voisin). Retouche du
   14/09/2026, l'ancienne valeur -4px -14px -4px -44px donnait un cartouche
   serré en hauteur et large sur les côtés. */
header .wp-block-navigation .wp-block-navigation-item__label::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -8px -8px -8px -43px;
  background: var(--ac-roll-fill);
  border-radius: 300px;
  opacity: 0;
  transform: scale(.82);
  transition: opacity .18s ease-out, transform .7s var(--ac-roll-spring);
  pointer-events: none;
}
/* le survol reste déclenché par tout le lien, plus large que le mot */
header .wp-block-navigation .wp-block-navigation-item__content:hover .wp-block-navigation-item__label::after,
header .wp-block-navigation .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label::after {
  opacity: 1;
  transform: scale(1);
}
/* la pastille grossit sur le même ressort */
header .wp-block-navigation .wp-block-navigation-item__content:hover .wp-block-navigation-item__label::before,
header .wp-block-navigation .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label::before {
  transform: scale(1.18);
}

/* Menu superposé (mobile) : les items y sont pleine largeur, la pilule et le
   grossissement de la pastille n'ont plus de sens. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label::after {
  content: none;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label::before {
  transition: none;
}

/* --- Respect de « prefers-reduced-motion » -------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .wp-block-button a.wp-block-button__link::before,
  header .wp-block-navigation .wp-block-navigation-item__label::after,
  header .wp-block-navigation .wp-block-navigation-item__label::before {
    transition: none;
  }
  .wp-block-button a.wp-block-button__link:hover .ac-roll-label,
  .wp-block-button a.wp-block-button__link:focus-visible .ac-roll-label {
    animation: none;
  }
}


/* -------------------------------------------------------------------------- */
/* 28) Rollover : pastilles de missions & vignettes projets                   */
/* -------------------------------------------------------------------------- */

/* --- Pastilles de missions (bloc post-terms) ------------------------------ */
/* Ces liens sont rendus en `display:inline`, or il faut une boîte pour clipper
   le disque. On repasse en inline-block avec `line-height:20px`, ce qui redonne
   très exactement la boîte de 32 px du rendu inline, et `margin-block:3.5px`
   pour restituer l'interligne de 39 px d'origine (mesuré avant/après). */
.wp-block-post-terms a[rel="tag"] {
  display: inline-block;
  line-height: 20px;
  vertical-align: middle;
  margin-block: 3.5px;
  position: relative;
  overflow: clip; /* sans clip-margin : même raison que les boutons (bordure) */
  isolation: isolate;
  transition: background-color 0s;
}
.wp-block-post-terms a[rel="tag"]::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -110% auto auto -10%;
  width: 120%;
  height: 0;
  padding-bottom: 120%;
  background: var(--ac-roll-fill);
  background-image: none;
  border-radius: 50%;
  transform: translate3d(0, 68%, 0) scale3d(0, 0, 0);
  transition: transform var(--ac-roll-dur) var(--ac-roll-ease);
  pointer-events: none;
}
.wp-block-post-terms a[rel="tag"]:hover::before,
.wp-block-post-terms a[rel="tag"]:focus-visible::before {
  transform: translateZ(0) scale3d(1, 1, 1);
}
/* même relais de remplissage que les boutons */
.wp-block-post-terms a[rel="tag"]:hover,
.wp-block-post-terms a[rel="tag"]:focus-visible {
  background-color: var(--ac-roll-fill);
  transition: background-color 0s var(--ac-roll-dur);
  /* le soulignement posé par les Styles globaux ferait doublon avec la pilule */
  text-decoration: none;
}
.wp-block-post-terms a[rel="tag"] .ac-roll-label {
  display: inline-block;
  position: relative;
  z-index: 2;
}
.wp-block-post-terms a[rel="tag"]:hover .ac-roll-label,
.wp-block-post-terms a[rel="tag"]:focus-visible .ac-roll-label {
  animation: ac-roll-label-out .25s forwards, ac-roll-label-in .25s .25s forwards;
}

/* --- Vignettes projets ----------------------------------------------------- */
/* Zoom lent + coins qui s'arrondissent vers la forme pilule du reste du site
   + voile rosé très léger. Déclenché depuis la CARTE (`li.wp-block-post`) pour
   que le survol du titre ou des pastilles anime aussi l'image.
   Les deux gabarits de carte du site sont couverts : bloc Bannière
   (`.wp-block-cover`, grilles /projets/ et accueil) et bloc Image mise en avant
   (`.wp-block-post-featured-image`).
   NB : l'apparition au défilement (animate.css, `.animateChilds`) ne joue que
   sur l'opacité du `li`, jamais sur l'image — pas de conflit de transform. */
li.wp-block-post .wp-block-cover,
li.wp-block-post .wp-block-post-featured-image {
  overflow: clip;
  border-radius: 0;
  transition: border-radius .75s var(--ac-roll-ease);
}
li.wp-block-post .wp-block-cover img,
li.wp-block-post .wp-block-post-featured-image img {
  transform: scale(1);
  transition: transform 1.1s var(--ac-roll-ease);
}
li.wp-block-post:hover .wp-block-cover,
li.wp-block-post:hover .wp-block-post-featured-image,
li.wp-block-post:focus-within .wp-block-cover,
li.wp-block-post:focus-within .wp-block-post-featured-image {
  border-radius: 28px;
}
li.wp-block-post:hover .wp-block-cover img,
li.wp-block-post:hover .wp-block-post-featured-image img,
li.wp-block-post:focus-within .wp-block-cover img,
li.wp-block-post:focus-within .wp-block-post-featured-image img {
  transform: scale(1.06);
}

/* Voile rosé : on réutilise le calque de fondu déjà présent dans le bloc
   Bannière (`span.wp-block-cover__background`, maintenu à `opacity:0` par la
   classe `has-background-dim-0` du cœur) plutôt que d'ajouter un élément.
   `!important` assumé : les classes `has-background-dim-*` de WordPress posent
   l'opacité avec une spécificité qui varie d'une version à l'autre. */
li.wp-block-post .wp-block-cover > .wp-block-cover__background {
  transition: opacity .55s var(--ac-roll-ease), background-color .55s var(--ac-roll-ease);
}
li.wp-block-post:hover .wp-block-cover > .wp-block-cover__background,
li.wp-block-post:focus-within .wp-block-cover > .wp-block-cover__background {
  background-color: var(--ac-roll-fill) !important;
  opacity: .22 !important;
}

@media (prefers-reduced-motion: reduce) {
  .wp-block-post-terms a[rel="tag"]::before,
  li.wp-block-post .wp-block-cover,
  li.wp-block-post .wp-block-post-featured-image,
  li.wp-block-post .wp-block-cover img,
  li.wp-block-post .wp-block-post-featured-image img,
  li.wp-block-post .wp-block-cover > .wp-block-cover__background {
    transition: none;
  }
  .wp-block-post-terms a[rel="tag"]:hover .ac-roll-label,
  .wp-block-post-terms a[rel="tag"]:focus-visible .ac-roll-label {
    animation: none;
  }
}


/* -------------------------------------------------------------------------- */
/* 29) Lot du 14/09/2026 : pastilles noires, liens texte « cartouche »,        */
/*     filet lumineux des logos clients                                         */
/* -------------------------------------------------------------------------- */

/* --- Pastilles de missions : s'allument en NOIR ---------------------------- */
/* Même mécanique que la §28 (disque + relais), mais la couleur de remplissage
   est surchargée localement et le libellé passe en blanc au moment où il
   revient par le bas (délai = durée de la sortie du libellé, .25 s).
   Au départ du curseur, le disque ne redescend pas (un disque noir qui rétrécit
   sous du texte noir serait illisible) : il s'efface en .15 s pendant que le
   libellé repasse au noir sur la même durée. */
.taxonomy-mission a[rel="tag"] {
  --ac-roll-fill: var(--wp--preset--color--accent-1, #000);
  transition: background-color 0s, border-color .15s ease-out;
}
.taxonomy-mission a[rel="tag"]::before {
  opacity: 0;
  transition: transform var(--ac-roll-dur) var(--ac-roll-ease), opacity .15s ease-out;
}
.taxonomy-mission a[rel="tag"]:hover::before,
.taxonomy-mission a[rel="tag"]:focus-visible::before {
  opacity: 1;
  transition: transform var(--ac-roll-dur) var(--ac-roll-ease), opacity 0s;
}
.taxonomy-mission a[rel="tag"]:hover,
.taxonomy-mission a[rel="tag"]:focus-visible {
  border-color: var(--wp--preset--color--accent-1, #000);
}
.taxonomy-mission a[rel="tag"] .ac-roll-label {
  transition: color .15s ease-out;
}
.taxonomy-mission a[rel="tag"]:hover .ac-roll-label,
.taxonomy-mission a[rel="tag"]:focus-visible .ac-roll-label {
  color: var(--wp--preset--color--base, #fff);
  transition: color 0s .25s;
}

/* --- Liens texte : soulignés au repos, cartouche rose au survol ------------ */
/* Cible : les liens posés DANS du texte (paragraphes, listes, titres, cellules,
   légendes). Sont exclus tout ce qui a déjà son propre geste : boutons, pastilles
   de missions, navigation, titres de cartes projet, liens-image, soulignement
   animé `mark a`, liste `.ListeInfos`.
   Le cartouche est un dégradé de fond qui MONTE depuis le soulignement
   (background-size 100% 0 → 100% 100%) : contrairement à un pseudo-élément,
   il suit un lien qui se replie sur deux lignes (box-decoration-break: clone
   arrondit chaque fragment). Le soulignement s'efface pendant que le cartouche
   se remplit. */
.wp-site-blocks :is(p, li, h1, h2, h3, h4, h5, h6, td, th, dd, dt, figcaption, blockquote) a:not(.wp-element-button):not(.wp-block-button__link):not([rel~="tag"]):not(.wp-block-navigation-item__content):not(.wp-block-tiptip-hyperlink-group-block):not(.ListeInfos a):not(.wp-block-post-title a):not(mark a):not(.ac-ck a):not(.titre-souligne a):not(:has(img, svg, figure, video)) {
  --ac-link-fill: var(--ac-roll-fill, #ffd5d2);
  color: inherit;
  /* !important obligatoire : la règle historique du thème `a { text-decoration:
     none !important }` (§1) écraserait sinon le soulignement au repos. */
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
  text-decoration-color: currentColor !important;
  background-image: linear-gradient(var(--ac-link-fill), var(--ac-link-fill));
  background-repeat: no-repeat;
  background-size: 100% 0;
  background-position: 0 100%;
  padding: .06em .18em;
  margin: -.06em -.18em;
  border-radius: .45em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  transition: background-size .32s var(--ac-roll-ease), text-decoration-color .2s ease-out;
}
.wp-site-blocks :is(p, li, h1, h2, h3, h4, h5, h6, td, th, dd, dt, figcaption, blockquote) a:not(.wp-element-button):not(.wp-block-button__link):not([rel~="tag"]):not(.wp-block-navigation-item__content):not(.wp-block-tiptip-hyperlink-group-block):not(.ListeInfos a):not(.wp-block-post-title a):not(mark a):not(.ac-ck a):not(.titre-souligne a):not(:has(img, svg, figure, video)):hover,
.wp-site-blocks :is(p, li, h1, h2, h3, h4, h5, h6, td, th, dd, dt, figcaption, blockquote) a:not(.wp-element-button):not(.wp-block-button__link):not([rel~="tag"]):not(.wp-block-navigation-item__content):not(.wp-block-tiptip-hyperlink-group-block):not(.ListeInfos a):not(.wp-block-post-title a):not(mark a):not(.ac-ck a):not(.titre-souligne a):not(:has(img, svg, figure, video)):focus-visible {
  background-size: 100% 100%;
  text-decoration-color: transparent !important;
}
/* Le pied de page est déjà rose : le cartouche y passe en blanc. */
footer.wp-block-template-part .has-contrast-background-color a {
  --ac-link-fill: var(--wp--preset--color--base, #fff);
}

/* --- Logos clients : filet rose dégradé qui suit la souris ----------------- */
/* js/app.js (__acLogoFrames) enveloppe chaque logo encadré dans un
   span.ac-logo-frame et y pose --ac-mx / --ac-my (position du curseur relative
   au cadre, en px, même hors du cadre) et --ac-glow (0..1 selon la distance du
   curseur au cadre). Le filet est un anneau de 2 px (masque « content-box »
   exclu du masque plein) posé à cheval sur la bordure noire de 1 px du logo,
   rempli d'un dégradé radial centré sur le curseur : la lueur glisse d'un carré
   au suivant quand la souris traverse la grille. */
.ac-logo-frame {
  position: relative;
  display: inline-block;
  line-height: 0;
  --ac-mx: 50%;
  --ac-my: 50%;
  --ac-glow: 0;
}
.ac-logo-frame > img {
  display: block;
}
.ac-logo-frame::after {
  content: "";
  position: absolute;
  /* anneau de 3 px : 2 px hors du cadre + le pixel de la bordure noire, qu'il
     recouvre entièrement près du curseur (un anneau de 2 px à demi transparent
     était invisible sur la capture du 14/09). */
  inset: -2px;
  padding: 3px;
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(
    260px circle at var(--ac-mx) var(--ac-my),
    #ff7d75 0%,
    #ffa39d 28%,
    var(--ac-roll-fill, #ffd5d2) 52%,
    rgba(255, 213, 210, .65) 74%,
    transparent 100%
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  opacity: var(--ac-glow);
  transition: opacity .25s ease-out;
}

@media (prefers-reduced-motion: reduce) {
  .taxonomy-mission a[rel="tag"]::before,
  .taxonomy-mission a[rel="tag"] .ac-roll-label,
  .ac-logo-frame::after {
    transition: none;
  }
}


/* -------------------------------------------------------------------------- */
/* 30) Lot du 14/09/2026 (suite) : points ●●● des boutons, flèche « #projet », */
/*     accordéons de la FAQ                                                     */
/* -------------------------------------------------------------------------- */

/* --- Points ●●● : s'allument en blanc l'un après l'autre au survol ---------- */
/* La décoration était une image de fond (3-ellipses.svg) sur ::after, donc
   impossible à colorer point par point. js/app.js (__acRollLabels) injecte à la
   place <span class="ac-dots"><i></i><i></i><i></i></span> ; l'image ::after ne
   sert plus que de repli sans JS (masquée dès que les spans existent).
   Géométrie reprise du SVG (3 disques de 28,98 sur 99,88 rendus en 20 px de
   haut) : 3 disques de 20 px répartis sur 70 px, à 15 px du bord droit. */
.wp-block-button a.wp-block-button__link:has(.ac-dots)::after {
  content: none;
}
.wp-block-button a.wp-block-button__link .ac-dots {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 15px;
  width: 70px;
  height: 20px;
  margin-top: -10px;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}
.wp-block-button a.wp-block-button__link .ac-dots i {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--wp--preset--color--accent-1, #000);
  transition: background-color .12s ease-out; /* retour : tous en même temps */
}
.wp-block-button a.wp-block-button__link:hover .ac-dots i,
.wp-block-button a.wp-block-button__link:focus-visible .ac-dots i {
  background: var(--wp--preset--color--base, #fff);
}
/* allumage en cascade, une fois le disque rose presque en place */
.wp-block-button a.wp-block-button__link:hover .ac-dots i:nth-child(1),
.wp-block-button a.wp-block-button__link:focus-visible .ac-dots i:nth-child(1) { transition: background-color .16s ease-out .18s; }
.wp-block-button a.wp-block-button__link:hover .ac-dots i:nth-child(2),
.wp-block-button a.wp-block-button__link:focus-visible .ac-dots i:nth-child(2) { transition: background-color .16s ease-out .32s; }
.wp-block-button a.wp-block-button__link:hover .ac-dots i:nth-child(3),
.wp-block-button a.wp-block-button__link:focus-visible .ac-dots i:nth-child(3) { transition: background-color .16s ease-out .46s; }

/* --- Flèche « descendre aux projets » (image-lien fleche-bas.svg) ---------- */
/* Le SVG est un <img> (cercle blanc cerclé de noir + flèche noire) : on ne peut
   pas le recolorer. Le lien devient un disque clippé dans lequel le disque rose
   de la « bulle » grandit depuis le bas ; l'image passe en mix-blend-mode:
   multiply, son blanc laisse donc voir le rose et son trait reste noir. Au
   repos, multiplier par le blanc de la page ne change rien. La flèche fait de
   petits bonds vers le bas pendant le survol (elle invite à descendre). */
.wp-block-image a[href="#projet"] {
  position: relative;
  display: inline-block;
  line-height: 0;
  border-radius: 50%;
  overflow: clip;
  isolation: isolate;
  transform: scale(1);
  transition: transform .45s var(--ac-roll-spring);
}
.wp-block-image a[href="#projet"]::before {
  content: "";
  position: absolute;
  z-index: -1;
  /* élément CARRÉ : le disque (120 % de côté) est centré (-10 %), et non posé
     à -110 % de hauteur comme sur un bouton large et bas, sinon il ne
     couvrirait que les 5 px du haut. */
  inset: -10% auto auto -10%;
  width: 120%;
  height: 0;
  padding-bottom: 120%;
  background: var(--ac-roll-fill, #ffd5d2);
  border-radius: 50%;
  transform: translate3d(0, 68%, 0) scale3d(0, 0, 0);
  transition: transform var(--ac-roll-dur) var(--ac-roll-ease);
  pointer-events: none;
}
.wp-block-image a[href="#projet"] img {
  position: relative;
  z-index: 1;
  display: block;
  mix-blend-mode: multiply;
}
.wp-block-image a[href="#projet"]:hover,
.wp-block-image a[href="#projet"]:focus-visible {
  transform: scale(1.1);
  /* Les bonds sont portés par le LIEN (qui porte aussi le rognage circulaire et
     le disque rose), plus par l'image : quand seule l'image descendait, le
     cercle noir sortait de la zone rognée et se retrouvait coupé en bas
     (signalé le 16/09/2026). Le lien, le disque et le cercle bougent donc
     ensemble. Délai = durée de la transition d'agrandissement, pour enchaîner
     sans à-coup depuis scale(1.1). */
  animation: ac-arrow-bob .9s ease-in-out .45s infinite;
}
.wp-block-image a[href="#projet"]:hover::before,
.wp-block-image a[href="#projet"]:focus-visible::before {
  transform: translateZ(0) scale3d(1, 1, 1);
}
@keyframes ac-arrow-bob {
  0%, 100% { transform: scale(1.1) translateY(0); }
  50%      { transform: scale(1.1) translateY(5px); }
}

/* --- Accordéons de la FAQ (bloc core/accordion) ---------------------------- */
/* Le cœur masque le panneau par `hidden="until-found"` : ouverture et fermeture
   sont instantanées (l'item n'est pas une grille, sa transition
   grid-template-rows du cœur est inerte). js/app.js (__acAccordionMotion)
   anime la hauteur : à l'ouverture, après que le store ait retiré `hidden` ;
   à la fermeture, AVANT de relayer le clic au store. Ici : le survol de la
   question (pilule bordée) se remplit de rose, comme les autres pilules. */
.wp-block-accordion-heading {
  transition: background-color .3s var(--ac-roll-ease);
}
.wp-block-accordion-heading:hover,
.wp-block-accordion-item.is-open > .wp-block-accordion-heading {
  background-color: var(--ac-roll-fill, #ffd5d2);
}
.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
  text-decoration: none; /* la pilule rose suffit */
}
.wp-block-accordion-panel {
  will-change: height;
}

@media (prefers-reduced-motion: reduce) {
  .wp-block-button a.wp-block-button__link .ac-dots i,
  .wp-block-image a[href="#projet"],
  .wp-block-image a[href="#projet"]::before,
  .wp-block-accordion-heading {
    transition: none;
  }
  .wp-block-image a[href="#projet"]:hover,
  .wp-block-image a[href="#projet"]:focus-visible { animation: none; }
}



/* -------------------------------------------------------------------------- */
/* 31) Menu mobile (< 600 px) : burger ●●● → croix, overlay rose en cercle      */
/*                                                                            */
/* Patron repris d'archigroup/ocube (menu plein écran) :                       */
/*  - l'overlay du cœur passe de display:none à display:flex, non animable →   */
/*    on le garde TOUJOURS rendu (fixed, plein écran, visibility:hidden) et on  */
/*    anime un clip-path circulaire dont l'origine (--ac-menu-x/y) est posée   */
/*    par js/app.js (__acMenuMobile) sur la position du burger ;               */
/*  - le smooth-scroll est verrouillé par app.js (has-modal-open observé) ;    */
/*  - le menu est refermé par transitions.js au swap AJAX, sous le panneau.   */
/* Spécifique archicool : un SEUL contrôle visible, le burger, qui se          */
/* transforme en croix et passe au-dessus de l'overlay (z 100001 > 100000     */
/* dans le contexte d'empilement de l'en-tête). Le bouton de fermeture natif   */
/* du cœur reste fonctionnel mais invisible (opacity:0), posé par app.js       */
/* exactement sous le burger, qui ne reçoit plus les touches une fois ouvert.  */
/* Le logo (et ses yeux) reste visible au-dessus du rose.                      */
/* -------------------------------------------------------------------------- */
@media (max-width: 599.98px) {

  /* Le flou de l'en-tête défilé (backdrop-filter) en faisait le BLOC CONTENEUR
     du position:fixed de l'overlay : menu ouvert dans une bande de 158 px
     après le premier défilement (constaté le 15/09/2026). Pas de flou sur
     mobile, l'en-tête y est blanc opaque. */
  header.main-tool-bar--scrolled { backdrop-filter: none; }

  header .archicool-logo-link { position: relative; z-index: 100001; }

  /* --- Burger : trois points ------------------------------------------------ */
  header .wp-block-navigation__responsive-container-open {
    position: relative;
    z-index: 100001;
    width: 44px;
    height: 44px;
    margin: -10px -10px -10px 0;   /* zone tactile de 44 px, empreinte visuelle de 24 px */
    padding: 0;
    color: var(--wp--preset--color--accent-1, #000);
    /* point central : dégradé radial sur le bouton lui-même */
    background: radial-gradient(circle, currentColor 3.9px, transparent 4.6px) center / 9px 9px no-repeat;
    transition: background-size .25s ease-out .12s;
    -webkit-tap-highlight-color: transparent;
  }
  header .wp-block-navigation__responsive-container-open svg { display: none; }
  header .wp-block-navigation__responsive-container-open::before,
  header .wp-block-navigation__responsive-container-open::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 9px;
    margin: -4.5px 0 0 -4.5px;
    border-radius: 50%;
    background: currentColor;
    transition: transform .5s var(--ac-roll-spring), width .35s var(--ac-roll-ease), height .35s var(--ac-roll-ease), margin .35s var(--ac-roll-ease), border-radius .35s var(--ac-roll-ease);
  }
  header .wp-block-navigation__responsive-container-open::before { transform: translateX(-13px); }
  header .wp-block-navigation__responsive-container-open::after  { transform: translateX(13px); }

  /* --- … qui deviennent une croix menu ouvert ------------------------------- */
  html.has-modal-open header .wp-block-navigation__responsive-container-open {
    background-size: 0 0;
    pointer-events: none;             /* les touches vont au bouton de fermeture natif, posé dessous */
  }
  html.has-modal-open header .wp-block-navigation__responsive-container-open::before,
  html.has-modal-open header .wp-block-navigation__responsive-container-open::after {
    width: 28px;
    height: 3px;
    margin: -1.5px 0 0 -14px;
    border-radius: 2px;
  }
  html.has-modal-open header .wp-block-navigation__responsive-container-open::before { transform: rotate(45deg); }
  html.has-modal-open header .wp-block-navigation__responsive-container-open::after  { transform: rotate(-45deg); }

  /* --- Overlay : toujours rendu, révélé en cercle depuis le burger ---------- */
  header .wp-block-navigation__responsive-container {
    display: flex !important;
    position: fixed;
    inset: 0;
    z-index: 100000;
    /* !important : le cœur pose `.is-menu-open { background-color: inherit }`
       (spécificité supérieure), ce qui rendait l'overlay transparent. */
    background-color: var(--wp--preset--color--contrast, #ffd5d2) !important;
    visibility: hidden;
    pointer-events: none;
    animation: none !important;       /* fondu de 0,1 s du cœur */
    overflow-x: hidden;               /* explicite : overflow-y:auto seul rendrait l'axe X défilable */
    overflow-y: auto;
    clip-path: circle(0px at var(--ac-menu-x, calc(100% - 44px)) var(--ac-menu-y, 100px));
    transition: clip-path .75s cubic-bezier(.65, 0, .35, 1), visibility 0s .75s;
  }
  header .wp-block-navigation__responsive-container.is-menu-open {
    visibility: visible;
    pointer-events: auto;
    clip-path: circle(150% at var(--ac-menu-x, calc(100% - 44px)) var(--ac-menu-y, 100px));
    transition: clip-path .75s cubic-bezier(.65, 0, .35, 1), visibility 0s;
  }
  /* pendant une transition de page AJAX le panneau couvre tout : fermeture sèche */
  html.ac-navigating header .wp-block-navigation__responsive-container { transition: none !important; }

  header .wp-block-navigation__responsive-container .wp-block-navigation__responsive-close,
  header .wp-block-navigation__responsive-container .wp-block-navigation__responsive-dialog,
  header .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
    width: 100%;
    padding: 0 !important;
    margin: 0;
  }
  /* la liste par défaut du cœur (doublon de la superposition) reste masquée */
  header .wp-block-navigation__responsive-container.disable-default-overlay > .wp-block-navigation__responsive-close > .wp-block-navigation__responsive-dialog > .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
    display: none;
  }

  /* --- Contenu de la superposition (part « Superposition de navigation ») --- */
  header .wp-block-navigation__overlay-container > .wp-block-group {
    background: transparent !important;
    min-height: 100dvh !important;
    box-sizing: border-box;
    /* le haut est laissé à l'en-tête (logo + croix), 158 px sur mobile */
    padding: 200px var(--wp--preset--spacing--50, 1.5rem) var(--wp--preset--spacing--60, 3rem) !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }
  /* bouton de fermeture natif : invisible mais actif, posé sous le burger par app.js */
  header .wp-block-navigation-overlay-close {
    position: fixed;
    top: 90px;
    left: auto;
    right: 20px;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    opacity: 0;
    z-index: 2;
    border-radius: 50%;
  }
  header .wp-block-navigation-overlay-close svg,
  header .wp-block-navigation-overlay-close .wp-block-navigation-overlay-close__text { display: none; }
  header .wp-block-navigation-overlay-close:focus-visible {
    opacity: 1;
    outline: 2px solid currentColor;
    outline-offset: 2px;
  }

  /* entrées : grand corps, pastille recalée (elle était coupée par le bord) */
  header .wp-block-navigation__overlay-container .wp-block-navigation__container {
    padding-left: 46px;
    gap: 1.15rem !important;
  }
  header .wp-block-navigation__overlay-container .wp-block-navigation-item__content {
    display: inline-flex !important;
    font-size: clamp(2.1rem, 9.5vw, 2.7rem);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -.01em;
    color: var(--wp--preset--color--accent-1, #000);
    text-decoration: none !important;
  }
  header .wp-block-navigation__overlay-container .wp-block-navigation-item__label::before {
    width: 30px;
    height: 30px;
    left: -46px;
    top: calc(50% - 15px);
    transform-origin: 50% 50%;
    transition: none;
  }
  header .wp-block-navigation__overlay-container .wp-block-navigation-item__label::after { content: none; }

  /* apparition en cascade à l'ouverture (remise à zéro instantanée à la fermeture).
     border:0 : les items héritent d'un séparateur `border-right: 2px solid`
     blanc prévu pour la barre desktop, visible en traits sur le rose. */
  header .wp-block-navigation__overlay-container .wp-block-navigation-item {
    border: 0 !important;
    opacity: 0;
    transform: translateY(26px);
  }
  header .wp-block-navigation__overlay-container .wp-block-navigation-item__label::before { transform: scale(0); }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item {
    animation: ac-menu-item .7s var(--ac-roll-ease) forwards;
  }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item__label::before {
    animation: ac-menu-dot .55s var(--ac-roll-spring) forwards;
  }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(1),
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(1) .wp-block-navigation-item__label::before { animation-delay: .32s; }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(2),
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(2) .wp-block-navigation-item__label::before { animation-delay: .42s; }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(3),
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(3) .wp-block-navigation-item__label::before { animation-delay: .52s; }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(4),
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(4) .wp-block-navigation-item__label::before { animation-delay: .62s; }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(n+5),
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item:nth-child(n+5) .wp-block-navigation-item__label::before { animation-delay: .72s; }
}
@keyframes ac-menu-item { to { opacity: 1; transform: none; } }
@keyframes ac-menu-dot  { to { transform: scale(1); } }

@media (max-width: 599.98px) and (prefers-reduced-motion: reduce) {
  header .wp-block-navigation__responsive-container,
  header .wp-block-navigation__responsive-container-open,
  header .wp-block-navigation__responsive-container-open::before,
  header .wp-block-navigation__responsive-container-open::after { transition: none; }
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item,
  header .is-menu-open .wp-block-navigation__overlay-container .wp-block-navigation-item__label::before { animation-duration: 0s; animation-delay: 0s; }
}


/* -------------------------------------------------------------------------- */
/* 32) Dégagement sous l'en-tête fixe sur écrans étroits (15/09/2026)          */
/*                                                                            */
/* L'en-tête est fixe et fait ~158 px de haut quelle que soit la largeur. Le   */
/* modèle `page` dégage 200 px en dur, mais l'accueil (modèle 71) et les       */
/* fiches projet (modèle 34) s'appuient sur `spacing-80`, fluide :            */
/* clamp(70px, 10vw, 140px). Sous ~900 px il tombe à 70-90 px et le titre     */
/* passe SOUS l'en-tête (constaté à 390 px : « Vous faites de l'archi… » et   */
/* les titres de fiches coupés). On aligne sur les 200 px du modèle page.     */
/* -------------------------------------------------------------------------- */
@media (max-width: 899.98px) {
  /* accueil : 1er groupe (spacing-80) + groupe du titre (spacing-80) → titre à ~230 px */
  body.home .smooth-content > .wp-block-group:first-child { padding-top: 160px !important; }
  /* fiche projet : le titre vit dans le contenu, on dégage l'enveloppe */
  body.single-projet .smooth-content { padding-top: 200px !important; }
}


/* -------------------------------------------------------------------------- */
/* 33) Pied de page : roll-hover du menu (Newsletter, Linkedin, FAQ, Mentions,  */
/*     Cookies) (16/09/2026)                                                    */
/*                                                                            */
/* Liste → vrai roll-hover : les entrées non survolées s'estompent, celle sous  */
/* le curseur reste pleine. Trois gestes du site combinés : la pastille ● du   */
/* menu (Ellipse-3.svg) qui surgit à gauche sur le ressort des pastilles,      */
/* le soulignement animé à deux couches de `mark a` (un trait blanc de 2 px    */
/* balaie le trait noir) et l'estompage des voisins. Le soulignement statique  */
/* de `.nav-souligne` est remplacé par un fond sur le libellé (animable) ;     */
/* padding-bottom 6 px = l'ancien text-underline-offset.                        */
/* -------------------------------------------------------------------------- */
footer .wp-block-navigation.nav-souligne,
footer .wp-block-navigation.nav-souligne .wp-block-navigation__container {
  text-decoration: none;
}
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item {
  transition: opacity .25s ease-out;
}
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__content {
  text-decoration: none !important;
  color: inherit;
}
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__label {
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
  background-image:
    linear-gradient(var(--wp--preset--color--base, #fff), var(--wp--preset--color--base, #fff)),
    linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-size: 0 2px, 100% 1px;
  background-position: 0 100%, 0 100%;
  transition: background-size .4s var(--ac-roll-ease);
}
/* la pastille, tapie à gauche */
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__label::before {
  content: "";
  position: absolute;
  left: -22px;
  top: calc(50% - 3px);          /* centre du texte (le padding-bottom est hors texte) */
  width: 12px;
  height: 12px;
  margin-top: -6px;
  background: url(/wp-content/uploads/2026/07/Ellipse-3.svg) center / contain no-repeat;
  opacity: 0;
  transform: translateX(10px) scale(0);
  transition: transform .5s var(--ac-roll-spring), opacity .15s ease-out;
  pointer-events: none;
}
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__content:hover .wp-block-navigation-item__label,
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label {
  background-size: 100% 2px, 100% 1px;
}
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__content:hover .wp-block-navigation-item__label::before,
footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label::before {
  opacity: 1;
  transform: none;
}
@media (hover: hover) {
  footer .wp-block-navigation.nav-souligne:hover .wp-block-navigation-item { opacity: .4; }
  footer .wp-block-navigation.nav-souligne .wp-block-navigation-item:hover { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  footer .wp-block-navigation.nav-souligne .wp-block-navigation-item,
  footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__label,
  footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__label::before { transition: none; }
}

/* -------------------------------------------------------------------------- */
/* 34) En-tête aligné sur la colonne de contenu (16/09/2026)                    */
/*                                                                            */
/* Demande client : mêmes marges pour l'en-tête que pour `.entry-content`.     */
/* Le contenu du site est contraint à --wp--style--global--content-size        */
/* (1200 px) et centré, alors que la barre de l'en-tête est en `alignwide`     */
/* (1400 px) : à 1440 px, le logo commençait à 50 px quand le contenu (titre,  */
/* image de couverture, texte) commençait à 120 px. On contraint la barre      */
/* interne (logo + navigation + filet noir) à la largeur de contenu. En        */
/* dessous de ~1300 px la marge globale (50 px, 30 px sur mobile) reprend la   */
/* main : rien ne bouge sur tablette ni sur mobile.                            */
/* Le fond blanc de `.mainMenu` reste, lui, pleine largeur : c'est le masque   */
/* du contenu qui défile sous l'en-tête fixe.                                  */
/* -------------------------------------------------------------------------- */
header .mainMenu > .wp-block-group.alignwide {
  max-width: var(--wp--style--global--content-size, 1200px);
  margin-inline: auto;
}

/* -------------------------------------------------------------------------- */
/* 35) Pied de page : liens sur une ligne sur mobile (17/09/2026)              */
/*                                                                            */
/* Demande client : les liens du pied de page (Newsletter, Linkedin, FAQ,      */
/* Cookies, et Mentions légales une fois la page publiée) s'empilaient en      */
/* colonne sur mobile, alignés à droite, soit 4 lignes pour 4 liens. On les    */
/* passe en ligne, calés à gauche comme le reste du pied de page, avec un      */
/* retour à la ligne automatique quand la largeur manque (2 lignes à 320 px,   */
/* 1 seule dès 360 px).                                                        */
/* Le sélecteur vise aussi les <ul> : ils portent les mêmes classes que le     */
/* <nav>, et il y en a DEUX tant que « Mentions légales » pointe sur une page  */
/* en brouillon (un lien qui ne rend rien coupe la liste en deux, vérifié).    */
/* La pastille ● du survol se pose à 22 px à gauche du libellé : en colonne    */
/* elle a de la place, en ligne elle collerait le libellé précédent. Sur       */
/* mobile il n'y a pas de survol, on la retire là uniquement (le soulignement  */
/* animé, lui, reste).                                                         */
/* -------------------------------------------------------------------------- */
@media (max-width: 599.98px) {
  footer .wp-block-navigation.nav-souligne,
  footer .wp-block-navigation.nav-souligne .wp-block-navigation__container {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    column-gap: 22px;
    row-gap: 12px;
  }
  footer .wp-block-navigation.nav-souligne .wp-block-navigation-item__label::before {
    content: none;
  }
}

/* -------------------------------------------------------------------------- */
/* 36) Pied de page : titre « Lancer la conversation » (18/09/2026)            */
/*                                                                            */
/* Le lien portait DEUX traits : celui de `.titre-souligne` (soulignement du   */
/* paragraphe, 2 px à 8 px sous le texte) et celui de la règle des liens texte */
/* du §29 (1 px collé au texte). Le lien est donc sorti du §29 (exclusion      */
/* `:not(.titre-souligne a)`), le soulignement du paragraphe est neutralisé,   */
/* et le trait est redessiné en fond : UN SEUL trait, mais animable.           */
/*                                                                            */
/* Au survol il se redessine : la couche ancrée à droite file vers la droite,  */
/* puis la couche ancrée à gauche se retrace depuis la gauche. Deux couches    */
/* sont nécessaires car une transition ne peut pas cadencer différemment les   */
/* deux fonds d'une même propriété : on passe donc par des keyframes, qui      */
/* elles décrivent les deux tailles à chaque instant. À l'état final le trait  */
/* est identique à l'état de repos, la sortie de survol ne provoque donc       */
/* aucun saut visible.                                                         */
/* -------------------------------------------------------------------------- */
footer .titre-souligne {
  text-decoration: none;
}
footer .titre-souligne a {
  text-decoration: none !important;
  padding-bottom: 8px;                 /* reprend l'ancien text-underline-offset */
  background-image:
    linear-gradient(currentColor, currentColor),
    linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat, no-repeat;
  background-position: 100% 100%, 0 100%;   /* sortante à droite, entrante à gauche */
  background-size: 100% 2px, 0 2px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;              /* le titre passe sur deux lignes sur mobile */
}
@keyframes ac-titre-redraw {
  0%   { background-size: 100% 2px, 0 2px; }
  48%  { background-size: 0 2px,    0 2px; }
  52%  { background-size: 0 2px,    0 2px; }
  100% { background-size: 0 2px,    100% 2px; }
}
footer .titre-souligne a:hover,
footer .titre-souligne a:focus-visible {
  animation: ac-titre-redraw .62s cubic-bezier(.65, 0, .35, 1) forwards;
}
@media (prefers-reduced-motion: reduce) {
  footer .titre-souligne a:hover,
  footer .titre-souligne a:focus-visible { animation: none; }
}

/* -------------------------------------------------------------------------- */
/* 37) Bannières : hauteur ramenée à l'échelle du téléphone (18/09/2026)       */
/*                                                                            */
/* Les blocs Bannière portent une hauteur minimale EN PIXELS dans le contenu   */
/* (645 px sur les fiches projet, 820 px sur Infos, jusqu'à 954 px sur Hytt) : */
/* calibrée pour un écran large, elle occupait presque tout l'écran d'un       */
/* téléphone (645 px de haut pour 330 px de large, soit un rapport de 2).      */
/* On la plafonne à une valeur fluide, un peu plus haute que large, en         */
/* `!important` puisque la valeur d'origine est en style en ligne. L'image     */
/* est en `object-fit: cover`, elle se recadre donc toute seule.               */
/* Les vignettes de projets ne sont PAS concernées : elles n'ont pas de        */
/* hauteur en pixels mais un rapport d'image (classe `has-aspect-ratio`).      */
/* -------------------------------------------------------------------------- */
@media (max-width: 599.98px) {
  .wp-site-blocks .wp-block-cover:not(.has-aspect-ratio) {
    min-height: clamp(320px, 105vw, 440px) !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 38) FAQ : titres des accordéons sur mobile (18/09/2026)                     */
/*                                                                            */
/* Les en-têtes portent le préréglage `x-large`, dont la plage fluide est très */
/* plate : 32 px sur grand écran, encore 28,3 px à 390 px de large, alors que  */
/* le h1 de la page descend de 40 à 25 px. Sur téléphone les questions        */
/* passaient donc DEVANT le titre de la page, et « La communication » comme    */
/* « Offres et méthodo » se cassaient sur deux lignes dans leur pastille.      */
/* On redescend à environ 20 px, soit le même rapport au h1 que sur grand      */
/* écran (80 %). `!important` obligatoire : les classes de préréglage de       */
/* WordPress (`has-x-large-font-size`) sont elles-mêmes en `!important`.       */
/* -------------------------------------------------------------------------- */
@media (max-width: 599.98px) {
  .wp-block-accordion-heading,
  .wp-block-accordion-heading__toggle {
    font-size: clamp(1.15rem, 5.2vw, 1.375rem) !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 39) En-tête : fond blanc d'un bord à l'autre sur mobile (18/09/2026)        */
/*                                                                            */
/* Le blanc de l'en-tête vit sur la barre interne `.mainMenu`, qui s'arrête à  */
/* la marge globale (30 px sur téléphone) : le contenu qui défile sous         */
/* l'en-tête fixe réapparaissait donc dans les 30 px de chaque côté (bande     */
/* rose de la page Projets, signalée par le client). On peint le fond sur      */
/* l'élément `header` lui-même, qui fait toute la largeur ; la barre interne   */
/* garde son fond, blanc sur blanc, donc rien d'autre ne bouge.                */
/* Sur grand écran le blanc reste volontairement limité à la barre : il y      */
/* couvre déjà toute la largeur utile des contenus.                            */
/* -------------------------------------------------------------------------- */
@media (max-width: 599.98px) {
  header {
    background-color: var(--wp--preset--color--base, #fff);
  }
}