/* HVC Loader — màn hình chờ dùng chung cho mọi trang */
#hvc-loader{
  --forest:#0F4D22;--forest-deep:#082B13;--hvc:#1E7A34;--leaf:#4CAF50;--sprout:#9CCC3C;--paper:#FBFCF8;
  position:fixed;inset:0;z-index:2147483000;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(1200px 700px at 50% 38%,rgba(156,204,60,.14),transparent 60%),
    radial-gradient(900px 600px at 50% 120%,rgba(76,175,80,.18),transparent 65%),
    linear-gradient(160deg,#0F4D22 0%,#0B3A19 55%,#082B13 100%);
  color:var(--paper);
  font-family:'Be Vietnam Pro',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  opacity:1;visibility:visible;
  transition:opacity .7s cubic-bezier(.7,0,.2,1),visibility 0s linear 0s;
  overflow:hidden;
}
#hvc-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .7s cubic-bezier(.7,0,.2,1),visibility 0s linear .7s}
#hvc-loader.is-fast{transition-duration:.35s}
html.hvc-loading,html.hvc-loading body{overflow:hidden}

/* vân lưới mảnh tạo chiều sâu */
#hvc-loader::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;
  background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(circle at 50% 45%,#000 0,transparent 65%);
          mask-image:radial-gradient(circle at 50% 45%,#000 0,transparent 65%);
}

.hvc-ld-inner{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 24px;width:100%;max-width:680px;text-align:center}

/* logo + vòng sáng */
.hvc-ld-emblem{position:relative;width:148px;height:148px;margin-bottom:34px}
.hvc-ld-emblem::after{ /* quầng sáng */
  content:"";position:absolute;inset:-28px;border-radius:50%;
  background:radial-gradient(circle,rgba(156,204,60,.28),transparent 68%);
  animation:hvc-ld-glow 3.2s ease-in-out infinite;z-index:0;
}
.hvc-ld-ring{position:absolute;inset:-14px;z-index:1}
.hvc-ld-ring svg{width:100%;height:100%;display:block;animation:hvc-ld-spin 2.4s linear infinite}
.hvc-ld-ring--slow svg{animation:hvc-ld-spin-rev 9s linear infinite}
.hvc-ld-logo{
  position:absolute;inset:0;z-index:2;border-radius:50%;background:#FFFFFF;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 1px rgba(255,255,255,.6),0 18px 50px rgba(0,0,0,.35),inset 0 0 0 6px #FFFFFF;
  animation:hvc-ld-rise .9s cubic-bezier(.2,.8,.2,1) both;
}
.hvc-ld-logo img{width:92%;height:92%;object-fit:contain;display:block}

.hvc-ld-eyebrow{
  font-size:clamp(10px,2.9vw,12.5px);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--sprout);
  margin:0 0 12px;padding-left:.24em;white-space:nowrap;
  animation:hvc-ld-fade .9s .15s cubic-bezier(.2,.8,.2,1) both;
}
.hvc-ld-title{
  margin:0;font-family:'Cormorant Garamond','Times New Roman',serif;font-size:clamp(20px,6.2vw,38px);font-weight:600;line-height:1.1;letter-spacing:.08em;white-space:nowrap;text-transform:uppercase;color:#FFFFFF;padding-left:.08em;
  animation:hvc-ld-fade .9s .25s cubic-bezier(.2,.8,.2,1) both;
}
.hvc-ld-rule{display:flex;align-items:center;gap:10px;margin:18px 0 34px;color:rgba(220,235,207,.8);font-size:clamp(9px,2.5vw,12px);font-weight:400;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;
  animation:hvc-ld-fade .9s .35s cubic-bezier(.2,.8,.2,1) both}
.hvc-ld-rule::before,.hvc-ld-rule::after{content:"";flex:0 0 auto;width:clamp(16px,5vw,40px);height:1px;background:linear-gradient(90deg,transparent,rgba(156,204,60,.8),transparent)}

/* thanh tiến trình */
.hvc-ld-bar-wrap{width:100%;max-width:300px;animation:hvc-ld-fade .9s .45s cubic-bezier(.2,.8,.2,1) both}
.hvc-ld-meta{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;
  font-size:12px;letter-spacing:.06em;color:rgba(220,235,207,.75)}
.hvc-ld-label{font-family:'Cormorant Garamond','Times New Roman',serif;font-style:italic;font-size:16px;letter-spacing:.02em}
.hvc-ld-pct{color:#FFFFFF;font-weight:400;font-variant-numeric:tabular-nums}
.hvc-ld-track{position:relative;height:3px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.hvc-ld-fill{
  position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:inherit;
  transform-origin:left center;transform:scaleX(0);
  background:linear-gradient(90deg,var(--leaf),var(--sprout) 70%,#E3F5B5);
  box-shadow:0 0 12px rgba(156,204,60,.8);
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
.hvc-ld-fill::after{ /* vệt sáng chạy */
  content:"";position:absolute;top:0;bottom:0;width:60px;left:-60px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);
  animation:hvc-ld-shimmer 1.6s ease-in-out infinite;
}

/* lá bay */
.hvc-ld-leaves{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hvc-ld-leaf{position:absolute;bottom:-40px;width:18px;height:18px;opacity:0;color:var(--sprout);animation:hvc-ld-float linear infinite}
.hvc-ld-leaf svg{width:100%;height:100%;display:block}

@keyframes hvc-ld-spin{to{transform:rotate(360deg)}}
@keyframes hvc-ld-spin-rev{to{transform:rotate(-360deg)}}
@keyframes hvc-ld-glow{0%,100%{opacity:.6;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
@keyframes hvc-ld-rise{from{opacity:0;transform:translateY(10px) scale(.92)}to{opacity:1;transform:none}}
@keyframes hvc-ld-fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes hvc-ld-shimmer{0%{left:-60px}100%{left:100%}}
@keyframes hvc-ld-float{
  0%{transform:translate(0,0) rotate(0);opacity:0}
  12%{opacity:.55}
  85%{opacity:.35}
  100%{transform:translate(var(--dx,40px),-110vh) rotate(var(--rot,240deg));opacity:0}
}

@media (max-width:480px){
  .hvc-ld-emblem{width:120px;height:120px;margin-bottom:28px}
  .hvc-ld-title{letter-spacing:.05em;padding-left:.05em}
  .hvc-ld-eyebrow{letter-spacing:.16em;padding-left:.16em}
  .hvc-ld-rule{letter-spacing:.08em;gap:8px}
}
@media (prefers-reduced-motion:reduce){
  #hvc-loader *,#hvc-loader *::before,#hvc-loader *::after{animation:none!important}
  .hvc-ld-leaves{display:none}
}