/* ============================================================
   LA POSTALE PHILATÉLIE — nouveau site (protótipo)
   Paleta: navy #16233d · dourado #b3924f · creme #faf7f2
   Pensado para leitura confortável (público 60+)
   ============================================================ */

:root {
  /* refonte N&B : ex-navy → charbon, ex-or → gris (textes compatibles avec le noir) */
  --navy: #1c1c1c;
  --navy-light: #333333;
  --gold: #767676;
  --gold-dark: #555555;
  --cream: #f2f2f2;          /* ex-beige → gris clair (refonte N&B) */
  --noir: #111111;
  --white: #ffffff;
  --text: #141414;
  --text-soft: #2a2d31;
  --line: #e2e2e2;
  --danger: #a33030;
  --fs-base: 19px;          /* fonte grande por padrão */
}

html { scroll-behavior: smooth; scroll-padding-top: 96px; }
html[data-fontsize="large"]  { --fs-base: 22px; }
html[data-fontsize="xlarge"] { --fs-base: 25px; }

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: "Lato", "Segoe UI", Arial, sans-serif;
  font-size: var(--fs-base);
  line-height: 1.65;
  color: var(--text);
  background: var(--white);
}

h1, h2, h3 {
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  color: var(--navy);
  line-height: 1.22;
  font-weight: 600;
  letter-spacing: .015em;
}

img { max-width: 100%; display: block; }

a { color: var(--navy); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--noir);
  outline-offset: 2px;
}

.container { max-width: 1400px; margin: 0 auto; padding: 0 24px; }

/* ---------- Barre utilitaire (langue + taille du texte) ---------- */
/* (Ancienne barre utilitaire supprimée — langue passée dans l'en-tête,
   taille du texte + version classique déplacées dans le pied de page) */

.btn-chip {
  background: transparent; color: #333;
  border: 1px solid #b9b9b9;
  border-radius: 2px; padding: 4px 12px;
  font-size: 1em; cursor: pointer; min-height: 34px;
}
.btn-chip:hover { background: rgba(0,0,0,.06); }
.btn-chip[aria-pressed="true"] { background: var(--noir); border-color: var(--noir); color: #fff; font-weight: 700; }

.btn-taille { min-height: 30px; padding: 2px 10px; }

/* ============================================================
   En-tête — barre blanche façon Sotheby's : logo à gauche,
   menus à sa droite, langue + icônes à l'extrémité droite
   ============================================================ */
.site-header {
  background: var(--white);
  border-bottom: 1px solid #e2e2e2;
  position: sticky; top: 0; z-index: 200;
  transition: box-shadow .2s ease;
}
.site-header.scrolled { box-shadow: 0 6px 22px rgba(0, 0, 0, .12); }
.header-inner {
  display: flex;
  align-items: center;
  gap: 38px;                 /* ~1 cm entre le logo et les menus */
  min-height: 74px;          /* compact : la bande FR/EN au-dessus prend le reste */
  padding: 2px 0 12px;
}

/* FR / EN détaché au coin supérieur droit (façon Roumet),
   aligné sur le bord droit de la photo du carrousel (1440px centré) */
.hd-sur { display: flex; justify-content: flex-end; max-width: 1440px; padding: 8px 0 0; }
.hd-langue { display: inline-flex; align-items: center; gap: 5px; }
.hd-langue button {
  background: none; border: none; cursor: pointer;
  color: rgba(0, 0, 0, .45);
  font-family: "Lato", Arial, sans-serif;
  font-size: .66em; font-weight: 700; letter-spacing: .14em;
  padding: 2px 1px; transition: color .15s ease;
  text-decoration: none; text-underline-offset: 4px;
}
.hd-langue-sep { color: rgba(0, 0, 0, .35); font-size: .66em; }
.hd-langue button:hover { color: rgba(0, 0, 0, .75); }
.hd-langue button[aria-pressed="true"] { color: var(--noir); text-decoration: underline; }

/* Liens de navigation */
.hd-nav { display: flex; align-items: center; gap: 38px; margin-left: 38px; }   /* gap ~1 cm entre les menus ; margin-left : +1 cm de la logo */
.hd-nav a {
  color: #1c1c1c;
  text-decoration: none;
  font-size: .76em; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
  white-space: nowrap;
  padding: 8px 0;
  border-bottom: 2px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}
.hd-nav a:hover { color: var(--noir); border-bottom-color: rgba(0, 0, 0, .3); }
.hd-nav a[aria-current="page"] { color: var(--noir); font-weight: 700; }  /* actif : gras, sans barre */

/* Logo (à gauche, version noire) */
.hd-logo { line-height: 0; display: block; flex: none; }
.hd-logo img { height: 48px; width: auto; display: block; filter: brightness(0); }  /* logo forcé en noir */

/* Groupe de droite : langue + icônes poussés à l'extrémité */
.hd-droite { display: flex; align-items: center; gap: 22px; margin-left: auto; }

/* Icônes (favoris + panier) */
.hd-icones { display: flex; align-items: center; gap: 18px; }
.hd-icone {
  position: relative; display: inline-flex;
  color: #1c1c1c;
  transition: color .15s ease, transform .15s ease;
}
.hd-icone:hover { color: var(--noir); }

/* Bouton hamburger (mobile) */
.hd-burger {
  display: none;
  flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 10px;
  background: none; border: none; cursor: pointer;
}
.hd-burger span {
  display: block; height: 2px; width: 100%;
  background: var(--noir); border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.hd-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hd-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hd-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Panneau de navigation mobile */
.hd-mobile {
  display: flex; flex-direction: column;
  background: var(--white);
  border-top: 1px solid var(--line);
}
.hd-mobile[hidden] { display: none; }
.hd-mobile a {
  color: var(--noir); text-decoration: none;
  padding: 15px 22px; font-size: .95em; letter-spacing: .05em;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
}
.hd-mobile a:hover { background: rgba(0, 0, 0, .04); color: var(--noir); }
.hd-mobile-langue {
  display: flex; gap: 8px; padding: 13px 22px;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
}
.hd-mobile-langue button {
  background: none; border: 1px solid rgba(0, 0, 0, .3); border-radius: 2px;
  color: rgba(0, 0, 0, .55); cursor: pointer;
  padding: 6px 16px; font-weight: 700; letter-spacing: .08em; font-size: .9em;
  transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.hd-mobile-langue button[aria-pressed="true"] {
  color: #fff; background: var(--noir); border-color: var(--noir);
}

/* En-tête : bascule en menu hamburger sur écrans étroits */
@media (max-width: 1160px) {
  .header-inner { gap: 14px; min-height: 64px; }
  .header-inner .hd-nav { display: none; }
  .hd-sur { display: none; }   /* mobile : la langue est dans le menu hamburger */
  .hd-burger { display: flex; }
  .hd-logo img { height: 38px; }
}

/* ---------- Panier flutuante único (ordres + boutique) ---------- */
.panier-flottant-wrap { position: fixed; top: 64px; right: 22px; z-index: 150; }
.panier-flottant {
  position: relative;
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--noir);
  color: #fff;
  border: 2px solid #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 26px rgba(22, 35, 61, .38);
  cursor: pointer; padding: 0; text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}
.panier-flottant:hover {
  transform: scale(1.08);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .5);
  color: #fff;
}
.panier-flottant .panier-badge { background: #fff; color: var(--noir); }
/* Menu que abre sob o botão */
.panier-menu {
  position: absolute; top: calc(100% + 10px); right: 0;
  min-width: 300px; background: #fff; border-radius: 2px;
  border: 1px solid var(--noir);
  box-shadow: 0 14px 38px rgba(0, 0, 0, .25);
  overflow: hidden;
}
.panier-menu-item {
  display: flex; align-items: center; gap: 12px;
  padding: 15px 18px; text-decoration: none;
  color: var(--navy); font-size: 1.05em; font-weight: 600; white-space: nowrap;
}
.panier-menu-item + .panier-menu-item { border-top: 1px solid #e6e6e6; }
.panier-menu-item:hover { background: #f2f2f2; }
.panier-menu-item svg { flex-shrink: 0; color: var(--gold-dark); }
.pm-lib { flex: 1 1 auto; }
.pm-nb {
  min-width: 28px; height: 28px; padding: 0 8px; border-radius: 14px;
  background: var(--navy); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .9em; font-weight: 700;
}
/* Bandeau cookies (information, une seule fois) */
.cookie-bandeau {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 400;
  display: flex; align-items: center; justify-content: center; gap: 22px;
  padding: 16px 22px;
  background: var(--navy); color: #f2f2f2;
  box-shadow: 0 -6px 22px rgba(0, 0, 0, .3);
}
.cookie-bandeau[hidden] { display: none; }
.cookie-bandeau p { margin: 0; max-width: 760px; font-size: 1em; line-height: 1.5; }
.cookie-bandeau a { color: #ddd; }
.cookie-bandeau .btn { flex-shrink: 0; }
@media (max-width: 720px) {
  .cookie-bandeau { flex-direction: column; gap: 12px; text-align: center; }
}

/* Títulos das seções da página panier unificada */
.panier-titre-section {
  margin: 34px 0 16px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  color: var(--navy);
}
.panier-titre-section:first-of-type { margin-top: 0; }
.panier-badge {
  position: absolute; top: -6px; right: -6px;
  min-width: 24px; height: 24px; padding: 0 6px;
  background: var(--noir); color: #fff;
  border-radius: 12px; font-size: .78em; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
/* (Ancien logo centré + .main-nav horizontale remplacés par la barre .hd-* ci-dessus) */

/* ---------- Héros ---------- */
/* Héros façon Sotheby's : photo pleine largeur, ratio 1440/685 (identique),
   encart noir texte + lien superposé en bas à droite */
.hero { position: relative; background: var(--white); padding: 0 0 30px; }
/* 22/09/2026 : le plafond à 1440px (letterboxing, marges blanches au-delà) a été retiré —
   sur écran large, il laissait de grandes bandes blanches de chaque côté et donnait
   l'impression que la photo était petite et décalée à gauche. Photo bord à bord désormais. */
.hero .hero-cadre { position: relative; padding: 0; }
.hero-vue {
  position: relative; overflow: hidden;
  /* largeur verrouillée à 100 % explicitement : certains navigateurs recalculent
     la largeur d'après le ratio quand la hauteur est plafonnée par max-height, ce
     qui décale la photo à gauche (elle devient plus étroite que .hero-cadre). En
     fixant width, le ratio ne peut plus jouer que sur la hauteur. */
  width: 100%;
  height: calc(100vw * 685 / 1440);   /* repli anciens navigateurs */
  /* 22/09/2026 (v2) : plafond = hauteur d'écran moins l'en-tête (74px de barre +
     ~30px de bandeau FR/EN, cf. .header-inner/.hd-sur ci-dessus), pour que le lien
     « En savoir plus » (ancré en bas de la photo) reste toujours visible sans avoir
     à faire défiler — quel que soit le rapport largeur/hauteur de l'écran, y compris
     avec l'échelle Windows à 125 %/150 % qui réduit la hauteur utile disponible. */
  max-height: calc(100vh - 104px);
}
@supports (aspect-ratio: 1) {
  .hero-vue { height: auto; aspect-ratio: 1440 / 685; max-height: calc(100vh - 104px); width: 100%; }
}
.hero img.hero-bg { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
/* carrousel: slides empilhados com fondu */
.hero img.hero-slide {
  position: absolute; inset: 0; height: 100%;
  opacity: 0; transition: opacity 1s ease;
}
.hero img.hero-slide:first-of-type { position: relative; height: 100%; }
.hero img.hero-slide.actif { opacity: 1; }
.hero-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  border: none; cursor: pointer; background: none; padding: 10px;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: color .15s ease, opacity .15s ease;
}
.hero-nav svg { width: 24px; height: 52px; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .55)); }
.hero-nav:hover { opacity: .75; }
.hero-prev { left: 20px; }
.hero-next { right: 20px; }
.hero-points {
  position: absolute; bottom: 16px; left: 0; right: 0; z-index: 3;
  display: flex; gap: 10px; justify-content: center;
}
.hero-point {
  width: 34px; height: 6px; border-radius: 2px;
  border: none; cursor: pointer;
  background: rgba(255, 255, 255, .45);
}
.hero-point.actif { background: var(--white); }
/* Encart : collé au bord bas de la photo, 24px de la droite, 448px, ~90% opaque
   (mesures et opacité identiques à Sotheby's, en noir) */
.hero-encart {
  position: absolute; right: 24px; bottom: 24px; z-index: 5;
  width: min(448px, 86vw);
  background: rgba(12, 12, 12, .72); color: #fff; text-decoration: none;
  padding: 28px 32px 26px;
  display: flex; flex-direction: column; gap: 14px;
}
.hero-encart-texte {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.22em; font-weight: 600; line-height: 1.35;
}
.hero-encart-lien {
  align-self: flex-start; padding-bottom: 4px;
  font-size: .68em; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  border-bottom: 1px solid rgba(255, 255, 255, .45);
  transition: border-color .15s ease;
}
.hero-encart:hover .hero-encart-lien { border-color: #fff; }
@media (max-width: 760px) {
  .hero { padding: 0 0 26px; }
  /* mobile façon Sotheby's : photo portrait pleine largeur (ratio 375/443),
     encart flottant DANS la photo, marges 16px — pas de plafond en vh ici, le
     ratio portrait est déjà pensé pour un écran de téléphone. */
  .hero-vue { height: calc(100vw * 443 / 375); max-height: none; }
  @supports (aspect-ratio: 1) {
    .hero-vue { height: auto; aspect-ratio: 375 / 443; max-height: none; }
  }
  .hero-encart {
    left: 16px; right: 16px; bottom: 48px; width: auto;
    padding: 20px 22px;
  }
  .hero-encart-texte { font-size: 1.05em; }
}

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 13px 30px;
  border-radius: 2px; border: 1px solid transparent;
  font-size: .82em; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none; cursor: pointer;
  font-family: inherit;
  transition: background .22s ease, color .22s ease, border-color .22s ease;
}
.btn-gold {
  background: #b3924f;
  color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .16);
}
.btn-gold:hover {
  background: var(--noir);
  color: #fff;
}
.btn-outline-light { background: rgba(255,255,255,.08); color: var(--white); border-color: rgba(255,255,255,.7); }
.btn-outline-light:hover { background: var(--white); color: var(--navy); border-color: var(--white); }
.btn-navy {
  background: #b3924f; color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
.btn-navy:hover {
  background: var(--noir); color: #fff;
}
.btn-outline-navy { background: transparent; color: var(--noir); border-color: var(--noir); }
.btn-outline-navy:hover { background: var(--noir); color: var(--white); }
.cat-menu a.cat-resultats { font-weight: 700; }
.cat-resultats .cat-fleche { color: var(--gold); font-size: .85em; }
.cat-resultats:hover .cat-fleche { color: var(--gold-dark); }

/* ---------- Bandeau vente en cours ---------- */
.sale-banner { background: var(--cream); border-bottom: 1px solid var(--line); }
.sale-banner .container {
  display: flex; align-items: center; justify-content: center; gap: 22px;
  padding: 18px 24px; flex-wrap: wrap; text-align: center;
}
.sale-banner .dot {
  width: 12px; height: 12px; border-radius: 50%; background: var(--danger);
  display: inline-block; flex: none;
}
.sale-banner strong { color: var(--navy); }

/* ---------- Sections ---------- */
.section { padding: 72px 0; }
.section-compact { padding: 44px 0; }
/* dernière section avant le pied de page : pas de padding-bas (la newsletter apporte l'espace) */
.section-compact:last-of-type { padding-bottom: 0; }
/* Deux boutons sous les lots à la une (Voir la vente + Feuilleter le catalogue) */
.lots-une-actions {
  display: flex; justify-content: center; flex-wrap: wrap;
  gap: 16px 20px; margin-top: 40px;
}
.section-compact .section-head { margin-bottom: 28px; }
.hero + .section { padding-top: 26px; }   /* « Que souhaitez-vous faire ? » proche du carrousel */
.section-alt { background: var(--cream); }
/* titres de section façon maison de vente : à gauche, sans filet souligné */
.section-head { text-align: left; max-width: none; margin: 0 0 36px; }
.section-head h2 { font-size: 2.2em; }
.section-head p { margin-top: 16px; color: var(--text-soft); }

/* ---------- Deux grandes cartes (Vente en cours / Expertise) ---------- */
.duo-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 28px; margin: 0 auto;
}
@media (max-width: 1000px) { .duo-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; } }
.duo-card {
  display: flex; flex-direction: column; align-items: flex-start;
  text-decoration: none;
}
.duo-img {
  width: 100%; aspect-ratio: 3 / 2; overflow: hidden;
  background: #f0f0f0;
}
.duo-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.duo-card:hover .duo-img img { transform: scale(1.04); }
/* bouton façon Sotheby's : contour noir, centré, MÊME taille pour les 4 (min-width commun) */
.duo-card .btn {
  text-transform: uppercase; pointer-events: none; margin-top: 18px; align-self: center;
  min-width: 230px;
  background: var(--white); color: var(--noir); border: 1px solid var(--noir);
  min-height: 46px; padding: 10px 18px; font-size: .74em; box-shadow: none;
}
.duo-card:hover .btn { background: var(--noir); color: #fff; }
@media (max-width: 760px) {
  .duo-grid { grid-template-columns: 1fr; gap: 34px; max-width: 460px; }
  .duo-card h3 { font-size: 1.8em; margin: 20px 0 18px; }
}

/* ---------- Grille de lots ---------- */
.lots-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 28px;
}

/* ---------- Carrossel "Lots à la une" (4 par vue au-delà de 1200 px, puis 3/2/1) ---------- */
.lots-carousel { position: relative; }
.lots-car-viewport { overflow: hidden; }
.lots-car-track {
  display: flex; gap: 28px; width: max-content;
  transition: transform .45s ease; will-change: transform;
}
.lots-car-track > .lot-card { flex: 0 0 auto; } /* largeur fixée en JS (4/3/2/1 par vue) */
.lots-car-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  cursor: pointer; padding: 8px 6px;
  border: none; background: none; color: var(--navy);
  display: flex; align-items: center; justify-content: center;
  transition: color .15s ease, opacity .15s ease;
}
.lots-car-nav svg { width: 16px; height: 36px; }
.lots-car-nav:hover { color: var(--gold); }
.lots-car-prev { left: -42px; }
.lots-car-next { right: -42px; }
.lots-car-nav[disabled] { opacity: .3; cursor: default; }
.lots-car-nav[disabled]:hover { color: var(--navy); }
@media (max-width: 900px) {
  /* cible tactile ≥44px pour le public senior */
  .lots-car-nav { padding: 14px 12px; }
  .lots-car-prev { left: -12px; } .lots-car-next { right: -12px; }
}
.lot-card {
  background: var(--white); border: 1px solid var(--line); border-radius: 2px;
  overflow: hidden; display: flex; flex-direction: column;
  position: relative;
  padding-bottom: 88px; /* espaço reservado para o botão/badge */
  transition: border-color .15s;
}
/* test : un peu de couleur au survol (dourado original, avant la refonte N&B) */
.lot-card:hover { border-color: #b3924f; }
/* Botão de compra/lance e badge Vendu: caixa de geometria FIXA na base do card */
.lot-card .lot-bid,
.lot-card .lot-vendu {
  position: absolute;
  bottom: 22px; left: 22px; right: 22px;
  height: 52px; margin: 0;
  overflow: hidden;
}
/* cards vitrine da home: sem botão, sem espaço reservado */
.lot-card-vitrine { padding-bottom: 12px; }
/* vitrine (accueil) : description toujours 2 lignes + prix ancré → même position partout */
.lot-card-vitrine .lot-desc { min-height: 2.6em; }
.lot-card-vitrine .lot-price { margin-top: auto; }
/* carte-invitation en fin de carrousel : « Envie d'en voir plus ? » → vente.php */
.lot-card-cta {
  justify-content: center; align-items: center; gap: 20px;
  padding: 24px; text-decoration: none;
}
.lot-card-cta .cta-titre {
  font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.5em; font-weight: 600;
  color: var(--noir); text-align: center; line-height: 1.25;
}
.lot-card-cta .btn {
  pointer-events: none;
  font-size: .7em; padding: 12px 18px; letter-spacing: .06em; white-space: nowrap;
}
.lot-card-cta:hover { text-decoration: none; }
.lot-card-cta:hover .btn { background: var(--noir); color: var(--white); }

.lot-photo {
  background: #f7f7f7; height: 240px;
  display: flex; align-items: center; justify-content: center;
  padding: 14px; overflow: hidden;
}
.lot-photo a {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%;
}
.lot-photo img {
  width: 100%; height: 100%;
  object-fit: contain;
  margin: 0 auto;
  transition: transform .35s ease;
}
/* affordance de clic : léger zoom de la photo au survol de la carte */
.lot-card:hover .lot-photo img { transform: scale(1.03); }
.lot-thumbs {
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 10px 14px 0;
}
.lot-thumb {
  width: 56px; height: 56px; padding: 3px;
  border: 2px solid #d9d9d9; border-radius: 2px;
  background: #ececec; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.lot-thumb img { width: 100%; height: 100%; object-fit: contain; }
.lot-thumb:hover { border-color: #b3924f; }
.lot-thumb.actif { border-color: var(--gold-dark); box-shadow: 0 0 0 2px rgba(0, 0, 0, .06); }
.lot-body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
/* n° du lot = métadonnée : discret, gris, plus petit que la description */
.lot-num { color: #6d6d6d; font-weight: 600; letter-spacing: .08em; font-size: .78em; text-transform: uppercase; }
/* n° du lot à gauche, qualité (** * (*) Obl) à droite, même police.
   TOUJOURS sur une seule ligne (le retour à la ligne désalignait les prix) :
   si ça déborde, le n° se tronque avec … ; la qualité reste entière. */
.lot-lien-num { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; white-space: nowrap; }
.lot-lien-num .lot-num:first-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.lot-qualite { flex: none; }
.lot-title { font-size: 1.05em; color: var(--navy); font-weight: 700; }
/* Description : 2 lignes max, sans « voir plus » (le texte complet est dans le pop-up du lot) */
.lot-desc {
  color: #141414; font-size: .88em; line-height: 1.28; letter-spacing: .01em; margin-bottom: 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* Cote : affichée sur tous les lots (« -- » si pas de valeur) → aligne le « Départ » */
.lot-cote {
  color: var(--text-soft); font-size: .88em; margin: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* description toujours sur 2 lignes en mosaïque → « Départ » à la même hauteur partout */
.vente-grille .lot-body > .lot-desc,
.bq-grille .lot-body > .lot-desc { min-height: 2.6em; }
.lot-price { margin-top: 0; display: flex; align-items: baseline; gap: 8px; }
.lot-price .amount { font-size: 1.05em; font-weight: 700; color: var(--navy); }
.lot-price .label { color: var(--text-soft); font-size: .85em; }
.lot-card .btn { margin: 0 22px 22px; }

/* Lot vendu — même boîte/police que le bouton « Acheter » (cantos 2px, poids 600) */
.lot-vendu {
  margin: 0 22px 22px;
  height: 52px;
  display: flex; align-items: center; justify-content: center;
  background: #f2f2f2; color: #333;
  border: 1px solid #d5d5d5; border-radius: 2px;
  font-weight: 600; letter-spacing: .05em; font-size: .88em;
  text-transform: none;
}

/* Enchère directe sur la carte — barre blanche à contour noir, UNIFIÉE
   (grilles vente/boutique, vue liste et fiche pop-up). Survol du bouton :
   toute la zone d'action s'inverse en noir. */
.lot-bid, .lot-bid input, .lot-bid .btn { box-sizing: border-box; }
.lot-bid {
  display: flex; gap: 0; margin: 0 22px 22px; align-items: stretch;
  min-height: 52px;
  border: 1px solid var(--noir); border-radius: 2px;
  overflow: hidden; background: var(--white);
  padding: 0;
}
/* form "Acheter" pur (sans champ visible) : le bouton porte lui-même le contour.
   .lot-bid-seul = classe posée côté PHP (l'ancien :has() écrasait la largeur — retiré). */
.lot-bid.lot-bid-seul {
  background: transparent; overflow: visible; border: none;
}
.lot-bid.lot-bid-seul .btn {
  flex: 1; border: 1px solid var(--noir); border-radius: 2px;
}
.lot-bid:focus-within { box-shadow: 0 0 0 3px rgba(0, 0, 0, .18); }
.lot-bid:hover { border-color: #b3924f; }
.lot-bid input {
  flex: 0 0 118px; min-width: 0; width: 118px;
  height: auto; align-self: stretch; margin: 0;
  font-size: .95em; padding: 0 10px;
  border: 0; border-right: 1px solid var(--noir); border-radius: 0; background: #fff;
  font-family: inherit;
  text-align: center;
}
.lot-bid input::placeholder { color: #333333; }
.lot-bid input:focus { outline: none; background: #f7f7f7; }
.lot-bid .bid-sep { display: none; }
.lot-bid .btn {
  flex: 1 1 auto;
  align-self: stretch;
  height: auto; min-height: 0;
  margin: 0;                      /* anula o margin herdado de .lot-card .btn */
  padding: 0 10px;
  border: 0; border-radius: 0;
  background: var(--white); color: var(--noir);
  font-size: .88em; line-height: 1;
  text-transform: none; letter-spacing: .05em; font-weight: 600;
  white-space: nowrap;
  box-shadow: none; text-shadow: none;
}
.lot-bid .btn:hover { transform: none; background: #b3924f; color: #fff; border-color: #b3924f; }

/* ---------- Recherche de lot ---------- */
.lot-search {
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
  margin: 0 auto 40px; max-width: 640px;
}
.lot-search input {
  flex: 1; min-width: 240px; min-height: 46px;
  font-size: .95em; padding: 8px 16px;
  border: 1px solid #c9c9c9; border-radius: 2px;
  font-family: inherit;
}
.lot-search input:focus { outline: none; border-color: var(--noir); }
.lot-search .btn { min-height: 46px; padding: 8px 22px; font-size: .76em; }

/* ---------- La Maison ---------- */
.maison-split {
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: stretch;
}
/* la photo remplit exactement la hauteur du texte en face (object-fit cover) */
.maison-photo {
  position: relative; border-radius: 2px; overflow: hidden; min-height: 0;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .15);
}
.maison-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.maison-split h2 { font-size: 1.8em; margin-bottom: 18px; }
.maison-split p { margin-bottom: 14px; color: var(--text-soft); text-align: justify; hyphens: auto; }
.maison-split .btn { margin-top: 10px; }

/* ---------- FAQ (accordéon) ---------- */
.faq { display: grid; gap: 14px; }
.faq-item {
  border: 1px solid var(--line); border-radius: 2px; background: var(--white);
  overflow: hidden; transition: box-shadow .18s ease, border-color .18s ease;
}
.faq-item[open] { box-shadow: 0 10px 28px rgba(22, 35, 61, .09); border-color: #e0d6c2; }
.faq-item summary {
  list-style: none; cursor: pointer; user-select: none;
  padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; gap: 18px;
  font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.28em; font-weight: 600;
  color: var(--navy); line-height: 1.3;
  transition: color .15s ease;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--gold-dark); }
.faq-item summary::after {
  content: "+"; flex: none; width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid var(--gold); color: var(--gold-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15em; line-height: 1; font-family: "Lato", sans-serif;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.faq-item[open] summary::after {
  content: "\2013"; background: var(--gold); color: #fff; transform: rotate(180deg);
}
.faq-rep { padding: 2px 24px 22px; color: var(--text-soft); line-height: 1.75; }
.faq-rep p { margin-bottom: 12px; }
.faq-rep p:last-child { margin-bottom: 0; }
.faq-rep ul { margin: 4px 0 12px 20px; display: grid; gap: 7px; }
.faq-rep strong { color: var(--navy); }
.faq-rep a { color: var(--gold-dark); font-weight: 600; }

/* Modification du montant d'un ordre (espace client) */
.ordre-modif-form { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.ordre-montant {
  width: 92px; height: 38px; padding: 0 8px; text-align: right; background: #fff;
  border: 1px solid #cfcfcf; border-radius: 2px; font-family: inherit; font-size: .95em;
}
.ordre-montant:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(0, 0, 0, .15); }
.ordre-euro { color: var(--text-soft); }
.ordre-btn { padding: 4px 12px; min-height: 0; }

.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 22px; }
.gallery figure { border-radius: 2px; overflow: hidden; position: relative; }
.gallery img { height: 260px; width: 100%; object-fit: cover; }
.gallery figcaption {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(transparent, rgba(22,35,61,.85));
  color: var(--white); padding: 26px 18px 14px; font-size: .9em;
}

/* ---------- Étapes / réassurance ---------- */
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 30px; counter-reset: step; }
.step { text-align: center; padding: 0 10px; }
.step .num {
  width: 58px; height: 58px; margin: 0 auto 14px;
  border-radius: 50%; border: 2px solid var(--gold);
  color: var(--navy); font-weight: 700; font-size: 1.3em;
  display: flex; align-items: center; justify-content: center;
  font-family: "Cormorant Garamond", Georgia, serif;
}
.step h3 {
  font-family: "Lato", "Segoe UI", Arial, sans-serif;
  font-size: 1em; font-weight: 400; color: var(--text);
  margin-bottom: 2px; display: inline;
}
.step h3::after { content: " "; }
.step p { color: var(--text-soft); font-size: 1em; display: inline; margin: 0; }

/* ---------- Tableaux (résultats) ---------- */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 2px; }
table.results { width: 100%; border-collapse: collapse; background: var(--white); }
table.results th, table.results td { padding: 16px 20px; text-align: left; }
table.results th {
  background: var(--navy); color: var(--white);
  font-size: .85em; letter-spacing: .06em; text-transform: uppercase;
}
table.results tr:nth-child(even) td { background: var(--cream); }
table.results td { border-top: 1px solid var(--line); }
.price-cell { font-weight: 700; color: var(--navy); white-space: nowrap; }

/* ---------- Formulaires ---------- */
/* Formulaires — allégés le 10/09/2026 (« plus fin et raffiné », décision Murilo).
   Avant : champs de 50 px, cartouche gris à 40 px de marge, et surtout un textarea forcé à
   130 px alors que les adresses sont en rows="2" — d'où le grand trou au milieu du formulaire.
   Le cadre est conservé (et non remplacé par un simple filet) : la limite du champ doit rester
   visible pour la clientèle âgée. On réduit la boîte, JAMAIS le texte : --fs-base reste à 19 px. */
.form-card {
  background: var(--white); border: 1px solid var(--line); border-radius: 0;
  padding: 28px 30px; max-width: 720px; margin: 0 auto;
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 26px; }
/* 22/09/2026 : .form-group en colonne flex + input(s) poussé(s) en bas (margin-top:auto).
   Avant, un libellé sur 2 lignes (ex. « Nouveau mot de passe (laisser vide pour ne pas
   changer) ») faisait démarrer son champ plus bas que celui du voisin de la même ligne
   (ex. « Pays », libellé court) : les deux cases n'étaient plus alignées horizontalement.
   La grille étire déjà les .form-group à la même hauteur (align-items:stretch, par
   défaut) ; margin-top:auto se sert de cette hauteur commune pour caler tous les champs
   sur la même ligne de base, quel que soit le nombre de lignes du libellé au-dessus. */
.form-group { margin-bottom: 16px; display: flex; flex-direction: column; }
.form-group > label {
  display: block; margin-bottom: 5px;
  font-size: .68em; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: #383838;
}
.form-group .hint { font-weight: 400; color: var(--text-soft); font-size: .85em; letter-spacing: 0; text-transform: none; }
/* cases à cocher et boutons radio exclus : ils n'ont rien à faire en width:100% / 40 px */
.form-group input:not([type="checkbox"]):not([type="radio"]),
.form-group select, .form-group textarea {
  width: 100%; min-height: 40px; font-size: .94em; font-family: inherit; color: var(--text);
  padding: 8px 12px; border: 1px solid #dcdcdc; border-radius: 0; background: var(--white);
  margin-top: auto;
}
/* pas de min-height : c'est l'attribut rows de chaque champ qui décide de la hauteur */
.form-group textarea { min-height: 0; line-height: 1.45; resize: vertical; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--noir); outline: none; }
/* bouton DANS un formulaire seulement — les boutons de lot (« Acheter », « Faire une offre »)
   gardent leur taille, qui est une référence validée */
.form-card .btn { min-height: 44px; padding: 10px 26px; font-size: .74em; }

.ordre-line {
  display: grid; grid-template-columns: 1fr 1.2fr auto; gap: 14px; align-items: end;
  padding: 16px 0; border-bottom: 1px dashed var(--line);
}
.notice {
  background: var(--cream); border-left: 4px solid var(--gold);
  padding: 18px 22px; border-radius: 0 2px 2px 0; margin: 26px 0;
  color: var(--text-soft); font-size: .95em;
}

/* ---------- Contact ---------- */
.contact-split { display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: start; }
.ct-tete { text-align: center; margin-bottom: 46px; }
.ct-tete p { color: var(--text-soft); max-width: 660px; margin: 0 auto; }
.ct-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 8px; }
.ct-photos img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; }
.ct-label {
  font-size: .76em; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: #3a3a3a; margin: 24px 0 6px;
}
.contact-info p { color: var(--text-soft); margin: 0; line-height: 1.7; }
.contact-info a { color: var(--noir); }
.ct-tel { font-size: 1.15em; font-weight: 700; text-decoration: none; }
/* Métro / Bus (couleurs RATP) */
.ct-metro { list-style: none; margin: 4px 0 0; padding: 0; }
.ct-metro li { display: flex; align-items: center; gap: 7px; margin: 9px 0; color: var(--text-soft); }
.ct-metro li > span:last-child { margin-left: 3px; }
.mb {
  width: 27px; height: 27px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .72em; font-weight: 700; color: #fff;
}
.m8 { background: #c5a3cf; color: #2b2b2b; }
.m9 { background: #b5bd00; color: #2b2b2b; }
.m3 { background: #837902; }
.mp { background: #43479b; }
.ct-bus { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.bb {
  min-width: 44px; padding: 4px 10px; border-radius: 2px; text-align: center;
  font-size: .78em; font-weight: 700; color: #fff;
}
.b74 { background: #bb8b00; } .b20 { background: #f0801f; } .b48 { background: #2268af; }
.b67 { background: #e58fb0; } .b95 { background: #95412c; } .b85 { background: #8f6b2f; }
/* panneau du formulaire (même esprit que la page Mon compte) */
.ct-panel {
  background: #f7f7f7; border: 1px solid #ececec; border-radius: 2px;
  padding: 36px 42px 42px;
}
.ct-panel h2 { text-align: center; font-size: 1.35em; color: var(--noir); margin: 0 0 6px; }
.ct-panel .ct-intro { text-align: center; color: #333333; font-size: .9em; margin: 0 0 26px; }
.auth2-form select, .auth2-form textarea {
  width: 100%; padding: 8px 12px; margin-bottom: 16px;
  background: #fff; border: 1px solid #dcdcdc; border-radius: 0;
  font-family: inherit; font-size: .95em; color: var(--text);
}
.auth2-form select { min-height: 42px; }
.auth2-form textarea { min-height: 160px; resize: vertical; }
.auth2-form select:focus, .auth2-form textarea:focus { outline: none; border-color: var(--noir); }

/* ---------- Pied de page ---------- */
/* ---------- Pied de page (moderne) ---------- */
.site-footer {
  background: var(--white); color: #6a6a6a; margin-top: 96px; position: relative;
  border-top: 1px solid #e6e6e6;
}
.site-footer a { color: #6a6a6a; text-decoration: none; }

/* Newsletter façon Sotheby's : bloc centré sur fond gris clair */
.footer-news { background: #f7f7f7; padding: 36px 0; }
.footer-news-box { max-width: 920px; margin: 0 auto; text-align: center; }
.footer-news-titre {
  font-family: "Cormorant Garamond", Georgia, serif; color: #1c1c1c;
  font-size: 1.7em; font-weight: 600; line-height: 1.25; margin: 0;
}
.footer-news-sub { color: #333; font-size: .92em; margin: 8px 0 0; }
/* formulaire compact : champ + bouton côte à côte, note légale en dessous */
.footer-news-form {
  margin-top: 24px; text-align: left;
  display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: stretch;
}
.footer-news-form input {
  flex: 1 1 320px; width: auto; height: 46px; padding: 8px 2px;
  border: none; border-bottom: 1px solid #9a9a9a; border-radius: 0;
  background: transparent; color: #1c1c1c;
  font-family: inherit; font-size: 1em;
}
.footer-news-form input::placeholder { color: #333333; }
.footer-news-form input:focus { outline: none; border-bottom-color: var(--noir); }
.footer-news-note {
  color: #333333; font-size: .64em; line-height: 1.5; margin: 6px 0 0; order: 3; flex: 1 1 100%;
  white-space: nowrap;              /* une seule ligne sur desktop */
}
@media (max-width: 980px) { .footer-news-note { white-space: normal; } }
.footer-news-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: auto; min-width: 170px; min-height: 46px; padding: 10px 28px;
  border: none; cursor: pointer;
  background: var(--noir); color: #fff;
  font-family: inherit; font-size: .82em; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  transition: background .18s ease;
}
.footer-news-btn:hover { background: #333333; }
/* 22/09/2026 : en dessous de ~500px, le champ e-mail et le bouton (flex-wrap) passent
   chacun sur leur propre ligne ; le bouton, en width:auto/text-align:left hérité du
   formulaire, restait collé à gauche avec tout le vide à droite — d'où l'impression de
   bouton « pas centré ». Pleine largeur ici, comme le bouton de la bande vente sur
   mobile : il s'aligne sur le champ au-dessus et devient une cible plus facile à toucher. */
@media (max-width: 600px) {
  .footer-news-btn { width: 100%; }
}
.footer-news-msg { margin: 14px 0 0; font-size: .9em; font-weight: 600; text-align: center; }
.footer-news-msg.ok { color: #2e7d39; }
.footer-news-msg.err { color: #a33030; }

/* Bande réseaux sociaux (Instagram + Facebook), centrée */
.footer-social { padding: 24px 0; border-bottom: 1px solid #e6e6e6; }
.footer-social-inner { display: flex; justify-content: center; gap: 52px; }
.footer-social a { color: #333333; display: inline-flex; transition: color .15s ease; }
.footer-social a:hover { color: var(--noir); }

.footer-grid {
  display: grid; grid-template-columns: 1.4fr 1.3fr 1fr 1fr;
  gap: 30px 44px; padding: 46px 0 34px;
}
.footer-logo img { height: 38px; width: auto; display: block; margin-bottom: 16px; filter: brightness(0); }
.footer-adresse { font-size: .86em; line-height: 1.6; color: #333333; margin: 0; }

/* Titres : même police que le menu du haut (Lato majuscule) + filet doré */
.footer-titre {
  font-family: "Lato", "Segoe UI", Arial, sans-serif;
  font-size: .8em; font-weight: 700; text-transform: uppercase; letter-spacing: .16em;
  color: #3a3a3a; margin: 0 0 16px; padding-bottom: 9px; position: relative;
}
.footer-titre::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 2px; background: var(--noir);
}

.footer-liens { list-style: none; margin: 0; }
.footer-liens li { margin-bottom: 10px; }
.footer-liens a {
  color: #6a6a6a; font-size: .9em; display: inline-block;
  transition: color .16s ease;
}
.footer-liens a:hover { color: var(--noir); text-decoration: underline; text-underline-offset: 3px; }

.footer-contact { list-style: none; margin: 0; }
.footer-contact li {
  display: flex; align-items: flex-start; gap: 11px;
  margin-bottom: 11px; font-size: .88em; line-height: 1.55; color: #6a6a6a;
}
.footer-contact svg { flex: none; margin-top: 2px; color: #9a9a9a; }
.footer-contact a { color: #6a6a6a; transition: color .16s; }
.footer-contact a:hover { color: var(--noir); }
@media (max-width: 980px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 40px; }
}
@media (max-width: 560px) {
  /* mobile : une colonne centrée (sinon tout est collé à gauche) */
  .footer-grid { grid-template-columns: 1fr; gap: 30px; padding: 40px 20px 32px; text-align: center; }
  .footer-logo img { margin-left: auto; margin-right: auto; }
  .footer-titre::after { left: 50%; transform: translateX(-50%); }
  .footer-liens a { display: inline-block; }
  .footer-contact li { justify-content: center; text-align: left; }
  .footer-bottom-inner { justify-content: center; text-align: center; }
}
.footer-bottom {
  border-top: 1px solid #e6e6e6;
  padding: 16px 0; font-size: .85em; color: #333333;
}
.footer-bottom-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px 24px; flex-wrap: wrap;
}
/* lien discret (ex-bouton encadré) */
.footer-classique {
  display: inline-flex; align-items: center;
  color: #333333 !important; white-space: nowrap;
  text-decoration: underline; text-underline-offset: 3px;
  transition: color .15s ease;
}
.footer-classique:hover { color: var(--noir) !important; }
.footer-taille { display: inline-flex; align-items: center; gap: 8px; }
.footer-taille .ft-label { opacity: .7; }
.footer-copy { opacity: .7; }
@media (max-width: 820px) {
  .footer-bottom-inner { justify-content: center; text-align: center; }
}

/* ---------- Page interne : bannière de titre ---------- */
/* Bandeau de titre retiré de toutes les pages (redondant avec le menu) */
.page-title { display: none; }
/* Statut de la vente (clôture) — ligne discrète sous « Tous les lots » */
.vente-statut {
  margin: 2px 0 16px; padding-left: 12px;
  border-left: 3px solid var(--gold);
  color: var(--text-soft); font-size: .92em; line-height: 1.4;
}
.vente-statut strong { color: var(--navy); font-weight: 700; }
.vente-statut .vs-sep { color: var(--gold-dark); margin: 0 3px; }

/* ---------- Compte à rebours de clôture ---------- */
.chrono-bande {
  background: var(--navy);
  border-top: 1px solid rgba(179, 146, 79, .45);
  box-shadow: inset 0 8px 14px -10px rgba(0, 0, 0, .5);
}
.chrono-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 30px; flex-wrap: wrap; padding: 14px 24px 16px;
}
.chrono-titre {
  color: #ece4d2;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.3em; letter-spacing: .05em;
}
.chrono { display: flex; align-items: flex-start; gap: 12px; }
.chrono-bloc { display: flex; flex-direction: column; align-items: center; min-width: 56px; }
.chrono-bloc b {
  color: #e8e8e8; font-size: 1.25em; font-weight: 700; line-height: 1.2;
  font-family: "Lato", "Segoe UI", Arial, sans-serif;
  font-variant-numeric: tabular-nums; letter-spacing: .04em;
}
.chrono-bloc i {
  color: #a9a291; font-style: normal; font-size: .62em;
  text-transform: uppercase; letter-spacing: .16em; margin-top: 2px;
}
.chrono-sep { color: var(--gold); font-size: 1.1em; opacity: .5; line-height: 1.6; }
.chrono-date { color: #a9a291; font-size: .85em; letter-spacing: .04em; }
@media (max-width: 700px) {
  .chrono-inner { gap: 14px; }
  .chrono-titre { font-size: 1.1em; }
  .chrono-bloc { min-width: 44px; }
}

/* ---------- Page vente : menu de catégories à gauche ---------- */
.vente-layout {
  display: grid; grid-template-columns: 290px minmax(0, 1fr);
  gap: 40px; align-items: start;
}
.cat-menu {
  position: sticky; top: 110px;
  max-height: calc(100vh - 128px);
  display: flex; flex-direction: column;
  background: var(--white);
  border: 1px solid var(--line); border-radius: 2px;
  overflow: hidden;
}
.cat-menu h2 {
  font-size: 1.05em; padding: 16px 18px 14px;
  background: var(--white); color: var(--noir);
  letter-spacing: .04em;
  border-bottom: 1px solid var(--line);
}
.cat-menu nav { overflow-y: auto; }
.cat-menu a {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  padding: 11px 18px;
  text-decoration: none; color: var(--navy);
  font-size: .88em; line-height: 1.35;
  border-left: 4px solid transparent;
  border-bottom: 1px solid #f2eee6;
}
.cat-menu a:hover { background: var(--cream); }
.cat-menu .cat-group {
  background: var(--white); color: var(--noir);
  font-weight: 700; text-transform: uppercase;
  font-size: .74em; letter-spacing: .08em;
  padding: 9px 18px; text-align: center;
  border-bottom: 1px solid var(--line);
}
.cat-menu a.active {
  background: var(--cream); border-left-color: var(--gold); font-weight: 700;
}
.cat-menu .cat-count {
  color: var(--text-soft); font-size: .85em; flex: none;
  font-weight: 400;
}
/* 2 colunas de lotes na página da vente (desktop) */
.vente-main .lots-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

@media (max-width: 950px) {
  .vente-layout { grid-template-columns: 1fr; }
  .cat-menu { position: static; max-height: none; }
  .cat-menu nav { max-height: 280px; }
}

/* ---------- Lightbox (pop-up de photo) ---------- */
.lightbox {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(8, 10, 15, .95);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  overflow: hidden;    /* la photo zoomée ne déborde pas */
}
.lightbox img {
  max-width: 96vw; max-height: 92vh;
  width: auto; height: auto;
  border-radius: 2px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
  transition: transform .12s ease-out;
}
.lightbox .lb-close {
  position: absolute; top: 20px; right: 24px;
  width: 56px; height: 56px; border-radius: 50%;
  border: none; cursor: pointer;
  background: var(--white); color: var(--navy);
  font-size: 26px; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .4);
}
.lightbox .lb-close:hover { background: var(--gold); }
.lightbox .lb-caption {
  position: absolute; bottom: 22px; left: 0; right: 0;
  text-align: center; color: var(--white); font-size: 1.05em;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .6);
}
.lightbox .lb-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 60px; height: 60px; border-radius: 50%;
  border: none; cursor: pointer;
  background: var(--white); color: var(--navy);
  font-size: 26px; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .4);
}
.lightbox .lb-nav:hover { background: var(--gold); }
.lightbox .lb-prev { left: 24px; }
.lightbox .lb-next { right: 24px; }

/* ---------- Boutique ---------- */
/* (o panier boutique flutuante foi fusionado no .panier-flottant do header) */
.bq-panier-btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; margin-bottom: 18px; position: relative;
}
.bq-badge {
  background: var(--navy); color: var(--white);
  border-radius: 999px; min-width: 26px; height: 26px; padding: 0 7px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .85em; font-weight: 700;
}
.bq-toolbar {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  flex-wrap: wrap; margin-bottom: 26px; color: var(--text-soft);
}
.bq-outils { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.bq-outil { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.bq-outil .label { font-size: .85em; }
.bq-toolbar .btn-chip { text-decoration: none; padding: 4px 10px; font-size: .9em; color: var(--text); border-color: #cfcfcf; }
.bq-toolbar .btn-chip.actif {
  background: var(--navy); color: var(--white); border-color: var(--navy);
}
.bq-select {
  padding: 6px 8px; border: 1px solid #cfcfcf; border-radius: 2px;
  background: var(--white); color: var(--text); font: inherit; font-size: .9em;
  cursor: pointer;
}
/* ---------- Vente en cours: MESMA grade da boutique (4 colunas) + vista lista ---------- */
.vente-main .lots-grid.vente-grille {
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.vente-grille .lot-photo { height: 240px; padding: 10px; }
.vente-grille .lot-body { padding: 8px 11px 7px; gap: 3px; }
.vente-grille .lot-num { font-size: .76em; }
.vente-grille .lot-desc { font-size: .88em; }
/* ancre = la COTE (le prix la suit collée) → cote + prix alignés en bas sur toute la ligne */
.vente-grille .lot-body > .lot-cote { margin-top: auto; }
.vente-grille .lot-price { margin-top: 0; }
.vente-grille .lot-card { padding-bottom: 56px; }
.vente-grille .lot-card .lot-bid,
.vente-grille .lot-card .lot-vendu { bottom: 10px; left: 12px; right: 12px; height: 42px; }
.vente-grille .lot-card .lot-bid { min-height: 42px; }
/* champ plus étroit + libellé plus petit : « Faire une offre » doit tenir ENTIER en 4 colonnes */
.vente-grille .lot-bid input { height: auto; font-size: .8em; padding: 0 6px; flex: 0 0 88px; width: 88px; }
.vente-grille .lot-bid .btn { height: auto; min-height: 0; padding: 0 6px; font-size: .72em; letter-spacing: .02em; }
@media (max-width: 1150px) {
  .vente-main .lots-grid.vente-grille { grid-template-columns: repeat(3, 1fr); }
}
/* lista da vente reutiliza .bq-liste/.bq-ligne; ação (form/badge) na coluna direita,
   SEMPRE com a mesma largura/altura que os botões */
.bq-ligne-achat .lot-bid,
.bq-ligne-achat .lot-vendu {
  position: static !important; inset: auto !important;
  height: auto !important; margin: 0 !important; overflow: visible;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
  padding: 0; width: 100% !important; box-sizing: border-box;
}
.bq-ligne-achat .lot-vendu {
  height: 40px !important; min-height: 0; padding: 0 8px;
  align-items: center;
  background: #f2f2f2; border: 1px solid #d5d5d5; border-radius: 2px;
  font-size: .85em; font-weight: 600;
}
.bq-ligne-achat .lot-vendu.lot-reserve {
  background: #f2f2f2; border-color: #d5d5d5; font-size: .74em; line-height: 1.2;
}
/* na liste (coluna) a moldura fusionada não se aplica: volta ao estilo clássico */
.bq-ligne-achat .lot-bid { border: 0; border-radius: 0; overflow: visible; background: transparent; }
.bq-ligne-achat .lot-bid:focus-within { box-shadow: none; }
.bq-ligne-achat .lot-bid input {
  box-sizing: border-box; height: 38px !important; font-size: .88em;
  border: 1px solid #cfcfcf; border-radius: 2px;
  width: 100% !important; flex: none !important; text-align: center; margin: 0;
}
.bq-ligne-achat .lot-bid input:not([type="hidden"]) ~ .btn { border-left: 0; }
.bq-ligne-achat .lot-bid .btn {
  box-sizing: border-box; height: 40px !important; min-height: 0 !important;
  padding: 0 10px !important; font-size: .88em;
  width: 100% !important; flex: none !important; border-radius: 2px; margin: 0 !important;
}
@media (max-width: 760px) {
  .vente-main .lots-grid.vente-grille { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
  .vente-grille .lot-photo { height: 220px; }
}

/* vue grille compacta (4 por linha, estilo Delcampe) */
.vente-main .lots-grid.bq-grille {
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.bq-grille .lot-card { padding-bottom: 56px; }
.bq-grille .lot-photo { height: 240px; padding: 10px; }
.bq-grille .lot-body { padding: 8px 11px 7px; gap: 3px; }
.bq-grille .lot-num { font-size: .76em; }
.bq-grille .lot-desc { font-size: .88em; }
/* ancre = la COTE (le prix la suit collée) → cote + prix alignés en bas sur toute la ligne */
.bq-grille .lot-body > .lot-cote { margin-top: auto; }
.bq-grille .lot-price { margin-top: 0; }
.bq-grille .lot-price .amount { font-size: .95em; }
.bq-grille .lot-card .lot-bid { bottom: 10px; left: 12px; right: 12px; height: 42px; min-height: 42px; }  /* min-height : sinon le 52px de base gagne → bouton plus haut que la vente */
.bq-grille .lot-bid input { font-size: .82em; padding: 0 8px; }
.bq-grille .lot-bid .btn { height: auto; min-height: 0; padding: 0 10px; font-size: .82em; }
/* bouton « Acheter » seul : pleine largeur du card, IDENTIQUE à celui de la vente
   (référence validée par Murilo — ne pas rétrécir) */
.bq-grille .lot-thumbs { padding: 8px 10px 0; gap: 6px; }
.bq-grille .lot-thumb { width: 38px; height: 38px; }
@media (max-width: 1150px) {
  .vente-main .lots-grid.bq-grille { grid-template-columns: repeat(3, 1fr); }
}

/* vue liste fina: foto pequena, texto no meio, preço + botão à direita */
.bq-liste { display: flex; flex-direction: column; gap: 10px; }
.bq-ligne { flex-direction: row !important; align-items: center; gap: 0; }
.bq-ligne.lot-card { padding-bottom: 0; }
.bq-ligne-photo {
  flex: 0 0 96px; height: auto; min-height: 84px; padding: 5px;
  align-self: stretch;
}
.bq-ligne-photo img { max-height: 80px; }
.bq-ligne-corps { flex: 1; min-width: 0; padding: 8px 16px; display: flex; flex-direction: column; gap: 2px; }
.bq-ligne-corps .lot-desc { font-size: .88em; }
.bq-ligne-corps .lot-desc.clampable { -webkit-line-clamp: 2; }
.bq-ligne-corps .voir-plus { align-self: flex-start; }
.bq-ligne-achat {
  flex: 0 0 170px; padding: 8px 14px; border-left: 1px solid #eee8db;
  display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 8px;
  align-self: stretch; text-align: center;
}
.bq-ligne-achat .lot-price { text-align: center; margin: 0; display: flex; justify-content: center; }
.bq-ligne-achat .lot-price .amount { font-size: .98em; }
.bq-btn { width: 100%; white-space: nowrap; height: 38px; min-height: 0; padding: 0 12px; font-size: .88em; }
.bq-tag {
  display: inline-block; background: #f2f2f2; color: #333;
  border: 1px solid #d5d5d5; border-radius: 2px;
  padding: 1px 8px; font-size: .8em; white-space: nowrap;
}
.bq-modes { display: flex; flex-direction: column; gap: 10px; }
.bq-mode {
  display: flex; gap: 12px; align-items: center;
  border: 1px solid #cfcfcf; border-radius: 2px; padding: 14px 16px; cursor: pointer;
}
.bq-mode:has(input:checked) { border-color: var(--gold-dark); background: #f7f7f7; }
.bq-mode input { width: 20px; height: 20px; }

/* ---------- Bouton "Notre Histoire" (héros) : fumé transparent, sobre ---------- */
.btn-maison {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  font-size: 1.2em; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255, 255, 255, .95); text-decoration: none;
  padding: 17px 48px;
  background: rgba(20, 20, 24, .45);
  border: none; border-radius: 2px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background .25s;
}
.btn-maison:hover {
  background: rgba(20, 20, 24, .65);
  color: var(--white); text-decoration: none;
}

/* ---------- Expertise : assistant par étapes (fidèle à la maquette XD V9) ---------- */
/* En-tête : « Expertise » à gauche, description à droite, filet dessous */
.exp-entete { border-bottom: 1px solid var(--line); }
.exp-entete .container {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 12px 32px; flex-wrap: wrap;
  padding-top: 36px; padding-bottom: 14px;
}
.exp-entete h1 { font-size: 2em; font-weight: 600; }
.exp-entete p { margin: 0 0 6px; color: #333333; font-size: .85em; font-style: italic; }
.exp-entete + .section { padding-top: 38px; }

/* Stepper : libellé AU-DESSUS, petit carré EN DESSOUS ; trait plein jusqu'à
   l'étape courante, pointillé pour les étapes à venir */
.exp-stepper { display: flex; gap: 0; margin: 0 auto 46px; max-width: 760px; }
.exp-pas {
  flex: 1; min-width: 0; text-align: center;
  display: flex; flex-direction: column-reverse; align-items: center; gap: 10px;
  color: #9a9a9a; position: relative; font-size: .78em; line-height: 1.35;
}
.exp-pas .exp-num {
  width: 13px; height: 13px; flex: none; box-sizing: border-box;
  border: 1px solid #767676; border-radius: 0; background: var(--white);
  font-size: 0;                     /* cache le numéro : la maquette n'en a pas */
  position: relative; z-index: 2;
}
.exp-pas.actif .exp-num, .exp-pas.fait .exp-num { background: var(--noir); border-color: var(--noir); }
.exp-pas.actif, .exp-pas.fait { color: var(--noir); }
.exp-pas.actif { font-weight: 700; }
/* segment reliant chaque étape à la précédente */
.exp-pas + .exp-pas::before {
  content: ""; position: absolute; bottom: 6px; right: 50%; width: 100%; height: 0;
  border-top: 1px dashed #b5b5b5; z-index: 1;
}
.exp-pas.actif::before, .exp-pas.fait::before { border-top: 1px solid var(--noir); }
.exp-pas .exp-lbl { display: block; padding: 0 6px; }

/* Carte centrale blanche (la maquette la pose sur fond clair, ombre légère) */
.exp-card {
  max-width: 640px; margin: 0 auto;
  background: var(--white); border: 1px solid var(--line);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .07);
}
/* etapas: sem borda de fieldset, tudo centralizado */
.exp-etape { border: none; padding: 0; margin: 0; text-align: center; }
.exp-etape h2 {
  font-family: "Lato", "Segoe UI", Arial, sans-serif;
  font-size: 1.06em; font-weight: 700; letter-spacing: .01em;
  text-align: center; margin-bottom: 26px !important;
}
/* questions : phrase courte et centrée */
.exp-etape .form-group > label {
  display: block; text-align: center;
  font-size: .95em; font-weight: 500; color: var(--text);
  letter-spacing: 0; text-transform: none; line-height: 1.5;
  max-width: 560px; margin: 0 auto 4px;
}
/* précision discrète sous la question */
.exp-note {
  text-align: center; color: #333333; font-size: .85em; margin: 0 auto 2px; max-width: 520px;
}
/* un filet calme entre les questions */
.exp-etape .form-group { margin-bottom: 0; padding: 22px 0; }
.exp-etape .form-group + .form-group { border-top: 1px solid #ececec; }
/* champs étroits et centrés comme la maquette */
.exp-etape input[type="text"], .exp-etape input[type="email"], .exp-etape input[type="tel"] {
  text-align: center; max-width: 360px; margin-left: auto; margin-right: auto; display: block;
}
.exp-etape textarea { text-align: center; max-width: 480px; margin: 0 auto; display: block; }
.exp-etape .form-row { grid-template-columns: 1fr; gap: 0; }
/* étape « Vos infos » : que des cases empilées, serrées, sans filets */
.exp-etape[data-etape="4"] .form-group { padding: 7px 0; border-top: none; margin: 0; }
.exp-etape #exp-recap { text-align: left; }
/* choix façon maquette : libellé au-dessus d'une petite case carrée */
.exp-choix { display: flex; gap: 16px 36px; flex-wrap: wrap; margin-top: 16px; justify-content: center; }
.exp-choix .bq-mode {
  display: flex; flex-direction: column-reverse; align-items: center; gap: 8px;
  border: none; background: none; padding: 4px 2px; min-width: 0;
  font-weight: 400; font-size: .84em; color: var(--text); letter-spacing: .01em;
  cursor: pointer; position: relative; border-radius: 0;
}
.exp-choix .bq-mode:hover { color: var(--noir); }
.exp-choix .bq-mode:has(input:checked) { color: var(--noir); font-weight: 700; }
.exp-choix .bq-mode input {
  position: static; opacity: 1; width: 11px; height: 11px; margin: 0; flex: none;
  min-height: 0; padding: 0;      /* annule le min-height:50px/padding du .form-group input */
  appearance: none; -webkit-appearance: none;
  border: 1px solid #767676; border-radius: 0; background: var(--white); cursor: pointer;
}
.exp-choix .bq-mode input:checked { background: var(--noir); border-color: var(--noir); }
.exp-choix .bq-mode:focus-within { outline: 2px solid var(--noir); outline-offset: 2px; }
.exp-choix .bq-mode small { color: var(--text-soft); font-weight: 400; }
.exp-depot {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  border: 2px dashed #c9c9c9; border-radius: 2px;
  padding: 34px 20px; cursor: pointer; text-align: center;
  color: var(--noir); background: var(--white);
  max-width: 480px; margin: 0 auto;
}
.exp-depot .hint { font-style: italic; color: #333333; font-size: .82em; }
.exp-depot:hover { border-color: var(--noir); }
/* navigation : « Suivant » petit bouton contour centré, « Précédent » lien discret à gauche */
.exp-nav { display: flex; align-items: center; justify-content: center; margin-top: 28px; position: relative; min-height: 40px; }
#exp-suiv {
  background: var(--white); color: var(--noir); border: 1px solid var(--noir);
  min-height: 40px; padding: 8px 30px; font-size: .72em; box-shadow: none;
}
#exp-suiv:hover { background: var(--noir); color: #fff; }
#exp-prec {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  background: none; border: none; box-shadow: none; cursor: pointer;
  min-height: 0; padding: 4px 0; color: #333333;
  font-size: .78em; font-weight: 400; letter-spacing: .02em; text-transform: none;
  text-decoration: underline; text-underline-offset: 3px;
}
#exp-prec:hover { color: var(--noir); background: none; }
/* lien retour de l'écran Merci */
.exp-retour {
  color: #333333; font-size: .9em;
  text-decoration: underline; text-underline-offset: 3px;
}
.exp-retour:hover { color: var(--noir); }

/* ---------- La Maison : galerie ---------- */
.maison-galerie {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.maison-item { margin: 0; }
.maison-item .lot-photo {
  height: 260px; padding: 0;
  border: 1px solid var(--line); border-radius: 2px; overflow: hidden;
  background: #ececec;
}
.maison-item .lot-photo img { object-fit: cover; }
.maison-item figcaption {
  margin-top: 10px; text-align: center;
  color: var(--text-soft); font-size: .92em; font-style: italic;
}
@media (max-width: 950px) {
  .maison-galerie { grid-template-columns: 1fr; }
  .maison-item .lot-photo { height: 220px; }
}

/* ---------- Admin boutique: cartões de commandes (compacts — lignes fines) ---------- */
.adm-cmd {
  border: 1px solid var(--line); border-radius: 2px;
  padding: 7px 14px; margin-bottom: 6px; background: var(--white);
  line-height: 1.35; font-size: .95em;
}
.adm-cmd p { margin: 2px 0 !important; font-size: .92em; }
.adm-cmd-annulee { opacity: .6; }
.adm-cmd-tete { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.adm-tag {
  padding: 3px 12px; border-radius: 999px; font-size: .8em; font-weight: 700;
  white-space: nowrap;
}
.adm-tag-vert  { background: #e3f2e3; color: #1e7a2e; }
.adm-tag-bleu  { background: #e3ecf7; color: #1f4e8c; }
.adm-tag-ambre { background: #fdf3d7; color: #8a6d1a; }
.adm-tag-rouge { background: #fbeaea; color: var(--danger); }
.adm-tag-gris  { background: #eee9df; color: #6b6558; }
/* ligne : infos client (gauche) — boutons (milieu) — prix discret (droite) */
.adm-cmd-ligne { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.adm-cmd-infos { flex: 1 1 340px; min-width: 0; }
.adm-cmd-prix { font-weight: 700; font-size: .92em; white-space: nowrap; }
.adm-actions form { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 0; align-items: center; }
.adm-btn { min-height: 30px; padding: 3px 12px; font-size: .8em; border: none; }
.adm-vert  { background: #2e8b3d; color: #fff; }
.adm-vert:hover  { background: #256f31; color: #fff; }
.adm-bleu  { background: var(--navy); color: #fff; }
.adm-rouge { background: #c0392b; color: #fff; }
.adm-rouge:hover { background: #992d22; color: #fff; }
.adm-gris  { background: #eee9df; color: var(--text); }

/* Lot réservé (commande aguardando confirmação) */
.lot-vendu.lot-reserve {
  background: #fdf3d7; color: #8a6d1a; border-color: var(--gold);
}

/* ---------- Fiche de lot (página + pop-up) ---------- */
.lot-lien { text-decoration: none; }
.lot-lien:hover .lot-num { text-decoration: underline; color: var(--navy); }
.fiche-lot {
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 42px; align-items: start;
}
/* --- Galerie --- */
.fiche-photo-principale {
  height: 440px; border: 1px solid var(--line); border-radius: 2px; overflow: hidden;
  background: radial-gradient(130% 130% at 50% 0%, #ffffff 0%, #f0f0f0 100%);
}
.fiche-photo-principale img { width: 100%; height: 100%; object-fit: contain; padding: 18px; }
.fiche-minis {
  display: flex; gap: 8px; margin-top: 14px; min-height: 60px;
  flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px;
}
.fiche-minis .lot-thumb { flex: 0 0 auto; }
/* --- Colonne infos : zones à hauteur stable, rien ne bouge d'un lot à l'autre --- */
.fiche-infos { display: flex; flex-direction: column; height: 440px; }
.fiche-eyebrow {
  margin: 2px 0 0; font-family: "Lato", system-ui, sans-serif;
  font-size: .76rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold-dark);
}
.fiche-eyebrow::after {
  content: ""; display: block; width: 44px; height: 1px; margin-top: 12px; background: var(--line);
}
.fiche-desc {
  flex: 1 1 0; min-height: 0; overflow-y: auto;
  margin: 18px 0 0; padding-right: 8px;
  font-size: 1.06rem; line-height: 1.62; color: var(--text);
}
/* base ancrée : prix + action + garantie, hauteur constante */
.fiche-bas { margin-top: 20px; }
.fiche-prix-bloc {
  border: 1px solid var(--line); border-radius: 2px; overflow: hidden; background: var(--cream);
}
.fiche-ligne-prix {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 12px 20px; line-height: 1.15; color: var(--text-soft); font-family: "Lato", system-ui, sans-serif;
}
.fiche-ligne-prix + .fiche-ligne-prix { border-top: 1px solid var(--line); }
.fiche-ligne-prix span { font-size: .92rem; }
.fiche-ligne-prix strong { font-size: 1.1rem; color: var(--navy); font-weight: 700; }
.fiche-ligne-prix.fiche-principal { background: #fff; }
.fiche-ligne-prix.fiche-principal strong { font-size: 1.5rem; color: var(--gold-dark); }
.fiche-ligne-prix.fiche-vendu strong { font-size: 1.5rem; color: var(--danger); }
.fiche-action {
  min-height: 64px; margin-top: 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.fiche-note { color: var(--text-soft); font-size: .9rem; line-height: 1.5; }
.fiche-note-tel { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.fiche-infos .lot-bid { min-height: 54px; }
.fiche-infos .lot-bid .btn { font-size: 1.06em; }
.fiche-infos .lot-bid input { font-size: 1em; }
/* pop-up */
.fiche-modal {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(22, 35, 61, .88);
  display: flex; align-items: center; justify-content: center;
  padding: 30px;
}
.fiche-cadre {
  width: min(1050px, 96vw); height: min(680px, 90vh);
  background: var(--white); border-radius: 2px; overflow: hidden;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
}
.fiche-cadre iframe { width: 100%; height: 100%; border: none; }
.fiche-modal .lb-close {
  position: absolute; top: 18px; right: 22px;
  width: 52px; height: 52px; border-radius: 50%;
  border: none; cursor: pointer;
  background: var(--white); color: var(--navy);
  font-size: 24px; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .4);
}
.fiche-modal .lb-close:hover { background: var(--gold); }
/* flèches lot précédent / suivant dans le pop-up */
.fiche-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  border: none; cursor: pointer; background: none; padding: 12px; color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: color .15s ease, opacity .15s ease;
}
.fiche-nav svg { width: 26px; height: 54px; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5)); }
.fiche-nav:hover { color: var(--gold); }
.fiche-nav[disabled] { opacity: .28; cursor: default; }
.fiche-nav[disabled]:hover { color: #fff; }
.fiche-prev { left: 22px; }
.fiche-next { right: 22px; }
@media (max-width: 950px) {
  .fiche-nav { padding: 6px; }
  .fiche-nav svg { width: 20px; height: 42px; }
  .fiche-prev { left: 4px; }
  .fiche-next { right: 4px; }
}
/* conteúdo do pop-up centrado verticalmente */
body.fiche-modal-corps {
  margin: 0; min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
}
body.fiche-modal-corps > section { width: 100%; }
.fiche-photo-principale { cursor: zoom-in; }
.fiche-photo-principale img { transition: transform .12s ease-out; }
@media (max-width: 950px) {
  .fiche-lot { grid-template-columns: 1fr; gap: 22px; }
  .fiche-photo-principale { height: 300px; }
  .fiche-infos { height: auto; }
  .fiche-desc { flex: none; overflow: visible; margin-top: 14px; }
  .fiche-bas { margin-top: 18px; }
  .fiche-action { min-height: 0; }
  .fiche-modal { padding: 10px; }
  .fiche-cadre { height: 94vh; }
}

/* ---------- Espace client (Mon compte) ---------- */
.compte-panneaux {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 30px;
  max-width: 1000px; margin: 0 auto; align-items: start;
}
.compte-layout {
  display: grid; grid-template-columns: 260px 1fr; gap: 34px; align-items: start;
}
.compte-menu nav a { display: block; }
.fav-coeur-form { position: absolute; top: 8px; right: 8px; z-index: 5; margin: 0; }
.bq-ligne .fav-coeur-form { top: 8px; left: 8px; right: auto; }
.fav-coeur {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid #d9d9d9; background: rgba(255, 255, 255, .94);
  color: #c3b9a6; font-size: 19px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
  transition: color .15s, border-color .15s, transform .15s;
}
.fav-coeur:hover { color: #e67e22; border-color: #e67e22; transform: scale(1.08); }
.fav-coeur.actif { color: #e67e22; border-color: #e67e22; }
@media (max-width: 950px) {
  .compte-panneaux { grid-template-columns: 1fr; }
  .compte-layout { grid-template-columns: 1fr; }
}

/* ---------- Bouton WhatsApp flottant ---------- */
.whatsapp-flottant {
  position: fixed; right: 210px; bottom: 22px; z-index: 100;
  width: 58px; height: 58px; border-radius: 50%;
  background: #25d366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
  transition: transform .15s ease;
}
.whatsapp-flottant:hover { transform: scale(1.08); color: #fff; }

/* ---------- Catalogue flottant ---------- */
.catalogue-flottant {
  position: fixed; right: 22px; bottom: 22px; z-index: 100;
  width: 170px;
  background: var(--white); border: 1px solid var(--line); border-radius: 2px;
  box-shadow: 0 12px 32px rgba(22,35,61,.28);
  overflow: hidden;
}
.catalogue-flottant a {
  display: block; text-decoration: none; color: var(--navy);
}
.catalogue-flottant img { width: 100%; display: block; }
.catalogue-flottant .cat-label {
  display: block; text-align: center; font-weight: 700;
  font-size: .78em; padding: 10px 8px;
  background: var(--navy); color: var(--white);
}
.catalogue-flottant .cat-close {
  position: absolute; top: 6px; right: 6px;
  width: 30px; height: 30px; border-radius: 50%;
  border: none; cursor: pointer;
  background: rgba(22,35,61,.75); color: var(--white);
  font-size: 16px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.catalogue-flottant .cat-close:hover { background: var(--navy); }
@media (max-width: 700px) { .catalogue-flottant { width: 128px; right: 12px; bottom: 12px; } }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .maison-split, .contact-split { grid-template-columns: 1fr; }
  .maison-photo { aspect-ratio: 3 / 2; }
  .maison-split p { text-align: left; hyphens: none; }
  .form-row { grid-template-columns: 1fr; }
  .ordre-line { grid-template-columns: 1fr; align-items: stretch; }
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
  :root { --fs-base: 17px; }
  html[data-fontsize="large"]  { --fs-base: 19px; }
  html[data-fontsize="xlarge"] { --fs-base: 21px; }

  .container { padding: 0 16px; }
  .section { padding: 44px 0; }
  .section-head { margin-bottom: 30px; }
  .section-head h2 { font-size: 1.5em; }

  /* En-tête compact.
     22/09/2026 : le logo était remis à 47px ici, ce qui ANNULAIT les 38px réglés plus
     haut pour ≤1160px et le faisait donc GRANDIR sur les plus petits écrans. Résultat :
     logo (226px) + burger + icônes dépassaient la largeur de l'écran et l'icône du
     panier était coupée — 14px hors écran en 375px, 29px en 360px, 69px en 320px, sans
     défilement horizontal pour aller la chercher. On laisse les 38px de ≤1160px agir. */
  .hd-icones { gap: 12px; }
  .hd-langue button { font-size: .82em; }

  /* Héros — hauteur naturelle (aspect-ratio de .hero-vue) ; l'ancien
     height:56vh écrasait la section et les titres passaient SOUS la photo */
  .hero-encart-texte { font-size: 1.08em; }

  /* Bandeau vente */
  .sale-banner .container { padding: 14px 16px; gap: 12px; }
  .sale-banner .btn { width: 100%; }

  /* Cards e lotes */
  .quick-grid { gap: 16px; }
  .quick-card { padding: 24px 18px; }
  .lots-grid { gap: 18px; grid-template-columns: 1fr !important; }
  .lot-photo { height: 210px; }

  /* Busca e menu de categorias */
  .lot-search { gap: 10px; }
  .lot-search .btn { width: 100%; }
  .cat-menu nav { max-height: 240px; }

  /* Formulários */
  .form-card { padding: 22px 16px; }

  /* Tabelas */
  table.results th, table.results td { padding: 12px 12px; font-size: .92em; }

  /* Pied de page */
  .footer-grid { padding: 44px 0 30px; }

  /* Pop-up de foto */
  .lightbox { padding: 16px; }
  .lightbox .lb-close { top: 12px; right: 12px; width: 48px; height: 48px; }
  .lightbox img { max-width: 96vw; max-height: 78vh; }
  .lightbox .lb-nav { width: 48px; height: 48px; font-size: 20px; }
  .lightbox .lb-prev { left: 8px; }
  .lightbox .lb-next { right: 8px; }
  .lot-thumb { width: 48px; height: 48px; }

  /* Boutique mobile: grade 2 colunas */
  .vente-main .lots-grid.bq-grille { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
  .bq-grille .lot-photo { height: 200px; }
  .bq-ligne-photo { flex-basis: 72px; }
  .bq-ligne-corps { padding: 6px 10px; }
  .bq-ligne-corps .lot-num { font-size: .7em; }
  .bq-ligne-achat { flex-basis: 118px; padding: 6px 8px; }
  .bq-ligne-achat .bq-btn { font-size: .8em; padding: 0 6px; }
  .bq-toolbar { flex-direction: column; align-items: flex-start; }

  /* Catálogo flutuante menor, sem cobrir os botões */
  .catalogue-flottant { width: 96px; right: 10px; bottom: 10px; }
  .catalogue-flottant .cat-close { width: 26px; height: 26px; font-size: 13px; }
  .whatsapp-flottant { right: 116px; bottom: 10px; width: 52px; height: 52px; }

  /* Título das páginas internas */
  .page-title { padding: 36px 0; }
  .page-title h1 { font-size: 1.5em; }

  /* Etapas e galeria */
  .steps { gap: 22px; }
  .gallery img { height: 210px; }
}

/* Evita qualquer estouro horizontal no mobile */
@media (max-width: 600px) {
  html, body { overflow-x: clip; }
}

/* (anciens hacks d'espacement des barres d'offre supprimés — le bouton
   flex:1 centre son texte naturellement dans la zone restante) */

/* ---------- Menu de catégories : groupes pliables ---------- */
.cat-grp summary {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 8px;
  background: var(--white); color: var(--noir);
  font-weight: 700; text-transform: uppercase;
  font-size: .74em; letter-spacing: .08em;
  padding: 10px 16px 10px 18px;
  border-bottom: 1px solid var(--line);
}
.cat-grp summary::-webkit-details-marker { display: none; }
.cat-grp summary::before { content: '\25B8'; flex: none; transition: transform .15s ease; }
.cat-grp[open] summary::before { transform: rotate(90deg); }
.cat-grp summary .cat-grp-titre { flex: 1; text-align: left; }
.cat-grp summary .cat-count { color: #333; font-weight: 400; }
.cat-grp summary:hover { background: #f2f2f2; }

/* Sous-bloc à l'intérieur d'un groupe (Guerre de 1870 et BFE dans le 19ème) */
.cat-menu .cat-sub {
  display: flex; align-items: center; gap: 8px;
  margin: 6px 0 2px;
  padding: 7px 16px 6px 26px;
  font-size: .70em; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--or-fonce, #a8842c);
  border-top: 1px solid var(--line);
  background: #fbfbfb;
}
.cat-menu .cat-sub .cat-count { margin-left: auto; color: #383838; font-weight: 400; }
.cat-menu a.cat-lien-sub { padding-left: 34px; }

/* Groupe à une seule catégorie : rendu comme un titre de section, mais cliquable */
.cat-menu a.cat-solo {
  font-weight: 700; text-transform: uppercase;
  font-size: .74em; letter-spacing: .08em;
  padding: 10px 16px 10px 18px;
  border-bottom: 1px solid var(--line);
}

/* ---------- Page compte : connexion / inscription (auth, style épuré) ---------- */
.auth-scene2 {
  max-width: 1000px; margin: 0 auto;
  background: #f7f7f7; border: 1px solid #ececec; border-radius: 2px;
  padding: 42px 54px 50px;
}
.auth2-titre {
  text-align: center; margin: 0 0 40px;
  font-family: "Lato", "Segoe UI", Arial, sans-serif; font-size: .92em; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase; color: var(--noir);
}
.auth2-cols { display: grid; grid-template-columns: 1fr 1px 1fr; gap: 0 52px; align-items: stretch; }
.auth2-sep { width: 1px; background: #d9d9d9; }
.auth2-col { display: flex; flex-direction: column; align-items: center; }
.auth2-col h3 {
  font-family: "Lato", "Segoe UI", Arial, sans-serif; font-size: 1em; font-weight: 700;
  color: #2b2b2b; margin: 0 0 24px; text-align: center;
}
.auth2-texte {
  color: #333333; font-style: italic; font-size: .88em; line-height: 1.75;
  text-align: center; margin: 0 0 28px; max-width: 380px;
}
.auth2-form { width: 100%; max-width: 380px; display: flex; flex-direction: column; }
/* aligné sur les champs .form-group (10/09/2026) : même finesse partout */
.auth2-form input {
  width: 100%; min-height: 42px; padding: 8px 12px; margin-bottom: 16px;
  background: #fff; border: 1px solid #dcdcdc; border-radius: 0;
  font-family: inherit; font-size: .95em; color: var(--text);
}
.auth2-form input:focus { outline: none; border-color: var(--noir); }
.auth2-oubli { text-align: center; margin: 0 0 16px; font-size: .84em; }
.auth2-oubli a { color: var(--noir); font-weight: 700; text-decoration: underline; }
.auth2-btn {
  background: #fff; color: var(--noir); border: 1px solid #9a9a9a;
  min-height: 46px; padding: 10px 30px; font-size: .74em;
  box-shadow: none; align-self: center;
}
.auth2-btn:hover { background: var(--noir); color: #fff; border-color: var(--noir); }
/* inscription révélée sous le panneau */
.auth2-ins { max-width: 1000px; margin: 30px auto 0; }
.auth2-ins .form-card { max-width: none; }
.auth2-ins h3 {
  text-align: center; margin: 0 0 26px; font-size: 1.25em; color: var(--noir);
}
.auth2-ins input[type="radio"] { width: 17px; height: 17px; min-height: 0; accent-color: var(--noir); }
@media (max-width: 820px) {
  .auth-scene2 { padding: 30px 22px 36px; }
  .auth2-cols { grid-template-columns: 1fr; gap: 36px; }
  .auth2-sep { display: none; }
}

/* ---------- Duplicata de facture (facture_client.php) ---------- */
.fact-outils { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 22px; }
.fact-doc {
  background: #fff; border: 1px solid var(--line); border-radius: 2px;
  padding: 44px 48px;
}
.fact-entete { display: flex; justify-content: space-between; gap: 30px; align-items: flex-start; }
.fact-logo { height: 40px; width: auto; display: block; filter: brightness(0); }
.fact-firme { color: var(--text-soft); font-size: .84em; line-height: 1.6; margin: 12px 0 0; }
.fact-cartouche { text-align: right; }
.fact-titre { font-size: 1.3em; font-weight: 700; color: var(--noir); margin: 0 0 8px; }
.fact-meta { color: var(--text-soft); font-size: .9em; line-height: 1.7; margin: 0; }
.fact-duplicata {
  display: inline-block; margin: 10px 0 0; padding: 3px 12px;
  border: 1px solid #b9b9b9; color: #333333; border-radius: 2px;
  font-size: .72em; font-weight: 700; letter-spacing: .2em;
}
.fact-adresse { margin: 26px 0 30px auto; max-width: 320px; line-height: 1.6; }
.fact-table { width: 100%; border-collapse: collapse; font-size: .92em; }
.fact-table th {
  text-align: left; font-size: .76em; text-transform: uppercase; letter-spacing: .1em;
  color: #333333; padding: 10px 10px; border-bottom: 2px solid var(--noir);
}
.fact-table td { padding: 10px 10px; border-bottom: 1px solid #eee; vertical-align: top; }
.fact-table tfoot td { border-bottom: none; padding: 8px 10px; color: var(--text-soft); }
.fact-table .fact-total td {
  border-top: 2px solid var(--noir); color: var(--noir);
  font-weight: 700; font-size: 1.1em; padding-top: 12px;
}
.fact-note { color: var(--text-soft); font-size: .84em; margin: 30px 0 0; }
/* impression : A4 PORTRAIT par défaut (sans @page, le navigateur garde la
   dernière orientation utilisée — les factures sortaient en paysage) */
@page { size: A4 portrait; margin: 12mm; }
@media print {
  .site-header, .site-footer, .fact-outils, .catalogue-flottant, .cookie-bandeau, .panier-flottant-wrap { display: none !important; }
  .section { padding: 0 !important; }
  .fact-doc { border: none; border-radius: 0; padding: 0; }
  /* la police écran (19px, public senior) est énorme sur papier A4 :
     on revient à une taille de document imprimé classique */
  body { background: #fff; font-size: 12px !important; line-height: 1.5; }
}

/* ---------- Œil des mots de passe ---------- */
.pass-wrap { position: relative; display: block; }
.pass-wrap input { width: 100%; padding-right: 54px; }
.pass-oeil {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  background: none; border: 0; cursor: pointer; padding: 8px;
  color: #9a958a; display: flex; align-items: center;
}
.pass-oeil:hover, .pass-oeil.actif { color: var(--navy); }

/* ---------- Résultat des ordres (espace client, ventes clôturées) ---------- */
.res-badge {
  display: inline-block; padding: 4px 12px; border-radius: 2px;
  font-size: .8em; font-weight: 600; letter-spacing: .02em; white-space: nowrap;
  text-decoration: none;
}
.res-gagne  { background: #e8f3e9; color: #2e7d39; border: 1px solid #bcd9bf; }
.res-perdu  { background: #f7e9e9; color: #a33030; border: 1px solid #dfc0c0; }
.res-neutre { background: #f2f2f2; color: #333;    border: 1px solid #d5d5d5; }
a.res-badge.res-neutre:hover { border-color: var(--noir); color: var(--noir); text-decoration: none; }

/* ---------- Étiquette « Nouveau » (boutique) ---------- */
.badge-nouveau {
  position: absolute; top: 10px; left: 10px; z-index: 5;
  background: var(--gold); color: var(--navy);
  font-size: .66em; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  padding: 3px 10px; border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}
/* en vue liste : coin de la photo (à droite il couvrait le prix) */
.bq-ligne .badge-nouveau { left: 4px; right: auto; top: 4px; font-size: .58em; padding: 2px 7px; }

/* ---------- Pagination numérotée ---------- */
.pgn {
  display: flex; gap: 8px; justify-content: center; align-items: center;
  flex-wrap: wrap; margin-top: 44px;
}
.pgn-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 48px; min-height: 48px; padding: 0 10px;
  border: 1px solid var(--navy); border-radius: 2px;
  color: var(--navy); text-decoration: none; font-weight: 600;
  font-variant-numeric: tabular-nums;
}
a.pgn-btn:hover { background: var(--navy); color: var(--white); }
.pgn-actif { background: var(--navy); color: #fff; cursor: default; }
.pgn-dots { color: var(--text-soft); padding: 0 2px; }

/* ---------- Notice flottante (retour d'offre) ---------- */
.notice-toast {
  position: fixed; top: 110px; left: 50%; transform: translateX(-50%);
  z-index: 600; width: max-content; max-width: min(92vw, 660px);
  background: #fff;
  box-shadow: 0 14px 38px rgba(0, 0, 0, .28);
  animation: lp-toast-in .3s ease;
}
@keyframes lp-toast-in {
  from { opacity: 0; transform: translate(-50%, -10px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}

/* Compte client — « Bienvenue Madame Dupont » : civilité et nom ne se séparent jamais.
   Le bloc passe à la ligne entier s'il ne tient pas ; ellipse si le nom seul dépasse. */
.compte-bienvenue-nom {
  display: inline-block; max-width: 100%; vertical-align: bottom;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Rappel de l'offre déjà passée par le client, directement sur le lot.
   Volontairement lisible : la clientèle ne doit pas avoir à la chercher dans son compte. */
.lot-mon-offre {
  margin: 0 0 6px; padding: 5px 10px;
  background: var(--cream, #f4eee2);
  border-left: 3px solid var(--navy, #16325c);
  font-size: .95em; font-weight: 700; color: var(--navy, #16325c);
}

/* Favoris du compte : le formulaire d'offre dans une carte étroite.
   « Faire une offre » / « Modifier mon offre » est bien plus long qu'« Acheter » et se
   faisait couper par l'overflow:hidden de .lot-bid. Le champ rétrécit et le libellé peut
   passer sur deux lignes plutôt que d'être tronqué.
   Le bouton « Acheter » seul (.lot-bid-seul) n'est PAS touché : sa largeur pleine carte
   est une référence validée. */
.bq-grille .lot-bid:not(.lot-bid-seul) input {
  flex: 0 1 76px; width: 76px;
}
.bq-grille .lot-bid:not(.lot-bid-seul) .btn {
  min-width: 0; padding: 0 6px;
  white-space: normal; line-height: 1.15; letter-spacing: .02em;
}

/* Badge du marteau : nettement plus petit que celui du panier.
   Le badge standard fait 24 px pour une icône de 25 px : posé sur le marteau, il le
   recouvrait entièrement et on ne voyait plus le dessin. Ici 18 px, décalé vers
   l'extérieur, pour que la silhouette du marteau reste lisible. */
.marteau-badge {
  min-width: 18px; height: 18px; padding: 0 4px;
  top: -7px; right: -7px;
  border-radius: 9px;
  font-size: .58em; letter-spacing: 0;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .28);
}

/* Plan d'accès de la page contact — repris de societe.html (ancien site),
   posé sur toute la largeur sous les deux colonnes. */
.ct-map-titre { margin-top: 46px; }
.ct-map { border: 1px solid var(--line); }
.ct-map iframe { display: block; width: 100%; height: 420px; border: 0; }
.ct-map-lien { text-align: right; font-size: .82em; margin: 8px 0 0; }
.ct-map-lien a { color: var(--text-soft); }
@media (max-width: 700px) {
  .ct-map iframe { height: 300px; }
}

/* Menu catégories : une catégorie seule (.cat-solo) reçoit la même flèche et le même retrait
   que les groupes dépliables, pour être alignée sur eux (11/09/2026). La flèche ne s'ouvre pas :
   c'est un lien direct. */
.cat-menu a.cat-solo { justify-content: flex-start; align-items: center; gap: 8px; padding-left: 14px; }
.cat-menu a.cat-solo::before { content: '\25B8'; flex: none; }
.cat-menu a.cat-solo > span:first-of-type { flex: 1; }
.cat-menu a.cat-solo .cat-count { margin-left: auto; color: #333; font-weight: 400; }

/* Compte > Mes ordres d'achat : tout visible sans défilement horizontal (11/09/2026).
   Cellules resserrées, carte pleine largeur, et le formulaire « montant + Modifier » peut
   passer à la ligne plutôt que de forcer une barre de défilement. */
.ordres-card { max-width: none; }
.ordres-wrap { overflow-x: visible; }
table.ordres-table th, table.ordres-table td { padding: 12px 10px; vertical-align: middle; }
table.ordres-table td:last-child { text-align: right; }
.ordres-table .ordre-modif-form { flex-wrap: wrap; }
.ordres-table .ordre-montant { width: 78px; }
.ordres-table .ordre-btn { padding: 4px 10px; letter-spacing: .06em; }

/* Formulaire d'offre (champ + bouton) : libellé toujours centré dans le bouton, même long
   (« Modifier mon offre ») — il peut passer sur 2 lignes plutôt que de coller au bord. */
.lot-bid:not(.lot-bid-seul) .btn {
  justify-content: center; text-align: center;
  min-width: 0; white-space: normal; line-height: 1.15;
}

/* Accueil — les 3 boutons sous « Lots à la une », plus compacts (14/09/2026) */
.lots-une-actions { gap: 12px 14px; }
.lots-une-actions .btn { min-height: 42px; padding: 8px 20px; font-size: .7em; letter-spacing: .12em; }

/* Mobile : les 3 boutons empilés, tous de la même largeur (15/09/2026) —
   en ligne ils prenaient chacun la largeur de leur texte et paraissaient dépareillés. */
@media (max-width: 600px) {
  .lots-une-actions { flex-direction: column; align-items: stretch; gap: 10px; max-width: 340px; margin-left: auto; margin-right: auto; }
  .lots-une-actions .btn { width: 100%; min-height: 46px; }
}

/* ---------- Très petits écrans (≤350px : iPhone SE 1re gén., Android compacts) ----------
   22/09/2026 : même avec le logo ramené à 38px, l'en-tête a besoin de ~345px
   (marges + burger + logo + 3 icônes). En dessous, l'icône du panier repassait hors
   écran — et sans défilement horizontal, impossible d'aller la chercher. On resserre
   donc logo et espacements uniquement dans cette plage ; 360px et 375px gardent
   l'en-tête normal, qui y tient déjà. */
@media (max-width: 350px) {
  .hd-logo img { height: 32px; }
  .header-inner { gap: 10px; }
  .hd-icones { gap: 10px; }
}

/* ---------- Avis clients (Google) — accueil ----------
   23/09/2026 : carrousel d'avis 5 étoiles, sélectionnés à la main (vrais avis publics
   Google, cf. maps.google.com — 4,8/5 sur 103 avis). Volontairement PAS de widget tiers
   ni d'API Google côté client : le site annonce "aucun suivi publicitaire" dans son
   bandeau cookies (inc/footer.php), un script d'avis externe contredirait cette promesse.
   Réutilise tel quel le mécanisme de .lots-carousel (JS de site.js, zéro ligne ajoutée) :
   même défilement auto, mêmes flèches, même adaptation 1/2/3/4 par écran. Chaque carte
   porte les DEUX classes "lot-card avis-card" — .lot-card fournit toute la mécanique
   (le sélecteur JS .lots-car-track > .lot-card, la taille flex, le survol), .avis-card
   ne fait qu'écraser le padding-bottom:88px (réservé au bouton d'achat, inutile ici)
   et poser le style propre aux avis (étoiles, citation, nom). */
.avis-note { text-align: center; color: #333; font-size: .92em; margin: 8px 0 0; }
.avis-note strong { color: var(--noir); font-weight: 700; }
.avis-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.avis-note a:hover { color: var(--noir); }
/* 23/09/2026 : border-width à 2px (au lieu du 1px hérité de .lot-card) — à l'échelle
   Windows 125 % (déjà rencontrée sur ce projet), 1px de bordure devient une valeur
   fractionnaire (0,8px) que les navigateurs arrondissent différemment selon le bord,
   et le bord du bas disparaissait le plus souvent. 2px résiste à cet arrondi. Peu
   visible sur .lot-card (la photo domine), mais très visible ici (fond blanc, texte). */
.avis-card { padding: 30px 28px 26px; display: flex; flex-direction: column; gap: 16px; border-width: 2px; }
.avis-etoiles { color: var(--noir); font-size: 1.05em; letter-spacing: 3px; line-height: 1; }
.avis-texte {
  font-family: "Cormorant Garamond", Georgia, serif; font-style: italic;
  font-size: 1.14em; line-height: 1.55; color: var(--text); flex: 1; margin: 0;
}
.avis-texte::before { content: "\201C"; }
.avis-texte::after { content: "\201D"; }
.avis-auteur {
  font-size: .74em; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #767676; margin: 0;
}
.avis-lien { text-align: center; margin-top: 26px; }

/* ===== Boutique lapostale-vo.com (26/10/2026) ===== */
.bq-entete { display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 18px; background:var(--white); border-bottom:1px solid #e2e2e2; }
.bq-entete[hidden] { display:none; }
.bq-entete img { height:38px; width:auto; display:block; }
.bq-entete a.bq-retour { font-size:.95em; color:var(--navy); text-decoration:underline; }
.bq-flash { margin:0 0 16px; padding:12px 16px; border-left:4px solid var(--danger, #a40000); background:#fbf3f3; }
.bq-mode-off { opacity:.55; cursor:not-allowed; }
.bq-mode-off em { font-style:normal; font-weight:700; }
.bq-titre { position:sticky; top:0; z-index:200; background:var(--white); padding:10px 0;
  border-bottom:1px solid #e2e2e2; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.bq-titre-ligne { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.bq-titre h1 { font-family:"Cormorant Garamond", Georgia, serif; font-size:1.8em; font-weight:600; margin:0; line-height:1.1; }
.bq-sous-titre { margin:12px auto 6px; color:var(--text-soft); }
.bq-titre .bq-panier-btn { position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; margin:0; flex:0 0 auto; color:var(--navy); background:var(--white);
  border:1px solid var(--navy); text-decoration:none; }
.bq-titre .bq-panier-btn:hover, .bq-titre .bq-panier-btn:focus { background:var(--navy); color:#fff; }
.bq-titre .bq-panier-btn .bq-badge { position:absolute; top:-9px; right:-9px; display:inline-flex; align-items:center;
  justify-content:center; min-width:22px; height:22px; padding:0 5px; background:#751d1c; color:#fff;
  font-size:.8em; font-weight:700; line-height:1; }
@media (max-width:600px) { .bq-titre h1 { font-size:1.4em; } .bq-titre .bq-panier-btn { width:44px; height:44px; } }
/* le menu de categories reste colle sous la barre fixe */
.bq-titre ~ .section .cat-menu { top:76px; max-height:calc(100vh - 92px); }
/* Regle du patron : aucun coin arrondi. */
*, *::before, *::after { border-radius: 0 !important; }

/* ---------- Mobile : les timbres d'abord (29/10/2026) ----------
   Avant : la liste des categories et la recherche remplissaient le premier ecran, le premier timbre
   etait a ~900 px (hors ecran) et rien n'invitait a descendre. Maintenant : un bouton « Categories »
   replie la liste, la recherche tient sur une ligne, et un timbre apparait des le premier ecran.
   Limite a .vente-layout (page de la boutique) : le menu du compte (.compte-layout) n'est pas touche. */
.cat-toggle { display: none; }
@media (max-width: 950px) {
  .bq-sous-titre { margin: 8px auto 2px; font-size: .92em; line-height: 1.4; }
  .vente-layout { gap: 12px; }
  .vente-layout .cat-menu h2 { display: none; }
  .vente-layout .cat-toggle {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    width: 100%; min-height: 50px; padding: 10px 16px; border: 0; background: var(--white);
    color: var(--noir); font-weight: 700; font-size: 1em; line-height: 1.3; font-family: inherit; text-align: left; cursor: pointer;
  }
  .vente-layout .cat-toggle .cat-courante { font-weight: 400; color: var(--text-soft); }
  .vente-layout .cat-toggle::after { content: '\25BE'; flex: none; font-size: 1.2em; }
  .vente-layout .cat-menu.cat-ouvert .cat-toggle::after { content: '\25B4'; }
  .vente-layout .cat-menu:not(.cat-ouvert) nav { display: none; }
  .vente-layout .cat-menu.cat-ouvert nav { max-height: 60vh; border-top: 1px solid var(--line); }
  .vente-main .lot-search { flex-wrap: nowrap !important; gap: 8px; margin-bottom: 12px !important; }
  .vente-main .lot-search input { min-width: 0; }
  .vente-main .lot-search .btn { width: auto !important; flex: none; padding: 8px 14px; }
}

/* ---------- Mobile : panier et fiche d'un lot (29/10/2026) ---------- */
@media (max-width: 600px) {
  /* Panier : la table des lots depassait l'ecran et cachait « Retirer » a droite -> une carte par lot */
  .panier-lots thead { display: none; }
  .panier-lots, .panier-lots tbody, .panier-lots tfoot, .panier-lots tr { display: block; width: 100%; }
  .panier-lots tbody tr { position: relative; padding: 14px 14px 12px; border-bottom: 1px solid var(--line); }
  .panier-lots tbody td { display: block; padding: 0; border: 0; text-align: left; }
  .panier-lots tbody td:nth-child(1) { font-weight: 700; margin-bottom: 4px; }
  .panier-lots tbody td:nth-child(2) { margin-bottom: 8px; line-height: 1.4; }
  .panier-lots tbody td.price-cell { display: inline-block; font-size: 1.1em; }
  .panier-lots tbody td:last-child { position: absolute; right: 14px; bottom: 8px; }
  .panier-lots tbody td:last-child a { display: inline-block; padding: 10px 6px; }
  .panier-lots tfoot tr { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 14px; border-bottom: 1px solid var(--line); }
  .panier-lots tfoot td { display: block; padding: 0; border: 0; width: auto; background: transparent; }
  .panier-lots tfoot tr:nth-child(even) { background: var(--cream); }
  .panier-lots tfoot td:empty { display: none; }
}
@media (max-width: 950px) {
  /* Fiche d'un lot : le bouton « Acheter » reste visible en bas de l'ecran (il etait a 850 px, hors ecran) */
  .fiche-action { position: sticky; bottom: 0; z-index: 40; background: var(--white); padding: 10px 0; margin-top: 8px; border-top: 1px solid var(--line); }
  .bq-retour-lot { display: inline-block; padding: 10px 0; }
  .fiche-prix-bloc { display: flex; flex-direction: column; }
  .fiche-prix-bloc .fiche-principal, .fiche-prix-bloc .fiche-vendu { order: -1; }
}