@font-face{
  font-family:"UTM ThuPhap Thien An";
  src:url("phong/utm-thuphap-thien-an-6f05cf3d.woff2") format("woff2"),
      url("phong/utm-thuphap-thien-an-6f05cf3d.ttf") format("truetype");
  font-display:swap;
}
:root{
  --rong:1140px; --bo:22px; --bo-nho:14px;
  --chu-thu-phap:"UTM ThuPhap Thien An","Noto Serif",Georgia,serif;
  --chu-tieu-de:"Noto Serif",Georgia,"Songti SC","SimSun",serif;
  --chu-than:"Be Vietnam Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{ box-sizing:border-box }
a,button{ -webkit-tap-highlight-color:transparent }
@media (pointer:fine){
  a:focus-visible,button:focus-visible{ outline:2px solid var(--son); outline-offset:2px }
}
[hidden]{ display:none !important }
html{ -webkit-text-size-adjust:100% }
body{
  margin:0; background:var(--nen); color:var(--muc);
  font-family:var(--chu-than); font-size:17px; line-height:1.65; overflow-x:hidden;
}
img{ max-width:100%; display:block }
a{ color:inherit; text-decoration:none }
h1,h2,h3{ margin:0; line-height:1.14; font-weight:600; font-family:var(--chu-tieu-de) }
h1{ font-size:clamp(46px,6.6vw,78px); letter-spacing:-1.2px }
h2{ font-size:clamp(34px,5vw,52px);   letter-spacing:-.5px }
h3{ font-size:21px; letter-spacing:-.2px }
p{ margin:0 0 16px }
.khung{ width:100%; max-width:var(--rong); margin:0 auto; padding:0 24px }
.khoi { padding:72px 0; position:relative }
.khoi-a{ background:linear-gradient(180deg,var(--nen),var(--nen2)) }
.khoi-b{ background:linear-gradient(180deg,var(--nen2),var(--nen)) }
.khoi-phang{ background:var(--nen) }
.dan { font-size:21px; color:var(--muc2); line-height:1.6 }
.phu { font-size:15.5px; color:var(--muc2); line-height:1.62 }
.nhan{ font-size:13px; text-transform:uppercase; letter-spacing:.14em;
       color:var(--kim2); font-weight:600 }
em,i{ font-style:italic }
.serif{ font-family:var(--chu-tieu-de) }
.mk{ display:inline-block; font-family:var(--chu-than); font-size:11px; font-weight:700;
     letter-spacing:.08em; text-transform:uppercase; color:var(--son);
     border:1px dashed var(--son); border-radius:4px; padding:1px 6px;
     margin:0 4px; vertical-align:middle; white-space:nowrap; line-height:1.6 }
.khung-trong{
  display:flex; align-items:center; justify-content:center; text-align:center;
  background:var(--nen2); border:1.5px dashed var(--kimnhat); border-radius:var(--bo);
  color:var(--muc2); padding:24px; min-height:200px }
.ten-muc{ text-align:center; max-width:680px; margin:0 auto 56px }
.ten-muc h2{ display:flex; align-items:center; justify-content:center; gap:24px }
@media (min-width:960px){ .ten-muc h2{ margin-left:-135px; margin-right:-135px } }
.ten-muc h2 b{ color:var(--son); font-weight:inherit }
.ten-muc .nhan{ display:block; margin-top:10px }
.ten-muc .dan{ margin-top:18px; font-size:18px }
.thu-an{
  writing-mode:vertical-rl; text-orientation:upright;
  font-family:var(--chu-tieu-de); font-size:20px; letter-spacing:.32em;
  color:var(--son); border:2px solid var(--son); border-radius:3px;
  padding:16px 9px; box-shadow:var(--bong-phang);
  transition:border-width .25s ease }
.thu-an-lon{ font-size:52px; letter-spacing:.28em; padding:26px 14px; border-width:3px }
.trien{ display:inline-block; width:34px; height:34px; border-radius:4px;
        background:var(--son); color:var(--nen); font-family:var(--chu-tieu-de);
        font-size:13px; line-height:1.05; letter-spacing:0;
        display:grid; place-content:center; padding:4px 0 }
.trien b{ display:block; font-weight:600 }
.trien-lon{ width:78px; height:78px; font-size:29px; border-radius:6px }
.nut{ display:inline-flex; align-items:center; gap:9px; border-radius:999px;
      padding:15px 30px; font-size:15.5px; font-weight:600; min-height:48px;
      font-family:var(--chu-than); cursor:pointer; border:1px solid transparent;
      transition:transform .25s ease, box-shadow .25s ease, background .25s ease }
.nut-chinh{ background:linear-gradient(135deg,var(--son),var(--son-dam));
            color:var(--nen); box-shadow:var(--bong-sm) }
.nut-chinh:hover{ transform:translateY(-2px); box-shadow:var(--bong-md) }
.nut-nhe{ background:transparent; color:var(--muc); border-color:var(--vien) }
.nut-nhe:hover{ border-color:var(--son); color:var(--son) }
.lien-ket{ color:var(--son); font-weight:600; font-size:15.5px;
           border-bottom:1px solid transparent; transition:border-color .25s ease }
.lien-ket:hover{ border-bottom-color:var(--son) }
.the{ background:var(--the); border:1px solid var(--vien-nhat); border-radius:var(--bo);
      box-shadow:var(--bong-sm); padding:30px;
      transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease }
.the:hover{ transform:translateY(-5px); box-shadow:var(--bong-md); border-color:var(--kimnhat) }
.luoi{ display:grid; gap:22px }
.ngoc{ width:56px; height:56px; border-radius:50%; flex:none;
  background:radial-gradient(circle at 30% 22%,
       var(--ngoc-sang) 0%, var(--kim-100) 42%, var(--kim-200) 100%);
  box-shadow:inset 0 2px 4px rgb(255 255 255 / .9),
             inset 0 -3px 7px rgb(var(--kim2-rgb) / .28),
             0 5px 14px rgb(var(--kim2-rgb) / .22);
  display:grid; place-content:center;
  font-family:var(--chu-tieu-de); font-size:20px; color:var(--kim2) }
.ngoc svg{ width:22px; height:22px; fill:var(--kim2) }
.ngoc svg[fill="none"]{ fill:none }
.dau{ position:sticky; top:0; z-index:60; background:rgb(255 255 255 / .92);
      backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
      border-bottom:1px solid var(--vien-nhat) }
.dau .khung{ display:flex; align-items:center; gap:26px; height:76px }
.hieu{ display:flex; align-items:center; gap:11px; margin-right:auto }
.trien-anh{ width:48px; height:48px; object-fit:contain; flex:none }
.chan-hieu{ display:flex; align-items:center; gap:14px; margin-bottom:14px }
.chan-tt{ list-style:none; margin:0; padding:0; display:grid; gap:9px }
.chan-tt li{ display:flex; align-items:flex-start; gap:11px }
.chan-tt svg{ width:16px; height:16px; flex:none; fill:var(--kim-300); margin-top:4px }
.chan-hieu img{ width:74px; height:74px; object-fit:contain; flex:none }
.chan-hieu .hieu-ten{ margin-bottom:0 }
.hieu-ten{ font-family:var(--chu-thu-phap); font-size:29px; font-weight:400; letter-spacing:0;
  white-space:nowrap }
@media (max-width:560px){
  .hieu-ten{ font-size:21px }
  .chan-hieu{ gap:11px }
  .chan-hieu img{ width:56px; height:56px } }
.muc-luc{ display:flex; gap:26px; align-items:center }
.muc-luc a{ font-size:15px; font-weight:500; color:var(--muc2); padding:6px 0;
            border-bottom:2px solid transparent; transition:color .2s, border-color .2s }
.muc-luc a:hover,.muc-luc a[aria-current=page]{ color:var(--son); border-bottom-color:var(--son) }
.dau .nut{ padding:0 22px; font-size:14.5px; min-height:46px }
.muc-con{ position:relative; display:flex; align-items:center }
.muc-con::before{ content:""; position:absolute; left:-14px; right:-14px;
  top:100%; height:30px }
.xo-con{ position:absolute; top:calc(100% + 22px); left:50%; transform:translateX(-50%);
  width:198px; height:0; opacity:0; overflow:hidden; box-sizing:border-box;
  transition:height .3s ease, opacity .3s ease;
  background:rgb(255 255 255 / .93); border-top:5px solid rgb(var(--son-rgb) / .06);
  border-radius:8px; box-shadow:0 2px 20px rgb(0 0 0 / .1) }
.muc-con:hover .xo-con,.muc-con:focus-within .xo-con{ opacity:1 }
.xo-con ul{ list-style:none; margin:0; padding:8px 0 12px }
.xo-con li{ position:relative; text-align:center;
  border-bottom:1px solid rgb(var(--muc-rgb) / .06) }
.xo-con li:last-child{ border-bottom:0 }
.xo-con li::after{ content:""; position:absolute; left:0; top:0; height:100%;
  width:0; background:var(--son); transition:width .3s ease }
.muc-luc .xo-con a{ position:relative; z-index:1; display:block; padding:0 15px;
  line-height:41px; font-size:15px; color:var(--muc); border-bottom:0 }
.xo-con li:hover::after{ width:100% }
.xo-con li:hover a{ color:var(--nen) }
.keo-hang{ display:flex; align-items:center }
.keo-hang > a{ flex:1 }
.keo-xo{ width:44px; height:44px; flex:none; border:0; background:none; cursor:pointer;
  display:grid; place-content:center; color:var(--muc2) }
.keo-xo svg{ width:20px; height:20px; fill:currentColor; transition:transform .25s ease }
.keo-xo[aria-expanded=true] svg{ transform:rotate(180deg) }
.keo-xo[aria-expanded=true]{ color:var(--son) }
.ngan-keo .keo-con[hidden]{ display:none }
.ngan-keo .keo-con{ display:grid; margin:2px 0 4px 6px; padding-left:14px;
  border-left:2px solid var(--kim-200) }
.ngan-keo .keo-con a{ font-size:14.5px; color:var(--muc2); padding:7px 0 }
.tim-dau{ display:flex; align-items:center }
.tim-nut{ width:40px; height:40px; border:0; background:none; cursor:pointer;
  display:grid; place-content:center; color:var(--muc2); border-radius:50%;
  transition:color .2s }
.tim-nut:hover{ color:var(--son) }
.tim-nut svg{ width:21px; height:21px; fill:none }
.tim-bang{ position:absolute; top:100%;
  right:max(24px, calc((100% - var(--rong))/2 + 24px));
  display:flex; align-items:center; gap:2px; overflow:hidden;
  background:var(--the); border:0 solid var(--vien-nhat);
  border-radius:0 0 16px 16px; box-shadow:var(--bong-lg);
  height:0; padding:0 8px 0 22px; pointer-events:none;
  transition:height .42s cubic-bezier(.37,0,.63,1), padding .42s cubic-bezier(.37,0,.63,1),
             border-width .42s cubic-bezier(.37,0,.63,1) }
.tim-dau.mo .tim-bang{ height:52px; padding:6px 8px 6px 22px;
  border-width:0 1px 1px 1px; pointer-events:auto }
.tim-bang input{ width:300px; border:0; outline:none; background:none;
  font:inherit; font-size:14.5px; color:var(--muc); min-height:40px }
.tim-bang input::placeholder{ color:var(--muc2); opacity:.7 }
.tim-di,.tim-dong{ width:40px; height:40px; border:0; background:none; cursor:pointer;
  display:grid; place-content:center; color:var(--muc2); border-radius:50%;
  font-size:24px; line-height:1; transition:color .2s }
.tim-di:hover,.tim-dong:hover{ color:var(--son) }
.tim-di svg{ width:19px; height:19px; fill:none }
.tim-keo-o{ position:relative; display:block; margin:0 0 6px }
.tim-keo-lup{ position:absolute; left:15px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; fill:none; color:var(--muc2); pointer-events:none }
.tim-keo{ width:100%; min-height:46px; padding:10px 16px 10px 44px; margin:0;
  font:inherit; font-size:15px; color:var(--muc); background:var(--nen2);
  border:1px solid var(--vien-nhat); border-radius:12px; outline:none }
.nut-ngan-keo{ display:none; width:44px; height:44px; border:1px solid var(--vien);
   border-radius:10px; background:transparent; place-content:center; cursor:pointer }
.nut-ngan-keo span{ display:block; width:19px; height:2px; background:var(--muc); margin:3px 0 }
.ngan-keo{ position:fixed; inset:0 0 0 auto; width:min(84vw,330px); z-index:70;
  transition:transform .42s cubic-bezier(.32,.72,.28,1) !important;
  background:var(--nen); border-left:1px solid var(--vien-nhat);
  box-shadow:var(--bong-lg); padding:26px 24px;
  transform:translateX(100%); transition:transform .32s ease; overflow-y:auto }
.ngan-keo[data-mo=co]{ transform:translateX(0) }
.ngan-keo a{ display:block; padding:14px 0; min-height:44px; font-size:17px;
             border-bottom:1px solid var(--vien-nhat) }
.man-che{ position:fixed; inset:0; z-index:65; background:rgb(var(--muc-rgb) / .38);
          opacity:0; pointer-events:none; transition:opacity .3s ease }
.man-che[data-mo=co]{ opacity:1; pointer-events:auto }
.dong-ngan-keo{ background:none; border:0; font-size:26px; color:var(--muc);
                cursor:pointer; min-height:44px; min-width:44px }
.tam-phu,.cham-bang,.nut-banner{ display:none }
.dau-trang{ position:relative; overflow:hidden;
  background:linear-gradient(180deg,var(--nen3),var(--nen2)) }
.dau-trang::before,.dau-trang::after{ content:""; position:absolute; pointer-events:none;
  border-radius:50%; filter:blur(90px); opacity:.55 }
.dau-trang::before{ width:1100px; height:540px; top:-320px; left:-180px;
  background:radial-gradient(circle,var(--kim-100),transparent 70%) }
.dau-trang::after{ width:820px; height:460px; top:-260px; right:-160px;
  background:radial-gradient(circle,var(--kim-200),transparent 72%) }
.dia-van{ position:absolute; left:calc((100% - min(var(--rong),100%))/2 + 24px); top:50%; transform:translateY(-50%);
  width:min(46vw,580px); height:auto; opacity:.62; mix-blend-mode:multiply;
  pointer-events:none;
  -webkit-mask:radial-gradient(circle at 50% 50%, #000 66%, transparent 74%);
  mask:radial-gradient(circle at 50% 50%, #000 66%, transparent 74%) }
.dau-trang .khung{ position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr; gap:66px; align-items:center;
  padding-top:97px; padding-bottom:97px }
.dau-trang-chu{ display:flex; gap:30px; align-items:flex-start }
.dau-trang h1{ font-size:clamp(52px,6.4vw,90px); letter-spacing:-.5px; white-space:nowrap }
.dinh-danh{ margin:18px 0 0; color:var(--son); font-weight:600; line-height:2;
  font-size:clamp(13px,1.1vw,15.5px); text-transform:uppercase; letter-spacing:.28em }
.dan-banner{ margin:24px 0 0; max-width:38ch; font-size:16.5px;
  line-height:1.8; color:var(--muc2) }
.may-cuoi{ margin-top:24px; margin-left:auto; display:block; opacity:.85; width:132px; height:auto }
.dau-trang-anh{ position:relative; border-radius:var(--bo); overflow:hidden;
  box-shadow:var(--bong-md); aspect-ratio:4/3 }
.dau-trang-anh img{ width:100%; height:100%; object-fit:cover }
.dau-trang-anh .trien-lon{ position:absolute; right:20px; bottom:20px; opacity:.85 }
.gioi-thieu{ display:grid; grid-template-columns:1fr 1fr auto; gap:50px; align-items:center }
.gioi-thieu .gioi-thieu-anh{ order:1 }
.gioi-thieu > div:not(.gioi-thieu-anh):not(.nhan-doc){ order:2 }
.gioi-thieu .nhan-doc{ order:3 }
.nhan-doc{ writing-mode:vertical-rl; text-orientation:upright;
  font-family:var(--chu-tieu-de); font-size:64px; font-weight:600;
  letter-spacing:.16em; color:var(--muc); opacity:.9; line-height:1 }
.nhan-an{ writing-mode:horizontal-tb; letter-spacing:0; opacity:1;
  display:flex; flex-direction:column; gap:12px }
.nhan-an b{ width:58px; height:58px; border-radius:50%; background:var(--son);
  color:var(--nen); font-weight:600; font-size:30px; line-height:1;
  display:grid; place-content:center; box-shadow:var(--bong-sm) }
.gioi-thieu-anh{ border-radius:var(--bo); overflow:hidden; box-shadow:var(--bong-md);
  aspect-ratio:4/3 }
.gioi-thieu-anh img{ width:100%; height:100%; object-fit:cover }
.dai{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;
      margin-bottom:56px }
.dai:last-of-type{ margin-bottom:0 }
.dai-nguoc .dai-anh{ order:2 }
.dai-anh{ border-radius:var(--bo); overflow:hidden; box-shadow:var(--bong-md);
          aspect-ratio:16/10 }
.dai-anh img{ width:100%; height:100%; object-fit:cover }
.gt-dai .dai-anh{ aspect-ratio:3/2 }
.gt-dai .dai{ align-items:start }
.gt-dai .y-su{ grid-template-columns:1fr auto }
.gt-dai .dai-nguoc .y-su{ grid-template-columns:auto 1fr }
@media (min-width:961px){
  .gioi-thieu{ align-items:start }
  .gioi-thieu .nhan-doc{ align-self:center }
  .gt-dai .y-su > div:not(.nhan-doc){ margin-top:4px }
  .gt-dai .y-su > .nhan-doc{ margin-top:11px }
  .gioi-thieu > div:not(.gioi-thieu-anh):not(.nhan-doc){ margin-top:4px }
  .gt-dai-54 .dai-anh{ aspect-ratio:5/4 }
  .khung.khong-gian{ align-items:start }
  .khung.khong-gian > div:not(.khong-gian-anh){ margin-top:4px }
}
.dai h3{ font-size:30px; margin:10px 0 16px }
.dv-luoi{ grid-template-columns:repeat(3,1fr) }
.luoi-doi{ grid-template-columns:repeat(2,1fr) }
.dv-chinh h3{ color:var(--son) }
.dv-the{ display:flex; flex-direction:column; gap:14px }
.dv-the.sach-gop{ display:none }
@media (max-width:960px){ .dv-the.sach-gop{ display:flex } .dv-the.sach-tach{ display:none } }
.dv-the h3{ font-size:19px; color:var(--kim2) }
.khong-gian{ display:grid; grid-template-columns:1.15fr 1fr; gap:50px; align-items:center }
.khong-gian-anh{ border-radius:var(--bo); overflow:hidden; box-shadow:var(--bong-md);
                 aspect-ratio:16/11 }
.khong-gian-anh img{ width:100%; height:100%; object-fit:cover }
.khung-doi{ display:grid; gap:22px }
.kg-boc{ display:none }
.khong-gian > div > p{ text-align:justify; text-justify:inter-word }
.y-su{ display:grid; grid-template-columns:auto 1fr; gap:50px; align-items:start }
.y-su-the{ display:grid; grid-template-columns:300px 1fr; gap:36px; padding:36px }
.anh-doi-ngu{ align-self:start }
.anh-doi-ngu img{ display:block; width:100%; height:auto }
.y-su-danh{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:11px }
.y-su-danh li{ padding-left:20px; position:relative; font-size:16px; color:var(--muc2) }
.y-su-danh li::before{ content:""; position:absolute; left:0; top:.62em;
  width:7px; height:7px; border-radius:50%; background:var(--son) }
.bv{ display:grid; grid-template-columns:1fr 1.25fr; gap:50px; align-items:stretch }
.bv-anh{ border-radius:var(--bo); overflow:hidden; box-shadow:var(--bong-md) }
.bv-anh img{ width:100%; height:100%; object-fit:cover }
.bv-phai{ display:flex; flex-direction:column; align-self:stretch;
  padding:11px 0 }
.bv-phai .lien-ket{ margin-top:auto; padding-top:18px; align-self:flex-start }
.bv-noi-bat{ display:grid; gap:18px; margin-bottom:22px }
.bv-the-anh{ display:none }
.bv-noi-bat article:nth-child(n+4){ display:none }
.bv-noi-bat article{ padding:22px 26px;
  position:relative }
.bv-noi-bat h3 a::after{ content:""; position:absolute; inset:0 }
.bv-noi-bat h3{ margin-bottom:9px }
.bv-noi-bat .phu{ display:-webkit-box; -webkit-box-orient:vertical;
  -webkit-line-clamp:3; overflow:hidden }
@media (min-width:561px){
  .bv-noi-bat h3{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
    overflow:hidden; min-height:2.28em }
  .bv-noi-bat .phu{ min-height:4.86em }
}
.bv-ngay{ font-size:13px; color:var(--muc2); letter-spacing:.04em }
.chuyen-trang{ display:flex; justify-content:center; align-items:center; gap:10px; margin-top:44px }
.trang-nut{ min-width:40px; height:40px; padding:0 9px; font:inherit; font-size:15px;
  color:var(--muc2); background:none; border:1px solid var(--kimnhat);
  border-radius:var(--bo-nho); cursor:pointer;
  transition:color .18s, border-color .18s }
.trang-nut:hover:not(:disabled):not(.trang-dang){ border-color:var(--kim2); color:var(--muc) }
.trang-dang{ border-color:var(--son); color:var(--son); font-weight:700 }
.trang-nut:disabled{ opacity:.35; cursor:default }
.trang-lung{ min-width:18px; text-align:center; align-self:center;
  color:var(--muc2); font-size:15px; opacity:.6 }
.chip-hang{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:22px }
.chip{ display:inline-flex; align-items:center; justify-content:center;
  min-width:122px;
  padding:0 20px; font-size:13.5px; font-weight:600; color:var(--kim2);
  min-height:40px; transition:color .2s;
  background:
    var(--o-trai) left center / auto 100% no-repeat,
    var(--o-phai) right center / auto 100% no-repeat,
    var(--o-giua) center / calc(100% - 24px) 100% no-repeat }
.chip:hover{ color:var(--son);
  background:
    var(--o-trai-son) left center / auto 100% no-repeat,
    var(--o-phai-son) right center / auto 100% no-repeat,
    var(--o-giua-son) center / calc(100% - 24px) 100% no-repeat }
.dai-tram{ position:relative; overflow:hidden; padding:110px 0 65px;
  background:linear-gradient(135deg,var(--tho),var(--tho2) 55%,var(--tho)) }
.dai-tram-anh{ position:absolute; inset:0; opacity:.3; object-fit:cover;
  width:100%; height:100%; filter:grayscale(.35) contrast(1.08) }
.dai-tram .khung{ position:relative; z-index:1; display:grid;
  grid-template-columns:1fr auto; gap:50px; align-items:center;
  min-height:320px }
.dai-tram-chu{ max-width:34ch }
.dai-tram .han{ font-family:var(--chu-tieu-de); font-size:clamp(27px,3.4vw,40px);
  line-height:1.36; color:var(--nen); letter-spacing:.02em; margin-bottom:20px }
.dai-tram .dich{ font-family:var(--chu-tieu-de); font-style:italic; font-size:18.5px;
  line-height:1.62; color:var(--kim-200); margin-bottom:22px }
.dai-tram .nhan{ color:var(--kim-300) }
.dai-tram-nhanvat{ margin:0; text-align:center; position:relative }
.dai-tram-nhanvat .nguyet{ position:absolute; left:62%; top:13%;
  transform:translate(-50%,-50%) rotate(-30deg); width:350px; height:350px;
  opacity:1; pointer-events:none }
.dai-tram-nhanvat img{ position:relative; margin-top:62px }
.dai-tram-nhanvat img{ height:330px; width:auto; display:block; margin:0 auto 14px;
  filter:drop-shadow(0 14px 30px rgb(0 0 0 / .35)) }
.dai-tram-nhanvat .nhan{ color:var(--kim-300); letter-spacing:.18em }
.lien-he{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start }
.lh-danh{ list-style:none; margin:0 0 26px; padding:0; display:grid; gap:20px }
.lh-danh li{ display:flex; gap:15px; align-items:center }
.lh-danh .nhan{ display:block; margin-bottom:3px }
.lh-danh b{ font-size:17.5px; font-weight:600; font-family:var(--chu-than) }
.lh-danh a:hover{ color:var(--son) }
.chan{ background:var(--tho); color:var(--kim-100); padding:66px 0 0 }
.chan a{ color:var(--kim-100) }
.chan a:hover{ color:var(--nen) }
.chan-luoi{ display:grid; grid-template-columns:1.5fr auto; gap:26px 50px;
  padding-bottom:44px; align-items:start }
.chan-luoi > div:first-child{ grid-row:1 / span 2 }
.chan-cs{ grid-column:2; grid-row:2 }
.chan-luoi > div:nth-child(n+2){ justify-self:end; text-align:right }
.mxh{ display:flex; gap:13px; justify-content:flex-end }
.mxh a{ width:42px; height:42px; border-radius:50%; display:grid; place-content:center;
  border:1px solid rgb(255 255 255 / .3); color:var(--kim-100);
  transition:border-color .25s, background .25s, transform .25s }
.mxh a svg{ width:20px; height:20px; fill:currentColor }
.mxh a[href]:hover{ background:var(--son); border-color:var(--son); transform:translateY(-2px) }
.chan-luoi > div:nth-child(n+2) h4{ text-align:left }
.chan .hieu-ten{ color:var(--nen); display:block }
.chan p,.chan li{ font-size:15px; line-height:1.75; opacity:.86 }
.chan h4{ margin:0 0 16px; font-size:13px; text-transform:uppercase;
  letter-spacing:.14em; color:var(--kim-300); font-weight:600; font-family:var(--chu-than) }
.chan ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px }
.chan-cs a{ font-size:15px; line-height:1.75;
  color:var(--kim-100); text-decoration:none }
.chan-cs li{ transition:opacity .2s }
@media (hover:hover){ .chan-cs li:hover{ opacity:1 } }
.chan-cs li:active{ opacity:1 }
.chan-luoi > div.chan-cs{ justify-self:stretch; text-align:left }
.chan-cs h4{ margin-bottom:10.88px }
@media (min-width:961px){
  .chan-luoi{ row-gap:19px }
  .chan .chan-tt{ gap:12.75px }
}
.chan-cuoi{ background:var(--son); color:rgb(255 255 255 / .78); padding:15px 0;
  font-size:13.5px; line-height:1.65; text-align:center }
.hero-nho{ padding:74px 0 60px;
  background:linear-gradient(180deg,var(--nen3),var(--nen2)) }
.hero-nho h1{ font-size:clamp(38px,5.2vw,60px); margin-bottom:16px }
.hero-nho .dan{ max-width:56ch }
.trich-kep{ position:relative; background:var(--the); padding:38px 42px;
  border-radius:var(--bo-nho);
  box-shadow:inset 0 0 0 1px var(--kimnhat),
             inset 0 0 0 5px var(--the),
             inset 0 0 0 6px var(--kimnhat) }
.trich-kep .han{ font-family:var(--chu-tieu-de); font-size:19px; letter-spacing:.1em;
  line-height:1.62; margin-bottom:12px }
.trich-kep .dich{ font-family:var(--chu-tieu-de); font-style:italic; color:var(--son);
  font-size:17px; line-height:1.6; margin-bottom:12px }
.bai-luoi{ grid-template-columns:repeat(3,1fr) }
.bai-the{ padding:0; overflow:hidden; display:flex; flex-direction:column }
.bai-the{ position:relative }
.bai-the h3 a::after{ content:""; position:absolute; inset:0 }
.bai-the-anh{ aspect-ratio:16/10; background:var(--nen2);
  min-height:0; overflow:hidden }
.bai-the-anh img{ display:block; width:100%; height:100%; object-fit:cover }
.bai-the-chu{ padding:26px 26px 30px; display:flex; flex-direction:column; gap:10px; flex:1 }
.bai-the h3{ font-size:20px; line-height:1.14;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
  overflow:hidden; min-height:3.42em }
.bai-the .phu{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4;
  overflow:hidden; min-height:6.48em }
.the-cho{ min-height:290px; display:grid; place-content:center; text-align:center;
  background:var(--nen2); border:1.5px dashed var(--kimnhat); border-radius:var(--bo) }
.vong-hang{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:34px 24px }
.vong-o{ width:228px; text-align:center }
.vong-khung{ position:relative; width:190px; height:190px; margin:0 auto 20px }
.vong-khung svg{ position:absolute; inset:0; width:100%; height:100%;
  color:var(--muc-am); z-index:2 }
.vong-khung .anh{ position:absolute; inset:15%; border-radius:50%; overflow:hidden;
  box-shadow:inset 0 0 22px rgb(var(--muc-rgb) / .18) }
.vong-khung .anh img{ width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.8,.2,1) }
.vong-o:hover .anh img{ transform:scale(1.07) }
.vong-o h3{ font-size:19px; color:var(--kim2); margin:0 0 9px; letter-spacing:.02em }
.vong-o p{ font-size:15px; line-height:1.75; color:var(--muc2); margin:0 }
.vong-o p b{ color:var(--muc) }
@media (max-width:660px){
  .vong-hang{ display:grid; grid-template-columns:1fr 1fr;
    grid-auto-rows:1fr; gap:28px 14px }
  .vong-o{ width:auto }
  .vong-khung{ width:140px; height:140px; margin-bottom:16px }
  .vong-o h3{ font-size:17px }
}
.benh-luoi{ grid-template-columns:repeat(3,1fr) }
.benh-o{ border:1px solid var(--vien-nhat); border-radius:var(--bo);
  box-shadow:var(--bong-sm);
  padding:26px 24px; display:flex; flex-direction:column; gap:14px;
  align-items:flex-start; background:var(--the) }
.benh-ten{ display:inline-flex; align-items:center; justify-content:center;
  min-width:122px; min-height:40px; padding:0 20px;
  font-size:14.5px; font-weight:600; color:var(--kim2); font-family:var(--chu-tieu-de);
  background:
    var(--o-trai) left center / auto 100% no-repeat,
    var(--o-phai) right center / auto 100% no-repeat,
    var(--o-giua) center / calc(100% - 24px) 100% no-repeat }
.benh-o .phu{ margin:0; line-height:1.85 }
@media (max-width:960px){ .benh-luoi{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){
  .benh-luoi{ grid-template-columns:repeat(2,1fr); gap:12px }
  .benh-o{ padding:18px 13px; gap:10px; align-items:center; text-align:center;
    border:1px solid var(--vien-nhat); border-radius:var(--bo);
    box-shadow:var(--bong-sm) }
  .benh-ten{ display:flex; width:100%; min-width:0; min-height:0; height:48px; padding:0 10px;
    font-size:12px; line-height:1.3; text-align:center;
    background:
      var(--o-trai) left center / auto 100% no-repeat,
      var(--o-phai) right center / auto 100% no-repeat,
      var(--o-giua) center / calc(100% - 32px) 100% no-repeat }
  .benh-o .phu{ font-size:13px; line-height:1.55 }
  .moc .benh-ten{ display:inline-flex; width:auto; padding:0 22px;
    font-size:13.5px }
}
.goc{ position:relative }
.goc::before,.goc::after{
  content:""; position:absolute; width:72px; height:72px; pointer-events:none;
  background:var(--goc-hoa) no-repeat center/contain }
.goc::before{ top:-24px; left:-24px }
.goc::after { bottom:-24px; right:-24px; transform:scale(-1,-1) }
.goc{ margin:11px; border-radius:6px; box-shadow:none; overflow:visible }
.goc img{ border-radius:6px }
.dan-do{ display:grid; grid-template-columns:1fr 1.57fr; gap:56px; align-items:center }
.dan-do-anh img{ display:block; width:100%; height:auto }
.moc-hang{ position:relative; display:grid; gap:18px; padding-left:34px }
.moc-hang::before{ content:""; position:absolute; left:5px; top:14px; bottom:14px;
  width:0; border-left:1px solid var(--kimnhat) }
.moc{ position:relative }
.moc::before{ content:""; position:absolute; left:-33px; top:12px;
  width:11px; height:11px; border-radius:50%; background:var(--kim2);
  box-shadow:0 0 0 3px var(--nen) }
.moc .benh-ten{ margin-bottom:7px }
.moc .phu{ margin:0; line-height:1.62 }
@media (max-width:960px){ .dan-do{ grid-template-columns:1fr; gap:36px } }
@media (max-width:760px){
  .dan-do{ display:block }
  .dan-do .dan-do-anh{ display:none }
  .moc-hang{ padding-left:40px; gap:26px; counter-reset:moc }
  .moc-hang::before{ content:none }
  .moc::after{ content:""; position:absolute;
    left:calc(14px - 40px - .5px);
    top:39px;
    width:0; border-left:1px solid var(--kimnhat) }
  .moc:not(:last-child)::after{ bottom:-37px }
  .moc:last-child::after{ bottom:14px }
  .moc::before{
    counter-increment:moc; content:counter(moc);
    left:-40px; top:11px; width:28px; height:28px;
    border-radius:0; box-shadow:none; background:none;
    background-image:var(--vong-so); background-size:100% 100%;
    background-repeat:no-repeat;
    color:var(--kim2); font-family:var(--chu-tieu-de); font-weight:600;
    font-size:11.8px; line-height:26.4px; text-align:center }
  .moc .phu{ text-align:justify; text-justify:inter-word }
}
.dai p{ text-align:justify; text-justify:inter-word }
.gioi-thieu p,
.gt-xam-luoi p{ text-align:justify; text-justify:inter-word }
.y-su-the p.phu,
.y-su-danh li{ text-align:justify; text-justify:inter-word }
@media (max-width:760px){
  .dan{ text-align:justify; text-justify:inter-word }
  .ten-muc .dan{ text-align:center }
}
.dai-anh.tranh-tha{ aspect-ratio:auto; border-radius:0; box-shadow:none;
  overflow:visible; background:none }
.tranh-tha img{ width:100%; height:auto; display:block;
  -webkit-mask:linear-gradient(90deg,#0000,#000 13%,#000 87%,#0000),
               linear-gradient(180deg,#0000,#000 13%,#000 87%,#0000);
  -webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,#0000,#000 13%,#000 87%,#0000),
       linear-gradient(180deg,#0000,#000 13%,#000 87%,#0000);
  mask-composite:intersect }
.gt-anh-luoi{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px }
.gt-anh-o{ margin:0; background:var(--the); border:1px solid var(--vien-nhat);
  border-radius:var(--bo-nho); padding:10px 10px 9px; box-shadow:var(--bong-sm);
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease }
.gt-anh-o:hover{ transform:translateY(-4px); box-shadow:var(--bong-md);
  border-color:var(--kimnhat) }
.gt-anh-o img{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; display:block;
  border-radius:calc(var(--bo-nho) - 6px) }
.gt-anh-o figcaption{ text-align:center; font-size:13.5px; margin-top:9px }
@media (max-width:960px){ .gt-anh-luoi{ grid-template-columns:repeat(2,1fr) } }
.gt-xam-luoi{ display:grid; grid-template-columns:1fr 1.1fr; gap:56px; align-items:center }
.gt-xam .tranh-tha img{ mix-blend-mode:multiply }
@media (max-width:960px){ .gt-xam-luoi{ grid-template-columns:1fr; gap:32px } }
@media (max-width:760px){
  .gt-xam .tranh-tha,
  .gt-xam .ten-muc{ display:none }
  .gt-dai .y-su .nhan-an{ display:none }
}
.gt-nui .cot-ngang .gt-cot-chu h3{ min-height:0 }
.han-chu{ font-family:"Songti SC","STSong","Noto Serif SC","SimSun",serif }
.gt-cot-phien{ margin:9px 0 10px; font-family:var(--chu-tieu-de); font-style:italic;
  font-size:13.5px; line-height:1.5; color:var(--muc2) }
.gt-son .gt-cot-phien{ color:rgb(255 255 255 / .82) }
@media (max-width:560px){ .gt-cot-phien{ font-size:12.5px } }
.gt-tc-han{ margin:0 0 2px; letter-spacing:.1em; line-height:1.65; color:var(--muc) }
.gt-tc-phien{ margin:0 0 16px; font-family:var(--chu-tieu-de); font-style:italic;
  line-height:1.65; color:var(--muc2) }
.gt-tc-giai{ margin:0 }
.gt-nui{ position:relative; overflow-x:clip }
.gt-nui .gt-cot{ position:relative }
.gt-nui .gt-cot::before{ content:""; position:absolute; left:50%; bottom:100%;
  transform:translateX(-50%); width:100vw; height:300px;
  background:url("../img/demo/nui-non-thuy-mac.webp") center bottom/100% 100% no-repeat;
  opacity:.75; pointer-events:none }
.gt-cot{ display:grid; grid-template-columns:repeat(5,1fr); gap:4px }
.gt-cot-the{ --khoet:16px;
  --vien-the:var(--vien-nhat); --nen-the:var(--the);
  position:relative; background:var(--vien-the); padding:30px 17px 28px;
  filter:drop-shadow(0 2px 9px rgb(var(--muc-rgb) / .09));
  display:flex; flex-direction:column; justify-content:flex-start;
  transition:transform .3s ease, filter .3s ease, background-color .3s ease }
.gt-cot-the, .gt-cot-the::before{
  -webkit-mask:
    radial-gradient(circle var(--khoet) at 0 0,       #0000 98%, #000 100%) top left,
    radial-gradient(circle var(--khoet) at 100% 0,    #0000 98%, #000 100%) top right,
    radial-gradient(circle var(--khoet) at 0 100%,    #0000 98%, #000 100%) bottom left,
    radial-gradient(circle var(--khoet) at 100% 100%, #0000 98%, #000 100%) bottom right;
  -webkit-mask-size:51% 51%; -webkit-mask-repeat:no-repeat;
  mask:
    radial-gradient(circle var(--khoet) at 0 0,       #0000 98%, #000 100%) top left,
    radial-gradient(circle var(--khoet) at 100% 0,    #0000 98%, #000 100%) top right,
    radial-gradient(circle var(--khoet) at 0 100%,    #0000 98%, #000 100%) bottom left,
    radial-gradient(circle var(--khoet) at 100% 100%, #0000 98%, #000 100%) bottom right;
  mask-size:51% 51%; mask-repeat:no-repeat }
.gt-cot-the::before{ content:""; position:absolute; inset:1.3px; z-index:-1;
  background:var(--nen-the) }
.gt-cot-the:hover{ transform:translateY(-5px); --vien-the:var(--kimnhat);
  filter:drop-shadow(0 12px 26px rgb(var(--muc-rgb) / .16)) }
.gt-cot-anh{ width:98px; height:98px; border-radius:50%; margin:0 auto 22px;
  overflow:hidden;
  box-shadow:0 0 0 1px var(--kim-300), 0 0 0 5px var(--nen-the), 0 0 0 6px var(--kim-200) }
.gt-cot-anh img{ width:100%; height:100%; object-fit:cover; display:block }
.gt-cot-chu{ display:flex; flex-direction:row-reverse; gap:14px;
  flex:1; justify-content:center; align-items:center }
.gt-cot-chu h3{ writing-mode:vertical-rl; text-orientation:mixed; flex:none;
  margin:0; font-size:19px; letter-spacing:.04em; line-height:1 }
.gt-cot-chu .phu{ margin:0; font-size:14.5px; line-height:1.6 }
.cot-ngang .gt-cot-chu{ flex-direction:column; gap:0; align-items:center;
  justify-content:flex-start; text-align:center }
.cot-ngang .gt-cot-chu h3{ writing-mode:horizontal-tb; text-orientation:initial;
  font-size:19.5px; line-height:1.3; margin-bottom:11px; letter-spacing:.01em;
  min-height:2.6em }
.gt-cho-tranh{ display:grid; place-content:center; background:var(--nen2);
  text-align:center; font-size:12px; font-weight:600; line-height:1.5;
  color:var(--muc2); font-family:var(--chu-than) }
.gt-son .gt-cho-tranh{ background:rgb(255 255 255 / .16); color:rgb(255 255 255 / .75) }
.gt-son{ --vien-the:var(--son-dam); --nen-the:var(--son-dam) }
.gt-son:hover{ --vien-the:var(--son-dam) }
.gt-son .gt-cot-anh{ box-shadow:0 0 0 1px rgb(255 255 255 / .45),
  0 0 0 5px var(--son-dam), 0 0 0 6px rgb(255 255 255 / .3) }
.gt-son h3{ color:var(--nen) }
.gt-son .mk{ color:var(--nen); border-color:rgb(255 255 255 / .55) }
.gt-son .phu{ color:rgb(255 255 255 / .82) }
@media (max-width:1080px){ .gt-cot{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:860px){
  .gt-cot{ grid-template-columns:1fr; gap:18px }
  .gt-cot-the{ padding:28px 24px }
  .gt-cot-anh{ margin-bottom:20px }
  .gt-cot-chu h3{ writing-mode:horizontal-tb; text-orientation:initial;
    margin-bottom:10px }
  .gt-cot-chu{ flex-direction:column; align-items:center; text-align:center; gap:0 }
  .gt-cot-chu .phu{ max-width:none }
}
.dai-tranh-trich{ position:relative; width:100%; max-width:100%;
  aspect-ratio:2560/850; min-height:320px; display:grid; align-items:center }
@media (max-width:700px){
  .dai-tranh-trich{ aspect-ratio:auto; min-height:300px } }
.dai-tranh-trich::before{ content:""; position:absolute; inset:0;
  background:url("../img/demo/thuyen-thuy-mac.webp") center/cover no-repeat;
  -webkit-mask:linear-gradient(180deg,#0000 0,#000 30%);
  mask:linear-gradient(180deg,#0000 0,#000 30%) }
.dai-tranh-trich::after{ content:""; position:absolute;
  left:66.5%; top:8.5%; width:4.6%; min-width:44px; aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:url("../img/demo/mat-troi.webp") center/contain no-repeat;
  pointer-events:none }
.dai-tranh-trich .khung{ position:relative; z-index:1; min-width:0 }
.ht-tranh-nen{ background:var(--nen2) }
.ht-truyen .dai-anh{ aspect-ratio:4/5 }
.ht-truyen{ grid-template-columns:1fr 1.1fr }
.tranh-gt{ background:var(--nen2); padding-bottom:194px }
.tranh-gt::before{ background-image:url("../img/demo/chan-trang-thuy-mac.webp") }
.tranh-gt::after{ content:none }
.khep-cum{ display:flex; align-items:center; justify-content:center; gap:36px }
.lac-khoan{ width:176px; aspect-ratio:1; flex:none;
  background:url("../img/demo/dau-cham-muc.webp") center/contain no-repeat;
  display:grid; place-content:center; text-align:center; padding-bottom:20px;
  font-family:var(--chu-tieu-de); font-size:30px; font-weight:600; line-height:1.3;
  color:var(--kim-100); letter-spacing:.03em }
.khep-cum .loi-de{ text-align:left; transform:translateY(-9px) }
@media (max-width:700px){
  .dai-tranh-trich{ --tranh:calc(100vw * 850 / 2560) }
  .dai-tranh-trich::before{ inset:auto 0 0 0; height:var(--tranh);
    background-size:100% auto; background-position:bottom center }
  .dai-tranh-trich::after{ top:calc(100% - var(--tranh) * .911);
    min-width:0 }
  .tranh-gt{ --cham:clamp(76px,19vw,130px);
    min-height:calc(var(--tranh) + var(--cham) + 8px);
    padding-bottom:calc(var(--tranh) - 56px) }
  .khep-cum{ gap:4px }
  .lac-khoan{ width:var(--cham); font-size:calc(var(--cham) * .17);
    padding-bottom:calc(var(--cham) * .114) }
  .dai-tranh-trich .khep-cum .loi-de{ white-space:nowrap;
    letter-spacing:0; line-height:1.9; transform:translateY(-5px);
    font-size:min(24px, calc((100vw - 52px - var(--cham)) / 17.4)) }
  .dai-tranh-trich:not(.tranh-gt){ min-height:0;
    padding-top:6px; padding-bottom:calc(var(--tranh) + 8px) }
  .dai-tranh-trich:not(.tranh-gt) .loi-de{ white-space:nowrap;
    letter-spacing:0; line-height:1.65;
    font-size:min(24px, calc((100vw - 48px) / 20.7)) } }
.dai-tranh-trich .loi-de{ margin:0; text-align:center;
  font-family:var(--chu-tieu-de); font-size:clamp(19px,2.1vw,29px);
  letter-spacing:.06em; line-height:1.75; color:var(--muc); opacity:.78 }
.tim-bai{ max-width:520px; margin:0 auto 30px }
.tim-bai input{ width:100%; min-height:52px; padding:12px 24px; font:inherit;
  color:var(--muc); background:var(--the); border:1px solid var(--vien);
  border-radius:999px; box-shadow:var(--bong-sm); outline:none;
  transition:border-color .2s, box-shadow .2s }
.tim-bai input:focus{ border-color:var(--kim2); box-shadow:var(--bong-md) }
.tim-bai input::placeholder{ color:var(--muc2); opacity:.75 }
.loc-muc{ justify-content:center; margin-bottom:44px }
.loc-muc .chip{ border:0; cursor:pointer; font:inherit; font-size:13.5px; font-weight:600;
  background:none; color:var(--muc2) }
.loc-muc .chip:hover{ color:var(--son); background:none }
.loc-muc .chip-dang,
.loc-muc .chip-dang:hover{ color:var(--the);
  padding-bottom:4px;
  background:var(--muc);
  -webkit-mask:url("../img/demo/vet-but.webp") center / 100% 100% no-repeat;
  mask:url("../img/demo/vet-but.webp") center / 100% 100% no-repeat }
@media (max-width:760px){
  .gt-cot{ display:flex; gap:10px; overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:6px 24px 12px; margin:0 -24px }
  .gt-cot::-webkit-scrollbar{ display:none }
  .gt-cot-the{ flex:0 0 45%; scroll-snap-align:center; padding:24px 12px;
    min-height:300px; justify-content:center }
  .gt-cot-anh{ width:74px; height:74px; margin-bottom:14px }
  .gt-cot-the .gt-cot-chu h3{ font-size:17px }
  .gt-cot-chu .phu{ font-size:13.5px; line-height:1.6 }
  .gt-nui .gt-cot::before{ display:none }
  .gt-nui .ten-muc{ position:relative; margin-bottom:110px }
  .gt-nui .ten-muc::after{ content:""; position:absolute; left:50%; top:100%;
    transform:translateX(-50%); width:100vw; height:110px;
    background:url("../img/demo/nui-non-thuy-mac.webp") center bottom/100% 100% no-repeat;
    opacity:.75; pointer-events:none }
}
.thanh-day{ display:none }
@media (max-width:760px){
  nav.noi-nhanh{ display:none }
  .dau a.nut-chinh{ display:none }
  .thanh-day{ position:fixed; left:0; right:0; bottom:0; z-index:60;
    display:flex; background:#ffffff;
    border-top:1px solid var(--vien-nhat);
    padding-bottom:env(safe-area-inset-bottom) }
  body::after{ content:""; position:fixed; left:0; right:0; bottom:-80px;
    height:80px; background:#ffffff; z-index:59; pointer-events:none }
  .thanh-day a{ flex:1; display:flex; flex-direction:column; align-items:center;
    gap:2px; padding:8px 0 6px; font-size:11px; font-weight:600;
    color:var(--muc2); letter-spacing:.02em }
  .thanh-day .td-ico{ height:22px; display:grid; place-content:center }
  .thanh-day svg{ width:21px; height:21px; fill:currentColor }
  .thanh-day .td-chinh{ color:var(--son) }
  body{ padding-bottom:calc(53px + env(safe-area-inset-bottom)) }
}
.js-hien .hien{ opacity:0; transform:translateY(60px); transition:opacity .7s ease, transform .7s ease }
.hien[data-hien=roi]{ opacity:1; transform:none }
@media (max-width:960px){
  .khoi{ padding:62px 0 }
  .dau-trang .khung,.gioi-thieu,.dai,.dv-lon,.khong-gian,.y-su,.bv,.lien-he,.chan-luoi,
  .dai-tram .khung{ grid-template-columns:1fr; gap:36px }
  .dai-nguoc .dai-anh{ order:0 }
  .gioi-thieu{ gap:26px }
  .nhan-doc{ writing-mode:horizontal-tb; font-size:40px; letter-spacing:.1em }
  .chan-luoi > div:nth-child(n+2){ justify-self:start; text-align:left }
  .chan-luoi > div:nth-child(n+2) h4{ text-align:left }
  .chan-luoi{ grid-template-columns:1fr 1fr; gap:30px 20px }
  .chan-luoi > div:first-child{ grid-column:1 / -1; grid-row:auto }
  .chan-cs{ grid-column:1 }
  .chan-luoi > div.chan-cs{ justify-self:start; width:max-content; max-width:100%;
    text-align:left }
  .chan-luoi > div:nth-child(2){ grid-column:2; grid-row:2; justify-self:end;
    width:max-content; max-width:100% }
  .chan-cs h4{ text-align:left }
  .chan-cs a{ white-space:nowrap }
}
@media (max-width:350px){
  .chan-luoi{ grid-template-columns:1fr }
  .chan-luoi > div{ grid-column:auto }
  .chan-cs{ justify-self:start !important; width:auto }
  .chan-luoi > div:nth-child(2){ grid-column:auto; grid-row:auto;
    justify-self:start; width:auto }
}
@media (max-width:960px){
  .mxh{ justify-content:flex-start }
  .gioi-thieu .gioi-thieu-anh{ grid-area:1/1 }
  .y-su:has(.y-su-the) .y-su-the{ grid-area:1/1 }
  .gioi-thieu .nhan-an,.y-su:has(.y-su-the) .nhan-an{ grid-area:1/1; z-index:2;
    justify-self:end; align-self:start; gap:8px }
  .gioi-thieu .nhan-an b,.y-su:has(.y-su-the) .nhan-an b{
    width:44px; height:44px; font-size:23px;
    box-shadow:0 4px 14px rgb(var(--muc-rgb)/.35) }
  .gioi-thieu .nhan-an{ margin:25px }
  .y-su:has(.y-su-the) .nhan-an{ margin:41px }
  .y-su:has(.y-su-the) .nhan-an{ display:none }
  .gt-dai .dai{ position:relative }
  .gt-dai .y-su .nhan-an{ position:absolute; top:25px; right:25px; z-index:2;
    gap:8px }
  .gt-dai .dai-nguoc .y-su .nhan-an{ left:25px; right:auto }
  .gt-dai .y-su .nhan-an b{ width:44px; height:44px; font-size:23px;
    box-shadow:0 4px 14px rgb(var(--muc-rgb)/.35) }
  .y-su-the{ grid-template-columns:1fr }
  .dv-luoi,.bai-luoi{ grid-template-columns:repeat(2,1fr) }
  .dai-tram-nhanvat{ display:none }
  .bv-anh{ aspect-ratio:16/9 }
}
@media (max-width:760px){
  .muc-luc,.tim-dau{ display:none }
  .nut-ngan-keo{ display:grid; width:30px; height:30px; border:0;
    border-radius:0; background:none; position:relative }
  .nut-ngan-keo::after{ content:""; position:absolute; left:50%; top:50%;
    width:44px; height:44px; transform:translate(-50%,-50%) }
  .nut-ngan-keo span{ width:19px; height:1.5px; margin:3.25px 0;
    background:var(--muc);
    transition:transform .32s cubic-bezier(.4,0,.2,1),
    opacity .18s ease }
  .nut-ngan-keo[aria-expanded=true] span:nth-child(1){ transform:translateY(8px) rotate(45deg) }
  .nut-ngan-keo[aria-expanded=true] span:nth-child(2){ opacity:0 }
  .nut-ngan-keo[aria-expanded=true] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg) }
  :root{ --cao-dau:50px }
  .dau .khung{ height:var(--cao-dau); gap:12px }
  .dau .trien-anh{ width:35px; height:35px }
  .dau{ position:fixed; left:0; right:0; top:0;
    background:#ffffff; backdrop-filter:none; -webkit-backdrop-filter:none }
  body{ padding-top:calc(var(--cao-dau) + 1px) }
  .dai-tranh-trich::before{ background-image:url("../img/demo/thuyen-thuy-mac-1200.webp") }
  .tranh-gt::before{ background-image:url("../img/demo/chan-trang-thuy-mac-1200.webp") }
  .gt-nui .ten-muc::after{ background-image:url("../img/demo/nui-non-thuy-mac-1200.webp") }
  .man-che{ display:none }
  .ngan-keo{ inset:auto; top:var(--cao-dau); left:0; right:0; bottom:auto;
    width:auto; max-width:none; padding:0; overflow:hidden;
    height:0; transform:none; opacity:1;
    transition:height .5s ease-in-out !important;
    background:var(--nen3);
    background-image:linear-gradient(rgb(255 255 255 / .88),rgb(255 255 255 / .88)),
                     url("../img/demo/dia-hoa-van.webp");
    background-repeat:no-repeat; background-position:center, right -80px bottom 12%;
    background-size:cover, 62% auto; background-blend-mode:normal, luminosity }
  .ngan-keo[data-mo=co]{ height:calc(100dvh - var(--cao-dau)); overflow-y:auto }
  .ngan-keo > *{ transform:translateX(-100px); opacity:0;
    transition:transform .5s ease, opacity .5s ease }
  .ngan-keo[data-mo=co] > *{ transform:none; opacity:1; transition-delay:.25s }
  .ngan-keo[data-mo=co] > *:nth-child(2){ transition-delay:.30s }
  .ngan-keo[data-mo=co] > *:nth-child(3){ transition-delay:.35s }
  .ngan-keo[data-mo=co] > *:nth-child(4){ transition-delay:.40s }
  .ngan-keo[data-mo=co] > *:nth-child(5){ transition-delay:.45s }
  .ngan-keo[data-mo=co] > *:nth-child(6){ transition-delay:.50s }
  .ngan-keo[data-mo=co] > *:nth-child(7){ transition-delay:.55s }
  .ngan-keo[data-mo=co] > *:nth-child(8){ transition-delay:.60s }
  .ngan-keo[data-mo=co] > *:nth-child(9){ transition-delay:.65s }
  .ngan-keo[data-mo=co] > *:nth-child(10){ transition-delay:.70s }
  .ngan-keo > div:first-child{ display:none !important }
  .ngan-keo .tim-keo-o{ margin:14px 24px 6px }
  .ngan-keo .tim-keo{ margin:0; width:100% }
  .ngan-keo a{ padding:0 24px; min-height:46px; font-size:16px;
    border-bottom:1px solid var(--vien-nhat); display:flex; align-items:center }
  .ngan-keo .keo-hang{ border-bottom:1px solid var(--vien-nhat) }
  .ngan-keo .keo-hang > a{ border-bottom:0 }
  .ngan-keo .keo-xo{ margin-right:14px }
  .ngan-keo .keo-con{ margin:0; padding:0; border:0; background:rgb(255 255 255 / .55) }
  .ngan-keo .keo-con a{ padding-left:44px; font-size:14.5px; min-height:42px }
  .sat-nut{ margin-bottom:0 }
  .sat-nut p:last-child{ margin-bottom:0 }
  .ngan-keo .nut-chinh{ width:min(64%,230px); margin:22px auto !important;
    min-height:48px; justify-content:center;
    background:var(--son); background-image:none; border:0; box-shadow:none;
    -webkit-backface-visibility:hidden; backface-visibility:hidden }
  .ngan-keo > .nut-chinh{ transform:translateX(-100px) translateZ(0) }
  .ngan-keo[data-mo=co] > .nut-chinh{ transform:translateZ(0) }
  .dau .nut{ padding:8px 13px; font-size:13px; min-height:40px; white-space:nowrap }
  .dau .hieu-ten{ font-size:20px; white-space:nowrap }
  .dau .hieu{ gap:8px }
}
@media (max-width:560px){
  .khoi{ padding:56px 0 }
  body{ font-size:16px }
  .dan{ font-size:18.5px }
  .luoi-doi{ grid-template-columns:1fr }
  .dv-luoi{ grid-template-columns:repeat(2,1fr); gap:12px }
  .an-mobile{ display:none }
  .dv-luoi .dv-the{ padding:18px 15px; gap:10px }
  .dv-the .ngoc{ width:42px; height:42px }
  .dv-the .ngoc svg{ width:22px; height:22px }
  .dv-the h3{ font-size:16px }
  .dv-the .phu{ font-size:13px; line-height:1.55 }
  .bai-luoi{ grid-template-columns:1fr; gap:12px }
  .bai-luoi .bai-the{ padding:0; flex-direction:row; align-items:center }
  .bai-the-anh{ width:116px; flex:none; aspect-ratio:1; height:auto }
  .bai-the-chu{ padding:12px 14px; gap:6px; justify-content:center }
  .bai-the h3{ font-size:15.5px; line-height:1.45;
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
    overflow:hidden; min-height:0 }
  .bai-the .phu{ display:none }
  .bai-the .bv-ngay{ font-size:11.5px }
  .bv-noi-bat{ gap:12px }
  .bv-noi-bat article{ padding:0; overflow:hidden;
    display:flex; flex-direction:row; align-items:center }
  .bv-the-anh{ display:block; width:116px; flex:none; aspect-ratio:1;
    background:var(--nen2) }
  .bv-the-anh img{ width:100%; height:100%; object-fit:cover; display:block }
  .bv-the-chu{ min-width:0; padding:12px 14px;
    display:flex; flex-direction:column; gap:6px; justify-content:center }
  .bv-noi-bat h3{ font-size:15.5px; line-height:1.45; margin:0;
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
    overflow:hidden }
  .bv-noi-bat .phu{ display:none }
  .bv-noi-bat .bv-ngay{ font-size:11.5px }
  .the-cho{ display:none }
  .dau-trang-chu{ gap:18px }
  .dau-trang h1{ font-size:clamp(30px,11.4vw,52px) }
  .dan-banner{ font-size:15.5px }
  .thu-an-lon{ font-size:36px; padding:18px 10px }
  .dv-lon-chu{ padding:28px 26px }
  .the{ padding:26px }
  .dai-tram{ padding:78px 0 }
  .dai-tram-nhanvat{ display:block }
  .dai-tram{ padding:44px 0 }
  .dai-tram .khung{ min-height:0; grid-template-columns:1fr 130px;
    gap:16px; align-items:center }
  .dai-tram .han{ font-size:19px; line-height:1.5; margin-bottom:0;
    color:var(--kim-100); opacity:.88 }
  .dai-tram-nhanvat img{ height:120px; margin-top:0; margin-bottom:8px }
  .dai-tram-nhanvat .nguyet{ width:120px; height:120px; left:58%; top:20% }
  .dai-tram-nhanvat .nhan{ font-size:10px; letter-spacing:.06em;
    line-height:1.4; white-space:nowrap }
  .dai-tram-nhanvat img{ filter:none }
}
@media (max-width:560px){
  .ten-muc h2,.vet-but{ font-size:27px }
  .dai h3,.dan-do h3{ font-size:21px }
  .the:not(.dv-the):not(.bai-the):not(.bv-the) h3,
  .y-su-the h3{ font-size:19px }
  .dan{ font-size:17px }
  .ten-muc .dan{ font-size:16.5px; margin-top:12px }
  .phu{ font-size:14.5px }
  .khoi{ padding:24px 0 }
  .dau-trang + .khoi{ padding-top:48px }
  .ten-muc{ margin-bottom:34px }
  .dau-trang .khung,.gioi-thieu,.dai,.dv-lon,.khong-gian,.y-su,.bv,.lien-he,
  .chan-luoi,.dai-tram .khung{ gap:26px }
  .dau-trang .khung{ padding-top:56px; padding-bottom:56px }
  .hero-nho{ padding:34px 0 30px }
  .hero-nho h1{ font-size:33px }
  .loc-muc{ display:flex; flex-wrap:nowrap; justify-content:flex-start; gap:8px;
    overflow-x:auto; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    padding:2px 24px; margin:0 -24px 34px }
  .loc-muc::-webkit-scrollbar{ display:none }
  .loc-muc .chip{ flex:0 0 auto; min-width:122px; padding-inline:19px;
    font-size:13.5px; white-space:nowrap }
  .dau-trang{ position:relative; overflow:hidden;
    background:var(--nen-cho-anh);
    min-height:56svh; display:flex; align-items:center }
  .dau-trang::before,.dau-trang::after,.dia-van{ display:none }
  .dau-trang-anh{ position:absolute; inset:0; margin:0; border-radius:0;
    box-shadow:none; aspect-ratio:auto }
  .dau-trang-anh img{ width:100%; height:100%; object-fit:cover }
  .dau-trang-anh::after{ content:""; position:absolute; inset:0;
    background:
      linear-gradient(100deg, rgb(var(--muc-rgb)/.74) 0%, rgb(var(--muc-rgb)/.46) 58%,
        rgb(var(--muc-rgb)/.3) 100%),
      linear-gradient(180deg, rgb(var(--muc-rgb)/.34), rgb(var(--muc-rgb)/.12) 46%,
        rgb(var(--muc-rgb)/.45)) }
  .dau-trang .khung{ position:static; padding-top:0; padding-bottom:0; gap:0 }
  .dau-trang-chu{ position:relative; z-index:2; gap:18px }
  .dau-trang h1,.dau-trang .dinh-danh,.dau-trang .dan-banner{ color:#fff;
    text-shadow:0 2px 14px rgb(var(--muc-rgb)/.5) }
  .dau-trang .dinh-danh{ color:rgb(255 255 255 / .92) }
  .dau-trang .dan-banner{ color:rgb(255 255 255 / .88); max-width:30ch }
  .dau-trang .mk{ color:#fff; border-color:rgb(255 255 255 / .6) }
  .dau-trang .thu-an-lon{ color:#fff; border-color:rgb(255 255 255 / .8);
    box-shadow:none; background:rgb(255 255 255 / .08) }
  .dau-trang .may-cuoi{ filter:brightness(0) invert(1); opacity:.7 }
  .dau-trang-anh .trien-lon{ display:none }
  .tam-phu{ display:block }
  .bang-truot{ display:flex; overflow-x:auto; overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; width:100%; height:100% }
  .bang-truot::-webkit-scrollbar{ display:none }
  .bang-truot.bang-sw{ display:block; overflow:hidden; scroll-snap-type:none }
  .bang-sw .swiper-slide{ min-height:56svh }
  .tam{ flex:0 0 100%; scroll-snap-align:center; scroll-snap-stop:always;
    position:relative;
    display:flex; align-items:center; min-height:56svh }
  .tam:not(.tam-phu) .dan-banner,.tam:not(.tam-phu) .may-cuoi{ display:none }
  .dau-trang .thu-an-lon{ font-size:30px; padding:14px 9px }
  main .nut{ padding-top:0; padding-bottom:0; min-height:48px }
  .nut-banner{ display:block; margin:20px 0 0 }
  .nut-banner a{ display:inline-flex; align-items:center; gap:14px;
    border:1.6px solid rgb(255 255 255 / .85); border-radius:999px;
    padding:11px 15px 11px 22px; color:#fff; font-size:14.5px; font-weight:600;
    min-height:44px; transition:background .25s ease, border-color .25s ease }
  .nut-banner a::after{ content:""; width:8px; height:8px; border-radius:50%;
    border:3px solid var(--son); background:none }
  .nut-banner a:active{ background:rgb(255 255 255 / .16) }
  .tam .khung{ position:static }
  .co-js .tam .dau-trang-chu{ opacity:0; transform:translateX(400px) }
  .tam{ overflow-x:clip }
  .co-js .tam.tam-dang .dau-trang-chu{ opacity:1; transform:none;
    transition:opacity 1.5s ease, transform 1.5s ease }
  .tam-tit{ margin:0 0 14px; font-family:var(--chu-tieu-de); font-weight:600;
    font-size:clamp(28px,9vw,40px); line-height:1.2; color:#fff;
    text-shadow:0 2px 14px rgb(var(--muc-rgb)/.5) }
  .cham-bang{ display:flex; gap:8px; position:absolute; left:0; right:0; bottom:18px;
    justify-content:center; z-index:3 }
  .cham-bang{ align-items:center }
  .cham-bang button{ width:6px; height:6px; border:0; padding:0; cursor:pointer;
    border-radius:50%; background:rgb(255 255 255 / .8);
    transition:width .3s ease, height .3s ease, border-radius .3s ease, background .3s ease }
  .cham-bang button[aria-current=true]{ width:26px; height:4px; border-radius:0;
    background:var(--son) }
}
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important }
  .hien{ opacity:1; transform:none }
}
@media (max-width:760px){
  .bv-anh{ display:none }
  .gioi-thieu-anh{ display:none }
  .gioi-thieu .nhan-an{ display:none }
  .khong-gian:has(.kg-boc) .khung-doi{ display:none }
  .khong-gian:has(.kg-boc) .khong-gian-anh{ display:none }
  .khong-gian > *{ min-width:0 }
  .kg-boc{ display:block; margin-top:26px }
  .khong-gian:has(.kg-boc) > div > p{ display:none }
  .kg-dau .mk{ display:none }
  .khong-gian:has(.kg-boc) > div{ display:grid; grid-template-columns:1fr auto;
    align-items:center; row-gap:14px }
  .kg-boc{ display:contents }
  .khong-gian:has(.kg-boc) > div > h2.vet-but{ grid-column:1; grid-row:1;
    margin:0; background:none; font-size:30px; line-height:1.1;
    padding:9px 0 0 }
  .kg-dau{ grid-column:2; grid-row:1; margin:0 }
  .kg-khay{ grid-column:1 / -1 }
  .kg-cham{ grid-column:1 / -1; margin-top:0 }
  .kg-dau{ display:flex; justify-content:flex-end; align-items:center;
    gap:10px; margin-bottom:14px }
  .kg-dau .mk{ margin-right:auto }
  .kg-nut{ width:40px; height:40px; border-radius:50%; border:0; cursor:pointer;
    background:var(--son); color:#fff; display:grid; place-content:center;
    touch-action:manipulation;
    transition:background .2s, color .2s }
  .kg-nut svg{ width:18px; height:18px; fill:currentColor }
  .kg-nut:disabled{ background:var(--nen2-dam); color:var(--muc2); cursor:default }
  .kg-khay{ display:block; overflow:hidden;
    padding:4px 24px 10px; margin:0 -24px }
  .kg-sw .swiper-wrapper{ align-items:stretch }
  .kg-sw .kg-the{ width:82%; flex:0 0 auto; height:auto }
  .kg-the{ flex:0 0 82%; text-decoration:none; color:inherit;
    background:var(--the); border:1px solid var(--vien-nhat); border-radius:var(--bo);
    box-shadow:var(--bong-sm); overflow:hidden; display:block }
  .kg-anh{ aspect-ratio:16/9; overflow:hidden }
  .kg-anh img{ width:100%; height:100%; object-fit:cover; display:block }
  .kg-chu{ padding:16px 18px 18px }
  .kg-chu h3{ margin:0 0 6px; font-size:18px; color:var(--kim2) }
  .kg-chu .phu{ margin:0; font-size:14px; line-height:1.6;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
  .kg-cham{ display:flex; justify-content:center; gap:7px; margin-top:14px }
  .kg-cham i{ width:7px; height:7px; border-radius:50%; background:var(--vien);
    transition:background .2s }
  .kg-cham i.dang{ background:var(--son) }
  .bv-noi-bat article:nth-child(n+4){ display:flex }
  .chan{ padding-top:44px }
  .chan ul a,
  .lh-danh a,
  .lien-ket,
  .chan p a{ display:inline-flex; align-items:center; min-height:44px }
  .chan .mxh a{ min-height:0; position:relative }
  .chan .mxh a::after{ content:""; position:absolute; inset:-2px; border-radius:50% }
  .chan ul{ gap:0 }
  .chip{ min-height:44px; padding:0 19px }
  .hieu{ min-height:44px; align-items:center }
  .chan ul.chan-tt{ row-gap:9px }
  .chan ul.chan-tt a{ display:inline; min-height:0; position:relative }
  .chan ul.chan-tt a::after{ content:""; position:absolute; left:0; right:0;
    top:50%; height:44px; transform:translateY(-50%) }
  .chan ul.chan-cs-ds a{ display:inline; min-height:0; position:relative }
  .chan ul.chan-cs-ds a::after{ content:""; position:absolute; left:0; right:0;
    top:50%; height:44px; transform:translateY(-50%) }
}
.ten-muc h2::before,
.ten-muc h2::after{
  content:""; flex:none; width:55px; height:24px;
  opacity:.88 }
.ten-muc h2::before{ background:url("../img/demo/may-trai.webp") center/contain no-repeat }
.ten-muc h2::after { background:url("../img/demo/may-phai.webp") center/contain no-repeat }
.vet-but{ display:inline-block; padding:12px 46px 16px;
  font-family:var(--chu-thu-phap); letter-spacing:0; font-weight:400;
  margin-left:-46px;
  background:url("../img/demo/vet-but.webp") center/100% 100% no-repeat;
  min-width:calc(5.4em + 92px) }
@media (max-width:560px){
  .ten-muc h2{ gap:13px }
  .ten-muc h2::before,.ten-muc h2::after{ width:42px; height:16px }
}
.ban-do{ border-radius:var(--bo); overflow:hidden; box-shadow:var(--bong-sm);
  border:1px solid var(--vien-nhat); display:flex }
.ban-do iframe{ width:100%; border:0; display:block; flex:1; min-height:inherit }
.ve-dau-trang{ position:fixed; left:18px; bottom:18px; z-index:55;
  width:46px; height:46px; border-radius:50%; border:1px solid var(--vien);
  background:var(--the); color:var(--kim2); cursor:pointer;
  display:grid; place-content:center; box-shadow:var(--bong-sm);
  opacity:0; pointer-events:none; transform:translateY(8px);
  transition:opacity .3s ease, transform .3s ease, border-color .2s, color .2s }
.ve-dau-trang[data-hien=co]{ opacity:1; pointer-events:auto; transform:none }
.ve-dau-trang:hover{ border-color:var(--son); color:var(--son) }
.ve-dau-trang svg{ width:22px; height:22px; fill:currentColor }
@media (max-width:760px){ .ve-dau-trang{ bottom:calc(75px + env(safe-area-inset-bottom)) } }
@media (max-width:560px){ .ve-dau-trang{ left:13px; bottom:calc(70px + env(safe-area-inset-bottom));
  width:42px; height:42px } }
.noi-nhanh{ position:fixed; right:18px; bottom:18px; z-index:55;
  display:flex; flex-direction:column; gap:12px }
.nn{ width:52px; height:52px; border-radius:50%; display:grid; place-content:center;
  box-shadow:var(--bong-md); transition:transform .25s ease }
.nn:hover{ transform:translateY(-3px) }
.nn svg{ width:26px; height:26px; fill:#ffffff }
.nn-zalo{ background:var(--zalo); color:#ffffff; font-weight:700; font-size:14.5px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif }
.nn-fb{ background:var(--messenger) }
.nn-goi{ background:var(--son) }
@media (max-width:560px){
  .noi-nhanh{ right:13px; bottom:13px; gap:10px }
  .nn{ width:47px; height:47px }
}
.dk{ font-size:16px; line-height:1.75; color:var(--muc) }
.dk p{ margin:0 0 16px }
.dk p, .dk li{ text-align:justify; text-justify:inter-word }
.dk strong{ color:var(--muc); font-weight:600 }
.dk-ngay{ font-size:13.5px; color:var(--muc2); margin:0 0 44px !important }
.dk h2{ margin:64px 0 14px;
  font-family:var(--chu-tieu-de); font-weight:600; font-size:20px;
  line-height:1.35; color:var(--muc) }
.dk-so{ color:var(--muc); margin-right:9px; font-weight:700 }
.dk-so::after{ content:"." }
.dk ul{ margin:0 0 16px; padding-left:22px }
.dk li{ margin-bottom:8px }
.dk-nhan{ margin:20px 0 !important; padding:14px 18px;
  border-left:2px solid var(--son); background:var(--nen2) }
.dk-nhan strong{ color:var(--muc) }
.dk-canh{ margin:22px 0 !important; padding:15px 18px;
  border:1px solid var(--son); border-radius:var(--bo); color:var(--muc) }
.dk-canh a{ color:var(--son); font-weight:700; text-decoration:underline }
@media (max-width:760px){
  .dk{ line-height:1.72 }
  .dk h2{ font-size:18px; margin-top:54px }
  .dk-nhan,.dk-canh{ padding:13px 15px }
  .dk-ngay{ text-align:left }
}
@media (max-width:370px){
  .chan .mxh{ gap:10px }
  .chan .mxh a{ width:38px; height:38px }
  .chan .mxh a::after{ inset:-4px }
}