/* blog de alexmerovic.com.br · gerado junto com build.py, mesma paleta do site */
:root{
  --bg:#111111; --panel:#131314; --card:#171719;
  --line:#242426; --line-2:#1C1C1E; --line-3:#33333A;
  --ink:#F9F9F9; --texto:#D6D6D9; --dim:#8A8A8E; --dim-2:#5E5E63;
  --azul:#7EACE8; --azul-esc:#3C5F86;
  --sans:"Inter",-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --col:680px; --larga:1040px;
  --ease:cubic-bezier(.16,1,.3,1);
  --topo:rgba(17,17,17,.86); --realce:#FFFFFF; --ambar:#EAB170; --acento:var(--ambar); --acento-esc:#886945;
  color-scheme:dark;
}
/* tema claro: segue o sistema, a menos que o visitante tenha escolhido no botão */
:root[data-tema="claro"]{
  --bg:#FFFFFF; --panel:#F6F6F4; --card:#F3F3F1;
  --line:#E4E4E0; --line-2:#EDEDEA; --line-3:#CFCFCA;
  --ink:#111111; --texto:#2A2A2C; --dim:#6B6B70; --dim-2:#8E8E93;
  --azul:#2F6FC4; --azul-esc:#A9C4E8;
  --topo:rgba(255,255,255,.86); --realce:#000000; --ambar:#A26825; --acento:var(--ambar); --acento-esc:#DAC3A8;
  color-scheme:light;
}
@media (prefers-color-scheme:light){
  :root:not([data-tema="escuro"]){
    --bg:#FFFFFF; --panel:#F6F6F4; --card:#F3F3F1;
    --line:#E4E4E0; --line-2:#EDEDEA; --line-3:#CFCFCA;
    --ink:#111111; --texto:#2A2A2C; --dim:#6B6B70; --dim-2:#8E8E93;
    --azul:#2F6FC4; --azul-esc:#A9C4E8;
    --topo:rgba(255,255,255,.86); --realce:#000000; --ambar:#A26825; --acento:var(--ambar); --acento-esc:#DAC3A8;
    color-scheme:light;
  }
}
body{transition:background-color .35s var(--ease),color .35s var(--ease)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}

/* ---------- topo ---------- */
.top{position:sticky;top:0;z-index:20;background:var(--topo);
  backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid var(--line-2)}
.top-in{max-width:var(--larga);margin:0 auto;padding:12px 16px;display:flex;align-items:center;
  justify-content:space-between;gap:16px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;font-size:15px;letter-spacing:-.01em}
.marca img{width:28px;height:28px;border-radius:50%;object-fit:cover;background:var(--card)}
.top-nav{display:flex;align-items:center;gap:6px}
.top-nav a{font-size:13.5px;color:var(--dim);text-decoration:none;padding:7px 12px;border-radius:8px;
  transition:color .3s var(--ease)}
.top-nav a:hover{color:var(--ink)}
.top-nav .btn-assinar{background:var(--ink);color:var(--bg);font-weight:500}
.top-nav .btn-assinar:hover{color:var(--bg);background:var(--realce)}
.tema{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;border:1px solid var(--line);
  background:transparent;color:var(--dim);cursor:pointer;transition:color .3s var(--ease),border-color .3s var(--ease)}
.tema:hover{color:var(--ink);border-color:var(--line-3)}
.tema svg{width:16px;height:16px}
.tema .sol{display:none}
:root[data-tema="claro"] .tema .sol{display:block}
:root[data-tema="claro"] .tema .lua{display:none}
@media (prefers-color-scheme:light){
  :root:not([data-tema="escuro"]) .tema .sol{display:block}
  :root:not([data-tema="escuro"]) .tema .lua{display:none}
}

/* ---------- home: masthead ---------- */
.home{max-width:var(--larga);margin:0 auto;padding:0 16px 40px}
.mast{text-align:center;padding:56px 0 36px;max-width:560px;margin:0 auto}
.mast-av{width:72px;height:72px;border-radius:50%;object-fit:cover;background:var(--card);
  border:1px solid var(--line)}
.mast h1{font-size:clamp(28px,4.4vw,40px);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:18px}
.mast p{color:var(--dim);font-size:16px;font-weight:300;margin-top:10px}
.mast-min{padding-top:48px}
.mast-form,.assinar form{display:flex;gap:8px;max-width:420px;margin:24px auto 0}
.mast-form input,.assinar input{flex:1;min-width:0;background:var(--card);border:1px solid var(--line);
  border-radius:8px;padding:11px 14px;color:var(--ink);font:inherit;font-size:14.5px;outline:none;
  transition:border-color .3s var(--ease)}
.mast-form input:focus,.assinar input:focus{border-color:var(--acento-esc)}
.mast-form input::placeholder,.assinar input::placeholder{color:var(--dim-2)}
.mast-form button,.assinar button{background:var(--ink);color:var(--bg);border:0;border-radius:8px;
  padding:11px 18px;font:inherit;font-size:14.5px;font-weight:500;cursor:pointer;
  transition:background .3s var(--ease)}
.mast-form button:hover,.assinar button:hover{background:var(--realce)}

/* ---------- abas ---------- */
.abas{display:flex;justify-content:center;gap:4px;border-bottom:1px solid var(--line-2);margin-bottom:32px}
.abas button{font:inherit;font-size:14px;color:var(--dim);background:none;border:0;cursor:pointer;
  padding:12px 14px;margin-bottom:-1px;border-bottom:2px solid transparent;
  transition:color .3s var(--ease),border-color .3s var(--ease)}
.abas button:hover{color:var(--ink)}
.abas button[aria-selected="true"]{color:var(--ink)}
/* barra que desliza até a aba ativa; sem JS, cai na borda do botão */
.abas{position:relative}
.abas:not(.pronto) button[aria-selected="true"]{border-bottom-color:var(--ink)}
.abas-ind{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--ink);border-radius:2px;
  transition:transform .5s var(--ease),width .5s var(--ease)}
.abas:not(.anima) .abas-ind{transition:none}
.abas button:focus-visible{outline:2px solid var(--acento);outline-offset:-2px;border-radius:4px}
.painel{animation:entra .45s var(--ease)}
.painel[hidden]{display:none}
@keyframes entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- aba Sobre ---------- */
.sobre{max-width:var(--col);margin:0 auto;padding-top:8px}
.sobre p{font-family:var(--sans);font-size:17px;line-height:1.7;color:var(--texto)}
.sobre p + p{margin-top:1.1em}
.sobre-acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line-2)}

.rot{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim-2);font-weight:500;
  padding-bottom:12px;border-bottom:1px solid var(--line-2)}
.meta{font-size:13px;color:var(--dim-2);display:flex;flex-wrap:wrap;align-items:center;gap:0 6px}
.meta .autor{color:var(--dim)}
.sep{color:var(--line-3)}
.vazio{text-align:center;color:var(--dim-2);padding:48px 0 64px;font-size:15px}

/* ---------- destaque ---------- */
.destaque{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:32px;align-items:center;
  text-decoration:none;padding-bottom:36px;border-bottom:1px solid var(--line-2)}
.destaque img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px;background:var(--card);
  transition:opacity .4s var(--ease)}
.destaque:hover img{opacity:.88}
.destaque h2{font-size:clamp(24px,3vw,32px);font-weight:700;letter-spacing:-.025em;line-height:1.15}
.destaque h2{transition:color .3s var(--ease)}
/* ensaio em destaque: o mesmo título de dentro do post (serifa, itálico âmbar, rubrica) */
.destaque .rubrica{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ambar);font-weight:500;margin-bottom:12px}
.destaque h2.classico{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,60px);letter-spacing:0;line-height:1}
.destaque h2.classico i{color:var(--ambar)}
.destaque:hover h2.classico{color:var(--ink);opacity:.82}
.destaque:hover h2{color:var(--acento)}
.destaque .sub{color:var(--dim);font-size:16px;font-weight:300;margin:10px 0 16px;line-height:1.5}
.destaque.sem-capa{grid-template-columns:1fr;max-width:var(--col);margin:0 auto;text-align:left}

/* ---------- lista ---------- */
.lista,.ano,.mais{max-width:var(--col);margin:40px auto 0}
.linha{display:flex;gap:24px;align-items:flex-start;justify-content:space-between;text-decoration:none;
  padding:22px 0;border-bottom:1px solid var(--line-2)}
.linha-txt{min-width:0;flex:1}
.linha h3{font-size:18px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.linha h3{transition:color .3s var(--ease)}
.linha:hover h3{color:var(--acento)}
.linha .sub{color:var(--dim);font-size:14.5px;font-weight:300;margin:5px 0 10px;line-height:1.5}
.linha .meta{margin-top:8px}
.linha .sub + .meta{margin-top:0}
.thumb{flex:none;width:112px;aspect-ratio:3/2;object-fit:cover;border-radius:6px;background:var(--card)}
.tag-rasc{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ambar);
  border:1px solid currentColor;border-radius:4px;padding:2px 7px;margin-bottom:10px;
  display:table;font-weight:500;letter-spacing:.12em;line-height:1.4}

/* ---------- post ---------- */
.faixa-rasc{background:rgba(234,177,112,.1);color:var(--ambar);text-align:center;font-size:12.5px;
  padding:8px 16px;border-bottom:1px solid rgba(234,177,112,.25)}
.post{max-width:calc(var(--col) + 32px);margin:0 auto;padding:48px 16px 40px}
.post-cab h1{font-size:clamp(30px,5vw,42px);font-weight:700;letter-spacing:-.03em;line-height:1.12}
.post-sub{font-size:clamp(18px,2.4vw,21px);color:var(--dim);font-weight:300;line-height:1.45;margin-top:12px}
.byline{display:flex;align-items:center;gap:12px;margin-top:26px}
.byline img{width:40px;height:40px;border-radius:50%;object-fit:cover;background:var(--card)}
.byline .autor{font-size:14.5px;font-weight:500;text-decoration:none}
.byline .autor:hover{color:var(--acento)}
.byline .meta{margin-top:2px}
.partilha{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;
  margin-top:22px;padding:12px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.acao{font:inherit;font-size:13px;color:var(--dim);background:transparent;border:1px solid var(--line);
  border-radius:999px;padding:6px 14px;text-decoration:none;cursor:pointer;
  transition:color .3s var(--ease),border-color .3s var(--ease)}
.acao:hover{color:var(--ink);border-color:var(--line-3)}

/* ---------- corpo do texto ---------- */
.corpo{font-family:var(--sans);font-size:17px;line-height:1.75;color:var(--texto);margin-top:36px;
  font-optical-sizing:auto;overflow-wrap:break-word}
.corpo > * + *{margin-top:1.1em}
.corpo h2,.corpo h3,.corpo h4{font-family:var(--sans);color:var(--ink);letter-spacing:-.02em;line-height:1.25;
  margin-top:1.9em}
.corpo h2{font-size:26px;font-weight:700}
.corpo h3{font-size:21px;font-weight:600}
.corpo h4{font-size:17px;font-weight:600}
.corpo h2 + *,.corpo h3 + *,.corpo h4 + *{margin-top:.6em}
.corpo a{color:var(--acento);text-decoration:none;transition:opacity .3s var(--ease)}
.corpo a:hover{opacity:.75}
.corpo strong{color:var(--ink);font-weight:600}
.corpo ul,.corpo ol{padding-left:1.4em}
.corpo li + li{margin-top:.4em}
.corpo li::marker{color:var(--dim-2)}
.corpo blockquote{border-left:3px solid var(--acento);padding:2px 0 2px 22px;color:var(--ink);font-style:italic}
.corpo blockquote p + p{margin-top:.8em}
.corpo hr{border:0;height:auto;text-align:center;margin:2.4em 0;color:var(--dim-2)}
.corpo hr::before{content:"·  ·  ·";letter-spacing:.4em;font-family:var(--sans);font-size:18px}
.corpo figure{margin-left:0;margin-right:0}
.corpo figure img,.corpo > p img{display:block;width:100%;height:auto;border-radius:6px;background:var(--card)}
.corpo figcaption{font-family:var(--sans);font-size:13.5px;color:var(--dim-2);text-align:center;margin-top:10px;line-height:1.5}
.corpo code{font-family:var(--mono);font-size:.82em;background:var(--card);border:1px solid var(--line);
  border-radius:4px;padding:.1em .35em;color:var(--ink)}
.corpo pre{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:16px 18px;
  overflow-x:auto;line-height:1.55}
.corpo pre code{background:none;border:0;padding:0;font-size:14px}
.corpo table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14.5px;display:block;overflow-x:auto}
.corpo th,.corpo td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.corpo th{color:var(--ink);font-weight:600;border-bottom-color:var(--line-3)}
.corpo .embed{position:relative;aspect-ratio:16/9}
.corpo .embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:6px}
.corpo .footnote{font-family:var(--sans);font-size:14px;color:var(--dim);border-top:1px solid var(--line-2);
  padding-top:1.2em;margin-top:2.4em}
.corpo .footnote hr{display:none}
.corpo .footnote ol{padding-left:1.2em}
.corpo sup{line-height:0;vertical-align:super;font-size:.72em}  /* nota não empurra a linha */
.corpo sup a{text-decoration:none;color:var(--acento);font-family:var(--sans);font-size:.75em}

/* ---------- assinar (fim do post) ---------- */
.assinar{margin-top:56px;background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:32px 24px;text-align:center}
.assinar h2{font-size:20px;font-weight:600;letter-spacing:-.02em}
.assinar p{color:var(--dim);font-size:14.5px;font-weight:300;margin-top:6px}
.mais{margin-top:56px}

/* ---------- rodapé ---------- */
.rodape{border-top:1px solid var(--line-2);margin-top:24px}
.rodape .col{max-width:var(--larga);margin:0 auto;padding:24px 16px 40px;display:flex;flex-wrap:wrap;
  justify-content:space-between;gap:8px 24px;font-size:12.5px;color:var(--dim-2)}
.rodape a{text-decoration:none}
.rodape a:hover{color:var(--ink)}

@media (max-width:760px){
  .destaque{grid-template-columns:1fr;gap:18px}
  .thumb{width:84px}
  .corpo{font-size:16.5px}
  .post{padding-top:32px}
}
@media (max-width:420px){
  .mast-form,.assinar form{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}

/* ---------- ler com IA ---------- */

/* ---------- barra de progresso ---------- */
.progresso{position:fixed;top:0;left:0;right:0;height:2px;z-index:30;pointer-events:none}
.progresso i{display:block;height:100%;background:var(--acento);transform-origin:0 50%;transform:scaleX(0)}

/* ---------- sumário lateral (só em tela larga) ---------- */
.sumario{display:none}
@media (min-width:1240px){
  .sumario{display:block;position:fixed;top:120px;width:200px;max-height:calc(100dvh - 160px);overflow-y:auto;
    left:calc(50% - var(--col) / 2 - 16px - 248px)}
  .sumario .rot{display:block;margin-bottom:10px}
  .sumario ol{list-style:none}
  .sumario-lista{position:relative}
  .sumario li{border-left:1px solid var(--line-2)}
  .sumario a{display:block;font-size:13px;line-height:1.4;color:var(--dim-2);padding:6px 0 6px 14px;
    margin-left:-1px;border-left:1px solid transparent;transition:color .3s var(--ease),border-color .3s var(--ease)}
  .sumario li.n3 a{padding-left:26px;font-size:12.5px}
  .sumario a:hover{color:var(--ink)}
  .sumario a.on{color:var(--ink)}
  .sumario-ind{position:absolute;left:0;top:0;width:1px;height:0;background:var(--acento);opacity:0;pointer-events:none;
    transition:transform .5s var(--ease),height .5s var(--ease),opacity .3s var(--ease)}
}
.corpo h2,.corpo h3{scroll-margin-top:80px}

/* ---------- voltar para a lista ---------- */
.voltar{display:inline-block;font-size:13px;color:var(--dim-2);margin-bottom:22px;transition:color .3s var(--ease)}
.voltar:hover{color:var(--ink)}

/* ---------- fotos da aba Sobre: em cinza até o hover (como o retrato da home) ---------- */
.foto{display:block;width:100%;margin:0;padding:0;border:0;background:var(--card);border-radius:8px;
  overflow:hidden;cursor:zoom-in}
.foto img{display:block;width:100%;height:auto;filter:grayscale(1) contrast(1.05);
  transition:filter .7s var(--ease),transform .9s var(--ease)}
.foto:hover img,.foto:focus-visible img{filter:none;transform:scale(1.03)}
.foto:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
@media (hover:none){.foto img{filter:none}}
.luz{margin:auto;padding:0;border:0;background:transparent;max-width:min(92vw,1400px);max-height:92dvh;overflow:visible}
.luz::backdrop{background:rgba(0,0,0,.86);backdrop-filter:blur(6px)}
.luz img{display:block;max-width:min(92vw,1400px);max-height:92dvh;width:auto;height:auto;border-radius:8px}
.luz-fecha{position:fixed;top:16px;right:16px;width:40px;height:40px;border-radius:50%;border:1px solid #ffffff40;
  background:#11111199;color:#fff;font-size:22px;line-height:1;cursor:pointer}

/* ---------- trajetória: thread no formato do X ---------- */
.trajetoria-rot{margin-top:64px;border-bottom:0;padding-bottom:0}
.trajetoria{list-style:none;margin-top:28px}
.marco{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:16px}
.marco-lado{display:flex;flex-direction:column;align-items:center}
.marco-av{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--card);flex:none}
/* o fio que liga um post ao próximo, como numa thread */
.marco-lado::after{content:"";flex:1;width:1px;margin:10px 0 10px;background:var(--line-3)}
.marco:last-child .marco-lado::after{display:none}
.marco-corpo{padding-bottom:52px;min-width:0}
.marco:last-child .marco-corpo{padding-bottom:0}
/* cabeçalho: quem e onde, discreto; a posição na thread como rótulo */
.marco-cab{display:flex;align-items:center;gap:8px;min-height:36px;font-size:13.5px;line-height:1.3;
  white-space:nowrap;overflow:hidden}
.marco-cab b{font-weight:600;color:var(--ink);letter-spacing:-.005em}
.marco-onde{color:var(--dim);font-weight:300;overflow:hidden;text-overflow:ellipsis}
.marco-onde::before{content:"·";margin-right:8px;color:var(--dim-2)}
.marco-n{margin-left:auto;flex:none;font-size:11px;font-weight:500;letter-spacing:.14em;color:var(--dim-2);
  font-variant-numeric:tabular-nums}
/* título manda, frase acompanha em peso leve */
.marco-corpo h3{font-size:19px;font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1.3;margin-top:6px}
.sobre .marco-corpo p{font-family:var(--sans);font-size:15px;font-weight:300;line-height:1.6;color:var(--dim);
  margin-top:6px}
/* mídia: altura fixa, largura natural (a foto nunca é cortada nem distorcida), cantos de 32px, sem borda.
   Várias fotos da mesma época ficam lado a lado numa faixa com rolagem e encaixe: o carrossel. */
.midia{display:flex;gap:8px;margin-top:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.midia::-webkit-scrollbar{display:none}
.marco .foto{flex:none;width:auto;margin:0;border:0;border-radius:32px;background:var(--card);
  isolation:isolate;scroll-snap-align:start}
.marco .foto img{height:400px;width:auto;max-width:none;object-fit:initial;filter:none;
  transition:transform .9s var(--ease),opacity .4s var(--ease)}
.marco .foto:hover img,.marco .foto:focus-visible img{filter:none;transform:scale(1.025)}
.marco .foto:focus-visible{outline-offset:3px}
@media (max-width:560px){
  .marco{grid-template-columns:32px minmax(0,1fr);column-gap:12px}
  .marco-av{width:32px;height:32px}
  .marco-cab{min-height:32px;font-size:13px;gap:6px}
  .marco-onde::before{margin-right:6px}
  .marco-corpo h3{font-size:17.5px}
  .marco-corpo{padding-bottom:44px}
  .midia{margin-top:16px}
  .marco .foto img{height:180px}
}
.luz figure{margin:0}
.luz figcaption{font-size:13px;color:#cfcfd2;text-align:center;margin-top:10px}
.luz img{max-height:calc(92dvh - 34px)}

/* ---------- fileira do post: compartilhar (ícones) + ler com IA (segmentado) ---------- */
.compartilhar{display:flex;gap:6px}
.ic{position:relative;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
  border:1px solid var(--line);background:transparent;color:var(--dim);cursor:pointer;
  transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
.ic:hover,.ic:focus-visible{color:var(--ink);border-color:var(--line-3);background:var(--card)}
.ic.ok{color:var(--acento);border-color:var(--acento-esc)}
/* dica: o nome do botão aparece ao passar o mouse, e "Link copiado" depois do clique */
.ic::after{content:attr(data-dica);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px);
  white-space:nowrap;font-size:12px;line-height:1;padding:6px 9px;border-radius:6px;background:var(--ink);color:var(--bg);
  opacity:0;pointer-events:none;transition:opacity .2s var(--ease),transform .2s var(--ease)}
.ic:hover::after,.ic:focus-visible::after,.ic.ok::after{opacity:1;transform:translate(-50%,0)}
.ler-ia{display:flex;align-items:center;gap:10px}
.ler-ia-rot{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim-2)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.seg > *{font:inherit;font-size:13px;color:var(--dim);background:transparent;border:0;cursor:pointer;
  padding:7px 14px;text-decoration:none;line-height:1.2;transition:color .3s var(--ease),background .3s var(--ease)}
.seg > * + *{border-left:1px solid var(--line)}
.seg > *:hover,.seg > *:focus-visible{color:var(--ink);background:var(--card)}
@media (max-width:560px){
  .ler-ia{width:100%;justify-content:space-between}
}

/* ---------- topo: logo leva à home do blog; "Voltar para o site" leva à home do site ---------- */
.top-nav .voltar-site{color:var(--dim);border:1px solid var(--line);border-radius:8px}
.top-nav .voltar-site:hover{color:var(--ink);border-color:var(--line-3)}
.vs-curto{display:none}
@media (max-width:560px){.vs-longo{display:none}.vs-curto{display:inline}.marca{font-size:14px}}