/* Letras hospedadas no próprio site (antes vinham do Google Fonts e atrasavam a primeira tela). */
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:400;font-display:swap;src:url("fontes/atkinson-hyperlegible-400.woff2") format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:700;font-display:swap;src:url("fontes/atkinson-hyperlegible-700.woff2") format("woff2")}
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:600 800;font-display:swap;src:url("fontes/big-shoulders-display.woff2") format("woff2")}
/* Atração Local: o hexágono do logo é o fio condutor (foto, ícones e passos); o resto fica quieto. */
:root{
  --verde:#1b5716; --verde-noite:#10350d; --mel:#ffb400; --mel-claro:#fff1c7;
  --folha:#f3f6ef; --papel:#ffffff; --tinta:#1a2118; --cinza:#465042; --linha:#d6ddd0;
  --display:"Big Shoulders Display","Arial Narrow",Arial,sans-serif;
  --texto:"Atkinson Hyperlegible",system-ui,"Segoe UI",Roboto,Arial,sans-serif;
  --hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  --largura:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--folha);color:var(--tinta);font-family:var(--texto);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--verde)}
:focus-visible{outline:3px solid var(--mel);outline-offset:3px;border-radius:4px}
.envoltorio{max-width:var(--largura);margin:0 auto;padding-inline:20px}
section{scroll-margin-top:80px}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:.95;margin:0;letter-spacing:.005em;text-wrap:balance}
h2{font-size:clamp(38px,5.4vw,60px);color:var(--verde)}
h3{font-size:30px}
p{margin:0;text-wrap:pretty}
::selection{background:var(--mel);color:var(--tinta)}
html{caret-color:var(--verde)}
.intro{max-width:56ch;color:var(--cinza);margin-top:16px}

/* Botão principal: amarelo do logo, abre o WhatsApp */
.botao{display:inline-flex;align-items:center;gap:10px;background:var(--mel);color:var(--tinta);font-weight:700;font-size:18px;text-decoration:none;padding:16px 26px;border-radius:999px;border:2px solid var(--mel);transition:background .15s,border-color .15s}
.botao:hover{background:#ffc53d;border-color:#ffc53d}
.botao svg{width:22px;height:22px;flex:none}
.botao-pequeno{padding:10px 18px;font-size:16px}

/* Topo */
.topo{position:sticky;top:0;z-index:10;background:rgba(243,246,239,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--linha)}
.topo .envoltorio{display:flex;align-items:center;justify-content:space-between;gap:16px;height:76px}
.topo img{height:52px;width:auto}
.topo nav{display:flex;align-items:center;gap:26px;font-size:16px}
.topo nav a:not(.botao){color:var(--cinza);text-decoration:none;padding-block:10px}
.topo nav a:not(.botao):hover{color:var(--verde)}
[id]{scroll-margin-top:92px}
@media (max-width:980px){.topo nav a:not(.botao){display:none}}

/* Abertura */
.abertura{padding-block:44px 72px;overflow-x:clip}
.abertura .envoltorio{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:center}
.abertura h1{font-size:clamp(46px,6.2vw,84px);color:var(--verde)}
.abertura .apoio{font-size:21px;max-width:44ch;margin-top:22px}
.abertura .botao{margin-top:30px}
.depois{margin-top:12px;font-size:15px;font-weight:700;color:var(--verde)}
.abertura .nota{margin-top:10px;color:var(--cinza);font-size:16px;max-width:46ch}
.convite .depois{color:var(--mel-claro);margin-top:12px}
.retrato{position:relative;max-width:440px;justify-self:end;width:100%}
.retrato::before{content:"";position:absolute;inset:0;transform:translate(22px,14px);background:var(--mel);clip-path:var(--hex)}
.retrato img{position:relative;width:100%;aspect-ratio:.866;object-fit:cover;object-position:50% 30%;clip-path:var(--hex)}
.retrato figcaption{position:absolute;left:-8px;bottom:14%;background:var(--papel);border:1px solid var(--linha);border-radius:12px;padding:10px 14px;font-size:15px;line-height:1.35;box-shadow:0 6px 18px rgba(26,33,24,.12)}
.retrato figcaption b{display:block;font-size:16px}

/* Onde perde clientes */
.perdas{background:var(--papel);padding-block:80px;border-block:1px solid var(--linha)}
.perdas ul{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.perdas li{border-top:3px solid var(--tinta);padding-top:20px}
.perdas svg{width:34px;height:34px;color:var(--verde)}
.perdas h3{font-size:28px;margin-top:14px}
.perdas p{color:var(--cinza);margin-top:10px}

/* Serviços */
.servicos{padding-block:88px}
.servicos .grade{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:44px}
.servico{background:var(--papel);border:1px solid var(--linha);border-radius:18px;padding:32px;display:flex;flex-direction:column}
/* Miniaturas: cada serviço mostra um pedacinho do que entrega */
.mini{height:104px;border-radius:12px;background:var(--folha);border:1px solid var(--linha);padding:14px;font-family:system-ui,"Segoe UI",Roboto,Arial,sans-serif;font-size:13px;line-height:1.3;overflow:hidden}
.mini-site{display:grid;grid-template-columns:1.5fr 1fr;grid-template-rows:8px 1fr auto;gap:8px 12px;background:var(--papel)}
.mini-site i{grid-column:1/-1;height:8px;border-radius:4px;background:var(--linha)}
.mini-site b{grid-column:1;grid-row:2/4;border-radius:6px;background:linear-gradient(135deg,#8fb08a,#3f6e3b)}
.mini-site span{grid-column:2;grid-row:2;height:7px;border-radius:4px;background:var(--linha);align-self:start;box-shadow:0 14px 0 var(--linha),0 28px 0 var(--linha)}
.mini-site em{grid-column:2;grid-row:3;justify-self:start;font-style:normal;font-weight:700;font-size:12px;background:var(--verde);color:#fff;border-radius:999px;padding:4px 10px;align-self:end}
.mini-chat{display:flex;flex-direction:column;gap:6px;background:#ece5dd;border-color:#ece5dd;color:var(--tinta)}
.mini-chat span{max-width:80%;padding:6px 10px;border-radius:10px}
.mini-chat .c{align-self:flex-end;background:#d9fdd3}
.mini-chat .a{align-self:flex-start;background:#fff}
.mini-busca{display:flex;flex-direction:column;gap:8px;background:var(--papel)}
.mini-busca .q{border:1px solid var(--linha);border-radius:999px;padding:5px 12px;color:var(--cinza)}
.mini-busca .r{color:var(--cinza)}
.mini-busca .r b{display:block;color:#1a4fb5;font-size:15px}
.mini-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--papel)}
.mini-posts i{border-radius:8px;background:var(--mel)}
.mini-posts i:nth-child(2){background:var(--verde)}
.mini-posts i:nth-child(3){background:linear-gradient(135deg,#d9c3a5,#9b7650)}
.servico h3{margin-top:22px}
.servico p{margin-top:12px}
.servico .para{color:var(--cinza);font-size:16px;margin-top:14px}
.servico .para b{color:var(--tinta)}
.servico-destaque{background:var(--verde);border-color:var(--verde);color:#f2f7ef}
.servico-destaque h3{color:#fff}
.servico-destaque .para{color:#cfe0c9}
.servico-destaque .para b{color:#fff}
/* Pacote completo: os serviços juntos, sem preço (o valor vem no diagnóstico) */
.pacote{margin-top:20px;background:var(--mel-claro);border:1px solid #f0d58a;border-radius:18px;padding:40px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px 56px;align-items:start}
.pacote h3{font-size:clamp(32px,3.6vw,42px);color:var(--verde-noite)}
.pacote-texto p{margin-top:14px;max-width:44ch}
.pacote-texto .botao{margin-top:24px}
.pacote-texto .pacote-nota{font-size:16px;color:#4a3d12;margin-top:14px}
.pacote-lista{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.pacote-lista li{position:relative;padding-left:34px}
.pacote-lista li::before{content:"";position:absolute;left:0;top:.28em;width:18px;height:20px;background:var(--verde);clip-path:var(--hex)}
@media (max-width:900px){.pacote{grid-template-columns:minmax(0,1fr);padding:30px 26px}}
@media (max-width:520px){.pacote{padding:26px 22px}.pacote .botao{width:100%;justify-content:center;padding-inline:16px;font-size:17px;text-align:center}}
.acao-servicos{margin-top:36px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.acao-servicos p{font-size:20px;font-weight:700}

/* Atendente em ação */
.demo{background:var(--verde-noite);color:#e8f0e5;padding-block:88px}
.demo .envoltorio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"texto celular" "acao celular";column-gap:56px;align-items:center}
.demo-texto{grid-area:texto;align-self:end}
.demo-celular{grid-area:celular}
.demo-acao{grid-area:acao;align-self:start}
.demo h2{color:#fff}
.demo .intro{color:#c3d3be}
.demo .botao{margin-top:28px}
.quem-responde{display:none}
.celular{width:100%;max-width:380px;justify-self:center;background:#0b2709;border-radius:38px;padding:12px;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.tela{background:#ece5dd;border-radius:28px;overflow:hidden;color:var(--tinta);font-family:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.tela header{background:#1f5c43;color:#fff;display:flex;align-items:center;gap:12px;padding:14px 16px}
.tela header .avatar{width:38px;height:38px;border-radius:50%;background:var(--mel-claro);color:var(--verde);display:grid;place-items:center;font-weight:700}
.tela header b{display:block;font-size:16px;line-height:1.2}
.tela header small{font-size:13px;opacity:.85}
.conversa{list-style:none;margin:0;padding:16px 14px 20px;display:flex;flex-direction:column;gap:8px;min-height:430px;font-size:15.5px;line-height:1.4}
.conversa li{max-width:84%;padding:8px 12px 18px;border-radius:12px;position:relative;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.conversa .cliente{align-self:flex-end;background:#d9fdd3;border-top-right-radius:4px}
.conversa .atendente{align-self:flex-start;background:#fff;border-top-left-radius:4px}
.conversa time{position:absolute;right:10px;bottom:3px;font-size:11.5px;color:#667065}
.conversa .digitando{display:none;align-self:flex-start;background:#fff;padding:12px 14px;border-radius:12px}
.conversa .digitando span{display:inline-block;width:7px;height:7px;margin:0 2px;border-radius:50%;background:#8b958a;animation:pulo 1s infinite}
.conversa .digitando span:nth-child(2){animation-delay:.15s}
.conversa .digitando span:nth-child(3){animation-delay:.3s}
@keyframes pulo{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.animar .conversa li.msg:not(.fixa){display:none}
.animar .conversa li.msg.visivel{display:block;animation:entra .25s ease-out}
.animar .conversa .digitando.ativo{display:block}
@keyframes entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.legenda{text-align:center;font-size:14px;color:#a9bca3;margin-top:14px}

/* Como funciona: é uma sequência, por isso tem números */
.passos{padding-block:88px}
.passos ol{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;counter-reset:passo}
.passos li{counter-increment:passo}
.passos li::before{content:counter(passo);display:grid;place-items:center;width:62px;height:70px;background:var(--verde);color:var(--mel);clip-path:var(--hex);font-family:var(--display);font-weight:800;font-size:34px}
.passos h3{margin-top:18px}
.passos p{color:var(--cinza);margin-top:10px}

/* Exemplo */
.exemplo{background:var(--papel);padding-block:88px;border-block:1px solid var(--linha)}
.exemplo .envoltorio{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.navegador{border:1px solid var(--linha);border-radius:14px;overflow:hidden;background:var(--folha);text-decoration:none;color:inherit;display:block;box-shadow:0 18px 40px rgba(26,33,24,.12)}
.navegador .barra{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#e6ebe1;font-size:13px;color:var(--cinza)}
.navegador .barra i{width:10px;height:10px;border-radius:50%;background:#c4ccbd}
.navegador .barra span{margin-left:10px;background:var(--papel);border-radius:6px;padding:3px 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.navegador .previa{aspect-ratio:16/10;background:#f1f4f2}
.navegador .previa img{width:100%;height:100%;object-fit:cover;object-position:top}
.etiqueta{display:inline-block;background:var(--mel-claro);color:#6b4b00;font-size:14px;font-weight:700;padding:4px 12px;border-radius:999px;margin-bottom:16px}
.exemplo ul{margin:18px 0 0;padding-left:20px;color:var(--cinza)}
.exemplo .ver{display:inline-block;margin-top:16px;padding-block:12px;font-weight:700}

/* Quem faz */
.quem{padding-block:88px}
.quem .envoltorio{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:center}
.quem img{border-radius:18px;width:100%;aspect-ratio:4/5;object-fit:cover}
.quem p{margin-top:18px;max-width:52ch}
.quem .assinatura{font-family:var(--display);font-weight:800;font-size:30px;color:var(--verde);margin-top:26px}
.quem .botao{margin-top:28px}
.quem .assinatura small{display:block;font-family:var(--texto);font-weight:400;font-size:16px;color:var(--cinza)}

/* Perguntas */
.perguntas{background:var(--papel);padding-block:88px;border-top:1px solid var(--linha)}
.perguntas .lista{max-width:780px;margin-top:36px}
.perguntas details{border-bottom:1px solid var(--linha)}
.perguntas summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-weight:700;font-size:20px}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{content:"+";font-family:var(--display);font-size:34px;line-height:1;color:var(--verde);transition:transform .2s}
.perguntas details[open] summary::after{transform:rotate(45deg)}
.perguntas details p{padding:0 0 22px;color:var(--cinza);max-width:64ch}

/* Convite final */
.convite{background:var(--verde);color:#fff;padding-block:96px;text-align:center}
.convite h2{color:#fff;font-size:clamp(42px,6.4vw,84px);max-width:16ch;margin-inline:auto}
.convite p{color:#d3e3cd;max-width:52ch;margin:20px auto 0}
.convite .botao{margin-top:32px}

/* Rodapé */
.rodape{background:var(--verde-noite);color:#c3d3be;padding-block:48px;font-size:16px}
.rodape .envoltorio{display:flex;flex-wrap:wrap;gap:28px 48px;align-items:center;justify-content:space-between}
.rodape img{height:68px;width:auto}
.rodape a{color:#fff}
.rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rodape a{display:inline-block;padding-block:10px}
.junto{white-space:nowrap}

@media (max-width:900px){
  .abertura .envoltorio,.demo .envoltorio,.exemplo .envoltorio,.quem .envoltorio{grid-template-columns:minmax(0,1fr)}
  .demo .envoltorio{grid-template-areas:"texto" "celular" "acao";row-gap:36px}
  .demo .botao{margin-top:0}
  .retrato{display:none}
  .quem-responde{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:16px;font-weight:700}
  .quem-responde img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:50% 32%;border:2px solid var(--mel)}
  .quem-responde + .botao{margin-top:14px}
  .perdas ul,.passos ol{grid-template-columns:minmax(0,1fr);gap:32px}
  .servicos .grade{grid-template-columns:minmax(0,1fr)}
  .quem img{max-width:280px;height:auto;aspect-ratio:1;object-position:50% 20%}
}
@media (max-width:520px){
  body{font-size:17px}
  .topo .envoltorio{height:66px}
  .topo img{height:34px}
  .topo .botao-pequeno{padding:11px 14px;font-size:15px;gap:6px;white-space:nowrap}
  .topo .botao-pequeno svg{width:18px;height:18px}
  .abertura{padding-block:32px 56px}
  .abertura .apoio{font-size:19px}
  .abertura .botao,.demo .botao,.convite .botao,.acao-servicos .botao,.quem .botao{width:100%;justify-content:center;padding-inline:16px;font-size:17px;text-align:center}
  .retrato::before{transform:translate(12px,8px)}
  .retrato figcaption{left:0}
  .servico{padding:26px 22px}
  .perdas,.servicos,.demo,.passos,.exemplo,.quem,.perguntas{padding-block:64px}
  .convite{padding-block:72px}
}
@media (max-width:360px){
  .topo .botao-pequeno svg{display:none}
  .abertura h1{font-size:40px}
}
@media (prefers-reduced-motion:reduce){
  .conversa .digitando span,.animar .conversa li.msg.visivel{animation:none}
}

/* Link de cada serviço para a sua página */
.servico .mais{margin-top:auto;padding-top:18px;font-weight:700}
.servico .mais a{display:inline-block;padding-block:8px}
.servico-destaque .mais a{color:var(--mel)}

/* Páginas de serviço */
.trilha{font-size:15px;color:var(--cinza)}
.trilha a{color:var(--cinza);display:inline-block;padding-block:11px}
.pagina-topo{padding-block:24px 64px;border-bottom:1px solid var(--linha)}
.pagina-topo h1{font-size:clamp(44px,6vw,78px);color:var(--verde);margin-top:20px;max-width:16ch}
.pagina-topo .apoio{font-size:21px;max-width:56ch;margin-top:22px}
.pagina-topo .botao{margin-top:30px}
.artigo{padding-block:72px;background:var(--papel)}
.artigo .envoltorio{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:72px;align-items:start}
.artigo .corpo h2{font-size:clamp(32px,4vw,44px);margin-top:56px}
.artigo .corpo h2:first-child{margin-top:0}
.artigo .corpo p{margin-top:16px;max-width:66ch}
.artigo .corpo ul{margin:16px 0 0 22px;max-width:64ch}
.artigo .corpo li{margin-top:8px}
.artigo .corpo li::marker{color:var(--verde)}
.lateral{position:sticky;top:100px;background:var(--folha);border:1px solid var(--linha);border-radius:18px;padding:28px}
.lateral h2{font-size:30px}
.lateral p{color:var(--cinza);font-size:16px;margin-top:10px}
.lateral .botao{width:100%;justify-content:center;margin-top:22px;font-size:16px;padding-inline:16px}
.lateral ul{list-style:none;margin:22px 0 0;padding:16px 0 0;border-top:1px solid var(--linha);font-size:16px}
.lateral li a{display:block;padding-block:11px}
.outros{padding-block:64px}
.outros ul{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.outros a{display:inline-block;border:1px solid var(--linha);background:var(--papel);border-radius:999px;padding:11px 20px;text-decoration:none;font-weight:700}
.outros a:hover{border-color:var(--verde)}
@media (max-width:900px){
  .artigo .envoltorio{grid-template-columns:minmax(0,1fr);gap:40px}
  .lateral{position:static}
}
@media (max-width:520px){
  .pagina-topo .botao{width:100%;justify-content:center}
  .artigo{padding-block:56px}
}
/* o que ainda falta confirmar fica visível, para não ir ao ar por engano */
.confirmar{background:#fff3c4;color:#6b4b00;border-bottom:1px dashed #b08400;padding:0 4px;border-radius:3px;font-style:normal}
.topo .envoltorio > a:first-child{display:block;padding-block:5px}

/* Blog */
.post-topo h1{font-size:clamp(38px,4.8vw,64px);max-width:20ch}
.assinatura{margin-top:18px;font-size:16px;color:var(--cinza)}
.artigo .corpo ol{margin:16px 0 0 22px;padding-left:4px;max-width:64ch}
.artigo .corpo ol li::marker{color:var(--verde);font-weight:700}
.artigo .corpo blockquote{margin:12px 0 0;padding:16px 20px;max-width:62ch;background:var(--folha);border-left:4px solid var(--mel);border-radius:0 12px 12px 0}
.artigo .corpo blockquote p{margin-top:0}
.artigo .corpo h3{font-family:var(--texto);font-size:20px;font-weight:700;line-height:1.35;margin-top:28px;color:var(--tinta)}
.artigo .corpo .fecho{margin-top:56px;padding:28px;border-radius:18px;background:var(--mel-claro)}
.artigo .corpo .fecho h2{margin-top:0;font-size:clamp(30px,3.4vw,38px)}
.blog-lista{padding-block:72px;background:var(--papel)}
.blog-lista ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.post{position:relative;display:flex;flex-direction:column;background:var(--folha);border:1px solid var(--linha);border-radius:18px;padding:30px}
.post:hover{border-color:var(--verde)}
.post .tema{font-size:15px;font-weight:700;color:var(--verde)}
.post h2{font-size:clamp(28px,3vw,36px);margin-top:10px;color:var(--tinta)}
.post h2 a{color:inherit;text-decoration:none}
.post h2 a::after{content:"";position:absolute;inset:0;border-radius:18px}
.post p:not(.tema):not(.mais){margin-top:12px;color:var(--cinza);font-size:17px}
.post .mais{margin-top:auto;padding-top:18px;font-weight:700;color:var(--verde)}
@media (max-width:900px){.blog-lista ul{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.blog-lista{padding-block:56px}.post{padding:24px 22px}.artigo .corpo .fecho{padding:22px}}
.blog-inicio{padding-block:88px;border-top:1px solid var(--linha)}
.blog-inicio ul{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.blog-inicio .post{background:var(--papel)}
.post h3{font-size:clamp(26px,2.6vw,32px);margin-top:10px;color:var(--tinta)}
.post h3 a{color:inherit;text-decoration:none}
.post h3 a::after{content:"";position:absolute;inset:0;border-radius:18px}
.blog-inicio .todos{margin-top:28px;font-weight:700}
.blog-inicio .todos a{display:inline-block;padding-block:10px}
@media (max-width:980px){.blog-inicio ul{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.blog-inicio{padding-block:64px}}
.leia{padding-block:64px 0}
.leia ul{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px;max-width:780px}
.leia a{display:block;border:1px solid var(--linha);background:var(--papel);border-radius:14px;padding:16px 20px;text-decoration:none;font-weight:700}
.leia a:hover{border-color:var(--verde)}
.artigo .corpo .capa{margin:0 0 40px}
.artigo .corpo .capa img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:18px}
.post>img{display:block;width:calc(100% + 60px);max-width:none;height:auto;aspect-ratio:16/9;object-fit:cover;margin:-30px -30px 22px;border-radius:17px 17px 0 0}
@media (max-width:520px){.post>img{width:calc(100% + 44px);margin:-24px -22px 20px}}
.artigo .corpo .resposta{margin:0 0 44px;padding:22px 26px;border-radius:16px;background:var(--folha);border:1px solid var(--linha);border-left:6px solid var(--verde)}
.artigo .corpo .resposta p{margin-top:8px;font-size:19px;color:var(--tinta)}
.artigo .corpo .resposta .resposta-titulo{margin-top:0;font-size:15px;font-weight:700;color:var(--verde)}
.artigo .corpo .autor{display:flex;gap:18px;align-items:flex-start;margin-top:56px;padding-top:28px;border-top:1px solid var(--linha)}
.artigo .corpo .autor img{width:72px;height:72px;flex:none;border-radius:50%;object-fit:cover;object-position:50% 20%}
.artigo .corpo .autor p{margin-top:4px;font-size:17px;color:var(--cinza)}
.artigo .corpo .autor .autor-nome{margin-top:0;font-weight:700;color:var(--tinta)}
.artigo .corpo .autor+.fecho{margin-top:32px}

/* Portfólio */
.exemplo .ver+.ver{margin-left:24px}
.portfolio{padding-block:72px;background:var(--papel)}
.portfolio ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.trabalho{position:relative;display:flex;flex-direction:column;background:var(--folha);border:1px solid var(--linha);border-radius:18px;overflow:hidden}
.trabalho:hover{border-color:var(--verde)}
.trabalho img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border-bottom:1px solid var(--linha)}
.trabalho-texto{display:flex;flex-direction:column;flex:1;padding:26px 30px 28px}
.trabalho .tema{font-size:15px;font-weight:700;color:var(--verde)}
.trabalho h2{font-size:clamp(30px,3vw,38px);margin-top:8px;color:var(--tinta)}
.trabalho h2 a{color:inherit;text-decoration:none}
.trabalho h2 a::after{content:"";position:absolute;inset:0}
.trabalho p:not(.tema):not(.mais){margin-top:12px;color:var(--cinza);font-size:17px}
.trabalho .mais{margin-top:auto;padding-top:16px;font-weight:700;color:var(--verde)}
@media (max-width:900px){.portfolio ul{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.portfolio{padding-block:56px}.trabalho-texto{padding:22px}.exemplo .ver+.ver{margin-left:0}}

/* Link da bio (/links/) */
.bio{min-height:100vh;background:var(--folha)}
.bio-coluna{max-width:480px;margin:0 auto;padding:40px 20px 32px;text-align:center}
.bio-foto{position:relative;width:132px;margin:0 auto}
.bio-foto::before{content:"";position:absolute;inset:0;transform:translate(10px,6px);background:var(--mel);clip-path:var(--hex)}
.bio-foto img{position:relative;display:block;width:132px;height:auto;aspect-ratio:.866;object-fit:cover;object-position:50% 25%;clip-path:var(--hex)}
.bio-topo h1{font-size:44px;color:var(--verde);margin-top:20px}
.bio-agencia{margin-top:8px}
.bio-agencia img{height:34px;width:auto;margin:0 auto}
.bio-frase{margin-top:14px;color:var(--cinza);font-size:17px;line-height:1.5}
.bio-links{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px}
.bio .link{display:flex;align-items:center;gap:14px;min-height:64px;padding:12px 20px;border-radius:18px;background:var(--papel);border:1px solid var(--linha);color:var(--tinta);text-decoration:none;text-align:left;transition:border-color .15s,transform .15s}
.bio .link:hover{border-color:var(--verde)}
.bio .link:active{transform:scale(.99)}
.bio .link span{display:grid;gap:2px}
.bio .link strong{font-size:17px}
.bio .link small{font-size:14px;color:var(--cinza)}
.bio .link svg{width:24px;height:24px;flex:none;color:var(--verde)}
.bio .link-destaque{background:var(--mel);border-color:var(--mel)}
.bio .link-destaque:hover{border-color:var(--verde-noite)}
.bio .link-destaque small{color:var(--tinta)}
.bio .link-destaque svg{color:var(--tinta)}
.bio-redes{list-style:none;margin:28px 0 0;padding:0;display:flex;justify-content:center;gap:14px}
.bio-redes a{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--verde);color:#fff}
.bio-redes a:hover{background:var(--verde-noite)}
.bio-redes svg{width:22px;height:22px}
.bio-site{margin-top:24px;font-size:15px}
.bio-site a{color:var(--cinza);display:inline-block;padding-block:8px}