/* ============================================================
 * BLOG POST — estilos compartilhados entre todos os posts
 * ============================================================ */

.post-hero{
  padding:140px 48px 60px;
  background:var(--navy);
  position:relative;
  overflow:hidden;
}
.post-hero::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(240,235,232,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(240,235,232,.03) 1px,transparent 1px);
  background-size:80px 80px;pointer-events:none;
}
.post-hero-inner{position:relative;z-index:2;max-width:820px;margin:0 auto}
.post-breadcrumb{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(240,235,232,.5);
  margin-bottom:32px;
  flex-wrap:wrap;
}
.post-breadcrumb a{color:rgba(240,235,232,.7);text-decoration:none;transition:color .2s}
.post-breadcrumb a:hover{color:var(--lime)}
.post-breadcrumb-sep{color:rgba(240,235,232,.3)}
.post-category{
  display:inline-block;
  font-size:11px;
  letter-spacing:.25em;
  text-transform:uppercase;
  color:var(--orange);
  font-weight:600;
  margin-bottom:20px;
  padding:6px 14px;
  border:1px solid rgba(255,69,0,.3);
}
.post-title{
  font-size:clamp(32px,4.5vw,56px);
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.025em;
  color:var(--offwhite);
  margin-bottom:32px;
}
.post-meta{
  display:flex;
  gap:24px;
  align-items:center;
  font-size:13px;
  color:rgba(240,235,232,.6);
  flex-wrap:wrap;
}
.post-meta strong{color:var(--offwhite);font-weight:600}
.post-meta-sep{color:rgba(240,235,232,.3)}

/* CONTEÚDO */
.post-content-section{padding:80px 48px;background:var(--offwhite)}
.post-content{
  max-width:760px;
  margin:0 auto;
  font-family:var(--font);
  color:var(--navy);
  font-size:17px;
  line-height:1.75;
}
.post-content > p:first-of-type::first-letter{
  font-family:'Instrument Serif', Georgia, serif;
  font-size:72px;
  float:left;
  line-height:.85;
  margin:6px 12px 0 0;
  color:var(--orange);
  font-weight:400;
}
.post-content p{margin-bottom:24px;color:rgba(0,22,57,.85)}
.post-content h2{
  font-size:clamp(26px,3vw,36px);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.15;
  color:var(--navy);
  margin:64px 0 24px;
  padding-top:12px;
  position:relative;
}
.post-content h2::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:40px;
  height:3px;
  background:var(--orange);
}
.post-content h3{
  font-size:clamp(20px,2.3vw,24px);
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--navy);
  margin:40px 0 16px;
}
.post-content strong{color:var(--navy);font-weight:700}
.post-content em{font-style:italic;color:var(--orange)}
.post-content a{
  color:var(--orange);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:rgba(255,69,0,.4);
  transition:text-decoration-color .2s;
}
.post-content a:hover{text-decoration-color:var(--orange)}
.post-content ul, .post-content ol{
  margin:0 0 24px;
  padding-left:0;
  list-style:none;
}
.post-content ul li{
  position:relative;
  padding-left:32px;
  margin-bottom:12px;
  color:rgba(0,22,57,.85);
}
.post-content ul li::before{
  content:'→';
  position:absolute;
  left:0;
  color:var(--orange);
  font-weight:700;
}
.post-content ol{counter-reset:list-counter}
.post-content ol li{
  position:relative;
  padding-left:48px;
  margin-bottom:14px;
  color:rgba(0,22,57,.85);
  counter-increment:list-counter;
}
.post-content ol li::before{
  content:counter(list-counter) ".";
  position:absolute;
  left:0;
  color:var(--orange);
  font-weight:800;
  font-size:18px;
}
.post-content blockquote{
  margin:32px 0;
  padding:24px 32px;
  border-left:4px solid var(--orange);
  background:rgba(255,69,0,.04);
  font-size:18px;
  line-height:1.55;
  font-style:italic;
  color:rgba(0,22,57,.9);
}

/* Callout (TL;DR, dica) */
.callout{
  padding:24px 28px;
  background:var(--navy);
  color:var(--offwhite);
  margin:32px 0;
  border-left:4px solid var(--lime);
}
.callout-label{
  font-size:11px;
  letter-spacing:.25em;
  text-transform:uppercase;
  color:var(--lime);
  font-weight:600;
  margin-bottom:8px;
}
.callout p{color:rgba(240,235,232,.92);margin:0;font-size:15px}
.callout p + p{margin-top:12px}
.callout strong{color:var(--offwhite)}

/* Tabela */
.post-table{
  margin:32px 0;
  width:100%;
  border-collapse:collapse;
  font-size:15px;
}
.post-table th{
  background:var(--navy);
  color:var(--offwhite);
  text-align:left;
  padding:14px 16px;
  font-weight:600;
  font-size:13px;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.post-table td{
  padding:14px 16px;
  border-bottom:1px solid rgba(0,22,57,.1);
  color:rgba(0,22,57,.85);
}
.post-table tr:hover td{background:rgba(255,69,0,.04)}

/* Inline CTA */
.inline-cta-post{
  margin:48px 0;
  padding:36px 40px;
  background:var(--navy);
  color:var(--offwhite);
  display:flex;
  gap:24px;
  align-items:center;
  flex-wrap:wrap;
  border-left:4px solid var(--orange);
}
.inline-cta-post-text{flex:1;min-width:240px}
.inline-cta-post-label{
  font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--lime);
  font-weight:600;margin-bottom:8px;
}
.inline-cta-post-title{
  font-size:22px;font-weight:700;line-height:1.2;margin-bottom:6px;color:var(--offwhite);
}
.inline-cta-post-sub{font-size:14px;color:rgba(240,235,232,.7);line-height:1.45}
.inline-cta-post .btn-primary{flex-shrink:0;background:var(--orange);color:var(--white)}

/* Related posts */
.post-related{padding:80px 48px;background:var(--navy);color:var(--offwhite)}
.post-related-inner{max-width:1100px;margin:0 auto}
.post-related-eyebrow{
  font-weight:500;font-size:11px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--orange);margin-bottom:12px;
}
.post-related-title{
  font-size:clamp(28px,3.5vw,40px);
  font-weight:800;
  letter-spacing:-.02em;
  margin-bottom:48px;
  color:var(--offwhite);
}
.post-related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:24px;
}
.post-related-card{
  padding:32px 28px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(240,235,232,.1);
  text-decoration:none;
  color:inherit;
  transition:border-color .35s, background .35s, transform .35s;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.post-related-card:hover{
  border-color:var(--orange);
  background:rgba(255,69,0,.06);
  transform:translateY(-3px);
}
.post-related-cat{
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--orange);
  font-weight:600;
}
.post-related-card-title{
  font-size:18px;
  font-weight:700;
  line-height:1.25;
  color:var(--offwhite);
}

@media (max-width:768px){
  .post-hero{padding:100px 24px 48px}
  .post-content-section{padding:48px 20px}
  .post-content{font-size:16px;line-height:1.7}
  .post-content > p:first-of-type::first-letter{font-size:56px}
  .inline-cta-post{padding:24px;gap:18px}
  .post-related{padding:60px 24px}
}