/* "Quy trình làm việc" video section — shared by index.html and pricing.html */
.vp-section{position:relative;border-top:1px solid #e0ddd1;background:#f3f1e9;overflow:hidden}
.vp-wrap{position:relative;max-width:72rem;margin:0 auto;padding:5rem 1.25rem}
@media(min-width:640px){.vp-wrap{padding:6rem 2rem}}
.vp-eyebrow{margin:0 0 1rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;font-weight:500;color:#ee8a4f}
.vp-title{margin:0 0 1.25rem;font-family:"DM Serif Display",serif;font-size:2.25rem;line-height:1.1;font-weight:600;letter-spacing:-.02em;color:#1f3a52;text-wrap:balance}
.vp-title span{font-style:italic;color:#ee8a4f}
@media(min-width:640px){.vp-title{font-size:3rem}}
.vp-lead{margin:0;max-width:42rem;font-size:1.0625rem;line-height:1.65;color:#6b6b66}

.vp-grid{display:grid;gap:1.25rem;margin-top:2.5rem;align-items:start}
@media(min-width:1024px){.vp-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:2.5rem}}

.vp-player{position:relative;margin:0;aspect-ratio:16/9;max-width:100%;border-radius:18px;overflow:hidden;background:#16293c;box-shadow:0 30px 60px -32px rgba(22,41,60,.6)}
@media(max-width:639px){.vp-player{margin-inline:-1.25rem;width:calc(100% + 2.5rem);max-width:none;border-radius:0}}
.vp-video{display:block;width:100%;height:100%;object-fit:cover;cursor:pointer}
.vp-bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(250,248,241,.18)}
.vp-bar i{display:block;height:100%;width:0;background:#ee8a4f}

.vp-sound{position:absolute;right:12px;bottom:14px;width:42px;height:42px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(22,41,60,.82);color:#faf8f1;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@media(max-width:639px){.vp-sound{width:38px;height:38px;right:10px;bottom:12px}}
.vp-sound svg{width:20px;height:20px}
.vp-sound .vp-ic-on{display:none}
.vp-sound.is-on .vp-ic-on{display:block}
.vp-sound.is-on .vp-ic-off{display:none}
.vp-sound.vp-attn{animation:vp-pulse 1.6s ease-out infinite}
@keyframes vp-pulse{0%{box-shadow:0 0 0 0 rgba(238,138,79,.65)}100%{box-shadow:0 0 0 12px rgba(238,138,79,0)}}
.vp-hint{position:absolute;right:62px;bottom:21px;padding:6px 12px;border-radius:999px;background:rgba(22,41,60,.86);color:#faf8f1;font:600 13px/1.2 "DM Sans",system-ui,sans-serif;white-space:nowrap;opacity:0;transform:translateX(6px);transition:opacity .3s,transform .3s;pointer-events:none}
@media(max-width:639px){.vp-hint{right:56px;bottom:18px;font-size:12px}}
.vp-hint.show{opacity:1;transform:none}
.vp-bigplay{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;border:0;background:rgba(238,138,79,.95);color:#fff;display:none;place-items:center;cursor:pointer;box-shadow:0 12px 30px -10px rgba(0,0,0,.5)}
.vp-bigplay svg{width:28px;height:28px;margin-left:4px}
.vp-player.is-paused .vp-bigplay{display:grid}
.vp-sound:focus-visible,.vp-bigplay:focus-visible,.vp-step:focus-visible{outline:2px solid #ee8a4f;outline-offset:3px}

/* caption under the video (phones/tablets only) */
.vp-now{margin:0;padding:.9rem 1rem;border:1px solid #e0ddd1;border-radius:14px;background:#fff;font-size:.95rem;line-height:1.5;color:#3d3d3a;min-height:4.5rem}
.vp-now b{display:block;color:#1f3a52;margin-bottom:.15rem}
@media(min-width:1024px){.vp-now{display:none}}

.vp-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
@media(min-width:1024px){.vp-steps{grid-template-columns:minmax(0,1fr);gap:.375rem}}
.vp-step{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:.75rem;align-items:center;padding:.7rem .8rem;border:1px solid #e0ddd1;border-radius:14px;background:rgba(255,255,255,.55);cursor:pointer;transition:background .3s,border-color .3s,box-shadow .3s}
@media(min-width:1024px){.vp-step{align-items:start;padding:.85rem 1rem;border-color:transparent;background:transparent}}
.vp-step:hover{background:#fff}
.vp-step.is-active{background:#fff;border-color:#ee8a4f;box-shadow:0 12px 26px -20px rgba(22,41,60,.45)}
@media(min-width:1024px){.vp-step.is-active{border-color:#e0ddd1}}
.vp-num{width:2.25rem;height:2.25rem;border-radius:50%;display:grid;place-items:center;font:600 .78rem ui-monospace,Menlo,monospace;color:#1f3a52;border:1px solid #e0ddd1;background:#faf8f1;transition:background .3s,color .3s,border-color .3s}
.vp-step.is-done .vp-num{color:#2e9e6a;border-color:rgba(46,158,106,.45);background:rgba(46,158,106,.08)}
.vp-step.is-active .vp-num{background:#ee8a4f;border-color:#ee8a4f;color:#fff}
.vp-st{display:block;margin:0;font:600 .95rem/1.3 "DM Sans",system-ui,sans-serif;color:#1a1a1a}
.vp-step .vp-desc{display:none;margin:.25rem 0 0;font-size:.9rem;line-height:1.5;color:#6b6b66}
@media(min-width:1024px){.vp-st{font-size:1rem}.vp-step .vp-desc{display:block}}
@media(prefers-reduced-motion:reduce){.vp-sound.vp-attn{animation:none}.vp-step,.vp-num{transition:none}}