/* =====================================================================
   Ludovic Baron Art — styles applicatifs (layout only)
   Tous les tokens viennent de charte.css. Aucune nouvelle couleur.
   ===================================================================== */

.paychoice { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.cart-pay { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-divider); }
.cart-pay__head { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 10px; }
.cart-pay__opts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.cart-pay__opt { padding: 9px 4px; border: 1px solid var(--border-hairline); background: transparent; cursor: pointer; font-family: var(--font-display); font-size: 14px; color: var(--ink-soft); transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.cart-pay__opt:hover { border-color: var(--accent); }
.cart-pay__opt.is-on { border-color: var(--accent); background: var(--surface-2); color: var(--ink-primary); }
.cart-pay__line { display: flex; justify-content: space-between; align-items: baseline; margin-top: 12px; font-size: var(--body-m-size); }
.cart-paybox { border: 1px solid var(--accent-muted); }
.mesdevis-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 14px 0; border-bottom: 1px solid var(--border-divider); }
.mesdevis-row:last-child { border-bottom: 0; }
.mesdevis-row__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.modal--devis { max-width: 760px; width: 100%; }
.dq-doc { background: #fff; color: #161310; padding: 28px 30px; font-family: var(--font-body); font-size: 13px; line-height: 1.5; }
.dq-doc .dq-head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px; }
.dq-doc .dq-h1 { font-family: var(--font-display); font-size: 22px; }
.dq-doc .dq-h2 { font-family: var(--font-display); font-size: 18px; }
.dq-doc .dq-eb { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: #8a8378; }
.dq-doc .dq-ent { font-size: 11px; color: #4d473d; line-height: 1.7; }
.dq-doc .dq-ent strong { color: #161310; }
.dq-doc .dq-hr { border: 0; border-top: 1.5px solid #161310; margin: 16px 0; }
.dq-doc .dq-table { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 12px 0; }
.dq-doc .dq-table th { text-align: left; font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: #8a8378; border-bottom: 1px solid #161310; padding: 7px 4px; }
.dq-doc .dq-table td { padding: 8px 4px; border-bottom: 1px solid #e4ded2; font-size: 10.5px; word-break: break-word; overflow-wrap: anywhere; }
.dq-doc .dq-table th:nth-child(1), .dq-doc .dq-table td:nth-child(1) { width: 24%; }
.dq-doc .dq-table th:nth-child(2), .dq-doc .dq-table td:nth-child(2) { width: 13%; }
.dq-doc .dq-table th:nth-child(3), .dq-doc .dq-table td:nth-child(3) { width: 7%; }
.dq-doc .dq-table th:nth-child(n+4), .dq-doc .dq-table td:nth-child(n+4) { width: 14%; }
.dq-doc .dq-r { text-align: right; }
.dq-doc .dq-art { font-family: var(--font-display); color: #3a342b; }
.dq-doc .dq-finish { display: block; font-family: var(--font-body); font-size: 9px; color: #8a8378; margin-top: 3px; line-height: 1.4; }
.dq-doc .dq-tot { margin-left: auto; width: 62%; }
.dq-doc .dq-tr { display: flex; justify-content: space-between; padding: 5px 0; }
.dq-doc .dq-tr.dq-g { font-family: var(--font-display); font-size: 17px; border-top: 1.5px solid #161310; margin-top: 6px; padding-top: 12px; }
.dq-doc .dq-st { display: inline-block; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; padding: 5px 12px; border: 1px solid #161310; margin-top: 10px; }
.dq-doc .dq-sig { margin-top: 22px; } .dq-doc .dq-sig img { max-height: 80px; }
.fav-mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 560px) { .fav-mini-grid { grid-template-columns: 1fr 1fr; } }
.fav-mini { display: flex; flex-direction: column; gap: 8px; background: transparent; border: 0; padding: 0; cursor: pointer; text-align: left; }
.fav-mini__media { aspect-ratio: 1/1; background: var(--surface-1); border: 1px solid var(--border-hairline); display: flex; align-items: center; justify-content: center; overflow: hidden; transition: border-color var(--dur-fast) var(--ease); }
.fav-mini:hover .fav-mini__media { border-color: var(--accent); }
.fav-mini__media img { width: 100%; height: 100%; object-fit: cover; }
.fav-mini__title { font-size: var(--body-s-size); }
.delais-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 16px; padding: 12px 14px; border: 1px solid var(--border-hairline); background: var(--surface-1); font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-soft); }
.delais-note svg { flex: none; color: var(--accent); margin-top: 1px; }@media (max-width: 600px) { .paychoice { grid-template-columns: 1fr; } }
.paychoice__opt { text-align: left; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 16px; cursor: pointer; display: flex; flex-direction: column; gap: 6px; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.paychoice__opt:hover { border-color: var(--accent); }
.paychoice__opt.is-active { border-color: var(--accent); background: var(--surface-1); }
.paychoice__t { font-size: var(--body-m-size); color: var(--ink-primary); }
.paychoice__opt.is-active .paychoice__t { color: var(--accent); }
.paychoice__d { font-size: var(--body-s-size); color: var(--ink-muted); line-height: 1.45; }

*, *::before, *::after { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
html { background: #000; }
body { background: radial-gradient(135% 80% at 50% -10%, #3A352B 0%, #211E18 30%, #100E0B 62%, #000000 100%) no-repeat fixed, var(--canvas); color: var(--ink-primary); overflow-x: clip; }
button { background: transparent; border: 0; color: inherit; font: inherit; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--accent-muted); color: var(--ink-primary); }

#root { min-height: 100vh; display: flex; flex-direction: column; }

/* ----------------------------- Utilities ----------------------------- */
.eyebrow { font-family: var(--font-body); font-size: var(--eyebrow-size); font-weight: 600;
  letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--ink-muted); }
.muted { color: var(--ink-muted); }
.soft { color: var(--ink-soft); }
.center { text-align: center; }
.mono-num { font-variant-numeric: tabular-nums; }
.hairline { border: 0; border-top: 1px solid var(--border-divider); margin: 0; }
.wrap { max-width: 1320px; margin: 0 auto; padding: 0 var(--space-3); width: 100%; }
.wrap-narrow { max-width: 920px; margin: 0 auto; padding: 0 var(--space-3); width: 100%; }
.stack { display: flex; flex-direction: column; }
.row { display: flex; align-items: center; }
.spread { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.gap-1 { gap: var(--space-1); } .gap-2 { gap: var(--space-2); } .gap-3 { gap: var(--space-3); }
.grow { flex: 1; }
.nowrap { white-space: nowrap; }

/* ----------------------------- Buttons ----------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; padding: 16px 30px; border: 1px solid transparent; border-radius: var(--radius-0);
  cursor: pointer; transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
  border-color var(--dur-fast) var(--ease); line-height: 1; }
.btn:disabled { opacity: 0.35; cursor: not-allowed; }
.btn--primary { background: var(--ink-primary); color: var(--canvas); }
.btn--primary:not(:disabled):hover { background: var(--accent); }
.btn--outline { background: transparent; color: var(--ink-primary); border-color: var(--accent); }
.btn--outline:not(:disabled):hover { background: var(--accent); color: var(--canvas); }
.btn--ghost { background: transparent; color: var(--ink-muted); border-color: var(--border-hairline); }
.btn--ghost:not(:disabled):hover { color: var(--ink-primary); border-color: var(--accent); }
.btn--sm { padding: 10px 18px; font-size: 11px; }
.btn--block { width: 100%; }
.btn .arrow { transition: transform var(--dur-fast) var(--ease); }
.btn:not(:disabled):hover .arrow { transform: translateX(3px); }

.text-link { color: var(--accent); border-bottom: 1px solid var(--border-hairline); font-weight: 600;
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; display: inline-flex;
  gap: 8px; align-items: center; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.text-link:hover { color: var(--accent-hover); border-bottom-color: var(--accent); }
.text-link--mute { color: var(--ink-muted); border-bottom-color: transparent; }
.text-link--mute:hover { color: var(--ink-primary); border-bottom-color: var(--ink-muted); }

/* ----------------------------- Top nav ----------------------------- */
.nav { position: sticky; top: 0; z-index: 60; background: var(--canvas);
  border-bottom: 1px solid var(--border-hairline); }
.nav__inner { display: flex; align-items: center; gap: var(--space-3); padding: 20px var(--space-3); max-width: 1440px; margin: 0 auto; }
.nav__brand { display: flex; align-items: center; gap: 14px; cursor: pointer; flex: none; }
.nav__logo { width: 34px; height: 34px; flex: none; }
.nav__word { font-family: var(--font-display); font-weight: 400; font-size: 19px; letter-spacing: 0.06em;
  color: var(--ink-primary); line-height: 1; white-space: nowrap; }
.nav__sub { font-size: 9px; letter-spacing: 0.22em; color: var(--ink-muted); text-transform: uppercase; margin-top: 4px; white-space: nowrap; }
.nav__links { display: flex; flex-wrap: nowrap; gap: clamp(16px, 1.6vw, 30px); margin-left: auto; align-items: center; }
.nav__link { font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; white-space: nowrap;
  color: var(--ink-muted); padding-bottom: 4px; border-bottom: 1px solid transparent; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.nav__link:hover { color: var(--ink-primary); }
.nav__link.is-active { color: var(--ink-primary); border-bottom-color: var(--accent); }
.nav__cart { position: relative; }
.nav__cart-badge { position: absolute; top: -8px; right: -12px; background: var(--accent); color: var(--canvas);
  font-size: 10px; font-weight: 700; min-width: 16px; height: 16px; border-radius: var(--radius-pill);
  display: inline-flex; align-items: center; justify-content: center; padding: 0 4px; letter-spacing: 0; }
.nav__mode { display: inline-flex; align-items: center; gap: 7px; flex: none; font-size: 10px; letter-spacing: 0.16em; color: var(--ink-soft); border: 1px solid var(--border-hairline);
  border-radius: var(--radius-pill); padding: 9px 16px; text-transform: uppercase; white-space: nowrap; margin-left: 6px; transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.nav__mode svg { width: 13px; height: 13px; }
.nav__mode:hover { color: var(--canvas); background: var(--accent); border-color: var(--accent); }
.nav__mode--artiste { color: var(--accent); border-color: var(--accent-muted); }
.nav__burger { display: none; }
.nav__modequick { display: none; }

/* mobile nav */
@media (max-width: 1024px) {
  .nav__inner { padding: 14px var(--space-2); gap: var(--space-2); }
  .nav__links { position: fixed; inset: 64px 0 auto 0; background: var(--canvas); flex-direction: column;
    align-items: flex-start; gap: 0; margin: 0; border-bottom: 1px solid var(--border-hairline);
    max-height: 0; overflow: hidden; transition: max-height var(--dur-medium) var(--ease); z-index: 59; }
  .nav__links.is-open { max-height: 90vh; overflow-y: auto; padding-bottom: 8px; }
  .nav__links > * { padding: 17px var(--space-2); width: 100%; border-bottom: 1px solid var(--border-divider);
    font-size: 13px; letter-spacing: 0.16em; min-height: 54px; display: flex; align-items: center; }
  .nav__link.is-active { border-bottom-color: var(--border-divider); color: var(--accent); }
  .nav__links .nav__mode, .nav__links .nav__mode--artiste {
    margin-top: 10px; border: 0; border-top: 1px solid var(--accent-muted); border-radius: 0;
    color: var(--accent); font-weight: 600; gap: 10px; justify-content: flex-start; }
  .nav__burger { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; }
  .nav__modequick { display: inline-flex; align-items: center; gap: 6px; margin-left: auto;
    font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--accent); border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); padding: 8px 13px; }
  .nav__modequick svg { width: 13px; height: 13px; }
  .nav__word { font-size: 17px; }
}

/* ----------------------------- Accueil chapters ----------------------------- */
.page-main { flex: 1; padding-bottom: var(--space-5); }
.hero { position: relative; }
.hero--type { border-bottom: 1px solid var(--border-hairline); }
.hero__inner { position: relative; padding: var(--space-3) var(--space-3) var(--space-4); max-width: 1320px; margin: 0 auto; width: 100%; }
/* Bandeau d'accueil cinématographique (diaporama plein écran + texte) */
.home-hero { position: relative; min-height: min(78vh, 760px); display: flex; align-items: flex-end; overflow: hidden; border-bottom: 1px solid var(--border-hairline); }
.home-hero__bg { position: absolute; inset: 0; background: #000; }
.home-hero__slide { position: absolute; inset: 0; background-size: cover; background-position: center 28%; transform-origin: center 30%; opacity: 0; transition: opacity 1.3s var(--ease); transform: scale(1.03); will-change: opacity, transform; }
.home-hero__slide.is-visible { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  .home-hero__slide.is-current { animation: homeHeroZoom 6.2s linear forwards; }
}
@keyframes homeHeroZoom { from { transform: scale(1.03); } to { transform: scale(1.11); } }
.home-hero__veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 45%, rgba(0,0,0,0.82) 100%); }
.home-hero__inner { position: relative; z-index: 2; max-width: 1320px; width: 100%; margin: 0 auto; padding: var(--space-5) var(--space-3); }
.home-hero__title { font-family: var(--font-display); font-size: clamp(36px, 6vw, var(--display-xl-size)); line-height: 1.1; color: var(--ink-primary); margin: 16px 0 0; max-width: 18ch; text-wrap: balance; }
.home-hero__sub { color: var(--ink-soft); font-size: var(--body-l-size); line-height: var(--body-l-lh); max-width: 52ch; margin: var(--space-2) 0 0; }
.home-hero__sig { color: var(--accent); font-size: clamp(16px, 2vw, 20px); line-height: 1.45; max-width: 56ch; margin: var(--space-3) 0 0; }
.home-hero__cta { margin-top: var(--space-3); }
.home-hero__dots { position: absolute; z-index: 3; right: var(--space-3); bottom: var(--space-3); display: flex; gap: 8px; }
.home-hero__dot { width: 8px; height: 8px; border-radius: 999px; border: 1px solid var(--accent); background: none; cursor: pointer; padding: 0; transition: background var(--dur-fast) var(--ease); }
.home-hero__dot.is-active { background: var(--accent); }
@media (max-width: 700px) { .home-hero { min-height: 70vh; } .home-hero__inner { padding: var(--space-4) var(--space-2); } .home-hero__veil { background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.45) 40%, rgba(0,0,0,0.9) 100%); } }
.hero__title { font-family: var(--font-display); font-size: clamp(36px, 6vw, var(--display-xl-size)); line-height: 1.1; max-width: 16ch; }
.hero__sub { color: var(--ink-soft); font-size: var(--body-l-size); max-width: 48ch; margin: var(--space-2) 0 var(--space-3); }

.section { padding: var(--space-5) 0; }
.section--alt { background: var(--surface-1); }
.section__head { margin-bottom: var(--space-4); }
.section__title { font-family: var(--font-display); font-size: var(--display-l-size); line-height: 1.1; margin-top: 10px; }

/* Univers — cartes typographiques (sans image) */
.univ-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; gap: var(--space-2); align-items: stretch; }
.univ-card { text-align: left; display: flex; flex-direction: column; justify-content: space-between; gap: var(--space-3);
  min-height: 240px; padding: var(--space-3); border: 1px solid var(--border-hairline); background: var(--surface-1);
  cursor: pointer; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.univ-card:hover { border-color: var(--accent); background: var(--surface-2); }
.univ-card__name { font-family: var(--font-display); font-size: var(--display-m-size); margin: 10px 0 8px; }
.univ-card__sub { color: var(--ink-soft); font-size: var(--body-m-size); max-width: 44ch; }
.univ-card__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2);
  border-top: 1px solid var(--border-divider); padding-top: 16px; font-size: var(--body-s-size); }
@media (max-width: 720px) { .univ-grid { grid-template-columns: 1fr; } }

/* ----------------------------- Œuvres grid ----------------------------- */
.gamme-head { padding: var(--space-3) 0 var(--space-3); }
.gamme-head__title { font-family: var(--font-display); font-size: var(--display-l-size); line-height: 1.1; margin: 10px 0 14px; }
.gamme-head__sub { color: var(--ink-soft); max-width: 60ch; }
.badge-line { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--space-2); }
.chip { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted);
  border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); padding: 6px 14px; white-space: nowrap; }
.chip--accent { color: var(--accent); border-color: var(--accent-muted); }

.art-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
.artcard { cursor: pointer; text-align: left; display: flex; flex-direction: column; gap: 14px; }
.artcard__frame { position: relative; background: var(--surface-1); border: 1px solid var(--border-hairline);
  transition: border-color var(--dur-fast) var(--ease); overflow: hidden; }
.artcard:hover .artcard__frame { border-color: var(--accent); }
.artcard__frame image-slot { width: 100%; height: 100%; }
/* Présentation des œuvres : cadre carré. Les images non carrées se recadrent
   en "cover" — double-clic sur un emplacement rempli pour ajuster le crop. */
.artcard__frame--portrait,
.artcard__frame--paysage,
.artcard__frame--carre { aspect-ratio: 1 / 1; }
.artcard__name { font-family: var(--font-display); color: var(--accent); font-size: var(--display-s-size); }
.artcard__meta { color: var(--ink-muted); font-size: var(--body-s-size); margin-top: 6px; }
@media (max-width: 720px) { .art-grid { grid-template-columns: 1fr; gap: var(--space-3); } }

/* ----------------------------- Œuvre detail ----------------------------- */
.detail { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-4); padding: var(--space-4) 0; align-items: start; }
.detail__gallery-row { grid-column: 1 / -1; }
.scene-gallery { margin-top: 0; }
/* Molette de chargement luxe (fin anneau beige) */
.lb-spinner { display: inline-block; width: 18px; height: 18px; vertical-align: -3px; margin-right: 4px;
  border: 2px solid var(--accent-muted); border-top-color: var(--accent); border-radius: 50%;
  animation: lbspin 0.8s linear infinite; }
.lb-spinner--lg { width: 30px; height: 30px; border-width: 2.5px; }
@keyframes lbspin { to { transform: rotate(360deg); } }
/* Logo de marque (nav + footer) */
.nav__logo { height: 38px; width: auto; display: block; }
.footer__logo { height: 58px; width: auto; display: block; }
.footer__word--logo { background: none; border: 0; padding: 0; cursor: pointer; }
.scene-frame { background: #e7e4dd; border: 1px solid var(--border-hairline); padding: var(--space-2); position: relative; }
.scene-zoom-btn { position: absolute; top: 12px; right: 12px; z-index: 3; width: 38px; height: 38px; border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.18); background: rgba(255,255,255,0.82); color: #2b2723; display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.scene-zoom-btn:hover { background: #fff; border-color: var(--accent); }
.scene-zoom-panel { position: relative; width: min(94vw, 1320px); background: #e7e4dd; border: 1px solid var(--border-hairline); padding: var(--space-2); }
.scene-zoom-stage svg { width: 100%; height: auto; display: block; }
.scene-zoom-panel .lb-modal__close { background: rgba(255,255,255,0.82); border-color: rgba(0,0,0,0.18); color: #2b2723; }
.scene-zoom-panel .lb-modal__close:hover { border-color: var(--accent); color: #2b2723; }
/* Simulateur · panneau d'informations luxe sous la scène */
.scene-meta { margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid rgba(0,0,0,0.12); display: flex; flex-direction: column; gap: 10px; }
.scene-spec { }
.scene-spec__summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.scene-spec__summary::-webkit-details-marker { display: none; }
.scene-spec__lead { font-family: var(--font-display); font-size: 16px; color: #2b2723; font-variant-numeric: tabular-nums; }
.scene-spec__chev { color: #6f6555; transition: transform var(--dur-fast) var(--ease); display: inline-flex; }
.scene-spec[open] .scene-spec__chev { transform: rotate(180deg); }
.scene-spec__body { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,0.12); display: flex; flex-direction: column; gap: 7px; }
.scene-spec__row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); }
.scene-spec__k { font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: #7a7163; }
.scene-spec__v { font-size: var(--body-s-size); color: #3a352d; font-variant-numeric: tabular-nums; }
.scene-spec__note { margin-top: 6px; font-size: var(--body-s-size); color: #6f6555; line-height: 1.5; }
.scene-cadre-btn { align-self: flex-start; background: none; border: 0; border-bottom: 1px solid rgba(0,0,0,0.22); padding: 4px 0; cursor: pointer; font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #4a4135; transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.scene-cadre-btn:hover { color: #2b2723; border-bottom-color: rgba(0,0,0,0.5); }
.scene-cadre-btn .arr { font-size: 13px; }
.encadre-opt { display: flex; align-items: flex-start; gap: 12px; width: 100%; text-align: left; cursor: pointer;
  background: var(--surface-1); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 14px 16px;
  transition: border-color var(--dur-fast) var(--ease); }
.encadre-opt:hover { border-color: var(--accent); }
.encadre-opt.is-on { border-color: var(--accent); }
.encadre-opt.is-inc { cursor: default; }
.encadre-opt__check { flex: none; width: 22px; height: 22px; border-radius: var(--radius-pill); display: flex; align-items: center; justify-content: center;
  background: var(--accent); color: var(--canvas); font-size: 13px; }
.encadre-opt__check.is-off { background: transparent; border: 1px solid var(--border-active); }
.encadre-opt__txt { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.encadre-opt__title { font-size: var(--body-m-size); color: var(--ink-primary); }
.encadre-opt__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.encadre-opt__price { flex: none; font-size: var(--body-s-size); color: var(--accent); white-space: nowrap; font-variant-numeric: tabular-nums; }
.scene-orient { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.scene-orient__label { font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: #7a7163; }
.scene-svg { width: 100%; height: auto; display: block; }
.scene-col { display: flex; flex-direction: column; gap: var(--space-2); }

/* Carrousel d'exemples en situation */
.gallery { border: 1px solid var(--border-hairline); background: var(--surface-1); padding: var(--space-2); }
.gallery__eyebrow { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 12px; }
.gallery__stage { position: relative; background: #000; aspect-ratio: 1 / 1; max-height: 60vh; }
.gallery__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; cursor: zoom-in; }
.gallery__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.45); color: #fff; border: 1px solid rgba(212,197,169,0.4); border-radius: var(--radius-pill); transition: background var(--dur-fast) var(--ease); }
.gallery__nav:hover { background: var(--accent); color: #000; }
.gallery__nav--prev { left: 10px; } .gallery__nav--next { right: 10px; }
.gallery__count { position: absolute; bottom: 10px; right: 10px; font-size: 11px; letter-spacing: 0.1em; color: #fff; background: rgba(0,0,0,0.5); padding: 4px 10px; border-radius: var(--radius-pill); }
.gallery__cap { font-family: var(--font-display); color: var(--accent); font-size: 15px; margin-top: 12px; line-height: 1.4; }
.gallery__thumbs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; padding-bottom: 2px; }
.gallery__thumb { flex: none; width: 64px; height: 64px; border: 1px solid var(--border-hairline); padding: 0; overflow: hidden; opacity: 0.6; transition: opacity var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery__thumb.is-on { opacity: 1; border-color: var(--accent); }
.gallery__thumb:hover { opacity: 1; }
.gallery__lightbox { position: fixed; inset: 0; z-index: 120; background: rgba(0,0,0,0.92); display: flex; align-items: center; justify-content: center; padding: var(--space-3); }
.gallery__inframe { position: absolute; background-position: center; background-size: cover; background-repeat: no-repeat; cursor: zoom-in; }
.gallery__lightbox-stage { position: relative; display: inline-block; }
.gallery__lightbox-stage img { display: block; max-width: 92vw; max-height: 88vh; object-fit: contain; }
.gallery__lightbox img { max-width: 92vw; max-height: 88vh; object-fit: contain; }
.gallery__lightbox-close { position: absolute; top: 18px; right: 18px; width: 44px; height: 44px; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.gallery__lightbox-close:hover { color: var(--accent); }
.gallery-soon { aspect-ratio: 1 / 1; background: var(--surface-1); border: 1px dashed var(--accent-muted);
  display: flex; align-items: center; justify-content: center; }
.gallery-soon span { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-muted); letter-spacing: 0.04em; }

/* Image principale + carrousel d'une page (Leasing, Sur Mesure) */
.page-media { margin: var(--space-3) 0; display: flex; flex-direction: column; gap: var(--space-3); }
.page-media__main { background: #000; border: 1px solid var(--border-hairline); }
.page-media__main img { width: 100%; max-height: 480px; object-fit: cover; display: block; }

/* Panneau flottant des favoris (pages produit) */
.fav-floater__tab { position: fixed; right: 0; top: 38%; z-index: 78; display: inline-flex; align-items: center; gap: 8px;
  background: var(--ink-primary); color: var(--canvas); border: 1px solid var(--accent); border-right: 0;
  border-radius: var(--radius-pill) 0 0 var(--radius-pill); padding: 11px 16px 11px 18px; cursor: pointer;
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.fav-floater__tab:hover, .fav-floater__tab.is-open { background: var(--accent); color: var(--canvas); }
.fav-floater__tab svg { width: 17px; height: 17px; }
.fav-floater__panel { position: fixed; right: 16px; top: 92px; z-index: 90; width: 300px; max-width: calc(100vw - 32px);
  background: var(--surface-1); border: 1px solid var(--accent); max-height: 76vh; display: flex; flex-direction: column;
  box-shadow: 0 18px 50px rgba(0,0,0,0.5); }
.fav-floater__head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--border-divider); }
.fav-floater__title { font-family: var(--font-display); font-size: 17px; color: var(--ink-primary); }
.fav-floater__close { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-soft); }
.fav-floater__close:hover { color: var(--accent); }
.fav-floater__hint { font-size: 12px; color: var(--ink-muted); padding: 12px 18px 4px; }
.fav-floater__cta { padding: 14px 18px; border-bottom: 1px solid var(--border-divider); }
.fav-floater__empty { padding: 18px; display: flex; flex-direction: column; gap: 16px; }
.fav-floater__list { overflow-y: auto; padding: 6px; }
.fav-floater__item { display: flex; flex-direction: row; align-items: center; gap: 12px; width: 100%; text-align: left;
  padding: 10px 14px; background: transparent; border: 0; border-bottom: 1px solid var(--border-divider); cursor: pointer; transition: background var(--dur-fast) var(--ease); }
.fav-floater__thumb { flex: none; width: 46px; height: 46px; background: var(--surface-2); border: 1px solid var(--border-hairline); overflow: hidden; display: block; }
.fav-floater__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.fav-floater__item:last-child { border-bottom: 0; }
.fav-floater__item:hover { background: var(--surface-2); }
.fav-floater__name { font-size: 15px; }
.fav-floater__meta { font-size: 11px; letter-spacing: 0.1em; color: var(--ink-muted); text-transform: uppercase; }
.fav-floater__panel > .btn { margin: 12px; width: calc(100% - 24px); }
@media (max-width: 600px) {
  .fav-floater__tab { top: auto; bottom: 16px; right: 12px; left: auto; width: 56px; height: 56px; padding: 0; border-radius: 999px; border-right: 1px solid var(--accent); justify-content: center; }
  .fav-floater__tablbl { display: none; }
  .fav-floater__tab svg { width: 20px; height: 20px; }
  .fav-floater__panel { top: auto; bottom: 80px; right: 12px; left: 12px; width: auto; max-height: 60vh; }
}
.scene-cap { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); text-align: center; padding: 12px 0 2px; border-top: 1px solid var(--border-divider); margin-top: 8px; }
.scene-orient { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  border-top: 1px solid var(--border-divider); margin-top: 10px; padding-top: 12px; }
.scene-cap-inline { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); }

/* sur mesure steps */
.sm-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); margin-top: var(--space-4); }
@media (max-width: 760px) { .sm-steps { grid-template-columns: 1fr; gap: var(--space-2); } }
.sm-step { border-top: 1px solid var(--accent-muted); padding-top: 16px; }
.sm-step__n { font-family: var(--font-display); font-size: var(--display-m-size); color: var(--accent); }
.sm-step__t { font-size: var(--body-m-size); color: var(--ink-primary); margin: 10px 0 6px; font-weight: 600; }
.sm-step__d { color: var(--ink-soft); font-size: var(--body-s-size); }

/* signature success confirmation */
.confirm-check { width: 60px; height: 60px; border-radius: var(--radius-pill); border: 1px solid var(--accent);
  color: var(--accent); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px;
  animation: checkPop var(--dur-medium) var(--ease); }
@keyframes checkPop { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } }

/* Maison — bouton catalogue + légende */
.hero__catalogue { margin-top: var(--space-3); max-width: 38ch; }
.hero__catalogue--below { margin: var(--space-4) auto 0; max-width: 52ch; text-align: center; }
.hero__catalogue--below .hero__catalogue-note { max-width: 52ch; }
.hero__catalogue-note { color: var(--ink-muted); font-size: var(--body-s-size); margin: 12px 0 0; line-height: 1.5; }

/* Images carrées de catégorie */
.univ-card__img { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; margin-bottom: 18px; background: var(--surface-2); border: 1px solid var(--border-hairline); }
.univ-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gamme-head__img { width: 200px; height: 200px; overflow: hidden; float: right; margin: 0 0 16px 24px; background: var(--surface-2); border: 1px solid var(--border-hairline); }
.gamme-head__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) { .gamme-head__img { float: none; width: 100%; max-width: 320px; height: auto; aspect-ratio: 1 / 1; margin: 0 auto 16px; } }

/* Champs obligatoires manquants — encadré rouge */
.input--invalid { border-color: #c0392b !important; border-width: 2px; }
.field--invalid .field__label { color: #c0392b; }
.field__err { display: block; margin-top: 6px; font-size: 11px; letter-spacing: 0.04em; color: #c0392b; }
.checkbox-row--invalid .checkbox-box { border-color: #c0392b; border-width: 2px; }

/* Artiste — gestion des œuvres */
.work-row { display: grid; grid-template-columns: 96px 1fr auto; gap: 16px; align-items: start; padding-bottom: 16px; border-bottom: 1px solid var(--border-divider); }
.work-row__thumb { width: 96px; height: 96px; overflow: hidden; border: 1px solid var(--border-hairline); background: var(--surface-2); display: flex; align-items: center; justify-content: center; }
.work-row__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.work-row__fields { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 640px) { .work-row { grid-template-columns: 72px 1fr; } .work-row__thumb { width: 72px; height: 72px; } }

/* Upsells cadre / livraison / installation (panier) */
.upsell-list { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.upsell-list__head { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin-bottom: 2px; }
.upsell { display: flex; align-items: center; gap: 12px; cursor: pointer; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 10px 14px; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.upsell:hover { border-color: var(--accent); }
.upsell.is-on { border-color: var(--accent); background: var(--surface-1); }
.upsell__ico { width: 34px; height: 34px; flex: none; border-radius: var(--radius-pill); display: inline-flex; align-items: center; justify-content: center; color: var(--accent); border: 1px solid var(--accent-muted); }
.upsell.is-on .upsell__ico { background: var(--accent); color: var(--canvas); border-color: var(--accent); }
.upsell__txt { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.upsell__title { font-size: var(--body-s-size); color: var(--ink-primary); }
.upsell__price { font-size: 11px; letter-spacing: 0.04em; color: var(--accent); font-variant-numeric: tabular-nums; }

/* Destination de livraison (estimation DHL) */
.upsell-ship { display: flex; flex-direction: column; }
.ship-dest { margin: 6px 0 2px; padding: 12px 14px; border: 1px solid var(--border-hairline);
  border-top: 0; border-radius: 0 0 var(--radius-1) var(--radius-1); background: var(--surface-1); }
.ship-dest__head { display: flex; align-items: center; gap: 7px; font-size: 10px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: 10px; }
.ship-dest__head svg { color: var(--accent); }
.ship-dest__row { display: flex; gap: 8px; }
.ship-dest__row .input--sm { flex: 1; min-width: 0; }
.ship-dest__note { font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-muted); margin-top: 9px; }
.ship-top { margin-bottom: 24px; padding: 16px 18px; border: 1px solid var(--accent-muted); border-radius: var(--radius-1); background: var(--surface-1); }
.ship-top__head { display: flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 12px; }
.ship-top__head svg { color: var(--accent); }
.ship-top__row { display: flex; gap: 10px; max-width: 460px; }
.ship-top__row .input--sm { flex: 1; min-width: 0; }
.ship-top__note { font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-muted); margin-top: 10px; }
.atelier-note { display: flex; align-items: flex-start; gap: 9px; margin-top: 10px; padding: 11px 13px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-soft); }
.atelier-note svg { flex: none; color: var(--accent); margin-top: 1px; }
.atelier-note strong { color: var(--accent); }
.deliv-choice { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.deliv-choice__head { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); }
.deliv-choice__hint { font-size: var(--body-s-size); color: var(--accent); padding-left: 2px; }
.deliv-choice__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.deliv-opt { display: flex; flex-direction: column; gap: 5px; text-align: left; cursor: pointer; padding: 14px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); transition: border-color var(--dur-fast) var(--ease); }
.deliv-opt:hover { border-color: var(--accent); }
.deliv-opt.is-on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.deliv-opt__ico { color: var(--accent); }
.deliv-opt__title { font-size: var(--body-m-size); color: var(--ink-primary); line-height: 1.3; }
.deliv-opt__desc { font-size: var(--body-s-size); color: var(--ink-soft); }
.deliv-opt__price { margin-top: 2px; font-size: var(--body-s-size); color: var(--accent); }
.acq-block { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-divider); }
@media (max-width: 520px) { .deliv-choice__grid { grid-template-columns: 1fr; } }
.input--sm { padding: 8px 10px; font-size: var(--body-s-size); }
select.input--sm { appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23D4C5A9' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }

/* Champ titre de l'œuvre — zone à remplir bien visible */
.title-field { margin-top: 22px; }
.title-field__label { display: block; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
.title-field__input { width: 100%; background: #F5F1E8; color: #1A1712; border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 16px 18px; font-size: 16px; outline: none; transition: border-color var(--dur-fast) var(--ease); }
.title-field__input::placeholder { color: #8A8378; }
.title-field__input:focus { border-color: var(--accent-hover); border-width: 2px; padding: 15px 17px; }
.title-ac { position: relative; }
.title-ac__list { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40; background: #F5F1E8; border: 1px solid var(--accent);
  max-height: 280px; overflow-y: auto; box-shadow: 0 10px 30px rgba(0,0,0,0.35); }
.title-ac__opt { display: block; width: 100%; text-align: left; background: transparent; border: 0; border-bottom: 1px solid rgba(26,23,18,0.1);
  padding: 12px 16px; cursor: pointer; color: #1A1712; font-size: 15px; transition: background var(--dur-fast) var(--ease); }
.title-ac__opt:last-child { border-bottom: 0; }
.title-ac__opt:hover, .title-ac__opt.is-active { background: var(--accent); color: #1A1712; }
.title-ac__name { font-family: var(--font-display); }
.title-field__hint { margin-top: 10px; font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-soft); display: flex; align-items: center; gap: 12px; }
.title-field__hint--btn { width: 100%; text-align: left; background: var(--surface-1); border: 1px solid var(--accent-muted); border-radius: var(--radius-1); padding: 14px 16px; cursor: pointer; transition: border-color var(--dur-fast) var(--ease); }
.title-field__hint--btn:hover { border-color: var(--accent); }
.dispo-hint { width: 100%; text-align: left; background: var(--surface-1); border: 1px solid var(--accent-muted); border-radius: var(--radius-1); padding: 14px 16px; cursor: pointer; display: flex; align-items: center; gap: 12px; font-size: var(--body-s-size); line-height: 1.5; color: var(--ink-soft); transition: border-color var(--dur-fast) var(--ease); }
.dispo-hint:hover { border-color: var(--accent); }
.dispo-hint__ico { flex: none; color: var(--accent); }
.dispo-hint__cta { color: var(--accent); white-space: nowrap; }
.title-field__hint-ico { flex: none; width: 38px; height: 38px; border-radius: var(--radius-pill); background: var(--accent); color: #000; display: inline-flex; align-items: center; justify-content: center; }
.title-field__hint-ico svg { width: 22px; height: 22px; }
.title-field__hint-cta { color: var(--accent); white-space: nowrap; font-weight: 600; }
.upsell.is-inc { cursor: default; }
.upsell.is-inc:hover { border-color: var(--accent); }
.upsell.is-disabled { cursor: not-allowed; opacity: 0.55; }
.format-opt--off { opacity: 0.4; cursor: not-allowed; }
.format-opt--off .format-opt__radio { border-style: dashed; }
.format-opt__na { font-size: 11px; color: var(--ink-muted); letter-spacing: 0.02em; margin-left: 8px; }
.upsell.is-disabled:hover { border-color: var(--border-hairline); }
/* Échelle des paliers de gratuité (panier) */
.perks { margin-top: 16px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); padding: 18px; }
.perks__lead { font-family: var(--font-display); font-size: 17px; line-height: 1.4; color: var(--ink-soft); margin-bottom: 22px; }
.perks__lead strong { color: var(--accent); }
.perks__reward { color: var(--accent); }
.perks__track { position: relative; height: 2px; background: var(--border-hairline); margin: 0 11px 30px; }
.perks__fill { position: absolute; left: 0; top: 0; height: 100%; background: var(--accent); transition: width var(--dur-medium) var(--ease); }
.perks__node { position: absolute; top: 50%; transform: translate(-50%, -50%); }
.perks__dot { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 999px; background: var(--surface-1); border: 1px solid var(--border-hairline); color: var(--ink-muted); font-size: 11px; font-variant-numeric: tabular-nums; transition: all var(--dur-medium) var(--ease); }
.perks__node.is-on .perks__dot { background: var(--accent); border-color: var(--accent); color: var(--canvas); }
.perks__tiers { display: flex; flex-direction: column; gap: 12px; }
.perks__tier { display: flex; align-items: center; gap: 12px; color: var(--ink-muted); transition: color var(--dur-fast) var(--ease); }
.perks__tier.is-on { color: var(--ink-soft); }
.perks__tier-ico { flex: none; color: var(--ink-muted); }
.perks__tier.is-on .perks__tier-ico { color: var(--accent); }
.perks__tier-txt { display: flex; flex-direction: column; gap: 1px; flex: 1; }
.perks__tier-cond { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); }
.perks__tier-label { font-size: var(--body-s-size); color: inherit; }
.perks__tier-badge { flex: none; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--canvas); background: var(--accent); border-radius: var(--radius-pill); padding: 3px 10px; }
.perks__note { margin: 16px 0 0; font-size: 11px; color: var(--ink-muted); line-height: 1.5; padding-top: 12px; border-top: 1px solid var(--border-hairline); }
/* Modifier le format d'une ligne du panier */
.cart-edit { margin-top: 14px; padding: 14px; border: 1px solid var(--accent); border-radius: var(--radius-1); background: var(--surface-1); }
.cart-edit__label { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.cart-edit__opts { display: flex; flex-direction: column; gap: 8px; }
.cart-edit__opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; text-align: left; background: transparent; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 12px 14px; cursor: pointer; transition: border-color var(--dur-fast) var(--ease); color: var(--ink-soft); }
.cart-edit__opt:hover { border-color: var(--accent); }
.cart-edit__opt.is-on { border-color: var(--accent); background: rgba(212,197,169,0.08); }
.cart-edit__fmt { font-size: var(--body-s-size); color: var(--ink-primary); }
.cart-edit__price { font-variant-numeric: tabular-nums; color: var(--ink-soft); font-size: var(--body-s-size); }
.cart-edit__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.freebar { padding: 10px 12px; border: 1px solid var(--accent-muted); border-radius: var(--radius-1); margin-top: 6px; background: var(--surface-1); }
.freebar.is-reached { border-color: var(--accent); }
.freebar__top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.freebar__title { font-size: 12px; letter-spacing: 0.04em; color: var(--accent); }
.freebar__count { font-size: 12px; font-variant-numeric: tabular-nums; color: var(--ink-muted); }
.freebar__track { height: 6px; background: var(--surface-2); border-radius: var(--radius-pill); overflow: hidden; }
.freebar__fill { height: 100%; background: var(--accent); transition: width var(--dur-medium) var(--ease); }
.freebar__lbl { font-size: 11px; letter-spacing: 0.02em; color: var(--ink-soft); margin-top: 8px; line-height: 1.4; }
.freebar__sub { font-size: 10px; letter-spacing: 0.02em; color: var(--ink-muted); margin-top: 6px; line-height: 1.4; }
.detail__name { font-family: var(--font-display); color: var(--accent); font-size: var(--display-l-size); line-height: 1.1; margin: 12px 0 16px; }
.detail__desc { color: var(--ink-soft); font-size: var(--body-l-size); margin-bottom: var(--space-3); }
.detail__price { font-family: var(--font-display); font-size: var(--display-m-size); color: var(--ink-primary); }
.detail__price small { font-size: 14px; color: var(--ink-muted); font-family: var(--font-body); margin-left: 10px; letter-spacing: 0.04em; }
.format-list { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--border-divider); margin: var(--space-3) 0; }
.format-opt { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2);
  padding: 16px 4px; border-bottom: 1px solid var(--border-divider); cursor: pointer; transition: background var(--dur-fast) var(--ease); }
.format-opt:hover { background: var(--surface-1); }
.format-opt.is-sel { background: var(--surface-2); }
.format-opt__radio { width: 16px; height: 16px; border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); flex: none; position: relative; }
.format-opt.is-sel .format-opt__radio { border-color: var(--accent); }
.format-opt.is-sel .format-opt__radio::after { content: ""; position: absolute; inset: 3px; border-radius: var(--radius-pill); background: var(--accent); }
.format-opt__name { font-size: var(--body-m-size); }
.format-opt__pack { font-size: var(--body-s-size); color: var(--ink-muted); line-height: var(--body-s-lh); margin-top: 4px; max-width: 46ch; }
.reseller-notes { display: flex; flex-direction: column; gap: 12px; }
.reseller-note { display: flex; align-items: flex-start; gap: 10px; }
.reseller-note__ico { flex-shrink: 0; color: var(--accent); margin-top: 1px; }
.format-opt__price { font-variant-numeric: tabular-nums; color: var(--ink-primary); }

/* Sélecteur de format — plus lisible, surtout mobile */
.format-pick { margin: var(--space-3) 0; }
.format-pick__head { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.format-pick__work { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--accent); line-height: 1.2; margin-bottom: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--border-hairline); }
.format-pick__work::before { content: "« "; } .format-pick__work::after { content: " »"; }
.format-pick__title { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
.format-pick__hint { font-size: var(--body-s-size); color: var(--ink-muted); line-height: 1.5; }
.format-opt { gap: 14px; }
.format-opt__radio { width: 18px; height: 18px; border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); flex: none; position: relative; align-self: center; }
.format-opt.is-sel .format-opt__radio { border-color: var(--accent); }
.format-opt.is-sel .format-opt__radio::after { content: ""; position: absolute; inset: 4px; border-radius: var(--radius-pill); background: var(--accent); }
.format-opt__qty { color: var(--accent); font-size: 12px; }
.format-opt.is-sel { background: var(--surface-2); box-shadow: inset 3px 0 0 var(--accent); }

@media (max-width: 860px) {
  .detail { grid-template-columns: 1fr; gap: var(--space-3); }
  .scene-frame { position: static; }
  .format-opt { padding: 16px 12px; border-bottom: 1px solid var(--border-divider); flex-wrap: wrap; }
  .format-list { border: 1px solid var(--border-hairline); border-bottom: 0; border-radius: var(--radius-1); overflow: hidden; }
  .format-opt__name { font-size: var(--body-l-size); }
}

/* qty + title input */
.add-block { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-2); }
.field { display: flex; flex-direction: column; gap: 7px; }
.field__label { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); }
.input { width: 100%; background: #F5F1E8; border: 1px solid var(--accent-muted); border-radius: var(--radius-1);
  color: #1A1712; font-size: 16px; padding: 13px 15px; outline: none; transition: border-color var(--dur-fast) var(--ease); }
.input::placeholder { color: #8A8378; }
.input:focus { border-color: var(--accent); border-width: 2px; padding: 12px 14px; }
.input:focus { border-bottom-color: var(--accent); }
.stepper { display: inline-flex; align-items: center; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); }
.stepper button { width: 46px; height: 46px; font-size: 20px; color: var(--ink-soft); display: inline-flex; align-items: center; justify-content: center; }
.stepper button:hover { color: var(--accent); }
.stepper__val { min-width: 52px; text-align: center; font-variant-numeric: tabular-nums; font-size: 16px; }

.notice { border: 1px solid var(--border-hairline); background: var(--surface-1); padding: 14px 18px;
  color: var(--ink-muted); font-size: var(--body-s-size); border-radius: var(--radius-1); }
.notice--accent { border-color: var(--accent-muted); color: var(--ink-soft); }

/* ----------------------------- Cart / Devis ----------------------------- */
.cart { padding: var(--space-4) 0; }
.cart-line { display: block; padding: var(--space-3); margin-bottom: var(--space-2); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); }
.cart-line__lead { min-width: 0; }
.cart-line__head { display: flex; gap: var(--space-2); align-items: flex-start; justify-content: space-between; }
.cart-line__thumb { width: 72px; height: 72px; flex: none; background: #000; border: 1px solid var(--border-hairline); overflow: hidden; }
.cart-line__row { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-2); flex-wrap: wrap; }
.cart-line__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.cart-line__title { font-family: var(--font-display); color: var(--accent); font-size: var(--display-s-size); }
.cart-line__meta { color: var(--ink-muted); font-size: var(--body-s-size); margin-top: 6px; }
.cart-line__price { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; display: flex; flex-direction: column; justify-content: center; }
.cart-line__unit { color: var(--ink-muted); font-size: var(--body-s-size); }
.cart-line__strike { color: var(--ink-muted); text-decoration: line-through; margin-right: 8px; }
.cart-controls { display: flex; align-items: center; gap: var(--space-2); margin-top: 12px; }
.cart-line__row .cart-controls { margin-top: 0; }
.cart-line__row { align-items: center; }
.summary { border: 1px solid var(--border-hairline); padding: var(--space-3); background: var(--surface-1); }
.account-close { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill); cursor: pointer; flex: none; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.account-close:hover { color: var(--accent); border-color: var(--accent); }
.summary__row { display: flex; justify-content: space-between; padding: 9px 0; font-size: var(--body-m-size); }
.summary__row--total { border-top: 1px solid var(--border-divider); margin-top: 8px; padding-top: 16px; font-family: var(--font-display); font-size: var(--display-s-size); }
.cart-grid { display: grid; grid-template-columns: 1.5fr 0.8fr; gap: var(--space-4); align-items: start; }
@media (max-width: 900px) { .cart-grid { grid-template-columns: 1fr; } .summary { position: static; } }

.seg { display: inline-flex; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); overflow: hidden; }
.seg button { padding: 12px 18px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-muted); white-space: nowrap; }
.seg button.is-active { background: var(--accent); color: var(--canvas); }

/* entity split notice */
.entity-tag { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); }

/* ----------------------------- Devis document (print) ----------------------------- */
.devis-doc { background: #fff; color: #161310; padding: 54px 56px; max-width: 820px; margin: 0 auto;
  font-family: var(--font-body); line-height: 1.5; }
.devis-doc h1, .devis-doc h2, .devis-doc h3 { font-family: var(--font-display); font-weight: 400; color: #161310; margin: 0; }
.devis-doc .d-eyebrow { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: #8a8378; }
.devis-doc .d-rule { border: 0; border-top: 1px solid #d9d3c7; margin: 22px 0; }
.devis-doc .d-rule--strong { border-top: 1.5px solid #161310; }
.devis-head { display: flex; justify-content: space-between; gap: 30px; align-items: flex-start; }
.devis-entity { font-size: 12px; color: #4d473d; line-height: 1.7; }
.devis-entity strong { color: #161310; }
.devis-table { width: 100%; border-collapse: collapse; margin: 8px 0; }
.devis-table th { text-align: left; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: #8a8378; padding: 10px 8px; border-bottom: 1px solid #161310; font-weight: 600; }
.devis-table td { padding: 13px 8px; border-bottom: 1px solid #e4ded2; font-size: 13px; vertical-align: top; font-variant-numeric: tabular-nums; }
.devis-table .t-right { text-align: right; }
.devis-table .t-art { font-family: var(--font-display); color: #3a342b; }
.devis-table .t-finish { display: block; font-family: var(--font-body); font-size: 10px; color: #8a8378; margin-top: 4px; letter-spacing: 0.02em; }
.devis-totals { margin-left: auto; width: 320px; }
.devis-totals .tt-row { display: flex; justify-content: space-between; padding: 7px 0; font-size: 13px; font-variant-numeric: tabular-nums; }
.devis-totals .tt-row--grand { font-family: var(--font-display); font-size: 20px; border-top: 1.5px solid #161310; margin-top: 6px; padding-top: 14px; }
.devis-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 34px; }
.devis-sign__box { border: 1px solid #d9d3c7; padding: 16px; min-height: 150px; }
.devis-sign__label { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: #8a8378; margin-bottom: 8px; }
.devis-sign__img { max-height: 96px; }
.devis-legal { font-size: 10.5px; color: #6c665b; line-height: 1.6; margin-top: 26px; }
/* Mon compte · disclosure repliable « Mes informations » */
.profile-disclose { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); }
.profile-disclose__summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-2); padding: 18px var(--space-3); }
.profile-disclose__summary::-webkit-details-marker { display: none; }
.profile-disclose__title { display: block; font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.profile-disclose__hint { display: block; font-size: var(--body-s-size); color: var(--ink-muted); margin-top: 3px; }
.profile-disclose__chev { flex: none; color: var(--accent); transition: transform var(--dur-fast) var(--ease); }
.profile-disclose[open] .profile-disclose__chev { transform: rotate(180deg); }
.profile-disclose__body { padding: 0 var(--space-3) var(--space-3); border-top: 1px solid var(--border-divider); padding-top: var(--space-3); }
/* Arrhes encadrées dans le devis */
.devis-arrhes { margin-top: 12px; border: 1.5px solid #161310; padding: 14px 16px; background: rgba(212, 197, 169, 0.16); }
.devis-arrhes__cartouche { font-size: 9.5px; letter-spacing: 0.16em; text-transform: uppercase; color: #6c665b; margin-bottom: 10px; }
.devis-arrhes__main { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid #d9d3c7; }
.devis-arrhes__lbl { font-size: 12px; color: #3a342b; line-height: 1.4; }
.devis-arrhes__lbl small { color: #8a8378; font-size: 10px; }
.devis-arrhes__amt { font-family: var(--font-display); font-size: 24px; color: #161310; font-variant-numeric: tabular-nums; white-space: nowrap; }
.devis-arrhes .tt-row { display: flex; justify-content: space-between; padding: 5px 0; font-size: 12px; font-variant-numeric: tabular-nums; color: #3a342b; }
.devis-status { display: inline-block; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; padding: 5px 12px; border: 1px solid #161310; color: #161310; }

/* ----------------------------- Signature canvas ----------------------------- */
.sigpad { width: 100%; height: 200px; background: var(--surface-1); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); touch-action: none; cursor: crosshair; }
.sigpad.is-ready { border-color: var(--accent); }
.checkbox-row { display: flex; gap: 14px; align-items: flex-start; cursor: pointer; padding: 6px 0; }
.checkbox-box { width: 22px; height: 22px; border: 1px solid var(--accent-muted); border-radius: var(--radius-1); flex: none; position: relative; transition: border-color var(--dur-fast) var(--ease); margin-top: 2px; }
.checkbox-row:hover .checkbox-box { border-color: var(--accent); }
.checkbox-box.is-on { border-color: var(--accent); background: var(--accent); }
.checkbox-box.is-on::after { content: ""; position: absolute; left: 7px; top: 3px; width: 5px; height: 10px; border: solid var(--canvas); border-width: 0 2px 2px 0; transform: rotate(45deg); }

/* ----------------------------- Modal ----------------------------- */
.overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); z-index: 1300; display: flex; align-items: center; justify-content: center; padding: var(--space-2); }
.modal { background: var(--surface-2); border: 1px solid var(--border-hairline); max-width: 440px; width: 100%; padding: var(--space-4); position: relative; max-height: 92vh; overflow-y: auto; }
.modal__close { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; color: var(--ink-muted); display: inline-flex; align-items: center; justify-content: center; }
.modal__close:hover { color: var(--accent); }
@media (max-width: 560px) {
  .overlay { padding: 0; align-items: flex-end; }
  .modal { max-width: none; width: 100%; max-height: 94vh; padding: var(--space-3) var(--space-2) calc(var(--space-3) + env(safe-area-inset-bottom));
    border-left: 0; border-right: 0; border-bottom: 0; border-radius: 14px 14px 0 0; }
  .modal__close { top: 12px; right: 12px; width: 40px; height: 40px; }
  .modal .field-grid-2 { grid-template-columns: 1fr; gap: 14px; }
  .modal .input, .modal textarea.input { font-size: 16px; padding: 13px 14px; }
}
.pin-dots { display: flex; gap: 14px; justify-content: center; margin: var(--space-3) 0; }
.pin-dot { width: 14px; height: 14px; border-radius: var(--radius-pill); border: 1px solid var(--accent-muted); }
.pin-dot.is-on { background: var(--accent); border-color: var(--accent); }
.pin-keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pin-key { padding: 18px 0; font-size: 22px; font-family: var(--font-display); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); transition: border-color var(--dur-fast) var(--ease); }
.pin-key:hover { border-color: var(--accent); }

/* ----------------------------- ARTISTE mode ----------------------------- */
.a-shell { padding: var(--space-3) 0 var(--space-5); }
/* Menu de navigation groupé (admin) */
.adminnav { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--border-hairline); margin-bottom: var(--space-3); }
.adminnav__grp { position: relative; }
.adminnav__btn { display: inline-flex; align-items: center; gap: 8px; padding: 13px 16px; border-bottom: 2px solid transparent; background: none; color: var(--ink-muted); cursor: pointer; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; transition: color var(--dur-fast) var(--ease); white-space: nowrap; }
.adminnav__btn:hover { color: var(--ink-primary); }
.adminnav__btn.is-active { color: var(--accent); border-bottom-color: var(--accent); }
.adminnav__cur { text-transform: none; letter-spacing: 0; font-size: 11px; color: var(--ink-soft); border-left: 1px solid var(--border-divider); padding-left: 8px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.adminnav__chev { transition: transform var(--dur-fast) var(--ease); opacity: 0.7; }
.adminnav__btn.is-open .adminnav__chev { transform: rotate(180deg); }
.adminnav__pop { position: absolute; top: calc(100% + 2px); left: 0; z-index: 30; min-width: 230px; background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 6px; display: flex; flex-direction: column; }
.adminnav__item { text-align: left; background: none; border: 0; color: var(--ink-soft); padding: 11px 12px; font-size: 13px; cursor: pointer; border-radius: var(--radius-1); transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.adminnav__item:hover { background: var(--surface-2); color: var(--accent); }
.adminnav__item.is-active { color: var(--accent); box-shadow: inset 2px 0 0 var(--accent); }
@media (max-width: 600px) { .adminnav__btn { padding: 12px 12px; } .adminnav__cur { display: none; } .adminnav__pop { left: 0; right: auto; min-width: 200px; } }

.a-tabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--border-hairline); margin-bottom: var(--space-3); }
.a-tab { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); padding: 14px 18px; border-bottom: 2px solid transparent; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.a-tab:hover { color: var(--ink-primary); }
.a-tab.is-active { color: var(--accent); border-bottom-color: var(--accent); }
@media (max-width: 1024px) {
  .a-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; gap: 0; }
  .a-tab { flex: none; white-space: nowrap; padding: 14px 14px; }
}
.a-title { font-family: var(--font-display); font-size: var(--display-m-size); margin: 0 0 6px; }
.a-banner { display: flex; align-items: center; gap: 14px; background: var(--surface-1); border: 1px solid var(--accent-muted); padding: 12px 18px; margin-bottom: var(--space-3); border-radius: var(--radius-1); }
.a-banner .eyebrow { color: var(--accent); }

.a-card { border: 1px solid var(--border-hairline); background: var(--surface-1); padding: var(--space-3); margin-bottom: var(--space-3); min-width: 0; }
.a-card__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-2); margin-bottom: var(--space-2); flex-wrap: wrap; }
.a-card__name { font-family: var(--font-display); font-size: var(--display-s-size); }

/* fiche table (mirror of the sheet) */
.fiche-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fiche { border-collapse: collapse; width: 100%; min-width: 720px; font-variant-numeric: tabular-nums; }
.fiche th { font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted);
  font-weight: 600; padding: 10px 10px; text-align: right; border-bottom: 1px solid var(--border-hairline); vertical-align: bottom; }
.fiche th:first-child, .fiche td:first-child { text-align: left; position: sticky; left: 0; background: var(--surface-1); z-index: 1; }
.fiche td { padding: 6px 10px; text-align: right; border-bottom: 1px solid var(--border-divider); font-size: 13px; white-space: nowrap; }
.fiche tr:hover td { background: rgba(212,197,169,0.04); }
.fiche tr:hover td:first-child { background: #121110; }
.fiche .calc { color: var(--ink-muted); }
.fiche .calc-strong { color: var(--ink-primary); }
.fiche .accent { color: var(--accent); }
.col-group { background: rgba(212,197,169,0.05); }
/* editable cell input */
.cell-input { width: 84px; background: transparent; border: 0; border-bottom: 1px solid var(--accent-muted);
  color: var(--accent); text-align: right; padding: 5px 2px; outline: none; font-variant-numeric: tabular-nums;
  font-size: 13px; transition: border-color var(--dur-fast) var(--ease); border-radius: 0; }
.cell-input:focus { border-bottom-color: var(--accent); }
.cell-input--wide { width: 110px; }
.cell-input--text { text-align: left; width: 138px; }
.cell-input--text::placeholder { color: var(--ink-muted); opacity: 0.55; }
.fmt-del { flex: none; width: 20px; height: 20px; line-height: 18px; padding: 0; border-radius: 50%;
  border: 1px solid var(--border-hairline); background: transparent; color: var(--ink-muted);
  font-size: 14px; cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.fmt-del:hover { border-color: #c2453a; color: #e0584b; background: rgba(194,69,58,0.12); }
.fmt-eye { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; padding: 0; border-radius: 50%; border: 1px solid var(--border-hairline);
  background: transparent; color: var(--accent); cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.fmt-eye:hover { border-color: var(--accent); background: rgba(212,197,169,0.1); }
.fmt-eye.is-off { color: var(--ink-muted); }
.fmt-tag-masque { flex: none; font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-muted); border: 1px solid var(--border-hairline); border-radius: 999px; padding: 2px 8px; }
.fiche-row--hidden td:not(:first-child) { opacity: 0.4; }
.fiche-row--hidden .cell-input--text { color: var(--ink-muted); }
.fiche-add-row td { text-align: left !important; padding-top: 12px; white-space: normal; }
.fiche-add-row:hover td { background: transparent; }

/* Tableaux de chiffres (Catalogue & marges) — compact et lisible sur mobile */
.fiche-scroll { position: relative; }
@media (max-width: 820px) {
  .fiche-scroll { border: 1px solid var(--border-divider); border-radius: var(--radius-1); }
  .fiche { min-width: 0; }
  .fiche th { font-size: 8.5px; padding: 7px 5px; letter-spacing: 0.04em; }
  .fiche td { padding: 5px 5px; font-size: 12px; }
  .fiche th:first-child, .fiche td:first-child { box-shadow: 1px 0 0 var(--border-divider); padding-right: 8px; }
  .cell-input { width: 52px; font-size: 12.5px; padding: 5px 1px; }
  .cell-input--wide { width: 64px; }
  .cell-input--text { width: 96px; }
  .param__input .cell-input { width: 72px; font-size: 16px; }
}
.fmt-add { background: transparent; border: 1px dashed var(--accent-muted); color: var(--accent);
  padding: 7px 16px; border-radius: 999px; font-size: 12px; letter-spacing: 0.04em; cursor: pointer;
  transition: all var(--dur-fast) var(--ease); }
.fmt-add:hover { border-color: var(--accent); border-style: solid; background: rgba(212,197,169,0.08); }
.legend { display: flex; gap: var(--space-3); flex-wrap: wrap; margin: 10px 0 0; font-size: 11px; color: var(--ink-muted); }
.legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend .swatch { width: 18px; height: 0; border-top: 1px solid; }
.legend .swatch--edit { border-color: var(--accent); }
.legend .swatch--calc { border-color: var(--ink-muted); }

/* params grid */
.param-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-2); }
.param { border: 1px solid var(--border-hairline); padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.param__label { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.param__input { display: flex; align-items: baseline; gap: 8px; }
.param__input .cell-input { width: 90px; font-size: 18px; font-family: var(--font-display); border-bottom-width: 1px; }
.param__unit { color: var(--ink-muted); font-size: 13px; }

/* clients list */
.client-row { display: grid; grid-template-columns: 1fr auto auto; gap: var(--space-2); align-items: center; padding: 16px 0; border-bottom: 1px solid var(--border-divider); }
.client-row__email { font-size: var(--body-m-size); color: var(--ink-primary); }
.client-row__meta { color: var(--ink-muted); font-size: var(--body-s-size); margin-top: 4px; }
.promo-row { display: grid; grid-template-columns: 1.4fr 0.9fr 0.7fr 1fr auto; gap: 14px; align-items: start; padding-bottom: 16px; border-bottom: 1px solid var(--border-divider); }
@media (max-width: 760px) { .promo-row { grid-template-columns: 1fr 1fr; } }

/* Compte client & CRM */
.field-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
@media (max-width: 560px) { .field-grid-2 { grid-template-columns: 1fr; } }
.interets-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 560px) { .interets-grid { grid-template-columns: 1fr; } }
.interet { display: flex; align-items: center; gap: 12px; cursor: pointer; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 12px 14px; transition: border-color var(--dur-fast) var(--ease); }
.interet:hover { border-color: var(--accent); }
.interet.is-on { border-color: var(--accent); }
.interet__lbl { font-size: var(--body-s-size); color: var(--ink-primary); }
.crm-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.crm-tag { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); padding: 3px 10px; }
.imgdrop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center;
  border: 1px dashed var(--accent-muted); border-radius: var(--radius-1); padding: 22px 18px; color: var(--ink-soft); cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.imgdrop:hover, .imgdrop.is-over { border-color: var(--accent); background: var(--surface-1); color: var(--ink-primary); }
.imgdrop svg { color: var(--accent); }
.imgdrop__lbl { font-size: var(--body-s-size); }
.imgdrop__hint { font-size: 11px; color: var(--ink-muted); }
.vignette-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (max-width: 720px) { .vignette-grid { grid-template-columns: 1fr; } }
.vignette-prev { aspect-ratio: 1 / 1; background: var(--surface-1); border: 1px solid var(--border-hairline); display: flex; align-items: center; justify-content: center; margin-bottom: 12px; overflow: hidden; }
.vignette-prev img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ============================ CATALOGUE (client) ============================ */
.cat-sec__title { font-family: var(--font-display); font-size: var(--display-l-size); line-height: var(--display-l-lh); font-weight: 400; margin: 8px 0 0; }
.cat-tabs { display: inline-flex; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); overflow: hidden; }
.cat-tabs button { padding: 10px 18px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); background: transparent; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.cat-tabs button.is-active { background: var(--accent); color: #000; }

.cat-filters { display: flex; flex-direction: column; gap: 18px; margin-top: var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--border-divider); border-bottom: 1px solid var(--border-divider); }
.cat-filters__group { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.cat-filters__label { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-muted); min-width: 64px; }
.cat-swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.cat-swatch { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); background: transparent; color: var(--ink-soft); cursor: pointer; font-size: var(--body-s-size); transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.cat-swatch:hover { border-color: var(--accent); }
.cat-swatch.is-on { border-color: var(--accent); color: var(--ink-primary); }
.cat-swatch--all { padding: 6px 14px; }
.cat-swatch__dot { width: 20px; height: 20px; border-radius: var(--radius-pill); border: 1px solid rgba(255,255,255,0.2); display: inline-block; }
.cat-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.cat-chip { padding: 7px 14px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); background: transparent; color: var(--ink-soft); cursor: pointer; font-size: var(--body-s-size); transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.cat-chip:hover { border-color: var(--accent); }
.cat-chip.is-on { border-color: var(--accent); color: var(--ink-primary); background: var(--surface-2); }
@media (max-width: 600px) {
  .cat-filters { gap: 12px; margin-top: var(--space-2); }
  .cat-filters__group { flex-direction: column; align-items: stretch; gap: 8px; }
  .cat-filters__label { min-width: 0; }
  .cat-chips, .cat-swatches { flex-wrap: nowrap; overflow-x: auto; gap: 7px; padding-bottom: 6px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .cat-chips::-webkit-scrollbar, .cat-swatches::-webkit-scrollbar { display: none; }
  .cat-chip { flex: none; white-space: nowrap; padding: 8px 14px; }
}
.cat-chip--add { color: var(--accent); }

.cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
@media (max-width: 880px) { .cat-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .cat-grid { grid-template-columns: 1fr; } }
.cat-card { position: relative; }
.cat-card__media { display: block; width: 100%; aspect-ratio: 1 / 1; background: var(--surface-1); border: 1px solid var(--border-hairline); padding: 0; overflow: hidden; cursor: pointer; position: relative; }
.cat-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: opacity var(--dur-slow) var(--ease); }
.cat-card:hover .cat-card__media { border-color: var(--accent); }
.cat-card__ph { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--ink-muted); font-size: var(--body-s-size); }
.cat-card__count { position: absolute; left: 10px; bottom: 10px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: #fff; background: rgba(0,0,0,0.55); padding: 4px 10px; border-radius: var(--radius-pill); }
.cat-card__fav { position: absolute; top: 10px; right: 10px; width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-pill); background: rgba(0,0,0,0.5); border: 1px solid rgba(212,197,169,0.4); color: #fff; cursor: pointer; transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.cat-card__fav:hover { background: rgba(0,0,0,0.7); color: var(--accent); }
.cat-card__fav.is-on { color: var(--accent); }
.cat-card__fav--inline { position: static; width: auto; height: auto; gap: 8px; padding: 8px 16px; background: transparent; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
.cat-card__body { padding: 12px 2px 0; cursor: pointer; }
.cat-card__title { font-size: var(--display-s-size); line-height: 1.2; }
.cat-card__meta { font-size: var(--body-s-size); color: var(--ink-muted); margin-top: 4px; }

.cat-detail__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: var(--space-3); flex-wrap: wrap; }
.cat-detail__title { font-family: var(--font-display); font-size: var(--display-l-size); font-weight: 400; margin: 8px 0 0; }
.cat-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.cat-tag { font-size: 11px; letter-spacing: 0.1em; color: var(--accent); border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); padding: 4px 12px; }
.cat-detail__cta { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--border-divider); }

/* Favoris — incitation à l'achat */
.fav-cta { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--border-divider); }
.fav-cta__head { margin-bottom: var(--space-3); }
.fav-cta__title { font-family: var(--font-display); font-size: var(--display-m-size); font-weight: 400; margin: 8px 0 10px; }
.fav-cta__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }
@media (max-width: 720px) { .fav-cta__grid { grid-template-columns: 1fr; } }
.fav-tile { text-align: left; display: flex; flex-direction: column; gap: 6px; padding: var(--space-3); background: var(--surface-1); border: 1px solid var(--border-hairline); cursor: pointer; transition: border-color var(--dur-fast) var(--ease); }
.fav-tile:hover { border-color: var(--accent); }
.fav-tile--accent { background: var(--surface-2); }
.fav-tile__eyebrow { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-muted); }
.fav-tile__name { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.fav-tile__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.fav-tile__go { margin-top: 6px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); }

/* Admin collections */
.cat-admin-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .cat-admin-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .cat-admin-grid { grid-template-columns: 1fr; } }
.cat-admin-card { border: 1px solid var(--border-hairline); background: var(--surface-1); }
.cat-admin-card__media { display: block; width: 100%; aspect-ratio: 1 / 1; background: var(--surface-2); border: 0; padding: 0; overflow: hidden; cursor: pointer; }
.cat-admin-card__media img { width: 100%; height: 100%; object-fit: cover; }
.cat-admin-card__media span { display: flex; align-items: center; justify-content: center; height: 100%; }
.cat-admin-card__body { padding: 12px 14px 14px; }
.cat-admin-card__title { font-family: var(--font-display); font-size: var(--display-s-size); }
.cat-admin-card__meta { font-size: var(--body-s-size); color: var(--ink-muted); margin-top: 4px; }
.online-dot { display: inline-block; width: 8px; height: 8px; border-radius: var(--radius-pill); background: #3FB36B; margin-right: 8px; vertical-align: middle; box-shadow: 0 0 0 0 #3FB36B; animation: onlinePulse 2s var(--ease) infinite; }
.online-dot.is-off { background: var(--ink-muted); animation: none; }
.online-dot--lg { width: 10px; height: 10px; margin-right: 0; }
@keyframes onlinePulse { 0% { opacity: 1; } 50% { opacity: 0.4; } 100% { opacity: 1; } }
.conn-table { display: flex; flex-direction: column; }
.conn-row { display: grid; grid-template-columns: 1.6fr 1.1fr 1fr 1.3fr; gap: 14px; align-items: center; padding: 11px 0; border-top: 1px solid var(--border-divider); font-size: var(--body-s-size); cursor: pointer; }
.conn-row:hover:not(.conn-row--head) { background: var(--surface-1); }
.conn-row--head { border-top: 0; color: var(--ink-muted); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: default; }
.conn-row--head:hover { background: transparent; }
.conn-name { display: flex; align-items: center; gap: 8px; color: var(--ink-primary); font-weight: 600; }
.conn-live { color: #3FB36B; }
@media (max-width: 680px) { .conn-row { grid-template-columns: 1fr 1fr; gap: 6px 12px; } .conn-row--head { display: none; } .conn-name { grid-column: 1 / -1; } }
.online-banner { display: inline-flex; align-items: center; gap: 10px; border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); padding: 8px 16px; margin: 4px 0 16px; font-size: var(--body-s-size); color: var(--ink-soft); }

/* Pied de page — menu organisé + CGV */
.footer { border-top: 1px solid var(--border-hairline); margin-top: var(--space-5); background: var(--canvas); }
.footer__inner { display: grid; grid-template-columns: 1.3fr 2fr; gap: var(--space-4); padding: var(--space-5) var(--space-3) var(--space-4); }
.footer__word { display: inline-block; font-family: var(--font-display); font-weight: 400; font-size: 22px; letter-spacing: 0.05em; color: var(--ink-primary);
  background: none; border: 0; padding: 0; cursor: pointer; text-align: left; transition: color var(--dur-fast) var(--ease); }
.footer__word:hover { color: var(--accent); }
.footer__lockup { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-muted); margin-top: 8px; }
.footer__note { font-size: var(--body-s-size); line-height: 1.6; color: var(--ink-soft); margin-top: 16px; max-width: 36ch; }
.footer__cb { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding: 11px 20px; border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); background: transparent; color: var(--accent); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.footer__cb:hover { background: var(--accent); color: var(--canvas); border-color: var(--accent); }
.footer__cb svg { width: 15px; height: 15px; }
.footer__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.footer__col { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.footer__coltitle { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 4px; }
.footer__link { background: transparent; border: 0; padding: 0; cursor: pointer; color: var(--ink-soft); font-size: var(--body-s-size); letter-spacing: 0.02em; transition: color var(--dur-fast) var(--ease); text-align: left; white-space: nowrap; }
.footer__link:hover { color: var(--accent); }
.footer__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 20px var(--space-3); border-top: 1px solid var(--border-divider); }
.footer__copy { font-size: 11px; letter-spacing: 0.06em; color: var(--ink-muted); }
.footer__cgv-mini { color: var(--ink-muted); border-bottom: 1px solid transparent; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.footer__cgv-mini:hover { color: var(--accent); border-bottom-color: var(--accent); }
.footer__cgv { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); border-bottom: 1px solid transparent; transition: border-color var(--dur-fast) var(--ease); }
.footer__cgv:hover { border-bottom-color: var(--accent); }
.footer__cgv svg { width: 15px; height: 15px; }
@media (max-width: 760px) {
  .footer__inner { grid-template-columns: 1fr; gap: var(--space-3); padding-top: var(--space-4); }
  .footer__cols { grid-template-columns: 1fr 1fr; gap: var(--space-2); }
  .footer__link { white-space: normal; }
  .footer__bar { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* Paiement en plusieurs fois */
.install { border: 1px solid var(--border-hairline); padding: 16px; }
.install__label { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 12px; }
.install__opts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
@media (max-width: 560px) { .install__opts { grid-template-columns: 1fr 1fr; } }
.install__opt { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px 14px; border: 1px solid var(--border-hairline); background: transparent; cursor: pointer; text-align: left; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.install__opt:hover { border-color: var(--accent); }
.install__opt.is-on { border-color: var(--accent); background: var(--surface-2); }
.install__n { font-family: var(--font-display); font-size: 18px; color: var(--ink-primary); }
.install__fee { font-size: 11px; letter-spacing: 0.04em; color: var(--ink-soft); }
.install__per { font-size: 12px; color: var(--accent); font-variant-numeric: tabular-nums; }
.install__detail { font-size: var(--body-s-size); color: var(--ink-soft); margin-top: 12px; line-height: 1.5; }

/* Mise en avant paiement plusieurs fois sur page produit */
.pay-teaser { margin-top: 18px; border: 1px solid var(--accent-muted); padding: 16px; background: var(--surface-1); }
.pay-teaser__head { display: flex; align-items: center; gap: 9px; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
.pay-teaser__opts { display: flex; gap: 8px; }
.pay-teaser__opt { flex: 1 1 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 13px 6px; border: 1px solid var(--border-hairline); background: transparent; cursor: pointer; font-family: var(--font-display); font-size: 16px; color: var(--ink-soft); transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.pay-teaser__opt:hover { border-color: var(--accent); }
.pay-teaser__opt.is-on { border-color: var(--accent); background: var(--surface-2); color: var(--ink-primary); }
.pay-teaser__per small { font-size: 11px; color: var(--ink-muted); margin-left: 1px; }
.pay-teaser__fee { font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-soft); }
.pay-teaser__note { font-size: 11px; color: var(--ink-muted); margin-top: 12px; line-height: 1.5; }

/* Bouton flottant « être rappelé » */
.callback-fab { position: fixed; right: 18px; bottom: 18px; z-index: 80; display: inline-flex; align-items: center; gap: 12px;
  background: var(--ink-primary); color: var(--canvas); border: 1px solid var(--accent); border-radius: var(--radius-pill);
  padding: 14px 28px; font-size: 12px; letter-spacing: 0.06em; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); max-width: 78vw; }
.callback-fab svg { width: 22px; height: 22px; color: #000; fill: #000; flex-shrink: 0; }
.callback-fab:hover { background: var(--accent); color: var(--canvas); }
.callback-fab:hover svg { fill: var(--canvas); color: var(--canvas); }
@media (max-width: 600px) { .callback-fab { left: 12px; right: 12px; transform: none; bottom: 12px; padding: 15px 20px; font-size: 11px; max-width: none; width: auto; justify-content: center; } .callback-fab svg { width: 21px; height: 21px; } }
@media (max-width: 900px) { body:not(.is-artiste) footer.no-print { padding-bottom: 96px !important; } }

/* Messagerie client (bulle flottante) */
.cc-fab { position: fixed; right: 18px; bottom: 18px; z-index: 82; width: 56px; height: 56px; border-radius: var(--radius-pill);
  background: var(--canvas); color: var(--accent); border: 1px solid var(--accent); cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.cc-fab:hover, .cc-fab.is-open { background: var(--accent); color: var(--canvas); }
.cc-fab__badge { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: var(--radius-pill);
  background: var(--accent); color: var(--canvas); font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid var(--canvas); }
/* Bouton « être appelé » dans le panneau de chat (sous la discussion) */
.cc-callback { flex: none; display: flex; align-items: center; justify-content: center; gap: 9px; margin: 0; padding: 12px 14px;
  border-top: 1px solid var(--border-divider); background: none; color: var(--accent); cursor: pointer; font-family: var(--font-body);
  font-size: 12px; letter-spacing: 0.04em; transition: background var(--dur-fast) var(--ease); width: 100%; }
.cc-callback:hover { background: var(--surface-2); }
.cc-callback svg { flex: none; }
@media (max-width: 600px) { .callback-fab { bottom: 16px !important; left: 12px; right: 80px; } .cc-fab { bottom: 16px; right: 14px; } }

.cc-peek { position: fixed; right: 18px; bottom: 84px; z-index: 82; width: 300px; max-width: calc(100vw - 36px); text-align: left;
  background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 12px 14px; cursor: pointer;
  display: flex; flex-direction: column; gap: 3px; animation: ccPeekIn var(--dur-medium) var(--ease); }
@keyframes ccPeekIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.cc-peek__from { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
.cc-peek__txt { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.cc-panel { position: fixed; right: 18px; bottom: 84px; z-index: 83; width: 360px; max-width: calc(100vw - 28px); height: min(540px, calc(100vh - 130px));
  background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-1); display: flex; flex-direction: column; overflow: hidden; }
.cc-panel__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid var(--border-divider); flex: none; }
.cc-panel__title { font-family: var(--font-display); font-size: 18px; color: var(--ink-primary); }
.cc-panel__sub { font-size: 12px; color: var(--ink-muted); margin-top: 2px; }
.cc-panel__x { background: none; border: 0; color: var(--ink-muted); cursor: pointer; padding: 2px; display: flex; }
.cc-panel__x:hover { color: var(--accent); }
.cc-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.cc-empty { font-size: var(--body-s-size); color: var(--ink-muted); line-height: 1.6; }
.cc-msg { display: flex; flex-direction: column; gap: 3px; max-width: 86%; }
.cc-msg--me { align-self: flex-end; align-items: flex-end; }
.cc-msg--them { align-self: flex-start; align-items: flex-start; }
.cc-bubble { padding: 10px 13px; border-radius: var(--radius-1); font-size: var(--body-s-size); line-height: 1.5; display: flex; flex-direction: column; gap: 8px; }
.cc-msg--me .cc-bubble { background: var(--accent); color: var(--canvas); }
.cc-msg--them .cc-bubble { background: var(--surface-2); color: var(--ink-soft); border: 1px solid var(--border-divider); }
.cc-bubble__txt { white-space: pre-wrap; word-wrap: break-word; }
.cc-link { background: none; border: 1px solid currentColor; color: inherit; border-radius: var(--radius-pill); padding: 7px 14px; font-family: var(--font-body);
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; align-self: flex-start; transition: opacity var(--dur-fast) var(--ease); }
.cc-link:hover { opacity: 0.7; }
.cc-time { font-size: 10px; color: var(--ink-muted); }
/* Carte œuvre dans le chat (client) — vignette + accès direct */
.chat-work { display: flex; align-items: center; gap: 12px; margin-top: 8px; padding: 8px; width: 100%; text-align: left;
  border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--canvas); cursor: pointer; transition: border-color var(--dur-fast) var(--ease); }
.chat-work:hover { border-color: var(--accent); }
.chat-work__thumb { flex: none; width: 52px; height: 52px; background: var(--surface-2); border: 1px solid var(--border-hairline); overflow: hidden; display: block; }
.chat-work__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.chat-work__info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chat-work__title { font-size: 14px; color: var(--accent); line-height: 1.25; }
.chat-work__cta { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); }
.chat-work__fmt { font-size: 11px; color: var(--ink-soft); }
.achat-work__fmt { font-size: 11px; color: var(--ink-muted); margin-left: 6px; }
.msg-compose__fmt { width: auto; min-width: 0; font-size: 11px; padding: 4px 8px; margin-left: 4px; }
/* Aperçu œuvre côté atelier (inline, non cliquable) */
.achat-work { display: inline-flex; align-items: center; gap: 9px; margin-top: 6px; padding: 6px; border: 1px solid var(--border-divider); border-radius: var(--radius-1); }
.achat-work__thumb { flex: none; width: 38px; height: 38px; background: var(--surface-2); overflow: hidden; display: block; }
.achat-work__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.achat-work__title { font-size: 13px; }
.cc-foot { display: flex; align-items: flex-end; gap: 8px; padding: 12px; border-top: 1px solid var(--border-divider); flex: none; }
.cc-input { flex: 1; resize: vertical; max-height: 160px; min-height: 64px; padding: 10px 12px; background: var(--canvas); color: var(--ink-primary);
  border: 1px solid var(--border-hairline); border-radius: var(--radius-1); font-family: var(--font-body); font-size: var(--body-s-size); line-height: 1.5; }
.cc-input:focus { outline: none; border-color: var(--accent); }
.cc-send { flex: none; width: 40px; height: 40px; border-radius: var(--radius-1); border: 1px solid var(--accent); background: var(--accent); color: var(--canvas);
  cursor: pointer; display: flex; align-items: center; justify-content: center; transition: opacity var(--dur-fast) var(--ease); }
.cc-send:disabled { opacity: 0.4; cursor: default; }
@media (max-width: 600px) {
  .cc-peek { right: 10px; left: 10px; width: auto; }
  .cc-panel { right: 8px; left: 8px; width: auto; top: max(10px, env(safe-area-inset-top)); bottom: calc(76px + env(safe-area-inset-bottom)); height: auto; max-height: none; }
  .cc-panel__head { padding: 14px; }
  .cc-body { padding: 14px; }
  .cc-msg { max-width: 92%; }
  .cc-foot { padding: 10px; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
}

/* Verrou Grand Format */
.gate { max-width: 420px; margin: var(--space-5) auto; text-align: center; }
.gate__title { font-family: var(--font-display); font-size: var(--display-m-size); margin: var(--space-2) 0; }
.gate__dots { display: flex; gap: 14px; justify-content: center; margin: var(--space-3) 0; }
.gate__dot { width: 14px; height: 14px; border-radius: var(--radius-pill); border: 1px solid var(--accent-muted); }
.gate__dot.is-on { background: var(--accent); border-color: var(--accent); }
.gate__keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; max-width: 280px; margin: 0 auto; }
.gate__key { padding: 18px 0; font-size: 22px; font-family: var(--font-display); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); color: var(--ink-primary); cursor: pointer; transition: border-color var(--dur-fast) var(--ease); }
.gate__key:hover { border-color: var(--accent); }

/* Teaser leasing Grand Format */
.lease-teaser { border: 1px solid var(--accent-muted); border-radius: var(--radius-1); padding: 16px 18px; margin-top: var(--space-2); display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.lease-teaser__amount { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--accent); }

/* Bandeau partenariat point de vente (Devenir revendeur) */
.partner-band { margin: var(--space-3) 0; padding: var(--space-3) var(--space-3); border: 1px solid var(--accent-muted); border-radius: var(--radius-0); display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; background: var(--surface-1); }
.partner-band__txt { max-width: 62ch; }
.partner-band__title { font-family: var(--font-display); font-size: var(--display-m-size); line-height: var(--display-m-lh); letter-spacing: var(--display-m-tracking); color: var(--ink-primary); margin: 10px 0 12px; }
.partner-band__p { color: var(--ink-soft); margin: 0; }
.partner-band__cta { flex-shrink: 0; }
@media (max-width: 720px) { .partner-band__cta, .partner-band__cta .btn { width: 100%; } }
.cal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cal-opt { padding: 12px 14px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); color: var(--ink-soft); font-size: var(--body-s-size); cursor: pointer; transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); text-align: left; }
.cal-opt:hover { border-color: var(--accent); }
.cal-opt.is-on { border-color: var(--accent); color: var(--ink-primary); background: var(--surface-2); }

/* Statistiques clients */
.stat-curve { width: 100%; height: 150px; display: block; }
.stat-curve__grid { stroke: var(--border-divider); stroke-width: 1; }
.stat-curve__area { fill: rgba(212,197,169,0.10); stroke: none; }
.stat-curve__line { fill: none; stroke: var(--accent); stroke-width: 2; }
.stat-curve__dot { fill: var(--accent); }
.vip-legend { display: flex; flex-wrap: wrap; gap: 18px; margin: 4px 0 6px; }
.vip-legend__item { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: 0.04em; color: var(--ink-muted); }
.vip-dot { width: 12px; height: 12px; border-radius: var(--radius-pill); display: inline-block; }
.vip-pill { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; padding: 3px 11px; border-radius: var(--radius-pill); color: var(--canvas); font-weight: 600; }
/* Palette VIP (monochrome charte : beige → grisé) */
.vip--vip { background: var(--accent); color: var(--canvas); }
.vip--privilege { background: var(--accent-hover); color: var(--canvas); }
.vip--fidele { background: var(--accent-muted); color: var(--ink-primary); }
.vip--nouveau { background: var(--surface-2); color: var(--ink-muted); }
.vip-dot.vip--fidele { background: var(--accent-muted); }
.vip-dot.vip--nouveau { background: var(--surface-2); border: 1px solid var(--border-hairline); }
.rank-row { display: grid; grid-template-columns: 30px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--border-divider); cursor: pointer; }
.rank-row:hover { background: rgba(212,197,169,0.04); }
.rank-row__pos { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-muted); text-align: center; }
.rank-row__head { display: flex; align-items: center; gap: 12px; justify-content: space-between; }
.rank-row__name { font-size: var(--body-m-size); color: var(--ink-primary); }
.rank-bar { height: 6px; background: var(--surface-2); border-radius: var(--radius-pill); overflow: hidden; margin: 8px 0 6px; }
.rank-bar__fill { height: 100%; border-radius: var(--radius-pill); }
.rank-bar__fill.vip--nouveau { background: var(--ink-muted); }
.rank-row__meta { font-size: var(--body-s-size); color: var(--ink-muted); }
.rank-row__val { font-size: var(--body-m-size); color: var(--accent); white-space: nowrap; }
.notif-row { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border-divider); }
.notif-row__date { font-size: var(--body-s-size); color: var(--ink-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.notif-row__subj { font-size: var(--body-s-size); color: var(--ink-primary); }
.client-row--list { grid-template-columns: 1fr auto auto auto; }
@media (max-width: 620px) {
  .client-row, .client-row--list { grid-template-columns: 1fr auto; row-gap: 10px; }
  .client-row--list > :nth-child(1) { grid-column: 1 / -1; }
  .client-row--list .status-pill { grid-column: 1; justify-self: start; }
}

/* Filtres CRM */
.crm-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 14px; }
.crm-filter__search { flex: 1 1 220px; min-width: 180px; }
.crm-filter { display: flex; flex-direction: column; gap: 5px; }
.crm-filter .input { width: auto; min-width: 132px; }
.crm-filter__lbl { font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--ink-muted); }
.crm-filter-state { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }

/* « Les prospects » : colonnes masquables + tableau enrichi */
.conn-cols { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; align-items: center; }
.conn-col-chip { border: 1px solid var(--border-hairline); background: none; color: var(--ink-muted); border-radius: var(--radius-pill);
  padding: 5px 13px; font-family: var(--font-body); font-size: 11px; letter-spacing: 0.04em; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.conn-col-chip.is-on { color: var(--accent); border-color: var(--accent); }
.conn-col-chip:not(.is-on) { text-decoration: line-through; opacity: 0.6; }
.conn-table--rich .conn-row { grid-template-columns: minmax(140px, 1.4fr) repeat(var(--conn-cols, 6), minmax(0, 1fr)); }
.conn-ip { font-family: var(--font-mono); font-size: 12px; }

/* Indicateur de discussion en cours (listes admin) */
.chat-chip { display: inline-flex; align-items: center; gap: 3px; margin-left: 8px; color: var(--ink-muted); vertical-align: middle; }
.chat-chip.has-unread { color: var(--accent); }
.chat-chip__n { display: inline-flex; align-items: center; justify-content: center; min-width: 15px; height: 15px; padding: 0 4px; background: var(--accent); color: var(--canvas); font-family: var(--font-body); font-size: 10px; font-weight: 600; border-radius: var(--radius-pill); }

/* Assistant IA dans le chat client */
.cc-ai-tag { display: inline-block; font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); margin-bottom: 4px; }
.cc-bubble--typing { display: inline-flex; gap: 4px; align-items: center; padding: 12px 14px; }
.cc-dot { width: 6px; height: 6px; border-radius: 999px; background: var(--ink-muted); opacity: 0.4; animation: cc-blink 1.2s infinite both; }
.cc-dot:nth-child(2) { animation-delay: 0.2s; }
.cc-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes cc-blink { 0%, 80%, 100% { opacity: 0.25; } 40% { opacity: 0.9; } }

/* Achats empilés (fiche client) */
.client-buys { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border-divider); }
.client-buys__hd { font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.client-buy { display: grid; grid-template-columns: 110px 1fr auto; gap: 12px; align-items: baseline; padding: 8px 0; border-top: 1px solid var(--border-divider); }
.client-buy:first-of-type { border-top: 0; }
.client-buy__date { font-size: 12px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.client-buy__desc { font-size: var(--body-s-size); color: var(--ink-soft); }
.client-buy__amt { font-size: var(--body-s-size); color: var(--ink-primary); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Relances : boutons d'action rapide */
.relance-acts { margin: 0; }
.relance-acts__row { display: flex; flex-wrap: wrap; gap: 8px; }
.relance-btn { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill);
  padding: 9px 16px; font-family: var(--font-body); font-size: 12px; letter-spacing: 0.03em; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.relance-btn:hover:not(:disabled) { color: var(--accent); border-color: var(--accent); }
.relance-btn--accent { border-color: var(--accent); color: var(--accent); }
.relance-btn--accent:hover:not(:disabled) { background: var(--accent); color: var(--canvas); }
.relance-btn:disabled { opacity: 0.4; cursor: default; }
.relance-note { margin-top: 10px; font-size: 12px; color: var(--accent); }

/* Conversation atelier */
.achat-chat { margin-top: 16px; max-height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border-divider); border-radius: var(--radius-1); }
.achat-msg { display: flex; flex-direction: column; gap: 3px; max-width: 84%; }
.achat-msg--me { align-self: flex-end; align-items: flex-end; }
.achat-msg--them { align-self: flex-start; align-items: flex-start; }
.achat-bubble { padding: 9px 13px; border-radius: var(--radius-1); font-size: var(--body-s-size); line-height: 1.5; display: flex; flex-direction: column; gap: 5px; }
.achat-msg--me .achat-bubble { background: var(--accent); color: var(--canvas); }
.achat-msg--them .achat-bubble { background: var(--surface-2); color: var(--ink-soft); border: 1px solid var(--border-divider); }
.achat-bubble__txt { white-space: pre-wrap; word-wrap: break-word; }
.achat-bubble__link { font-size: 11px; opacity: 0.85; }
.achat-time { font-size: 10px; color: var(--ink-muted); }
.achat-foot { display: flex; align-items: flex-end; gap: 8px; margin-top: 12px; }
.achat-link { width: auto; min-width: 140px; flex: none; }
.achat-input { flex: 1; resize: vertical; min-height: 88px; max-height: 240px; }
.achat-send { flex: none; width: 42px; height: 42px; border-radius: var(--radius-1); border: 1px solid var(--accent); background: var(--accent); color: var(--canvas); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.achat-send:disabled { opacity: 0.4; cursor: default; }
@media (max-width: 620px) { .achat-foot { flex-wrap: wrap; } .achat-link { width: 100%; } }

/* Suivi des relances */
.track-list { display: flex; flex-direction: column; gap: 8px; }
.track-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--border-divider); }
.track-row:first-child { border-top: 0; }
.track-row__seq { font-size: 12px; color: var(--ink-primary); font-weight: 600; min-width: 64px; }
.track-dot { font-size: 11px; color: var(--ink-muted); display: inline-flex; align-items: center; gap: 6px; }
.track-dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ink-muted); opacity: 0.4; }
.track-dot.is-on { color: var(--ink-soft); }
.track-dot.is-on::before { background: var(--accent); opacity: 1; }
.track-log { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border-divider); display: flex; flex-direction: column; gap: 4px; }
.track-var { display: inline-block; font-family: var(--font-mono); font-size: 11px; color: var(--accent); background: var(--surface-2); border-radius: var(--radius-1); padding: 1px 6px; margin: 0 3px; }

/* Paramétrage emails de relance */
.cart-email { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 16px; margin-bottom: 14px; }
.cart-email__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.cart-email__delay { display: flex; flex-direction: column; gap: 5px; }

/* ----------------------------- Pop-ups ciblés ----------------------------- */
/* Pop-up client */
.pop-overlay { position: fixed; inset: 0; z-index: 90; background: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; padding: 20px; animation: popFade var(--dur-medium) var(--ease); }
@keyframes popFade { from { opacity: 0; } to { opacity: 1; } }
.pop-card { position: relative; width: 420px; max-width: 100%; max-height: calc(100vh - 40px); overflow: auto; background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-0); animation: popIn var(--dur-medium) var(--ease); }
@keyframes popIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pop-x { position: absolute; top: 12px; right: 12px; z-index: 2; width: 32px; height: 32px; border-radius: var(--radius-pill); background: rgba(0,0,0,0.45); border: 1px solid var(--border-hairline); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pop-x:hover { border-color: var(--accent); color: var(--accent); }
.pop-card__media { width: 100%; aspect-ratio: 4 / 3; background: #000; overflow: hidden; }
.pop-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pop-card__body { padding: var(--space-3); }
.pop-eyebrow { font-size: var(--eyebrow-size); font-weight: var(--eyebrow-weight); letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--ink-muted); margin-bottom: 10px; }
.pop-title { font-family: var(--font-display); font-size: var(--display-s-size); line-height: var(--display-s-lh); color: var(--ink-primary); margin: 0 0 10px; }
.pop-text { font-size: var(--body-m-size); line-height: var(--body-m-lh); color: var(--ink-soft); margin: 0 0 18px; white-space: pre-wrap; }
.pop-cta { display: inline-flex; align-items: center; gap: 8px; background: none; border: 1px solid var(--accent); color: var(--accent); border-radius: var(--radius-pill);
  padding: 11px 22px; font-family: var(--font-body); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.pop-cta:hover { background: var(--accent); color: var(--canvas); }

/* Liste de campagnes (atelier) */
.pop-item { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); margin-bottom: 12px; }
.pop-item.is-active { border-color: var(--accent); }
.pop-item__head { display: flex; align-items: center; gap: 14px; padding: 14px 16px; flex-wrap: wrap; }
.pop-item__title { flex: 1; min-width: 180px; background: none; border: 0; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 3px; font-family: var(--font-body); }
.pop-item__name { font-size: var(--body-m-size); color: var(--ink-primary); }
.pop-item__meta { font-size: 12px; color: var(--ink-muted); }

/* Éditeur de campagne */
.pop-editor { border-top: 1px solid var(--border-divider); padding: 18px 16px; }
.pop-editor__grid { display: grid; grid-template-columns: 1fr 320px; gap: 24px; }
.pop-editor__filters { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pop-editor__side { display: flex; flex-direction: column; gap: 16px; }
.pop-preview { background: #000; border: 1px solid var(--border-divider); border-radius: var(--radius-1); padding: 16px; display: flex; justify-content: center; }
.pop-card--preview { width: 100%; border-radius: 0; animation: none; max-height: none; }
.pop-card--preview .pop-card__media { aspect-ratio: 16 / 9; }
.pop-audience { border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 16px; text-align: center; }
.pop-audience__n { font-family: var(--font-display); font-size: var(--display-m-size); color: var(--accent); }
.pop-audience__lbl { font-size: 12px; color: var(--ink-muted); text-transform: uppercase; letter-spacing: 0.08em; }
@media (max-width: 820px) { .pop-editor__grid { grid-template-columns: 1fr; } .pop-editor__filters { grid-template-columns: 1fr; } }

/* ----------------------------- Éditeur d'e-mails ----------------------------- */
.em-composer { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; }
.em-composer__preview { position: sticky; top: 12px; }
.eb-preview { width: 100%; height: 560px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: #000; }
.eb__list { display: flex; flex-direction: column; gap: 10px; }
.eb-block { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.eb-block__bar { display: flex; align-items: center; justify-content: space-between; }
.eb-block__type { font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); }
.eb-block__moves { display: flex; gap: 6px; }
.eb-icon { width: 26px; height: 26px; border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-1); cursor: pointer; font-size: 13px; line-height: 1; }
.eb-icon:hover:not(:disabled) { color: var(--accent); border-color: var(--accent); }
.eb-icon:disabled { opacity: 0.3; cursor: default; }
.eb-icon--danger:hover { color: #c98; border-color: #c98; }
.eb-row { display: flex; flex-direction: column; gap: 8px; }
.eb__add { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-divider); }
/* Glisser-déposer des blocs */
.eb-block { cursor: default; }
.eb-block[draggable="true"] { cursor: grab; }
.eb-block.is-dragging { opacity: 0.45; }
.eb-block.is-over { box-shadow: inset 0 2px 0 var(--accent); }
.eb-drag-grip { cursor: grab; margin-right: 8px; color: var(--ink-muted); letter-spacing: -1px; }
.eb-block.is-dragging .eb-drag-grip { cursor: grabbing; }
.eb-add-chip { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill); padding: 7px 14px; font-family: var(--font-body); font-size: 12px; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.eb-add-chip:hover { color: var(--accent); border-color: var(--accent); }
.blog-pick { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.blog-pick__btn { display: inline-flex; align-items: center; gap: 10px; border: 1px solid var(--accent); background: var(--surface-1); color: var(--accent); border-radius: var(--radius-1); padding: 8px 14px 8px 8px; cursor: pointer; font-family: var(--font-body); font-size: 13px; letter-spacing: 0.04em; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.blog-pick__btn:hover { background: var(--accent); color: var(--canvas); }
.blog-pick__thumb { width: 34px; height: 34px; flex: none; background: var(--surface-2); overflow: hidden; display: block; }
.blog-pick__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-pick__thumb--empty { border: 1px dashed var(--border-hairline); }

/* Barre d'outils / menu éditeur */
.eb-toolbar { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--border-divider); }
.eb-toolbar__label { font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); }
.eb-toolbar__count { margin-left: auto; font-size: 11px; color: var(--ink-muted); }
.eb-menu { position: relative; }
.eb-menu__trigger { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--accent); background: none; color: var(--accent); border-radius: var(--radius-1); padding: 9px 16px; font-family: var(--font-body); font-size: 12px; letter-spacing: 0.04em; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.eb-menu__trigger:hover { background: var(--accent); color: var(--canvas); }
.eb-menu__caret { font-size: 10px; }
.eb-menu__pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; min-width: 220px; background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 6px; display: flex; flex-direction: column; }
.eb-menu__item { display: flex; align-items: center; gap: 12px; background: none; border: 0; color: var(--ink-soft); padding: 10px 12px; font-family: var(--font-body); font-size: 14px; text-align: left; cursor: pointer; border-radius: var(--radius-1); transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.eb-menu__item:hover { background: var(--surface-2); color: var(--accent); }
.eb-menu__ic, .eb-block__ic { display: inline-flex; width: 22px; justify-content: center; color: var(--accent); font-size: 13px; }
.eb-block__type { display: inline-flex; align-items: center; gap: 8px; }

/* Options de bloc (segmented) */
.eb-opts { display: flex; flex-wrap: wrap; gap: 18px; }
.eb-opts__lbl { display: block; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 6px; }
.eb-seg { display: inline-flex; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); overflow: hidden; }
.eb-seg__btn { background: none; border: 0; border-right: 1px solid var(--border-hairline); color: var(--ink-soft); padding: 8px 14px; font-family: var(--font-body); font-size: 12px; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.eb-seg__btn:last-child { border-right: 0; }
.eb-seg__btn.is-on { background: var(--accent); color: var(--canvas); }

/* Insertion rapide entre blocs */
.eb-insert { display: flex; gap: 8px; margin-top: 4px; opacity: 0; transition: opacity var(--dur-fast) var(--ease); }
.eb-block:hover .eb-insert { opacity: 1; }
.eb-insert__btn { background: none; border: 1px dashed var(--border-hairline); color: var(--ink-muted); border-radius: var(--radius-1); padding: 4px 10px; font-family: var(--font-body); font-size: 11px; cursor: pointer; }
.eb-insert__btn:hover { color: var(--accent); border-color: var(--accent); }
@media (max-width: 600px) { .eb-insert { opacity: 1; } }
@media (max-width: 920px) { .em-composer { grid-template-columns: 1fr; } .em-composer__preview { position: static; } .eb-preview { height: 480px; } }
@media (max-width: 680px) {
  .conn-table--rich .conn-row { grid-template-columns: 1fr auto; }
  .client-buy { grid-template-columns: 1fr auto; }
  .client-buy__desc { grid-column: 1 / -1; order: 3; }
}

/* Barre d'outils CRM (raccourcis période + actions) */
.crm-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.crm-presets { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.crm-chip { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill);
  padding: 6px 14px; font-family: var(--font-body); font-size: 12px; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.crm-chip:hover { color: var(--accent); border-color: var(--accent); }

/* Timeline comportementale */
.act-tl { display: flex; flex-direction: column; }
.act-row { display: grid; grid-template-columns: 26px 44px 1fr; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid var(--border-divider); }
.act-row:first-child { border-top: 0; }
.act-row.is-off { opacity: 0.6; }
.act-row__ico { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); }
.act-row.is-off .act-row__ico { color: var(--ink-muted); }
.act-row__thumb { width: 44px; height: 44px; background: #000; border: 1px solid var(--border-hairline); overflow: hidden; flex: none; }
.act-row__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.act-row__thumb--empty { background: var(--surface-2); }
.act-row__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.act-row__lbl { font-size: var(--body-s-size); color: var(--ink-soft); }
.act-row__obj { color: var(--ink-primary); }
.act-row__time { font-size: 11px; color: var(--ink-muted); }

/* Rapport détaillé */
.rep-card { margin-bottom: 24px; }
.rep-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 22px; }
.rep-kpi { display: flex; flex-direction: column; gap: 5px; padding: 14px 16px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); }
.rep-kpi__k { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.rep-kpi__v { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.rep-kpi__sub { font-family: var(--font-body); font-size: 12px; color: var(--ink-muted); }
.rep-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.rep-chart { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 14px 16px; }
.rep-chart__hd { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.rep-chart__title { font-size: var(--body-s-size); color: var(--ink-soft); }
.rep-chart__tot { font-size: 12px; color: var(--accent); font-variant-numeric: tabular-nums; }
.rep-canvas { width: 100%; height: 180px; display: block; }
.rep-top { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border-divider); }
.rep-bar { display: grid; grid-template-columns: minmax(120px, 1.4fr) 3fr auto; align-items: center; gap: 12px; padding: 6px 0; }
.rep-bar__name { font-size: var(--body-s-size); color: var(--accent); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rep-bar__track { height: 8px; background: var(--surface-2); border-radius: var(--radius-pill); overflow: hidden; }
.rep-bar__fill { display: block; height: 100%; background: var(--accent); border-radius: var(--radius-pill); }
.rep-bar__val { font-size: 12px; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
@media (max-width: 760px) {
  .rep-kpis { grid-template-columns: 1fr 1fr; }
  .rep-grid { grid-template-columns: 1fr; }
  .act-row { grid-template-columns: 24px 40px 1fr; }
}

/* Fiches client repliables (accordéon) */
.client-acc { border-bottom: 1px solid var(--border-divider); }
.client-acc__head { display: grid; grid-template-columns: 16px 1fr auto; align-items: center; gap: var(--space-2);
  width: 100%; padding: 14px 0; background: none; border: 0; cursor: pointer; text-align: left; font-family: var(--font-body); }
.client-acc__chev { color: var(--ink-muted); flex: none; transition: transform var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.client-acc.is-open .client-acc__chev { transform: rotate(90deg); color: var(--accent); }
.client-acc__head:hover .client-acc__chev { color: var(--accent); }
.client-acc__head .status-pill { white-space: nowrap; justify-self: end; }
.client-acc__id { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.client-acc__sub { font-size: var(--body-s-size); color: var(--ink-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-acc__body { padding: 4px 0 18px 28px; }
.client-acc__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.client-stat { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); }
.client-stat__k { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); }
.client-stat__v { font-size: var(--body-m-size); color: var(--ink-primary); font-variant-numeric: tabular-nums; }
@media (max-width: 680px) {
  .client-acc__stats { grid-template-columns: 1fr 1fr; }
  .client-acc__body { padding-left: 0; }
}
.text-link--danger { color: var(--ink-muted); }
.text-link--danger:hover { color: var(--accent); border-bottom-color: var(--accent); }
.status-pill { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 12px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); color: var(--ink-muted); }
.status-pill--accent { color: var(--accent); border-color: var(--accent-muted); }

/* liens d'acompte */
.lien-row { display: grid; grid-template-columns: 220px 1fr; gap: var(--space-2); align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border-divider); }
.lien-row--3 { grid-template-columns: 190px 120px 1fr; }
@media (max-width: 680px) { .lien-row, .lien-row--3 { grid-template-columns: 1fr; gap: 8px; } }

/* images manager */
.img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--space-2); margin-top: var(--space-2); }
.img-cell { display: flex; flex-direction: column; gap: 8px; }
.img-cell image-slot { width: 100%; aspect-ratio: 1 / 1; height: auto; }
.img-cell--wide image-slot { aspect-ratio: 16 / 9; }
.img-cell__label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); }
/* Grille d'images admin (diaporama, carrousels) */
.admin-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--space-2); }
.admin-img { border: 1px solid var(--border-hairline); background: #000; }
.admin-img__focus { position: relative; display: block; width: 100%; padding: 0; border: 0; cursor: crosshair; overflow: hidden; }
.admin-img__focus img { width: 100%; height: 100%; display: block; }
.admin-img__dot { position: absolute; width: 18px; height: 18px; transform: translate(-50%, -50%); border-radius: 999px; border: 2px solid #fff; box-shadow: 0 0 0 2px var(--accent); background: rgba(212,197,169,0.4); pointer-events: none; }
.admin-img__thumb { width: 100%; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.admin-img__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.admin-img__bar { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 8px; border-top: 1px solid var(--border-hairline); }
/* Catalogue admin · catégories-étiquettes + pool multi-sélection */
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.cat-edit-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); padding: 4px 6px 4px 12px; }
.cat-edit-chip__dot { width: 12px; height: 12px; border-radius: 999px; flex: none; }
.cat-edit-chip__input { background: transparent; border: 0; color: var(--ink-primary); font-size: 13px; width: 9ch; outline: none; }
.cat-edit-chip__x { background: none; border: 0; color: var(--ink-muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 0 4px; }
.cat-edit-chip__x:hover { color: #e0584b; }
.assign-bar { margin-top: 16px; padding: 14px 16px; border: 1px solid var(--accent); border-radius: var(--radius-1); background: var(--surface-1); }
.assign-bar__count { font-size: var(--body-s-size); color: var(--accent); margin-bottom: 10px; }
.assign-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--accent-muted); border-radius: var(--radius-pill); padding: 6px 13px; background: transparent; color: var(--ink-soft); cursor: pointer; font-size: 13px; transition: all var(--dur-fast) var(--ease); }
.assign-chip:hover { border-color: var(--accent); background: rgba(212,197,169,0.1); color: var(--ink-primary); }
.pool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--space-2); margin-top: 16px; }
.pool-item__order { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.pool-ord { width: 26px; height: 26px; border: 1px solid var(--border-hairline); background: transparent; color: var(--ink-soft); border-radius: var(--radius-1); cursor: pointer; font-size: 13px; line-height: 1; transition: all var(--dur-fast) var(--ease); }
.pool-ord:hover { border-color: var(--accent); color: var(--accent); }
.pool-ord__pos { font-size: 10px; letter-spacing: 0.08em; color: var(--ink-muted); margin-left: auto; }
.pool-ord__num { width: 48px; margin-left: auto; text-align: center; font-size: 12px; padding: 4px 4px; background: var(--surface-2); border: 1px solid var(--border-hairline); border-radius: var(--radius-1); color: var(--ink-soft); }
.pool-ord__num:focus { border-color: var(--accent); outline: none; }
.price-edit-grid { display: flex; flex-direction: column; gap: 8px; }
.price-edit-row { display: grid; grid-template-columns: 1fr auto 120px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border-divider); }
.price-edit-row__fmt { font-size: 14px; color: var(--ink-primary); }
.price-edit-row__base { font-size: 11px; color: var(--ink-muted); white-space: nowrap; }
.price-edit-row__in { padding: 8px 10px; text-align: right; }
.pool-item__src { font-size: 10px; color: var(--ink-muted); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; } font-size: 9.5px; color: var(--ink-muted); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0.6; }
.pool-item { border: 1px solid var(--border-hairline); background: var(--surface-1); display: flex; flex-direction: column; transition: border-color var(--dur-fast) var(--ease); cursor: grab; }
.pool-item:active { cursor: grabbing; }
.pool-item.is-sel { border-color: var(--accent); }
.pool-item__media { position: relative; aspect-ratio: 1 / 1; background: #000; border: 0; padding: 0; cursor: pointer; overflow: hidden; }
.pool-item__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pool-item__check { position: absolute; top: 8px; left: 8px; width: 22px; height: 22px; border-radius: 999px; border: 1.5px solid #fff; background: rgba(0,0,0,0.5); color: #000; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.pool-item__check.is-on { background: var(--accent); border-color: var(--accent); }
.pool-item__tag { position: absolute; bottom: 8px; left: 8px; right: 8px; font-size: 10px; letter-spacing: 0.04em; color: var(--ink-primary); background: rgba(0,0,0,0.62); border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); padding: 3px 9px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fz-stage { position: relative; width: 100%; aspect-ratio: 1 / 1; background-position: center; background-size: cover; background-repeat: no-repeat; background-color: #000; border: 1px solid var(--border-hairline); user-select: none; }
.fz-scroll { width: 100%; max-height: 60vh; overflow: auto; border: 1px solid var(--border-hairline); }
.fz-zoomwrap { min-width: 100%; }
.fz-rect { position: absolute; cursor: move; box-sizing: border-box; }
.fz-rect__art { position: absolute; inset: 0; background-position: center; background-size: cover; background-repeat: no-repeat; opacity: 0.92; }
.fz-side { position: absolute; }
.fz-side--t, .fz-side--b { left: 0; right: 0; height: 1px; }
.fz-side--t { top: 0; } .fz-side--b { bottom: 0; }
.fz-side--l, .fz-side--r { top: 0; bottom: 0; width: 1px; }
.fz-side--l { left: 0; } .fz-side--r { right: 0; }
.fz-handle { position: absolute; width: 16px; height: 16px; background: var(--accent); border: 1px solid #000; border-radius: 999px; z-index: 2; }
.fz-handle--nw { top: -8px; left: -8px; cursor: nwse-resize; }
.fz-handle--se { bottom: -8px; right: -8px; cursor: nwse-resize; }
.fz-nudge { display: inline-flex; gap: 4px; }
.pool-item__body { padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.pool-item__title { font-size: 13px; }
/* Témoignages */
.stars { display: inline-flex; gap: 3px; color: var(--accent); }
.stars--edit .star { background: none; border: 0; padding: 0; color: var(--accent); }
.prod-tm { border-top: 1px solid var(--border-divider); padding-top: var(--space-4); margin-top: var(--space-4); }
.prod-tm__head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-3); }
.prod-tm__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); margin-top: 4px; }
.tm-rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc(25% - 14px); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 10px; -webkit-overflow-scrolling: touch; }
.tm-card { scroll-snap-align: start; border: 1px solid var(--border-hairline); background: var(--surface-1); margin: 0; display: flex; flex-direction: column; }
.tm-media { width: 100%; aspect-ratio: 1 / 1; background-position: center; background-size: cover; background-repeat: no-repeat; background-color: #000; display: block; object-fit: cover; position: relative; }
.tm-inframe { position: absolute; background-position: center; background-size: cover; background-repeat: no-repeat; }
.tm-card__media-btn { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.tm-card__media-btn:disabled { cursor: default; }
.tm-card__body--link { cursor: pointer; }
.tm-card__body--link:hover .tm-card__title { color: var(--accent); }
.tm-media--preview { aspect-ratio: 16/10; }
.tm-media--sm { width: 80px; height: 80px; flex: none; }
.tm-media--empty { display: flex; align-items: center; justify-content: center; color: var(--ink-muted); font-size: 11px; }
.tm-card__body { padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.tm-card__title { font-family: var(--font-display); font-size: 17px; color: var(--ink-primary); }
.tm-card__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.tm-card__author { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); margin-top: 4px; }
.tm-card__bought { font-size: 11px; letter-spacing: 0.06em; color: var(--accent); margin-top: 6px; }
.tm-card__work { display: block; background: none; border: 0; padding: 0; margin-bottom: 3px; cursor: pointer; font-family: var(--font-display); font-size: 14px; color: var(--accent); text-align: left; }
.tm-card__work:hover { color: var(--accent-hover); text-decoration: underline; }
.tm-pending { display: flex; gap: 14px; align-items: flex-start; border: 1px solid var(--border-hairline); padding: 12px; }
.tm-admin { display: grid; grid-template-columns: 160px 1fr; gap: 16px; border: 1px solid var(--border-hairline); padding: 14px; }
.tm-admin__media { display: flex; flex-direction: column; }
.tm-admin__fields { display: flex; flex-direction: column; gap: 10px; }
@media (max-width: 760px) { .tm-rail { grid-auto-columns: 78%; } .tm-admin { grid-template-columns: 1fr; } }
.pool-item__title--2l { resize: vertical; line-height: 1.35; min-height: 3.2em; white-space: pre-wrap; overflow-wrap: anywhere; }
.pool-item__desc { font-size: 12px; resize: vertical; line-height: 1.45; }
.pool-item__cats { display: flex; flex-wrap: wrap; gap: 5px; }
.pool-item__orient { margin-top: 4px; }
.seg--mini button { font-size: 10.5px; padding: 4px 8px; }
.seg--wrap { display: flex; flex-wrap: wrap; gap: 4px; }
.seg--wrap button { flex: 1 1 auto; min-width: 0; }
.pool-cat { font-size: 10.5px; letter-spacing: 0.02em; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); padding: 3px 9px; background: transparent; color: var(--ink-muted); cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.pool-cat:hover { border-color: var(--accent); color: var(--ink-soft); }
.pool-cat.is-on { background: var(--accent); border-color: var(--accent); color: var(--canvas); }
/* Client · détail d'une œuvre du catalogue */
.work-detail { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-4); margin-top: var(--space-3); align-items: start; }
.work-detail__media { background: #000; border: 1px solid var(--border-hairline); }
.work-detail__media img { width: 100%; display: block; }
.work-buy { margin-top: var(--space-3); display: flex; flex-direction: column; gap: 12px; }
.work-buy__lead { font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-muted); }
.work-buy__opt { text-align: left; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--surface-1); padding: 16px 18px; cursor: pointer; display: flex; flex-direction: column; gap: 4px; transition: border-color var(--dur-fast) var(--ease); }
.work-buy__opt:hover { border-color: var(--accent); }
.work-buy__eyebrow { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
.work-buy__name { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.work-buy__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.work-buy__go { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); margin-top: 6px; }
.cat-chip__dot { display: inline-block; width: 11px; height: 11px; border-radius: 999px; margin-right: 6px; vertical-align: middle; }
@media (max-width: 760px) { .work-detail { grid-template-columns: 1fr; } }
/* Modal partagé (popup œuvre / sélecteur) */
.lb-modal { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,0.72); display: flex; align-items: center; justify-content: center; padding: var(--space-3); }
.lb-modal__panel { position: relative; background: var(--surface-1); border: 1px solid var(--border-hairline); max-width: 960px; width: 100%; max-height: 88vh; overflow: auto; }
.lb-modal__close { position: absolute; top: 14px; right: 14px; z-index: 2; width: 34px; height: 34px; border-radius: 999px; border: 1px solid var(--border-hairline); background: rgba(0,0,0,0.5); color: var(--ink-soft); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.lb-modal__close:hover { border-color: var(--accent); color: var(--accent); }
.code-modal { max-width: 460px; padding: var(--space-4); }
.share-modal { max-width: 420px; padding: var(--space-4); }
.share-modal__list { display: flex; flex-direction: column; gap: 8px; }
.share-modal__link { display: flex; align-items: center; justify-content: space-between; text-align: left; width: 100%; padding: 13px 16px; border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); font-family: var(--font-body); font-size: var(--body-m-size); cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.share-modal__link:hover { color: var(--accent); border-color: var(--accent); }
.work-pop { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 0; max-width: 880px; }
.work-pop__media { background: #000; padding: var(--space-3); display: flex; flex-direction: column; gap: 12px; }
.work-pop__img { flex: 1; min-height: 300px; background: #000; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.work-pop__img img { width: 100%; height: 100%; max-height: 56vh; object-position: center; }
.work-pop__img--contain img { object-fit: contain; }
.work-pop__fit { align-self: center; }
.work-pop__body { padding: var(--space-4) var(--space-3); }
.work-pop__title { font-family: var(--font-display); font-size: var(--display-m-size); margin-top: 6px; }
.work-picker { max-width: 880px; padding: var(--space-3); }
.work-picker__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-2); }
.work-picker__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); margin-top: 4px; }
.work-picker__search { width: 100%; margin: var(--space-2) 0 var(--space-3); }
.work-picker__group { margin-bottom: var(--space-3); }
.work-picker__cat { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.wp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--space-2); }
.wp-tile { position: relative; background: #000; border: 1px solid var(--border-hairline); padding: 0; cursor: pointer; display: flex; flex-direction: column; transition: border-color var(--dur-fast) var(--ease); }
.wp-tile:hover { border-color: var(--accent); }
.wp-tile__media { aspect-ratio: 1 / 1; overflow: hidden; background: #000; border: 0; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.wp-tile__media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.wp-tile__name { padding: 8px 10px; font-family: var(--font-display); font-size: 14px; color: var(--accent); text-align: left; background: none; border: 0; cursor: pointer; width: 100%; }
.wp-tile__fav { position: absolute; top: 7px; right: 7px; width: 32px; height: 32px; border-radius: 999px; border: 1px solid var(--border-hairline);
  background: rgba(0,0,0,0.55); color: var(--ink-soft); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.wp-tile__fav:hover { border-color: var(--accent); color: var(--accent); }
.cat-card__actions { position: absolute; top: 10px; right: 10px; display: flex; gap: 6px; z-index: 2; }
.cat-card__actions .cat-card__fav { position: static; }
.cat-card__share { color: var(--ink-soft); }
/* Œuvre secrète (réservée aux comptes) */
.cat-card--locked { cursor: pointer; }
.cat-card--locked .cat-card__media { position: relative; overflow: hidden; }
.cat-card__blur { filter: blur(18px) brightness(0.6); transform: scale(1.1); }
.cat-card__lock { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--accent); text-align: center; }
.cat-card__lock-lbl { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-primary); }
.secret-toggle { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-1); padding: 7px 12px; font-family: var(--font-body); font-size: 12px; cursor: pointer; margin-top: 4px; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.secret-toggle:hover { color: var(--accent); border-color: var(--accent); }
.secret-toggle.is-on { color: var(--accent); border-color: var(--accent); }
/* Barre de filtres du sélecteur d'œuvre */
.wp-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: var(--space-2); padding-bottom: var(--space-2); border-bottom: 1px solid var(--border-divider); }
.wp-filters__grp { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.wp-filters__lbl { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); margin-left: 6px; }
.cat-chip--fav { display: inline-flex; align-items: center; gap: 6px; }
/* Segments CRM (prospects / actifs / clients) */
.crm-seg-head { display: flex; align-items: baseline; gap: 10px; padding-bottom: 8px; margin-bottom: 12px; border-bottom: 1px solid var(--accent-muted); }
.crm-seg-head--btn { width: 100%; background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; text-align: left; font-family: var(--font-body); align-items: center; transition: border-color var(--dur-fast) var(--ease); }
.crm-seg-head--btn:hover:not(:disabled) { border-bottom-color: var(--accent); }
.crm-seg-head--btn:disabled { cursor: default; opacity: 0.5; }
.crm-seg-head__chev { color: var(--ink-muted); flex: none; transition: transform var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.crm-seg-head--btn.is-open .crm-seg-head__chev { transform: rotate(90deg); color: var(--accent); }
.crm-seg-head--btn:hover:not(:disabled) .crm-seg-head__chev { color: var(--accent); }
.crm-seg-head__show { margin-left: 12px; font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); }
.crm-seg-head__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); }
.crm-seg-head__count { font-size: 12px; color: var(--canvas); background: var(--accent); border-radius: var(--radius-pill); padding: 2px 9px; }
.crm-seg-head__sub { font-size: 11px; letter-spacing: 0.06em; color: var(--ink-muted); margin-left: auto; text-transform: uppercase; }
.crm-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border-divider); }
.crm-pager__pos { font-size: 12px; color: var(--ink-muted); }
.crm-export-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
/* Bibliothèque d'images + galerie admin repliable */
.imgdrop-row { display: flex; align-items: stretch; gap: var(--space-2); flex-wrap: wrap; }
.imgdrop-row .imgdrop { flex: 1; min-width: 240px; }
.imgdrop-lib { display: inline-flex; align-items: center; gap: 8px; flex: none; align-self: stretch; padding: 12px 16px;
  border: 1px solid var(--accent-muted); border-radius: var(--radius-1); background: var(--surface-1); color: var(--accent);
  cursor: pointer; font-size: var(--body-s-size); transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.imgdrop-lib:hover { border-color: var(--accent); background: rgba(212,197,169,0.08); }
.pool-grid--collapsed { max-height: 320px; overflow: hidden; position: relative; }
.pool-grid--collapsed::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 80px; background: linear-gradient(transparent, var(--canvas)); pointer-events: none; }
/* Sélecteur de titre cliquable + œuvre choisie */
.title-pick { width: 100%; text-align: left; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--accent); border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 16px 18px; color: var(--canvas); cursor: pointer; transition: background var(--dur-fast) var(--ease); font-family: var(--font-body); font-weight: 600; font-size: 14px; letter-spacing: 0.04em; }
.title-pick:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.title-pick__chev { color: var(--canvas); font-size: 20px; }
.title-ac-fallback { margin-top: 8px; }
.selwork { display: flex; gap: 14px; align-items: center; border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 10px; background: var(--surface-1); }
.selwork__media { width: 72px; height: 72px; flex: none; background: #000; border: 0; padding: 0; cursor: pointer; overflow: hidden; }
.selwork__media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.selwork__name { font-family: var(--font-display); font-size: 18px; color: var(--accent); }
.selwork__actions { display: flex; gap: 14px; margin-top: 6px; }
.back-to-cat { display: block; margin: 8px auto 4px; text-align: center; }
.gamme-head__topline { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.gamme-head__back { flex: none; white-space: nowrap; }
@media (max-width: 680px) { .work-pop { grid-template-columns: 1fr; } }

/* "ce que je garde en poche" — vert, réservé au mode Artiste */
.fiche td.gain { color: #6FBF8E; font-weight: 600; }
.kpi__val--gain { color: #6FBF8E; }

/* Leasing · conditions d'éligibilité */
.lease-cond { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.lease-cond li { display: flex; align-items: flex-start; gap: 14px; font-size: var(--body-m-size); line-height: 1.5; color: var(--ink-soft); }
.lease-cond__num { flex: none; width: 26px; height: 26px; border-radius: var(--radius-pill); border: 1px solid var(--accent);
  color: var(--accent); display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
  font-variant-numeric: tabular-nums; margin-top: 1px; }
.lease-dossier { display: flex; align-items: flex-start; gap: 12px; margin-top: 18px; padding-top: 16px;
  border-top: 1px solid var(--border-divider); font-size: var(--body-s-size); line-height: 1.55; color: var(--ink-soft); }
.lease-dossier svg { flex: none; color: var(--accent); margin-top: 1px; }
.legend .swatch--gain { border-color: #6FBF8E; }

/* simulator */
.sim-grid { display: grid; grid-template-columns: 1.3fr 0.7fr; gap: var(--space-4); align-items: start; }
.sim-grid > * { min-width: 0; }
@media (max-width: 980px) { .sim-grid { grid-template-columns: 1fr; } }
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap: 2px; border: 1px solid var(--border-hairline); }
.kpi { padding: 18px; background: var(--surface-1); }
.kpi__label { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); }
.kpi__val { font-family: var(--font-display); font-size: var(--display-s-size); margin-top: 8px; }
.kpi__val--accent { color: var(--accent); }
.kpi__sub { font-family: var(--font-body); font-size: 13px; color: var(--ink-muted); letter-spacing: 0; }
.email-activate { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border-divider); }
.lease-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.lease-table th, .lease-table td { padding: 12px 10px; text-align: right; font-size: 13px; border-bottom: 1px solid var(--border-divider); }
.lease-table th { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-muted); font-weight: 600; }
.lease-table th:first-child, .lease-table td:first-child { text-align: left; }
.lease-table tr.is-sel td { background: rgba(212,197,169,0.08); color: var(--ink-primary); }
.lease-table .neg { color: var(--ink-muted); }

/* misc */
.crumbs { display: flex; gap: 10px; align-items: center; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-muted); padding: var(--space-2) 0 0; }
.crumbs button:hover { color: var(--accent); }
.empty { text-align: center; padding: var(--space-5) var(--space-2); color: var(--ink-muted); }
.empty__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-soft); margin: var(--space-2) 0; }
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%); background: var(--surface-2);
  border: 1px solid var(--accent-muted); color: var(--ink-primary); padding: 14px 24px; z-index: 200;
  font-size: 13px; letter-spacing: 0.04em; animation: toastIn var(--dur-medium) var(--ease); border-radius: var(--radius-1); }
@keyframes toastIn { from { opacity: 0; transform: translateX(-50%) translateY(12px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

.fade-in { animation: fadeIn var(--dur-slow) var(--ease); }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* print */
@media print {
  @page { size: A4; margin: 12mm; }
  html, body { background: #fff !important; width: auto !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; }
  .no-print { display: none !important; }
  /* tout réduire pour qu'aucun conteneur ne force une largeur > page */
  body * { max-width: 100% !important; }
  .app, .a-shell, [class*="wrap"], [class*="checkout"], [class*="page-main"], [class*="cart"], [class*="container"] {
    max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; transform: none !important; overflow: visible !important; float: none !important; }
  .devis-doc { padding: 0 !important; max-width: none !important; width: 100% !important; margin: 0 0 8mm !important; font-size: 12px; color: #000; box-sizing: border-box; }
  .devis-doc h1 { font-size: 22px; }
  .devis-doc h2, .devis-doc h3 { font-size: 15px; }
  .devis-head { display: flex !important; flex-wrap: wrap; gap: 12px; }
  .devis-head > * { min-width: 0 !important; flex: 1 1 auto; }
  .devis-table { width: 100% !important; table-layout: fixed !important; border-collapse: collapse; }
  .devis-table th, .devis-table td { padding: 6px 4px; font-size: 10px; word-break: break-word; overflow-wrap: anywhere; }
  .devis-table th:nth-child(1), .devis-table td:nth-child(1) { width: 24%; }
  .devis-table th:nth-child(2), .devis-table td:nth-child(2) { width: 13%; }
  .devis-table th:nth-child(3), .devis-table td:nth-child(3) { width: 7%; }
  .devis-table th:nth-child(n+4), .devis-table td:nth-child(n+4) { width: 14%; }
  .devis-table .t-art { white-space: normal; }
  .devis-totals { width: 60% !important; margin-left: auto; }
  .devis-legal { font-size: 9.5px; line-height: 1.45; }
  .print-page { page-break-after: always; }
  .print-page:last-child { page-break-after: auto; }
  .devis-doc, .devis-table, .devis-totals, .devis-sign, .devis-legal { page-break-inside: avoid; }
  tr { page-break-inside: avoid; }
}

/* Devis lisible sur mobile (hors impression) */
@media (max-width: 560px) {
  .devis-doc { padding: 22px 18px; }
  .devis-head { flex-direction: column; gap: 16px; }
  .devis-table { table-layout: fixed; width: 100%; }
  .devis-table th, .devis-table td { padding: 7px 3px; font-size: 10px; word-break: break-word; overflow-wrap: anywhere; }
  .devis-table th { font-size: 8px; letter-spacing: 0.04em; }
  .devis-table th:nth-child(1), .devis-table td:nth-child(1) { width: 22%; }
  .devis-table th:nth-child(2), .devis-table td:nth-child(2) { width: 13%; }
  .devis-table th:nth-child(3), .devis-table td:nth-child(3) { width: 7%; }
  .devis-table th:nth-child(n+4), .devis-table td:nth-child(n+4) { width: 14.5%; }
  .devis-table .t-finish { font-size: 8.5px; }
  .devis-totals { width: 100%; }
  .devis-totals .tt-row--grand { font-size: 17px; }
  .devis-sign { grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
}

/* =====================================================================
   Porte d'entrée — welcome gate plein écran (avant l'application)
   ===================================================================== */
.welcome { position: fixed; inset: 0; z-index: 1200; background: var(--canvas); color: var(--ink-primary);
  display: flex; flex-direction: column; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.welcome__bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; }
.welcome__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.3s cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity; }
.welcome__slide.is-active { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  /* Le zoom suit le visuel courant pendant tout son affichage ET pendant le fondu au noir (jamais d'arrêt ni de retour). */
  .welcome__slide img, .welcome__slide image-slot { transform: scale(1.04); }
  .welcome__slide--current img, .welcome__slide--current image-slot { animation: welcomeKen 9s linear forwards; }
  @keyframes welcomeKen { from { transform: scale(1.04); } to { transform: scale(1.16); } }
}
.welcome__slide image-slot { width: 100%; height: 100%; display: block; }
.welcome__scrim { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, rgba(0,0,0,0.86) 0%, rgba(0,0,0,0.62) 38%, rgba(0,0,0,0.30) 66%, rgba(0,0,0,0.55) 100%); }

.welcome__bar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between;
  padding: clamp(18px, 3vw, 34px) clamp(20px, 5vw, 64px); }
.welcome__brand { font-family: var(--font-display); font-size: clamp(15px, 1.4vw, 19px); letter-spacing: 0.16em; color: var(--ink-primary); }
.welcome__dots { display: flex; gap: 9px; }
.welcome__dot { width: 26px; height: 2px; border: 0; padding: 0; cursor: pointer; background: rgba(255,255,255,0.28);
  transition: background var(--dur-fast) var(--ease); }
.welcome__dot.is-active { background: var(--accent); }

.welcome__inner { position: relative; z-index: 2; margin-top: auto; width: 100%;
  display: flex; flex-direction: column; gap: clamp(28px, 4vw, 52px);
  padding: clamp(28px, 5vw, 72px) clamp(20px, 5vw, 64px) clamp(34px, 5vw, 64px); }
.welcome__copy { max-width: min(760px, 64vw); }
.welcome__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--accent); margin-bottom: 18px; }
.welcome__title { font-family: var(--font-display); font-weight: 400; color: var(--ink-primary);
  font-size: clamp(28px, 3.6vw, 50px); line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance; }
.welcome__value { margin-top: 18px; font-size: clamp(15px, 1.4vw, 18px); line-height: 1.5;
  color: var(--ink-soft, #d8d2c6); max-width: 54ch; }
.welcome__benefits { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; max-width: 56ch; }
.welcome__benefits li { display: flex; align-items: flex-start; gap: 11px; color: var(--ink-soft, #d8d2c6); font-size: clamp(14px, 1.3vw, 16px); line-height: 1.4; }
.welcome__benefits svg { flex: none; color: var(--accent); margin-top: 1px; }
.welcome__formhead { font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 16px; }

.welcome__form { width: 100%; max-width: 760px; }
.welcome__fields { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: clamp(14px, 2vw, 26px); }
.welcome__field { display: flex; flex-direction: column; gap: 9px; }
.welcome__field > span { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft, #b8b1a4); }
.welcome__input { background: transparent; border: 0; border-bottom: 1px solid rgba(212,197,169,0.4);
  color: var(--ink-primary); font-size: clamp(15px, 1.4vw, 18px); padding: 8px 2px; outline: none; border-radius: 0;
  transition: border-color var(--dur-fast) var(--ease); }
.welcome__input::placeholder { color: rgba(255,255,255,0.32); }
.welcome__input:focus { border-bottom-color: var(--accent); }
.welcome__input.is-err { border-bottom-color: var(--ink-soft, #b8b1a4); }
.welcome__cta { margin-top: clamp(22px, 3vw, 34px); display: inline-flex; align-items: center; gap: 12px; white-space: nowrap;
  background: var(--ink-primary); color: var(--canvas); border: 0; cursor: pointer; border-radius: var(--radius-pill);
  font-family: var(--font-body); font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  padding: 16px 30px; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.welcome__cta:hover { background: var(--accent); color: var(--canvas); }
.welcome__cta svg { transition: transform var(--dur-fast) var(--ease); }
.welcome__cta:hover svg { transform: translateX(3px); }
.welcome__note { margin-top: 16px; font-size: var(--body-s-size); color: var(--ink-soft, #b8b1a4); max-width: 52ch; }
.welcome__login { margin-top: 14px; background: transparent; border: 0; border-bottom: 1px solid var(--accent-muted); padding: 4px 0; cursor: pointer; color: var(--accent); font-size: 13px; transition: border-color var(--dur-fast) var(--ease); }
.welcome__login:hover { border-bottom-color: var(--accent); }
.welcome-login-overlay { position: fixed; inset: 0; z-index: 60; background: var(--canvas); overflow-y: auto; }
.welcome-login-overlay__bar { padding: 16px clamp(16px, 5vw, 48px) 0; }
.welcome__artiste { position: absolute; bottom: 14px; right: clamp(20px, 5vw, 64px); z-index: 3;
  background: transparent; border: 0; cursor: pointer; color: rgba(255,255,255,0.4); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; transition: color var(--dur-fast) var(--ease); }
.welcome__artiste:hover { color: var(--accent); }

@media (max-width: 720px) {
  .welcome__copy { max-width: 100%; }
  .welcome__fields { grid-template-columns: 1fr; }
  .welcome__title { font-size: clamp(25px, 7vw, 34px); }
  .welcome__cta { width: 100%; justify-content: center; }
}

/* Réservation Grand Format (blocage 15 jours) */
/* Choix du mode d'acquisition : Acheter maintenant vs Bloquer avec arrhes */
.scarcity-note { display: flex; align-items: flex-start; gap: 12px; margin-top: 12px; padding: 14px 16px;
  border: 1px solid var(--accent); border-radius: var(--radius-1); background: rgba(212, 197, 169, 0.08);
  color: var(--ink-soft); font-size: var(--body-s-size); line-height: 1.55; }
.scarcity-note--plain { border: 0; background: transparent; padding: 0; }
.scarcity-note svg { flex: none; width: 22px; height: 22px; color: var(--accent); margin-top: 1px; }
.scarcity-note strong { color: var(--ink-primary); }
@media (prefers-reduced-motion: no-preference) {
  .scarcity-note svg { animation: scarcity-tick 1.8s var(--ease) infinite; }
}
@keyframes scarcity-tick { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
.acq-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.acq-opt { display: flex; gap: 12px; align-items: flex-start; text-align: left; cursor: pointer;
  border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 16px; background: transparent;
  transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.acq-opt:hover { border-color: var(--accent); }
.acq-opt.is-on { border-color: var(--accent); background: var(--surface-1); }
.acq-opt__radio { flex: none; width: 18px; height: 18px; margin-top: 2px; border-radius: 999px;
  border: 1px solid var(--border-active); position: relative; transition: all var(--dur-fast) var(--ease); }
.acq-opt.is-on .acq-opt__radio { border-color: var(--accent); }
.acq-opt.is-on .acq-opt__radio::after { content: ""; position: absolute; inset: 3px; border-radius: 999px; background: var(--accent); }
.acq-opt__body { display: flex; flex-direction: column; gap: 5px; }
.acq-opt__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); line-height: 1.2; }
.acq-opt__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
@media (max-width: 720px) { .acq-choice { grid-template-columns: 1fr; } }
.reserve-card { display: flex; gap: 14px; align-items: flex-start; cursor: pointer; border: 1px solid var(--border-hairline);
  border-radius: var(--radius-1); padding: 16px; margin-top: 12px; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.reserve-card:hover { border-color: var(--accent); }
.reserve-card.is-on { border-color: var(--accent); background: var(--surface-1); }
.reserve-card .checkbox-box { margin-top: 2px; flex: none; }
.reserve-card__body { display: flex; flex-direction: column; gap: 6px; }
.reserve-card__title { font-size: var(--body-m-size); color: var(--ink-primary); }
.reserve-card__desc { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.55; }
.reserve-banner { display: flex; align-items: center; gap: 18px; padding: 16px 18px; border: 1px solid var(--accent);
  border-radius: var(--radius-1); background: var(--surface-1); margin-bottom: 18px; flex-wrap: wrap; }
.reserve-banner__ring { flex: none; width: 60px; height: 60px; border-radius: 50%; border: 2px solid var(--accent);
  color: var(--accent); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.reserve-banner__ring span { font-family: var(--font-display); font-size: 21px; line-height: 1; }
.reserve-banner__ring small { font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; margin-top: 2px; }
.reserve-banner__body { flex: 1; min-width: 220px; }
.reserve-banner__title { font-size: var(--body-m-size); color: var(--ink-primary); margin-bottom: 4px; }
.reserve-banner__txt { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.mesdevis-row--reserve { border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 14px 16px; background: var(--surface-1); }
.mesdevis-row--await { border: 1px dashed var(--accent-muted); border-radius: var(--radius-1); padding: 14px 16px; }
.reserve-pill { display: inline-block; margin-left: 10px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--canvas); background: var(--accent); border-radius: var(--radius-pill); padding: 3px 9px; vertical-align: middle; font-variant-numeric: tabular-nums; }
.reserve-pill--urgent { animation: onlinePulse 1.4s var(--ease) infinite; }
/* Décompte d'urgence (réservation payée) */
.reserve-banner--urgent { border-width: 1px; }
.reserve-countdown { flex: none; min-width: 200px; }
.reserve-countdown__label { font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 6px; }
.reserve-countdown__clock { display: flex; align-items: baseline; gap: 4px; color: var(--accent); }
.rc-unit { display: inline-flex; flex-direction: column; align-items: center; }
.rc-unit b { font-family: var(--font-display); font-size: 26px; line-height: 1; font-variant-numeric: tabular-nums; }
.rc-unit i { font-style: normal; font-size: 8px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); margin-top: 3px; }
.rc-sep { font-family: var(--font-display); font-size: 22px; line-height: 1; color: var(--accent-muted); }
.reserve-banner--urgent .reserve-countdown__clock { animation: onlinePulse 1.4s var(--ease) infinite; }
.reserve-banner__decline { margin-top: 10px; background: none; border: 0; padding: 0; cursor: pointer;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-muted); border-bottom: 1px solid transparent; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.reserve-banner__decline:hover { color: var(--ink-soft); border-bottom-color: var(--ink-muted); }

/* Réservation : choix de durée + récap arrhes/solde */
.reserve-dur { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.reserve-dur__opt { flex: 1; min-width: 150px; display: flex; flex-direction: column; gap: 4px; text-align: left; cursor: pointer;
  border: 1px solid var(--border-hairline); border-radius: var(--radius-1); padding: 12px 14px; background: transparent;
  transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.reserve-dur__opt:hover { border-color: var(--accent); }
.reserve-dur__opt.is-on { border-color: var(--accent); background: var(--surface-1); }
.reserve-dur__t { font-size: var(--body-s-size); color: var(--ink-primary); }
.reserve-dur__d { font-size: 11px; color: var(--accent); letter-spacing: 0.02em; }
.reserve-split { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--border-divider); }
.reserve-split__tag { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }

/* Onglet « Je bloque l'œuvre » (récap arrhes au-dessus du bouton devis) */
.reserve-confirm { position: relative; border: 1px solid var(--accent); border-radius: var(--radius-1);
  background: var(--surface-1); padding: 16px 18px; margin-bottom: 16px; }
.reserve-confirm__close { position: absolute; top: 10px; right: 10px; width: 26px; height: 26px; display: inline-flex;
  align-items: center; justify-content: center; border-radius: 50%; border: 1px solid var(--border-hairline);
  background: transparent; color: var(--ink-muted); cursor: pointer; transition: all var(--dur-fast) var(--ease); }
.reserve-confirm__close:hover { border-color: var(--accent); color: var(--accent); }
.reserve-confirm__eyebrow { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; padding-right: 28px; }
.reserve-confirm__amount { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); font-variant-numeric: tabular-nums; }
.reserve-confirm__amount small { font-family: var(--font-body); font-size: 12px; color: var(--ink-muted); margin-left: 6px; }
.reserve-confirm__note { font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; margin-top: 8px; }

/* ----------------------------- Page « L'artiste » ----------------------------- */
.artpage .hero__inner { max-width: 1320px; }
.artpage__sig { font-family: var(--font-display); font-style: italic; color: var(--accent);
  font-size: clamp(18px, 2.2vw, 24px); line-height: 1.4; max-width: 52ch; margin: var(--space-3) 0 0; }
.artpage__cta { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); }
.artpage__h2 { font-family: var(--font-display); font-weight: 400; color: var(--ink-primary);
  font-size: clamp(26px, 3.4vw, var(--display-m-size)); line-height: 1.18; max-width: 24ch; margin: 12px 0 var(--space-4); }
.artpage__facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--border-hairline); border: 1px solid var(--border-hairline); }
.artpage__fact { background: var(--canvas); padding: var(--space-3); }
.reflogos { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-top: var(--space-3); }
.reflogos__item { font-family: var(--font-display); font-size: 15px; color: #fff; opacity: 0.55; letter-spacing: 0.01em;
  padding: 7px 14px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); background: transparent;
  transition: opacity var(--dur-fast) var(--ease); }
.reflogos__item:hover { opacity: 0.95; }
.refmarquee { margin-top: var(--space-4); overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.refmarquee__track { display: flex; gap: var(--space-2); width: max-content; animation: refmarquee 60s linear infinite; }
.refmarquee:hover .refmarquee__track { animation-play-state: paused; }
.refmarquee__cell { flex: none; width: 200px; height: 200px; background: #000; border: 1px solid var(--border-hairline); }
.refmarquee__cell img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
@keyframes refmarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .refmarquee__track { animation: none; } }
.artpage__fact-k { font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 8px; }
.artpage__fact-v { color: var(--ink-soft); font-size: var(--body-m-size); line-height: 1.5; }
.artpage__faq { border-top: 1px solid var(--border-divider); }
.artpage__faq details { border-bottom: 1px solid var(--border-divider); padding: var(--space-2) 0; }
.artpage__faq summary { cursor: pointer; list-style: none; font-family: var(--font-display);
  font-size: clamp(18px, 2.2vw, 22px); color: var(--ink-primary); display: flex; justify-content: space-between;
  gap: var(--space-2); align-items: baseline; }
.artpage__faq summary::-webkit-details-marker { display: none; }
.artpage__faq summary::after { content: "+"; color: var(--accent); font-family: var(--font-body); font-size: 22px; line-height: 1; flex: none; }
.artpage__faq details[open] summary::after { content: "\2013"; }
.artpage__faq-a { margin: var(--space-2) 0 0; color: var(--ink-soft); max-width: 70ch; }
.artpage__band { background: var(--surface-1); border-top: 1px solid var(--border-hairline); border-bottom: 1px solid var(--border-hairline); }
/* Pages produit · Matériaux & finitions + FAQ */
.prod-specs { border-top: 1px solid var(--border-divider); margin-top: var(--space-4); padding-top: var(--space-5); }
.prod-specs__cols { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: var(--space-4); align-items: start; }
.prod-specs__title { font-family: var(--font-display); font-weight: 400; font-size: var(--display-m-size); line-height: var(--display-m-lh); color: var(--ink-primary); margin: var(--space-2) 0 0; }
.prod-specs__blocks { display: flex; flex-direction: column; gap: var(--space-3); }
.prod-specs__block { }
.prod-specs__h { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); margin: 0 0 8px; }
.prod-specs__p { color: var(--ink-soft); font-size: var(--body-m-size); line-height: 1.7; margin: 0; max-width: 64ch; }
.prod-faq { margin-top: var(--space-5); border-top: 1px solid var(--border-divider); padding-top: var(--space-4); }
.prod-faq__list { margin-top: var(--space-2); }
.prod-faq__item { border-bottom: 1px solid var(--border-divider); padding: var(--space-2) 0; }
.prod-faq__q { cursor: pointer; list-style: none; font-family: var(--font-display); font-weight: 400; font-size: clamp(17px, 2vw, 21px); color: var(--ink-primary); display: flex; justify-content: space-between; gap: var(--space-2); align-items: baseline; }
.prod-faq__q::-webkit-details-marker { display: none; }
.prod-faq__q::after { content: "+"; color: var(--accent); font-family: var(--font-body); font-size: 22px; line-height: 1; flex: none; }
.prod-faq__item[open] .prod-faq__q::after { content: "\2013"; }
.prod-faq__a { margin: var(--space-2) 0 0; color: var(--ink-soft); font-size: var(--body-m-size); line-height: 1.7; max-width: 72ch; }
@media (max-width: 860px) { .prod-specs__cols { grid-template-columns: 1fr; gap: var(--space-3); } }
@media (max-width: 860px) { .artpage__facts { grid-template-columns: 1fr; } }

/* ----------------------------- Assistant IA (artiste) ----------------------------- */
.ai-status { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--border-hairline);
  border-radius: var(--radius-1); background: var(--surface-1); font-size: var(--body-s-size); color: var(--ink-soft); line-height: 1.5; }
.ai-status.is-ok { border-color: var(--accent); }
.ai-status__dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--ink-muted); }
.ai-status.is-ok .ai-status__dot { background: var(--accent); }
.ai-status strong { color: var(--ink-primary); font-weight: 600; }

.ai-diff { display: flex; flex-direction: column; border: 1px solid var(--border-divider); border-radius: var(--radius-1); overflow: hidden; }
.ai-diff__row { display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 12px;
  padding: 11px 14px; border-bottom: 1px solid var(--border-divider); cursor: pointer; }
.ai-diff__row:last-child { border-bottom: 0; }
.ai-diff__row:hover { background: var(--surface-1); }
.ai-diff__row .checkbox-box { width: 20px; height: 20px; }
.ai-diff__label { font-size: var(--body-s-size); color: var(--ink-soft); }
.ai-diff__vals { display: inline-flex; align-items: center; gap: 8px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ai-diff__old { color: var(--ink-muted); text-decoration: line-through; max-width: 30ch; overflow: hidden; text-overflow: ellipsis; }
.ai-diff__arrow { color: var(--accent); }
.ai-diff__new { color: var(--ink-primary); font-weight: 600; max-width: 40ch; overflow: hidden; text-overflow: ellipsis; }

.ai-desc-list { display: flex; flex-direction: column; gap: 14px; }
.ai-desc-row { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--border-divider); }
.ai-desc-row:last-child { border-bottom: 0; padding-bottom: 0; }
.ai-desc-row__media { width: 120px; height: 120px; background: #000; border: 1px solid var(--border-hairline); overflow: hidden; }
.ai-desc-row__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ai-desc-row__body { min-width: 0; }
.ai-desc-row__body .checkbox-row { padding: 0; }

/* ----------------------------- Console messagerie (atelier) ----------------------------- */
.msg-title-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 7px; margin-left: 10px; vertical-align: middle;
  background: var(--accent); color: var(--canvas); font-family: var(--font-body); font-size: 12px; font-weight: 600; border-radius: var(--radius-pill); }
.msg-aicfg { margin-bottom: 18px; }
.msg-aicfg__state { margin-left: auto; font-size: 11px; letter-spacing: 0.06em; color: var(--ink-muted); }
.msg-aicfg__state.is-on { color: var(--accent); }
.msg-console { display: grid; grid-template-columns: 300px 1fr; gap: 0; border: 1px solid var(--border-hairline); border-radius: var(--radius-1); overflow: hidden; height: min(640px, calc(100vh - 150px)); min-height: 380px; }
.msg-list { border-right: 1px solid var(--border-hairline); display: flex; flex-direction: column; min-width: 0; background: var(--surface-1); }
.msg-list__top { padding: 14px; border-bottom: 1px solid var(--border-divider); display: flex; flex-direction: column; gap: 10px; }
.msg-search { width: 100%; }
.msg-filters { display: flex; gap: 6px; }
.msg-list__items { flex: 1; overflow-y: auto; display: flex; flex-direction: column; }
.msg-item { text-align: left; background: none; border: 0; border-bottom: 1px solid var(--border-divider); padding: 13px 14px; cursor: pointer; display: flex; flex-direction: column; gap: 5px; transition: background var(--dur-fast) var(--ease); }
.msg-item:hover { background: var(--surface-2); }
.msg-item.is-active { background: var(--surface-2); box-shadow: inset 3px 0 0 var(--accent); }
.msg-item__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.msg-item__name { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: var(--ink-primary); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-item.has-unread .msg-item__name { color: var(--accent); }
.msg-item__time { font-size: 11px; color: var(--ink-muted); white-space: nowrap; }
.msg-item__preview { display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.msg-item__txt { font-size: 12px; color: var(--ink-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.msg-item__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 6px; background: var(--accent); color: var(--canvas); font-size: 11px; font-weight: 600; border-radius: var(--radius-pill); }
.msg-thread { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.msg-thread--empty { align-items: center; justify-content: center; }
.msg-thread__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--border-divider); }
.msg-thread__who { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.msg-thread__name { font-family: var(--font-display); font-size: 18px; color: var(--ink-primary); }
.msg-thread__email { font-size: 12px; color: var(--ink-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-thread__status { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); white-space: nowrap; }
.msg-thread__status.is-on { color: var(--accent); }
.msg-thread__meta { flex: none; display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 9px 18px; border-bottom: 1px solid var(--border-divider); background: var(--surface-1); }
.msg-meta { font-size: 11px; color: var(--ink-soft); letter-spacing: 0.01em; }
.msg-meta__k { color: var(--ink-muted); text-transform: uppercase; letter-spacing: 0.1em; font-size: 9.5px; margin-right: 5px; }
.msg-thread__body { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 18px; min-height: 0; }
.msg-item__badge { margin-left: 7px; }
/* Composeur de chat (atelier) — style messagerie classique */
.msg-compose { flex: none; }
.msg-compose { border-top: 1px solid var(--border-divider); padding: 12px 18px; display: flex; flex-direction: column; gap: 9px; background: var(--surface-1); }
.msg-compose__attach { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.msg-compose__sel { width: auto; min-width: 116px; max-width: 200px; font-size: 12px; padding: 6px 10px; }
.msg-compose__chip { font-size: 11px; color: var(--accent); letter-spacing: 0.04em; }
.msg-compose__work { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-1); padding: 6px 12px; font-family: var(--font-body); font-size: 12px; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.msg-compose__work:hover { color: var(--accent); border-color: var(--accent); }
.msg-compose__picked { display: inline-flex; align-items: center; gap: 8px; padding: 4px 6px 4px 4px; border: 1px solid var(--accent-muted); border-radius: var(--radius-1); font-size: 12px; }
.msg-compose__pickedthumb { flex: none; width: 30px; height: 30px; background: var(--surface-2); overflow: hidden; display: block; }
.msg-compose__pickedthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.msg-compose__pickx { border: 0; background: none; color: var(--ink-muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 0 2px; }
.msg-compose__pickx:hover { color: var(--accent); }
.msg-compose__pickedmeta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.msg-compose__fmtrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.msg-compose__fmtlbl { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); margin-right: 2px; }
.msg-compose__fmtchip { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill); padding: 4px 10px; font-family: var(--font-body); font-size: 11px; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.msg-compose__fmtchip:hover { color: var(--accent); border-color: var(--accent); }
.msg-compose__fmtchip.is-on { background: var(--accent); color: var(--canvas); border-color: var(--accent); }
.msg-compose__row { display: flex; align-items: flex-end; gap: 10px; }
.msg-compose__input { flex: 1; resize: none; min-height: 44px; max-height: 150px; padding: 11px 16px; background: var(--canvas); color: var(--ink-primary); border: 1px solid var(--border-hairline); border-radius: 22px; font-family: var(--font-body); font-size: var(--body-s-size); line-height: 1.5; }
.msg-compose__input:focus { outline: none; border-color: var(--accent); }
.msg-compose__send { flex: none; width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--accent); background: var(--accent); color: var(--canvas); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: opacity var(--dur-fast) var(--ease); }
.msg-compose__send:disabled { opacity: 0.4; cursor: default; }
.msg-airow { flex: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 18px; border-top: 1px solid var(--border-divider); background: var(--surface-1); }
.msg-lead { flex: none; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 10px 18px; border-top: 1px solid var(--border-divider); background: var(--surface-1); }
.msg-lead__seg { display: inline-flex; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); overflow: hidden; }
.msg-lead__btn { background: none; border: 0; color: var(--ink-muted); padding: 7px 15px; font-family: var(--font-body); font-size: 12px; letter-spacing: 0.02em; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.msg-lead__btn:not(:first-child) { border-left: 1px solid var(--border-hairline); }
.msg-lead__btn.is-on { background: var(--accent); color: var(--canvas); }
.msg-lead__btn:disabled { cursor: default; }
.msg-system { align-self: center; max-width: 90%; text-align: center; font-size: 11px; letter-spacing: 0.04em; color: var(--ink-muted); padding: 4px 0; }
.cc-system { align-self: center; text-align: center; font-size: 11px; letter-spacing: 0.04em; color: var(--ink-muted); padding: 6px 10px; }
.msg-thread .achat-foot { border-top: 1px solid var(--border-divider); padding: 14px 18px; margin: 0; align-items: stretch; }
.msg-thread .achat-input { min-height: 110px; max-height: 300px; }
.msg-thread .achat-link { align-self: flex-start; }
@media (max-width: 880px) {
  .msg-console { grid-template-columns: 1fr; }
  .msg-list { border-right: 0; border-bottom: 1px solid var(--border-hairline); max-height: 38%; }
  .msg-thread__body { max-height: none; }
}
.btn-ghost-sm { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-1);
  padding: 10px 16px; font-family: var(--font-body); font-size: 12px; letter-spacing: 0.04em; cursor: pointer; white-space: nowrap;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.btn-ghost-sm:hover:not(:disabled) { color: var(--accent); border-color: var(--accent); }
.btn-ghost-sm:disabled { opacity: 0.5; cursor: default; }

.push-row { display: flex; align-items: flex-start; gap: 14px; cursor: pointer; padding: 4px 0; }
.push-row--main { padding-bottom: 4px; }
.push-switch { flex: none; width: 42px; height: 24px; border-radius: var(--radius-pill); border: 1px solid var(--border-active);
  background: var(--surface-2); position: relative; transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); margin-top: 1px; }
.push-switch.is-on { background: var(--accent); border-color: var(--accent); }
.push-switch__dot { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--ink-muted);
  transition: transform var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.push-switch.is-on .push-switch__dot { transform: translateX(18px); background: var(--canvas); }
.push-row__txt { display: flex; flex-direction: column; gap: 2px; }
.push-row__label { font-size: var(--body-s-size); color: var(--ink-soft); }
.push-row__hint { font-size: 11px; color: var(--ink-muted); line-height: 1.45; }
.push-body.is-disabled { opacity: 0.5; pointer-events: none; }
.push-toggles { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border-divider); }
.push-adv { margin-top: 18px; border-top: 1px solid var(--border-divider); padding-top: 14px; }
.push-adv summary { cursor: pointer; font-size: 12px; color: var(--ink-muted); letter-spacing: 0.02em; }
.push-adv summary:hover { color: var(--accent); }
.ai-desc-row__body textarea.input { margin-top: 4px; }

/* ----------------------------- Bulle Assistant IA (flottante) ----------------------------- */
.ai-fab { position: fixed; right: 22px; bottom: 22px; z-index: 1200; width: 56px; height: 56px; border-radius: var(--radius-pill);
  background: var(--canvas); color: var(--accent); border: 1px solid var(--accent); cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.ai-fab:hover { background: var(--accent); color: var(--canvas); }
.ai-fab.is-open { background: var(--accent); color: var(--canvas); }
.ai-fab__mark { display: flex; }

.ai-panel { position: fixed; right: 22px; bottom: 88px; z-index: 1200; width: 384px; max-width: calc(100vw - 32px); height: min(620px, calc(100vh - 130px));
  background: var(--surface-1); border: 1px solid var(--accent); border-radius: var(--radius-1); display: flex; flex-direction: column; overflow: hidden; }
.ai-panel__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--border-divider); flex: none; }
.ai-panel__x { background: none; border: 0; color: var(--ink-muted); cursor: pointer; padding: 2px; display: flex; transition: color var(--dur-fast) var(--ease); }
.ai-panel__x:hover { color: var(--accent); }

.ai-panel__body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.ai-msg { display: flex; flex-direction: column; gap: 8px; max-width: 100%; }
.ai-msg--me { align-items: flex-end; }
.ai-msg--ai { align-items: flex-start; }
.ai-bubble-txt { font-size: var(--body-s-size); line-height: 1.55; padding: 10px 13px; border-radius: var(--radius-1); max-width: 88%; white-space: pre-wrap; word-wrap: break-word; }
.ai-msg--me .ai-bubble-txt { background: var(--accent); color: var(--canvas); }
.ai-msg--ai .ai-bubble-txt { background: var(--surface-2); color: var(--ink-soft); border: 1px solid var(--border-divider); }
.ai-msg__shots { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.ai-msg__shots img { width: 84px; height: 84px; object-fit: cover; border: 1px solid var(--border-hairline); }

.ai-prop { width: 100%; border: 1px solid var(--accent); border-radius: var(--radius-1); padding: 10px; margin-top: 2px; }
.ai-prop__hd { font-size: 11px; letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
.ai-prop__row { display: flex; align-items: flex-start; gap: 9px; padding: 7px 4px; border-top: 1px solid var(--border-divider); cursor: pointer; }
.ai-prop__row:first-of-type { border-top: 0; }
.ai-prop__row.is-locked { cursor: default; opacity: 0.85; }
.ai-prop__row .checkbox-box { width: 18px; height: 18px; flex: none; margin-top: 1px; }
.ai-prop__txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.ai-prop__label { font-size: 12px; color: var(--ink-soft); }
.ai-prop__vals { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; font-size: 12px; font-variant-numeric: tabular-nums; }
.ai-prop__old { color: var(--ink-muted); text-decoration: line-through; word-break: break-word; }
.ai-prop__arr { color: var(--accent); flex: none; }
.ai-prop__new { color: var(--ink-primary); font-weight: 600; word-break: break-word; }
.ai-apply { margin-top: 10px; width: 100%; padding: 9px; background: var(--accent); color: var(--canvas); border: 0; border-radius: var(--radius-1);
  font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; transition: background var(--dur-fast) var(--ease); }
.ai-apply:hover { background: var(--accent-hover); }
.ai-prop__done { margin-top: 8px; font-size: 12px; color: var(--accent); text-align: center; }
.ai-prop__notes { font-size: 11px; line-height: 1.5; color: var(--ink-muted); max-width: 88%; }

.ai-typing { display: inline-flex; gap: 4px; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border-divider); border-radius: var(--radius-1); }
.ai-typing span { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-muted); animation: aiBlink 1.2s var(--ease) infinite; }
.ai-typing span:nth-child(2) { animation-delay: 0.2s; }
.ai-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes aiBlink { 0%, 60%, 100% { opacity: 0.25; } 30% { opacity: 1; } }

.ai-attach-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 16px 0; flex: none; }
.ai-attach { position: relative; }
.ai-attach img { width: 52px; height: 52px; object-fit: cover; border: 1px solid var(--border-hairline); display: block; }
.ai-attach button { position: absolute; top: -7px; right: -7px; width: 18px; height: 18px; border-radius: 50%; background: var(--canvas); color: var(--ink-primary);
  border: 1px solid var(--border-active); cursor: pointer; font-size: 12px; line-height: 1; display: flex; align-items: center; justify-content: center; padding: 0; }

.ai-panel__foot { display: flex; align-items: flex-end; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--border-divider); flex: none; }
.ai-clip, .ai-send { flex: none; width: 38px; height: 38px; border-radius: var(--radius-1); border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.ai-clip:hover, .ai-send:hover:not(:disabled) { color: var(--accent); border-color: var(--accent); }
.ai-send { background: var(--accent); color: var(--canvas); border-color: var(--accent); }
.ai-send:hover:not(:disabled) { background: var(--accent-hover); color: var(--canvas); }
.ai-send:disabled { opacity: 0.4; cursor: default; }
.ai-input { flex: 1; resize: none; max-height: 120px; min-height: 38px; padding: 9px 12px; background: var(--canvas); color: var(--ink-primary);
  border: 1px solid var(--border-hairline); border-radius: var(--radius-1); font-family: var(--font-body); font-size: var(--body-s-size); line-height: 1.5; }
.ai-input:focus { outline: none; border-color: var(--accent); }
@media (max-width: 480px) { .ai-panel { right: 8px; left: 8px; width: auto; bottom: 84px; } }
.ai-desc-row__body textarea.input { margin-top: 4px; }
@media (max-width: 700px) { .ai-desc-row { grid-template-columns: 1fr; } .ai-desc-row__media { width: 100%; height: 180px; } .ai-diff__row { grid-template-columns: 22px 1fr; } .ai-diff__vals { grid-column: 2; } }

/* ============================ JOURNAL (BLOG) ============================ */
.blog-wrap { max-width: 1100px; margin: 0 auto; padding: var(--space-5) var(--pad-x); }
.blog-head { text-align: center; max-width: 720px; margin: 0 auto var(--space-4); padding-top: var(--space-3); }
.blog-title { font-family: var(--font-display); font-size: var(--display-l-size); line-height: var(--display-l-lh); color: var(--ink-primary); margin: var(--space-2) 0 var(--space-1); }
.blog-lede { font-size: var(--body-l-size); line-height: var(--body-l-lh); color: var(--ink-soft); }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4) var(--space-3); }
/* Filtres par catégorie */
.blog-filters { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: var(--space-4); }
.blog-filter { border: 1px solid var(--border-hairline); background: none; color: var(--ink-muted); border-radius: var(--radius-pill); padding: 8px 18px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.blog-filter:hover { color: var(--ink-primary); }
.blog-filter.is-on { color: var(--accent); border-color: var(--accent); }
/* Article à la une */
.blog-feature { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-4); align-items: center; margin-bottom: var(--space-5); cursor: pointer; }
.blog-feature__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--surface-2); border: 1px solid var(--border-hairline); }
.blog-feature__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity var(--dur-slow) var(--ease); }
.blog-feature:hover .blog-feature__media { border-color: var(--accent); }
.blog-feature__title { font-family: var(--font-display); font-size: var(--display-l-size); line-height: var(--display-l-lh); letter-spacing: var(--display-l-tracking); color: var(--ink-primary); margin: var(--space-2) 0; text-wrap: balance; }
.blog-feature:hover .blog-feature__title { color: var(--accent); }
.blog-feature__excerpt { font-size: var(--body-l-size); line-height: var(--body-l-lh); color: var(--ink-soft); }
.blog-feature__meta { display: block; margin-top: var(--space-2); font-size: var(--caption-size); letter-spacing: var(--caption-tracking); color: var(--ink-muted); }
.blog-feature__cta { display: inline-block; margin-top: var(--space-2); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
.blog-card { cursor: pointer; display: flex; flex-direction: column; gap: 0; transition: none; border: 0; background: none; }
.blog-card__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--surface-2); border: 1px solid var(--border-hairline); }
.blog-card__media img { transition: opacity var(--dur-slow) var(--ease); object-position: center 28%; }
.blog-feature__media img { object-position: center 28%; }
.blog-article__foot { text-align: center; }
.blog-article__foot .eyebrow, .blog-article__foot .blog-foot__title { text-align: center; }
.blog-card:hover .blog-card__media { border-color: var(--accent); }
.blog-card__body { padding: var(--space-2) 0 0; display: flex; flex-direction: column; gap: 8px; }
.blog-card__cat { font-size: var(--eyebrow-size); letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); }
.blog-card:hover .blog-card__title { color: var(--accent); }
.blog-card__title { transition: color var(--dur-fast) var(--ease); }
@media (max-width: 900px) { .blog-grid { grid-template-columns: 1fr 1fr; } .blog-feature { grid-template-columns: 1fr; } .blog-feature__media { aspect-ratio: 16 / 9; } .blog-feature__title { font-size: var(--display-m-size); } }
.blog-card { cursor: pointer; border: 1px solid var(--border-hairline); background: var(--surface-1); display: flex; flex-direction: column; transition: border-color var(--dur-fast) var(--ease); }
.blog-card:hover { border-color: var(--accent); }
.blog-card__media { aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface-2); }
.blog-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-card__ph { width: 100%; height: 100%; background: linear-gradient(135deg, var(--surface-2), #050505); }
.blog-card__body { padding: var(--space-3); display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog-card__cat { font-size: var(--eyebrow-size); letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--accent); }
.blog-card__title { font-family: var(--font-display); font-size: var(--display-s-size); line-height: var(--display-s-lh); color: var(--ink-primary); }
.blog-card__excerpt { font-size: var(--body-s-size); line-height: var(--body-s-lh); color: var(--ink-muted); flex: 1; }
.blog-card__meta { font-size: var(--caption-size); letter-spacing: var(--caption-tracking); color: var(--ink-muted); }

.blog-article { max-width: 760px; margin: 0 auto; padding: var(--space-5) var(--pad-x); }
.blog-back { display: inline-block; margin-bottom: var(--space-3); }
.blog-article__title { font-family: var(--font-display); font-size: var(--display-xl-size); line-height: var(--display-xl-lh); letter-spacing: var(--display-xl-tracking); color: var(--ink-primary); margin: var(--space-1) 0; }
.blog-article__meta { font-size: var(--body-s-size); color: var(--ink-muted); }
.blog-article__cover { margin: var(--space-4) 0; }
.blog-article__cover img { width: 100%; display: block; }
.blog-article__body { display: flex; flex-direction: column; }
.blog-h2 { font-family: var(--font-display); font-size: var(--display-m-size); line-height: var(--display-m-lh); color: var(--ink-primary); margin: var(--space-4) 0 var(--space-1); }
.blog-p { font-size: var(--body-l-size); line-height: 1.75; color: var(--ink-soft); margin: 0 0 var(--space-2); text-wrap: pretty; }
.blog-quote { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--accent); border-left: 1px solid var(--accent); padding-left: var(--space-2); margin: var(--space-3) 0; }
.blog-figure { margin: var(--space-3) 0; }
.blog-figure img { width: 100%; display: block; }
.blog-cap { font-size: var(--caption-size); color: var(--ink-muted); margin-top: 8px; text-align: center; }
.blog-cta-row { display: flex; gap: var(--space-2); flex-wrap: wrap; margin: var(--space-3) 0; }
/* Blocs éditoriaux luxe */
.blog-h3 { font-family: var(--font-display); font-size: var(--display-s-size); line-height: var(--display-s-lh); color: var(--ink-primary); margin: var(--space-3) 0 var(--space-1); }
.blog-lead { font-family: var(--font-display); font-size: var(--display-s-size); line-height: 1.4; color: var(--ink-soft); margin: 0 0 var(--space-3); }
.blog-spacer { height: var(--space-4); }
.blog-divider { display: flex; justify-content: center; margin: var(--space-4) 0; }
.blog-divider span { width: 64px; height: 1px; background: var(--accent); display: block; }
.blog-pull { margin: var(--space-5) 0; text-align: center; }
.blog-pull__text { font-family: var(--font-display); font-size: var(--display-l-size); line-height: 1.25; color: var(--accent); margin: 0; text-wrap: balance; }
.blog-pull__by { display: block; margin-top: var(--space-2); font-size: var(--eyebrow-size); letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--ink-muted); }
/* Pleine largeur — rompt la colonne de lecture */
.blog-fullbleed { position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; margin-top: var(--space-5); margin-bottom: var(--space-5); }
.blog-fullbleed img { width: 100%; max-height: 86vh; object-fit: cover; object-position: center; display: block; }
.blog-fullbleed__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: var(--space-4) var(--pad-x); background: linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%); text-align: center; }
.blog-fullbleed__title { display: block; font-family: var(--font-display); font-size: var(--display-l-size); color: var(--accent); }
.blog-duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: center; margin: var(--space-5) 0; }
.blog-duo--flip .blog-duo__media { order: 2; }
.blog-duo__media { aspect-ratio: 3 / 4; overflow: hidden; background: var(--surface-2); }
.blog-duo__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-gallery { margin: var(--space-4) 0; display: grid; gap: var(--space-1); }
.blog-gallery--2 { grid-template-columns: 1fr 1fr; }
.blog-gallery--3 { grid-template-columns: 1fr 1fr 1fr; }
.blog-gallery__cell { aspect-ratio: 3 / 4; overflow: hidden; background: var(--surface-2); }
.blog-gallery__cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-gallery__cap { grid-column: 1 / -1; }
@media (max-width: 700px) { .blog-duo { grid-template-columns: 1fr; } .blog-duo--flip .blog-duo__media { order: 0; } .blog-gallery--3 { grid-template-columns: 1fr 1fr; } .blog-pull__text { font-size: var(--display-m-size); } .blog-fullbleed__title { font-size: var(--display-m-size); } }
/* Blocs interactifs : simulateur, sondage, vitrine produit */
.blog-sim, .blog-poll { border: 1px solid var(--accent-muted); background: var(--surface-1); padding: var(--space-4); margin: var(--space-4) 0; }
.blog-sim__title, .blog-poll__q { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); margin: 8px 0 var(--space-1); }
.blog-sim__lede { font-size: var(--body-m-size); color: var(--ink-soft); margin: 0 0 var(--space-3); }
.blog-sim__field { margin-bottom: var(--space-2); }
.blog-sim__lbl { display: block; font-size: var(--eyebrow-size); letter-spacing: var(--eyebrow-tracking); text-transform: uppercase; color: var(--ink-muted); margin-bottom: 8px; }
.blog-sim__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.blog-sim__chip { border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); border-radius: var(--radius-pill); padding: 8px 14px; font-family: var(--font-body); font-size: var(--body-s-size); cursor: pointer; transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.blog-sim__chip:hover { color: var(--accent); border-color: var(--accent); }
.blog-sim__chip.is-on { background: var(--accent); color: var(--canvas); border-color: var(--accent); }
.blog-sim__result { display: flex; gap: var(--space-4); flex-wrap: wrap; margin: var(--space-3) 0 var(--space-1); padding-top: var(--space-3); border-top: 1px solid var(--border-divider); }
.blog-sim__rk { display: block; font-size: var(--caption-size); letter-spacing: var(--caption-tracking); text-transform: uppercase; color: var(--ink-muted); }
.blog-sim__rv { font-family: var(--font-display); font-size: var(--display-m-size); color: var(--accent); }
.blog-sim__rv--soft { color: var(--ink-soft); }
.blog-sim__note { font-size: var(--caption-size); color: var(--ink-muted); margin: 4px 0 0; }
.blog-sim .blog-cta-row, .blog-poll .blog-cta-row { justify-content: center; }
.blog-poll__opts { display: flex; flex-direction: column; gap: 8px; margin-top: var(--space-2); }
.blog-poll__opt { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; border: 1px solid var(--border-hairline); background: none; color: var(--ink-soft); padding: 13px 16px; cursor: pointer; font-family: var(--font-body); font-size: var(--body-m-size); transition: border-color var(--dur-fast) var(--ease); }
.blog-poll__opt:not(.is-result):hover { border-color: var(--accent); color: var(--accent); }
.blog-poll__opt.is-result { cursor: default; }
.blog-poll__opt.is-mine { border-color: var(--accent); }
.blog-poll__bar { position: absolute; left: 0; top: 0; bottom: 0; background: var(--accent-muted); z-index: 0; transition: width var(--dur-medium) var(--ease); }
.blog-poll__lbl, .blog-poll__pct { position: relative; z-index: 1; }
.blog-poll__pct { font-variant-numeric: tabular-nums; color: var(--ink-primary); }
.blog-poll__thanks { font-size: var(--caption-size); color: var(--ink-muted); margin: var(--space-2) 0 0; }
.blog-product { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: center; margin: var(--space-4) 0; border: 1px solid var(--border-hairline); }
.blog-product__media { aspect-ratio: 4 / 5; overflow: hidden; background: var(--surface-2); }
.blog-product__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-product__body { padding: var(--space-4) var(--space-4) var(--space-4) 0; }
.blog-product__title { font-family: var(--font-display); font-size: var(--display-m-size); color: var(--ink-primary); margin: 8px 0; }
.blog-product__desc { font-size: var(--body-m-size); color: var(--ink-soft); }
.blog-product__price { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--accent); margin: var(--space-2) 0; }
@media (max-width: 700px) { .blog-product { grid-template-columns: 1fr; } .blog-product__body { padding: 0 var(--space-3) var(--space-3); } }
/* Éditeur d'articles WYSIWYG : formulaire + aperçu live */
.blog-editor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 22px; padding: 14px 0 4px; align-items: start; }
.blog-editor__form { min-width: 0; }
.blog-editor__live { position: sticky; top: 12px; align-self: start; }
.blog-editor__livebar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.blog-editor__frame { border: 1px solid var(--border-hairline); border-radius: var(--radius-1); background: var(--canvas); max-height: calc(100vh - 120px); overflow-y: auto; }
.blog-editor__frame .blog-article--preview { padding: var(--space-3) var(--space-4); max-width: none; }
.blog-editor__frame .blog-fullbleed { left: auto; right: auto; margin-left: 0; margin-right: 0; width: 100%; margin-top: var(--space-3); margin-bottom: var(--space-3); }
.blog-editor__frame .blog-article__title { font-size: var(--display-m-size); line-height: var(--display-m-lh); }
.blog-editor__frame .blog-pull__text { font-size: var(--display-m-size); }
@media (max-width: 1000px) { .blog-editor { grid-template-columns: 1fr; } .blog-editor__live { position: static; } .blog-editor__frame { max-height: 520px; } }
.blog-article__foot { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--border-divider); text-align: center; }
.blog-foot__title { font-family: var(--font-display); font-size: var(--display-s-size); color: var(--ink-primary); margin: 8px 0 var(--space-2); }
.blog-article__foot .blog-cta-row { justify-content: center; }
.blog-article__body > .blog-cta-row { justify-content: center; }
.blog-related { margin-top: var(--space-4); }
.blog-related__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); margin-top: var(--space-2); }
.blog-related__item { text-align: left; background: var(--surface-1); border: 1px solid var(--border-hairline); padding: var(--space-2); cursor: pointer; display: flex; flex-direction: column; gap: 6px; transition: border-color var(--dur-fast) var(--ease); }
.blog-related__item:hover { border-color: var(--accent); }
.blog-related__t { font-family: var(--font-display); font-size: 18px; color: var(--ink-primary); }
.blog-related__m { font-size: var(--caption-size); color: var(--ink-muted); }
@media (max-width: 900px) { .blog-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .blog-grid { grid-template-columns: 1fr; } .blog-related__grid { grid-template-columns: 1fr; }
  .blog-wrap { padding: var(--space-3) var(--space-2); }
  .blog-title { font-size: clamp(26px, 8vw, 34px); }
  .blog-lede { font-size: 15px; }
  .blog-feature__title { font-size: var(--display-s-size); }
  .blog-article { padding: var(--space-3) var(--space-2); }
  .blog-article__title { font-size: clamp(26px, 8vw, 34px); line-height: 1.18; }
  .blog-h2 { font-size: var(--display-s-size); }
  .blog-p { font-size: 16px; }
  .blog-pull__text { font-size: 22px; }
  .blog-fullbleed { margin-left: calc(-1 * var(--space-2)); margin-right: calc(-1 * var(--space-2)); width: auto; }
  .blog-fullbleed img { max-height: 60vh; }
  .blog-fullbleed__title { font-size: var(--display-s-size); }
  .blog-cta-row { flex-direction: column; align-items: stretch; }
  .blog-cta-row .btn { width: 100%; justify-content: center; }
  .blog-sim, .blog-poll, .blog-product { padding: var(--space-3); }
}