:root{--blue:#1e40af;--blue2:#2563eb;--navy:#0f2043;--yellow:#fbbf24;--yellow-d:#d97706;--green:#16a34a;--ink:#1f2937;--muted:#6b7280;--bg:#fff;--soft:#f5faff;--line:#e5e7eb;--r:20px;--max:1240px;--shadow:0 10px 30px rgba(30,64,175,.12)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body.hsg-body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:#fff;color:var(--ink);line-height:1.65;font-size:16px;-webkit-font-smoothing:antialiased}
.hsg-body h1,.hsg-body h2,.hsg-body h3{line-height:1.3;color:#111827}
.hsg-body img{max-width:100%;height:auto}
.hsg-wrap{max-width:var(--max);margin:0 auto;padding:0 16px}
.hsg-sec{padding:64px 0}
.hsg-alt{background:var(--soft)}
.hsg-sec-head{text-align:center;max-width:720px;margin:0 auto 36px}
.hsg-sec-head span{display:inline-block;color:var(--blue2);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.18em}
.hsg-sec-head h2{font-size:clamp(24px,3.4vw,38px);font-weight:800;margin-top:8px}
.hsg-sec-head h2 span{color:var(--blue2)}
.hsg-sec-head p{color:var(--muted);margin-top:10px}
/* Menu + footer DUNG CHUNG (shared): khong viet CSS de len - chi style noi dung trang chu */
/* buttons */
.hsg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:13px 26px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font-size:15px;font-family:inherit;transition:transform .15s,box-shadow .15s,background .15s}
.hsg-btn:active{transform:scale(.98)}
.hsg-btn-yellow{background:var(--yellow);color:#1e3a8a;box-shadow:0 8px 20px rgba(251,191,36,.4)}
.hsg-btn-yellow:hover{background:#f59e0b}
.hsg-btn-blue{background:var(--blue2);color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.3);flex:1}
.hsg-btn-blue:hover{background:var(--blue)}
.hsg-btn-zalo{background:#fff;color:var(--green);border:2px solid var(--green);flex:1;padding:11px 10px}
.hsg-btn-zalo:hover{background:var(--green);color:#fff}
.hsg-btn-outline-w{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.7)}
.hsg-btn-outline-w:hover{background:rgba(255,255,255,.14)}
.hsg-btn-ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}
/* hero */
.hsg-hero{position:relative;min-height:640px;display:flex;align-items:center;overflow:hidden;background:var(--navy);padding:56px 0}
.hsg-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hsg-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,22,48,.78) 0%,rgba(10,22,48,.55) 50%,rgba(10,22,48,.25) 100%)}
.hsg-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;width:100%}
.hsg-badge{display:inline-block;background:var(--yellow);color:#1e3a8a;font-weight:800;font-size:13px;padding:7px 16px;border-radius:10px;box-shadow:0 8px 20px rgba(251,191,36,.35)}
.hsg-hero-copy h1{color:#fff;font-size:clamp(28px,4vw,46px);font-weight:800;margin:16px 0 14px}
.hsg-hero-copy h1 span{color:var(--yellow)}
/* Plugin hlx-entity ghi de H1 thanh 2 span hlx-hero-line: dong 1 trang, dong 2 vang */
.hsg-hero-copy h1 .hlx-hero-line{display:block;line-height:1.25}
.hsg-hero-copy h1 .hlx-hero-line-main{color:#fff}
.hsg-hero-copy h1 .hlx-hero-accent{color:var(--yellow)}
.hsg-lead{color:#e2e8f5;font-size:16.5px;max-width:36rem}
.hsg-points{list-style:none;margin:20px 0;display:grid;gap:10px}
.hsg-points li{color:#f1f5ff;font-size:15px;padding-left:30px;position:relative}
.hsg-points li::before{content:"\2713 ";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center}
.hsg-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.hsg-form-card{background:#fff;border-radius:18px;padding:26px;color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.hsg-form-card h3{font-size:21px;font-weight:800;text-align:center}
.hsg-form-card p{font-size:13.5px;color:var(--muted);margin:6px 0 14px;text-align:center}
.hsg-form-card input,.hsg-form-card select{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:12px;font-size:15px;font-family:inherit;margin-bottom:10px;background:#f9fafb}
.hsg-form-card input:focus,.hsg-form-card select:focus{outline:none;border-color:var(--blue2);background:#fff}
.hsg-form-msg{font-size:13.5px;margin-top:10px;text-align:center}
/* trust */
.hsg-trust{background:#fff;border-bottom:1px solid var(--line)}
.hsg-trust-grid{display:grid;grid-template-columns:repeat(4,1fr);padding-top:22px;padding-bottom:22px;text-align:center}
.hsg-trust-grid div{padding:6px 16px;border-left:1px solid var(--line)}
.hsg-trust-grid div:first-child{border-left:0}
.hsg-trust-grid b{font-size:26px;font-weight:800;color:var(--blue2);display:block}
.hsg-trust-grid span{font-size:13px;color:var(--muted)}
/* why */
.hsg-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.hsg-why-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 22px;text-align:center;position:relative;box-shadow:0 2px 8px rgba(0,0,0,.04);transition:transform .2s,box-shadow .2s;text-decoration:none;color:inherit;display:block}
.hsg-why-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.hsg-why-card i{position:absolute;top:-16px;right:-8px;width:44px;height:44px;border-radius:50%;background:var(--blue2);color:#fff;font-weight:800;font-style:normal;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(37,99,235,.4);border:4px solid #fff}
.hsg-why-card h3{font-size:17px;font-weight:800;margin:10px 0 8px}
.hsg-why-card p{font-size:14px;color:var(--muted)}
/* courses */
.hsg-courses{background:var(--soft)}
.hsg-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hsg-course{background:#fff;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:0 2px 8px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.hsg-course:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(30,64,175,.14)}
.hsg-course-img{position:relative;height:190px;overflow:hidden}
.hsg-course-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.hsg-course:hover .hsg-course-img img{transform:scale(1.06)}
.hsg-course-tag{position:absolute;left:12px;bottom:12px;background:rgba(15,32,67,.85);color:#fff;font-size:13px;font-weight:700;padding:6px 14px;border-radius:999px}
.hsg-course-body{padding:22px;display:flex;flex-direction:column;flex:1}
.hsg-course-body h3{font-size:19px;font-weight:800}
.hsg-course-price{font-size:24px;font-weight:800;color:var(--blue2);margin:6px 0}
.hsg-price-old{font-size:15px;color:#9ca3af;text-decoration:line-through;margin:8px 0 0}
.hsg-price-off{display:inline-block;font-size:12px;font-weight:800;color:#b45309;background:#fef3c7;border:1px solid #fcd34d;border-radius:8px;padding:3px 10px;margin:4px 0 0;letter-spacing:.03em}
.hsg-course-desc{font-size:14px;color:var(--muted);margin-bottom:10px}
.hsg-course-body ul{list-style:none;display:grid;gap:7px;margin-bottom:16px}
.hsg-course-body ul li{font-size:13.5px;padding-left:24px;position:relative;color:#374151}
.hsg-course-body ul li::before{content:"\2713 ";position:absolute;left:0;color:var(--blue2);font-weight:800}
.hsg-course-btns{display:flex;gap:10px;margin-top:auto}
/* steps */
.hsg-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.hsg-step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 22px;text-align:center;position:relative;transition:box-shadow .2s,transform .2s;text-decoration:none;color:inherit;display:block}
.hsg-step:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
/* map */
.hsg-map{border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:0 2px 8px rgba(0,0,0,.05)}
.hsg-map iframe{width:100%;height:450px;display:block}
.hsg-map-stretch{border-radius:0;border-left:0;border-right:0;}
.hsg-map-stretch iframe{height:500px;}
.hsg-step:hover{box-shadow:var(--shadow)}
.hsg-step span{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;font-weight:800;font-size:19px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(37,99,235,.35);margin-bottom:12px}
.hsg-step h3{font-size:16.5px;font-weight:800;margin-bottom:6px}
.hsg-step p{font-size:13.5px;color:var(--muted)}
/* gallery */
.hsg-gal{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hsg-gal figure{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#fff}
.hsg-gal img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .3s}
.hsg-gal figure:hover img{transform:scale(1.04)}
/* faq */
.hsg-faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-bottom:12px}
.hsg-faq summary{cursor:pointer;font-weight:700;font-size:16px;color:#111827}
.hsg-faq p{margin-top:10px;font-size:15px;color:#4b5563}
/* contact */
.hsg-contact{background:linear-gradient(120deg,#1e3a8a,#2563eb);color:#fff;border-radius:26px;padding:48px;display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center}
.hsg-contact h2{color:#fff;font-size:clamp(22px,3vw,32px);font-weight:800}
.hsg-contact p{margin-top:12px;font-size:15px;color:#dbe4ff}
.hsg-eyebrow{display:inline-block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow-d);font-weight:800;margin-bottom:10px}
.hsg-contact-info{background:rgba(255,255,255,.12);border-radius:18px;padding:26px}
.hsg-contact-info p{margin:10px 0;color:#fff}
.hsg-contact-info a{color:var(--yellow);font-weight:700;text-decoration:none}
/* video */
.hsg-video-frame{aspect-ratio:16/9;background:#000;border-radius:14px 14px 0 0;overflow:hidden}
.hsg-video-frame iframe{width:100%;height:100%;border:0}
.hsg-more{color:var(--blue2);font-weight:700;text-decoration:none;font-size:14px}
/* study */
.hsg-study-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.hsg-study-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .2s,box-shadow .2s}
.hsg-study-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.hsg-study-card img{width:100%;height:220px;object-fit:cover;display:block;background:#dbe4ff}
.hsg-study-card span{display:block;padding:16px 20px;font-weight:800;font-size:16px}
/* video doc 600 cau tu cam nang */
.hsg-vhead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;text-align:left}
.hsg-vhead .hsg-sec-head{margin:0;text-align:left;max-width:none}
.hsg-vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:26px}
.hsg-vcard{position:relative;display:block;border-radius:18px;overflow:hidden;background:#f4f1e6;border:1px solid var(--line);text-decoration:none;color:inherit;aspect-ratio:9/16}
.hsg-vcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hsg-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center}
.hsg-vtitle{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.65));color:#fff;font-size:14px;font-weight:700}
@media(max-width:900px){.hsg-vgrid{grid-template-columns:1fr 1fr}.hsg-vhead{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){.hsg-vgrid{grid-template-columns:1fr}}
/* news giong trang cu */
.hsg-news{background:#fff}
.hsg-news-top{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;margin-bottom:16px}
.hsg-news-hero{position:relative;min-height:320px;border-radius:18px;overflow:hidden;display:block;color:#fff;text-decoration:none}
.hsg-news-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hsg-news-hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.1),rgba(15,23,42,.82))}
.hsg-news-hero .body{position:absolute;left:20px;right:20px;bottom:18px}
.hsg-news-kicker{display:inline-block;background:#f5c518;color:#111;font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px;margin-bottom:8px}
.hsg-news-hero h3{margin:0 0 8px;font-size:22px;line-height:1.3;color:#fff}
.hsg-news-hero .cat{color:#c7d7ff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.hsg-news-hero .meta{font-size:12px;opacity:.9}
.hsg-news-side{display:flex;flex-direction:column;gap:16px}
.hsg-news-row{display:flex;gap:12px;background:#fff;border:1px solid #e8eef7;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;min-height:132px}
.hsg-news-row img{width:168px;height:132px;object-fit:cover;flex:0 0 168px}
.hsg-news-row .txt{padding:12px 12px 12px 0;display:flex;flex-direction:column;justify-content:center}
.hsg-news-row .cat,.hsg-news-card .cat{color:#1e6bff;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}
.hsg-news-row h3{margin:0 0 6px;font-size:16px;line-height:1.35;color:#0f172a}
.hsg-news-row .meta,.hsg-news-card .meta{font-size:12px;color:#94a3b8}
.hsg-news-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hsg-news-card{background:#fff;border:1px solid #e8eef7;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;display:block}
.hsg-news-card img{width:100%;height:160px;object-fit:cover;display:block}
.hsg-news-card .txt{padding:12px 14px 16px}
.hsg-news-card h3{margin:0 0 8px;font-size:15px;line-height:1.4;color:#0f172a;min-height:42px}
@media(max-width:900px){
.hsg-news-top,.hsg-news-grid{grid-template-columns:1fr}
.hsg-news-hero{min-height:240px}
.hsg-news-row img{width:120px;flex-basis:120px;height:110px}
}
/* reviews marquee */
.hsg-reviews{background:linear-gradient(180deg,#f4f8ff,#fff)}
.hsg-marquee{overflow:hidden;width:100%}
.hsg-track{display:flex;gap:14px;padding:8px 16px;will-change:transform;width:max-content}
.hsg-review{flex:0 0 300px;background:#fff;border:1px solid #e7eef8;border-radius:18px;overflow:hidden;box-shadow:0 10px 28px rgba(20,50,110,.08);margin:0}
.hsg-review img{width:100%;height:auto;display:block;aspect-ratio:9/16;object-fit:cover;object-position:top}
@media(max-width:960px){
.hsg-study-grid{grid-template-columns:1fr}
.hsg-review{flex-basis:78vw}
.hsg-hero{min-height:0}
.hsg-hero-grid{grid-template-columns:1fr}
.hsg-grid4{grid-template-columns:1fr 1fr}
.hsg-grid3{grid-template-columns:1fr 1fr}
.hsg-steps{grid-template-columns:1fr 1fr}
.hsg-gal{grid-template-columns:1fr 1fr}
.hsg-trust-grid{grid-template-columns:1fr 1fr;gap:14px}
.hsg-trust-grid div{border-left:0}
.hsg-contact{grid-template-columns:1fr;padding:32px 24px}
.hsg-sec{padding:52px 0}
}
@media(max-width:600px){.hsg-grid4,.hsg-grid3,.hsg-steps{grid-template-columns:1fr}.hsg-course-img{height:170px}.hsg-map iframe{height:320px}}

/* Video hướng dẫn top 3 cards - giống trang cũ */
.hsg-video-top{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}
.hsg-vid-card{background:#fff;border:1px solid #e8e0d0;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
.hsg-vid-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,32,46,.08)}
.hsg-vid-thumb{position:relative;aspect-ratio:16/9;background:#111;overflow:hidden}
.hsg-vid-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hsg-vid-play{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center}
.hsg-vid-body{padding:14px 16px 16px}
.hsg-vid-body h3{margin:0 0 6px;font-size:15.5px;line-height:1.35;color:#14202E;font-weight:700}
.hsg-vid-body p{margin:0 0 10px;font-size:13.5px;color:#5C6670;line-height:1.5}
.hsg-vid-body .hsg-more{font-size:13.5px;color:#1E6BFF;font-weight:600}
@media(max-width:900px){.hsg-video-top{grid-template-columns:1fr}}


/* Force video cards layout */
.hsg-video-top{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:20px !important;margin-top:28px !important}
.hsg-vid-card{aspect-ratio:auto !important;display:flex !important;flex-direction:column !important;background:#fff !important;border-radius:16px !important;overflow:hidden !important;border:1px solid #e8e0d0 !important}
.hsg-vid-thumb{aspect-ratio:16/9 !important;position:relative !important}
.hsg-vid-thumb img{width:100% !important;height:100% !important;object-fit:cover !important}
.hsg-vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.hsg-vcard{aspect-ratio:16/10 !important;position:relative;border-radius:14px;overflow:hidden;display:block}
.hsg-vcard img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.hsg-video-top,.hsg-vgrid{grid-template-columns:1fr !important}}

/* Video 600 câu lý thuyết */
.hsg-theory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
.hsg-theory-card{position:relative;display:block;border-radius:16px;overflow:hidden;background:#f4f1e6;border:1px solid #e8e0d0;text-decoration:none;aspect-ratio:4/3}
.hsg-theory-card img{width:100%;height:100%;object-fit:cover;display:block}
.hsg-theory-title{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.7));color:#fff;font-size:13.5px;font-weight:700}
@media(max-width:900px){.hsg-theory-grid{grid-template-columns:1fr}}
