:root{
--bg:#ffffff;--panel:#ffffff;--paper:#ffffff;--card:#ffffff;
--bg-alt:#fdf2f7;--panel-2:#fce9f1;--pink-bg:#fce9f1;--cream:#fdf2f7;--cream-2:#fce9f1;
--teal:#fa4295;--teal-d:#ff0b78;--teal-soft:#fee2ee;--cyan:#fa4295;--cyan-lt:#f78cbc;--cyan-dk:#ff0b78;
--deep:#7a0037;--deep-rgb:122,0,55;--navy:#540d2d;--navy-deep:#7a0037;--black:#7a0037;--black-soft:#5c0029;
--sage:#7a0037;--sage-d:#5c0029;--sage-dd:#5c0029;--caramel:#fa4295;--caramel-d:#ff0b78;--gold-hi:#f78cbc;--p:#fa4295;
--gold:#ff0b78;--gold-d:#e00065;--gold-lite:#f78cbc;--gold-lt:#f78cbc;--gold-pale:#fee2ee;
--ink:#540d2d;--ink-soft:#803c5b;--muted:#ab738c;--line:#f8d8e6;--line-2:#f4b9d3;--on-dark-2:#f8c9de;
--red:#fa4295;--red-dark:#ff0b78;
--mag:#E82080;--pur:#B8125F;--grad:linear-gradient(90deg,#E82080 0%,#B8125F 100%);--grad-pop:linear-gradient(120deg,#E82080,#B8125F);
--grad-hero:linear-gradient(120deg,#7a0037,#5c0029);--pop-cyan:#fa4295;--pop-purple:#B8125F;--pop-yellow:#f78cbc;--pop-orange:#E82080;
--sky-grad:linear-gradient(180deg,#e90c6f 0%,#f471ac 42%,#dee2e8 80%,#fce2cc 100%);
--champ:#efd6a6;
--radius:14px;--maxw:1180px;--shadow:0 18px 44px -22px rgba(122,0,55,.38);
--disp:'Playfair Display',Georgia,serif;--luxe:'Playfair Display',Georgia,serif;--body:'Poppins',system-ui,-apple-system,sans-serif}

.btn--ghost{background:transparent;color:var(--sage-d)} .btn--ghost:hover{background:var(--sage);color:#fff}
  .btn--caramel{background:var(--caramel);border-color:var(--caramel);color:var(--ink)} .btn--caramel:hover{background:var(--caramel-d);border-color:var(--caramel-d);color:#fff}
  .page-hero{position:relative;color:#fff;overflow:hidden;min-height:42vh;display:flex;align-items:flex-end;background:var(--sage)}
  /* Bỏ ombre xanh — chỉ còn dải mờ trung tính ở đáy đủ để đọc chữ (30/07/2026) */
  .page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.18) 62%,rgba(0,0,0,.5))}
  .page-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1}
  .page-hero .wrap{position:relative;z-index:2;padding:120px 26px 46px;text-shadow:0 2px 14px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.45)} .page-hero .eyebrow{color:var(--gold-lite)}
  .page-hero h1{font-size:clamp(36px,6vw,58px);font-weight:700;margin:12px 0 8px} .page-hero p{max-width:46ch;color:rgba(255,255,255,.92)}
  .band{background:var(--sage);color:var(--cream)} .band .eyebrow{color:var(--gold-lite)} .band h2,.band h3{color:#fff}
  .band-cream{background:var(--cream)}
  .section-head{max-width:62ch;margin:0 auto 46px;text-align:center} .section-head h2{font-size:clamp(30px,5vw,50px);margin:12px 0 0;letter-spacing:-.01em}
  .split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
  .split .frame{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5} .split .frame img{width:100%;height:100%;object-fit:cover}
  .split h2{font-size:clamp(28px,4.4vw,44px);margin:14px 0 18px} .split p{color:var(--ink-soft);margin:0 0 16px}
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .card{background:var(--paper);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;border:1px solid var(--line)}
  .card .ph{aspect-ratio:4/3;overflow:hidden} .card .ph img{width:100%;height:100%;object-fit:cover;transition:.6s} .card:hover .ph img{transform:scale(1.06)}
  .card .body{padding:24px 24px 28px} .card .tag{font-family:var(--disp);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--caramel-d);font-weight:600}
  .card h3{font-size:23px;margin:10px 0 8px} .card p{color:var(--ink-soft);font-size:15.5px;margin:0}
  .menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 56px}
  .menu-block h3{font-size:24px;color:var(--sage-d);margin-bottom:14px;display:flex;align-items:center;gap:12px} .menu-block h3::after{content:"";flex:1;height:1px;background:var(--line)}
  .menu-legend{font-size:13px;color:var(--ink-soft);font-style:italic;margin:-4px 0 12px;letter-spacing:.2px}
  .menu-block--wide{grid-column:1 / -1;max-width:700px;margin-left:auto;margin-right:auto;width:100%}
  .ptbl{width:100%;border-collapse:collapse}
  .ptbl th{font-family:var(--body);font-weight:700;font-size:12px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.5px;text-align:right;padding:4px 0 10px 18px;border-bottom:1.5px solid var(--line);white-space:nowrap}
  .ptbl th:first-child{text-align:left;padding-left:0}
  .ptbl td{padding:11px 0;border-bottom:1px dashed var(--line);vertical-align:top}
  .ptbl tr:last-child td{border-bottom:0}
  .ptbl .pn{font-family:var(--disp);font-weight:600;font-size:15.5px;padding-right:18px}
  .ptbl .pn small{display:block;font-family:var(--body);font-weight:400;font-size:13px;color:var(--ink-soft);margin-top:2px}
  .ptbl .pn .pn-wrap{display:flex;align-items:flex-start;gap:12px}
  .ptbl .pn-thumb{width:48px;height:48px;border-radius:10px;object-fit:cover;flex:none;box-shadow:0 1px 5px rgba(0,0,0,.12)}
  .ptbl .pp{text-align:right;white-space:nowrap;font-family:var(--disp);font-weight:600;color:var(--caramel-d);padding-left:18px}
  .item{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:10px 0;border-bottom:1px dashed var(--line)} .item:last-child{border-bottom:0}
  .item .n{font-family:var(--disp);font-weight:600;font-size:15.5px} .item .n small{display:block;font-family:var(--body);font-weight:400;font-size:13.5px;color:var(--ink-soft);margin-top:2px}
  .item .p{font-family:var(--disp);font-weight:600;color:var(--caramel-d);white-space:nowrap}
  .cline{display:flex;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)} .cline .k{min-width:92px;font-family:var(--disp);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--caramel-d);font-weight:600;padding-top:3px}
  .cmap{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);min-height:300px} .cmap iframe{width:100%;height:100%;min-height:320px;border:0;display:block}
  .info-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
  .rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .rev{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
  .rev .stars{color:var(--caramel);letter-spacing:3px;margin-bottom:8px} .rev p{margin:0 0 12px;color:var(--ink-soft);font-size:15.5px} .rev .who{font-family:var(--disp);font-weight:600;font-size:14px}
  .bookwrap{max-width:720px;margin:0 auto}
  .bk-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:30px}
  .bk-card+.bk-card{margin-top:22px}
  .bk-card>h3{font-size:22px;color:var(--sage-d);margin-bottom:6px}
  label{display:block;font-family:var(--disp);font-size:12px;letter-spacing:.04em;color:var(--ink-soft);margin:14px 0 5px;font-weight:600}
  input,select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font:inherit;background:#fff;color:var(--ink)}
  input:focus,select:focus{outline:0;border-color:var(--caramel)}
  .slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
  .slot{border:1.5px solid var(--caramel);color:var(--caramel-d);background:#fff;border-radius:10px;padding:9px 13px;cursor:pointer;font-family:var(--disp);font-weight:600;font-size:14px} .slot.on{background:var(--caramel);color:var(--ink)}
  .msg{margin-top:14px;padding:13px;border-radius:12px;font-size:14.5px;display:none}
  .msg.ok{background:#eaf6ec;color:#256b34;display:block} .msg.err{background:#fbeceb;color:#a3352b;display:block}
  .svc-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px} .price{color:var(--caramel-d);font-weight:700;white-space:nowrap;font-family:var(--disp)}
  .hrow{display:flex;justify-content:space-between;gap:16px;padding:6px 0;font-size:14.5px;border-bottom:1px solid var(--line)} .hrow:last-child{border:0}
  .fab{position:fixed;right:18px;bottom:18px;background:#25D366;color:#fff;padding:12px 20px;border-radius:30px;display:flex;align-items:center;gap:8px;text-decoration:none;box-shadow:0 6px 18px #0004;font-size:15px;font-weight:700;z-index:50}.fab .fab-ic{font-size:20px;line-height:1}
  .modal{position:fixed;inset:0;z-index:100;display:none;align-items:flex-start;justify-content:center;padding:20px;overflow:auto} .modal.open{display:flex}
  .modal-back{position:fixed;inset:0;background:rgba(var(--deep-rgb),.55)} .modal-card{position:relative;background:var(--paper);border-radius:20px;box-shadow:var(--shadow);padding:30px 30px 34px;max-width:560px;width:100%;margin:auto}
  .modal-x{position:absolute;top:12px;right:16px;background:none;border:0;font-size:30px;line-height:1;color:var(--ink-soft);cursor:pointer;width:auto;padding:4px}
  @media(max-width:880px){
    .split,.cards,.menu-grid,.info-grid,.rev-grid,.foot-grid{grid-template-columns:1fr} .split .frame{order:-1} section{padding:60px 0}
  }
  /* ── Feedback khách hàng (tường ảnh POP) ── */
  .fb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  .fb-card{position:relative;background:var(--paper);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);transition:transform .3s}
  .fb-card:hover{transform:translateY(-6px)}
  .fb-card::before{content:"";position:absolute;inset:0;border-radius:20px;padding:3px;background:var(--grad-pop);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;z-index:1}
  .fb-c1::before{background:linear-gradient(120deg,#12c2e9,#7a5cff)} .fb-c2::before{background:linear-gradient(120deg,#ff2d95,#7a5cff)} .fb-c3::before{background:linear-gradient(120deg,#ffc300,#ff2d95)}
  .fb-ph{aspect-ratio:1/1;overflow:hidden} .fb-ph img{width:100%;height:100%;object-fit:cover;transition:.6s} .fb-card:hover .fb-ph img{transform:scale(1.07)}
  .fb-card figcaption{padding:18px 20px 22px;position:relative;z-index:2}
  .fb-quote{font-family:var(--disp);font-size:16px;color:var(--ink);line-height:1.45;margin-bottom:8px}
  .fb-who{font-family:var(--disp);font-weight:700;font-size:12.5px;color:var(--sage);text-transform:uppercase;letter-spacing:.08em}
  .fb-who::before{content:"— "}
  .fb-empty{text-align:center;color:var(--ink-soft);padding:54px 0;font-size:16px}
  @media(max-width:880px){.fb-grid{grid-template-columns:1fr 1fr}}
  @media(max-width:560px){.fb-grid{grid-template-columns:1fr}}
  /* ── Video các bộ nails (mục con "Video" của trang Feedback) ── */
  .vid-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  .vid-grid[hidden]{display:none}
  .vid-card{position:relative;display:block;width:100%;padding:0;border:0;border-radius:16px;overflow:hidden;cursor:pointer;
    background:var(--bg-alt);aspect-ratio:9/16;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}
  .vid-card:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(var(--deep-rgb),.22)}
  .vid-card img{width:100%;height:100%;object-fit:cover;display:block}
  .vid-noimg{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:40px}
  .vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;
    background:rgba(255,255,255,.92);box-shadow:0 6px 18px #0003;transition:.25s}
  .vid-play::after{content:"";position:absolute;left:52%;top:50%;transform:translate(-50%,-50%);
    border-style:solid;border-width:11px 0 11px 18px;border-color:transparent transparent transparent var(--ink)}
  .vid-card:hover .vid-play{background:#fff;transform:translate(-50%,-50%) scale(1.08)}
  .vid-cap{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 11px;font-family:var(--body);font-size:13px;font-weight:600;
    color:#fff;text-align:left;line-height:1.3;background:linear-gradient(to top,rgba(0,0,0,.62),transparent)}
  .vidbox{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.86)}
  .vidbox.open{display:flex}
  .vidbox-in{width:min(92vw,420px);max-height:92vh;display:flex;flex-direction:column;align-items:center;gap:10px}
  .vidbox-frame{width:100%;aspect-ratio:9/16;max-height:82vh;background:#000;border-radius:16px;overflow:hidden}
  .vidbox-frame.ig{aspect-ratio:auto;height:84vh;background:#fff}   /* khung Instagram cao hơn: có phần tiêu đề của IG */
  .vidbox-frame iframe,.vidbox-frame video{width:100%;height:100%;border:0;display:block;background:#000}
  .vidbox-cap{color:#fff;font-size:14px;text-align:center;margin:0}
  .vidbox-x{position:absolute;top:14px;right:18px;background:none;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;width:auto;padding:6px}
  @media(max-width:880px){.vid-grid{grid-template-columns:repeat(3,1fr);gap:14px}}
  @media(max-width:560px){.vid-grid{grid-template-columns:1fr 1fr;gap:12px}.vid-play{width:46px;height:46px}}
/* ==========================================================================
   BELLA SPA MANCHESTER — giao diện v5 "Xanh & Trắng" (28/07/2026)
   Màu lấy đúng theo tờ rơi + logo tiệm:
   nền TRẮNG + xanh logo #1883d3 · Playfair Display + Poppins ·
   nút bo tròn viên thuốc · thẻ trắng bo góc 14px ·
   THANH MENU và CHÂN TRANG dùng dải hồng–tím #d6357f → #6f2aa9
   (đúng dải màu ở đáy tờ rơi và ô "Personal Nail Kit £25")
   ========================================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);font-weight:400;color:var(--ink);background:var(--bg);line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;line-height:1.15;letter-spacing:.2px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
strong,b{font-weight:600}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
section{padding:84px 0}

/* nhãn nhỏ chữ hoa màu vàng */
.eyebrow{display:inline-block;font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.eyebrow::before,.eyebrow::after{content:none}
.sec-head{text-align:center;max-width:740px;margin:0 auto 52px}
.sec-head .eyebrow{display:block}
.sec-head h2{font-size:clamp(28px,4vw,42px);margin-bottom:14px}
.sec-head p{color:var(--muted);font-size:16.5px}

/* ===== NÚT ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--body);font-weight:600;font-size:14.5px;letter-spacing:.3px;text-transform:none;padding:14px 30px;border-radius:50px;transition:.25s;cursor:pointer;border:2px solid transparent;white-space:nowrap}
.btn-primary{background:var(--teal);color:#ffffff;border-color:transparent}
.btn-primary:hover{background:var(--teal-d);color:#fff;transform:translateY(-2px)}
.btn-navy{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-navy:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-outline:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn-ghost{border-color:rgba(255,255,255,.8);color:#fff;background:transparent}
.btn-ghost:hover{background:#fff;color:var(--deep)}
.btn-whatsapp{background:transparent;color:#128c4a;border-color:#a9dcbe}
.btn-whatsapp:hover{background:#25d366;border-color:#25d366;color:#06301a}
.float-book .btn-whatsapp{background:#25d366;border-color:#25d366;color:#06301a}
.btn-gold{background:var(--gold);color:#ffffff;border-color:transparent}
.btn-gold:hover{background:var(--gold-d);color:#fff;transform:translateY(-2px)}

/* ===== LOGO (ảnh logo thật của tiệm — tách nền từ tờ rơi) ===== */
.kk-logo{position:relative;display:flex;flex-direction:column;justify-content:center;min-width:0;height:70px;flex:0 0 auto;color:#fff;line-height:1.05}
.kk-logo .stars{font-size:11px;letter-spacing:3px;color:var(--gold-lite);text-shadow:0 1px 2px rgba(0,0,0,.25)}
.kk-logo .row{display:flex;align-items:baseline;gap:6px;font-family:var(--disp);font-weight:700;font-size:27px;letter-spacing:.4px;text-shadow:0 2px 8px rgba(0,0,0,.22)}
.kk-logo .row .nm{font-weight:400;font-style:italic}
.kk-logo .seit{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;opacity:.92;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(60vw,300px)}
/* Logo TiNa Nails: PNG nền trong, tỉ lệ ~1,9:1 → khung vừa khít, không chừa khoảng trống thừa.
   drop-shadow để nét vàng nổi trên dải màu hồng của thanh menu & chân trang. */
.kk-logo.has-img{display:block;width:142px;height:70px;background-position:left center;background-size:contain;background-repeat:no-repeat;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.34))}
.kk-logo.has-img>*{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ===== TOPBAR (dải navy: trái = địa chỉ + điện thoại · phải = chọn ngôn ngữ) ===== */
.topbar{background:var(--grad);color:rgba(255,255,255,.92);font-size:13px;letter-spacing:.02em;text-transform:none;font-weight:400;padding:0;border-bottom:1px solid rgba(255,255,255,.18)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:8px 22px}
.topbar b{color:#fff;font-weight:600}
.topbar a{color:#fff}
.topbar a:hover{color:#ffe6f3}
.tb-info{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.tb-info a{white-space:normal}
/* nút chọn ngôn ngữ dạng viên thuốc (giống mẫu nhà hàng Taumi) */
.langpills{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:50px;padding:3px 6px 3px 9px}
.langpills .lang-ic{font-size:13px;line-height:1;opacity:.8;margin-right:2px}
.langpills .lp{background:transparent;border:0;border-radius:50px;color:rgba(255,255,255,.88);font-family:var(--body);font-size:12.5px;font-weight:500;letter-spacing:.01em;padding:5px 11px;cursor:pointer;line-height:1.2;transition:.2s;white-space:nowrap}
.langpills .lp:hover{color:#fff;background:rgba(255,255,255,.18)}
.langpills .lp.on{background:#fff;color:var(--pur);font-weight:600}

/* ===== HEADER (1 hàng: logo → các tab → nút đặt lịch) — nền dải hồng–tím như tờ rơi ===== */
header{position:sticky;top:0;z-index:50;border-bottom:0;box-shadow:0 12px 30px -20px rgba(111,42,169,.6);
  background:
    radial-gradient(120% 240% at 6% 0%,rgba(255,255,255,.16),rgba(255,255,255,0) 44%),
    radial-gradient(100% 220% at 82% 100%,rgba(255,255,255,.12),rgba(255,255,255,0) 48%),
    var(--grad)}
header>.wrap{position:relative;z-index:2}
/* logo của tiệm (cfg.images.logo) nổi trên dải màu nhờ quầng sáng CSS phía sau */
header .kk-logo{position:relative;z-index:1}
header .brand{position:relative;padding:10px 34px 10px 26px;border-radius:0;background:none}
header .brand.has-img::before{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);
  width:170%;height:133%;z-index:0;pointer-events:none;
  background:radial-gradient(58% 58% at 50% 50%,rgba(255,255,255,.92),rgba(255,255,255,.55) 42%,rgba(255,255,255,0) 72%);opacity:0}
.nav{display:flex;align-items:center;justify-content:space-between;height:auto;gap:10px;flex-wrap:nowrap;padding:12px 0}
.brand{flex:0 0 auto}
.menu{display:flex;align-items:center;justify-content:center;gap:1px;list-style:none;flex-wrap:nowrap;flex:1 1 auto}
.menu>li{position:relative;flex:0 0 auto}
.menu>li>a{font-size:13.2px;font-weight:600;letter-spacing:.1px;text-transform:none;color:#fff;padding:10px 11px;display:inline-flex;align-items:center;gap:5px;border-radius:9px;transition:.2s;white-space:nowrap;position:relative}
.menu>li>a.active{color:#fff;background:rgba(255,255,255,.18)}
.menu>li>a::after{content:"";position:absolute;left:11px;right:calc(100% - 11px);bottom:2px;height:2.5px;border-radius:2px;background:#fff;transition:right .3s}
.menu>li>a:hover{color:#fff;background:rgba(255,255,255,.15)}
.menu>li>a:hover::after,.menu>li>a.active::after{right:11px}
.nav-right{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.nav-lang{display:inline-flex;align-items:center;gap:6px}
.lang-ic{font-size:15px;line-height:1;opacity:.75}
.langsel-main{appearance:none;-webkit-appearance:none;background-color:var(--panel);color:var(--ink-soft);border:1px solid var(--line);border-radius:50px;font-family:var(--body);font-weight:500;font-size:13.5px;letter-spacing:0;padding:8px 26px 8px 11px;cursor:pointer;line-height:1.2;transition:.2s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%230f5fa8' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:10px}
.langsel-main option{color:#111}
.langsel-main:hover{border-color:var(--teal);color:var(--ink)}
.langsel-main:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.call-link{font-size:14px;font-weight:500;letter-spacing:0;color:var(--gold);display:inline-flex;align-items:center;gap:7px}
.call-link:hover{color:var(--teal-d)}
header .btn-primary{background:#fff;border-color:transparent;color:var(--pur);padding:11px 24px;font-size:14px;box-shadow:0 8px 20px -10px rgba(0,0,0,.45)}
header .btn-primary:hover{background:#ffe9f5;color:var(--pur);transform:translateY(-2px)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:26px;height:2px;border-radius:2px;background:#fff;transition:.3s}
header.nav-collapsed .menu{display:none}
header.nav-collapsed .burger{display:flex}
header.nav-collapsed .menu.open{display:flex;position:absolute;top:100%;left:0;right:0;height:auto;margin-top:0;flex-direction:column;align-items:stretch;background:var(--grad);border-bottom:0;box-shadow:var(--shadow);padding:6px 22px 16px;gap:0;z-index:60}
header.nav-collapsed .menu.open>li{border-bottom:1px solid rgba(255,255,255,.24)}
header.nav-collapsed .menu.open>li:last-child{border-bottom:0}
header.nav-collapsed .menu.open>li>a{padding:14px 2px;width:100%;white-space:normal;border-radius:0}
header.nav-collapsed .menu.open>li>a::after{display:none}

/* ===== HERO (ảnh tràn màn hình — ĐÃ BỎ LỚP OMBRE 28/07/2026 theo yêu cầu Mợ Dung)
   Ảnh nền trang chủ để nguyên màu thật, không phủ gradient xanh đậm nữa.
   Chữ trắng dựa vào text-shadow bên dưới để vẫn đọc được.
   30/07/2026 — ảnh nền mới (nền đen + nến vàng, 2 bàn tay ở nửa dưới):
     • nền hero đổi sang đen ăn theo ảnh để mép ảnh không lộ viền hồng
     • chiều cao bám theo bề ngang (62vw) nên ảnh ít bị cắt = "vừa vặn" trang chủ
     • khối chữ CĂN GIỮA và nằm ở khoảng đen trống phía trên 2 bàn tay ===== */
.hero{position:relative;overflow:hidden;padding:0;background:#0a0706;color:#fff;min-height:clamp(560px,62vw,88vh);display:flex;flex-direction:column;justify-content:flex-end}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 58%;opacity:1}
.hero-bg::after{content:none}
.hero-inner{position:relative;z-index:2;padding:clamp(38px,6.5vh,96px) 22px 84px;max-width:var(--maxw);width:100%;margin:0 auto;flex:1;display:flex;align-items:flex-start;justify-content:center}
.hero-text{max-width:720px;margin:0 auto;text-align:center}
/* không còn lớp phủ nên chữ tự chống nền bằng quầng bóng đậm */
.hero .eyebrow,.hero h1,.hero .slogan,.hero p.lead{
  text-shadow:0 1px 2px rgba(0,0,0,.9),0 2px 10px rgba(3,18,36,.85),0 0 26px rgba(3,18,36,.7)}
.hero h1{text-shadow:0 2px 4px rgba(0,0,0,.9),0 4px 18px rgba(3,18,36,.85),0 0 34px rgba(3,18,36,.75)}
.hero-stats b,.hero-stats span{text-shadow:0 1px 3px rgba(0,0,0,.75)}
/* Màu chữ trên hero (30/07/2026): tiêu đề "Professional Nail Care" = HỒNG thương hiệu,
   những dòng trước đây màu hồng (dòng nhỏ trên tiêu đề, slogan, số liệu) đổi sang
   VÀNG SÂM PANH ăn theo ánh nến/đèn vàng trong ảnh để nổi hẳn trên nền đen. */
.hero .eyebrow{color:var(--champ)}
.hero h1{font-size:clamp(38px,6vw,66px);line-height:1.06;margin:8px 0 14px;color:var(--gold-lite);font-weight:700}
.hero h1 span{color:var(--champ);font-style:normal}
.hero .slogan{font-family:var(--body);font-style:normal;font-size:15px;letter-spacing:6px;text-transform:uppercase;font-weight:500;color:var(--champ);margin-bottom:20px}
.hero p.lead{font-size:17px;font-weight:400;color:rgba(255,255,255,.92);max-width:600px;margin:0 auto 26px;line-height:1.75}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.hero .btn-primary{background:var(--teal);border-color:transparent;color:#ffffff}
.hero .btn-primary:hover{background:var(--gold);color:#fff}
.hero .btn-outline{color:#fff;border-color:rgba(255,255,255,.75)}
.hero .btn-outline:hover{background:#fff;color:var(--deep);border-color:#fff}
.hero .btn-whatsapp{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);color:#fff}
.hero .btn-whatsapp:hover{background:#25d366;border-color:#25d366;color:#06301a}
.hero-media{display:none}

/* dải số liệu dưới hero */
.hero-stats{position:relative;z-index:2;border-top:1px solid rgba(143,208,247,.24);display:grid;grid-template-columns:repeat(4,1fr);background:rgba(5,28,54,.35);backdrop-filter:blur(2px)}
.hero-stats div{padding:24px 22px;text-align:center;border-left:1px solid rgba(143,208,247,.24)}
.hero-stats div:first-child{border-left:0}
.hero-stats b{display:block;font-family:var(--disp);font-size:26px;font-weight:700;color:#fff;line-height:1.2}
.hero-stats span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-2)}
.hero-stats .gold{color:var(--champ)}

/* ===== DẢI GIÁ TRỊ ===== */
#features{background:var(--bg-alt);padding:84px 0}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.feat{display:flex;gap:16px;align-items:flex-start;padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:.25s}
.feat:hover{border-color:var(--teal);box-shadow:var(--shadow);transform:translateY(-3px);background:var(--panel)}
.feat .fic{flex:0 0 52px;width:52px;height:52px;border-radius:50%;background:var(--teal-soft);border:0;color:var(--teal-d);display:grid;place-items:center;font-size:23px}
.feat h4{font-size:18px;margin-bottom:5px;font-weight:700}
.feat p{font-size:14px;color:var(--muted);line-height:1.6}

/* ===== DỊCH VỤ ===== */
#services{background:var(--bg)}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.svc{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.3s;display:flex;flex-direction:column;color:inherit;box-shadow:0 8px 22px -14px rgba(11,58,111,.28)}
.svc:hover{border-color:var(--teal);box-shadow:var(--shadow);transform:translateY(-6px)}
.svc .img{aspect-ratio:4/3;overflow:hidden}
.svc .img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.svc:hover .img img{transform:scale(1.06)}
.svc-body{padding:24px}
.svc-body h3{font-size:20px;margin-bottom:10px;color:var(--ink);font-weight:700}
.svc-body h3::after{content:none}

/* thẻ dịch vụ dạng liên kết (trang chủ) — ảnh trên, chữ dưới nền trắng */
a.svc{display:flex;background:var(--panel);border-color:var(--line);color:inherit}
a.svc:hover{box-shadow:var(--shadow)}
a.svc .img{aspect-ratio:4/3}
a.svc .img img{opacity:1}
a.svc:hover .img img{transform:scale(1.06);opacity:1}
a.svc .svc-body{position:static;left:auto;right:auto;bottom:auto;padding:24px;background:none;color:inherit}
a.svc .svc-body h3{color:var(--ink);font-weight:700;font-size:20px;margin-bottom:6px}
a.svc .svc-body h3::after{content:none}
.svc-cnt{color:var(--gold);font-family:var(--body);font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-top:6px;font-weight:700}
.svc-cnt b{color:var(--gold);font-family:var(--body);font-size:12px;font-weight:700}
.svc-note{text-align:center;color:var(--muted);font-size:15px;margin-top:36px}
.svc-note b{color:var(--ink)}
.page-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:44px}

/* bảng giá (trang /services) */
.svc-list{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.svc-body ul{list-style:none;display:flex;flex-direction:column;gap:0}
.svc-body li{display:flex;justify-content:space-between;gap:14px;align-items:baseline;font-size:15px;color:var(--ink-soft);padding:9px 0;border-bottom:1px dashed var(--line);position:relative}
.svc-body li:last-child{border-bottom:0}
.svc-body li::before{content:none}
.svc-body li .pr{color:var(--gold);font-weight:600;white-space:nowrap;font-family:var(--body);font-size:14.5px;font-variant-numeric:tabular-nums}
.svc-more{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.svc-more summary{cursor:pointer;color:var(--teal-d);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase;list-style:none;padding:4px 0}
.svc-more summary::-webkit-details-marker{display:none}
.svc-more summary::after{content:" ▾";font-size:11px}
.svc-more[open] summary::after{content:" ▴"}
.svc-more ul{margin-top:12px}
/* phụ đề nhỏ dưới tên nhóm dịch vụ */
.svc-sub{font-family:var(--disp);font-style:italic;font-size:15px;color:var(--gold-d);margin:-4px 0 16px;line-height:1.5}
/* dòng tiêu đề nhỏ trong bảng giá (Add-ons, Length guide…) */
.svc-body li.grp{margin-top:10px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-d);border-top:1px solid var(--line);border-bottom:0;padding-top:13px;padding-bottom:2px}
.svc-body li.grp:first-child{margin-top:0;border-top:0;padding-top:0}
/* dòng nổi bật (ưu đãi) */
.svc-body li.hl{background:var(--teal-soft);border:1px solid var(--line-2);border-radius:10px;padding:11px 14px;color:var(--ink);font-weight:600;margin-bottom:4px}
.svc-body li.hl .pr{color:var(--gold-d);font-weight:700}
/* hộp Personal Nail Kit */
.kit-box{margin-top:40px;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:var(--radius);padding:26px 30px;display:flex;gap:26px;align-items:center;flex-wrap:wrap;justify-content:space-between;box-shadow:0 8px 22px -14px rgba(11,58,111,.28)}
.kit-box h4{font-size:21px;margin-bottom:6px}
.kit-box p{color:var(--muted);font-size:14.5px;margin:0;max-width:640px}
.kit-box .kit-price{font-family:var(--disp);font-size:36px;font-weight:700;color:var(--gold);white-space:nowrap}
.kit-box .kit-price small{display:block;font-family:var(--body);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:600}

/* ===== THƯ VIỆN ẢNH ===== */
#gallery{background:var(--bg-alt)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;columns:auto}
.gallery img{width:100%;height:250px;object-fit:cover;border-radius:12px;margin-bottom:0;transition:.35s;cursor:pointer;filter:none}
.gallery img:hover{transform:scale(.98);filter:brightness(1.08)}
.gallery-cta{text-align:center;margin-top:40px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.fotos-hidden{display:none!important}
.lb{position:fixed;inset:0;z-index:300;background:rgba(5,28,54,.94);display:none;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.lb.open{display:flex}
.lb img{max-width:96vw;max-height:92vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.6);cursor:default}
.lb .lbx{position:absolute;top:16px;right:20px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.16);border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;transition:.2s}
.lb .lbx:hover{background:var(--gold-lite);color:var(--deep)}

/* ===== CÂU CHUYỆN ===== */
#about{background:var(--bg)}
.about-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}
.about-imgs{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:relative;padding:0}
.about-imgs::before{content:none}
.about-imgs img{border-radius:16px;width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;position:relative;z-index:1;box-shadow:var(--shadow);transition:.3s}
.about-imgs img:hover{transform:translateY(-4px)}
.about-imgs img:first-child{margin-top:34px}
.about-text h2{font-size:clamp(26px,4vw,40px);margin:8px 0 18px}
.about-text p{color:var(--ink-soft);font-size:16px;margin-bottom:16px;font-weight:400}
.about-text .btn{margin-top:10px}

/* ===== GIỜ MỞ CỬA + BẢN ĐỒ ===== */
#hours{background:var(--bg-alt)}
.hours-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:44px;align-items:stretch;border:0}
.hours-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px;display:flex;flex-direction:column}
.hours-card h3{font-size:24px;margin-bottom:6px}
.hours-card .sub{color:var(--muted);font-size:14.5px;margin-bottom:20px}
.hours-list{list-style:none;margin-bottom:22px}
.hours-list li{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px dashed var(--line);font-size:15px}
.hours-list li:last-child{border-bottom:0}
.hours-list .day{font-weight:500;letter-spacing:0}
.hours-list .time{color:var(--teal-d);font-weight:600}
.hours-list .closed{color:var(--muted);font-weight:400;font-style:normal}
.addr-meta{display:flex;flex-direction:column;gap:10px;font-size:15px;margin-bottom:22px;color:var(--ink-soft)}
.addr-meta div{display:flex;align-items:flex-start;gap:10px}
.addr-meta .ic{color:var(--gold);flex:0 0 auto}
.hours-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:auto}
.map-card{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);min-height:420px}
.map-card iframe{width:100%;height:100%;min-height:420px;border:0;display:block;filter:grayscale(.2)}

/* ===== CAM KẾT (dải tối vàng-đen) ===== */
#guarantee{background:var(--deep);color:#fff;position:relative}
#guarantee::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold-lite),transparent)}
.guar-grid{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}
.guar-text .eyebrow{color:var(--gold-lite)}
.guar-text h2{font-size:clamp(26px,4vw,40px);margin-bottom:18px;color:#fff;font-weight:700}
.guar-text h2 span{color:var(--gold-lite);font-style:normal}
.guar-text p{color:var(--on-dark-2);font-size:16px;margin-bottom:16px;font-weight:400}
.guar-img{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.guar-img::before{content:none}
.guar-img img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.guar-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px}

/* ===== CẢM NHẬN ===== */
#testi{background:var(--bg-alt)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 8px 22px -14px rgba(11,58,111,.24);position:relative;transition:.3s}
.testi::before{content:"”";position:absolute;top:4px;right:22px;font-family:var(--disp);font-size:70px;color:var(--teal-soft);line-height:1}
.testi:hover{border-color:var(--teal);transform:translateY(-4px);box-shadow:var(--shadow)}
.testi .star{color:var(--gold);letter-spacing:2px;margin-bottom:12px;font-size:14px}
.testi p{font-family:var(--body);font-size:15.5px;font-style:italic;color:var(--ink-soft);margin-bottom:18px;font-weight:400;line-height:1.7}
.testi .who{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.testi .av{width:44px;height:44px;border-radius:50%;background:var(--teal);color:#ffffff;display:grid;place-items:center;font-family:var(--disp);font-weight:700;font-size:18px}
.testi .who b{display:block;font-size:15px;font-weight:600;font-family:var(--body)}
.testi .who small{color:var(--muted);font-size:13px;letter-spacing:0;text-transform:none}

/* ===== FAQ ===== */
#faq{background:var(--bg)}
.faq{max-width:860px;margin:0 auto}
.faq-item{border:1px solid var(--line);border-radius:12px;margin-bottom:14px;overflow:hidden;background:var(--panel)}
.faq-item:first-child{border-top:1px solid var(--line)}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;cursor:pointer;font-weight:700;font-size:16.5px;font-family:var(--disp)}
.faq-q .pm{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--teal-soft);border:0;color:var(--teal-d);display:grid;place-items:center;font-size:18px;transition:.3s}
.faq-item.open .pm{transform:rotate(45deg);background:var(--teal);border-color:var(--teal);color:#ffffff}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease;color:var(--muted)}
.faq-a p{padding:0 24px 22px;font-size:15px;font-weight:400;max-width:760px}

/* ===== LIÊN HỆ ===== */
#contact{background:var(--bg-alt)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;border:0}
.form-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:34px 32px;box-shadow:var(--shadow)}
.book-cta{display:flex;flex-direction:column;justify-content:center;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 32px}
.book-cta-ic{width:62px;height:62px;border-radius:50%;background:var(--teal-soft);border:0;color:var(--teal-d);display:grid;place-items:center;font-size:26px;margin:0 auto 18px}
.book-cta h3{font-size:24px;margin-bottom:12px}
.book-cta>p{color:var(--muted);font-size:15px;margin:0 auto 22px;max-width:340px;font-weight:400}
.book-cta-or{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:11px;margin:18px 0;text-transform:uppercase;letter-spacing:.18em}
.book-cta-or::before,.book-cta-or::after{content:"";flex:1;height:1px;background:var(--line)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.field input,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:15px;font-weight:400;background:var(--bg);color:var(--ink);transition:.25s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.contact-cards{display:flex;flex-direction:column;gap:14px;border:0}
.cc{display:flex;gap:18px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;transition:.25s}
.cc:last-child{border-bottom:1px solid var(--line)}
.cc:hover{background:var(--panel);border-color:var(--teal);box-shadow:var(--shadow)}
.cc-pin{width:56px;height:56px;border-radius:50%;flex:0 0 56px;background:var(--teal-soft);color:var(--teal-d);display:grid;place-items:center;font-size:24px}
.cc-pin.navy{background:var(--teal-soft);color:var(--gold)}
.cc h4{font-size:19px;margin-bottom:7px;font-weight:700}
.cc p{font-size:14.5px;color:var(--ink-soft);margin-bottom:3px;font-weight:400}
.cc a.bk{display:inline-block;margin-top:10px;color:var(--teal-d);font-weight:600;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}
.cc a.bk:hover{color:var(--gold)}
.contact-page-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:44px;align-items:start}
.gal-social{text-align:center;color:var(--muted);font-size:15px;margin-top:36px}
.gal-social a{color:var(--teal-d);font-weight:600}

/* ===== DẢI THƯƠNG HIỆU ===== */
.brand-strip{background:var(--bg-alt);color:var(--teal-d);text-align:center;padding:26px;font-family:var(--disp);font-size:20px;font-weight:700;letter-spacing:4px;border-top:1px solid var(--line)}

/* ===== CHÂN TRANG ===== */
footer{background:var(--grad);color:rgba(255,255,255,.9);padding:66px 0 26px;font-size:14.5px;font-weight:400}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:36px;margin-bottom:44px}
.foot-grid h5{color:#fff;font-family:var(--disp);font-size:17px;font-weight:700;letter-spacing:.02em;text-transform:none;margin-bottom:16px}
.foot-grid ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.foot-grid a,.foot-grid p,.foot-grid li{color:rgba(255,255,255,.9)}
.foot-grid a:hover{color:#fff;text-decoration:underline}
.foot-brand .kk-logo{margin-bottom:20px}
.foot-brand p{margin-bottom:20px;max-width:300px;line-height:1.85}
.socials{display:flex;gap:11px}
.socials a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);display:grid;place-items:center;color:#fff;font-weight:600;font-size:14px;transition:.3s}
.socials a:hover{background:#fff;border-color:#fff;color:var(--pur)}
.foot-bottom{border-top:1px solid rgba(255,255,255,.3);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:13px;color:rgba(255,255,255,.82)}
.foot-bottom a:hover{color:#fff;text-decoration:underline}

/* nút nổi */
.float-book{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;gap:9px;width:min(92vw,340px)}
.float-book a{box-shadow:0 16px 34px -16px rgba(11,58,111,.6);flex:1 1 0;padding:13px 16px;font-size:13px}
.float-book .btn-primary{background:var(--teal);border-color:transparent;color:#ffffff}
.float-book .btn-primary:hover{background:var(--teal-d);color:#fff}

/* ===== MODAL ĐẶT LỊCH ===== */
.book-overlay{position:fixed;inset:0;z-index:200;background:rgba(5,28,54,.62);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .25s}
.book-overlay.open{display:flex;opacity:1}
.book-modal{background:var(--panel);border-radius:16px;max-width:480px;width:100%;box-shadow:0 40px 90px rgba(11,58,111,.45);overflow:hidden;max-height:94vh;display:flex;flex-direction:column;transform:translateY(14px) scale(.97);transition:.28s cubic-bezier(.2,.8,.2,1)}
.book-overlay.open .book-modal{transform:none}
.book-frame-wrap{position:relative;flex:1;min-height:300px;background:#fff}
.book-frame{width:100%;height:78vh;max-height:680px;border:0;display:block;background:#fff}
.book-loading{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:14px;padding:24px;pointer-events:none;transition:opacity .3s}
.book-loading.hide{opacity:0}
.book-loading .spin{width:32px;height:32px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:bk-spin .8s linear infinite;margin:0 auto 12px}
@keyframes bk-spin{to{transform:rotate(360deg)}}
.book-head{background:var(--deep);color:#fff;padding:26px 24px 20px;position:relative;text-align:center;border-bottom:1px solid rgba(143,208,247,.3)}
.book-head h3{color:#fff;font-size:23px;margin-bottom:7px;font-weight:700}
.book-head h3 span{color:var(--gold-lite)}
.book-head p{font-size:13px;color:var(--on-dark-2);letter-spacing:.04em}
.book-close{position:absolute;top:14px;right:15px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.14);border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:.25s}
.book-close:hover{background:var(--gold-lite);color:var(--deep);transform:rotate(90deg)}
.book-body{padding:20px}
.book-channel{display:flex;align-items:center;gap:16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;margin-bottom:11px;transition:.25s;text-align:left}
a.book-channel:hover{border-color:var(--teal);background:var(--bg)}
.book-channel .ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:0 0 46px;color:#fff;font-size:20px}
.book-channel b{display:block;font-family:var(--disp);font-size:17px;line-height:1.3;font-weight:700}
.book-channel small{color:var(--muted);font-size:12.5px}
.book-channel .arr{margin-left:auto;color:var(--teal);font-size:19px;transition:.25s}
a.book-channel:hover .arr{transform:translateX(4px)}
.ico-wa{background:#25d366}
.ico-call{background:var(--deep)}
.ico-mail{background:var(--teal)}
.book-or{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:11px;margin:20px 0 12px;text-transform:uppercase;letter-spacing:.18em}
.book-or::before,.book-or::after{content:"";flex:1;height:1px;background:var(--line)}
.book-foot{text-align:center;padding:14px 18px 18px;font-size:13px;color:var(--muted);background:var(--bg);border-top:1px solid var(--line)}
.book-back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--muted);font:inherit;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;cursor:pointer;margin-bottom:14px;padding:2px 0}
.book-back:hover{color:var(--gold)}
#bookForm .frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#bookForm .field{margin-bottom:14px}
#bookForm select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:15px;font-weight:400;background:var(--bg);color:var(--ink);transition:.25s;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f5fa8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;padding-right:34px}
#bookForm select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.book-success{text-align:center;padding:10px 4px 4px}
.book-success .tick{width:66px;height:66px;border-radius:50%;background:#eef8f1;color:#2e9935;display:grid;place-items:center;font-size:32px;margin:0 auto 16px}
.book-success h4{font-family:var(--disp);font-size:22px;margin-bottom:9px;font-weight:700}
.book-success>p{color:var(--muted);font-size:14.5px;margin-bottom:18px}
.book-summary{text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 18px;font-size:14px;margin-bottom:18px}
.book-summary div{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px dashed var(--line)}
.book-summary div:last-child{border-bottom:0}
.book-summary span:first-child{color:var(--muted);white-space:nowrap}
.book-summary span:last-child{font-weight:600;text-align:right}
.share-title{font-size:14px;font-weight:600;margin:6px 0 12px}
.share-title span{color:var(--muted);font-weight:400}
.copy-note{background:#eef8f1;color:#1f7a36;border-radius:10px;padding:12px 14px;font-size:13px;margin-top:4px;line-height:1.5}

/* ==========================================================================
   CÁC KHỐI THÊM CHO GIỐNG TRANG MẪU glossynailsjena.de
   (banner trang phụ · tab lọc ảnh · tóm tắt sao · ô đánh giá · giỏ dịch vụ)
   ========================================================================== */

/* ===== BANNER ĐẦU TRANG PHỤ ===== */
/* Cao thêm 1/3 so với bản cũ (316px → 421px) theo yêu cầu Mợ Dung 30/07/2026:
   phần chữ giữ nguyên ~120px, nên cộng 105px vào padding theo tỉ lệ cũ 120:76 → 184:117.
   Ảnh nền cover nên khung cao hơn = lộ nhiều ảnh hơn theo chiều dọc. */
.page-banner{position:relative;color:#fff;text-align:center;padding:184px 22px 117px;
  background-color:var(--deep);background-position:center;background-size:cover;background-repeat:no-repeat}
/* Bỏ lớp phủ xanh navy đặc (ombre) — ảnh hiện rõ nét; chỉ giữ quầng mờ TRUNG TÍNH sau chữ cho dễ đọc (30/07/2026) */
.page-banner::after{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 72% 64% at 50% 55%,rgba(0,0,0,.38),rgba(0,0,0,0) 74%),
             linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.05) 45%,rgba(0,0,0,.22))}
.page-banner>*{position:relative;z-index:2}
.page-banner .eyebrow{color:var(--gold-lite);text-shadow:0 2px 12px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.45)}
/* Cỡ chữ = 2/3 tiêu đề trang chủ (.hero h1 = clamp(38px,6vw,66px)) — chủ tiệm chốt 30/07/2026 */
.page-banner h1{font-size:clamp(25px,4vw,44px);margin:6px 0 10px;color:#fff;font-weight:700;text-shadow:0 2px 16px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.45)}
.page-banner p{color:rgba(255,255,255,.92);font-size:14px;letter-spacing:3px;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.45)}
/* Banner KHÔNG CHỮ (trang Về chúng tôi) — chủ tiệm chốt 31/07/2026: chỉ để ảnh, giữ nguyên
   chiều cao khung như bản có chữ (desktop 431px, điện thoại 500px). Bỏ quầng mờ giữa ảnh
   (chỉ dùng để chữ dễ đọc), giữ dải tối trên–dưới cho menu trắng còn đọc được. */
.page-banner.banner-plain{padding:0;min-height:431px}
.page-banner.banner-plain::after{background:linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.05) 45%,rgba(0,0,0,.22))}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ===== TAB LỌC ẢNH (Nails / Beauty) ===== */
.fb-tabs{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 auto 38px}
.fb-tab{font-family:var(--body);font-size:14.5px;font-weight:600;letter-spacing:.3px;padding:12px 26px;border-radius:50px;
  border:2px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;transition:.25s}
.fb-tab:hover{border-color:var(--teal);color:var(--ink)}
.fb-tab.active{background:var(--teal);border-color:var(--teal);color:#ffffff}
.fb-grid[hidden]{display:none}

/* ===== TÓM TẮT ĐIỂM ĐÁNH GIÁ ===== */
.rating-summary{display:flex;align-items:center;justify-content:center;gap:18px;max-width:520px;margin:0 auto 34px;padding:18px 26px;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 22px -14px rgba(11,58,111,.24)}
.rating-summary .rs-score{font-family:var(--disp);font-size:44px;font-weight:700;color:var(--gold-d);line-height:1}
.rating-summary .rs-meta{display:flex;flex-direction:column;gap:4px;text-align:left}
.rating-summary .rs-stars{color:var(--gold);letter-spacing:3px;font-size:18px}
.rating-summary .rs-count{font-size:13.5px;color:var(--muted)}
.rating-summary .rs-count b{color:var(--ink);font-weight:600}
/* nhãn nguồn đánh giá */
.testi-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.testi-top .star{margin-bottom:0}
.src-badge{font-size:10.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:4px 11px;border-radius:50px;white-space:nowrap}
.src-google{background:var(--panel-2);color:var(--gold-d);border:1px solid var(--line-2)}
.src-insta{background:#fdeff6;color:#c13584;border:1px solid #f6cfe6}

/* ===== Ô ĐÁNH GIÁ (4–5★ → Google · 1–3★ → gửi riêng cho tiệm) ===== */
.review-gate{max-width:620px;margin:44px auto 0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:34px 30px;text-align:center}
.review-gate h3{font-size:23px;margin-bottom:8px}
.review-gate h4{font-size:19px;margin-bottom:8px}
.review-gate .rg-ask>p{color:var(--muted);font-size:15px;margin-bottom:18px}
.rg-stars{display:inline-flex;gap:6px}
.rg-star{background:none;border:0;cursor:pointer;font-size:40px;line-height:1;color:var(--line-2);padding:2px 3px;transition:transform .12s,color .12s}
.rg-star:hover{transform:scale(1.14)}
.rg-star.on{color:#e8b52e;text-shadow:0 2px 8px rgba(232,181,46,.35)}
.rg-out{margin-top:22px;padding-top:22px;border-top:1px solid var(--line);animation:rgFade .3s ease}
@keyframes rgFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rg-emoji{font-size:34px;margin-bottom:6px}
.rg-out>p{color:var(--ink-soft);font-size:15px;margin-bottom:16px;max-width:460px;margin-left:auto;margin-right:auto}
.rg-low input,.rg-low textarea{width:100%;max-width:420px;margin:0 auto 12px;display:block;padding:12px 14px;border:1px solid var(--line);
  border-radius:10px;background:var(--bg);font-family:var(--body);font-size:15px;color:var(--ink)}
.rg-low textarea{resize:vertical}
.rg-low input:focus,.rg-low textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.rg-err{color:#b3261e;font-size:13.5px;margin:-4px auto 12px!important}

/* ===== BẢNG GIÁ + GIỎ CHỌN DỊCH VỤ ===== */
.menu-layout{display:grid;grid-template-columns:1fr 320px;gap:30px;align-items:start}
/* chỉ ép 2 cột khi còn chỗ cho cột giỏ bên phải — máy nhỏ để các @media phía dưới quyết định */
@media(min-width:981px){.menu-layout .svc-grid{grid-template-columns:repeat(2,1fr)}}
.svc-body li .m-add{flex:none;align-self:center;width:26px;height:26px;border:0;border-radius:50%;background:var(--gold);color:#fff;
  font-size:17px;font-weight:600;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  transition:transform .15s,background .15s;box-shadow:0 4px 12px -4px rgba(11,58,111,.5);margin-left:4px}
.svc-body li .m-add:hover{background:var(--gold-d);transform:scale(1.12)}
.svc-body li .m-add.added{background:#3f9d5a;transform:scale(1.2)}
.cart-panel{position:sticky;top:100px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:20px 18px;display:flex;flex-direction:column}
.cart-title{font-family:var(--disp);font-size:20px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:9px;
  padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.cart-count{margin-left:auto;min-width:24px;height:24px;padding:0 7px;border-radius:12px;background:var(--gold);color:#fff;
  font-family:var(--body);font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:center}
.cart-items{display:flex;flex-direction:column;max-height:52vh;overflow-y:auto;margin:0 -4px;padding:4px}
.cart-empty{color:var(--muted);font-size:13.5px;text-align:center;padding:22px 6px;line-height:1.55}
.cart-item{padding:10px 0;border-bottom:1px dashed var(--line)}
.cart-item:last-child{border-bottom:0}
.ci-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.ci-name{font-size:14px;color:var(--ink-soft);font-weight:500;line-height:1.35}
.ci-del{flex:none;border:0;background:none;color:var(--muted);font-size:13px;cursor:pointer;padding:2px;line-height:1}
.ci-del:hover{color:#c0392b}
.ci-bot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:7px}
.ci-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.ci-qty button{width:26px;height:26px;border:0;background:var(--panel-2);color:var(--ink);font-size:16px;line-height:1;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center}
.ci-qty button:hover{background:var(--gold);color:#fff}
.ci-num{min-width:26px;text-align:center;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.ci-price{color:var(--gold);font-size:13.5px;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.cart-foot{border-top:1px solid var(--line);margin-top:6px;padding-top:14px}
.cart-total{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--disp);font-size:18px;font-weight:700;color:var(--ink);margin-bottom:12px}
.cart-total small{font-family:var(--body);font-size:12px;color:var(--muted);font-weight:400}
.cart-total span:last-child{color:var(--gold)}
.cart-book{width:100%;text-align:center;justify-content:center}
.cart-book.is-disabled{opacity:.45;pointer-events:none;filter:grayscale(.3)}
/* nút mở giỏ trên điện thoại */
.cart-fab{display:none;position:fixed;left:18px;bottom:18px;z-index:61;align-items:center;gap:8px;padding:13px 20px;border:0;border-radius:50px;
  background:var(--gold);color:#fff;font-family:var(--body);font-size:13.5px;font-weight:600;cursor:pointer;box-shadow:0 16px 34px -16px rgba(11,58,111,.6)}
.cart-fab.show{display:inline-flex}

/* ===== HIỆN DẦN KHI CUỘN ===== */
.reveal{opacity:0;transform:translateY(26px);transition:.7s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ===== RESPONSIVE ===== */
@media(max-width:1080px){
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .hero-stats div:nth-child(3){border-left:0}
  .hero-stats div:nth-child(n+3){border-top:1px solid rgba(143,208,247,.24)}
}
@media(max-width:980px){
  section{padding:64px 0}
  #features{padding:64px 0}
  .about-grid,.guar-grid,.contact-grid,.hours-grid,.contact-page-grid{grid-template-columns:1fr;gap:34px}
  .svc-grid,.feat-grid,.testi-grid{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .hero-inner{padding:96px 22px 64px}
  .page-banner{padding:134px 22px 89px}
  .page-banner.banner-plain{padding:0;min-height:500px}
  /* giỏ dịch vụ: trên máy nhỏ thành ngăn trượt từ dưới lên */
  .menu-layout{grid-template-columns:1fr}
  .cart-panel{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:62;border-radius:16px 16px 0 0;max-height:78vh;
    transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.8,.2,1);box-shadow:0 -20px 50px -20px rgba(11,58,111,.5)}
  .cart-panel.open{transform:none}
  .cart-items{max-height:44vh}
  .about-imgs img:first-child{margin-top:0}
  .guar-img{max-height:380px}
}
@media(max-width:1024px){
  .nav{padding:10px 0}
  .menu{display:none}
  .burger{display:flex}
  .menu.open{display:flex;position:absolute;top:100%;left:0;right:0;height:auto;margin-top:0;flex-direction:column;align-items:stretch;background:var(--grad);border-bottom:0;box-shadow:var(--shadow);padding:6px 22px 16px;gap:0;z-index:60}
  .menu.open>li{border-bottom:1px solid rgba(255,255,255,.24)}
  .menu.open>li:last-child{border-bottom:0}
  .menu.open>li>a{padding:14px 2px;width:100%;white-space:normal;border-radius:0}
  .menu.open>li>a::after{display:none}
}
@media(max-width:680px){
  section{padding:58px 0}
  #features{padding:58px 0}
  .nav{height:72px;gap:10px}
  header.nav-collapsed .menu.open,.menu.open{top:100%}
  .nav-right{gap:8px}
  .nav-right .call-link{display:none}
  /* nút "Book your treatments" ẩn trên điện thoại — đã có nút nổi ở dưới */
  header .btn-primary{display:none}
  .langsel-main{font-size:13px;padding:7px 26px 7px 10px;background-position:right 9px center}
  .topbar{font-size:11.5px}
  .topbar .wrap{justify-content:center;text-align:center;gap:6px 12px;padding:8px 16px}
  /* điện thoại: địa chỉ xuống dòng bình thường, không đẩy trang rộng ra */
  .tb-info{display:block;line-height:1.5;max-width:100%}
  .langpills{padding:2px 5px 2px 7px;gap:2px;max-width:100%}
  .langpills .lp{font-size:11.5px;padding:4px 8px}
  .kk-logo{width:190px;height:59px}
  .kk-logo.has-img{width:118px;height:58px}
  header .brand{padding:8px 26px 8px 18px}
  header .brand::before{width:162%;height:124%}
  .svc-grid,.feat-grid,.testi-grid,.form-row,.foot-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .hours-card,.form-card,.book-cta{padding:28px 22px}
  .float-book .label{display:none}
  /* Điện thoại (màn đứng): ảnh cao hơn khung nên "cover" lấy TRỌN chiều cao ảnh,
     chỉ hụt 2 bên — vẫn thấy khoảng đen phía trên cho chữ và thấy nail của cả 2 tay. */
  .hero{min-height:88vh}
  .hero-bg img{object-position:center center}
  .hero-inner{padding:44px 20px 40px}
  .hero h1{font-size:34px}
  .hero .slogan{letter-spacing:4px}
  /* Màn đứng chỉ có ~44% chiều cao ảnh là khoảng đen; bỏ câu mô tả dài trong hero
     để tiêu đề + hàng nút nằm trọn trên nền đen, không đè lên bộ nail.
     (Câu mô tả này vẫn còn nguyên ở phần giới thiệu bên dưới và ở thẻ meta.) */
  .hero p.lead{display:none}
  /* Dải số liệu: luật auto-fit minmax(140px,...) ở CSS_EXTRA đẻ ra 3 cột = 464px,
     rộng hơn màn 390px nên ô cuối bị cắt cụt; ép 3 cột CO ĐƯỢC để vừa màn và
     giữ 1 hàng (2 cột thì cao gấp đôi, che mất ảnh). */
  .hero .hero-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero .hero-stats div{padding:16px 8px}
  .hero .hero-stats b{font-size:21px}
  .hero .hero-stats span{font-size:10px;letter-spacing:.12em}
  .brand-strip{font-size:15px;letter-spacing:2px;padding:22px 18px}
}



/* ==========================================================================
   NỀN TRANG — MÀU PHẲNG. Chủ tiệm yêu cầu 30/07/2026: bỏ dải ombre bầu trời,
   bỏ mặt trời góc phải và lớp mây trôi. Giữ nền sáng để thẻ trắng vẫn nổi.
   ========================================================================== */
html{background:var(--cream)}
body{background:transparent}
#features,#services,#gallery,#about,#hours,#testi,#faq,#contact,.brand-strip{background:transparent}
.brand-strip{border-top:1px solid var(--line)}
.sec-head p,.svc-note,.gal-social{color:var(--ink-soft)}

.langpills .lp{display:inline-block;text-decoration:none}
.wrap.bookwrap{max-width:720px}
.hero-stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.book-body{flex:1;overflow-y:auto}
.book-body label{display:block;font-family:var(--body);font-size:12.5px;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--ink-soft);margin:14px 0 5px}
.book-body input,.book-body select,.book-body textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;font:inherit;font-size:15px;background:#fff;color:var(--ink)}
.book-body input:focus,.book-body select:focus{outline:0;border-color:var(--teal)}
.menu-layout .ptbl{width:100%;border-collapse:collapse;margin-top:4px}
.menu-layout .ptbl th{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:right;padding:0 0 8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.menu-layout .ptbl th:first-child{text-align:left;padding-left:0}
.menu-layout .ptbl td{padding:9px 0;border-bottom:1px dashed var(--line);vertical-align:middle;font-size:14.5px;color:var(--ink-soft)}
.menu-layout .ptbl tr:last-child td{border-bottom:0}
.menu-layout .ptbl .pn small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
/* ── TINA NAILS ── ảnh minh hoạ RIÊNG cho từng dịch vụ (cfg.services[].anh) */
.menu-layout .ptbl .pn{display:flex;align-items:center;gap:11px}
.svc-body li>span:first-child{display:flex;align-items:center;gap:11px}
.m-thumb{width:46px;height:46px;flex:none;border-radius:12px;object-fit:cover;background:var(--panel-2);box-shadow:0 3px 10px -4px rgba(var(--deep-rgb),.45)}
@media(max-width:520px){.m-thumb{width:40px;height:40px;border-radius:10px}}
.cc-soc .bk{display:block;margin-top:9px}
.menu-layout .ptbl .pp{text-align:right;white-space:nowrap;color:var(--gold);font-weight:600;padding-left:12px;font-variant-numeric:tabular-nums}
.menu-layout .ptbl .padd{width:34px;text-align:right;padding-left:10px}
.addbtn,.m-add{flex:none;align-self:center;width:26px;height:26px;border:0;border-radius:50%;background:var(--gold);color:#fff;font-size:16px;line-height:1;font-weight:700;cursor:pointer;padding:0;transition:transform .15s,background .15s;box-shadow:0 4px 12px -4px rgba(var(--deep-rgb),.5);margin-left:4px}
.addbtn:hover,.m-add:hover{background:var(--gold-d);transform:scale(1.12)}
.addbtn.ok,.m-add.ok{background:#3f9d5a;transform:scale(1.2)}
.svc-body li>span:first-child small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;font-weight:400}
.bkpop-ov{position:fixed;inset:0;background:rgba(var(--deep-rgb),.55);display:none;align-items:center;justify-content:center;z-index:2000;padding:20px}
.bkpop-ov.open{display:flex;animation:bkfade .22s ease}
@keyframes bkfade{from{opacity:0}to{opacity:1}}
.bkpop-card{background:#fff;border-radius:20px;max-width:392px;width:100%;padding:30px 26px 24px;text-align:center;box-shadow:0 24px 70px rgba(var(--deep-rgb),.32);animation:bkrise .34s cubic-bezier(.2,.9,.3,1.25)}
@keyframes bkrise{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
.bkpop-ic{width:72px;height:72px;border-radius:50%;background:#eaf6ec;margin:0 auto 15px;display:flex;align-items:center;justify-content:center}
.bkpop-ic svg{width:40px;height:40px;stroke:#256b34;stroke-width:3.4;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:32;stroke-dashoffset:32;animation:bkdraw .5s ease .3s forwards}
@keyframes bkdraw{to{stroke-dashoffset:0}}
.bkpop-card h3{margin:0 0 14px;font-size:22px;font-weight:700;color:var(--ink);font-family:var(--disp)}
.bkpop-det{text-align:left;background:var(--panel-2);border:1px solid var(--line);border-radius:13px;padding:10px 15px;margin-bottom:18px;font-size:14.5px}
.bkpop-det>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0}
.bkpop-det>div+div{border-top:1px dashed var(--line)}
.bkpop-det span{color:var(--muted);flex:none}
.bkpop-det b{color:var(--ink);text-align:right;font-weight:700}
.msg{margin-top:14px;padding:13px;border-radius:12px;font-size:14.5px;display:none}
.msg.ok{background:#eaf6ec;color:#256b34;display:block}
.msg.err{background:#fbeceb;color:#a3352b;display:block}


.gb-ov{position:fixed;inset:0;background:rgba(var(--deep-rgb),.55);backdrop-filter:blur(4px);z-index:1000;display:none;align-items:flex-start;justify-content:center;padding:24px;overflow:auto}
.gb-ov.open{display:flex}
.gb-modal{background:#fff;border:1px solid var(--line);border-radius:16px;max-width:500px;width:100%;margin:auto;box-shadow:0 30px 80px -30px rgba(var(--deep-rgb),.55);font-family:'Poppins',system-ui,sans-serif;color:var(--ink);overflow:hidden}
.gb-hd{background:radial-gradient(120% 240% at 6% 0%,rgba(255,255,255,.16),rgba(255,255,255,0) 44%),radial-gradient(100% 220% at 82% 100%,rgba(255,255,255,.12),rgba(255,255,255,0) 48%),var(--grad);color:#fff;padding:20px 22px 0;position:relative;border-bottom:0}
.gb-hd h3{font-family:'Playfair Display',Georgia,serif;margin:0;font-size:22px;font-weight:700;color:#fff;line-height:1.2}
.gb-hd p{margin:5px 0 14px;font-size:12.5px;color:rgba(255,255,255,.88);letter-spacing:.4px}
.gb-x{position:absolute;top:14px;right:16px;background:none;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;opacity:.85;padding:0;width:auto}.gb-x:hover{opacity:1}
.gb-tabs{display:flex;gap:0}
.gb-tab{flex:1;background:none;border:0;color:rgba(255,255,255,.72);font:inherit;font-weight:600;padding:11px 0;cursor:pointer;border-bottom:2px solid transparent}
.gb-tab.on{color:#fff;border-color:#fff}
.gb-stepper{display:flex;gap:6px;justify-content:center;padding:16px 0 0}
.gb-stepper i{width:30px;height:4px;border-radius:3px;background:var(--line-2);transition:.3s} .gb-stepper i.on{background:var(--mag)}
.gb-bd{padding:6px 22px 22px}
.gb-hide{display:none!important}
.gb-label{font-family:'Poppins',system-ui,sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--pur);margin:20px 0 10px}
.gb-cards{display:flex;flex-direction:column;gap:9px}
.gb-card{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:13px 15px;cursor:pointer;color:var(--ink);font-family:inherit;transition:.15s}
.gb-card:hover{border-color:var(--mag)}
.gb-card.sel{border-color:var(--mag);background:var(--panel-2);box-shadow:0 6px 18px -8px rgba(var(--deep-rgb),.3)}
.gb-c-t{font-family:'Poppins',system-ui,sans-serif;font-weight:600;font-size:14.5px}
.gb-c-p{font-family:'Poppins',system-ui,sans-serif;font-weight:700;color:var(--mag);white-space:nowrap;font-size:14px}
.gb-svcsum{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:10px 13px;margin:11px 0 2px;font-size:13.5px;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.gb-svcsum .nm{color:var(--ink);font-weight:600} .gb-svcsum .mt{color:var(--mag);font-weight:700;white-space:nowrap}
.gb-catcard{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:15px 16px;cursor:pointer;color:var(--ink);font-family:'Poppins',system-ui,sans-serif;font-weight:600;font-size:15px;transition:.15s}
.gb-catcard:hover{border-color:var(--mag)}
.gb-catcard.open{border-color:var(--mag);background:var(--panel-2)}
.gb-catcard .ar{color:var(--mag);font-size:17px;transition:.2s;flex:none} .gb-catcard.open .ar{transform:rotate(90deg)}
.gb-catcard .pick{font-size:11.5px;color:var(--mag);font-weight:600;margin-left:auto;margin-right:6px;white-space:nowrap}
.gb-sub{display:none;flex-direction:column;gap:8px;margin:9px 0 2px;padding-left:8px;border-left:2px solid var(--line-2)}
.gb-sub.open{display:flex}
.gb-chips{display:flex;flex-wrap:wrap;gap:8px}
.gb-chip{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:8px 12px;min-width:50px;text-align:center;cursor:pointer;color:var(--ink);font-family:inherit;font-size:13.5px;line-height:1.25;transition:.15s}
.gb-chip:hover{border-color:var(--mag)}
.gb-chip.sel{background:var(--grad);border-color:var(--mag);color:#fff;font-weight:700}
.gb-chip b{display:block;font-size:11px;font-weight:700;opacity:.65} .gb-chip.sel b{opacity:.9}
.gb-chip[hidden]{display:none}
.gb-chip:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.gb-mtabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.gb-mtab{background:transparent;border:1.5px solid var(--line-2);border-radius:999px;padding:7px 15px;cursor:pointer;color:var(--ink-soft);font-family:'Poppins',system-ui,sans-serif;font-weight:600;font-size:13px;transition:.15s}
.gb-mtab:hover{border-color:var(--mag);color:var(--ink)}
.gb-mtab.on{background:var(--panel-2);border-color:var(--mag);color:var(--pur)}
.gb-slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.gb-slot{border:1.5px solid var(--line);background:#fff;color:var(--ink);border-radius:10px;padding:9px 0;flex:1 1 58px;min-width:58px;text-align:center;cursor:pointer;font-size:14px;font-weight:600}
.gb-slot:hover{border-color:var(--mag)} .gb-slot.sel{background:var(--grad);border-color:var(--mag);color:#fff}
.gb-slot.off{opacity:.55;pointer-events:none;text-decoration:line-through;background:var(--bg-alt);color:var(--muted);border-color:var(--line)}
.gb-field{margin-bottom:10px}
.gb-field input,.gb-field textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;font:inherit;background:#fff;color:var(--ink);box-sizing:border-box}
.gb-field input:focus,.gb-field textarea:focus{outline:0;border-color:var(--mag)}
.gb-field input::placeholder,.gb-field textarea::placeholder{color:var(--muted)}
.gb-chk{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:13.5px;color:var(--ink-soft)}
.gb-chk input{width:auto;accent-color:var(--mag)}
.gb-consent{display:flex;align-items:flex-start;gap:10px;margin-top:16px;font-size:12.5px;color:var(--muted);line-height:1.5;cursor:pointer}
.gb-consent input{width:auto;margin-top:2px;flex:none;accent-color:var(--mag)} .gb-consent a{color:var(--pur);font-weight:600}
.gb-addr{color:var(--ink);font-weight:600;margin-bottom:5px}
.gb-msg{font-size:13px;color:var(--muted);margin-top:8px;min-height:16px} .gb-msg.err{color:#c62828} .gb-msg.ok{color:#17794a}
.gb-hint{color:var(--muted);font-size:13px}
.gb-go{display:block;width:100%;margin-top:18px;background:var(--grad);color:#fff;border:0;border-radius:50px;padding:15px;font-weight:700;font-size:15.5px;cursor:pointer;letter-spacing:.3px;font-family:'Poppins',system-ui,sans-serif;transition:.2s;box-shadow:0 14px 28px -16px rgba(var(--deep-rgb),.7)}
.gb-go:hover{filter:brightness(1.07);transform:translateY(-1px)} .gb-go:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none;filter:none}
.gb-alt{width:100%;margin-top:10px;background:transparent;border:1.5px solid var(--line-2);color:var(--pur);border-radius:50px;padding:13px;font-weight:600;cursor:pointer;font-family:'Poppins',system-ui,sans-serif;transition:.2s}
.gb-alt:hover{border-color:var(--mag);background:var(--panel-2)}
.gb-wa{width:100%;margin-top:10px;background:#25d366;border:0;color:#06301a;border-radius:50px;padding:14px;font-weight:700;cursor:pointer;font-family:'Poppins',system-ui,sans-serif;font-size:15px}
.gb-summary{background:var(--bg-alt);border:1px solid var(--line);border-radius:14px;padding:4px 15px;margin:16px 0 2px}
.gb-srow{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px} .gb-srow:last-child{border:0}
.gb-srow span:first-child{color:var(--muted)} .gb-srow span:last-child{font-weight:700;text-align:right;color:var(--ink)}
.gb-ok{text-align:center;padding:26px 22px}.gb-ok .ic{font-size:42px}.gb-ok h3{font-family:'Playfair Display',Georgia,serif;margin:12px 0 10px;color:var(--ink);font-size:clamp(23px,6.4vw,32px);line-height:1.18;font-weight:800;text-transform:uppercase;letter-spacing:.03em}
.gb-ok p{color:var(--ink-soft);font-size:14.5px}
.gb-qr{margin-top:14px;background:var(--bg-alt);border:1px solid var(--line);border-radius:14px;padding:14px;font-size:13.5px;color:var(--ink-soft)}
.gb-qr img{width:210px;max-width:85%;border-radius:10px}
.gb-foot{text-align:center;font-size:12px;color:var(--muted);padding:14px 22px 18px;background:var(--bg-alt);border-top:1px solid var(--line)}.gb-foot a{color:var(--pur);font-weight:700;text-decoration:none}
.gb-bk{border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 14px;margin-bottom:10px;font-size:14px;box-shadow:0 6px 16px -12px rgba(var(--deep-rgb),.4)}
.gb-bk b{font-family:'Playfair Display',Georgia,serif} .gb-bk .cx{float:right;background:none;border:0;color:#c62828;font-size:13px;cursor:pointer;font-weight:600;width:auto;padding:0}
.gb-bk .edb{float:right;margin-right:10px;background:none;border:0;color:var(--pur);font-size:13px;cursor:pointer;font-weight:600;width:auto;padding:0}
.gb-pts{background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:13.5px;margin-bottom:12px;color:var(--ink)}
.gb-counter{display:flex;align-items:center;gap:14px}
.gb-cbtn{width:42px;height:42px;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:var(--mag);font-size:22px;line-height:1;cursor:pointer;font-family:inherit;display:grid;place-items:center}
.gb-cbtn:hover{border-color:var(--mag)} .gb-cbtn:disabled{opacity:.35;cursor:not-allowed}
.gb-cnum{font-size:20px;font-weight:700;min-width:26px;text-align:center;color:var(--ink)}
.gb-clab{font-size:13px;color:var(--muted)}
.gb-edit{margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.gb-edit .gb-label{margin-top:8px}
@media(max-width:600px){.gb-ov{padding:0}.gb-modal{border-radius:0;min-height:100%}.gb-bd{padding:6px 16px 20px}.gb-hd{padding:18px 16px 0}}