/* Blog — artigo */
.post-hero { padding: clamp(40px, 5vw, 64px) 0 clamp(40px, 5vw, 64px); }
  .post-hero h1 { font-size: clamp(40px, 5.5vw, 76px); max-width: 22ch; }
  .post-cover { aspect-ratio: 16/8; border-radius: var(--r-lg); margin-bottom: 64px; }

  .post-grid {
    display: grid;
    grid-template-columns: 200px 1fr 240px;
    gap: 64px;
    max-width: 1200px;
    margin: 0 auto;
  }
  @media (max-width: 1080px) { .post-grid { grid-template-columns: 1fr; gap: 48px; } .post-side, .post-toc { display: none; } }

  .post-toc { position: sticky; top: 100px; align-self: start; }
  .post-toc h5 { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; color: var(--gold); text-transform: uppercase; margin-bottom: 16px; }
  .post-toc a { display: block; padding: 8px 0; font-size: 13px; color: var(--muted-on-dark); border-left: 1px solid var(--ink-3); padding-left: 14px; transition: all .2s; }
  .post-toc a:hover { color: var(--gold); border-color: var(--gold); }

  .post-side { position: sticky; top: 100px; align-self: start; display: flex; flex-direction: column; gap: 16px; }
  .post-side .label { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; color: var(--gold); text-transform: uppercase; }
  .post-side .val { font-size: 14px; color: var(--cream); }
  .share-row { display: flex; gap: 8px; margin-top: 8px; }
  .share-row a { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 12px; color: var(--muted-on-dark); transition: all .2s; }
  .share-row a:hover { color: var(--gold); border-color: var(--gold); }

  .post-body { font-size: 18px; line-height: 1.75; color: var(--cream); }
  .post-body p { margin-bottom: 24px; max-width: 64ch; opacity: 0.92; }
  .post-body h2 { font-size: clamp(28px, 3vw, 40px); margin: 56px 0 24px; max-width: 22ch; }
  .post-body h3 { font-size: 24px; margin: 40px 0 16px; }
  .post-body blockquote { margin: 40px 0; padding: 32px 40px; border-left: 3px solid var(--gold); background: var(--ink-2); border-radius: 0 var(--r-md) var(--r-md) 0; font-family: var(--font-display); font-size: 26px; line-height: 1.35; color: var(--gold-hi); font-style: italic; }
  .post-body ul { margin: 0 0 24px 24px; max-width: 60ch; }
  .post-body li { margin-bottom: 12px; }
  .post-body strong { color: var(--gold-hi); font-weight: 600; }
  .post-body a { color: var(--gold); text-decoration: underline; text-decoration-color: var(--line-strong); }
  .key-takeaway {
    margin: 40px 0; padding: 32px;
    background: linear-gradient(135deg, rgba(201,163,92,0.1), rgba(201,163,92,0.02));
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
  }
  .key-takeaway .label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.16em; color: var(--gold); text-transform: uppercase; margin-bottom: 12px; }
  .key-takeaway p { font-family: var(--font-display); font-size: 22px; line-height: 1.4; color: var(--cream); margin: 0; max-width: none; opacity: 1; }

  .author-bio {
    margin-top: 80px; padding: 40px;
    border: 1px solid var(--ink-3); border-radius: var(--r-md);
    background: var(--ink-2);
    display: grid; grid-template-columns: 100px 1fr; gap: 28px;
    align-items: start;
  }
  .author-bio .ph { aspect-ratio: 1; border-radius: 50%; width: 100px; height: 100px; }
  .author-bio h4 { font-family: var(--font-display); font-size: 24px; color: var(--cream); margin-bottom: 8px; }
  .author-bio .role { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--gold); text-transform: uppercase; margin-bottom: 16px; }
  .author-bio p { font-size: 14px; color: var(--muted-on-dark); line-height: 1.6; }

  .related-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
    margin-top: 48px;
  }
  .related-grid .post-card { display: flex; flex-direction: column; gap: 14px; }
  .related-grid .post-card .ph { aspect-ratio: 4/3; border-radius: var(--r-md); }
  .related-grid .post-card .meta { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--gold); text-transform: uppercase; }
  .related-grid .post-card h3 { font-size: 20px; line-height: 1.2; }
  .related-grid .post-card:hover h3 { color: var(--gold-hi); }
  @media (max-width: 920px) { .related-grid { grid-template-columns: 1fr; } }