
.bm{--bm-ease:cubic-bezier(.22,1,.36,1);--bm-ease-io:cubic-bezier(.65,0,.35,1);--bm-dur:300ms;--bm-gold-a:#DDAE00;--bm-gold-b:#C39B05}

/* ---------- 1 · load sequence (same timing as Energy heroes) ---------- */
@keyframes bmUp{from{opacity:0;translate:0 24px}}
@keyframes bmDown{from{opacity:0;translate:0 -16px}}
@keyframes bmFade{from{opacity:0;scale:1.03}}
@keyframes bmVeil{from{opacity:1}to{opacity:0}}
@media (prefers-reduced-motion:no-preference){
  .bm .bn-d .bn-bar,.bm .bn-m .bn-bar,.bm #bgh-wrap,.bm #bgh-m-hero{animation:bmDown .3s var(--bm-ease) .2s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child{isolation:isolate}
  .bm [data-elementor-type="wp-page"] > :first-child::after{content:"";position:absolute;inset:0;z-index:-1;background:#F9F7F5;pointer-events:none;animation:bmVeil .7s var(--bm-ease) forwards}
  .bm [data-elementor-type="wp-page"] > :first-child h1{animation:bmUp .4s var(--bm-ease) .35s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child p:not(a p){animation:bmUp .3s var(--bm-ease) .5s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child a[href="#trust"]{animation:bmUp .3s var(--bm-ease) .6s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child a[href="#trust"] ~ a[href="#trust"]{animation-delay:.7s}
  .bm [data-elementor-type="wp-page"] > :first-child a[href="#trust"] ~ a[href="#trust"] ~ a[href="#trust"]{animation-delay:.8s}
  .bm [data-elementor-type="wp-page"] > :first-child img:not(.e-svg-base img){animation:bmFade .6s var(--bm-ease) .45s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child :is(a.e-button-base,.elementor-button,.header-link){animation:bmUp .3s var(--bm-ease) .85s backwards}
  .bm [data-elementor-type="wp-page"] > :first-child :is(a.e-button-base,.header-link) ~ :is(a.e-button-base,.header-link){animation-delay:.95s}
}

/* ---------- 2 · scroll reveals: text + card rows ---------- */
.bm.bm-js .bm-tr{opacity:0;translate:0 14px;transition:opacity .45s var(--bm-ease) var(--bm-d,0ms),translate .55s var(--bm-ease) var(--bm-d,0ms)}
.bm.bm-js .bm-tr.bm-in{opacity:1;translate:0 0}
.bm.bm-js .bm-r{opacity:0;translate:0 24px;transition:opacity var(--bm-dur) var(--bm-ease) var(--bm-d,0ms),translate var(--bm-dur) var(--bm-ease) var(--bm-d,0ms)}
.bm.bm-js .bm-r.bm-in{opacity:1;translate:0 0}

/* ---------- 3 · interactive section (se-acc): 12px body, gradient dark on the left ---------- */
.bm .se-acc-details p,.bm .se-acc-details .e-paragraph-base{font-size:12px !important;line-height:1.5 !important}
.bm .se-acc-item.active{background-image:linear-gradient(79deg,var(--bm-gold-b) 0%,var(--bm-gold-a) 100%) !important}

/* ---------- 4 · trust marquee hover: enlarge + gold accent (Energy uses its green) ---------- */
.bm .marquee-track .feature-item{transition:transform .35s var(--bm-ease)}
.bm .marquee-track .feature-item svg,.bm .marquee-track .feature-item svg path,.bm .marquee-track .feature-item p{transition:fill .35s ease,color .35s ease}
@media (hover:hover) and (pointer:fine){
  .bm .marquee-track .feature-item:has(p):hover{transform:scale(1.2);position:relative;z-index:2}
  .bm .marquee-track .feature-item:has(p):hover svg,.bm .marquee-track .feature-item:has(p):hover svg path{fill:url(#bmGoldGrad) !important}
  .bm .marquee-track .feature-item:has(p):hover p{background:linear-gradient(90deg,var(--bm-gold-a) 7%,var(--bm-gold-b) 100%);-webkit-background-clip:text;background-clip:text;color:transparent !important;-webkit-text-fill-color:transparent}
}

/* ---------- 5 · lead magnet parallax (background moved into a scroll-timeline layer) ---------- */
.bm .bm-px-host{isolation:isolate}
.bm .bm-px{position:absolute;inset:0;overflow:hidden;overflow:clip;z-index:-2;pointer-events:none}
.bm .bm-px-layer{position:absolute;left:0;right:0;top:-12%;bottom:-12%}
@keyframes bmPx{from{translate:0 -9%}to{translate:0 9%}}
@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.bm .bm-px-layer{animation:bmPx linear both;animation-timeline:view()}}}

/* ---------- 6 · catalogue (BRALE Interieurs) → Figma 5653:6847 layout, content untouched ---------- */
.bm .bm-cat{display:grid !important;grid-template-columns:minmax(0,1fr) 286px;column-gap:64px;row-gap:0;align-items:end;
  padding:64px max(24px,calc((100% - 1248px) / 2)) 48px !important;max-width:none !important;width:100% !important;box-sizing:border-box}
.bm .bm-cat-wrap{display:contents !important}
.bm .bm-cat-eyebrow{grid-column:1;grid-row:1;margin:0 0 8px !important;font-size:16px !important;line-height:1.4 !important;max-width:none !important}
.bm .bm-cat-h2{grid-column:1;grid-row:2;margin:0 0 24px !important;font-size:clamp(32px,3.4vw,48px) !important;line-height:1.1 !important;max-width:none !important}
.bm .bm-cat-body{grid-column:1;grid-row:3;margin:0 !important;max-width:801px !important;font-size:16px !important;line-height:1.4 !important}
.bm .bm-cat-cta{grid-column:2;grid-row:3;align-self:end;width:100% !important;max-width:none !important;margin:0 !important;gap:16px !important}
.bm .bm-cat-cta a{width:100% !important}
.bm .bm-cat-cta p{font-size:12px !important;line-height:1.4 !important}
.bm .bm-cat-media{grid-column:1/-1;grid-row:4;margin-top:48px !important;width:100% !important;max-width:none !important}
/* the carousel ships with max-height:490px on every level and some slides carry min-height:900px */
.bm .bm-cat-media,.bm .bm-cat-media :is(.e-n-carousel,.swiper-wrapper,.swiper-slide,.e-con,.e-con-inner){height:auto !important;max-height:none !important;min-height:0 !important}
.bm .bm-cat-media .swiper-slide img{width:100% !important;height:auto !important;aspect-ratio:1248/646;object-fit:cover}
.bm .bm-cat-tiles{grid-column:1/-1;grid-row:5;width:100% !important;max-width:none !important;padding:0 !important;margin:0 !important}
.bm .bm-cat-misc{display:none !important}
.bm .bm-cat-grid{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px !important;padding:24px 16px 0 !important;width:100% !important;max-width:none !important;box-sizing:border-box}
.bm .bm-cat-grid > :not(.slider-nav-card){display:contents !important}
.bm .bm-cat-grid .slider-nav-card{width:auto !important;max-width:none !important;min-width:0;padding:16px !important;gap:8px !important}
.bm .bm-cat-grid .slider-nav-card img{width:32px !important;height:32px !important;flex:none}
.bm .bm-cat-grid .slider-nav-card h4{font-size:12px !important;line-height:1.4 !important;letter-spacing:.04em;text-transform:uppercase}
.bm .bm-cat-grid .slider-nav-card p{font-size:12px !important;line-height:1.4 !important}
@media (max-width:1025px){
  .bm .bm-cat{grid-template-columns:minmax(0,1fr);padding:56px 48px 40px !important}
  .bm .bm-cat-cta{grid-column:1;grid-row:4;margin-top:24px !important;max-width:358px !important}
  .bm .bm-cat-media{grid-row:5;margin-top:40px !important}
  .bm .bm-cat-tiles{grid-row:6}
  .bm .bm-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px 0 0 !important}
}
@media (max-width:767px){
  .bm .bm-cat{padding:48px 24px 32px !important}
  .bm .bm-cat-cta{max-width:none !important}
  .bm .bm-cat-media .swiper-slide img{aspect-ratio:4/3}
  .bm .bm-cat-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;width:auto !important;margin:0 -24px 0 0 !important;padding:16px 24px 4px 0 !important}
  .bm .bm-cat-grid::-webkit-scrollbar{display:none}
  .bm .bm-cat-grid .slider-nav-card{scroll-snap-align:start}
}

/* ---------- 7 · hero labels: hover scale + jump to the trust section (same as Energy) ---------- */
.bm #trust{scroll-margin-top:96px}
@media (prefers-reduced-motion:no-preference){html.bm{scroll-behavior:smooth}}
.bm .bm-lab{transform-origin:center;transition:scale .25s var(--bm-ease)}
.bm .bm-lab-link{display:block;line-height:0;cursor:pointer}
.bm .bm-usp-svg{overflow:visible !important}
.bm .bm-usp-svg .bm-usp{transform-box:fill-box;transform-origin:center;transition:transform .25s var(--bm-ease);cursor:pointer}
.bm .bm-usp-svg .bm-usp-hit{fill:transparent;pointer-events:all}
@media (hover:hover) and (pointer:fine) and (min-width:1026px){
  .bm .bm-lab:hover{scale:1.08}
  .bm .bm-usp-svg .bm-usp:hover{transform:scale(1.08)}
}

@media (prefers-reduced-motion:reduce){.bm .bm-tr,.bm .bm-r{opacity:1 !important;translate:none !important;transition:none !important}}
