/* MT.Net.VN Public V33 — shared light-blue system for home and linked pages */
body.pro6-public-site{
  --public-bg:#f4f8fc;
  --public-panel:#ffffff;
  --public-soft:#eef7ff;
  --public-soft-2:#f8fbfe;
  --public-text:#24384b;
  --public-muted:#667b90;
  --public-line:#dce7f1;
  --public-blue:#4f8fdf;
  --public-blue-strong:#2f73c9;
  --public-shadow:0 10px 30px rgba(42,77,112,.07);
  --bg:var(--public-bg);
  --panel:var(--public-panel);
  --text:var(--public-text);
  --muted:var(--public-muted);
  --line:var(--public-line);
  --primary:var(--public-blue);
  --primary2:var(--public-blue-strong);
  --sidebar:#f9fcff;
  --sidebar2:#f3f8fd;
  background:
    radial-gradient(circle at 82% 2%,rgba(111,174,232,.12),transparent 30rem),
    linear-gradient(180deg,#f8fbfe 0,#f3f8fc 52rem,#f4f8fc 100%);
  color:var(--public-text);
  font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:14px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body.pro6-public-site .app-shell,
body.pro6-public-site .main{background:transparent}
body.pro6-public-site #sidebar{
  color:#52677c!important;
  background:linear-gradient(180deg,#fbfdff,#f3f8fd)!important;
  border-right:1px solid var(--public-line);
  box-shadow:8px 0 28px rgba(54,91,126,.035);
}
body.pro6-public-site .brand{height:76px;padding:16px 20px;border-bottom:1px solid var(--public-line)}
body.pro6-public-site .brand-mark,
body.pro6-public-site .top-brand-mark{
  color:#fff;
  background:linear-gradient(145deg,#68a7ed,var(--public-blue-strong));
  box-shadow:0 7px 18px rgba(79,143,223,.22);
}
body.pro6-public-site .brand strong{color:#203449;font-size:13px}
body.pro6-public-site .brand small{color:#71869a;font-size:10px}
body.pro6-public-site .sidebar-scroll{padding:13px 12px}
body.pro6-public-site .menu-label{color:#8da0b2;font-size:9px;padding:14px 11px 6px}
body.pro6-public-site .menu-item{
  min-height:39px;
  padding:9px 11px;
  color:#52677c;
  border:1px solid transparent;
  border-radius:9px;
  font-size:12px;
  font-weight:650;
}
body.pro6-public-site .menu-item>i:first-child{color:#7890a8}
body.pro6-public-site .menu-item:hover,
body.pro6-public-site .menu-item.active,
body.pro6-public-site .menu-toggle.open>.menu-item{
  color:var(--public-blue-strong);
  background:#eaf4ff;
  border-color:#d4e7f8;
}
body.pro6-public-site .submenu{padding-left:43px}
body.pro6-public-site .submenu a{padding:7px 0;color:#6b7f93;font-size:11px}
body.pro6-public-site .submenu a:hover{color:var(--public-blue-strong)}
body.pro6-public-site .sidebar-user{background:rgba(255,255,255,.64);border-top:1px solid var(--public-line)}
body.pro6-public-site .sidebar-user .avatar{color:var(--public-blue-strong);background:#eaf4ff}
body.pro6-public-site .sidebar-user strong{color:#26384a}
body.pro6-public-site .sidebar-user small,
body.pro6-public-site .sidebar-user>i{color:#7c90a3}

body.pro6-public-site .topbar{
  height:70px;
  padding:0 22px;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid var(--public-line);
  box-shadow:0 3px 15px rgba(42,77,112,.04);
  backdrop-filter:blur(16px);
}
body.pro6-public-site .top-menu{height:70px}
body.pro6-public-site .top-link{padding-inline:10px;color:#53687d;font-size:11px}
body.pro6-public-site .top-link:hover,
body.pro6-public-site .top-link.active,
body.pro6-public-site .top-dropdown.open>.top-link{color:var(--public-blue-strong)}
body.pro6-public-site .top-link:after{background:var(--public-blue)}
body.pro6-public-site .icon-btn,
body.pro6-public-site .apps-menu-btn,
body.pro6-public-site .login-btn,
body.pro6-public-site .cpanel-toggle{
  color:#5c7185;
  background:#fff;
  border-color:var(--public-line);
  box-shadow:none;
}
body.pro6-public-site .icon-btn:hover,
body.pro6-public-site .apps-menu-btn:hover{color:var(--public-blue-strong);background:var(--public-soft);border-color:#c9def2}
body.pro6-public-site .login-btn{color:var(--public-blue-strong);background:#eaf4ff}
body.pro6-public-site .top-dropdown-menu,
body.pro6-public-site .pro6-quick-panel,
body.pro6-public-site .notification-panel,
body.pro6-public-site .apps-menu{border-color:var(--public-line);box-shadow:0 18px 45px rgba(42,77,112,.14)}

body.pro6-public-site .pro6-unified-pagehead{
  background:linear-gradient(135deg,#f9fcff 0,#edf6ff 58%,#e7f2fc 100%);
  border-bottom:1px solid #d7e6f3;
}
body.pro6-public-site .pro6-pagehead-inner{padding-top:24px;padding-bottom:24px}
body.pro6-public-site .pro6-pagehead-kicker{color:#4c86bf;font-size:9px}
body.pro6-public-site .pro6-pagehead-copy h1{
  color:#263c51;
  font-size:clamp(24px,2.4vw,34px);
  line-height:1.2;
  letter-spacing:-.035em;
}
body.pro6-public-site .pro6-pagehead-description{color:var(--public-muted);font-size:13px}
body.pro6-public-site .pro6-breadcrumb a{color:#60778d}
body.pro6-public-site .pro6-breadcrumb a:hover{color:var(--public-blue-strong)}
body.pro6-public-site .pro6-pagehead-action{
  min-height:38px;
  color:#536b82;
  background:rgba(255,255,255,.82);
  border-color:#d5e4f0;
  border-radius:10px;
  font-size:11px;
}
body.pro6-public-site .pro6-pagehead-action.primary{color:#fff;background:var(--public-blue);border-color:var(--public-blue)}

body.pro6-public-site .pro6-legacy-content{padding:26px 5px 56px}
body.pro6-public-site #pro6-main-content{width:min(1420px,100%);margin:0 auto;color:var(--public-text)}
body.pro6-public-site .pro6-legacy-content :where(h1,h2,h3,h4,h5,h6){color:#263c51;font-family:inherit}
body.pro6-public-site .pro6-legacy-content h1{font-size:clamp(27px,3vw,38px);line-height:1.18;letter-spacing:-.04em}
body.pro6-public-site .pro6-legacy-content h2{font-size:clamp(21px,2.2vw,29px);line-height:1.25;letter-spacing:-.03em}
body.pro6-public-site .pro6-legacy-content h3{font-size:16px;line-height:1.42;letter-spacing:-.012em}
body.pro6-public-site .pro6-legacy-content h4{font-size:14px;line-height:1.45}
body.pro6-public-site .pro6-legacy-content :where(p,li,dd,td){color:#62778b;font-size:13px;line-height:1.7}
body.pro6-public-site .pro6-legacy-content a:not(.pro6-btn):not(.btn):not(.kt-btn){color:#397fc7;text-decoration-color:rgba(57,127,199,.28);text-underline-offset:3px}
body.pro6-public-site .pro6-legacy-content a:not(.pro6-btn):not(.btn):not(.kt-btn):hover{color:#235f9d;text-decoration-color:currentColor}
body.pro6-public-site .pro6-legacy-content img{border-radius:12px}

body.pro6-public-site .pro6-native-page{width:100%;margin:0 auto}
body.pro6-public-site .pro6-hero-panel{
  padding:28px 30px;
  color:var(--public-text);
  background:linear-gradient(135deg,#f9fcff,#eaf4ff);
  border:1px solid #d5e6f5;
  border-radius:18px;
  box-shadow:var(--public-shadow);
}
body.pro6-public-site .pro6-hero-panel h1{margin:6px 0;color:#263c51;font-size:clamp(25px,2.7vw,36px)}
body.pro6-public-site .pro6-hero-panel p{margin:0;color:#657b90;font-size:13px}
body.pro6-public-site .pro6-eyebrow{color:#4b86bf;font-size:9px;letter-spacing:.13em}
body.pro6-public-site .pro6-section-heading{margin-top:28px;margin-bottom:15px}
body.pro6-public-site .pro6-section-heading h2{margin:4px 0;color:#2b4054;font-size:23px}
body.pro6-public-site .pro6-section-heading p{margin:0;color:#708397;font-size:12px}

body.pro6-public-site .pro6-legacy-content :where(.card,.kt-card,.panel,.box,.widget,.pro6-card,.pro6-service-card,.pro6-news-card,.pro6-course-card,.pro6-product-card){
  background:var(--public-panel);
  border-color:var(--public-line);
  box-shadow:0 6px 22px rgba(42,77,112,.05);
}
body.pro6-public-site .pro6-legacy-content :where(.card,.kt-card,.panel,.box){border-radius:14px}
body.pro6-public-site .pro6-legacy-content :where(.card,.kt-card,.panel,.box,.pro6-service-card,.pro6-news-card,.pro6-course-card,.pro6-product-card){transition:border-color .18s,box-shadow .18s,transform .18s}
body.pro6-public-site .pro6-legacy-content :where(.card,.kt-card,.panel,.box,.pro6-service-card,.pro6-news-card,.pro6-course-card,.pro6-product-card):hover{border-color:#bed7ed;box-shadow:0 12px 30px rgba(49,94,136,.09)}

body.pro6-public-site .pro6-legacy-content :where(.pro6-btn,.btn,.kt-btn,button[type="submit"],input[type="submit"]){
  min-height:38px;
  border-radius:10px;
  font-family:inherit;
  font-size:12px;
  font-weight:700;
}
body.pro6-public-site .pro6-legacy-content :where(.pro6-btn.primary,.btn-primary,.kt-btn-primary,button[type="submit"],input[type="submit"]){
  color:#fff;
  background:var(--public-blue);
  border-color:var(--public-blue);
  box-shadow:0 7px 18px rgba(79,143,223,.18);
}
body.pro6-public-site .pro6-legacy-content :where(.pro6-btn.primary,.btn-primary,.kt-btn-primary,button[type="submit"],input[type="submit"]):hover{background:var(--public-blue-strong);border-color:var(--public-blue-strong)}
body.pro6-public-site .pro6-legacy-content :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  color:#334a60;
  background:#fff;
  border:1px solid #d7e4ef;
  border-radius:9px;
  font:500 13px/1.4 Inter,"Segoe UI",sans-serif;
  box-shadow:none;
}
body.pro6-public-site .pro6-legacy-content :where(input,select,textarea):focus{border-color:#8fbbe4;box-shadow:0 0 0 3px rgba(79,143,223,.12);outline:0}
body.pro6-public-site .pro6-legacy-content table{width:100%;background:#fff;border:1px solid var(--public-line);border-radius:12px;border-collapse:separate;border-spacing:0;overflow:hidden}
body.pro6-public-site .pro6-legacy-content th{padding:11px 13px;color:#526a80;background:#f3f8fd;border-color:var(--public-line);font-size:11px;font-weight:750}
body.pro6-public-site .pro6-legacy-content td{padding:11px 13px;border-color:#e4edf5}
body.pro6-public-site .pro6-legacy-content tr:hover td{background:#f9fcff}
body.pro6-public-site .pro6-legacy-content :where(.badge,.label,.chip,.pro6-chip){border-radius:999px;font-size:10px;font-weight:700}

body.pro6-public-search .pro6-legacy-content .layout-px-spacing{padding:0!important}
body.pro6-public-search .pro6-legacy-content .card-box{
  padding:20px;
  background:#fff;
  border:1px solid var(--public-line);
  border-radius:16px;
  box-shadow:var(--public-shadow);
}
body.pro6-public-search .pro6-legacy-content .filtered-list-search form>div{
  display:flex;
  align-items:center;
  gap:9px;
  width:100%;
}
body.pro6-public-search .pro6-legacy-content #input-search{min-width:240px;min-height:42px;padding:9px 12px}
body.pro6-public-search .pro6-legacy-content select{min-height:42px;padding:8px 34px 8px 11px}
body.pro6-public-search .pro6-legacy-content .contact-options{gap:6px}
body.pro6-public-search .pro6-legacy-content .contact-options>a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  color:#62798f;
  background:#f6faff;
  border:1px solid var(--public-line);
  border-radius:9px;
}
body.pro6-public-search .pro6-legacy-content .contact-options>a:hover,
body.pro6-public-search .pro6-legacy-content .contact-options>a.active-view{color:var(--public-blue-strong);background:#eaf4ff;border-color:#c9def2}

body.pro6-public-site .pro-footer,
body.pro6-public-site .footer{color:#64798e;background:rgba(255,255,255,.58);border-top-color:var(--public-line)}
body.pro6-public-site .pro-footer :where(h4,b){color:#31475b}
body.pro6-public-site .pro-footer a{color:#657b90;font-size:12px}
body.pro6-public-site .pro-footer a:hover{color:var(--public-blue-strong)}

@media(max-width:880px){
  body.pro6-public-site{font-size:13px}
  body.pro6-public-site #sidebar{box-shadow:16px 0 40px rgba(42,77,112,.16)}
  body.pro6-public-site .topbar{height:64px;padding:0 14px}
  body.pro6-public-site .pro6-legacy-content{padding:18px 5px 88px}
  body.pro6-public-site .pro6-pagehead-inner{padding-top:18px;padding-bottom:18px}
  body.pro6-public-site .pro6-hero-panel{padding:22px 20px;border-radius:15px}
}
@media(max-width:620px){
  body.pro6-public-site .pro6-pagehead-copy h1{font-size:24px}
  body.pro6-public-site .pro6-legacy-content h1{font-size:27px}
  body.pro6-public-site .pro6-legacy-content h2{font-size:21px}
  body.pro6-public-site .pro6-legacy-content :where(p,li,dd,td){font-size:12.5px}
  body.pro6-public-site .pro6-pagehead-actions{width:100%}
  body.pro6-public-site .pro6-pagehead-action{flex:1;justify-content:center}
  body.pro6-public-search .pro6-legacy-content .card-box{padding:14px}
  body.pro6-public-search .pro6-legacy-content .filtered-list-search form>div{align-items:stretch;flex-direction:column}
  body.pro6-public-search .pro6-legacy-content #input-search{width:100%;min-width:0}
}
