/**
 * VirtaCard — public/assets/css/card-profile.css
 * Bloco do perfil (cabeçalho, foto, nome, subtítulo, etiquetas, bio, ícones e visitas): medidas e
 * tipografia numa regra só para o cartão público (.p-*, show.php) e a prévia do editor (.vc-p-*).
 * Antes eram duas cópias com números diferentes e a prévia não batia com o cartão.
 *
 * Aqui ficam só tamanhos, espaços e pesos. Cores e famílias de fonte continuam em cada lado
 * (show.php usa --title/--text2, a prévia usa --c-title/--c-text2). Os layouts e a aba Visual
 * sobrescrevem estas medidas com seletores mais fortes (CardStyle::layoutCss, profileOverridesCss).
 *
 * A prévia desenha o perfil na largura de um celular e reduz com zoom (editor.css: --pv-w, --pv-z),
 * então os mesmos px dão o mesmo resultado: mesmas quebras de linha e mesmas posições.
 * Seletores em lista (não :is) para cada lado manter a especificidade que já tinha.
 */
/* O público herda line-height "normal" da página; a prévia herdaria o 1.5 do editor */
.p-header,.vc-p-prof{line-height:normal;}

.p-hbg,.vc-p-hbg{height:118px;position:relative;overflow:hidden;}

.av-wrap,.vc-p-avwrap{display:flex;justify-content:center;margin-top:-42px;margin-bottom:12px;position:relative;}
.av,.vc-p-av{width:84px;height:84px;font-size:28px;}

.p-info,.vc-p-prof .vc-p-body{padding:0 22px 22px;text-align:center;}

.p-name,.vc-p-name{font-weight:800;font-size:calc(22px * var(--vc-fs-name,1));margin-bottom:4px;line-height:1.2;}
.p-name .vc-last,.vc-p-name .vc-last{white-space:nowrap;}
.p-name .vc-verified,.vc-p-name .vc-verified{margin-left:.26em;position:relative;top:-.08em;}
.p-name .vc-verified svg,.vc-p-name .vc-verified svg{width:.82em;height:.82em;min-width:18px;min-height:18px;}

/* Subtítulo (cargo, empresa): logo abaixo do nome, mais leve, para a hierarquia ficar clara */
.p-sub,.vc-p-sub{font-size:calc(15px * var(--vc-fs-sub,1));font-weight:500;line-height:1.4;margin:0 0 8px;letter-spacing:.005em;overflow-wrap:anywhere;}
.p-bio,.vc-p-bio{font-size:calc(14.5px * var(--vc-fs-bio,1));line-height:1.6;margin-bottom:16px;}

/* Etiquetas; "Só texto" (aba Visual) tira a pílula e separa por "·" */
.p-tags,.vc-p-tags{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin:6px 0 8px;}
.p-tag,.vc-p-tag{padding:4px 11px;border-radius:20px;font-size:12px;font-weight:600;letter-spacing:.3px;}
.tags-text .p-tags,.vc-p-wrap.ov-tags-text .vc-p-tags{gap:0 4px;}
.tags-text .p-tag,.vc-p-wrap.ov-tags-text .vc-p-tag{background:none;border:0;padding:0;border-radius:0;font-weight:500;letter-spacing:0;}
.tags-text .p-tag + .p-tag::before,.vc-p-wrap.ov-tags-text .vc-p-tag + .vc-p-tag::before{content:"·";margin-right:6px;opacity:.6;}

/* Links "Só ícone": barra abaixo da bio */
.icon-bar,.vc-p-soc-grid{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:12px 16px 4px;}
.icon-bar-btn,.vc-p-soc-btn{width:42px;height:42px;border-radius:12px;flex-shrink:0;}
.icon-bar-btn i,.vc-p-soc-btn i{font-size:17px;}

/* Contador de visitas (Configurações) */
.p-views,.vc-p-views{text-align:center;font-size:12px;margin:-12px 0 16px;display:flex;align-items:center;justify-content:center;gap:6px;}

/* Formato da base do cabeçalho (Aparência → Cabeçalho → Estilo; CardStyle::headerShapeVars / vsHeaderShape).
   Duas camadas de máscara: o retângulo de cima, inteiro, e a faixa de baixo (--hs-d da altura) com o desenho SVG
   esticado na largura. Só o fundo do cabeçalho é recortado: a foto, o nome e os textos ficam fora dele, no lugar de
   sempre, e o que aparece no recorte é a caixa do perfil (ou o fundo do cartão, no perfil sem caixa).
   Sem data-hshape (reto, cartões antigos) nada muda. 1px de sobreposição entre as camadas evita uma linha fina. */
.p-hbg[data-hshape],.vc-p-hbg[data-hshape]{
  -webkit-mask-image:linear-gradient(#000,#000),var(--hs-mask);mask-image:linear-gradient(#000,#000),var(--hs-mask);
  -webkit-mask-size:100% calc(100% - var(--hs-d) + 1px),100% var(--hs-d);mask-size:100% calc(100% - var(--hs-d) + 1px),100% var(--hs-d);
  -webkit-mask-position:0 0,0 100%;mask-position:0 0,0 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}

/* @Virta (Virta ID da conta) logo abaixo do nome: identificação secundária, discreta; cores em cada lado
   (show.php .p-handle, editor.css .vc-p-handle). Acompanha o tamanho escolhido para o subtítulo. */
.p-handle,.vc-p-handle{display:block;font-size:calc(14px * var(--vc-fs-sub,1));font-weight:500;line-height:1.35;letter-spacing:.01em;margin:-2px 0 6px;overflow-wrap:anywhere;}
.vc-p-handle[hidden]{display:none;}