/* DECEMBER BEAUTY & ACADEMY · giao diện bản 2 (06/11/2026)
   Học từ Microblading LA: nền tối điện ảnh, một màu nhấn, nhãn nhỏ có vạch, cụm chữ nhấn trong tiêu đề.
   Học từ Amy Jean Brows: nền sáng thoáng, tiêu đề căn giữa, dải trích dẫn màu kem, thẻ ảnh ba cột.
   Màu vẫn là bộ màu chính thức của December (chị duyệt 28/10/2026). */
:root{
  --muc:#151311; --muc-2:#1D1A17; --muc-3:#2A2622;
  --nga:#F8F6F2; --vani:#F3EFE9; --lin:#EBE6DD; --da:#D6D1C8; --chi:#5C5853; --tro:#8F8A82;
  --camel:#A88B6A; --camel-sang:#CDB597; --hongcat:#E8D6CA;
  --mo-1:rgba(248,246,242,.72); --mo-2:rgba(248,246,242,.5); --mo-3:rgba(248,246,242,.16);
  --chu-tieu-de:"League Spartan","Be Vietnam Pro",system-ui,sans-serif;
  --chu-serif:"Cormorant Garamond","Libre Bodoni",Georgia,serif;
  --chu-trich:"Libre Bodoni","Cormorant Garamond",Georgia,serif;
  --chu:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --le:clamp(16px,5vw,72px); --rong:1200px; --dau:72px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nga);color:var(--muc);font-family:var(--chu);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
[id]{scroll-margin-top:calc(var(--dau) + 16px)}
:focus-visible{outline:2px solid var(--camel);outline-offset:3px}
.khung{max-width:var(--rong);margin:0 auto;padding:0 var(--le)}
.hep{max-width:820px}

/* ---------- Chữ nền (League Spartan in hoa của nhận diện gốc; bị kiểu B bên dưới ghi đè trên website) ---------- */
h1,h2,h3{font-family:var(--chu-tieu-de);font-weight:500;text-transform:uppercase;letter-spacing:.045em;line-height:1.28;margin:0}
h1{font-size:clamp(32px,5vw,66px);letter-spacing:.03em;line-height:1.2}
h2{font-size:clamp(24px,3.2vw,42px)}
h3{font-size:clamp(17px,1.5vw,20px);letter-spacing:.06em}
h1 em,h2 em,h3 em{font-style:normal;color:var(--camel)}
.toi h1 em,.toi h2 em,.toi h3 em{color:var(--camel-sang)}
/* ---------- Chữ tiêu đề website: KIỂU B, chị chốt 06/11/2026 (serif mảnh, chữ thường, cụm nhấn nghiêng) ---------- */
h1,h2,h3{font-family:var(--chu-serif);font-weight:400;text-transform:none;letter-spacing:0;line-height:1.16}
h1{font-size:clamp(40px,5.8vw,78px);font-weight:300;line-height:1.1}
h2{font-size:clamp(30px,4vw,54px);font-weight:300}
h3{font-size:clamp(22px,2vw,27px)}
h1 em,h2 em,h3 em{font-style:italic}

.nhan{display:inline-flex;align-items:center;gap:14px;font-size:11px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--camel)}
.nhan::before{content:"";width:34px;height:1px;background:currentColor;opacity:.8}
.giua .nhan::after{content:"";width:34px;height:1px;background:currentColor;opacity:.8}
.toi .nhan{color:var(--camel-sang)}
.nho{font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:500}

.nut{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:0 30px;border-radius:2px;font-family:var(--chu);font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--muc);background:var(--muc);color:var(--nga);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.nut:hover{background:transparent;color:var(--muc)}
.toi .nut,.nut.camel{background:var(--camel);border-color:var(--camel);color:var(--muc)}
.toi .nut:hover,.nut.camel:hover{background:var(--camel-sang);border-color:var(--camel-sang);color:var(--muc)}
.lk{display:inline-flex;align-items:center;gap:12px;font-size:11px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;padding:6px 0;border-bottom:1px solid currentColor}
.lk.vach{border-bottom:0}
.lk.vach::before{content:"";width:28px;height:1px;background:currentColor;opacity:.6}
.lk:hover{color:var(--camel)}
.toi .lk{color:var(--mo-1)}
.toi .lk:hover{color:var(--camel-sang)}

/* ---------- Nhịp phần ---------- */
.phan{padding:clamp(72px,9vw,128px) 0}
.toi{background:var(--muc);color:var(--nga)}
.toi p{color:var(--mo-1)}
.kem{background:var(--vani)}
.lin{background:var(--lin)}
.dau-phan{margin-bottom:clamp(36px,5vw,64px)}
.dau-phan h2{margin-top:18px}
.dau-phan p{margin:18px 0 0;color:var(--chi);max-width:60ch}
.toi .dau-phan p{color:var(--mo-1)}
.giua{text-align:center}
.giua .dau-phan p,.giua.dau-phan p{margin-left:auto;margin-right:auto}

/* ---------- Dải bản nháp ---------- */
.nhap{background:#0c0b0a;color:var(--mo-1);font-size:11px;letter-spacing:.08em;padding:7px var(--le);display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;align-items:center;position:relative;z-index:41}

/* ---------- Đầu trang ---------- */
.dau{position:sticky;top:0;z-index:40;background:rgba(21,19,17,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--mo-3);color:var(--nga)}
.dau .khung{max-width:none;display:flex;align-items:center;justify-content:space-between;height:var(--dau);gap:20px}
.dau .logo img{height:40px;width:auto}
.dau nav{display:flex;align-items:center;gap:clamp(14px,2.2vw,34px)}
.dau nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--nga)}
.dau nav a:hover{color:var(--camel-sang)}
.dau .nut{min-height:38px;padding:0 20px;background:var(--camel);border-color:var(--camel);color:var(--muc);letter-spacing:.28em}
.dau .nut:hover{background:var(--camel-sang);border-color:var(--camel-sang);color:var(--muc)}
.mo-menu{display:none;background:none;border:1px solid var(--mo-2);height:38px;padding:0 14px;font:inherit;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--nga);cursor:pointer;border-radius:2px}

/* ---------- Mở đầu (Microblading LA) ---------- */
.mo-dau{position:relative;background:var(--muc);color:var(--nga);min-height:min(calc(100vh - var(--dau)),820px);display:grid;align-items:center;overflow:hidden}
.mo-dau .hinh{position:absolute;inset:0 0 0 42%}
.mo-dau .hinh img{width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.mo-dau .hinh::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--muc) 0%,rgba(21,19,17,.72) 28%,rgba(21,19,17,.2) 58%,rgba(21,19,17,.86) 100%),linear-gradient(0deg,rgba(21,19,17,.75) 0%,rgba(21,19,17,0) 34%)}
.mo-dau .khung{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end;padding-top:72px;padding-bottom:72px}
.mo-dau h1{margin:26px 0 24px;max-width:13.5em}
.mo-dau .dan{max-width:50ch;color:var(--mo-1);font-size:15px;margin-bottom:34px}
.mo-dau .dan strong{color:var(--nga);font-weight:600}
.mo-dau .hanh-dong{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}
.chi-so{display:grid;gap:26px;text-align:right}
.chi-so div{padding-right:20px;border-right:1px solid var(--camel)}
.chi-so{text-shadow:0 1px 16px rgba(21,19,17,.9)}
.chi-so b{display:block;font-family:var(--chu-serif);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1.15;color:var(--nga)}
.chi-so span{display:block;margin-top:6px;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--mo-1)}
.cuon{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--mo-2)}

/* ---------- Dải nơi đã xuất hiện ---------- */
.dai{background:var(--muc);color:var(--mo-2);border-top:1px solid var(--mo-3);border-bottom:1px solid var(--mo-3);padding:22px var(--le);display:flex;flex-wrap:wrap;justify-content:center;gap:8px 34px;font-size:11px;letter-spacing:.28em;text-transform:uppercase;line-height:1.8;text-align:center}
.dai b{color:var(--camel-sang);font-weight:500}

/* ---------- Người sáng lập (Microblading LA) ---------- */
.sang-lap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,6vw,96px);align-items:center}
.sang-lap .hinh{aspect-ratio:4/5;overflow:hidden;background:var(--muc-2)}
.sang-lap .hinh img{width:100%;height:100%;object-fit:cover}
.sang-lap h2{margin:20px 0 14px}
.sang-lap .dong{color:var(--nga);font-weight:500;font-size:16px;margin-bottom:18px}
.ba-so{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:38px 0 34px;padding-top:30px;border-top:1px solid var(--mo-3)}
.ba-so b{display:block;font-family:var(--chu-serif);font-weight:400;font-size:clamp(30px,3.2vw,42px);line-height:1.1}
.ba-so span{display:block;margin-top:8px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--mo-2);line-height:1.7}

/* ---------- Uy tín: từng sự kiện ---------- */
.uy-tin{position:relative;background:var(--muc);color:var(--nga);overflow:hidden}
.uy-tin .nen{position:absolute;inset:0}
.uy-tin .nen img{width:100%;height:100%;object-fit:cover;filter:grayscale(.35)}
.uy-tin .nen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,19,17,.9) 0%,rgba(21,19,17,.8) 30%,rgba(21,19,17,.95) 62%,var(--muc) 100%)}
.uy-tin .khung{position:relative}
.su-kien{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.su-kien article{background:rgba(29,26,23,.92);border:1px solid var(--mo-3);display:flex;flex-direction:column}
.su-kien .anh{aspect-ratio:4/5;overflow:hidden;background:#0e0d0c;position:relative}
.su-kien .anh img{width:100%;height:100%;object-fit:cover}
.su-kien .tai-lieu img{object-fit:contain}
.su-kien .nam{position:absolute;left:16px;bottom:10px;font-family:var(--chu-serif);font-size:44px;line-height:1;color:var(--nga);text-shadow:0 2px 18px rgba(0,0,0,.7)}
.su-kien .chu-only{display:flex;align-items:flex-end;background:linear-gradient(160deg,var(--muc-3),#0e0d0c)}
.su-kien .than{padding:20px 20px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.su-kien .vai{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--camel-sang);line-height:1.7}
.su-kien h3{font-size:16px;letter-spacing:.05em;line-height:1.4}
.su-kien h3{font-size:23px;line-height:1.2}
.su-kien p{font-size:14px;line-height:1.65;margin:0;color:var(--mo-1);flex:1}
.su-kien .ngay{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mo-2);padding-top:12px;border-top:1px solid var(--mo-3)}
.chu-thich{margin-top:28px;font-size:13px;color:var(--mo-2);max-width:78ch}

/* ---------- Dịch vụ (Amy Jean) ---------- */
.the-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.the-3 article{text-align:center}
.the-3 .anh{aspect-ratio:1/1;overflow:hidden;background:var(--lin);margin-bottom:26px}
.the-3 .anh img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.the-3 article:hover .anh img{transform:scale(1.03)}
.the-3 .loai{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--camel);display:block;margin-bottom:10px}
.the-3 p{color:var(--chi);font-size:15px;max-width:34ch;margin:12px auto 18px}
.hang{margin-top:clamp(48px,6vw,80px);border-top:1px solid var(--muc)}
.hang a{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,2fr) auto;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--da)}
.hang a:hover h3{color:var(--camel)}
.hang .stt{font-family:var(--chu-serif);font-size:22px;color:var(--camel)}
.hang p{margin:0;color:var(--chi);font-size:15px}
.hang .den{font-size:11px;letter-spacing:.24em;text-transform:uppercase;white-space:nowrap}
.ghi-chu{margin-top:30px;font-size:14px;color:var(--chi);text-align:center}

/* ---------- Dải trích dẫn (Amy Jean) ---------- */
.trich{background:var(--vani);text-align:center;padding:clamp(72px,9vw,120px) var(--le)}
.trich blockquote{margin:0 auto;max-width:22em;font-family:var(--chu-trich);font-style:italic;font-weight:400;font-size:clamp(24px,3.2vw,40px);line-height:1.4}
.trich cite{display:block;margin-top:26px;font-style:normal;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--chi)}

/* ---------- Kết quả: bộ ba (Microblading LA) ---------- */
.bo-ba{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.bo-ba figure{margin:0;position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--muc-2)}
.bo-ba img{width:100%;height:100%;object-fit:cover;opacity:.55}
.bo-ba figure.that img{opacity:.92}
.bo-ba figcaption{position:absolute;left:20px;top:18px;right:20px}
.bo-ba figcaption b{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;color:var(--camel-sang)}
.bo-ba figcaption b::before{content:"";width:26px;height:1px;background:currentColor}
.bo-ba figcaption span{display:block;margin:6px 0 0 38px;font-size:13px;color:var(--nga)}
.bo-ba .tam{position:absolute;left:20px;right:20px;bottom:18px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--mo-2);border-top:1px solid var(--mo-3);padding-top:10px}
.loi{margin:44px auto 0;max-width:62ch;text-align:center}

/* ---------- Dải xử lý nền cũ ---------- */
.dai-cu{background:var(--muc-2);border-top:1px solid var(--mo-3);border-bottom:1px solid var(--mo-3);padding:clamp(56px,7vw,88px) 0}
.dai-cu .khung{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center}
.dai-cu p{margin:14px 0 0;max-width:60ch}

/* ---------- Danh sách đánh số ---------- */
.hai{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,6vw,96px);align-items:start}
.ds{margin:0;padding:0;border-top:1px solid var(--muc)}
.ds li{list-style:none;display:grid;grid-template-columns:52px 1fr;padding:20px 0;border-bottom:1px solid var(--da)}
.ds .stt{font-family:var(--chu-serif);font-size:22px;color:var(--camel);line-height:1.3}
.ds strong{font-weight:600}
.ds small{display:block;color:var(--chi);font-size:14px;margin-top:2px}
.toi .ds{border-color:var(--mo-2)}
.toi .ds li{border-color:var(--mo-3)}
.toi .ds small{color:var(--mo-1)}
.toi .ds .stt{color:var(--camel-sang)}
.buoc{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;margin:clamp(48px,6vw,72px) 0 0;padding:0;border-top:1px solid var(--muc)}
.buoc li{list-style:none;padding:22px 16px 0 0}
.buoc .stt{font-family:var(--chu-serif);font-size:30px;color:var(--camel);display:block;line-height:1;margin-bottom:12px}
.buoc b{display:block;font-size:14px;font-weight:600;line-height:1.45}
.buoc span{display:block;font-size:13px;color:var(--chi);margin-top:6px;line-height:1.55}

/* ---------- Không gian (Amy Jean: ảnh tràn, chữ giữa) ---------- */
.khong-gian{position:relative;display:grid;grid-template-columns:repeat(3,1fr);background:var(--muc)}
.khong-gian figure{margin:0;aspect-ratio:3/4;overflow:hidden}
.khong-gian img{width:100%;height:100%;object-fit:cover}
.khong-gian::after{content:"";position:absolute;inset:0;background:rgba(21,19,17,.46)}
.khong-gian .chu{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--nga);padding:0 var(--le);gap:18px}
.khong-gian .chu p{max-width:54ch;margin:0;color:var(--mo-1)}
.khong-gian .nhan{color:var(--camel-sang)}

/* ---------- Thư viện kiến thức ---------- */
.tu-khoa{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 auto clamp(36px,5vw,56px);max-width:940px}
.tu-khoa a,.tu-khoa button{font:inherit;font-size:13px;color:var(--muc);background:transparent;border:1px solid var(--da);padding:8px 16px;border-radius:999px;cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.tu-khoa a:hover,.tu-khoa button:hover{border-color:var(--muc)}
.tu-khoa button[aria-pressed="true"]{background:var(--muc);border-color:var(--muc);color:var(--nga)}
.bai{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,3vw,44px)}
.bai a{display:flex;flex-direction:column;gap:10px;padding:26px 0 30px;border-top:1px solid var(--muc)}
.bai .loai{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--camel)}
.bai h3{font-family:var(--chu);text-transform:none;letter-spacing:0;font-size:18px;font-weight:600;line-height:1.45}
.bai h3{font-family:var(--chu-serif);font-size:25px;font-weight:400;line-height:1.22}
.bai a:hover h3{color:var(--camel)}
.bai p{margin:0;font-size:14px;color:var(--chi);line-height:1.65}
.bai .phu{margin-top:auto;padding-top:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tro)}
.o-tim{display:block;width:min(100%,560px);margin:0 auto 26px;font:inherit;font-size:15px;padding:14px 18px;border:1px solid var(--da);background:#fff;border-radius:2px;color:var(--muc)}
.o-tim:focus{outline:none;border-color:var(--muc)}
.dem{text-align:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--tro);margin-bottom:26px}
.trong{display:none;text-align:center;color:var(--chi);padding:40px 0}

/* ---------- Trang bài viết ---------- */
.duong-dan{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tro);padding:28px 0 0}
.duong-dan a:hover{color:var(--camel)}
.duong-dan span{margin:0 10px;opacity:.6}
.bai-viet{padding:36px 0 clamp(72px,9vw,120px)}
.bai-viet header{margin-bottom:34px}
.bai-viet h1{font-size:clamp(28px,3.8vw,48px);margin:18px 0 20px;line-height:1.24}
.bai-viet h1{font-size:clamp(36px,4.8vw,62px)}
.tac-gia{font-size:13px;color:var(--chi);display:flex;flex-wrap:wrap;gap:6px 18px}
.tac-gia b{color:var(--muc);font-weight:600}
.tra-loi{background:var(--vani);border-left:2px solid var(--camel);padding:24px 28px;margin:0 0 34px}
.tra-loi .nho{color:var(--camel);display:block;margin-bottom:8px}
.tra-loi p{margin:0;font-size:17px;line-height:1.75}
.muc-luc{border:1px solid var(--da);padding:22px 26px;margin:0 0 40px}
.muc-luc .nho{color:var(--chi);display:block;margin-bottom:10px}
.muc-luc ol{margin:0;padding-left:20px;font-size:15px;line-height:1.9}
.muc-luc a:hover{color:var(--camel)}
.noi-dung h2{font-size:clamp(20px,2.2vw,27px);margin:46px 0 14px;line-height:1.35}
.noi-dung h2{font-size:clamp(28px,3vw,38px)}
.noi-dung h3{margin:30px 0 10px}
.noi-dung p,.noi-dung li{font-size:17px;line-height:1.85}
.noi-dung ul,.noi-dung ol{padding-left:22px;margin:0 0 1.2em}
.noi-dung li{margin-bottom:6px}
.noi-dung a{border-bottom:1px solid var(--camel)}
.noi-dung table{width:100%;border-collapse:collapse;margin:0 0 1.4em;font-size:15px}
.noi-dung th,.noi-dung td{border-bottom:1px solid var(--da);padding:10px 12px 10px 0;text-align:left;vertical-align:top}
.noi-dung th{font-weight:600;border-bottom-color:var(--muc)}
.luu-y{font-size:14px;color:var(--chi);font-style:italic;margin-top:30px}
.keu-goi{background:var(--muc);color:var(--nga);padding:clamp(28px,4vw,44px);margin-top:48px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center}
.keu-goi h2{font-size:clamp(20px,2.2vw,28px)}
.keu-goi p{margin:10px 0 0;color:var(--mo-1);font-size:15px}
.lien-quan{margin-top:56px}
.lien-quan .bai{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---------- Hỏi đáp ---------- */
details{border-bottom:1px solid var(--da)}
details:first-of-type{border-top:1px solid var(--muc)}
summary{cursor:pointer;list-style:none;padding:20px 44px 20px 0;font-weight:600;font-size:17px;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-family:var(--chu-serif);font-size:26px;color:var(--camel)}
details[open] summary::after{content:"–"}
details p{color:var(--chi);padding:0 44px 22px 0;max-width:70ch;margin:0}

/* ---------- Đặt lịch ---------- */
.dat-lich .hai{align-items:center}
.dat-lich h2{margin:20px 0 22px}
form{background:var(--nga);color:var(--muc);padding:clamp(24px,3vw,40px);display:grid;gap:18px}
label{display:grid;gap:6px;font-size:13px;font-weight:500}
input,select,textarea{font:inherit;font-size:15px;color:var(--muc);background:#fff;border:1px solid var(--da);padding:13px 14px;border-radius:2px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--muc)}
.hai-o{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.dong-y{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--chi);font-size:13px}
.dong-y input{width:18px;height:18px;margin-top:3px;flex:none}
form .nut{background:var(--muc);border-color:var(--muc);color:var(--nga)}
form .nut:hover{background:var(--camel);border-color:var(--camel);color:var(--muc)}
.bao{display:none;padding:14px 16px;background:var(--lin);font-size:14px;color:var(--muc)}
.bao.hien{display:block}

/* ---------- Chân trang ---------- */
footer{background:#0c0b0a;color:var(--mo-1);padding:72px 0 104px;font-size:14px}
footer .luoi{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
footer img{height:52px;width:auto;margin-bottom:20px}
footer h3{font-family:var(--chu)!important;text-transform:uppercase!important;font-size:10px!important;letter-spacing:.3em!important;font-weight:600!important;color:var(--camel-sang);margin-bottom:16px}
footer a:hover{color:var(--nga)}
footer ul{margin:0;padding:0}
footer li{list-style:none;margin-bottom:9px}
.cuoi{margin-top:52px;padding-top:22px;border-top:1px solid var(--mo-3);color:var(--mo-2);font-size:12px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.thanh-noi{display:none}

/* ---------- Đầu trang con (thư viện, bài viết) ---------- */
.dau-con{background:var(--muc);color:var(--nga);padding:clamp(56px,7vw,96px) 0;text-align:center}
.dau-con h1{margin:20px auto 16px;max-width:16em;font-size:clamp(30px,4.4vw,56px)}
.dau-con p{color:var(--mo-1);max-width:58ch;margin:0 auto}

@media (max-width:1020px){
  .dau nav{display:none;position:absolute;top:var(--dau);left:0;right:0;background:var(--muc);border-bottom:1px solid var(--mo-3);flex-direction:column;align-items:stretch;gap:0;padding:6px var(--le) 22px}
  .dau nav.mo{display:flex}
  .dau nav a{padding:15px 0;border-bottom:1px solid var(--mo-3)}
  .dau nav a.nut{margin-top:16px;border:1px solid var(--camel)}
  .mo-menu{display:block}
  .mo-dau .hinh{inset:0}
  .mo-dau .hinh::after{background:linear-gradient(180deg,rgba(21,19,17,.55) 0%,rgba(21,19,17,.82) 55%,var(--muc) 100%)}
  .mo-dau .khung{grid-template-columns:1fr;align-items:start}
  .chi-so{grid-template-columns:repeat(3,minmax(0,1fr));text-align:left;gap:16px;margin-top:8px}
  .chi-so div{border-right:0;border-left:1px solid var(--camel);padding:0 0 0 14px}
  .cuon{display:none}
  .sang-lap,.hai{grid-template-columns:1fr}
  .su-kien{grid-template-columns:repeat(2,minmax(0,1fr))}
  .the-3,.bai{grid-template-columns:repeat(2,minmax(0,1fr))}
  .buoc{grid-template-columns:repeat(3,minmax(0,1fr))}
  .buoc li{padding-bottom:18px}
  .hang a{grid-template-columns:44px 1fr;row-gap:6px}
  .hang p{grid-column:2}
  .hang .den{grid-column:2}
  .dai-cu .khung,.keu-goi{grid-template-columns:1fr}
  footer .luoi{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .su-kien,.the-3,.bai,.bo-ba,.hai-o,.lien-quan .bai{grid-template-columns:1fr}
  .buoc{grid-template-columns:1fr 1fr}
  .ba-so{gap:14px}
  .chi-so b{font-size:22px}
  .chi-so span{letter-spacing:.16em}
  .khong-gian{grid-template-columns:1fr}
  .khong-gian figure{aspect-ratio:4/3}
  .khong-gian figure:nth-child(n+2){display:none}
  .mo-dau .hanh-dong .nut{flex:1 1 100%}
  .bo-ba figure{aspect-ratio:4/3}
  footer .luoi{grid-template-columns:1fr}
  .thanh-noi{display:grid;grid-template-columns:1fr 1fr 1.4fr;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--muc);border-top:1px solid var(--mo-3)}
  .thanh-noi a{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;text-align:center;padding:16px 6px 15px;color:var(--nga);border-right:1px solid var(--mo-3)}
  .thanh-noi a:last-child{background:var(--camel);color:var(--muc);border-right:0}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.the-3 .anh img{transition:none}}
@media (max-width:640px){
  .chi-so{grid-template-columns:1fr;gap:14px}
  .su-kien .anh.chu-only{aspect-ratio:16/7}
}

/* ---------- Bổ sung 06/11/2026: mở đầu hai đoạn, phần Quy mô, dòng liên hệ ---------- */
.mo-dau .dan{margin-bottom:14px}
.mo-dau .dan.phu{font-size:14px}
.mo-dau .hanh-dong{margin-top:30px}
.the-3.bon{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px) clamp(16px,2vw,30px)}
.the-3.bon .anh{aspect-ratio:4/5;margin-bottom:22px}
/* Phòng Treatment: một hàng riêng, khung ngang 3:2 để thấy đủ bốn giường (07/11/2026) */
.the-3.bon>article:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;text-align:left}
.the-3.bon>article:first-child .anh{aspect-ratio:3/2;margin-bottom:0}
.the-3.bon>article:first-child p{max-width:46ch;margin:12px 0 0}
.the-3.bon p{font-size:14px;max-width:30ch}
.anh.cho-anh{display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--chi);font-size:14px;background:var(--lin);border:1px dashed var(--da)}
.sang-lap p{font-size:15px}
.lien-he-nhanh{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.lien-he-nhanh span{font-size:13px;color:var(--mo-1);letter-spacing:.04em}
@media (max-width:1020px){.the-3.bon{grid-template-columns:repeat(2,minmax(0,1fr))}.the-3.bon>article:first-child{grid-template-columns:1fr;gap:22px}}
@media (max-width:640px){.the-3.bon{grid-template-columns:1fr}.the-3.bon .anh{aspect-ratio:4/3}.the-3.bon>article:first-child .anh{aspect-ratio:3/2}}

/* ---------- Thư viện theo hành trình khách hàng (06/11/2026) ---------- */
.hanh-trinh{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border-top:1px solid var(--muc);margin:0 0 clamp(36px,5vw,56px)}
.hanh-trinh a{display:flex;flex-direction:column;gap:8px;padding:22px 18px 24px 0;border-bottom:1px solid var(--da)}
.hanh-trinh .stt{font-family:var(--chu-serif);font-size:30px;line-height:1;color:var(--camel)}
.hanh-trinh b{font-size:16px;font-weight:600;line-height:1.35}
.hanh-trinh span:not(.stt){font-size:13px;color:var(--chi);line-height:1.55;flex:1}
.hanh-trinh i{font-style:normal;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--tro)}
.hanh-trinh a:hover b{color:var(--camel)}
.tu-khoa.gd{margin-bottom:14px}
.tu-khoa.gd button{font-size:14px;padding:10px 18px}
.gd-mo-ta{text-align:center;color:var(--chi);font-size:15px;max-width:60ch;margin:0 auto 28px;min-height:1.75em}
@media (max-width:1020px){.hanh-trinh{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.hanh-trinh{grid-template-columns:1fr 1fr}.hanh-trinh a{padding-right:14px}}

/* ---------- Video (08/11/2026): thẻ bìa + nút phát, bấm mới nạp video ---------- */
.video-luoi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3vw,40px) clamp(20px,3vw,36px);align-items:start}
.video-noi-bat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3vw,40px) clamp(20px,3vw,36px);align-items:start}
.video-noi-bat .video-the.to{grid-column:1/-1}
.video-the{text-align:center}
.video-the .loai{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--camel);display:block;margin:18px 0 8px}
.video-the h3{font-size:clamp(20px,2vw,26px);margin:0}
.video-the p{color:var(--chi);font-size:15px;max-width:40ch;margin:10px auto 0}
.video-mo{display:block;position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--muc-2);border:0;padding:0;cursor:pointer;margin:0 auto}
.video-the.doc .video-mo{aspect-ratio:9/16;max-width:min(100%,360px)}
.video-the.to .video-mo{max-height:min(68vh,620px);aspect-ratio:auto;height:clamp(240px,42vw,620px)}
.video-mo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s,opacity .3s}
.video-mo:hover img{transform:scale(1.03)}
.video-mo .phat{position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(21,19,17,.72);border:1px solid var(--camel-sang)}
.video-mo .phat::after{content:"";position:absolute;left:28px;top:22px;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent var(--nga)}
.video-mo:hover .phat{background:var(--camel)}
.video-mo .dai{position:absolute;right:12px;bottom:12px;font-size:11px;letter-spacing:.14em;color:var(--nga);background:rgba(21,19,17,.72);padding:4px 8px}
.video-mo:focus-visible{outline:2px solid var(--camel);outline-offset:3px}
.video-the video,.video-the iframe{display:block;width:100%;height:100%;background:#000;border:0}
.video-the.doc video{max-width:min(100%,360px);margin:0 auto;aspect-ratio:9/16}
.video-the .khung-phat{position:relative;width:100%;aspect-ratio:16/9;background:#000;margin:0 auto}
.video-the.doc .khung-phat{aspect-ratio:9/16;max-width:min(100%,360px)}
.video-the.to .khung-phat{height:clamp(240px,42vw,620px);aspect-ratio:auto}
.video-bai{margin:28px 0 8px}
.video-bai .video-the{text-align:left}
.video-bai .video-the.doc .video-mo,.video-bai .video-the.doc .khung-phat{margin:0}
.video-bai .video-the .loai{margin-top:12px}
.video-bai .video-the h3{font-size:20px}
.video-bai figcaption{font-size:14px;color:var(--chi);margin-top:10px}
.video-bai figcaption a{color:var(--muc)}
.toi .video-the .loai{color:var(--camel-sang)}
.toi .video-the p{color:var(--da)}
@media (max-width:900px){.video-luoi,.video-noi-bat{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.video-luoi,.video-noi-bat{grid-template-columns:1fr}.video-the.to .video-mo,.video-the.to .khung-phat{height:auto;aspect-ratio:16/9}}

