/* Dobra BLÄYVA Beauty L4 (bty_como). GERADO por docs/layout/fonte-loja/dobras-bty-l4.py: não edite à mão. */
.bl .bty-l4-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.bl .bty-l4-w>span{display:inline-block}
.bl .bty-l4a{position:relative;height:340vh;background:#fff}
.bl .bty-l4a-cola{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden;padding-top:64px}
.bl .bty-l4a-g{width:100%;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:center}
.bl .bty-l4a-cont{display:flex;align-items:baseline;gap:10px;font:400 italic 72px/1 var(--bl-destaque);letter-spacing:-.03em;color:var(--bl-preto)}
.bl .bty-l4a-roda{display:block;height:1em;overflow:hidden}
.bl .bty-l4a-roda>span{display:flex;flex-direction:column;transition:transform .8s cubic-bezier(.7,0,.2,1)}
.bl .bty-l4a-de{font-size:28px;color:var(--bl-cinza-3)}
.bl .bty-l4a-passos{list-style:none;margin:26px 0 0;padding:0;display:grid}
.bl .bty-l4a-passos>li{grid-area:1/1;pointer-events:none}
.bl .bty-l4a-passos>li.on{pointer-events:auto}
.bl .bty-l4a-passos h3{margin:0;font:600 clamp(32px,3.6vw,54px)/1.04 var(--bl-titulo);letter-spacing:-.035em;color:var(--bl-preto)}
.bl .bty-l4a-passos p{margin:22px 0 0;max-width:460px;font:400 17px/1.55 var(--bl-texto);color:var(--bl-cinza-4)}
.bl .bty-l4a-ln{display:block;overflow:hidden}
.bl .bty-l4a-ln>span{display:block}
.bl .bty-l4a .bty-l4-w>span{transform:translateY(110%);transition:transform .55s cubic-bezier(.7,0,.3,1)}
.bl .bty-l4a li.on .bty-l4-w>span{transform:none;transition:transform .8s calc(.2s + var(--w) * .055s) cubic-bezier(.2,.8,.2,1)}
.bl .bty-l4a li.foi .bty-l4-w>span{transform:translateY(-110%)}
.bl .bty-l4a-ln>span{transform:translateY(105%);transition:transform .45s cubic-bezier(.7,0,.3,1)}
.bl .bty-l4a li.on .bty-l4a-ln>span{transform:none;transition:transform .8s calc(.45s + var(--l) * .12s) cubic-bezier(.2,.8,.2,1)}
.bl .bty-l4a li.foi .bty-l4a-ln>span{transform:translateY(-105%)}
.bl .bty-l4a-trilho{display:flex;gap:6px;max-width:460px;margin-top:40px}
.bl .bty-l4a-trilho i{flex:1;height:3px;border-radius:3px;background:var(--bl-cinza-2);overflow:hidden}
.bl .bty-l4a-trilho b{display:block;height:100%;background:var(--bl-preto);transform:scaleX(0);transform-origin:0 50%}
.bl .bty-l4a-nota{margin:24px 0 0;max-width:460px;padding:14px 18px;border-radius:14px;background:var(--bl-cinza-1);font:400 14px/1.45 var(--bl-texto);color:var(--bl-cinza-4);text-align:left}
.bl .bty-l4a-nota b{font-weight:600;color:var(--bl-preto)}
.bl .bty-l4a-palco{position:relative;width:min(100%,calc(100vh - 150px),620px);aspect-ratio:1;margin-left:auto;container-type:inline-size}
.bl .bty-l4a-disco,.bl .bty-l4a-noite{position:absolute;inset:4%;border-radius:50%;background:var(--bl-cinza-1);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bl .bty-l4a-noite{background:radial-gradient(circle at 40% 30%,#232323,#0A0A0A 70%);clip-path:circle(0% at 70% 22%);transition:clip-path 1.1s cubic-bezier(.65,0,.25,1)}
.bl .bty-l4a[data-k="1"] .bty-l4a-disco{transform:scale(1.05)}
.bl .bty-l4a[data-k="2"] .bty-l4a-noite{clip-path:circle(92% at 70% 22%)}
.bl .bty-l4a-bif{position:absolute;left:50%;bottom:11%;height:74%;aspect-ratio:205/628;transform:translateX(-50%);transition:transform 1.1s cubic-bezier(.65,0,.25,1),opacity .8s}
.bl .bty-l4a[data-k="1"] .bty-l4a-bif{transform:translateX(-135%) rotate(6deg)}
.bl .bty-l4a[data-k="2"] .bty-l4a-bif{transform:translateX(-300%) rotate(-14deg);opacity:0}
.bl .bty-l4a-mexe{position:absolute;inset:0;transform-origin:50% 88%}
.bl .bty-l4a-mexe>img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(0,0,0,.16))}
.bl .bty-l4a.sacode.rodando .bty-l4a-mexe{animation:bty-l4a-mexe .36s ease-in-out infinite alternate}
@keyframes bty-l4a-mexe{0%{transform:rotate(-10deg) translateY(-2%)}100%{transform:rotate(10deg) translateY(1.5%)}}
.bl .bty-l4a-mov{position:absolute;top:44%;width:16%;height:22%;border:2px solid var(--bl-preto);border-color:transparent var(--bl-preto) transparent transparent;border-radius:50%;opacity:0;transition:opacity .3s}
.bl .bty-l4a-mov.e{left:-34%;transform:scaleX(-1)}
.bl .bty-l4a-mov.d{right:-34%}
.bl .bty-l4a.sacode .bty-l4a-mov{opacity:.5}
.bl .bty-l4a.sacode.rodando .bty-l4a-mov{animation:bty-l4a-pisca .36s ease-in-out infinite alternate}
@keyframes bty-l4a-pisca{from{opacity:.15}to{opacity:.6}}
.bl .bty-l4a-liq{position:absolute;inset:0;clip-path:inset(30.5% 10.8% 1.6% .8% round 12% / 3.6%)}
.bl .bty-l4a-sep,.bl .bty-l4a-mix{position:absolute;inset:0}
.bl .bty-l4a-f1{position:absolute;left:0;right:0;top:0;height:63%;background:linear-gradient(180deg,rgba(255,253,244,.86),rgba(255,248,228,.8))}
.bl .bty-l4a-f2{position:absolute;left:0;right:0;top:63%;bottom:0;background:linear-gradient(180deg,rgba(170,108,14,.62),rgba(110,64,2,.7))}
.bl .bty-l4a-onda{position:absolute;left:0;top:calc(63% - 5px);width:200%;height:10px;overflow:visible}
.bl .bty-l4a-onda path{fill:none;stroke:#8A5A10;stroke-width:2.5;vector-effect:non-scaling-stroke}
.bl .bty-l4a.rodando .bty-l4a-onda{animation:bty-l4a-onda 2.2s linear infinite}
@keyframes bty-l4a-onda{to{transform:translateX(-50%)}}
.bl .bty-l4a-mix{opacity:0}
.bl .bty-l4a-brilho{position:absolute;inset:0;background:radial-gradient(60% 40% at 30% 45%,rgba(255,240,200,.55),transparent),radial-gradient(50% 35% at 70% 75%,rgba(255,226,150,.45),transparent),linear-gradient(180deg,rgba(255,236,190,.25),rgba(214,160,60,.28))}
.bl .bty-l4a-mix>i:not(.bty-l4a-brilho){position:absolute;width:5%;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:0 0 6px 2px rgba(255,255,255,.8);transform:scale(var(--z))}
.bl .bty-l4a.rodando .bty-l4a-mix>i:not(.bty-l4a-brilho){animation:bty-l4a-gl 1.6s var(--d) ease-in-out infinite}
@keyframes bty-l4a-gl{0%,100%{transform:scale(0);opacity:0}50%{transform:scale(var(--z));opacity:1}}
.bl .bty-l4a-gota{position:absolute;left:32%;top:17.5%;width:3.4cqw;height:3.4cqw;margin:-1.7cqw 0 0 -1.7cqw;opacity:0}
.bl .bty-l4a-gota>i{display:block;width:100%;height:100%;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 35% 30%,#fff 0 16%,#F1D58A 42%,#B8862A 100%)}
.bl .bty-l4a.rodando[data-k="1"] .bty-l4a-gota{animation:bty-l4a-gx 2.8s cubic-bezier(.25,.6,.45,1) .9s infinite}
.bl .bty-l4a.rodando[data-k="1"] .bty-l4a-gota>i{animation:bty-l4a-gy 2.8s cubic-bezier(.55,0,.9,.45) .9s infinite}
@keyframes bty-l4a-gx{0%,22%{transform:translateX(0);opacity:0}26%{opacity:1}58%{transform:translateX(23cqw);opacity:1}64%,100%{transform:translateX(23cqw);opacity:0}}
@keyframes bty-l4a-gy{0%{transform:translateY(0) scale(0)}22%{transform:translateY(0) scale(1)}58%{transform:translateY(46cqw) scale(.9,1.2)}62%,100%{transform:translateY(46cqw) scale(1.9,.35)}}
.bl .bty-l4a-pele{position:absolute;left:51%;top:56%;width:42%;aspect-ratio:5/2;transition:opacity .6s,transform 1s cubic-bezier(.65,0,.25,1)}
.bl .bty-l4a[data-k="0"] .bty-l4a-pele{opacity:0}
.bl .bty-l4a[data-k="2"] .bty-l4a-pele{opacity:0;transform:translateX(-30%) scale(.8)}
.bl .bty-l4a-traco{position:absolute;inset:0;overflow:hidden;clip-path:inset(-20% 100% -20% 0)}
.bl .bty-l4a-traco svg{width:100%;height:100%;display:block}
.bl .bty-l4a-luz{position:absolute;top:-20%;bottom:-20%;left:0;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:translateX(-120%);opacity:0}
.bl .bty-l4a.untado.rodando .bty-l4a-luz{animation:bty-l4a-luz 2.4s ease-in-out infinite}
@keyframes bty-l4a-luz{0%{transform:translateX(-120%);opacity:0}15%{opacity:1}60%{transform:translateX(380%);opacity:1}61%,100%{opacity:0;transform:translateX(380%)}}
.bl .bty-l4a-dedo{position:absolute;left:-4%;top:28%;width:16%;aspect-ratio:1;border-radius:50% 50% 46% 46%;background:radial-gradient(circle at 40% 35%,#fff,#ECECEC 70%);box-shadow:0 8px 18px rgba(0,0,0,.16),inset 0 -3px 0 rgba(0,0,0,.05);opacity:0;transition:opacity .3s}
.bl .bty-l4a.unta .bty-l4a-dedo{opacity:1}
.bl .bty-l4a-est{position:absolute;width:8%;aspect-ratio:1;margin:-4% 0 0 -4%;transform:scale(0)}
.bl .bty-l4a-est svg{display:block;width:100%;height:100%;fill:#C9973A}
.bl .bty-l4a.untado.rodando .bty-l4a-est{animation:bty-l4a-est 2.2s var(--d) cubic-bezier(.3,1.6,.5,1) infinite}
@keyframes bty-l4a-est{0%,100%{transform:scale(0) rotate(0)}30%{transform:scale(var(--z)) rotate(45deg)}60%{transform:scale(0) rotate(90deg)}}
.bl .bty-l4a-spl{position:absolute;left:50%;bottom:11%;height:74%;aspect-ratio:205/635;transform:translateX(120%) rotate(10deg);opacity:0;transition:transform 1.1s cubic-bezier(.65,0,.25,1),opacity .6s}
.bl .bty-l4a-spl>img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(0,0,0,.45))}
.bl .bty-l4a[data-k="2"] .bty-l4a-spl{transform:translateX(-12%);opacity:1}
.bl .bty-l4a-nevoa>i{position:absolute;left:36%;top:8%;width:2.4cqw;height:2.4cqw;margin:-1.2cqw;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));opacity:0}
.bl .bty-l4a-nevoa>i.o{background:radial-gradient(closest-side,rgba(240,206,128,1),rgba(240,206,128,0))}
.bl .bty-l4a.rodando[data-k="2"] .bty-l4a-nevoa>i{animation:bty-l4a-nv var(--t) calc(.7s + var(--d)) cubic-bezier(.1,.7,.3,1) infinite}
@keyframes bty-l4a-nv{0%{transform:translate(0,0) scale(.3);opacity:0}10%{opacity:.95}100%{transform:translate(var(--dx),var(--dy)) scale(var(--z));opacity:0}}
.bl .bty-l4a-nuvem{position:absolute;left:14%;top:6%;width:40%;aspect-ratio:1.4;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.22),rgba(255,255,255,0));transform:scale(.2);opacity:0;transform-origin:85% 60%}
.bl .bty-l4a.rodando[data-k="2"] .bty-l4a-nuvem{animation:bty-l4a-nuvem 2.6s .8s ease-out infinite}
@keyframes bty-l4a-nuvem{0%{transform:scale(.2);opacity:0}20%{opacity:1}100%{transform:scale(1.3);opacity:0}}
.bl .bty-l4a.rodando .bty-l4a-mexe,.bl .bty-l4a.rodando .bty-l4a-gota{will-change:transform}
@media (max-width:1100px){
	.bl .bty-l4a-g{gap:32px}
}
@media (max-width:767px){
	.bl .bty-l4a{height:330vh}
	.bl .bty-l4a-cola{height:100vh;height:100svh;align-items:stretch;padding:92px 0 84px}
	.bl .bty-l4a-g{display:flex;flex-direction:column;justify-content:center;gap:14px;height:100%}
	.bl .bty-l4a-palco{order:-1;width:min(100%,44svh);margin:0 auto;flex:none}
	.bl .bty-l4a-cont{font-size:40px}
	.bl .bty-l4a-de{font-size:18px}
	.bl .bty-l4a-passos{margin-top:10px}
	.bl .bty-l4a-passos h3{font-size:27px}
	.bl .bty-l4a-passos p{margin-top:10px;font-size:15px;line-height:1.5}
	.bl .bty-l4a-trilho{margin-top:18px;max-width:calc(100% - 64px)}
	.bl .bty-l4a-nota{margin-top:12px;padding:10px 12px;font-size:12.5px}
}
@media (max-width:767px) and (max-height:700px){
	.bl .bty-l4a-palco{width:min(100%,30svh)}
	.bl .bty-l4a-passos h3{font-size:23px}
}
@media (prefers-reduced-motion:reduce){
	.bl .bty-l4a{height:auto}
	.bl .bty-l4a-cola{position:static;height:auto!important;padding:80px 0}
	.bl .bty-l4a *{animation:none!important;transition:none!important}
	.bl .bty-l4a-passos{gap:28px}
	.bl .bty-l4a-passos>li{grid-area:auto}
	.bl .bty-l4a .bty-l4-w>span,.bl .bty-l4a-ln>span{transform:none!important}
	.bl .bty-l4a-cont,.bl .bty-l4a-trilho,.bl .bty-l4a-gota,.bl .bty-l4a-pele,.bl .bty-l4a-mov{display:none}
	.bl .bty-l4a-bif{transform:translateX(-110%)!important;opacity:1!important}
	.bl .bty-l4a-spl{transform:translateX(10%)!important;opacity:1!important}
	.bl .bty-l4a-noite{clip-path:none}
}