/* Chu Lala · trang chủ phương án B "Sân chơi" · 16/10/2026 · mọi bộ chọn bắt đầu bằng .pa-b */
.pa-b{--bv:#FFD91D;--bg:#024C37;--bh:#FFC0D1;--bn:#7ADAA5;--bk:#FAF7F0;--bl:#EBF3D3;--bc:#FF7381;--bm:#964A2F;--bd:#191919;--bs:0 8px 18px rgba(2,61,44,.2);overflow-x:hidden;overflow-x:clip;font-size:1.0625rem}
.pa-b .pa-b-sec{position:relative;padding:clamp(2.75rem,6vw,5rem) 1.25rem}
.pa-b h1,.pa-b h2,.pa-b h3{text-wrap:balance}
.pa-b h2{margin:.7rem 0 0;font-size:clamp(1.7rem,1.15rem + 2.4vw,2.75rem);line-height:1.15}
.pa-b h3{margin:0}
.pa-b .pa-b-cols{gap:2rem clamp(2rem,5vw,4rem)}
.pa-b .pa-b-cols>.wp-block-column{margin:0}
.pa-b .pa-b-nhan{display:inline-block;margin:0;padding:.3rem .95rem;border-radius:999px;background:var(--nh,var(--bv));color:var(--bg);font-size:.875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;transform:rotate(-2deg);box-shadow:0 0 0 .18rem #fff,0 4px 8px rgba(0,0,0,.14)}
.pa-b-s2{--nh:var(--bh)}.pa-b-s4{--nh:var(--bh)}.pa-b-s5{--nh:var(--bn)}.pa-b-s7{--nh:var(--bn)}.pa-b-s8{--nh:var(--bh)}.pa-b-s10{--nh:var(--bn)}.pa-b-s11{--nh:var(--bh)}
/* hình dán, băng dính, ảnh polaroid */
.pa-b-st{position:absolute;z-index:5;height:auto;transform:rotate(var(--r,0deg));filter:drop-shadow(0 3px 4px rgba(0,0,0,.25));pointer-events:none}
.pa-b-pol{position:relative;margin:0;padding:.55rem .55rem 2.3rem;border-radius:.3rem;background:#fff;box-shadow:0 10px 22px rgba(2,61,44,.24),0 1px 2px rgba(0,0,0,.2);transition:transform .25s}
.pa-b-pol:has(figcaption){padding-bottom:.3rem}
.pa-b-pol img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:.15rem}
.pa-b-pol figcaption{margin:.65rem .3rem .55rem;color:var(--bd);font-size:1rem;line-height:1.4;text-align:center}
.pa-b-pol::before,.pa-b-giay::before,.pa-b-nho::before{content:"";position:absolute;top:-.7rem;left:50%;z-index:2;width:4.4rem;height:1.4rem;margin-left:-2.2rem;background:rgba(255,115,129,.72);box-shadow:0 1px 2px rgba(0,0,0,.15);transform:rotate(-3deg)}
.pa-b-giay{position:relative;padding:1.3rem 1.3rem 1.1rem;border-radius:.6rem;background:#fff;box-shadow:var(--bs);transform:rotate(.6deg)}
.pa-b-giay::before{background:rgba(255,217,29,.8)}
.pa-b .pa-b-giay>*{margin:0}
.pa-b .pa-b-giay>*+*{margin-top:.8rem}
.pa-b-mang{position:relative;border-radius:2rem;background:url(../trang-chu/gl-hoa-tiet-lap.webp) center/cover}
/* 1 · màn hình đầu */
.pa-b-hero{background-image:radial-gradient(var(--bh) 2px,transparent 2.6px);background-size:26px 26px}
.pa-b-hero h1{margin:0;font-size:clamp(2.2rem,1.2rem + 4.4vw,4rem);line-height:1.1}
.pa-b-bt{display:inline-block;padding:0 .2em;border-radius:.28em;background:var(--bv);transform:rotate(-1.5deg)}
.pa-b .pa-b-phu{max-width:34rem;margin-top:1.1rem;font-size:clamp(1.0625rem,1rem + .4vw,1.3rem)}
.pa-b .pa-b-nut{margin-top:1.4rem}
.pa-b-nut .wp-block-button__link{padding:.9rem 1.7rem;box-shadow:.3rem .3rem 0 var(--bc);transition:transform .15s,box-shadow .15s}
.pa-b-nut .wp-block-button__link:hover{transform:translate(.15rem,.15rem);box-shadow:.12rem .12rem 0 var(--bc)}
.pa-b .pa-b-lk{margin-top:.8rem}
.pa-b-tin{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.5rem 0 0;padding:0;list-style:none}
.pa-b-tin li{display:flex;align-items:center;gap:.4rem;margin:0;padding:.45rem .95rem .45rem .7rem;border-radius:999px;background:var(--bv);color:var(--bg);font-size:.9375rem;font-weight:700;line-height:1.25;box-shadow:0 0 0 .2rem #fff,var(--bs);transform:rotate(-2deg)}
.pa-b-tin li:nth-child(2){background:var(--bn);transform:rotate(1.5deg)}
.pa-b-tin li:nth-child(3){background:var(--bh);transform:rotate(-1deg)}
.pa-b-tin li::before{content:"";flex:none;width:1.1rem;height:1.1rem;background:var(--bg);-webkit-mask:var(--cl-la) center/contain no-repeat;mask:var(--cl-la) center/contain no-repeat}
.pa-b-collage{position:relative;width:100%;max-width:34rem;margin:0 auto;aspect-ratio:1/1.1}
.pa-b .pa-b-collage>*{margin:0}
.pa-b-nen{position:absolute;inset:9% 3% 3% 9%;transform:rotate(3deg)}
.pa-b-collage .pa-b-pol{position:absolute}
.pa-b-p1{top:8%;left:0;z-index:2;width:49%;transform:rotate(-4deg)}
.pa-b-p2{top:0;right:0;z-index:1;width:46%;transform:rotate(4deg)}
.pa-b-p3{bottom:0;left:25%;z-index:3;width:48%;transform:rotate(2deg)}
.pa-b-p2::before{background:rgba(255,217,29,.82)}
.pa-b-p3::before{background:rgba(122,218,165,.88)}
.pa-b-p2 img{object-position:40% 60%}
.pa-b-p3 img{object-position:50% 55%}
.pa-b-collage .pa-b-pol:hover{z-index:6;transform:rotate(0) scale(1.03)}
/* 2 · Chu Lala là ai */
.pa-b-s2 .pa-b-mang{padding:2.4rem 1.4rem}
.pa-b-s2 .pa-b-pol{max-width:21rem;margin:0 auto;transform:rotate(-3deg)}
.pa-b-s2 .pa-b-giay{margin-top:1.2rem}
/* 3 · vì sao lại là Chu Lala */
.pa-b-s3{--nh:var(--bv)}
.pa-b-ten{position:relative;max-width:28rem;margin:0 auto;padding-bottom:.6rem}
.pa-b-bong{position:relative;padding:1.2rem 1.4rem 2.2rem;border-radius:2rem;background:#fff;box-shadow:var(--bs);text-align:center}
.pa-b-bong::after{content:"";position:absolute;bottom:-.7rem;left:20%;width:1.6rem;height:1.6rem;border-radius:0 0 .4rem 0;background:#fff;transform:rotate(45deg)}
.pa-b .pa-b-bong p{margin:0;line-height:1.2}
.pa-b .pa-b-bong p:first-child{color:var(--bg);font-size:clamp(2.2rem,1.6rem + 3vw,3.2rem);font-weight:700}
.pa-b .pa-b-bong p+p{margin-top:.3rem;color:#55655A}
.pa-b .pa-b-stk{position:relative;z-index:2;width:max-content;max-width:100%;margin:-1.1rem 0 0 auto;padding:.1em .45em .15em;border-radius:.55em;background:var(--bv);color:var(--bg);font-size:clamp(1.9rem,1.2rem + 4vw,2.9rem);font-weight:700;line-height:1.15;box-shadow:0 0 0 .24rem #fff,0 10px 18px rgba(2,61,44,.28);transform:rotate(-4deg)}
.pa-b-s3 .pa-b-cols{margin-top:2rem}
.pa-b-ghichu{position:relative;margin-top:1.3rem;padding:1rem 1.2rem 1rem 1.4rem;border-left:.5rem solid var(--bc);border-radius:.4rem;background:#fff;box-shadow:var(--bs);transform:rotate(-.8deg)}
.pa-b .pa-b-ghichu p{margin:0;font-weight:700}
/* 4 · tinh thần */
.pa-b-s4{color:var(--bk)}
.pa-b .pa-b-intro{max-width:40rem;margin-top:1rem}
.pa-b-the4{display:grid;gap:1.6rem;margin-top:2.4rem}
.pa-b .pa-b-the4>*{margin:0}
.pa-b-the{position:relative;padding:1.5rem 1.3rem 1.4rem;border-radius:1.3rem;color:var(--bd);box-shadow:0 0 0 .22rem #fff,0 12px 20px rgba(0,0,0,.3);transition:transform .2s}
.pa-b-the:nth-child(odd){transform:rotate(-1.6deg)}
.pa-b-the:nth-child(even){transform:rotate(1.4deg)}
.pa-b-the:hover{transform:rotate(0)}
.pa-b .pa-b-the h3{margin:0 0 .45rem;color:var(--bg);font-size:1.5rem}
.pa-b .pa-b-the p{margin:0}
.pa-b-nho{position:relative;max-width:35rem;margin:2.8rem auto 0;padding:1.7rem 1.5rem 1.4rem;background:var(--bl) repeating-linear-gradient(transparent 0 1.75rem,rgba(2,76,55,.12) 1.75rem calc(1.75rem + 1px));color:var(--bd);box-shadow:0 14px 24px rgba(0,0,0,.35);transform:rotate(-1.4deg)}
.pa-b .pa-b-nho h3{color:var(--bg);font-size:1.6rem}
.pa-b .pa-b-nho p{margin:.5rem 0 0}
/* 5 · cách mình chăm */
.pa-b-duo{position:relative;display:flex;justify-content:center;align-items:flex-start;padding:1.4rem 0 1.5rem}
.pa-b .pa-b-duo>.pa-b-pol{width:min(46%,15.5rem);margin:0}
.pa-b .pa-b-duo>.pa-b-pol:nth-of-type(1){z-index:2;transform:rotate(-5deg)}
.pa-b .pa-b-duo>.pa-b-pol:nth-of-type(2){z-index:1;margin:2.2rem 0 0 -1.4rem;transform:rotate(4deg)}
/* 6 · nguyên liệu */
.pa-b-s6{--nh:var(--bv)}
.pa-b-nl{position:relative;box-sizing:border-box;height:100%;padding:1.4rem 1.3rem 1.6rem;border-radius:1.4rem;background:#fff;box-shadow:var(--bs)}
.pa-b .pa-b-nl>*{margin:0}
.pa-b .pa-b-nl>*+*{margin-top:.9rem}
.pa-b .pa-b-nl h3{display:inline-block;padding:.15em .7em;border-radius:.6em;background:var(--bd);color:var(--bk);font-size:1.5rem;transform:rotate(-2deg)}
.pa-b .pa-b-nl-m h3{background:var(--bm)}
.pa-b .pa-b-nl .pa-b-pol{max-width:19rem;margin:1.4rem auto 0;transform:rotate(2deg)}
.pa-b .pa-b-nl-m .pa-b-pol{transform:rotate(-2deg)}
.pa-b .pa-b-nl .pa-b-pol img{object-position:50% 60%}
/* 7 · từ công thức tới chai trên kệ */
.pa-b-ve{position:relative;display:grid;gap:1.6rem;margin:0;padding:0;background:repeating-linear-gradient(var(--bg) 0 6px,transparent 6px 12px) 1.7rem 0/2px 100% no-repeat;list-style:none;counter-reset:v}
.pa-b-ve li{position:relative;min-height:5rem;margin:0;padding:1.1rem 1.1rem 1.1rem 4.7rem;border-radius:1rem;background:#fff;box-shadow:var(--bs);counter-increment:v}
.pa-b-ve li::before{content:counter(v);position:absolute;inset:0 auto 0 0;display:grid;place-items:center;width:3.4rem;border-right:.15rem dashed rgba(2,76,55,.45);border-radius:1rem 0 0 1rem;background:var(--c,var(--bv));color:var(--bd);font-size:1.7rem;font-weight:700}
.pa-b-ve li::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle .55rem at 3.4rem 0,var(--bh) 96%,#0000),radial-gradient(circle .55rem at 3.4rem 100%,var(--bh) 96%,#0000);pointer-events:none}
.pa-b-ve li:nth-child(2){--c:var(--bn)}
.pa-b-ve li:nth-child(3){--c:var(--bc)}
.pa-b-ve li:nth-child(4){--c:var(--bl)}
.pa-b-ve strong{display:block;margin-bottom:.15rem;color:var(--bg);font-size:1.2rem}
.pa-b .pa-b-s7 .pa-b-intro{margin-top:1.2rem}
/* 8 · gia đình Chu Lala */
.pa-b-s8,.pa-b-s10{text-align:center}
.pa-b-khung{position:relative;max-width:44rem;margin:1.9rem auto 0;padding:1.7rem 1.1rem 1.5rem;border-radius:.5rem;background:#fff;box-shadow:var(--bs);transform:rotate(-.5deg)}
.pa-b-khung::before,.pa-b-khung::after{content:"";position:absolute;top:-.4rem;width:5rem;height:1.5rem;background:rgba(255,217,29,.82);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.pa-b-khung::before{left:-1rem;transform:rotate(-35deg)}
.pa-b-khung::after{right:-1rem;transform:rotate(35deg)}
.pa-b .pa-b-khung>*,.pa-b .pa-b-sapco>*{margin:0}
.pa-b .pa-b-khung>*+*{margin-top:1rem}
.pa-b .pa-b-sapco>*+*{margin-top:.5rem}
.pa-b .pa-b-tag{display:inline-block;margin:0;padding:.3rem .9rem;border-radius:.4rem;background:var(--bn);color:var(--bg);font-size:.9375rem;font-weight:700;box-shadow:0 0 0 .16rem #fff,0 3px 7px rgba(0,0,0,.16);transform:rotate(-2deg)}
.pa-b-luoi li{margin:0}
.pa-b-luoi li:nth-child(odd){transform:rotate(-1.5deg)}
.pa-b-luoi li:nth-child(even){transform:rotate(1.5deg)}
.pa-b-luoi .wc-block-components-product-image img{border:.45rem solid #fff;border-radius:.3rem;box-shadow:var(--bs)}
.pa-b-sapco{position:relative;max-width:44rem;margin:2rem auto 0;padding:.9rem 1.1rem;border:.15rem dashed var(--bg);border-radius:1rem;font-size:1rem;transform:rotate(.5deg)}
.pa-b-sapco .pa-b-tag{background:var(--bv);font-size:.875rem}
/* 9 · lời hẹn */
.pa-b-s9{--nh:var(--bv);color:var(--bk)}
.pa-b-hen{display:grid;gap:2rem 1.5rem;margin:2.6rem 0 0;padding:0;list-style:none;counter-reset:h}
.pa-b-hen li{position:relative;margin:0;padding:2.2rem 1.3rem 1.3rem;border-radius:1.2rem;background:var(--bk);color:var(--bd);box-shadow:0 0 0 .2rem var(--bh),0 12px 20px rgba(0,0,0,.28);counter-increment:h}
.pa-b-hen li:nth-child(odd){transform:rotate(-1deg)}
.pa-b-hen li:nth-child(even){transform:rotate(1deg)}
.pa-b-hen li::before{content:counter(h);position:absolute;top:-1.2rem;left:1.2rem;display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--c,var(--bv));color:var(--bd);font-size:1.3rem;font-weight:700;box-shadow:0 0 0 .2rem var(--bk)}
.pa-b-hen li:nth-child(2){--c:var(--bn)}
.pa-b-hen li:nth-child(3){--c:var(--bh)}
.pa-b-hen li:nth-child(4){--c:var(--bc)}
.pa-b-hen strong{display:block;margin-bottom:.3rem;color:var(--bg);font-size:1.2rem}
/* 10 · hỏi nhanh */
.pa-b-hoidap{max-width:46rem;margin:2rem auto 0;text-align:left}
.pa-b .pa-b-hoidap>*{margin:0}
.pa-b .pa-b-hoidap>*+*{margin-top:.9rem}
.pa-b .pa-b-hoi{padding:.35rem 1.1rem;border:.15rem solid var(--bg);border-radius:1.1rem;background:#fff;box-shadow:.3rem .3rem 0 var(--bh)}
.pa-b .pa-b-hoi[open]{background:var(--bl);box-shadow:.3rem .3rem 0 var(--bv)}
.pa-b .pa-b-hoi summary{min-height:3.25rem;color:var(--bg)}
.pa-b .pa-b-hoi>:not(summary){margin:0 0 .9rem}
/* 11 · lời mời cuối */
.pa-b .pa-b-s11{padding-block:clamp(3rem,8vw,6rem);background-image:url(../trang-chu/gl-hoa-tiet-song.webp);background-position:center;background-size:cover}
.pa-b-s11 .pa-b-giay{padding:1.7rem 1.5rem;transform:rotate(-1deg)}
.pa-b .pa-b-nho2{margin-top:1rem;font-size:1rem}
.pa-b-p11{position:relative;max-width:22rem;margin:0 auto}
.pa-b .pa-b-p11 .pa-b-pol{margin:0;transform:rotate(3deg)}
/* điện thoại và máy tính */
@media (max-width:781px){.pa-b-nut,.pa-b-nut .wp-block-button,.pa-b-nut .wp-block-button__link{width:100%}.pa-b-dm{display:none}}
@media (min-width:560px){.pa-b-the4{grid-template-columns:1fr 1fr}}
@media (min-width:640px){.pa-b-hen{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.pa-b-the4{grid-template-columns:repeat(4,1fr)}}
@media (prefers-reduced-motion:no-preference){@keyframes pa-b-lac{50%{transform:rotate(calc(var(--r,0deg) + 7deg)) scale(1.05)}}.pa-b-st{animation:pa-b-lac 6s ease-in-out infinite}}
@media (prefers-reduced-motion:reduce){.pa-b *{transition:none!important;animation:none!important}}