/* THUẬN ĐẠT — Figma Desktop 1920px, content 1440px.
   Dùng lớp td- riêng, không ghi đè hệ thống Dashboard. */
:root{--site-font:'Open Sans',Arial,sans-serif;--td-blue:#4587c7;--td-dark:#00162a;--td-light:#d6ebff;--td-text:#242424;--td-width:1440px;--font-body:var(--site-font);--font-heading:var(--site-font)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body,button,input,select,textarea{font-family:var(--site-font)}
.bvn-site.td-site{font-family:var(--site-font);font-size:16px;color:var(--td-text);background:#fff;min-width:0;overflow:clip}
.td-site img{max-width:100%;height:auto}
.td-site a{text-decoration:none;color:inherit;transition:color .22s ease,background-color .22s ease,transform .22s ease}
.td-site a:hover{color:var(--td-blue)}
.td-site button,.td-site input,.td-site textarea{font:inherit}
.td-site button{cursor:pointer}
.td-site :is(a,button,input,textarea,summary):focus-visible{outline:3px solid var(--td-blue);outline-offset:3px}
.td-site :is(.td-container,.bvn-container){width:min(var(--td-width),calc(100% - 48px));max-width:var(--td-width);margin-inline:auto}
.td-site .td-button{display:inline-flex;align-items:center;justify-content:center;min-height:51px;padding:11px 24px;border-radius:6px;border:0;background:var(--td-blue);font-family:var(--site-font);font-size:20px;font-weight:700;line-height:27px;color:white;transition:background .24s ease,transform .24s ease}
.td-site .td-button:hover{background:#266da9;color:#fff;transform:translateY(-2px)}
.td-site .td-section{padding:65px 0 75px;background:#fff}
.td-site .td-heading{display:flex;align-items:center;justify-content:center;gap:24px;margin:0 0 56px;color:var(--td-blue);text-align:center;font-size:40px;line-height:1.5;font-weight:700;text-transform:uppercase}
.td-site .td-heading::before,.td-site .td-heading::after{content:"";display:block;flex:0 1 229px;height:2px;background:var(--td-blue)}
.td-site .td-heading--plain::before,.td-site .td-heading--plain::after{display:none}
.td-site .td-heading--light{color:#fff}.td-site .td-heading--light::before,.td-site .td-heading--light::after{background:#fff}
/* Topbar + sticky navigation */
.td-site .td-header{position:relative;z-index:90;background:transparent}
.td-site .td-topbar{height:44px;background:var(--td-blue);color:#fff}
.td-site .td-topbar__inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.td-site .td-topbar__contacts{display:flex;align-items:center;gap:12px;min-width:0}
.td-site .td-topbar__contacts>a,.td-site .td-topbar__hours{display:inline-flex;gap:5px;align-items:center;font-size:12px;font-weight:600;color:#fff;white-space:nowrap}
.td-site .td-topbar__contacts>a+a{border-left:1px solid #fff;padding-left:12px}
.td-site .td-topbar__contacts a:hover{color:#e6f6ff}
.td-site .td-languages{display:flex;align-items:center;gap:14px;white-space:nowrap}
.td-site .td-languages button{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:#3f4b3d;font-size:14px;font-weight:500;opacity:.8;padding:3px;line-height:1.2}
.td-site .td-languages button img{display:block;width:21px;height:14px;object-fit:cover}
.td-site .td-languages button.is-active,.td-site .td-languages button:hover{opacity:1;font-weight:700}
.td-site .td-languages__divider{height:21px;border-left:1px solid #868686}
.td-site .td-navigation{position:sticky;top:0;z-index:89;height:62px;background:#fff;box-shadow:0 2px 9px #163d5810;transition:box-shadow .25s ease}
.td-site .td-navigation.is-stuck{height:62px;box-shadow:0 5px 18px #08243b1f}
.td-site .td-navigation__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;height:100%}
.td-site .td-navigation__logo{display:flex;align-items:center;flex:0 0 auto;width:min(285.606567px,22vw);max-height:100%}
.td-site .td-navigation__logo img{width:100%;height:62px;object-fit:contain;object-position:left center}
.td-site .td-menu{display:block;position:static;flex:1 1 auto;min-width:0;background:#fff}
.td-site .td-menu__list{list-style:none;margin:0;padding:0;display:flex;align-items:center;justify-content:center;gap:clamp(10px,1.2vw,35px)}
.td-site .td-menu__list>li{position:relative;list-style:none;margin:0;padding:0;flex:0 0 auto}
.td-site .td-menu__list>li>a,.td-site .td-menu__list>li>.bvn-menu__item>a{display:inline-block;font-size:clamp(11px,.84vw,16px);font-weight:500;text-transform:uppercase;line-height:24px;color:#121212;white-space:nowrap}
.td-site .td-menu__list>li>a:hover,.td-site .td-menu__list>li>.bvn-menu__item>a:hover,.td-site .td-menu__list>li>a[aria-current]{color:var(--td-blue)}
.td-site .td-menu .bvn-menu__item{display:flex;align-items:center;gap:6px}
.td-site .td-menu .bvn-menu__item button{border:none;background:none;padding:5px;color:#222;font-size:11px;transition:transform .2s}
.td-site .td-has-submenu:hover>.bvn-menu__item>button{color:var(--td-blue)}
.td-site .td-submenu{position:absolute;top:100%;left:0;z-index:15;display:block;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px);min-width:230px;padding:10px 0;margin:0;list-style:none;background:#fff;border-top:2px solid var(--td-blue);box-shadow:0 12px 25px #00162a25;transition:opacity .2s,transform .2s,visibility .2s}
.td-site .td-has-submenu:is(:hover,:focus-within,.is-open)>.td-submenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.td-site .td-submenu a{display:block;font-size:14px;line-height:1.4;padding:10px 16px;color:#263342}
.td-site .td-submenu a:hover{background:#eff7ff;color:var(--td-blue)}
.td-site .td-menu-toggle,.td-site .td-menu__close{display:none}
.td-site .td-navigation__extra{flex:0 0 auto;display:flex;align-items:center;gap:18px}
.td-site .td-languages--mobile{display:none}
@media(min-width:1026px){
 .td-site .td-navigation,.td-site .td-navigation.is-stuck{height:104px;padding:16px 0 26px}
 .td-site .td-navigation__inner{height:62px}
}
/* Desktop Figma: logo 285.61px → 98.39px → menu 870px → 35px → languages. */
@media(min-width:1441px){
 .td-site .td-navigation__inner{justify-content:flex-start;gap:0}
 .td-site .td-menu{flex:0 0 870px;margin-left:98.39px}
 .td-site .td-menu__list{justify-content:space-between;gap:0}
 .td-site .td-navigation__extra{margin-left:35px;gap:0}
 .td-site .td-languages{gap:10px}
}
/* Slideshow */
.td-site .td-hero{position:relative;width:100%;margin:0;background:#cedee8}
.td-site .td-hero__slide{position:relative;min-height:min(834px,43.44vw);display:flex;align-items:end;isolation:isolate}
.td-site .td-hero__slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#00162a85 0%,#00162a0d 70%);z-index:-1}
.td-site .td-hero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.td-site .td-hero__inner{width:100%;padding:0 0 clamp(60px,7.5vw,140px)}
.td-site .td-hero__copy{max-width:930px;color:#fff}
.td-site .td-hero__copy h1,.td-site .td-hero__copy h2{font-size:clamp(32px,3.45vw,66px);line-height:1.15;font-weight:700;letter-spacing:-1px;text-transform:uppercase;color:#fff;margin:0 0 20px}
.td-site .td-hero__copy p{font-size:clamp(16px,1.25vw,24px);line-height:1.5;color:#fff;font-weight:500;margin:0 0 26px;max-width:920px}
.td-site .td-hero__controls{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:14px;color:#fff}
.td-site .td-hero__controls button{border:1px solid #ffffff66;background:#00162a55;color:white;border-radius:50%;width:35px;height:35px}
.td-site .td-hero__controls .swiper-pagination-bullet{background:white}
/* About */
.td-site .td-about{padding:106px 0 115px}
.td-site .td-about__grid{display:grid;grid-template-columns:710fr 702fr;align-items:center;gap:20px}
.td-site .td-about__image{height:451px;background:#f3f5f8;overflow:hidden}
.td-site .td-about__image img{width:100%;height:100%;object-fit:cover}
.td-site .td-about__copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.td-site .td-about__copy .td-heading{width:100%;margin:0;font-size:40px}
.td-site .td-about__description,.td-site .td-about__content{width:100%;font-size:18px;line-height:1.5;color:#252525}
.td-site .td-about__content{max-height:220px;overflow:hidden}
.td-site .td-about__content p{margin:0 0 12px}
.td-site .td-about__copy>.td-button{margin-top:4px}
/* Numbers */
.td-site .td-full-background{position:relative;isolation:isolate;background:#0e2031}
.td-site .td-full-background:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#0009,#0009),var(--td-bg,linear-gradient(#00162a,#00162a));background-size:cover;background-position:center}
.td-site .td-stats{padding:69px 0 68px;min-height:488px;color:white}
.td-site .td-stats .td-heading{margin-bottom:75px}
.td-site .td-stats__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:55px;align-items:start}
.td-site .td-stat{text-align:center;color:#fff}
.td-site .td-stat__icon{display:flex;justify-content:center;align-items:center;height:62px;margin-bottom:27px;font-size:57px}
.td-site .td-stat strong{display:block;font-size:40px;line-height:1.5;font-weight:700;color:#fff}
.td-site .td-stat p{max-width:245px;margin:0 auto;color:#fff;font-size:22px;line-height:1.5;font-weight:500}
/* Brand logo carousel */
.td-site .td-brands{padding-top:77px;padding-bottom:63px}
.td-site .td-brands .td-heading{margin-bottom:45px}
.td-site .td-brands__swiper{width:100%;overflow:hidden}
.td-site .td-brand{min-height:110px;display:flex;justify-content:center;align-items:center;text-align:center}
.td-site .td-brand a{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.td-site .td-brand img{width:100%;max-width:210px;max-height:92px;object-fit:contain;transition:transform .3s}
.td-site .td-brand:hover img{transform:scale(1.06)}
/* Featured products */
.td-site .td-products{padding:45px 0 82px}
.td-site .td-products .td-heading{margin-bottom:65px}
.td-site .td-product-carousel{position:relative}
.td-site .td-product{height:373px;border:1px solid var(--td-light);box-shadow:0 4px 13px #4587c726;border-radius:7px;background:#fff;padding:13px 17px 18px;overflow:hidden;display:flex;flex-direction:column}
.td-site .td-product__image{width:100%;height:236px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.td-site .td-product__image img{height:100%;max-width:100%;object-fit:contain;transition:transform .3s}
.td-site .td-product:hover .td-product__image img{transform:scale(1.045)}
.td-site .td-product h3{font-size:14px;line-height:1.55;font-weight:500;margin:12px 0 0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;min-height:64px}
.td-site .td-product__price{font-size:16px;line-height:1.5;color:var(--td-blue);margin:auto 0 0}
.td-site .td-product__price strong{font-weight:700;margin-left:7px}
.td-site .td-product-carousel__arrow{position:absolute;top:50%;z-index:5;transform:translateY(-50%);border:0;border-radius:50%;height:38px;width:38px;color:var(--td-blue);background:#fff;box-shadow:0 3px 10px #0002}
.td-site .td-product-carousel__arrow--prev{left:-20px}.td-site .td-product-carousel__arrow--next{right:-20px}
/* Why partner */
.td-site .td-why{padding:100px 0 109px;min-height:619px;color:#fff}
.td-site .td-why:before{background-image:linear-gradient(#000b,#000b),var(--td-bg,linear-gradient(#00162a,#00162a))}
.td-site .td-why__heading{text-align:center;margin:0 0 35px;color:#fff;font-size:40px;line-height:1.5;font-weight:700}
.td-site .td-why__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.td-site .td-why__card{min-height:314px;padding:36px 50px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:20px;background:#ffffff4d;backdrop-filter:blur(3px)}
.td-site .td-why__icon{width:75px;height:75px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff70;margin-bottom:22px;font-size:35px;color:white}
.td-site .td-why__icon img{width:35px;height:35px;object-fit:contain}
.td-site .td-why__card h3{font-size:30px;line-height:1.5;color:white;font-weight:700;margin:0 0 5px}
.td-site .td-why__card p{font-size:18px;line-height:1.5;color:white;margin:0;max-width:320px}
/* Mosaic partners */
.td-site .td-partners{padding:75px 0 92px}
.td-site .td-partners__mosaic{min-height:560px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:105px;gap:12px;align-content:center}
.td-site .td-partners__item{min-height:110px;background:white;box-shadow:0 3px 14px #0002;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:15px;transition:transform .32s ease,box-shadow .32s ease}
.td-site .td-partners__item:hover{transform:translateY(-9px) scale(1.035);box-shadow:0 9px 24px #0003}
.td-site .td-partners__item a{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.td-site .td-partners__item img{max-width:100%;width:100%;height:78px;object-fit:contain}
.td-site .td-partners__item:nth-child(6n+1){grid-column:span 1;align-self:start}
.td-site .td-partners__item:nth-child(6n+2){grid-column:span 2;align-self:end}
.td-site .td-partners__item:nth-child(6n+3){grid-column:span 1;transform:translateY(28px)}
.td-site .td-partners__item:nth-child(6n+4){grid-column:span 2;align-self:center}
.td-site .td-partners__item:nth-child(6n+5){grid-column:span 2;transform:translateY(-24px)}
.td-site .td-partners__item:nth-child(6n){grid-column:span 1}
/* Dealer form */
.td-site .td-dealer{padding:52px 0 75px}
.td-site .td-dealer__grid{display:grid;grid-template-columns:660fr 780fr;min-height:712px;overflow:hidden;border-radius:24px;background:var(--td-light)}
.td-site .td-dealer__media{position:relative;min-height:712px;background:#0a304e;display:flex;align-items:center;justify-content:center}
.td-site .td-dealer__media>img,.td-site .td-dealer__media>iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.td-site .td-dealer__play{position:relative;z-index:2;width:85px;height:85px;border:0;border-radius:50%;background:var(--td-blue);color:#fff;font-size:35px;box-shadow:0 5px 20px #00162a30}
.td-site .td-dealer__play:hover{transform:scale(1.1)}
.td-site .td-dealer__form-outer{display:flex;align-items:center;justify-content:center;padding:45px}
.td-site .td-dealer__form-card{width:100%;max-width:693px;padding:35px 30px 37px;border-radius:20px;background:#fff;box-shadow:0 3px 17px #00162a24}
.td-site .td-dealer__form-card h2{text-align:center;color:var(--td-blue);font-size:40px;line-height:1.5;margin:0 0 17px;font-weight:700}
.td-site .td-dealer__form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:15px}
.td-site .td-dealer__form label{min-width:0;display:flex;flex-direction:column;gap:6px}
.td-site .td-dealer__form label span{font-size:16px;color:var(--td-blue)}
.td-site .td-dealer__wide{grid-column:1/-1}
.td-site .td-dealer__form input,.td-site .td-dealer__form textarea{border:1px solid #dadada;border-radius:6px;outline:none;background:#fff;padding:12px 15px;color:#252525;width:100%;font-size:15px}
.td-site .td-dealer__form input{height:52px}.td-site .td-dealer__form textarea{min-height:142px;resize:vertical}
.td-site .td-dealer__form :is(input,textarea):focus{border-color:var(--td-blue);box-shadow:0 0 0 2px #4587c725}
.td-site .td-dealer__submit{grid-column:1/-1;border-radius:100px;width:100%;height:59px;margin-top:15px;font-size:18px}
/* Certificates */
.td-site .td-certificates{padding:70px 0 80px}.td-site .td-certificates .td-heading{margin-bottom:48px}
.td-site .td-certificates__item{display:block;aspect-ratio:345/493;overflow:hidden;background:#f1f4f8}
.td-site .td-certificates__item img{width:100%;height:100%;object-fit:contain;transition:transform .3s}
.td-site .td-certificates__item:hover img{transform:scale(1.03)}
/* News */
.td-site .td-news{padding:70px 0 100px}.td-site .td-news .td-heading{margin-bottom:55px}
.td-site .td-news__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.td-site .td-news-card{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.td-site .td-news-card__image{display:block;width:100%;aspect-ratio:467/266;background:#f1f5f9;overflow:hidden}
.td-site .td-news-card__image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.td-site .td-news-card__image:hover img{transform:scale(1.045)}
.td-site .td-news-card h3{font-size:22px;line-height:1.4;font-weight:700;margin:20px 0 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.td-site .td-news-card time{font-size:14px;margin-bottom:8px;color:#777}
.td-site .td-news-card p{font-size:15px;line-height:1.6;margin:0 0 25px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.td-site .td-news-card .td-button{margin-top:auto;font-size:18px}
/* Footer */
.td-site .td-footer{background:var(--td-dark);color:white;padding:80px 0 0;min-height:632px}
.td-site .td-footer__grid{display:grid;grid-template-columns:1fr 1fr;gap:140px;max-width:1434px;align-items:start}
.td-site .td-footer__logo{display:block;width:360px;max-width:100%;min-height:150px}
.td-site .td-footer__logo img{width:360px;max-width:100%;height:175px;object-fit:contain;object-position:left center}
.td-site .td-footer h2{color:#fff;font-size:22px;line-height:1.45;margin:10px 0 18px;font-weight:700}
.td-site .td-footer__intro,.td-site .td-footer__intro p{font-size:18px;line-height:1.5;color:#fff;max-width:690px}
.td-site .td-footer__contact h2{font-size:30px;margin:15px 0 27px}
.td-site .td-footer__contact p{display:flex;gap:20px;align-items:start;margin:0 0 19px;font-size:18px;line-height:1.55;color:#fff}
.td-site .td-footer__contact p i{width:25px;flex:0 0 25px;font-size:24px;margin-top:3px}
.td-site .td-footer__contact a{color:#fff}.td-site .td-footer__contact a:hover{color:#85c7ff}
.td-site .td-footer__bottom{text-align:center;color:#fff;padding:100px 24px 26px;font-size:16px;font-weight:600}
.td-site .td-back-top{position:fixed;z-index:80;bottom:30px;right:28px;width:46px;height:46px;border:none;border-radius:50%;background:var(--td-blue);color:white;box-shadow:0 4px 16px #0003}
/* Shared subpages */
.td-site .bvn-page-hero{background:#f4f8fd;padding:20px 0;border-bottom:1px solid #dcecf7}
.td-site .bvn-page-hero__crumbs{font-size:14px;color:#5b6672;display:flex;align-items:center;gap:12px}
.td-site .bvn-subpage-body{width:100%;min-height:40vh;background:#fff;padding-bottom:50px}
.td-site .bvn-subpage-body :is(.bvn-container,.wrap-content){max-width:1440px;margin-left:auto;margin-right:auto}
.td-site .bvn-subpage-body :is(h1,.title-detail){color:var(--td-blue);font-size:clamp(27px,2.15vw,40px);font-weight:700;line-height:1.3}
.td-site .bvn-subpage-body h2{color:var(--td-blue)}
.td-site .bvn-subpage-body :is(.product-list-template,.bvn-listing,.about-template){padding-top:45px}
.td-site .bvn-subpage-body :is(.product-detail-page,.news-detail,.about-template){max-width:1440px;margin-left:auto;margin-right:auto}
.td-site .bvn-subpage-body :is(.product-card,.product-item,.product-list-item,.blog-news-card){border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 4px 15px #4587c715;transition:transform .2s}
.td-site .bvn-subpage-body :is(.product-card,.product-item,.product-list-item,.blog-news-card):hover{transform:translateY(-3px)}
.td-site .bvn-contact{padding:65px 0 80px}.td-site .bvn-contact__head{text-align:center;margin-bottom:45px}
.td-site .bvn-contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.td-site .bvn-contact__details,.td-site .bvn-contact__form-card{padding:35px;background:#f5faff;border-radius:15px}
.td-site .bvn-contact__fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.td-site .bvn-contact__fields label{display:flex;flex-direction:column;gap:7px;min-width:0}
.td-site .bvn-contact__fields .bvn-contact__wide{grid-column:1/-1}
.td-site .bvn-contact__fields :is(input,textarea){width:100%;border:1px solid #d0dce5;border-radius:6px;padding:12px;background:white}
.td-site .bvn-contact__form .bvn-button{display:inline-flex;padding:13px 27px;margin-top:15px;background:var(--td-blue);border:none;border-radius:6px;color:white}
.td-site .bvn-contact__honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.td-site .about-template img,.td-site .bvn-subpage-body img{object-fit:cover}
.td-site .swiper{overflow:hidden}

.td-site .td-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
/* Danh sách/chi tiết trang con: cùng hệ màu, lưới và nhịp khoảng cách Figma */
.td-site .bvn-listing__heading{margin:10px 0 30px;font-size:40px;line-height:1.3;color:var(--td-blue);font-weight:700;text-transform:uppercase}
.td-site .product-list-container{padding-top:44px;padding-bottom:65px}
.td-site .product-list-template :is(.product-list,.product-grid,.grid-products){gap:19px}
.td-site .product-list-template :is(.product-item,.product-card){border:1px solid var(--td-light);border-radius:7px;padding:14px;background:#fff;box-shadow:0 4px 13px #4587c719}
.td-site .product-list-template :is(.product-item img,.product-card img){max-width:100%;object-fit:contain}
.td-site .product-detail-page{padding:35px 0 60px}
.td-site .product-detail-page .wrap-content{max-width:1440px;margin-inline:auto}
.td-site .product-detail-page :is(h1,h2,.title-detail,.product-list-heading){color:var(--td-blue)}
.td-site .news-template-list1-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.td-site .news-template-list1-card{display:flex;flex-direction:column;background:#fff;overflow:hidden;min-width:0}
.td-site .news-template-list1-photo{display:block;aspect-ratio:467/266;overflow:hidden;background:#eef5fa}
.td-site .news-template-list1-photo img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.td-site .news-template-list1-photo:hover img{transform:scale(1.04)}
.td-site .news-template-list1-info{padding:20px 0 12px}
.td-site .news-template-list1-name{font-size:21px;font-weight:700;line-height:1.45;color:#222}
.td-site .news-template-list1-desc{font-size:15px;line-height:1.65;color:#525252}
.td-site .news-template-detail1{padding:15px 0 70px}
.td-site .news-template-detail1 img{max-width:100%;height:auto}
.td-site .about-template{padding:45px 0 70px}
.td-site .about-template-heading h1{font-weight:700;color:var(--td-blue);font-size:40px}
.td-site .about-template-lead,.td-site .about-template-content{font-size:17px;line-height:1.8}
.td-site .about-alternating-item{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;margin:45px 0}
.td-site .about-alternating-item:nth-child(even)>.about-alternating-photo{order:2}
.td-site .about-alternating-photo img{width:100%;height:auto;object-fit:cover}
@media(max-width:1025px){.bvn-site.td-site .news-template-list1-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bvn-site.td-site .about-template-heading h1{font-size:32px}}
@media(max-width:767px){.bvn-site.td-site .news-template-list1-grid{grid-template-columns:1fr}.bvn-site.td-site .news-template-list1-info{padding-top:12px}.bvn-site.td-site .about-alternating-item{grid-template-columns:1fr;gap:18px}.bvn-site.td-site .about-alternating-item:nth-child(even)>.about-alternating-photo{order:0}.bvn-site.td-site .about-template-heading h1{font-size:27px}.bvn-site.td-site .about-template-lead,.bvn-site.td-site .about-template-content{font-size:15px}}


/* THUAN DAT | Trang con — desktop design system from the 1920/1440 Figma homepage.
   Scoped to the subpage wrapper; existing homepage and Dashboard remain unchanged. */
.bvn-site.td-site .bvn-page-hero{
  position:relative;isolation:isolate;padding:29px 0 30px;
  background:linear-gradient(112deg,#f1f8ff 0%,#f7fbff 65%,#e8f3ff 100%);
  border-top:1px solid #e6f1f9;border-bottom:1px solid #d9e9f7;
}
.bvn-site.td-site .bvn-page-hero::before{
  content:"";position:absolute;inset:0 0 0 auto;width:36%;z-index:-1;
  background:linear-gradient(135deg,transparent 30%,#4587c70a 30% 60%,transparent 60%);
}
.bvn-site.td-site .bvn-page-hero__crumbs{display:flex;align-items:center;gap:11px;min-height:30px;flex-wrap:wrap;font-size:14px;line-height:1.7;color:#50657b}
.bvn-site.td-site .bvn-page-hero__crumbs a{color:#357ebd;font-weight:600}
.bvn-site.td-site .bvn-page-hero__crumbs a:hover{color:#174f82}
.bvn-site.td-site .bvn-page-hero__crumbs :is(.breadCrumbs,.breadcrumb,ul,ol){display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;background:transparent}
.bvn-site.td-site .bvn-page-hero__crumbs :is(i,svg){color:#91a8bd}
.bvn-site.td-site .bvn-subpage-body{min-height:45vh;padding-bottom:82px;overflow-wrap:break-word}
.bvn-site.td-site .bvn-subpage-body :is(.wrap-content,.max-width,.dap-about-article__container,.dap-projects-articles__container,.dap-services__container,.dap-detail-container,.tbl-projects-container,.tbl-services-page__container,.bvn-blog-page__container){width:min(1440px,calc(100% - 48px));max-width:1440px;margin-left:auto;margin-right:auto}
.bvn-site.td-site .bvn-subpage-body :is(.wrap-content,.max-width) :is(img,video,iframe){max-width:100%}
.bvn-site.td-site .bvn-subpage-body :is(.content-main,.baonoidung,.article-cke-content,.dap-detail-content,.dap-about-article__content){font-size:17px;line-height:1.9;color:#3d4b58;overflow-wrap:anywhere}
.bvn-site.td-site .bvn-subpage-body :is(.content-main,.baonoidung,.article-cke-content) :is(p,ul,ol){margin-bottom:1.15em}
.bvn-site.td-site .bvn-subpage-body :is(.content-main,.baonoidung,.article-cke-content) img{max-width:100%;height:auto!important;border-radius:9px}
.bvn-site.td-site .bvn-subpage-body :is(.content-main,.baonoidung,.article-cke-content) table{display:block;max-width:100%;overflow-x:auto}
.bvn-site.td-site .bvn-subpage-body :is(.content-main,.baonoidung,.article-cke-content) :is(h2,h3){color:#245d91;line-height:1.4;margin:1.1em 0 .6em}
.bvn-site.td-site .bvn-subpage-body :is(.dap-listing-page-title,.news-template-title,.bvn-listing__heading){margin:0 0 34px;text-align:center}
.bvn-site.td-site .bvn-subpage-body :is(.dap-listing-page-title,.news-template-title,.bvn-listing__heading)>h1,
.bvn-site.td-site .bvn-subpage-body .bvn-contact__head>h1{
  display:flex;align-items:center;justify-content:center;gap:18px;
  color:var(--td-blue);font-size:32px;line-height:1.35;
  font-weight:700;text-align:center;text-transform:none;letter-spacing:0;margin:0;
}
.bvn-site.td-site .bvn-subpage-body :is(.dap-listing-page-title,.news-template-title,.bvn-listing__heading)>h1::before,
.bvn-site.td-site .bvn-subpage-body :is(.dap-listing-page-title,.news-template-title,.bvn-listing__heading)>h1::after,
.bvn-site.td-site .bvn-subpage-body .bvn-contact__head>h1::before,
.bvn-site.td-site .bvn-subpage-body .bvn-contact__head>h1::after{
  content:"";flex:0 1 110px;min-width:0;display:block;height:2px;background:#82b4e1;
}
.bvn-site.td-site .bvn-subpage-body :is(.dap-projects-articles__empty,.dap-services__empty,.bvn-blog-page__empty){padding:35px 20px;background:#f3f9ff;color:#49647f;text-align:center;border-radius:10px}
.bvn-site.td-site .bvn-subpage-body :is(.pagination,.dap-news-page__pagination nav,.dap-projects-articles__pagination){display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:38px auto 0}
.bvn-site.td-site .bvn-subpage-body :is(.pagination,.dap-projects-articles__pagination) :is(a,span){min-width:39px;min-height:39px;display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:5px;border:1px solid #d7e6f4}
.bvn-site.td-site .bvn-subpage-body :is(.pagination,.dap-projects-articles__pagination) :is(.active,.is-active,[aria-current="page"]){background:var(--td-blue);color:#fff;border-color:var(--td-blue)}
/* One spacing system for Thuận Đạt subpages (breadcrumb -> heading -> content).
   Only outer wrappers are reset; each page keeps its existing dynamic data. */
.bvn-site.td-site .bvn-subpage-body > :is(.dap-about-article,.dap-projects-articles,.dap-services-page){padding:0;margin:0}
.bvn-site.td-site .bvn-subpage-body .dap-listing-page-title h1,
.bvn-site.td-site .bvn-subpage-body .news-template-title h1,
.bvn-site.td-site .bvn-subpage-body .bvn-listing__heading h1,
.bvn-site.td-site .bvn-subpage-body .bvn-contact__head h1,
.bvn-site.td-site .bvn-subpage-body .td-static-page .title-detail h1,
.bvn-site.td-site .bvn-subpage-body .bvn-blog-page__header h1{font-size:32px;line-height:1.35;font-weight:700;text-transform:none;letter-spacing:0}
.bvn-site.td-site .bvn-subpage-body .bvn-listing__heading h1{margin:0}
/* About: Dashboard article + gallery. */
.bvn-site.td-site .dap-about-article__container{padding:56px 0 22px}
.bvn-site.td-site .dap-about-article__body{width:min(1100px,100%);margin:0 auto}
.bvn-site.td-site .dap-about-article__content-title{font-size:27px;line-height:1.45;font-weight:700;text-align:center;margin:0 0 28px;color:#2c688f}
.bvn-site.td-site .dap-about-article__content{padding:0 4px;font-size:18px;line-height:1.9}
.bvn-site.td-site .dap-about-article__gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:52px 0 0}
.bvn-site.td-site .dap-about-article__gallery-item{display:block;overflow:hidden;background:#edf5fc;border:1px solid #e4eef6;border-radius:12px;aspect-ratio:4/3;box-shadow:0 7px 25px #0f436d0d}
.bvn-site.td-site .dap-about-article__gallery-item img{display:block;width:100%;height:100%!important;object-fit:cover;transition:transform .4s ease}
.bvn-site.td-site .dap-about-article__gallery-item:hover img{transform:scale(1.045)}
.bvn-site.td-site .td-static-page .td-static-article{max-width:1050px;margin-inline:auto;padding:56px 32px;background:#fff;border-radius:12px}
.bvn-site.td-site .td-static-page .title-detail{text-align:center;margin-bottom:34px}
/* Business-area and service cards use the existing news/portfolio data. */
.bvn-site.td-site .dap-services--subpage{padding:56px 0 48px;background:#fff}
.bvn-site.td-site .dap-services__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;align-items:stretch}
.bvn-site.td-site .dap-services--subpage .dap-services__card{display:flex;flex-direction:column;min-width:0;min-height:0;padding:0;background:#fff;border:1px solid #e3eef7;border-radius:12px;overflow:hidden;box-shadow:0 8px 28px #143e5a12;transition:box-shadow .25s,transform .25s}
.bvn-site.td-site .dap-services--subpage .dap-services__card:hover{transform:translateY(-5px);box-shadow:0 15px 36px #143e5a22}
.bvn-site.td-site .dap-services--subpage .dap-services__image{position:relative;display:block;width:100%;height:auto;aspect-ratio:467/285;overflow:hidden;background:#e8f4ff}
.bvn-site.td-site .dap-services--subpage .dap-services__image>img{display:block;width:100%;height:100%!important;object-fit:cover;transition:transform .35s}
.bvn-site.td-site .dap-services--subpage .dap-services__card:hover .dap-services__image>img{transform:scale(1.05)}
.bvn-site.td-site .dap-services--subpage .dap-services__icon{position:absolute;bottom:16px;left:19px;top:auto;display:flex;align-items:center;justify-content:center;width:55px;height:55px;border-radius:12px;background:#ffffffee;color:var(--td-blue);font-size:22px;box-shadow:0 4px 13px #001c3420}
.bvn-site.td-site .dap-services--subpage .dap-services__icon img{width:30px;height:30px;object-fit:contain}
.bvn-site.td-site .dap-services--subpage .dap-services__body{flex:1;display:flex;flex-direction:column;gap:13px;padding:24px 25px 26px}
.bvn-site.td-site .dap-services--subpage .dap-services__body h3{margin:0;font-size:23px;line-height:1.4;font-weight:700;color:#243849}
.bvn-site.td-site .dap-services--subpage .dap-services__body p{margin:0;color:#617282;font-size:15px;line-height:1.75;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bvn-site.td-site .dap-services--subpage .dap-services__line{height:1px;width:100%;background:#e6edf2;margin-top:auto}
.bvn-site.td-site .dap-services--subpage .dap-services__read-more{display:inline-flex;align-items:center;gap:12px;justify-content:space-between;font-size:15px;color:var(--td-blue);font-weight:700}
.bvn-site.td-site .dap-services--subpage .dap-services__read-more span{width:37px;height:37px;display:grid;place-items:center;background:#eaf5ff;border-radius:50%}
/* Project/listing articles and company news. */
.bvn-site.td-site .dap-projects-articles__section{padding:56px 0 42px}
.bvn-site.td-site .dap-projects-articles__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.bvn-site.td-site .dap-project-post{min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid #e5edf3;border-radius:10px;overflow:hidden;box-shadow:0 8px 25px #10395310;transition:transform .25s,box-shadow .25s}
.bvn-site.td-site .dap-project-post:hover{transform:translateY(-4px);box-shadow:0 14px 35px #10395323}
.bvn-site.td-site .dap-project-post__media{position:relative;display:block;aspect-ratio:724/551;overflow:hidden;background:#eaf4fa}
.bvn-site.td-site .dap-project-post__media>img{position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;transition:transform .3s}
.bvn-site.td-site .dap-project-post:hover .dap-project-post__media img{transform:scale(1.045)}
.bvn-site.td-site .dap-project-post__fallback{display:grid;place-items:center;height:100%;color:#a3c4d9;font-size:45px}
.bvn-site.td-site .dap-project-post__body{flex:1;display:flex;flex-direction:column;padding:23px 25px 27px}
.bvn-site.td-site .dap-project-post__body h2{margin:0 0 13px;font-size:22px;font-weight:700;line-height:1.45;color:#213c51}
.bvn-site.td-site .dap-project-post__body p{font-size:15px;line-height:1.75;color:#64788a;margin:0 0 17px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bvn-site.td-site .dap-project-post__read{display:flex;align-items:center;justify-content:space-between;color:var(--td-blue);font-size:15px;font-weight:700;margin-top:auto}
.bvn-site.td-site .dap-project-post__read span{height:36px;width:36px;border-radius:50%;background:#eaf4ff;display:grid;place-items:center}
.bvn-site.td-site .dap-news-page__filters{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:0 0 30px}
.bvn-site.td-site .dap-news-page__filters a{padding:10px 19px;border:1px solid #dbe9f6;border-radius:100px;color:#496a87;background:#fff;font-weight:500;font-size:15px}
.bvn-site.td-site .dap-news-page__filters a:is(:hover,.is-active,[aria-current]){background:var(--td-blue);border-color:var(--td-blue);color:#fff}
.bvn-site.td-site .dap-news-page__filters--sub{margin-top:-12px;margin-bottom:32px}
.bvn-site.td-site .bvn-news-listing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.bvn-site.td-site .bvn-news-listing__card{display:flex;flex-direction:column;min-width:0;overflow:hidden;background:#fff;border:1px solid #e4edf6;border-radius:10px;box-shadow:0 7px 25px #133b5c12}
.bvn-site.td-site .bvn-news-listing__card--lead{grid-column:span 3;display:grid;grid-template-columns:1.12fr 1fr;min-height:345px}
.bvn-site.td-site .bvn-news-listing__media{position:relative;display:block;overflow:hidden;aspect-ratio:467/288;background:#e9f4ff}
.bvn-site.td-site .bvn-news-listing__card--lead .bvn-news-listing__media{aspect-ratio:auto}
.bvn-site.td-site .bvn-news-listing__fallback{height:100%;display:grid;place-items:center;font-size:44px;color:#adcee5}
.bvn-site.td-site .bvn-news-listing__media img{position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;transition:transform .3s}
.bvn-site.td-site .bvn-news-listing__media:hover img{transform:scale(1.04)}
.bvn-site.td-site .bvn-news-listing__content{flex:1;display:flex;flex-direction:column;gap:13px;padding:23px 25px 27px}
.bvn-site.td-site .bvn-news-listing__card--lead .bvn-news-listing__content{justify-content:center;padding:37px 42px}
.bvn-site.td-site .bvn-news-listing__label{align-self:start;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--td-blue);font-size:12px}
.bvn-site.td-site .bvn-news-listing__content h2{margin:0;font-size:22px;line-height:1.45;font-weight:700;color:#17364e}
.bvn-site.td-site .bvn-news-listing__card--lead h2{font-size:30px}
.bvn-site.td-site .bvn-news-listing__content p{color:#5d7285;font-size:15px;line-height:1.7;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bvn-site.td-site .bvn-news-listing__more{margin-top:auto;color:var(--td-blue);font-weight:700;font-size:15px}
/* Article detail and related content. */
.bvn-site.td-site .dap-detail-container{padding:58px 0 38px}
.bvn-site.td-site .dap-detail-article{width:min(1050px,100%);margin:0 auto;padding:0}
.bvn-site.td-site .dap-detail-title,.bvn-site.td-site .news-detail-content-only h1,.bvn-site.td-site .news-template-article h1{margin:0 0 32px;color:#246fa7;line-height:1.4;font-weight:700;font-size:clamp(27px,2.2vw,40px);text-align:center}
.bvn-site.td-site .dap-detail-content{padding-bottom:22px}
.bvn-site.td-site .dap-detail-related{padding:32px 0 10px;margin:36px 0 0;border-top:1px solid #dce9f2}
.bvn-site.td-site .dap-detail-related__title{text-align:center;text-transform:uppercase;color:var(--td-blue);font-size:30px;font-weight:700;margin:0 0 28px}
.bvn-site.td-site .dap-detail-related__grid,.bvn-site.td-site .dap-news-page__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.bvn-site.td-site .dap-news-card__media{position:relative;display:block;min-height:265px;aspect-ratio:467/310;border-radius:9px;overflow:hidden;color:#fff;background:linear-gradient(145deg,#144971,#001c34)}
.bvn-site.td-site .dap-news-card__media img{position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;transition:transform .35s}
.bvn-site.td-site .dap-news-card__media:hover img{transform:scale(1.05)}
.bvn-site.td-site .dap-news-card__shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 28%,#001b36dd)}
.bvn-site.td-site .dap-news-card__fallback{height:100%;display:grid;place-items:center;color:#91b6d2;font-size:40px}
.bvn-site.td-site .dap-news-card__label{position:absolute;top:19px;left:19px;font-size:12px;font-weight:600;color:#fff;background:var(--td-blue);padding:6px 12px;border-radius:4px}
.bvn-site.td-site .dap-news-card__content{position:absolute;left:21px;right:21px;bottom:20px;display:flex;flex-direction:column;gap:15px;color:#fff}
.bvn-site.td-site .dap-news-card__content strong{font-size:19px;line-height:1.45;color:#fff;font-weight:700}
.bvn-site.td-site .dap-news-card__more{color:#cae6ff;font-size:14px}
.bvn-site.td-site .tbl-projects-detail__crumb{display:none}
.bvn-site.td-site .tbl-projects-detail__back{margin:32px 0 0}
.bvn-site.td-site .tbl-projects-detail__back a{color:var(--td-blue);font-weight:700}
.bvn-site.td-site .news-detail-content-only,.bvn-site.td-site .news-template-article{max-width:1020px;margin:52px auto 20px}
.bvn-site.td-site .td-news-cover{width:100%;margin:0 0 30px;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#eef4f9}
.bvn-site.td-site .td-news-cover img{display:block;width:100%;height:100%!important;object-fit:cover}
.bvn-site.td-site .news-template-title{margin-top:0}
.bvn-site.td-site .news-template-list1-grid{gap:25px}
.bvn-site.td-site .news-template-list1-card{border:1px solid #e0ecf6;border-radius:10px;box-shadow:0 7px 22px #173c5b13}
.bvn-site.td-site .news-template-list1-info{padding:20px 21px 24px}
/* Standalone news templates use the same first-title offset as the other pages. */
.bvn-site.td-site .bvn-subpage-body > .news-list-template > .wrap-content{
  padding-top:56px;margin-top:0!important;
}
/* Product category/listing and detail (all Dashboard-selectable templates). */
.bvn-site.td-site .bvn-product-listing{padding:0 0 20px}
.bvn-site.td-site .bvn-product-listing .product-list-container{padding:56px 0 42px}
.bvn-site.td-site .bvn-product-listing .bvn-listing__heading{display:block;position:relative;margin:0 0 34px}
.bvn-site.td-site .bvn-product-listing .bvn-listing__heading h1{text-align:center;font-size:32px;font-weight:700;color:var(--td-blue);line-height:1.35;text-transform:none}
.bvn-site.td-site .bvn-product-listing .bvn-listing__heading .filter{position:absolute;right:0;top:12px;color:#45769d;font-size:15px;cursor:pointer}
.bvn-site.td-site .bvn-product-listing .sort-select{position:relative;display:flex;justify-content:flex-end;z-index:4;margin:0 0 26px}
.bvn-site.td-site .bvn-product-listing .sort-select .click-sort{border:1px solid #d7e7f3;border-radius:6px;background:#f9fcff;color:#354f64;padding:10px 17px;margin:0;cursor:pointer;font-size:14px}
.bvn-site.td-site .bvn-product-listing .sort-select-main{position:absolute;top:100%;right:0;min-width:215px;background:#fff;border:1px solid #d9e8f5;box-shadow:0 8px 25px #123e5a26;border-radius:7px;padding:8px;z-index:5}
.bvn-site.td-site .bvn-product-listing .sort-select-main p{margin:0;padding:0}
.bvn-site.td-site .bvn-product-listing .sort-select-main a{padding:9px 11px;display:block;font-size:14px;cursor:pointer;border-radius:4px}
.bvn-site.td-site .bvn-product-listing .sort-select-main a:hover{background:#eaf4fe}
.bvn-site.td-site .bvn-product-listing .product-list-main>.product-list-heading{display:none}
.bvn-site.td-site .bvn-product-listing .product-list-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.bvn-site.td-site .bvn-product-listing.product-list-template-product2 .product-list-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:17px}
.bvn-site.td-site .bvn-product-listing .product-list-card,.bvn-site.td-site .product-related-section .product-list-card{border:1px solid #e7edf3;border-radius:9px;box-shadow:0 6px 20px #1d456011;background:#fff}
.bvn-site.td-site .bvn-product-listing .product-list-photo a{aspect-ratio:1/1;padding:22px}
.bvn-site.td-site .bvn-product-listing .product-list-info{display:flex;flex-direction:column;gap:10px;padding:15px 17px 21px}
.bvn-site.td-site .bvn-product-listing .product-list-name{font-size:16px;line-height:1.55;min-height:3.1em}
.bvn-site.td-site .bvn-product-listing .product-list-price{margin:0;font-size:16px;color:var(--td-blue)}
.bvn-site.td-site .product-detail-page{padding:50px 0 30px}
.bvn-site.td-site .product-detail-page>.wrap-content{width:min(1440px,calc(100% - 48px))}
.bvn-site.td-site .product-detail-page .product-list-heading{font-size:29px;color:var(--td-blue);font-weight:700;text-transform:uppercase;margin:0 0 28px}
.bvn-site.td-site .product-detail-page .product-related-section{margin-top:65px;padding-top:39px;border-top:1px solid #dfeaf3}
.bvn-site.td-site .product-detail-page .product-list-card img{object-fit:contain}
/* Contact: Figma blue/white identity, original action/fields/reCAPTCHA retained. */
.bvn-site.td-site .bvn-contact{padding:56px 0 18px}
.bvn-site.td-site .bvn-contact__head{max-width:860px;margin:0 auto 34px;text-align:center}
.bvn-site.td-site .bvn-eyebrow{display:inline-block;margin:0 0 14px;font-size:13px;letter-spacing:.13em;font-weight:700;color:var(--td-blue)}
.bvn-site.td-site .bvn-contact__head>p{font-size:17px;line-height:1.75;color:#697989;margin:16px 0 0}
.bvn-site.td-site .bvn-contact__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:27px;align-items:stretch}
.bvn-site.td-site .bvn-contact__details,.bvn-site.td-site .bvn-contact__form-card{padding:44px 43px;border-radius:13px;border:1px solid #dfebf6;background:#f6faff;min-width:0}
.bvn-site.td-site .bvn-contact__details{background:linear-gradient(145deg,#edf7ff,#f8fbfe)}
.bvn-site.td-site .bvn-contact__details h2,.bvn-site.td-site .bvn-contact__form-card h2{font-size:27px;line-height:1.35;font-weight:700;color:#216daa;margin:0 0 19px}
.bvn-site.td-site .bvn-contact__details :is(p,li){font-size:16px;line-height:1.8;color:#475b6b}
.bvn-site.td-site .bvn-contact__details p i{display:inline-block;color:var(--td-blue);width:30px}
.bvn-site.td-site .bvn-contact__editor{font-size:16px;line-height:1.85}
.bvn-site.td-site .bvn-contact__office{margin-top:22px;width:100%;max-height:300px;object-fit:cover;border-radius:9px}
.bvn-site.td-site .bvn-contact__form-card>p{font-size:15px;line-height:1.7;color:#62788a;margin:0 0 24px}
.bvn-site.td-site .bvn-contact__fields{gap:19px 15px}
.bvn-site.td-site .bvn-contact__fields label{gap:8px;font-size:14px;color:#2e658e;font-weight:600}
.bvn-site.td-site .bvn-contact__fields :is(input,textarea){min-width:0;font-size:15px;outline:0;padding:13px 14px;border:1px solid #d5e3ee;border-radius:6px;color:#223746;background:white;transition:border-color .2s,box-shadow .2s}
.bvn-site.td-site .bvn-contact__fields input{min-height:48px}
.bvn-site.td-site .bvn-contact__fields textarea{resize:vertical;min-height:142px}
.bvn-site.td-site .bvn-contact__fields :is(input,textarea):focus{border-color:var(--td-blue);box-shadow:0 0 0 3px #4587c727}
.bvn-site.td-site .bvn-contact__form .bvn-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:17px;line-height:1;font-weight:700;min-height:50px;padding:12px 29px;margin-top:25px;transition:background .2s,transform .2s}
.bvn-site.td-site .bvn-contact__form .bvn-button:hover{background:#236aa5;transform:translateY(-2px)}
/* Generic brand, media and legacy listings reachable from submenus. */
.bvn-site.td-site .bvn-subpage-body .grid-news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}
.bvn-site.td-site .bvn-subpage-body .grid-news .item-news{border:1px solid #e3eef7;background:#fff;overflow:hidden;border-radius:10px;box-shadow:0 6px 24px #173c5b14}
.bvn-site.td-site .bvn-subpage-body .grid-news .item-news>.img{display:block}
.bvn-site.td-site .bvn-subpage-body .grid-news .item-news .ds-news{padding:17px 20px 24px}
.bvn-site.td-site .bvn-subpage-body .grid-news .item-news :is(h3,p){font-size:17px;line-height:1.55;margin:0 0 9px;color:#31455c}
.bvn-site.td-site .bvn-subpage-body .grid-product{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px}
.bvn-site.td-site .bvn-subpage-body .grid-product>.product{border:1px solid #e1ecf5;border-radius:9px;overflow:hidden;box-shadow:0 7px 24px #123c5a14;padding:15px}
.bvn-site.td-site .bvn-subpage-body .grid-product .pic-product img{width:100%;height:180px!important;object-fit:contain}
.bvn-site.td-site .bvn-subpage-body .grid-product .name-product{font-size:18px;line-height:1.5;font-weight:600;margin:15px 0 4px;color:#234968;text-align:center}
/* Optional Blog/press listing route: same visual language as company news. */
.bvn-site.td-site .bvn-blog-page{padding:56px 0 24px}
.bvn-site.td-site .bvn-blog-page__header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:25px;margin-bottom:34px}
.bvn-site.td-site .bvn-blog-page__header h1{margin:0;font-size:32px;line-height:1.35;color:var(--td-blue);font-weight:700;text-transform:none}
.bvn-site.td-site .bvn-blog-page__tabs{display:flex;align-items:center;gap:12px}
.bvn-site.td-site .bvn-blog-page__tabs a{display:inline-flex;align-items:center;justify-content:center;border:1px solid #d9e8f3;border-radius:6px;padding:10px 18px;color:#476a89;font-size:15px;font-weight:600}
.bvn-site.td-site .bvn-blog-page__tabs a:is(:hover,.is-current){background:var(--td-blue);border-color:var(--td-blue);color:#fff}
.bvn-site.td-site .bvn-blog-page__section{margin:0 0 55px}
.bvn-site.td-site .bvn-blog-page__section-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:27px}
.bvn-site.td-site .bvn-blog-page__section-kicker{font-size:12px;letter-spacing:.14em;color:#6a8daf;font-weight:700}
.bvn-site.td-site .bvn-blog-page__section-heading h2{font-size:29px;line-height:1.3;font-weight:700;color:#286fa8;margin:6px 0 0}
.bvn-site.td-site .bvn-blog-page__view-all{font-weight:700;font-size:14px;color:var(--td-blue)}
.bvn-site.td-site .bvn-blog-press,.bvn-site.td-site .bvn-blog-news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.bvn-site.td-site .bvn-blog-press__card,.bvn-site.td-site .bvn-blog-news__card{display:flex;flex-direction:column;min-width:0;border:1px solid #e0ebf5;border-radius:11px;box-shadow:0 8px 25px #123c5a12;overflow:hidden;background:#fff}
.bvn-site.td-site .bvn-blog-press__image,.bvn-site.td-site .bvn-blog-news__image{display:grid;place-items:center;aspect-ratio:467/270;color:#8cb5d4;font-size:37px;background:#ecf6ff;overflow:hidden}
.bvn-site.td-site .bvn-blog-press__image img,.bvn-site.td-site .bvn-blog-news__image img{height:100%!important;width:100%;object-fit:cover;transition:transform .3s}
.bvn-site.td-site .bvn-blog-press__card:hover img,.bvn-site.td-site .bvn-blog-news__card:hover img{transform:scale(1.045)}
.bvn-site.td-site .bvn-blog-press__body,.bvn-site.td-site .bvn-blog-news__body{flex:1;display:flex;flex-direction:column;gap:12px;padding:23px 24px}
.bvn-site.td-site .bvn-blog-press__body h3,.bvn-site.td-site .bvn-blog-news__body h3{font-size:21px;line-height:1.5;color:#1e3e56;font-weight:700;margin:0}
.bvn-site.td-site .bvn-blog-press__body p,.bvn-site.td-site .bvn-blog-news__body p{font-size:15px;line-height:1.7;color:#677a89;margin:0}
.bvn-site.td-site .bvn-blog-news__meta{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#7893ab}
.bvn-site.td-site .bvn-blog-press__link,.bvn-site.td-site .bvn-blog-news__more{margin-top:auto;padding-top:10px;color:var(--td-blue);font-size:15px;font-weight:700}
/* Gallery list/detail reuse Bootstrap columns already provided by the PHP views. */
.bvn-site.td-site .bvn-subpage-body .album{overflow:hidden;border:1px solid #e0eaf3;border-radius:9px;background:#fff;box-shadow:0 6px 24px #1b45600d;padding:10px}
.bvn-site.td-site .bvn-subpage-body .album-product .img,.bvn-site.td-site .bvn-subpage-body .album .img{display:block;border-radius:7px;overflow:hidden}
.bvn-site.td-site .bvn-subpage-body .album-product img{width:100%;height:auto;object-fit:cover}
/* Preserve full product photography (the generic subpage img rule uses cover). */
.bvn-site.td-site .bvn-subpage-body .product-list-card img,
.bvn-site.td-site .bvn-subpage-body .product-gallery-template img,
.bvn-site.td-site .bvn-subpage-body .product-detail-template .left-pro-detail img{object-fit:contain}

/* Thuận Đạt — trạng thái menu theo route và micro-interactions.
   Áp dụng cả trang chủ/trang con; giữ nguyên logic menu và dữ liệu Dashboard. */
.bvn-site.td-site .td-menu__list>li>a,
.bvn-site.td-site .td-menu__list>li>.bvn-menu__item>a{
  position:relative;transition:color .22s ease;
}
.bvn-site.td-site .td-menu__list>li>a::after,
.bvn-site.td-site .td-menu__list>li>.bvn-menu__item>a::after{
  content:"";position:absolute;left:0;right:0;bottom:-9px;height:3px;
  border-radius:3px;background:var(--td-blue);transform:scaleX(0);
  transform-origin:center;transition:transform .26s cubic-bezier(.2,.8,.2,1);pointer-events:none;
}
.bvn-site.td-site .td-menu__list>li:is(:hover,:focus-within,.is-current-section)>a,
.bvn-site.td-site .td-menu__list>li:is(:hover,:focus-within,.is-current-section)>.bvn-menu__item>a,
.bvn-site.td-site .td-menu__list>li>a.is-active,
.bvn-site.td-site .td-menu__list>li>.bvn-menu__item>a.is-active{color:var(--td-blue);font-weight:600}
.bvn-site.td-site .td-menu__list>li:is(:hover,:focus-within,.is-current-section)>a::after,
.bvn-site.td-site .td-menu__list>li:is(:hover,:focus-within,.is-current-section)>.bvn-menu__item>a::after{transform:scaleX(1)}
.bvn-site.td-site .td-menu .bvn-menu__item>button{border-radius:5px;transition:color .22s ease,background-color .22s ease}
.bvn-site.td-site .td-menu .bvn-menu__item>button i{display:inline-block;transition:transform .24s ease}
.bvn-site.td-site .td-has-submenu:is(:hover,:focus-within,.is-open,.is-current-section)>.bvn-menu__item>button{color:var(--td-blue)}
.bvn-site.td-site .td-has-submenu:is(:hover,.is-open)>.bvn-menu__item>button i{transform:rotate(180deg)}
.bvn-site.td-site .td-submenu{border-radius:0 0 9px 9px;box-shadow:0 17px 34px #092e4f28}
.bvn-site.td-site .td-submenu a{position:relative;transition:background-color .2s ease,color .2s ease,padding-left .2s ease}
.bvn-site.td-site .td-submenu a:is(:hover,:focus-visible,.is-active,[aria-current="page"]){
  padding-left:22px;background:#eaf4fe;color:var(--td-blue);font-weight:600;
}
.bvn-site.td-site .td-submenu a:is(.is-active,[aria-current="page"])::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--td-blue);border-radius:0 3px 3px 0;
}
.bvn-site.td-site .td-navigation{transition:height .28s ease,box-shadow .28s ease,background-color .28s ease}

/* Hover nâng nhẹ card, giữ đúng ảnh sản phẩm (không ép object-fit:cover). */
.bvn-site.td-site .bvn-subpage-body :is(
 .bvn-news-listing__card,.dap-project-post,.news-template-list1-card,
 .bvn-blog-news__card,.bvn-blog-press__card,.product-list-card,
 .grid-news .item-news,.grid-product>.product,.album
){transition:box-shadow .3s ease,transform .3s ease,border-color .3s ease}
@media(hover:hover) and (pointer:fine){
 .bvn-site.td-site .bvn-subpage-body :is(
  .bvn-news-listing__card,.dap-project-post,.news-template-list1-card,
  .bvn-blog-news__card,.bvn-blog-press__card,.product-list-card,
  .grid-news .item-news,.grid-product>.product,.album
 ):hover{transform:translateY(-5px);border-color:#b9d7f0;box-shadow:0 15px 32px #153f6224}
 .bvn-site.td-site .bvn-subpage-body :is(
  .bvn-news-listing__card,.dap-project-post,.product-list-card,.grid-product>.product
 ):hover img{filter:saturate(1.07)}
}
.bvn-site.td-site .bvn-subpage-body :is(.dap-news-page__filters a,.bvn-blog-page__tabs a,.bvn-blog-page__view-all,.bvn-news-listing__more,.dap-project-post__read){transition:background-color .23s ease,color .23s ease,transform .23s ease,border-color .23s ease}
.bvn-site.td-site .bvn-subpage-body :is(.bvn-news-listing__more,.dap-project-post__read,.bvn-blog-page__view-all):hover{transform:translateX(3px)}
.bvn-site.td-site .bvn-subpage-body :is(.bvn-contact__form .bvn-button,.dap-services__more,.td-button):active{transform:translateY(1px)}

/* Chỉ làm hiệu ứng cuộn nếu JS có IntersectionObserver; không che nội dung khi JS tắt. */
.bvn-site.td-site .bvn-subpage-body .td-reveal{transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.25,1)}
.bvn-site.td-site .bvn-subpage-body .td-reveal.is-pending{
  opacity:0;transform:translateY(18px);transition-delay:var(--td-reveal-delay,0ms);
}
@media(max-width:1025px){
  .bvn-site.td-site .td-menu__list>li>a::after,
  .bvn-site.td-site .td-menu__list>li>.bvn-menu__item>a::after{bottom:4px;left:0;right:auto;width:38px;height:2px;transform-origin:left}
  .bvn-site.td-site .td-menu__list>li:is(.is-current-section)>a,
  .bvn-site.td-site .td-menu__list>li:is(.is-current-section)>.bvn-menu__item>a{color:var(--td-blue);font-weight:700}
  .bvn-site.td-site .td-menu .bvn-menu__item>button{min-width:40px;min-height:40px}
}
@media(hover:none){
  .bvn-site.td-site .bvn-subpage-body .td-reveal{transition-duration:.35s}
}
@media(prefers-reduced-motion:reduce){
  .bvn-site.td-site .bvn-subpage-body .td-reveal.is-pending{opacity:1;transform:none}
}

/* =============================================================
   SILKEE LANDING PAGE / Figma 1920 x 10788
   Scoped to .sk-site. Only the already existing CSS file is used.
   ============================================================= */
.sk-site{--td-blue:#32b5b7;--td-dark:#183b56;--td-light:#e3fdfe;--td-text:#183b56;--td-width:1440px;font-family:'Open Sans',Arial,sans-serif!important;color:#183b56}
.sk-site :is(.sk-container,.td-container){width:min(1440px,calc(100% - 48px));margin-inline:auto;max-width:1440px}
.sk-site .sk-heading{margin:0 0 36px;color:#32b5b7;font-size:clamp(30px,2.4vw,46px);line-height:1.34;font-weight:700;text-align:center;text-transform:none}
.sk-site .sk-pill{display:inline-flex;align-items:center;justify-content:center;padding:12px 30px;border:0;min-height:58px;border-radius:999px;color:#fff;background:linear-gradient(188deg,#32b5b7 7%,#a5e9d6 86%);font:700 18px/1.4 'Open Sans',sans-serif;text-decoration:none;cursor:pointer;transition:transform .24s,box-shadow .24s,background .24s}
.sk-site .sk-pill:hover{color:#fff;transform:translateY(-3px);box-shadow:0 10px 25px #32b5b74a}
.sk-site .sk-pill--white{background:#fff;color:#32b5b7}
.sk-site .sk-pill--white:hover{color:#008f91;background:#f0ffff}
.sk-site :is(a,button):focus-visible{outline:3px solid #32b5b7;outline-offset:4px}
.sk-site .sk-section{position:relative;overflow:hidden}
.sk-site :is(.sk-about,.sk-difference,.sk-philosophy,.sk-certificates,.sk-artwork,.sk-products,.sk-applications,.sk-activities,.sk-reviews){scroll-margin-top:78px}
.sk-site .sk-topbar,.sk-site .td-topbar{height:38px!important;background:#32b5b7!important}
.sk-site .sk-navigation,.sk-site .sk-navigation.is-stuck{position:sticky;top:0;z-index:90;height:96px!important;background:#fff;padding:0!important;box-shadow:0 2px 8px #183b560d;transition:height .3s,box-shadow .3s}
.sk-site .sk-navigation.is-stuck{height:75px!important;box-shadow:0 7px 22px #183b5622}
.sk-site .sk-navigation__inner{width:min(1440px,calc(100% - 48px));height:100%;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 200px minmax(0,1fr);align-items:center;gap:20px}
.sk-site .sk-navigation__left,.sk-site .sk-navigation__right{display:flex;align-items:center;justify-content:space-between;min-width:0;gap:clamp(12px,1.8vw,32px)}
.sk-site .sk-navigation__left{padding-right:16px}
.sk-site .sk-navigation__right{padding-left:16px}
.sk-site .sk-navigation__brand{display:flex;align-items:center;justify-content:center;max-width:200px;height:88px}
.sk-site .sk-navigation__brand img{width:164px;height:72px;object-fit:contain;transition:width .3s,height .3s}
.sk-site .sk-navigation__brand span,.sk-site .sk-footer__logo span{font:italic 700 50px/1 Georgia,serif;color:#32b5b7;letter-spacing:-4px}
.sk-site .sk-navigation.is-stuck .sk-navigation__brand img{width:130px;height:57px}
.sk-site .sk-navigation__link{padding:4px 0!important;border:0!important;background:none!important;color:#5b6166!important;font:600 clamp(12px,.86vw,17px)/1.5 'Open Sans',sans-serif!important;text-transform:uppercase;white-space:nowrap;position:relative;text-decoration:none}
.sk-site .sk-navigation__link::after{content:'';height:2px;left:0;right:0;bottom:-4px;position:absolute;background:#32b5b7;transform:scaleX(0);transition:transform .25s}
.sk-site .sk-navigation__link:hover,.sk-site .sk-navigation__link:focus-visible{color:#32b5b7!important}
.sk-site .sk-navigation__link:hover::after,.sk-site .sk-navigation__link:focus-visible::after{transform:scaleX(1)}
.sk-site .sk-search{display:flex;align-items:center;position:relative;margin:0}
.sk-site .sk-search>button{display:grid;place-items:center;width:29px;height:29px;border:0;background:none;color:#5b6166;font-size:20px}
.sk-site .sk-search__field{position:absolute;left:0;top:calc(100% + 24px);width:300px;max-width:min(300px,86vw);background:#fff;border-radius:12px;box-shadow:0 8px 28px #183b562d;padding:9px;opacity:0;visibility:hidden;transform:translateY(-5px);transition:all .2s;z-index:5}
.sk-site .sk-search.is-open .sk-search__field{opacity:1;visibility:visible;transform:none}
.sk-site .sk-search__field input{border:1px solid #d4efef;border-radius:8px;width:100%;font-size:14px;padding:11px}
.sk-site .sk-follow{position:relative;font-size:clamp(12px,.85vw,17px);font-weight:600;white-space:nowrap;color:#5b6166}
.sk-site .sk-follow__trigger{border:0;background:transparent;color:inherit;font:inherit;padding:4px;cursor:pointer}
.sk-site .sk-follow__items{display:flex;position:absolute;top:calc(100% + 12px);right:0;gap:8px;background:#fff;padding:10px;border-radius:14px;box-shadow:0 10px 26px #183b5630;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .22s;z-index:20}
.sk-site .sk-follow:hover .sk-follow__items,.sk-site .sk-follow:focus-within .sk-follow__items,.sk-site .sk-follow.is-open .sk-follow__items{opacity:1;visibility:visible;transform:none}
.sk-site .sk-follow__items a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#f0fbfb;color:#32b5b7;transition:transform .18s ease,background-color .18s ease}
.sk-site .sk-follow__items a:hover,.sk-site .sk-follow__items a:focus-visible{transform:translateY(-2px);background:#d8f5ef}
.sk-site .sk-languages{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.sk-site .sk-languages button{gap:5px;border:0;background:none;color:#50565a;font:600 14px/1.2 'Open Sans',sans-serif;opacity:.75;padding:4px;display:flex;align-items:center}
.sk-site .sk-languages button.is-active{opacity:1;font-weight:800;color:#353b3f}
.sk-site .sk-languages button img{width:31px;height:20px;object-fit:cover}
.sk-site .sk-languages__divider,.sk-site .td-languages__divider{height:21px;border-color:#b0b4b6}
.sk-site .sk-mobile-menu,.sk-site .sk-menu-toggle{display:none}
/* Hero: each visible slide is rendered from its Dashboard record. */
.sk-site .sk-hero{position:relative;background:linear-gradient(115deg,#a5e9d6,#32b5b7);min-height:0;isolation:isolate}
.sk-site .sk-hero__swiper{width:100%;overflow:hidden}
.sk-site .sk-hero__slide{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1920/833;min-height:0;padding:80px 24px;background-image:var(--sk-slide,linear-gradient(115deg,#a5e9d6,#32b5b7));background-size:cover;background-position:center}
.sk-site .sk-hero__copy{text-align:center;max-width:650px;padding:20px 25px;color:#fff;text-shadow:0 2px 16px #146e7333}
.sk-site .sk-hero__kicker{display:inline-block;color:#32b5b7;background:#fff;border-radius:100px;padding:6px 28px;font-size:clamp(18px,1.8vw,34px);line-height:1.3}
.sk-site .sk-hero__copy h1,.sk-site .sk-hero__copy h2{margin:14px 0;color:#fff;text-transform:uppercase;font-size:clamp(42px,4vw,74px);line-height:1.1;font-weight:800;-webkit-text-stroke:1px #32b5b7;text-shadow:3px 5px 0 #077578}
.sk-site .sk-hero__copy p{color:#fff;font-size:clamp(20px,2.2vw,43px);font-weight:700;line-height:1.4;margin:0 0 38px}
.sk-site .sk-hero__controls{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;color:#fff;z-index:5;font-size:17px;font-weight:700}
.sk-site .sk-hero__line{width:188px;height:2px;background:#ffffffaa}
.sk-site .sk-hero__controls button{border:0;background:none;color:#fff;font-size:25px;padding:4px 7px}
/* About / brand philosophy */
.sk-site .sk-about{padding:88px 0 55px;background:#fff}
.sk-site .sk-about__layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;min-height:443px}
.sk-site .sk-about__body h2{font-size:46px;font-weight:700;line-height:1.35;color:#32b5b7;margin:0 0 24px}
.sk-site .sk-about__body :is(p,.sk-copy){font-size:18px;line-height:1.6;color:#183b56;margin:0 0 18px}
.sk-site .sk-about__photo{width:100%;height:443px;object-fit:cover}
.sk-site .sk-difference{background:linear-gradient(160deg,#fff,#e5fafa 70%,#fff);min-height:0}
.sk-site .sk-difference__canvas{position:relative;min-height:710px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(350px,.75fr);align-items:center;gap:50px;padding-block:85px}
.sk-site .sk-difference__canvas>img{display:block;width:100%;max-height:1442px;object-fit:contain}
.sk-site .sk-difference__copy{position:relative;top:auto;right:auto;width:auto;text-align:right;z-index:2}
.sk-site .sk-difference__copy h2{color:#32b5b7;font-weight:700;font-size:clamp(27px,2vw,40px)}
.sk-site .sk-difference__copy p{font-size:18px;color:#183b56}
.sk-site .sk-philosophy{display:flex;align-items:center;justify-content:center;min-height:645px;margin-top:-60px;padding:55px 24px;background-color:#79d6d6;background-image:var(--sk-philosophy-bg,linear-gradient(125deg,#55c4c7 0%,#b4f1e4 42%,#30b8bd 100%));background-position:center;background-size:cover;background-repeat:no-repeat}
.sk-site .sk-philosophy__reference{display:block;width:min(953px,100%);height:auto}
.sk-site .sk-philosophy__card{width:min(953px,100%);min-height:368px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:45px 55px;background:#fff;border-radius:21px;text-align:center}
.sk-site .sk-philosophy__card h2{font-size:46px;color:#32b5b7;font-weight:700;margin:0 0 18px}
.sk-site .sk-philosophy__card p,.sk-site .sk-philosophy__card .sk-copy{color:#183b56;font-size:18px;line-height:1.6;margin:0 0 20px}
.sk-site .sk-certificates{padding:72px 0 60px;background:#fff}
.sk-site .sk-certificates__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:55px}
.sk-site .sk-certificates__item{text-align:center}
.sk-site .sk-certificates__item img{width:345px;max-width:100%;height:345px;object-fit:contain;margin:0 auto 15px}
.sk-site .sk-certificates__item h3{font-size:28px;line-height:1.3;color:#183b56;font-weight:700;margin:0 0 8px}
.sk-site .sk-certificates__item p{font-size:17px;line-height:1.6;margin:0}
.sk-site .sk-certificates__swiper{width:100%;overflow:hidden}
.sk-site .sk-certificates__swiper .swiper-slide{height:auto}
/* Product campaigns and shopping */
.sk-site .sk-artwork>img{display:block;width:100%;height:auto}
.sk-site #bvn-main .sk-artwork--full{width:100vw;max-width:none;margin-left:50%;margin-right:0;transform:translateX(-50%);background:#fff}
.sk-site #bvn-main .sk-artwork--full:before{content:none}
.sk-site #bvn-main .sk-artwork--full>img{display:block;width:100%;max-width:none;height:auto;aspect-ratio:1919/886;object-fit:contain;margin:0;filter:none;transform:none}
.sk-site .sk-artwork__text{min-height:740px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center}
.sk-site .sk-artwork--sakura{background:linear-gradient(120deg,#a5e9d6,#32b5b7);color:#fff}
.sk-site .sk-artwork--supreme{background:#fff;color:#183b56}
.sk-site .sk-artwork__text h2{font-size:46px;font-weight:700;color:inherit;margin:0}
.sk-site .sk-artwork__text p{font-size:24px;margin:0}
.sk-site .sk-products{background:linear-gradient(180deg,#fff 0%,#e3fdfe 85%,#fff 100%);padding:72px 0 64px}
.sk-site .sk-products--deep{background:linear-gradient(180deg,#fff 0%,#e3fdfe 80%,#fff 100%)}
.sk-site .sk-products--has-background{background-position:center;background-repeat:no-repeat;background-size:cover}
.sk-site .sk-products__swiper{width:100%;padding:10px 8px 28px;margin:-10px -8px -28px;overflow:hidden}
.sk-site .sk-product{display:flex;flex-direction:column;min-height:545px;height:100%;padding:23px 23px 20px;border-radius:20px;box-shadow:0 4px 20px #32b5b733;background:#fff;transition:transform .24s,box-shadow .24s}
.sk-site .sk-product:hover{transform:translateY(-6px);box-shadow:0 12px 27px #32b5b73d}
.sk-site .sk-product__image{display:flex;align-items:center;justify-content:center;height:366px;border-bottom:1px solid #f2f2f2}
.sk-site .sk-product__image img{width:422px;max-width:100%;height:366px;object-fit:contain;transition:transform .3s}
.sk-site .sk-product:hover .sk-product__image img{transform:scale(1.035)}
/* Light sweep on Dashboard images: product cards, care applications and activity album. */
.sk-site :is(.sk-product__image,.sk-applications__card,.sk-activities__track figure){position:relative;overflow:hidden}
.sk-site :is(.sk-product__image,.sk-applications__card,.sk-activities__track figure)::after{content:'';position:absolute;z-index:5;top:-55%;left:-72%;width:38%;height:210%;pointer-events:none;background:linear-gradient(105deg,transparent 22%,rgba(255,255,255,.08) 36%,rgba(255,255,255,.72) 50%,rgba(255,255,255,.12) 64%,transparent 78%);transform:skewX(-19deg);opacity:0}
.sk-site :is(.sk-product:hover .sk-product__image,.sk-applications__card:hover,.sk-activities__track figure:hover)::after{animation:sk-image-shine .8s ease-out}
@keyframes sk-image-shine{0%{left:-72%;opacity:0}12%{opacity:1}100%{left:142%;opacity:0}}
.sk-site .sk-product h3{flex:1;font-size:19px;line-height:1.4;text-align:center;font-weight:700;color:#5b6166;margin:24px 0 18px;min-height:55px}
.sk-site .sk-product__buttons{display:flex;gap:13px;justify-content:center}
.sk-site .sk-product__buttons--detail{max-width:440px;margin:24px 0}
.sk-site .sk-market{box-sizing:border-box;flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:49px;padding:12px 20px;background:#fff;border:1px solid currentColor;border-radius:999px;font-size:15px;font-weight:700;line-height:1.2;white-space:nowrap;transition:transform .2s,box-shadow .2s,background-color .2s}
.sk-site .sk-market i{display:inline-block;flex:0 0 auto;font-size:17px;line-height:1}
.sk-site .sk-market--tiktok{color:#000}
.sk-site .sk-market--tiktok i{text-shadow:1px 0 #25f4ee,-1px 0 #fe2c55}
.sk-site .sk-market--shopee{color:#ee4d2d}
.sk-site .sk-market--shopee i{font-size:16px}
.sk-site .sk-market:hover{transform:translateY(-2px);box-shadow:0 7px 14px #2020201f}
.sk-site .sk-market--tiktok:hover{background:#f7f7f7;color:#000}
.sk-site .sk-market--shopee:hover{background:#fff6f3;color:#ee4d2d}
.sk-site .sk-product__detail{font-size:15px;min-height:47px;width:100%;padding:8px 13px}
.sk-site .sk-progress{width:168px;height:9px;display:block;overflow:hidden;border-radius:10px;background:#dedede;margin:40px auto 0}
.sk-site .sk-progress>span{display:block;width:50%;height:100%;border-radius:inherit;background:#32b5b7;transition:transform .35s}
.sk-site .sk-related-products{margin-top:65px;padding:52px 34px 56px;border:0;border-radius:20px;background:linear-gradient(180deg,#fff 0%,#e3fdfe 85%,#fff 100%)}
.sk-site .sk-related-products .sk-heading{margin-bottom:36px}
.sk-site .sk-related-products .swiper{padding:10px 8px 28px;margin:-10px -8px -28px}
/* Applications + activity gallery */
.sk-site .sk-applications{padding:120px 0 100px;background:linear-gradient(180deg,#e3fdfe 0%,#fff 90%)}
.sk-site .sk-applications--has-background{background-repeat:no-repeat;background-position:center top;background-size:cover}
.sk-site .sk-applications__top{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:35px}
.sk-site .sk-applications__top .sk-heading{margin:0;font-size:46px;line-height:63px;text-align:left}
.sk-site .sk-applications__top>p{font-size:20px;line-height:27px;text-align:right;max-width:522px;margin:0}
.sk-site .sk-applications__grid{display:grid;grid-template-columns:686px 338.824px minmax(0,1fr);grid-template-rows:repeat(2,222px);gap:22px}
.sk-site .sk-applications__card{position:relative;display:flex;flex-direction:column;justify-content:center;background:#fff;border-radius:25px;box-shadow:0 4px 20px #32b5b733;overflow:hidden;padding:25px}
.sk-site .sk-applications__card--1{grid-column:1;grid-row:1/3;padding:0;justify-content:flex-start}
.sk-site .sk-applications__card--2{grid-column:2;grid-row:1/3;justify-content:flex-start}
.sk-site .sk-applications__card--3{grid-column:3;grid-row:1}
.sk-site .sk-applications__card--4{grid-column:3;grid-row:2}
.sk-site .sk-applications__card h3{font-size:27px;line-height:1.25;font-weight:700;color:#32b5b7;margin:0 0 10px}
.sk-site .sk-applications__card p{font-size:16px;line-height:1.6;color:#183b56;margin:0 0 12px}
.sk-site .sk-applications__card a{font-weight:700;color:#32b5b7;font-size:17px}
.sk-site .sk-applications__card img{display:block;width:auto;max-width:80%;max-height:65%;object-fit:contain;position:absolute;right:0;bottom:0}
.sk-site .sk-applications__card--3 img,.sk-site .sk-applications__card--4 img{width:68px;max-width:none;height:90px;max-height:none;object-fit:contain;left:20px;right:auto;top:50%;bottom:auto;transform:translateY(-50%)}
.sk-site .sk-applications__card--3 .sk-applications__card-copy,.sk-site .sk-applications__card--4 .sk-applications__card-copy{padding-left:95px}
.sk-site .sk-applications__card--1 .sk-applications__card-copy{position:absolute;z-index:1;top:79px;left:58px;display:flex;flex-direction:column;align-items:flex-start;gap:31px;width:249px}
.sk-site .sk-applications__card--1 h3{width:249px;margin:0 0 6px;font-size:32px;line-height:44px}
.sk-site .sk-applications__card--1 p{width:249px;margin:0;font-size:18px;line-height:28px}
.sk-site .sk-applications__card--1 .sk-applications__more{display:flex;align-items:center;gap:14px;height:56px;padding:0;border:0;background:transparent;font:700 18px/28px 'Open Sans',sans-serif;color:#32b5b7;text-decoration:none;cursor:pointer}
.sk-site .sk-applications__card--1 .sk-applications__more i{display:grid;place-items:center;width:56px;height:56px;border-radius:999px;background:linear-gradient(188.12deg,#32b5b7 6.79%,#a5e9d6 85.71%);color:#fff;font-size:24px}
.sk-video-modal{position:fixed;z-index:1200;inset:0;display:none;align-items:center;justify-content:center;padding:24px}
.sk-video-modal.is-open{display:flex}
.sk-video-modal__backdrop{position:absolute;inset:0;border:0;background:#183b56bf;cursor:pointer}
.sk-video-modal__dialog{position:relative;z-index:1;width:min(960px,100%);border-radius:18px;background:#fff;padding:12px;box-shadow:0 20px 50px #0005}
.sk-video-modal__close{position:absolute;z-index:2;right:-14px;top:-14px;display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:999px;background:#32b5b7;color:#fff;font-size:28px;line-height:1;cursor:pointer}
.sk-video-modal__frame{width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:10px;background:#000}
.sk-video-modal__frame :is(video,iframe){display:block;width:100%;height:100%;border:0}
.sk-site .sk-applications__card--1 img{top:0;right:0;bottom:auto;width:526px;max-width:none;height:469px;max-height:none;object-fit:cover;border-radius:0}
.sk-site .sk-applications__card--2 img{right:0;bottom:0;width:338.824px;max-width:none;height:338.824px;max-height:none;object-fit:cover;border-radius:0}
.sk-site .sk-activities{overflow:hidden;padding:82px 0 0;background:#fff}
.sk-site .sk-activities .sk-heading{margin:0 0 5px}
.sk-site .sk-activities__lead{text-align:center;font-size:18px;line-height:1.6;margin:0 auto 40px;max-width:1050px}
.sk-site .sk-activities__lane{width:100%;overflow:hidden;margin-top:25px}
.sk-site .sk-activities__track{display:flex;width:max-content;gap:24px;will-change:transform;animation:sk-marquee-left 48s linear infinite}
.sk-site .sk-activities__track--right{animation-name:sk-marquee-right;transform:translateX(-50%)}
.sk-site .sk-activities__lane:hover .sk-activities__track{animation-play-state:paused}
.sk-site .sk-activities__track figure{box-sizing:border-box;margin:0;flex:none;width:460px;height:336px;border-left:12px solid #32b5b7;background:#e3fdfe;overflow:hidden}
.sk-site .sk-activities__track img{display:block;width:100%;height:100%;object-fit:cover}
@keyframes sk-marquee-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes sk-marquee-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}
/* Customer cards */
.sk-site .sk-reviews{padding:95px 0 105px;background:#f5fdfe;position:relative;overflow:hidden}
.sk-site .sk-reviews .sk-container{width:min(1610px,calc(100% - 48px));max-width:1610px}
.sk-site .sk-reviews--has-background{background-repeat:no-repeat;background-position:center top;background-size:100% 100%;background-color:#f5fdfe}
.sk-site .sk-reviews:after{content:'';position:absolute;left:-5%;right:-5%;bottom:-65px;height:110px;border-radius:50% 50% 0 0;background:#fff}
.sk-site .sk-reviews__top{display:flex;width:1440px;max-width:100%;margin:0 auto 80px;justify-content:space-between;align-items:center;gap:349px}
.sk-site .sk-reviews__title{flex:0 1 714px;min-width:0}
.sk-site .sk-reviews__top .sk-heading{margin:0;text-align:left}
.sk-site .sk-reviews__meta{display:flex;align-items:center;gap:14px;flex:0 0 auto;color:#5b6166}
.sk-site .sk-reviews__description{width:201px;margin:0;color:#5b6166;font-size:17px;font-weight:600;line-height:23px}
.sk-site .sk-reviews__description p{margin:0}
.sk-site .sk-reviews__avatars{display:flex;align-items:center;width:126px;flex:none}
.sk-site .sk-reviews__avatars img{width:50px;height:50px;border-radius:50%;border:2px solid #fff;object-fit:cover;margin-left:-11px}
.sk-site .sk-reviews__avatars img:first-child{margin-left:0}
.sk-site .sk-reviews__more{width:50px;height:50px;border:2px solid #fff;border-radius:50%;display:grid;place-items:center;flex:none;background:linear-gradient(188deg,#32b5b7 7%,#a5e9d6 86%);color:#fafafa;font-size:24px}
.sk-site .sk-reviews__shell{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:30px;align-items:center}
.sk-site .sk-reviews__swiper{min-width:0;width:100%;padding:12px;margin:-12px;overflow:hidden}
.sk-site .sk-reviews__shell--static{display:block}
.sk-site .sk-reviews__static-list{display:flex;align-items:stretch;justify-content:center;gap:21px}
.sk-site .sk-reviews__static-item{box-sizing:border-box;flex:0 1 466px;max-width:466px}
.sk-site .sk-reviews__swiper .swiper-slide{box-sizing:border-box;display:flex;justify-content:center}
.sk-site .sk-arrow{border:0;background:none;font-size:30px;color:#32b5b7;width:52px;height:52px}
.sk-site .sk-review{box-sizing:border-box;width:466px;height:289px;background:#fff;border-radius:20px;box-shadow:0 4px 20px #32b5b72b;display:flex;flex-direction:column;justify-content:space-between;padding:28px;color:#5b6166}
@media(max-width:1099px){.sk-site .sk-reviews .sk-container{width:min(1440px,calc(100% - 48px));max-width:1440px}.sk-site .sk-reviews__static-list{flex-wrap:wrap}.sk-site .sk-review{width:100%}}
.sk-site .sk-review__head{display:flex;justify-content:space-between;align-items:center}
.sk-site .sk-review__head>span:first-child{font:900 77px/1 Georgia,serif;color:#e0f4f4}
.sk-site .sk-review__stars{color:#ffe2a1;font-size:25px;letter-spacing:3px}
.sk-site .sk-review blockquote{font-size:18px;line-height:1.5;font-weight:400;margin:0 0 18px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.sk-site .sk-review__person{display:flex;gap:16px;align-items:center}
.sk-site .sk-review__person img{width:64.434px;height:64.434px;border-radius:50%;object-fit:cover}
.sk-site .sk-review__person strong{font-size:22px;font-weight:700;display:block;line-height:1.3}
.sk-site .sk-review__person span{font-size:17px}
/* Figma-inspired four-column footer, populated from Dashboard on every page. */
.sk-site .sk-footer{position:relative;overflow:hidden;background:linear-gradient(247deg,#32b5b7 11%,#a5e9d6 113%);color:#fff}
.sk-site .sk-footer--has-background{background-repeat:no-repeat;background-position:center top;background-size:100% 100%}
.sk-site .sk-footer__grid{min-height:615px;display:grid;grid-template-columns:1.15fr .8fr .65fr 1.25fr;gap:clamp(40px,5vw,120px);padding-top:130px;padding-bottom:100px}
.sk-site .sk-footer__brand{max-width:327px}
.sk-site .sk-footer__logo{display:block;max-width:175px;margin-bottom:22px}
.sk-site .sk-footer__logo img{width:175px;height:76px;object-fit:contain}
.sk-site .sk-footer__logo span{color:#fff}
.sk-site .sk-footer__intro{font-size:18px;line-height:1.55;font-weight:600;margin-bottom:40px}
.sk-site .sk-footer__column h2{font-size:20px;line-height:1.5;font-weight:700;margin:0 0 13px;color:#fff}
.sk-site .sk-footer__column>a{display:block;color:#fff;font-size:16px;line-height:1.6;margin-bottom:10px}
.sk-site .sk-footer__column a:hover{color:#e3fdfe}
.sk-site .sk-footer__rich,.sk-site .sk-footer__contact p{font-size:16px;line-height:1.6;color:#fff}
.sk-site .sk-footer__contact p{display:flex;gap:15px;margin:0 0 18px}
.sk-site .sk-footer__contact i{flex:none}
.sk-site .sk-footer__social{display:flex;gap:12px}
.sk-site .sk-footer__social a{background:#fff;color:#32b5b7;border-radius:50%;width:50px;height:50px;display:grid;place-items:center;transition:transform .2s}
.sk-site .sk-footer__social svg{width:23px;height:23px;display:block;fill:currentColor}
.sk-site .sk-footer__social a:hover{transform:translateY(-4px)}
.sk-site .sk-footer__bottom{text-align:center;border-top:1px solid #ffffff77;padding:14px;margin:0;width:100%;font-size:12px;color:#fff}
.sk-site .sk-footer__reference{width:100%;height:auto}
/* Order / consultation dialog */
.sk-buy-modal[hidden]{display:none!important}
.sk-buy-modal{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:20px}
.sk-buy-modal__shade{position:absolute;inset:0;background:#092c3499;backdrop-filter:blur(5px)}
.sk-buy-modal__panel{position:relative;z-index:2;width:min(515px,100%);max-height:calc(100dvh - 40px);overflow-y:auto;background:#fff;border-radius:22px;padding:35px;color:#183b56;box-shadow:0 16px 60px #042b3460}
.sk-buy-modal__panel h2{font-size:28px;line-height:1.3;color:#32b5b7;font-weight:700;margin:0 34px 10px 0}
.sk-buy-modal__panel p{font-size:15px;line-height:1.5;margin:0 0 20px}
.sk-buy-modal__close{position:absolute;right:19px;top:19px;border:0;background:#e3fdfe;border-radius:50%;width:35px;height:35px;color:#18787e}
.sk-buy-modal__form{display:grid;gap:14px}
.sk-buy-modal__form label{font-weight:600;font-size:15px;display:grid;gap:7px}
.sk-buy-modal__form :is(input,textarea){display:block;width:100%;padding:12px;border:1px solid #c3dfe2;border-radius:9px;font-weight:400;outline-offset:3px}
.sk-buy-modal__honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}
/* Progressive movement; no hidden content when JS is unavailable. */
.sk-site .sk-animate-in{transition:opacity .65s ease,transform .65s ease}
.sk-site .sk-animate-in.sk-pending{opacity:0;transform:translateY(26px)}
@media(prefers-reduced-motion:reduce){.sk-site .sk-animate-in.sk-pending{opacity:1;transform:none}.sk-site .sk-activities__track{animation:none!important;transform:none!important}.sk-site :is(.sk-product__image,.sk-applications__card,.sk-activities__track figure)::after{animation:none!important}}
.sk-site .sk-navigation__link.sk-current,.sk-site .sk-navigation__link[aria-current="location"]{color:#32b5b7!important}
.sk-site .sk-navigation__link.sk-current::after{transform:scaleX(1)}
body.sk-modal-open{overflow:hidden!important}
.sk-site .sk-footer__social img,.sk-site .sk-follow__items img{display:block;width:22px;height:22px;object-fit:contain}


/* SILKEE — editable HTML sections; independent Dashboard image slots.
   Decorative gradients never contain embedded headings, products or clickable artwork. */
.sk-site .sk-section__lead{max-width:830px;text-align:center;margin:-14px auto 37px;color:#426978;font-size:17px;line-height:1.65}
.sk-site .sk-about__visual{min-width:0;position:relative}
.sk-site .sk-about__photo{border-radius:10px;box-shadow:0 20px 45px #1a8e9520}
.sk-site #bvn-main .sk-difference{position:relative;width:100vw;max-width:none;margin-left:50%;margin-right:0;transform:translateX(-50%);background:#fff}
.sk-site .sk-difference__image{display:block;width:100%;max-width:none;height:auto;aspect-ratio:1920/1382;object-fit:contain;margin:0}
.sk-site #bvn-main .sk-difference__copy{position:absolute;z-index:2;top:12.1%;left:59.739583%;right:auto;display:flex;flex-direction:column;align-items:flex-start;gap:10px;width:535px;height:194px;padding:0;text-align:right}
.sk-site #bvn-main .sk-difference__copy h2{align-self:stretch;flex:none;order:0;width:535px;min-height:126px;margin:0;color:#32b5b7;font-family:'Open Sans',Arial,sans-serif;font-size:46px;font-style:normal;font-weight:700;line-height:63px;text-align:right;text-transform:capitalize}
.sk-site #bvn-main .sk-difference__copy p{align-self:stretch;flex:none;order:1;width:535px;min-height:58px;margin:0;color:#183b56;font-family:'Open Sans',Arial,sans-serif;font-size:18px;font-style:normal;font-weight:400;line-height:28px;text-align:right}
.sk-site .sk-difference__visual{min-height:580px;position:relative;isolation:isolate;display:flex;align-items:end;justify-content:space-evenly;gap:0;padding:35px}
.sk-site .sk-difference__visual:before{content:'';position:absolute;z-index:-2;inset:12% -5% 8% -7%;border:solid 85px transparent;border-top-color:#26b7b7;border-bottom-color:#b2efde;border-radius:50% 8% 55% 12%;transform:rotate(-16deg);filter:drop-shadow(10px 14px 10px #3ac5c522)}
.sk-site .sk-difference__visual:after{content:'';position:absolute;z-index:-3;inset:6% 7% 16% 7%;border:2px dotted #5cc7c4;border-radius:50%;opacity:.58}
.sk-site .sk-difference__ribbon{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:-1;pointer-events:none}
.sk-site .sk-difference__pack{height:min(475px,39vw);max-width:46%;width:auto;object-fit:contain;filter:drop-shadow(0 20px 23px #08545724);transition:transform .45s ease}
.sk-site .sk-difference__pack--round{transform:rotate(-10deg) translateY(-20px)}
.sk-site .sk-difference__pack--square{transform:rotate(7deg) translateY(35px)}
.sk-site .sk-difference__visual:hover .sk-difference__pack--round{transform:rotate(-5deg) translateY(-30px)}
.sk-site .sk-difference__visual:hover .sk-difference__pack--square{transform:rotate(3deg) translateY(24px)}
.sk-site .sk-difference__copy h2{font-size:clamp(28px,3vw,47px);line-height:1.25;margin:0 0 20px}
.sk-site .sk-difference__copy p,.sk-site .sk-difference__copy .sk-copy{font-size:18px;line-height:1.65;color:#426978}
.sk-site .sk-philosophy__card{box-shadow:0 14px 50px #107f8530;position:relative}
.sk-site .sk-philosophy__card:before{content:none}
.sk-site .sk-artwork{position:relative;overflow:hidden;isolation:isolate}
.sk-site .sk-artwork:before{content:'';position:absolute;z-index:-1;inset:7% -18% 6% 43%;border:3px solid #ffffff69;border-radius:50%}
.sk-site .sk-artwork--supreme:before{border-color:#a5e9d692}
.sk-site .sk-artwork__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:35px;min-height:660px;padding-block:45px}
.sk-site .sk-artwork__text{min-height:0;text-align:left;align-items:flex-start;justify-content:center;max-width:650px}
.sk-site .sk-artwork__text h2{font-size:clamp(32px,3.35vw,55px);line-height:1.15}
.sk-site .sk-artwork__text p{font-size:clamp(18px,1.8vw,26px);line-height:1.5}
.sk-site .sk-artwork__text .sk-copy{font-size:18px;line-height:1.7}
.sk-site .sk-artwork__visual{display:grid;place-items:center;position:relative;min-height:560px;isolation:isolate}
.sk-site .sk-artwork__visual:before{content:'';position:absolute;z-index:-1;width:min(95%,570px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff9,#ffffff26 44%,transparent 62%);border:2px dotted #ffffff9c}
.sk-site .sk-artwork--supreme .sk-artwork__visual:before{background:linear-gradient(160deg,#f1ffff,#beeeee);border-color:#2fbcb6a1}
.sk-site .sk-artwork__visual img{max-width:100%;max-height:620px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 28px 25px #01474938);transition:transform .4s ease}
.sk-site .sk-artwork__visual:hover img{transform:translateY(-10px) rotate(-2deg)}
.sk-site .sk-certificates__item img{transition:transform .3s ease}
.sk-site .sk-certificates__item:hover img{transform:translateY(-6px)}
.sk-site .sk-product__image{background:linear-gradient(180deg,#fff,#f7ffff)}
.sk-site .sk-applications__card h3 a{color:inherit;font-size:inherit;font-weight:inherit}
.sk-site .sk-applications__card h3 a:hover{color:#22a9aa}
.sk-site .sk-applications__card p .sk-applications__description-link{color:inherit;font:inherit;text-decoration:none}
.sk-site .sk-applications__card p .sk-applications__description-link:hover{color:#22a9aa;text-decoration:underline}
.sk-site .sk-applications__card img{border-radius:10px 0 0 0}
.sk-site .sk-reviews__top>div>p{margin:12px 0 0;color:#426978;font-size:17px;line-height:1.6}
.sk-site .sk-footer:before{content:'';position:absolute;width:550px;height:550px;right:-100px;top:-175px;border:50px solid #ffffff17;border-radius:50%;pointer-events:none}
.sk-site .sk-footer--has-background:before{display:none}
.sk-site .sk-footer__grid{position:relative;z-index:1}

/* ==============================================================
   MẠNH HÙNG — FIGMA 1920 / 1440 · Dashboard-bound frontend
   Scoped styles intentionally leave older subpage modules intact.
   ============================================================== */
@font-face{font-family:'MHPoppins';src:url('../fonts/FZPoppins/FZ Poppins-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'MHPoppins';src:url('../fonts/FZPoppins/FZ Poppins-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'MHPoppins';src:url('../fonts/FZPoppins/FZ Poppins-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'MHPoppins';src:url('../fonts/FZPoppins/FZ Poppins-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'MHPoppins';src:url('../fonts/FZPoppins/FZ Poppins-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}
.mh-site{--mh-navy:#001e45;--mh-blue:#022c61;--mh-grey:#f4f4f4;font-family:'MHPoppins',Poppins,Arial,sans-serif;color:#101010;background:#fff;min-width:0;overflow-x:clip;line-height:1.55}
.mh-site *{box-sizing:border-box}.mh-site a{text-decoration:none}.mh-site button,.mh-site input,.mh-site textarea{font:inherit}.mh-site img{max-width:100%}
.mh-container{width:min(1440px,calc(100% - 64px));margin:0 auto}.mh-section{position:relative}.mh-section__title{margin:0;text-align:center;color:var(--mh-navy);font-weight:700;font-size:clamp(27px,2.2vw,40px);line-height:1.35}.mh-section__subtitle{margin:14px auto 0;max-width:720px;text-align:center;font-size:18px;color:#292929;line-height:1.6}
.mh-btn{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:16px 22px;border:0;border-radius:4px;font-size:18px;font-weight:600;transition:background .25s,transform .25s,box-shadow .25s;cursor:pointer}.mh-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #001e4526}.mh-btn--navy{background:var(--mh-navy);color:#fff!important}.mh-btn--navy:hover{background:#064080}.mh-btn--light{background:#fff;color:var(--mh-navy)!important}.mh-btn--light:hover{background:#eff3fa}
/* Decorative bar + sticky main menu */
/* SVG goc tu Figma o assets/images/topbar.svg. Khong ve lai cheo bang CSS. */
/* Match the 1920×136 Figma artwork at every desktop width without clipping its right edge. */
.mh-topbar{height:7.083333vw;background:#fff;color:#fff;position:relative;overflow:hidden}
.mh-topbar>.mh-topbar__svg{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;user-select:none;z-index:0}
.mh-topbar__inner{height:100%;position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:flex-end}
.mh-topbar__links{width:776.65px;max-width:100%;height:49px;display:flex;align-items:center;justify-content:space-between;gap:0;margin-top:28px;white-space:nowrap}
.mh-topbar__hotlines{display:flex;align-items:center;gap:119px;flex:0 0 auto}
.mh-topbar__phone{display:flex;align-items:center;gap:17px;color:#fff!important;width:170px;min-width:0;font-weight:700;line-height:1.1}
.mh-topbar__phone-icon{width:49px;height:49px;flex:0 0 49px;background:#d9d9d9;color:#001e45;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px}
.mh-topbar__phone-details{width:104px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:0}
.mh-topbar__phone b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;overflow-wrap:anywhere;font-size:18px;line-height:27px;font-weight:700;color:#fff}
.mh-topbar__phone small{display:block;font-size:16px;line-height:24px;font-weight:700;letter-spacing:-.3px;color:#fff;white-space:nowrap}
.mh-topbar__socials{display:flex;align-items:center;justify-content:flex-start;gap:17px;width:230px;min-width:0;flex:0 0 230px}
.mh-topbar__social{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff!important;font-size:25px;height:35px;transition:opacity .2s,transform .2s}
.mh-topbar__social:hover{opacity:.85;transform:translateY(-2px)}
.mh-topbar__social--facebook{width:12px}.mh-topbar__social--zalo{width:33px}.mh-topbar__social--tiktok,.mh-topbar__social--youtube,.mh-topbar__social--instagram,.mh-topbar__social--linkedin{width:25px}
.mh-topbar__social img{display:block;max-width:100%;max-height:35px;width:auto;height:auto;object-fit:contain;filter:grayscale(1) brightness(0) invert(1)}
.mh-topbar__zalo{position:relative;display:inline-flex;align-items:center;justify-content:center;font-family:Arial,sans-serif;font-weight:800;font-size:10px;letter-spacing:-.5px;width:31px;height:27px;background:#fff;color:#001e45;border-radius:50%}
.mh-topbar__zalo:after{content:"";position:absolute;bottom:-2px;left:3px;width:8px;height:6px;background:#fff;clip-path:polygon(0 0,100% 0,0 100%)}
.mh-nav{background:#fff;position:sticky;top:0;z-index:200;box-shadow:0 3px 15px #00000012;min-height:104px}.mh-nav__inner{height:104px;display:flex;align-items:center;justify-content:space-between;gap:94px}.mh-nav__logo{display:block;flex:0 1 467px;max-width:467px;transform:translateY(-16px)}.mh-nav__logo img{width:auto;max-width:100%;max-height:112px;object-fit:contain}.mh-nav__desktop{list-style:none;margin:0;padding:0;display:flex;align-items:center;justify-content:space-between;gap:clamp(18px,2.8vw,60px);flex:1}.mh-nav__entry{position:relative;list-style:none}.mh-nav__entry>a{color:#101010;display:block;padding:26px 2px;font-size:18px;font-weight:600;transition:color .2s}.mh-nav__entry>a:hover,.mh-nav__entry>a[aria-current="page"]{color:var(--mh-blue)}.mh-nav__entry>a:after{content:"";position:absolute;bottom:21px;left:0;width:0;height:3px;background:var(--mh-navy);transition:width .25s}.mh-nav__entry:hover>a:after{width:100%}
.mh-nav__dropdown,.mh-nav__subdropdown{list-style:none;margin:0;padding:10px 0;width:max-content;min-width:0;max-width:calc(100vw - 32px);position:absolute;top:100%;left:0;box-shadow:0 12px 28px #0002;border-radius:7px;background:#fff;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s}.mh-nav__entry:hover>.mh-nav__dropdown,.mh-nav__entry:focus-within>.mh-nav__dropdown,.mh-nav__dropdown li:hover>.mh-nav__subdropdown,.mh-nav__dropdown li:focus-within>.mh-nav__subdropdown{opacity:1;visibility:visible;transform:translateY(0)}.mh-nav__dropdown li{position:relative}.mh-nav__dropdown a,.mh-nav__subdropdown a{display:block;font-size:15px;font-weight:500;white-space:nowrap;color:#1e293b;padding:11px 19px}.mh-nav__dropdown a:hover,.mh-nav__subdropdown a:hover{background:#f3f6fb;color:var(--mh-navy)}.mh-nav__subdropdown{top:0;left:100%}.mh-nav__toggle,.mh-nav__mobile{display:none}
/* Header logo upload uses the Dashboard's 467 × 113px source dimensions. */
.mh-nav__logo img{width:467px;height:113px;max-width:100%;object-fit:contain;object-position:left center}
.mh-nav__logo img{display:block}
/* Keep the Figma-overlap at page top, but protect the uploaded logo inside the sticky menu.
   The 113px logo is otherwise shifted -16px above the 104px navigation viewport. */
@media (min-width:1200px){
  .mh-nav__logo{transition:transform .24s ease}
  .mh-nav__logo img{transition:height .24s ease,max-height .24s ease}
  .mh-nav.mh-nav--stuck .mh-nav__logo{display:flex;align-items:center;line-height:0;transform:translateY(0)}
  .mh-nav.mh-nav--stuck .mh-nav__logo img{display:block;height:98px;max-height:98px}
}
@media (prefers-reduced-motion:reduce){
  .mh-nav__logo,.mh-nav__logo img{transition:none}
}
/* Hero */
.mh-hero{height:750px;position:relative;background:var(--mh-navy);overflow:hidden}.mh-hero__slide{position:absolute;inset:0;background-position:center;background-size:cover;opacity:0;visibility:hidden;transition:opacity .7s,visibility .7s}.mh-hero__slide.is-active{opacity:1;visibility:visible}.mh-hero__inner{height:100%;display:flex;align-items:center}.mh-hero__copy{max-width:720px;color:#fff}.mh-hero__eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:20px;font-weight:600;text-transform:uppercase}.mh-hero__eyebrow:before{content:"";width:32px;height:2px;background:currentColor}.mh-hero__copy h1,.mh-hero__copy h2{margin:24px 0 22px;font-size:clamp(38px,3.25vw,60px);font-weight:800;line-height:1.24;text-transform:uppercase;color:#fff}.mh-hero__copy p{max-width:680px;font-size:19px;line-height:1.6;margin:0 0 56px}.mh-hero__pagination{position:absolute;bottom:25px;left:50%;display:flex;gap:10px;transform:translateX(-50%);z-index:2}.mh-hero__pagination button{border:0;width:28px;height:5px;border-radius:5px;background:#fff9;cursor:pointer}.mh-hero__pagination button.is-active{background:#fff;width:50px}
/* About: image pairing (both uploaded independently) */
.mh-about{padding:92px 0 115px;background:#fff}.mh-about__layout{display:grid;grid-template-columns:minmax(0,1.43fr) minmax(0,1.08fr) minmax(0,1.1fr);gap:52px;align-items:center}.mh-about__photos{height:590px;position:relative}.mh-about__photo{display:block;position:absolute;object-fit:cover;border-radius:20px}.mh-about__photo--large{width:76%;height:100%;top:0;left:0;animation:mhFloat 7s ease-in-out infinite}.mh-about__photo--small{width:56%;height:82%;right:0;top:9%;animation:mhFloat 7s ease-in-out infinite reverse}.mh-about__copy h2{font-size:40px;line-height:1.3;font-weight:700;color:var(--mh-navy);margin:0 0 24px}.mh-about__description{font-size:17px;line-height:1.7;margin:0 0 32px}.mh-about__description p{margin:0 0 13px}.mh-about__criteria{border-left:1px solid #8e8e8e;padding-left:52px;display:grid;gap:45px;min-width:0}.mh-about__criterion{display:flex;align-items:center;gap:32px}.mh-about__icon{width:80px;height:80px;flex:0 0 80px;border-radius:50%;background:var(--mh-navy);display:grid;place-items:center;color:white;font-size:35px}.mh-about__icon img{width:52%;height:52%;object-fit:contain;animation:mhTilt 5s ease-in-out infinite}.mh-about__criterion h3{font-size:25px;line-height:1.28;margin:0;font-weight:700}.mh-about__criterion p{font-size:18px;margin:6px 0 0;font-weight:500;border-bottom:2px solid var(--mh-navy);padding-bottom:6px}.mh-about__criterion:first-child h3{font-size:30px}
@keyframes mhFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes mhTilt{0%,100%{transform:rotate(0)}40%{transform:rotate(-9deg)}75%{transform:rotate(8deg)}}
/* Services: feature image 427x863 + two rows of three */
.mh-services{padding:10px 0 135px}.mh-services__layout{display:flex;align-items:stretch;gap:22px}.mh-services__feature{width:30%;min-height:860px;border-radius:20px;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:44px;color:#fff}.mh-services__feature h2{font-size:39px;line-height:1.35;color:#fff;margin:0 0 20px}.mh-services__feature p{font-size:19px;line-height:1.5;margin:0 0 30px}.mh-services__content{position:relative;min-width:0;flex:1}.mh-services__page{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;height:100%}.mh-services__page[hidden]{display:none}.mh-service-card{border:1px solid #dedede;border-radius:19px;background:#eaeaea;padding:11px;box-shadow:0 4px 13px #00000021;min-height:414px;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}.mh-service-card:hover{transform:translateY(-5px);box-shadow:0 12px 26px #0002}.mh-service-card>img{width:100%;height:223px;object-fit:cover;border-radius:13px}.mh-service-card__body{display:flex;flex:1;flex-direction:column;padding:11px 2px 0}.mh-service-card h3{font-size:21px;line-height:1.5;margin:0 0 7px;color:var(--mh-blue);font-weight:700}.mh-service-card p{font-size:15px;line-height:1.5;color:#111;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mh-service-card a{font-size:15px;font-weight:500;display:flex;gap:7px;align-items:center;justify-content:flex-end;color:var(--mh-navy);margin-top:auto;padding:10px 0 1px;border-top:1px solid #d4d4d4}.mh-service-card a i{transition:transform .2s}.mh-service-card a:hover i{transform:translateX(4px)}.mh-services__paging{position:absolute;z-index:3;top:50%;left:-18px;right:-18px;transform:translateY(-50%);display:flex;align-items:center;justify-content:space-between;pointer-events:none;color:var(--mh-blue);font-size:14px}.mh-services__paging span{display:none}.mh-services__paging button{pointer-events:auto;width:40px;height:40px;border-radius:50%;border:1px solid #d5dbe6;background:#fff;color:var(--mh-navy);cursor:pointer;box-shadow:0 3px 12px #001e4520}
/* Keep every service card compact and aligned, regardless of its copy length. */
.mh-services__page{height:auto;align-content:start}
.mh-service-card{height:414px;min-height:0;color:inherit;text-decoration:none}
.mh-service-card h3{display:-webkit-box;min-height:3em;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.mh-service-card p{min-height:3em}
.mh-service-card__more{font-size:15px;font-weight:500;display:flex;gap:7px;align-items:center;justify-content:flex-end;color:var(--mh-navy);margin-top:auto;padding:10px 0 1px;border-top:1px solid #d4d4d4}
.mh-service-card__more i{transition:transform .2s}.mh-service-card:hover .mh-service-card__more i{transform:translateX(4px)}
@media(max-width:1199px){.mh-service-card{height:320px}}
@media(max-width:600px){.mh-service-card{height:280px}}
/* More than four criteria become a continuous horizontal marquee. */
.mh-why__marquee{overflow:hidden;scroll-behavior:smooth}.mh-why__marquee-track{display:flex;gap:20px;width:max-content}.mh-why__marquee .mh-why__card{width:calc((min(1440px,100vw - 64px) - 60px)/4);min-width:250px;flex:0 0 calc((min(1440px,100vw - 64px) - 60px)/4)}
/* Why choose */
.mh-why{padding:92px 0;background-color:#141b27;background-position:center;background-size:cover;color:#fff}.mh-why__head{display:flex;justify-content:space-between;align-items:flex-end;gap:70px;margin-bottom:42px}.mh-why__head h2{font-weight:700;font-size:40px;line-height:1.35;color:#fff;margin:0}.mh-why__head p{margin:0;max-width:620px;font-size:18px;text-align:right}.mh-why__cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.mh-why__card{background:rgba(234,234,234,.35);border-radius:20px;min-height:270px;padding:28px 26px;backdrop-filter:blur(4px);transition:background .2s,transform .2s}.mh-why__card:hover{background:rgba(234,234,234,.45);transform:translateY(-4px)}.mh-why__icon{height:74px;width:74px;display:grid;place-items:center;background:var(--mh-blue);border-radius:8px;margin-bottom:26px}.mh-why__icon img{width:40px;height:40px;object-fit:contain}.mh-why__card h3{font-size:22px;line-height:1.35;color:white;margin:0 0 8px}.mh-why__card p{font-size:16px;line-height:1.55;margin:0;color:white}
/* 6-step curved process */
.mh-process{background:#f4f4f4;background-size:cover;background-position:center bottom;padding:58px 0 55px}.mh-process__timeline{position:relative;display:grid;grid-template-columns:repeat(var(--mh-process-columns,6),minmax(0,1fr));min-height:530px;margin-top:40px;align-items:stretch}.mh-process__line{position:absolute;top:40px;left:2%;width:96%;height:300px;overflow:visible;pointer-events:none}.mh-process__progress{stroke-dasharray:2300;stroke-dashoffset:2300;transition:stroke-dashoffset 3.5s ease}.mh-process.is-visible .mh-process__progress{stroke-dashoffset:0}.mh-process__step{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;min-width:0;z-index:1;padding:0 5px}.mh-process__step--low{padding-top:243px}.mh-process__step--high{padding-top:103px}.mh-process__number{display:grid;place-items:center;width:118px;height:118px;border-radius:50%;background:#a0b3ca;color:var(--mh-navy);font-size:38px;font-weight:700;margin-bottom:20px;order:0}.mh-process__step:first-of-type .mh-process__number{background:var(--mh-navy);color:#fff}.mh-process__step h3{font-size:20px;line-height:1.35;font-weight:700;margin:0 0 9px}.mh-process__step p{font-size:16px;line-height:1.48;max-width:190px;margin:0}
/* Flexible process layout: the curved line is reserved for exactly six steps. */
.mh-process__timeline--flex{min-height:320px;align-items:start;padding-top:90px}.mh-process__timeline--flex:before{content:"";position:absolute;left:4%;right:4%;top:148px;height:3px;background:#a2a2a2}.mh-process__timeline--flex .mh-process__step{padding-top:0}.mh-process__timeline--flex .mh-process__number{position:relative;margin-bottom:20px}.mh-process__timeline--flex .mh-process__number:after{content:"";position:absolute;top:100%;left:50%;height:30px;border-left:3px solid #a2a2a2}.mh-process__timeline--flex .mh-process__step:last-child .mh-process__number:after{display:none}@media(max-width:900px){.mh-process__timeline--flex{grid-template-columns:repeat(var(--mh-process-columns,6),170px);min-height:400px;padding-top:55px}.mh-process__timeline--flex:before{left:0;right:auto;top:113px;width:calc(var(--mh-process-columns,6) * 170px)}.mh-process__timeline--flex .mh-process__number:after{height:25px}}
.mh-process__number img{display:block;width:60px;height:60px;max-width:76%;max-height:76%;object-fit:contain}
/* Contact consultation */
.mh-consult{padding:90px 0;background-color:#1c252d;background-position:center;background-size:cover;color:#fff}.mh-consult__grid{display:grid;grid-template-columns:1.2fr .85fr;gap:85px;align-items:start}.mh-consult__form-area{padding-right:60px;border-right:1px solid #fff8}.mh-consult h2{font-size:40px;text-align:center;line-height:1.3;margin:0 0 36px;color:#fff}.mh-consult__form{display:grid;gap:18px}.mh-consult__form label{display:grid;gap:7px;font-size:16px;font-weight:500}.mh-consult__form input,.mh-consult__form textarea{width:100%;border:1px solid #ffffff70;border-radius:6px;padding:15px 16px;color:#fff;background:#ffffff30;outline-offset:3px;backdrop-filter:blur(3px);resize:vertical}.mh-consult__form input::placeholder,.mh-consult__form textarea::placeholder{color:#e4e4e4}.mh-consult__form input:focus,.mh-consult__form textarea:focus{border-color:#fff;background:#ffffff3a}.mh-consult__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.mh-consult__form button{width:100%}.mh-consult__reasons{display:grid;gap:22px}.mh-consult__reasons>h3{font-size:22px;color:#fff;line-height:1.5;margin:0 0 5px}.mh-consult__reason{background:#ffffff3b;border-radius:9px;padding:16px 21px;backdrop-filter:blur(3px)}.mh-consult__reason h4{margin:0 0 6px;font-size:21px;color:#fff;text-decoration:underline;text-underline-offset:5px}.mh-consult__reason p{margin:0;font-size:17px;line-height:1.5}.mh-honeypot{position:absolute!important;left:-9999px!important;opacity:0!important}
/* News */
.mh-news{padding:85px 0 120px;background:#fff}.mh-news__slider{position:relative;margin-top:42px}.mh-news__track{display:flex;gap:24px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none}.mh-news__track::-webkit-scrollbar{display:none}.mh-news__card{flex:0 0 calc((100% - 48px)/3);height:560px;border-radius:17px;background-position:center;background-size:cover;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:40px;color:#fff!important;scroll-snap-align:start;transition:transform .2s}.mh-news__card:hover{transform:translateY(-4px)}.mh-news__category{align-self:flex-start;background:#0003;border-radius:8px;padding:8px 15px;font-size:16px;color:#fff}.mh-news__card h3{font-size:26px;font-weight:700;line-height:1.5;color:#fff;margin:0 0 27px}.mh-news__card div>span{display:flex;gap:14px;align-items:center;border-top:1px solid #ffffff40;padding-top:20px;font-size:18px;font-weight:600}.mh-news__card div>span i{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--mh-navy)}.mh-news__prev,.mh-news__next{position:absolute;width:56px;height:56px;top:50%;border:0;border-radius:50%;background:var(--mh-navy);color:white;display:grid;place-items:center;z-index:10;cursor:pointer}.mh-news__prev{left:-76px}.mh-news__next{right:-76px}
/* Footer */
.mh-footer{background:#f4f4f4;position:relative;padding-top:75px;color:#515151}.mh-footer__grid{display:grid;grid-template-columns:1.65fr 1fr 1fr 1fr;gap:65px;padding-bottom:95px}.mh-footer__logo img{max-width:355px;max-height:120px;object-fit:contain;object-position:left}.mh-footer__company h2,.mh-footer__column h2{font-size:23px;font-weight:700;margin:14px 0 25px;color:var(--mh-navy)}.mh-footer__company p{font-size:16px;line-height:1.6;display:flex;gap:9px;margin:0 0 14px}.mh-footer__company p i{margin-top:5px}.mh-footer__company a,.mh-footer__column a{color:#676767}.mh-footer__column a{font-size:16px;line-height:1.7;display:block;margin-bottom:9px;transition:color .2s}.mh-footer a:hover{color:var(--mh-navy)}.mh-footer__social{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.mh-footer__social a{width:42px;height:42px;background:#dedede;color:#5d5d5d;display:grid;place-items:center;border-radius:5px;font-size:19px}.mh-footer__social img{width:25px;height:25px;object-fit:contain}.mh-footer__social img{filter:grayscale(1);opacity:.85}.mh-footer__zalo{display:flex;align-items:center;justify-content:center;width:26px;height:23px;font:800 9px/1 Arial,sans-serif;letter-spacing:-.4px;border:2px solid currentColor;border-radius:50%;position:relative}.mh-footer__zalo:after{content:"";position:absolute;left:1px;bottom:-4px;border:4px solid transparent;border-left-color:currentColor}.mh-footer__bottom{border-top:1px solid #ddd;padding:23px 0 42px;font-size:13px}/* Render the original 1920×135 Figma SVG, never a clipped CSS approximation. */
.mh-footer__decoration{display:block;width:100%;height:auto;line-height:0;overflow:hidden;background:transparent;clip-path:none}
.mh-footer__decoration>img{display:block;width:100%;height:auto;max-width:none;aspect-ratio:1920/135;object-fit:fill}
@media(min-width:1200px) and (max-width:1600px){.mh-topbar>.mh-topbar__svg{width:100%}.mh-topbar__links{width:clamp(620px,calc(33.333vw + 220px),776.65px)}.mh-topbar__hotlines{gap:clamp(24px,calc(13.333vw - 136px),77px)}}@media(max-width:1600px){.mh-news__prev{left:5px}.mh-news__next{right:5px}.mh-about__layout{gap:35px}.mh-about__criteria{padding-left:30px}.mh-about__criterion{gap:16px}.mh-about__criterion h3{font-size:20px}.mh-about__criterion p{font-size:16px}.mh-nav__inner{gap:24px}.mh-nav__desktop{gap:22px}}
@media(max-width:1199px){.mh-container{width:min(1120px,calc(100% - 48px))}.mh-topbar{height:72px;background:var(--mh-navy)}.mh-topbar>.mh-topbar__svg{display:none}.mh-topbar__links{width:100%;height:auto;min-height:49px;margin-top:9px;gap:18px;justify-content:flex-end}.mh-topbar__hotlines{gap:18px}.mh-topbar__phone{width:auto;gap:9px}.mh-topbar__phone-icon{width:37px;height:37px;flex-basis:37px;font-size:17px}.mh-topbar__phone b{font-size:12px;line-height:18px}.mh-topbar__phone small{font-size:12px;line-height:18px}.mh-topbar__socials{gap:14px;width:auto;flex:0 1 auto}.mh-topbar__social{font-size:17px}.mh-topbar__social--facebook,.mh-topbar__social--zalo,.mh-topbar__social--tiktok,.mh-topbar__social--youtube{width:22px}.mh-topbar__zalo{transform:scale(.78)}.mh-nav{min-height:90px}.mh-nav__inner{height:90px}.mh-nav__logo{max-width:260px;transform:none}.mh-nav__logo img{max-height:85px}.mh-nav__entry>a{font-size:15px}.mh-nav__desktop{gap:15px}.mh-hero{height:560px}.mh-about__layout{grid-template-columns:1fr 1fr}.mh-about__photos{height:480px}.mh-about__criteria{grid-column:1/-1;border-left:0;border-top:1px solid #bcbcbc;padding:30px 0 0;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.mh-about__criterion{flex-direction:column;align-items:flex-start}.mh-services__feature{width:32%;padding:28px;min-height:680px}.mh-services__feature h2{font-size:30px}.mh-services__page{gap:14px}.mh-service-card{min-height:320px}.mh-service-card>img{height:160px}.mh-service-card h3{font-size:17px}.mh-service-card p{font-size:13px}.mh-why__cards{gap:13px}.mh-why__card{padding:20px 15px}.mh-process__number{height:83px;width:83px;font-size:25px}.mh-process__step h3{font-size:17px}.mh-process__step p{font-size:14px}.mh-process__step--low{padding-top:235px}.mh-process__step--high{padding-top:95px}.mh-consult__grid{gap:40px}.mh-consult__form-area{padding-right:35px}.mh-footer__grid{gap:30px}}
@media(max-width:900px){.mh-container{width:calc(100% - 40px)}.mh-nav__desktop{display:none}.mh-nav__toggle{display:grid;place-items:center;border:0;border-radius:5px;width:44px;height:44px;background:var(--mh-navy);color:#fff;cursor:pointer}.mh-nav__mobile:not([hidden]){display:block;background:#fff;border-top:1px solid #ddd;max-height:calc(100vh - 100px);overflow-y:auto;padding:12px 24px}.mh-nav__mobile-item{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid #e9ebf0}.mh-nav__mobile-item>a{color:var(--mh-navy);font-weight:600}.mh-nav__mobile-item details{color:var(--mh-navy);font-size:13px}.mh-nav__mobile-item details[open]{width:100%}.mh-nav__mobile-children{display:grid;gap:9px;padding:12px 15px}.mh-nav__mobile-children a{color:#2a3e55}.mh-nav__mobile-sub{padding-left:18px}.mh-hero{height:500px}.mh-hero__copy{max-width:580px}.mh-hero__copy h1,.mh-hero__copy h2{font-size:38px}.mh-about__layout{gap:30px}.mh-about__photos{height:420px}.mh-about__copy h2{font-size:32px}.mh-about__description{font-size:15px}.mh-about__criteria{grid-template-columns:repeat(2,minmax(0,1fr))}.mh-about__criterion{flex-direction:row}.mh-services__layout{flex-direction:column}.mh-services__feature{width:100%;min-height:280px;background-position:center 55%}.mh-services__page{grid-template-columns:repeat(3,1fr)}.mh-why__head{flex-direction:column;align-items:flex-start;gap:16px}.mh-why__head p{text-align:left}.mh-why__cards{grid-template-columns:repeat(2,minmax(0,1fr))}.mh-process__timeline{overflow-x:auto;grid-template-columns:repeat(6,170px);min-height:510px}.mh-process__line{width:1020px;left:0}.mh-projects__stage{height:430px}.mh-projects__card{height:365px}.mh-consult__grid{grid-template-columns:1fr;gap:35px}.mh-consult__form-area{padding-right:0;border-right:0;border-bottom:1px solid #fff6;padding-bottom:35px}.mh-consult__reasons{grid-template-columns:repeat(2,1fr)}.mh-consult__reasons h3{grid-column:1/-1}.mh-news__card{flex-basis:calc((100% - 24px)/2);height:470px}.mh-footer__grid{grid-template-columns:repeat(2,1fr);gap:36px}}
@media(max-width:600px){.mh-container{width:calc(100% - 30px)}.mh-topbar{height:auto;min-height:50px;background:var(--mh-navy)}.mh-topbar__inner{justify-content:center}.mh-topbar__links{margin:0;min-height:50px;padding:8px 0;gap:10px;flex-wrap:wrap;justify-content:center}.mh-topbar__hotlines{gap:12px}.mh-topbar__phone{width:auto;gap:5px}.mh-topbar__phone-icon{width:27px;height:27px;flex-basis:27px;font-size:11px}.mh-topbar__phone b{font-size:10px;line-height:14px}.mh-topbar__phone small{font-size:10px;line-height:14px}.mh-topbar__socials{gap:15px}.mh-topbar__social{font-size:16px;height:24px}.mh-nav{min-height:72px}.mh-nav__inner{height:72px}.mh-nav__logo{max-width:220px}.mh-nav__logo img{max-height:65px}.mh-hero{height:440px}.mh-hero__copy{max-width:95%}.mh-hero__eyebrow{font-size:12px}.mh-hero__copy h1,.mh-hero__copy h2{font-size:30px;margin:15px 0}.mh-hero__copy p{font-size:14px;line-height:1.65;margin-bottom:25px}.mh-btn{font-size:15px;padding:12px 16px}.mh-section__title{font-size:28px}.mh-section__subtitle{font-size:14px}.mh-about{padding:48px 0 70px}.mh-about__layout{display:flex;flex-direction:column;align-items:stretch}.mh-about__photos{height:300px;width:100%}.mh-about__photo--large{width:73%}.mh-about__photo--small{width:52%}.mh-about__copy h2{font-size:28px}.mh-about__criteria{grid-template-columns:1fr 1fr}.mh-about__criterion{flex-direction:column;align-items:center;text-align:center}.mh-about__icon{width:60px;height:60px;flex-basis:60px;font-size:24px}.mh-about__criterion h3{font-size:18px!important}.mh-about__criterion p{font-size:13px}.mh-services{padding-bottom:65px}.mh-services__feature{padding:24px;min-height:285px}.mh-services__feature h2{font-size:27px}.mh-services__feature p{font-size:15px}.mh-services__page{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mh-service-card{min-height:280px;padding:8px}.mh-service-card>img{height:130px}.mh-service-card h3{font-size:15px}.mh-service-card p{font-size:12px}.mh-service-card a{font-size:12px}.mh-why{padding:55px 0}.mh-why__head h2{font-size:28px}.mh-why__head p{font-size:14px}.mh-why__cards{gap:10px}.mh-why__card{min-height:225px;padding:17px 12px}.mh-why__icon{width:53px;height:53px;margin-bottom:16px}.mh-why__icon img{height:32px;width:32px}.mh-why__card h3{font-size:17px}.mh-why__card p{font-size:12px}.mh-process{padding:50px 0}.mh-process__timeline{margin-top:12px}.mh-projects{padding:48px 0 55px}.mh-projects__stage{height:310px;margin-top:30px}.mh-projects__card{height:265px;width:70vw;border-radius:10px}.mh-projects__prev,.mh-projects__next{width:35px;height:44px}.mh-projects__prev{left:4%}.mh-projects__next{right:4%}.mh-projects__caption h3{font-size:21px}.mh-projects__caption p{font-size:13px}.mh-consult{padding:55px 0}.mh-consult h2{font-size:29px;margin-bottom:25px}.mh-consult__row{grid-template-columns:1fr}.mh-consult__form input,.mh-consult__form textarea{padding:11px 12px}.mh-consult__reasons{grid-template-columns:1fr}.mh-consult__reason h4{font-size:18px}.mh-consult__reason p{font-size:14px}.mh-news{padding:55px 0 70px}.mh-news__card{flex-basis:85%;height:435px;padding:27px}.mh-news__card h3{font-size:22px}.mh-news__prev,.mh-news__next{width:38px;height:38px}.mh-footer{padding-top:47px}.mh-footer__grid{grid-template-columns:1fr 1fr;gap:25px;padding-bottom:55px}.mh-footer__company{grid-column:1/-1}.mh-footer__company h2,.mh-footer__column h2{font-size:18px}.mh-footer__column a,.mh-footer__company p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.mh-site *, .mh-site *:before, .mh-site *:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.mh-process__progress{stroke-dashoffset:0}}
/* Nội dung trang tĩnh từ Dashboard; không dùng template TBL cũ. */
.mh-static-detail{padding:76px 0 110px}.mh-static-detail .mh-container{max-width:1160px}.mh-static-detail h1{font-size:clamp(30px,3vw,44px);font-weight:700;color:var(--mh-navy);margin:0 0 35px;text-align:center}.mh-static-detail__cover{display:block;width:100%;max-height:550px;object-fit:cover;border-radius:18px;margin:0 0 34px}.mh-static-detail__lead{font-size:18px;line-height:1.85;margin-bottom:25px}.mh-static-detail__article{font-size:17px;line-height:1.8}.mh-static-detail__gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:50px}.mh-static-detail__gallery img{width:100%;height:260px;object-fit:cover;border-radius:12px}@media(max-width:700px){.mh-static-detail{padding:45px 0 70px}.mh-static-detail__gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mh-static-detail__gallery img{height:160px}}
.mh-footer__intro{font-size:15px;line-height:1.7;color:#515151;margin:10px 0 16px}.mh-footer__intro p{margin:0 0 10px}
.mh-footer__social-label{display:block;width:201px;height:24px;margin:18px 0 0!important;font-family:'Fz Poppins','Poppins',Arial,sans-serif!important;font-size:16px!important;font-style:normal;font-weight:500;line-height:24px;color:#666;text-transform:capitalize}
.mh-footer__social-label+.mh-footer__social{margin-top:9px}
.mh-project-detail__gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:45px auto;max-width:1150px}.mh-project-detail__gallery img{width:100%;height:260px;object-fit:cover;border-radius:12px}@media(max-width:700px){.mh-project-detail__gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mh-project-detail__gallery img{height:160px}}

/* Project imagery: Dashboard upload and homepage carousel share the 724 × 551 ratio. */

.mh-about{background-size:cover;background-position:center}

/* Related knowledge articles follow the image-first album card of the news page. */
.dap-detail-related .mh-news__card{height:467px;min-height:0;padding:28px;border:0;background-color:var(--mh-navy);text-decoration:none}.dap-detail-related .mh-news__card .mh-service-card__body{padding:0;display:block}.dap-detail-related .mh-news__card .mh-service-card__more{justify-content:flex-start;color:#fff;border-top:1px solid #ffffff40;padding-top:17px;font-size:16px}.dap-detail-related .mh-news__card .mh-service-card__more i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--mh-navy)}

/* ===== Mạnh Hùng CNC Precision Motion – homepage only (2026-10-29) =====
   Progressive enhancement: page remains fully readable without JavaScript.
   Dashboard-managed images, copy, links and business logic remain unchanged. */
.mh-site .mh-hero__slide { isolation:isolate; }
.mh-site .mh-hero__media {
    position:absolute; inset:0; z-index:0; background-size:cover;
    background-position:center; transform:scale(1.055);
    transition:transform 7.2s cubic-bezier(.15,.45,.28,1);
    will-change:transform;
}
.mh-site .mh-hero__slide.is-active .mh-hero__media { transform:scale(1); }
.mh-site .mh-hero__slide::after {
    content:""; position:absolute; inset:-30% auto -30% 0; z-index:1;
    width:34%; pointer-events:none; opacity:0;
    background:linear-gradient(90deg,transparent,rgba(9,141,226,.07) 30%,rgba(151,231,255,.25) 48%,rgba(255,255,255,.31) 50%,transparent 70%);
    transform:translate3d(-170%,0,0) skewX(-20deg);
}
.mh-site .mh-hero__slide.is-active::after { animation:mh-cnc-laser-sweep 8s ease-in-out infinite; }
@keyframes mh-cnc-laser-sweep {
    0%,12% { transform:translate3d(-170%,0,0) skewX(-20deg); opacity:0; }
    20% { opacity:.55; }
    37%,100% { transform:translate3d(420%,0,0) skewX(-20deg); opacity:0; }
}
.mh-site .mh-hero__inner { position:relative; z-index:2; }
.mh-site .mh-hero__pagination { z-index:3; }
.mh-site .mh-hero__copy > * { opacity:0; transform:translate3d(0,19px,0); transition:opacity .65s ease,transform .78s cubic-bezier(.18,.8,.2,1); }
.mh-site .mh-hero__slide.is-active .mh-hero__copy > * { opacity:1; transform:translate3d(0,0,0); }
.mh-site .mh-hero__copy > :nth-child(1) { transition-delay:100ms; }
.mh-site .mh-hero__copy > :nth-child(2) { transition-delay:200ms; }
.mh-site .mh-hero__copy > :nth-child(3) { transition-delay:310ms; }
.mh-site .mh-hero__copy > :nth-child(4) { transition-delay:430ms; }
.mh-site .mh-hero__pagination button { transition:width .32s ease,background-color .32s ease; }
.mh-site .mh-btn { position:relative; overflow:hidden; isolation:isolate; }
.mh-site .mh-btn::after {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(108deg,transparent 25%,rgba(255,255,255,.24) 49%,transparent 73%);
    transform:translateX(-145%) skewX(-12deg); transition:transform .68s ease;
}
@media(hover:hover) and (pointer:fine) {
    .mh-site .mh-btn:hover::after { transform:translateX(145%) skewX(-12deg); }
}
.mh-site .mh-btn:focus-visible,
.mh-site .mh-main .mh-projects__visual:focus-visible,
.mh-site .mh-service-card:focus-visible,
.mh-site .mh-news__card:focus-visible { outline:3px solid #3c9edb; outline-offset:4px; }

/* About: subtle parallax instead of constantly floating photographs. */
.mh-site .mh-main .mh-about__photo--large,
.mh-site .mh-main .mh-about__photo--small { animation:none; will-change:transform; transition:filter .35s ease; }
.mh-site .mh-main .mh-about__photo--large { transform:translate3d(0,var(--mh-layer-travel,0px),0); }
.mh-site .mh-main .mh-about__photo--small { transform:translate3d(0,calc(var(--mh-layer-travel,0px) * -1),0); box-shadow:0 16px 30px #061c3c1c; }
.mh-site .mh-main .mh-about__photos:hover .mh-about__photo--small { filter:brightness(1.065); }
.mh-site .mh-main .mh-about__icon { transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease; }
.mh-site .mh-main .mh-about__icon img { animation:none; }
.mh-site .mh-main .mh-about__criterion:hover .mh-about__icon { transform:translateY(-3px); box-shadow:0 9px 20px #001e4529; }

/* Services: image crops remain inside rounded cards. */
.mh-site .mh-main .mh-service-card { position:relative; overflow:hidden; transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease; }
.mh-site .mh-main .mh-service-card__media { display:block; height:223px; border-radius:13px; overflow:hidden; flex:0 0 auto; }
.mh-site .mh-main .mh-service-card__media img { width:100%; height:100%; display:block; object-fit:cover; transform:scale(1); transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.mh-site .mh-main .mh-service-card::after { content:""; position:absolute; bottom:0; left:0; right:0; height:3px; background:#1262a3; transform:scaleX(0); transform-origin:left; transition:transform .36s ease; pointer-events:none; }
.mh-site .mh-main .mh-service-card__more i { transition:transform .3s cubic-bezier(.2,.8,.2,1); }
@media(hover:hover) and (pointer:fine) {
    .mh-site .mh-main .mh-service-card:hover { transform:translateY(-6px); border-color:#94b9d6; box-shadow:0 13px 27px #001e452b; }
    .mh-site .mh-main .mh-service-card:hover .mh-service-card__media img { transform:scale(1.055); }
    .mh-site .mh-main .mh-service-card:hover::after { transform:scaleX(1); }
    .mh-site .mh-main .mh-service-card:hover .mh-service-card__more i { transform:translateX(5px); }
}
.mh-site .mh-main .mh-services__feature { overflow:hidden; position:relative; isolation:isolate; }
.mh-site .mh-main .mh-services__feature::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(125deg,transparent 38%,rgba(160,217,255,.11) 50%,transparent 62%); transform:translateX(-120%); transition:transform 1.1s ease; }
.mh-site .mh-main .mh-services__feature > div { position:relative; z-index:1; }
@media(hover:hover) and (pointer:fine) { .mh-site .mh-main .mh-services__feature:hover::after { transform:translateX(120%); } }

/* Glass differentiators: use one deliberate highlight on hover, not perpetual pulsing. */
.mh-site .mh-main .mh-why__card { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.12); transition:transform .36s ease,background .36s ease,box-shadow .36s ease,border-color .36s ease; }
.mh-site .mh-main .mh-why__card::after { content:""; position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(90deg,#2577b9,#a8d9ff); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.mh-site .mh-main .mh-why__icon { transition:transform .34s ease,background-color .34s ease; }
@media(hover:hover) and (pointer:fine) {
    .mh-site .mh-main .mh-why__card:hover { transform:translateY(-5px); background:rgba(234,242,250,.36); border-color:rgba(183,221,255,.42); box-shadow:0 14px 28px #0002; }
    .mh-site .mh-main .mh-why__card:hover::after { transform:scaleX(1); }
    .mh-site .mh-main .mh-why__card:hover .mh-why__icon { transform:translateY(-3px); background:#125ea1; }
}

/* Curved manufacturing process: draw the real SVG path, then stage the six markers. */
.mh-site .mh-main .mh-process__progress { stroke-dasharray:var(--mh-path-length,2300); stroke-dashoffset:var(--mh-path-length,2300); transition:stroke-dashoffset 2.5s cubic-bezier(.22,.72,.22,1); }
.mh-site .mh-main .mh-process.is-visible .mh-process__progress { stroke-dashoffset:0; }
.mh-site .mh-main .mh-process__number { transition:background-color .35s ease,color .35s ease,transform .35s ease,box-shadow .35s ease; }
.mh-site .mh-main .mh-process__number--icon { background:transparent !important; box-shadow:none !important; color:inherit; }
.mh-site .mh-main .mh-process__number--icon img { display:block; width:60px; height:60px; max-width:76%; max-height:76%; object-fit:contain; }
.mh-site .mh-main .mh-process__step { transition:opacity .5s ease,filter .5s ease; }
.mh-site .mh-main .mh-process__step h3 { transition:color .3s ease; }
.mh-site .mh-main .mh-process__step:hover .mh-process__number { transform:scale(1.075); background:#093b74; color:#fff; box-shadow:0 0 0 7px #125ea120,0 13px 25px #001e4533; }
.mh-site .mh-main .mh-process__step:hover .mh-process__number--icon { background:transparent; box-shadow:none; }
.mh-site .mh-main .mh-process__step:hover h3 { color:#10528c; }
@media(min-width:901px) and (prefers-reduced-motion:no-preference) {
    .mh-site.mh-motion-ready .mh-main .mh-process:not(.is-visible) .mh-process__step { opacity:.55; filter:grayscale(.5); }
    .mh-site .mh-main .mh-process.is-visible .mh-process__step { transition-delay:calc(var(--mh-step-index,0) * 200ms); }
}

.mh-site .mh-main .mh-projects__prev,
.mh-site .mh-main .mh-projects__next { transition:background-color .25s ease,box-shadow .25s ease; }
.mh-site .mh-main .mh-projects__prev:hover,
.mh-site .mh-main .mh-projects__next:hover { background:#032e5e; box-shadow:0 8px 18px #001e4550; }
.mh-site .mh-main .mh-projects__caption.mh-caption-refresh { animation:mh-caption-in .48s ease both; }
@keyframes mh-caption-in { from{opacity:.25;transform:translate3d(0,8px,0)} to{opacity:1;transform:translate3d(0,0,0)} }

/* Contact remains usable: focus states and button shine, no submission behavior changed. */
.mh-site .mh-main .mh-consult__form input,
.mh-site .mh-main .mh-consult__form textarea { transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease; }
.mh-site .mh-main .mh-consult__form input:focus,
.mh-site .mh-main .mh-consult__form textarea:focus { border-color:#9bdcff; box-shadow:0 0 0 3px #3295d555; background:rgba(255,255,255,.22); outline:none; }
.mh-site .mh-main .mh-consult__reason { transition:background-color .3s ease,transform .3s ease; }
@media(hover:hover) and (pointer:fine) { .mh-site .mh-main .mh-consult__reason:hover { background:rgba(255,255,255,.32); transform:translateX(4px); } }

/* News: a restrained spotlight and a matching arrow interaction. */
.mh-site .mh-main .mh-news__card { isolation:isolate; overflow:hidden; transition:transform .32s ease,box-shadow .32s ease,filter .32s ease; }
.mh-site .mh-main .mh-news__card::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,transparent 34%,rgba(200,234,255,.12) 52%,transparent 69%); transform:translateX(-120%); transition:transform .8s ease; z-index:0; }
.mh-site .mh-main .mh-news__card > * { position:relative; z-index:1; }
.mh-site .mh-main .mh-news__card div>span i { transition:transform .3s ease,background-color .3s ease; }
@media(hover:hover) and (pointer:fine) {
    .mh-site .mh-main .mh-news__card:hover { transform:translateY(-6px); box-shadow:0 15px 28px #001e4529; filter:brightness(1.04); }
    .mh-site .mh-main .mh-news__card:hover::before { transform:translateX(120%); }
    .mh-site .mh-main .mh-news__card:hover div>span i { transform:translateX(4px); background:#176cb0; }
}

/* On-scroll reveals are opt-in only after IntersectionObserver is started. */
@media(prefers-reduced-motion:no-preference) {
    .mh-site.mh-motion-ready .mh-main .mh-reveal { opacity:0; transform:translate3d(0,22px,0); transition:opacity .66s ease,transform .72s cubic-bezier(.2,.78,.2,1); transition-delay:var(--mh-reveal-delay,0ms); }
    .mh-site.mh-motion-ready .mh-main .mh-reveal.is-revealed { opacity:1; transform:translate3d(0,0,0); }
    /* Card hover retains its own elevation once the item is revealed. */
    .mh-site.mh-motion-ready .mh-main .mh-service-card.mh-reveal.is-revealed:hover,
    .mh-site.mh-motion-ready .mh-main .mh-news__card.mh-reveal.is-revealed:hover,
    .mh-site.mh-motion-ready .mh-main .mh-why__card.mh-reveal.is-revealed:hover { transform:translateY(-5px); }
}
@media(max-width:1199px) {
    .mh-site .mh-main .mh-service-card__media { height:160px; }
}
@media(max-width:900px) {
    .mh-site .mh-main .mh-about__photo--large,
    .mh-site .mh-main .mh-about__photo--small { transform:none; will-change:auto; }
    .mh-site .mh-main .mh-process__step { transition-delay:0ms; }
}
@media(max-width:600px) {
    .mh-site .mh-main .mh-service-card__media { height:130px; }
    .mh-site .mh-hero__slide::after { display:none; }
}
@media(prefers-reduced-motion:reduce) {
    .mh-site .mh-hero__slide::after,
    .mh-site .mh-hero__copy > *,
    .mh-site .mh-main .mh-projects__caption.mh-caption-refresh { animation:none; }
    .mh-site .mh-hero__copy > * { opacity:1; transform:none; }
    .mh-site .mh-hero__media { transform:none; will-change:auto; }
    .mh-site .mh-main .mh-about__photo--large,
    .mh-site .mh-main .mh-about__photo--small { transform:none; will-change:auto; }
    .mh-site .mh-main .mh-process__step { opacity:1; filter:none; }
    .mh-site .mh-main .mh-process__progress { stroke-dashoffset:0; }
}


/* MANH HUNG — About (Figma frame 2071858001, 1441 × 588).
   Scoped to the home page to preserve the existing admin/subpage layouts.
   Image/content sources remain the Dashboard Photo/Static records. */
@media (min-width: 1200px) {
  .mh-site .mh-main .mh-about { padding: 92px 0 110px; }
  .mh-site .mh-main .mh-about__layout {
    display: grid;
    grid-template-columns: minmax(0,557fr) minmax(0,415fr) 1px minmax(0,385fr);
    gap: 28px;
    min-height: 588px;
    align-items: center;
  }
  .mh-site .mh-main .mh-about__photos {
    grid-column: 1; width: 100%; height: auto; aspect-ratio: 557 / 588;
    min-width: 0; align-self: center; overflow: visible;
  }
  .mh-site .mh-main .mh-about__photo { display:block; border-radius:20px; object-fit:cover; }
  .mh-site .mh-main .mh-about__photo--large {
    left: 0; top: 0; right: auto; width: 76.66%; height: 100%;
  }
  .mh-site .mh-main .mh-about__photo--small {
    left: 43.63%; top: 9.01%; right: auto; width: 56.37%; height: 81.97%;
    box-shadow: 0 14px 24px rgba(0,30,69,.08);
  }
  .mh-site .mh-main .mh-about__copy {
    grid-column: 2; align-self: center; min-width:0;
    display:flex; flex-direction:column; align-items:flex-start;
    gap:24px;
  }
  .mh-site .mh-main .mh-about__copy h2 {
    font-size:40px; line-height:1.5; font-weight:700;
    margin:0; color:#001e45;
  }
  .mh-site .mh-main .mh-about__description {
    min-width:0; width:100%; margin:0;
    color:#111; font-size:18px; line-height:1.5;
    overflow-wrap:break-word;
  }
  .mh-site .mh-main .mh-about__description p { margin:0 0 10px; }
  .mh-site .mh-main .mh-about__description p:last-child {margin-bottom:0}
  /* Two brand-label paragraphs in the Dashboard introduction. */
  .mh-site .mh-main .mh-about__description p:first-child:not(:only-child) {
    color:#787878; font-weight:700; font-size:22px; line-height:33px; margin:0;
  }
  .mh-site .mh-main .mh-about__description p:nth-child(2):not(:last-child) {
    color:#787878; font-weight:700; font-size:30px; line-height:45px; margin:0 0 13px;
  }
  .mh-site .mh-main .mh-about__description p:first-child:not(:only-child) *,
  .mh-site .mh-main .mh-about__description p:nth-child(2):not(:last-child) * {color:#787878!important}
  .mh-site .mh-main .mh-about__copy > .mh-btn {
    margin:0; display:inline-flex; align-items:center; justify-content:center;
    min-height:60px; padding:16px 19px; font-size:18px;
    font-weight:600; line-height:27px; border-radius:4px;
  }
  .mh-site .mh-main .mh-about__divider {
    grid-column:3; height:100%; min-height:588px;
    width:1px; background:#858585; align-self:stretch;
  }
  .mh-site .mh-main .mh-about__criteria {
    grid-column:4; border:0; padding:0;
    display:flex; flex-direction:column;
    align-items:flex-start; justify-content:center;
    gap:60px; min-width:0;
  }
  .mh-site .mh-main .mh-about__criterion {
    display:flex; align-items:center; gap:40px; min-height:80px; width:100%;
  }
  .mh-site .mh-main .mh-about__icon {
    flex:0 0 80px; width:80px; height:80px; border-radius:50%;
    background:#001e45;
  }
  .mh-site .mh-main .mh-about__icon img {width:51%;height:51%;object-fit:contain}
  .mh-site .mh-main .mh-about__criterion > div {min-width:0}
  .mh-site .mh-main .mh-about__criterion h3,
  .mh-site .mh-main .mh-about__criterion:first-child h3 {
    font-size:27px; line-height:40px; font-weight:700; margin:0; color:#111;
  }
  .mh-site .mh-main .mh-about__criterion:first-child h3 {font-size:30px;line-height:45px}
  .mh-site .mh-main .mh-about__criterion p {
    display:table; max-width:100%; width:max-content;
    font-size:20px; line-height:30px; font-weight:600;
    color:#111; border-bottom:2px solid #001e45;
    padding:0 0 3px; margin:0;
  }
}
@media (min-width:1200px) and (max-width:1499px) {
  .mh-site .mh-main .mh-about__layout {gap:22px}
  .mh-site .mh-main .mh-about__criterion {gap:22px}
  .mh-site .mh-main .mh-about__icon {width:68px;height:68px;flex-basis:68px}
  .mh-site .mh-main .mh-about__criteria {gap:48px}
  .mh-site .mh-main .mh-about__criterion h3,
  .mh-site .mh-main .mh-about__criterion:first-child h3 {font-size:23px;line-height:1.35}
  .mh-site .mh-main .mh-about__criterion p {font-size:17px;line-height:1.5}
  .mh-site .mh-main .mh-about__copy h2 {font-size:35px}
  .mh-site .mh-main .mh-about__description {font-size:16px}
  .mh-site .mh-main .mh-about__description p:first-child:not(:only-child) {font-size:19px;line-height:29px}
  .mh-site .mh-main .mh-about__description p:nth-child(2):not(:last-child) {font-size:26px;line-height:38px}
}
/* Below desktop, retain the original two-column then stacked structure,
   but keep the Figma image proportions and prevent long text from clipping. */
@media (max-width:1199px) {
  .mh-site .mh-main .mh-about__divider {display:none}
  .mh-site .mh-main .mh-about__photos {aspect-ratio:557/588;height:auto;max-height:480px}
  .mh-site .mh-main .mh-about__photo--large {left:0;top:0;width:76.66%;height:100%;right:auto}
  .mh-site .mh-main .mh-about__photo--small {left:43.63%;top:9.01%;width:56.37%;height:81.97%;right:auto}
  .mh-site .mh-main .mh-about__description {overflow-wrap:break-word}
}
@media (max-width:600px) {
  .mh-site .mh-main .mh-about__photos {max-height:none; height:auto; aspect-ratio:557/588}
  .mh-site .mh-main .mh-about__description {font-size:15px;line-height:1.6}
}


/* MẠNH HÙNG — Figma process (frame 2071858019) and Dashboard background fixes.
   Keep original Dashboard image URLs; animate only backgrounds, never the copy. */
.mh-site .mh-main .mh-about {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#fff;
  background-image:none;
}
.mh-site .mh-main .mh-about::before {
  content:"";
  position:absolute;
  inset:-18px;
  z-index:0;
  pointer-events:none;
  background-image:var(--mh-about-bg, none);
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
  opacity:1;
  animation:mhAboutBgDrift 28s ease-in-out infinite alternate;
  will-change:transform;
}
.mh-site .mh-main .mh-about > .mh-container {position:relative;z-index:1}
@keyframes mhAboutBgDrift {
  from {transform:translate3d(-7px,0,0) scale(1.015)}
  to {transform:translate3d(7px,-5px,0) scale(1.035)}
}
/* The 1920px skyline tile travels one exact tile width, then repeats without
   a positional jump. Content and SVG do not inherit this transform. */
.mh-site .mh-main .mh-process {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background-color:#f4f4f4;
  background-image:none;
  min-height:722px;
  padding:48px 0 30px;
}
.mh-site .mh-main .mh-process::before {
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:calc(100% + 1920px);
  z-index:0;
  pointer-events:none;
  background-image:var(--mh-process-bg, none);
  background-repeat:repeat-x;
  background-position:left bottom;
  background-size:1920px 722px;
  animation:mhProcessSkyline 36s linear infinite;
  will-change:transform;
}
.mh-site .mh-main .mh-process > .mh-container {position:relative;z-index:1}
@keyframes mhProcessSkyline {
  from {transform:translate3d(0,0,0)}
  to {transform:translate3d(-1920px,0,0)}
}
.mh-site .mh-main .mh-process .mh-section__title {
  font-size:40px;
  line-height:60px;
  color:#001e45;
  margin:0;
}
.mh-site .mh-main .mh-process .mh-section__subtitle {
  max-width:572px;
  margin:0 auto;
  font-size:20px;
  line-height:30px;
  font-weight:500;
  color:#252525;
}
.mh-site .mh-main .mh-process__timeline--curve {
  min-height:480px;
  margin-top:33px;
  grid-template-columns:repeat(6,minmax(0,1fr));
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__line {
  top:0;
  left:0;
  width:100%;
  height:440px;
  overflow:visible;
}
/* Figma alternates low 01/03/05 with high 02/04/06. Use the actual
   visual order, not older --high/--low class assignments from template. */
.mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(odd) {padding-top:235px}
.mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(even) {padding-top:86px}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__number {
  display:grid;
  place-items:center;
  flex:0 0 118px;
  width:118px;
  height:118px;
  margin:0 auto 14px;
  background:#9daec3;
  color:#001e45;
  border-radius:50%;
  font-size:38px;
  line-height:1;
  font-weight:700;
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__step:first-of-type .mh-process__number {
  background:#001e45;
  color:#fff;
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__step {
  min-width:0;
  padding-left:4px;
  padding-right:4px;
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__step h3 {
  max-width:100%;
  margin:0 auto 5px;
  font-size:20px;
  line-height:1.4;
  font-weight:700;
  color:#111;
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__step p {
  max-width:192px;
  margin:0 auto;
  font-size:16px;
  line-height:1.45;
  color:#111;
}
/* Every curve interval is drawn individually, with normalized 0–100 path length.
   This prevents the old single SVG dash from stopping after step 02 on cached
   or inconsistent runtime dimensions. All five intervals form ONE continuous
   01 -> 02 -> 03 -> 04 -> 05 -> 06 animated line. */
.mh-site .mh-main .mh-process__timeline--flex::after {
  content:"";position:absolute;z-index:0;left:4%;right:4%;top:148px;height:3px;
  background:#001e45;transform:scaleX(0);transform-origin:left center;
}
.mh-site .mh-main .mh-process.is-process-running .mh-process__timeline--flex::after {
  animation:mhProcessFlexLine var(--mh-process-cycle,6800ms) linear both;
}
@keyframes mhProcessFlexLine {
  from {transform:scaleX(0)}
  to {transform:scaleX(1)}
}
.mh-site .mh-main .mh-process__timeline--curve .mh-process__segment {
  stroke-dasharray:100;
  stroke-dashoffset:100;
  animation:none;
  transition:none;
}
.mh-site .mh-main .mh-process.is-process-running .mh-process__timeline--curve .mh-process__segment {
  animation:mhProcessDrawInterval 1.5s linear both;
  animation-delay:calc(var(--mh-segment-index,0) * 1.5s);
}
@keyframes mhProcessDrawInterval {
  from {stroke-dashoffset:100}
  to {stroke-dashoffset:0}
}
.mh-site .mh-main .mh-process.is-process-running .mh-process__number {
  animation:mhProcessReached .68s ease-out both;
  animation-delay:calc(var(--mh-step-index,0) * var(--mh-process-step-time,1.5s));
}
@keyframes mhProcessReached {
  0% {background:#9daec3;color:#001e45;transform:scale(1);box-shadow:0 0 0 0 rgba(0,61,129,0)}
  20% {background:#001e45;color:#fff;transform:scale(1.08);box-shadow:0 0 0 9px rgba(32,120,206,.22)}
  60% {background:#001e45;color:#fff;transform:scale(1.045);box-shadow:0 0 0 14px rgba(32,120,206,0)}
  100% {background:#001e45;color:#fff;transform:scale(1);box-shadow:0 0 0 0 rgba(32,120,206,0)}
}
@media (max-width:1199px) {
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__number {
    width:86px;height:86px;flex-basis:86px;font-size:26px;
  }
  /* Centers remain at y=294 and 145, regardless of marker diameter. */
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(odd) {padding-top:251px}
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(even) {padding-top:102px}
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step h3 {font-size:17px}
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step p {font-size:14px}
}
@media (max-width:900px) {
  .mh-site .mh-main .mh-process {min-height:650px;padding:42px 0 25px}
  .mh-site .mh-main .mh-process__timeline--flex::after {top:113px;left:0;right:auto;width:calc(var(--mh-process-columns,6) * 170px)}
  .mh-site .mh-main .mh-process__timeline--curve {
    grid-template-columns:repeat(6,170px);
    min-height:450px;
    margin-top:30px;
  }
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__line {
    left:0;width:1020px;height:440px;
  }
  .mh-site .mh-main .mh-process .mh-section__subtitle {font-size:16px;line-height:1.5}
}
@media (max-width:600px) {
  .mh-site .mh-main .mh-process .mh-section__title {font-size:29px;line-height:1.3}
  .mh-site .mh-main .mh-process .mh-section__subtitle {font-size:14px;line-height:1.55}
}
@media (prefers-reduced-motion:reduce) {
  .mh-site .mh-main .mh-about::before,
  .mh-site .mh-main .mh-process::before {animation:none;transform:none;will-change:auto}
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__segment,
  .mh-site .mh-main .mh-process.is-process-running .mh-process__timeline--curve .mh-process__segment {
    stroke-dashoffset:0;transition:none;animation:none;
  }
  .mh-site .mh-main .mh-process.is-process-running .mh-process__number {
    animation:none;background:#001e45;color:#fff;box-shadow:none;transform:none;
  }
  .mh-site .mh-main .mh-process__timeline--flex::after {animation:none;transform:scaleX(1)}
}

/* Mạnh Hùng / Figma 2071858026: 2009 x 824 block.
   Native nine-image overlap: rectangle size/position is a percentage of the
   original 2009 x 551 artwork; JS only changes the slot data attributes.
   No JS dependency for the initial layout, and no resize-dependent pixel writes. */
.mh-site .mh-main .mh-projects{
  background:#fff;padding:48px 0 58px;overflow:hidden;
}
.mh-site .mh-main .mh-projects .mh-section__title{
  margin:0;color:#001e45;font-size:40px;line-height:60px;font-weight:700;text-align:center;
}
.mh-site .mh-main .mh-projects .mh-section__subtitle{
  max-width:436px;margin:0 auto;color:#252525;font-size:20px;line-height:30px;font-weight:500;text-align:center;
}
/* At 1920px viewport the 2009px artwork centres at -44.5px like Figma.
   The 104.635vw ratio scales the complete gallery smoothly on smaller desktops. */
.mh-site .mh-main .mh-projects__stage{
  position:relative;display:block;width:104.6354167vw;max-width:2009px;
  height:auto;aspect-ratio:2009/551;
  margin:33px 0 0;left:50%;transform:translateX(-50%);
  overflow:hidden;isolation:isolate;perspective:none;
}
.mh-site .mh-main .mh-projects__stage .mh-projects__visual{
  position:absolute;display:block;box-sizing:border-box;max-width:none;
  left:var(--mh-pos-x,50%);top:50%;
  width:var(--mh-size-w,36.04%);height:var(--mh-size-h,100%);
  aspect-ratio:auto;overflow:hidden;border-radius:20px;background:#e7eaf0;
  opacity:1;visibility:visible;transform:translate(-50%,-50%);
  z-index:var(--mh-depth,1);box-shadow:none;
  transition:left .68s cubic-bezier(.22,.74,.24,1),
             width .68s cubic-bezier(.22,.74,.24,1),
             height .68s cubic-bezier(.22,.74,.24,1);
}
.mh-site .mh-main .mh-projects__stage.is-initializing .mh-projects__visual,
.mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-recycled{transition:none}
.mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-center{box-shadow:0 8px 20px #001e4517}
.mh-site .mh-main .mh-projects__stage .mh-projects__visual img{
  display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;
}
@media(hover:hover) and (pointer:fine){
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-center img{transition:transform .6s ease}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-center:hover img{transform:scale(1.035)}
}
.mh-site .mh-main .mh-projects__stage .mh-projects__visual:not(.is-center)::after{
  content:"";position:absolute;inset:0;background:rgba(0,0,0,.48);pointer-events:none;
}
/* Exact Figma rectangles (centres from left, widths and heights relative to stage):
   centre 724x551, ±1 400x472, ±2 350x413, ±3 264x311, ±4 210x247. */
.mh-projects__visual[data-mh-project-visual="0"]{--mh-pos-x:50%;--mh-size-w:36.04%;--mh-size-h:100%;--mh-depth:10}
.mh-projects__visual[data-mh-project-visual="-1"]{--mh-pos-x:30.49%;--mh-size-w:19.91%;--mh-size-h:85.66%;--mh-depth:9}
.mh-projects__visual[data-mh-project-visual="1"]{--mh-pos-x:69.51%;--mh-size-w:19.91%;--mh-size-h:85.66%;--mh-depth:9}
.mh-projects__visual[data-mh-project-visual="-2"]{--mh-pos-x:21.03%;--mh-size-w:17.42%;--mh-size-h:74.95%;--mh-depth:8}
.mh-projects__visual[data-mh-project-visual="2"]{--mh-pos-x:78.97%;--mh-size-w:17.42%;--mh-size-h:74.95%;--mh-depth:8}
.mh-projects__visual[data-mh-project-visual="-3"]{--mh-pos-x:12.52%;--mh-size-w:13.14%;--mh-size-h:56.44%;--mh-depth:7}
.mh-projects__visual[data-mh-project-visual="3"]{--mh-pos-x:87.48%;--mh-size-w:13.14%;--mh-size-h:56.44%;--mh-depth:7}
.mh-projects__visual[data-mh-project-visual="-4"]{--mh-pos-x:5.20%;--mh-size-w:10.45%;--mh-size-h:44.83%;--mh-depth:6}
.mh-projects__visual[data-mh-project-visual="4"]{--mh-pos-x:94.80%;--mh-size-w:10.45%;--mh-size-h:44.83%;--mh-depth:6}
.mh-site .mh-main .mh-projects__prev,.mh-site .mh-main .mh-projects__next{
  position:absolute;z-index:25;top:50%;width:51px;height:51px;border:0;border-radius:6px;
  display:grid;place-items:center;background:rgba(255,255,255,.72);color:#001e45;font-size:20px;
  transform:translate(-50%,-50%);cursor:pointer;transition:background .2s ease;
}
.mh-site .mh-main .mh-projects__prev{left:28.85%}
.mh-site .mh-main .mh-projects__next{left:71.15%;right:auto}
.mh-site .mh-main .mh-projects__prev:hover,.mh-site .mh-main .mh-projects__next:hover{background:#fff}
.mh-site .mh-main .mh-projects__caption{
  width:min(760px,calc(100% - 32px));max-width:none;margin:14px auto 0;
  min-height:106px;text-align:center;padding:0;
}
.mh-site .mh-main .mh-projects__caption h3{
  font-size:32px;line-height:48px;font-weight:700;color:#272727;margin:0;overflow-wrap:anywhere;
}
.mh-site .mh-main .mh-projects__caption p{
  margin:0 auto;white-space:pre-line;font-size:18px;line-height:27px;font-weight:400;color:#111;
}
@media(max-width:900px){
  .mh-site .mh-main .mh-projects{padding:40px 0 52px}
  .mh-site .mh-main .mh-projects .mh-section__title{font-size:32px;line-height:45px}
  .mh-site .mh-main .mh-projects .mh-section__subtitle{font-size:16px;line-height:24px}
  .mh-site .mh-main .mh-projects__caption h3{font-size:25px;line-height:36px}
  .mh-site .mh-main .mh-projects__caption p{font-size:15px;line-height:24px}
}
@media(max-width:600px){
  .mh-site .mh-main .mh-projects{padding:35px 0 40px}
  .mh-site .mh-main .mh-projects__stage{margin-top:22px;height:230px;aspect-ratio:auto}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual:not(.is-center){visibility:hidden;pointer-events:none}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-center{
    left:50%;width:78%;height:100%;border-radius:12px;
  }
  .mh-site .mh-main .mh-projects__prev,.mh-site .mh-main .mh-projects__next{width:36px;height:36px;font-size:14px}
  .mh-site .mh-main .mh-projects__prev{left:12%}
  .mh-site .mh-main .mh-projects__next{left:88%}
  .mh-site .mh-main .mh-projects__caption{min-height:85px;margin-top:10px}
  .mh-site .mh-main .mh-projects__caption h3{font-size:21px;line-height:30px}
  .mh-site .mh-main .mh-projects__caption p{font-size:13px;line-height:20px}
}
@media(prefers-reduced-motion:reduce){
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual{transition:none}
  .mh-site .mh-main .mh-projects__caption.mh-caption-refresh{animation:none}
}

.mh-site .mh-main .mh-compact-nav {display:none}
/* ================================================================
   MẠNH HÙNG — responsive refinement 2026-10-30
   Original desktop/Figma rules above remain authoritative.
   This section applies only to Mạnh Hùng, not shared DTSCORE skins.
   ================================================================ */
@media (max-width: 1199px) {
  .mh-site .mh-main .mh-about__layout {min-width:0}
  .mh-site .mh-main .mh-about__copy,
  .mh-site .mh-main .mh-services__content,
  .mh-site .mh-main .mh-consult__form-area {min-width:0}
  .mh-site .mh-main .mh-about__description {overflow-wrap:anywhere}
  .mh-site .mh-main .mh-about__description img {max-width:100%;height:auto}
  .mh-site .mh-main .mh-service-card {min-width:0}
  .mh-site .mh-main .mh-services__page {grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-site .mh-main .mh-service-card h3 {overflow-wrap:anywhere}
}

/* Tablet: keep two spacious service cards, compact nav and a readable process. */
@media (max-width: 1100px) {
  .mh-site .mh-main .mh-process {min-height:0;padding:55px 0 64px}
  .mh-site .mh-main .mh-process::before {opacity:.42}
  .mh-site .mh-main .mh-process__timeline,
  .mh-site .mh-main .mh-process__timeline--curve,
  .mh-site .mh-main .mh-process__timeline--flex {
    display:grid;grid-template-columns:minmax(0,1fr);gap:0;
    width:min(100%,760px);margin:30px auto 0;padding:0;
    min-height:0;overflow:visible;align-items:stretch;
  }
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__line,
  .mh-site .mh-main .mh-process__timeline--flex::before,
  .mh-site .mh-main .mh-process__timeline--flex::after {display:none}
  .mh-site .mh-main .mh-process__timeline > .mh-process__step,
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(n) {
    display:grid;grid-template-columns:72px minmax(0,1fr);
    grid-template-rows:min-content auto;align-content:start;align-items:start;
    column-gap:22px;text-align:left;width:100%;min-width:0;
    padding:0 0 34px;min-height:110px;position:relative;
  }
  .mh-site .mh-main .mh-process__timeline > .mh-process__step:not(:last-child)::after {
    content:"";position:absolute;left:35px;top:76px;bottom:4px;
    width:2px;border-radius:4px;background:#8a9fb9;pointer-events:none;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number {
    grid-column:1;grid-row:1 / span 2;justify-self:start;
    width:72px;height:72px;flex:0 0 72px;
    margin:0;min-width:0;font-size:23px;line-height:1;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number img {max-width:60%;max-height:60%;width:auto;height:auto}
  .mh-site .mh-main .mh-process__timeline--flex .mh-process__number::after {display:none}
  .mh-site .mh-main .mh-process__timeline .mh-process__step h3 {
    grid-column:2;grid-row:1;max-width:none;margin:5px 0 5px;
    font-size:19px;line-height:1.4;text-align:left;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step p {
    grid-column:2;grid-row:2;max-width:none;margin:0;
    font-size:15px;line-height:1.6;text-align:left;overflow-wrap:anywhere;
  }
  /* The curved SVG is desktop-only; on mobile the vertical line is static. */
  .mh-site .mh-main .mh-process.is-process-running .mh-process__timeline .mh-process__number {animation:none}
}

@media (max-width: 900px) {
  .mh-site .mh-topbar {display:none}
  .mh-site .mh-nav {min-height:72px;z-index:220}
  .mh-site .mh-nav__inner {height:72px;gap:16px}
  .mh-site .mh-nav__logo {max-width:min(65%,260px);flex:0 1 auto;transform:none}
  .mh-site .mh-nav__logo img {display:block;width:auto;height:auto;max-height:64px}
  .mh-site .mh-nav__toggle {flex:0 0 44px;width:44px;height:44px;font-size:20px}
  .mh-site .mh-nav__toggle[aria-expanded="true"] {background:#0b477e}
  .mh-site .mh-nav__mobile:not([hidden]) {
    display:block;position:absolute;left:0;right:0;top:100%;z-index:225;
    background:#fff;max-height:calc(100dvh - 72px);overflow:auto;
    padding:10px max(20px,calc((100vw - 760px)/2));
    box-shadow:0 14px 22px rgba(0,30,69,.16);
    overscroll-behavior:contain;
  }
  .mh-site .mh-nav__mobile-item {min-height:49px;gap:8px}
  .mh-site .mh-nav__mobile-item>a {font-size:16px;line-height:1.45}
  .mh-site .mh-nav__mobile-item details {max-width:100%;font-size:14px}
  .mh-site .mh-nav__mobile-item summary {cursor:pointer;padding:9px 4px;list-style:revert}
  .mh-site .mh-nav__mobile-children {width:100%;gap:0;padding:4px 0 10px 14px}
  .mh-site .mh-nav__mobile-children a {display:block;padding:11px 6px;line-height:1.5;border-bottom:1px solid #edf1f6;overflow-wrap:anywhere}
  .mh-site .mh-nav__mobile-contacts {display:flex;flex-wrap:wrap;gap:12px;padding:18px 0 12px}
  .mh-site .mh-nav__mobile-call {display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 16px;border-radius:8px;background:var(--mh-navy);color:#fff;font-weight:600;min-height:44px}
  .mh-site .mh-nav__mobile-socials {display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .mh-site .mh-nav__mobile-socials a {display:grid;place-items:center;min-width:42px;min-height:42px;border:1px solid #dbe3ef;border-radius:8px;color:var(--mh-navy)}
  .mh-site.mh-menu-open :is(#hotline,#social,.social-template-4,.scrollToTop) {opacity:0;visibility:hidden;pointer-events:none}
  .mh-site .mh-main .mh-services__page {grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .mh-site .mh-main .mh-service-card {height:auto;min-height:0;padding:11px}
  .mh-site .mh-main .mh-service-card__media {height:auto;aspect-ratio:16/10}
  .mh-site .mh-main .mh-service-card h3 {font-size:18px;line-height:1.45;min-height:0}
  .mh-site .mh-main .mh-service-card p {font-size:14px;line-height:1.55;min-height:0}
  .mh-site .mh-main .mh-service-card__more {font-size:14px}
  .mh-site .mh-main .mh-why__card {min-height:0}
  .mh-site .mh-main .mh-why__marquee .mh-why__card {width:min(44vw,350px);min-width:0;flex-basis:min(44vw,350px)}
  .mh-site .mh-main .mh-projects__stage {width:min(100%,900px);max-width:none;aspect-ratio:2009/660}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual:not(.is-center):not([data-mh-project-visual="-1"]):not([data-mh-project-visual="1"]) {visibility:hidden;pointer-events:none}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual[data-mh-project-visual="0"] {--mh-pos-x:50%;--mh-size-w:52%;--mh-size-h:100%}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual[data-mh-project-visual="-1"] {--mh-pos-x:19%;--mh-size-w:30%;--mh-size-h:76%}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual[data-mh-project-visual="1"] {--mh-pos-x:81%;--mh-size-w:30%;--mh-size-h:76%}
  .mh-site .mh-main .mh-projects__prev {left:27%}
  .mh-site .mh-main .mh-projects__next {left:73%}
  .mh-site .mh-main .mh-projects__caption {width:min(100% - 40px,600px)}
  .mh-site .mh-main .mh-consult__form input,
  .mh-site .mh-main .mh-consult__form textarea {font-size:16px;min-height:48px}
  .mh-site .mh-main .mh-consult__form textarea {min-height:125px}
  .mh-site .mh-main .mh-consult__form label {min-width:0}
  .mh-site .mh-main .mh-consult__form button {min-height:48px}
  .mh-site .mh-footer__grid {min-width:0;gap:26px}
  .mh-site .mh-footer__column {min-width:0}
  .mh-site .mh-footer__column a {overflow-wrap:anywhere}
}

/* Mobile-only process status controls are invisible on the Figma desktop layout. */
.mh-site .mh-main .mh-process__progress-nav,
.mh-site .mh-main .mh-process__step-label,
.mh-site .mh-main .mh-process__nav-text {display:none}

@media (max-width: 600px) {
  .mh-site .mh-container {width:calc(100% - 36px)}
  /* Compact header: contact links remain accessible from mobile menu. */
  .mh-site .mh-topbar {display:none}
  .mh-site .mh-nav {min-height:64px}
  .mh-site .mh-nav__inner {height:64px}
  .mh-site .mh-nav__logo {max-width:calc(100% - 62px)}
  .mh-site .mh-nav__logo img {max-height:57px}
  .mh-site .mh-nav__mobile:not([hidden]) {max-height:calc(100dvh - 64px);padding:8px 18px 18px}
  .mh-site .mh-hero {height:auto;min-height:450px;max-height:none}
  .mh-site .mh-hero__slide {position:absolute;inset:0}
  .mh-site .mh-hero__inner {min-height:450px;height:auto;padding:58px 0 70px;align-items:center}
  .mh-site .mh-hero__copy {max-width:100%;width:100%;position:relative;z-index:1}
  .mh-site .mh-hero__eyebrow {font-size:12px;line-height:1.45}
  .mh-site .mh-hero__copy h1,
  .mh-site .mh-hero__copy h2 {font-size:clamp(26px,7.5vw,34px);line-height:1.28;margin:12px 0 16px;overflow-wrap:break-word}
  .mh-site .mh-hero__copy p {font-size:15px;line-height:1.7;margin:0 0 22px}
  .mh-site .mh-hero__pagination {bottom:18px}
  .mh-site .mh-btn {min-height:44px}
  .mh-site .mh-main .mh-about {padding:48px 0 58px}
  .mh-site .mh-main .mh-about__layout {gap:26px}
  .mh-site .mh-main .mh-about__photos {aspect-ratio:557/588;max-width:450px;margin:0 auto}
  .mh-site .mh-main .mh-about__photo {border-radius:14px}
  .mh-site .mh-main .mh-about__copy {min-width:0}
  .mh-site .mh-main .mh-about__copy h2 {font-size:clamp(25px,7vw,30px);margin:0 0 14px}
  .mh-site .mh-main .mh-about__description,
  .mh-site .mh-main .mh-about__description p {font-size:15px;line-height:1.75;color:#333}
  .mh-site .mh-main .mh-about__criteria {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 14px;border:0;padding:22px 0 0;border-top:1px solid #e2e7ed}
  .mh-site .mh-main .mh-about__criterion {min-width:0;gap:10px}
  .mh-site .mh-main .mh-about__criterion h3 {font-size:16px;line-height:1.4;overflow-wrap:anywhere}
  .mh-site .mh-main .mh-about__criterion p {font-size:13px;line-height:1.5;overflow-wrap:anywhere}
  .mh-site .mh-main .mh-services {padding:0 0 56px}
  .mh-site .mh-main .mh-services__layout {gap:22px}
  .mh-site .mh-main .mh-services__feature {min-height:285px;padding:24px;border-radius:16px}
  .mh-site .mh-main .mh-services__feature h2 {font-size:27px;line-height:1.35}
  .mh-site .mh-main .mh-services__feature p {font-size:15px;line-height:1.6}
  .mh-site .mh-main .mh-services__page {grid-template-columns:minmax(0,1fr);gap:17px}
  .mh-site .mh-main .mh-service-card {height:auto;min-height:0;padding:10px;border-radius:15px}
  .mh-site .mh-main .mh-service-card__media {height:auto;aspect-ratio:16/9;border-radius:11px}
  .mh-site .mh-main .mh-service-card__body {padding:14px 6px 4px;min-width:0}
  .mh-site .mh-main .mh-service-card h3 {font-size:18px;line-height:1.45;min-height:0;margin-bottom:7px}
  .mh-site .mh-main .mh-service-card p {font-size:14px;line-height:1.65;min-height:0;-webkit-line-clamp:3;margin:0 0 12px}
  .mh-site .mh-main .mh-service-card__more {font-size:14px;padding:11px 0 2px;min-height:42px}
  .mh-site .mh-main .mh-services__paging {position:static;transform:none;margin:16px auto 0;justify-content:center;gap:20px;pointer-events:auto}
  .mh-site .mh-main .mh-services__paging span {display:inline-block;font-size:14px;font-weight:600;color:#001e45;min-width:40px;text-align:center}
  .mh-site .mh-main .mh-services__paging button {width:44px;height:44px;flex:0 0 44px}
  .mh-site .mh-main .mh-why {padding:50px 0 55px}
  .mh-site .mh-main .mh-why__head {gap:13px;margin-bottom:24px}
  .mh-site .mh-main .mh-why__head h2 {font-size:27px;line-height:1.35}
  .mh-site .mh-main .mh-why__head p {font-size:15px;line-height:1.65}
  .mh-site .mh-main .mh-why__cards {grid-template-columns:minmax(0,1fr);gap:14px}
  .mh-site .mh-main .mh-why__marquee {overflow:visible;scroll-behavior:auto}
  .mh-site .mh-main .mh-why__marquee-track {width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
  .mh-site .mh-main .mh-why__marquee .mh-why__card {width:100%;min-width:0;max-width:none;flex:initial}
  .mh-site .mh-main .mh-why__marquee .mh-why__card[aria-hidden="true"] {display:none}
  .mh-site .mh-main .mh-why__card {min-height:0;padding:20px;backdrop-filter:blur(3px);border-radius:14px}
  .mh-site .mh-main .mh-why__icon {width:52px;height:52px;margin-bottom:14px}
  .mh-site .mh-main .mh-why__card h3 {font-size:18px;line-height:1.45}
  .mh-site .mh-main .mh-why__card p {font-size:14px;line-height:1.6}
  .mh-site .mh-main .mh-process {padding:47px 0 50px}
  .mh-site .mh-main .mh-process .mh-section__title {font-size:28px;line-height:1.35}
  .mh-site .mh-main .mh-process .mh-section__subtitle {font-size:15px;line-height:1.6}
  .mh-site .mh-main .mh-process__timeline {margin-top:26px}
  .mh-site .mh-main .mh-process__timeline > .mh-process__step,
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(n) {
    grid-template-columns:56px minmax(0,1fr);column-gap:15px;min-height:100px;padding:0 0 26px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number {width:56px;height:56px;flex:0 0 56px;font-size:18px}
  .mh-site .mh-main .mh-process__timeline > .mh-process__step:not(:last-child)::after {left:27px;top:61px;bottom:4px}
  .mh-site .mh-main .mh-process__timeline .mh-process__step h3 {font-size:17px;line-height:1.45;margin:2px 0 4px}
  .mh-site .mh-main .mh-process__timeline .mh-process__step p {font-size:14px;line-height:1.6}
  .mh-site .mh-main .mh-projects {padding:48px 0 54px}
  .mh-site .mh-main .mh-projects .mh-section__title {font-size:29px;line-height:1.35}
  .mh-site .mh-main .mh-projects .mh-section__subtitle {max-width:360px;font-size:15px;line-height:1.6;padding:0 18px}
  .mh-site .mh-main .mh-projects__stage {position:relative;width:calc(100% - 36px);max-width:540px;height:auto;aspect-ratio:724/551;left:auto;transform:none;margin:22px auto 0;overflow:visible}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual:not(.is-center) {visibility:hidden;pointer-events:none}
  .mh-site .mh-main .mh-projects__stage .mh-projects__visual.is-center {left:50%;top:50%;width:100%;height:100%;border-radius:12px}
  .mh-site .mh-main .mh-projects__prev,
  .mh-site .mh-main .mh-projects__next {width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:0 3px 14px #001e4530;font-size:18px}
  .mh-site .mh-main .mh-projects__prev {left:7%}
  .mh-site .mh-main .mh-projects__next {left:93%}
  .mh-site .mh-main .mh-projects__caption {width:calc(100% - 36px);min-height:0;margin:17px auto 0}
  .mh-site .mh-main .mh-projects__caption h3 {font-size:21px;line-height:1.4}
  .mh-site .mh-main .mh-projects__caption p {font-size:14px;line-height:1.55}
  .mh-site .mh-main .mh-consult {padding:50px 0 55px}
  .mh-site .mh-main .mh-consult__grid {gap:28px}
  .mh-site .mh-main .mh-consult h2 {font-size:27px;line-height:1.4;margin:0 0 23px}
  .mh-site .mh-main .mh-consult__form-area {padding-bottom:30px}
  .mh-site .mh-main .mh-consult__form {gap:15px}
  .mh-site .mh-main .mh-consult__form label {font-size:15px;gap:8px}
  .mh-site .mh-main .mh-consult__row {grid-template-columns:minmax(0,1fr);gap:15px}
  .mh-site .mh-main .mh-consult__reasons {gap:13px}
  .mh-site .mh-main .mh-consult__reasons h3 {font-size:19px;line-height:1.5}
  .mh-site .mh-main .mh-consult__reason {padding:15px 16px}
  .mh-site .mh-main .mh-consult__reason h4 {font-size:17px}
  .mh-site .mh-main .mh-consult__reason p {font-size:14px;line-height:1.6}
  .mh-site .mh-main .mh-news {padding:50px 0 60px}
  .mh-site .mh-main .mh-news__slider {margin-top:26px}
  .mh-site .mh-main .mh-news__track {gap:14px;scroll-padding:0 4px}
  .mh-site .mh-main .mh-news__card {flex:0 0 min(100%,430px);height:390px;padding:24px 20px;scroll-snap-align:center}
  .mh-site .mh-main .mh-news__card h3 {font-size:21px;line-height:1.45;overflow-wrap:anywhere}
  .mh-site .mh-main .mh-news__prev,
  .mh-site .mh-main .mh-news__next {width:44px;height:44px;top:50%}
  .mh-site .mh-main .mh-news__prev {left:4px}
  .mh-site .mh-main .mh-news__next {right:4px}
  .mh-site .mh-footer {padding-top:45px}
  .mh-site .mh-footer__grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px;padding-bottom:35px}
  .mh-site .mh-footer__company {grid-column:1/-1}
  .mh-site .mh-footer__logo img {width:min(100%,290px);max-height:none;height:auto}
  .mh-site .mh-footer__column h2 {font-size:17px;margin:5px 0 13px}
  .mh-site .mh-footer__column a {font-size:14px;line-height:1.65;margin-bottom:11px}
  .mh-site .mh-footer__company p {font-size:14px;line-height:1.65}
  .mh-site .mh-footer__social a {width:44px;height:44px}
  .mh-site .mh-footer__bottom {padding:20px 0 25px;font-size:12px}
  /* Floating actions remain visible except while a form or mobile menu is in use. */
  .mh-site #hotline.btn-frame {left:12px;right:auto;bottom:calc(16px + env(safe-area-inset-bottom));width:44px;height:44px}
  .mh-site #hotline.btn-frame i {width:44px;height:44px}
  .mh-site #social {left:auto;right:12px;bottom:calc(78px + env(safe-area-inset-bottom));gap:9px}
  .mh-site #social .btn-frame,
  .mh-site #social .btn-frame i {width:44px;height:44px}
  .mh-site .social-template-4 {left:auto;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));max-width:40px;width:40px;gap:8px}
  .mh-site .social-template-4__item {width:40px;height:40px;min-width:40px;min-height:40px}
  .mh-site .mh-main .mh-consult__form {scroll-margin-block:100px}
  .mh-site.mh-contact-in-view :is(#hotline,#social,.social-template-4,.scrollToTop),
  .mh-site.mh-form-focus :is(#hotline,#social,.social-template-4,.scrollToTop) {opacity:0;visibility:hidden;pointer-events:none}

  /* COMPACT MOBILE / 2026-10-30: use horizontal browsing instead of
     six full-height service cards. The admin still supplies every item. */
  .mh-site .mh-main .mh-services {padding-bottom:34px}
  .mh-site .mh-main .mh-services__layout {gap:14px}
  .mh-site .mh-main .mh-services__feature {min-height:205px;padding:20px 22px;border-radius:13px}
  .mh-site .mh-main .mh-services__feature h2 {font-size:24px;line-height:1.3;margin-bottom:9px}
  .mh-site .mh-main .mh-services__feature p {font-size:13px;line-height:1.5;margin-bottom:13px}
  .mh-site .mh-main .mh-services__feature .mh-btn {padding:10px 14px;min-height:38px;font-size:13px}
  .mh-site .mh-main .mh-services__content {width:100%;max-width:100%;min-width:0}
  .mh-site .mh-main .mh-services__page.is-active {display:flex;flex-wrap:nowrap;gap:12px;width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:0;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:3px 2px 9px}
  .mh-site .mh-main .mh-services__page[hidden] {display:none}
  .mh-site .mh-main .mh-services__page::-webkit-scrollbar {display:none}
  .mh-site .mh-main .mh-services__page.is-active > .mh-service-card {flex:0 0 calc(100% - 6px);max-width:calc(100% - 6px);min-width:0;height:auto;min-height:0;scroll-snap-align:start;scroll-snap-stop:always;background:#fff;border:1px solid #e3e8f0;box-shadow:0 4px 14px #001e4512;border-radius:13px;padding:9px}
  .mh-site .mh-main .mh-service-card__media {aspect-ratio:16/8.5;max-height:195px}
  .mh-site .mh-main .mh-service-card__body {padding:10px 6px 1px}
  .mh-site .mh-main .mh-service-card h3 {font-size:16px;line-height:1.4;margin:0 0 5px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .mh-site .mh-main .mh-service-card p {font-size:13px;line-height:1.5;-webkit-line-clamp:2;margin-bottom:8px}
  .mh-site .mh-main .mh-service-card__more {font-size:13px;min-height:32px;margin-top:auto;padding:7px 0 0}
  .mh-site .mh-main .mh-services__paging {display:none}
  .mh-site .mh-main .mh-why {padding:34px 0 38px}
  .mh-site .mh-main .mh-why__head {margin-bottom:15px;gap:7px}
  .mh-site .mh-main .mh-why__head h2 {font-size:24px;line-height:1.32}
  .mh-site .mh-main .mh-why__head p {font-size:13px;line-height:1.5}
  .mh-site .mh-main .mh-why__cards {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .mh-site .mh-main .mh-why__card {min-width:0;min-height:148px;padding:13px 11px;border-radius:12px;background:rgba(255,255,255,.17);border-color:rgba(255,255,255,.16)}
  .mh-site .mh-main .mh-why__icon {width:35px;height:35px;margin-bottom:10px;border-radius:9px}
  .mh-site .mh-main .mh-why__icon img {width:24px;height:24px}
  .mh-site .mh-main .mh-why__card h3 {font-size:14px;line-height:1.35;margin:0 0 5px;overflow-wrap:anywhere}
  .mh-site .mh-main .mh-why__card p {font-size:12px;line-height:1.4;display:block;overflow-wrap:anywhere}
  /* When Dashboard has more than four reasons, retain swipeable access. */
  .mh-site .mh-main .mh-why__marquee {overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}
  .mh-site .mh-main .mh-why__marquee::-webkit-scrollbar {display:none}
  .mh-site .mh-main .mh-why__marquee-track {display:flex;width:max-content;gap:10px}
  .mh-site .mh-main .mh-why__marquee .mh-why__card {width:min(72vw,275px);max-width:min(72vw,275px);flex:0 0 min(72vw,275px);scroll-snap-align:start}

  .mh-site .mh-main .mh-process {
    padding:35px 0 37px;
    background:#f5f8fc;
    min-height:0;
  }
  .mh-site .mh-main .mh-process::before {
    opacity:.11;
    animation-duration:65s;
  }
  .mh-site.mh-motion-ready .mh-main .mh-process .mh-section__title.mh-reveal,
  .mh-site.mh-motion-ready .mh-main .mh-process .mh-section__subtitle.mh-reveal {
    opacity:1;
    transform:none;
    transition:none;
  }
  .mh-site .mh-main .mh-process .mh-section__title {
    text-align:center;
    font-size:clamp(25px,7vw,29px);
    line-height:1.3;
  }
  .mh-site .mh-main .mh-process .mh-section__subtitle {
    text-align:center;
    max-width:360px;
    padding:0 8px;
    font-size:14px;
    line-height:1.55;
    margin:8px auto 0;
  }
  .mh-site .mh-main .mh-process__timeline,
  .mh-site .mh-main .mh-process__timeline--curve,
  .mh-site .mh-main .mh-process__timeline--flex {
    display:flex;
    align-items:stretch;
    width:100%;
    max-width:100%;
    height:auto;
    min-height:0;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    grid-template-columns:none;
    margin-top:0;
    gap:0;
    padding:0;
    border-radius:18px;
    scroll-padding-inline:0;
    background:transparent;
  }
  .mh-site .mh-main .mh-process__timeline::-webkit-scrollbar {display:none}
  .mh-site .mh-main .mh-process__timeline > .mh-process__step,
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(n),
  .mh-site .mh-main .mh-process__timeline--flex > .mh-process__step:nth-of-type(n) {
    position:relative;
    display:grid;
    flex:0 0 100%;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:164px;
    height:auto;
    grid-template-columns:58px minmax(0,1fr);
    grid-template-rows:auto auto minmax(0,1fr);
    align-content:center;
    align-items:start;
    column-gap:15px;
    row-gap:5px;
    padding:21px 19px 23px;
    background:linear-gradient(135deg,#fff 0%,#fff 63%,#edf6fc 100%);
    border:1px solid #dce7f1;
    border-radius:18px;
    box-shadow:0 12px 28px rgba(0,30,69,.09);
    scroll-snap-align:start;
    overflow:hidden;
  }
  .mh-site .mh-main .mh-process__timeline > .mh-process__step::before,
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(n)::before {
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:4px;
    background:linear-gradient(180deg,#04b5df,#001e45);
    pointer-events:none;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step-label {
    display:block;
    grid-column:1/-1;
    grid-row:1;
    font-size:11px;
    line-height:1.35;
    font-weight:700;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:#277bab;
    text-align:left;
    margin-bottom:8px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__number,
  .mh-site .mh-main .mh-process__timeline--flex .mh-process__number {
    display:grid;
    place-self:start;
    place-items:center;
    grid-column:1;
    grid-row:2/span 2;
    width:58px;
    height:58px;
    min-width:58px;
    flex:0 0 58px;
    margin:0;
    border:0;
    border-radius:16px;
    font-size:19px;
    line-height:1;
    font-weight:700;
    color:#fff;
    background:linear-gradient(145deg,#053f76,#001e45);
    box-shadow:0 6px 14px #001e4528;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number img {width:62%;height:62%;max-height:62%;max-width:62%;object-fit:contain}
  .mh-site .mh-main .mh-process__timeline .mh-process__step h3,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step h3 {
    grid-column:2;
    grid-row:2;
    max-width:none;
    margin:0 0 1px;
    font-size:17px;
    line-height:1.35;
    font-weight:700;
    color:#001e45;
    text-align:left;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step p,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step p {
    grid-column:2;
    grid-row:3;
    max-width:none;
    margin:0;
    font-size:13px;
    line-height:1.55;
    color:#425269;
    text-align:left;
    overflow-wrap:anywhere;
  }
  .mh-site .mh-main .mh-process__timeline > .mh-process__step::after {display:none}
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
    gap:10px;
    align-items:center;
    width:100%;
    margin:15px auto 0;
  }
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav button {
    width:auto;
    min-width:0;
    height:43px;
    border-radius:11px;
    padding:0 15px;
    display:inline-flex;
    align-items:center;
    gap:9px;
    justify-content:center;
    font-size:14px;
    font-weight:600;
    box-shadow:none;
    border:1px solid #cbdbea;
  }
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav button:first-child {justify-self:stretch;background:#fff;color:#001e45}
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav button:last-child {justify-self:stretch;background:#001e45;color:#fff;border-color:#001e45}
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav button:disabled {opacity:.38}
  .mh-site .mh-main .mh-process__mobile-nav span[data-mh-process-count] {min-width:65px;letter-spacing:.04em;font-size:13px}
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav .mh-process__nav-text {display:inline}

  /* Subtle phone-only image depth — static desktop 3s swap remains unchanged. */
  .mh-site .mh-main .mh-about__photos {isolation:isolate}
  .mh-site .mh-main .mh-about__photo--large {
    z-index:1;
    box-shadow:0 10px 26px rgba(0,30,69,.15);
  }
  .mh-site .mh-main .mh-about__photo--small {
    z-index:2;
    box-shadow:0 16px 30px rgba(0,30,69,.24);
  }
  .mh-site .mh-main .mh-about__photos::after {
    content:"";
    position:absolute;
    z-index:3;
    left:43.63%;top:9.01%;width:56.37%;height:81.97%;
    border-radius:14px;
    pointer-events:none;
    opacity:0;
    background:linear-gradient(110deg,transparent 24%,rgba(255,255,255,.18) 48%,transparent 64%);
    background-size:240% 100%;
  }
  .mh-site .mh-main .mh-why__card {transition:border-color .25s ease,background .25s ease,box-shadow .25s ease}
  .mh-site .mh-main .mh-why__card:active {border-color:rgba(134,215,255,.6);background:rgba(255,255,255,.24)}
  .mh-site .mh-main > section {scroll-margin-top:80px}
  .mh-site .mh-main .mh-about__criteria {gap:12px 9px;padding-top:15px}
  .mh-site .mh-main .mh-about__criterion {gap:6px}
  .mh-site .mh-main .mh-about__icon {width:45px;height:45px;flex-basis:45px}
  .mh-site .mh-main .mh-about__criterion h3 {font-size:14px;line-height:1.35}
  .mh-site .mh-main .mh-about__criterion p {font-size:12px;line-height:1.45}
  /* Keep the two primary contact actions (Zalo and Google Maps) visible.
     Other social entries remain available from the mobile menu. */
  .mh-site .social-template-4__item:not(.social-template-4__back-to-top):nth-child(n+4) {display:none}
  .mh-site #social > .btn-frame:nth-child(n+3) {display:none}
  .mh-site #social {bottom:calc(18px + env(safe-area-inset-bottom))}
  .mh-site .social-template-4 {bottom:calc(18px + env(safe-area-inset-bottom))}
  .mh-site .scrollToTop {bottom:calc(72px + env(safe-area-inset-bottom))}
  /* Unified discreet compact section navigation. */
  .mh-site .mh-main .mh-compact-nav {display:flex;align-items:center;justify-content:center;gap:15px;margin:10px auto 0;color:#001e45}
  .mh-site .mh-main .mh-compact-nav button {width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid #dce4ee;background:#fff;color:#001e45;box-shadow:0 2px 9px #001e4517;cursor:pointer;touch-action:manipulation}
  .mh-site .mh-main .mh-compact-nav button:focus-visible {outline:2px solid #125ea1;outline-offset:2px}
  .mh-site .mh-main .mh-compact-nav button:disabled {opacity:.38;cursor:default}
  .mh-site .mh-main .mh-compact-nav span {min-width:58px;text-align:center;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.04em}
}
@media (max-width: 380px) {
  .mh-site .mh-main .mh-about__criteria {gap:20px 10px}
  .mh-site .mh-main .mh-about__criterion h3 {font-size:15px}
  .mh-site .mh-main .mh-news__card {height:365px}
  .mh-site .mh-footer__grid {grid-template-columns:minmax(0,1fr)}
  .mh-site .mh-footer__company {grid-column:auto}
  .mh-site .mh-hero__copy h1,.mh-site .mh-hero__copy h2 {font-size:26px}
}
@media (prefers-reduced-motion: reduce) {
  .mh-site .mh-main .mh-why__marquee {scroll-behavior:auto}
  .mh-site .mh-main .mh-process::before {animation:none}
}

/* MẠNH HÙNG — About: desktop-only alternating image roles, every 3 seconds.
   Cycle = 6s: primary/secondary trade large and small positions twice.
   Enabled by Blade only when BOTH real Dashboard images are available.
   The layout, image sources, and mobile/tablet styling remain unchanged. */
@media (min-width: 1200px) and (prefers-reduced-motion: no-preference) {
  .mh-site .mh-main .mh-about__photos--alternating > .mh-about__photo--large {
    z-index: 1;
    animation: mhAboutSwapPrimary 6s linear infinite;
  }
  .mh-site .mh-main .mh-about__photos--alternating > .mh-about__photo--small {
    z-index: 2;
    animation: mhAboutSwapSecondary 6s linear infinite;
  }
}
/* Positions match the existing desktop Figma photo coordinates.
   The 2.05s rests + .95s transitions give a role swap every 3 seconds. */
@keyframes mhAboutSwapPrimary {
  0%, 34.1667%, 100% {
    left: 0; top: 0; width: 76.66%; height: 100%; z-index: 1;
    filter: brightness(.97);
    box-shadow: 0 12px 26px rgba(0,30,69,.10);
    animation-timing-function: cubic-bezier(.4,0,.2,1);
  }
  50%, 84.1667% {
    left: 43.63%; top: 9.01%; width: 56.37%; height: 81.97%; z-index: 2;
    filter: brightness(1.04);
    box-shadow: 0 18px 38px rgba(0,30,69,.20);
    animation-timing-function: cubic-bezier(.4,0,.2,1);
  }
}
@keyframes mhAboutSwapSecondary {
  0%, 34.1667%, 100% {
    left: 43.63%; top: 9.01%; width: 56.37%; height: 81.97%; z-index: 2;
    filter: brightness(1.04);
    box-shadow: 0 18px 38px rgba(0,30,69,.20);
    animation-timing-function: cubic-bezier(.4,0,.2,1);
  }
  50%, 84.1667% {
    left: 0; top: 0; width: 76.66%; height: 100%; z-index: 1;
    filter: brightness(.97);
    box-shadow: 0 12px 26px rgba(0,30,69,.10);
    animation-timing-function: cubic-bezier(.4,0,.2,1);
  }
}




@media (max-width:600px) and (prefers-reduced-motion:no-preference) {
  .mh-site .mh-main .mh-about__photo--large {animation:mhMobilePhotoBack 6.5s ease-in-out infinite alternate}
  .mh-site .mh-main .mh-about__photo--small {animation:mhMobilePhotoFront 5.5s ease-in-out infinite alternate}
  .mh-site .mh-main .mh-about__photos::after {opacity:.8;animation:mhMobilePhotoGlint 7s ease-in-out infinite}
  .mh-site .mh-main .mh-process__timeline .mh-process__step.is-current {animation:mhMobileStepAppear .42s cubic-bezier(.2,.75,.2,1) both}
}
@keyframes mhMobilePhotoBack {from {transform:translate3d(0,0,0)} to {transform:translate3d(0,-5px,0)}}
@keyframes mhMobilePhotoFront {from {transform:translate3d(0,-5px,0)} to {transform:translate3d(0,7px,0)}}
@keyframes mhMobilePhotoGlint {0%,58% {background-position:140% 0;opacity:0}68% {opacity:.65}86%,100% {background-position:-140% 0;opacity:0}}
@keyframes mhMobileStepAppear {from {opacity:.65;transform:translate3d(0,9px,0)} to {opacity:1;transform:translate3d(0,0,0)}}


/* Tablet and mobile: same 3-second image alternation as desktop, only when
   both Dashboard photos exist. For a single photo, keep a gentle float. */
@media (max-width:1199px) and (prefers-reduced-motion:no-preference) {
  .mh-site .mh-main .mh-about__photos--alternating > .mh-about__photo--large {
    z-index:1;
    animation:mhAboutSwapPrimary 6s linear infinite;
  }
  .mh-site .mh-main .mh-about__photos--alternating > .mh-about__photo--small {
    z-index:2;
    animation:mhAboutSwapSecondary 6s linear infinite;
  }
}

/* Project gallery has a separate, non-overlapping mobile navigation row. */
.mh-site .mh-main .mh-projects__mobile-controls {display:none}

/* MẠNH HÙNG — Responsive refinement V4
   - hide the horizontal process jump nav on responsive
   - turn "Vì sao chọn" into an auto-running horizontal card rail every 3s */
@media (max-width: 900px) {

  .mh-site .mh-main .mh-why {
    padding:50px 0 46px;
  }
  .mh-site .mh-main .mh-why__head {
    display:block;
    margin-bottom:18px;
  }
  .mh-site .mh-main .mh-why__head h2 {
    font-size:31px;
    line-height:1.25;
    margin-bottom:8px;
  }
  .mh-site .mh-main .mh-why__head p {
    max-width:none;
    text-align:left;
    font-size:14px;
    line-height:1.6;
    color:rgba(255,255,255,.88);
  }
  .mh-site .mh-main .mh-why__cards {
    display:flex;
    grid-template-columns:none;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    padding:3px 0 8px;
    -webkit-overflow-scrolling:touch;
  }
  .mh-site .mh-main .mh-why__cards::-webkit-scrollbar {display:none}
  .mh-site .mh-main .mh-why__cards .mh-why__card {
    flex:0 0 calc(100% - 24px);
    min-width:calc(100% - 24px);
    min-height:204px;
    padding:22px 20px 20px;
    scroll-snap-align:start;
    border:1px solid rgba(255,255,255,.14);
    background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.12));
    box-shadow:0 12px 24px rgba(0,0,0,.14);
  }
  .mh-site .mh-main .mh-why__cards .mh-why__icon,
  .mh-site .mh-main .mh-why__marquee .mh-why__icon {
    width:60px;
    height:60px;
    margin-bottom:18px;
  }
  .mh-site .mh-main .mh-why__cards .mh-why__icon img,
  .mh-site .mh-main .mh-why__marquee .mh-why__icon img {
    width:34px;
    height:34px;
  }
  .mh-site .mh-main .mh-why__cards .mh-why__card h3,
  .mh-site .mh-main .mh-why__marquee .mh-why__card h3 {
    font-size:20px;
    line-height:1.35;
    margin-bottom:8px;
  }
  .mh-site .mh-main .mh-why__cards .mh-why__card p,
  .mh-site .mh-main .mh-why__marquee .mh-why__card p {
    font-size:14px;
    line-height:1.6;
    color:rgba(255,255,255,.96);
  }
  .mh-site .mh-main .mh-why__marquee {
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    padding-bottom:6px;
    -webkit-overflow-scrolling:touch;
  }
  .mh-site .mh-main .mh-why__marquee::-webkit-scrollbar {display:none}
  .mh-site .mh-main .mh-why__marquee-track {
    gap:14px;
  }
  .mh-site .mh-main .mh-why__marquee .mh-why__card {
    width:calc(100vw - 78px);
    min-width:calc(100vw - 78px);
    flex:0 0 calc(100vw - 78px);
    min-height:204px;
    padding:22px 20px 20px;
    scroll-snap-align:start;
  }

  .mh-site .mh-main .mh-process {
    padding:38px 0 32px;
  }
  /* Progress pill positions are generated from the actual Dashboard step count. */
  .mh-site .mh-main .mh-process__progress-nav {
    display:flex;
    align-items:center;
    gap:7px;
    width:100%;
    margin:23px 0 12px;
  }
  .mh-site .mh-main .mh-process__progress-button {
    position:relative;
    display:block;
    min-width:0;
    flex:1 1 0;
    height:20px;
    padding:7px 0;
    border:0;
    border-radius:0;
    background:transparent;
    cursor:pointer;
    touch-action:manipulation;
  }
  .mh-site .mh-main .mh-process__progress-button::before {
    content:"";
    position:absolute;
    inset:7px 0;
    border-radius:6px;
    background:#d1dce8;
  }
  .mh-site .mh-main .mh-process__progress-fill {
    display:block;
    position:absolute;
    inset:7px 0;
    z-index:1;
    border-radius:6px;
    background:linear-gradient(90deg,#086fb2,#04b6df);
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform .35s ease;
  }
  .mh-site .mh-main .mh-process__progress-button:is(.is-current,.is-complete) .mh-process__progress-fill {transform:scaleX(1)}
  .mh-site .mh-main .mh-process__progress-button.is-complete .mh-process__progress-fill {background:#6489ae}
  .mh-site .mh-main .mh-process__progress-button:focus-visible {outline:2px solid #0874b9;outline-offset:3px;border-radius:6px}

  /* Project slider arrows live below the real article content on responsive. */
  .mh-site .mh-main .mh-projects__stage > .mh-projects__prev,
  .mh-site .mh-main .mh-projects__stage > .mh-projects__next {display:none}
  .mh-site .mh-main .mh-projects__mobile-controls {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    width:100%;
    margin:17px auto 0;
  }
  .mh-site .mh-main .mh-projects__mobile-controls button {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border:1px solid #d6e3f1;
    border-radius:50%;
    background:#fff;
    color:#001e45;
    font-size:16px;
    box-shadow:0 4px 12px rgba(0,30,69,.10);
    cursor:pointer;
    touch-action:manipulation;
  }
  .mh-site .mh-main .mh-projects__mobile-controls button:focus-visible {
    outline:2px solid #0068aa;
    outline-offset:3px;
  }
  /* News slider uses a separate navigation row instead of overlaying text. */
  .mh-site .mh-main .mh-news__slider.has-controls {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:"track track" "prev next";
    align-items:center;
    justify-items:center;
    gap:15px 12px;
  }
  .mh-site .mh-main .mh-news__slider.has-controls .mh-news__track {
    grid-area:track;
    width:100%;
    min-width:0;
  }
  .mh-site .mh-main .mh-news__slider.has-controls .mh-news__prev {
    grid-area:prev;
    justify-self:end;
  }
  .mh-site .mh-main .mh-news__slider.has-controls .mh-news__next {
    grid-area:next;
    justify-self:start;
  }
  .mh-site .mh-main .mh-news__slider.has-controls > .mh-news__prev,
  .mh-site .mh-main .mh-news__slider.has-controls > .mh-news__next {
    position:static;
    top:auto;
    bottom:auto;
    left:auto;
    right:auto;
    transform:none;
    width:44px;
    height:44px;
    margin:0;
    font-size:16px;
    border-radius:50%;
    box-shadow:0 4px 12px rgba(0,30,69,.12);
  }
  .mh-site .mh-main .mh-process .mh-section__title {
    margin-bottom:8px;
  }
  .mh-site .mh-main .mh-process .mh-section__subtitle {
    max-width:310px;
    margin:0 auto 14px;
  }
  .mh-site .mh-main .mh-process__timeline,
  .mh-site .mh-main .mh-process__timeline--curve,
  .mh-site .mh-main .mh-process__timeline--flex {
    margin-top:0;
  }
}

@media (max-width: 600px) {
  .mh-site .mh-main .mh-why__head h2 {font-size:29px}
  .mh-site .mh-main .mh-why__cards .mh-why__card,
  .mh-site .mh-main .mh-why__marquee .mh-why__card {
    flex-basis:calc(100% - 16px);
    min-width:calc(100% - 16px);
    width:calc(100% - 16px);
    min-height:196px;
    border-radius:18px;
  }

  .mh-site .mh-main .mh-process {
    padding:34px 0 30px;
  }
  .mh-site .mh-main .mh-process .mh-section__subtitle {
    max-width:285px;
    font-size:13px;
    line-height:1.55;
  }
  .mh-site .mh-main .mh-process__timeline > .mh-process__step,
  .mh-site .mh-main .mh-process__timeline--curve > .mh-process__step:nth-of-type(n),
  .mh-site .mh-main .mh-process__timeline--flex > .mh-process__step:nth-of-type(n) {
    min-height:154px;
    padding:18px 17px 19px;
    border-radius:16px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step-label {
    margin-bottom:6px;
    font-size:10px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__number,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__number,
  .mh-site .mh-main .mh-process__timeline--flex .mh-process__number {
    width:52px;
    height:52px;
    min-width:52px;
    border-radius:15px;
    font-size:17px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step h3,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step h3 {
    font-size:16px;
  }
  .mh-site .mh-main .mh-process__timeline .mh-process__step p,
  .mh-site .mh-main .mh-process__timeline--curve .mh-process__step p {
    font-size:12.5px;
    line-height:1.55;
  }
  .mh-site .mh-main .mh-compact-nav.mh-process__mobile-nav {
    margin-top:12px;
    gap:8px;
  }
}