/* Direção E · Feed (5-nov-2026): a A com cara de app social. Fundo escuro com neon nas cores da embalagem, títulos
   Anton com gradiente, atalhos redondos tipo stories, barra de progresso, cartões de vidro, filtro «Seu cabelo é…» e
   próximo produto. A composição fica num bloco BRANCO no topo, com o maior contraste da página. */
:root{--noite:#140B22;--vidro:rgba(255,255,255,.07);--vidro-b:rgba(255,255,255,.14);--rosa:#FF4FA3;--grad:linear-gradient(90deg,var(--fundo),var(--rosa),var(--bloco))}
body.v-e{background:var(--noite);color:#fff;font-family:'Space Grotesk',system-ui,-apple-system,Arial,sans-serif}
.v-e h2{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v-e .eyebrow{color:var(--fundo)}
.v-e .secao{padding:56px 0}

/* progresso e topo */
.v-e .progresso{position:fixed;top:0;left:0;right:0;height:4px;z-index:60;background:transparent}
.v-e .progresso span{display:block;height:100%;background:var(--grad);transform:scaleX(0);transform-origin:0 50%}
.v-e .topo{background:rgba(20,11,34,.88);border-bottom:1px solid var(--vidro-b)}
.v-e .topo-in,.v-e .menu a{color:#fff}.v-e .menu a:hover{background:var(--vidro)}
.v-e .menu .principal{background:var(--grad);color:var(--noite)}

/* composição: bloco branco, contraste máximo */
.v-e .legal{background:#fff;color:var(--ink);border-bottom:0;border-radius:0 0 28px 28px}
.v-e .legal h1{background:none;color:var(--ink)}
.v-e .legal .busca{background:var(--ice)}

/* stories */
.v-e .stories{display:flex;gap:14px;overflow-x:auto;padding:18px 20px 8px;scrollbar-width:none;max-width:1240px;margin:auto}
.v-e .stories::-webkit-scrollbar{display:none}
.v-e .story{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:#fff;width:76px}
.v-e .anel{width:72px;height:72px;border-radius:50%;padding:3px;background:conic-gradient(var(--fundo),var(--rosa),var(--bloco),var(--fundo));display:block}
.v-e .anel img,.v-e .anel i{width:100%;height:100%;border-radius:50%;border:3px solid var(--noite);object-fit:cover;background:#2a1844;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:24px}
.v-e .rot{font-size:12px;font-weight:700;text-align:center}

/* abertura */
.v-e .heroi{background:radial-gradient(60% 50% at 85% 20%,color-mix(in srgb,var(--fundo) 55%,transparent),transparent 70%),radial-gradient(50% 45% at 10% 80%,color-mix(in srgb,var(--rosa) 45%,transparent),transparent 70%),var(--noite);color:#fff}
.v-e .heroi .grande{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v-e .heroi .grande em{color:#fff;-webkit-text-fill-color:#fff}
.v-e .packshot{box-shadow:0 0 0 6px rgba(255,255,255,.08),0 0 70px color-mix(in srgb,var(--fundo) 70%,transparent)}
.v-e .selo{background:var(--vidro);color:#fff;border:1px solid var(--vidro-b)}
.v-e .faixa{background:var(--vidro);color:#fff;border:1px solid var(--vidro-b);border-radius:24px;margin:0 0 24px;backdrop-filter:blur(8px)}
.v-e .botao{background:var(--grad);color:var(--noite);font-weight:800;box-shadow:0 8px 30px color-mix(in srgb,var(--rosa) 45%,transparent)}
.v-e .botao:hover{background:var(--grad);filter:brightness(1.08)}
.v-e .ancora{color:#fff}

/* vidro em tudo o que é cartão */
.v-e .sobre,.v-e .duvidas,.v-e .avaliacoes,.v-e .historia,.v-e .videos{background:transparent;color:#fff}
.v-e .ativo,.v-e .dica,.v-e .av,.v-e .duvida,.v-e .etapa,.v-e .capitulo{background:var(--vidro);border:1px solid var(--vidro-b);color:#fff;box-shadow:none;border-radius:22px}
.v-e .ativo .num,.v-e .capitulo .num{color:var(--rosa)}
.v-e .chips li{background:var(--vidro);color:#fff;border-color:var(--vidro-b)}
.v-e .dica{transform:none!important}.v-e .dica .tag{background:var(--grad);color:var(--noite)}
.v-e .av small,.v-e .aviso-av,.v-e .nota-media{color:rgba(255,255,255,.8)}.v-e .aviso-av a{color:#fff}
.v-e .duvida summary{color:#fff}.v-e .duvida summary::after{color:var(--fundo)}
.v-e .etapa img{background:#fff}.v-e .etapa::before{background:var(--grad);color:var(--noite)}
.v-e .etapa.atual{background:color-mix(in srgb,var(--fundo) 35%,transparent);color:#fff}
.v-e .uso{background:linear-gradient(150deg,color-mix(in srgb,var(--acento) 85%,#000),color-mix(in srgb,var(--rosa) 70%,var(--acento)));border-radius:36px;margin:0 8px}
.v-e .passos li{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35)}
.v-e .video .tela{border-radius:20px;box-shadow:0 0 0 2px var(--vidro-b)}
.v-e .foto{background:var(--vidro);box-shadow:none;transform:none!important;margin-top:0!important}.v-e .foto figcaption{color:#fff}
.v-e .artigo{color:#fff}.v-e .fonte{color:rgba(255,255,255,.75)}
.v-e .frase-final{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v-e .final{background:var(--grad);color:var(--noite)}.v-e .final h2{background:none;color:var(--noite)}.v-e .final .botao{background:var(--noite);color:#fff}
.v-e .rodape{background:#0b0614}

/* filtro «Seu cabelo é…» */
.v-e .filtro-cabelo{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 22px}
.v-e .filtro-cabelo span{font-weight:700;margin-right:4px}
.v-e .filtro-cabelo button{background:var(--vidro);color:#fff;border:1px solid var(--vidro-b);border-radius:999px;padding:9px 16px;font-weight:700;min-height:44px}
.v-e .filtro-cabelo button[aria-pressed="true"]{background:var(--grad);color:var(--noite);border-color:transparent}

/* próximo produto */
.v-e .proximo{padding:10px 20px 44px}
.v-e .proximo a{max-width:1240px;margin:auto;display:flex;align-items:center;gap:16px;text-decoration:none;color:#fff;background:var(--vidro);border:1px solid var(--vidro-b);border-radius:26px;padding:16px 20px}
.v-e .proximo img{width:80px;height:80px;object-fit:contain;background:#fff;border-radius:50%;box-shadow:0 0 30px color-mix(in srgb,var(--fundo) 60%,transparent)}
.v-e .proximo small{display:block;color:var(--fundo);font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:12px}
.v-e .proximo strong{font:400 clamp(22px,3vw,34px)/1.05 'Anton',sans-serif}.v-e .proximo b{margin-left:auto;font-size:36px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(max-width:860px){.v-e .uso{margin:0;border-radius:28px}}

html{overflow-x:clip}
.v-e .frase-legal{background:none;color:var(--ink);-webkit-text-fill-color:var(--ink)}