/* labiance.vn, theo Catalogue 2026. Một ý duy nhất: chai đen trong phòng kính trắng bạch kim.
   Ba màu của nhãn hàng: trắng, đen, bạch kim. Một họ chữ UTM Avo, Regular và Bold, tiêu đề in hoa hai tông xám và đen (hồ sơ thương hiệu mục 5).
   UTM Avo không có các ký tự: gạch dài, chấm giữa, mũi tên, dấu nhân, dấu độ, chỉ số dưới, ký hiệu đồng. Chữ trên web tránh các ký tự này; công thức hóa học dùng thẻ sub. */
@font-face{font-family:"UTM Avo";src:url(fonts/UTM-Avo.woff2?v=e05bf204) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"UTM Avo";src:url(fonts/UTM-AvoBold.woff2?v=8b909733) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Avo Thay";src:local("Arial"),local("Helvetica");font-weight:400;size-adjust:111%}
@font-face{font-family:"Avo Thay";src:local("Arial Bold"),local("Helvetica Bold");font-weight:700;size-adjust:109%}
:root{
  color-scheme:light;
  --f:"UTM Avo","Avo Thay",Arial,sans-serif;
  --paper:#F6F7F8;--black:#060607;
  --wall-a:#EEF0F2;--wall-b:#D7DADD;--floor-a:#F9FAFA;--floor-b:#ECEEF0;
  --gut:max(20px,env(safe-area-inset-left,0px),4vw);--gur:max(20px,env(safe-area-inset-right,0px),4vw);
  --sec:clamp(64px,9vw,140px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --fg:#141414;--tx:#2C2F33;--mute:#5A6067;--gr:#7E858C;--line:rgba(20,20,20,.16);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--tx);font:400 16px/1.65 var(--f);overflow-wrap:break-word}
a{color:inherit}
img,svg{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,p,ul,ol,dl,dd,figure,address{margin:0;font-style:normal}
ul,ol{padding:0;list-style:none}
h1,h2,h3{font-weight:700;color:var(--fg);text-wrap:balance}
b{font-weight:700}
sub{font-size:.72em;line-height:0}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.on-paper{background:var(--paper);--fg:#141414;--tx:#2C2F33;--mute:#5A6067;--gr:#7E858C;--line:rgba(20,20,20,.16);color:var(--tx)}
.on-black{background:var(--black);--fg:#F6F7F8;--tx:#D5D8DC;--mute:#A4AAB1;--gr:#8A9198;--line:rgba(246,247,248,.2);color:var(--tx)}
.pad{padding-left:var(--gut);padding-right:var(--gur)}
.draft{padding:6px var(--gur) 6px var(--gut);background:var(--black);color:#A4AAB1;font-size:11px;letter-spacing:.04em}
.nb{white-space:nowrap}
.lab{font:700 11px/1.5 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.t{font-weight:400;text-transform:uppercase;color:var(--gr)}
.t b{display:block;color:var(--fg)}
.d1{font-size:clamp(27px,4.4vw,78px);line-height:1.14}
.d2{font-size:clamp(25px,3.5vw,58px);line-height:1.16}
.d3{font-size:clamp(20px,1.8vw,28px);line-height:1.25}
.lead{font-size:clamp(16px,1.2vw,18px);line-height:1.65;color:var(--mute);max-width:46ch}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border:1.5px solid currentColor;background:none;color:var(--fg);font:700 12px/1.2 var(--f);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;text-align:center;transition:background-color .4s,color .4s,border-color .4s}
.on-paper .btn:hover{background:#141414;color:#F6F7F8;border-color:#141414}
.on-black .btn:hover{background:#F6F7F8;color:#141414;border-color:#F6F7F8}
.btn.solid{background:#141414;color:#F6F7F8;border-color:#141414}
.on-paper .btn.solid:hover{background:none;color:#141414}
.on-black .btn.solid{background:#F6F7F8;color:#141414;border-color:#F6F7F8}
.on-black .btn.solid:hover{background:none;color:#F6F7F8}
.tlink{display:inline-flex;align-items:center;min-height:44px;font:700 12px/1.3 var(--f);letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px;color:var(--fg)}
.js .rv{opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}
/* Căn phòng hiện liền một khối, chỉ từng chai hiện dần */
.js .rb img{opacity:0;transform:translateX(-50%) translateY(6%) rotate(7deg);transition:opacity 1s var(--ease) var(--d,0ms),transform 1.1s var(--ease) var(--d,0ms)}
.js .rb.in img{opacity:1;transform:translateX(-50%) rotate(7deg)}
.js .rb.in a:hover img{transform:translateX(-50%) translateY(-5%) rotate(3deg);transition-delay:0ms}

/* Đầu trang */
.top{position:relative;z-index:30;background:var(--paper);color:#141414}
.top-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:8px var(--gur) 8px var(--gut)}
.logo{display:block;width:118px;height:44px;background:currentColor;-webkit-mask:url(img/logo.png?v=e542eb13) center/contain no-repeat;mask:url(img/logo.png?v=e542eb13) center/contain no-repeat}
.nav-l,.nav-r{display:flex;align-items:center;gap:26px}
.nav-r{justify-content:flex-end}
.nav-l a,.nav-r a,.menu summary{font:700 11px/1.2 var(--f);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.nav-l a:hover,.nav-r a:hover,.nav-l a[aria-current]{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
.nav-l,.nav-r .wide{display:none}
.nav-l a,.nav-r a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
.nav-r .wide{gap:28px}
.menu summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;list-style:none;position:relative;z-index:2}
.menu summary::-webkit-details-marker{display:none}
.menu summary::after{content:"Menu"}
.menu[open] summary{color:#F6F7F8}
.menu[open] summary::after{content:"Đóng"}
.menu-p{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:88px var(--gur) 40px var(--gut);background:var(--black);color:#F6F7F8;overflow:auto}
.menu-p a{display:block;padding-block:8px;font:700 clamp(25px,7.4vw,38px)/1.2 var(--f);text-transform:uppercase;text-decoration:none}
.menu-p small{display:block;margin-top:26px;font:400 14px/1.7 var(--f);color:#A4AAB1}
.menu-p small a{display:inline;padding:0;font:inherit;text-transform:none;text-decoration:underline;text-underline-offset:4px}
@media(min-width:1000px){
  .menu{display:none}
  .nav-l,.nav-r .wide{display:flex}
  .top-in{padding-block:14px}
  .logo{width:146px}
}
@media(min-width:1000px) and (max-width:1199px){
  .nav-l,.nav-r,.nav-r .wide{gap:16px}
  .nav-l a,.nav-r a{letter-spacing:.07em}
}

/* Màn đầu: chữ ở trên, ảnh bốn chai trong phòng kính ở dưới, không đè chữ lên ảnh */
.hero-t{padding-block:clamp(6px,1.4vw,22px) clamp(20px,2.6vw,40px)}
.hero-k{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;margin-bottom:4px}
.hero-a{display:none}
.hero-i img{width:100%;height:auto}
@media(min-width:480px){.hero-a{display:inline-flex}}

/* Một câu */
.say{display:grid;gap:14px;padding-block:var(--sec)}
@media(min-width:1000px){.say{grid-template-columns:minmax(0,8fr) minmax(0,4fr);align-items:end;gap:64px}}

/* Bộ sưu tập: một căn phòng liền, cả 4 chai cùng góc, cùng ánh sáng */
.coll{padding-bottom:var(--sec)}
.coll-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.coll-g li{min-width:0}
.coll-g a{display:block;height:100%;text-decoration:none}
.coll-b{position:relative;overflow:hidden;aspect-ratio:2/3;background:linear-gradient(180deg,var(--wall-a) 0,var(--wall-b) 67%,var(--floor-a) 67%,var(--floor-b) 100%)}
.coll-b img{position:absolute;left:50%;top:8%;width:auto;height:66%;max-width:none;transform:translateX(-50%) rotate(7deg);transition:transform 1.1s var(--ease)}
.coll-b::after{content:"";position:absolute;left:50%;top:80%;width:52%;height:5.4%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(20,22,24,.42),rgba(20,22,24,0));transition:transform 1.1s var(--ease),opacity 1.1s var(--ease)}
.coll-g a:hover img{transform:translateX(-50%) translateY(-5%) rotate(3deg)}
.coll-g a:hover .coll-b::after{transform:translateX(-50%) scale(.82);opacity:.72}
.coll-c{padding:14px 14px 30px var(--gut)}
.coll-c h3{margin-top:5px;font-size:clamp(14px,4vw,16px);line-height:1.28}
.coll-k{display:block;margin-top:5px;font-size:13.5px;line-height:1.45;color:var(--mute)}
.coll-p{display:block;margin-top:9px;font:700 14px/1.4 var(--f);color:var(--fg)}
.coll-p span{margin-left:8px;font-weight:400;color:var(--mute)}
.coll-n{margin-top:clamp(24px,3vw,40px);font-size:13px;line-height:1.55;color:var(--mute)}
.coll-x{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;padding:24px 14px 24px var(--gut)}
.coll-x .tlink{display:inline-flex;height:auto;text-decoration:underline;text-decoration-thickness:1.5px}
@media(min-width:700px){.coll-g{grid-template-columns:repeat(3,minmax(0,1fr))}.coll-c{padding:16px 16px 30px var(--gut)}}
@media(min-width:1200px){.coll-g{grid-template-columns:repeat(5,minmax(0,1fr))}.coll-x{display:none}.coll-c{padding:16px 14px 0 var(--gut)}.coll-c h3{font-size:clamp(15px,1.25vw,19px)}}
.ps-h{padding-block:clamp(6px,1.4vw,22px) clamp(24px,3vw,44px)}
.ps-h .lead{margin-top:12px}

/* Chu trình: ảnh sáng, khối đen chữ trắng */
.rit{display:grid;grid-template-columns:minmax(0,1fr)}
.rit-p img{width:100%;height:auto}
.rit-t{padding-block:clamp(44px,7vw,110px)}
.rit-t .lead{margin-top:12px}
.steps{margin-top:26px;border-bottom:1px solid var(--line)}
.steps li{display:grid;grid-template-columns:82px minmax(0,1fr);gap:8px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line)}
.steps .lab{white-space:nowrap;font-size:12px}
.steps b{display:block;font-size:clamp(18px,1.7vw,25px);line-height:1.25;color:var(--fg)}
.steps span.l{display:flex;flex-wrap:wrap;gap:0 14px;margin-top:2px}
.steps span.l a{display:inline-flex;align-items:center;min-height:32px;font-size:13.5px;color:var(--mute);text-underline-offset:4px}
@media(min-width:1000px){
  .rit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rit-p{position:relative;min-height:100%}
  .rit-p img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
  .rit-t{padding-left:clamp(40px,5vw,96px);align-self:center}
}

/* Danh mục hoạt chất */
.acts{padding-block:var(--sec) 0}
.acts-p{margin-top:clamp(28px,4vw,56px)}
.acts-p img{width:100%;height:auto}
.idx-l{padding-block:clamp(16px,2vw,28px) var(--sec)}
.idx{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 18px;align-items:baseline;padding:14px 0 13px;border-bottom:1px solid var(--line);text-decoration:none;transition:padding-left .6s var(--ease)}
.idx-n{font:700 clamp(21px,2.9vw,46px)/1.2 var(--f);color:var(--fg)}
.idx-f{font:400 clamp(19px,2.4vw,38px)/1.2 var(--f);color:var(--mute);white-space:nowrap}
.idx-w{grid-column:1/-1;margin-top:2px;font-size:13.5px;line-height:1.5;color:var(--mute)}
.idx:hover{padding-left:14px}
@media(min-width:900px){.idx{grid-template-columns:minmax(0,6fr) minmax(0,2fr) minmax(0,4fr);padding-block:20px 18px}.idx-w{grid-column:auto;margin:0;text-align:right}.idx-f{justify-self:start}}

/* Một ảnh, một dòng */
.feel{position:relative;height:clamp(440px,60vw,900px);overflow:hidden;background:#F1F1F1}
.feel img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.feel-t{position:absolute;top:clamp(36px,6vw,96px);left:var(--gut);right:var(--gur)}
.feel-t .lead{margin-top:10px;font-size:14.5px;color:var(--tx)}

/* Thương hiệu */
.prov{display:grid;grid-template-columns:minmax(0,1fr);background:#040404}
.prov-i img{width:100%;height:auto}
.prov-t{padding-block:clamp(20px,5vw,110px) clamp(44px,7vw,110px)}
.prov-t .d2{margin-top:8px}
.prov-t .lead{margin-top:14px;max-width:50ch}
.creds{margin-top:26px;border-bottom:1px solid var(--line)}
.creds li{padding:12px 0;border-top:1px solid var(--line);font-size:14.5px;line-height:1.5}
.prov-t .tlink{margin-top:16px}
@media(min-width:1000px){.prov{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center}.prov-i{order:2}.prov-t{padding-right:clamp(40px,5vw,96px)}}

/* Lời mời */
.cta{display:grid;grid-template-columns:minmax(0,1fr)}
.cta-p img{width:100%;height:auto}
.cta-t{padding-block:clamp(40px,6vw,96px)}
.cta-t .lead{margin:14px 0 24px}
.cta-b{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px}
@media(min-width:1000px){.cta{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center}.cta-p{order:2}}
.cta.solo{padding-block:var(--sec)}
.cta.solo .cta-t{padding-block:0}

/* Chân trang */
.foot{font-size:13.5px;line-height:1.6}
.foot-in{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;padding-block:56px 32px}
.foot .logo{margin:0 0 10px -2px;width:128px;color:#F6F7F8;-webkit-mask-position:left center;mask-position:left center}
.foot address{color:#C4C8CD}
.foot address a{display:inline-block;padding-block:3px;text-underline-offset:3px}
.foot-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
.foot h2{margin-bottom:8px;font:700 11px/1.5 var(--f);letter-spacing:.16em;text-transform:uppercase;color:#A4AAB1}
.foot-cols a{display:block;padding-block:6px;text-decoration:none;color:#C4C8CD;line-height:1.4}
.foot-cols a:hover{color:#F6F7F8}
.foot-end{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;padding-block:16px 22px;border-top:1px solid rgba(246,247,248,.16);font-size:12px;color:#A4AAB1}
.foot-end a{display:inline-block;padding-block:4px;margin-right:14px;color:#C4C8CD;text-underline-offset:3px}
@media(min-width:1000px){.foot-in{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;padding-block:80px 40px}.foot-cols{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Trang sản phẩm */
.pd{display:grid;grid-template-columns:minmax(0,1fr)}
.pd-art{min-width:0;background:linear-gradient(180deg,var(--wall-a),var(--wall-b))}
.field{position:relative;overflow:hidden;width:100%;height:min(72vh,132vw);min-height:430px;--x:50%;--y:75%;--r:60px;touch-action:pan-y}
.b0{position:absolute;left:50%;top:3%;width:auto;height:94%;max-width:none;transform:translateX(-50%);filter:drop-shadow(0 24px 24px rgba(20,22,24,.3));user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.lens{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;visibility:hidden;clip-path:circle(var(--r) at var(--x) var(--y));-webkit-clip-path:circle(var(--r) at var(--x) var(--y));background:#fff}
.b1{position:absolute;max-width:none;height:auto}
.ring{appearance:none;display:none;position:absolute;left:var(--x);top:var(--y);width:calc(var(--r)*2);height:calc(var(--r)*2);padding:0;transform:translate(-50%,-50%);border:1.5px solid #fff;border-radius:50%;background:none;box-shadow:0 0 0 1px rgba(20,22,24,.34),0 14px 34px rgba(20,22,24,.4);cursor:grab;touch-action:none}
.ring:active{cursor:grabbing}
.field.on .lens{visibility:visible}
.field.on .ring{display:block}
.hint{padding:10px var(--gur) 16px var(--gut);text-align:center}
.pd-info{min-width:0;padding-block:24px 56px}
.crumb{display:flex;flex-wrap:wrap;gap:0 8px;margin-bottom:16px;font-size:12.5px;color:var(--mute)}
.crumb li+li::before{content:"/";margin-right:8px}
.crumb a{display:inline-block;padding-block:5px;text-underline-offset:3px}
.crumb span{display:inline-block;padding-block:5px}
.pd-info h1{margin-top:6px;font-size:clamp(26px,3vw,46px);line-height:1.16;text-transform:uppercase}
.pd-use{margin-top:14px;font-size:16px;line-height:1.65;color:var(--mute);max-width:46ch}
.pd-price{margin-top:18px;font:700 30px/1.1 var(--f);color:var(--fg)}
.pd-price span{margin-left:8px;font:400 14px/1 var(--f);color:var(--mute)}
.pd-note{margin-top:6px;font-size:13px;line-height:1.55;color:var(--mute)}
.pd-buy{display:flex;margin-top:18px}
.pd-buy .btn{flex:1}
.tel{margin-top:12px;font-size:13.5px;line-height:1.6;color:var(--mute)}
.tel a{display:inline-block;padding-block:3px;text-underline-offset:3px;color:inherit}
.read{margin-top:44px}
.chips{margin-top:12px;border-bottom:1px solid var(--line)}
.chip{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;align-items:baseline;min-height:48px;padding:12px 0;border-top:1px solid var(--line);text-decoration:none;color:var(--fg);opacity:.62;transition:opacity .4s;cursor:pointer}
.chip:hover,.chip[aria-current="true"]{opacity:1}
.c-f{font:700 16px/1.3 var(--f)}
.c-n{font:400 16px/1.3 var(--f)}
.notes{display:grid;margin-top:14px;min-height:94px}
.lnote{grid-area:1/1;min-width:0;visibility:hidden;font-size:14.5px;line-height:1.6;color:var(--mute)}
.lnote.is-on,.lnote:target{visibility:visible}
.notes:has(:target) .lnote.is-on:not(:target){visibility:hidden}
.lsub{display:block;font-size:13px}
.lnote a{display:inline-flex;align-items:center;min-height:36px;color:var(--fg);text-underline-offset:4px}
.acc-l{margin-top:44px;border-bottom:1px solid var(--line)}
.acc{border-top:1px solid var(--line)}
.acc summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:58px;cursor:pointer;list-style:none;font:700 16px/1.3 var(--f);color:var(--fg)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";flex:none;width:13px;height:13px;background:linear-gradient(currentColor,currentColor) center/13px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 13px no-repeat}
.acc[open] summary::after{background-size:13px 1.5px,0 0}
.acc-b{padding-bottom:22px;font-size:15px;line-height:1.7;color:var(--mute)}
.acc-b p+p,.acc-b p+ul,.acc-b ul+p,.acc-b ul+h3{margin-top:12px}
.acc-b b{color:var(--fg)}
.acc-b h3{margin-top:14px;font-size:15px}
.acc-b li{padding-block:2px}
.spec div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.spec div:first-child{border-top:0;padding-top:0}
.spec dd{min-width:0;color:var(--fg)}
.pd-ph{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.pd-ph figure{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--wall-a)}
.pd-ph img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.more{padding-block:var(--sec)}
.more .coll-g{grid-template-columns:minmax(0,1fr);row-gap:2px;margin-top:clamp(28px,4vw,56px)}
.more .coll-g a{display:grid;grid-template-columns:36% minmax(0,1fr);align-items:center}
.more .coll-c{padding:14px var(--gur) 14px 18px}
.obar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:12px;padding:8px max(16px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:var(--black);color:#F6F7F8}
.obar b{font-size:20px;line-height:1;white-space:nowrap}
.obar .btn{margin-left:auto;min-height:46px;padding:0 16px;font-size:11px;letter-spacing:.1em;background:#F6F7F8;color:#141414;border-color:#F6F7F8}
.has-obar{padding-bottom:calc(62px + env(safe-area-inset-bottom,0px))}
@media(min-width:700px){.more .coll-g{grid-template-columns:repeat(2,minmax(0,1fr))}.more .coll-g a{display:block}.more .coll-c{padding:16px 16px 26px var(--gut)}}
@media(min-width:1000px){.more .coll-g{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:900px){.pd-ph{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1000px){
  .pd{grid-template-columns:minmax(0,11fr) minmax(0,9fr)}
  .pd-art{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center}
  .field{height:calc(100vh - 92px);min-height:0;margin-top:30px}
  .hint{padding-block:6px 14px}
  .pd-info{padding:24px var(--gur) 88px clamp(36px,5vw,88px)}
  .obar{display:none}
  .has-obar{padding-bottom:0}
}

/* Trang hoạt chất */
.ia{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding-block:clamp(14px,2vw,28px) clamp(40px,6vw,88px)}
.ia .crumb{margin-bottom:10px}
.ia h1{font-size:clamp(32px,9.4vw,88px);line-height:1.06;text-transform:uppercase}
.ia .lead{margin-top:14px;max-width:44ch}
.molfig{max-width:520px;width:100%}
.mol-w{position:relative}
.mol{width:100%;height:auto;fill:none;stroke:currentColor;stroke-width:var(--msw,1.8);stroke-linecap:round;stroke-linejoin:round;color:#141414}
.mol polygon,.mol line,.mol polyline:not(.mol-ld){animation:draw 2.2s ease-out}
@keyframes draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
.mol-t{font:700 var(--mfs,15px) var(--f);fill:currentColor;stroke:var(--paper);stroke-width:6;paint-order:stroke;text-anchor:middle;dominant-baseline:central}
.mol-t .s{font-size:.72em}
.mol-ld{fill:none;stroke:#8A9198;stroke-width:.7;vector-effect:non-scaling-stroke}
.mol-tag{position:absolute;white-space:nowrap;font:700 10px/1.5 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
@media(max-width:420px){.mol-tag{font-size:9px;letter-spacing:.08em}}
.molfig figcaption{margin-top:10px;font-size:12.5px;color:var(--mute);text-align:center}
.has{padding-block:var(--sec);border-top:1px solid var(--line)}
.has-l{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(48px,6vw,80px);margin-top:clamp(36px,5vw,64px)}
.has-i{display:grid;grid-template-columns:92px minmax(0,1fr);gap:22px;align-items:end}
.has-i>a{display:block}
.has-i img{width:100%;filter:drop-shadow(0 14px 14px rgba(20,22,24,.26))}
.has-i .has-f{margin:0;max-width:none;font:700 clamp(66px,8vw,120px)/1 var(--f);letter-spacing:-.01em;color:var(--fg)}
.has-i h3{margin-top:8px;font-size:clamp(18px,1.7vw,24px);line-height:1.25}
.has-i h3 a{text-decoration:none}
.has-i h3 a:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.has-i p{margin-top:8px;font-size:14.5px;line-height:1.6;color:var(--mute);max-width:44ch}
.has-d{margin-top:10px;font-size:14px;line-height:1.55;max-width:46ch}
.has-d div+div{margin-top:8px}
.has-d dt{font:700 10.5px/1.6 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.has-d dd{margin:0;color:var(--fg)}
.rd{padding-block:var(--sec);border-top:1px solid var(--line)}
.rd-l{display:grid;grid-template-columns:minmax(0,1fr);gap:0 56px;margin-top:22px}
.rd-l div{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding-block:14px;border-top:1px solid var(--line)}
.rd-l dt{font-weight:700;font-size:16px}
.rd-l dd{margin:0;color:var(--mute);font-size:14.5px;line-height:1.6;max-width:52ch}
.acc-ln{margin-top:14px}
.acc-ln a{display:inline-block;padding-block:4px}
.has-p{display:block;margin-top:8px;font:700 13.5px/1.4 var(--f);color:var(--fg)}
.has-p span{margin-left:8px;font-weight:400;color:var(--mute)}
.facts-w{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;padding-block:var(--sec);border-top:1px solid var(--line)}
.facts-w .spec{margin-top:22px;font-size:15px}
.facts-w .spec div:first-child{border-top:1px solid var(--line);padding-top:9px}
.facts-w .spec div:last-child{border-bottom:1px solid var(--line)}
.facts-w dt{color:var(--mute)}
.src{margin-top:12px;font-size:12.5px;color:var(--mute)}
.src a{display:inline-block;padding-block:4px;text-underline-offset:3px}
.facts-w .acc-l{margin-top:22px}
@media(min-width:900px){.rd-l{grid-template-columns:repeat(2,minmax(0,1fr))}.rd-l div{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:20px}.has-l{grid-template-columns:repeat(2,minmax(0,1fr))}.has-l.one{grid-template-columns:minmax(0,1fr);max-width:640px}.has-i{grid-template-columns:124px minmax(0,1fr)}.facts-w{grid-template-columns:repeat(2,minmax(0,1fr));gap:72px}}
@media(min-width:1000px){.ia{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end;gap:48px}.ia h1{font-size:clamp(52px,5.6vw,108px)}}

/* Trang trắc nghiệm da */
.qz{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;padding-block:clamp(14px,2vw,28px) var(--sec)}
.qz .crumb{margin-bottom:10px}
.qz-i .lead{margin-top:14px}
.qz-w{min-width:0;max-width:640px}
.qz-f fieldset{min-width:0;margin:0;padding:0;border:0}
.qz-q+.qz-q{margin-top:48px}
.qz-f.is-on .qz-q{display:none;margin-top:0}
.qz-f.is-on .qz-q.on{display:block;animation:qzIn .45s var(--ease)}
@keyframes qzIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.qz-f legend{display:block;width:100%;padding:0}
.qz-h{display:block;margin:10px 0 22px;font:700 clamp(22px,2.3vw,34px)/1.22 var(--f);color:var(--fg);text-wrap:balance}
.qz-o{border-top:1px solid var(--line)}
.qz-o label{display:flex;align-items:center;gap:16px;min-height:62px;padding:12px 6px;border-bottom:1px solid var(--line);font-size:17px;line-height:1.4;color:var(--fg);cursor:pointer;transition:background .2s}
.qz-o label:hover{background:rgba(20,20,20,.035)}
.qz-o input{position:absolute;width:1px;height:1px;opacity:0}
.qz-o span{display:flex;align-items:center;gap:16px}
.qz-o span::before{content:"";flex:none;width:20px;height:20px;border:1.5px solid currentColor;border-radius:50%;transition:box-shadow .2s,background .2s}
.qz-o input:checked+span::before{background:currentColor;box-shadow:inset 0 0 0 4px var(--paper)}
.qz-o input:checked+span{font-weight:700}
.qz-o input:focus-visible+span{outline:2px solid currentColor;outline-offset:6px}
.qz-bar{display:none;height:2px;margin-bottom:28px;background:var(--line)}
.qz-bar span{display:block;width:20%;height:100%;background:var(--fg);transition:width .4s var(--ease)}
.qz-f.is-on .qz-bar{display:block}
.qz-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:28px}
.qz-back{display:none;padding:0;border:0;background:none;cursor:pointer}
.qz-f.is-on .qz-back{display:inline-flex}
.qz-f.is-on .qz-back[hidden],.qz-go[hidden]{display:none}
.qz-go{margin-left:auto;cursor:pointer}
.qz-ns{margin-top:16px;font-size:14.5px;color:var(--mute)}
.qz-r:focus{outline:none}
.qz-r .d2{margin-top:8px}
.qz-steps{margin-top:28px;border-top:1px solid var(--line)}
.qz-steps>li{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:14px;padding-block:14px;border-bottom:1px solid var(--line);color:var(--fg)}
.qz-steps .qz-p{grid-template-columns:96px 40px minmax(0,1fr)}
.qz-p .qz-b img{width:auto;height:118px;margin-inline:auto;filter:drop-shadow(0 8px 8px rgba(20,22,24,.22))}
.qz-p b{display:block;font-size:16.5px;line-height:1.3}
.qz-p a{text-decoration:none}
.qz-p span>a{display:inline-block;padding-block:6px}
.qz-p a:hover b{text-decoration:underline;text-underline-offset:4px}
.qz-k{display:block;margin-top:4px;font-size:14px;line-height:1.5;color:var(--mute)}
.qz-m{display:block;margin-top:4px;font:700 13.5px/1.4 var(--f)}
.qz-m span{margin-left:8px;font-weight:400;color:var(--mute)}
.qz-n{margin:22px 0 26px;display:grid;gap:8px;font-size:14.5px;line-height:1.6;color:var(--mute);max-width:56ch}
.qz-n li{padding-left:18px;position:relative}
.qz-n li::before{content:"";position:absolute;left:0;top:.75em;width:8px;height:1.5px;background:var(--gr)}
.qz-re{padding:0;border:0;background:none;cursor:pointer}
.qz-s{padding-block:var(--sec);border-top:1px solid var(--line)}
.qz-s .lead{margin-top:14px}
.qz-g{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;margin-top:clamp(32px,4vw,56px)}
.qz-g h3{color:var(--fg)}
.qz-c{display:grid;gap:0;margin-top:12px;border-top:1px solid var(--line)}
.qz-c a{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:16px;min-height:72px;padding-block:10px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--fg)}
.qz-c img{width:auto;height:92px;margin-inline:auto;filter:drop-shadow(0 6px 6px rgba(20,22,24,.2))}
.qz-c b{display:block;margin-top:2px;font-size:16px;line-height:1.3}
.qz-c a:hover b{text-decoration:underline;text-underline-offset:4px}
@media(min-width:900px){.qz-g{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 72px}}
@media(min-width:1000px){.qz{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:72px;align-items:start}.qz-i{position:sticky;top:24px}}

/* Trang Về Labiance */
.ab-h{padding-block:clamp(14px,2vw,28px) clamp(48px,7vw,104px)}
.ab-h .crumb{margin-bottom:10px}
.ab-h .lab{margin-top:18px}
.ab-h .d1{margin-top:6px}
.ab-h .lead{margin-top:16px;max-width:52ch}
.ab-r{padding-block:var(--sec);border-top:1px solid var(--line)}
.ab-l{display:grid;grid-template-columns:minmax(0,1fr);margin-top:clamp(32px,4vw,56px);border-top:1px solid var(--line)}
.ab-l li{padding-block:22px 26px;border-bottom:1px solid var(--line)}
.ab-l h3{margin-top:8px;font-size:clamp(20px,1.9vw,28px);line-height:1.25}
.ab-l p{margin-top:8px;font-size:15px;line-height:1.65;color:var(--mute);max-width:48ch}
.ab-n{margin:18px 0 22px;font-size:15px;line-height:1.65;color:var(--mute);max-width:52ch}
.facts-w .spec dt a{text-underline-offset:4px;color:var(--fg)}
.facts-w .spec dd a{display:inline-block;max-width:100%;padding-block:4px;overflow-wrap:anywhere}
@media(min-width:900px){.ab-l{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:72px}}

/* Trang báo lỗi và trang chờ dựng */
.msg{min-height:70vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-block:72px}
.msg .lead{margin-block:14px 24px}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
  .qz-f.is-on .qz-q.on{animation:none}
  .js .rb img{opacity:1;transform:translateX(-50%) rotate(7deg)}
}

/* Trang Đối tác */
.ab-h .cta-b{margin-top:26px}
.dt-w{display:grid;grid-template-columns:minmax(0,1fr);margin-top:clamp(32px,4vw,56px);border-top:1px solid var(--line)}
.dt-w li{padding-block:20px 22px;border-bottom:1px solid var(--line)}
.dt-w h3{font-size:clamp(18px,1.6vw,24px);line-height:1.3}
.dt-w p{margin-top:6px;font-size:15px;line-height:1.6;color:var(--mute);max-width:46ch}
.dt-f{padding-block:var(--sec)}
.dt-fi{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"hd" "form" "sx";gap:40px}
.dt-hd{grid-area:hd}.dt-form{grid-area:form}.dt-sx{grid-area:sx}
.dt-hd .d2{margin-top:10px}
.dt-s{border-top:1px solid var(--line)}
.dt-s li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:12px;padding-block:16px;border-bottom:1px solid var(--line)}
.dt-s .lab{grid-row:span 2;padding-top:3px}
.dt-s b{color:var(--fg);font-size:16px;line-height:1.4}
.dt-s span:last-child{font-size:14.5px;line-height:1.6;color:var(--mute)}
.dt-c{margin-top:22px;font-size:14.5px;line-height:1.7;color:var(--mute)}
.dt-c a{display:inline-block;max-width:100%;padding-block:4px;overflow-wrap:anywhere;color:var(--fg)}
.dt-form{display:grid;gap:20px;min-width:0}
.dt-r{display:grid;gap:8px}
.dt-r label{font:700 11px/1.5 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.dt-form input:not([type=checkbox]),.dt-form select,.dt-form textarea{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--line);border-radius:0;background:rgba(246,247,248,.04);color:var(--fg);font:400 16px/1.4 var(--f);transition:border-color .2s}
.dt-form textarea{resize:vertical;min-height:96px}
.dt-form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.dt-form select option{color:#141414}
.dt-form input:focus,.dt-form select:focus,.dt-form textarea:focus{outline:none;border-color:var(--fg)}
.dt-form [aria-invalid]{border-color:#E08A8A}
.dt-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dt-ok{display:flex;gap:14px;align-items:flex-start;font-size:14.5px;line-height:1.6;color:var(--tx);cursor:pointer}
.dt-ok input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:#F6F7F8}
.dt-ok a{color:var(--fg);text-underline-offset:4px}
.dt-e{font-size:13.5px;line-height:1.5;color:#F0A3A3}
.dt-form .btn{justify-self:start;min-width:220px}
.dt-msg{padding:16px 18px;border:1px solid var(--line);font-size:15px;line-height:1.65;color:var(--tx)}
.dt-msg b{color:var(--fg)}
.dt-msg a{color:var(--fg)}
@media(min-width:900px){.dt-w{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:72px}.dt-fi{grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"hd form" "sx form";grid-template-rows:auto 1fr;column-gap:clamp(56px,7vw,120px);row-gap:36px}}
@media(max-width:480px){.dt-form .btn{justify-self:stretch}}

/* Trang chính sách */
.pol{padding-block:clamp(14px,2vw,28px) var(--sec)}
.pol .d2{margin-top:10px}
.pol-g{display:grid;grid-template-columns:minmax(0,1fr);gap:48px}
.pol-b{margin-top:clamp(28px,3.5vw,48px);max-width:68ch;font-size:16px;line-height:1.75;color:var(--tx)}
.pol-b h2{margin-top:40px;font-size:clamp(19px,1.6vw,23px);line-height:1.3}
.pol-b h2:first-child{margin-top:0}
.pol-b p,.pol-b ol,.pol-b ul{margin-top:12px}
.pol-b p:last-child{margin-top:36px;padding-top:20px;border-top:1px solid var(--line);font-size:14.5px;color:var(--mute)}
.pol-b a{color:var(--fg);text-underline-offset:4px;overflow-wrap:anywhere}
.pol-ol{counter-reset:p}
.pol-ol li,.pol-ul li{position:relative;padding-left:34px}
.pol-ol li+li,.pol-ul li+li{margin-top:10px}
.pol-ol li::before{counter-increment:p;content:counter(p,decimal-leading-zero);position:absolute;left:0;top:.2em;font:700 11px/1.5 var(--f);letter-spacing:.12em;color:var(--mute)}
.pol-ul li::before{content:"";position:absolute;left:4px;top:.75em;width:12px;height:1.5px;background:currentColor}
.pol-nav{align-self:start;border-top:1px solid var(--line);padding-top:18px}
.pol-nav ul{margin-top:8px}
.pol-nav a,.pol-nav span{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--line);font-size:15px;color:var(--tx);text-decoration:none}
.pol-nav a:hover{color:var(--fg);text-decoration:underline;text-underline-offset:4px}
.pol-nav span{font-weight:700;color:var(--fg)}
.pol-list{display:grid;grid-template-columns:minmax(0,1fr);margin-top:clamp(28px,3.5vw,48px);border-top:1px solid var(--line)}
.pol-list a{display:grid;gap:4px;padding-block:20px;border-bottom:1px solid var(--line);text-decoration:none}
.pol-list b{font-size:clamp(18px,1.6vw,22px);line-height:1.3;color:var(--fg)}
.pol-list span{font-size:15px;line-height:1.6;color:var(--mute)}
.pol-list a:hover b{text-decoration:underline;text-underline-offset:5px}
@media(min-width:900px){.pol-g{grid-template-columns:minmax(0,1fr) 260px;gap:clamp(56px,7vw,120px)}.pol-nav{position:sticky;top:96px;margin-top:clamp(60px,6vw,110px)}.pol-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:72px}}