/* ===== SINGLE / HERO (mobile-first) ===== */
.post-hero { position: relative; }

.post-hero__media { margin: 0; position: relative; }
.post-hero__img { 
    width: 100%; height: 52vh; 
    min-height: 320px; 
    /* max-height: 560px;  */
    object-fit: cover; 
    display: block; 
  }
.post-hero__shade {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,.35), rgba(0,0,0,.15));
}

.post-hero__inner{
  position: absolute;
  inset: 0;
  display: grid;
  align-items: end;
  padding-bottom: 56px;
}

@media (min-width: 1024px){
  .post-hero__inner{ padding-bottom: 72px; }
}

.post-hero__content{
  will-change: transform;
}


.post-hero__kicker { display: inline-block; font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px; }
.post-hero__title { font-size: 28px; line-height: 1.1; margin: 0 0 14px; }
.post-hero__deck { font-size: 14px; line-height: 1.45; margin: 0 0 14px; opacity: .95; }
.post-hero__meta { font-size: 12px; opacity: .95; display: inline-flex; gap: 8px; align-items: center; }
.post-hero__dot { opacity: .7; }


/* ===== MOBILE HERO FINAL (override) ===== */
@media (max-width: 768px){
  .post-hero{
    height: 56vh;
    min-height: 480px;
  }

  .post-hero__inner{
    padding: 0 16px 26px !important;
    align-items: flex-end;
    justify-content: center;
    text-align: center;
  }

  .post-hero__content{
    max-width: 560px;
    margin: 0 auto;
  }

  .post-hero__title{
    font-size: 28px;
    line-height: 1.15;
    margin: 10px auto 12px;
  }

  .post-hero__deck{
    font-size: 15px;
    line-height: 1.35;
    margin: 0 auto 12px;
  }
}




/* ===== layout ===== */
.single-wrap { padding-top: 18px; padding-bottom: 28px; }
.single-grid { display: block; }
.single-main { min-width: 0; }

/* .post-content { font-size: 18px; line-height: 1.75; } */

.post-content { 
  margin: 0 0 18px; 
  font-family: Merriweather;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.74;
}

.post-content a {
  font-family: 'Merriweather', serif;
  font-weight: 400;
  color: #c28a00; /* dourado editorial */
  text-decoration: none;
  border-bottom: 1px solid rgba(194, 138, 0, 0.4);
  transition: color .2s ease, border-color .2s ease;
}


.post-content a:hover {
  color: #8f6500;
  border-bottom-color: rgba(143, 101, 0, 0.7);
}


.post-content a.button,
.post-content .wp-block-button__link {
  border-bottom: none;
}


.post-content img { max-width: 100%; height: auto; }

/* tags */
.post-tags { margin-top: 18px; font-size: 13px; opacity: .9; }
.post-tags__label { font-weight: 700; margin-right: 6px; }

/* aside */
.single-aside { margin-top: 24px; }
.aside-stack { display: grid; gap: 16px; }
.aside-title { font-size: 14px; margin: 0 0 10px; font-weight: 800; }
.aside-list { display: grid; gap: 10px; }
.aside-item { text-decoration: none; display: block; }
.aside-item__title { font-size: 13px; line-height: 1.3; }

/* ads mock reservando espaço (CLS) */
.ad__box{
  width:100%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(0,0,0,.15);
  background: rgba(0,0,0,.03);
  font-weight: 800;
}
.ad--728x90 .ad__box { aspect-ratio: 728 / 90; }
.ad--300x250 .ad__box { aspect-ratio: 300 / 250; }
.ad--300x600 .ad__box { aspect-ratio: 300 / 600; }

/* ===== desktop ===== */
@media (min-width: 1024px){
  .post-hero__img { height: 750px; min-height: 420px; }
  .post-hero__title { 
        font-family: Fira Sans !important;
        font-size: 40px;
        line-height: 1.2 !important;
        font-weight: 600 !important;        
  }
  .post-hero__deck { font-size: 16px; }

  .single-grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 28px;
    align-items: start;
  }
  .single-aside{ margin-top: 0; position: sticky; top: 16px; margin-top: 12px; }
}

@media (min-width: 1024px) {
  .single-main {
    max-width: 760px;
  }
}




/* Altura estilo InLive (desktop) */
@media (min-width: 1024px){
  .post-hero__img{
    height: 750px;
    min-height: 750px;
    max-height: 750px;
  }
}

/* prepara a “camada” para mover sem cortar feio */
.post-hero__media{ overflow: hidden; }
.post-hero__img{
  will-change: transform;
  transform: translate3d(0,0,0);
}




.post-hero__media{
  position: relative;
  overflow: hidden;
}

.post-hero__imgwrap{
  will-change: transform;
  transform: translate3d(0,0,0);
}

.post-hero__img{
  width: 100%;
  height: 750px;
  display: block;
  object-fit: cover;
  transform: scale(1.06);
  transform-origin: center;
}

@media (max-width: 1023px){
  .post-hero__img{ height: 87vh; min-height: 320px; transform: none; }
}





/* =========================
   HERO — Preset InLive
========================= */

/* posição do bloco no final do hero */
.post-hero__inner{
  position: absolute;
  inset: 0;
  display: grid;
  align-items: end;
  padding-bottom: 64px;
}

@media (min-width: 1024px){
  .post-hero__inner{ padding-bottom: 72px; }
}

/* container do texto */
.post-hero__content{
  text-align: center;
  max-width: 980px;
  margin: 0 auto;
  padding: 0 16px;
  color: #fff;
}

/* Kicker (categoria) */
.post-hero__kicker{
  display: inline-block;
  margin: 0 0 16px;
  padding: 6px 12px;

  border: 1px solid rgba(255,255,255,.30);
  background: rgba(0,0,0,0);
  color: #fff;

  font-family: inherit; /* ou var(--font-sans) */
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .10em;
  text-transform: uppercase;
  border-radius: 2px;
}

/* Título (Fira Sans-like) */
.post-hero__title{
  margin: 0 0 14px;

  font-family: inherit;   /* se você tiver Fira Sans no site, troque aqui */
  font-size: 40px;
  line-height: 1.2;
  font-weight: 600;
  color: #fff;
}

/* Subtítulo / linha fina (Merriweather-like) */
.post-hero__deck{
  margin: 0 0 14px;

  font-family: inherit;   /* se você tiver Merriweather, troque aqui */
  font-size: 16px;
  line-height: 1.3;
  font-weight: 400;
  color: rgba(255,255,255,.80);
}

/* Meta (autor/data) */
.post-hero__meta{
  display: inline-flex;
  gap: 10px;
  align-items: center;

  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: rgba(255,255,255,.85);
}

.post-hero__dot{ opacity: .65; }

/* Mobile: reduz sem mudar o “estilo” */
@media (max-width: 640px){
  .post-hero__inner{ padding-bottom: 28px; }
  .post-hero__title{ font-size: 28px; }
  .post-hero__deck{ 
    font-family: Merriweather;
    font-size: 16px;
    line-height: 1.3;
    font-style: normal;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
  }
}




.post-hero {
  position: relative;
  height: 750px;
}

.post-hero__inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end; /* joga o texto pra baixo */
  justify-content: center;
  padding-bottom: 110px; /* distância do rodapé (InLive-like) */
  text-align: center;
  z-index: 3;
}

.post-hero__cat {
  display: inline-block;
  margin-bottom: 16px;
  padding: 4px 10px;
  border: 1px solid rgba(255,255,255,.35);
  font-family: 'Fira Sans', sans-serif;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
}


.post-hero h1 {
  font-family: 'Fira Sans', sans-serif;
  font-size: 44px;
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  max-width: 900px;
  margin: 0 auto 16px;
}


@media (max-width: 768px) {
  .post-hero h1 {
    font-size: 26px;
  }
}


.post-hero__excerpt {
  font-family: 'Merriweather', serif;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(255,255,255,.85);
  max-width: 720px;
  margin: 0 auto 18px;
}


.post-hero__meta {
    color: #ffffff;
    font-family: Fira Sans !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 300 !important;
    -webkit-font-smoothing: antialiased;
}


.post-hero__credit {
  margin-top: 6px;
  font-size: 13px;
  font-style: italic;
  color: rgba(255,255,255,.7);
}


.single .tdb_single_content p {
  font-family: 'Merriweather', serif;
  font-size: 16px;
  line-height: 1.8;
  color: #222;
}


.single .tdb_single_content a {
  font-family: 'Merriweather', serif;
  color: #d4a13a; /* dourado InLive */
  text-decoration: none;
  font-weight: 400;
}

.single .tdb_single_content a:hover {
  text-decoration: underline;
}


.post-hero__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,.35) 0%,
    rgba(0,0,0,.55) 60%,
    rgba(0,0,0,.75) 100%
  );
  z-index: 2;
}



/* =========================
   Next/Prev (InLive-like)
========================= */

.post-nav{
  margin: 34px 0 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}

.post-nav__item{
  background: #f9f9f9;
  padding: 20px;
  text-decoration: none;
  display: block;
  min-height: 120px;
}

.post-nav__kicker{
  display: block;
  font-family: var(--font-ui, system-ui, -apple-system, Arial, sans-serif);
  font-size: 14px;
  color: #777;
  margin-bottom: 10px;
}

.post-nav__title{
  display: inline; /* importante pra underline ficar “só no texto” */
  font-family: "Merriweather", serif;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
  color: #111;

  /* underline discreto (InLive) */
  background-image: linear-gradient(#c28a00, #c28a00);
  background-size: 0% 2px;
  background-repeat: no-repeat;
  background-position: 0 100%;
  padding-bottom: 4px;
  transition: background-size .2s ease, color .2s ease;
}

.post-nav__item:hover .post-nav__title{
  background-size: 100% 2px; /* anima underline */
  color: #111;
}

/* se faltar prev/next, não quebra layout */
.post-nav__item--empty{
  background: transparent;
}

/* Mobile */
@media (max-width: 768px){
  .post-nav{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .post-nav__title{
    font-size: 22px;
  }
}



.post-hero__meta {
  margin-top: 10px;
  text-align: center;
  color: #fff;
}

/* Linha autor + data */
.post-hero__byline {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.02em;
  opacity: 0.95;
}

/* Crédito da foto */
.post-hero__photo-credit {
  margin-top: 4px;
  font-size: 12px;
  font-style: italic;
  opacity: 0.8;
  color: #ffffff;
  font-family: Fira Sans !important;
  line-height: 1;
  font-weight: 300;
}


@media (max-width: 768px) {
  .post-hero__inner {
    padding-bottom: 72px; /* antes estava muito baixo */
  }

  .post-hero__meta {
    margin-top: 6px;
  }
}


/* Meta do hero: empilhar no mobile */
@media (max-width: 768px){
  .post-hero__meta{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
  }

  .post-hero__byline,
  .post-hero__photo-credit{
    width: 100%;
  }

  .post-hero__photo-credit{
    margin-top: 0;
  }
}