.bm-home *,.bm-home *::before,.bm-home *::after{
box-sizing: border-box; margin: 0; padding: 0;}
:root{
--cream:     #F2F5F8;

  --cream2:    #E4EAF0;

  --white:     #FFFFFF;

  --border:    #CBD5DF;

  --coral:     #1354A0;

  --coral-dk:  #0B3670;

  --coral-lt:  #E1EBFA;

  --coral-20:  rgba(19,84,160,.1);

  --gold:      #0EA5C9;

  --gold-lt:   #E0F6FD;

  --teal:      #0C6A8F;

  --teal-lt:   #DCEFF8;

  --dk:        #09121E;

  --md:        #354F65;

  --lt:        #6E8FA6;

  --ff:        'Lexend', sans-serif;

  --serif:     'Lora', serif;}
html{
scroll-behavior: smooth;}
.bm-home{
font-family: var(--ff); background: var(--cream); color: var(--dk); line-height: 1.6;}
.bm-home a{
text-decoration: none; color: inherit;}
.bm-home img{
max-width: 100%; display: block;}
.bm-home .wrap{
max-width: 1200px; margin: 0 auto; padding: 0 48px;}
.bm-home .section{
padding: 88px 0;}
.bm-home .section-sm{
padding: 72px 0;}
.bm-home .eyebrow{
font-size: 10.5px; font-weight: 500; letter-spacing: .18em;

  text-transform: uppercase; color: var(--coral);

  display: flex; align-items: center; gap: 8px;

  margin-bottom: 12px;}
.bm-home .eyebrow::before{
content: ''; width: 22px; height: 2px; background: var(--coral); display: block; flex-shrink: 0;}
.bm-home .section-title{
font-family: var(--serif); font-size: clamp(22px, 2.8vw, 36px);

  font-weight: 600; color: var(--dk); line-height: 1.2;}
.bm-home .section-head{
margin-bottom: 48px;}
.bm-home .btn-primary{
display: inline-flex; align-items: center; gap: 8px;

  background: var(--coral); color: #fff;

  font-family: var(--ff); font-size: 13px; font-weight: 500;

  padding: 14px 30px; border: none; border-radius: 4px;

  cursor: pointer; transition: background .2s, transform .15s;}
.bm-home .btn-primary:hover{
background: var(--coral-dk); transform: translateY(-1px);}
.bm-home .btn-primary svg{
width: 14px; height: 14px; flex-shrink: 0;}
.bm-home .btn-outline{
display: inline-flex; align-items: center; gap: 8px;

  background: transparent; color: var(--dk);

  font-family: var(--ff); font-size: 13px; font-weight: 300;

  padding: 13px 26px; border: 1px solid var(--border); border-radius: 4px;

  cursor: pointer; transition: border-color .2s;}
.bm-home .btn-outline:hover{
border-color: var(--lt);}
.bm-home .badge{
display: inline-block; font-size: 10px; font-weight: 500;

  padding: 4px 10px; border-radius: 3px; letter-spacing: .05em;}
.bm-home .badge-coral{
background: var(--coral-lt); color: var(--coral-dk);}
.bm-home .badge-teal{
background: var(--teal-lt);  color: var(--teal);}
.bm-home .badge-gold{
background: var(--gold-lt);  color: #7A5820;}
.bm-home .img-ph{
background: #E8EEF4; border: 1px solid #C4D0DA;

  border-radius: 6px; display: flex; flex-direction: column;

  align-items: center; justify-content: center; gap: 10px;}
.bm-home .img-ph svg{
width: 36px; height: 36px; stroke: #B0C2D0;}
.bm-home .img-ph span{
font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #B0C2D0; font-weight: 300;}
.bm-home nav.site-nav{
position: sticky; top: 0; z-index: 100;

  background: var(--white); border-bottom: 1px solid var(--border);}
.bm-home .nav-inner{
max-width: 1200px; margin: 0 auto; padding: 0 48px;

  display: flex; align-items: center; justify-content: space-between;

  height: 60px;}
.bm-home .nav-logo{
font-family: var(--serif); font-size: 20px; font-weight: 600;

  color: var(--dk);}
.bm-home .nav-logo span{
color: var(--coral);}
.bm-home .nav-links{
display: flex; gap: 32px;}
.bm-home .nav-links a{
font-size: 13px; font-weight: 300; color: var(--md);

  transition: color .15s;}
.bm-home .nav-links a:hover{
color: var(--coral);}
.bm-home .nav-cta{
background: var(--coral); color: #fff;

  font-size: 12px; font-weight: 500;

  padding: 9px 20px; border-radius: 4px;

  transition: background .2s;}
.bm-home .nav-cta:hover{
background: var(--coral-dk); color: #fff;}
.bm-home #banner{
background: var(--white);

  border-bottom: 1px solid var(--border);}
.bm-home .banner-inner{
max-width: 1200px; margin: 0 auto; padding: 0 48px;

  display: grid; grid-template-columns: 1fr 1fr;

  min-height: 560px; align-items: center; gap: 60px;}
.bm-home .banner-left{
padding: 80px 0;}
.bm-home .banner-pill{
display: inline-flex; align-items: center; gap: 8px;

  background: #E8EEF5; border: 1px solid #C4D0DA;

  border-radius: 100px; padding: 6px 16px 6px 10px;

  margin-bottom: 24px;}
.bm-home .banner-pill-dot{
width: 7px; height: 7px; border-radius: 50%; background: var(--coral);}
.bm-home .banner-pill-txt{
font-size: 11px; font-weight: 400; color: var(--md); letter-spacing: .04em;}
.bm-home h1.banner-h1{
font-family: var(--serif);

  font-size: clamp(36px, 4.8vw, 60px);

  font-weight: 600; line-height: 1.08;

  color: var(--dk); margin-bottom: 10px;}
.bm-home h1.banner-h1 em{
font-style: italic; color: var(--coral);}
.bm-home .banner-sub{
font-family: var(--serif); font-style: italic;

  font-size: 17px; color: var(--lt); margin-bottom: 22px;}
.bm-home .banner-desc{
font-size: 14px; font-weight: 300; line-height: 1.85;

  color: var(--md); max-width: 460px; margin-bottom: 36px;}
.bm-home .banner-desc b{
font-weight: 500; color: var(--dk);}
.bm-home .banner-ctas{
display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 44px;}
.bm-home .banner-stats{
display: flex; gap: 0; border-top: 1px solid var(--border); padding-top: 28px;}
.bm-home .banner-stat{
flex: 1;}
.bm-home .banner-stat + .banner-stat{
border-left: 1px solid var(--border); padding-left: 24px;}
.bm-home .banner-snum{
font-family: var(--serif); font-size: 26px; font-weight: 600; color: var(--dk); line-height: 1; margin-bottom: 4px;}
.bm-home .banner-snum sup{
font-size: 12px; font-weight: 300; color: var(--lt);}
.bm-home .banner-slbl{
font-size: 11px; font-weight: 300; color: var(--lt); letter-spacing: .04em;}
.bm-home .banner-right{
display: flex; flex-direction: column;

  align-items: center; justify-content: center;

  padding: 60px 0; gap: 16px;}
.bm-home .banner-img{
width: 100%; max-width: 420px; aspect-ratio: 4/5; position: relative;}
.bm-home .banner-img .img-ph{
width: 100%; height: 100%;}
.bm-home .banner-new-badge{
position: absolute; top: 16px; left: 16px;

  background: var(--coral); color: #fff;

  font-size: 10px; font-weight: 500; letter-spacing: .08em;

  padding: 5px 12px; border-radius: 3px; z-index: 2;}
.bm-home .banner-chips{
display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; width: 100%;}
.bm-home .banner-chip{
background: var(--cream); border: 1px solid var(--border);

  border-radius: 100px; padding: 6px 14px;

  font-size: 11px; font-weight: 300; color: var(--md);

  transition: border-color .15s, background .15s;}
.bm-home .banner-chip:hover{
border-color: var(--coral); background: var(--coral-lt); color: var(--coral-dk);}
.bm-home #danh-muc{
background: var(--cream);}
.bm-home .cat-grid{
display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 18px;}
.bm-home .cat-card{
background: var(--white); border: 1px solid var(--border);

  border-radius: 10px; overflow: hidden;

  display: flex; flex-direction: column;

  transition: border-color .2s, transform .2s;}
.bm-home .cat-card:hover{
border-color: var(--coral); transform: translateY(-3px);}
.bm-home .cat-img{
aspect-ratio: 4/3;}
.bm-home .cat-img .img-ph{
border-radius: 0; border: none; height: 100%;}
.bm-home .cat-body{
padding: 18px 20px 22px; flex: 1; display: flex; flex-direction: column; gap: 8px;}
.bm-home .cat-name{
font-size: 14px; font-weight: 500; color: var(--dk);}
.bm-home .cat-desc{
font-size: 12px; font-weight: 300; color: var(--md); line-height: 1.6; flex: 1;}
.bm-home .cat-link{
display: inline-flex; align-items: center; gap: 5px;

  font-size: 12px; font-weight: 500; color: var(--coral);

  margin-top: 4px; transition: gap .15s;}
.bm-home .cat-link:hover{
gap: 8px;}
.bm-home .cat-link svg{
width: 12px; height: 12px; stroke: var(--coral);}
.bm-home #san-pham{
background: var(--white);}
.bm-home .sp-list{
display: flex; flex-direction: column; gap: 2px;}
.bm-home .sp-row{
display: grid;

  grid-template-columns: 36px 72px 1fr auto auto;

  align-items: center; gap: 20px;

  background: var(--white);

  border: 1px solid var(--border);

  border-radius: 8px; padding: 14px 20px;

  text-decoration: none; color: inherit;

  transition: border-color .15s, box-shadow .15s;}
.bm-home .sp-row:hover{
border-color: var(--coral); box-shadow: 0 2px 12px rgba(19,84,160,.07);}
.bm-home .sp-rank{
font-family: var(--serif); font-size: 20px; font-weight: 700;

  color: var(--coral-lt); line-height: 1; user-select: none;}
.bm-home .sp-row:hover .sp-rank{
color: var(--coral);}
.bm-home .sp-img-box{
flex-shrink: 0;}
.bm-home .sp-ph{
width: 72px; height: 48px; border-radius: 6px;

  background: var(--cream); border: 1px solid var(--border);

  display: flex; align-items: center; justify-content: center;}
.bm-home .sp-ph svg{
width: 48px; height: 32px; stroke: var(--lt);}
.bm-home .sp-info{
min-width: 0;}
.bm-home .sp-name{
font-size: 14px; font-weight: 500; color: var(--dk);

  margin-bottom: 4px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;}
.bm-home .sp-hot{
font-size: 9px; font-weight: 600; letter-spacing: .08em;

  text-transform: uppercase; background: var(--coral); color: #fff;

  padding: 2px 8px; border-radius: 3px; flex-shrink: 0;}
.bm-home .sp-spec{
font-size: 12px; font-weight: 300; color: var(--lt); line-height: 1.5;}
.bm-home .sp-badges{
display: flex; gap: 6px; flex-shrink: 0;}
.bm-home .sp-cta{
display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;

  font-size: 12px; font-weight: 500; color: var(--coral);

  white-space: nowrap;}
.bm-home .sp-cta svg{
width: 12px; height: 12px; stroke: var(--coral);}
.bm-home .section-cta-row{
display: flex; justify-content: center; margin-top: 40px;}
.bm-home #ly-do{
background: #0C1E30;}
.bm-home #ly-do .section-title{
color: #EEF4FA;}
.bm-home #ly-do .eyebrow{
color: #60BDDF;}
.bm-home #ly-do .eyebrow::before{
background: #60BDDF;}
.bm-home .reasons-grid{
display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 2px;

  background: rgba(255,255,255,.05);

  border-radius: 10px; overflow: hidden;}
.bm-home .reason-item{
background: #0C1E30;

  padding: 40px 40px;

  display: flex; gap: 24px; align-items: flex-start;}
.bm-home .reason-icon{
width: 48px; height: 48px; border-radius: 10px;

  background: rgba(19,84,160,.18);

  display: flex; align-items: center; justify-content: center;

  flex-shrink: 0;}
.bm-home .reason-icon svg{
width: 22px; height: 22px; stroke: #60BDDF;}
.bm-home .reason-num{
font-family: var(--serif); font-size: 11px; font-weight: 400;

  color: rgba(96,189,223,.55); letter-spacing: .12em; margin-bottom: 6px;}
.bm-home .reason-title{
font-size: 15px; font-weight: 500; color: #EEF4FA; margin-bottom: 10px;}
.bm-home .reason-desc{
font-size: 13px; font-weight: 300; line-height: 1.8; color: rgba(200,220,235,.55);}
.bm-home #ung-dung{
background: var(--cream);}
.bm-home .app-grid{
display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 20px;}
.bm-home .app-card{
background: var(--white); border: 1px solid var(--border);

  border-radius: 10px; overflow: hidden;

  transition: border-color .2s;}
.bm-home .app-card:hover{
border-color: var(--coral);}
.bm-home .app-img{
aspect-ratio: 16/10;}
.bm-home .app-img .img-ph{
border-radius: 0; border: none; height: 100%;}
.bm-home .app-body{
padding: 20px 22px 24px;}
.bm-home .app-kw{
font-size: 10px; font-weight: 500; letter-spacing: .1em;

  text-transform: uppercase; color: var(--coral); margin-bottom: 8px;}
.bm-home .app-title{
font-size: 15px; font-weight: 500; color: var(--dk); margin-bottom: 8px;}
.bm-home .app-desc{
font-size: 12.5px; font-weight: 300; line-height: 1.7; color: var(--md);}
.bm-home .app-tags{
display: flex; gap: 6px; flex-wrap: wrap; margin-top: 14px;}
.bm-home #video{
background: var(--white);}
.bm-home .video-layout{
display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center;}
.bm-home .video-frame{
aspect-ratio: 16/9; background: #0C1E30;

  border-radius: 10px; overflow: hidden; position: relative;

  display: flex; align-items: center; justify-content: center;}
.bm-home .video-play{
width: 64px; height: 64px; border-radius: 50%;

  background: rgba(216,90,48,.9);

  display: flex; align-items: center; justify-content: center;

  cursor: pointer; transition: transform .2s, background .2s;}
.bm-home .video-play:hover{
transform: scale(1.08); background: var(--coral);}
.bm-home .video-play svg{
width: 24px; height: 24px; fill: #fff; margin-left: 3px;}
.bm-home .video-overlay-txt{
position: absolute; bottom: 20px; left: 20px;

  font-size: 11px; font-weight: 300; color: rgba(180,210,230,.5);

  letter-spacing: .04em;}
.bm-home .video-content .eyebrow{
margin-bottom: 14px;}
.bm-home .video-title{
font-family: var(--serif); font-size: clamp(20px,2.5vw,30px); font-weight: 600; color: var(--dk); margin-bottom: 16px;}
.bm-home .video-body{
font-size: 13.5px; font-weight: 300; line-height: 1.85; color: var(--md); margin-bottom: 28px;}
.bm-home .video-body b{
font-weight: 500; color: var(--dk);}
.bm-home .video-list{
list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 32px;}
.bm-home .video-list li{
display: flex; gap: 10px; align-items: flex-start;

  font-size: 13px; font-weight: 300; color: var(--md); line-height: 1.55;}
.bm-home .video-list li::before{
content: '';

  width: 18px; height: 18px; border-radius: 50%;

  background: var(--teal-lt); flex-shrink: 0;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%231D6A62' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");

  background-repeat: no-repeat; background-position: center; margin-top: 1px;}
.bm-home #blog{
background: var(--cream);}
.bm-home .blog-slider-wrap{
position: relative;}
.bm-home .blog-slider-nav{
display: flex; gap: 8px; position: absolute; top: -52px; right: 0;}
.bm-home .blog-nav-btn{
width: 38px; height: 38px; border-radius: 50%;

  background: var(--white); border: 1px solid var(--border);

  display: flex; align-items: center; justify-content: center;

  cursor: pointer; transition: background .15s, border-color .15s;

  flex-shrink: 0;}
.bm-home .blog-nav-btn:hover{
background: var(--coral); border-color: var(--coral);}
.bm-home .blog-nav-btn:hover svg{
stroke: #fff;}
.bm-home .blog-nav-btn svg{
width: 16px; height: 16px; stroke: var(--md);}
.bm-home .blog-nav-btn:disabled{
opacity: .35; cursor: default;}
.bm-home .blog-nav-btn:disabled:hover{
background: var(--white); border-color: var(--border);}
.bm-home .blog-nav-btn:disabled:hover svg{
stroke: var(--md);}
.bm-home .blog-grid{
display: flex; gap: 20px;

  overflow-x: auto; scroll-behavior: smooth;

  scroll-snap-type: x mandatory;

  -webkit-overflow-scrolling: touch;

  padding-bottom: 12px;

  

  scrollbar-width: none;}
.bm-home .blog-grid::-webkit-scrollbar{
display: none;}
.bm-home .blog-card{
background: var(--white); border: 1px solid var(--border);

  border-radius: 10px; overflow: hidden;

  transition: border-color .2s, transform .2s;

  flex: 0 0 calc(33.333% - 14px);

  scroll-snap-align: start;

  min-width: 0;}
.bm-home .blog-card:hover{
border-color: var(--coral); transform: translateY(-2px);}
.bm-home .blog-img{
aspect-ratio: 16/9; position: relative;}
.bm-home .blog-img .img-ph{
border-radius: 0; border: none; height: 100%;}
.bm-home .blog-body{
padding: 18px 20px 22px;}
.bm-home .blog-cat{
font-size: 10px; font-weight: 500; letter-spacing: .1em;

  text-transform: uppercase; color: var(--coral); margin-bottom: 8px;}
.bm-home .blog-title{
font-size: 15px; font-weight: 500; color: var(--dk); line-height: 1.45; margin-bottom: 8px;}
.bm-home .blog-excerpt{
font-size: 12px; font-weight: 300; color: var(--md); line-height: 1.7;}
.bm-home .blog-meta{
display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 11px; font-weight: 300; color: var(--lt);}
.bm-home .blog-meta::before{
content: ''; width: 24px; height: 1px; background: var(--border);}
.bm-home .blog-dots{
display: flex; justify-content: center; gap: 6px; margin-top: 20px;}
.bm-home .blog-dot{
width: 7px; height: 7px; border-radius: 50%;

  background: var(--border); transition: background .2s, transform .2s;

  cursor: pointer;}
.bm-home .blog-dot.active{
background: var(--coral); transform: scale(1.3);}
@media(max-width:768px){
.bm-home .blog-card{
flex: 0 0 calc(80% - 10px);}
.bm-home .blog-slider-nav{
top: -48px;}
}
@media(max-width:480px){
.bm-home .blog-card{
flex: 0 0 calc(88% - 10px);}
}
.bm-home #bao-gia{
background: var(--coral);}
.bm-home .cta-inner{
max-width: 1200px; margin: 0 auto; padding: 80px 48px;

  display: grid; grid-template-columns: 1fr 1fr;

  gap: 60px; align-items: center;}
.bm-home .cta-left{
}
.bm-home .cta-eyebrow{
font-size: 11px; font-weight: 500; letter-spacing: .16em;

  text-transform: uppercase; color: rgba(255,255,255,.6);

  display: flex; align-items: center; gap: 8px; margin-bottom: 14px;}
.bm-home .cta-eyebrow::before{
content: ''; width: 22px; height: 2px; background: rgba(255,255,255,.35); display: block;}
.bm-home h2.cta-title{
font-family: var(--serif); font-size: clamp(26px,3.2vw,42px);

  font-weight: 600; color: #fff; line-height: 1.12; margin-bottom: 14px;}
.bm-home .cta-sub{
font-size: 14px; font-weight: 300; color: rgba(255,255,255,.75); line-height: 1.75;}
.bm-home .cta-form{
background: #fff; border-radius: 12px;

  padding: 36px 40px; box-shadow: 0 12px 40px rgba(0,0,0,.18);}
.bm-home .cta-form-title{
font-size: 16px; font-weight: 500; color: var(--dk); margin-bottom: 22px;}
.bm-home .form-row{
display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px;}
.bm-home .form-row.full{
grid-template-columns: 1fr;}
.bm-home .form-input,.bm-home .form-select{
width: 100%; padding: 13px 16px;

  background: var(--cream); border: 1px solid var(--border);

  border-radius: 6px; font-family: var(--ff); font-size: 14px;

  color: var(--dk); outline: none;

  transition: border-color .2s, background .2s;}
.bm-home .form-input::placeholder{
color: var(--lt);}
.bm-home .form-select{
color: var(--lt); appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236E8FA6' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px;}
.bm-home .form-select.selected{
color: var(--dk);}
.bm-home .form-select option{
color: var(--dk); background: var(--white);}
.bm-home .form-select option[value=""]{
color: var(--lt);}
.bm-home .form-input:focus,.bm-home .form-select:focus{
border-color: var(--coral);

  background: #fff;}
.bm-home .form-submit{
width: 100%; padding: 16px;

  background: var(--coral); color: #fff;

  font-family: var(--ff); font-size: 14px; font-weight: 600;

  border: none; border-radius: 6px; cursor: pointer;

  margin-top: 8px; letter-spacing: .04em; text-transform: uppercase;

  transition: background .2s, transform .15s;}
.bm-home .form-submit:hover{
background: var(--coral-dk); transform: translateY(-1px);}
.bm-home .form-note{
font-size: 11px; font-weight: 300; color: var(--lt); text-align: center; margin-top: 12px;}
.bm-home footer{
background: #09121E; border-top: 1px solid rgba(255,255,255,.06);

  padding: 48px 0 24px;}
.bm-home .footer-inner{
max-width: 1200px; margin: 0 auto; padding: 0 48px;

  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 48px;

  margin-bottom: 40px;}
.bm-home .footer-logo{
font-family: var(--serif); font-size: 22px; font-weight: 600; color: #EEF4FA; margin-bottom: 12px;}
.bm-home .footer-logo span{
color: var(--coral);}
.bm-home .footer-about{
font-size: 12.5px; font-weight: 300; color: rgba(190,215,235,.45); line-height: 1.8;}
.bm-home .footer-col-title{
font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: rgba(190,215,235,.32); margin-bottom: 16px;}
.bm-home .footer-links{
list-style: none; display: flex; flex-direction: column; gap: 10px;}
.bm-home .footer-links li a{
font-size: 13px; font-weight: 300; color: rgba(190,215,235,.55); transition: color .15s;}
.bm-home .footer-links li a:hover{
color: var(--coral);}
.bm-home .footer-bottom{
max-width: 1200px; margin: 0 auto; padding: 20px 48px 0;

  border-top: 1px solid rgba(255,255,255,.06);

  display: flex; align-items: center; justify-content: space-between;

  font-size: 11.5px; font-weight: 300; color: rgba(190,215,235,.28);}
.bm-home #kich-thuoc{
background: var(--cream);}
.bm-home .size-tabs{
display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 36px;}
.bm-home .size-tab{
background: var(--white); border: 1px solid var(--border); border-radius: 6px;

  padding: 10px 20px; font-size: 13px; font-weight: 500; color: var(--md);

  cursor: pointer; transition: all .15s;}
.bm-home .size-tab.on,.bm-home .size-tab:hover{
border-color: var(--coral); background: var(--coral-lt); color: var(--coral-dk);}
.bm-home .size-table-wrap{
overflow-x: auto;}
.bm-home .size-table{
width: 100%; border-collapse: collapse;

  font-family: var(--ff); font-size: 13px;}
.bm-home .size-table th{
text-align: left; padding: 12px 18px;

  background: #0C1E30; color: rgba(200,220,235,.85);

  font-weight: 500; font-size: 11px; letter-spacing: .08em; text-transform: uppercase;}
.bm-home .size-table th:first-child{
border-radius: 8px 0 0 0;}
.bm-home .size-table th:last-child{
border-radius: 0 8px 0 0;}
.bm-home .size-table td{
padding: 13px 18px; border-bottom: 1px solid var(--border);

  color: var(--md); font-weight: 300; background: var(--white);}
.bm-home .size-table tr:last-child td{
border-bottom: none;}
.bm-home .size-table tr:hover td{
background: var(--cream);}
.bm-home .size-table td:first-child{
font-weight: 500; color: var(--dk);}
.bm-home .size-table .tag-coral{
color: var(--coral-dk); background: var(--coral-lt); padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 500; white-space: nowrap;}
.bm-home .size-table .tag-teal{
color: var(--teal); background: var(--teal-lt); padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 500; white-space: nowrap;}
.bm-home .size-note{
font-size: 12px; font-weight: 300; color: var(--lt); margin-top: 14px; line-height: 1.7;}
.bm-home #faq{
background: var(--white);}
.bm-home .faq-layout{
display: grid; grid-template-columns: 1fr 1.4fr; gap: 72px; align-items: start;}
.bm-home .faq-intro-title{
font-family: var(--serif); font-size: clamp(20px,2.5vw,30px);

  font-weight: 600; color: var(--dk); margin-bottom: 16px; line-height: 1.2;}
.bm-home .faq-intro-body{
font-size: 13.5px; font-weight: 300; color: var(--md); line-height: 1.85; margin-bottom: 28px;}
.bm-home .faq-intro-body b{
font-weight: 500; color: var(--dk);}
.bm-home .faq-cta-note{
font-size: 12px; font-weight: 300; color: var(--lt); margin-top: 14px; line-height: 1.6;}
.bm-home .faq-list{
display: flex; flex-direction: column; gap: 0;}
.bm-home .faq-item{
border-bottom: 1px solid var(--border);}
.bm-home .faq-item:first-child{
border-top: 1px solid var(--border);}
.bm-home .faq-q{
display: flex; align-items: center; justify-content: space-between;

  padding: 18px 0; cursor: pointer; gap: 16px;

  font-size: 14px; font-weight: 500; color: var(--dk);

  user-select: none;}
.bm-home .faq-q svg{
width: 18px; height: 18px; stroke: var(--lt); flex-shrink: 0; transition: transform .2s;}
.bm-home .faq-item.open .faq-q svg{
transform: rotate(45deg); stroke: var(--coral);}
.bm-home .faq-item.open .faq-q{
color: var(--coral);}
.bm-home .faq-a{
display: none; font-size: 13px; font-weight: 300;

  color: var(--md); line-height: 1.8; padding-bottom: 18px;}
.bm-home .faq-item.open .faq-a{
display: block;}
.bm-home .faq-a b{
font-weight: 500; color: var(--dk);}
.bm-home #bang-gia{
background: #0C1E30;}
.bm-home #bang-gia .eyebrow{
color: #60BDDF;}
.bm-home #bang-gia .eyebrow::before{
background: #60BDDF;}
.bm-home #bang-gia .section-title{
color: #EEF4FA;}
.bm-home .price-intro{
font-size: 14px; font-weight: 300; color: rgba(200,220,235,.6);

  line-height: 1.8; max-width: 620px; margin-bottom: 40px;}
.bm-home .price-intro b{
color: rgba(200,220,235,.9); font-weight: 500;}
.bm-home .price-grid{
display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 2px;

  background: rgba(255,255,255,.06);

  border-radius: 12px; overflow: hidden;

  margin-bottom: 28px;}
.bm-home .price-card{
background: #0C1E30;

  padding: 28px 24px 32px;

  position: relative;

  transition: background .2s;}
.bm-home .price-card:hover{
background: #102840;}
.bm-home .price-card.featured{
background: #0D3F75;}
.bm-home .price-card.featured:hover{
background: #0E4A8A;}
.bm-home .price-popular{
position: absolute; top: -1px; left: 50%; transform: translateX(-50%);

  background: #0EA5C9; color: #fff;

  font-size: 9.5px; font-weight: 600; letter-spacing: .1em;

  text-transform: uppercase; padding: 4px 14px; border-radius: 0 0 6px 6px;

  white-space: nowrap;}
.bm-home .price-size{
font-size: 11px; font-weight: 500; letter-spacing: .1em;

  text-transform: uppercase; color: rgba(200,220,235,.4);

  margin-bottom: 8px;}
.bm-home .price-name{
font-size: 14px; font-weight: 500; color: #EEF4FA;

  margin-bottom: 4px; line-height: 1.35;}
.bm-home .price-canh{
font-size: 11.5px; font-weight: 300; color: rgba(200,220,235,.45);

  margin-bottom: 20px;}
.bm-home .price-amount{
font-family: var(--serif); font-size: 22px; font-weight: 600;

  color: #60BDDF; line-height: 1; margin-bottom: 4px;}
.bm-home .price-amount.featured-price{
color: #fff;}
.bm-home .price-unit{
font-size: 11px; font-weight: 300; color: rgba(200,220,235,.4);

  margin-bottom: 20px;}
.bm-home .price-specs{
list-style: none; display: flex; flex-direction: column; gap: 7px;

  margin-bottom: 22px;}
.bm-home .price-specs li{
font-size: 12px; font-weight: 300; color: rgba(200,220,235,.5);

  display: flex; gap: 7px; align-items: flex-start;}
.bm-home .price-specs li::before{
content: '';

  width: 14px; height: 14px; border-radius: 50%; flex-shrink: 0;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2360BDDF' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");

  background-repeat: no-repeat; background-position: center; margin-top: 1px;}
.bm-home .price-cta-btn{
display: block; width: 100%; text-align: center;

  padding: 10px; border-radius: 4px;

  font-family: var(--ff); font-size: 12.5px; font-weight: 500;

  text-decoration: none; transition: all .15s;

  background: rgba(255,255,255,.08); color: rgba(200,220,235,.8);

  border: 1px solid rgba(255,255,255,.1);}
.bm-home .price-cta-btn:hover{
background: rgba(255,255,255,.14); color: #EEF4FA;}
.bm-home .price-cta-btn.primary{
background: var(--coral); color: #fff; border-color: transparent;}
.bm-home .price-cta-btn.primary:hover{
background: var(--coral-dk);}
.bm-home .price-note{
font-size: 12px; font-weight: 300; color: rgba(200,220,235,.35);

  line-height: 1.7; text-align: center;}
.bm-home .price-note a{
color: rgba(96,189,223,.7); text-decoration: none;}
.bm-home .price-note a:hover{
color: #60BDDF;}
.bm-home #thuong-hieu{
background: var(--cream);}
.bm-home .brand-tier{
margin-bottom: 56px;}
.bm-home .brand-tier:last-child{
margin-bottom: 0;}
.bm-home .brand-tier-header{
display: flex; align-items: center; gap: 14px; flex-wrap: wrap;

  margin-bottom: 22px; padding-bottom: 16px;

  border-bottom: 2px solid var(--border);}
.bm-home .brand-tier-icon{
width: 40px; height: 40px; border-radius: 8px; flex-shrink: 0;

  display: flex; align-items: center; justify-content: center;}
.bm-home .brand-tier-icon svg{
width: 20px; height: 20px; fill: none; stroke-width: 1.8;}
.bm-home .tier-cao-cap .brand-tier-icon{
background: #0C1E30;}
.bm-home .tier-cao-cap .brand-tier-icon svg{
stroke: #60BDDF;}
.bm-home .tier-trung   .brand-tier-icon{
background: var(--coral-lt);}
.bm-home .tier-trung   .brand-tier-icon svg{
stroke: var(--coral);}
.bm-home .tier-vn      .brand-tier-icon{
background: var(--gold-lt);}
.bm-home .tier-vn      .brand-tier-icon svg{
stroke: var(--gold);}
.bm-home .brand-tier-label{
font-size: 10px; font-weight: 500; letter-spacing: .12em;

  text-transform: uppercase; margin-bottom: 2px;}
.bm-home .tier-cao-cap .brand-tier-label{
color: #60BDDF;}
.bm-home .tier-trung   .brand-tier-label{
color: var(--coral);}
.bm-home .tier-vn      .brand-tier-label{
color: var(--gold);}
.bm-home .brand-tier-title{
font-family: var(--serif); font-size: 19px; font-weight: 600; color: var(--dk);}
.bm-home .brand-tier-badges{
display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto;}
.bm-home .tier-badge{
font-size: 11px; font-weight: 400;

  padding: 4px 12px; border-radius: 100px;

  border: 1px solid transparent;}
.bm-home .tier-cao-cap .tier-badge{
background: #0C1E30; color: #60BDDF;}
.bm-home .tier-trung   .tier-badge{
background: var(--coral-lt); color: var(--coral-dk); border-color: var(--border);}
.bm-home .tier-vn      .tier-badge{
background: var(--gold-lt); color: #7A5820; border-color: var(--border);}
.bm-home .brand-grid{
display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.bm-home .brand-grid-4{
display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;}
.bm-home .brand-card{
background: var(--white); border: 1px solid var(--border);

  border-radius: 10px; overflow: hidden;

  transition: border-color .2s, transform .2s;

  display: flex; flex-direction: column;}
.bm-home .brand-card:hover{
border-color: var(--coral); transform: translateY(-3px);}
.bm-home .brand-header{
padding: 20px 20px 0;

  display: flex; align-items: center; gap: 12px;}
.bm-home .brand-logo-box{
width: 42px; height: 42px; border-radius: 7px;

  background: var(--coral-lt);

  display: flex; align-items: center; justify-content: center;

  font-family: var(--serif); font-size: 16px; font-weight: 600; color: var(--coral);

  flex-shrink: 0;}
.bm-home .brand-origin{
font-size: 9.5px; font-weight: 500; letter-spacing: .1em;

  text-transform: uppercase; color: var(--lt); margin-bottom: 2px;}
.bm-home .brand-name{
font-size: 14px; font-weight: 600; color: var(--dk);

  font-family: var(--serif);}
.bm-home .brand-body{
padding: 14px 20px 20px; flex: 1; display: flex; flex-direction: column;}
.bm-home .brand-desc{
font-size: 12.5px; font-weight: 300; color: var(--md);

  line-height: 1.75; margin-bottom: 12px; flex: 1;}
.bm-home .brand-desc b{
font-weight: 500; color: var(--dk);}
.bm-home .brand-tags{
display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 12px;}
.bm-home .brand-tag{
font-size: 10.5px; font-weight: 400;

  padding: 3px 9px; border-radius: 3px;

  background: var(--cream); border: 1px solid var(--border); color: var(--md);}
.bm-home .brand-models{
background: var(--cream); border-radius: 6px;

  padding: 10px 12px; margin-bottom: 14px;}
.bm-home .brand-models-title{
font-size: 9.5px; font-weight: 500; letter-spacing: .1em;

  text-transform: uppercase; color: var(--lt); margin-bottom: 8px;}
.bm-home .brand-model-list{
list-style: none; display: flex; flex-direction: column; gap: 5px;}
.bm-home .brand-model-list li{
font-size: 12px; font-weight: 300; color: var(--md);

  display: flex; align-items: flex-start; gap: 7px; line-height: 1.5;}
.bm-home .brand-model-list li::before{
content: ''; width: 5px; height: 5px; border-radius: 50%;

  background: var(--coral); flex-shrink: 0; margin-top: 5px;}
.bm-home .brand-model-list li b{
font-weight: 500; color: var(--dk);}
.bm-home .brand-link{
display: inline-flex; align-items: center; gap: 6px;

  font-size: 12.5px; font-weight: 500; color: var(--coral);

  text-decoration: none; transition: gap .15s; margin-top: auto;}
.bm-home .brand-link:hover{
gap: 9px;}
.bm-home .brand-link svg{
width: 12px; height: 12px; stroke: var(--coral);}
.bm-home .brand-tier{
margin-bottom: 48px;}
.bm-home .brand-tier:last-child{
margin-bottom: 0;}
.bm-home .brand-tier-label{
display: flex; align-items: center; gap: 10px; flex-wrap: wrap;

  font-size: 11.5px; font-weight: 500; letter-spacing: .08em;

  text-transform: uppercase; color: var(--md);

  margin-bottom: 20px; padding-bottom: 14px;

  border-bottom: 1px solid var(--border);}
.bm-home .brand-tier-icon{
font-size: 15px;}
.bm-home .brand-tier-sub{
font-size: 11px; font-weight: 300; color: var(--lt);

  text-transform: none; letter-spacing: 0;}
.bm-home .brand-vn-grid{
display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px;}
.bm-home .brand-vn-card{
background: var(--white); border: 1px solid var(--border);

  border-radius: 8px; padding: 18px 16px;

  transition: border-color .15s;}
.bm-home .brand-vn-card:hover{
border-color: var(--coral);}
.bm-home .brand-vn-name{
font-size: 13px; font-weight: 500; color: var(--dk); margin-bottom: 6px;}
.bm-home .brand-vn-desc{
font-size: 11.5px; font-weight: 300; color: var(--md); line-height: 1.6; margin-bottom: 10px;}
@media (max-width: 1024px){
.bm-home .banner-inner{
gap: 40px;}
.bm-home .cat-grid{
grid-template-columns: repeat(3, 1fr);}
.bm-home .sp-row{
grid-template-columns: 36px 60px 1fr auto; gap: 14px;}
.bm-home .sp-badges{
display: none;}
.bm-home .video-layout{
gap: 40px;}
.bm-home .cta-inner{
gap: 40px;}
.bm-home .footer-inner{
grid-template-columns: 1fr 1fr; gap: 32px;}
.bm-home .faq-layout{
gap: 48px;}
.bm-home .price-grid{
grid-template-columns: repeat(2, 1fr);}
.bm-home .brand-grid,.bm-home .brand-grid-3{
grid-template-columns: 1fr 1fr;}
.bm-home .brand-grid-4{
grid-template-columns: repeat(2, 1fr);}
.bm-home .brand-vn-grid{
grid-template-columns: repeat(3, 1fr);}
}
@media (max-width: 768px){
.bm-home .wrap{
padding: 0 20px;}
.bm-home .section{
padding: 56px 0;}
.bm-home .section-sm{
padding: 44px 0;}
.bm-home .nav-inner{
padding: 0 20px; height: 56px;}
.bm-home .nav-links{
display: none;}
.bm-home .banner-inner{
grid-template-columns: 1fr;

    min-height: unset;

    padding: 0 20px;

    gap: 0;}
.bm-home .banner-left{
padding: 48px 0 40px;}
.bm-home .banner-right{
display: none;}
.bm-home h1.banner-h1{
font-size: clamp(32px, 8vw, 44px);}
.bm-home .banner-sub{
font-size: 15px;}
.bm-home .banner-desc{
font-size: 13px; margin-bottom: 28px;}
.bm-home .banner-ctas{
gap: 10px; margin-bottom: 36px;}
.bm-home .btn-primary,.bm-home .btn-outline{
font-size: 13px; padding: 13px 22px;}
.bm-home .banner-stats{
padding-top: 24px;}
.bm-home .banner-snum{
font-size: 22px;}
.bm-home .banner-stat + .banner-stat{
padding-left: 18px;}
.bm-home .cat-grid{
grid-template-columns: repeat(2, 1fr); gap: 14px;}
.bm-home .sp-row{
grid-template-columns: 28px 52px 1fr; gap: 12px; padding: 12px 16px;}
.bm-home .sp-badges,.bm-home .sp-cta{
display: none;}
.bm-home .sp-name{
font-size: 13px;}
.bm-home .sp-spec{
font-size: 11.5px;}
.bm-home .prod-price{
font-size: 16px;}
.bm-home .reasons-grid{
grid-template-columns: 1fr; gap: 2px;}
.bm-home .reason-item{
padding: 28px 24px; gap: 18px;}
.bm-home .reason-title{
font-size: 14px;}
.bm-home .reason-desc{
font-size: 12.5px;}
.bm-home .app-grid{
grid-template-columns: repeat(2, 1fr); gap: 14px;}
.bm-home .video-layout{
grid-template-columns: 1fr; gap: 32px;}
.bm-home .size-tabs{
gap: 6px;}
.bm-home .size-tab{
font-size: 12px; padding: 8px 14px;}
.bm-home .size-table{
font-size: 12px;}
.bm-home .size-table th,.bm-home .size-table td{
padding: 10px 12px;}
.bm-home .price-grid{
grid-template-columns: repeat(2, 1fr);}
.bm-home .price-card{
padding: 24px 18px 26px;}
.bm-home .price-amount{
font-size: 19px;}
.bm-home .brand-grid{
grid-template-columns: 1fr;}
.bm-home .brand-header{
padding: 22px 22px 0;}
.bm-home .brand-body{
padding: 16px 22px 22px;}
.bm-home .faq-layout{
grid-template-columns: 1fr; gap: 28px;}
.bm-home .faq-intro-title{
font-size: 22px;}
.bm-home .faq-q{
font-size: 13.5px;}
.bm-home .cta-inner{
grid-template-columns: 1fr; padding: 52px 20px; gap: 36px;}
.bm-home h2.cta-title{
font-size: clamp(24px, 6vw, 36px);}
.bm-home .cta-sub{
font-size: 13px;}
.bm-home .cta-form{
padding: 28px 24px;}
.bm-home .form-row{
grid-template-columns: 1fr; gap: 10px;}
.bm-home .form-row{
grid-template-columns: 1fr; gap: 10px;}
.bm-home .form-input,.bm-home .form-select{
font-size: 14px; padding: 13px 14px;}
.bm-home .form-submit{
padding: 14px; font-size: 14px;}
.bm-home .footer-inner{
grid-template-columns: 1fr 1fr; gap: 28px; padding: 44px 20px 36px;}
.bm-home .footer-bottom{
padding: 16px 20px; flex-direction: column; gap: 6px; font-size: 11px;}
}
@media (max-width: 480px){
.bm-home .wrap{
padding: 0 16px;}
.bm-home .section{
padding: 44px 0;}
.bm-home .banner-inner{
padding: 0 16px;}
.bm-home .banner-left{
padding: 40px 0 32px;}
.bm-home h1.banner-h1{
font-size: 34px; line-height: 1.06;}
.bm-home .banner-desc{
display: none;}
.bm-home .banner-ctas{
flex-direction: column; align-items: flex-start;}
.bm-home .btn-primary,.bm-home .btn-outline{
width: 100%; justify-content: center;}
.bm-home .banner-stats{
gap: 0;}
.bm-home .banner-snum{
font-size: 20px;}
.bm-home .cat-grid{
grid-template-columns: 1fr;}
.bm-home .cat-img{
aspect-ratio: 16/9;}
.bm-home .prod-grid{
grid-template-columns: 1fr;}
.bm-home .prod-img{
aspect-ratio: 16/9;}
.bm-home .prod-footer{
flex-direction: row; align-items: center;}
.bm-home .reason-item{
flex-direction: row; padding: 22px 16px; gap: 14px;}
.bm-home .reason-icon{
width: 40px; height: 40px; border-radius: 8px;}
.bm-home .app-grid{
grid-template-columns: 1fr;}
.bm-home .app-img{
aspect-ratio: 16/9;}
.bm-home .size-tabs{
overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px;}
.bm-home .size-tab{
white-space: nowrap; font-size: 11.5px; padding: 7px 12px; flex-shrink: 0;}
.bm-home .size-table{
min-width: 600px;}
.bm-home .faq-q{
font-size: 13px; padding: 16px 0;}
.bm-home .faq-a{
font-size: 12.5px;}
.bm-home .cta-inner{
padding: 44px 16px;}
.bm-home .cta-form{
padding: 20px 16px;}
.bm-home h2.cta-title{
font-size: 28px;}
.bm-home .blog-grid{
grid-template-columns: 1fr;}
.bm-home .blog-img{
aspect-ratio: 16/9;}
.bm-home .price-grid{
grid-template-columns: 1fr;}
.bm-home .price-card{
padding: 22px 16px 24px;}
.bm-home .price-amount{
font-size: 22px;}
.bm-home .brand-grid,.bm-home .brand-grid-3{
grid-template-columns: 1fr;}
.bm-home .brand-grid-4{
grid-template-columns: 1fr;}
.bm-home .brand-vn-grid{
grid-template-columns: repeat(2, 1fr);}
.bm-home .brand-tier-badges{
display: none;}
.bm-home .section-title{
font-size: 22px;}
.bm-home .eyebrow{
font-size: 10px;}
.bm-home .footer-inner{
grid-template-columns: 1fr; gap: 24px; padding: 36px 16px 28px;}
.bm-home .section-cta-row .btn-outline{
width: 100%; justify-content: center;}
}