/* Header DigiTrain dùng chung cho MỌI trang digipeople/digitrain.
   Scope hết dưới .dt-header: các trang khác đang dùng .wrap (31 chỗ) và
   .btn (12 chỗ) cho mục đích riêng, để rule trần sẽ phá layout của họ. */
.dt-header{
  --dt-dgreen:#00522D; --dt-orange:#F5751A; --dt-ink2:#5B6F67; --dt-line:#DCEAE1; --dt-paper:#fff;
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--dt-line);font-family:'Roboto',system-ui,sans-serif;
}
.dt-header .dt-wrap{max-width:1240px;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:22px;height:70px}
.dt-header img{height:52px;width:auto;max-width:none;display:block}
.dt-header nav.dt-nav{margin-left:auto;display:flex;gap:26px;font-size:15px;font-weight:500}
.dt-header nav.dt-nav a{color:var(--dt-ink2);text-decoration:none}
.dt-header nav.dt-nav a:hover{color:var(--dt-dgreen)}
.dt-header .dt-cta{display:inline-flex;align-items:center;justify-content:center;padding:11px 20px;font-size:14.5px;
  font-weight:700;border-radius:10px;background:var(--dt-orange);color:#fff;text-decoration:none;
  box-shadow:0 10px 26px rgba(245,117,26,.28);transition:background .2s,transform .2s}
.dt-header .dt-cta:hover{background:var(--dt-dgreen);color:#fff;transform:translateY(-2px)}
.dt-header svg{width:auto;height:auto}

.dt-header .dt-toggle{display:none;margin-left:auto;width:44px;height:44px;flex:none;align-items:center;
  justify-content:center;gap:5px;flex-direction:column;background:transparent;border:1px solid var(--dt-line);
  border-radius:10px;cursor:pointer;padding:0}
.dt-header .dt-toggle span{display:block;width:20px;height:2px;border-radius:2px;background:var(--dt-dgreen);
  transition:transform .2s,opacity .2s}
.dt-header .dt-toggle.on span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.dt-header .dt-toggle.on span:nth-child(2){opacity:0}
.dt-header .dt-toggle.on span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.dt-header .dt-mnav{display:none;flex-direction:column;gap:2px;padding:10px 20px 18px;
  border-top:1px solid var(--dt-line);background:var(--dt-paper)}
.dt-header .dt-mnav a:not(.dt-cta){padding:13px 4px;font-weight:700;font-size:15px;color:var(--dt-ink2);
  text-decoration:none;border-bottom:1px solid var(--dt-line)}
.dt-header .dt-mnav a:not(.dt-cta):last-of-type{border-bottom:0}
.dt-header .dt-mnav .dt-cta{width:100%;margin-top:14px}

@media(max-width:1080px){
  .dt-header .dt-toggle{display:flex}
  .dt-header nav.dt-nav{display:none}
  .dt-header .dt-wrap>.dt-cta{display:none}
  .dt-header .dt-mnav:not([hidden]){display:flex}
}
@media(max-width:720px){
  .dt-header .dt-wrap{height:62px;gap:12px;padding:0 18px}
  .dt-header img{height:46px}
}