/* ──────────────────────────────────────────────────────────────────
   Bazillais, Fauteuil Club - styles de production
   Repris de design-source/styles.css + le reset/body/titres de
   design-source/index.html. Regles .bz-tweak-* et .ph retirees
   (outils de maquette, inutiles en production).
   ────────────────────────────────────────────────────────────────── */

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-sans);
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  transition:background-color .4s ease,color .4s ease;
}
h1,h2,h3,h4{font-family:var(--font-serif);font-weight:400;margin:0;letter-spacing:-.01em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::selection{background:var(--accent);color:var(--bg)}

/* garder --bg/--accent/etc. synchronises avec public/assets/css/admin.css :root
   (fichiers volontairement separes, cf. decision 2026-09-04) */
:root{
  --bg:#f4efe6;
  --surface:#ebe3d4;
  --ink:#2b1d12;
  --sub:#6b5a48;
  --accent:#955127;
  --rule:#d9cdb8;

  --font-serif:"Cormorant Garamond", "Times New Roman", serif;
  --font-sans:"Manrope", ui-sans-serif, system-ui, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, monospace;

  --hero-size:clamp(48px, 6.4vw, 104px);
  --hero-leading:1.02;
  --hero-weight:400;

  --section-y:120px;
  --gutter:32px;
  --max-w:1280px;
}

/* layout helpers */
.bz-section{
  max-width:var(--max-w);
  margin:0 auto;
  padding:var(--section-y) var(--gutter);
}
.bz-section-head{ max-width:780px; margin-bottom:64px }
.bz-section-head-row{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:64px;
  max-width:none;
  align-items:end;
}
.bz-section-head h2{
  font-size:clamp(36px, 4.4vw, 64px);
  font-weight:var(--hero-weight);
  line-height:1.05;
  letter-spacing:-.015em;
}
.bz-section-head em{ color:var(--accent); font-style:italic }
.bz-section-head-aside{
  font-size:14px;
  color:var(--sub);
  max-width:32ch;
  line-height:1.6;
  padding-bottom:6px;
}
.bz-section-head-note{
  display:block;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--rule);
  font:500 11px/1.5 var(--font-sans);
  letter-spacing:.04em;
  font-style:italic;
  color:color-mix(in oklab, var(--sub) 80%, var(--bg));
}

/* eyebrow + lead/body */
.bz-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font:500 10.5px/1 var(--font-sans);
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--sub);
  margin-bottom:32px;
}
.bz-eyebrow-dot{
  width:6px;height:6px;border-radius:999px;background:var(--accent);
  flex:0 0 6px;
}

.bz-lead{
  font-family:var(--font-serif);
  font-size:clamp(20px, 1.6vw, 26px);
  font-style:italic;
  line-height:1.45;
  color:var(--ink);
  margin-bottom:24px;
  font-weight:400;
}
.bz-body{
  font-size:15.5px;
  line-height:1.7;
  color:var(--sub);
  max-width:50ch;
}

/* ── HERO ───────────────────────────────────────────────────────── */
.bz-hero{
  position:relative;
  background:var(--bg);
  min-height:100vh;
  display:flex;flex-direction:column;
}

.bz-nav{
  display:flex;justify-content:flex-start;align-items:flex-start;gap:64px;
  padding:32px var(--gutter);
  max-width:var(--max-w);
  width:100%;
  margin:0 auto;
}
.bz-nav--spread{ justify-content:space-between }
.bz-nav-links{
  display:flex;gap:36px;
  font:500 12px/1 var(--font-sans);
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink);
  padding-top:18px;
}
.bz-nav-links a{ opacity:.7; transition:opacity .2s }
.bz-nav-links a:hover{ opacity:1 }
.bz-nav-links a.is-active{ opacity:1; color:var(--accent) }

/* ── LOGO LOCKUP (pure CSS) ─────────────────────────────────────── */
.bz-logo{
  display:inline-flex; flex-direction:column; align-items:center;
  gap:0;
  text-align:center;
  color:var(--ink);
  --logo-name-size: 32px;
  --logo-sub-size:  13px;
  --logo-tag-size:  13px;
  --logo-since-size:10px;
  --logo-rule-w:    180px;
}
.bz-logo--large{
  --logo-name-size: 56px;
  --logo-sub-size:  18px;
  --logo-tag-size:  19px;
  --logo-since-size:13px;
  --logo-rule-w:    280px;
}
.bz-logo-name{
  font-family:var(--font-serif);
  font-weight:500;
  font-size:var(--logo-name-size);
  letter-spacing:.10em;
  line-height:1;
}
.bz-logo-rule{
  display:flex; align-items:center; justify-content:center;
  gap:10px;
  width:var(--logo-rule-w);
  margin:.55em 0 .45em;
}
.bz-logo-line{
  flex:1;
  height:1px;
  background:var(--accent);
}
.bz-logo-diamond{
  width:6px;height:6px;
  background:var(--accent);
  transform:rotate(45deg);
  flex:0 0 6px;
}
.bz-logo-sub{
  font-family:var(--font-sans);
  font-weight:600;
  font-size:var(--logo-sub-size);
  letter-spacing:.36em;
  /* compensate for the right-side spacing so the word reads centred */
  padding-left:.36em;
  line-height:1;
  color:var(--ink);
}
.bz-logo-tag{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
  font-size:var(--logo-tag-size);
  line-height:1.2;
  margin-top:.9em;
  color:var(--ink);
  white-space:nowrap;
}
.bz-logo-since{
  display:flex; align-items:center; justify-content:center;
  gap:12px;
  margin-top:.6em;
}
.bz-logo-since-line{
  width:24px; height:1px; background:var(--accent);
}
.bz-logo-since-text{
  font-family:var(--font-sans);
  font-weight:600;
  font-size:var(--logo-since-size);
  letter-spacing:.32em;
  padding-left:.32em;
  color:var(--accent);
}
/* nav-overlay (plein hero) inverts the lockup */
.bz-nav-overlay .bz-logo-name,
.bz-nav-overlay .bz-logo-sub,
.bz-nav-overlay .bz-logo-tag{ color:#f6f1e7 }
.bz-nav-overlay .bz-logo-line,
.bz-nav-overlay .bz-logo-diamond,
.bz-nav-overlay .bz-logo-since-line{ background:#e2c89a }
.bz-nav-overlay .bz-logo-since-text{ color:#e2c89a }

/* hero split - full bleed image right, text left aligned to page max-w */
.bz-hero-split .bz-hero-grid{
  flex:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  width:100%;
  min-height:100vh;
}
.bz-hero-left{
  display:flex;
  flex-direction:column;
  padding-left: min(64px, max(var(--gutter), calc((100vw - var(--max-w)) / 2)));
  padding-right:56px;
  background:var(--bg);
}
.bz-hero-split .bz-nav{
  padding:32px 0;
  max-width:none;
  margin:0;
  width:100%;
}
.bz-hero-text{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:24px 0;
  max-width:none;
}
.bz-hero-text > *{ max-width:560px }
.bz-hero-text h1{
  font-size:var(--hero-size);
  line-height:var(--hero-leading);
  font-weight:var(--hero-weight);
  margin-bottom:32px;
  max-width:none;
}
.bz-hero-text h1 em{ color:var(--accent); font-style:italic }
.bz-hero-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding:24px 0;
  border-top:1px solid var(--rule);
  font:500 11px/1 var(--font-sans);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--sub);
}
.bz-hero-bottom-scroll{ color:var(--accent) }

.bz-hero-image{
  position:relative;
  width:100%;
  z-index:0;
}
.bz-hero-left{
  position:relative;
  z-index:1;
}
.bz-hero-photo{
  width:100%;
  height:100%;
  min-height:520px;
  border-radius:0;
  object-fit:cover;
  background-size:cover;
  background-position:center;
  filter:brightness(.88) saturate(.88);
}
/* fondu cream -> photo : compositing par calque plutot que masque,
   pour pouvoir superposer sur mobile un second degrade sombre distinct */
.bz-hero-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(to right,
    rgba(244,239,230,1)   0%,
    rgba(244,239,230,.94) 18%,
    rgba(244,239,230,.72) 34%,
    rgba(244,239,230,.4)  50%,
    rgba(244,239,230,.12) 65%,
    rgba(244,239,230,0)   78%);
}
.bz-hero-meta{
  position:absolute; bottom:32px; right:32px; left:auto;
  z-index:3;
  display:flex; gap:16px;
  font:400 11px/1 var(--font-mono);
  letter-spacing:.04em;
  color:#f6f1e7;
  background:rgba(20,15,10,.55);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  padding:8px 14px;
  border:1px solid rgba(246,241,231,.2);
}

.bz-hero-centre .bz-hero-centre-inner{
  flex:1;
  max-width:var(--max-w);width:100%;
  margin:0 auto;
  padding:48px var(--gutter) 64px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;
}
.bz-hero-centre h1{
  font-size:var(--hero-size);
  line-height:var(--hero-leading);
  font-weight:var(--hero-weight);
  margin-bottom:24px;
}
.bz-hero-centre h1 em{ color:var(--accent); font-style:italic }
.bz-hero-centre .bz-lead{ max-width:32ch; margin-bottom:48px; }
.bz-hero-centre-photo{
  width:100%;
  flex:1;
  min-height:50vh;
  margin-bottom:48px;
  border-radius:2px;
  background-size:cover;
  background-position:center;
}
.bz-hero-centre-foot{
  display:flex; gap:48px; align-items:center;
  flex-wrap:wrap;
  justify-content:center;
}

/* hero plein */
.bz-hero-plein{
  min-height:min(960px, 100vh);
  color:#f6f1e7;
  isolation:isolate;
  overflow:hidden;
}
.bz-hero-plein-img{
  position:absolute;inset:0;
  z-index:-2;
  background-size:cover;
  background-position:center;
}
.bz-hero-plein-veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(20,15,10,.55) 0%,
    rgba(20,15,10,.25) 35%,
    rgba(20,15,10,.20) 60%,
    rgba(20,15,10,.75) 100%);
  z-index:-1;
}
.bz-nav-overlay{ color:#f6f1e7 }
.bz-nav-overlay .bz-logo-name{ color:#f6f1e7 }
.bz-nav-overlay .bz-logo-sub{ color:#e2c89a }
.bz-nav-overlay .bz-logo-rule span:not(.bz-logo-dot){ background:rgba(246,241,231,.3) }
.bz-nav-overlay .bz-nav-links{ color:#f6f1e7 }
.bz-hero-plein-content{
  flex:1;
  max-width:var(--max-w); width:100%;
  margin:0 auto;
  padding:32px var(--gutter) 64px;
  display:flex;flex-direction:column;justify-content:flex-end;
  gap:64px;
}
.bz-hero-plein-block{ max-width:680px }
.bz-hero-plein-block .bz-eyebrow{
  color:#f6f1e7;
}
.bz-hero-plein-block .bz-eyebrow-dot{ background:#e2c89a }
.bz-hero-plein-block h1{
  font-size:var(--hero-size);
  line-height:var(--hero-leading);
  font-weight:var(--hero-weight);
  margin-bottom:24px;
}
.bz-hero-plein-block h1 em{ color:#e2c89a; font-style:italic }
.bz-hero-plein-block .bz-lead{ color:#e2dbc9; margin-bottom:32px }
.bz-hero-plein-foot{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:24px;
  border-top:1px solid rgba(246,241,231,.2);
  font:500 12px/1 var(--font-sans);
  letter-spacing:.1em;
}
.bz-hero-plein-where{ color:#e2c89a; text-transform:uppercase; font-size:11px }

/* stars */
.bz-stars{
  display:inline-flex;align-items:center;gap:8px;
  font:500 13px/1 var(--font-sans);
  margin-bottom:32px;
  color:var(--ink);
}
.bz-stars-row{ color:var(--accent); letter-spacing:1px; font-size:14px }
.bz-stars-sep{ opacity:.4; margin:0 2px }
.bz-stars-meta{ color:var(--sub) }
.bz-stars-arrow{
  display:inline-block;margin-left:6px;
  transition:transform .25s;
  color:var(--sub);
}
.bz-stars:hover .bz-stars-arrow{ transform:translateX(4px) }

/* hero plein stars */
.bz-hero-plein .bz-stars{ color:#f6f1e7; margin-bottom:0 }
.bz-hero-plein .bz-stars-row{ color:#e2c89a }
.bz-hero-plein .bz-stars-meta{ color:#c9b48a }

/* buttons */
.bz-cta-group{
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;
}
.bz-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 26px;
  font:500 12.5px/1 var(--font-sans);
  letter-spacing:.14em;
  text-transform:uppercase;
  border-radius:2px;
  border:1px solid transparent;
  cursor:pointer;
  transition:background-color .2s, color .2s, border-color .2s, transform .2s;
}
.bz-btn-primary{
  background:var(--ink);color:var(--bg);
  border-color:var(--ink);
}
.bz-btn-primary:hover{
  background:var(--accent);
  border-color:var(--accent);
}
.bz-btn-ghost{
  background:transparent;
  color:var(--ink);
  border-color:var(--rule);
}
.bz-btn-ghost:hover{ border-color:var(--ink) }
.bz-btn-ghost-dot{
  width:8px;height:8px;border-radius:999px;
  background:#3aa15a;
  box-shadow:0 0 0 3px color-mix(in oklab, #3aa15a 20%, transparent);
}
.bz-btn-block{ width:100%; justify-content:center; padding:18px 26px }

/* tertiary CTA - Leboncoin escape hatch */
.bz-cta-alt{
  display:inline-flex; align-items:center; gap:10px;
  margin-top:18px;
  padding:0;
  font:500 12px/1 var(--font-sans);
  letter-spacing:.04em;
  color:var(--sub);
  transition:color .2s;
}
.bz-cta-alt:hover{ color:var(--ink) }
.bz-cta-alt-prefix{
  color:var(--accent);
  font-weight:600;
  font-style:italic;
  font-family:var(--font-serif);
  font-size:14px;
  letter-spacing:0;
}
.bz-cta-alt-text{
  border-bottom:1px solid color-mix(in oklab, var(--sub) 35%, transparent);
  padding-bottom:2px;
  transition:border-color .2s;
}
.bz-cta-alt:hover .bz-cta-alt-text{ border-color:var(--ink) }
.bz-cta-alt-tag{
  font:400 10px/1 var(--font-mono);
  letter-spacing:.06em;
  text-transform:lowercase;
  color:var(--accent);
  padding:4px 7px;
  border:1px solid color-mix(in oklab, var(--accent) 35%, transparent);
  border-radius:2px;
}
.bz-cta-alt-arrow{
  font-size:13px;
  transition:transform .25s;
  color:var(--accent);
}
.bz-cta-alt:hover .bz-cta-alt-arrow{ transform:translate(2px,-2px) }

.bz-cta-alt--inline{ margin-top:0 }

/* dark plein hero variant */
.bz-hero-plein .bz-cta-alt{ color:#c9b48a }
.bz-hero-plein .bz-cta-alt:hover{ color:#f6f1e7 }
.bz-hero-plein .bz-cta-alt-prefix{ color:#e2c89a }
.bz-hero-plein .bz-cta-alt-text{ border-color:rgba(226,200,154,.4) }
.bz-hero-plein .bz-cta-alt:hover .bz-cta-alt-text{ border-color:#f6f1e7 }
.bz-hero-plein .bz-cta-alt-tag{ color:#e2c89a; border-color:rgba(226,200,154,.4) }
.bz-hero-plein .bz-cta-alt-arrow{ color:#e2c89a }
.bz-hero-plein .bz-btn-primary{
  background:#e2c89a; color:#1a1107; border-color:#e2c89a;
}
.bz-hero-plein .bz-btn-primary:hover{
  background:#f6f1e7; border-color:#f6f1e7;
}
.bz-hero-plein .bz-btn-ghost{
  color:#f6f1e7; border-color:rgba(246,241,231,.3);
}
.bz-hero-plein .bz-btn-ghost:hover{ border-color:#f6f1e7 }

/* inline link */
.bz-inline-link{
  display:inline-flex;align-items:center;gap:10px;
  font:500 13px/1 var(--font-sans);
  letter-spacing:.04em;
  color:var(--accent);
  padding-bottom:6px;
  border-bottom:1px solid color-mix(in oklab, var(--accent) 40%, transparent);
  margin-top:12px;
  transition:color .2s, border-color .2s;
}
.bz-inline-link span{ transition:transform .25s }
.bz-inline-link:hover{ color:var(--ink); border-color:var(--ink) }
.bz-inline-link:hover span{ transform:translateX(4px) }

/* ── HISTOIRE ───────────────────────────────────────────────────── */
.bz-histoire{
  border-top:1px solid var(--rule);
}
.bz-histoire-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:80px;
  align-items:start;
}
.bz-histoire-prose .bz-lead{ margin-bottom:32px }
.bz-histoire-prose p:not(.bz-lead){
  font-size:16px;line-height:1.7;color:var(--sub);
  margin-bottom:20px;max-width:54ch;
}
.bz-histoire-side{ display:flex;flex-direction:column;gap:48px }
.bz-histoire-img{
  width:100%;aspect-ratio:4/5;
  background-size:cover;
  background-position:center;
  background-color:var(--surface);
}
.bz-stats{
  display:flex;flex-direction:column;gap:0;
  margin:0;padding:0;
  border-top:1px solid var(--rule);
}
.bz-stats > div{
  display:grid;
  grid-template-columns:140px 1fr;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid var(--rule);
}
.bz-stats dt{
  font:400 36px/1 var(--font-serif);
  color:var(--ink);
  letter-spacing:-.01em;
}
.bz-stats dd{
  margin:0;
  font-size:14px;line-height:1.55;color:var(--sub);
}

/* ── MATIÈRES ───────────────────────────────────────────────────── */
.bz-matieres{
  background:var(--surface);
  max-width:none;
  padding-left:0;padding-right:0;
}
.bz-matieres > *{
  max-width:var(--max-w);
  margin-left:auto;margin-right:auto;
  padding-left:var(--gutter);padding-right:var(--gutter);
}
.bz-matieres-list{
  list-style:none; margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter);
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:64px 56px;
  margin-bottom:96px;
}
.bz-matiere{
  position:relative;
  padding-top:32px;
  border-top:1px solid var(--rule);
}
.bz-matiere-n{
  display:block;
  font:400 12px/1 var(--font-mono);
  color:var(--accent);
  letter-spacing:.1em;
  margin-bottom:20px;
}
.bz-matiere h3{
  font-size:24px;
  line-height:1.2;
  margin-bottom:14px;
  font-weight:500;
  max-width:24ch;
}
.bz-matiere p{
  font-size:15px;line-height:1.65;color:var(--sub);
  max-width:42ch;
}
.bz-matieres-strip{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.bz-matieres-img{
  width:100%;
  aspect-ratio:1/1;
  background-size:cover;
  background-position:center;
  background-color:var(--bg);
}

/* ── PIÈCES RÉCENTES ────────────────────────────────────────────── */
.bz-pieces{ }
.bz-collection h1{ margin-bottom:40px }
.bz-pieces-grid{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:24px;
  margin-bottom:64px;
}
.bz-piece{ position:relative; display:flex; flex-direction:column; gap:14px }
.bz-piece-img{
  width:100%;
  background-size:cover;
  background-position:center;
  background-color:var(--surface);
  border-radius:2px;
}
.bz-piece-cap{ display:flex; flex-direction:column; gap:6px }
.bz-piece-cap-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin-bottom:4px;
}
.bz-piece-n{
  font:400 11px/1 var(--font-mono);
  color:var(--accent);
  letter-spacing:.08em;
}
.bz-piece-price{
  font:500 12px/1 var(--font-sans);
  letter-spacing:.06em;
  color:var(--ink);
  padding:5px 9px;
  background:color-mix(in oklab, var(--accent) 12%, var(--bg));
  border:1px solid color-mix(in oklab, var(--accent) 22%, var(--rule));
  border-radius:2px;
  white-space:nowrap;
}
.bz-piece h3{
  font-size:20px;
  font-weight:500;
  line-height:1.25;
}
.bz-piece p{
  font-size:13.5px;
  line-height:1.5;
  color:var(--sub);
}

/* asymmetric editorial layout, 5 pieces:
   row 1: WIDE (7) + TALL (5)   - tall spans 2 rows
   row 2: WIDE (7)              - tall still occupying its 5
   row 3: NARROW (6) + NARROW (6)
*/
.bz-piece--wide  { grid-column: span 7 }
.bz-piece--tall  { grid-column: span 5; grid-row: span 2 }
.bz-piece--narrow{ grid-column: span 6 }

.bz-piece--wide .bz-piece-img  { aspect-ratio:16/10 }
.bz-piece--tall .bz-piece-img  { aspect-ratio:3/4; flex:1 }
.bz-piece--narrow .bz-piece-img{ aspect-ratio:4/3 }

.bz-pieces-cta{
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  padding:32px 36px;
  border:1px solid var(--rule);
  border-radius:2px;
  flex-wrap:wrap;
}
.bz-pieces-cta-text{ display:flex; flex-direction:column; gap:6px }
.bz-pieces-cta-text p{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:22px;
  color:var(--ink);
}
.bz-pieces-cta-sub{
  font-size:13px;
  color:var(--sub);
  line-height:1.55;
}
.bz-pieces-cta-actions{
  display:flex; align-items:center; gap:24px; flex-wrap:wrap;
}

/* ── AVIS ───────────────────────────────────────────────────────── */
.bz-avis-aside{ display:flex;justify-content:flex-end;align-items:flex-end }
.bz-avis-score{
  text-align:right;
  padding:24px 0 24px 24px;
  border-left:1px solid var(--rule);
}
.bz-avis-num{
  font:400 88px/1 var(--font-serif);
  letter-spacing:-.02em;
  color:var(--ink);
}
.bz-avis-num span{
  font-size:24px; color:var(--sub); margin-left:4px;
}
.bz-avis-stars{
  color:var(--accent);font-size:18px;
  letter-spacing:3px;
  margin:8px 0 6px;
}
.bz-avis-meta{
  font:500 11px/1 var(--font-sans);
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--sub);
}
.bz-avis-list{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.bz-avis-card{
  background:var(--surface);
  padding:32px;
  border-radius:2px;
  display:flex;flex-direction:column;gap:16px;
}
.bz-avis-stars-sm{
  color:var(--accent);letter-spacing:2px;font-size:13px;
}
.bz-avis-card p{
  font-family:var(--font-serif);
  font-size:19px;line-height:1.5;
  font-style:italic;
  color:var(--ink);
  flex:1;
}
.bz-avis-card footer{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  font:500 12px/1 var(--font-sans);
  letter-spacing:.04em;
  color:var(--sub);
  padding-top:8px;
  border-top:1px solid var(--rule);
}
.bz-avis-name{ color:var(--ink) }
.bz-avis-sep{ opacity:.4 }
.bz-avis-when{ margin-left:auto; color:var(--sub); font-style:italic; opacity:.7 }

/* ── CONTACT ────────────────────────────────────────────────────── */
.bz-contact{
  background:var(--ink);
  color:var(--bg);
  max-width:none;
  padding-left:0;padding-right:0;
}
.bz-contact-grid{
  max-width:var(--max-w);
  margin:0 auto;
  padding:0 var(--gutter);
  display:grid;
  grid-template-columns:.85fr 1fr;
  gap:80px;
  align-items:start;
}
.bz-contact-side .bz-eyebrow{
  color:color-mix(in oklab, var(--bg) 70%, transparent);
}
.bz-contact-side h2{
  font-size:clamp(34px, 4vw, 56px);
  line-height:1.05;
  color:var(--bg);
  margin-bottom:24px;
}
.bz-contact-side .bz-lead{ color:color-mix(in oklab, var(--bg) 78%, transparent); margin-bottom:40px }
.bz-phone{
  display:block;
  padding:24px 28px;
  background:color-mix(in oklab, var(--bg) 8%, transparent);
  border:1px solid color-mix(in oklab, var(--bg) 18%, transparent);
  border-radius:2px;
  margin-bottom:48px;
  transition:background-color .2s, border-color .2s;
}
.bz-phone:hover{
  background:color-mix(in oklab, var(--bg) 14%, transparent);
  border-color:color-mix(in oklab, var(--bg) 35%, transparent);
}
.bz-phone-label{
  display:block;
  font:500 10.5px/1 var(--font-sans);
  letter-spacing:.18em;text-transform:uppercase;
  color:#e2c89a;
  margin-bottom:10px;
}
.bz-phone-num{
  display:block;
  font:400 42px/1 var(--font-serif);
  letter-spacing:.04em;
  color:var(--bg);
}
.bz-contact-info{ margin:0;padding:0 }
.bz-contact-info > div{
  display:grid;grid-template-columns:140px 1fr;gap:24px;
  padding:18px 0;
  border-top:1px solid color-mix(in oklab, var(--bg) 14%, transparent);
}
.bz-contact-info > div:last-child{
  border-bottom:1px solid color-mix(in oklab, var(--bg) 14%, transparent);
}
.bz-contact-info dt{
  font:500 11px/1.4 var(--font-sans);
  letter-spacing:.12em;text-transform:uppercase;
  color:color-mix(in oklab, var(--bg) 60%, transparent);
}
.bz-contact-info dd{
  margin:0;
  font-size:14px;line-height:1.6;
  color:var(--bg);
}
.bz-contact-info a{ border-bottom:1px solid color-mix(in oklab, var(--bg) 25%, transparent) }
.bz-contact-info a:hover{ border-color:var(--bg) }

/* form */
.bz-form{
  background:color-mix(in oklab, var(--bg) 5%, transparent);
  border:1px solid color-mix(in oklab, var(--bg) 14%, transparent);
  border-radius:2px;
  padding:36px;
  display:flex;flex-direction:column;gap:20px;
}
.bz-form-head{
  display:flex;justify-content:space-between;align-items:center;
  font:500 11px/1 var(--font-sans);
  letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in oklab, var(--bg) 60%, transparent);
  padding-bottom:20px;
  border-bottom:1px solid color-mix(in oklab, var(--bg) 14%, transparent);
  margin-bottom:8px;
}
.bz-form-num{ font-family:var(--font-mono); letter-spacing:.04em }
.bz-field{ display:flex;flex-direction:column;gap:8px }
.bz-field-row{ display:grid;grid-template-columns:1fr 1fr;gap:16px }
.bz-field label{
  font:500 10.5px/1 var(--font-sans);
  letter-spacing:.16em;text-transform:uppercase;
  color:color-mix(in oklab, var(--bg) 60%, transparent);
}
.bz-field input,
.bz-field textarea{
  width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid color-mix(in oklab, var(--bg) 22%, transparent);
  padding:10px 0;
  font:400 16px/1.4 var(--font-serif);
  color:var(--bg);
  resize:vertical;
}
.bz-field input:focus,
.bz-field textarea:focus{
  outline:0;
  border-bottom-color:var(--accent);
}
.bz-field textarea{ font-family:var(--font-sans); font-size:14px; min-height:100px }
.bz-field input::placeholder,
.bz-field textarea::placeholder{ color:color-mix(in oklab, var(--bg) 35%, transparent) }
.bz-chips{ display:flex;flex-wrap:wrap;gap:8px;padding-top:4px }
.bz-chip{
  appearance:none;cursor:pointer;
  background:transparent;
  border:1px solid color-mix(in oklab, var(--bg) 22%, transparent);
  color:color-mix(in oklab, var(--bg) 75%, transparent);
  padding:8px 14px;
  border-radius:999px;
  font:500 12px/1 var(--font-sans);
  letter-spacing:.04em;
  transition:background-color .2s, color .2s, border-color .2s;
}
.bz-chip:hover{ border-color:var(--bg); color:var(--bg) }
.bz-chip.is-on{
  background:var(--accent);
  border-color:var(--accent);
  color:var(--bg);
}
.bz-form .bz-btn-primary{
  background:var(--accent); border-color:var(--accent); color:var(--bg);
  margin-top:8px;
}
.bz-form .bz-btn-primary:hover{
  background:var(--bg); color:var(--ink); border-color:var(--bg);
}
.bz-form-foot{
  font-size:12.5px;color:color-mix(in oklab, var(--bg) 55%, transparent);
  text-align:center;
  font-style:italic;
}
.bz-form-sent{
  text-align:center; padding:24px 0;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.bz-form-sent-mark{
  width:48px;height:48px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--accent); color:var(--bg);
  font-size:22px;
}
.bz-form-sent h3{ font-size:28px }
.bz-form-sent p{
  font-size:14px;line-height:1.6;
  color:color-mix(in oklab, var(--bg) 75%, transparent);
  max-width:36ch;
}
.bz-form-sent .bz-btn-ghost{ color:var(--bg); border-color:color-mix(in oklab, var(--bg) 22%, transparent); margin-top:8px }
.bz-form-error{
  background:color-mix(in oklab, #c0392b 20%, transparent);
  border:1px solid color-mix(in oklab, #c0392b 45%, transparent);
  color:var(--bg);
  padding:14px 18px;
  border-radius:2px;
  font-size:13px;
  line-height:1.5;
}

/* ── FOOTER ─────────────────────────────────────────────────────── */
.bz-foot{
  border-top:1px solid var(--rule);
  padding:80px var(--gutter) 32px;
  max-width:var(--max-w);
  margin:0 auto;
}
.bz-foot-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:48px;
  padding-bottom:48px;
  min-width:0;
}
.bz-foot-grid > *{ min-width:0 }
.bz-foot-brand .bz-logo{ margin-bottom:24px }
.bz-foot-tagline{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:18px;
  color:var(--sub);
  max-width:36ch;
}
.bz-foot-col h4{
  font:500 11px/1 var(--font-sans);
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--sub);
  margin-bottom:16px;
}
.bz-foot-col p{
  font-size:14px;line-height:1.8;color:var(--ink);
}
.bz-foot-col a{ transition:color .2s }
.bz-foot-col a:hover{ color:var(--accent) }
.bz-foot-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:32px;
  border-top:1px solid var(--rule);
  font:500 11.5px/1 var(--font-sans);
  letter-spacing:.06em;
  color:var(--sub);
}
.bz-foot-legal{ display:flex;gap:24px }
.bz-foot-legal a:hover{ color:var(--accent) }

/* ── RESPONSIVE ─────────────────────────────────────────────────── */
@media (max-width: 980px){
  :root{ --section-y:80px; --gutter:24px }
  .bz-nav-links{ display:none }
  .bz-hero-split .bz-hero-grid{
    grid-template-columns:1fr;
    min-height:100dvh;
    position:relative;
  }
  .bz-hero-split .bz-hero-left{
    position:relative;
    z-index:2;
    background:transparent;
    min-height:100dvh;
    padding:20px var(--gutter) 0;
  }
  .bz-hero-split .bz-hero-image{
    position:absolute;
    inset:0;
    height:100%;
    z-index:0;
  }
  .bz-hero-split .bz-hero-photo{ min-height:0; height:100% }
  /* sur mobile, le texte se superpose a la photo au lieu de s'empiler dessous :
     un second degrade, sombre et monotone (jamais plus clair en descendant, sinon
     le milieu redevient illisible sur le titre), remplace le fondu cream->photo */
  .bz-hero-split .bz-hero-overlay{
    z-index:1;
    background:linear-gradient(to bottom,
      rgba(43,29,18,.35) 0%,
      rgba(43,29,18,.58) 14%,
      rgba(43,29,18,.72) 30%,
      rgba(43,29,18,.85) 100%);
  }
  .bz-hero-split .bz-hero-meta{ display:none }
  .bz-hero-split .bz-hero-text h1,
  .bz-hero-split .bz-logo-name,
  .bz-hero-split .bz-logo-sub{ color:var(--bg) }
  .bz-hero-split .bz-hero-text h1 em{ color:var(--bg) }
  .bz-hero-split .bz-lead{ color:rgba(244,239,230,.82) }
  .bz-hero-split .bz-eyebrow{
    color:rgba(244,239,230,.82);
  }
  .bz-hero-split .bz-logo-tag{ color:rgba(244,239,230,.82) }
  .bz-hero-split .bz-logo-line,
  .bz-hero-split .bz-logo-diamond,
  .bz-hero-split .bz-logo-since-line{ background:rgba(244,239,230,.6) }
  .bz-hero-split .bz-logo-since-text{ color:rgba(244,239,230,.82) }
  .bz-hero-split .bz-hero-bottom{
    border-top:none;
    color:rgba(244,239,230,.75);
  }
  .bz-hero-split .bz-hero-bottom-scroll{ color:rgba(244,239,230,.9) }
  /* CTA du hero sur fond photo assombri : les couleurs par defaut (encre sur clair)
     sont illisibles une fois le texte superpose a la photo. */
  .bz-hero-split .bz-btn-ghost{
    color:var(--bg);
    border-color:rgba(244,239,230,.35);
  }
  .bz-hero-split .bz-cta-alt-text{
    color:rgba(244,239,230,.82);
    border-bottom-color:rgba(244,239,230,.4);
  }
  .bz-hero-split .bz-cta-alt:hover{ color:var(--bg) }
  .bz-hero-split .bz-cta-alt:hover .bz-cta-alt-text{ border-color:var(--bg) }
  .bz-section-head-row,
  .bz-histoire-grid,
  .bz-contact-grid{
    grid-template-columns:1fr;
    gap:48px;
  }
  .bz-matieres-list,
  .bz-avis-list,
  .bz-matieres-strip{
    grid-template-columns:1fr;
  }
  .bz-foot-grid{ grid-template-columns:1fr 1fr; gap:32px }
  .bz-foot-brand{ grid-column:1 / -1; margin-bottom:8px }
  .bz-foot-bottom{ flex-direction:column; gap:16px; align-items:flex-start }
  .bz-field-row{ grid-template-columns:1fr }
  .bz-hero-plein-foot{ flex-direction:column; gap:16px; align-items:flex-start }
  .bz-pieces-grid{ grid-template-columns:1fr; gap:32px }
  .bz-piece--wide, .bz-piece--tall, .bz-piece--narrow{
    grid-column:1; grid-row:auto;
  }
  .bz-piece--wide .bz-piece-img,
  .bz-piece--tall .bz-piece-img,
  .bz-piece--narrow .bz-piece-img{ aspect-ratio:4/3 }
  .bz-pieces-cta{ flex-direction:column; align-items:flex-start; padding:24px }
}

/* ── CORRECTION TRANSPOSITION ───────────────────────────────────────
   Les visuels etaient des div en background-image dans la maquette.
   Devenus de vraies balises img, ils portent width/height en attribut
   HTML (utile contre le decalage de mise en page au chargement), mais
   cette hauteur intrinseque ecrase aspect-ratio : une carte de 465px
   se retrouvait a 800px et la carte haute a 1770px. height:auto rend
   la main a aspect-ratio, object-fit:cover fait le recadrage.
   ────────────────────────────────────────────────────────────────── */
img.bz-piece-img,
img.bz-histoire-img,
img.bz-matieres-img{
  height:auto;
  display:block;
  object-fit:cover;
}
img.bz-piece-img{ max-height:none }

/* ── COLLECTION, FICHE PIECE, 404 ────────────────────────────────────
   Ajouts pour /collection et /piece/{slug} : reprend les tokens et
   classes bz-piece*/bz-section* existants, n'introduit que ce qui est
   propre a ces deux pages (badge vendue, filtres, galerie, blocs).
   ────────────────────────────────────────────────────────────────── */

.bz-piece-badge{
  position:absolute;
  top:10px; left:10px;
  z-index:1;
  font:500 11px/1 var(--font-sans);
  letter-spacing:.06em;text-transform:uppercase;
  color:var(--bg);
  background:var(--ink);
  padding:5px 9px;
  border-radius:2px;
  white-space:nowrap;
}
.bz-piece--sold .bz-piece-img{ opacity:.75 }
.bz-piece--sold h3{ color:var(--sub) }

.bz-collection-filters{
  display:flex;flex-wrap:wrap;align-items:end;gap:16px;
  margin-bottom:40px;
  padding-bottom:24px;
  border-bottom:1px solid var(--rule);
}
.bz-collection-filter{
  display:flex;flex-direction:column;gap:6px;
  font:500 10.5px/1 var(--font-sans);
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--sub);
}
.bz-collection-filter input{
  width:110px;
  font:400 16px/1.2 var(--font-serif);
  color:var(--ink);
  background:transparent;
  border:0;
  border-bottom:1px solid var(--rule);
  border-radius:0;
  padding:8px 0;
}
.bz-collection-filter select{
  width:180px;
  font:400 15px/1.2 var(--font-sans);
  color:var(--ink);
  background:transparent;
  border:0;
  border-bottom:1px solid var(--rule);
  border-radius:0;
  padding:8px 0;
}
.bz-collection-filter input:focus,
.bz-collection-filter select:focus{ outline:0; border-bottom-color:var(--accent) }
.bz-collection-filters .bz-btn{ margin-bottom:1px }
.bz-collection-empty{ color:var(--sub); padding:48px 0; font-style:italic }

.bz-pieces-grid--collection{
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
}
.bz-pieces-grid--collection .bz-piece{ grid-column:span 1 }
.bz-pieces-grid--collection .bz-piece-img{ aspect-ratio:16/10; position:relative }
.bz-pieces-grid--collection .bz-piece-cap-head{ margin-bottom:0 }

/* ── Fiche piece ────────────────────────────────────────────────── */
.bz-detail-sold-banner{
  display:inline-block;
  font:500 12px/1 var(--font-sans);
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--bg);
  background:var(--ink);
  padding:10px 16px;
  border-radius:2px;
  margin-bottom:32px;
}
.bz-detail-grid{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:64px;
  align-items:start;
}
.bz-detail-gallery{
  display:flex;flex-direction:column;gap:40px;
  position:sticky;top:32px;
}
.bz-detail-media{
  display:flex;flex-direction:column;gap:16px;
}
.bz-detail-photo{
  width:100%;height:auto;
  border-radius:2px;
  background:var(--surface);
}

.bz-gallery{
  position:relative;
  border-radius:2px;
  overflow:hidden;
  background:var(--surface);
}
.bz-gallery-track{
  display:flex;
  width:100%;
  will-change:transform;
}
.bz-gallery-slide{
  flex:0 0 100%;
  width:100%;height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
}
.bz-gallery-arrow{
  position:absolute;top:50%;
  transform:translateY(-50%);
  width:40px;height:40px;
  border-radius:50%;
  border:none;
  background:color-mix(in oklab, var(--bg) 75%, transparent);
  color:var(--ink);
  font:400 22px/1 var(--font-sans);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s ease;
}
.bz-gallery-arrow:hover{ background:var(--bg) }
.bz-gallery-arrow--prev{ left:12px }
.bz-gallery-arrow--next{ right:12px }
.bz-gallery-counter{
  position:absolute;top:12px;right:12px;
  font:400 12px/1 var(--font-sans);
  letter-spacing:.04em;
  color:var(--ink);
  background:color-mix(in oklab, var(--bg) 75%, transparent);
  padding:6px 10px;
  border-radius:999px;
}
.bz-gallery-dots{
  position:absolute;left:0;right:0;bottom:14px;
  display:flex;justify-content:center;gap:8px;
}
.bz-gallery-dot{
  width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;
  border:none;padding:0;
  background:transparent;
  cursor:pointer;
}
.bz-gallery-dot::before{
  content:"";
  width:7px;height:7px;
  border-radius:50%;
  background:color-mix(in oklab, var(--bg) 70%, transparent);
  transition:background .15s ease,transform .15s ease;
}
.bz-gallery-dot.is-active::before{
  background:var(--bg);
  transform:scale(1.3);
}
.bz-detail-subtitle{ color:var(--sub); font-size:16px; margin-top:8px }
.bz-detail-price-row{
  display:flex;align-items:center;gap:12px;
  margin:20px 0 28px;
}
.bz-detail-price{ font-size:15px; padding:8px 14px }
.bz-detail-intro{ font-size:17px; line-height:1.6; margin-bottom:28px; white-space:normal }
.bz-detail-block{
  padding:20px 0;
  border-top:1px solid var(--rule);
}
.bz-detail-block h2{
  font-size:15px;font-weight:600;font-family:var(--font-sans);
  letter-spacing:.04em;
  margin-bottom:10px;
}
.bz-detail-block p{ color:var(--sub); line-height:1.6 }
.bz-detail-construction{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px }
.bz-detail-construction li{
  color:var(--sub); line-height:1.5; padding-left:18px; position:relative;
}
.bz-detail-construction li::before{
  content:"";
  position:absolute; left:0; top:.6em;
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
}
.bz-detail-cta{ display:flex; gap:16px; margin-top:32px; flex-wrap:wrap }
.bz-detail-alternatives{ margin-top:120px; padding-top:64px; border-top:1px solid var(--rule) }

.bz-404{ padding-top:80px; padding-bottom:160px; max-width:640px }
.bz-404 h1{ font-size:clamp(32px,4vw,48px); margin:16px 0 20px }

@media (max-width:900px){
  .bz-detail-grid{ grid-template-columns:1fr; gap:40px }
  .bz-detail-gallery{ gap:32px; position:static }
  .bz-gallery-arrow{ width:34px; height:34px; font-size:18px }
  .bz-pieces-grid--collection .bz-piece--wide{ grid-column:1 }
  .bz-collection-filters{ flex-direction:column; align-items:stretch }
}

/* Pages legales (ajout audit checkweb, pt.1/2) */
.bz-legal{ padding-top:80px; padding-bottom:160px; max-width:720px }
.bz-legal h1{ font-size:clamp(28px,3.6vw,40px); margin:16px 0 32px }
.bz-legal h2{
  font-size:15px; font-weight:600; font-family:var(--font-sans);
  letter-spacing:.04em; text-transform:uppercase;
  margin:40px 0 12px;
}
.bz-legal p{ color:var(--sub); line-height:1.7; margin:0 0 14px }
.bz-legal a{ color:var(--accent) }
.bz-legal .bz-legal-todo{
  display:inline-block; margin-top:2px;
  font:500 11px/1 var(--font-mono);
  color:var(--accent); background:color-mix(in oklab, var(--accent) 12%, transparent);
  padding:4px 8px; border-radius:4px;
}

/* Bandeau cookies (ajout audit checkweb, pt.5) */
.bz-cookie-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:9999;
  max-width:640px; margin:0 auto;
  background:var(--ink); color:var(--bg);
  border-radius:10px;
  padding:18px 20px;
  display:flex; flex-wrap:wrap; align-items:center; gap:16px;
  box-shadow:0 12px 32px rgba(0,0,0,.28);
  font:400 13px/1.5 var(--font-sans);
}
.bz-cookie-banner-text{ flex:1 1 260px; margin:0 }
.bz-cookie-banner-actions{ display:flex; gap:10px; flex:0 0 auto }
.bz-cookie-btn{
  font:500 12px/1 var(--font-sans);
  padding:11px 18px; border-radius:6px; border:1px solid transparent;
  cursor:pointer;
}
.bz-cookie-btn--accept{ background:var(--accent); color:#fff }
.bz-cookie-btn--refuse{ background:transparent; color:var(--bg); border-color:rgba(244,239,230,.4) }
@media (max-width:520px){
  .bz-cookie-banner{ flex-direction:column; align-items:stretch }
  .bz-cookie-banner-actions{ justify-content:flex-end }
}