/* =========================================================
   bar-scene.css - la scene "Entrez dans le bar" (home v2)
   Les variables --c-* et le bloc dark ont ete generes depuis le decor SVG :
   les modifier a la main desynchronise la scene. Le reste s'edite normalement.
   Tokens de couleur : un par couleur du decor, pour que le
   dark mode n'inverse PAS les sources lumineuses.
   ========================================================= */

.bar-scene{
  --c-15171a:#15171a;--c-3f3446:#3f3446;--c-5c4566:#5c4566;--c-5c6774:#5c6774;--c-645a76:#645a76;--c-6b5426:#6b5426;--c-6c5878:#6c5878;--c-6d5578:#6d5578;--c-7b7089:#7b7089;--c-7c688c:#7c688c;--c-7d3f64:#7d3f64;--c-8b8494:#8b8494;--c-8f7ab0:#8f7ab0;--c-8f7c9c:#8f7c9c;--c-8fa855:#8fa855;--c-8fae5f:#8fae5f;--c-94829f:#94829f;--c-9a92a4:#9a92a4;--c-9d89ad:#9d89ad;--c-9d91ab:#9d91ab;--c-a578a5:#a578a5;--c-a98f70:#a98f70;--c-a9bf5c:#a9bf5c;--c-a9c07a:#a9c07a;--c-b0709b:#b0709b;--c-b39c7f:#b39c7f;--c-b7c96f:#b7c96f;--c-b89b76:#b89b76;--c-b99a4f:#b99a4f;--c-b9a7c2:#b9a7c2;--c-bc70a4:#bc70a4;--c-bfd641:#bfd641;--c-c2a878:#c2a878;--c-c6b8d4:#c6b8d4;--c-c79bd0:#c79bd0;--c-c7b8d6:#c7b8d6;--c-c98fb4:#c98fb4;--c-c9b092:#c9b092;--c-c9b6d6:#c9b6d6;--c-cbb08b:#cbb08b;--c-cdb492:#cdb492;--c-cdbfa8:#cdbfa8;--c-cdc2dc:#cdc2dc;--c-cfb693:#cfb693;--c-cfc6dd:#cfc6dd;--c-cfe396:#cfe396;--c-d5c6e4:#d5c6e4;--c-d8bd76:#d8bd76;--c-d8cbe6:#d8cbe6;--c-d9cbb3:#d9cbb3;--c-d9cfe0:#d9cfe0;--c-d9cfe6:#d9cfe6;--c-d9e6a8:#d9e6a8;--c-dcc7a8:#dcc7a8;--c-ded4e8:#ded4e8;--c-ded6ea:#ded6ea;--c-e0dced:#e0dced;--c-e2cfb2:#e2cfb2;--c-e2d5ee:#e2d5ee;--c-e3d7c4:#e3d7c4;--c-e5deef:#e5deef;--c-e6d4b8:#e6d4b8;--c-e6dcf0:#e6dcf0;--c-e6ecdc:#e6ecdc;--c-e7dcec:#e7dcec;--c-e7dfd2:#e7dfd2;--c-e9c4dc:#e9c4dc;--c-e9d4e2:#e9d4e2;--c-e9e1d4:#e9e1d4;--c-e9e2f2:#e9e2f2;--c-eaf7c2:#eaf7c2;--c-ebdfc9:#ebdfc9;--c-edc8e0:#edc8e0;--c-eddcc4:#eddcc4;--c-eee6dc:#eee6dc;--c-efdcec:#efdcec;--c-efe8f2:#efe8f2;--c-efe9f4:#efe9f4;--c-f0e6d9:#f0e6d9;--c-f1e9f4:#f1e9f4;--c-f3c9a0:#f3c9a0;--c-f3e6d3:#f3e6d3;--c-f3ebe0:#f3ebe0;--c-f4e5b4:#f4e5b4;--c-f4ede1:#f4ede1;--c-f4eff8:#f4eff8;--c-f6e7a8:#f6e7a8;--c-f6ecda:#f6ecda;--c-f7eef6:#f7eef6;--c-f7f5fa:#f7f5fa;--c-f8e6f2:#f8e6f2;--c-f9f6fb:#f9f6fb;--c-fbe6cf:#fbe6cf;--c-fbf6ee:#fbf6ee;--c-fbf7ef:#fbf7ef;--c-fbf7fd:#fbf7fd;--c-fdeef7:#fdeef7;--c-fdf6d8:#fdf6d8;--c-fdfaf4:#fdfaf4;--c-fdfbfe:#fdfbfe;--c-ffd9ee:#ffd9ee;--c-ffdcf0:#ffdcf0;--c-fff3cd:#fff3cd;--c-fff3cf:#fff3cf;--c-fff3d4:#fff3d4;--c-fff4d2:#fff4d2;--c-fff4d8:#fff4d8;--c-fff6d4:#fff6d4;--c-fff6df:#fff6df;--c-fff6e8:#fff6e8;--c-fff6ea:#fff6ea;--c-fffaea:#fffaea;--c-fffaf1:#fffaf1;--c-fffaf2:#fffaf2;--c-fffdfa:#fffdfa;--c-fffefa:#fffefa;--c-ffffff:#ffffff;
  --scene-ease:cubic-bezier(.16,.8,.3,1);
  --scene-radius:20px;
  --scene-panel:rgba(255,255,255,.92);
  --scene-border:rgba(0,0,0,.10);
  --scene-text:var(--c-15171a,#15171a);
  --scene-text-dim:var(--c-5c6774,#5c6774);
  --scene-shadow:0 22px 54px -40px rgba(0,0,0,.55);
  /* Le bar doit tenir dans la fenetre sans scroll : on plafonne la LARGEUR a partir de
     la hauteur disponible, ce qui laisse aspect-ratio faire le reste. Plafonner la
     hauteur directement casserait le rapport 12/7, le SVG passerait en "slice" et les
     objets, positionnes en % du conteneur, glisseraient par rapport au decor.
     --scene-chrome = hauteur du header + navbar + marges de section. */
  --scene-chrome:240px;
  position:relative;
  width:min(100%, max(720px, calc((100vh - var(--scene-chrome)) * 1200 / 626)));
  width:min(100%, max(720px, calc((100svh - var(--scene-chrome)) * 1200 / 626)));
  margin-inline:auto;
  /* 1200x626 = le viewBox recadre (la zone plafond a ete comprimee de moitie).
     A garder synchronise avec BarSceneLayout.VbWidth / VbHeight. */
  aspect-ratio:1200/626;border-radius:var(--scene-radius);
  overflow:hidden;background:var(--c-f7f5fa,#f7f5fa);border:1px solid rgba(0,0,0,.07);
  box-shadow:0 20px 46px -34px rgba(0,0,0,.5);
  container-type:inline-size;
  opacity:0;transform:translateY(20px) scale(.99);
  transition:opacity .8s var(--scene-ease), transform 1s var(--scene-ease);
}
.bar-scene.is-in{opacity:1;transform:none}

.bar-scene__layer{position:absolute;inset:-4%;will-change:transform;pointer-events:none}
.bar-scene__layer svg{width:100%;height:100%;display:block}
.bar-scene__objs{position:absolute;inset:-4%;will-change:transform;pointer-events:none}
.bar-scene__objs > *{position:absolute}

/* --- objets photo poses sur les etageres / le comptoir --- */
.bs-tonic{transform:translateX(-50%);width:auto;
  filter:drop-shadow(0 3px 4px rgba(110,80,110,.34))}
.bs-gin{transform:translateX(-50%);width:auto;
  filter:drop-shadow(0 12px 11px rgba(110,80,110,.28))}
.bs-newgin{transform:translateX(-50%);width:auto;
  filter:drop-shadow(0 7px 8px rgba(120,70,110,.34))}
.bs-serve{transform-origin:50% 100%}
.bs-serve img{width:100%;height:100%;display:block;
  filter:drop-shadow(0 8px 7px rgba(108,78,108,.30))}
.bs-serve__sh{position:absolute;left:50%;bottom:-2.4%;width:122%;height:11%;
  transform:translateX(-50%);filter:blur(2px);
  background:radial-gradient(50% 50% at 50% 50%, rgba(96,66,96,.46), rgba(96,66,96,0) 68%)}

/* --- le journal : photo a gauche, titre a droite --- */
.bs-journal{perspective:1500px;pointer-events:none;transform:translateX(-50%)}
.bs-journal__sh{position:absolute;left:50%;bottom:-5%;width:104%;height:15%;
  transform:translateX(-50%);filter:blur(3px);
  background:radial-gradient(50% 50% at 50% 50%, rgba(96,66,96,.42), rgba(96,66,96,0) 68%)}
.bs-journal__ledge{position:absolute;left:50%;bottom:-3.4%;width:93%;height:6.4%;
  transform:translateX(-50%);border-radius:5px;
  background:linear-gradient(var(--c-eddcc4,#eddcc4),var(--c-c9b092,#c9b092));
  box-shadow:0 4px 9px -3px rgba(90,60,90,.45), inset 0 1.4px 0 rgba(255,250,241,.9)}
/* rotateX adouci : sous une transformation 3D le navigateur rasterise puis reechantillonne,
   et le texte des pages en ressort flou. On garde l'effet livre, on divise l'angle. */
.bs-journal__book{position:absolute;inset:0;display:flex;transform-style:preserve-3d;
  transform:rotateX(4deg) rotate(-1.2deg);
  filter:drop-shadow(0 14px 16px rgba(92,62,92,.26))}
.bs-page{position:relative;display:flex;flex-direction:column;overflow:hidden;min-height:0;
  background:linear-gradient(150deg,var(--c-fffefa,#fffefa) 0%,var(--c-fbf7ef,#fbf7ef) 58%,var(--c-f4ede1,#f4ede1) 100%);
  border:1px solid var(--c-e7dfd2,#e7dfd2);padding:.8em .85em;font-size:1.34cqw}
.bs-page--photo{flex:0 0 46%;transform-origin:right center;transform:rotateY(14deg);
  border-radius:7px 2px 2px 7px;padding:0;justify-content:flex-end}
/* La page photo garde son rotateY (un reechantillonnage ne se voit pas sur une photo),
   la page de titre reste plane pour que le texte soit net. */
.bs-page--title{flex:1;transform-origin:left center;
  border-radius:2px 7px 7px 2px;gap:.34em}
.bs-page--photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(120,96,130,0) 62%, rgba(120,96,130,.22) 100%)}
.bs-page--title::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(120,96,130,.20) 0%, rgba(120,96,130,0) 26%)}
.bs-photo{position:absolute;inset:0}
.bs-photo img{width:100%;height:100%;object-fit:cover;display:block}
.bs-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(30,14,30,.30) 0%, rgba(30,14,30,0) 34%,
    rgba(30,14,30,0) 52%, rgba(30,14,30,.62) 100%)}
.bs-cap{position:relative;z-index:2;padding:.62em .7em;display:flex;flex-direction:column;gap:.18em}
.bs-cap b{font-size:.56em;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--c-ffdcf0,#ffdcf0)}
.bs-cap span{font-size:.52em;font-weight:800;letter-spacing:.1em;color:rgba(255,255,255,.82)}
.bs-kick{display:flex;align-items:center;gap:.42em;font-size:.56em;font-weight:900;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gin-primary,var(--c-bc70a4,#bc70a4))}
.bs-kick i{font-style:normal;width:.44em;height:.44em;border-radius:50%;flex:none;
  background:var(--gin-primary,var(--c-bc70a4,#bc70a4));box-shadow:0 0 0 .16em rgba(188,112,164,.22)}
.bs-rule{height:2px;border-radius:1px;margin:.12em 0 .1em;
  background:linear-gradient(90deg,var(--gin-primary,var(--c-bc70a4,#bc70a4)),var(--gin-secondary,var(--c-bfd641,#bfd641)))}
.bs-title{margin:0;font-family:'Playfair Display',Georgia,serif;font-size:1.18em;font-weight:800;
  line-height:1.14;color:var(--scene-text);letter-spacing:-.012em;
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.bs-meta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;
  white-space:nowrap;gap:.4em;font-size:.56em;font-weight:800;color:var(--c-9a92a4,#9a92a4);letter-spacing:.06em;
  border-top:1px solid var(--c-e9e1d4,#e9e1d4);padding-top:.42em}
.bs-meta b{color:var(--c-7d3f64,#7d3f64);letter-spacing:.1em;text-transform:uppercase}
.bs-spine{position:absolute;left:46%;top:0;bottom:0;width:2.4%;transform:translateX(-50%);z-index:3;
  pointer-events:none;background:linear-gradient(90deg, rgba(60,40,66,.34),
    rgba(120,96,130,.06) 48%, rgba(120,96,130,.30))}

/* --- halo curseur + vignette --- */
.bs-glow{position:absolute;inset:0;pointer-events:none;z-index:6;opacity:0;transition:opacity .5s;
  background:radial-gradient(320px 320px at var(--gx,50%) var(--gy,50%),
    rgba(188,112,164,.16), rgba(188,112,164,0) 62%)}
.bar-scene:hover .bs-glow{opacity:1}
.bs-vignette{position:absolute;inset:0;pointer-events:none;z-index:7;
  background:radial-gradient(126% 96% at 50% 44%, rgba(255,255,255,0) 46%, rgba(255,255,255,.30) 100%)}

/* --- points d'entree --- */
.bs-spots{position:absolute;inset:0;z-index:10;will-change:transform;pointer-events:none}
.bs-spots:has(.bs-spot:hover),.bs-spots:has(.bs-spot:focus-visible){z-index:20}
.bs-spot{position:absolute;transform:translate(-50%,-50%);text-decoration:none;color:inherit;
  opacity:0;pointer-events:auto;transition:opacity .55s ease}
.bar-scene.is-in .bs-spot{opacity:1}
.bar-scene.is-in .bs-spot:nth-of-type(1){transition-delay:.40s}
.bar-scene.is-in .bs-spot:nth-of-type(2){transition-delay:.55s}
.bar-scene.is-in .bs-spot:nth-of-type(3){transition-delay:.70s}
.bs-spot__dot{position:relative;display:block;width:15px;height:15px;border-radius:50%;margin:0 auto;
  background:var(--gin-primary,var(--c-bc70a4,#bc70a4));border:3px solid #fff;box-shadow:0 4px 12px rgba(120,60,100,.45)}
.bs-spot__dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;
  border:2px solid rgba(188,112,164,.55);animation:bs-ping 2.8s cubic-bezier(.2,.6,.3,1) infinite}
@keyframes bs-ping{0%{transform:scale(.7);opacity:.9}70%,100%{transform:scale(2.5);opacity:0}}
.bs-spot__label{position:absolute;left:calc(100% + 11px);top:50%;transform:translateY(-50%);
  white-space:nowrap;font-size:11.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
  color:var(--scene-text);background:rgba(255,255,255,.88);border:1px solid rgba(0,0,0,.06);
  padding:4px 11px;border-radius:999px;box-shadow:0 6px 16px -10px rgba(0,0,0,.5);
  transition:color .25s var(--scene-ease),border-color .25s var(--scene-ease)}
.bs-spot--left .bs-spot__label{left:auto;right:calc(100% + 11px)}
.bs-spot:hover .bs-spot__label,.bs-spot:focus-visible .bs-spot__label{
  color:var(--c-7d3f64,#7d3f64);border-color:rgba(188,112,164,.45)}
.bs-spot__card{position:absolute;left:50%;top:calc(100% + 14px);transform:translate(-50%,8px);
  width:244px;padding:15px 17px;border-radius:14px;background:var(--scene-panel);
  backdrop-filter:blur(10px);border:1px solid var(--scene-border);box-shadow:var(--scene-shadow);
  opacity:0;visibility:hidden;transition:opacity .3s ease, transform .42s var(--scene-ease), visibility .3s}
.bs-spot--up .bs-spot__card{top:auto;bottom:calc(100% + 14px)}
.bs-spot--left .bs-spot__card{left:auto;right:-8px;transform:translate(0,8px)}
.bs-spot:hover .bs-spot__card,.bs-spot:focus-visible .bs-spot__card{
  opacity:1;visibility:visible;transform:translate(-50%,0)}
.bs-spot--left:hover .bs-spot__card,.bs-spot--left:focus-visible .bs-spot__card{transform:translate(0,0)}
.bs-spot__k{display:block;font-size:10px;font-weight:900;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gin-primary,var(--c-bc70a4,#bc70a4))}
.bs-spot__t{display:block;font-size:19px;font-weight:950;color:var(--scene-text);margin:4px 0 5px;line-height:1.1}
.bs-spot__d{display:block;font-size:12.5px;line-height:1.5;color:var(--scene-text-dim);font-weight:600;margin:0 0 10px}
.bs-spot__cta{display:inline-flex;gap:7px;align-items:center;font-size:12.5px;font-weight:900;color:var(--c-7d3f64,#7d3f64)}
.bs-spot__cta i{font-style:normal;transition:transform .3s var(--scene-ease)}
.bs-spot:hover .bs-spot__cta i{transform:translateX(5px)}

/* --- repli petit ecran : les 3 cartes de la home ---
   Elles restent en display:none au-dessus de 860px. Leurs images portent data-src
   et PAS src : loading="lazy" ne suffit pas a empecher le telechargement dans un
   sous-arbre sans boite. C'est bar-scene.js qui pose le src, et uniquement sur
   celui des deux blocs qui est effectivement affiche. */
.bs-cards{display:none}

/* --- animations d'ambiance --- */
.bs-mote{animation:bs-drift linear infinite;opacity:0}
@keyframes bs-drift{0%{transform:translate(0,0);opacity:0}15%{opacity:.5}85%{opacity:.3}
  100%{transform:translate(24px,-88px);opacity:0}}
.bs-shine{animation:bs-shine 7s ease-in-out infinite}
@keyframes bs-shine{0%,100%{opacity:.5}45%{opacity:.85}}
.bs-rack{animation:bs-sway 11s ease-in-out infinite;transform-origin:202px 0}
@keyframes bs-sway{0%,100%{transform:rotate(-.22deg)}50%{transform:rotate(.22deg)}}

@media (prefers-reduced-motion:reduce){
  .bs-mote,.bs-shine,.bs-rack,.bs-spot__dot::after{animation:none!important}
  .bar-scene{opacity:1;transform:none;transition:none}
}
@media (max-width:860px){
  .bar-scene{display:none}
  .bs-cards{display:block}
}

[data-theme="dark"] .bar-scene{--c-15171a:#e8e4f0;--c-3f3446:#0f0d16;--c-5c4566:#05040a;--c-5c6774:#b8b1c8;--c-645a76:#16131d;--c-6b5426:#6b5426;--c-6c5878:#05040a;--c-6d5578:#05040a;--c-7b7089:#262230;--c-7c688c:#0d0b13;--c-7d3f64:#e6a9cd;--c-8b8494:#9a92a8;--c-8f7ab0:#6f5f92;--c-8f7c9c:#6f6688;--c-8fa855:#495332;--c-8fae5f:#8fae5f;--c-94829f:#3f3744;--c-9a92a4:#8a7fa8;--c-9d89ad:#2a2538;--c-9d91ab:#35313f;--c-a578a5:#6b5a86;--c-a98f70:#3a3040;--c-a9bf5c:#4a532a;--c-a9c07a:#a9c07a;--c-b0709b:#4b3042;--c-b39c7f:#3a3040;--c-b7c96f:#464e26;--c-b89b76:#1f1a26;--c-b99a4f:#b99a4f;--c-b9a7c2:#100e17;--c-bc70a4:#c48db3;--c-bfd641:#bfd641;--c-c2a878:#c2a878;--c-c6b8d4:#4a4358;--c-c79bd0:#a87fb4;--c-c7b8d6:#17141f;--c-c98fb4:#44283a;--c-c9b092:#241f2c;--c-c9b6d6:#191527;--c-cbb08b:#1e1926;--c-cdb492:#241e2a;--c-cdbfa8:#3a3346;--c-cdc2dc:#35313f;--c-cfb693:#261f2d;--c-cfc6dd:#6b6280;--c-cfe396:#3b461d;--c-d5c6e4:#1c1828;--c-d8bd76:#d8bd76;--c-d8cbe6:#1f1a2b;--c-d9cbb3:#3a3346;--c-d9cfe0:#262232;--c-d9cfe6:#221e2e;--c-d9e6a8:#7e8a52;--c-dcc7a8:#2a2331;--c-ded4e8:#201d2a;--c-ded6ea:#251e31;--c-e0dced:#16141f;--c-e2cfb2:#2e2634;--c-e2d5ee:#221d2e;--c-e3d7c4:#3a3346;--c-e5deef:#241c2f;--c-e6d4b8:#2b2432;--c-e6dcf0:#262133;--c-e6ecdc:#1d2226;--c-e7dcec:#2a2536;--c-e7dfd2:#322c3d;--c-e9c4dc:#7d5570;--c-e9d4e2:#6b4f63;--c-e9e1d4:#322c3d;--c-e9e2f2:#2e2a3c;--c-eaf7c2:#eaf7c2;--c-ebdfc9:#372d1b;--c-edc8e0:#38192d;--c-eddcc4:#3a3244;--c-eee6dc:#1b1826;--c-efdcec:#211521;--c-efe8f2:#22202c;--c-efe9f4:#1c1926;--c-f0e6d9:#32281a;--c-f1e9f4:#201c2b;--c-f3c9a0:#f3c9a0;--c-f3e6d3:#3a3040;--c-f3ebe0:#c6bed0;--c-f4e5b4:#f4e5b4;--c-f4ede1:#191622;--c-f4eff8:#2b2836;--c-f6e7a8:#f6e7a8;--c-f6ecda:#3e3446;--c-f7eef6:#c9c0d6;--c-f7f5fa:#16141d;--c-f8e6f2:#281a27;--c-f9f6fb:#2a2735;--c-fbe6cf:#fbe6cf;--c-fbf6ee:#cfc7d8;--c-fbf7ef:#1e1b28;--c-fbf7fd:#23202e;--c-fdeef7:#2e1f2c;--c-fdf6d8:#fdf6d8;--c-fdfaf4:#221f2c;--c-fdfbfe:#302c3c;--c-ffd9ee:#ffd9ee;--c-ffdcf0:#ffdcf0;--c-fff3cd:#fff3cd;--c-fff3cf:#fff3cf;--c-fff3d4:#fff3d4;--c-fff4d2:#fff4d2;--c-fff4d8:#fff4d8;--c-fff6d4:#fff6d4;--c-fff6df:#fff6df;--c-fff6e8:#fff6e8;--c-fff6ea:#fff6ea;--c-fffaea:#fffaea;--c-fffaf1:#fffaf1;--c-fffaf2:#fffaf2;--c-fffdfa:#1a1723;--c-fffefa:#23202d;--c-ffffff:#ffffff;}

/* --- dark : on ne reprend QUE les surfaces, les sources lumineuses restent claires --- */
[data-theme="dark"] .bar-scene{border-color:rgba(255,255,255,.09);background:#16141d;
  --scene-panel:rgba(29,31,40,.94);
  --scene-border:rgba(255,255,255,.12);
  --scene-text:var(--dk-text,#e8e4f0);
  --scene-text-dim:var(--dk-text-2,#b8b1c8);
  --scene-shadow:0 22px 54px -34px rgba(0,0,0,.85)}
[data-theme="dark"] .bs-vignette{
  background:radial-gradient(126% 96% at 50% 44%, rgba(0,0,0,0) 42%, rgba(0,0,0,.42) 100%)}
[data-theme="dark"] .bs-glow{
  background:radial-gradient(320px 320px at var(--gx,50%) var(--gy,50%),
    rgba(196,141,179,.22), rgba(196,141,179,0) 62%)}
[data-theme="dark"] .bs-spot__label{background:rgba(29,31,40,.9);border-color:rgba(255,255,255,.14)}
[data-theme="dark"] .bs-spot__dot{border-color:#1d1f28;box-shadow:0 4px 14px rgba(0,0,0,.7)}
[data-theme="dark"] .bs-spot__cta,[data-theme="dark"] .bs-meta b,
[data-theme="dark"] .bs-spot:hover .bs-spot__label{color:#e6a9cd}
[data-theme="dark"] .bs-page{background:linear-gradient(150deg,#23202d 0%,#1e1b28 58%,#191622 100%);
  border-color:#322c3d}
[data-theme="dark"] .bs-meta{color:#8a7fa8;border-top-color:#322c3d}
[data-theme="dark"] .bs-journal__ledge{background:linear-gradient(#3a3244,#241f2c);
  box-shadow:0 4px 9px -3px rgba(0,0,0,.7), inset 0 1.4px 0 rgba(255,255,255,.22)}
[data-theme="dark"] .bs-journal__book{filter:drop-shadow(0 14px 18px rgba(0,0,0,.6))}
[data-theme="dark"] .bs-page--photo::after{
  background:linear-gradient(90deg, rgba(0,0,0,0) 62%, rgba(0,0,0,.5) 100%)}
[data-theme="dark"] .bs-page--title::after{
  background:linear-gradient(90deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,0) 26%)}
/* les photos detourees paraissent ternes sur fond noir */
[data-theme="dark"] .bs-tonic,[data-theme="dark"] .bs-gin,
[data-theme="dark"] .bs-newgin,[data-theme="dark"] .bs-serve img{
  filter:drop-shadow(0 10px 12px rgba(0,0,0,.6)) brightness(1.06) contrast(1.03)}


/* =========================================================
   Vitrine « Nouveautes » : vraies photos produit
   =========================================================
   bottleCutout.js retire le fond blanc cote client et pose
   data-cutout-state.

   ATTENTION a "skip" : il signifie "les coins ne sont pas blancs",
   ce qui est le cas NORMAL des variantes responsive du blob, deja
   transparentes (alpha 0 aux quatre coins). Ne pas l'encadrer.

   On n'encadre que les deux vrais echecs :
     revert = fond blanc detecte mais >72% de l'image effacee
              (bouteille en verre dont l'interieur a fui)
     fail   = canvas tainted / CORS : on n'a rien pu lire
   Dans ces cas la photo garde son rectangle blanc : on l'assume
   comme une vignette encadree posee sur l'etagere. */
.bs-newgin--live[data-cutout-state="revert"],
.bs-newgin--live[data-cutout-state="fail"]{
  background:#fdfaf4;
  border-radius:2px;
  box-shadow:0 5px 12px -4px rgba(90,60,90,.55),
             0 0 0 3px #fdfaf4,
             0 0 0 4px rgba(0,0,0,.12);
}
[data-theme="dark"] .bs-newgin--live[data-cutout-state="revert"],
[data-theme="dark"] .bs-newgin--live[data-cutout-state="fail"]{
  background:#221f2c;
  box-shadow:0 5px 12px -4px rgba(0,0,0,.7),
             0 0 0 3px #221f2c,
             0 0 0 4px rgba(255,255,255,.14);
}

/* =========================================================
   Bouteille de la vitrine : survol = nom, drapeau, date
   =========================================================
   Le lien porte la position et la hauteur ; l'image garde son
   ratio naturel. Le calque d'objets est en pointer-events:none,
   on le rouvre uniquement sur la bouteille. */
.bs-newbottle{
  transform:translateX(-50%);
  pointer-events:auto;
  display:block;
  text-decoration:none;
  color:inherit;
}
.bs-newbottle__img{
  display:block;height:100%;width:auto;
  filter:drop-shadow(0 7px 8px rgba(120,70,110,.34));
  transition:transform .3s var(--scene-ease), filter .3s var(--scene-ease);
}
.bs-newbottle:hover .bs-newbottle__img,
.bs-newbottle:focus-visible .bs-newbottle__img{
  transform:translateY(-3%) scale(1.05);
  filter:drop-shadow(0 12px 14px rgba(120,70,110,.45));
}
.bs-newbottle__tip{
  position:absolute;left:50%;bottom:calc(100% + 10px);
  transform:translate(-50%,6px);
  display:flex;flex-direction:column;align-items:center;gap:.2em;
  white-space:nowrap;padding:8px 13px;border-radius:12px;
  background:var(--scene-panel);border:1px solid var(--scene-border);
  box-shadow:var(--scene-shadow);backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;z-index:12;
  transition:opacity .25s ease, transform .35s var(--scene-ease), visibility .25s;
}
.bs-newbottle:hover .bs-newbottle__tip,
.bs-newbottle:focus-visible .bs-newbottle__tip{
  opacity:1;visibility:visible;transform:translate(-50%,0);
}
.bs-newbottle__name{
  font-size:13px;font-weight:900;line-height:1.15;color:var(--scene-text);
}
.bs-newbottle__meta{
  display:flex;align-items:center;gap:7px;
  font-size:11px;font-weight:700;color:var(--scene-text-dim);
}
.bs-newbottle__meta .fi{border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.12)}

@media (max-width:860px){
  .bs-newbottle{pointer-events:none}
}