/* ============================================================
   PIMENTA ROSA — BLOG
   Lista de textos e página de texto
   ============================================================ */

.blog-topo{
  padding:var(--sp-9) 0 var(--sp-9);text-align:center;
  background:linear-gradient(178deg,var(--sf-base) 0%,#FDF8EE 50%,var(--sf-creme) 100%);
}
.blog-topo .wrap{display:grid;justify-items:center}
.blog-topo h1{
  font-size:clamp(2.1rem,5.2vw,var(--fs-10));letter-spacing:-.035em;margin:var(--sp-4) 0 var(--sp-4);
  font-weight:500;line-height:1.04;max-width:16ch;
}
.blog-topo h1 em{font-style:italic;font-weight:400}
.blog-topo__lead{font-size:var(--fs-05);color:var(--tx-corpo);max-width:58ch;line-height:1.6}
.blog-vazio{text-align:center;color:var(--tx-suave);font-size:var(--fs-04);padding:var(--sp-8) 0}

/* ---------- Corpo: cards + coluna lateral ---------- */
.blog-corpo{background:var(--sf-branco);padding-top:var(--sp-8)}
.blog-corpo__in{display:grid;grid-template-columns:1fr 300px;gap:var(--sp-6);align-items:start}
.blog-lado{display:grid;gap:var(--sp-4);position:sticky;top:92px}
.blog-lado .busca{
  display:flex;align-items:center;gap:10px;padding:0 16px;
  border:1.5px solid var(--br-media);border-radius:var(--rd-pill);background:var(--sf-branco);box-shadow:var(--sh-1);
}
.blog-lado .busca:focus-within{border-color:var(--ac-primaria);box-shadow:0 0 0 4px rgba(163,14,80,.12)}
.blog-lado .busca svg{width:18px;height:18px;color:var(--ac-primaria);flex:0 0 auto}
.blog-lado .busca input{flex:1;min-width:0;border:0;background:transparent;padding:14px 0;font-family:var(--ff-corpo);font-size:var(--fs-03);color:var(--tx-forte);appearance:none}
.blog-lado .busca input:focus{outline:none}
.blog-cats{background:var(--sf-branco);border:1px solid var(--br-suave);border-radius:var(--rd-lg);padding:var(--sp-5);box-shadow:var(--sh-1)}
.blog-cats h3{font-size:var(--fs-06);font-weight:500;margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--br-rosa)}
.blog-cats ul{list-style:none;margin:0;padding:0}
.blog-cats li + li{border-top:1px solid var(--br-suave)}
.blog-cats button{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:0;background:transparent;cursor:pointer;text-align:left;padding:11px 2px;
  font-family:var(--ff-corpo);font-size:var(--fs-03);color:var(--tx-corpo);transition:var(--mo-rapido);
}
.blog-cats button:hover,.blog-cats button.is-on{color:var(--ac-primaria)}
.blog-cats button span{
  font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);
  min-width:24px;height:24px;padding:0 7px;border-radius:var(--rd-pill);display:grid;place-items:center;
  background:var(--sf-creme);color:var(--tx-suave);
}
.blog-cats button.is-on span{background:var(--gr-acao);color:#fff}
.blog-cta{
  background:var(--gr-vinho);color:var(--tx-invertido);border-radius:var(--rd-lg);padding:var(--sp-5);display:grid;gap:10px;justify-items:start;
}
.blog-cta .over-t{color:var(--pr-rose-clara)}
.blog-cta .over-t::before{background:var(--pr-rose)}
.blog-cta p{font-family:var(--ff-display);font-variation-settings:var(--fv-display);font-size:var(--fs-05);color:#fff;line-height:1.3}

/* ---------- Cards ---------- */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
.posts--2{grid-template-columns:repeat(2,1fr);margin-top:var(--sp-5)}
.post-card{
  display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:inherit;
  border:1px solid var(--br-suave);border-radius:var(--rd-lg);background:var(--sf-branco);
  transition:transform var(--mo-padrao),box-shadow var(--mo-padrao),border-color var(--mo-padrao);
}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--sh-3);border-color:var(--br-rose)}
.post-card__capa{
  position:relative;aspect-ratio:16/10;display:block;overflow:hidden;
  background:
    radial-gradient(circle at 50% 30%,#FFFFFF,transparent 68%),
    linear-gradient(155deg,var(--sf-rosa-veu) 0%,var(--sf-creme) 62%,var(--sf-creme-2) 100%);
}
.post-card__capa::after{
  content:"";position:absolute;inset:0;background-image:var(--pt-damasco);background-size:60px 90px;opacity:.09;
  -webkit-mask-image:radial-gradient(64% 64% at 50% 50%,transparent 34%,#000 92%);
          mask-image:radial-gradient(64% 64% at 50% 50%,transparent 34%,#000 92%);
}
.post-card__capa img{
  position:absolute;inset:var(--sp-4);margin:auto;width:auto;height:auto;
  max-width:calc(100% - var(--sp-6));max-height:calc(100% - var(--sp-6));object-fit:contain;
  filter:drop-shadow(0 10px 18px rgba(72,4,17,.16));transition:transform var(--mo-padrao);
}
.post-card:hover .post-card__capa img{transform:scale(1.05)}
.post-card__corpo{display:flex;flex-direction:column;gap:8px;padding:var(--sp-5);flex:1}
.post-card__cat{font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);letter-spacing:.14em;text-transform:uppercase;color:var(--ac-primaria);font-weight:600}
.post-card__marca{width:28%;height:auto;color:var(--pr-rose);opacity:.55;position:absolute;inset:0;margin:auto}
.post-card__pe{margin-top:auto;padding-top:var(--sp-3);border-top:1px solid var(--br-suave);display:flex;align-items:center;justify-content:space-between;gap:10px}
.post-card__meta{display:flex;align-items:center;gap:10px;font-size:var(--fs-01);color:var(--tx-suave);line-height:1.35;min-width:0}
.post-card__meta b{display:block;font-size:var(--fs-02);color:var(--tx-forte);font-weight:700}
.post-card__avatar,.post__avatar{
  width:36px;height:36px;border-radius:var(--rd-pill);display:grid;place-items:center;overflow:hidden;flex:0 0 auto;
  background:var(--gr-acao);color:#fff;font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);font-weight:700;letter-spacing:.04em;
}
.post-card__avatar img,.post__avatar img{width:100%;height:100%;object-fit:cover}
.post-card time{font-size:var(--fs-01);color:var(--tx-suave)}
.post-card[hidden]{display:none}
.post-card__titulo{
  font-family:var(--ff-display);font-variation-settings:var(--fv-display);
  font-size:var(--fs-06);font-weight:600;color:var(--tx-forte);line-height:1.2;letter-spacing:-.015em;
}
.post-card__resumo{font-size:var(--fs-03);color:var(--tx-corpo);line-height:1.6}
.post-card__ler{
  display:inline-flex;align-items:center;gap:8px;
  font-size:var(--fs-02);font-weight:700;color:var(--ac-primaria);
}
.post-card__ler svg{width:16px;height:16px;transition:var(--mo-rapido)}
.post-card:hover .post-card__ler svg{transform:translateX(3px)}

/* ---------- Página do texto ---------- */
.post{background:linear-gradient(178deg,var(--sf-creme) 0%,var(--sf-base) 30%);padding-top:var(--sp-6)}
.post__voltar{
  margin-bottom:var(--sp-5);display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-01);letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--tx-suave);text-decoration:none;transition:var(--mo-rapido);
}
.post__voltar:hover{color:var(--ac-primaria)}
.post__cab{text-align:center;max-width:640px;margin:0 auto var(--sp-6);padding-bottom:var(--sp-5);border-bottom:1px solid var(--br-rosa);display:grid;justify-items:center;gap:var(--sp-3)}
.post__cab h1{font-size:clamp(1.7rem,2.9vw,2.6rem);letter-spacing:-.025em;line-height:1.15;font-weight:500}
.post__cats{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px}
.post__cats a,.post__cats span{
  font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ac-primaria);font-weight:600;text-decoration:none;
}
.post__cats a:hover{text-decoration:underline;text-underline-offset:4px}
.post__autor{display:flex;align-items:center;gap:12px;text-align:left;font-size:var(--fs-02);color:var(--tx-suave)}
.post__autor b{display:block;color:var(--tx-forte);font-size:var(--fs-03)}
.post__avatar{width:40px;height:40px;font-size:var(--fs-02)}
.post__avatar--g{width:76px;height:76px;font-size:var(--fs-05);margin-bottom:4px;box-shadow:0 8px 18px rgba(72,4,17,.18)}

.post__colunas{display:grid;grid-template-columns:250px minmax(0,1fr) 270px;gap:var(--sp-5);align-items:start}
.post__lado{display:grid;gap:var(--sp-4);position:sticky;top:92px}
.post__cartao{background:var(--sf-branco);border:1px solid var(--br-suave);border-radius:var(--rd-lg);box-shadow:var(--sh-1)}
.post__lado .post__cartao{padding:var(--sp-5)}

.post__autoria{text-align:center;display:grid;justify-items:center;gap:6px}
.post__autoria b{font-family:var(--ff-display);font-variation-settings:var(--fv-display);font-size:var(--fs-05);color:var(--tx-forte);line-height:1.2}
.post__marca-rot{font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);letter-spacing:.12em;text-transform:uppercase;color:var(--ac-primaria)}
.post__autoria p{font-size:var(--fs-02);color:var(--tx-corpo);line-height:1.6;margin-top:6px}
.post__cta{background:var(--gr-vinho);border-color:transparent;color:var(--tx-invertido);text-align:center;display:grid;justify-items:center;gap:8px}
.post__cta b{font-family:var(--ff-display);font-variation-settings:var(--fv-display);font-size:var(--fs-05);color:#fff;line-height:1.25}
.post__cta p{font-size:var(--fs-02);color:rgba(253,246,236,.8)}
.post__cta .btn{margin-top:6px}

.post__principal{padding:var(--sp-5)}
.post__capa{
  margin:0 0 var(--sp-6);aspect-ratio:16/9;border-radius:var(--rd-md);overflow:hidden;position:relative;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 50% 40%,#FFFFFF,transparent 66%),
    linear-gradient(155deg,var(--sf-rosa-veu) 0%,var(--sf-creme) 62%,var(--sf-creme-2) 100%);
  border:1px solid var(--br-rosa);
}
.post__capa::after{content:"";position:absolute;inset:0;background-image:var(--pt-damasco);background-size:60px 90px;opacity:.08}
.post__capa img{position:relative;z-index:1;max-height:82%;max-width:70%;object-fit:contain;filter:drop-shadow(0 14px 26px rgba(72,4,17,.18))}
.post__texto{font-size:var(--fs-04);line-height:1.75;color:var(--tx-corpo)}
.post__texto p{margin:0 0 var(--sp-4)}
.post__texto h2,.post__texto h3,.post__texto h4{margin:var(--sp-6) 0 var(--sp-3);letter-spacing:-.02em}
.post__texto h2{font-size:var(--fs-07)}
.post__texto h3{font-size:var(--fs-06)}
.post__texto h4{font-size:var(--fs-05)}
.post__texto ul,.post__texto ol{margin:0 0 var(--sp-4);padding-left:1.3em}
.post__texto li{margin-bottom:6px}
.post__texto li::marker{color:var(--pr-rose)}
.post__texto strong{color:var(--tx-forte)}
.post__texto blockquote{
  margin:var(--sp-5) 0;padding:var(--sp-4) var(--sp-5);border-left:3px solid var(--pr-rose);
  background:var(--sf-rosa-veu);border-radius:0 var(--rd-md) var(--rd-md) 0;
  font-family:var(--ff-display);font-variation-settings:var(--fv-display);font-style:italic;font-size:var(--fs-05);color:var(--tx-forte);
}
.post__texto img{border-radius:var(--rd-md);margin:var(--sp-4) 0;max-width:100%;height:auto;display:block}
.post__texto img.img--esq{float:left;width:min(46%,320px);margin:6px var(--sp-5) var(--sp-3) 0}
.post__texto img.img--dir{float:right;width:min(46%,320px);margin:6px 0 var(--sp-3) var(--sp-5)}
.post__texto img.img--centro{width:min(80%,560px);margin-left:auto;margin-right:auto}
.post__texto img.img--cheia{width:100%}
.post__texto figure{margin:var(--sp-5) 0}
.post__texto figure img{margin:0}
.post__texto figcaption{font-size:var(--fs-02);color:var(--tx-suave);text-align:center;margin-top:8px}
.post__texto hr{border:0;height:1px;background:var(--br-rosa);margin:var(--sp-6) auto;width:40%}
.post__texto u{text-decoration-color:var(--pr-rose);text-underline-offset:3px}
.post__texto::after{content:"";display:table;clear:both}
@media (max-width:680px){.post__texto img.img--esq,.post__texto img.img--dir{float:none;width:100%;margin:var(--sp-4) 0}}
.post__texto a{color:var(--ac-primaria)}
.post__texto > :last-child{margin-bottom:0}

.post__lado .blog-cats{padding:var(--sp-5)}
.post__lado .blog-cats a{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 2px;
  font-size:var(--fs-03);color:var(--tx-corpo);text-decoration:none;transition:var(--mo-rapido);
}
.post__lado .blog-cats a:hover{color:var(--ac-primaria)}
.post__lado .blog-cats a span{
  font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);
  min-width:24px;height:24px;padding:0 7px;border-radius:var(--rd-pill);display:grid;place-items:center;background:var(--sf-creme);color:var(--tx-suave);
}
.post__recentes h3{font-size:var(--fs-06);font-weight:500;margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--br-rosa)}
.post__recentes ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.post__recentes a{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tx-corpo);font-size:var(--fs-02);line-height:1.4;transition:var(--mo-rapido)}
.post__recentes a:hover{color:var(--ac-primaria)}
.post__mini{
  flex:0 0 56px;width:56px;height:56px;border-radius:var(--rd-sm);display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(155deg,var(--sf-rosa-veu),var(--sf-creme-2));border:1px solid var(--br-rosa);
}
.post__mini img{width:80%;height:80%;object-fit:contain}
.post__mini svg{width:40%;color:var(--pr-rose);opacity:.7}

.post__nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-top:var(--sp-6)}
.post__nav-item{
  display:grid;gap:4px;padding:var(--sp-4) var(--sp-5);text-decoration:none;
  background:var(--sf-branco);border:1px solid var(--br-suave);border-radius:var(--rd-lg);transition:var(--mo-padrao);
}
.post__nav-item:hover{border-color:var(--br-rose);box-shadow:var(--sh-2);transform:translateY(-2px)}
.post__nav-item small{font-family:var(--ff-mono);font-variation-settings:var(--fv-mono);font-size:var(--fs-01);letter-spacing:.14em;text-transform:uppercase;color:var(--ac-primaria)}
.post__nav-item span{font-family:var(--ff-display);font-variation-settings:var(--fv-display);font-size:var(--fs-05);color:var(--tx-forte);line-height:1.25}
.post__nav-item--prox{text-align:right}

@media (max-width:1080px){
  .posts{grid-template-columns:repeat(2,1fr)}
  .post__colunas{grid-template-columns:1fr}
  .post__lado{position:static}
  .post__lado--esq{order:2;grid-template-columns:1fr 1fr}
  .post__lado--dir{order:3;grid-template-columns:1fr 1fr}
  .post__principal{order:1}
  .blog-corpo__in{grid-template-columns:1fr}
  .blog-lado{position:static;grid-template-columns:1fr 1fr;align-items:start}
  .blog-lado .busca{grid-column:1 / -1}
}
@media (max-width:680px){
  .posts,.posts--2{grid-template-columns:1fr}
  .blog-lado{grid-template-columns:1fr}
  .post__lado--esq,.post__lado--dir{grid-template-columns:1fr}
  .post__capa{aspect-ratio:4/3}
  .post__nav{grid-template-columns:1fr}
  .post__nav-item--prox{text-align:left}
}
