/* Sous-pages, direction V2 monochrome (29 septembre 2026) : équipe, histoire,
   certifications, guide des références, pages de marque. */

/* ===== Hero interne : titre centré ===== */
.page-hero { padding: calc(52px + clamp(64px, 8vw, 110px)) var(--pad) clamp(48px, 6vw, 80px); text-align: center; }
/* Fil d'Ariane visible retiré le 19 octobre 2026 (demande TMS) ; les données
   structurées BreadcrumbList restent dans chaque page pour Google. */
.crumbs { display: flex; justify-content: center; gap: .5rem; flex-wrap: wrap; color: var(--txt-2); font-size: .8rem; margin-bottom: 1.8rem; }
.crumbs a:hover { color: var(--txt); text-decoration: underline; }
.crumbs [aria-current] { color: var(--txt); }
.page-hero h1 { font-size: clamp(2.8rem, 6vw, 5.5rem); letter-spacing: -.04em; line-height: 1; max-width: 20ch; margin: 0 auto 1.3rem; }
.page-hero .lead { color: var(--txt-2); font-size: clamp(1.08rem, 1.5vw, 1.32rem); line-height: 1.45; max-width: 720px; margin: 0 auto; }

/* ===== Pages de marque ===== */
.partner-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: stretch; text-align: left; margin-top: 1rem; }
.partner-hero > div { background: var(--bg-2); border-radius: var(--r-tile); padding: clamp(32px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; }
.partner-hero h1 { margin: 0 0 1.1rem; max-width: none; font-size: clamp(2.4rem, 4.4vw, 3.75rem); }
.partner-hero .lead { margin: 0; }
.status {
  align-self: flex-start; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--txt-2); margin-bottom: 1.4rem;
}
/* Image produit en tête de page, avec le logo posé en cartouche */
.brand-shot { position: relative; overflow: hidden; min-height: 420px; margin: 0; border-radius: var(--r-tile); }
.brand-shot > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.brand-shot figcaption {
  position: absolute; left: 20px; bottom: 20px; z-index: 1;
  padding: .8rem 1.1rem; background: rgba(20, 20, 22, .82); border-radius: 16px;
  display: grid; place-items: center;
}
.brand-shot figcaption img { max-height: 32px; width: auto; object-fit: contain; }
.brand-shot figcaption img.dealer-badge { max-height: 50px; }

.partner-body { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2.4rem, 5vw, 5rem); align-items: start; }
.partner-body h2 { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1.2rem; }
.partner-body .col-txt > p { color: var(--txt-2); max-width: 60ch; margin-bottom: 1.2rem; font-size: 1.08rem; }
.range { margin-top: 1.6rem; display: grid; gap: 10px; }
.range li {
  background: var(--bg-2); border-radius: 18px; padding: 10px;
  display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 1.1rem; align-items: center;
}
.rg-shot { width: 92px; height: 72px; object-fit: cover; border-radius: 12px; }
/* Images produit des pages de marque : couleur conservée (rouge MTG, bleu Rexroth) */
.brand-shot > img.ph, .partner-visual img.ph, .rg-shot { filter: var(--img-filter-product); }
.rg-txt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 1.2rem; align-items: baseline; padding-right: .6rem; }
.rg-title { font-size: 1.3rem; margin-top: 2.4rem; }
.range b { font-weight: 600; }
.range span { color: var(--txt-2); font-size: .94rem; }
.partner-visual { position: relative; overflow: hidden; aspect-ratio: 4 / 4.6; border-radius: var(--r-tile); }

/* Logo de marque en couleur mis en avant en tête de page (MTG, 29 septembre 2026).
   Posé sur une plaque blanche : il reste lisible en thème sombre. */
.hero-brand-logo {
  align-self: flex-start; display: inline-flex; background: #FFFFFF;
  border-radius: 18px; padding: 18px 24px; margin-bottom: 1.8rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
}
.hero-brand-logo img { height: clamp(52px, 6vw, 76px); width: auto; }

/* Série de photos terrain à la place de l'image unique (MTG) */
.partner-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.partner-gallery figure { margin: 0; overflow: hidden; border-radius: 22px; }
.partner-gallery img { width: 100%; height: 100%; object-fit: cover; filter: var(--img-filter-product); transition: transform .6s var(--ease-out); }
.partner-gallery figure:hover img { transform: scale(1.03); }
.partner-gallery .pg-0 { grid-column: 1 / -1; aspect-ratio: 5 / 3; }
.partner-gallery .pg-1, .partner-gallery .pg-2 { aspect-ratio: 3 / 4; }
.partner-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.ext-link { padding: 2rem 0 0; color: var(--txt-2); font-size: .94rem; }
.ext-link a { color: var(--txt); text-decoration: underline; text-underline-offset: 3px; }

.partner-cta { background: var(--bg-2); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1.8rem; }
.partner-cta h2 { font-size: clamp(1.9rem, 3.4vw, 3rem); max-width: 22ch; }

/* Maillage interne : autres partenaires */
.also h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); margin-bottom: 1.8rem; text-align: center; }
.also-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.also-card { background: var(--bg-2); border-radius: var(--r-tile); padding: 10px; display: flex; flex-direction: column; transition: transform .3s var(--ease-out); }
.also-card:hover { transform: translateY(-3px); }
.also-card .plate {
  position: relative; display: grid; place-items: center;
  aspect-ratio: 16 / 8; overflow: hidden; border-radius: 20px; background: #1D1D1F;
}
.also-card .plate-shot { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.6); }
.also-card .plate-logo { position: relative; z-index: 1; max-height: 40px; width: auto; max-width: 66%; object-fit: contain; }
.also-card .plate-logo[alt="Bosch Rexroth"] { max-height: 56px; }
.also-card > span { padding: .9rem .6rem .5rem; font-weight: 600; }

/* Bandeau texte : autres marques fournies */
.other-brands { background: var(--bg-2); padding: 2.4rem var(--pad); text-align: center; }
.other-brands .label { color: var(--txt-2); font-size: .8rem; margin-bottom: .8rem; }
.other-brands p { color: var(--txt-2); font-size: clamp(1rem, 1.4vw, 1.2rem); line-height: 1.8; max-width: 1000px; margin: 0 auto; }
.other-brands p b { color: var(--txt); font-weight: 500; }
.other-brands .tm-note { margin-top: 1rem; }

/* ===== Page équipe =====
   La photo d'équipe porte le message de la direction en descriptif, à côté
   d'elle (demande TMS du 29 septembre 2026). */
.team-hero-photo {
  padding: 0 var(--pad) clamp(84px, 9vw, 130px);
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; align-items: stretch;
}
.team-hero-photo figure { position: relative; overflow: hidden; min-height: 520px; margin: 0; border-radius: var(--r-tile); }
.team-hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.board { background: var(--bg-2); border-radius: var(--r-tile); padding: clamp(32px, 3.6vw, 48px) clamp(28px, 3.2vw, 44px); display: flex; flex-direction: column; justify-content: center; }
.board-h { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .22em; text-transform: uppercase; color: var(--txt-2); margin-bottom: 1.4rem; }
.board-p { font-size: clamp(1.08rem, 1.5vw, 1.3rem); line-height: 1.45; color: var(--txt); }
.board-p + .board-p { margin-top: .9em; }
/* Signature juste sous le texte (19 octobre 2026), plus en bas du bloc */
.board-sign { margin-top: 1.6rem; color: var(--txt-2); font-size: .9rem; border: 0; background: none; }

/* Grille équipe filtrable, sur le modèle LaCAR */
.team-grid-sec { background: var(--bg-2); }
.team-grid-head { text-align: center; max-width: 860px; margin: 0 auto 2.4rem; display: flex; flex-direction: column; align-items: center; gap: 1.8rem; }
.team-grid-head h2 { font-size: clamp(2.3rem, 4.4vw, 3.75rem); margin-bottom: 1rem; }
.team-grid-head p { color: var(--txt-2); font-size: clamp(1.08rem, 1.5vw, 1.32rem); line-height: 1.45; }
.team-filter { display: flex; justify-content: center; margin: 0 auto 2.6rem; width: fit-content; max-width: 100%; flex-wrap: wrap; background: var(--seg-bg); border-radius: var(--r-pill); padding: 4px; gap: 2px; }
.team-filter-l { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.team-filter button {
  font: inherit; font-size: .88rem; padding: .6rem 1.05rem; border: 0; border-radius: var(--r-pill);
  background: none; color: var(--txt); cursor: pointer; transition: background .2s var(--ease-out);
}
.team-filter button[aria-pressed="true"] { background: var(--seg-on); font-weight: 500; box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }

.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 20px; }
.member[hidden] { display: none; }
.member figure { position: relative; overflow: hidden; aspect-ratio: 3 / 4; margin: 0; background: var(--tile); border-radius: 24px; }
.member img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.member-tbc { position: absolute; inset: 0 0 72px; display: grid; place-items: center; color: var(--txt-2); font-size: .82rem; background: var(--line-soft); }
/* Nom et fonction au survol de la photo */
.member figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
  padding: 2.4rem 1.1rem 1.1rem;
  background: linear-gradient(transparent, rgba(0, 0, 0, .78));
  color: #F5F5F7; display: grid; gap: .1rem;
  opacity: 0; transform: translateY(8px);
  transition: opacity .3s var(--ease-out), transform .3s var(--ease-out);
}
.member figcaption b { font-weight: 600; font-size: 1.05rem; }
.member figcaption span { font-size: .85rem; color: #D2D2D7; }
.member:hover figcaption, .member:focus-within figcaption { opacity: 1; transform: none; }
.member:hover img { transform: scale(1.03); }
@media (hover: none) {
  .member figcaption { opacity: 1; transform: none; }
}
/* Sans photo : le nom reste affiché sous l'emplacement */
/* Cartes sans photo : nom et fonction seuls (16 octobre 2026) */
.member-nophoto p { display: grid; gap: .2rem; align-content: center; height: 100%; min-height: 84px; padding: 1.1rem 1.2rem; background: var(--tile); border-radius: 20px; }
.member-nophoto b { font-weight: 600; font-size: 1.05rem; }
.member-nophoto span { font-size: .88rem; color: var(--txt-2); }
/* Photo des trois actionnaires : toute la largeur de la grille, en tête */
.member-group { grid-column: 1 / -1; }
.member-group figure { aspect-ratio: auto; max-width: 720px; margin-inline: auto; } /* réduite le 16 octobre 2026 */
.member-group img { position: static; display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 35%; }
.member-group figcaption { position: static; opacity: 1; transform: none; background: var(--tile); color: var(--txt); padding: 1rem 1.3rem; font-size: .95rem; }
.member-group:hover img { transform: none; }

/* From our hands to your operations */
.hands .sec-head { margin-bottom: 2.6rem; }
.hands-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.hands-stack .hand { position: relative; overflow: hidden; margin: 0; border-radius: var(--r-tile); aspect-ratio: 16 / 11; }
.hands-stack .hand:nth-child(3n + 1) { grid-column: span 2; aspect-ratio: 16 / 7.5; }
.hands-stack .hand img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.hands-stack .hand:hover img { transform: scale(1.03); }
.hands-stack figcaption {
  position: absolute; left: 20px; bottom: 20px; z-index: 1;
  background: rgba(255, 255, 255, .9); color: #1D1D1F;
  font-size: .85rem; padding: .45rem 1rem; border-radius: var(--r-pill);
}

/* Appel à l'action de fin de page */
.join { background: var(--bg-2); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1.8rem; }
.join h2 { font-size: clamp(1.9rem, 3.4vw, 3rem); max-width: 24ch; }
.join-p { color: var(--txt-2); max-width: 56ch; margin: -.6rem auto 0; }

/* ============================================================
   Page histoire : ligne du temps horizontale (modèle LaCAR, style V2)
   ============================================================ */
.tl-sec { padding-inline: 0; padding-top: clamp(16px, 2vw, 32px); display: flex; flex-direction: column; }
.tl-track {
  order: 1; display: flex; gap: 20px;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad);
  padding: 0 var(--pad) 1rem; list-style: none; scrollbar-width: none;
}
.tl-track::-webkit-scrollbar { display: none; }
.tl-track:focus-visible { outline: 2px solid var(--txt); outline-offset: -2px; }
.tl-item {
  flex: 0 0 clamp(270px, 26vw, 360px); scroll-snap-align: start;
  background: var(--bg-2); border-radius: var(--r-tile); padding: clamp(28px, 2.6vw, 36px);
  min-height: 340px; display: flex; flex-direction: column;
}
.tl-y { font-weight: 600; font-size: clamp(2.6rem, 4vw, 3.5rem); line-height: 1; letter-spacing: -.04em; }
.tl-card { margin-top: auto; padding-top: 2.4rem; }
.tl-card h2 { font-size: 1.35rem; letter-spacing: -.015em; line-height: 1.2; margin-bottom: .6rem; }
.tl-card p { color: var(--txt-2); font-size: .94rem; }
/* Le jalon le plus récent en noir */
.tl-item:last-child { background: var(--btn-bg); color: var(--btn-txt); }
.tl-item:last-child h2 { color: var(--btn-txt); }
.tl-item:last-child p { color: var(--btn-txt); opacity: .72; }
.tl-item:target { box-shadow: 0 0 0 2px var(--txt); }
/* Carte avec photo de fond (7 octobre 2026) : texte en blanc sur un dégradé sombre,
   identique en thème clair et sombre */
.tl-item.has-photo { position: relative; isolation: isolate; overflow: hidden; background: #1D1D1F; color: #FFFFFF; }
.tl-photo { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out); }
.tl-item.has-photo::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .08) 30%, rgba(0, 0, 0, .45) 52%, rgba(0, 0, 0, .9) 100%);
}
.tl-item.has-photo h2 { color: #FFFFFF; }
.tl-item.has-photo .tl-card, .tl-item.has-photo .tl-y { text-shadow: 0 1px 12px rgba(0, 0, 0, .45); }
.tl-item.has-photo p { color: rgba(255, 255, 255, .85); }
.tl-item.has-photo:hover .tl-photo { transform: scale(1.04); }
.tl-nav { order: 2; display: flex; justify-content: flex-end; gap: 12px; padding: 1.2rem var(--pad) 0; }
.tl-nav[hidden] { display: none; }
.tl-btn {
  width: 44px; height: 44px; display: grid; place-items: center;
  background: var(--seg-bg); border: 0; color: var(--txt); font-size: 1.1rem; cursor: pointer; border-radius: 50%;
  transition: background .25s var(--ease-out), opacity .25s var(--ease-out);
}
.tl-btn:hover { background: var(--line); }
.tl-btn:disabled { opacity: .4; cursor: default; }

/* ============================================================
   Page certifications
   ============================================================ */
.certs-page { display: grid; gap: 16px; max-width: 1100px; margin: 0 auto; padding-top: 0; }
.cert {
  display: grid; grid-template-columns: clamp(56px, 8vw, 96px) minmax(0, 1fr);
  gap: clamp(1.2rem, 3vw, 2.6rem);
  padding: clamp(28px, 3.4vw, 44px); background: var(--bg-2); border-radius: var(--r-tile);
}
.cert:target { box-shadow: 0 0 0 2px var(--txt); }
.cert-mark span { font-family: var(--font-mono); font-size: clamp(1.1rem, 2vw, 1.5rem); color: var(--txt-2); line-height: 1; }
.cert h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); margin-bottom: .35rem; }
.cert-s { color: var(--txt-2); font-size: .94rem; margin-bottom: 1rem; }
.cert-body > p { color: var(--txt-2); max-width: 66ch; }
.cert-meta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .35rem 1.2rem; margin-top: 1.4rem; font-size: .88rem; }
.cert-meta dt { font-weight: 600; color: var(--txt); }
.cert-meta dd { color: var(--txt-2); }
.cert-meta a { text-decoration: underline; }

/* ============================================================
   Page guide des références
   ============================================================ */
.refs { max-width: 1200px; margin: 0 auto; padding-top: 0; }
.ref-tools {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto;
  gap: 1rem 1.4rem; align-items: end;
  background: var(--bg-2); border-radius: var(--r-tile); padding: 24px;
}
.ref-tools label { display: block; font-size: .8rem; font-weight: 500; margin-bottom: .45rem; }
.ref-tools input, .ref-tools select {
  width: 100%; background: var(--field-bg); border: 1px solid var(--field-border); color: var(--txt);
  font: inherit; font-size: 1rem; padding: .8rem 1rem; border-radius: var(--r-field);
}
.ref-tools input:focus-visible, .ref-tools select:focus-visible { outline: none; border-color: var(--txt); box-shadow: 0 0 0 1px var(--txt); }
.ref-count { font-variant-numeric: tabular-nums; color: var(--txt-2); font-size: .9rem; padding-bottom: .9rem; white-space: nowrap; }

.ref-table-wrap { overflow-x: auto; margin-top: 1.6rem; }
.ref-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.ref-table caption { caption-side: top; text-align: left; color: var(--txt-2); font-size: .85rem; padding-bottom: 1rem; }
.ref-table th, .ref-table td { text-align: left; padding: .9rem 1.2rem .9rem 0; border-bottom: 1px solid var(--line-soft); }
.ref-table thead th { font-family: var(--font-mono); font-weight: 500; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--txt-2); border-bottom-color: var(--line); }
.ref-table tbody th { font-weight: 600; font-size: 1rem; font-variant-numeric: tabular-nums; color: var(--txt); }
.ref-table td { color: var(--txt-2); font-size: .94rem; }
.ref-table tbody tr:hover { background: var(--hover-tint); }
.ref-act a { font-weight: 500; font-size: .9rem; white-space: nowrap; }
.ref-act a:hover { text-decoration: underline; }
.ref-none { margin-top: 2rem; color: var(--txt-2); max-width: 60ch; }

.vh {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ===== Responsive sous-pages ===== */
@media (max-width: 960px) {
  .partner-hero, .partner-body, .team-hero-photo { grid-template-columns: 1fr; }
  .brand-shot { min-height: 0; aspect-ratio: 4 / 3; }
  .partner-hero .brand-shot { order: -1; }
  .partner-visual { aspect-ratio: 4 / 3; }
  .also-grid { grid-template-columns: 1fr; }
  .team-hero-photo figure { min-height: 0; aspect-ratio: 4 / 3; }
  .hands-stack { grid-template-columns: 1fr; }
  .hands-stack .hand, .hands-stack .hand:nth-child(3n + 1) { grid-column: auto; aspect-ratio: 4 / 3; }
  .range li { grid-template-columns: 68px minmax(0, 1fr); }
  .rg-shot { width: 68px; height: 56px; }
  .rg-txt { grid-template-columns: 1fr; gap: .2rem; }
}
@media (max-width: 760px) {
  .ref-tools { grid-template-columns: 1fr; align-items: stretch; }
  .ref-count { padding-bottom: 0; }
}

/* ============================================================
   Page MTG : gamme par secteur (29 septembre 2026), modèle mtgcorp.com
   ============================================================ */
.sectors-mtg { background: var(--bg-2); }
.sec-tabs-box { max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 2rem; }
/* Commutateur segmenté, façon apple.com */
.sectors-mtg .seg { display: none; background: var(--seg-bg); border-radius: var(--r-pill); padding: 4px; gap: 2px; }
.sectors-mtg .seg button {
  font: inherit; font-size: .94rem; padding: .65rem 1.3rem; border: 0; border-radius: var(--r-pill);
  background: none; color: var(--txt); cursor: pointer;
  transition: background .25s var(--ease-out), transform .25s var(--ease-out);
}
.sectors-mtg .seg button:hover { background: color-mix(in srgb, var(--seg-on) 60%, transparent); transform: translateY(-1px); }
.sectors-mtg .seg button[aria-selected="true"] { background: var(--seg-on); font-weight: 500; box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.sectors-mtg .tabs-live .seg { display: flex; }
.sectors-mtg .geo-panels { width: 100%; }
.sectors-mtg .geo-panel-h { font-weight: 600; font-size: 1.3rem; margin: 1.6rem 0 .6rem; }
/* Onglets actifs : panneaux superposés, la hauteur ne saute pas d'un secteur à l'autre */
.sectors-mtg .tabs-live .geo-panels { display: grid; }
.sectors-mtg .tabs-live .geo-panel { grid-area: 1 / 1; }
.sectors-mtg .tabs-live .geo-panel[hidden] { display: block; visibility: hidden; }
.sectors-mtg .tabs-live .geo-panel-h { display: none; }

.sec-panel { background: var(--tile); border-radius: var(--r-tile); padding: clamp(24px, 3vw, 40px); }
.sec-intro { color: var(--txt-2); max-width: 70ch; margin-bottom: 1.4rem; }
/* Une ligne par famille : intitulé à gauche, produits à droite */
.sec-row { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 1.2rem; align-items: start; padding: 1.1rem 0; border-top: 1px solid var(--line-soft); }
.sec-row-h { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--txt-2); padding-top: .55rem; }
.sec-row-h::before { content: ""; display: inline-block; width: 14px; height: 2px; background: var(--tms-red); vertical-align: middle; margin-right: .6rem; }
.sec-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sec-chips a {
  display: inline-block; padding: .5rem .95rem; border-radius: var(--r-pill);
  background: var(--bg-2); color: var(--txt); font-size: .9rem; font-weight: 500;
  transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out);
}
.sec-chips a:hover { background: var(--btn-bg); color: var(--btn-txt); transform: translateY(-2px); }
/* Apparition en cascade au changement de secteur */
.sectors-mtg .tabs-live .geo-panel:not([hidden]) .sec-chips li { animation: chip-in .4s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 30ms); }
@keyframes chip-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 760px) {
  .sec-row { grid-template-columns: 1fr; gap: .6rem; }
  .sectors-mtg .seg button { padding: .55rem .9rem; font-size: .86rem; }
}

/* Animation produit sous le texte descriptif (VEEMET, page MTG, 30 septembre 2026) */
.partner-anim { margin: 2.2rem 0 0; background: #FFFFFF; border-radius: var(--r-tile); overflow: hidden; }
/* L'animation n'occupe que la zone y 82 à 480 de son cadre 800 x 600 : on n'affiche
   que la bande 60 à 500, la légende remonte sous le produit sans rien couper */
.partner-anim img { width: 100%; aspect-ratio: 800 / 440; height: auto; object-fit: cover; object-position: 50% 37.5%; }
.partner-anim figcaption { padding: .2rem 1.2rem 1.1rem; font-size: .88rem; color: #6E6E73; }
/* Lien vers le site du fabricant, en bas de page */
.other-brands .ext-link { padding-top: 1.2rem; }

/* Machines en tuiles avec pictogramme MTG (30 septembre 2026), modèle mtgcorp.com */
.sec-machines { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; }
.sec-machines a {
  display: flex; flex-direction: column; align-items: center; gap: .55rem; text-align: center;
  padding: .9rem .6rem .8rem; border-radius: 18px; color: var(--txt);
  font-size: .76rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  transition: background .25s var(--ease-out), transform .25s var(--ease-out);
}
.sec-machines img { height: 58px; width: auto; max-width: 100%; object-fit: contain; transition: transform .35s var(--ease-out); }
/* Trait rouge sous le pictogramme, comme sur le site MTG */
.sec-machines span::before { content: ""; display: block; width: 28px; height: 3px; margin: 0 auto .55rem; background: #C8102E; border-radius: 2px; }
.sec-machines a:hover { background: var(--bg-2); transform: translateY(-2px); }
.sec-machines a:hover img { transform: scale(1.06); }
/* Pictogrammes gris foncé : en thème sombre, posés sur une plaque claire pour rester lisibles */
:root[data-theme="dark"] .sec-machines img { background: #E8E8ED; border-radius: 12px; padding: 6px 8px; box-sizing: content-box; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .sec-machines img { background: #E8E8ED; border-radius: 12px; padding: 6px 8px; box-sizing: content-box; } }
.sectors-mtg .tabs-live .geo-panel:not([hidden]) .sec-machines li { animation: chip-in .4s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 40ms); }

/* Success stories sur toute la largeur, appel à devis centré en dessous
   (page MTG, 30 septembre 2026, revu le 6 octobre 2026) */
.partner-cta.has-stories { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(48px, 6vw, 88px); align-items: stretch; text-align: left; }
.stories { min-width: 0; }
.stories-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }
.stories-head h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.stories .tl-nav { padding: 0; order: 0; }
.stories-track {
  display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
  list-style: none; padding: 0 0 .4rem; scrollbar-width: none;
}
.stories-track::-webkit-scrollbar { display: none; }
.story { flex: 0 0 clamp(240px, 24vw, 320px); scroll-snap-align: start; background: var(--tile); border-radius: var(--r-tile); overflow: hidden; display: flex; flex-direction: column; }
.story figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
.story img, .story video { display: block; width: 100%; height: 100%; object-fit: cover; filter: var(--img-filter-product); transition: transform .6s var(--ease-out); }
.story:hover img, .story:hover video { transform: scale(1.04); }
.story-y { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .16em; color: var(--txt-2); padding: 1.1rem 1.3rem 0; }
.story h3 { font-size: 1.15rem; letter-spacing: -.01em; padding: .35rem 1.3rem 0; }
.story > p:last-child { color: var(--txt-2); font-size: .9rem; padding: .4rem 1.3rem 1.3rem; }
.cta-side { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.6rem; }
.cta-side h2 { font-size: clamp(1.9rem, 3.2vw, 2.8rem); }

/* ============================================================
   Gamme par secteur, proposition V2 (30 septembre 2026) : style apple.com,
   volontairement différente du menu de mtgcorp.com.
   ============================================================ */
.sectors-mtg .sec-panel { background: none; padding: 0; border-radius: 0; }
.sectors-mtg .sec-intro { text-align: center; margin: 0 auto 2.6rem; max-width: 62ch; font-size: 1.08rem; }
.sec-group + .sec-group { margin-top: 2.6rem; }
.sec-group-h { font-size: 1.3rem; letter-spacing: -.015em; margin-bottom: 1rem; }

/* Machines : tuiles blanches, pictogramme agrandi et centré, nom en casse normale */
.sec-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.sec-tiles a {
  display: flex; flex-direction: column; align-items: center; gap: .9rem;
  padding: 1.4rem 1rem 1.2rem; background: var(--tile); border-radius: 22px;
  color: var(--txt); font-size: .98rem; font-weight: 500; text-align: center;
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.sec-tiles .pic { height: 78px; display: grid; place-items: center; }
.sec-tiles img { max-height: 78px; width: auto; max-width: 100%; object-fit: contain; transition: transform .45s var(--ease-out); }
.sec-tiles a:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0, 0, 0, .08); }
.sec-tiles a:hover img { transform: scale(1.07); }
/* Thème sombre : tuile entière claire, les pictogrammes MTG (gris foncé) restent lisibles */
:root[data-theme="dark"] .sec-tiles a { background: #E8E8ED; color: #1D1D1F; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .sec-tiles a { background: #E8E8ED; color: #1D1D1F; } }

/* Systèmes MTG, lèvres, têtes de dragage : grille de liens avec chevron, façon apple.com */
.sec-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); column-gap: 2rem; border-top: 1px solid var(--line); }
.sec-links li { border-bottom: 1px solid var(--line); }
.sec-links a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem .2rem; color: var(--txt); font-weight: 500; transition: color .25s var(--ease-out); }
.sec-links .chev { font-size: 1.3rem; line-height: 1; color: var(--txt-2); transition: transform .3s var(--ease-out), color .25s var(--ease-out); }
.sec-links a:hover .nm { text-decoration: underline; text-underline-offset: 3px; }
.sec-links a:hover .chev { transform: translateX(4px); color: var(--txt); }

/* Apparition en cascade au changement de secteur */
.sectors-mtg .tabs-live .geo-panel:not([hidden]) .sec-tiles li,
.sectors-mtg .tabs-live .geo-panel:not([hidden]) .sec-links li { animation: chip-in .45s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 35ms); }
/* Tuiles de même hauteur sur une rangée, même si un nom passe sur deux lignes */
.sec-tiles li { display: flex; }
.sec-tiles a { flex: 1; justify-content: flex-start; }
/* Gamme par secteur et success stories partagent le même fond : on réduit les
   marges qui s'additionnaient entre les deux (30 septembre 2026) */
.sectors-mtg { padding-bottom: clamp(24px, 3vw, 40px); }
.sectors-mtg + .partner-cta.has-stories { padding-top: clamp(24px, 3vw, 40px); border-top: 0; }

/* Page Berco (30 septembre 2026) : système complet en grand, composants en tuiles */
.sec-visual { margin: 0 auto 2.4rem; max-width: 820px; background: #FFFFFF; border-radius: var(--r-tile); padding: clamp(16px, 2.4vw, 32px); }
.sec-visual img { width: 100%; height: auto; }
.sec-tiles.big { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sec-tiles.big a { padding: 1.2rem 1rem 1.3rem; background: #FFFFFF; color: #1D1D1F; }
.sec-tiles.big .pic { height: 150px; }
.sec-tiles.big img { max-height: 150px; }
@media (max-width: 760px) { .sec-tiles.big { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sec-tiles.big .pic, .sec-tiles.big img { height: auto; max-height: 110px; } }
/* Galerie à deux photos : la seconde prend aussi toute la largeur */
.partner-gallery .pg-1:last-child { grid-column: 1 / -1; aspect-ratio: 5 / 3; }
.partner-gallery .pg-1:last-child { background: var(--bg-2); aspect-ratio: 16 / 9; }
/* Schéma légendé : affiché en entier, sans recadrage, pour garder les légendes lisibles */
.partner-gallery .pg-1:last-child { background: #FFFFFF; aspect-ratio: auto; }
.partner-gallery .pg-1:last-child img { object-fit: contain; height: auto; }
.partner-gallery .pg-1:last-child:hover img { transform: none; }

/* Page Berco : système complet à gauche, composants en 2 x 2 à droite (30 septembre 2026) */
.sec-split { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(1rem, 2.4vw, 2rem); align-items: center; }
.sec-split .sec-visual { margin: 0; max-width: none; height: 100%; display: grid; place-items: center; }
.sec-split .sec-group-h { font-size: 1.1rem; margin-bottom: .8rem; }
.sec-split .sec-tiles.big { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sec-split .sec-tiles.big a { padding: .9rem .7rem 1rem; gap: .6rem; font-size: .9rem; }
.sec-split .sec-tiles.big .pic, .sec-split .sec-tiles.big img { height: auto; max-height: 92px; }
.sec-split .sec-tiles.big .pic { height: 92px; }
@media (max-width: 960px) { .sec-split { grid-template-columns: 1fr; } }

/* Donaldson : image de tête affichée en entier et plus petite, sur fond blanc (30 septembre 2026) */
.brand-shot.contain { background: #FFFFFF; }
.brand-shot.contain > img { object-fit: contain; padding: 9% 10%; box-sizing: border-box; }
/* Vignettes de gamme sur fond clair : on les garde entières */
.range .rg-shot[src*="donaldson/"] { object-fit: contain; background: #F2F2F2; }
/* Galerie à une seule image détourée (gamme Donaldson) : fond blanc, image entière */
.partner-gallery .pg-0:only-child { background: #FFFFFF; aspect-ratio: auto; }
.partner-gallery .pg-0:only-child img[src*="donaldson/"] { object-fit: contain; height: auto; }

/* Badge Rexroth (blanc) : plaque sombre, affiché à sa taille réelle pour rester net */
.hero-brand-logo.dark { background: #1D1D1F; padding: 16px 18px; }
.hero-brand-logo.dark img { height: 120px; }

/* Images produit détourées (Rexroth, Donaldson) : affichées entières, sans recadrage
   (30 septembre 2026). La grande image du corps de page et les vignettes de gamme. */
.partner-visual img[src*="rexroth-"] { object-fit: contain; padding: 6%; box-sizing: border-box; background: #FFFFFF; }
.partner-visual:has(img[src*="rexroth-"]) { background: #FFFFFF; aspect-ratio: 1 / 1; }
.range .rg-shot[src*="rexroth-"] { object-fit: contain; background: #FFFFFF; padding: 4px; box-sizing: border-box; }

/* Badge Rexroth en couleur (HD) : plaque blanche, comme le logo MTG */
.hero-brand-logo img[src*="rexroth-authorized"] { height: clamp(96px, 10vw, 128px); }
/* Vue fantôme de la chargeuse : entière, sur fond blanc, format paysage */
.partner-visual:has(img[src*="loader-ghost"]) { aspect-ratio: 3 / 2; }
.partner-visual img[src*="loader-ghost"] { padding: 2%; }

/* Mention sur les marques déposées, en plus petit sous la liste des constructeurs (30 septembre 2026) */
.other-brands .tm-note { font-size: .7rem; margin-top: .6rem; }

/* Photos en hauteur de la série équipe : format portrait (30 septembre 2026) */
.hands-stack .hand.tall { aspect-ratio: 4 / 5; }

/* Guide des références réel (30 septembre 2026) : chargement par marque, 100 lignes
   affichées puis « Show more ». */
.ref-prompt, .ref-loading { margin-top: 2rem; color: var(--txt-2); max-width: 60ch; }
.ref-more { margin-top: 1.8rem; }
.ref-table td.ref-nodesc { color: var(--txt-3, var(--txt-2)); }
.ref-more[hidden], .ref-prompt[hidden], .ref-loading[hidden] { display: none; }
/* Mobile : la colonne marque disparaît (rappelée dans le filtre), le tableau tient
   dans l'écran sans défilement horizontal */
@media (max-width: 640px) {
  .ref-table { min-width: 0; }
  .ref-table th:nth-child(3), .ref-table td:nth-child(3) { display: none; }
  .ref-table th, .ref-table td { padding-right: .8rem; }
  .ref-table tbody th { font-size: .92rem; white-space: nowrap; }
  .ref-act a { font-size: .82rem; white-space: normal; }
}

/* ===== Conditions générales de vente (19 octobre 2026) ===== */
.terms-toc { margin-top: 1.4rem; color: var(--txt-2); font-size: .95rem; }
.terms-toc a { color: var(--txt); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.terms { max-width: 880px; margin-inline: auto; padding-top: 0; }
.terms-v + .terms-v { margin-top: clamp(56px, 7vw, 96px); }
.terms-v h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); padding-bottom: 1rem; border-bottom: 1px solid var(--line); margin-bottom: .4rem; scroll-margin-top: 90px; }
.terms-v { scroll-margin-top: 90px; }
.terms-list { list-style: none; padding: 0; margin: 0; }
.terms-list > li { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 1.4rem; padding: 1.4rem 0; border-bottom: 1px solid var(--line-soft); }
.terms-n { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--txt-2); padding-top: .3rem; }
.terms-list p { color: var(--txt); line-height: 1.65; max-width: 68ch; }
.terms-list p + p, .terms-list ul + p { margin-top: .8rem; }
.terms-list ul { margin: .7rem 0 0 1.2rem; color: var(--txt); line-height: 1.6; }
@media (max-width: 640px) {
  .terms-list > li { grid-template-columns: 1fr; gap: .4rem; }
}

/* Événements de marque (19 octobre 2026) : photo de la carte partenariat en fond,
   logo blanc en grand au centre de la carte, comme sur l'accueil */
.tl-brand {
  position: relative; z-index: 1; align-self: center; display: block;
  width: auto; height: auto; max-width: 70%; max-height: 64px; object-fit: contain;
  margin: auto 0 0; padding-top: 1rem;
  filter: drop-shadow(0 2px 16px rgba(0, 0, 0, .45));
}
.tl-brand-mtg, .tl-brand-bosch-rexroth { max-height: 84px; }
.tl-item.has-brand .tl-card { padding-top: 1.2rem; }
.tl-item.has-brand::after { background: linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .55) 62%, rgba(0, 0, 0, .9) 100%); }
.tl-item.has-brand .tl-y, .tl-item.has-brand .tl-card { position: relative; z-index: 1; }
/* Carte Rexroth : badge à gauche, la pompe occupe la droite de la photo */
.tl-brand-bosch-rexroth { align-self: flex-start; }