/* [db8dd01c] Nút liên hệ nổi — dùng chung trang chủ + trang riêng (thu-vien.html, tin-tuc.html). Chỗ riêng trang chủ (dock, form 07) vẫn trong index.html */
/* [db8dd01c] Nút liên hệ nổi — Ken chốt 2 kiểu chọn trong dock (Toàn trang › Nút liên hệ, ?fab=1|2, mặc định 2; mockup design/mockups/ui/fab1.jpg, fab2.jpg).
   2 hotline: Hotline 1 Hà Nội 0329 667 663 · Hotline 2 Phú Yên 0328 665 663. PC: góc dưới phải. Điện thoại: đo 27/10 không có dải đáy/đỉnh nào trống ở mọi chương
   (tmp/fab_free_zone.py) → nút nằm TRONG cột dock mép phải (hero.js chuyển .fabs vào .dock__rail), chỉ hiện «Hotline 1/2», không thêm lớp phủ lên nội dung */
.fabs { position: fixed; right: 14px; bottom: 22px; z-index: 41; color: #F8E7CE; font: 500 12px/1.2 "Be Vietnam Pro", system-ui, sans-serif; }
.fabs a { color: inherit; text-decoration: none; }
.fabs svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fabs .fb svg { fill: currentColor; stroke: none; }
.fabs b { display: block; font: 600 10px/1 "Be Vietnam Pro", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #E9C27C; }
.fabs b em { font-style: normal; }
.fabs strong { display: block; margin-top: 4px; font: 600 17px/1 "Be Vietnam Pro", sans-serif; letter-spacing: .01em; color: #FFF6E6; }
:root[data-fab="1"] .fab2, :root:not([data-fab="1"]) .fab1 { display: none; }
/* kiểu 1 «Viên thuốc đồng»: 1 viên kính navy viền vàng ánh kim — vòng gọi · Hotline 1 · Hotline 2 | Facebook */
.fab1 { display: flex; align-items: center; gap: 4px; height: 58px; padding: 0 8px 0 9px; box-sizing: border-box; border: 1.5px solid transparent; border-radius: 99px;
  background: linear-gradient(160deg, rgba(10, 30, 56, .9), rgba(3, 14, 30, .94)) padding-box, linear-gradient(120deg, #F7E3B0, #C9A05A 45%, #F2D59A) border-box; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .4), 0 0 18px rgba(233, 190, 110, .18); }
.fab1__ico { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: #F2D59A; box-shadow: inset 0 0 0 1.5px rgba(236, 200, 130, .85); }
.fab1__ico svg { width: 20px; height: 20px; }
.fab1 a { position: relative; padding: 8px 12px; border-radius: 99px; transition: background .25s; } .fab1 a:hover { background: rgba(233, 184, 102, .14); }
.fab1 a + a::before { content: ""; position: absolute; left: -2px; top: 12px; bottom: 12px; border-left: 1px solid rgba(233, 196, 130, .45); }
.fab1 .fb { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; margin-left: 6px; } .fab1 .fb::before { left: -5px; }
.fab1 .fb svg { width: 22px; height: 22px; }
/* kiểu 2 «Một nút bung»: 1 nút vàng tai nghe (vòng sáng nhấp 4 nhịp rồi đứng yên) → bung 3 viên kính: Hotline 1 · Hotline 2 · Facebook */
.fab2 { position: relative; }
.fab2 > summary { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; cursor: pointer; list-style: none; color: #2A2214; background: radial-gradient(circle at 35% 30%, #FDEFC6, #EDC77F 55%, #C9974A);
  box-shadow: 0 0 0 4px rgba(10, 30, 56, .55), 0 0 0 5.5px rgba(236, 200, 130, .75), 0 12px 30px rgba(0, 0, 0, .4);
  animation: fab-ring 2.6s ease-out 1.5s 4; /* hữu hạn: vô hạn trên nút cố định = trang không bao giờ đứng yên */ }
.fab2 > summary::-webkit-details-marker { display: none; }
.fab2 > summary svg { width: 30px; height: 30px; stroke-width: 1.6; transition: rotate .35s; }
.fab2[open] > summary { animation: none; } .fab2[open] > summary svg { rotate: -12deg; }
@keyframes fab-ring { 70% { box-shadow: 0 0 0 4px rgba(10, 30, 56, .55), 0 0 0 18px rgba(236, 200, 130, 0), 0 12px 30px rgba(0, 0, 0, .4); } }
.fab__menu { position: absolute; right: 0; bottom: calc(100% + 14px); display: grid; justify-items: end; gap: 10px; white-space: nowrap; }
.fab__menu a { display: flex; align-items: center; gap: 12px; padding: 7px 18px 7px 7px; border: 1.2px solid transparent; border-radius: 99px;
  background: linear-gradient(160deg, rgba(10, 30, 56, .9), rgba(3, 14, 30, .94)) padding-box, linear-gradient(120deg, #F7E3B0, #C9A05A 45%, #F2D59A) border-box; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .38); transition: translate .25s; animation: fab-in .4s cubic-bezier(.22, 1, .36, 1) backwards; }
.fab__menu a:nth-child(2) { animation-delay: 50ms; } .fab__menu a:nth-child(1) { animation-delay: 100ms; } /* bung từ dưới lên */
.fab__menu a:hover { translate: -3px 0; }
.fab__menu i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #2A2214; background: radial-gradient(circle at 35% 30%, #FDEFC6, #EDC77F 55%, #C9974A); }
.fab__menu i svg { width: 18px; height: 18px; }
.fab__menu .fb b { font: 600 15px/1 "Be Vietnam Pro", sans-serif; letter-spacing: 0; text-transform: none; color: #FFF6E6; }
@keyframes fab-in { from { opacity: 0; translate: 0 10px; scale: .92; } }