/* Hoarosa — giao diện website. Thiết kế cho điện thoại trước (đa số khách đặt hoa
   bằng điện thoại), màn lớn thì nới ra. */
/* Font tự phục vụ (17/10/2026): Be Vietnam Pro 400–700 + Playfair Display 600–700, chỉ bộ chữ vietnamese + latin.
   Trước đây tải từ fonts.googleapis.com (thêm 2 kết nối ra ngoài, chặn hiển thị). */
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 400;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-400-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 400;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-400-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 500;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-500-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 500;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-500-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 600;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-600-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 600;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-600-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 700;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-700-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Be Vietnam Pro';font-style: normal;font-weight: 700;font-display: swap;src: url(/_w/fonts/be-vietnam-pro-700-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {font-family: 'Playfair Display';font-style: normal;font-weight: 600;font-display: swap;src: url(/_w/fonts/playfair-display-600-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Playfair Display';font-style: normal;font-weight: 600;font-display: swap;src: url(/_w/fonts/playfair-display-600-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {font-family: 'Playfair Display';font-style: normal;font-weight: 700;font-display: swap;src: url(/_w/fonts/playfair-display-600-vietnamese.woff2) format('woff2');unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face {font-family: 'Playfair Display';font-style: normal;font-weight: 700;font-display: swap;src: url(/_w/fonts/playfair-display-600-latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  --tim:#6a467e; --tim-dam:#4e3160; --tim-nhat:#f4eef7; --tim-vua:#e7dcee;
  /* Tím logo Hoarosa — thanh trên cùng VÀ chân trang dùng màu này (sếp chọn 07/10/2026
     sau khi so #84579d, #6a467e, #76238f; tím đậm #4e3160 cũ trông tối quá) */
  --tim-sang:#76238f;
  --vang:#c9a35c; --hong:#d4677f;
  --chu:#2b2230; --chu-phu:#6f6676; --vien:#ece6ef; --nen:#fbf9fc; --trang:#fff;
  --bo:14px; --bo-nho:10px; --bong:0 6px 24px rgba(78,49,96,.08); --bong-dam:0 14px 40px rgba(78,49,96,.16);
  --chu-chinh:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --chu-tieu-de:'Playfair Display',Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--chu-chinh);font-size:15px;line-height:1.6;color:var(--chu);background:var(--nen)}
img{max-width:100%;height:auto;display:block}
a{color:var(--tim);text-decoration:none}
a:hover{color:var(--tim-dam)}
h1,h2,h3{line-height:1.25;margin:0 0 .5em}
h1,h2{font-family:var(--chu-tieu-de);font-weight:700;color:var(--tim-dam)}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--vang);outline-offset:2px}
.khung{width:100%;max-width:1240px;margin:0 auto;padding:0 16px}
.bo-qua{position:absolute;left:-999px;top:0;background:var(--tim);color:#fff;padding:8px 14px;z-index:99}
.bo-qua:focus{left:8px}
.an-dt{display:none}

/* ── Đầu trang ── */
/* Dải thông báo tăng giá dịp lễ — trên cùng mọi trang, vào link nào cũng thấy ngay (TANG_GIA) */
.thong-bao-le{background:#ffe066;color:#5a1a2e;font-weight:700;font-size:15px;line-height:1.45;text-align:center;padding:9px 0}
@media (max-width:639px){.thong-bao-le{font-size:13.5px;padding:8px 0}}
.thanh-tren{display:none;background:var(--tim-sang);color:#efe6f4;font-size:12.5px}
.thanh-tren .khung{display:flex;justify-content:space-between;gap:12px;padding-top:6px;padding-bottom:6px}
.thanh-tren a{color:#fff;font-weight:600}
.dau-trang{background:var(--trang);position:sticky;top:0;z-index:50;box-shadow:0 1px 0 var(--vien)}
.dau-trang-trong{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"menu logo goi" "tim tim tim";align-items:center;gap:10px 12px;padding-top:10px;padding-bottom:10px}
.logo{grid-area:logo;justify-self:center}
.logo img{height:46px;width:auto}
.nut-menu{grid-area:menu;width:40px;height:40px;border:0;background:var(--tim-nhat);border-radius:10px;display:grid;place-content:center;gap:5px;cursor:pointer}
.nut-menu span{display:block;width:18px;height:2px;background:var(--tim-dam);border-radius:2px}
.tim{grid-area:tim;display:flex;background:var(--nen);border:1px solid var(--vien);border-radius:999px;overflow:hidden}
.tim input{flex:1;min-width:0;border:0;background:transparent;padding:10px 16px;outline:0}
.tim button{border:0;background:var(--tim);color:#fff;padding:0 18px;cursor:pointer}
/* Ô Đặt hoa nhanh: biểu tượng điện thoại tròn + 2 dòng canh trái cùng một mép (15/10/2026) */
.goi-ngay{grid-area:goi;display:flex;align-items:center;gap:8px;justify-self:end;color:var(--chu-phu)}
.goi-icon{flex:none;width:34px;height:34px;border-radius:50%;background:var(--hong);color:#fff;display:grid;place-items:center}
.goi-icon svg{width:18px;height:18px}
.goi-chu{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
.goi-chu small{font-size:10.5px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--chu-phu)}
.goi-ngay b{color:var(--hong);font-size:15px;letter-spacing:.3px}
@media (max-width:639px){.goi-chu{display:none}}
.menu{background:var(--trang);border-top:1px solid var(--vien);display:none}
.menu.mo{display:block;max-height:calc(100vh - 120px);overflow:auto}
.menu ul{list-style:none;margin:0;padding:0}
.menu>.khung>ul>li>a{display:block;padding:12px 4px;font-weight:600;color:var(--chu);border-bottom:1px solid var(--vien)}
.menu li ul a{display:block;padding:8px 4px 8px 18px;color:var(--chu-phu);font-size:14px}
/* Điện thoại: mục con thu gọn, bấm mũi tên mới xổ (web.js) */
.menu li.co-con{position:relative}
.menu li.co-con>ul{display:none;padding:4px 0 8px;border-bottom:1px solid var(--vien)}
.menu li.co-con.mo>ul{display:block}
.mo-con{position:absolute;right:0;top:0;width:48px;height:46px;border:0;background:none;cursor:pointer;color:var(--tim-dam)}
.mo-con::before{content:"";display:block;width:9px;height:9px;margin:auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-3px) rotate(45deg);transition:transform .2s}
.menu li.co-con.mo>.mo-con::before{transform:translateY(2px) rotate(225deg)}
.menu li.co-con.mo>a{color:var(--tim-sang)}
/* Trang chủ: biểu tượng ngôi nhà + chữ; mục đang xem tô tím (15/10/2026) */
.menu>.khung>ul>li.muc-nha>a{display:flex;align-items:center;gap:6px}
.menu .muc-nha svg{flex:none;margin-top:-2px}
.menu>.khung>ul>li>a[aria-current="page"]{color:var(--tim-sang)}
/* Hai dòng chủ lực (kệ khai trương, kệ viếng): nền tím nhạt, chữ tím đậm */

/* ── Nút ── */
.nut{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;padding:10px 18px;font-weight:600;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s}
.nut:active{transform:scale(.97)}
.nut-chinh{background:var(--tim);color:#fff;box-shadow:0 6px 16px rgba(106,70,126,.28)}
.nut-chinh:hover{background:var(--tim-dam);color:#fff}
.nut-vien{background:var(--trang);color:var(--tim);border:1.5px solid var(--tim)}
.nut-to{width:100%;padding:14px 20px;font-size:16px}

/* ── Khối trang ── */
.muc{padding:28px 0}
.muc-tieu-de{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:16px}
.muc-tieu-de h2{font-size:24px;margin:0}
.muc-tieu-de a{font-weight:600;font-size:14px;white-space:nowrap}
.phan-cap ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;margin:14px 0;padding:0;font-size:13px;color:var(--chu-phu)}
.phan-cap li+li::before{content:"›";margin-right:4px;color:#b8aec0}

/* ── Banner trang chủ ── */
.banner{background:linear-gradient(120deg,var(--tim-sang),#8d3aa6 55%,#a95fc0);color:#fff;border-radius:0 0 28px 28px;overflow:hidden;position:relative}
.banner::after{content:"";position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(201,163,92,.35),transparent 70%)}
.banner .khung{padding-top:34px;padding-bottom:38px;position:relative;z-index:1}
.banner h1{color:#fff;font-size:30px;margin-bottom:20px}
.banner-le{background:linear-gradient(120deg,#a8285f,#d24b86 55%,#ee86b0)}
.banner-le .banner-nho{color:#fff;border-color:rgba(255,255,255,.55)}
.banner-le h1{margin-bottom:10px}
.banner-le p{color:#fff3f8}
.banner p{color:#efe6f4;max-width:560px;margin:0 0 20px}
/* Dòng nhỏ trên tiêu đề + dấu & màu vàng (15/10/2026) */
.banner-nho{display:inline-block;font-size:13px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:#f3dfae;border:1px solid rgba(243,223,174,.45);border-radius:999px;padding:4px 12px;margin-bottom:12px}
.banner h1 .va{color:#fff;font-weight:500}
.banner h1 .lien{white-space:nowrap}
.banner .nut-vien{border-color:#fff;color:#fff;background:transparent}
.banner-nut{display:flex;flex-wrap:wrap;gap:10px}
.cam-ket{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:-18px;position:relative;z-index:2}
.cam-ket>div{display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:var(--trang);border-radius:var(--bo);padding:12px;box-shadow:0 6px 22px rgba(90,30,110,.14);border:1px solid #f0e4f5;font-size:13px;color:var(--chu-phu);line-height:1.35}
.ck-icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--tim-sang),#d24b86);color:#fff}
/* Hai khối chủ lực trang chủ: kệ khai trương + kệ viếng (15/10/2026) */
/* Điện thoại: hai khối song song như máy tính (sếp yêu cầu 15/10/2026) — chữ rút gọn */
.khoi-chu-luc{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chi-may-tinh{display:none}
.khoi-cl{display:grid;grid-template-columns:1fr;background:var(--trang);border-radius:var(--bo);overflow:hidden;box-shadow:var(--bong);color:var(--chu);border:1px solid var(--vien);transition:box-shadow .2s,transform .2s}
.khoi-cl:hover{box-shadow:var(--bong-dam);transform:translateY(-2px)}
.khoi-cl-anh{background:#fff}
.khoi-cl-anh img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;display:block}
.khoi-cl-chu{padding:14px 18px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.khoi-cl-chu h2{margin:0 0 6px;font-size:24px;color:var(--tim-sang)}
.khoi-cl-chu .khoi-cl-gia{margin-bottom:0}
.khoi-cl-chu p{margin:0 0 10px;color:var(--chu-phu);font-size:14.5px;line-height:1.55}
.khoi-cl-gia{display:inline-block;background:var(--tim-nhat);color:var(--tim-dam);font-weight:700;border-radius:999px;padding:5px 14px;font-size:14px;margin-bottom:10px}
.khoi-cl-chu ul{margin:0 0 16px;padding-left:18px;font-size:14px;line-height:1.7}
.khoi-cl-chu .nut{flex:none}
@media (max-width:979px){
  .khoi-cl-anh img{aspect-ratio:3/4}
  .khoi-cl-chu{padding:10px 10px 12px;flex-direction:column;align-items:stretch;gap:8px}
  .khoi-cl-chu h2{font-size:16px;margin-bottom:5px}
  .khoi-cl-gia{font-size:12px;padding:3px 10px}
  .khoi-cl-chu .nut{font-size:13px;padding:8px 10px;width:100%}
}
.cam-ket b{display:block;color:var(--tim-dam);font-size:15px;font-weight:700;margin-bottom:3px}

/* ── Ô danh mục ── */
.o-dm{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.o-dm a{background:var(--trang);border-radius:var(--bo);overflow:hidden;box-shadow:var(--bong);color:var(--chu);text-align:center;font-weight:600;font-size:13px;transition:transform .2s,box-shadow .2s}
.o-dm a:hover{transform:translateY(-3px);box-shadow:var(--bong-dam)}
.o-dm img{aspect-ratio:1;object-fit:cover;width:100%}
.o-dm span{display:block;padding:8px 6px;line-height:1.3}

/* ── Lưới & thẻ sản phẩm ── */
.luoi{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.sp{background:var(--trang);border-radius:var(--bo);overflow:hidden;box-shadow:var(--bong);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.sp:hover{transform:translateY(-3px);box-shadow:var(--bong-dam)}
/* Hiện TRỌN ảnh, không cắt (sếp yêu cầu 15/10/2026): ảnh kệ hoa phần lớn khổ dọc dài,
   ép ô vuông + cover là mất băng rôn và mã số. Khung 3:4 + contain trên nền trắng —
   ảnh vuông hay ảnh dọc đều hiện đủ, phần thừa là nền trắng nên không lộ viền. */
.sp-anh{position:relative;display:block;aspect-ratio:3/4;background:#fff;overflow:hidden}
.sp-anh img{width:100%;height:100%;object-fit:contain;transition:transform .5s}
.sp:hover .sp-anh img{transform:scale(1.05)}
.nhan-giam{position:absolute;top:10px;left:10px;background:var(--hong);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px}
.sp-than{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.sp-ten{font-size:14px;font-weight:600;margin:0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em}
.sp-ten a{color:var(--chu)}
.sp-gia{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.sp-gia b{color:var(--hong);font-size:16px}
.sp-gia s{color:#a59cab;font-size:12.5px}
.lien-he{color:var(--tim)!important}
.sp-nut{margin-top:auto;display:flex;gap:6px}
.nut-dat{flex:1;min-width:0;white-space:nowrap;background:var(--tim-nhat);color:var(--tim-dam);padding:8px 12px;font-size:14px}
.nut-dat:hover{background:var(--tim);color:#fff}
.nut-zalo-sp{flex:1;min-width:0;white-space:nowrap;background:#0068ff;color:#fff;padding:8px 12px;font-size:14px}
.nut-zalo-sp:hover{background:#0052cc;color:#fff}
@media (max-width:600px){.sp-nut .nut{padding:8px 9px;font-size:13px}}

/* ── Trang danh mục ── */
.dm-dau{background:var(--trang);border-radius:var(--bo);padding:18px;box-shadow:var(--bong);margin-bottom:16px}
.dm-dau h1{font-size:26px;margin-bottom:6px}
.dm-dau .mo-ta{color:var(--chu-phu);font-size:14px}
.the-con{display:flex;gap:8px;overflow-x:auto;padding:4px 0 2px;scrollbar-width:none;margin-top:10px}
.the-con a{flex:none;border:1px solid var(--vien);background:var(--nen);border-radius:999px;padding:6px 14px;font-size:13.5px;color:var(--chu)}
.the-con a:hover,.the-con a.dang-chon{border-color:var(--tim);color:var(--tim);background:var(--tim-nhat)}
.thanh-loc{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 14px;font-size:14px;color:var(--chu-phu)}
.thanh-loc select{border:1px solid var(--vien);border-radius:999px;padding:7px 12px;background:var(--trang)}
/* Bộ lọc Giá · Màu · Số tầng (bo-loc.js): thanh nút thả xuống, cùng hàng số mẫu + sắp xếp */
.loc-bar{display:flex;gap:8px;align-items:center}
.loc-dd{position:relative}
.loc-dd>summary{list-style:none;display:inline-flex;align-items:center;gap:8px;border:1px solid #ddd3e3;background:var(--trang);border-radius:10px;padding:8px 14px;font-size:14px;font-weight:600;color:var(--chu);cursor:pointer;white-space:nowrap;user-select:none}
.loc-dd>summary::-webkit-details-marker{display:none}
.loc-dd>summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.loc-dd[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.loc-dd>summary:hover,.loc-dd[open]>summary{border-color:var(--tim-sang)}
.loc-dd>summary.co{background:var(--tim-nhat);border-color:var(--tim-sang);color:var(--tim-sang)}
.loc-ds{position:absolute;left:0;top:calc(100% + 6px);z-index:70;min-width:220px;background:#fff;border:1px solid var(--vien);border-radius:12px;box-shadow:var(--bong-dam);padding:6px}
.loc-ds-dau{display:none}
.loc-mon{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;font-size:14px;color:var(--chu);white-space:nowrap}
.loc-mon:hover{background:var(--tim-nhat);color:var(--tim-dam)}
.o-tich{flex:none;display:grid;place-items:center;width:18px;height:18px;border:1.5px solid #bdb3c4;border-radius:5px;background:#fff}
.loc-mon.on{font-weight:600;color:var(--tim-dam)}
.loc-mon.on .o-tich{background:var(--tim-sang);border-color:var(--tim-sang)}
.loc-mon.on .o-tich::after{content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.cham-mau{flex:none;width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.18)}
.loc-bo{display:block;margin-top:4px;padding:9px 10px 5px;border-top:1px solid var(--vien);font-size:13.5px;font-weight:600;color:var(--hong)}
.thanh-loc .dem-sp{margin-left:auto}
.loc-chon{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:-4px 0 14px}
.loc-chon::-webkit-scrollbar{display:none}
.loc-chon a{flex:none;display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 12px;font-size:13px;background:var(--tim-nhat);color:var(--tim-dam);white-space:nowrap}
.loc-chon a:hover{background:var(--tim-vua)}
.loc-chon a.xoa{background:none;color:var(--hong);font-weight:600}
.xem-them{border:0;background:none;color:var(--tim-sang);font-weight:600;font-size:14px;padding:2px 0;cursor:pointer}
.loc-dong{border:0;width:34px;height:34px;border-radius:50%;background:var(--tim-nhat);color:var(--tim-dam);font-size:15px;cursor:pointer}
body.khoa-cuon{overflow:hidden}
@media (min-width:980px){.xem-them{display:none!important}}
@media (max-width:979px){
  .thanh-loc{flex-wrap:wrap;row-gap:10px}
  .loc-bar{flex:1 1 100%;overflow-x:auto;scrollbar-width:none}
  .loc-bar::-webkit-scrollbar{display:none}
  .thanh-loc .dem-sp{margin-left:0;margin-right:auto}
  .loc-dd[open]>.loc-ds{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:95;min-width:0;border:0;border-radius:20px 20px 0 0;padding:14px 16px calc(16px + env(safe-area-inset-bottom));max-height:75vh;overflow:auto;box-shadow:0 0 0 100vmax rgba(43,20,48,.5);animation:loc-len .22s ease-out}
  @keyframes loc-len{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
  .loc-ds-dau{display:flex;justify-content:space-between;align-items:center;margin:0 0 6px;font-size:16px;color:var(--tim-dam)}
  .loc-mon{padding:12px 6px;font-size:15px}
  .chu-sx{display:none}
  .dm-dau .mo-ta.thu-gon{max-height:4.6em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 50%,transparent);mask-image:linear-gradient(#000 50%,transparent)}
}
.phan-trang{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin:26px 0 8px}
.phan-trang a,.phan-trang span{min-width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--trang);border:1px solid var(--vien);color:var(--chu);font-weight:600}
.phan-trang .hien-tai{background:var(--tim);border-color:var(--tim);color:#fff}
.phan-trang .ba-cham{border:0;background:none}

/* ── Trang sản phẩm ── */
.ctsp{display:grid;gap:20px;background:var(--trang);border-radius:var(--bo);padding:14px;box-shadow:var(--bong)}
/* Ảnh chính trang sản phẩm: hiện nguyên khổ ảnh gốc, cao tối đa 80% màn hình */
.thu-vien .anh-chinh{border-radius:var(--bo-nho);overflow:hidden;background:#fff;display:flex;justify-content:center}
.thu-vien .anh-chinh img{width:auto;max-width:100%;height:auto;max-height:75vh;object-fit:contain}
.anh-nho{display:flex;gap:8px;margin-top:8px;overflow-x:auto}
.anh-nho button{flex:none;width:68px;height:68px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;background:none}
.anh-nho button.dang-chon{border-color:var(--tim)}
.anh-nho img{width:100%;height:100%;object-fit:contain;background:#fff}
.ctsp h1{font-size:26px}
.ctsp-gia{display:flex;align-items:baseline;gap:10px;margin:6px 0 14px}
.ctsp-gia b{font-size:28px;color:var(--hong)}
.ctsp-gia s{color:#a59cab}
.ctsp-gia .nhan-giam{position:static}
/* Ghi chú giá chưa gồm VAT 8% (sếp yêu cầu 15/10/2026) */
.ctsp-gia{flex-wrap:wrap}
.ctsp-gia .vat{flex-basis:100%;font-size:13px;color:var(--chu-phu);font-style:italic;margin-top:-6px}
/* Ghi chú tăng giá dịp lễ (TANG_GIA trong giao-dien.js, tự ẩn ngoài mùa lễ) */
.ctsp-gia .tang-gia{flex-basis:100%;font-size:14px;font-weight:600;color:var(--hong);background:#fdf0f4;border-radius:8px;padding:7px 10px;margin-top:2px}
.thanh-loc .vat{font-size:inherit;color:var(--chu-phu);font-style:italic}
.diem-cong{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;font-size:14px}
.diem-cong li{display:flex;gap:8px;align-items:flex-start}
/* Bảng quyền lợi khách hàng: cột thứ ba cạnh chi tiết (≥1200px), dưới phần chi tiết ở màn nhỏ hơn */
.quyen-loi{background:var(--tim-nhat);border:1.5px solid var(--tim-vua);border-radius:var(--bo-nho);padding:16px 18px;align-self:start}
.quyen-loi h2{font-size:19px;margin:0 0 12px;color:var(--tim-sang)}
.quyen-loi ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:14.5px;color:#3d3345}
.quyen-loi li{display:flex;gap:10px;align-items:flex-start;line-height:1.4}
.quyen-loi li span{flex:none;width:30px;height:30px;border-radius:50%;background:var(--trang);display:grid;place-content:center;font-size:15px}
.nhom-nut{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}
/* Thông tin sản phẩm nằm trong cột giữa, dưới nút gọi/Zalo (sếp chốt 17/10/2026); Lưu ý ra ngoài thay chỗ */
.ctsp-mo-ta.noi-dung{background:none;box-shadow:none;border-radius:0;padding:0;margin-top:22px;font-size:15px}
.ctsp-mo-ta.noi-dung h2{font-size:19px;margin:0 0 8px}
.ctsp-mo-ta.noi-dung p{margin:0 0 10px}
.ctsp-luu-y{margin-top:18px}
.nhom-nut .nut{padding:13px 18px;font-size:15.5px}
.nut-zalo{background:#0068ff;color:#fff}
.nut-zalo:hover{background:#0052cc;color:#fff}
.noi-dung{background:var(--trang);border-radius:var(--bo);padding:18px;box-shadow:var(--bong);margin-top:18px}
.noi-dung h2{font-size:21px;margin-top:6px}
.noi-dung img{border-radius:var(--bo-nho);margin:12px auto}
.noi-dung table{width:100%;border-collapse:collapse;font-size:14px}
.noi-dung td,.noi-dung th{border:1px solid var(--vien);padding:8px}
.luu-y{background:var(--tim-nhat);border-left:4px solid var(--vang);border-radius:var(--bo-nho);padding:12px 14px;font-size:14px;color:#4b3f52;margin-top:14px}

/* ── Bài viết ── */
.ds-bai{display:grid;gap:14px}
.bai{display:grid;grid-template-columns:110px 1fr;gap:12px;background:var(--trang);border-radius:var(--bo);overflow:hidden;box-shadow:var(--bong)}
.bai img{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.bai div{padding:10px 12px 10px 0}
.bai h3{font-size:15px;margin:0 0 4px}
.bai h3 a{color:var(--chu)}
.bai p{margin:0;font-size:13px;color:var(--chu-phu);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bai-viet{max-width:820px;margin:0 auto}
.bai-viet h1{font-size:28px}
.bai-viet .ngay{color:var(--chu-phu);font-size:13px;margin-bottom:12px}
.bai-viet .noi-dung{font-size:16px;line-height:1.75}

/* ── Chân trang ── */
.chan-trang{background:var(--tim-sang);color:#f3ecf7;margin-top:40px;font-size:14px}
.chan-luoi{display:grid;gap:22px;padding-top:34px;padding-bottom:26px}
.chan-trang h4{color:#fff;font-size:15px;margin:0 0 10px}
.chan-trang ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.chan-trang a{color:#e3d7ea}
.chan-trang a:hover{color:#fff}
/* Số điện thoại ở chân trang: ống nghe xanh lá + nút Zalo cạnh từng số */
/* 3 số điện thoại xếp dọc, cột số rộng cố định + chữ số đều nhau → 3 nút Zalo thẳng hàng (sếp yêu cầu 08/10/2026) */
.dong-sdt{display:grid;grid-template-columns:9.4em auto;justify-content:start;align-items:center;gap:10px;font-variant-numeric:tabular-nums}
.dong-sdt>a:first-child{white-space:nowrap}
.dong-sdt svg,.dong-oa svg{width:16px;height:16px;color:#3ccf63;margin-right:7px;vertical-align:-3px}
.the-zalo{display:inline-block;background:#0068ff;color:#fff!important;font-size:11.5px;font-weight:700;line-height:1.6;padding:0 8px;border-radius:999px}
.the-zalo:hover{background:#0052cc}
.dong-oa .the-zalo{margin-right:8px}
/* Facebook, email: biểu tượng tròn có màu + chữ (sếp chốt 08/10/2026 — emoji ✉️ trên nền tím nhìn không rõ) */
.dong-fb{display:inline-flex;align-items:center;gap:8px}
.dong-fb svg{flex:none}
.logo-chan{filter:brightness(0) invert(1);opacity:.92;margin-bottom:10px;height:56px;width:auto}
/* Điện thoại: nút gọi/Zalo nổi sát lề hơn; chừa chỗ bên phải chân trang để
   nút nổi không đè lên dấu + (bấm nhầm là sang trang Zalo/gọi) — sếp báo 08/10/2026 */
@media (max-width:979px){
  .noi-lien-he{right:6px;bottom:10px;gap:8px}
  .noi-lien-he>a,.noi-lien-he .zalo-nhom>a{width:48px;height:48px}
  .ban-quyen .khung{padding-right:62px}
}
/* Chân trang trên điện thoại: liên hệ lên đầu, bỏ đoạn giới thiệu, hai mục link gập lại */
.chan-mo summary{list-style:none;cursor:pointer;display:flex;justify-content:flex-start;gap:10px;align-items:center}
.chan-mo summary::-webkit-details-marker{display:none}
.chan-mo summary h4{margin:0}
.chan-mo summary::after{content:'+';font-size:20px;line-height:1;color:#fff}
.chan-mo[open] summary::after{content:'−'}
.chan-mo[open] summary{margin-bottom:10px}
@media (max-width:979px){
  .chan-luoi{gap:0;padding-top:22px;padding-bottom:12px}
  .chan-luoi>div:first-child{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .chan-luoi .logo-chan{height:44px;margin:0}
  .chan-gt{display:none}
  .chan-lien-he{order:-1;margin-bottom:12px}
  .chan-luoi>div:first-child{order:-2}
  .chan-lien-he .lien-he-ds{grid-template-columns:1fr 1fr;gap:8px 12px}
  .chan-lien-he .dong-sdt{grid-column:1/-1}
  .chan-lien-he .gio{margin:10px 0 0}
  .chan-mo{border-top:1px solid rgba(255,255,255,.14);padding:12px 0}
  .chan-mo ul{grid-template-columns:1fr 1fr;gap:6px 12px}
}
@media (min-width:980px){.chan-mo summary{pointer-events:none;margin-bottom:10px}.chan-mo summary::after{display:none}}
.ban-quyen{border-top:1px solid rgba(255,255,255,.12);padding:12px 0;font-size:12.5px;color:#efe6f4}

/* ── Nút nổi gọi / Zalo ── */
.noi-lien-he{position:fixed;right:14px;bottom:16px;z-index:60;display:grid;gap:10px}
.noi-lien-he a{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;box-shadow:0 8px 22px rgba(0,0,0,.22);font-size:13px}
/* Nút gọi xanh lá như biểu tượng gọi điện trên điện thoại (sếp chốt 07/10/2026) */
.noi-goi{background:#22b14c;animation:rung 2.4s infinite}
.noi-goi svg{width:26px;height:26px}
.nut-goi{background:#22b14c;color:#fff}
.nut-goi:hover{background:#1a9a40;color:#fff}
.nut-goi svg{width:20px;height:20px}
.noi-zalo{background:#0068ff}
.noi-wa{background:#25d366}
.noi-wa svg{width:28px;height:28px}
.vong-wa{flex:none;width:28px;height:28px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center}
.vong-wa svg{width:17px;height:17px}
/* Menu Zalo bung ra từ nút nổi: OA + từng miền */
.zalo-nhom{position:relative}
.zalo-ds{position:absolute;right:0;bottom:64px;width:240px;background:#fff;border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.22);padding:8px;display:grid;gap:4px}
.zalo-ds[hidden]{display:none}
.noi-lien-he .zalo-ds a{width:auto;height:auto;border-radius:12px;box-shadow:none;color:var(--chu);display:flex;align-items:center;gap:10px;padding:8px 10px;font-weight:400;font-size:13px;place-items:initial}
.noi-lien-he .zalo-ds a:hover{background:#eef4ff}
.zalo-ma{flex:none;width:36px;height:36px;border-radius:50%;background:#0068ff;color:#fff;display:grid;place-items:center;font-weight:700;font-size:12.5px}
.zalo-ds b{display:block;font-size:14px;color:var(--chu)}
.zalo-ds small{color:var(--chu-phu);font-size:12.5px}
/* Danh sách hotline của nút gọi nổi: cùng khung với Zalo, màu xanh lá */
.goi-ds .zalo-ma{background:#22b14c}
.noi-lien-he .goi-ds a:hover{background:#eaf8ee}
@keyframes rung{0%,86%,100%{transform:rotate(0)}88%{transform:rotate(-14deg)}92%{transform:rotate(14deg)}96%{transform:rotate(-8deg)}}

/* ── Hộp đặt hàng ── */
.hop-dat{border:0;border-radius:18px;padding:0;width:min(560px,calc(100vw - 20px));max-height:calc(100vh - 30px);box-shadow:var(--bong-dam)}
.hop-dat::backdrop{background:rgba(43,34,48,.55);backdrop-filter:blur(2px)}
/* Popup dịp lễ (giao-dien.js POPUP_LE) */
.popup-le{border:0;padding:0;background:transparent;width:min(640px,calc(100vw - 28px));overflow:visible}
.popup-le::backdrop{background:rgba(43,20,48,.6);backdrop-filter:blur(2px)}
.popup-le[open]{animation:popup-vao .28s ease-out}
@keyframes popup-vao{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.popup-xem{display:block;position:relative;border-radius:18px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.popup-xem img{display:block;width:100%;height:auto;aspect-ratio:3/2;background:#fbe7ef}
.popup-xem .nut{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);white-space:nowrap;background:linear-gradient(135deg,#a8285f,#d24b86);color:#fff;padding:11px 26px;font-size:15.5px;box-shadow:0 8px 22px rgba(168,40,95,.45)}
.popup-xem:hover .nut{filter:brightness(1.08)}
.popup-dong{position:absolute;top:-12px;right:-12px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:var(--tim-dam);font-size:17px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25)}
@media (max-width:640px){.popup-dong{top:-14px;right:-6px}.popup-xem .nut{padding:9px 20px;font-size:14px;bottom:5%}}
.hop-dong{position:sticky;top:0;display:flex;justify-content:flex-end;padding:8px 8px 0;background:#fff;z-index:2}
.hop-dong button{border:0;background:var(--tim-nhat);width:34px;height:34px;border-radius:50%;cursor:pointer}
.form-dat,.dat-xong{padding:0 20px 20px}
/* Tiêu đề nằm ngang hàng nút ✕: phải nổi trên thanh đóng (nền trắng, sticky) — trước bị che mất (09/10/2026) */
.form-dat h2{font-size:22px;margin-top:-30px;position:relative;z-index:3;max-width:calc(100% - 44px)}
.dat-sp{display:flex;gap:12px;align-items:center;background:var(--tim-nhat);border-radius:var(--bo-nho);padding:10px;margin-bottom:14px}
.dat-sp img{width:58px;height:58px;border-radius:8px;object-fit:cover}
.dat-sp b{display:block;font-size:14px;line-height:1.35}
.dat-sp span{color:var(--hong);font-weight:700;font-size:14px}
.form-dat label{display:block;font-size:13px;font-weight:600;color:var(--chu-phu);margin-bottom:10px}
.form-dat input,.form-dat textarea{display:block;width:100%;margin-top:4px;border:1px solid var(--vien);border-radius:10px;padding:10px 12px;background:var(--nen);font-weight:400;color:var(--chu)}
.form-dat input:focus,.form-dat textarea:focus{border-color:var(--tim);background:#fff;outline:0;box-shadow:0 0 0 3px var(--tim-vua)}
.form-dat input:user-invalid{border-color:var(--hong)}
.o2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bay{position:absolute!important;left:-9999px!important;height:0;overflow:hidden}
.loi-form{color:#c0334f;font-size:14px;margin:4px 0 10px;min-height:1px}
.nho{font-size:12.5px;color:var(--chu-phu);text-align:center;margin:10px 0 0}
.dat-xong{text-align:center;padding-top:6px}
.dau-tich{width:64px;height:64px;border-radius:50%;background:#e8f6ee;color:#1f9d55;display:grid;place-items:center;font-size:32px;margin:0 auto 10px}

/* ── Ảnh khách nhận hoa (trang chủ, trang sản phẩm, album) ── */
.luoi-khach{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.luoi-khach .o-khach:nth-child(n+5){display:none}
.o-khach{display:block;border-radius:var(--bo);overflow:hidden;box-shadow:var(--bong);background:var(--tim-nhat)}
.o-khach img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;transition:transform .3s}
.o-khach:hover img{transform:scale(1.04)}
.album-khach{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}
.album-khach figure{margin:0}
.album-khach figure[hidden]{display:none}
.album-khach figcaption{font-size:12.5px;color:var(--chu-phu);line-height:1.4;padding:6px 2px 0}
.loc-khach button{flex:none;border:1px solid var(--vien);background:var(--nen);border-radius:999px;padding:6px 14px;font-size:13.5px;color:var(--chu);cursor:pointer;font:inherit}
.loc-khach button:hover,.loc-khach button.dang-chon{border-color:var(--tim);color:var(--tim);background:var(--tim-nhat)}
.xem-anh{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
.xem-anh[open]{display:grid;place-items:center}
.xem-anh::backdrop{background:rgba(20,14,24,.9)}
.xem-anh figure{margin:0;display:grid;justify-items:center;gap:10px;padding:16px}
.xem-anh img{max-width:min(92vw,720px);max-height:80vh;width:auto;height:auto;border-radius:12px}
.xem-anh figcaption{color:#f3ecf7;font-size:14px;text-align:center;max-width:600px}
.xem-anh button{position:fixed;border:0;border-radius:50%;width:44px;height:44px;background:rgba(255,255,255,.16);color:#fff;font-size:24px;cursor:pointer;line-height:1}
.xem-anh button:hover{background:rgba(255,255,255,.3)}
.xem-dong{top:14px;right:14px}
.xem-truoc{left:10px;top:50%}
.xem-sau{right:10px;top:50%}

/* ── Nội dung trụ cột danh mục + hỏi đáp ── */
.bai-dm{margin-top:28px}
.bai-dm h2{font-size:21px;margin:22px 0 8px}
.bai-dm h2:first-child{margin-top:0}
.bai-dm table{width:100%;border-collapse:collapse;margin:10px 0;font-size:14.5px}
.bai-dm th{background:var(--tim-nhat);text-align:left}
.tac-gia{font-size:13px;color:var(--chu-phu);margin:18px 0 0;border-top:1px dashed var(--vien);padding-top:10px}
.hoi-dap{margin-top:22px}
.hoi-dap h2{font-size:22px;margin:0 0 12px}
.hoi-dap details{background:var(--trang);border-radius:var(--bo-nho);box-shadow:var(--bong);margin-bottom:10px;padding:0 16px}
.hoi-dap summary{cursor:pointer;font-weight:600;padding:14px 0;list-style:none;position:relative;padding-right:26px}
.hoi-dap summary::-webkit-details-marker{display:none}
.hoi-dap summary::after{content:'+';position:absolute;right:0;top:11px;font-size:22px;color:var(--tim)}
.hoi-dap details[open] summary::after{content:'−'}
.hoi-dap details p{margin:0 0 14px;color:var(--chu-phu);line-height:1.65}
.ve-chung-toi .noi-dung{background:var(--trang);border-radius:var(--bo);box-shadow:var(--bong);padding:18px 20px}
.ve-chung-toi ul{margin:8px 0 0;padding-left:20px}
/* ── Hệ thống cửa hàng (kiểu trang mẫu sếp chọn 08/10/2026) ── */
.dau-ch{background:linear-gradient(135deg,var(--tim-sang),#a24fbd);color:#fff;padding:6px 0 30px;margin-bottom:22px}
.dau-ch .phan-cap a,.dau-ch .phan-cap li{color:#efe3f5}
.dau-ch h1{color:#fff;font-size:30px;margin:6px 0 8px}
.dau-ch p{margin:0;max-width:820px;color:#f6eefa;font-size:15.5px}
.dau-ch b{color:#fff}
.cong-cu-ch{margin-bottom:12px}
.loc-ch{display:block;width:100%;max-width:620px;border:1px solid var(--vien);border-radius:999px;padding:12px 18px;margin:0 0 14px;background:var(--trang);font:inherit;box-shadow:var(--bong)}
.loc-ch:focus{outline:0;border-color:var(--tim);box-shadow:0 0 0 3px var(--tim-vua)}
.the-tinh{flex-wrap:wrap;overflow:visible;margin-bottom:18px}
.the-tinh[hidden]{display:none}
.the-tinh a span{display:inline-block;background:var(--tim-nhat);color:var(--tim);border-radius:999px;padding:0 7px;font-size:12px;margin-left:4px}
.tinh-khoi{margin-bottom:26px;scroll-margin-top:16px}
.tinh-khoi[hidden]{display:none}
.tinh-khoi h2{display:flex;align-items:center;gap:8px;font-size:22px;margin:0 0 12px;padding-bottom:8px;border-bottom:2px solid var(--tim-nhat)}
.tinh-khoi h2 svg{color:var(--tim);flex:none}
.tinh-khoi h2 a{color:var(--chu)}
.tinh-khoi h2 a:hover{color:var(--tim)}
.tinh-dem{margin-left:auto;font-family:'Be Vietnam Pro',system-ui,sans-serif;font-size:13px;font-weight:600;color:var(--chu-phu);background:var(--tim-nhat);border-radius:999px;padding:3px 12px}
.ds-ch{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ds-ch li{background:var(--trang);border:1px solid var(--vien);border-radius:var(--bo-nho);padding:9px 10px 9px 14px;display:flex;align-items:center;gap:10px}
.ds-ch li:hover{border-color:var(--tim)}
.ds-ch li[hidden]{display:none}
.ch-dc{flex:1;min-width:0}
.ch-dc b{display:block;font-size:14.5px;font-weight:500}
.ch-dc small{display:block;color:var(--chu-phu);font-size:12.5px;margin-top:1px}
.ch-sao{color:#e0a100;font-weight:700;font-size:13px;white-space:nowrap}
.ch-sao small{color:var(--chu-phu);font-weight:400}
.ch-ghim{flex:none;width:36px;height:36px;border-radius:50%;background:var(--tim-nhat);color:var(--tim);display:grid;place-items:center}
.ch-ghim:hover{background:var(--tim);color:#fff}
.ch-ghim span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ch-ghim::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center/contain no-repeat}

/* ── Trang lỗi / rỗng ── */
.trong{text-align:center;padding:50px 16px;color:var(--chu-phu)}
.trong h1{font-size:30px}

/* ── Màn lớn ── */
@media (min-width:640px){
  .luoi{grid-template-columns:repeat(3,1fr);gap:16px}
  .o-dm{grid-template-columns:repeat(4,1fr)}
  .cam-ket{grid-template-columns:repeat(4,1fr)}
  .nhom-nut{grid-template-columns:1fr 1fr}
  .nhom-nut .nut-chinh{grid-column:1/-1}
  .bai{grid-template-columns:180px 1fr}
  .album-khach{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:980px){
  .khoi-chu-luc{gap:22px}
  .chi-may-tinh{display:inline}
  .chi-dien-thoai{display:none}
  body{font-size:15.5px}
  .an-dt{display:inline}
  .thanh-tren{display:block}
  .dau-trang-trong{grid-template-columns:auto 1fr auto;grid-template-areas:"logo tim goi";gap:24px;padding-top:12px;padding-bottom:12px}
  .logo{justify-self:start}
  .logo img{height:58px}
  .nut-menu{display:none}
  .tim{max-width:560px;width:100%;justify-self:center}
  .goi-ngay b{font-size:20px}
  .goi-icon{width:42px;height:42px}
  .goi-icon svg{width:20px;height:20px}
  .goi-chu small{font-size:11.5px}
  .menu{display:block;border-top:1px solid var(--vien)}
  .menu>.khung>ul{display:flex;flex-wrap:wrap;gap:2px}
  .menu>.khung>ul>li{position:relative}
  .menu>.khung>ul>li>a{border:0;padding:12px 12px;font-size:14px}
  .menu>.khung>ul>li>a:hover{color:var(--tim)}
  /* Gạch chân tím dưới mục đang xem, như thẻ đánh dấu */
  .menu>.khung>ul>li>a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--tim-sang)}
  .menu>.khung>ul{align-items:center}
  .menu li ul{display:none;position:absolute;left:0;top:100%;min-width:250px;background:#fff;box-shadow:var(--bong-dam);border-radius:0 0 12px 12px;padding:8px 0;z-index:60}
  .menu li:hover>ul,.menu li:focus-within>ul{display:block}
  .mo-con{display:none}
  .menu li.co-con>ul{border-bottom:0;padding:8px 0}
  .menu li ul a{padding:8px 18px}
  .menu li ul a:hover{background:var(--tim-nhat);color:var(--tim)}
  .luoi{grid-template-columns:repeat(4,1fr);gap:20px}
  .o-dm{grid-template-columns:repeat(6,1fr);gap:16px}
  .banner .khung{padding-top:64px;padding-bottom:76px}
  .banner h1{font-size:46px;max-width:900px}
  .banner p{font-size:17px}
  .cam-ket{margin-top:-32px;gap:16px}
  .cam-ket>div{flex-direction:row;align-items:center;padding:18px 20px;gap:14px}
  .ck-icon{width:48px;height:48px}
  .cam-ket b{font-size:16.5px}
  .cam-ket{font-size:14px}
  .muc{padding:40px 0}
  .muc-tieu-de h2{font-size:30px}
  .ctsp{grid-template-columns:1.05fr 1fr;gap:34px;padding:24px}
  .ctsp .quyen-loi{grid-column:2}
  .ctsp h1{font-size:32px}
  .chan-luoi{grid-template-columns:1.4fr 1fr 1fr 1.1fr}
  .dm-dau{padding:24px 28px}
  .dm-dau h1{font-size:32px}
  .ds-bai{grid-template-columns:1fr 1fr}
  .luoi-khach{grid-template-columns:repeat(4,1fr);gap:16px}
  .luoi-khach .o-khach:nth-child(n+5){display:block}
  .album-khach{grid-template-columns:repeat(4,1fr);gap:18px}
  .ds-ch{grid-template-columns:1fr 1fr}
}
@media (min-width:1200px){
  .ctsp.co-ql{grid-template-columns:1fr 1fr 280px;gap:28px}
  .ctsp .quyen-loi{grid-column:auto}
  .ctsp.co-ql .nhom-nut .nut{white-space:nowrap;padding:13px 12px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ── Hộp chọn khu vực khi bấm chat Zalo (16/10/2026) — dùng khung .hop-dat ── */
.hop-vung{width:min(420px,calc(100vw - 20px))}
.hop-vung-than{padding:0 20px 20px}
.hop-vung h2{font-size:20px;margin:-30px 0 6px;position:relative;z-index:3;max-width:calc(100% - 44px)}
.hop-vung p{margin:0 0 14px;color:var(--chu-phu);font-size:14px}
.hop-vung-ds{display:grid;gap:8px}
.hop-vung-ds a{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--vien);border-radius:14px;color:var(--chu)}
.hop-vung-ds a:hover,.hop-vung-ds a:focus-visible{border-color:#0068ff;background:#eef4ff}
.hop-vung-ds b{display:block;font-size:15.5px}
.hop-vung-ds small{color:var(--chu-phu);font-size:13px}