/*
Theme Name: Pasta
Theme URI: https://linkdapasta.com.br
Author: Thomaz
Description: Vitrine de trabalhos em formato de blog. Preto e branco, magenta como cor de destaque em interações, tipografia Helvetica, imagens grandes com lightbox, avaliação em 5 estrelas, banners comerciais rotativos e sem comentários.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: pasta
*/

:root{
  --ink:#0a0a0a;
  --grafite:#4a4a4a;
  --cinza:#9b9b9b;
  --linha:#e6e6e6;
  --fundo:#ffffff;
  --magenta:#e6007a;
  --col-texto:680px;
  --col-midia:960px;
  --fonte:'Helvetica Neue',Helvetica,Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--fonte);color:var(--ink);background:var(--fundo);
  font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
button{font-family:inherit}

/* ---------- TOPO ---------- */
.barra-topo{
  display:flex;align-items:center;justify-content:flex-end;
  padding:20px 24px 0;
  max-width:var(--col-midia);margin:0 auto;
}
.btn-enviar{
  font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;color:#fff;
  background:var(--ink);
  border:1px solid var(--ink);
  padding:8px 16px;
  transition:background .2s,border-color .2s;
  white-space:nowrap;
}
.btn-enviar:hover{background:var(--magenta);border-color:var(--magenta)}

.cabecalho{padding:0 24px 0;text-align:center}
.marca-linha{padding-top:20px}
.marca{
  font-size:clamp(64px,12vw,130px);
  font-weight:700;letter-spacing:-.05em;line-height:.9;
  text-decoration:none;display:inline-block;
}
.custom-logo{max-height:190px;width:auto;max-width:100%;margin:0 auto}
.cabecalho .tagline{margin-top:10px;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--cinza)}

.barra-busca{max-width:var(--col-texto);margin:44px auto 0;padding:0 24px}
.busca{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--ink);padding:10px 2px;transition:border-color .2s}
.busca:focus-within{border-color:var(--magenta)}
.busca:focus-within svg{stroke:var(--magenta)}
.busca svg{flex:none;stroke:var(--cinza)}
.busca input{border:0;outline:0;width:100%;font:inherit;font-size:15px;background:transparent;color:var(--ink)}
.busca input::placeholder{color:var(--cinza)}

.categorias{
  margin:36px auto 0;display:flex;justify-content:center;gap:34px;
  font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:lowercase;
  overflow-x:auto;padding:0 24px 4px;-webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.categorias::-webkit-scrollbar{display:none}
.categorias a{color:var(--cinza);text-decoration:none;white-space:nowrap;
  padding-bottom:6px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.categorias a:hover{color:var(--ink)}
.categorias a.ativa{color:var(--ink);border-bottom-color:var(--ink)}
@media(max-width:640px){.categorias{justify-content:flex-start;gap:26px}}

.divisor-topo{max-width:var(--col-midia);margin:56px auto 0;border:0;border-top:1px solid var(--linha)}

main{padding:72px 0 96px}

/* ---------- ESTRELAS ---------- */
.estrelas{display:inline-flex;align-items:center;gap:2px;line-height:1}
.estrelas svg{width:15px;height:15px;fill:none;stroke:var(--ink);stroke-width:1.4}
.estrelas svg.cheia{fill:var(--ink)}
.estrelas .nota{margin-left:8px;font-size:12px;letter-spacing:.06em;color:var(--grafite)}

.votar{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.votar .rotulo{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cinza)}
.votar .estrelas svg{width:26px;height:26px;cursor:pointer;transition:transform .1s,stroke .15s,fill .15s}
.votar .estrelas svg:hover{transform:scale(1.12);stroke:var(--magenta)}
.votar .estrelas svg:hover.cheia{fill:var(--magenta)}
.votar .obrigado{font-size:12px;color:var(--grafite);min-height:16px}

/* ---------- BANNERS (convite e propaganda) ---------- */
.chamada{max-width:var(--col-midia);margin:0 auto 88px;padding:0 24px}
.chamada-inner{
  position:relative;display:flex;border:1px solid var(--ink);
  min-height:204px;padding:40px 48px;
  flex-direction:row;align-items:center;justify-content:space-between;gap:24px;
  text-align:left;text-decoration:none;color:inherit;cursor:pointer;
  overflow:hidden;transition:border-color .25s;
}
.chamada-inner::before{
  content:'';position:absolute;inset:0;background:var(--magenta);
  transform:translateY(101%);transition:transform .35s ease;
}
.chamada-inner:hover{border-color:var(--magenta)}
.chamada-inner:hover::before{transform:translateY(0)}
.chamada-texto{position:relative;z-index:1;display:flex;flex-direction:column}
.chamada-frase{font-size:clamp(24px,3.4vw,34px);font-weight:700;letter-spacing:-.015em;
  line-height:1.1;color:var(--ink);transition:opacity .4s,color .25s}
.chamada-inner:hover .chamada-frase{color:#fff}
.chamada-sub{font-size:clamp(24px,3.4vw,34px);font-weight:700;line-height:1.1;letter-spacing:-.015em;
  margin-top:8px;color:var(--ink);opacity:0;transition:opacity .5s,color .25s}
.chamada-inner.sub-visivel .chamada-sub{opacity:1}
.chamada-inner:hover .chamada-sub{color:#fff}
.chamada-inner.trocando-slide .chamada-frase,
.chamada-inner.trocando-slide .chamada-sub{opacity:0}
@media(max-width:640px){.chamada-inner{min-height:170px;padding:28px 24px}}

/* modo com logo: texto à esquerda (título forte + legenda fina), marca à direita */
.chamada-inner.com-logo .chamada-sub{font-weight:400;font-size:clamp(18px,2.6vw,27px);
  margin-top:10px;color:var(--grafite)}
.chamada-inner.com-logo:hover .chamada-sub{color:rgba(255,255,255,.9)}
.chamada-logo{display:none;position:relative;z-index:1;max-height:70px;width:auto;flex:none;transition:filter .25s}
.chamada-inner.com-logo .chamada-logo{display:block}
.chamada-inner.com-logo:hover .chamada-logo{filter:brightness(0) invert(1)}
@media(max-width:640px){
  .chamada-inner.com-logo{flex-direction:column;align-items:flex-start;gap:14px}
  .chamada-logo{max-height:44px}
}

/* modo imagem: peça pronta de patrocinador (estática ou GIF) ocupa o banner inteiro */
.chamada-imagem{display:none;width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.chamada-inner.tem-imagem{padding:0}
.chamada-inner.tem-imagem::before{content:none}
.chamada-inner.tem-imagem .chamada-imagem{display:block}
.chamada-inner.tem-imagem .chamada-texto,
.chamada-inner.tem-imagem .chamada-logo{display:none}
.chamada-inner.tem-imagem:hover .chamada-imagem{opacity:.94}

/* ---------- HOME (listagem) ---------- */
.aviso-arquivo{max-width:var(--col-texto);margin:0 auto 48px;padding:0 24px;
  font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:lowercase;color:var(--grafite)}
.cartao{max-width:var(--col-midia);margin:0 auto 88px;padding:0 24px}
.cartao + .cartao{border-top:1px solid var(--linha);padding-top:80px}
.cartao .capa{display:block;overflow:hidden;background:#f4f4f4;margin-bottom:26px}
.cartao .capa img{width:100%;transition:transform .6s ease}
.cartao .capa:hover img{transform:scale(1.012)}
.cartao-texto{max-width:var(--col-texto);margin:0 auto}
.cartao h2{font-size:clamp(26px,3.8vw,38px);font-weight:700;letter-spacing:-.03em;line-height:1.1;
  margin-bottom:10px;text-transform:lowercase}
.cartao h2 a{text-decoration:none}
.cartao h2 a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px}
.rodape-cartao{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}

.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;font-size:11.5px;font-weight:500;
  letter-spacing:.14em;text-transform:lowercase;color:var(--grafite)}
.meta > *:not(:last-child)::after{content:"—";margin:0 10px;color:var(--cinza)}
.meta a{text-decoration:none;color:inherit}
.meta a:hover{color:var(--magenta)}

.paginacao{max-width:var(--col-texto);margin:16px auto 0;padding:0 24px;
  display:flex;gap:22px;justify-content:center;align-items:center;font-size:13px;font-weight:500;flex-wrap:wrap}
.paginacao .page-numbers{text-decoration:none;color:var(--grafite);transition:color .2s}
.paginacao a.page-numbers:hover{color:var(--magenta)}
.paginacao span.page-numbers.current{color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:2px}
.paginacao .page-numbers.dots{color:var(--cinza)}

/* ---------- POST ÚNICO ---------- */
.post-unico{max-width:var(--col-midia);margin:0 auto;padding:0 24px}
.post-cabeca{max-width:var(--col-texto);margin:0 auto}
.post-cabeca h1{font-size:clamp(32px,5vw,50px);font-weight:700;letter-spacing:-.035em;
  line-height:1.05;margin-bottom:14px;text-transform:lowercase}
.post-cabeca .meta{margin-bottom:44px}

.midia{display:grid;gap:14px;margin-bottom:40px}
.midia figure{cursor:zoom-in;overflow:hidden;background:#f4f4f4}
.midia img{width:100%;transition:transform .6s ease}
.midia figure:hover img{transform:scale(1.012)}
.midia .video{position:relative;padding-top:56.25%;background:#000}
.midia .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.midia .duas{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.midia .duas{grid-template-columns:1fr}}

.post-corpo{max-width:var(--col-texto);margin:0 auto}
.post-corpo p{margin-bottom:1.15em;color:#222}
.post-corpo a{color:var(--ink);text-decoration-color:var(--magenta)}
.post-corpo img{cursor:zoom-in;margin:1.6em 0}
.post-corpo figcaption{font-size:12.5px;color:var(--cinza);margin-top:6px;text-align:center}

.ficha{border-top:1px solid var(--ink);margin-top:10px;padding-top:22px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px 32px;font-size:14px}
.ficha dt{font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:lowercase;
  color:var(--cinza);margin-bottom:3px}
.ficha dd{font-weight:500}

.acoes{max-width:var(--col-texto);margin:44px auto 0;display:flex;align-items:flex-end;
  justify-content:space-between;gap:16px;flex-wrap:wrap}

.redes{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.redes .rotulo{font-size:11px;letter-spacing:.18em;text-transform:lowercase;color:var(--cinza)}
.redes .icones{display:flex;gap:6px}
.redes .icones a,.redes .icones button{
  width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--linha);background:none;color:var(--ink);cursor:pointer;
  transition:border-color .2s,background .2s,color .2s;
}
.redes .icones a:hover,.redes .icones button:hover{border-color:var(--ink);background:var(--ink);color:#fff}
.redes .icones svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6}

.nav-posts{max-width:var(--col-texto);margin:72px auto 0;display:flex;justify-content:space-between;
  gap:16px;border-top:1px solid var(--linha);padding-top:22px;font-size:13px;font-weight:500}
.nav-posts a{text-decoration:none;color:var(--grafite);text-transform:lowercase}
.nav-posts a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}

/* ---------- PÁGINA DE CONTATO ---------- */
.contato{max-width:var(--col-texto);margin:0 auto;padding:0 24px}
.contato h1{font-size:clamp(32px,5vw,50px);font-weight:700;letter-spacing:-.035em;
  line-height:1.05;margin-bottom:14px;text-transform:lowercase}
.contato .conteudo-pagina{color:#222}
.contato .conteudo-pagina p{margin-bottom:1.1em}
.contato .conteudo-pagina h2{font-size:12px;font-weight:500;letter-spacing:.2em;
  text-transform:lowercase;color:var(--cinza);margin:40px 0 14px}
.contato .conteudo-pagina ol,.contato .conteudo-pagina ul{margin:0 0 1.1em 1.2em}
.contato .conteudo-pagina a{color:var(--ink);border-bottom:2px solid var(--ink);text-decoration:none;
  transition:color .2s,border-color .2s}
.contato .conteudo-pagina a:hover{color:var(--magenta);border-color:var(--magenta)}
.contato a.email-destaque:hover{color:var(--magenta);border-color:var(--magenta)}

/* ---------- LIGHTBOX ---------- */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(8,8,8,.96);display:none;
  align-items:center;justify-content:center;padding:32px;cursor:zoom-out}
.lightbox.aberto{display:flex}
.lightbox img{max-width:100%;max-height:100%}
.lightbox .fechar{position:absolute;top:20px;right:24px;font-size:28px;line-height:1;
  color:#fff;background:none;border:0;cursor:pointer;opacity:.7}
.lightbox .fechar:hover{opacity:1}

/* ---------- RODAPÉ ---------- */
.site-footer{border-top:1px solid var(--linha);padding:36px 24px;text-align:center;
  font-size:12px;letter-spacing:.1em;color:var(--cinza);text-transform:lowercase}
.rodape-redes{display:flex;justify-content:center;gap:22px;margin-bottom:14px}
.rodape-redes a{color:var(--cinza);transition:color .2s}
.rodape-redes a:hover{color:var(--ink)}
.rodape-redes svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5}
.site-footer a.link-contato{cursor:pointer;text-decoration:underline;text-underline-offset:3px;color:inherit}
.aviso-legal{max-width:var(--col-texto);margin:18px auto 0;padding:0 24px;
  font-size:10.5px;line-height:1.6;color:var(--cinza);text-transform:none;letter-spacing:normal}

.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(80px);
  background:var(--magenta);color:#fff;font-size:13px;font-weight:500;padding:11px 24px;
  opacity:0;transition:.3s;z-index:110}
.toast.mostrar{opacity:1;transform:translateX(-50%) translateY(0)}

.vazio{max-width:var(--col-texto);margin:80px auto;padding:0 24px;text-align:center;color:var(--grafite)}

/* comentários desligados por design; garante que nada apareça */
.comments-area,#comments{display:none!important}

@media (prefers-reduced-motion: reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}