/* Bộ nhận diện Nếp Work cho WEB — sinh tự động từ nhan-dien.json (đừng sửa tay, sửa JSON rồi ghép lại).
   Mọi trang web, trang bán hàng, trang đăng ký của công ty dùng các biến này; không tự chọn màu, cỡ chữ, khoảng cách khác. */
:root {
  --mau-chinh: #0F2F9E;
  --mau-nhan: #F26A2E;
  --mau-nen: #F3F6FD;
  --mau-nen-toi: #0D1733;
  --mau-chu: #0D1733;
  --mau-chu-nhat: #F3F6FD;
  --mau-phu-1: #2354E0;
  --chinh-100: #E2E6F3;
  --chinh-200: #BCC5E4;
  --chinh-300: #8C9BD0;
  --chinh-400: #5269B9;
  --chinh-500: #0F2F9E;
  --chinh-600: #0D2888;
  --chinh-700: #0B2272;
  --chinh-800: #091B5C;
  --chinh-900: #071546;
  --nhan-100: #FDEDE6;
  --nhan-200: #FBD5C4;
  --nhan-300: #F9B79B;
  --nhan-400: #F69469;
  --nhan-500: #F26A2E;
  --nhan-600: #D05B28;
  --nhan-700: #AE4C21;
  --nhan-800: #8C3D1B;
  --nhan-900: #6A2F14;
  --chu-chinh-tren-nen: #0F2F9E;
  --chu-nhan-tren-nen: #AE4C21;
  --nut-chinh-nen: #0F2F9E;
  --nut-chinh-chu: #F3F6FD;
  --nut-chinh-ro: #0D2888;
  --nut-chinh-chu-ro: #F3F6FD;
  --nut-chinh-nhan: #0B2272;
  --nut-chinh-chu-nhan: #F3F6FD;
  --nut-chinh-tat: #B3BEE2;
  --nut-chinh-chu-tat: #3F4968;
  --nut-nhan-nen: #F26A2E;
  --nut-nhan-chu: #0D1733;
  --nut-nhan-ro: #F69469;
  --nut-nhan-chu-ro: #0D1733;
  --nut-nhan-nhan: #F9B79B;
  --nut-nhan-chu-nhan: #0D1733;
  --nut-nhan-tat: #F3CFC3;
  --nut-nhan-chu-tat: #5E5765;
  --nut-phu-vien: #0F2F9E;
  --nut-phu-chu: #0F2F9E;
  --nut-phu-ro: #E2E6F3;
  --nut-phu-chu-ro: #0F2F9E;
  --nut-phu-nhan: #BCC5E4;
  --nut-phu-chu-nhan: #0F2F9E;
  --nut-phu-vien-tat: #8C9CD2;
  --nut-phu-chu-tat: #697084;
  --phong-tieu-de: 'Be Vietnam Pro', Georgia, serif;
  --phong-than: 'Be Vietnam Pro', system-ui, sans-serif;
  --phong-nhan: 'Be Vietnam Pro', system-ui, sans-serif;
  --co-chu-1: clamp(36px,5vw,56px);
  --co-chu-2: clamp(28px,3.6vw,40px);
  --co-chu-3: 28px;
  --co-chu-4: 20px;
  --co-chu-5: 18px;
  --co-chu-6: 16px;
  --co-chu-7: 13px;
  --co-chu-8: 13px;
  --khoang-1: 4px;
  --khoang-2: 8px;
  --khoang-3: 12px;
  --khoang-4: 16px;
  --khoang-5: 24px;
  --khoang-6: 32px;
  --khoang-7: 48px;
  --khoang-8: 64px;
  --khoang-9: 96px;
  --bo-nut: 999px;
  --bo-the: 6px;
  --bo-o-nhap: 6px;
  --bo-anh: 5px;
  --bong-nho: 0 1px 2px #0D17331F;
  --bong-vua: 0 6px 16px #0D17331F;
  --bong-lon: 0 18px 40px #0D173329;
}
body { margin: 0; background: var(--mau-nen); color: var(--mau-chu); font: 400 16px/1.6 var(--phong-than); }
h1, h2 { font-family: var(--phong-tieu-de); line-height: 1.15; }
a { color: var(--chu-chinh-tren-nen); }
.nut { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; border-radius: var(--bo-nut); font: 700 16px var(--phong-nhan); border: 2px solid transparent; cursor: pointer; transition: background .15s, border-color .15s; }
.nut-chinh { background: var(--nut-chinh-nen); color: var(--nut-chinh-chu); }
.nut-chinh:hover { background: var(--nut-chinh-ro); color: var(--nut-chinh-chu-ro); } .nut-chinh:active { background: var(--nut-chinh-nhan); color: var(--nut-chinh-chu-nhan); }
.nut-noi-bat { background: var(--nut-nhan-nen); color: var(--nut-nhan-chu); }
.nut-noi-bat:hover { background: var(--nut-nhan-ro); color: var(--nut-nhan-chu-ro); } .nut-noi-bat:active { background: var(--nut-nhan-nhan); color: var(--nut-nhan-chu-nhan); }
.nut-noi-bat:disabled { background: var(--nut-nhan-tat); color: var(--nut-nhan-chu-tat); cursor: not-allowed; }
.nut-chinh:disabled { background: var(--nut-chinh-tat); color: var(--nut-chinh-chu-tat); cursor: not-allowed; }
.nut-phu { background: transparent; color: var(--nut-phu-chu); border-color: var(--nut-phu-vien); }
.nut-phu:hover { background: var(--nut-phu-ro); color: var(--nut-phu-chu-ro); } .nut-phu:active { background: var(--nut-phu-nhan); color: var(--nut-phu-chu-nhan); }
.nut-phu:disabled { background: transparent; color: var(--nut-phu-chu-tat); border-color: var(--nut-phu-vien-tat); cursor: not-allowed; }
.nut:focus-visible { outline: 3px solid var(--mau-nhan); outline-offset: 2px; }
.the { background: #fff; border-radius: var(--bo-the); box-shadow: var(--bong-vua); padding: 24px; }
input, textarea, select { font: 400 16px var(--phong-than); border: 1.5px solid var(--chinh-200); border-radius: var(--bo-o-nhap); padding: 10px 14px; min-height: 44px; }
input:focus, textarea:focus { outline: none; border-color: var(--mau-chinh); box-shadow: 0 0 0 3px var(--chinh-100); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }