
:root{--bm-grad-from:#2d00f7;--bm-grad-to:#b100e8;--bm-accent:#08c26e;--bm-head:#0f172a;--bm-text:#111827;--bm-muted:#4b5563;--bm-link:#2563eb;--bm-bg:#fff;--bm-hero-head:#fff;--bm-hero-text:#f1f5f9;--bm-gw:300px;--bm-gh:300px;--bm-gpad:10px;--bm-gr:18px}
*{box-sizing:border-box}
.bm-root{display:block;color:var(--bm-text);background:var(--bm-bg);position:relative;z-index:0}
.bm-root a,.bm-root a:link,.bm-root a:visited,.bm-root .bm-btn,.bm-root .bm-btn:link,.bm-root .bm-btn:visited{text-decoration:none!important}
.bm-container{max-width:1120px;margin:0 auto;padding:0 16px}
.section-title{font-size:32px;margin:0 0 14px 0;color:var(--bm-head)}
.bm-btn{display:inline-block;background:var(--bm-accent);color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:0 12px 28px rgba(8,194,110,.32);transition:transform .15s ease, box-shadow .15s ease}
.bm-btn:hover{transform:translateY(-1px);box-shadow:0 14px 32px rgba(8,194,110,.36)}
.bm-btn:active{transform:translateY(0) scale(.98);box-shadow:0 8px 20px rgba(8,194,110,.28)}
/* HERO */
.bm-hero{background:linear-gradient(135deg,var(--bm-grad-from),var(--bm-grad-to));color:#fff;padding:56px 0 24px 0;position:relative;overflow:hidden;z-index:0}
.bm-hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.bm-hero h1{font-size:48px;line-height:1.1;margin:0 0 12px 0}
.bm-hero .lead{opacity:.95;margin:0 0 16px 0}
.bm-hero-right img{width:100%;max-height:420px;object-fit:contain;filter:drop-shadow(0 24px 60px rgba(0,0,0,.35))}
/* Marquee */
.bm-marquee{margin-top:28px;overflow:hidden;border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2)}
.bm-marquee-track{display:flex;gap:40px;padding:12px 0;animation:bm-marquee 20s linear infinite;white-space:nowrap}
.bm-marquee span{opacity:.9}
@keyframes bm-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* Usage */
.bm-usage{background:var(--bm-bg);padding:44px 0}
.bm-usage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.bm-usage-card{background:#fff;border:1px solid #eee;border-radius:16px;padding:16px;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.bm-usage-card .icon{font-size:28px}
.bm-usage-card h3{margin:6px 0 8px 0;color:var(--bm-head)}
.bm-usage-card ul{margin:0;padding-left:18px;color:var(--bm-muted)}
/* Gallery */
.bm-services-gallery{padding:32px 0}
.bm-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bm-gallery figure{margin:0;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.bm-gallery img{width:100%;height:100%;object-fit:cover}
/* Service texts */
.bm-service-texts{padding:28px 0 8px 0}
.bm-cols-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bm-card{background:#fff;border:1px solid #eee;border-radius:16px;padding:18px;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.bm-card h3{color:var(--bm-head);margin:0 0 8px}
.bm-card p{color:var(--bm-text)}
/* Split */
.bm-split{padding:44px 0}
.bm-split-inner{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.bm-split-text h2{font-size:42px;margin:0 0 10px 0;color:var(--bm-head)}
.bm-split-text p{color:var(--bm-muted)}
.bm-split-img img{width:100%;border-radius:16px;box-shadow:0 18px 45px rgba(0,0,0,.12)}
/* Testimonial */
.bm-testimonial{padding:28px 0}
.bm-testi-card{background:#f7f7fb;border:1px solid #eee;border-radius:16px;padding:22px;text-align:center;box-shadow:0 10px 24px rgba(0,0,0,.05)}
.bm-testi-card .avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;margin:-60px auto 12px auto;box-shadow:0 8px 26px rgba(0,0,0,.15)}
.bm-testi-card blockquote{font-size:20px;line-height:1.5;margin:8px auto;max-width:800px;color:var(--bm-head)}
.bm-testi-card .by{color:var(--bm-muted)}
/* Why Us */
.bm-why{padding:22px 0 40px}
.bm-card.why .icon{font-size:28px}
/* CTA */
.bm-cta{padding:32px 0}
.bm-cta-inner{max-width:1000px;margin:0 auto;background:linear-gradient(135deg,var(--bm-grad-from),var(--bm-grad-to));color:#fff;border-radius:18px;padding:20px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 48px rgba(0,0,0,.2)}
.bm-cta .text{font-size:22px}
/* Auto gallery with card dimensions */
.bm-auto-gallery{padding:14px 0;overflow:hidden;background:#fafafa}
.bm-auto-track{display:flex;gap:20px;animation:bm-auto var(--bm-gdur, 7s) linear infinite;will-change:transform}
.bm-auto-gallery:hover .bm-auto-track{animation-play-state:paused}
.bm-g-item{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;background:#fff;border-radius:var(--bm-gr);padding:var(--bm-gpad);box-shadow:0 8px 20px rgba(0,0,0,.12);width:calc(var(--bm-gw) + 2*var(--bm-gpad));height:calc(var(--bm-gh) + 2*var(--bm-gpad));flex:0 0 auto;}
.bm-g-item img{display:block;width:var(--bm-gw);height:var(--bm-gh);object-fit:var(--bm-gfit);border-radius:calc(var(--bm-gr) - 4px)}
@keyframes bm-auto{from{transform:translateX(0)}to{transform:translateX(var(--bm-shift-end, calc(-1 * var(--bm-shift,50%))))}}
/* Reveal */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease, transform .6s ease}
.reveal.show{opacity:1;transform:none}
.bm-no-anim .reveal{opacity:1;transform:none}
@media(max-width:960px){
  .bm-hero-inner{grid-template-columns:1fr}
  .bm-usage-grid{grid-template-columns:repeat(2,1fr)}
  .bm-cols-3{grid-template-columns:1fr}
  .bm-gallery{grid-template-columns:1fr}
  .bm-split-inner{grid-template-columns:1fr}
}


/* --- Mobile Typography & Overflow Fixes --- */
.bm-hero-left h1{word-break:break-word;overflow-wrap:anywhere;}
.bm-hero-right img{max-width:100%;height:auto;display:block;}
.bm-split-img img{max-width:100%;height:auto;display:block;width:100%;}
.bm-container, .bm-hero, .bm-split-inner, .bm-services-gallery, .bm-service-texts{overflow-x:hidden;}
.bm-g-item img{max-width:100%;height:auto;display:block;}

@media(max-width:768px){
  .bm-hero-left h1{font-size:clamp(28px, 8vw, 40px); line-height:1.15; margin:0 0 8px 0;}
  .bm-hero .lead{font-size:clamp(15px, 4.5vw, 18px); line-height:1.4;}
  .bm-container{padding-left:16px;padding-right:16px;}
  .bm-auto-track{gap:12px;}
  .bm-g-item{height:auto;}
  .bm-g-item img{width:min(80vw, var(--bm-gw)); height:auto;}
}



/* V12: hover pause + loop safeguard */
@media (hover:hover) and (pointer:fine){
  .bm-auto-track:hover, .bm-marquee-track:hover{ animation-play-state: paused !important; }
}
.bm-auto-track, .bm-marquee-track{ animation-iteration-count: infinite; animation-timing-function: linear; }


/* === V22 CLEAN FRONT-END PACK === */
@media (max-width:1024px){
  .bm-usage-grid, .bm-cols-3, .bm-gallery{ display:grid !important; grid-template-columns:1fr !important; gap:16px !important; }
  .bm-usage, .bm-service-texts, .bm-services-gallery{ display:block !important; }
  .bm-usage-card, .bm-card, .bm-g-item{ width:100% !important; max-width:100% !important; }
  .bm-container{ padding-left:max(20px, env(safe-area-inset-left)) !important; padding-right:max(24px, env(safe-area-inset-right)) !important; }
}
.bm-hero-left h1{ font-size:40px; line-height:1.15; letter-spacing:-0.2px; }
.section-title{ font-size:30px; line-height:1.2; }
@media (max-width:414px){
  .bm-hero-left h1{ font-size:26px !important; line-height:1.15 !important; }
  .section-title{ font-size:21px !important; line-height:1.2 !important; }
}
.bm-testimonial, .bm-testi-card{ overflow:visible !important; }
.bm-testi-card{ padding-top:72px !important; }
.bm-testimonial .avatar{ width:96px; height:96px; border-radius:50%; object-fit:cover; object-position:center 28%; display:block; margin:-48px auto 10px auto; box-shadow:0 8px 24px rgba(0,0,0,.18); border:3px solid rgba(255,255,255,.9); }
@media (min-width:961px){
  .bm-gallery .bm-g-item{ height:260px; display:flex; align-items:center; justify-content:center; }
  .bm-gallery .bm-g-item img{ max-height:100%; width:auto; height:auto; object-fit:contain !important; }
}
:root{ --bm-marquee-dur: 22s; --bm-auto-dur: 16s; }
.bm-marquee-track{ animation-duration: var(--bm-marquee-dur) !important; animation-iteration-count: infinite !important; animation-timing-function: linear !important; }
.bm-auto-track{ animation-duration: var(--bm-auto-dur) !important; animation-iteration-count: infinite !important; animation-timing-function: linear !important; }
@media (hover:hover) and (pointer:fine){
  .bm-auto-track:hover, .bm-marquee-track:hover{ animation-play-state: paused !important; }
}
@media (prefers-reduced-motion: reduce){
  .bm-auto-track, .bm-marquee-track{ animation: none !important; }
}
.bm-root, .bm-container{ max-width:100vw; overflow-x:hidden; }
/* === /V22 === */

.bm-auto-gallery.js-stepper .bm-auto-track{animation:none!important}

/* Stepper transform */
.bm-auto-gallery.js-stepper .bm-auto-track{
  transform: translate3d(var(--bm-x, 0px), 0, 0);
  transition: transform .45s ease;
}


/* === Nav: centered bottom (V22r-stable) === */
.bm-auto-gallery{ position: relative; }
.bm-auto-gallery .bm-nav{
  position:absolute; bottom:12px; top:auto;
  left:50%; transform:translateX(-50%);
  width:40px; height:40px; border-radius:9999px;
  display:flex; align-items:center; justify-content:center;
  background:#000; color:#fff; border:none; cursor:pointer;
  z-index:8; box-shadow:0 2px 8px rgba(0,0,0,.25); opacity:1;
}
.bm-auto-gallery .bm-nav.prev{ margin-left:-26px; }
.bm-auto-gallery .bm-nav.next{ margin-left: 26px; }
.bm-auto-gallery .bm-nav:focus{ outline:2px solid #fff; outline-offset:2px; }

