/* =========================================================
   SEÇÃO 3: POR QUE A SUA PELE MUDOU
   ========================================================= */
.porque-g{display:grid;gap:26px;max-width:980px;margin:0 auto}
.bloco{background:var(--c-escuro-2);border:2px solid var(--c-escuro-3);border-radius:28px;padding:24px 20px}
.bloco h3{font-size:clamp(25px,5.6vw,34px);margin-bottom:12px}
.bloco p{color:var(--c-suave-esc);font-size:20px}
.bloco p b{color:#fff}
.colageno{display:grid;gap:20px;align-items:center}
.frasco{position:relative;width:150px;height:210px;margin:0 auto}
.frasco .vidro{position:absolute;left:18px;right:18px;top:44px;bottom:0;border:4px solid #fff;border-radius:22px 22px 30px 30px;overflow:hidden;background:rgba(255,255,255,.04)}
.frasco .tampa{position:absolute;left:44px;right:44px;top:0;height:50px;border-radius:12px 12px 6px 6px;background:#fff}
.frasco .liq{position:absolute;left:0;right:0;bottom:0;height:100%;background:var(--c-acido);transition:height 2.2s var(--ease)}
.frasco .liq::before{content:"";position:absolute;left:-10%;right:-10%;top:-8px;height:16px;border-radius:50%;background:#FFA494;animation:mar 2.4s ease-in-out infinite}
@keyframes mar{50%{transform:translateY(3px) scaleX(.96)}}
.frasco .marca-30{position:absolute;right:-6px;left:-6px;top:calc(44px + 30% * .99);border-top:3px dashed #fff;opacity:0;transition:opacity .6s 2s}
.colageno.in .frasco .liq{height:70%}
.colageno.in .frasco .marca-30{opacity:1}
.grande{font-family:var(--f-titulo);font-size:clamp(64px,19vw,112px);line-height:.85;letter-spacing:-.05em;color:var(--c-acido)}
.grande small{font-size:.32em;letter-spacing:0;margin-right:6px;vertical-align:.9em}
.almofadas{display:grid;gap:18px;align-items:center}
.rosto{position:relative;width:220px;margin:0 auto}
.rosto svg{width:100%;height:auto;overflow:visible}
.rosto .contorno{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;transition:d .9s var(--ease)}
.rosto .alm{fill:var(--c-acido);opacity:.9;transform-box:fill-box;transform-origin:center;transition:transform 1s var(--mola),opacity .8s}
.rosto.murcha .alm{transform:scale(.45) translateY(30%);opacity:.45}
.rosto .olho{fill:#fff}
.btn-sec{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 22px;border-radius:999px;border:3px solid var(--c-acido);background:transparent;color:var(--c-acido);font-family:var(--f-titulo);font-size:18px;transition:background .2s,color .2s,transform .15s}
.btn-sec:hover,.btn-sec[aria-pressed="true"]{background:var(--c-acido);color:var(--c-escuro)}
.btn-sec:active{transform:scale(.95)}
.f-gelo .btn-sec,.f-branco .btn-sec{border-color:var(--c-escuro);color:var(--c-escuro)}
.f-gelo .btn-sec:hover,.f-branco .btn-sec:hover,.f-gelo .btn-sec[aria-pressed="true"],.f-branco .btn-sec[aria-pressed="true"]{background:var(--c-escuro);color:var(--c-acido)}
.sinais{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.sinais span{font-size:17px;font-weight:700;padding:6px 12px;border-radius:999px;background:var(--c-escuro);border:2px solid var(--c-escuro-3);opacity:0;transform:translateY(8px) scale(.9);transition:opacity .4s,transform .5s var(--mola)}
.almofadas.mostra .sinais span{opacity:1;transform:none}
.tentou{list-style:none;display:grid;gap:10px;margin-top:6px}
.tentou li{position:relative;display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--c-escuro);font-size:19px;font-weight:700;opacity:0;transform:translateX(-20px);transition:opacity .5s,transform .6s var(--ease)}
.tentou.in li{opacity:1;transform:none}
.tentou li .tx{position:relative}
.tentou li .tx::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:3px;border-radius:3px;background:var(--c-acido);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.tentou li.riscado .tx::after{transform:scaleX(1)}
.tentou li.riscado .tx{color:var(--c-suave-esc)}
.tentou li .xx{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--c-escuro-3);color:#fff;font-size:16px;transition:background .3s,color .3s,transform .4s var(--mola)}
.tentou li.riscado .xx{background:var(--c-acido);color:var(--c-escuro);transform:rotate(90deg)}
.aha{text-align:center;font-family:var(--f-titulo);font-size:clamp(34px,9vw,68px);line-height:1;margin-top:10px}
.aha em{font-style:normal;color:var(--c-escuro);background:var(--c-acido);padding:0 .14em;border-radius:10px;display:inline-block;transform:rotate(-2deg) scale(.6);opacity:0;transition:transform .8s var(--mola),opacity .4s}
.aha.in em{transform:rotate(-2deg);opacity:1}
@media(min-width:900px){.colageno,.almofadas{grid-template-columns:200px 1fr;gap:34px}.bloco{padding:32px}}