/* Dobra Sérum GHK-Cu L10 (skin_faq). GERADO por docs/layout/fonte-loja/dobras-skin-l10.py: não edite à mão. */
.bl .gw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.bl .gw>span{display:inline-block}
.bl .s10a{color:var(--bl-preto)}
.bl .s10a :where(h2,h3,p,figure){margin:0}
.bl .s10a-g{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);align-items:start}
.bl .s10a-lado{position:sticky;top:120px}
.bl .s10a-palco{position:relative;aspect-ratio:4/5;max-height:calc(100vh - 160px);margin-right:auto;border-radius:28px;overflow:hidden;background:var(--bl-cinza-1)}
.bl .s10a-f{position:absolute;inset:0;clip-path:circle(0% at 88% 12%);transition:clip-path 1.1s cubic-bezier(.65,0,.25,1)}
.bl .s10a-f img{width:100%;height:100%;object-fit:cover;transform:scale(1.25);transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}
.bl .s10a-f.on,.bl .s10a-f.foi{clip-path:circle(150% at 88% 12%)}
.bl .s10a-f.on img{transform:none}
.bl .s10a-f.foi img{transform:scale(1.05)}
.bl .s10a-rec{background:radial-gradient(closest-side,#FFFFFF,#E6E6E6)}
.bl .s10a-f.s10a-rec img{object-fit:contain;padding:12% 0;filter:drop-shadow(0 26px 30px rgba(10,10,10,.2))}
.bl .s10a-num{position:absolute;z-index:500;left:26px;bottom:18px;height:1em;overflow:hidden;font:400 italic clamp(72px,7vw,112px)/1 var(--bl-destaque);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.28)}
.bl .s10a-num>span,.bl .s10a-rot>span{display:flex;flex-direction:column;transform:translateY(calc(var(--k,0) * -1 * var(--h)));transition:transform .8s cubic-bezier(.7,0,.2,1)}
.bl .s10a-num>span{--h:1em}
.bl .s10a-rot{position:absolute;z-index:500;left:26px;top:22px;height:30px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.9);backdrop-filter:blur(8px)}
.bl .s10a-rot>span{--h:30px}
.bl .s10a-rot>span>span{display:block;height:30px;padding:0 14px;font:600 11px/30px var(--bl-titulo);letter-spacing:.12em;text-transform:uppercase;color:var(--bl-preto)}
.bl .s10a-cab .gw>span{transform:translateY(105%);transition:transform .8s calc(var(--w) * .05s) cubic-bezier(.2,.8,.2,1)}
.bl .s10a-cab.vivo .gw>span{transform:none}
.bl .s10a .dp-h2{font-size:clamp(30px,3.4vw,48px)}
.bl .s10a-sub{margin-top:14px;max-width:440px;color:var(--bl-cinza-4)}
.bl .s10a-capa{display:none}
.bl .s10a-lista{margin-top:36px;border-top:1px solid var(--bl-cinza-2)}
.bl .s10a-q summary{justify-content:flex-start;gap:18px;padding:24px 4px}
.bl .s10a-q summary b{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--bl-cinza-2);font:400 italic 17px/1 var(--bl-destaque);transition:background .4s,color .4s,box-shadow .4s}
.bl .s10a-q summary span{flex:1}
.bl .s10a-q[open] summary b{background:var(--bl-preto);color:#E2BC6A;box-shadow:none}
.bl .s10a-q{position:relative}
.bl .s10a-q::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,#C9973A,#E2BC6A);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s cubic-bezier(.7,0,.2,1)}
.bl .s10a-q[open]::after{transform:scaleX(1)}
.bl .s10a-r{display:flex;gap:16px;align-items:flex-start;padding:0 56px 24px 58px}
.bl .s10a-r p{padding:0;transform:translateY(10px);transition:opacity .35s .08s,transform .6s .08s cubic-bezier(.2,.8,.2,1)}
.bl .s10a-q[open] .s10a-r p{transform:none}
.bl .s10a-mini{display:none}
.bl .s10a-fim{margin-top:32px}
@media (max-width:767px){
	.bl .s10a-g{grid-template-columns:1fr;gap:0}
	.bl .s10a-lado{display:none}
	.bl .s10a .dp-h2{font-size:28px}
	.bl .s10a-capa{display:block;width:100%;aspect-ratio:16/11;object-fit:cover;object-position:50% 18%;border-radius:22px;margin-top:22px}
	.bl .s10a-lista{margin-top:20px}
	.bl .s10a-q summary{gap:14px;padding:20px 2px}
	.bl .s10a-q summary b{width:32px;height:32px;font-size:15px}
	.bl .s10a-r{padding:0 4px 22px 48px;gap:14px}
	.bl .s10a-mini{display:block;flex:none;width:64px;height:64px;border-radius:50%;object-fit:cover;clip-path:circle(0% at 50% 50%);transform:rotate(-30deg) scale(.8);transition:clip-path .8s .15s cubic-bezier(.65,0,.25,1),transform .9s .15s cubic-bezier(.2,.8,.2,1)}
	.bl .s10a-mini.s10a-rec{object-fit:contain;padding:6px}
	.bl .s10a-q[open] .s10a-mini{clip-path:circle(50% at 50% 50%);transform:none}
	.bl .s10a-fim .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
	.bl .s10a *{animation:none!important;transition:none!important}
}