/* =====================================================================================
   Viver de Comprinha · página /marca (Manual de identidade visual)
   Só layout e demonstrações desta página. Cores, fontes, raios e a sombra vêm de marca.css.
   Cores fora da paleta aparecem SÓ nos exemplos de uso indevido (marcados como errados).
   ===================================================================================== */

/* ---------- herói ---------- */
.mi-hero .dividir{align-items:center}
.mi-hero h1{font-size:clamp(40px,6.4vw,68px)}
.mi-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--e6)}
.mi-capa{position:relative;aspect-ratio:1/1;max-width:440px;margin:0 auto;width:100%;border-radius:var(--r-lg);background:var(--branco);border:1px solid var(--borda);display:grid;place-items:center;overflow:hidden}
.mi-capa .simbolo-grande{width:52%;height:auto;position:relative;z-index:1}
.mi-capa .blocos i:nth-child(1){width:22%;height:16%;top:8%;left:8%}
.mi-capa .blocos i:nth-child(2){width:14%;height:14%;bottom:10%;right:10%}
.mi-capa .blocos i:nth-child(3){width:18%;height:24%;bottom:8%;left:10%}
.mi-capa .blocos i:nth-child(4){width:12%;height:12%;top:12%;right:14%}

/* ---------- layout com índice ---------- */
.mi-layout{display:grid;gap:0;padding-bottom:var(--e16)}
@media(min-width:1080px){.mi-layout{grid-template-columns:232px minmax(0,1fr);gap:56px}}
.mi-conteudo{min-width:0}
.mi-indice{display:none}
@media(min-width:1080px){
  .mi-indice{display:block;position:sticky;top:96px;align-self:start;max-height:calc(100vh - 112px);overflow:auto;padding:var(--e8) 4px var(--e6) 0;scrollbar-width:thin}
}
.mi-indice p{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-apoio);margin:0 0 var(--e3) 12px}
.mi-indice ol{list-style:none;display:grid;gap:2px}
.mi-indice a{display:flex;gap:10px;align-items:baseline;padding:5px 12px;border-radius:var(--r-md);font-size:14px;font-weight:600;color:var(--texto-apoio);text-decoration:none;transition:background .2s,color .2s}
.mi-indice a span{font:800 11px/1 var(--f-texto);color:var(--texto-suave);min-width:18px}
.mi-indice a:hover{background:var(--lavanda-2);color:var(--texto)}
.mi-indice a.atual{background:var(--branco);color:var(--violeta)}
.mi-indice a.atual span{color:var(--violeta)}

/* índice no celular e tablet: faixa fixa de atalhos, rola de lado dentro dela */
.mi-indice-movel{position:sticky;top:72px;z-index:40;background:rgba(243,238,255,.96);border-bottom:1px solid var(--borda);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
@media(min-width:1080px){.mi-indice-movel{display:none}}
.mi-indice-movel nav{display:flex;gap:8px;overflow-x:auto;padding:8px 16px;scrollbar-width:none;overscroll-behavior-x:contain}
.mi-indice-movel nav::-webkit-scrollbar{display:none}
.mi-indice-movel a{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:48px;padding:0 16px;border-radius:var(--r-pill);background:var(--branco);border:1px solid var(--borda);
  font-size:14px;font-weight:700;color:var(--texto);text-decoration:none;white-space:nowrap}
.mi-indice-movel a span{font-size:11px;color:var(--texto-suave)}
.mi-indice-movel a.atual{background:var(--violeta);border-color:var(--violeta);color:#fff}
.mi-indice-movel a.atual span{color:#EDE5FF}

/* ---------- seções do manual ---------- */
.mi-sec{padding:var(--e12) 0;border-top:1px solid var(--borda);scroll-margin-top:144px}
.mi-sec:first-child{border-top:0}
@media(min-width:1080px){.mi-sec{padding:var(--e16) 0;scroll-margin-top:96px}}
.mi-cab{max-width:760px;margin-bottom:var(--e8)}
.mi-cab h2{margin:var(--e3) 0 var(--e4)}
.mi-sec h3{margin:var(--e12) 0 var(--e4);font-size:clamp(22px,2.6vw,28px)}
.mi-cab + h3{margin-top:0}
.mi-sec .cartao h3,.mi-sec .demo h3{margin:0 0 var(--e2);font-size:20px}
.mi-sec h4{margin-bottom:var(--e2)}
.mi-texto{max-width:720px;color:var(--texto-apoio)}
.mi-texto + .mi-texto{margin-top:var(--e3)}
.mi-sub{margin-top:var(--e8)}
.mi-pilha{display:grid;gap:var(--e4)}
.cartao.sem-efeito:hover{border-color:var(--borda)}
.mi-rotulo{display:block;font-size:12px;font-weight:700;color:var(--texto-apoio);margin-top:var(--e2)}

/* listas com marca */
.mi-lista{list-style:none;display:grid;gap:10px}
.mi-lista li{display:flex;gap:10px;align-items:flex-start;color:var(--texto-apoio)}
.mi-lista li .ic{width:20px;height:20px;margin-top:3px;color:var(--violeta)}
.mi-lista.nao li .ic{color:var(--erro)}
.mi-lista b{color:var(--texto)}
.cartao-ameixa .mi-lista li{color:#D9CEF5} .cartao-ameixa .mi-lista b{color:var(--lavanda)}
.cartao-ameixa .mi-lista li .ic{color:var(--lavanda)}

/* faça / não faça */
.sim-nao{display:grid;gap:var(--e4)}
@media(min-width:720px){.sim-nao{grid-template-columns:1fr 1fr}}
.sim-nao .cartao h4{display:flex;align-items:center;gap:8px}
.marca-sim{color:var(--sucesso)} .marca-nao{color:var(--erro)}

/* ---------- estratégia e voz ---------- */
.atributos{display:grid;gap:var(--e3);grid-template-columns:repeat(2,1fr)}
@media(min-width:720px){.atributos{grid-template-columns:repeat(3,1fr)}}
.atributo{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e4)}
.atributo b{display:block;font:800 22px/1.1 var(--f-titulo);letter-spacing:-.02em;margin-bottom:4px}
.atributo span{font-size:14px;color:var(--texto-apoio)}
.atributo i{font:800 12px/1 var(--f-texto);font-style:normal;color:var(--violeta);display:block;margin-bottom:8px}
.persona{display:grid;gap:var(--e3)}
.persona .quem{display:flex;gap:12px;align-items:center}
.persona .ini{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--lavanda);color:var(--violeta);font:800 20px/1 var(--f-titulo)}
.persona dl{display:grid;gap:8px;font-size:15px}
.persona dt{font-weight:700;color:var(--texto)}
.persona dd{color:var(--texto-apoio);margin-bottom:6px}
.proposta{display:grid;gap:var(--e3)}
@media(min-width:720px){.proposta{grid-template-columns:repeat(2,1fr)}}
.proposta .cartao h4{font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--violeta)}
.dizemos{display:grid;gap:0;border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden;background:var(--branco)}
.dizemos .lin{display:grid;grid-template-columns:1fr;border-top:1px solid var(--borda)}
.dizemos .lin:first-child{border-top:0}
@media(min-width:720px){.dizemos .lin{grid-template-columns:1fr 1fr}}
.dizemos .lin > div{padding:14px 16px;display:flex;gap:10px;align-items:flex-start;font-size:15px}
.dizemos .lin > div .ic{width:20px;height:20px;margin-top:2px}
.dizemos .cab-l{background:var(--lavanda-2);font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--texto-apoio)}
.dizemos .sim .ic{color:var(--sucesso)} .dizemos .nao .ic{color:var(--erro)}
.dizemos .nao{color:var(--texto-apoio);text-decoration:line-through;text-decoration-color:rgba(180,35,24,.5)}
@media(max-width:719px){.dizemos .cab-l{display:none!important}}
.palavras{display:flex;flex-wrap:wrap;gap:8px}
.palavras span{padding:8px 14px;border-radius:var(--r-pill);background:var(--branco);border:1px solid var(--borda);font-weight:700;font-size:15px}
.palavras.evitar span{background:transparent;border-style:dashed;border-color:var(--borda-forte);color:var(--texto-apoio);text-decoration:line-through}
.exemplo-voz{display:block;margin-top:var(--e3);padding:12px 14px;border-radius:var(--r-md);background:var(--lavanda);font-weight:600;color:var(--texto)}
.manifesto{position:relative;overflow:hidden;border-radius:var(--r-lg);background:var(--ameixa);color:var(--lavanda);padding:var(--e8) var(--e6)}
@media(min-width:768px){.manifesto{padding:var(--e12)}}
.manifesto blockquote{position:relative;z-index:1;max-width:680px}
.manifesto .abre{font:800 clamp(28px,4vw,40px)/1.1 var(--f-titulo);letter-spacing:-.02em;color:var(--lavanda);margin-bottom:var(--e6)}
.manifesto p{color:#D9CEF5;font-size:17px;margin-bottom:var(--e4)}
.manifesto .fecha{font:800 22px/1.2 var(--f-titulo);color:var(--lavanda);margin:var(--e6) 0 0}

/* ---------- logotipo ---------- */
.anatomia{display:grid;gap:var(--e6);align-items:center}
@media(min-width:768px){.anatomia{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}
.anatomia figure{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e6)}
.anatomia figure svg{width:100%;max-width:320px;margin:0 auto}
.anatomia ol{list-style:none;display:grid;gap:var(--e4)}
.anatomia li{display:flex;gap:14px}
.anatomia li .n{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--violeta);color:#fff;font:800 15px/1 var(--f-titulo)}
.anatomia li p{color:var(--texto-apoio);font-size:15px}
.versoes{display:grid;gap:var(--e4)}
@media(min-width:720px){.versoes{grid-template-columns:repeat(2,1fr)}}
.versao{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden}
.versao .palco{min-height:180px;display:grid;place-items:center;padding:var(--e6);background:var(--lavanda)}
.versao .palco img{max-height:110px;width:auto;max-width:100%}
.versao .info{padding:var(--e4) var(--e6)}
.versao .info b{display:block}
.versao .info span{font-size:14px;color:var(--texto-apoio)}
.fundos{display:grid;gap:var(--e3)}
@media(min-width:720px){.fundos{grid-template-columns:repeat(2,1fr)}}
.fundo{border-radius:var(--r-lg);border:1px solid var(--borda);padding:var(--e6);display:grid;gap:var(--e4)}
.fundo img{height:56px;width:auto;max-width:100%}
.fundo span{font-size:14px;font-weight:600}
.fundo.f-lavanda{background:var(--lavanda)} .fundo.f-branco{background:var(--branco)}
.fundo.f-violeta{background:var(--violeta);border-color:var(--violeta);color:var(--lavanda)}
.fundo.f-ameixa{background:var(--ameixa);border-color:var(--ameixa);color:var(--lavanda)}
.protecao-palco{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e8) var(--e4);display:grid;place-items:center;gap:var(--e4)}
.protecao{--w:min(360px,62vw);--x:calc(var(--w) * 100 / 797);position:relative;padding:var(--x);outline:2px dashed var(--violeta);outline-offset:-2px;border-radius:var(--r-sm)}
.protecao img{width:var(--w);height:auto}
.protecao .xm{position:absolute;width:var(--x);height:var(--x);background:var(--lavanda-3);display:grid;place-items:center;font:800 13px/1 var(--f-texto);color:var(--violeta);border-radius:4px}
.protecao .xm.t{top:0;left:calc(50% - var(--x) / 2)} .protecao .xm.b{bottom:0;left:calc(50% - var(--x) / 2)}
.protecao .xm.l{left:0;top:calc(50% - var(--x) / 2)} .protecao .xm.r{right:0;top:calc(50% - var(--x) / 2)}
.protecao-palco figcaption{font-size:14px;font-weight:700;color:var(--violeta);text-align:center}
.reducao{display:grid;gap:var(--e4)}
@media(min-width:720px){.reducao{grid-template-columns:repeat(3,1fr)}}
.reducao .cartao{display:grid;gap:var(--e4);align-content:start}
.reducao .palco{min-height:72px;display:flex;align-items:center;gap:var(--e4)}
.reducao .r24{height:24px;width:auto} .reducao .r32{height:32px;width:auto} .reducao .rav{width:32px;height:32px}
.indevidos{display:grid;gap:var(--e4);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.indevidos{grid-template-columns:repeat(3,1fr)}}
.indevido{margin:0}
.indevido .palco{position:relative;height:140px;display:grid;place-items:center;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden}
.indevido .palco::after{content:"";position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;
  background:var(--erro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 8l8 8M16 8l-8 8' stroke='%23fff' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center/18px no-repeat}
.indevido .palco svg,.indevido .palco img{width:64px;height:auto}
.indevido figcaption{font-size:14px;font-weight:700;margin-top:var(--e2)}
.indevido figcaption small{display:block;font-weight:500;color:var(--texto-apoio)}
.ind-esticar{transform:scale(1.9,.62)}
.ind-girar{transform:rotate(-24deg)}
.indevido .ind-caixa{font:800 16px/1.2 var(--f-titulo);letter-spacing:.24em;text-transform:uppercase;text-align:center;padding:0 16px;color:var(--texto)}
.sac.ind-cor-sorriso{--c-sorriso:#1F1535}
.sac.ind-loja{--c-bolsa:#EE4D2D;--c-sorriso:#FFD43B}          /* errado de propósito: cor de loja */
.sac.ind-lima{--c-bolsa:#C8F03C;--c-sorriso:#1F1535}
.downloads{display:grid;gap:var(--e3)}
@media(min-width:720px){.downloads{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1200px){.downloads{grid-template-columns:repeat(3,1fr)}}
.download{display:flex;align-items:center;gap:var(--e4);min-height:72px;padding:12px 16px;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-md);text-decoration:none;color:var(--texto);transition:border-color .2s,transform .35s var(--ease)}
.download:hover{border-color:var(--violeta);color:var(--texto);transform:translateY(-2px)}
.download .min{flex:none;width:56px;height:48px;border-radius:var(--r-sm);display:grid;place-items:center;padding:6px}
.download .min img{max-height:36px;width:auto;max-width:100%}
.download .min.m-lavanda{background:var(--lavanda)} .download .min.m-violeta{background:var(--violeta)} .download .min.m-ameixa{background:var(--ameixa)}
.download b{display:block;font-size:15px}
.download small{font-size:12px;color:var(--texto-apoio)}
.download .ic{margin-left:auto;color:var(--violeta)}

/* sacola desenhada (sprite): cores por variável, para os exemplos */
.sac{--c-bolsa:#5B21B6;--c-sorriso:#C8F03C}

/* ---------- cores ---------- */
.paleta{display:grid;gap:var(--e3);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.paleta{grid-template-columns:repeat(5,1fr)}}
.amostra{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column}
.amostra .cor{height:112px;padding:var(--e3) var(--e4);display:flex;align-items:flex-end;font:800 20px/1 var(--f-titulo)}
.amostra .dados{padding:var(--e3) var(--e4) var(--e4);display:grid;gap:4px;font-size:13px;color:var(--texto-apoio);flex:1}
.amostra .dados code{font:700 13px/1.4 ui-monospace,Consolas,monospace;color:var(--texto)}
.amostra .dados p{margin-top:4px}
.amostra .copiar{margin-top:var(--e2);min-height:40px;padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--borda-forte);background:var(--branco);font:700 13px var(--f-texto);color:var(--violeta);cursor:pointer;justify-self:start}
.amostra .copiar:hover{border-color:var(--violeta)}
.c-violeta{background:var(--violeta);color:#fff} .c-lilas{background:var(--lilas);color:var(--ameixa)}
.c-lavanda{background:var(--lavanda);color:var(--ameixa);border-bottom:1px solid var(--borda)} .c-lima{background:var(--lima);color:var(--ameixa)}
.c-ameixa{background:var(--ameixa);color:var(--lavanda)}
.proporcao{display:flex;height:80px;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--borda)}
.proporcao i{display:block;height:100%}
.proporcao .p55{flex:55;background:var(--lavanda)} .proporcao .p20{flex:20;background:var(--violeta)} .proporcao .p10a{flex:10;background:var(--lilas)}
.proporcao .p10b{flex:10;background:var(--ameixa)} .proporcao .p5{flex:5;background:var(--lima)}
.proporcao-leg{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:var(--e3);font-size:14px;font-weight:600}
.proporcao-leg span{display:inline-flex;align-items:center;gap:8px}
.proporcao-leg i{width:14px;height:14px;border-radius:4px;border:1px solid var(--borda-forte)}
.contrastes{display:grid;gap:var(--e3);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.contrastes{grid-template-columns:repeat(4,1fr)}}
.par{border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden;background:var(--branco)}
.par .aa{height:96px;display:grid;place-items:center;font:800 44px/1 var(--f-titulo)}
.par .aa svg{width:72px;height:48px}
.par .info{padding:12px 14px;font-size:13px;color:var(--texto-apoio)}
.par .info b{display:block;font-size:14px;color:var(--texto)}
.par .info .v{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-weight:700}
.par.ok .v{color:var(--sucesso)} .par.nao .v{color:var(--erro)}
.aa.ameixa-lavanda{background:var(--lavanda);color:var(--ameixa)} .aa.ameixa-branco{background:var(--branco);color:var(--ameixa);border-bottom:1px solid var(--borda)}
.aa.branco-violeta{background:var(--violeta);color:#fff} .aa.ameixa-lima{background:var(--lima);color:var(--ameixa)}
.aa.lavanda-ameixa{background:var(--ameixa);color:var(--lavanda)} .aa.lima-ameixa{background:var(--ameixa);color:var(--lima)}
.aa.lima-branco{background:var(--branco);border-bottom:1px solid var(--borda)} .aa.lilas-lavanda{background:var(--lavanda)}

/* ---------- tipografia ---------- */
.especime{display:grid;gap:var(--e4)}
@media(min-width:900px){.especime{grid-template-columns:1fr 1fr}}
.especime .cartao{overflow:hidden}
.especime .aa-g{font:800 clamp(88px,12vw,128px)/.9 var(--f-titulo);letter-spacing:-.03em;color:var(--violeta)}
.especime .aa-g.fig{font-family:var(--f-texto);font-weight:600}
.especime .alfa{font-size:15px;color:var(--texto-apoio);word-break:break-word;margin-top:var(--e4);line-height:1.5}
.especime .alfa.bri{font-family:var(--f-titulo);font-weight:800}
.pesos{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:var(--e3);font-size:15px}
.pesos .w4{font-weight:400}.pesos .w5{font-weight:500}.pesos .w6{font-weight:600}.pesos .w7{font-weight:700}
.escala{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden}
.escala .lin{display:grid;gap:6px;padding:var(--e4) var(--e6);border-top:1px solid var(--borda);align-items:center}
.escala .lin:first-child{border-top:0}
@media(min-width:768px){.escala .lin{grid-template-columns:170px minmax(0,1fr);gap:var(--e6)}}
.escala .meta b{display:block;font:700 14px/1.3 ui-monospace,Consolas,monospace;color:var(--violeta)}
.escala .meta span{font-size:13px;color:var(--texto-apoio)}
.escala .am{color:var(--texto);min-width:0;overflow-wrap:anywhere}
.t-dxl{font:800 clamp(36px,8vw,56px)/1.05 var(--f-titulo);letter-spacing:-.02em}
.t-dlg{font:800 clamp(30px,6vw,40px)/1.1 var(--f-titulo);letter-spacing:-.02em}
.t-tit{font:700 28px/1.2 var(--f-titulo);letter-spacing:-.01em}
.t-clg{font:400 18px/1.5 var(--f-texto)} .t-c{font:400 16px/1.5 var(--f-texto)} .t-cf{font:700 16px/1.5 var(--f-texto)}
.t-peq{font:500 14px/1.5 var(--f-texto)} .t-leg{font:700 12px/1.4 var(--f-texto)}
.nota-escala{font-size:13px;color:var(--texto-suave);margin-top:var(--e3)}

/* ---------- grid e espaço ---------- */
.espacos{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e6);display:grid;gap:10px}
.espaco{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--e4);align-items:center;font-size:13px}
.espaco b{font:700 13px ui-monospace,Consolas,monospace;color:var(--texto)}
.espaco b small{display:block;font:500 12px var(--f-texto);color:var(--texto-apoio)}
.espaco i{display:block;height:16px;width:calc(var(--v) * 2px);max-width:100%;border-radius:4px;background:var(--violeta)}
.espaco.site i{background:var(--lilas)}
.margens{display:grid;gap:var(--e4)}
@media(min-width:768px){.margens{grid-template-columns:repeat(3,1fr)}}
.margem-demo{border-radius:var(--r-md);background:var(--lavanda-3);padding:8px;display:grid}
.margem-demo div{border-radius:var(--r-sm);background:var(--branco);border:1px dashed var(--violeta);min-height:110px;display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--violeta);text-align:center;padding:8px}
.margem-demo.m32{padding:16px} .margem-demo.feed{aspect-ratio:4/5;padding:9px}

/* ---------- formas ---------- */
.raios{display:grid;gap:var(--e4);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.raios{grid-template-columns:repeat(4,1fr)}}
.raio{display:grid;gap:var(--e3)}
.raio i{display:block;height:96px;background:var(--lavanda-3);border:2px solid var(--violeta)}
.raio .r8{border-radius:var(--r-sm)} .raio .r16{border-radius:var(--r-md)} .raio .r24{border-radius:var(--r-lg)} .raio .rp{border-radius:var(--r-pill)}
.raio b{font:700 13px ui-monospace,Consolas,monospace} .raio span{font-size:13px;color:var(--texto-apoio)}
.sombra-demo{display:grid;gap:var(--e6);align-items:center;background:var(--lavanda-2);border-radius:var(--r-lg);padding:var(--e6)}
@media(min-width:768px){.sombra-demo{grid-template-columns:auto 1fr}}

/* ---------- ícones ---------- */
.icones{display:grid;gap:var(--e3);grid-template-columns:repeat(auto-fill,minmax(112px,1fr))}
.icone{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e4) 8px;display:grid;justify-items:center;gap:8px;font-size:14px;font-weight:700;text-align:center}
.icone .ic{width:28px;height:28px;color:var(--violeta)}
.icone:nth-child(even) .ic{color:var(--ameixa)}
.ic-grade{display:grid;gap:var(--e4);align-items:center}
@media(min-width:768px){.ic-grade{grid-template-columns:auto 1fr}}
.ic-ampliado{width:168px;height:168px;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:12px;
  background-image:linear-gradient(var(--lavanda-2) 1px,transparent 1px),linear-gradient(90deg,var(--lavanda-2) 1px,transparent 1px);background-size:12px 12px;background-position:12px 12px}
.ic-ampliado .ic{width:144px;height:144px;stroke-width:2;color:var(--violeta)}

/* ---------- ilustração e elementos ---------- */
.ilus{position:relative;aspect-ratio:16/11;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);overflow:hidden}
.ilus .cel{position:absolute;left:36%;top:10%;width:26%;height:80%;border:8px solid var(--ameixa);border-radius:var(--r-lg);background:var(--lavanda);padding:12% 10%;display:grid;align-content:start;gap:8%}
.ilus .cel i{display:block;height:9%;min-height:14px;border-radius:var(--r-pill);background:var(--lilas)}
.ilus .cel i.b{background:var(--branco);margin-left:20%} .ilus .cel i.c{width:70%} .ilus .cel i.v{background:var(--violeta);margin-top:12%}
.ilus .moeda{position:absolute;border-radius:50%;display:grid;place-items:center}
.ilus .moeda svg{width:56%;height:auto}
.ilus .m1{left:12%;top:30%;width:15%;aspect-ratio:1;background:var(--lima);color:var(--ameixa)}
.ilus .m2{right:16%;top:18%;width:10%;aspect-ratio:1;background:var(--lilas);color:var(--ameixa)}
.ilus .bolsa{position:absolute;right:12%;bottom:14%;width:17%}
.elementos{display:grid;gap:var(--e3);grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.elementos{grid-template-columns:repeat(4,1fr)}}
.el{aspect-ratio:1;border-radius:var(--r-lg);display:grid;place-items:center;position:relative;overflow:hidden}
.el.e-violeta{background-color:var(--violeta);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='40' viewBox='0 0 48 40'%3E%3Cpath d='M18 16q6 7 12 0' fill='none' stroke='%23A78BFA' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");background-size:48px 40px}
.el.e-lima{background:var(--lima);color:var(--ameixa)}
.el.e-lima svg{width:50%}
.el.e-lilas{background:var(--lilas);color:var(--ameixa)}
.el.e-lilas svg{width:22%}
.el.e-ameixa{background:var(--ameixa)}
.el.e-ameixa svg{width:40%}
.textura-demo{position:relative;height:200px;border-radius:var(--r-lg);background:var(--lavanda-2);overflow:hidden;border:1px solid var(--borda);display:flex;align-items:center;padding:var(--e6)}
.textura-demo .textura-sorriso{opacity:1;inset:-20% -10% -20% auto;width:55%;height:140%}
.textura-demo p{position:relative;max-width:50%;font:800 clamp(20px,3vw,28px)/1.15 var(--f-titulo);letter-spacing:-.02em}

/* ---------- fotografia ---------- */
.mandamentos{display:grid;gap:var(--e4)}
@media(min-width:900px){.mandamentos{grid-template-columns:repeat(3,1fr)}}
.mandamentos .num{font:800 40px/1 var(--f-titulo);color:var(--violeta);letter-spacing:-.02em}
.quadros{display:grid;gap:var(--e3);grid-template-columns:repeat(3,1fr)}
.quadro{aspect-ratio:4/5;border-radius:var(--r-lg);border:2px dashed var(--borda-forte);display:grid;place-items:center;text-align:center;padding:8px;font-size:12px;font-weight:700;color:var(--texto-apoio);background:var(--branco)}
.quadro .ic{color:var(--lilas);margin:0 auto 6px}

/* ---------- motion ---------- */
.demos{display:grid;gap:var(--e4)}
@media(min-width:900px){.demos{grid-template-columns:repeat(2,1fr)}}
.demo{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e6);display:grid;gap:var(--e4);align-content:start;min-width:0}
.demo p{font-size:15px;color:var(--texto-apoio)}
.demo .uso{font-size:13px;color:var(--texto-suave)}
.demo .uso code{font:600 12px ui-monospace,Consolas,monospace;color:var(--violeta);background:var(--lavanda);padding:2px 6px;border-radius:4px}
.palco-m{position:relative;min-height:180px;display:grid;place-items:center;background:var(--lavanda);border-radius:var(--r-md);overflow:hidden;padding:var(--e4)}
.repetir{justify-self:start;min-height:48px;padding:0 18px;border-radius:var(--r-pill);border:2px solid var(--violeta);background:transparent;color:var(--violeta);font:700 14px var(--f-texto);cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.repetir:hover{background:var(--violeta);color:#fff}
.repetir .ic{width:18px;height:18px}
.curvas{display:grid;gap:var(--e4);width:100%}
.curva b{display:block;font:700 13px ui-monospace,Consolas,monospace;margin-bottom:6px}
.trilha{position:relative;height:28px;border-radius:var(--r-pill);background:var(--branco)}
.trilha .bola{position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:var(--violeta);transition:left 1.1s var(--ease)}
.trilha.mola .bola{transition-timing-function:var(--ease-mola);background:var(--ameixa)}
.trilha.linear .bola{transition-timing-function:linear;background:var(--lilas)}
.curvas.rodar .bola{left:calc(100% - 26px)}
.mini-cartoes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%}
.mini-cartoes div{height:72px;border-radius:var(--r-md);background:var(--branco);border:1px solid var(--borda)}
.palco-m .palavra-titulo{font:800 clamp(24px,4vw,32px)/1.15 var(--f-titulo);letter-spacing:-.02em;text-align:center}
.palco-m .chat-sim{width:100%;max-width:320px;min-height:250px}
.palco-m .flutua svg,.palco-m .flutua img{width:88px;height:auto}
.palco-m .inclina{width:min(260px,100%)}
.palco-par{height:200px;place-items:stretch;padding:0}
.palco-par .camada{position:absolute;inset:0;display:grid;place-items:center}
.palco-par .camada i{position:absolute;border-radius:var(--r-lg);background:var(--lavanda-3)}
.palco-par .c1 i{width:40%;height:30%;top:10%;left:6%}
.palco-par .c2 i{width:22%;height:40%;bottom:-6%;right:8%;background:var(--lilas);opacity:.45}
.palco-par .c3 b{position:relative;font:800 24px/1.1 var(--f-titulo);background:var(--branco);padding:12px 18px;border-radius:var(--r-pill);border:1px solid var(--borda)}
.palco-m .numeros{width:100%;grid-template-columns:repeat(2,1fr);gap:10px}
.palco-m .numero{padding:var(--e4)}
.palco-m .numero b{font-size:36px}
.palco-m .numero span{font-size:13px}
.palco-m .faixa{width:100%}
.palco-m .sorriso-desenho{width:160px;height:auto}
.tokens-motion{margin-top:var(--e4)}
.amostra-ease{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--violeta);vertical-align:middle;margin-right:6px}

/* ---------- som ---------- */
.ouvir{display:flex;flex-wrap:wrap;gap:var(--e4);align-items:center;margin-top:var(--e4)}
.ondas{display:flex;gap:4px;align-items:flex-end;height:32px}
.ondas i{width:6px;border-radius:3px;background:var(--lilas);height:30%;transition:height .25s var(--ease)}
.ondas.toca i:nth-child(1){height:50%}.ondas.toca i:nth-child(2){height:90%}.ondas.toca i:nth-child(3){height:60%}.ondas.toca i:nth-child(4){height:100%}.ondas.toca i:nth-child(5){height:40%}

/* ---------- componentes ---------- */
.vitrine{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e6);display:grid;gap:var(--e4)}
.vitrine.lavanda{background:var(--lavanda);border-color:var(--lavanda-3)}
.vitrine.violeta{background:var(--violeta);border-color:var(--violeta)}
.vitrine .fila{display:flex;flex-wrap:wrap;gap:var(--e3);align-items:center}
.vitrine .rot{font-size:13px;font-weight:700;color:var(--texto-apoio);display:block}
.vitrine.violeta .rot{color:#EDE5FF}
.btn.forcar-foco{box-shadow:var(--foco)}
.btn.btn-violeta:disabled,.btn.btn-violeta[aria-disabled="true"]{background:var(--lavanda-3);color:var(--texto-apoio);cursor:not-allowed;transform:none}
.campo-m{display:grid;gap:6px;max-width:420px}
.campo-m label{font-weight:700;font-size:15px}
.campo-m input,.campo-m textarea{width:100%;min-height:48px;padding:12px 16px;border:2px solid var(--violeta);border-radius:var(--r-md);background:var(--branco);font:16px/1.4 var(--f-texto);color:var(--texto)}
.campo-m textarea{min-height:150px;resize:vertical}
.campo-m input:focus,.campo-m textarea:focus{outline:none;box-shadow:var(--foco)}
.campo-m .ajuda{font-size:13px;color:var(--texto-apoio)}
.campo-m.erro input{border-color:var(--erro)}
.campo-m .msg{display:flex;gap:6px;align-items:center;font-size:14px;font-weight:700}
.campo-m .msg .ic{width:18px;height:18px}
.campo-m.erro .msg{color:var(--erro)} .campo-m.ok .msg{color:var(--sucesso)}
.campo-m.ok input{border-color:var(--sucesso)}
.rascunho{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--violeta);background:var(--lavanda-2);border-radius:var(--r-pill);padding:4px 10px;justify-self:start}
.oferta-c .loja{font-size:13px;font-weight:600;color:var(--texto-apoio)}
.oferta-c .img svg{width:40%;height:auto}

/* ---------- site e landings ---------- */
.wire{display:grid;gap:6px;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e4)}
.wire div{border-radius:var(--r-sm);padding:10px 14px;font-size:13px;font-weight:700;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.wire div small{font-weight:500;opacity:.85}
.w-topo{background:var(--lavanda-2);color:var(--texto)} .w-heroi{background:var(--lavanda);color:var(--texto);min-height:84px;border:1px solid var(--lavanda-3)}
.w-branca{background:var(--branco);border:1px solid var(--borda);color:var(--texto)} .w-lavanda{background:var(--lavanda);border:1px solid var(--lavanda-3);color:var(--texto)}
.w-ameixa{background:var(--ameixa);color:var(--lavanda)} .w-violeta{background:var(--violeta);color:#fff} .w-rodape{background:var(--ameixa);color:#D9CEF5;min-height:56px}
.regras-secao{display:grid;gap:var(--e3)}
@media(min-width:720px){.regras-secao{grid-template-columns:repeat(2,1fr)}}
.regra-s{border-radius:var(--r-lg);padding:var(--e6);border:1px solid var(--borda)}
.regra-s h4{font-family:var(--f-titulo);font-weight:800;font-size:20px;letter-spacing:-.01em}
.regra-s p{font-size:15px}
.regra-s code{font:600 12px ui-monospace,Consolas,monospace;padding:2px 6px;border-radius:4px;background:rgba(255,255,255,.6)}
.regra-s.r-lavanda{background:var(--lavanda);border-color:var(--lavanda-3)} .regra-s.r-lavanda p{color:var(--texto-apoio)}
.regra-s.r-branca{background:var(--branco)} .regra-s.r-branca p{color:var(--texto-apoio)}
.regra-s.r-ameixa{background:var(--ameixa);border-color:var(--ameixa);color:var(--lavanda)} .regra-s.r-ameixa h4{color:var(--lavanda)} .regra-s.r-ameixa p{color:#D9CEF5}
.regra-s.r-ameixa code,.regra-s.r-violeta code{background:rgba(255,255,255,.14);color:var(--lavanda)}
.regra-s.r-violeta{background:var(--violeta);border-color:var(--violeta);color:var(--lavanda)} .regra-s.r-violeta h4{color:var(--lavanda)} .regra-s.r-violeta p{color:#EDE5FF}
.paginas-site{display:flex;flex-wrap:wrap;gap:8px}
.paginas-site a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--r-pill);background:var(--branco);border:1px solid var(--borda);font-weight:700;font-size:14px;text-decoration:none}
.lp-ficha{display:grid;gap:var(--e6)}
@media(min-width:900px){.lp-ficha{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}
.lp-ficha dl{display:grid;gap:4px}
.lp-ficha dt{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--violeta);margin-top:var(--e3)}
.lp-ficha dt:first-child{margin-top:0}
.lp-ficha dd{color:var(--texto-apoio)}
.lp-ficha .promessa{font:800 clamp(22px,3vw,28px)/1.15 var(--f-titulo);letter-spacing:-.02em;color:var(--texto)}
.lp-secoes{list-style:none;counter-reset:s;display:grid;gap:8px}
.lp-secoes li{counter-increment:s;display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:start;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-md);padding:10px 12px;font-size:14px;color:var(--texto-apoio)}
.lp-secoes li::before{content:counter(s);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--lavanda-2);color:var(--violeta);font:800 13px/1 var(--f-titulo)}
.lp-secoes li b{color:var(--texto)}

/* ---------- app ---------- */
.app-demo{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.cel-m{border:8px solid var(--ameixa);border-radius:32px;background:var(--lavanda);padding:var(--e4);display:grid;gap:var(--e3);align-content:start;min-height:440px;max-width:320px;width:100%;margin:0 auto}
.cel-m .tt{font:800 20px/1.2 var(--f-titulo);letter-spacing:-.02em}
.cel-m .rot{font-size:14px;font-weight:700}
.cel-m .caixa{background:var(--branco);border-radius:var(--r-lg);padding:var(--e3);display:grid;gap:6px}
.cel-m .caixa .ph{height:72px;border-radius:var(--r-md);background:var(--lavanda-2)}
.cel-m .campo-m{max-width:none}
.cel-m .campo-m textarea{min-height:140px;font-size:14px}
.cel-m .btn{width:100%}
.cel-m.escuro{background:var(--ameixa);border-color:#000;color:var(--lavanda)}
.cel-m.escuro .caixa{background:#2A1E47;color:var(--lavanda)}
.cel-m.escuro .caixa .ph{background:#33265A}
.cel-m.escuro .tt{color:var(--lavanda)}
.cel-m.escuro .btn-escuro{background:#7C4DDB;color:#fff}
.cel-m.escuro .topo-e{display:flex;align-items:center;gap:10px}
.cel-m.escuro .topo-e img{width:28px;height:auto}
.cel-m.escuro small{color:#B7A9DC}
.telas-reais{display:grid;gap:var(--e8);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));align-items:start}
.telas-reais .celular{width:min(260px,72vw)}
.tokens-lado .sw{display:inline-block;width:16px;height:16px;border-radius:4px;border:1px solid var(--borda-forte);vertical-align:-3px;margin-right:6px}
.tokens-lado code{font:600 13px ui-monospace,Consolas,monospace}
.tokens-lado td{white-space:nowrap}
.tokens-lado td:last-child{white-space:normal;min-width:180px}

/* ---------- redes ---------- */
.feeds{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.feed{position:relative;aspect-ratio:4/5;border-radius:var(--r-md);overflow:hidden;padding:7%;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.feed .tit{font:800 clamp(22px,2.4vw,28px)/1.08 var(--f-titulo);letter-spacing:-.02em}
.feed .assin{display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.feed .assin img{height:28px;width:auto}
.feed .assin small{font-size:10px;font-weight:700}
.feed.f1{background:var(--violeta);color:var(--lavanda)} .feed.f1 .tit{color:var(--lavanda)} .feed.f1 small{color:#EDE5FF}
.feed.f2{background:var(--lavanda);border:1px solid var(--lavanda-3);color:var(--texto)} .feed.f2 small{color:var(--texto-apoio)}
.feed.f3{background:var(--ameixa);color:var(--lavanda)} .feed.f3 .tit{color:var(--lavanda)} .feed.f3 small{color:#D9CEF5}
.feed .btn{min-height:40px;font-size:14px;padding:0 16px;align-self:flex-start;pointer-events:none}
.feed .textura-sorriso{opacity:.9}
.stories{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.story{position:relative;aspect-ratio:9/16;border-radius:var(--r-lg);border:6px solid var(--ameixa);overflow:hidden;padding:16% 9% 20%;display:flex;flex-direction:column;justify-content:center;gap:10px}
.story::before,.story::after{content:"";position:absolute;left:0;right:0;border-top:2px dashed rgba(167,139,250,.9)}
.story::before{top:13%} .story::after{bottom:18%}
.story .tit{font:800 22px/1.1 var(--f-titulo);letter-spacing:-.02em}
.story small{font-size:11px;font-weight:700}
.story.s1{background:var(--violeta);color:var(--lavanda)} .story.s1 .tit{color:var(--lavanda)} .story.s1 small{color:#EDE5FF}
.story.s2{background:var(--branco);justify-content:space-between}
.story.s2 img{width:44%;margin:30% auto 0}
.story.s2 small{color:var(--texto-apoio)}
.story.s3{background:var(--lavanda-2)}
.story.s3 .oferta-c{padding:10px;gap:4px}
.story.s3 .oferta-c .img{aspect-ratio:16/10}
.story.s3 .oferta-c .por{font-size:20px}
.whats{display:grid;gap:var(--e6);align-items:start}
@media(min-width:900px){.whats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.whats .chat-sim{max-width:none}
.whats .cab img{border-radius:50%}
.balao-msg b{font-weight:700}
.avatares{display:flex;gap:var(--e6);align-items:flex-end;flex-wrap:wrap}
.avatares figure{display:grid;gap:6px;justify-items:center;font-size:12px;font-weight:700;color:var(--texto-apoio)}
.avatares img{border-radius:50%}
.av96{width:96px;height:96px}.av56{width:56px;height:56px}.av40{width:40px;height:40px}

/* ---------- checklist ---------- */
.checklist{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e4) var(--e6)}
.checklist fieldset{border:0;margin:0;padding:0}
.checklist legend{font:800 18px/1.2 var(--f-titulo);padding:var(--e3) 0 6px}
.checklist label{display:flex;gap:12px;align-items:flex-start;min-height:48px;padding:12px 0;border-top:1px solid var(--borda);cursor:pointer;font-size:15px}
.checklist input{flex:none;width:22px;height:22px;margin-top:1px;accent-color:var(--violeta);cursor:pointer}
.checklist .placar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--branco);padding:var(--e4) 0 4px;border-top:2px solid var(--borda);font-weight:700}
.governanca{display:grid;gap:var(--e4)}
@media(min-width:900px){.governanca{grid-template-columns:repeat(3,1fr)}}

/* ---------- utilidades da página ---------- */
.mi-tabela td code,.mi-tabela th code{font:600 13px ui-monospace,Consolas,monospace;color:var(--violeta)}
.mi-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (prefers-reduced-motion:reduce){
  .trilha .bola{transition:none}
  .download:hover{transform:none}
}
.mi-sec .planos-s{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));max-width:620px}
/* textura de sorrisos em fundo escuro (mesmo desenho, traço no tom do fundo) */
.manifesto .textura-sorriso,.feed.f3 .textura-sorriso{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='48' viewBox='0 0 72 48'%3E%3Cpath d='M14 18q22 22 44 0' fill='none' stroke='%233A2C5E' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E");opacity:1}
.feed.f1 .textura-sorriso{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='48' viewBox='0 0 72 48'%3E%3Cpath d='M14 18q22 22 44 0' fill='none' stroke='%237C4DDB' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E");opacity:1}
.mi-texto code,.mi-lista code,.cartao p code,.demo code,.regra-s code{font-size:.92em;overflow-wrap:anywhere}
.mi-conteudo .dividir>*,.mi-conteudo .grade>*,.sombra-demo>*{min-width:0}
.margens{align-items:start}
.margem-demo.feed{max-width:200px}
.icones{grid-template-columns:repeat(4,1fr)}
@media(min-width:1080px){.icones{grid-template-columns:repeat(8,1fr)}}
.icone{font-size:13px}
.ilus .cel{padding:28px 10px;gap:10px}
.ilus .cel i{height:14px}
.ilus .cel i.b{margin-left:24%}
.textura-demo p{color:var(--texto)}
.quadros{max-width:540px}
.plano-s .selo{align-self:flex-start}
.mi-sec .plano-s ul{align-content:start}
.demo .palavra-titulo{color:var(--texto)}
@media (prefers-reduced-motion:reduce){.palco-m .faixa .item[aria-hidden="true"]{display:none}}
.feed .selo,.story .selo{align-self:flex-start}
.stories{max-width:620px}
.story{padding:16% 9% 26%}
.mi-pilha>*,.stories>*{min-width:0}
.stories{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.story .tit{font-size:clamp(17px,4.6vw,22px)}
.story .oferta-c{max-width:100%}
.story{padding:28% 9% 38%}
.feed .textura-sorriso{inset:-12% -12% auto auto;width:55%;height:40%}
.story.s3{padding:22% 7% 34%}
.story.s3 .oferta-c .img{aspect-ratio:2/1}
.story.s3 .oferta-c .nome{font-size:13px;line-height:1.25}
.story.s3 .oferta-c .por{font-size:17px}
.story.s3 .aviso-afiliado{font-size:10px;line-height:1.3}
.story.s2 img{margin:4% auto 0;width:40%}.story.s2 .t-cf{font-size:14px;line-height:1.3}

/* ---------- ajustes v1.1 do manual ---------- */
.nota-ajuste{display:flex;gap:8px;align-items:flex-start;margin-top:var(--e3);padding:10px 14px;border-radius:var(--r-md);background:var(--lavanda-2);border:1px dashed var(--borda-forte);font-size:13px;font-weight:700;color:var(--texto);max-width:720px}
.nota-ajuste .ic{width:18px;height:18px;color:var(--violeta);margin-top:1px}
/* cena geométrica no lugar da foto */
.cena{position:relative;aspect-ratio:4/3;border-radius:var(--r-lg);background:var(--lavanda-2);overflow:hidden;border:1px solid var(--borda)}
.cena .mesa{position:absolute;left:0;right:0;bottom:0;height:30%;background:var(--lavanda-3);border-radius:var(--r-lg) var(--r-lg) 0 0}
.cena .cel-cena{position:absolute;left:38%;bottom:18%;width:22%;height:56%;border:7px solid var(--ameixa);border-radius:var(--r-lg);background:var(--branco);padding:16px 8px;display:grid;align-content:start;gap:8px;transform:rotate(-6deg)}
.cena .cel-cena i{display:block;height:12px;border-radius:var(--r-pill);background:var(--lilas)}
.cena .cel-cena i.b{background:var(--lavanda-3);width:70%}
.cena .cel-cena i.v{background:var(--violeta);margin-top:8px}
.cena .caneca{position:absolute;right:12%;bottom:22%;width:15%;aspect-ratio:1;border-radius:var(--r-md);background:var(--lilas);display:grid;place-items:center;color:var(--ameixa)}
.cena .caneca svg{width:60%}
.cena .almofada{position:absolute;left:8%;bottom:24%;width:22%;height:22%;border-radius:var(--r-lg);background:var(--branco)}
/* perfil do Instagram */
.perfil-ig{display:flex;gap:var(--e6);align-items:flex-start;flex-wrap:wrap;background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e6);max-width:620px}
.perfil-ig > img{width:88px;height:88px;border-radius:50%;flex:none}
.pf-txt{display:grid;gap:6px;min-width:0;flex:1 1 220px}
.pf-nome{font:800 22px/1.15 var(--f-titulo);letter-spacing:-.02em}
.pf-arroba{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-weight:700;color:var(--texto-apoio)}
.pf-bio{color:var(--texto)}
.pf-txt .btn{justify-self:start;margin-top:6px;pointer-events:none}
/* onde a assinatura entra */
.assina-pecas{display:grid;gap:var(--e4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){.assina-pecas{grid-template-columns:minmax(0,1fr) minmax(0,.62fr) minmax(0,2fr)}}
.assina-pecas .ap-larga{grid-column:1/-1}
@media(min-width:900px){.assina-pecas .ap-larga{grid-column:auto}}
.assina-pecas figure{margin:0;display:grid;gap:8px;align-content:start}
.assina-pecas figcaption{font-size:13px;color:var(--texto-apoio)}
.assina-pecas figcaption b{display:block;color:var(--texto)}
.ap{position:relative;border-radius:var(--r-md);overflow:hidden;padding:8%;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.ap p{font:800 clamp(14px,1.8vw,18px)/1.1 var(--f-titulo);letter-spacing:-.02em}
.ap-feed{aspect-ratio:4/5;background:var(--violeta)} .ap-feed p{color:var(--lavanda)}
.ap-feed .ap-logo{width:55%;height:auto;align-self:flex-start}
.ap-story{aspect-ratio:9/16;background:var(--branco);border:1px solid var(--borda);justify-content:flex-start;padding-top:20%}
.ap-story::before,.ap-story::after{content:"";position:absolute;left:0;right:0;border-top:2px dashed var(--lilas)}
.ap-story::before{top:13%} .ap-story::after{bottom:18%}
.ap-story .ap-logo{width:70%;height:auto}
.ap-banner{aspect-ratio:3/1;background:var(--ameixa);flex-direction:row;align-items:center;padding:4% 4% 4% 6%}
.ap-banner p{color:var(--lavanda);max-width:55%}
.ap-prot{margin-left:auto;padding:8px;outline:2px dashed #D9CEF5;outline-offset:-2px;border-radius:var(--r-sm)}
.ap-prot img{width:clamp(80px,14vw,130px);height:auto}
/* teste de 7 dias */
.teste-c{display:flex;flex-direction:column;gap:var(--e3);align-items:flex-start}
.teste-c h3{margin:0}
.teste-c .btn{pointer-events:none}
.teste-c .onde{font-size:13px;color:var(--texto-suave);margin-top:auto;padding-top:var(--e2);border-top:1px solid var(--borda);width:100%}
/* resumo em um quadro */
.resumo{display:grid;gap:var(--e3);grid-template-columns:repeat(2,minmax(0,1fr));background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-lg);padding:var(--e4)}
@media(min-width:900px){.resumo{grid-template-columns:repeat(4,minmax(0,1fr));padding:var(--e6)}}
.rs{background:var(--lavanda);border-radius:var(--r-md);padding:var(--e4);display:grid;gap:8px;align-content:start;min-height:120px;font-size:14px;color:var(--texto)}
.rs-t{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--violeta)}
.rs-logo{grid-column:1/-1}
@media(min-width:900px){.rs-logo{grid-column:span 2}}
.rs-logo img{height:48px;width:auto}
.rs-aa{font:800 40px/1 var(--f-titulo);letter-spacing:-.02em}
.rs-cores{display:flex;gap:6px;flex-wrap:wrap}
.rs-cores i{width:28px;height:28px;border-radius:50%;border:1px solid var(--borda-forte)}
.rs-ic{display:flex;gap:10px;color:var(--violeta)}
.rs-formas{display:flex;gap:8px;align-items:center}
.rs-formas i{width:36px;height:28px;border-radius:var(--r-md);background:var(--lavanda-3)}
.rs-formas i.p{width:52px;border-radius:var(--r-pill);background:var(--lilas)}
.rs-formas i.o{width:28px;border-radius:50%;background:var(--violeta)}
.rs .btn{pointer-events:none;justify-self:start}
.rs-voz span:last-child{font:800 18px/1.2 var(--f-titulo);letter-spacing:-.01em}
.vitrine .aviso-lancamento{border-radius:var(--r-md)}
.rs-voz{grid-column:1/-1;min-height:0}
@media(min-width:900px){.assina-pecas{grid-template-columns:minmax(0,1fr) minmax(0,.75fr) minmax(0,1.8fr)}}
.ap-story{padding-top:24%}