*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.72 "Be Vietnam Pro",system-ui,sans-serif;letter-spacing:-.01em;transition:background-color .3s ease,color .3s ease}
body,button,input,select,textarea{font-family:"Be Vietnam Pro",system-ui,sans-serif}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
h1,h2,h3,h4,p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
.container{width:min(calc(100% - 40px),1180px);margin-inline:auto}
.site-header{position:sticky;z-index:100;top:0;height:76px}
.nav-wrap,.nav-links,.header-actions{display:flex;align-items:center}
.nav-wrap{height:100%;justify-content:space-between;gap:24px}
.brand-logo{position:relative;display:block;width:240px;height:58px;overflow:hidden;flex:0 0 auto}
.brand-logo img{position:absolute;top:-38px;left:-24px;width:285px;max-width:none}
.nav-links{gap:19px}.nav-links a{position:relative;font-size:.87rem;font-weight:700}.nav-links a::after{content:"";position:absolute;right:0;bottom:-7px;left:0;height:2px;border-radius:2px;background:var(--primary);transform:scaleX(0);transition:transform .24s ease}.nav-links a:hover::after{transform:scaleX(1)}
.header-actions{gap:9px}
.icon-btn{display:grid;width:42px;height:42px;padding:0;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink)}
.icon-btn svg{width:19px;height:19px;stroke:currentColor}
.theme-btn svg{transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .25s ease}.theme-btn:hover svg{transform:rotate(18deg) scale(1.06)}
.theme-icon-moon{display:none}
[data-theme="dark"] .theme-icon-sun{display:none}
[data-theme="dark"] .theme-icon-moon{display:block}
.menu-btn{display:none}
.btn{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border:1px solid transparent;border-radius:999px;font-weight:800;transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease}
.btn-small{min-height:38px;padding:8px 14px;font-size:.85rem}
.btn-primary{background:var(--primary);color:#fff}
.btn-outline{border-color:var(--line);background:var(--surface);color:var(--ink)}
.tag{display:inline-flex;padding:4px 9px;border-radius:99px;background:var(--surface-soft);color:var(--primary);font-size:.7rem;font-weight:800}
.site-footer{padding:58px 0 18px}.footer-grid{display:grid;grid-template-columns:1.55fr repeat(3,1fr);gap:34px}.site-footer h4{margin-bottom:13px;color:#fff}.site-footer a,.site-footer p{display:block;margin:7px 0}.site-footer a:hover{color:#fff}.footer-logo{width:240px;height:70px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:20px;border-top:1px solid rgba(255,255,255,.13);font-size:.8rem}.developer-credit{margin-top:12px;color:rgba(255,255,255,.38);font-size:.66rem;letter-spacing:.08em;text-align:right}
.global-drop-overlay{position:fixed;z-index:200;inset:0;display:grid;place-items:center;background:rgba(5,18,38,.82);opacity:0;pointer-events:none;transition:opacity .2s ease;backdrop-filter:blur(8px)}
.global-drop-overlay.show{opacity:1;pointer-events:auto}.global-drop-panel{display:grid;width:min(calc(100% - 36px),520px);min-height:240px;padding:32px;place-items:center;border:1px dashed rgba(140,196,255,.7);border-radius:28px;background:rgba(11,43,80,.84);color:#fff;text-align:center}.drop-orb{display:grid;width:66px;height:66px;place-items:center;border-radius:50%;background:rgba(255,255,255,.1);font-size:2rem}.global-drop-panel span{color:rgba(255,255,255,.75)}
.toast-wrap{position:fixed;z-index:250;right:18px;bottom:18px;display:grid;gap:8px}.toast{padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.floating-contact{position:fixed;z-index:120;right:18px;bottom:18px;display:grid;gap:9px}.contact-fab{position:relative;display:grid;width:56px;height:56px;place-items:center;border:1px solid rgba(255,255,255,.3);border-radius:18px;color:#fff;box-shadow:0 15px 34px rgba(10,45,78,.25);transition:transform .25s ease,box-shadow .25s ease}.contact-fab svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.contact-tooltip{position:absolute;right:calc(100% + 10px);padding:7px 11px;border-radius:9px;background:#0a294b;color:#fff;font-size:.75rem;font-weight:800;white-space:nowrap;opacity:0;transform:translateX(6px);pointer-events:none;transition:.2s}.contact-fab:hover{transform:translateY(-3px);box-shadow:0 19px 40px rgba(10,45,78,.33)}.contact-fab:hover .contact-tooltip{opacity:1;transform:none}.zalo-mark{display:grid;width:39px;height:30px;place-items:center;border-radius:10px 10px 10px 3px;background:#fff;color:#0878e8;font-size:.78rem;font-weight:800;letter-spacing:-.05em}.float-zalo{background:linear-gradient(145deg,#1597ff,#0768dd)}.float-phone{background:linear-gradient(135deg,#1ba486,#117661)}
[data-theme="dark"] .site-header.glass-header:not(.is-scrolled){background:rgba(7,24,44,.84);border-color:rgba(124,157,183,.18)}
[data-theme="dark"] .site-header.glass-header.is-scrolled{background:rgba(7,24,44,.95);border-color:rgba(124,157,183,.25)}
[data-theme="dark"] .site-header .nav-links a{color:#c8d8e7}
[data-theme="dark"] .site-header .nav-links a:hover{color:#76b6ff}
@media(max-width:980px){.nav-links{position:absolute;top:calc(100% + 8px);right:20px;display:none;width:min(320px,calc(100vw - 40px));padding:15px;align-items:stretch;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow);flex-direction:column}.nav-links.open{display:flex}.nav-links a{padding:9px 10px}.menu-btn{display:grid}.brand-logo{width:205px}.header-actions>.btn{display:none}}
@media(max-width:620px){.container{width:min(calc(100% - 28px),1180px)}.site-header{height:68px}.brand-logo{width:176px;height:52px}.brand-logo img{top:-27px;left:-17px;width:220px}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column}.icon-btn{width:40px;height:40px}.floating-contact{right:11px;bottom:11px}.contact-fab{width:49px;height:49px;border-radius:15px}.contact-tooltip{display:none}.zalo-mark{width:35px;height:27px;font-size:.7rem}}
