/*
Theme Name: Adam Dépannage
Theme URI: https://www.adamdepannage.fr
Author: Adam Dépannage
Description: Thème bloc sur mesure d'Adam Dépannage (Canéjan, Gironde) — dépannage électroménager et pièces détachées. Toutes les pages sont composées de blocs natifs, modifiables dans l'éditeur.
Version: 1.4.4
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adam-depannage
Tags: block-theme, full-site-editing, e-commerce
*/

:root {
  --noir: #383031;
  --brun: #6E1A30;
  --orange: #E2342F;
  --orange-fonce: #C42A25;
  --anthracite: #575051;
  --carte: #433A3B;
  --creme: #F4F1EC;
  --blanc: #FFFFFF;
  --gris: #4B4B4B;
  --gris-clair: #B9B4AE;
  --sans: "Poppins", system-ui, sans-serif;
  --serif: "Newsreader", Georgia, serif;
  --largeur: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--noir);
  background: var(--blanc);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p { margin: 0; }
em { font-family: var(--serif); font-style: italic; font-weight: 500; color: var(--orange); letter-spacing: -0.01em; }

.enveloppe { width: min(var(--largeur), 100% - 48px); margin-inline: auto; }

/* ---------- Boutons ---------- */
.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font: 500 16px/1 var(--sans);
  border: 0; border-radius: 8px; cursor: pointer;
  padding: 16px 28px;
  transition: background .2s;
}
.bouton-plein, .bouton-tel { background: var(--orange); color: var(--blanc); }
.bouton-plein:hover, .bouton-tel:hover { background: var(--orange-fonce); }
.bouton-tel { padding: 14px 24px; font-weight: 400; letter-spacing: .02em; }
.bouton-tel svg { width: 20px; height: 20px; }

/* ---------- Héros ---------- */
.hero {
  color: var(--blanc);
  background:
    radial-gradient(60% 55% at 0% 100%, rgba(122, 56, 24, .55), transparent 70%),
    radial-gradient(50% 60% at 100% 85%, rgba(110, 50, 22, .5), transparent 70%),
    radial-gradient(40% 40% at 0% 0%, rgba(74, 38, 22, .7), transparent 70%),
    var(--noir);
  padding-bottom: 64px;
}
.barre {
  display: flex; align-items: center; justify-content: space-between;
  height: 88px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.menu { display: flex; gap: 40px; list-style: none; margin: 0; padding: 0; }
.menu a { position: relative; display: block; padding: 32px 0; font-size: 16px; color: rgba(255, 255, 255, .88); }
.menu a.actif { font-weight: 600; color: var(--blanc); }
.menu a.actif::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px;
  height: 3px; border-radius: 2px; background: var(--blanc);
}
.burger { display: none; }

.tete {
  display: grid; grid-template-columns: 1fr 360px; gap: 48px; align-items: end;
  padding: 96px 0 60px;
}
.surtitre { font-size: 19px; font-weight: 500; margin-bottom: 14px; }
.titre-hero {
  font-size: 52px; line-height: 1.2; font-weight: 600; letter-spacing: -0.015em;
  max-width: 700px; text-wrap: balance; hyphens: none;
}
.titre-hero em { font-size: 1.04em; }
.accroche { font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .82); letter-spacing: .01em; }

.scene {
  position: relative;
  height: 470px;
  border-radius: 20px;
  overflow: hidden;
  background: var(--creme);
}
.scene-photo {
  position: absolute; inset: 0 0 0 auto;
  width: 72%; height: 100%; object-fit: cover; object-position: 50% 30%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%);
          mask-image: linear-gradient(90deg, transparent 0, #000 22%);
}
.formulaire {
  position: absolute; left: 30px; top: 68px; bottom: 30px;
  width: 390px;
  display: flex; flex-direction: column; gap: 20px; justify-content: center;
  padding: 28px 20px;
  background: var(--carte);
  border-radius: 12px;
  color: var(--blanc);
}
.formulaire label { display: flex; flex-direction: column; gap: 10px; font-size: 16px; }
.formulaire input, .formulaire select {
  width: 100%; height: 44px; padding: 0 16px;
  font: 400 14px var(--sans); color: var(--blanc);
  background: var(--anthracite); border: 0; border-radius: 7px;
  appearance: none;
}
.formulaire input::placeholder { color: rgba(255, 255, 255, .78); }
.formulaire 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 1.5l5 5 5-5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center;
}
.formulaire .bouton { margin-top: 8px; height: 48px; }

/* ---------- Marques ---------- */
.marques { background: var(--blanc); }
.rangee-marques {
  display: flex; justify-content: space-between; align-items: center;
  padding: 64px 0;
}
.marque { font-size: 30px; font-weight: 700; color: var(--gris); letter-spacing: .01em; }

/* ---------- En-têtes de section (fond clair) ---------- */
.tete-section { padding: 56px 0 48px; }
.titre-section {
  font-size: 44px; line-height: 1.2; font-weight: 600; letter-spacing: -0.015em;
  max-width: 640px; text-wrap: balance; hyphens: none;
}
.surtitre-sombre { color: var(--noir); }
.accroche-sombre { color: #5E5955; }

/* ---------- Services ---------- */
.services { padding-bottom: 112px; border-top: 1px solid #EEEAE5; }
.grille-services {
  display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 24px;
}
.carte-service {
  display: flex; flex-direction: column;
  border-radius: 20px; overflow: hidden;
  background: var(--creme);
}
.carte-service img { height: 240px; width: 100%; object-fit: cover; }
.carte-large { grid-row: span 1; background: var(--noir); color: var(--blanc); }
.carte-large img { height: 300px; }
.carte-service.carte-large p { color: rgba(255, 255, 255, .78); }
.carte-corps { display: flex; flex-direction: column; gap: 12px; padding: 28px 28px 32px; flex: 1; }
.numero { font: 500 14px var(--sans); color: var(--orange); }
.carte-service h3 { font-size: 22px; font-weight: 600; line-height: 1.3; }
.carte-service p { font-size: 15px; color: #5E5955; }
.lien { margin-top: auto; padding-top: 8px; font-weight: 500; color: var(--orange); }
.lien::after { content: " →"; }

/* ---------- Pièces ---------- */
.pieces {
  color: var(--blanc);
  background:
    radial-gradient(50% 60% at 100% 0%, rgba(110, 50, 22, .5), transparent 70%),
    radial-gradient(45% 55% at 0% 100%, rgba(122, 56, 24, .45), transparent 70%),
    var(--noir);
  padding-bottom: 112px;
}
.pieces .tete-section { padding-top: 104px; }
.grille-pieces {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.piece {
  position: relative;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
  min-height: 132px; padding: 22px;
  border-radius: 12px;
  background: var(--carte);
  border: 1px solid rgba(255, 255, 255, .06);
  transition: background .2s, border-color .2s;
}
.piece::after {
  content: "→"; position: absolute; top: 18px; right: 22px;
  color: var(--orange); font-size: 18px;
}
.piece:hover { background: #4D4244; border-color: rgba(226, 52, 47, .5); }
.piece-nom { font-size: 17px; font-weight: 600; }
.piece-detail { font-size: 13px; color: var(--gris-clair); }
.piece-vedette {
  grid-column: span 2; grid-row: span 2;
  overflow: hidden; padding: 28px;
  background: var(--creme);
}
.piece-vedette img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.piece-vedette::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(18, 14, 12, 0) 30%, rgba(18, 14, 12, .92) 88%);
}
.piece-vedette .piece-nom, .piece-vedette .piece-detail { position: relative; }
.piece-vedette .piece-nom { font-size: 26px; }
.piece-vedette .piece-detail { color: rgba(255, 255, 255, .85); font-size: 15px; }
.piece-vedette::after { z-index: 1; font-size: 22px; top: 24px; right: 28px; }

/* ---------- Magasin ---------- */
.magasin { padding: 112px 0; }
.grille-magasin { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: stretch; }
.magasin-texte { display: flex; flex-direction: column; align-items: flex-start; }
.magasin-texte .titre-section { margin-bottom: 40px; }
.coordonnees {
  display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px;
  margin: 0 0 40px; width: 100%;
}
.coordonnees dt { font-size: 13px; font-weight: 500; color: var(--orange); margin-bottom: 6px; letter-spacing: .02em; }
.coordonnees dd { margin: 0; font-size: 16px; line-height: 1.6; color: #2A2523; }
.coordonnees a:hover { color: var(--orange); }
.carte-plan {
  min-height: 460px;
  border-radius: 20px; overflow: hidden;
  background: var(--creme);
}
.carte-plan iframe { width: 100%; height: 100%; border: 0; filter: grayscale(1) contrast(1.05); }

/* ---------- Pied ---------- */
.pied {
  color: var(--blanc);
  background:
    radial-gradient(55% 70% at 0% 0%, rgba(122, 56, 24, .45), transparent 70%),
    var(--noir);
}
.pied-haut {
  display: flex; justify-content: space-between; align-items: center; gap: 32px;
  padding: 88px 0 64px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.pied-titre { font-size: 40px; font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; max-width: 760px; }
.pied-colonnes {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px;
  padding: 56px 0;
}
.pied-colonnes h4 { font-size: 16px; font-weight: 600; margin-bottom: 18px; }
.pied-colonnes a { display: block; font-size: 15px; color: rgba(255, 255, 255, .7); padding: 5px 0; }
.pied-colonnes a:hover { color: var(--blanc); }
.pied-bas {
  padding: 28px 0 36px; font-size: 13px; color: rgba(255, 255, 255, .5);
  border-top: 1px solid rgba(255, 255, 255, .08);
}

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .menu { gap: 24px; }
  .tete { grid-template-columns: 1fr; gap: 24px; padding-top: 64px; }
  .grille-services { grid-template-columns: 1fr 1fr; }
  .carte-large { grid-column: span 2; }
  .grille-pieces { grid-template-columns: repeat(2, 1fr); }
  .grille-magasin { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .enveloppe { width: calc(100% - 32px); }
  .menu, .bouton-tel { display: none; }
  .burger {
    display: flex; flex-direction: column; gap: 6px; justify-content: center; align-items: center;
    width: 44px; height: 44px; border: 0; border-radius: 8px; background: var(--orange); cursor: pointer;
  }
  .burger span { width: 18px; height: 2px; background: var(--blanc); border-radius: 1px; }
  .barre { height: 76px; }

  .tete { padding: 48px 0 36px; }
  .surtitre { font-size: 16px; }
  .titre-hero { font-size: 36px; }
  .titre-section { font-size: 32px; }
  .pied-titre { font-size: 30px; }
  .scene { height: auto; display: flex; flex-direction: column; }
  .scene-photo { position: relative; width: 100%; height: 240px; -webkit-mask-image: none; mask-image: none; }
  .formulaire { position: relative; inset: auto; width: auto; margin: 12px; }
  .rangee-marques { flex-wrap: wrap; justify-content: center; gap: 24px 40px; padding: 40px 0; }
  .marque { font-size: 22px; }
  .grille-services { grid-template-columns: 1fr; }
  .carte-large { grid-column: auto; }
  .grille-pieces { grid-template-columns: 1fr 1fr; gap: 10px; }
  .piece { min-height: 110px; padding: 16px; }
  .piece-vedette { min-height: 220px; }
  .coordonnees { grid-template-columns: 1fr; }
  .carte-plan { min-height: 300px; }
  .pied-haut { flex-direction: column; align-items: flex-start; padding-top: 64px; }
  .pied-colonnes { grid-template-columns: 1fr 1fr; }
  .services, .pieces, .magasin { padding-bottom: 72px; }
  .magasin { padding-top: 72px; }
}

/* ---------- Ajustements tour de design ---------- */
.piece-double { grid-column: span 2; }
.scene-photo { filter: saturate(.85) sepia(.12); }
@media (max-width: 1024px) { .piece-double { grid-column: span 2; } }
@media (max-width: 760px) { .piece-vedette { grid-column: span 2; } }
em { white-space: nowrap; }
.piece-vedette::before { background: linear-gradient(180deg, rgba(18, 14, 12, .15) 0%, rgba(18, 14, 12, .55) 45%, rgba(18, 14, 12, .95) 85%); }

.logo { color: var(--blanc); display: block; }
.logo-svg { display: block; height: 66px; width: auto; }
.rangee-marques { gap: 16px; }
.marque { font-size: 24px; }
@media (max-width: 760px) { .logo-svg { height: 48px; } .marque { font-size: 18px; } }
.piece-vedette img { z-index: 0; }
.piece-vedette::before { z-index: 1; }
.piece-vedette .piece-nom, .piece-vedette .piece-detail { z-index: 2; }
.piece-vedette::after { z-index: 2; }

/* =========================================================
   Pages internes
   ========================================================= */
.hero-page { padding-bottom: 0; }
.hero-page .tete { padding: 88px 0 80px; }
.hero-page.avec-grille { padding-bottom: 112px; }
.hero-page.avec-grille .tete { padding-bottom: 56px; }
.fil { display: flex; gap: 8px; font-size: 14px; color: rgba(255, 255, 255, .6); margin-bottom: 20px; }
.fil a:hover { color: var(--blanc); }
.fil span[aria-hidden] { color: rgba(255, 255, 255, .35); }

.section { padding: 104px 0; }
.section .tete-section { padding-top: 0; }
.section-sombre {
  color: var(--blanc);
  background:
    radial-gradient(50% 60% at 100% 0%, rgba(110, 50, 22, .5), transparent 70%),
    radial-gradient(45% 55% at 0% 100%, rgba(122, 56, 24, .45), transparent 70%),
    var(--noir);
}
.section-creme { background: var(--creme); }
.section + .section:not(.section-sombre):not(.section-creme) { border-top: 1px solid #EEEAE5; }

/* Étapes */
.grille-etapes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.etape {
  display: flex; flex-direction: column; gap: 12px;
  padding: 32px 28px 36px; border-radius: 20px; background: var(--creme);
}
.section-creme .etape { background: var(--blanc); }
.etape h3 { font-size: 20px; font-weight: 600; line-height: 1.3; }
.etape p { font-size: 15px; color: #5E5955; }
.etape:nth-child(even) { transform: translateY(40px); }

/* Colonnes texte + photo */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.duo-photo { position: relative; }
.duo-photo img { width: 100%; height: 520px; object-fit: cover; border-radius: 20px; }
.duo-photo .encart {
  position: absolute; right: -32px; bottom: -40px; width: 280px;
  padding: 24px; border-radius: 12px; background: var(--carte); color: var(--blanc);
}
.encart strong { display: block; font-size: 15px; font-weight: 600; margin-bottom: 6px; color: var(--orange); }
.encart p { font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .85); }
.duo-texte { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.duo-texte p { color: #5E5955; }
.liste-coches { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.liste-coches li { position: relative; padding-left: 32px; }
.liste-coches li::before {
  content: ""; position: absolute; left: 0; top: 6px; width: 18px; height: 12px;
  border-left: 3px solid var(--orange); border-bottom: 3px solid var(--orange);
  transform: rotate(-45deg) scale(.8); transform-origin: left top;
}

/* Formulaire en page */
.bloc-demande { display: grid; grid-template-columns: 1fr 1.35fr; gap: 64px; align-items: start; }
.bloc-demande .tete-section { display: block; padding: 0; }
.bloc-demande .accroche { margin-top: 24px; }
.formulaire-page {
  position: static; width: auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
  padding: 36px 32px;
}
.formulaire-page .plein { grid-column: 1 / -1; }
.formulaire textarea {
  width: 100%; min-height: 132px; padding: 14px 16px; resize: vertical;
  font: 400 14px/1.6 var(--sans); color: var(--blanc);
  background: var(--anthracite); border: 0; border-radius: 7px;
}
.formulaire textarea::placeholder { color: rgba(255, 255, 255, .78); }
.formulaire input[type="file"] { padding: 11px 16px; height: auto; }
.formulaire-page .bouton { grid-column: 1 / -1; margin-top: 4px; }
.mention { grid-column: 1 / -1; font-size: 13px; color: rgba(255, 255, 255, .55); }

/* Cartes de coordonnées */
.grille-coord { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.coord {
  display: flex; flex-direction: column; gap: 10px;
  padding: 28px; border-radius: 20px; background: var(--creme);
}
.coord dt { font-size: 13px; font-weight: 500; color: var(--orange); letter-spacing: .02em; }
.coord dd { margin: 0; font-size: 17px; font-weight: 500; line-height: 1.5; }
.coord-sombre { background: var(--noir); color: var(--blanc); }
.coord a:hover { color: var(--orange); }

/* Marques */
.grille-marques { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.carte-marque {
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  min-height: 200px; padding: 28px; border-radius: 20px; background: var(--creme);
}
.carte-marque .marque { font-size: 32px; }
.carte-marque p { font-size: 14px; color: #5E5955; }
.groupe-titre { font-size: 15px; font-weight: 500; color: #5E5955; margin: 0 0 20px; }
.groupe-titre + .grille-marques { margin-bottom: 56px; }

/* Bandeau d'appel */
.bandeau {
  display: flex; justify-content: space-between; align-items: center; gap: 32px;
  padding: 48px 56px; border-radius: 20px; background: var(--noir); color: var(--blanc);
}
.bandeau p { font-size: 28px; font-weight: 600; line-height: 1.25; max-width: 640px; }

/* Menu mobile ouvert */
@media (max-width: 760px) {
  .barre.ouvert { flex-wrap: wrap; height: auto; padding: 16px 0; }
  .barre.ouvert .menu {
    order: 3; display: flex; flex-direction: column; gap: 0; width: 100%; margin-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .08);
  }
  .barre.ouvert .menu a { padding: 14px 0; font-size: 18px; }
  .barre.ouvert .menu a.actif::after { display: none; }
  .barre.ouvert .menu a.actif { color: var(--orange); }
}

@media (max-width: 1024px) {
  .grille-etapes, .grille-coord, .grille-marques { grid-template-columns: 1fr 1fr; }
  .etape:nth-child(even) { transform: none; }
  .duo, .bloc-demande { grid-template-columns: 1fr; gap: 48px; }
  .duo-photo .encart { right: 16px; }
}
@media (max-width: 760px) {
  .hero-page .tete { padding: 48px 0 56px; }
  .hero-page.avec-grille { padding-bottom: 72px; }
  .section { padding: 72px 0; }
  .grille-etapes, .grille-coord { grid-template-columns: 1fr; }
  .grille-marques { grid-template-columns: 1fr 1fr; gap: 12px; }
  .carte-marque { min-height: 150px; padding: 20px; }
  .carte-marque .marque { font-size: 22px; }
  .duo-photo img { height: 320px; }
  .duo-photo .encart { position: relative; right: auto; bottom: auto; width: auto; margin: -48px 16px 0; }
  .formulaire-page { grid-template-columns: 1fr; padding: 24px 20px; }
  .bandeau { flex-direction: column; align-items: flex-start; padding: 32px 24px; }
  .bandeau p { font-size: 22px; }
}
.carte-plan { display: flex; }
.carte-plan iframe { flex: 1; min-height: 460px; display: block; }
@media (max-width: 760px) { .carte-plan iframe { min-height: 300px; } }

/* ---------- Retours client v3 ---------- */
/* Tuiles de catégories : une photo par tuile, toutes de même taille */
.piece { justify-content: flex-start; min-height: 0; padding: 12px 12px 20px; gap: 4px; overflow: hidden; }
.piece img { width: 100%; height: 140px; object-fit: cover; border-radius: 8px; margin-bottom: 12px; transition: transform .3s; }
.piece:hover img { transform: scale(1.03); }
.piece .piece-nom, .piece .piece-detail { padding-inline: 8px; }
.piece::after { top: auto; bottom: 20px; right: 20px; }
.piece-double img { height: 140px; }
@media (max-width: 760px) { .piece img { height: 110px; } .piece { padding: 8px 8px 16px; } .piece::after { display: none; } }

/* Logo plus grand */
.barre { height: 104px; }
.logo-svg { height: 84px; }
.menu a { padding: 40px 0; }
@media (max-width: 760px) { .barre { height: 84px; } .logo-svg { height: 64px; } }

/* Bandeau de marques : cadre arrondi, marques en cases arrondies */
.rangee-marques {
  display: grid; grid-template-columns: repeat(8, 1fr); gap: 12px;
  padding: 28px; margin-block: 56px;
  border-radius: 20px; background: var(--creme);
}
.rangee-marques .marque {
  display: flex; align-items: center; justify-content: center;
  height: 64px; padding: 0 8px; border-radius: 12px; background: var(--blanc);
  font-size: 17px; text-align: center; white-space: nowrap;
}
@media (max-width: 1024px) { .rangee-marques { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px) { .rangee-marques { grid-template-columns: repeat(2, 1fr); padding: 16px; gap: 8px; margin-block: 40px; } .rangee-marques .marque { font-size: 15px; height: 52px; } }

/* Boutons dans les cartes de service */
.carte-corps .bouton { margin-top: auto; align-self: flex-start; padding: 14px 22px; font-size: 15px; }
.carte-service:not(.carte-large) .carte-corps .bouton { background: var(--noir); }
.carte-service:not(.carte-large) .carte-corps .bouton:hover { background: var(--orange); }

/* Carte en couleur, sans le cartouche d'attribution du bas */
.carte-plan { position: relative; overflow: hidden; }
.carte-plan iframe { filter: none; flex: none; width: 100%; height: calc(100% + 28px); min-height: 488px; }
.credit-carte {
  position: absolute; right: 10px; bottom: 8px;
  font-size: 11px; color: #5E5955; background: rgba(255, 255, 255, .85); padding: 2px 8px; border-radius: 6px;
}
@media (max-width: 760px) { .carte-plan iframe { min-height: 328px; } }
.bouton-espace { margin-top: 32px; }
/* Photo héros : recadrage pour masquer l'affiche en haut à droite */
.scene-photo { object-position: 50% 62%; transform: scale(1.12); transform-origin: 0% 100%; }
@media (max-width: 760px) { .scene-photo { transform: scale(1.3); transform-origin: 15% 70%; } }
/* Carte : hauteur fixe, iframe plus haute que le cadre pour rogner le bandeau du bas */
.carte-plan { display: block; height: 460px; min-height: 0; }
.carte-plan iframe { position: absolute; inset: 0 0 auto 0; width: 100%; height: calc(100% + 32px); min-height: 0; }
.credit-carte { z-index: 1; }
@media (max-width: 760px) { .carte-plan { height: 300px; } .carte-plan iframe { min-height: 0; } }

/* ---------- Retours client v4 ---------- */
/* Logo beaucoup plus grand */
.barre { height: 150px; }
.logo-svg { height: 124px; }
.menu a { padding: 63px 0; }
@media (max-width: 760px) { .barre { height: 104px; } .logo-svg { height: 84px; } }

/* Étapes au même niveau */
.etape:nth-child(even) { transform: none; }

/* Trois services : même fond clair, photos alignées */
.grille-services { grid-template-columns: repeat(3, 1fr); }
.carte-service img, .carte-large img { height: 260px; }
@media (max-width: 1024px) { .grille-services { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .grille-services { grid-template-columns: 1fr; } }
.carte-service .carte-corps .bouton { background: var(--orange); }
.carte-service .carte-corps .bouton:hover { background: var(--orange-fonce); }

/* Logos des marques */
.rangee-marques .marque img, .carte-marque img {
  display: block; max-width: 78%; max-height: 30px; width: auto; height: auto; object-fit: contain;
}
.marque-texte { font-weight: 700; color: var(--gris); letter-spacing: .01em; }
.rangee-marques .marque-texte { font-size: 15px; }
.carte-marque { align-items: center; justify-content: center; min-height: 120px; gap: 0; }
.carte-marque img { max-height: 44px; }
.carte-marque.marque-texte { font-size: 22px; }
.grille-marques { grid-template-columns: repeat(6, 1fr); gap: 14px; }
@media (max-width: 1024px) { .grille-marques { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px) {
  .grille-marques { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .carte-marque { min-height: 80px; padding: 12px; }
  .carte-marque img { max-height: 28px; }
  .carte-marque.marque-texte { font-size: 15px; }
  .rangee-marques { grid-template-columns: repeat(4, 1fr); }
  .rangee-marques .marque { height: 46px; }
  .rangee-marques .marque img { max-height: 20px; }
  .rangee-marques .marque-texte { font-size: 11px; white-space: normal; line-height: 1.15; }
}

/* Bandeau « écrivez-nous » sous la grille des pièces */
.bandeau-mail { margin-top: 32px; background: var(--carte); border: 1px solid rgba(255, 255, 255, .08); }
.bandeau-mail p { font-size: 24px; }
.bandeau-mail span { display: block; margin-top: 8px; font-size: 15px; font-weight: 400; line-height: 1.6; color: rgba(255, 255, 255, .72); max-width: 560px; }
.note-mail { padding: 16px 20px; border-left: 3px solid var(--orange); background: var(--blanc); border-radius: 0 8px 8px 0; color: #2A2523; }

/* Carte Google : on rogne le bandeau du bas */
.carte-plan iframe { height: calc(100% + 40px); }

/* Prise de rendez-vous */
.rdv { display: grid; gap: 24px; max-width: 920px; margin-inline: auto; }
.rdv-etape { margin: 0; padding: 0; border: 0; min-width: 0; }
.rdv-etape legend { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; font-size: 24px; font-weight: 600; }
.choix { display: flex; flex-direction: column; gap: 10px; font-size: 16px; }
.choix-options { display: flex; gap: 8px; flex-wrap: wrap; }
.choix-options label {
  display: flex; flex-direction: row; align-items: center; gap: 8px;
  height: 44px; padding: 0 16px; border-radius: 7px; background: var(--anthracite); font-size: 14px; cursor: pointer;
}
.choix-options input { accent-color: var(--orange); width: auto; height: auto; }
.formulaire input[type="date"] { color-scheme: dark; }
.rdv-fin { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.rdv-fin p { color: #5E5955; max-width: 520px; }
.logo-zanussi img, .logo-hoover img { max-height: 42px !important; }
.logo-neff img { max-height: 40px !important; max-width: 70% !important; }
.carte-marque.logo-zanussi img, .carte-marque.logo-hoover img, .carte-marque.logo-neff img { max-height: 60px !important; }
.pied-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.pied-tel { font-size: 15px; color: rgba(255, 255, 255, .7); }
.pied-tel:hover { color: var(--blanc); }
@media (max-width: 760px) { .pied-actions { align-items: flex-start; } }
.formulaire .choix-options input { appearance: auto; -webkit-appearance: radio; width: 16px; height: 16px; padding: 0; background: none; }

/* ---------- Pages d'information et CGV ---------- */
.page-texte { display: grid; grid-template-columns: 260px 1fr; gap: 64px; align-items: start; }
.sommaire { position: sticky; top: 24px; padding: 24px; border-radius: 20px; background: var(--creme); }
.sommaire-titre { font-weight: 600; margin-bottom: 12px; }
.sommaire ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 14px; color: #5E5955; }
.sommaire a:hover { color: var(--orange); }
.texte-legal { max-width: 760px; font-size: 16px; line-height: 1.75; color: #2A2523; }
.texte-legal h2 { font-size: 26px; line-height: 1.3; margin: 48px 0 16px; scroll-margin-top: 24px; }
.texte-legal h3 { font-size: 19px; margin: 32px 0 12px; }
.texte-legal h4 { font-size: 16px; margin: 24px 0 8px; }
.texte-legal p { margin: 0 0 14px; }
.texte-legal ul { margin: 0 0 14px; padding-left: 22px; display: grid; gap: 8px; }
.texte-legal a { color: var(--orange); text-decoration: underline; text-underline-offset: 2px; }
.texte-legal blockquote { margin: 16px 0; padding: 20px 24px; border-left: 3px solid var(--orange); background: var(--creme); border-radius: 0 12px 12px 0; }
.identite { padding: 28px; border-radius: 20px; background: var(--noir); color: var(--blanc); margin-bottom: 40px; }
.identite h2 { margin: 0 0 16px; font-size: 20px; }
.identite dl { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; margin: 0; }
.identite dt { font-size: 13px; color: var(--orange); }
.identite dd { margin: 0; font-size: 15px; }

.grille-infos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.info { display: flex; flex-direction: column; gap: 12px; padding: 32px 28px; border-radius: 20px; background: var(--creme); }
.info h3 { font-size: 22px; font-weight: 600; }
.info p { font-size: 15px; color: #5E5955; }
.info .info-note { margin-top: auto; padding-top: 12px; border-top: 1px solid #E4DED6; font-size: 14px; color: #2A2523; }
.renvoi { margin-top: 32px; font-size: 15px; color: #5E5955; }
.renvoi a { color: var(--orange); text-decoration: underline; }
.bandeau-clair { margin-top: 32px; }
.bandeau-clair span { display: block; margin-top: 8px; font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, .72); }
.note-encadre { margin-top: 32px; }

@media (max-width: 1024px) { .page-texte { grid-template-columns: 1fr; gap: 32px; } .sommaire { position: static; } .grille-infos { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .identite dl { grid-template-columns: 1fr; } .texte-legal h2 { font-size: 22px; } }

/* Mon compte */
.compte { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.compte-bloc { position: static; width: auto; display: flex; flex-direction: column; gap: 18px; padding: 36px 32px; }
.compte-bloc h2 { font-size: 26px; font-weight: 600; }
.compte-clair { background: var(--blanc); color: var(--noir); }
.compte-clair p { color: #5E5955; font-size: 15px; }
.compte-clair input { background: var(--creme); color: var(--noir); }
.compte-clair input::placeholder { color: #8A847E; }
.formulaire .case { flex-direction: row; align-items: center; gap: 10px; font-size: 14px; }
.formulaire .case input { appearance: auto; -webkit-appearance: checkbox; width: 16px; height: 16px; padding: 0; accent-color: var(--orange); }
.compte-lien { font-size: 14px; color: rgba(255, 255, 255, .7); text-decoration: underline; }
.mention-claire { font-size: 13px !important; }
.espace { display: grid; grid-template-columns: 260px 1fr; gap: 24px; align-items: start; }
.espace-menu { display: flex; flex-direction: column; padding: 12px; border-radius: 20px; background: var(--creme); }
.espace-menu a { padding: 12px 16px; border-radius: 10px; font-size: 15px; }
.espace-menu a.actif { background: var(--noir); color: var(--blanc); }
.espace-menu a:not(.actif):hover { background: var(--blanc); }
.espace-contenu { padding: 32px; border-radius: 20px; border: 1px solid #EEEAE5; }
.espace-contenu h3 { font-size: 22px; font-weight: 600; margin-bottom: 20px; }
.vide { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding: 24px; border-radius: 12px; background: var(--creme); }
.espace-note { margin-top: 20px; font-size: 14px; color: #5E5955; }
@media (max-width: 1024px) { .compte, .espace { grid-template-columns: 1fr; } }
.pied-bas a { text-decoration: underline; text-underline-offset: 2px; }
.pied-bas a:hover { color: var(--blanc); }
.maj { font-size: 14px; color: #8A847E; margin-bottom: 24px !important; }
.sommaire-annexe { margin-top: 16px; }
.sommaire .sans-numero { list-style: none; padding-left: 0; }
.formulaire-type p { margin-bottom: 10px; }
.a-completer { padding: 14px 18px; border-radius: 10px; background: #FFF4E5; border: 1px dashed #E2342F; color: #7A2E12; }

/* Logo encore plus grand (v5) */
.barre { height: 196px; }
.logo-svg { height: 168px; }
.menu a { padding: 83px 0; }
@media (max-width: 760px) { .barre { height: 120px; } .logo-svg { height: 104px; } }

/* Dégradé bordeaux sur les zones sombres (v6) */
:root { --bordeaux: 122, 24, 48; --bordeaux-clair: 150, 36, 62; }
.hero {
  background:
    radial-gradient(70% 70% at 0% 100%, rgba(var(--bordeaux-clair), .65), transparent 70%),
    radial-gradient(55% 65% at 100% 80%, rgba(var(--bordeaux), .6), transparent 70%),
    radial-gradient(45% 45% at 0% 0%, rgba(var(--bordeaux), .45), transparent 70%),
    linear-gradient(160deg, #3A3233 0%, #3B2B30 60%, #4A2333 100%);
}
.pieces, .section-sombre {
  background:
    radial-gradient(55% 65% at 100% 0%, rgba(var(--bordeaux-clair), .55), transparent 70%),
    radial-gradient(50% 60% at 0% 100%, rgba(var(--bordeaux), .55), transparent 70%),
    linear-gradient(200deg, #3A3233 0%, #3B2B30 55%, #452331 100%);
}
.pied {
  background:
    radial-gradient(60% 75% at 0% 0%, rgba(var(--bordeaux-clair), .5), transparent 70%),
    radial-gradient(50% 60% at 100% 100%, rgba(var(--bordeaux), .45), transparent 70%),
    linear-gradient(180deg, #3B2B30 0%, #362F30 100%);
}

/* ---------- Frais de port : grille des tarifs ---------- */
.grille-infos.grille-tarifs { grid-template-columns: repeat(4, 1fr); }
.info .tarif { font-size: 30px; font-weight: 600; line-height: 1.1; color: var(--noir); }
.info .tarif span { font-size: 15px; font-weight: 400; color: #7A7470; }
@media (max-width: 1024px) { .grille-infos.grille-tarifs { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .grille-infos.grille-tarifs { grid-template-columns: 1fr; } }

/* ==========================================================================
   ADAPTATIONS WORDPRESS (phase 4)
   Tout ce qui précède est la feuille de la maquette, reprise telle quelle.
   Ce qui suit adapte ses sélecteurs au balisage des blocs natifs.
   ========================================================================== */

/* --- Neutralisations, à spécificité nulle (voir blocs-gutenberg.md) --- */
img { height: auto; }
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
figure.wp-block-image { margin: 0; }
.wp-site-blocks { position: relative; }

/* --- En-tête posé sur le héros ------------------------------------------ */
.wp-site-blocks > header.wp-block-template-part { position: absolute; inset: 0 0 auto 0; z-index: 20; }
.hero { padding-top: 196px; }
/* Pages sans héros (boutique, panier, 404…) : l'en-tête reprend son propre fond. */
.wp-site-blocks:not(:has(.hero)) > header.wp-block-template-part {
  position: relative;
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(var(--bordeaux-clair), .55), transparent 70%),
    linear-gradient(160deg, #3A3233 0%, #3B2B30 60%, #4A2333 100%);
}
.entete { color: var(--blanc); }
.barre { display: flex; align-items: center; justify-content: space-between; gap: 32px; }

/* Logo (bloc Logo du site) */
.entete .wp-block-site-logo { line-height: 0; flex: none; }
.entete .wp-block-site-logo img { height: 168px; width: auto !important; max-width: none; }

/* Menu (bloc Navigation) */
.entete .menu .wp-block-navigation__container { gap: 40px; }
.entete .menu .wp-block-navigation-item__content { padding: 83px 0; font-size: 16px; color: rgba(255, 255, 255, .88); }
.entete .menu .current-menu-item > .wp-block-navigation-item__content { font-weight: 600; color: var(--blanc); }
.entete .menu .current-menu-item > .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 2px; background: var(--blanc);
}
.entete .wp-block-navigation__responsive-container-open {
  width: 44px; height: 44px; border-radius: 8px; background: var(--orange); color: var(--blanc);
  align-items: center; justify-content: center;   /* pas de display : WordPress le masque au-delà de 600 px */
}
.entete .menu .wp-block-navigation__container { flex-wrap: nowrap; }
.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open {
  background-color: #3A3233 !important; color: var(--blanc) !important; padding: 24px;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation-item__content { padding: 14px 0 !important; font-size: 20px !important; }

/* Bouton téléphone */
.wp-block-button.bouton-tel { display: inline-block; background: none; padding: 0; }
.bouton-tel .wp-block-button__link { display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; font-weight: 400; letter-spacing: .02em; }
.bouton-tel .wp-block-button__link::before {
  content: ""; width: 20px; height: 20px; background: currentColor;
  -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E");
}
@media (max-width: 1100px) { .entete-tel { display: none; } .entete .menu .wp-block-navigation__container { gap: 24px; } }
@media (max-width: 760px) {
  .hero { padding-top: 120px; }
  .barre { height: 120px; }
  .entete .wp-block-site-logo img { height: 104px; }
  .entete .wp-block-navigation.menu { display: flex; }
}

/* --- Boutons (bloc Boutons) ---------------------------------------------- */
.wp-block-button__link { transition: background .2s; }
.carte-corps .wp-block-buttons { margin-top: auto; }
.bouton-carte .wp-block-button__link { padding: 14px 22px; font-size: 15px; background: var(--noir); }
.bouton-carte .wp-block-button__link:hover { background: var(--orange); }
.wp-block-buttons.bouton-espace { margin-top: 32px; }
.magasin-texte .wp-block-buttons { margin-top: 0; }

/* --- Numéros, textes de cartes ------------------------------------------- */
.etape .numero, .info .numero, .carte-corps .numero { font: 500 14px var(--sans); color: var(--orange); }

/* --- Fil d'Ariane --------------------------------------------------------- */
.fil { display: block; font-size: 14px; color: rgba(255, 255, 255, .6); margin-bottom: 20px; }
.fil a:hover { color: var(--blanc); }

/* --- Héros : la photo devient une figure ---------------------------------- */
.scene-photo { position: absolute; inset: 0 0 0 auto; width: 72%; height: 100%; overflow: hidden; transform: none; filter: none; }
.scene-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; transform: scale(1.12); transform-origin: 0% 100%; filter: saturate(.85) sepia(.12); }
@media (max-width: 760px) {
  .scene-photo { position: relative; inset: auto; width: 100%; height: 240px; transform: none; }
  .scene-photo img { transform: scale(1.3); transform-origin: 15% 70%; }
}

/* --- Tuiles de catégories : lien étiré sur toute la carte ----------------- */
.piece-nom a::before { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 12px; }

/* --- Coordonnées (remplacent dl/dt/dd) ----------------------------------- */
.coordonnees { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px; margin: 0 0 40px; width: 100%; }
.etiquette { font-size: 13px; font-weight: 500; color: var(--orange); margin-bottom: 6px !important; letter-spacing: .02em; }
.coordonnees .valeur { font-size: 16px; line-height: 1.6; color: #2A2523; }
.coordonnees .valeur a:hover { color: var(--orange); }
.coord .valeur { font-size: 17px; font-weight: 500; line-height: 1.5; }
.identite-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; }
.identite .etiquette { margin-bottom: 2px !important; }
.identite .valeur { font-size: 15px; }
@media (max-width: 760px) { .coordonnees, .identite-grille { grid-template-columns: 1fr; } }

/* --- Encarts et bandeaux --------------------------------------------------- */
.encart .encart-titre { font-size: 15px; font-weight: 600; margin-bottom: 6px; color: var(--orange); }
.bandeau-texte { max-width: 640px; }
.bandeau .bandeau-titre { font-size: 28px; font-weight: 600; line-height: 1.25; }
.bandeau-mail .bandeau-titre { font-size: 24px; }
.bandeau .bandeau-sous { margin-top: 8px; font-size: 15px; font-weight: 400; line-height: 1.6; color: rgba(255, 255, 255, .72); max-width: 560px; }
@media (max-width: 760px) { .bandeau .bandeau-titre { font-size: 22px; } }

/* --- Citations des pages juridiques --------------------------------------- */
.texte-legal .wp-block-quote { margin: 16px 0; padding: 20px 24px; border: 0; border-left: 3px solid var(--orange); background: var(--creme); border-radius: 0 12px 12px 0; }
.texte-legal .wp-block-quote p { margin: 0 0 10px; }
.texte-legal .wp-block-quote p:last-child { margin-bottom: 0; }
.texte-legal .identite h2 { color: var(--blanc); }

/* --- Pied de page (blocs Navigation verticaux) ---------------------------- */
.pied-menu .wp-block-navigation__container { gap: 0; align-items: flex-start; }
.pied-menu .wp-block-navigation-item__content { display: block; font-size: 15px; line-height: 24px; color: rgba(255, 255, 255, .7); padding: 5px 0; }
.pied-menu .wp-block-navigation-item__content:hover { color: var(--blanc); }
.pied-tel a { font-size: 15px; color: rgba(255, 255, 255, .7); }
.pied-tel a:hover { color: var(--blanc); }

/* --- Contact Form 7 -------------------------------------------------------- */
.wpcf7 .hidden-fields-container { display: none; }
.wpcf7-form-control-wrap { display: block; }
.formulaire .wpcf7-form { display: flex; flex-direction: column; gap: 20px; }
.formulaire-page .wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.formulaire-page .wpcf7-form > .plein, .formulaire-page .wpcf7-form > .mention,
.formulaire-page .wpcf7-form > .wpcf7-submit, .wpcf7-form > .wpcf7-response-output { grid-column: 1 / -1; }
.formulaire .wpcf7-submit, .rdv .wpcf7-submit {
  width: 100%; height: 48px; border: 0; border-radius: 8px; cursor: pointer;
  font: 500 16px/1 var(--sans); color: var(--blanc); background: var(--orange); transition: background .2s;
}
.formulaire .wpcf7-submit:hover, .rdv .wpcf7-submit:hover { background: var(--orange-fonce); }
.formulaire-hero .wpcf7-submit { margin-top: 8px; }
.wpcf7-spinner { display: none; }
.wpcf7-not-valid-tip { margin-top: 6px; font-size: 13px; color: #FFB4A9; }
.wpcf7 form .wpcf7-response-output { margin: 0; padding: 12px 16px; border-radius: 8px; font-size: 14px; }
.formulaire .wpcf7-select, .formulaire select { cursor: pointer; }
/* Rendez-vous : trois étapes dans un seul formulaire */
.rdv .wpcf7-form { display: grid; gap: 24px; }
.rdv .wpcf7-form > .rdv-etape { margin: 0; }
.rdv-fin .wpcf7-submit { width: auto; height: auto; padding: 16px 28px; }
.choix .wpcf7-radio { display: flex; gap: 8px; flex-wrap: wrap; }
.choix .wpcf7-list-item { margin: 0; }
.choix .wpcf7-list-item label {
  display: flex; flex-direction: row; align-items: center; gap: 8px;
  height: 44px; padding: 0 16px; border-radius: 7px; background: var(--anthracite); font-size: 14px; cursor: pointer;
}
.formulaire .choix input[type="radio"] { appearance: auto; -webkit-appearance: radio; width: 16px; height: 16px; padding: 0; background: none; accent-color: var(--orange); }
@media (max-width: 760px) { .formulaire-page .wpcf7-form { grid-template-columns: 1fr; } }

/* --- Pages sans héros (index, 404) ---------------------------------------- */
.page-simple { padding: 96px 0 120px; }
.page-simple h1 { font-size: 44px; margin-bottom: 16px; }

/* --- Accessibilité --------------------------------------------------------- */
:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }
@media (min-width: 600px) and (max-width: 760px) { .entete .menu .wp-block-navigation__container { gap: 16px; } .entete .menu .wp-block-navigation-item__content { font-size: 14px; } }

/* --- Marges des composants : spécificité relevée ---------------------------
   WordPress imprime « :root :where(.is-layout-flow) > * { margin-block: 0 } »
   APRÈS la feuille du thème, à spécificité (0,1,0) : toute marge déclarée par
   une seule classe y était remise à zéro (porte 4 : −114 px sur l'accueil).
   Le préfixe « body .wp-site-blocks » (0,2,1), qui dépasse aussi
   « :root :where(.is-layout-flow) > :first-child » (0,2,0), rend leurs marges aux composants, et à eux seuls. */
body .wp-site-blocks .rangee-marques { margin-block: 56px; }
body .wp-site-blocks .surtitre { margin-bottom: 14px; }
body .wp-site-blocks .fil { margin-bottom: 20px; }
body .wp-site-blocks .coordonnees { margin: 0 0 40px; }
body .wp-site-blocks .bandeau-mail, body .wp-site-blocks .bandeau-clair, body .wp-site-blocks .renvoi, body .wp-site-blocks .note-encadre { margin-top: 32px; }
body .wp-site-blocks .identite { margin-bottom: 40px; }
body .wp-site-blocks .sommaire-titre { margin-bottom: 12px; }
body .wp-site-blocks .sommaire-annexe { margin-top: 16px; }
body .wp-site-blocks .espace-note { margin-top: 20px; }
body .wp-site-blocks .wp-block-buttons.bouton-espace { margin-top: 32px; }
@media (max-width: 760px) { body .wp-site-blocks .rangee-marques { margin-block: 40px; } }
.wp-block-button.bouton-tel .wp-block-button__link { white-space: nowrap; }
/* Menu centré verticalement : pas de padding sur les liens (le bloc Navigation
   ajoute son propre conteneur), le soulignement de la page active se place
   sous l'en-tête, au même endroit que dans la maquette. */
.entete .menu .wp-block-navigation-item__content { padding: 0; line-height: 24px; }
.entete .menu .current-menu-item > .wp-block-navigation-item__content::after { bottom: -86px; }
@media (max-width: 760px) { .entete .menu .current-menu-item > .wp-block-navigation-item__content::after { display: none; } }
/* Le groupe qui reçoit le formulaire CF7 n'est pas la grille : c'est le <form>
   de CF7 qui l'est (sinon tout le formulaire tient dans la première colonne). */
.wp-block-group.formulaire-page { display: block; }
.formulaire textarea { height: 132px; }
/* Cartes de coordonnées : l'écart entre étiquette et valeur vient déjà du gap de la carte. */
.coord .etiquette { margin-bottom: 0 !important; }
/* Porte 4, derniers écarts mesurés */
.formulaire textarea { display: block; }                         /* CF7 l'enrobe d'un span : pas d'interligne sous la zone */
.formulaire-page .wpcf7-submit { margin-top: 4px; }              /* comme .formulaire-page .bouton dans la maquette */
.identite .etiquette { margin-bottom: 0 !important; }            /* le dt de la maquette n'avait pas de marge */
body .wp-site-blocks .texte-legal > p:last-child { margin-bottom: 14px; }
body .wp-site-blocks .grille-coord { margin-block: 16px; }        /* marge par défaut du <dl> de la maquette */
.bandeau-clair .bandeau-sous { line-height: 1.25; }               /* le <span> de la maquette héritait de l'interligne du titre */
.texte-legal h3, .texte-legal h4 { line-height: 1.75; }                 /* hérité de l'article dans la maquette */
/* Le bloc Boutons pose « display: flex » après cette feuille : il faut plus de spécificité pour masquer le téléphone. */
@media (max-width: 1100px) { .entete .wp-block-buttons.entete-tel { display: none; } }
.entete .menu .wp-block-navigation-item__content { white-space: nowrap; }

/* Cartes de coordonnées : toute la carte est cliquable quand elle porte un lien
   (e-mail, téléphone), avec un indice visible au survol. */
.coord { position: relative; transition: transform .2s, box-shadow .2s; }
.coord .valeur a::after { content: ""; position: absolute; inset: 0; border-radius: 20px; }
.coord:has(.valeur a):hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(56, 48, 49, .14); }
.coord:has(.valeur a) .etiquette::after { content: "  →"; }
.coord:has(.valeur a[href^="mailto:"]) .etiquette::after { content: "  → écrire"; }
.coord:has(.valeur a[href^="tel:"]) .etiquette::after { content: "  → appeler"; }
.coord .valeur a:hover { text-decoration: underline; text-underline-offset: 3px; }
.coord:has(.valeur a[href*="google.com/maps"]) .etiquette::after { content: "  → itinéraire"; }
.coordonnees .valeur a[href*="google.com/maps"]:hover { color: var(--orange); }

/* --- Boutique WooCommerce : fiche produit -------------------------------- */
.fiche-produit, .liste-produits { padding-top: 32px; }
.liste-produits { padding-bottom: 104px; }
body .wp-site-blocks .fil-boutique { margin: 0 0 32px; font-size: 14px; color: #7A7470; }
.fil-boutique a:hover { color: var(--orange); }
body .wp-site-blocks .fiche-haut {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px;
  align-items: start; padding-bottom: 96px;
}
.fiche-photos { background: var(--blanc); border: 1px solid #EEEAE5; border-radius: 16px; padding: 24px; }
.fiche-photos img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.fiche-photos .flex-control-thumbs { display: flex; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.fiche-photos .flex-control-thumbs li { width: 72px; border: 1px solid #EEEAE5; border-radius: 8px; overflow: hidden; cursor: pointer; }
body .wp-site-blocks .fiche-categorie { margin: 0 0 10px; font-size: 14px; font-weight: 500; color: var(--orange); }
.fiche-categorie a:hover { text-decoration: underline; text-underline-offset: 3px; }
body .wp-site-blocks .fiche-titre {
  margin: 0 0 24px; font-size: 36px; line-height: 1.25; font-weight: 600;
  letter-spacing: -0.015em; text-wrap: balance;
}
.fiche-infos {
  display: flex; flex-wrap: wrap; gap: 10px 32px; margin: 0 0 24px; padding: 16px 0;
  border-block: 1px solid #EEEAE5; font-size: 14px;
}
.fiche-infos dt { color: #7A7470; }
.fiche-infos dd { margin: 0; font-weight: 600; }
body .wp-site-blocks .fiche-prix { margin: 0; font-size: 34px; font-weight: 600; line-height: 1.2; }
.fiche-prix del { font-size: 20px; font-weight: 400; color: #8A847F; margin-right: 8px; }
.fiche-prix ins { text-decoration: none; color: var(--orange); }
.woocommerce-price-suffix { font-size: .5em; font-weight: 400; color: #7A7470; }
body .wp-site-blocks .delai-livraison {
  display: flex; align-items: center; gap: 12px; margin: 16px 0 28px; padding: 12px 16px;
  background: #EDF5EF; color: #23633A; border-radius: 8px; font-size: 15px; font-weight: 500;
}
.delai-livraison::before {
  content: ""; flex: none; width: 22px; height: 22px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4h14v12H1zM15 9h4l4 4v3h-8z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2'/%3E%3Ccircle cx='18.5' cy='18.5' r='2'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4h14v12H1zM15 9h4l4 4v3h-8z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2'/%3E%3Ccircle cx='18.5' cy='18.5' r='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.fiche-panier form.cart { display: flex; gap: 12px; margin: 0; }
.fiche-panier .quantity .qty {
  width: 76px; height: 56px; border: 1px solid #D9D3CC; border-radius: 8px;
  text-align: center; font: 500 16px var(--sans); color: var(--noir);
}
body .fiche-panier .single_add_to_cart_button {
  flex: 1; max-width: 320px; height: 56px; padding: 0 32px; border: 0; border-radius: 8px;
  background: var(--orange); color: var(--blanc); font: 500 16px var(--sans); cursor: pointer; transition: background .2s;
}
body .fiche-panier .single_add_to_cart_button:hover { background: var(--orange-fonce); }
body .wp-site-blocks .fiche-garanties { list-style: none; display: grid; gap: 12px; margin: 32px 0 0; padding: 24px 0 0; border-top: 1px solid #EEEAE5; font-size: 14px; color: #5E5955; }
.fiche-garanties li { position: relative; padding-left: 28px; }
.fiche-garanties li::before {
  content: ""; position: absolute; left: 2px; top: 5px; width: 12px; height: 7px;
  border-left: 2px solid var(--orange); border-bottom: 2px solid var(--orange); transform: rotate(-45deg);
}
.fiche-garanties a { color: var(--orange); text-decoration: underline; text-underline-offset: 3px; }

/* Appareils compatibles (liste mise en forme par inc/boutique.php) */
.compat-tete { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: end; margin-bottom: 40px; }
.compat-intro { color: #5E5955; }
.fiche-texte { max-width: 760px; margin-bottom: 32px; color: var(--gris); }
.fiche-texte p + p { margin-top: 1em; }
.compat-outils { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-bottom: 20px; }
.compat-outils label { font-weight: 600; }
.compat-recherche {
  flex: 0 1 360px; height: 52px; padding: 0 16px; border: 1px solid #D9D3CC; border-radius: 8px;
  background: var(--blanc); font: 16px var(--sans); color: var(--noir);
}
.compat-recherche:focus { outline: 2px solid var(--orange); outline-offset: 1px; }
.compat-resultat { font-size: 14px; font-weight: 500; color: #23633A; }
.compat-resultat.compat-vide { color: var(--orange-fonce); }
.compat-liste {
  list-style: none; margin: 0; padding: 8px; display: grid; gap: 2px 8px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  background: var(--blanc); border-radius: 12px;
}
.compat-liste li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 6px; font-size: 14px; }
.compat-liste li:hover { background: var(--creme); }
.compat-liste li[hidden],
.compat-repliee:not(.compat-filtree) li:nth-child(n+25) { display: none; }
.compat-modele { font-weight: 600; word-break: break-word; }
.compat-code { color: #8A847F; font-variant-numeric: tabular-nums; }
.compat-filtree ~ .compat-plus { display: none; }
.compat-plus { margin-top: 20px; background: var(--noir); color: var(--blanc); }
.compat-plus:hover { background: var(--orange); }
body .wp-site-blocks .compat-aide { margin-top: 24px; font-size: 14px; color: #5E5955; }
.compat-aide a { color: var(--orange); text-decoration: underline; text-underline-offset: 3px; }

/* « Vérifier avec mon appareil », au-dessus du bouton d'achat (inc/boutique.php + assets/app.js) */
.compat-verif[hidden] { display: none; }
.compat-verif {
  display: grid; gap: 10px; margin: -8px 0 24px; padding: 16px; border: 2px solid var(--orange); border-radius: 10px;
  background: #FFF4F0; transition: border-color .2s, background .2s;
}
.compat-verif-titre { font-size: 17px; font-weight: 700; color: var(--noir); }
body .wp-site-blocks .compat-verif-consigne { margin: -4px 0 0; font-size: 14px; line-height: 1.45; color: #5E5955; }
.compat-verif-champ {
  width: 100%; height: 48px; padding: 0 14px; border: 1px solid #D9D3CC; border-radius: 8px;
  background: var(--blanc); font: 500 16px var(--sans); color: var(--noir); text-transform: uppercase;
}
.compat-verif-champ::placeholder { text-transform: none; font-weight: 400; color: #8A847F; }
.compat-verif-champ:focus { outline: 2px solid var(--orange); outline-offset: 1px; }
body .wp-site-blocks .compat-verif-reponse p { margin: 0; font-size: 14px; line-height: 1.5; }
.compat-verif-reponse p[hidden] { display: none; }
.compat-verif-ok { display: flex; align-items: baseline; gap: 8px; color: #23633A; font-weight: 500; }
.compat-verif-ok::before { content: "✓"; font-weight: 700; }
.compat-verif-incomplet { color: #5E5955; }
.compat-verif-non { color: #6B4A12; }
.compat-verif-non a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.compat-verif-bon { border-color: #9CCBA9; background: #EDF5EF; }
.compat-verif-mauvais { border-color: #E9CF9A; background: #FBF4E6; }
.compat-verif-aide { font-size: 13px; color: #5E5955; }
.compat-verif-aide summary { cursor: pointer; color: var(--orange); text-decoration: underline; text-underline-offset: 3px; }
.compat-verif-aide p { margin: 8px 0 0; }

/* --- Boutique : listes et cartes produits -------------------------------- */
body .wp-site-blocks .liste-titre { margin: 0 0 12px; font-size: 40px; line-height: 1.2; font-weight: 600; letter-spacing: -0.015em; }
.liste-intro { max-width: 760px; color: #5E5955; }
.liste-outils { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin: 28px 0 24px; font-size: 14px; color: #7A7470; }
.liste-outils p, .liste-outils form { margin: 0; }
.liste-outils select { height: 44px; padding: 0 12px; border: 1px solid #D9D3CC; border-radius: 8px; background: var(--blanc); font: 14px var(--sans); color: var(--noir); }
body .wp-site-blocks .fiche-associes h2 { margin: 0 0 32px; font-size: 32px; line-height: 1.2; font-weight: 600; text-align: left; }
.wc-block-product-template { gap: 20px !important; }
.wc-block-product-template .wc-block-product {
  display: flex; flex-direction: column; padding: 16px; margin: 0 !important;
  background: var(--blanc); border: 1px solid #EEEAE5; border-radius: 12px; text-align: left;
  transition: border-color .2s, box-shadow .2s;
}
.wc-block-product-template .wc-block-product:hover { border-color: #D9D3CC; box-shadow: 0 8px 24px rgba(56, 48, 49, .08); }
.wc-block-product .wc-block-components-product-image img { aspect-ratio: 1; object-fit: contain; }
body .wp-site-blocks .wc-block-product .wp-block-post-title {
  margin: 14px 0 8px; font-size: 15px; line-height: 1.4; font-weight: 500; text-align: left;
}
.wc-block-product .wp-block-post-title a:hover { color: var(--orange); }
body .wp-site-blocks .wc-block-product .wc-block-components-product-price { margin: 0; font-size: 17px; font-weight: 600; text-align: left; }
body .wp-site-blocks .delai-carte { margin: 4px 0 16px; font-size: 13px; color: #23633A; }
.wc-block-product .wc-block-components-product-button { margin-top: auto; justify-content: stretch; }
body .wc-block-product .wc-block-components-product-button .wp-block-button__link {
  width: 100%; padding: 12px 16px; border-radius: 8px; background: var(--orange); color: var(--blanc); font: 500 14px var(--sans);
}
body .wc-block-product .wc-block-components-product-button .wp-block-button__link:hover { background: var(--orange-fonce); }
.wc-block-product .added_to_cart { display: block; margin-top: 8px; font-size: 13px; color: var(--orange); text-align: center; }
.wp-block-query-pagination { margin-top: 48px; gap: 8px; font-size: 15px; }
.wp-block-query-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; border-radius: 8px; }
.wp-block-query-pagination .page-numbers.current { background: var(--noir); color: var(--blanc); }
.wp-block-query-pagination a:hover { color: var(--orange); }
.liste-vide a { color: var(--orange); text-decoration: underline; }

@media (max-width: 900px) {
  body .wp-site-blocks .fiche-haut { grid-template-columns: 1fr; gap: 32px; padding-bottom: 64px; }
  .compat-tete { grid-template-columns: 1fr; gap: 16px; }
  body .wp-site-blocks .fiche-titre { font-size: 28px; }
  body .wp-site-blocks .liste-titre { font-size: 32px; }
}
@media (max-width: 760px) {
  .fiche-photos { padding: 12px; }
  .compat-recherche { flex-basis: 100%; }
  .compat-liste { grid-template-columns: 1fr; }
  body .fiche-panier .single_add_to_cart_button { max-width: none; }
}
/* Produits associés : pas de section vide quand la catégorie n'a pas d'autre pièce. */
.fiche-associes:not(:has(.wc-block-product)) { display: none; }
body .fiche-panier .quantity { margin: 0; }
/* En-tête : icônes Compte et Panier ajoutées par WooCommerce (blocs accrochés).
   Sur téléphone : logo réduit, barre resserrée, bouton menu en dernier. */
.entete .wp-block-woocommerce-customer-account a,
.entete .wc-block-mini-cart__button { color: var(--blanc); }
@media (max-width: 760px) {
  body .entete .barre { gap: 4px; }
  body .entete .wp-block-site-logo { margin-right: auto; }
  body .entete .wp-block-site-logo img { height: 84px; }
  .entete .menu { order: 3; margin-left: 4px; }
  .entete .wc-block-mini-cart__button, .entete .wc-block-customer-account__link { padding: 8px; }
}
.compat-remarque { margin: -16px 0 24px; padding: 10px 14px; border-left: 3px solid var(--orange); background: var(--blanc); border-radius: 0 8px 8px 0; font-size: 14px; color: var(--gris); }

/* --- En-tête : bande boutique (recherche par référence, compte, panier) --- */
.bande-boutique { background: rgba(0, 0, 0, .24); border-top: 1px solid rgba(255, 255, 255, .08); }
body .wp-site-blocks .barre-boutique { display: flex; align-items: center; gap: 28px; height: 76px; }
body .wp-site-blocks .recherche-piece { flex: 1; margin: 0; }
.recherche-piece .wp-block-search__inside-wrapper {
  display: flex; gap: 4px; padding: 4px; border: 0; border-radius: 8px; background: var(--blanc);
}
.recherche-piece .wp-block-search__inside-wrapper:focus-within { outline: 2px solid var(--orange); outline-offset: 2px; }
body .recherche-piece .wp-block-search__input {
  flex: 1; min-width: 0; height: 44px; margin: 0; padding: 0 12px 0 44px; border: 0; border-radius: 6px;
  font: 15px var(--sans); color: var(--noir);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A7470' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") 14px center / 20px no-repeat;
}
.recherche-piece .wp-block-search__input:focus { outline: none; }
.recherche-piece .wp-block-search__input::placeholder { color: #8A847F; }
body .recherche-piece .wp-block-search__button {
  margin: 0; height: 44px; padding: 0 24px; border: 0; border-radius: 6px;
  background: var(--orange); color: var(--blanc); font: 500 15px var(--sans); cursor: pointer; transition: background .2s;
}
body .recherche-piece .wp-block-search__button:hover { background: var(--orange-fonce); }
.entete-compte a { display: flex; align-items: center; gap: 8px; white-space: nowrap; font-size: 15px; color: rgba(255, 255, 255, .9); }
.entete-compte a:hover { color: var(--blanc); }
body .entete-panier .wc-block-mini-cart__button {
  display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 20px; border-radius: 8px;
  background: var(--orange); color: var(--blanc); font: 600 15px var(--sans); transition: background .2s;
}
body .entete-panier .wc-block-mini-cart__button:hover { background: var(--orange-fonce); opacity: 1; }
.entete-panier .wc-block-mini-cart__button::before { content: "Panier"; }
.entete-panier .wc-block-mini-cart__amount { display: inline; font-weight: 500; opacity: .9; }
.entete-panier .wc-block-mini-cart__badge { background: var(--blanc) !important; color: var(--orange) !important; border: 0; font-weight: 700; }
/* La bande s'ajoute à la hauteur de l'en-tête posé sur les héros. */
.hero { padding-top: 272px; }
@media (max-width: 760px) {
  .hero { padding-top: 164px; }
  body .entete .barre { height: 100px; }
  body .wp-site-blocks .barre-boutique { height: 64px; gap: 8px; }
  body .recherche-piece .wp-block-search__input { padding-left: 38px; background-position: 10px center; font-size: 14px; }
  body .recherche-piece .wp-block-search__button { padding: 0 12px; font-size: 0; width: 44px;
    background: var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") center / 20px no-repeat; }
  .entete-compte .wc-block-customer-account__label, .entete-compte a > span:not([class*="icon"]) { display: none; }
  body .entete-panier .wc-block-mini-cart__button { height: 44px; padding: 0 10px; }
  .entete-panier .wc-block-mini-cart__button::before, .entete-panier .wc-block-mini-cart__amount { display: none; }
}
body .wp-site-blocks .recherche-piece, .recherche-piece .wp-block-search__inside-wrapper { min-width: 0; }
@media (max-width: 760px) { .entete-panier .wc-block-mini-cart__tax-label { display: none; } }

/* --- Bonus réparation ------------------------------------------------------ */
body .wp-site-blocks .bareme { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 2px; }
.bareme li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border-bottom: 1px dashed #E4DED6; font-size: 15px; color: #5E5955; }
.bareme li:last-child { border-bottom: 0; }
.bareme strong { flex: none; font-size: 17px; font-weight: 600; color: var(--noir); }
body .wp-site-blocks .note-bareme { margin-top: 24px; padding: 16px 20px; border: 0; border-left: 3px solid var(--orange); border-radius: 0 12px 12px 0; background: var(--creme); font-size: 15px; color: var(--gris); }
body .wp-site-blocks .titre-conditions { margin: 64px 0 20px; font-size: 26px; font-weight: 600; }
body .wp-site-blocks .liste-conditions { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 32px; }
.liste-conditions li { position: relative; padding: 18px 20px 18px 52px; border-radius: 12px; background: var(--blanc); font-size: 15px; color: #5E5955; }
.liste-conditions li::before {
  content: ""; position: absolute; left: 22px; top: 23px; width: 13px; height: 7px;
  border-left: 2px solid var(--orange); border-bottom: 2px solid var(--orange); transform: rotate(-45deg);
}
@media (max-width: 760px) { body .wp-site-blocks .liste-conditions { grid-template-columns: 1fr; } }
.bandeau.bandeau-bonus { margin-top: 48px; }
body .wp-site-blocks .grille-infos + .bandeau { margin-top: 32px; }
@media (min-width: 900px) { .bandeau .wp-block-buttons { flex-wrap: nowrap; } }

/* Logo QualiRépar (page Bonus réparation, bandeaux) et éco-organismes */
.tete-label { max-width: 520px; }
body .wp-site-blocks .tete-label .logo-label { margin: 0 0 24px; }
.logo-label img { width: 200px; height: auto; border-radius: 12px; }
body .wp-site-blocks .bandeau-bonus .logo-label { flex: none; margin: 0; }
.bandeau-bonus .logo-label img { width: 150px; border-radius: 10px; }
body .wp-site-blocks .partenaires { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 48px; padding: 24px 32px; border-radius: 16px; background: var(--blanc); }
body .wp-site-blocks .partenaires-titre, body .wp-site-blocks .partenaires-nom { margin: 0; font-size: 15px; font-weight: 500; color: #5E5955; }
body .wp-site-blocks .partenaires-nom { font-size: 22px; font-weight: 600; color: var(--noir); }
/* Zone de protection du logo ecosystem (charte) : marge libre autour du bloc-logo. */
body .wp-site-blocks .logo-partenaire { margin: 0; padding: 12px; }
.logo-partenaire img { width: 190px; height: auto; }
@media (max-width: 760px) {
  .bandeau.bandeau-bonus { flex-direction: column; align-items: flex-start; }
  .logo-label img { width: 160px; }
}

/* --- Commande : récapitulatif et confirmation ------------------------------ */
/* Le récapitulatif reprenait le début de la description (liste d'appareils compatibles). */
.wc-block-components-order-summary-item .wc-block-components-product-metadata__description,
.wc-block-cart-item__product .wc-block-components-product-metadata__description { display: none; }
.commande-confirmee { padding-bottom: 96px; }
body .wp-site-blocks .commande-confirmee .wc-block-order-confirmation-status h1 { margin: 0 0 8px; font-size: 40px; line-height: 1.2; font-weight: 600; letter-spacing: -0.015em; }
body .wp-site-blocks .commande-confirmee .wc-block-order-confirmation-status p { font-size: 18px; color: #5E5955; }
body .wp-site-blocks .commande-confirmee .wc-block-order-confirmation-summary { margin: 32px 0; padding: 24px 28px; border-radius: 16px; background: var(--creme); }
body .wp-site-blocks .commande-confirmee .wc-block-order-confirmation-summary ul { display: flex; flex-wrap: wrap; gap: 12px 40px; margin: 0; padding: 0; list-style: none; }
body .wp-site-blocks .commande-confirmee .wc-block-order-confirmation-additional-information { margin: 0 0 40px; padding: 20px 24px; border-left: 3px solid var(--orange); border-radius: 0 12px 12px 0; background: var(--creme); font-size: 16px; }
body .wp-site-blocks .commande-confirmee h2, body .wp-site-blocks .commande-confirmee h3 { margin: 40px 0 16px; font-size: 24px; font-weight: 600; }
.commande-confirmee .wc-block-order-confirmation-totals table { width: 100%; border-collapse: collapse; font-size: 15px; }
.commande-confirmee .wc-block-order-confirmation-totals th, .commande-confirmee .wc-block-order-confirmation-totals td { padding: 12px 0; border-bottom: 1px solid #EEEAE5; text-align: left; }
.commande-confirmee .wc-block-order-confirmation-totals td:last-child, .commande-confirmee .wc-block-order-confirmation-totals th:last-child { text-align: right; }
body .wp-site-blocks .commande-aide { margin-top: 40px; font-size: 15px; color: #5E5955; }
.commande-aide a { color: var(--orange); }

/* WhatsApp (inc/whatsapp.php) : bouton flottant et lien des fiches produit. */
.bouton-whatsapp { position: fixed; right: 20px; bottom: 20px; z-index: 900; display: flex; align-items: center; gap: 10px; padding: 12px 18px 12px 14px; border-radius: 999px; background: #0B7A5E; color: #fff; font-size: 14px; line-height: 1.3; text-decoration: none; box-shadow: 0 6px 20px rgba(0, 0, 0, .22); transition: background .2s, transform .2s; }
.bouton-whatsapp:hover, .bouton-whatsapp:focus-visible { background: #08664E; color: #fff; transform: translateY(-2px); }
.bouton-whatsapp svg { flex: none; width: 26px; height: 26px; }
.bouton-whatsapp strong { display: block; font-weight: 600; }
@media (max-width: 600px) {
  .bouton-whatsapp { right: 16px; bottom: 16px; padding: 14px; }
  .bouton-whatsapp span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media print { .bouton-whatsapp { display: none; } }
.fiche-whatsapp { margin: 18px 0 0; font-size: 14px; line-height: 1.4; }
.fiche-whatsapp a { display: inline-flex; align-items: center; gap: 10px; color: #0B7A5E; text-decoration: none; }
.fiche-whatsapp a:hover strong { text-decoration: underline; }
.fiche-whatsapp svg { flex: none; width: 24px; height: 24px; }
.fiche-whatsapp strong { font-weight: 600; }
.fiche-whatsapp small { display: block; margin: 4px 0 0 34px; color: #6B6460; font-size: 12px; }

/* Appareil sous garantie (inc/garantie.php) : choix de la marque, vers le SAV du fabricant. */
.sav-garantie { margin-top: 28px; }
.sav-garantie label { display: block; margin-bottom: 8px; font-weight: 600; font-size: 15px; }
.sav-garantie-ligne { display: flex; flex-wrap: wrap; gap: 12px; }
.sav-garantie select { flex: 1 1 220px; min-height: 52px; padding: 0 14px; border: 1px solid var(--gris-clair); border-radius: 8px; background: var(--blanc); color: var(--noir); font: inherit; font-size: 15px; }
.sav-garantie button { flex: 0 0 auto; min-height: 52px; padding: 0 26px; border: 0; border-radius: 8px; background: var(--orange); color: var(--blanc); font: inherit; font-weight: 500; font-size: 16px; cursor: pointer; }
.sav-garantie button:hover, .sav-garantie button:focus-visible { background: var(--orange-fonce); }
.sav-garantie-note { margin: 12px 0 0; font-size: 13px; line-height: 1.5; color: #6B6460; }

/* Listes des formulaires : le texte ne passe plus sous la flèche (« Votre appareil est-il sous garantie ? »). */
.formulaire select { padding-right: 44px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

/* En-tête (v7) : partie haute sombre aux angles inférieurs arrondis, bande de
   recherche claire comme les cartes des étapes (crème). */
.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks:not(:has(.hero)) > header.wp-block-template-part { background: var(--creme); }
.entete-haut {
  border-radius: 0 0 28px 28px;
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(var(--bordeaux-clair), .55), transparent 70%),
    linear-gradient(160deg, #3A3233 0%, #3B2B30 60%, #4A2333 100%);
}
.bande-boutique { background: var(--creme); border-top: 0; color: var(--noir); }
.recherche-piece .wp-block-search__inside-wrapper { box-shadow: 0 0 0 1px #E2DCD5, 0 2px 8px rgba(56, 48, 49, .06); }
.entete .bande-boutique .wp-block-woocommerce-customer-account a,
.entete-compte a { color: var(--noir); }
.entete-compte a:hover { color: var(--orange); }
@media (max-width: 760px) { .entete-haut { border-radius: 0 0 20px 20px; } }
/* Bandeau sombre sous la bande de recherche : angles supérieurs arrondis,
   détachés sur le crème de la bande (le fond crème prolonge l'en-tête). */
body .wp-site-blocks .hero { margin-top: 272px; padding-top: 0; border-radius: 28px 28px 0 0; }
body:has(.hero) .wp-site-blocks { background: linear-gradient(var(--creme) 0 320px, var(--blanc) 320px); }
@media (max-width: 760px) {
  body .wp-site-blocks .hero { margin-top: 164px; padding-top: 0; border-radius: 20px 20px 0 0; }
}

/* Zones sombres pleine largeur : angles arrondis. Les sections crème voisines
   prolongent leur fond sous les angles (ombre portée), pour que le coin ne
   laisse pas apparaître de blanc entre une section crème et une zone sombre. */
body .wp-site-blocks .hero { border-radius: 28px; }
.pieces, .section-sombre { border-radius: 28px; }
.pied { border-radius: 28px 28px 0 0; }
.hero, .pieces, .section-sombre, .wp-site-blocks > footer.wp-block-template-part { position: relative; z-index: 1; }
.section-creme:has(+ :is(.hero, .pieces, .section-sombre)) { box-shadow: 0 28px 0 var(--creme); }
:is(.hero, .pieces, .section-sombre) + .section-creme { box-shadow: 0 -28px 0 var(--creme); }
:is(.hero, .pieces, .section-sombre) + .section-creme:has(+ :is(.hero, .pieces, .section-sombre)) { box-shadow: 0 -28px 0 var(--creme), 0 28px 0 var(--creme); }
.wp-block-post-content > .section-creme:last-child { box-shadow: 0 28px 0 var(--creme); }
:is(.hero, .pieces, .section-sombre) + .section-creme:last-child { box-shadow: 0 -28px 0 var(--creme), 0 28px 0 var(--creme); }
@media (max-width: 760px) {
  body .wp-site-blocks .hero, .pieces, .section-sombre { border-radius: 20px; }
  .pied { border-radius: 20px 20px 0 0; }
}

/* Fiche produit : introduction de la description (inc/boutique.php, adam_intro_fiche). */
.fiche-intro { max-width: 760px; margin: 0 0 24px; font-size: 16px; line-height: 1.6; color: var(--noir); }
.fiche-intro a { color: var(--orange); }

/* Fiche produit : bouton « Notice de montage (PDF) » dans la description. */
.fiche-texte .fiche-notice { margin: 20px 0; }
.fiche-texte .bouton-notice {
  display: inline-flex; align-items: center; gap: 14px; padding: 14px 20px 14px 16px;
  border: 1px solid #E2DCD5; border-radius: 10px; background: var(--blanc); color: var(--noir);
  text-decoration: none; box-shadow: 0 2px 8px rgba(56, 48, 49, .06); transition: border-color .2s, box-shadow .2s;
}
.fiche-texte .bouton-notice:hover, .fiche-texte .bouton-notice:focus-visible { border-color: var(--orange); box-shadow: 0 4px 14px rgba(226, 52, 47, .15); }
.bouton-notice::before {
  content: "PDF"; flex: none; display: grid; place-items: center; width: 44px; height: 52px; border-radius: 6px;
  background: var(--orange); color: var(--blanc); font: 700 13px/1 var(--sans); letter-spacing: .04em;
}
.bouton-notice strong { display: block; font-size: 16px; font-weight: 600; color: var(--noir); }
.bouton-notice span { display: block; font-size: 13px; color: #6B6460; }
.bouton-notice:hover strong { color: var(--orange); }

/* Bouton « Afficher les N modèles » : caché tant que la liste est courte (attribut hidden). */
.fiche-compat .compat-plus[hidden] { display: none !important; }

/* Vignettes des listes : cadre carré fixe, pour qu'une photo absente (image cassée) n'étire jamais toute la ligne. */
.wc-block-product .wc-block-components-product-image { aspect-ratio: 1; overflow: hidden; }
.wc-block-product .wc-block-components-product-image a { display: block; height: 100%; }
.wc-block-product .wc-block-components-product-image img { width: 100%; height: 100% !important; object-fit: contain; }

/* ---------- Accueil : les 10 pièces les plus recherchées (cartes qui se retournent) ---------- */
.recherchees { background: var(--blanc); padding: 64px 0 56px; }
.recherchees .titre-section { margin-bottom: 12px; max-width: 760px; }
.recherchees-intro { color: #5E5955; margin: 0 0 32px; }
.recherchees-grille { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.carte-piece { position: relative; height: 290px; perspective: 1000px; cursor: pointer; outline: none; }
.carte-face, .carte-dos {
  position: absolute; inset: 0; border-radius: 18px; padding: 18px; backface-visibility: hidden;
  display: flex; flex-direction: column; transition: transform .55s ease;
}
.carte-face { background: var(--creme); align-items: center; text-align: center; }
.carte-face img { width: 100%; height: 160px; object-fit: contain; mix-blend-mode: multiply; margin-bottom: 12px; }
.carte-appareil { font-size: 13px; color: #6B6460; }
.carte-face strong { font-size: 17px; font-weight: 600; line-height: 1.25; margin-top: 2px; }
.carte-face::after { content: "Ce qu’il vous faut ↻"; margin-top: auto; font-size: 12px; color: var(--orange); font-weight: 600; }
.carte-dos { background: var(--noir); color: var(--blanc); transform: rotateY(180deg); }
.carte-besoin { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #F3A6A3; }
.carte-dos p { font-size: 14px; line-height: 1.45; margin: 10px 0 0; }
.carte-dos a { margin-top: auto; align-self: flex-start; background: var(--orange); color: var(--blanc); text-decoration: none; font-size: 14px; font-weight: 600; padding: 9px 16px; border-radius: 999px; }
.carte-dos a:hover { background: var(--orange-fonce); }
.carte-piece:hover .carte-face, .carte-piece:focus-within .carte-face { transform: rotateY(-180deg); }
.carte-piece:hover .carte-dos, .carte-piece:focus-within .carte-dos { transform: rotateY(0); }
.carte-piece:focus-visible { box-shadow: 0 0 0 3px var(--orange); border-radius: 18px; }
.recherchees-aide { margin: 28px 0 0; color: #5E5955; }
.recherchees-aide a { color: var(--orange); font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .carte-face, .carte-dos { transition: none; } }
@media (max-width: 1024px) { .recherchees-grille { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) {
  .recherchees { padding: 44px 0 40px; }
  .recherchees-grille { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; gap: 12px; padding-bottom: 8px; margin-inline: -16px; padding-inline: 16px; }
  .carte-piece { flex: 0 0 72%; scroll-snap-align: start; height: 300px; }
}

/* Bandeau des marques, déplacé plus bas : une seule ligne qui défile, plus discrète. */
.marques-compactes .rangee-marques { display: flex; overflow-x: auto; gap: 10px; padding: 16px; margin-block: 0 56px; scroll-snap-type: x proximity; }
.marques-compactes .rangee-marques .marque { flex: 0 0 120px; height: 52px; scroll-snap-align: start; }
.marques-compactes .tete-marques { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin: 48px 0 14px; }
.marques-compactes .tete-marques h2 { font-size: 22px; font-weight: 600; margin: 0; }
.marques-compactes .tete-marques a { color: var(--orange); font-weight: 600; text-decoration: none; white-space: nowrap; }

/* ---------- Accueil : haut de page tourné vers la vente de pièces (recherche + encart réparation) ---------- */
.hero-pieces { padding: 0 0 48px; }
.hero-pieces-grille { display: grid; grid-template-columns: 1.6fr 1fr; gap: 40px; align-items: center; padding-top: 48px; }
.hero-pieces .titre-hero { margin: 0 0 18px; max-width: 640px; }
.hero-pieces .accroche { max-width: 600px; margin: 0 0 26px; }
.hero-recherche { display: flex; gap: 8px; background: var(--blanc); border-radius: 999px; padding: 6px; max-width: 640px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.hero-recherche input[type="search"] { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: 16px; padding: 12px 18px; color: var(--noir); outline: none; }
.hero-recherche button { border: 0; border-radius: 999px; background: var(--orange); color: var(--blanc); font: inherit; font-weight: 600; font-size: 16px; padding: 12px 24px; cursor: pointer; white-space: nowrap; }
.hero-recherche button:hover { background: var(--orange-fonce); }
.hero-recherche:focus-within { box-shadow: 0 0 0 3px rgba(226, 52, 47, .55), 0 10px 30px rgba(0, 0, 0, .25); }
.hero-atouts { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 14px; color: rgba(255, 255, 255, .85); }
.hero-atouts li::before { content: "✓"; color: #F3A6A3; font-weight: 700; margin-right: 6px; }
.hero-reparation { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); border-radius: 20px; overflow: hidden; }
.hero-reparation img { display: block; width: 100%; height: 170px; object-fit: cover; object-position: 50% 40%; filter: saturate(.85) sepia(.12); }
.hero-reparation-corps { padding: 18px 20px 22px; }
.hero-reparation-titre { font-size: 20px; font-weight: 600; margin: 0 0 8px; }
.hero-reparation-corps p { font-size: 14px; line-height: 1.5; color: rgba(255, 255, 255, .82); margin: 0 0 16px; }
.hero-reparation-corps p.hero-reparation-titre { color: var(--blanc); font-size: 20px; }
.hero-reparation .bouton { display: inline-block; }
.hero-tel { display: inline-block; margin-left: 14px; color: var(--blanc); font-weight: 600; text-decoration: none; white-space: nowrap; }
.hero-tel::before { content: "☎ "; }
@media (max-width: 1024px) { .hero-pieces-grille { grid-template-columns: 1fr; } .hero-reparation { display: grid; grid-template-columns: 220px 1fr; } .hero-reparation img { height: 100%; } }
@media (max-width: 760px) {
  .hero-pieces { padding-bottom: 32px; }
  .hero-pieces-grille { padding-top: 32px; gap: 24px; }
  .hero-recherche { flex-direction: column; border-radius: 18px; }
  .hero-recherche button { width: 100%; }
  .hero-reparation { display: block; }
  .hero-reparation img { height: 140px; }
}
.hero-recherche .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero-reparation .bouton { background: var(--orange); color: var(--blanc); border-radius: 999px; padding: 11px 20px; font-weight: 600; text-decoration: none; }
.hero-reparation .bouton:hover { background: var(--orange-fonce); }
.hero-pieces-grille > * { min-width: 0; }
@media (max-width: 760px) { .hero-pieces .titre-hero { overflow-wrap: anywhere; } .hero-recherche input[type="search"] { width: 100%; } }
.hero-pieces .titre-hero em { white-space: normal; }

/* Invitation à écrire plutôt qu'appeler (on ne peut pas répondre à tous les appels). */
.note-appels { display: block; font-size: 13px; line-height: 1.45; opacity: .85; margin-top: 6px; font-weight: 400; }
.note-appels a { color: inherit; text-decoration: underline; font-weight: 600; }
p.note-appels { margin: 10px 0 0; }
.hero-reparation-corps p.note-appels { margin: 12px 0 0; font-size: 13px; }

/* Pages « Pannes courantes » : lien vers les pièces sous chaque cause. */
.lien-pieces a { color: var(--orange-fonce); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.lien-pieces a:hover { color: var(--orange); }

/* Disponibilité : pièce sur commande (couleur neutre, pas le vert du stock) et précision sous le délai. */
body .wp-site-blocks .delai-livraison span { display: flex; flex-direction: column; gap: 2px; }
body .wp-site-blocks .delai-livraison small { font-size: 13px; font-weight: 400; opacity: .85; }
body .wp-site-blocks .delai-livraison.delai-commande { background: #F6F1EA; color: #6B4A1F; }
body .wp-site-blocks .delai-carte.delai-commande { color: #6B4A1F; }

/* « Cette pièce existe aussi en… » : original et adaptable d'une même pièce, sous le délai. */
body .wp-site-blocks .autres-versions { margin: -12px 0 28px; padding: 12px 16px; border: 1px solid #E6DED3; border-radius: 8px; font-size: 14px; }
body .wp-site-blocks .autres-versions p { margin: 0 0 6px; font-weight: 600; }
body .wp-site-blocks .autres-versions ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
body .wp-site-blocks .autres-versions li { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
body .wp-site-blocks .autres-versions li strong { color: #2B2425; }
body .wp-site-blocks .autres-versions li span { margin-left: auto; }
body .wp-site-blocks .autres-versions a { color: var(--orange); font-weight: 500; }
body .wp-site-blocks .autres-versions span { color: #6B6460; }
