/* === POLICE SEUCOM / MEDECO === */
@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@200;300;400;500;700;800;900&display=swap');

body, h1, h2, h3, h4, h5, h6, .site-name {
  font-family: 'Unbounded', sans-serif;
}

/* =====================================================
   VARIABLES GLOBALES — palette & tokens
   ===================================================== */

:root {
  /* Couleurs principales */
  --noir: #000000;
  --noir-doux: #0a0a0a;
  --blanc: #FFFFFF;
  --vert-pale: #A2E4B8;
  --vert-fonce: #009639;
  --vert-moyen: #00b347;
  --gris-clair: #888888;
  --gris-texte: #cccccc;
  /* Alias utilitaires */
  --black: #000000;
  --white: #ffffff;
  --green-dark: #009639;
  --text-on-dark: rgba(255,255,255,0.92);
  /* Gradients */
  --gradient-vert: linear-gradient(135deg, #009639, #A2E4B8);
  --gradient-vert-subtle: linear-gradient(135deg, #009639, #00b347);
  /* Typographie */
  --font-brand: 'Unbounded', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  /* Layout */
  --container: 1400px;
  --radius: 16px;
  --radius-sm: 10px;
  --transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =====================================================
   GÉNÉRAL
   ===================================================== */

.logo img {
  max-width: 300px !important;
}
.onscroll .header-container .logo img {
  max-width: 150px !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500;
}
h4 { font-size: 18px; }
h3 { font-size: 1rem; }
h2 {
  font-size:28px;
  margin-top: var(--mt-text-size);
  margin-bottom: 30px;
  color: var(--mt-color-base);
}

.internal-banner-container h1.page-title {
	font-size: 2rem;
	margin: 8px 10px !important;
}

h1.page-title {
  margin-bottom: 20px !important;
  font-size: 32px;
}

.header-container .site-name-enabled.site-slogan-enabled .logo-and-site-name-wrapper {
  display: flex;
}
.site-name a {
  font-size: 27px;
  font-weight: 500;
  text-transform: uppercase;
}
.site-slogan {
  font-size: 18px;
  font-weight: 400;
  color: #75d78d;
}

.header-container .logo-enabled .logo-and-site-name-wrapper,
.header-container .site-slogan-enabled .logo-and-site-name-wrapper {
  padding: 0 !important;
}

@media screen and (max-width: 680px) {
  .nomobile { display: none; }
  .breadcrumb__item { display: inline !important; }
  .breadcrumb { padding: 10px; }
}
@media screen and (min-width: 680px) {
  .mobile { display: none; }
  div.sf-accordion-toggle.sf-style-white a { width: 100%; }
}

.path-taxonomy .main-content__container { padding: 30px 0; }
.path-taxonomy .main-content__section { padding: 20px 0; }
.main-content__section, .sidebar__section { padding: 0px 0 0px; }

a { text-decoration: none; color: inherit; }

body { overflow-x: hidden; }

/* =====================================================
   MENU PRINCIPAL (header)
   ===================================================== */

.region--shade-background .menu.cta-active > li:last-child > a:before,
.region--dark-background .menu.cta-active > li:last-child > a:before,
.region--shade-background .menu.cta-active > li:last-child > a.is-active:before,
.region--dark-background .menu.cta-active > li:last-child > a.is-active:before {
  background-color: hsl(0deg 0% 100%);
  border: 2px solid #171c26 !important;
}
.region--shade-background .menu.cta-active > li:last-child > a:hover:before,
.region--dark-background .menu.cta-active > li:last-child > a:hover:before,
.region--shade-background .menu.cta-active > li:last-child > a.is-active:hover:before,
.region--dark-background .menu.cta-active > li:last-child > a.is-active:hover:before {
  background-color: hsl(0deg 0% 67.4%);
  border: 2px solid #171c26 !important;
}
.header-container .sf-menu ul li.sfHover > a,
.header-container .sf-menu ul li a:hover,
.header-container .sf-menu ul li > a.is-active,
.header-container .sf-menu ul li.active-trail > a {
  color: var(--mt-color-base-contrast);
}
.header-container ul.menu > li.sfHover > a,
.header-container ul.menu > li.sfHover > span {
  color: var(--mt-color-base-contrast);
}
.region--shade-background .menu.cta-active:hover > li:last-child > a,
.region--dark-background .menu.cta-active:hover > li:last-child > a,
.region--shade-background .menu.cta-active:hover > li:last-child > a.is-active:before,
.region--dark-background .menu.cta-active:hover > li:last-child > a.is-active {
  color: #1f2023 !important;
}
.header-container ul.menu > li > a,
.header-container ul.menu > li > span {
  font-size: 16px;
  font-weight: 500;
  padding: 38px 16px;
  margin: 0 9px;
}
.header-container .sf-menu.menu ul {
  display: none;
  padding: 5px;
  text-align: left;
  left: 0;
  top: 100%;
  background-color: #ffffff;
  margin-top: -1px;
  border-width: 0px;
  min-width: 12em;
  border-radius: 0 10px 15px 15px;
  border-top: 5px solid var(--mt-color-primary-dark) !important;
}
.header-container .sf-menu ul li a,
.header-container .sf-menu ul li > span {
  font-size: 14px;
  line-height: 1.5;
  padding: 11px 1em 13px;
  display: block;
  color: var(--mt-color-base);
  font-weight: 700 !important;
}
.header-container ul.sf-menu .sf-sub-indicator {
  right: 0px;
  width: 13px;
  font-size: 14px;
  font-weight: 400;
  top: 47px;
  margin-top: 0px;
}

/* =====================================================
   RÉFÉRENCES (bandeau défilant logos)
   ===================================================== */

.references { background: var(--black); padding: 100px 0; overflow: hidden; }
.references-inner { max-width: var(--container); margin: 0 auto; padding: 0 40px; }
.ref-track-wrapper { overflow: hidden; margin-top: 56px; position: relative; }
.ref-track-wrapper::before,
.ref-track-wrapper::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 100px;
  z-index: 10;
  pointer-events: none;
}
.ref-track-wrapper::before { left: 0; background: linear-gradient(to right, var(--black), transparent); }
.ref-track-wrapper::after  { right: 0; background: linear-gradient(to left, var(--black), transparent); }
.ref-track {
  display: flex;
  animation: scrollRefs 150s linear infinite;
  width: max-content;
  background: #171717;
}
.ref-track:hover { animation-play-state: paused; }
@keyframes scrollRefs { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.ref-item {
  width: 225px;
  height: 210px;
  align-items: flex-end;
  display: flex;
  justify-content: center;
  padding: 0 20px;
  border-right: 1px solid var(--black-border);
  flex-shrink: 0;
  font-size: 1rem;
}
.ref-item img {
  margin: 0px 0 15px;
  filter: brightness(100%) invert(100%) grayscale(100%);
  transition: ease 0.5s;
}
.ref-item img:hover { filter: brightness(100%); }
.ref-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted-dark);
  text-align: center;
  letter-spacing: 0.03em;
  transition: color var(--transition);
  margin: 0px 0 0;
  min-height: 43px;
  display: block;
}
.ref-item:hover .ref-name { color: var(--white); }
.ref-stat {
  align-items: center;
  gap: 40px;
  margin-top: 56px;
  padding-top: 48px;
  border-top: 1px solid var(--black-border);
}

@media screen and (min-width: 980px) {
  .ref-stat {
    display: flex;
  }
}

.ref-stat-item { text-align: left; }
.ref-stat-number { font-family: var(--font-brand); font-size: 30px; font-weight: 700; color: var(--white); line-height: 1; }
.ref-stat-number em { color: var(--green-dark); font-style: normal; }
.ref-stat-label { font-family: var(--font-body); font-size: 13px; color: var(--text-muted-dark); margin-top: 6px; }
.ref-stat-divider { width: 1px; height: 48px; background: var(--black-border); flex-shrink: 0; }

/* =====================================================
   SECTIONS SPÉCIFIQUES
   ===================================================== */
.onscroll .hero-stats {display:none;}
.path-frontpage .banner { padding: 0px 0 0px; }
.path-frontpage .main-content__section { padding-bottom: 0; padding-top: 0px; }
.path-frontpage .hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

.block-mt-hero-v2 > .content.one-column,
.block-mt-hero-v2 > .content.align-items-end { padding: 15px 0 0; }

@media (min-width: 1200px) {
  .block-mt-hero-v2 .field--name-field-mt-hero-v2-description p { margin-bottom: 5px; }
  .block-mt-hero-v2 .field--name-field-mt-hero-v2-description { margin-bottom: 0px; }
  .mb-xl-5 { margin-bottom: 1.5rem !important; }
  .block-mt-hero-v2 > .content { padding: 20px 0; }
  #banner .ps-xl-5 { padding-left: 0rem !important; }
  #banner .pe-xl-5 { padding-right: 0rem !important; }
}

.mt--image-circle .block-mt-hero-v2 .one-column.image-first .field--name-field-mt-hero-v2-title,
.block-mt-hero-v2 .field--name-field-mt-hero-v2-description { position: relative; }

.background-image.background-image--attachment-scroll {
  background-attachment: scroll;
  background-size: cover;
}
.hero-top__container { padding-top: 0; padding-bottom: 0; }
.internal-banner, .internal-banner-container, .hero-top { min-height: 0; }
.banner__section .block:last-child h1.page-title { margin-bottom: 26px; }
.banner__section h1.page-title { text-align: left; margin-bottom: 0; margin-top: 0; }
.banner__section .block:first-child .breadcrumb { padding-top: 5px; }

.view-header .mt-view-header {
  display: block;
  margin: 0px 0 40px;
  font-size: 25px;
  text-align: center;
}
.tab-content > .active {
  display: block;
  background: #f0f0f0;
  padding: 30px;
  border: 0px solid;
}
.tab-content b, .tab-content strong { font-weight: bolder; color: #dca501; }

@media (min-width: 992px) {
  .field--name-field-mt-prd-specifications > .field__items > .field__item {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
}

input.form-text, input.form-tel, input.form-email, input.form-url, input.form-search,
input.form-file, input.form-number, input.form-color, input.form-date, input.form-time,
textarea, select { background-color: #ffffff; }

.view-pricing-tables .pricing-table .pricing-table-body .svg-inline--fa {
  color: var(--mt-color-primary);
  margin: 0px 15px 0 0;
}
.view-pricing-tables .pricing-table .pricing-table-body::first-letter {
  text-transform: uppercase;
  font-weight: bold;
}
.view-pricing-tables .pricing-table .views-field-item {
  margin: 10px 20px;
  border-bottom: 1px dotted;
  padding: 0 0 10px 0;
  font-size: 16px;
  min-height: 60px;
  display: flex;
  align-items: center;
}
a.mt-button, .mt-button > a, button.mt-button,
input[type="submit"], input[type="reset"], input[type="button"] {
  font-size: 19px;
}
.view-pricing-tables .view-footer {
  font-size: 23px;
  text-align: center;
  padding-top: 35px;
  max-width: 980px;
  margin: 0 auto;
}
.view-pricing-tables { padding-top: 0 !important; }
.view-pricing-tables .view-header { padding-bottom: 0px; }

.mt-sticky-element {
  position: -webkit-sticky;
  position: sticky;
  border: 1px solid;
  padding: 10px;
  border-radius: 15px;
}
.product-content-second ul { margin-bottom: 15px; padding-left: 0; list-style: none; }
.product-content-second ul li { padding: 0 0 10px 35px; position: relative; }
.product-content-second ul li:before {
  content: "\f058";
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: -3px;
  font-size: 20px;
  color: var(--mt-color-primary-dark);
}
hr { border-top: 10px solid #1f2023; margin-bottom: 10px; margin-top: 10px; }
table tr td {
  border-style: solid;
  border-width: 1px;
  padding: 12px 26px;
  background-color: transparent;
  font-weight: 400;
  color: var(--mt-color-base);
  border-color: var(--mt-form-border);
  vertical-align: middle;
  text-align: center;
}
.internal-banner__meta { padding-top: 16px; font-size: 16px; margin-bottom: 30px; }

@media (min-width: 768px) {
  .node--type-mt-post.node--view-mode-full .node__container { justify-content: center; }
}

.paragraph--view-mode--mt-tile .feature__icon {
  margin-bottom: 15px;
  font-size: 36px;
  font-style: normal !important;
  font-weight: 900 !important;
  font-family: 'Font Awesome 5 Free' !important;
}
.paragraph--view-mode--mt-tile .feature__icon i {
  font-style: normal !important;
  font-family: 'Font Awesome 5 Free' !important;
}

.node--type-mt-product .field.field--name-field-mt-prd-subtitle {
  font-size: 37px;
  font-weight: 500;
  margin-bottom: 30px;
  line-height: 1.2;
}
.block-mt-hero-v2 .field--name-field-mt-hero-v2-image img { border-radius: 15px !important; }
#block-flashyplus-heroquisuisje .overlay-container img { border-radius: 100% !important; max-width: 220px; }

.col-12 .block-local-tasks-block { padding-bottom: 0px; }
ul.tabs.primary { margin-bottom: 10px; }
.highlighted-top__section { padding: 60px 0; }

#block-mt-news-flashyplus-views-block-mt-posts-grid-block-2 .views-row a { color: hsl(220deg 24.59% 11.96%); }

.page-node-2409 #main-content { padding: 30px; background: #f0f0f0; }

#main-content { padding: 30px;}
/* =====================================================
   MEDECO / SEUCOM — Surcharges et helpers
   ===================================================== */

/* === SECTIONS SOMBRES / CLAIRES === */
.section--dark  { background: var(--mt-color-dark);    color: var(--mt-color-dark-contrast); }
.section--green { background: var(--mt-color-primary); color: var(--mt-color-primary-contrast); }
.section--tint  { background: var(--mt-color-tint);    color: var(--mt-color-tint-contrast); }

/* === BOUTONS CTA === */
.btn-primary, .button--mt-color-base {
  background: var(--mt-color-primary);
  border: 2px solid var(--mt-color-primary);
  color: #fff;
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  letter-spacing: 0.05em;
  transition: background 0.2s, border-color 0.2s;
}
.btn-primary:hover,
.button--mt-color-base:hover {
  background: var(--mt-color-primary-dark);
  border-color: var(--mt-color-primary-dark);
}

/* === FOCUS / ACCESSIBILITE === */
:focus-visible { outline: 2px solid var(--mt-color-primary); outline-offset: 3px; }

/* === ACCENTUATION TITRE H2 === */
.mt-bg-shade h2, .mt-bg-dark h2, .section--dark h2 { color: var(--mt-color-primary-light); }

/* =====================================================
   FICHE PRODUIT
   ===================================================== */

.produit-hero {
  background: var(--mt-color-tint);
  color: var(--mt-color-tint-contrast);
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.produit-hero__inner {
  position: relative;
  z-index: 2;
  padding: 40px 20px;
  max-width: 1400px;
  margin: 0 auto;
  width: 100%;
}
.produit-hero h1 {
  font-family: 'Unbounded', sans-serif;
  font-weight: 800;
  color: var(--mt-color-base);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  line-height: 1.15;
  margin-bottom: 8px;
}
.produit-hero__ref {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.72rem;
  font-weight: 300;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mt-color-primary);
  margin-bottom: 6px;
}
.produit-hero__cat {
  display: inline-block;
  background: var(--mt-color-primary);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 12px;
  margin-bottom: 16px;
}
.produit-description {
  background: var(--mt-color-bright);
  color: var(--mt-color-base);
  padding:20px;
}
.produit-description__inner { max-width: 1400px; margin: 0 auto; }
.produit-description .field--name-body { font-size: 1rem; line-height: 1.8; max-width: 800px; }

/* Formulaire devis */
.produit-devis {
  background: var(--mt-color-bright);
  color: var(--mt-color-base);
  border-top: 2px solid var(--mt-color-tint);
  padding: 20px;
}
.produit-devis__inner { 
  /* max-width: 860px;  */
  /* margin: 0 auto;  */
}
.produit-devis__title {
  font-family: 'Unbounded', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--mt-color-base);
  margin-bottom: 8px;
}
.produit-devis__intro {
  font-size: 0.9rem;
  color: var(--mt-color-base);
  opacity: 0.6;
  margin-bottom: 30px;
  line-height: 1.7;
}
.produit-devis .btn,
.produit-devis input[type='submit'],
.produit-devis button[type='submit'] {
  background: var(--mt-color-primary);
  color: var(--mt-color-primary-contrast);
  border: 2px solid var(--mt-color-primary);
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 14px 32px;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.produit-devis .btn:hover,
.produit-devis input[type='submit']:hover {
  background: var(--mt-color-primary-dark);
  border-color: var(--mt-color-primary-dark);
}
.produit-devis .webform-button--previous {
  background: transparent;
  color: var(--mt-color-base);
  border: 2px solid #d4d4d4;
}
.produit-devis .webform-button--previous:hover {
  border-color: var(--mt-color-primary);
  color: var(--mt-color-primary);
  background: transparent;
}
.produit-devis .form-item,
.produit-devis .js-form-item { margin-bottom: 20px; }
.produit-devis .form-item label,
.produit-devis .form-item__label,
.produit-devis label {
  display: block;
  color: var(--mt-color-base);
  opacity: 0.7;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.produit-devis input[type='text'],
.produit-devis input[type='email'],
.produit-devis input[type='tel'],
.produit-devis input[type='number'],
.produit-devis textarea,
.produit-devis select {
  display: block;
  width: 100%;
  background: #fff;
  border: 1px solid #d4d4d4;
  color: var(--mt-color-base);
  padding: 12px 14px;
  border-radius: 4px;
  font-size: 0.95rem;
  line-height: 1.5;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.produit-devis input:focus,
.produit-devis textarea:focus,
.produit-devis select:focus {
  border-color: var(--mt-color-primary);
  box-shadow: 0 0 0 2px rgba(0, 150, 57, 0.12);
  outline: none;
}
.produit-devis textarea { min-height: 110px; resize: vertical; }
.produit-devis input::placeholder,
.produit-devis textarea::placeholder { color: #aaa; }
.produit-devis .form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23009639' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
  appearance: none;
}
.produit-devis .form-actions { margin-top: 20px; display: flex; gap: 12px; align-items: center; }
.produit-devis .form-required { color: var(--mt-color-primary); }
.produit-devis .form-item--error input,
.produit-devis .form-item--error textarea { border-color: var(--mt-color-danger); }
.produit-devis .form-item--error-message { color: var(--mt-color-danger); font-size: 0.8rem; }
.produit-devis fieldset { border: 1px solid #e5e5e5; padding: 20px; margin-bottom: 20px; border-radius: 6px; }
.produit-devis legend { color: var(--mt-color-base); opacity: 0.6; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0 8px; }
.produit-devis .webform-flexbox { display: flex; gap: 20px; flex-wrap: wrap; }
.produit-devis .webform-flexbox .form-item { flex: 1 1 200px; }

/* Hero : grille 2 colonnes texte|image */
.produit-hero__inner--has-image {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.produit-hero__text { align-self: center; }
.produit-hero__media { display: flex; align-items: center; justify-content: center; }
.produit-hero__media img {
  max-height: 300px;
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.15));
}
.produit-hero__media .field__label,
.produit-hero__media .field__item:before { display: none; }

/* Produits associés */
.produit-associes {
  background: var(--mt-color-tint);
  color: var(--mt-color-tint-contrast);
  padding: 50px 20px;
}
.produit-associes__inner { max-width: 1400px; margin: 0 auto; }
.produit-associes__title {
  font-family: 'Unbounded', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 30px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--mt-color-primary);
}

@media (max-width: 768px) {
  .produit-hero__inner--has-image { grid-template-columns: 1fr; }
  .produit-hero__media { order: -1; }
  .produit-hero__media img { max-height: 200px; }
  .produit-hero__inner,
  .produit-description__inner,
  .produit-devis__inner,
  .produit-associes__inner {
    padding-left: 15px;
    padding-right: 15px;
  }
  .produit-devis { padding: 30px 15px; }
  .produit-devis .webform-flexbox { flex-direction: column; gap: 0; }
  .produit-devis .form-actions { flex-direction: column; }
}

/* =====================================================
   ACCUEIL — Hero slider & sections
   ===================================================== */

/* Topbar */
.topbar {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.topbar-left { display: flex; align-items: center; gap: 24px; }
.topbar-info { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: bold; }
.topbar-info svg { width: 24px; height: 24px; opacity: 0.5; color: #007b1a; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.topbar-cta {
  display: flex; align-items: center; gap: 8px;
  background: var(--mt-color-primary); color: white;
  padding: 6px 14px; font-size: 10px; font-weight: 600;
  font-family: var(--font-display); letter-spacing: 0.05em; text-transform: uppercase;
  transition: background 0.2s;
}
.topbar-cta:hover { background: var(--mt-color-primary-dark); }

/* Navbar */
.navbar {
  position: sticky; top: 0; z-index: 100;
  background: rgba(0,0,0,0.95);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--mt-form-border);
  padding: 0 40px;
  height: 72px;
  display: flex; align-items: center; justify-content: space-between;
}
.navbar-logo img { height: 36px; width: auto; }
.navbar-nav { display: flex; align-items: center; gap: 4px; }
.nav-item {
  font-family: var(--font-display); font-size: 10px; font-weight: 400;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 8px 14px; color: var(--mt-color-accent-dark);
  transition: color 0.2s; cursor: pointer; position: relative;
}
.nav-item:hover { color: var(--mt-color-base-contrast); }
.nav-item.active { color: var(--mt-color-primary); }
.navbar-actions { display: flex; align-items: center; gap: 12px; }
.btn-devis {
  background: transparent; border: 1px solid var(--mt-color-primary);
  color: var(--mt-color-primary); padding: 8px 20px;
  font-family: var(--font-display); font-size: 10px;
  font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  transition: all 0.2s; cursor: pointer;
}
.btn-devis:hover { background: var(--mt-color-primary); color: white; }
.btn-contact {
  background: var(--mt-color-primary); color: white;
  padding: 8px 20px;
  font-family: var(--font-display); font-size: 10px;
  font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  transition: background 0.2s; cursor: pointer;
}
.btn-contact:hover { background: var(--mt-color-primary-dark); }

/* Hero slides */
.hero-slides { position: absolute; inset: 0; }
.hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; }
.hero-slide.active { opacity: 1; }
.slide-1 { background: linear-gradient(135deg, #0a0f0a 0%, #001a08 40%, #003515 70%, #004d1f 100%); }
.slide-2 { background: linear-gradient(135deg, #000000 0%, #0a1a0d 40%, #0f351c 70%, #1a502c 100%); }
.slide-3 { background: linear-gradient(135deg, #0f0f0f 0%, #1a1a0a 40%, #2a2a00 70%, #1a1a00 100%); }
.slide-1::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 80% 50%, rgba(0,150,57,0.18) 0%, transparent 60%),
    radial-gradient(ellipse 40% 60% at 20% 80%, rgba(0,150,57,0.08) 0%, transparent 50%);
}
.slide-2::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 70% 90% at 85% 40%, rgba(30, 180, 148, 0.15) 0%, transparent 60%);
}
.slide-3::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 80% at 70% 60%, rgba(0,150,57,0.12) 0%, transparent 60%);
}
.hero::after {
  content: '';
  position: absolute; inset: 0; pointer-events: none; z-index: 2;
  background: repeating-linear-gradient(
    0deg, transparent, transparent 2px,
    rgba(0,0,0,0.03) 2px, rgba(0,0,0,0.03) 4px
  );
}
.hero-bg-number {
  position: absolute; right: -20px; top: 50%; transform: translateY(-50%);
  font-family: var(--font-display); font-size: 28vw; font-weight: 900;
  color: transparent; -webkit-text-stroke: 1px rgba(0,150,57,0.06);
  pointer-events: none; z-index: 1; user-select: none;
  letter-spacing: -0.05em;
  animation: fadeInNumber 2s ease forwards;
}
@keyframes fadeInNumber {
  from { opacity: 0; transform: translateY(-50%) translateX(40px); }
  to   { opacity: 1; transform: translateY(-50%) translateX(0); }
}
.hero-content {
  position: relative; z-index: 5;
  max-width: 1350px;
  margin: 0 auto; width: 100%;
  padding: 0 40px 80px;
}
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 28px;
  animation: slideUp 0.8s ease 0.2s both;
}
.hero-eyebrow-line { width: 32px; height: 1px; background: var(--mt-color-primary); }
.hero-eyebrow-text {
  font-family: var(--font-display); font-size: 10px; font-weight: 400;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--mt-color-primary);
}
.hero-title {
  font-size: clamp(1.8rem, 5vw, 4rem);
  line-height: 1.0;
  color: white;
  margin-bottom: 24px;
  animation: slideUp 0.8s ease 0.4s both;
}
.hero-title em { font-style: normal; color: var(--mt-color-primary); }
.hero-subtitle {
  font-family: var(--font-body); font-weight: 300;
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  color: var(--mt-color-accent-dark); max-width: 560px;
  line-height: 1.7; margin-bottom: 40px;
  animation: slideUp 0.8s ease 0.6s both;
}
.hero-actions {
  display: flex; gap: 16px; flex-wrap: wrap;
  animation: slideUp 0.8s ease 0.8s both;
}
.btn-primary:hover { transform: translateY(-2px); }
.btn-primary svg { width: 14px; height: 14px; transition: transform 0.2s; }
.btn-primary:hover svg { transform: translateX(4px); }
.btn-secondary:hover { border-color: white; background: rgba(255,255,255,0.05); transform: translateY(-2px); }

/* Stats hero */
.hero-stats {
  bottom: 0; left: 0; right: 0; z-index: 5;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(20px);
  border-top: 1px solid var(--mt-form-border);
}
@media (min-width: 1200px) {
  .hero-stats { position: fixed; }
  .onscroll .hero-stats { position: relative !important; }
}
.hero-stats-inner {
  max-width: var(--max-width); margin: 0 auto;
  display: grid; grid-template-columns: repeat(4, 1fr);
  padding: 0 40px;
}
.stat-item {
  padding: 13px 24px;
  border-right: 1px solid var(--mt-form-border);
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-content: center;
  justify-content: center;
  align-items: center;
}
.stat-item:last-child { border-right: none; }
.stat-number {
  font-family: var(--font-display); font-size: 1.8rem;
  font-weight: 700; color: var(--mt-color-primary); letter-spacing: -0.02em;
}
.stat-label {
  font-size: 11px; color: var(--mt-color-accent-dark);
  letter-spacing: 0.05em; text-transform: uppercase;
  font-family: var(--font-body);
}

/* Slide dots & nav */
.slide-dots {
  bottom: 142px; right: 144px; z-index: 6;
  display: flex; flex-direction: column; gap: 10px;
}
.dot {
  width: 4px; height: 20px; background: rgba(255,255,255,0.25);
  cursor: pointer; transition: all 0.4s ease; border-radius: 2px; border: none;
}
.dot.active { background: var(--mt-color-primary); height: 44px; box-shadow: 0 0 12px rgba(0,150,57,0.6); }
.hero-nav {
  bottom: 132px; right: 40px; z-index: 6;
  display: flex; gap: 8px;
}
.hero-nav-btn {
  width: 44px; height: 44px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.3s; color: white;
}
.hero-nav-btn:hover {
  background: var(--mt-color-primary);
  border-color: var(--mt-color-primary);
  box-shadow: 0 0 16px rgba(0,150,57,0.4);
}
.hero-nav-btn svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; }

/* Slide visual (image produit droite) */
.slide-visual {
  position: absolute;
  right: 0; top: 0;
  width: 50%; height: 75%;
  display: flex; align-items: center; justify-content: center;
  z-index: 2; pointer-events: none;
}
.slide-visual-frame {
  position: relative;
  width: 48%;
  display: flex; align-items: center; justify-content: center;
}
.slide-visual-frame::before {
  content: '';
  position: absolute; inset: 0;
  border: 1px solid rgba(0,150,57,0.2);
  z-index: 1;
}
.slide-visual-frame::after {
  content: '';
  position: absolute;
  top: -8px; right: -8px;
  width: 48px; height: 48px;
  border-top: 2px solid rgba(0,150,57,0.5);
  border-right: 2px solid rgba(0,150,57,0.5);
  z-index: 2;
}
.slide-visual-img {
  width: 100%; height: 100%;
  object-fit: contain;
  opacity: 0.32;
  filter: brightness(1.3) contrast(0.9) saturate(0.7);
  mix-blend-mode: screen;
  padding: 10px;
  transition: opacity 1.2s ease;
}
.slide-visual-glow {
  position: absolute; inset: -40%;
  background: radial-gradient(ellipse 60% 70% at 50% 50%, rgba(0,150,57,0.08) 0%, transparent 70%);
  pointer-events: none; z-index: 0;
}
.slide-visual-corner-bl {
  position: absolute;
  bottom: -8px; left: -8px;
  width: 48px; height: 48px;
  border-bottom: 2px solid rgba(0,150,57,0.3);
  border-left: 2px solid rgba(0,150,57,0.3);
  z-index: 2;
}
.slide-visual-label {
  position: absolute;
  bottom: -40px; left: 0; right: 0;
  text-align: center;
  font-family: var(--font-display);
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(0,150,57,0.5); z-index: 3;
}

/* Animations */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes visualFadeIn {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}
.hero-slide.active .slide-visual { animation: visualFadeIn 1.2s ease 0.3s both; }

/* Section crédibilité */
.section-cred { background: var(--mt-color-primary); padding: 0; }
.section-cred-inner {
  max-width: var(--max-width); margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 40px; gap: 40px;
}
.cred-item {
  display: flex; align-items: center; gap: 12px;
  padding: 18px 0; flex: 1;
  border-right: 1px solid rgba(255,255,255,0.2);
}
.cred-item:last-child { border-right: none; }
.cred-icon { width: 32px; height: 32px; opacity: 0.9; flex-shrink: 0; }
.cred-text {
  font-family: var(--font-display); font-size: 10px;
  font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: white; line-height: 1.4;
}
.cred-text span { display: block; font-weight: 300; opacity: 0.85; }

/* Section gammes */
.section-gammes { background: var(--mt-color-base-contrast); padding: 30px 0; }
.container { max-width: var(--max-width); margin: 0 auto; padding: 0 40px; }
.page-node-102 .container { max-width: 1450px; padding: 20px 40px; }
.section-header { margin-bottom: 60px; }
.section-label { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.section-label-line { width: 24px; height: 2px; background: var(--mt-color-primary); }
.section-label-text {
  font-family: var(--font-display); font-size: 10px; font-weight: 400;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--mt-color-primary);
}
.section-title em { font-style: normal; color: var(--mt-color-primary); }
.gammes-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; }
.gamme-card {
  position: relative; overflow: hidden;
  background: var(--mt-color-base);
  aspect-ratio: 4/3;
  cursor: pointer;
  transition: transform 0.4s ease;
}
.gamme-img-placeholder img {
	height: auto;
	width: 60%;
	border-radius: 0;
	left: 20%;
	position: relative;
	top: 14%;
	opacity: 0.7;
}
.gamme-card:hover .gamme-overlay { opacity: 1; }
.gamme-card:hover .gamme-img-placeholder { transform: scale(1.07); }
.gamme-img-placeholder { position: absolute; inset: 0; transition: transform 0.6s ease; }
.gamme-1 .gamme-img-placeholder { background: linear-gradient(135deg, #0a1a0a 0%, #0d2a10 40%, #0f3515 70%, #1a4a1e 100%); }
.gamme-2 .gamme-img-placeholder { background: linear-gradient(135deg, #0a1a19 0%, #0d2016 40%, #0f351e 70%, #15452d 100%); }
.gamme-3 .gamme-img-placeholder { background: linear-gradient(135deg, #1a1a0a 0%, #252505 40%, #1a1a00 70%, #222200 100%); }
.gamme-4 .gamme-img-placeholder { background: linear-gradient(135deg, #0a1510 0%, #0d201a 40%, #0f2a20 70%, #152e28 100%); }
.gamme-img-placeholder::after {
  content: '';
  position: absolute;
  width: 200px; height: 200px;
  border: 1px solid rgba(0,150,57,0.15);
  border-radius: 50%;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 40px rgba(0,150,57,0.05), 0 0 0 80px rgba(0,150,57,0.03);
}
.gamme-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,150,57,0.9) 0%, rgba(0,100,38,0.4) 60%, transparent 100%);
  opacity: 0; transition: opacity 0.4s ease;
}
.gamme-content {
  position: absolute; bottom: 0; left: 0; right: 0; padding: 32px;
  z-index: 2;
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 60%, transparent 100%);
}
.gamme-icon-svg { width: 40px; height: 40px; margin-bottom: 12px; }
.gamme-tag {
  font-family: var(--font-display); font-size: 9px; font-weight: 400;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--mt-color-primary); margin-bottom: 8px; display: block;
}
.gamme-name {
  font-family: var(--font-display); font-size: 1.4rem;
  font-weight: 700; color: white; line-height: 1.1; margin-bottom: 4px;
}
.gamme-brand {
  font-family: var(--font-display); font-size: 1rem;
  font-weight: 300; color: var(--mt-color-primary-light);
}
.gamme-desc { font-size: 13px; color: rgba(255,255,255,0.7); margin-top: 8px; line-height: 1.5; display: none; }
.gamme-card:hover .gamme-desc { display: block; }
.gamme-link {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 14px; font-family: var(--font-display);
  font-size: 10px; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: white;
  opacity: 0; transition: opacity 0.3s;
}
.gamme-card:hover .gamme-link { opacity: 1; }
.gamme-link svg { width: 12px; height: 12px; }

/* Footer CTA */
.section-footer-cta { display: grid; grid-template-columns: 1fr 1fr; }
.fcta-card { padding: 80px 60px; position: relative; overflow: hidden; }
.fcta-card-1 { background: var(--mt-color-primary); }
.fcta-card-2 { background: var(--mt-color-base-dark); border: 1px solid var(--mt-form-border); }
.fcta-card::before {
  content: '';
  position: absolute; bottom: -40px; right: -40px;
  width: 200px; height: 200px;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50%;
  box-shadow: 0 0 0 40px rgba(255,255,255,0.04);
}
.fcta-eyebrow { font-family: var(--font-display); font-size: 9px; font-weight: 400; letter-spacing: 0.25em; text-transform: uppercase; margin-bottom: 16px; }
.fcta-card-1 .fcta-eyebrow { color: rgba(255,255,255,0.7); }
.fcta-card-2 .fcta-eyebrow { color: var(--mt-color-primary); }
.fcta-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.5rem, 2.5vw, 2.2rem); color: white; line-height: 1.1; margin-bottom: 16px; letter-spacing: -0.02em; }
.fcta-desc { font-size: 14px; line-height: 1.7; margin-bottom: 32px; max-width: 360px; }
.fcta-card-1 .fcta-desc { color: rgba(255,255,255,0.8); }
.fcta-card-2 .fcta-desc { color: var(--mt-color-accent-dark); }
.fcta-card-1 .btn-primary { background: white; color: var(--mt-color-primary); }
.fcta-card-1 .btn-primary:hover { background: rgba(255,255,255,0.9); }
.fcta-card-2 .btn-primary { background: var(--mt-color-primary); color: white; }

/* Footer */
.footer { background: #000; border-top: 1px solid var(--mt-form-border); padding: 60px 0 0; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 60px; max-width: var(--max-width); margin: 0 auto; padding: 0 40px 60px; }
.footer-brand img { height: 32px; width: auto; margin-bottom: 20px; }
.footer-brand p { font-size: 13px; color: var(--mt-color-accent-dark); line-height: 1.7; max-width: 280px; margin-bottom: 24px; }
.footer-tel { display: inline-flex; align-items: center; gap: 8px; background: var(--mt-color-primary); color: white; padding: 10px 20px; font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: 0.05em; transition: background 0.2s; }
.footer-tel:hover { background: var(--mt-color-primary-dark); }
.footer-col-title { font-family: var(--font-display); font-size: 10px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: white; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--mt-form-border); }
.footer-links { display: flex; flex-direction: column; gap: 10px; }
.footer-link { font-size: 13px; color: var(--mt-color-accent-dark); transition: color 0.2s; }
.footer-link:hover { color: var(--mt-color-primary); }
.footer-bottom { border-top: 1px solid var(--mt-form-border); max-width: var(--max-width); margin: 0 auto; padding: 20px 40px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom-text { font-size: 11px; color: rgba(255,255,255,0.25); font-family: var(--font-body); }
.footer-bottom-links { display: flex; gap: 20px; }
.footer-bottom-links a { font-size: 11px; color: rgba(255,255,255,0.25); transition: color 0.2s; }
.footer-bottom-links a:hover { color: var(--mt-color-primary); }

/* Responsive global */
@media (max-width: 1024px) {
  .navbar { padding: 0 20px; }
  .gammes-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .topbar-left > *:not(:first-child) { display: none; }
  .navbar-nav { display: none; }
  .hero-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .gammes-grid { grid-template-columns: 1fr; }
  .section-footer-cta { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .hero-bg-number { font-size: 50vw; }
}

/* =====================================================
   SIDEBAR — Navigation catalogue
   ===================================================== */

.sidebar__section.sidebar-first {
  position: sticky;
  top: 5rem;
}

#block-flashyplus-navigationprincipale,
#block-flashyplus-navigationprincipale-2 {
  background-color: #ffffff;
  border-radius: 0 8px 8px 0;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

#block-flashyplus-navigationprincipale .title,
#block-flashyplus-navigationprincipale-2 h2 {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #ffffff;
  background-color: #000000;
  margin: 0;
  padding: 0.5rem 1.25rem;
  position: relative;
}
#block-flashyplus-navigationprincipale .title::after,
#block-flashyplus-navigationprincipale-2 h2::after {
  content: '';
  display: block;
  width: 2rem;
  height: 2px;
  background-color: #009639;
  margin-top: 0.45rem;
}

#block-flashyplus-navigationprincipale ul.menu,
#block-flashyplus-navigationprincipale-2 ul.menu {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0;
  background: transparent;
}

/* Liens niveau 1 */
#block-flashyplus-navigationprincipale ul.menu li a,
#block-flashyplus-navigationprincipale-2 ul.menu > li > a {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.4;
  color: #1a1a1a;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 1.25rem 0.65rem 1.4rem;
  position: relative;
  transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease;
  border-left: 3px solid transparent;
}
#block-flashyplus-navigationprincipale ul.menu li.menuparent > a::after,
#block-flashyplus-navigationprincipale-2 ul.menu .menu-item--expanded > a::after {
  content: '';
  display: inline-block;
  margin-left: auto;
  width: 0; height: 0;
  border-style: solid;
  border-width: 4px 0 4px 6px;
  border-color: transparent transparent transparent #009639;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
#block-flashyplus-navigationprincipale ul.menu li a:hover,
#block-flashyplus-navigationprincipale-2 ul.menu > li > a:hover {
  color: #009639;
  background-color: rgba(0, 150, 57, 0.05);
  padding-left: 1.4rem;
  border-left-color: #009639;
}
#block-flashyplus-navigationprincipale ul.menu li a:focus-visible,
#block-flashyplus-navigationprincipale-2 ul.menu > li > a:focus-visible {
  outline: 2px solid #009639;
  outline-offset: -2px;
  color: #009639;
  background-color: rgba(0, 150, 57, 0.06);
}
#block-flashyplus-navigationprincipale ul.menu li a.is-active,
#block-flashyplus-navigationprincipale-2 ul.menu > li > a.is-active,
#block-flashyplus-navigationprincipale ul.menu li a[aria-current="page"],
#block-flashyplus-navigationprincipale-2 ul.menu > li > a[aria-current="page"] {
  color: #009639;
  font-weight: 700;
  background-color: rgba(0, 150, 57, 0.07);
  border-left-color: #009639;
  padding-left: 1.4rem;
}
#block-flashyplus-navigationprincipale ul.menu li.menuparent > a.is-active::after,
#block-flashyplus-navigationprincipale-2 ul.menu .menu-item--expanded > a.is-active::after,
#block-flashyplus-navigationprincipale ul.menu li.menuparent > a[aria-expanded="true"]::after {
  transform: rotate(90deg);
  border-left-color: #009639;
}
#block-flashyplus-navigationprincipale ul.menu > li + li,
#block-flashyplus-navigationprincipale-2 ul.menu > li + li {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

/* Sous-menu niveau 2 */
#block-flashyplus-navigationprincipale ul.menu ul,
#block-flashyplus-navigationprincipale-2 ul.menu ul.menu {
  list-style: none;
  margin: 0; padding: 0;
  background-color: #f9fafb;
  border-top: 1px solid rgba(0, 150, 57, 0.12);
  border-bottom: 1px solid rgba(0, 150, 57, 0.12);
}
ul.menu li > a::before { left: 4px; }
#block-flashyplus-navigationprincipale ul.menu ul li a,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a {
  font-family: 'Unbounded', sans-serif;
  font-weight: 300;
  color: #444444;
  padding: 0.55rem 1.25rem 0.55rem 2rem;
  border-left: 3px solid transparent;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease;
}
#block-flashyplus-navigationprincipale ul.menu ul li a::before,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a::before {
  content: '';
  display: inline-block;
  width: 5px; height: 5px;
  border-radius: 50%;
  background-color: #A2E4B8;
  flex-shrink: 0;
  transition: background-color 0.2s ease, transform 0.2s ease;
  left: 10px; top: 13px;
}
#block-flashyplus-navigationprincipale ul.menu ul li a:hover,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a:hover {
  color: #009639;
  background-color: rgba(0, 150, 57, 0.06);
  padding-left: 2.3rem;
  border-left-color: #A2E4B8;
}
#block-flashyplus-navigationprincipale ul.menu ul li a:hover::before,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a:hover::before {
  background-color: #009639;
  transform: scale(1.3);
}
#block-flashyplus-navigationprincipale ul.menu ul li a:focus-visible,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a:focus-visible {
  outline: 2px solid #009639;
  outline-offset: -2px;
  color: #009639;
}
#block-flashyplus-navigationprincipale ul.menu ul li a.is-active,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a.is-active,
#block-flashyplus-navigationprincipale ul.menu ul li a[aria-current="page"],
#block-flashyplus-navigationprincipale-2 ul.menu ul li a[aria-current="page"] {
  color: #009639;
  font-weight: 500;
  background-color: rgba(0, 150, 57, 0.08);
  border-left-color: #009639;
  padding-left: 2.3rem;
}
#block-flashyplus-navigationprincipale ul.menu ul li a.is-active::before,
#block-flashyplus-navigationprincipale-2 ul.menu ul li a.is-active::before {
  background-color: #009639;
}
#block-flashyplus-navigationprincipale ul.menu ul li + li,
#block-flashyplus-navigationprincipale-2 ul.menu ul li + li {
  border-top: 1px solid rgba(0, 0, 0, 0.04);
}

/* Superfish — sidebar vertical */
#block-flashyplus-navigationprincipale ul.sf-menu { position: static !important; float: none !important; width: 100% !important; }
#block-flashyplus-navigationprincipale ul.sf-menu li { float: none !important; position: relative; }
#block-flashyplus-navigationprincipale ul.sf-menu ul {
  position: static !important; float: none !important; width: 100% !important;
  display: none;
  box-shadow: none !important; border-radius: 0 !important;
  background: #f9fafb !important; border-top: none !important;
  padding: 0 !important; margin: 0 !important;
}
#block-flashyplus-navigationprincipale ul.sf-menu ul:not(.sf-hidden) { display: block !important; }

/* Desktop nav (clearfix.menu) */
#block-flashyplus-navigationprincipale-2 ul.clearfix.menu { padding: 0.5rem 0; }
#block-flashyplus-navigationprincipale-2 .menu-item--expanded > ul.menu { display: block; }

/* Badge Nouveauté */
#block-flashyplus-navigationprincipale ul.menu li a[href*="nouveaute"],
#block-flashyplus-navigationprincipale-2 ul.menu li a[href*="nouveaute"] {
  color: #009639;
  font-weight: 500;
}
#block-flashyplus-navigationprincipale ul.menu li a[href*="nouveaute"]::after,
#block-flashyplus-navigationprincipale-2 ul.menu li a[href*="nouveaute"]::after {
  content: 'Nouveau';
  font-size: 0.5rem; font-weight: 700; letter-spacing: 0.05em;
  color: #ffffff; background-color: #009639;
  border-radius: 3px; padding: 2px 5px; margin-left: auto; flex-shrink: 0;
}
#block-flashyplus-navigationprincipale ul.menu li.sf-no-children a[href*="nouveaute"]::after,
#block-flashyplus-navigationprincipale-2 ul.menu li:not(.menu-item--expanded) a[href*="nouveaute"]::after {
  border-style: none; border-width: 0;
}

/* Responsive sidebar */
@media (max-width: 767px) {
  #block-flashyplus-navigationprincipale {
    border-left: none;
    border-top: 4px solid #009639;
    border-radius: 0 0 8px 8px;
  }
}
@media (min-width: 768px) {
  .sidebar__section.sidebar-first {
    max-height: calc(100vh - 17rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #009639 #f0f0f0;
    padding-right: 30px;
  }
  .sidebar__section.sidebar-first::-webkit-scrollbar { width: 4px; }
  .sidebar__section.sidebar-first::-webkit-scrollbar-track { background: #f0f0f0; }
  .sidebar__section.sidebar-first::-webkit-scrollbar-thumb { background-color: #009639; border-radius: 4px; }
}

/* Animation d'entrée sidebar */
.sidebar__section.animated.fadeIn #block-flashyplus-navigationprincipale,
.sidebar__section.animated.fadeIn #block-flashyplus-navigationprincipale-2 {
  animation: seucomFadeSlide 0.4s ease both;
}
@keyframes seucomFadeSlide {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* =====================================================
   CATALOGUE — Contenu page terme de taxonomie
   ===================================================== */

#block-flashyplus-content .content { padding: 0; }
#taxonomy-term-117 .content,
.taxonomy-term.vocabulary-catalogue .content { padding: 0; }

/* Titre H2 principal */
.field--name-description h2:first-child {
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #000000;
  margin: 0 0 2rem 0;
  padding-bottom: 1rem;
  position: relative;
}
.field--name-description h2:first-child::after {
  content: '';
  display: block;
  width: 3.5rem; height: 4px;
  background: linear-gradient(90deg, #009639, #A2E4B8);
  border-radius: 2px;
  margin-top: 0.8rem;
}

/* Image principale */
.field--name-description p.text-align-center:has(img) {
  margin: 0 0 2.5rem;
  background: linear-gradient(135deg, #f8fafb 0%, #eef7f1 100%);
  border-radius: 12px;
  padding: 2rem;
  border: 1px solid rgba(0, 150, 57, 0.12);
  overflow: hidden;
  position: relative;
}
.field--name-description p.text-align-center:has(img)::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 60% 50%, rgba(0, 150, 57, 0.06) 0%, transparent 70%);
  pointer-events: none;
}
.field--name-description p.text-align-center img {
  display: block;
  margin: 0 auto;
  max-width: 680px;
  width: 100%;
  border-radius: 6px;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.12));
  transition: transform 0.4s ease, filter 0.4s ease;
}
.field--name-description p.text-align-center img:hover {
  transform: scale(1.015);
  filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.18));
}

/* Accroche <big> */
.field--name-description > p > big,
.field--name-description p big {
  display: block;
  font-size: 1rem;
  font-weight: 500;
  color: #009639;
  letter-spacing: -0.01em;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

/* Texte courant */
.field--name-description p { line-height: 1.8; color: #333333; margin-bottom: 1.25rem; }

/* Grille features */
.field--name-description > div > .row {
  display: flex; flex-wrap: wrap; gap: 0;
  align-items: flex-start;
  margin: 2rem 0 0;
}
.field--name-description > div > .row > .col-md-8 {
  flex: 0 0 calc(66.666% - 1.5rem);
  max-width: calc(66.666% - 1.5rem);
  padding-right: 2rem;
}

/* Lignes feature */
.field--name-description .col-md-8 > .row {
  display: flex;
  align-items: flex-start;
  padding: 1rem 1rem;
  margin: 0 0 0.75rem;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  transition: background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  cursor: default;
  animation: featureRowIn 0.4s ease both;
}
.field--name-description .col-md-8 > .row:nth-child(1) { animation-delay: 0.05s; }
.field--name-description .col-md-8 > .row:nth-child(2) { animation-delay: 0.10s; }
.field--name-description .col-md-8 > .row:nth-child(3) { animation-delay: 0.15s; }
.field--name-description .col-md-8 > .row:nth-child(4) { animation-delay: 0.20s; }
.field--name-description .col-md-8 > .row:nth-child(5) { animation-delay: 0.25s; }
.field--name-description .col-md-8 > .row:nth-child(6) { animation-delay: 0.30s; }
@keyframes featureRowIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.field--name-description .col-md-8 > .row:hover {
  background: rgba(0, 150, 57, 0.04);
  border-color: rgba(0, 150, 57, 0.25);
  transform: translateX(4px);
  box-shadow: 0 4px 16px rgba(0, 150, 57, 0.08);
}

/* Cellule icône */
.field--name-description .col-md-8 .row > .col-md-2 {
  flex: 0 0 60px; max-width: 60px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #009639, #006628);
  border-radius: 10px; padding: 10px;
  box-shadow: 0 3px 10px rgba(0, 150, 57, 0.25);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  flex-shrink: 0; align-self: flex-start; margin-top: 2px;
}
.field--name-description .col-md-8 > .row:hover .col-md-2 {
  box-shadow: 0 6px 18px rgba(0, 150, 57, 0.35);
  transform: scale(1.08);
}
.field--name-description .col-md-8 .row > .col-md-2 img {
  width: 40px; height: 40px;
  object-fit: contain;
  filter: brightness(0) invert(1);
  display: block;
}

/* Cellule texte */
.field--name-description .col-md-8 .row > .col-md-10 { flex: 1; min-width: 0; }
.field--name-description .col-md-8 .row h3 {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600; letter-spacing: 0.01em;
  color: #000000; margin: 0 0 0.4rem;
  line-height: 1.3; transition: color 0.2s ease;
}
.field--name-description .col-md-8 > .row:hover h3 { color: #009639; }
.field--name-description .col-md-8 .row p { line-height: 1.7; color: #555555; margin: 0; }

/* Box noire (col-md-4) */
.field--name-description .col-md-4.box-gray,
.field--name-description .box-gray {
  flex: 0 0 33.333%; max-width: 33.333%;
  background: #000000;
  border-radius: 12px; padding: 2rem 1.75rem;
  position: relative; overflow: hidden;
  align-self: flex-start;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
}
.field--name-description .box-gray::before {
  content: '';
  position: absolute; top: -40px; right: -40px;
  width: 160px; height: 160px;
  background: radial-gradient(circle, rgba(0, 150, 57, 0.35) 0%, transparent 70%);
  pointer-events: none;
}
.field--name-description .box-gray::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #009639, #A2E4B8);
  border-radius: 12px 12px 0 0;
}
.field--name-description .box-gray h2 {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.95rem; font-weight: 700;
  color: #ffffff; letter-spacing: -0.01em; line-height: 1.3;
  margin: 0 0 1rem; padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(162, 228, 184, 0.2);
  position: relative; z-index: 1;
}
.field--name-description .box-gray p big,
.field--name-description .box-gray > p > big {
  font-size: 0.75rem; color: #A2E4B8; font-weight: 400; position: relative; z-index: 1;
}
.field--name-description .box-gray p {
  font-size: 0.98rem; line-height: 1.75;
  color: rgba(255, 255, 255, 0.75);
  position: relative; z-index: 1; margin-bottom: 1rem;
}
.field--name-description .box-gray p.text-align-center {
  background: none; border: none; border-radius: 0; padding: 0; position: relative; z-index: 1;
}
.field--name-description .box-gray p.text-align-center img {
  filter: drop-shadow(0 8px 24px rgba(0, 150, 57, 0.4));
  transition: filter 0.35s ease, transform 0.35s ease;
  display: block; margin: 0 auto;
}
.field--name-description .box-gray:hover p.text-align-center img {
  filter: drop-shadow(0 12px 32px rgba(0, 150, 57, 0.6));
  transform: translateY(-4px) rotate(-2deg);
}

/* UL/LI dans box noire */
.field--name-description .box-gray ul { margin: 0.75rem 0 1rem; padding: 0; }
.field--name-description .box-gray ul li {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.98rem;
  padding-left: 1.25rem;
  position: relative; z-index: 1;
}
.field--name-description .box-gray ul li::before {
  background-color: #A2E4B8;
  border-color: #A2E4B8;
  top: 0.65em;
}

/* Lien RSS */
.feed-icons { margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid rgba(0, 0, 0, 0.06); }
.feed-icons a.feed-icon {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.6rem; font-weight: 400; color: #999999;
  text-decoration: none; letter-spacing: 0.05em;
  display: inline-flex; align-items: center; gap: 0.4rem;
  transition: color 0.2s ease;
}
.feed-icons a.feed-icon::before {
  content: '';
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%; background-color: #cccccc;
  transition: background-color 0.2s ease;
}
.feed-icons a.feed-icon:hover { color: #009639; }
.feed-icons a.feed-icon:hover::before { background-color: #009639; }

/* Responsive catalogue content */
@media (max-width: 991px) {
  .field--name-description > div > .row { flex-direction: column; }
  .field--name-description > div > .row > .col-md-8,
  .field--name-description .col-md-4.box-gray,
  .field--name-description .box-gray { flex: 0 0 100%; max-width: 100%; padding-right: 0; }
  .field--name-description .box-gray { margin-top: 1.5rem; }
}
@media (max-width: 575px) {
  .field--name-description h2:first-child { font-size: 1.3rem; }
  .field--name-description .col-md-8 > .row { padding: 1rem; }
  .field--name-description .col-md-8 .row > .col-md-2 { flex: 0 0 40px; max-width: 40px; padding: 8px; }
  .field--name-description .col-md-8 .row > .col-md-2 img { width: 22px; height: 22px; }
}

/* =====================================================
   CATALOGUE — Addendum (éléments riches)
   ===================================================== */

/* Variante feature-photo */
.field--name-description .col-md-8 > .row.feature-photo > .col-md-3 {
  flex: 0 0 120px; max-width: 120px;
  padding: 0; background: transparent; box-shadow: none;
  border-radius: 8px; overflow: hidden;
  align-self: flex-start; margin-top: 2px;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.field--name-description .col-md-8 > .row.feature-photo > .col-md-3 img {
  width: 100%; height: 80px; object-fit: cover;
  border-radius: 8px; display: block;
  filter: none;
  transition: transform 0.3s ease, filter 0.3s ease;
}
.field--name-description .col-md-8 > .row.feature-photo > .col-md-9 { flex: 1; min-width: 0; }
.field--name-description .col-md-8 > .row.feature-photo:hover > .col-md-3 {
  box-shadow: 0 4px 14px rgba(0, 150, 57, 0.2);
}
.field--name-description .col-md-8 > .row.feature-photo:hover > .col-md-3 img {
  transform: scale(1.06);
  filter: brightness(1.05) saturate(1.1);
}
@media (max-width: 575px) {
  .field--name-description .col-md-8 > .row.feature-photo { flex-wrap: wrap; }
  .field--name-description .col-md-8 > .row.feature-photo > .col-md-3 { flex: 0 0 100%; max-width: 100%; margin-bottom: 0.75rem; }
  .field--name-description .col-md-8 > .row.feature-photo > .col-md-3 img { height: 140px; }
}

/* Iframe / vidéo */
.field--name-description p.text-align-center.media-wrapper,
.field--name-description p:has(iframe) {
  background: #000000;
  border-radius: 12px; padding: 0; overflow: hidden;
  border: 1px solid rgba(0, 150, 57, 0.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
  margin-bottom: 2.5rem;
  aspect-ratio: 16 / 9; position: relative;
}
.field--name-description p.text-align-center.media-wrapper iframe,
.field--name-description p:has(iframe) iframe {
  position: absolute; inset: 0;
  width: 100% !important; height: 100% !important;
  border-radius: 12px; display: block;
}

/* H2 secondaires */
.field--name-description h2:not(:first-child):not(.box-gray h2) {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.85rem; font-weight: 600;
  letter-spacing: 0.04em; text-transform: uppercase;
  color: #000000;
  margin: 2.5rem 0 1rem;
  padding-left: 0.75rem;
  border-left: 3px solid #009639;
  line-height: 1.3;
}
.field--name-description h2.section-title {
  font-size: 0.75rem; letter-spacing: 0.1em; color: #009639;
  border-left: none; padding-left: 0;
  margin-top: 3rem; padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 150, 57, 0.15);
}

/* H3 hors feature-rows */
.catalogue-technical h3 {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600; color: #000000; margin: 0 0 0.5rem; letter-spacing: 0.01em;
}

/* Blocs certification */
.catalogue-technical .certification-block {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px; padding: 1.25rem 1.5rem; margin-bottom: 0.75rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.catalogue-technical .certification-block:hover {
  border-color: rgba(0, 150, 57, 0.2);
  box-shadow: 0 3px 12px rgba(0, 150, 57, 0.06);
}
.catalogue-technical .certification-block p {
  font-size: 0.98rem; line-height: 1.75; color: #555555; margin: 0.35rem 0 0;
}

/* Listes UL/LI */
.field--name-description ul { list-style: none; margin: 0.5rem 0 0; padding: 0; }
.field--name-description ul li {
  font-family: 'Unbounded', sans-serif;
  font-size: 0.86rem; line-height: 1.75; color: #444444;
  padding: 0.2rem 0 0.2rem 1.25rem; position: relative;
}
.field--name-description ul li::before {
  content: '';
  position: absolute; left: 0; top: 0.62em;
  width: 6px; height: 6px;
  border-radius: 50%;
  background-color: #A2E4B8;
  border: 1.5px solid #009639;
  flex-shrink: 0;
}

/* Specs grid */
.catalogue-technical .specs-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem; margin-top: 1rem;
}
.catalogue-technical .specs-block {
  background: #f9fafb;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px; padding: 1.25rem 1.5rem;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.catalogue-technical .specs-block:hover {
  background: rgba(0, 150, 57, 0.03);
  border-color: rgba(0, 150, 57, 0.18);
}
.catalogue-technical .specs-block h3 {
  color: #009639;
  letter-spacing: 0.06em; text-transform: uppercase;
  margin-bottom: 0.75rem; padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(0, 150, 57, 0.15);
}

/* Wrapper technique */
.field--name-description .catalogue-technical {
  margin-top: 3rem; padding-top: 2rem;
  border-top: 2px solid rgba(0, 0, 0, 0.06);
  position: relative;
}
.field--name-description .catalogue-technical::before {
  content: 'Détails techniques';
  position: absolute; top: -0.6rem; left: 0;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.5rem; font-weight: 700;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: #009639; background: #ffffff; padding: 0 0.75rem;
}

/* Responsive addendum */
@media (max-width: 767px) {
  .catalogue-technical .specs-grid { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
  .field--name-description p.text-align-center.media-wrapper { border-radius: 8px; }
  .catalogue-technical .certification-block,
  .catalogue-technical .specs-block { padding: 1rem; }
}

/* Fix icône col-md-2 sur term-117 */
#taxonomy-term-117 .field--name-description .col-md-8 .row > .col-md-2 img {
  width: 40px; height: 40px;
  filter: none !important;
}

/* Fix puces champ référence taxonomy */
.field--entity-reference-target-type-taxonomy-term::before,
.field--entity-reference-target-type-taxonomy-term.field__item::before { left: 10px; }

/* =====================================================
   CATALOGUE — Grille produits (view-content)
   ===================================================== */

.view-taxonomy-term .view-content {
  padding: 2.5rem 0 0;
  border-top: 2px solid rgba(0, 0, 0, 0.06);
  position: relative;
}
.view-taxonomy-term .view-content::before {
  content: 'Produits de la gamme';
  display: block;
  font-family: 'Unbounded', sans-serif;
  font-size: 1.2rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #009639; margin-bottom: 1.5rem;
}

/* Carte produit */
.node--type-produit.node--view-mode-teaser {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: 10px; overflow: hidden;
  display: flex; flex-direction: column; height: 100%;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
  margin-bottom: 1.5rem;
}
.node--type-produit.node--view-mode-teaser:hover {
  border-color: rgba(0, 150, 57, 0.3);
  box-shadow: 0 8px 28px rgba(0, 150, 57, 0.1);
  transform: translateY(-4px);
}

/* Image produit */
.node--type-produit .field--name-field-image {
  /* overflow: hidden;  */
  background: #f5f7f5;
  aspect-ratio: 4 / 3; position: relative;
}
.node--type-produit .overlay-container { position: relative; width: 100%; height: 100%; }
.node--type-produit .overlay {
  position: absolute; inset: 0;
  background: rgba(0, 150, 57, 0);
  transition: background 0.3s ease; z-index: 1;
  display: flex; align-items: center; justify-content: center;
}
.node--type-produit:hover .overlay { background: rgba(0, 150, 57, 0.12); }
.node--type-produit .overlay::after {
  content: '→';
  font-family: 'Unbounded', sans-serif;
  font-size: 1.2rem; font-weight: 400; color: #009639;
  opacity: 0; transform: scale(0.7);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.node--type-produit:hover .overlay::after { opacity: 1; transform: scale(1); }
.node--type-produit .field--name-field-image img {
  width: 100%; height: 100%; object-fit: contain;
  padding: 1rem; display: block;
  transition: transform 0.4s ease;
}
.node--type-produit:hover .field--name-field-image img { transform: scale(1.05); }

/* Contenu carte */
.node--type-produit .node__main-content { display: flex; flex-direction: column; flex: 1; }
.node--type-produit .node__header { padding: 1rem 1.25rem 0.5rem; }
.node--type-produit .node__title {
  font-size: 1.4rem; font-weight: 500; min-height: 90px;
  text-align: center;
  font-family: 'Unbounded', sans-serif;
  letter-spacing: -0.01em; line-height: 1.35; margin: 0;
}
.node--type-produit .node__title a { color: #000000; text-decoration: none; transition: color 0.2s ease; }
.node--type-produit .node__title a:hover { color: #009639; }

/* Référence produit */
.node--type-produit .field--name-field-reference-produit {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.35rem 1.25rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05); margin-bottom: 0.25rem;
}
.node--type-produit .field--name-field-reference-produit .field__label {
  font-family: 'Unbounded', sans-serif; font-size: 0.6rem; font-weight: 400;
  letter-spacing: 0.1em; text-transform: uppercase; color: #999999;
}
.node--type-produit .field--name-field-reference-produit .field__item {
  font-family: 'Unbounded', sans-serif; font-size: 0.55rem; font-weight: 700;
  letter-spacing: 0.08em; color: #009639;
  background: rgba(0, 150, 57, 0.07); border-radius: 3px; padding: 2px 7px;
}

/* Tag catalogue */
.node--type-produit .field--name-field-catalogue { padding: 0 1.25rem 0.5rem 2rem; }
.node--type-produit .field--name-field-catalogue .field__item a {
  font-family: 'Unbounded', sans-serif; font-size: 0.7rem; font-weight: 400;
  letter-spacing: 0.08em; text-transform: uppercase; color: #aaaaaa;
  text-decoration: none; transition: color 0.2s;
}
.node--type-produit .field--name-field-catalogue .field__item a:hover { color: #009639; }

/* Body liste caractéristiques */
.node--type-produit .field--name-body { padding: 0.5rem 1.25rem 1.25rem; flex: 1; }
.node--type-produit .field--name-body ul { list-style: none; margin: 0; padding: 0; }
.node--type-produit .field--name-body ul li {
  line-height: 1.7; color: #555555;
  padding: 0.18rem 0 0.18rem 1.1rem; position: relative;
  border-bottom: 1px solid #ddd7d7;
}
.node--type-produit .field--name-body ul li::before {
  content: '';
  position: absolute; left: 0; top: 0.8em;
  width: 8px; height: 8px; border-radius: 50%;
  background-color: #A2E4B8; border: 1.5px solid #009639;
  flex-shrink: 0; transition: background-color 0.2s;
}
.node--type-produit:hover .field--name-body ul li::before { background-color: #009639; }

/* Barre verte bas de carte */
.node--type-produit .node__container { display: flex; flex-direction: column; height: 100%; position: relative; }
.node--type-produit .node__container::after {
  content: '';
  display: block; height: 3px;
  background: linear-gradient(90deg, #009639, #A2E4B8);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.35s ease;
}
.node--type-produit:hover .node__container::after { transform: scaleX(1); }

/* Colonnes Bootstrap */
.view-content .views-row {
  padding-left: 0.75rem; padding-right: 0.75rem; margin-bottom: 1.5rem;
  display: flex;
  animation: cardIn 0.4s ease both;
}
.view-content .views-row:nth-child(1) { animation-delay: 0.05s; }
.view-content .views-row:nth-child(2) { animation-delay: 0.10s; }
.view-content .views-row:nth-child(3) { animation-delay: 0.15s; }
.view-content .views-row:nth-child(4) { animation-delay: 0.20s; }
.view-content .views-row:nth-child(5) { animation-delay: 0.25s; }
.view-content .views-row:nth-child(6) { animation-delay: 0.30s; }
.view-content .views-row:nth-child(7) { animation-delay: 0.35s; }
.view-content .views-row:nth-child(8) { animation-delay: 0.40s; }
@keyframes cardIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.view-content .views-row .node--type-produit { width: 100%; }
.view-taxonomy-term .row svg { color: #fff !important; }

@media (max-width: 767px) {
  .view-content .views-row { padding-left: 0.5rem; padding-right: 0.5rem; }
}
@media (max-width: 575px) {
  .node--type-produit .node__title { font-size: 0.72rem; }
}

/* =====================================================
   CATALOGUE — Grille mère (sous-catégories)
   ===================================================== */

.catalogue-intro { text-align: center; max-width: 680px; margin: 0 auto 3rem; }
.catalogue-intro p { font-size: 1.1rem; color: rgba(0, 0, 0, 0.87); line-height: 1.75; }

.catalogue-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem; margin-bottom: 3rem;
}

.cat-card {
  display: flex; flex-direction: column;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.07);
  border-radius: 6px; padding: 2rem 1.75rem 1.75rem;
  text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease;
}
.cat-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #009639, #A2E4B8);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.35s ease;
}
.cat-card:hover {
  box-shadow: 0 8px 32px rgba(0,150,57,0.1);
  transform: translateY(-3px);
  border-color: rgba(0,150,57,0.2);
  text-decoration: none; color: inherit;
}
.cat-card:hover::before { transform: scaleX(1); }

.cat-card.cat-new .cat-badge { display: inline-block; }
.cat-badge {
  display: none;
  position: absolute; top: 1rem; right: 1rem;
  font-size: 0.80rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: #fff; background: #009639; padding: 0.2rem 0.5rem; border-radius: 2px;
}
.cat-icon { width: 60px; height: 60px; color: #009639 !important; margin-bottom: 1.25rem; flex-shrink: 0; }
.cat-title { font-weight: 700; color: #000; margin-bottom: 0.6rem; line-height: 1.3; transition: color 0.2s; }
.cat-card:hover .cat-title { color: #009639; }
.cat-desc { color: rgba(0,0,0,0.5); line-height: 1.7; flex: 1; }
.cat-link {
  display: flex; align-items: center; gap: 0.4rem;
  margin-top: 1.25rem;
  font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: #009639;
  transition: gap 0.2s;
}
.cat-card:hover .cat-link { gap: 0.7rem; }
.cat-link svg { transition: transform 0.2s; }
.cat-card:hover .cat-link svg { transform: translateX(3px); }

/* CTA bas catalogue */
.catalogue-cta {
  background: #000; border-radius: 6px; padding: 2.5rem 2rem;
  display: flex; align-items: center; justify-content: space-between;
  gap: 2rem; margin-top: 1rem;
}
.catalogue-cta-title { font-weight: 700; color: #fff; margin-bottom: 0.4rem; }
.catalogue-cta-sub { color: rgba(255,255,255,0.5); }
.catalogue-cta-actions { display: flex; gap: 1rem; flex-shrink: 0; align-items: center; }
.btn-cta-green {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: #000; background: #009639; padding: 0.85rem 1.75rem;
  border-radius: 3px; text-decoration: none; transition: background 0.2s; white-space: nowrap;
}
.btn-cta-green:hover { background: #A2E4B8; text-decoration: none; color: #000; }
.btn-cta-tel { font-size: 0.85rem; font-weight: 700; color: #A2E4B8; text-decoration: none; white-space: nowrap; }
.btn-cta-tel:hover { color: #fff; text-decoration: none; }

@media (max-width: 991px) { .catalogue-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) {
  .catalogue-grid { grid-template-columns: 1fr; }
  .catalogue-cta { flex-direction: column; align-items: flex-start; }
}

/* =====================================================
   FOOTER — ajustements
   ===================================================== */

.footer__section .menu li { padding-left: 1rem; position: relative; }
.footer__section .menu li::before {
  content: '';
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--mt-color-primary);
}
.footer__section h2 {
	padding-bottom: 0.5rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.28);
	margin-bottom: 1rem;
	color: #fff;
}

.seucom-values { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1.25rem; }
.value-item-bottom { display: flex; align-items: center; gap: 0.75rem; }
.value-icon { flex-shrink: 0; width: 36px; display: flex; align-items: center; justify-content: center; }
.value-title { font-size: 13px; color: rgba(255,255,255,0.75); }

/* =====================================================
   ACTUALITÉS — cartes teaser
   ===================================================== */

.node--type-mt-post.node--view-mode-mt-teaser-tile { overflow: visible; border-radius: 4px; }
.teaser-tile-image-container { overflow: visible; }
.teaser-tile-image img {
  display: block; width: 100%;
  transition: transform 0.45s ease, filter 0.45s ease;
  border-radius: 4px;
}
.node--type-mt-post.node--view-mode-mt-teaser-tile:hover .teaser-tile-image img {
  transform: scale(1.04);
  filter: brightness(0.85);
}
.view-content ul.row { gap: 2rem 0; }
.view-content .col-md-4 { padding-left: 20px; padding-right: 20px; }
.node--type-mt-post.node--view-mode-mt-teaser-tile .node__title {
  font-size: 21px !important;
  line-height: 1.4; margin-top: 0.5rem;
}
.node--type-mt-post.node--view-mode-mt-teaser-tile .node__title a { transition: color 0.25s ease; }
.node--type-mt-post.node--view-mode-mt-teaser-tile:hover .node__title a { color: var(--mt-color-primary); }
.teaser-tile-pre-content-item { font-size: 11px; color: var(--mt-color-primary); letter-spacing: 0.08em; }

/* =====================================================
   DIVERS
   ===================================================== */

a.mt-button.mt-button--outline, .mt-button.mt-button--outline > a,
input[type="submit"][value="Reset"], input[type="submit"].mt-button--outline,
input[type="reset"].mt-button--outline, input[type="button"].mt-button--outline {
  border-width: 2px;
}

/* =====================================================
   PAGE ORGANIGRAMMES — styles spécifiques
   À charger APRÈS local-theme.css
   ===================================================== */

/* ─── VARIABLES LOCALES (scoped à la page) ─── */
.path-node-organigrammes,
.page-organigrammes,
[class*="bloc-hero"],
[class*="bloc-methode"],
[class*="bloc-pourquoi"],
[class*="bloc-environnements"],
[class*="bloc-expertise"],
[class*="bloc-durabilite"],
[class*="bloc-methodo"],
[class*="bloc-faq"],
[class*="bloc-cta"] {
  --max-w:      1400px;
  --pad:        0 40px;
  --green:      #009639;
  --green-light:#A2E4B8;
  --green-dark: #006628;
  --black:      #000000;
  --white:      #ffffff;
  --shade:      #0d0d0d;
  --tint:       #f5f5f5;
  --font:       'Unbounded', sans-serif;
}

/* ─── CONTAINERS ─── */
.seucom-container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: var(--pad);
}

/* ─── SHARED TYPO ─── */
.eyebrow {
  font-weight: 300;
  font-size: 0.58rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 20px;
  display: flex; align-items: center; gap: 12px;
}
.eyebrow::before {
  content: ''; display: block;
  width: 36px; height: 1px;
  background: var(--green); flex-shrink: 0;
}
.eyebrow--light { color: var(--green-light); }
.eyebrow--light::before { background: var(--green-light); }

/* Section title — scopé aux blocs de la page */
.bloc-hero .section-title,
.bloc-methode .section-title,
.bloc-pourquoi .section-title,
.bloc-environnements .section-title,
.bloc-expertise .section-title,
.bloc-durabilite .section-title,
.bloc-methodo .section-title,
.bloc-faq .section-title,
.bloc-cta .section-title {
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
}
.section-title--dark  { color: var(--black); font-size: clamp(1.9rem, 3.2vw, 3rem); }
.section-title--white { color: var(--white); font-size: clamp(1.9rem, 3.2vw, 3rem); }

.section-lead {
  font-weight: 300; font-size: 0.75rem;
  line-height: 2.1; letter-spacing: 0.02em;
}
.section-lead--dark  { color: #555; }
.section-lead--white { color: rgba(255,255,255,0.5); }

/* ─── REVEAL ─── */
.reveal {
  opacity: 0; transform: translateY(22px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════════════════════
   BLOC 1 — HERO / BANNER
   → region--dark-background | bg: #000000 | texte: blanc
══════════════════════════════════════════════════════ */
.bloc-hero {
  background: var(--black);
  padding: 140px 0 80px;
  position: relative; overflow: hidden;
  min-height: 76vh;
  display: flex; align-items: center;
}
.bloc-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(0,150,57,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,150,57,.05) 1px, transparent 1px);
  background-size: 64px 64px;
}
.bloc-hero::after {
  content: '';
  position: absolute;
  bottom: -120px; right: -60px;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,150,57,.12) 0%, transparent 65%);
  pointer-events: none;
}

.hero-grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.hero-breadcrumb {
  font-weight: 300; font-size: 0.55rem; letter-spacing: .15em;
  text-transform: uppercase; color: rgba(255,255,255,.3);
  margin-bottom: 24px; display: flex; align-items: center; gap: 8px;
}
.hero-breadcrumb a { color: rgba(255,255,255,.3); text-decoration: none; }
.hero-breadcrumb span { color: var(--green); }
.hero-h1 {
  font-weight: 800; font-size: clamp(2.5rem, 5vw, 4.8rem);
  line-height: .95; letter-spacing: -.04em;
  color: var(--white); margin-bottom: 28px;
}
.hero-h1 em { font-style: normal; color: var(--green); display: block; }
.hero-chapo {
  font-weight: 300; font-size: .76rem; line-height: 2; letter-spacing: .02em;
  color: rgba(255,255,255,.5); max-width: 520px; margin-bottom: 40px;
}
.hero-btns { display: flex; gap: 16px; flex-wrap: wrap; }

/* Boutons — renommés .seucom-btn pour éviter les conflits Bootstrap */
.seucom-btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font); font-weight: 600; font-size: .6rem;
  letter-spacing: .1em; text-transform: uppercase;
  padding: 15px 28px; text-decoration: none; transition: all .25s; cursor: pointer;
  border: none;
}
.seucom-btn-green { background: var(--green); color: #fff; }
.seucom-btn-green:hover { background: var(--green-dark); color: #fff; }
.seucom-btn-outline { border: 1px solid rgba(255,255,255,.25); color: rgba(255,255,255,.7); background: transparent; }
.seucom-btn-outline:hover { border-color: var(--green); color: var(--green-light); }
.seucom-btn-white { background: var(--white); color: var(--black); }
.seucom-btn-white:hover { background: var(--green-light); color: var(--black); }
.btn-arrow { font-size: .9rem; transition: transform .25s; }
.seucom-btn:hover .btn-arrow { transform: translateX(4px); }

/* Schéma organigramme dans le hero */
.hero-diagram {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 0;
}
.diag-node { display: flex; flex-direction: column; align-items: center; }
.diag-box {
  display: flex; align-items: center; gap: 12px;
  border: 1px solid; padding: 14px 24px;
  font-weight: 600; font-size: .62rem; letter-spacing: .06em;
  text-transform: uppercase; white-space: nowrap; position: relative;
}
.diag-box--master {
  border-color: var(--green); background: var(--green);
  color: #fff; padding: 18px 36px; font-size: .72rem;
}
.diag-box--partial {
  border-color: rgba(162,228,184,.6); background: rgba(162,228,184,.08);
  color: var(--green-light); font-size: .6rem;
}
.diag-box--single {
  border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.55); font-size: .55rem;
}
.diag-line-v { width: 1px; background: rgba(0,150,57,.4); flex-shrink: 0; }
.diag-row {
  display: flex; gap: 24px; align-items: flex-start; position: relative;
}
.diag-row::before {
  content: '';
  position: absolute; top: 0; left: calc(50% - 40px); right: calc(50% - 40px);
  height: 1px; background: rgba(0,150,57,.4);
}
.diag-col { display: flex; flex-direction: column; align-items: center; gap: 0; }
.diag-label {
  font-weight: 300; font-size: .5rem; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.25); margin-top: 6px;
}
.diag-badge {
  background: rgba(0,150,57,.15); border: 1px solid rgba(0,150,57,.3);
  color: var(--green-light); padding: 4px 10px;
  font-weight: 300; font-size: .48rem; letter-spacing: .1em;
  text-transform: uppercase; margin-top: 6px;
}

/* ══════════════════════════════════════════════════════
   BLOC 2 — UNE GESTION PENSÉE AVEC MÉTHODE
   → region--light-background | bg: #ffffff | texte: noir
══════════════════════════════════════════════════════ */
.bloc-methode {
  background: var(--white);
  padding: 110px 0;
}
.methode-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start;
}
.methode-text p {
  font-weight: 300; font-size: .73rem; line-height: 2.1;
  color: #555; letter-spacing: .02em; margin-bottom: 20px;
}
.methode-text p strong { font-weight: 600; color: var(--black); }

.niveaux-grid { display: flex; flex-direction: column; gap: 3px; }
.niveau-item {
  display: flex; align-items: stretch; gap: 0;
  border-left: 3px solid transparent;
  transition: border-color .3s, background .3s; cursor: default;
}
.niveau-item:hover { border-left-color: var(--green); background: #fafafa; }
.niveau-num {
  background: var(--black); color: var(--white);
  font-weight: 800; font-size: 1.6rem; letter-spacing: -.04em;
  padding: 20px 22px; display: flex; align-items: center; justify-content: center;
  min-width: 64px; flex-shrink: 0;
}
.niveau-body { background: #f7f7f7; padding: 20px 24px; flex: 1; }
.niveau-body:hover { background: #f2f2f2; }
.niveau-title {
  font-weight: 700; font-size: .68rem; letter-spacing: .05em;
  text-transform: uppercase; color: var(--black); margin-bottom: 6px;
}
.niveau-desc {
  font-weight: 300; font-size: .62rem; color: #666;
  letter-spacing: .03em; line-height: 1.8;
}
.niveau-tag {
  display: inline-block; margin-top: 8px;
  background: var(--black); color: var(--green-light);
  padding: 3px 10px; font-size: .48rem; letter-spacing: .1em; text-transform: uppercase;
}

/* ══════════════════════════════════════════════════════
   BLOC 3 — POURQUOI METTRE EN PLACE
   → region--shade-background | bg: #0d0d0d | texte: blanc
══════════════════════════════════════════════════════ */
.bloc-pourquoi {
  background: var(--shade);
  padding: 110px 0;
  position: relative; overflow: hidden;
}
.bloc-pourquoi::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 80% 50%, rgba(0,150,57,.07) 0%, transparent 60%);
}
.pourquoi-intro {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  margin-bottom: 64px; align-items: end;
}
.pourquoi-intro-text {
  font-weight: 300; font-size: .73rem; line-height: 2;
  color: rgba(255,255,255,.45); letter-spacing: .02em;
}
.pourquoi-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.raison-card {
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
  padding: 40px 32px; position: relative; overflow: hidden;
  transition: background .3s, border-color .3s; cursor: default;
}
.raison-card:hover { background: rgba(0,150,57,.08); border-color: rgba(0,150,57,.3); }
.raison-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 2px; background: var(--green);
  transform: scaleX(0); transition: transform .4s ease; transform-origin: left;
}
.raison-card:hover::after { transform: scaleX(1); }
.raison-picto { margin-bottom: 20px; }
.raison-title {
  font-weight: 700; font-size: .7rem; letter-spacing: .06em;
  text-transform: uppercase; color: var(--white); margin-bottom: 10px;
}
.raison-desc {
  font-weight: 300; font-size: .63rem; line-height: 2;
  color: rgba(255,255,255,.45); letter-spacing: .03em;
}

/* ══════════════════════════════════════════════════════
   BLOC 4 — ENVIRONNEMENTS & CAS CONCRETS
   → region--tint-background | bg: #f5f5f5 | texte: noir
══════════════════════════════════════════════════════ */
.bloc-environnements {
  background: var(--tint);
  padding: 110px 0;
}
.env-intro {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  margin-bottom: 64px; align-items: end;
}
.env-intro-text {
  font-weight: 300; font-size: .73rem; line-height: 2; color: #666; letter-spacing: .02em;
}
.contextes-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; margin-bottom: 64px;
}
.contexte-card {
  background: var(--white); padding: 36px 28px;
  border-bottom: 3px solid transparent;
  transition: border-color .3s, box-shadow .3s; cursor: default;
  display: flex; flex-direction: column; gap: 16px;
}
.contexte-card:hover { border-bottom-color: var(--green); box-shadow: 0 8px 32px rgba(0,0,0,.08); }
.contexte-title {
  font-weight: 700; font-size: .68rem; letter-spacing: .05em;
  text-transform: uppercase; color: var(--black);
}
.contexte-desc {
  font-weight: 300; font-size: .62rem; line-height: 1.9; color: #666; letter-spacing: .03em; flex: 1;
}

/* Cas concrets */
.cas-title {
  font-weight: 700; font-size: .68rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--green); margin-bottom: 28px;
  display: flex; align-items: center; gap: 12px;
}
.cas-title::before { content: ''; display: block; width: 28px; height: 2px; background: var(--green); }
.cas-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.cas-card {
  background: var(--black); padding: 36px 28px; position: relative; overflow: hidden;
}
.cas-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 3px; background: var(--green);
}
.cas-type {
  font-weight: 300; font-size: .52rem; letter-spacing: .15em;
  text-transform: uppercase; color: var(--green); margin-bottom: 14px;
}
.cas-scenario {
  font-weight: 600; font-size: .7rem; color: var(--white);
  line-height: 1.5; letter-spacing: .02em; margin-bottom: 16px;
}
.cas-detail {
  font-weight: 300; font-size: .62rem; line-height: 2;
  color: rgba(255,255,255,.45); letter-spacing: .03em;
}
.cas-keys { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.cas-key {
  background: rgba(0,150,57,.15); border: 1px solid rgba(0,150,57,.3);
  color: var(--green-light); padding: 3px 10px;
  font-weight: 300; font-size: .48rem; letter-spacing: .1em; text-transform: uppercase;
}

/* ══════════════════════════════════════════════════════
   BLOC 5 — L'EXPERTISE SEUCOM MEDECO
   → region--dark-background | bg: #000000 | texte: blanc
══════════════════════════════════════════════════════ */
.bloc-expertise {
  background: var(--black);
  padding: 110px 0;
  position: relative; overflow: hidden;
}
.bloc-expertise::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(0,150,57,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,150,57,.04) 1px, transparent 1px);
  background-size: 72px 72px;
}
.expertise-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start;
}
.expertise-text p {
  font-weight: 300; font-size: .73rem; line-height: 2.1;
  color: rgba(255,255,255,.45); letter-spacing: .02em; margin-bottom: 20px;
}
.expertise-text p strong { font-weight: 600; color: var(--white); }
.expertise-list {
  list-style: none; display: flex; flex-direction: column; gap: 3px; margin: 28px 0;
}
.expertise-list li {
  display: flex; align-items: flex-start; gap: 14px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
  padding: 16px 20px;
  font-weight: 300; font-size: .65rem; line-height: 1.8;
  color: rgba(255,255,255,.55); letter-spacing: .03em;
  transition: background .3s;
}
.expertise-list li:hover { background: rgba(0,150,57,.08); border-color: rgba(0,150,57,.25); }
.li-arrow { color: var(--green); font-size: .9rem; flex-shrink: 0; margin-top: 1px; }
.reactivity-box {
  background: rgba(0,150,57,.1); border: 1px solid rgba(0,150,57,.3);
  padding: 36px; position: relative; overflow: hidden; margin-top: 8px;
}
.reactivity-box::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--green);
}
.reactivity-title {
  font-weight: 700; font-size: .7rem; letter-spacing: .06em;
  text-transform: uppercase; color: var(--green-light); margin-bottom: 14px;
  display: flex; align-items: center; gap: 10px;
}
.reactivity-text {
  font-weight: 300; font-size: .65rem; line-height: 2;
  color: rgba(255,255,255,.55); letter-spacing: .03em;
}
.reactivity-text strong { color: var(--white); font-weight: 600; }

.expertise-why { display: flex; flex-direction: column; gap: 3px; }
.why-card {
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
  padding: 32px 28px; position: relative; overflow: hidden;
  transition: background .3s; cursor: default;
}
.why-card:hover { background: rgba(0,150,57,.07); border-color: rgba(0,150,57,.2); }
.why-card::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--green);
  transform: scaleY(0); transition: transform .3s; transform-origin: bottom;
}
.why-card:hover::before { transform: scaleY(1); }
.why-title {
  font-weight: 600; font-size: .68rem; letter-spacing: .05em;
  text-transform: uppercase; color: var(--white); margin-bottom: 8px;
  display: flex; align-items: center; gap: 12px;
}
.why-desc {
  font-weight: 300; font-size: .62rem; line-height: 1.9;
  color: rgba(255,255,255,.4); letter-spacing: .03em;
}

/* ══════════════════════════════════════════════════════
   BLOC 6 — CYLINDRES & DURABILITÉ
   → region--shade-background | bg: #0d0d0d | texte: blanc
══════════════════════════════════════════════════════ */
.bloc-durabilite {
  background: var(--shade);
  padding: 110px 0;
}
.durabilite-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.durabilite-text p {
  font-weight: 300; font-size: .73rem; line-height: 2.1;
  color: rgba(255,255,255,.45); letter-spacing: .02em; margin-bottom: 20px;
}
.durabilite-text p strong { font-weight: 600; color: var(--white); }
.durabilite-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.dur-stat {
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
  padding: 32px 24px; text-align: center; position: relative;
}
.dur-stat::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 2px; background: var(--green);
}
.dur-num {
  font-weight: 800; font-size: 2.4rem; color: var(--white);
  line-height: 1; letter-spacing: -.04em; display: block; margin-bottom: 8px;
}
.dur-num em { font-style: normal; color: var(--green); }
.dur-label {
  font-weight: 300; font-size: .52rem; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.35); display: block; line-height: 1.8;
}

/* ══════════════════════════════════════════════════════
   BLOC 7 — MÉTHODOLOGIE
   → region--light-background | bg: #ffffff | texte: noir
══════════════════════════════════════════════════════ */
.bloc-methodo {
  background: var(--white);
  padding: 110px 0;
}
.methodo-intro {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  margin-bottom: 72px; align-items: end;
}
.methodo-lead {
  font-weight: 300; font-size: .73rem; line-height: 2;
  color: #666; letter-spacing: .02em; align-self: end;
}
.steps-grid {
  display: grid; grid-template-columns: 1fr; gap: 3px;
  counter-reset: step;
}
.step-item {
  display: flex; align-items: stretch; gap: 0;
  counter-increment: step;
  transition: background .3s; cursor: default;
}
.step-num {
  background: var(--black); color: var(--white);
  font-weight: 800; font-size: 1.8rem; letter-spacing: -.04em;
  padding: 28px 28px; display: flex; align-items: center; justify-content: center;
  min-width: 76px; flex-shrink: 0; position: relative;
}
.step-num::after { color: var(--white); }
.step-item:nth-child(1) .step-num::after { content: '01'; color: var(--green); }
.step-item:nth-child(2) .step-num::after { content: '02'; color: var(--green); }
.step-item:nth-child(3) .step-num::after { content: '03'; color: var(--green); }
.step-item:nth-child(4) .step-num::after { content: '04'; color: var(--green); }
.step-item:nth-child(5) .step-num::after { content: '05'; color: var(--green); }
.step-num span { display: none; }
.step-body {
  background: #f7f7f7; padding: 28px 32px; flex: 1;
  border-left: 3px solid transparent;
  transition: border-color .3s, background .3s;
}
.step-item:hover .step-body { border-left-color: var(--green); background: #f0f0f0; }
.step-title {
  font-weight: 700; font-size: .68rem; letter-spacing: .05em;
  text-transform: uppercase; color: var(--black); margin-bottom: 8px;
}
.step-desc {
  font-weight: 300; font-size: .63rem; line-height: 1.9; color: #666; letter-spacing: .03em;
}

/* ══════════════════════════════════════════════════════
   BLOC 8 — FAQ
   → region--tint-background | bg: #f5f5f5 | texte: noir
══════════════════════════════════════════════════════ */
.bloc-faq {
  background: var(--tint);
  padding: 110px 0;
}
.faq-grid {
  display: grid; grid-template-columns: 1fr 1.8fr; gap: 80px; align-items: start;
}
.faq-list { display: flex; flex-direction: column; gap: 3px; }
.faq-item {
  background: var(--white); overflow: hidden;
  border-bottom: 2px solid transparent; transition: border-color .3s;
}
.faq-item.open { border-bottom-color: var(--green); }
.faq-q {
  font-weight: 600; font-size: .66rem; letter-spacing: .04em;
  color: var(--black); padding: 22px 28px;
  display: flex; justify-content: space-between; align-items: center;
  cursor: pointer; gap: 16px; transition: background .2s;
}
.faq-q:hover { background: #f9f9f9; }
.faq-icon {
  width: 22px; height: 22px; flex-shrink: 0;
  border: 1.5px solid rgba(0,0,0,.2);
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, border-color .2s;
}
.faq-item.open .faq-icon { background: var(--green); border-color: var(--green); }
.faq-plus { font-size: .9rem; color: #555; transition: transform .3s; font-weight: 300; }
.faq-item.open .faq-plus { transform: rotate(45deg); color: #fff; }
.faq-a {
  font-weight: 300; font-size: .65rem; line-height: 2;
  color: #666; letter-spacing: .03em;
  padding: 0 28px; max-height: 0; overflow: hidden;
  transition: max-height .35s ease, padding .35s ease;
}
.faq-item.open .faq-a { max-height: 200px; padding: 0 28px 22px; }

/* ══════════════════════════════════════════════════════
   BLOC 9 — CTA FINAL
   → region--dark-background | bg: #000000 | texte: blanc
══════════════════════════════════════════════════════ */
.bloc-cta {
  background: var(--black);
  padding: 100px 0;
  border-top: 1px solid rgba(0,150,57,.2);
}
.cta-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.cta-card { padding: 56px 48px; position: relative; overflow: hidden; }
.cta-card--dark { background: #080808; border: 1px solid rgba(255,255,255,.06); }
.cta-card--green { background: var(--green); }
.cta-card--dark:hover { background: #0f0f0f; }
.cta-card--green:hover { background: var(--green-dark); }
.cta-eyebrow {
  font-weight: 300; font-size: .52rem; letter-spacing: .2em;
  text-transform: uppercase; margin-bottom: 18px;
}
.cta-card--dark .cta-eyebrow { color: var(--green); }
.cta-card--green .cta-eyebrow { color: rgba(255,255,255,.6); }
.cta-h {
  font-weight: 800; font-size: 1.8rem; line-height: 1;
  letter-spacing: -.04em; margin-bottom: 16px;
}
.cta-card--dark .cta-h { color: var(--white); }
.cta-card--green .cta-h { color: var(--white); }
.cta-desc {
  font-weight: 300; font-size: .65rem; line-height: 2;
  margin-bottom: 32px; letter-spacing: .03em;
}
.cta-card--dark .cta-desc { color: rgba(255,255,255,.4); }
.cta-card--green .cta-desc { color: rgba(255,255,255,.75); }

/* ─── RESPONSIVE ─── */
@media (max-width: 1100px) {
  .bloc-hero,
  .bloc-methode,
  .bloc-pourquoi,
  .bloc-environnements,
  .bloc-expertise,
  .bloc-durabilite,
  .bloc-methodo,
  .bloc-faq,
  .bloc-cta {
    --pad: 0 32px;
  }
  .hero-grid, .methode-grid, .pourquoi-intro, .env-intro,
  .expertise-grid, .durabilite-grid, .methodo-intro, .faq-grid,
  .cta-inner { grid-template-columns: 1fr; gap: 40px; }
  .hero-h1 { font-size: clamp(2.2rem, 7vw, 3.5rem); }
  .contextes-grid, .cas-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .bloc-hero,
  .bloc-methode,
  .bloc-pourquoi,
  .bloc-environnements,
  .bloc-expertise,
  .bloc-durabilite,
  .bloc-methodo,
  .bloc-faq,
  .bloc-cta {
    --pad: 0 20px;
  }
  .contextes-grid, .cas-grid, .pourquoi-cards { grid-template-columns: 1fr; }
}

/* =====================================================
   PAGE SERVICES SEUCOM — styles spécifiques
   À charger APRÈS local-theme.css
   ===================================================== */

/* ─── VARIABLES MANQUANTES — ajout au :root global ───
   Copier ce bloc dans le :root de local-theme.css
   ─────────────────────────────────────────────────────
:root {
  --gris-texte-dark:    #555555;
  --gris-fond-light:    #f7f7f7;
  --gris-bordure-light: #e8e8e8;
  --vert-tres-pale:     rgba(0, 150, 57, 0.05);
  --blanc-casse:        #fafafa;
  --gris-fonce:         #111111;
}
──────────────────────────────────────────────────── */

/* =====================================================
   SECTION COMMON — scopé .page-services
   ===================================================== */

.page-services .section-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 60px;
}

.page-services .section-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.55rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.page-services .section-label.light { color: var(--vert-fonce); }
.page-services .section-label.dark  { color: var(--vert-pale); }

.page-services .section-label svg { width: 16px; height: 16px; stroke-width: 2; fill: none; }
.page-services .section-label.light svg { stroke: var(--vert-fonce); }
.page-services .section-label.dark  svg { stroke: var(--vert-pale); }

.page-services .section-label-line { width: 24px; height: 1px; }
.page-services .section-label.light .section-label-line { background: var(--vert-fonce); }
.page-services .section-label.dark  .section-label-line { background: var(--vert-pale); }

.page-services .section-title {
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-bottom: 14px;
}

.page-services .section-subtitle {
  font-weight: 300;
  line-height: 1.75;
}
.page-services .section-subtitle.light { color: var(--gris-texte-dark); }
.page-services .section-subtitle.dark  { color: var(--gris-texte); }

/* =====================================================
   HERO SERVICES
   ===================================================== */

.hero-services {
  position: relative;
  padding: 100px 0 90px;
  overflow: hidden;
  min-height: 75vh;
  display: flex;
  align-items: center;
  background: var(--noir);
  color: var(--blanc);
}

.hero-services__bg {
  position: absolute;
  inset: 0;
  background: url('/medeco_d10/sites/default/files/imce/biaxial.jpg') center/cover no-repeat;
  opacity: 0.26;
  filter: grayscale(30%);
}

.hero-services__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.6) 50%, rgba(0,10,4,0.8) 100%);
}

.hero-services .seucom-container {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

/* Label pill */
.hero-services__label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(0,150,57,0.1);
  border: 1px solid rgba(0,150,57,0.25);
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 0.58rem;
  font-weight: 500;
  color: var(--vert-pale);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 28px;
  animation: heroFadeInUp 0.6s ease both;
}
.hero-services__label svg {
  width: 14px; height: 14px;
  stroke: var(--vert-pale); fill: none; stroke-width: 2;
}

/* Titre */
.hero-services__title {
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.03em;
  margin-bottom: 22px;
  animation: heroFadeInUp 0.6s ease 0.1s both;
}
.hero-services__title .highlight {
  background: var(--gradient-vert);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Sous-titre */
.hero-services__subtitle {
  font-weight: 300;
  color: var(--gris-texte);
  line-height: 1.75;
  max-width: 500px;
  margin-bottom: 36px;
  animation: heroFadeInUp 0.6s ease 0.2s both;
}

/* CTAs */
.hero-services__ctas {
  display: flex;
  gap: 14px;
  animation: heroFadeInUp 0.6s ease 0.3s both;
}

.hero-services__btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gradient-vert);
  color: var(--noir);
  padding: 15px 34px;
  border-radius: 50px;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  transition: var(--transition);
  border: none;
  cursor: pointer;
  text-decoration: none;
}
.hero-services__btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,150,57,0.35);
  color: var(--noir);
  text-decoration: none;
}
.hero-services__btn-primary svg {
  width: 16px; height: 16px;
  stroke: currentColor; fill: none; stroke-width: 2;
}

.hero-services__btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--blanc);
  padding: 15px 34px;
  border-radius: 50px;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: var(--transition);
  border: 1px solid rgba(255,255,255,0.18);
  cursor: pointer;
  text-decoration: none;
}
.hero-services__btn-secondary:hover {
  border-color: var(--vert-pale);
  background: rgba(0,150,57,0.08);
  color: var(--blanc);
  text-decoration: none;
}

/* Grille services (côté droit) */
.hero-services__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  animation: heroFadeInRight 0.8s ease 0.3s both;
}

.hero-services__card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--radius-sm);
  padding: 22px 18px;
  transition: var(--transition);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  color: var(--blanc) !important;
}
.hero-services__card:hover {
  background: rgba(0,150,57,0.07);
  border-color: rgba(0,150,57,0.25);
  transform: translateY(-3px);
  color: var(--blanc);
  text-decoration: none;
}
.hero-services__card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 0;
  background: var(--gradient-vert);
  transition: height 0.4s ease;
}
.hero-services__card:hover::before { height: 100%; }
.hero-services__card--span2 { grid-column: span 2; }

.hero-services__card-picto { margin-bottom: 10px; }
.hero-services__card-picto svg { width: 28px; height: 28px; }

.hero-services__card h4 {
  font-size: 0.9rem;
  margin-bottom: 4px;
  line-height: 1.3;
}
.hero-services__card p {
  font-size: 0.72rem;   /* corrigé : était 1.1rem, plus grand que le h4 */
  font-weight: 300;
  color: var(--gris-clair);
  line-height: 1.5;
  margin: 0;
}

/* Animations hero */
@keyframes heroFadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes heroFadeInRight {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* =====================================================
   SECTION 6 — SERVICES ATELIER (light)
   ===================================================== */

.services-atelier {
  padding: 60px 0;
  background: var(--blanc);
}

.atelier-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}

.atelier-visual {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.atelier-visual img { width: 100%; height: 100%; object-fit: cover; }

.atelier-visual-badge {
  position: absolute;
  bottom: 16px; left: 16px;
  background: rgba(0,0,0,0.75);
  backdrop-filter: blur(10px);
  padding: 10px 18px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(0,150,57,0.3);
  display: flex; align-items: center; gap: 8px;
}
.atelier-visual-badge svg { width: 14px; height: 14px; stroke: var(--vert-pale); fill: none; stroke-width: 2; }
.atelier-visual-badge span { font-size: 0.55rem; font-weight: 500; color: var(--vert-pale); }

.atelier-content h2 {
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
  color: var(--noir);
}
.atelier-content h2 .highlight {
  background: var(--gradient-vert-subtle);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.atelier-content > p {
  font-weight: 300;
  color: var(--gris-texte-dark);
  line-height: 1.8;
  margin-bottom: 28px;
}

.atelier-features { display: grid; gap: 12px; }

.atelier-feature {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  background: var(--gris-fond-light);
  border-radius: var(--radius-sm);
  border: 1px solid var(--gris-bordure-light);
  transition: var(--transition);
}
.atelier-feature:hover {
  background: var(--vert-tres-pale);
  border-color: rgba(0,150,57,0.2);
}

.atelier-feature-icon {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--vert-tres-pale);
  border: 1px solid rgba(0,150,57,0.12);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.atelier-feature-icon svg { width: 20px; height: 20px; stroke: var(--vert-fonce); fill: none; stroke-width: 2; }

.atelier-feature h4 {
  font-size: 0.72rem;   /* corrigé : était 22px, incohérent avec le système */
  font-weight: 600;
  margin: 0 0 3px;
  color: var(--noir);
}
.atelier-feature p {
  font-weight: 300;
  color: var(--gris-texte-dark);
  line-height: 1.5;
  margin: 0;
}

/* =====================================================
   SECTION 7 — INTERVENTIONS (dark)
   ===================================================== */

.interventions {
  padding: 100px 0;
  background: var(--noir);
  color: var(--blanc);
  position: relative;
}
.interventions::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(162,228,184,0.2), transparent);
}

.interventions-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.intervention-card {
  border-radius: var(--radius);
  overflow: hidden;
  position: relative;
  transition: var(--transition);
  border: 1px solid rgba(255,255,255,0.06);
}
.intervention-card:hover {
  border-color: rgba(0,150,57,0.25);
  transform: translateY(-4px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}

.intervention-card-img {
  height: 220px;
  overflow: hidden;
  position: relative;
}
.intervention-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.intervention-card:hover .intervention-card-img img { transform: scale(1.05); }
.intervention-card-img::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 60%;
  background: linear-gradient(to top, var(--noir-doux), transparent);
}

.intervention-card-body {
  padding: 32px 32px 36px;
  background: var(--noir-doux);
}
.intervention-card-body .picto { margin-bottom: 16px; }
.intervention-card-body .picto svg { width: 40px; height: 40px; }

.intervention-card h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}
.intervention-card > .intervention-card-body > p {
  font-weight: 300;
  color: var(--gris-texte);
  margin-bottom: 20px;
}

.intervention-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.intervention-tag {
  font-size: 0.62rem;   /* corrigé : était 0.8rem, trop grand */
  font-weight: 400;
  padding: 6px 14px;
  border-radius: 50px;
  background: rgba(0,150,57,0.07);
  border: 1px solid rgba(0,150,57,0.15);
  color: var(--vert-pale);
}

/* =====================================================
   SECTION 8 — ORGANIGRAMMES (light)
   ===================================================== */

.organigrammes {
  padding: 40px 0 100px;
  background: var(--blanc-casse);
}

.organigrammes-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}

.organigrammes-content h2 {
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
  color: var(--noir);
}
.organigrammes-content h2 .highlight {
  background: var(--gradient-vert-subtle);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.organigrammes-content > p {
  color: var(--gris-texte-dark);
  line-height: 1.8;
  margin-bottom: 28px;
}

.organigrammes-benefits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.benefit-card {
  background: var(--blanc);
  border: 1px solid var(--gris-bordure-light);
  border-radius: var(--radius-sm);
  padding: 20px;
  transition: var(--transition);
}
.benefit-card:hover {
  background: var(--vert-tres-pale);
  border-color: rgba(0,150,57,0.2);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.04);
}
.benefit-card .picto { margin-bottom: 10px; }
.benefit-card .picto svg { width: 28px; height: 28px; }
.benefit-card h4 {
  font-size: 0.72rem;
  font-weight: 600;
  margin-bottom: 5px;
  color: var(--noir);
}
.benefit-card p {
  font-weight: 300;
  color: var(--gris-texte-dark);
  line-height: 1.5;
  margin: 0;
}

/* Schéma organigramme */
.organigrammes-visual {
  background: var(--blanc);
  border: 1px solid var(--gris-bordure-light);
  border-radius: var(--radius);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.diagram-level {
  display: flex;
  justify-content: center;
  gap: 12px;
  width: 100%;
}
.diagram-key {
  background: var(--vert-tres-pale);
  border: 1px solid rgba(0,150,57,0.2);
  border-radius: var(--radius-sm);
  padding: 12px 22px;
  text-align: center;
  font-weight: 500;
  color: var(--noir);
}
.diagram-key.master {
  background: var(--gradient-vert);
  color: var(--blanc);
  font-weight: 700;
  border: none;
  padding: 14px 36px;
  display: flex; align-items: center; gap: 8px;
}
.diagram-key.master svg { width: 20px; height: 20px; stroke: var(--blanc); fill: none; stroke-width: 2; }
.diagram-key.passe {
  background: rgba(0,150,57,0.08);
  border-color: rgba(0,150,57,0.25);
}
.diagram-key.unit {
  padding: 8px 14px;
  background: var(--gris-fond-light);
  border-color: var(--gris-bordure-light);
  color: var(--gris-texte-dark);
}
.diagram-connector { width: 2px; height: 16px; background: rgba(0,150,57,0.25); }
.diagram-branch {
  width: 55%; height: 2px;
  background: rgba(0,150,57,0.15);
  position: relative;
}
.diagram-branch::before,
.diagram-branch::after {
  content: '';
  position: absolute; top: 0;
  width: 2px; height: 10px;
  background: rgba(0,150,57,0.25);
}
.diagram-branch::before { left: 0; }
.diagram-branch::after  { right: 0; }
.diagram-note {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--gris-bordure-light);
  width: 100%;
  text-align: center;
  font-weight: 600;
  color: var(--gris-texte-dark);
  line-height: 1.6;
}

/* =====================================================
   SECTION 9 — CYLINDRE REPROGRAMMABLE (dark)
   ===================================================== */

.reprogrammable {
  padding: 100px 0;
  background: var(--gris-fonce);
  color: var(--blanc);
  position: relative;
  overflow: hidden;
}
.reprogrammable::before {
  content: '';
  position: absolute;
  top: 50%; right: -200px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(0,150,57,0.06) 0%, transparent 70%);
  border-radius: 50%;
  transform: translateY(-50%);
}

.reprogrammable-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}

.reprogrammable-visual { position: relative; }
.reprogrammable-img-wrap {
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 24px;
}
.reprogrammable-img-wrap img { width: 100%; display: block; }

.reprogrammable-cycle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: var(--radius-sm);
  padding: 24px 16px;
}
.cycle-step { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.cycle-icon {
  width: 60px; height: 60px;
  border-radius: 50%;
  background: rgba(0,150,57,0.1);
  border: 1.5px solid rgba(0,150,57,0.25);
  display: flex; align-items: center; justify-content: center;
  transition: var(--transition);
}
.cycle-step:hover .cycle-icon {
  background: rgba(0,150,57,0.2);
  border-color: var(--vert-fonce);
  transform: scale(1.08);
}
.cycle-icon svg { width: 20px; height: 20px; }
.cycle-label {
  font-size: 0.6rem;
  font-weight: 300;
  color: var(--gris-clair);
  max-width: 72px;
  text-align: center;
  line-height: 1.3;
}
.cycle-arrow svg { width: 20px; height: 20px; stroke: var(--vert-fonce); fill: none; stroke-width: 2; opacity: 0.5; }

.reprogrammable-content h2 {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
}
.reprogrammable-content h2 .highlight {
  background: var(--gradient-vert);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.reprogrammable-content > p {
  font-weight: 300;
  color: var(--gris-texte);
  line-height: 1.8;
  margin-bottom: 28px;
}

.reprog-features { display: grid; gap: 10px; margin-bottom: 28px; }
.reprog-feature { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.reprog-check {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(0,150,57,0.12);
  border: 1px solid rgba(0,150,57,0.25);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.reprog-check svg { width: 12px; height: 12px; stroke: var(--vert-pale); fill: none; stroke-width: 2.5; }
.reprog-feature span { font-weight: 400; color: var(--gris-texte); }

.reprog-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.stat-card {
  background: rgba(0,150,57,0.07);   /* corrigé : couleur codée en dur remplacée par variable système */
  border: 1px solid rgba(0,150,57,0.12);
  border-radius: var(--radius-sm);
  padding: 18px;
  text-align: center;
}
.stat-card .number {
  font-size: 2rem;
  font-weight: 800;
  background: var(--gradient-vert);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* =====================================================
   SECTION 10 — CONSEIL SÛRETÉ (light, banner style)
   ===================================================== */

.conseil-surete {
  padding: 100px 0;
  background: var(--blanc);
}

.conseil-banner {
  background: var(--blanc-casse);
  border: 1px solid var(--gris-bordure-light);
  border-radius: var(--radius);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  position: relative;
}

.conseil-banner-content { padding: 56px 52px; }

.conseil-banner-visual {
  position: relative;
  overflow: hidden;
}
.conseil-banner-visual img { width: 100%; height: 100%; object-fit: cover; }
.conseil-banner-visual::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to right, var(--blanc-casse) 0%, transparent 40%);
  z-index: 1;
}

.conseil-banner-content h2 {
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 16px;
  color: var(--noir);
}
.conseil-banner-content h2 .highlight {
  background: var(--gradient-vert-subtle);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.conseil-banner-content > p {
  font-weight: 300;
  color: var(--gris-texte-dark);
  line-height: 1.8;
  margin-bottom: 24px;
}

.conseil-domains { display: flex; gap: 10px; margin-bottom: 28px; }
.conseil-domain {
  background: var(--blanc);
  border: 1px solid var(--gris-bordure-light);
  border-radius: var(--radius-sm);
  padding: 14px 22px;
  display: flex; align-items: center; gap: 10px;
  font-weight: 500;
  color: var(--noir);
  flex: 1;
  transition: var(--transition);
}
.conseil-domain:hover {
  border-color: rgba(0,150,57,0.25);
  background: var(--vert-tres-pale);
}
.conseil-domain svg { width: 20px; height: 20px; }

.conseil-steps {
  padding: 56px 40px;
  display: grid;
  gap: 14px;
  align-content: center;
}
.conseil-step {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--blanc);
  border-radius: var(--radius-sm);
  border: 1px solid var(--gris-bordure-light);
  transition: var(--transition);
}
.conseil-step:hover {
  border-color: rgba(0,150,57,0.2);
  box-shadow: 0 4px 16px rgba(0,0,0,0.04);
}
.step-number {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--gradient-vert);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.68rem;
  font-weight: 800;
  color: var(--blanc);
  flex-shrink: 0;
}
.step-text h4 {
  font-size: 0.72rem;
  font-weight: 600;
  margin-bottom: 2px;
  color: var(--noir);
}
.step-text p {
  font-size: 0.65rem;
  font-weight: 300;
  color: var(--gris-texte-dark);
  margin: 0;
}

/* =====================================================
   SECTION 11 — DUO SERVICES : Contrôle + Maintenance (dark)
   ===================================================== */

.duo-services {
  padding: 100px 0;
  background: var(--noir-doux);
  color: var(--blanc);
}

.duo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.duo-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: var(--radius);
  padding: 48px 40px;
  transition: var(--transition);
}
.duo-card:hover { border-color: rgba(0,150,57,0.2); }

.duo-card-label {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.58rem;
  font-weight: 500;
  color: var(--vert-pale);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 18px;
}
.duo-card-label svg { width: 20px; height: 20px; }

.duo-card h3 {
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-bottom: 14px;
}
.duo-card > p {
  font-weight: 300;
  color: var(--gris-texte);
  line-height: 1.8;
  margin-bottom: 28px;
}

.duo-features { display: grid; gap: 10px; }
.duo-feature {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 400;
  color: var(--gris-texte);
}
.duo-feature-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gradient-vert);
  flex-shrink: 0;
}
.duo-card-cta { margin-top: 28px; }

/* =====================================================
   RESPONSIVE — Page Services
   ===================================================== */

@media (max-width: 1024px) {
  .hero-services .seucom-container { grid-template-columns: 1fr; gap: 48px; }
  .hero-services__title { font-size: 2.6rem; }
  .hero-services__grid { grid-template-columns: repeat(4, 1fr); }
  .atelier-grid,
  .organigrammes-layout,
  .reprogrammable-layout,
  .conseil-banner { grid-template-columns: 1fr; }
  .conseil-banner { grid-template-rows: auto 300px; }
  .conseil-banner-visual::before { background: linear-gradient(to bottom, var(--blanc-casse) 0%, transparent 40%); }
}

@media (max-width: 768px) {
  .hero-services { padding: 72px 0 56px; min-height: auto; }
  .hero-services__title { font-size: 2rem; }
  .hero-services__grid { grid-template-columns: 1fr 1fr; }
  .hero-services__card--span2 { grid-column: span 2; }
  .hero-services__ctas { flex-direction: column; }
  .interventions-grid,
  .duo-grid,
  .organigrammes-benefits { grid-template-columns: 1fr; }
  .reprog-stats { grid-template-columns: 1fr 1fr; }
  .conseil-domains { flex-direction: column; }
}

@media (max-width: 480px) {
  .hero-services__title { font-size: 1.6rem; }
  .hero-services__grid { grid-template-columns: 1fr; }
  .hero-services__card--span2 { grid-column: span 1; }
  .reprog-stats { grid-template-columns: 1fr; }
}

/* =====================================================
   PAGE ACCUEIL — blocs Services & Intro
   À charger APRÈS local-theme.css
   ===================================================== */

/* ─── VARIABLES MANQUANTES — à fusionner dans le :root de local-theme.css ───
:root {
  --black-soft:       #0c0c0c;
  --black-card:       #111111;
  --black-border:     #1e1e1e;
  --white-off:        #f5f5f5;
  --white-muted:      #e8e8e8;
  --green-mid:        #2db85c;
  --green-glow:       rgba(0, 150, 57, 0.15);
  --green-gradient:   linear-gradient(135deg, #A2E4B8 0%, #009639 50%, #006a28 100%);
  --text-on-dark:     rgba(255,255,255,0.92);
  --text-muted-dark:  rgba(255,255,255,0.50);
  --text-on-light:    #0c0c0c;
  --text-muted-light: #555555;
}
──────────────────────────────────────────────────── */

/* =====================================================
   SECTION COMMON — scopé .path-frontpage
   ===================================================== */

/* .path-frontpage .section-header {
  max-width: var(--container);
  margin: 0 auto 60px;
  padding: 0 40px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
} */
.black { color: var(--noir); }
.section-label {
	/* font-family: var(--font-body); */
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--vert-fonce);
	margin-bottom: 0;
}

/* .path-frontpage  */
.section-title {
  font-family: var(--font-brand);
  font-size: clamp(22px, 2.8vw, 36px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--blanc);
}

.path-frontpage .section-title-light {
  color: var(--text-on-light);
}

.path-frontpage .section-link {
  font-family: var(--font-body);
  font-size: 0.75rem;
  color: var(--vert-fonce);
  text-decoration: none;
  letter-spacing: 0.06em;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: gap var(--transition);
  white-space: nowrap;
  flex-shrink: 0;
}
.path-frontpage .section-link:hover { gap: 14px; }

/* =====================================================
   BLOC SERVICES (fond clair)
   ===================================================== */

.services {
	background: var(--white-off);
	padding: 60px 0;
}

.services-inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 40px;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 60px;
}

.service-card {
  background: var(--blanc);
  border: 1px solid var(--white-muted);
  border-radius: 4px;
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition);
  cursor: pointer;
}
.service-card:hover {
  border-color: var(--vert-fonce);
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,150,57,0.08);
}

.service-icon {
  width: 48px; height: 48px;
  background: #f0faf3;
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background var(--transition);
}
.service-card:hover .service-icon { background: #d4f0df; }

.service-icon svg {
  width: 28px; height: 28px;
  stroke: var(--vert-fonce);
  fill: none;
  stroke-width: 1.5;
}

.service-name {
  font-family: var(--font-brand);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-on-light);
  line-height: 1.3;
}

.service-desc {
  font-family: var(--font-body);
  font-size: 0.78rem;   /* corrigé : était 1.1rem, presque aussi grand que .service-name */
  color: var(--text-muted-light);
  line-height: 1.65;
  flex: 1;
}

.service-link {
  font-family: var(--font-body);
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--vert-fonce);
  text-decoration: none;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: flex; align-items: center; gap: 6px;
  transition: gap var(--transition);
}
.service-link:hover { gap: 12px; }

/* =====================================================
   BLOC INTRO (fond blanc, 2 colonnes)
   ===================================================== */

.intro {
  background: var(--blanc);
  padding: 100px 0;
}

.intro-inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.intro-label {
  font-family: var(--font-body);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--vert-fonce);
  margin-bottom: 20px;
}

.intro-title {
  font-family: var(--font-brand);
  font-size: clamp(24px, 2.8vw, 38px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--text-on-light);
  margin-bottom: 24px;
}

.intro-title .green { color: var(--vert-fonce); }   /* corrigé : était #fff, illisible sur fond blanc */

.intro-body {
  font-weight: 300;
  line-height: 1.75;
  color: var(--text-muted-light);   /* corrigé : était #fff, illisible sur fond blanc */
  margin-bottom: 24px;
}

.intro-services {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 30px 0;
}

.intro-service-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-family: var(--font-body);   /* corrigé : "font-family: color: #fff" était invalide */
  font-size: .92rem;
  color: var(--text-muted-light);
  line-height: 1.4;
}
.intro-service-item::before {
  content: '';
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px; height: 8px;
  background: #fff;   
  margin-top: 4px;
}

/* Colonne visuelle */
.intro-visual { position: relative; }

.intro-photo-main {
  width: 100%;
  aspect-ratio: 4/3;
  background: linear-gradient(135deg, #e8f5ec 0%, #c8ecd4 100%);
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  color: #bbb;
  font-size: 0.65rem;
  font-family: var(--font-body);
  letter-spacing: 0.06em;
  border: 1px solid #ddd;
  flex-direction: column;
  gap: 12px;
}
.intro-photo-main svg { width: 36px; height: 36px; opacity: 0.35; }

.intro-badge-founded {
  position: absolute;
  bottom: -20px; right: -20px;
  width: 96px; height: 96px;
  background: var(--noir);
  border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  border: 3px solid var(--vert-fonce);
  gap: 2px;
}
.intro-badge-year {
  font-family: var(--font-brand);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--vert-fonce);
  line-height: 1;
}
.intro-badge-since {
  font-family: var(--font-body);
  font-size: 0.5rem;
  color: rgba(255,255,255,0.5);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.path-frontpage #main-content {padding: 0!important;}

#block-flashyplus-accueilgammesv2 {background-color:var(--mt-color-accent);padding: 0!important;}
/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 1024px) {
  .services-grid { grid-template-columns: 1fr 1fr; }
  .intro-inner { grid-template-columns: 1fr; gap: 48px; }
  .intro-badge-founded { bottom: 16px; right: 16px; }
}

@media (max-width: 768px) {
  .services-grid { grid-template-columns: 1fr; }
  .intro-services { grid-template-columns: 1fr; }
  .path-frontpage .section-header { flex-direction: column; align-items: flex-start; gap: 16px; }
  input[type="submit"] + input[type="submit"], .mt-button + .mt-button {	margin-left: 0px; }
  .mt-button {	width: 100%; }
  .hero-slides, .hero-nav, .slide-dots {display: none;}

}

/* =====================================================
   BLOC CTA DOUBLE (#block-flashyplus-services6ctadouble)
   ===================================================== */

/* Padding du bloc via son ID Drupal — évite un wrapper HTML superflu */
#block-flashyplus-services6ctadouble {
  padding: 50px 0;
}

/* Grille 2 colonnes avec séparateur 2px */
.cta-double-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  background: rgba(0,0,0,0.06);
}

/* ─── CARTE (base commune) ─── */
.cta-double-card {
  position: relative;
  overflow: hidden;
  padding: 60px 52px;
}

/* ─── CARTE SOMBRE (professionnel) ─── */
.cta-double-card--dark {
  background: #000;
}

/* Liseré vert en haut */
.cta-double-card__accent {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--vert-fonce);
}

/* ─── CARTE VERTE (particulier) ─── */
.cta-double-card--green {
  background: var(--vert-fonce);
}

/* ─── PICTO ─── */
.cta-double-card__icon {
  width: 56px; height: 56px;
  background: rgba(0,150,57,0.12);
  border: 1px solid rgba(0,150,57,0.25);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 24px;
  flex-shrink: 0;
}

.cta-double-card__icon--light {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.25);
}

/* ─── TITRE ─── */
.cta-double-card__title {
  font-family: 'Unbounded', sans-serif;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 16px;
}

/* ─── TEXTE ─── */
.cta-double-card__text {
  font-size: 0.82rem;
  line-height: 1.8;
  margin-bottom: 32px;
}

.cta-double-card--dark .cta-double-card__text {
  color: rgba(255,255,255,0.5);
}
.cta-double-card--green .cta-double-card__text {
  color: rgba(255,255,255,0.8);
}

/* ─── ACTIONS ─── */
.cta-double-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* ─── BOUTONS ─── */
.cta-double-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 13px 26px;
  text-decoration: none;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  white-space: nowrap;
}
.cta-double-btn svg {
  flex-shrink: 0;
  transition: transform 0.25s ease;
}
.cta-double-btn:hover svg { transform: translateX(4px); }

/* Bouton plein (carte sombre) */
.cta-double-btn--primary {
  background: var(--vert-fonce);
  color: #fff;
}
.cta-double-btn--primary:hover {
  background: var(--vert-moyen);
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,150,57,0.3);
}

/* Bouton outline (carte verte) */
.cta-double-btn--outline {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,0.5);
}
.cta-double-btn--outline:hover {
  background: rgba(255,255,255,0.12);
  border-color: #fff;
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
}

/* ─── RESPONSIVE ─── */

/* Tablette : les deux cartes passent en colonne */
@media (max-width: 900px) {
  .cta-double-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .cta-double-card {
    padding: 48px 36px;
  }
}

/* Mobile : padding réduit, boutons en colonne */
@media (max-width: 600px) {
  #block-flashyplus-services6ctadouble {
    padding: 32px 0;
  }
  .cta-double-card {
    padding: 36px 24px;
  }
  .cta-double-card__title {
    font-size: 1.3rem;
  }
  .cta-double-card__actions {
    flex-direction: column;
    align-items: flex-start;
  }
  .cta-double-btn {
    width: 100%;
    justify-content: center;
  }
}

/* =====================================================
   NODE MT_POST — Vue complète (full)
   Scoped : .post-full
   ===================================================== */

/* ─── WRAPPER ─── */
.post-full__wrap {
  padding-top: 40px;
  padding-bottom: 60px;
}

/* ─── COLONNE GAUCHE : IMAGE ─── */

.post-full__image-wrap {
  position: relative;
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-bottom: 28px;
}

/* Forcer l'image à remplir le conteneur */
.post-full__image-wrap img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-sm);
}

/* Bandeau meta superposé en bas de l'image */
.post-full__image-meta {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.75), transparent);
  padding: 24px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.post-full__date,
.post-full__author {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.58rem;
  font-weight: 300;
  color: rgba(255,255,255,0.85);
  letter-spacing: 0.04em;
}

.post-full__date svg,
.post-full__author svg {
  width: 13px; height: 13px;
  flex-shrink: 0;
  stroke: var(--vert-pale);
}

/* ─── SIDEBAR BLOCS (catégorie, tags) ─── */

.post-full__sidebar-block {
  margin-bottom: 20px;
  padding: 16px 18px;
  background: #f7f7f7;
  border-left: 3px solid var(--vert-fonce);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

.post-full__sidebar-label {
  display: block;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.52rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--vert-fonce);
  margin-bottom: 10px;
}

/* Catégories : liens en pill */
.post-full__cats .field__item a,
.post-full__cats .field__items a {
  display: inline-block;
  background: rgba(0,150,57,0.08);
  border: 1px solid rgba(0,150,57,0.2);
  color: var(--vert-fonce);
  font-family: 'Unbounded', sans-serif;
  font-size: 0.58rem;
  font-weight: 500;
  padding: 4px 12px;
  border-radius: 50px;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s;
  margin: 2px 4px 2px 0;
}
.post-full__cats .field__item a:hover {
  background: rgba(0,150,57,0.15);
  border-color: var(--vert-fonce);
}

/* Tags */
.post-full__tags .field__item a,
.post-full__tags .field__items a {
  display: inline-block;
  background: #f0f0f0;
  border: 1px solid #ddd;
  color: #555;
  font-family: 'Unbounded', sans-serif;
  font-size: 0.55rem;
  font-weight: 400;
  padding: 3px 10px;
  border-radius: 3px;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
  margin: 2px 4px 2px 0;
}
.post-full__tags .field__item a:hover {
  background: var(--vert-fonce);
  border-color: var(--vert-fonce);
  color: #fff;
}

/* ─── COLONNE DROITE : CONTENU ─── */

/* Accroche / chapeau */
.post-full__subtitle {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.post-full__subtitle .field__item,
.post-full__subtitle p {
  font-family: 'Unbounded', sans-serif;
  font-size: 1rem;
  font-weight: 300;
  color: var(--vert-fonce);
  line-height: 1.7;
  letter-spacing: -0.01em;
}

/* Corps article */
.post-full__body {
  margin-bottom: 32px;
}

.post-full__body p {
  font-size: 0.95rem;
  line-height: 1.85;
  color: #333;
  margin-bottom: 1.2rem;
}

.post-full__body h2 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #000;
  margin: 2rem 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--vert-fonce);
}

.post-full__body h3 {
  font-size: 1rem;
  font-weight: 600;
  color: #000;
  margin: 1.5rem 0 0.75rem;
}

.post-full__body ul,
.post-full__body ol {
  padding-left: 1.5rem;
  margin-bottom: 1.2rem;
}

.post-full__body li {
  font-size: 0.9rem;
  line-height: 1.8;
  color: #444;
  margin-bottom: 0.4rem;
}

.post-full__body a {
  color: var(--vert-fonce);
  text-decoration: underline;
  text-decoration-color: rgba(0,150,57,0.3);
  text-underline-offset: 3px;
  transition: text-decoration-color 0.2s;
}
.post-full__body a:hover {
  text-decoration-color: var(--vert-fonce);
}

.post-full__body blockquote {
  border-left: 3px solid var(--vert-fonce);
  margin: 1.5rem 0;
  padding: 12px 20px;
  background: rgba(0,150,57,0.04);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-style: italic;
  color: #555;
}

.post-full__body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-sm);
  margin: 1rem 0;
}

/* Champs extra (non mappés explicitement) */
.post-full__extra {
  margin-top: 16px;
}

/* Liens actions */
.post-full__links {
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid rgba(0,0,0,0.08);
}

/* ─── RESPONSIVE ─── */

/* Tablette/mobile : les deux colonnes passent en pleine largeur,
   image en premier (au-dessus du contenu) */
@media (max-width: 767px) {
  .post-full__wrap {
    padding-top: 24px;
    padding-bottom: 40px;
  }

  /* L'image passe au-dessus du contenu grâce à order */
  .post-full__wrap .col-12.col-md-4 {
    order: -1;
    margin-bottom: 24px;
  }

  .post-full__image-wrap {
    margin-bottom: 0;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  }

  .post-full__sidebar-block {
    margin-top: 16px;
  }

  .post-full__subtitle .field__item,
  .post-full__subtitle p {
    font-size: 0.9rem;
  }

  .post-full__body h2 {
    font-size: 1.1rem;
  }
}

/* ─── Divers ─── */
.annuaire-btn--detail, .iw-btn--detail {display:none;}

/*********************************
******** La société 
**********************************/

   :root {
    --black: #000000;
    --white: #ffffff;
    --green-dark: #009639;
    --green-light: #A2E4B8;
    --green-mid: #00b844;
    --gray-light: #f4f4f4;
    --gray-mid: #e0e0e0;
    --gray-text: #555;
    --font: 'Unbounded', sans-serif;
  }

  html { scroll-behavior: smooth; }

   /* ─── hero_societe ─── */
  .hero_societe {
    min-height: 100vh;
    background: var(--black);
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
    overflow: hidden;
    padding-top: 72px;
  }

  .hero_societe-left {
    display: flex; flex-direction: column; justify-content: center;
  padding: 0px 50px 80px 68px;
    position: relative; z-index: 2;
  }

  .hero_societe-eyebrow {
    font-weight: 300;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--green-dark);
    margin-bottom: 28px;
    display: flex; align-items: center; gap: 12px;
  }
  .hero_societe-eyebrow::before {
    content: '';
    display: block; width: 36px; height: 1px;
    background: var(--green-dark);
  }

  .hero_societe-title {
    font-weight: 800;
    font-size: clamp(2.8rem, 5vw, 5rem);
    line-height: 0.95;
    color: var(--white);
    letter-spacing: -0.04em;
    margin-bottom: 32px;
  }
  .hero_societe-title em {
    font-style: normal;
    color: var(--green-dark);
    display: block;
  }

  .hero_societe-desc {
    font-weight: 300;
    line-height: 2;
    color: rgba(255,255,255,0.55);
    max-width: 440px;
    margin-bottom: 48px;
    letter-spacing: 0.03em;
  }

  .hero_societe-stats {
    display: flex; gap: 40px;
  }
  .stat-item { display: flex; flex-direction: column; gap: 4px; }
  .stat-number {
    font-weight: 800;
    font-size: 2rem;
    color: var(--white);
    line-height: 1;
    letter-spacing: -0.04em;
  }
  .stat-number span { color: var(--green-dark); }
  .stat-label {
    font-weight: 300;
    font-size: 0.52rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
  }

  .hero_societe-right {
    position: relative;
    overflow: hidden;
  }
  .hero_societe-right::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(90deg, #000 0%, transparent 40%), linear-gradient(0deg, #000 0%, transparent 30%);
    z-index: 1;
  }
  .hero_societe-photo-main {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(20%) contrast(1.1);
  }

  /* Decorative grid overlay */
  .hero_societe-grid-overlay {
    position: absolute; inset: 0; z-index: 0;
    background-image:
      linear-gradient(rgba(0,150,57,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,150,57,0.05) 1px, transparent 1px);
    background-size: 60px 60px;
  }

  .hero_societe-badge {
    position: absolute;   top: 40px; right: 40px; z-index: 3;
    background: rgba(0,0,0,0.8);
    border: 1px solid var(--green-dark);
    padding: 16px 24px;
    text-align: center;
  }
  .hero_societe-badge-year {
    font-weight: 800;
    font-size: 2.2rem;
    color: var(--green-dark);
    line-height: 1;
    display: block;
  }
  .hero_societe-badge-label {
    font-weight: 300;
    font-size: 0.5rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    display: block;
    margin-top: 4px;
  }

  /* ─── SECTION GÉNÉRALE ─── */
  .section-container {
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 60px;
  }

  /* ─── SECTION: MEDECO MONDE — LIGHT ─── */
  .section-medeco-world {
    background: var(--white);
    padding: 120px 0;
  }

  .section-header {
    margin-bottom: 72px;
  }
  .section-eyebrow {
    font-weight: 300;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--green-dark);
    margin-bottom: 20px;
    display: flex; align-items: center; gap: 12px;
  }
.section-eyebrow::before, .section-label::before {
	content: '';
	display: block;
	width: 36px;
	height: 1px;
	background: var(--green-dark);
}
  .section-title-light {
    font-weight: 800;
    font-size: clamp(2rem, 3.5vw, 3.2rem);
    line-height: 1.05;
    color: var(--black);
    letter-spacing: -0.04em;
    max-width: 700px;
  }
  .section-title-dark {
    font-weight: 800;
    font-size: clamp(2rem, 3.5vw, 3.2rem);
    line-height: 1.05;
    color: var(--white);
    letter-spacing: -0.04em;
    max-width: 700px;
  }

  .two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
  }
.two-col-text p {
	font-weight: 300;
	/* line-height: 2.1; */
	color: var(--gray-text);
	letter-spacing: 0.02em;
	/* margin-bottom: 20px; */
}
  .two-col-text p strong {
    font-weight: 600;
    color: var(--black);
  }

  .highlight-box {
    background: var(--black);
    padding: 36px;
    margin-top: 32px;
    position: relative;
    overflow: hidden;
  }
  .highlight-box::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 4px; background: var(--green-dark);
  }
  .highlight-box p {
    font-weight: 500;
    line-height: 1.9;
    color: var(--white) !important;
    letter-spacing: 0.03em;
    margin: 0 !important;
  }

  .world-stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
    margin-top: 8px;
  }
  .world-stat-card {
    background: var(--black);
    padding: 40px 32px;
    position: relative;
    overflow: hidden;
  }
  .world-stat-card::after {
    content: '';
    position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px;
    background: var(--green-dark);
  }
  .world-stat-card:nth-child(2)::after { background: var(--green-light); }
  .world-stat-card:nth-child(3)::after { background: var(--green-light); }
  .world-stat-card:nth-child(4)::after { background: var(--green-dark); }

  .ws-number {
    font-weight: 800;
    font-size: 2.8rem;
    color: var(--white);
    line-height: 1;
    letter-spacing: -0.04em;
    display: block;
  }
  .ws-number em { font-style: normal; color: var(--green-dark); }
  .ws-label {
    font-weight: 300;
  font-size: 0.8rem;
  color: rgb(255, 255, 255);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    display: block;
    margin-top: 8px;
  }

  .patent-badge {
    background: var(--gray-light);
    border-left: 4px solid var(--green-dark);
    padding: 20px 24px;
    margin-top: 16px;
    display: flex; align-items: center; gap: 16px;
  }
  .patent-badge svg { flex-shrink: 0; }
  .patent-text {
    font-weight: 300;
    letter-spacing: 0.05em;
    line-height: 1.8;
    color: var(--gray-text);
  }
  .patent-text strong { font-weight: 600; color: var(--black); display: block; margin-bottom: 2px; }

  /* ─── SECTION: MEDECO EN FRANCE — DARK ─── */
  .section-france {
    background: var(--black);
    padding: 120px 0;
    position: relative;
    overflow: hidden;
  }
  .section-france::before {
    content: '';
    position: absolute; inset: 0;
    background-image:
      linear-gradient(rgba(0,150,57,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,150,57,0.04) 1px, transparent 1px);
    background-size: 80px 80px;
  }

  .france-desc p {
    font-weight: 300;
    line-height: 2.1;
    color: rgba(255,255,255,0.55);
    letter-spacing: 0.02em;
    margin-bottom: 20px;
  }
  .france-desc p strong {
    font-weight: 700;
    color: var(--green-light);
  }

  .photo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 300px 200px;
    gap: 3px;
    margin-top: 64px;
  }
  .photo-item {
    position: relative;
    overflow: hidden;
  }
  .photo-item:first-child {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
  }
  .photo-item img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(15%) contrast(1.05);
    transition: transform 0.6s ease, filter 0.4s ease;
  }
  .photo-item:hover img { transform: scale(1.04); filter: grayscale(0%) contrast(1.1); }
  .photo-item::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.7) 100%);
    pointer-events: none;
  }

  .photo-label {
    position: absolute; bottom: 16px; left: 16px; z-index: 2;
    font-weight: 300;
    font-size: 0.5rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
  }

  /* ─── SECTION: HISTOIRE SEUCOM — LIGHT ─── */
  .section-seucom {
    background: var(--white);
    padding: 120px 0;
  }

  .seucom-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
    margin-bottom: 96px;
  }

.seucom-text p {
	font-weight: 300;
	/* line-height: 2.1; */
	color: var(--gray-text);
	letter-spacing: 0.02em;
	/* margin-bottom: 20px; */
}
  .seucom-text p strong { font-weight: 600; color: var(--black); }

  .seucom-values {
    display: flex; flex-direction: column; gap: 3px;
  }
  .value-item {
    background: var(--black);
    padding: 28px 32px;
    display: flex; align-items: center; gap: 20px;
    position: relative; overflow: hidden;
    transition: background 0.3s;
    cursor: default;
  }
  .value-item:hover { background: #111; }
  .value-item::after {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 3px; background: var(--green-dark);
    transform: scaleY(0);
    transition: transform 0.3s ease;
    transform-origin: bottom;
  }
  .value-item:hover::after { transform: scaleY(1); }
  .value-icon { flex-shrink: 0; }
  .value-content {}
  .value-title {
    font-weight: 600;
    color: var(--white);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 4px;
  }
  .value-desc {
    font-weight: 300;
    color: rgba(255,255,255,0.45);
    letter-spacing: 0.03em;
  }

  /* ─── PRODUITS GRID avec pictos custom ─── */
  .section-title-sub {
    font-weight: 700;
    font-size: 1.3rem;
    color: var(--black);
    letter-spacing: -0.03em;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--gray-mid);
  }

  .products-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 3px;
  }

  .product-card {
    background: var(--black);
    padding: 40px 32px;
    position: relative;
    overflow: hidden;
    cursor: default;
    transition: background 0.3s;
  }
  .product-card:nth-child(odd) { background: #0a0a0a; }
  .product-card:hover { background: #111; }
  .product-card::after {
    content: '';
    position: absolute; bottom: 0; left: 0; right: 0;
    height: 2px; background: var(--green-dark);
    transform: scaleX(0);
    transition: transform 0.4s ease;
    transform-origin: left;
  }
  .product-card:hover::after { transform: scaleX(1); }

  .product-picto {
    width: 52px; height: 52px;
    margin-bottom: 20px;
  }
  .product-name {
    font-weight: 600;
    color: var(--white);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 8px;
    line-height: 1.4;
  }
  .product-sub {
    font-weight: 300;
  color: rgba(255, 255, 255, 0.75);
    letter-spacing: 0.05em;
    line-height: 1.8;
  }

  /* ─── CTA FOOTER — DARK/GREEN ─── */
  .section-cta {
    background: var(--black);
    border-top: 1px solid rgba(0,150,57,0.2);
    padding: 96px 0;
  }

  .cta-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
  }

  .cta-card {
    padding: 60px 52px;
    position: relative; overflow: hidden;
    cursor: pointer;
  }
  .cta-card-dark {
    background: #0a0a0a;
    border: 1px solid rgba(255,255,255,0.06);
  }
  .cta-card-green {
    background: var(--green-dark);
  }
  .cta-card-dark:hover { background: #111; }
  .cta-card-green:hover { background: var(--green-mid); }

  .cta-card-eyebrow {
    font-weight: 300;
    font-size: 0.52rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 20px;
  }
  .cta-card-dark .cta-card-eyebrow { color: var(--green-dark); }
  .cta-card-green .cta-card-eyebrow { color: rgba(255,255,255,0.6); }

  .cta-card-title {
    font-weight: 800;
    font-size: 1.9rem;
    line-height: 1.05;
    letter-spacing: -0.04em;
    margin-bottom: 16px;
  }
  .cta-card-dark .cta-card-title { color: var(--white); }
  .cta-card-green .cta-card-title { color: var(--white); }

  .cta-card-desc {
    font-weight: 300;
    font-size: 0.65rem;
    letter-spacing: 0.04em;
    line-height: 2;
    margin-bottom: 36px;
  }
  .cta-card-dark .cta-card-desc { color: rgba(255,255,255,0.4); }
  .cta-card-green .cta-card-desc { color: rgba(255,255,255,0.75); }

  .cta-btn {
    display: inline-flex; align-items: center; gap: 12px;
    font-family: var(--font);
    font-weight: 600;
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 16px 28px;
    text-decoration: none;
    transition: all 0.3s;
  }
  .cta-btn-outline {
    border: 1px solid var(--green-dark);
    color: var(--green-light);
  }
  .cta-btn-outline:hover {
    background: var(--green-dark);
    color: var(--white);
  }
  .cta-btn-white {
    background: var(--white);
    color: var(--black);
  }
  .cta-btn-white:hover { background: var(--green-light); }

  .cta-btn-arrow {
    font-size: 1rem;
    transition: transform 0.3s;
  }
  .cta-btn:hover .cta-btn-arrow { transform: translateX(4px); }

  /* ─── FOOTER ─── */
  footer {
    background: #050505;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding: 60px 0 36px;
  }

  .footer-inner {
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 60px;
  }

  .footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 60px;
    margin-bottom: 48px;
  }

  .footer-brand-logo {
    display: flex; align-items: center; gap: 12px;
    margin-bottom: 20px;
    text-decoration: none;
  }
  .footer-brand-name {
    font-weight: 700; font-size: 1.1rem;
    color: var(--white); letter-spacing: -0.02em;
  }
  .footer-tagline {
    font-weight: 300; font-size: 0.58rem;
    color: rgba(255,255,255,0.3); letter-spacing: 0.08em;
    line-height: 1.8; margin-bottom: 20px;
  }
  .footer-address {
    font-weight: 300; font-size: 0.58rem;
    color: rgba(255,255,255,0.25);
    letter-spacing: 0.06em; line-height: 2;
  }
  .footer-col-title {
    font-weight: 600; font-size: 0.6rem;
    letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--green-dark); margin-bottom: 20px;
  }
  .footer-col ul { list-style: none; }
  .footer-col ul li { margin-bottom: 10px; }
  .footer-col ul li a {
    font-weight: 300; font-size: 0.62rem;
    color: rgba(255,255,255,0.35); text-decoration: none;
    letter-spacing: 0.04em; transition: color 0.2s;
  }
  .footer-col ul li a:hover { color: var(--green-light); }

  .footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-top: 28px;
    display: flex; justify-content: space-between; align-items: center;
  }
  .footer-copy {
    font-weight: 300; font-size: 0.52rem;
    color: rgba(255,255,255,0.2); letter-spacing: 0.08em;
  }

  /* ─── ANIMATIONS ─── */
  @keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .anim-in {
    animation: fadeInUp 0.8s ease forwards;
    opacity: 0;
  }
  .delay-1 { animation-delay: 0.1s; }
  .delay-2 { animation-delay: 0.25s; }
  .delay-3 { animation-delay: 0.4s; }
  .delay-4 { animation-delay: 0.55s; }
  .delay-5 { animation-delay: 0.7s; }

  /* Scroll reveal */
  .reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }
  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* ─── RESPONSIVE ─── */
  @media (max-width: 1100px) {
    .hero_societe { grid-template-columns: 1fr; min-height: auto; }
    .hero_societe-right { height: 50vw; }
    .hero_societe-left { padding: 80px 40px 60px; }
    .two-col, .seucom-intro, .refs-intro, .cta-inner { grid-template-columns: 1fr; gap: 40px; }
    .photo-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
    .photo-item:first-child { grid-column: 1 / 3; grid-row: auto; height: 260px; }
    .products-grid { grid-template-columns: 1fr 1fr; }
    .refs-row { grid-template-columns: repeat(4, 1fr); }
    .footer-grid { grid-template-columns: 1fr 1fr; }
  }

  @media (max-width: 700px) {
    .section-container { padding: 0 24px; }
    .products-grid { grid-template-columns: 1fr; }
    .refs-row { grid-template-columns: repeat(3, 1fr); }
    .header-nav { display: none; }
    .world-stats-grid { grid-template-columns: 1fr; }
  }