html{scroll-behavior:smooth}
.m4-home{--p:#1f4ed8;--pd:#0c2a73;--a:#f59e0b;--muted:#5b6577;font-family:'Inter',-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#0f1729;background:#fff;line-height:1.7;overflow-x:hidden}
.m4-home,.m4-home *{box-sizing:border-box}
.m4-home h1,.m4-home h2,.m4-home h3,.m4-home h4,.m4-home p,.m4-home ul{margin:0;padding:0}
.m4-home img{display:block;max-width:100%}
.m4-home section[id]{scroll-margin-top:80px}
.m4-home .btn{display:inline-block;padding:13px 24px;border-radius:40px;font-weight:700;text-decoration:none;transition:.2s}
.m4-home .btn-a{background:var(--a);color:#1a1300;box-shadow:0 8px 22px rgba(245,158,11,.35)}
.m4-home .btn-a:hover{transform:translateY(-2px)}
.m4-home .btn-ghost{border:1.5px solid rgba(255,255,255,.7);color:#fff}
/* NAV */
.m4-home nav{position:fixed;top:0;left:0;right:0;z-index:120;transition:.3s}
.m4-home nav.scrolled{background:rgba(8,18,48,.92);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(8px)}
.m4-home nav .w{max-width:1180px;margin:0 auto;padding:0 22px;display:flex;align-items:center;justify-content:space-between;height:66px}
.m4-home .logo{color:#fff;font-weight:800;font-size:19px;letter-spacing:.5px;text-decoration:none}
.m4-home .logo span{color:var(--a)}
.m4-home .nav-links{display:flex;gap:22px}
.m4-home .nav-links a{color:#dbe3f2;text-decoration:none;font-size:14px;font-weight:600}
.m4-home .nav-links a:hover{color:#fff}
.m4-home .nav-cta{background:var(--a);color:#1a1300;padding:8px 16px;border-radius:30px;font-weight:700;font-size:13.5px;text-decoration:none;white-space:nowrap}
@media(max-width:820px){.m4-home .nav-links{display:none}}
/* HERO HUB */
.m4-home .hero{position:relative;height:100svh;min-height:560px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background:radial-gradient(1000px 560px at 50% 30%,#1a3c8f,#0a1838 70%)}
.m4-home .hero .bg{position:absolute;inset:0;background:url('https://man4owo.com/wp-content/uploads/2026/03/imageprojector-event-space-grand-opening-005220.webp') center/cover;opacity:.16;animation:m4zoomin 8s ease forwards}
@keyframes m4zoomin{from{transform:scale(1.12)}to{transform:scale(1)}}
.m4-home .hero-center{position:relative;z-index:5;max-width:640px;padding:0 24px}
.m4-home .eyebrow{display:inline-block;background:rgba(245,158,11,.16);color:#ffd98a;padding:7px 16px;border-radius:30px;font-size:12.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;animation:m4pop .6s .2s both}
.m4-home .hero h1{font-size:clamp(30px,4.6vw,52px);line-height:1.12;font-weight:800;margin:16px 0 12px;color:#fff;animation:m4pop .7s .35s both}
.m4-home .hero h1 em{color:var(--a);font-style:normal}
.m4-home .hero .lead{font-size:clamp(15px,1.7vw,18px);color:#c7d2e8;margin:0 auto 14px;max-width:46ch;animation:m4pop .7s .5s both}
.m4-home .hint{font-size:12.5px;color:#90a2c4;animation:m4pop .7s .8s both;margin:0}
@keyframes m4pop{from{opacity:0;transform:translateY(18px) scale(.95)}to{opacity:1;transform:none}}
/* dashed connector lines */
.m4-home .links{position:absolute;inset:0;z-index:3;pointer-events:none}
.m4-home .links line{stroke:rgba(255,255,255,.28);stroke-width:.18;stroke-dasharray:1.4 1.4;stroke-dashoffset:60;animation:m4draw 1.2s .6s ease forwards}
@keyframes m4draw{to{stroke-dashoffset:0}}
/* NODE = clickable table of contents */
.m4-home .node{position:absolute;z-index:6;display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;opacity:0;transform:scale(0);cursor:pointer}
.m4-home .node.go{animation:m4nodepop .6s both,m4float 6s ease-in-out infinite}
.m4-home .node .ring{width:78px;height:78px;border-radius:50%;overflow:hidden;border:3px solid #fff;box-shadow:0 12px 30px rgba(0,0,0,.4);transition:transform .25s}
.m4-home .node .ring img{width:100%;height:100%;object-fit:cover}
.m4-home .node .lbl{background:#fff;color:#0f1729;font-weight:700;font-size:12.5px;padding:4px 12px;border-radius:20px;box-shadow:0 4px 12px rgba(0,0,0,.2);white-space:nowrap}
.m4-home .node:hover .ring{transform:scale(1.12)}
.m4-home .node:hover .lbl{background:var(--a)}
@keyframes m4nodepop{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}
@keyframes m4float{0%,100%{translate:0 0}50%{translate:0 -12px}}
.m4-home .n1{top:20%;left:9%}.m4-home .n2{top:60%;left:15%}.m4-home .n3{top:19%;right:10%}.m4-home .n4{top:61%;right:11%}
.m4-home .nodes-mobile{display:none;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:28px;position:relative;z-index:6}
@media(max-width:860px){
.m4-home .hero{height:auto;min-height:0;padding:120px 0 44px}
.m4-home .hero>.node,.m4-home .links{display:none}
.m4-home .nodes-mobile{display:flex}
.m4-home .nodes-mobile .node{position:static;opacity:1;transform:scale(1);animation:m4float 6s ease-in-out infinite}
.m4-home .nodes-mobile .node .ring{width:66px;height:66px}
}
/* SERVICE SECTIONS */
.m4-home .block{padding:80px 0;background:#fff}
.m4-home .w2{max-width:1120px;margin:0 auto;padding:0 22px}
.m4-home .svc{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.m4-home .block.alt .svc .media{order:2}
.m4-home .media{border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(12,42,115,.16);aspect-ratio:4/3}
.m4-home .media img{width:100%;height:100%;object-fit:cover;transition:.6s}
.m4-home .svc:hover .media img{transform:scale(1.05)}
.m4-home .svc .num{font-size:13px;font-weight:800;color:var(--a);letter-spacing:1px}
.m4-home .svc h2{font-size:27px;font-weight:800;margin:6px 0 12px;color:#0f1729;line-height:1.3}
.m4-home .svc p{color:var(--muted);margin-bottom:14px}
.m4-home .svc ul{list-style:none;margin-bottom:18px}
.m4-home .svc li{padding-left:24px;position:relative;margin:6px 0}
.m4-home .svc li::before{content:"\2713";position:absolute;left:0;color:#1d9e75;font-weight:800}
.m4-home .svc .acts{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.m4-home .svc .price{display:inline-block;background:#eef3ff;color:var(--pd);font-weight:700;padding:6px 14px;border-radius:8px;font-size:14px}
.m4-home .svc .more{color:var(--p);font-weight:700;font-size:14.5px;text-decoration:none}
.m4-home .svc .more:hover{text-decoration:underline}
.m4-home .block.alt{background:#f6f8fc}
@media(max-width:820px){.m4-home .svc{grid-template-columns:1fr;gap:20px}.m4-home .block.alt .svc .media{order:0}.m4-home .block{padding:56px 0}}
/* WHY */
.m4-home .why{background:linear-gradient(160deg,#0a1838,#10204f);color:#fff}
.m4-home .head{text-align:center;max-width:680px;margin:0 auto 44px}
.m4-home .head .k{color:var(--p);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:13px}
.m4-home .head.lt .k{color:#ffd98a}
.m4-home .head h2{font-size:clamp(24px,3vw,36px);font-weight:800;margin-top:8px;color:#0f1729}
.m4-home .head.lt h2{color:#fff}
.m4-home .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.m4-home .c{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:24px 20px}
.m4-home .c i{font-size:24px;font-style:normal}
.m4-home .c h3{font-size:17px;margin:10px 0 6px;color:#fff;font-weight:700}
.m4-home .c p{color:#aebbd6;font-size:14px}
@media(max-width:820px){.m4-home .cards{grid-template-columns:1fr 1fr}}
/* STEPS */
.m4-home .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.m4-home .step{text-align:center}
.m4-home .step .n{width:52px;height:52px;border-radius:50%;background:var(--p);color:#fff;font-weight:800;font-size:19px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.m4-home .step h3{font-size:16px;margin-bottom:4px;color:#0f1729;font-weight:700}
.m4-home .step p{color:var(--muted);font-size:13.5px}
@media(max-width:680px){.m4-home .steps{grid-template-columns:1fr 1fr}}
/* CTA */
.m4-home .ctaband{padding:78px 0;background:linear-gradient(135deg,#0c2a73,#1f4ed8 60%,#f59e0b 200%);color:#fff;text-align:center}
.m4-home .ctaband h2{font-size:clamp(24px,3.4vw,38px);font-weight:800;margin-bottom:10px;color:#fff}
.m4-home .ctaband p{color:#dce5ff;margin-bottom:22px;font-size:17px}
.m4-home .ctaband .ph{font-size:22px;font-weight:800;margin-bottom:16px}
.m4-home .ctaband .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
/* FOOTER */
.m4-home footer.f{background:#070f24;color:#9fb0cf;padding:40px 0 28px;font-size:14px}
.m4-home footer.f .w2{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
.m4-home footer.f b{color:#fff}
.m4-home footer.f .col{max-width:280px}
.m4-home footer.f a{color:#9fb0cf;text-decoration:none;display:block;margin:5px 0}
.m4-home footer.f a:hover{color:#fff}
.m4-home footer.f .copy{border-top:1px solid rgba(255,255,255,.08);margin-top:24px;padding-top:18px;text-align:center;font-size:13px}
/* REVEAL */
.m4-home .reveal{opacity:0;transform:translateY(40px);transition:.8s}
.m4-home .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
.m4-home *,.m4-home *::before,.m4-home *::after{animation:none!important;transition:none!important}
.m4-home .node,.m4-home .reveal{opacity:1;transform:none}
}
/* v7: tang noi bat chu trong grid dich vu + hero */
.m4-home .svc h2{font-size:clamp(26px,2.8vw,34px);line-height:1.22}
.m4-home .svc h2::after{content:"";display:block;width:54px;height:4px;border-radius:2px;background:var(--a);margin-top:12px}
.m4-home .svc p{color:#3d4860;font-size:16.5px}
.m4-home .svc li{color:#222b40;font-weight:500;font-size:15.5px}
.m4-home .svc .num{font-size:13.5px;letter-spacing:2px}
.m4-home .svc .price{background:var(--pd);color:#fff;font-size:15px;padding:9px 18px;border-radius:10px;box-shadow:0 6px 16px rgba(12,42,115,.25)}
.m4-home .svc .more{font-size:15px}
.m4-home .hero h1{text-shadow:0 4px 24px rgba(0,0,0,.45)}
.m4-home .hero .lead{color:#dde6f7;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.m4-home .why .c h3{font-size:18px}
/* v8: pro polish - ep font heading, overlay toi cho hero, full-bleed */
.m4-home h1,.m4-home h2,.m4-home h3,.m4-home h4,.m4-home .logo,.m4-home .btn{font-family:'Inter',-apple-system,'Segoe UI',Roboto,Arial,sans-serif!important}
.home .site-content .ast-container{max-width:100%;padding:0;margin:0}
.home #content{margin:0;padding:0}
.home .site,.home .site-content{background:#fff}
.m4-home .hero{background:#0a1838}
.m4-home .hero .bg{opacity:1;animation:m4zoomin 10s ease forwards}
.m4-home .hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,15,36,.88) 0%,rgba(10,26,60,.76) 45%,rgba(7,15,36,.94) 100%)}
.m4-home .hero h1{letter-spacing:-.5px;font-weight:800}
.m4-home .hero .lead{color:#dce6f8}
.m4-home .hint{color:#aebbd6}
.m4-home .links line{stroke:rgba(255,255,255,.18)}
.m4-home nav{background:linear-gradient(180deg,rgba(7,15,36,.7),rgba(7,15,36,0))}
.m4-home nav.scrolled{background:rgba(8,18,48,.94);backdrop-filter:blur(8px)}
.m4-home .eyebrow{backdrop-filter:blur(4px)}
.m4-home .node .ring{border-color:rgba(255,255,255,.92);box-shadow:0 12px 32px rgba(0,0,0,.55)}
.m4-home .node .lbl{font-size:13px;padding:5px 14px}