/* Blog Odete Bozzetto · modo leitura (tokens e fontes vêm de /styles.css) */
.blog{background:var(--linen)}
.blog main{padding-top:72px}
.blog .topbar{color:var(--ink)}
.topnav{display:flex;align-items:center;gap:20px}
.topbar-link{font-size:13px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;border-bottom:0}
.topbar-link[aria-current="page"]{text-decoration:underline;text-underline-offset:4px}
.blog .wa-float{transform:none}
.leafy{border-radius:38% 0 38% 0/30% 0 30% 0;overflow:hidden;background:var(--paper)}
.leafy img{width:100%;height:100%;object-fit:cover;display:block}
.is-empty.leafy{background:radial-gradient(120% 90% at 30% 20%,#e9d6bf 0%,#c49a52 55%,#96502f 100%)}

/* ---------- índice ---------- */
.blog-hero{position:relative;padding:clamp(48px,9vh,110px) var(--gut) clamp(28px,5vh,56px);max-width:1240px;margin:0 auto}
.blog-hero h1{font-size:clamp(2.6rem,7vw,5.5rem);max-width:14ch;margin-bottom:18px}
.blog-hero-lead{font-size:clamp(1.15rem,2vw,1.4rem);color:var(--ink-soft);max-width:44ch}
.blog-branch{position:absolute;right:var(--gut);top:12px;width:clamp(90px,16vw,200px);height:auto;color:var(--sage);opacity:.45;pointer-events:none}
.blog-branch path{stroke-dasharray:1200;stroke-dashoffset:1200;animation:draw 2.6s ease-out .2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.featured{max-width:1240px;margin:0 auto;padding:0 var(--gut) clamp(40px,7vh,80px)}
.featured-link{display:grid;gap:28px;text-decoration:none;color:inherit;align-items:center}
.featured-cover{aspect-ratio:16/10}
.featured-body h2{font-size:clamp(2rem,4.4vw,3.6rem);margin-bottom:16px;max-width:18ch}
.featured-desc{font-size:clamp(1.1rem,1.6vw,1.3rem);color:var(--ink-soft);max-width:44ch;margin-bottom:12px}
.read-more{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-weight:500;color:var(--terracotta);text-decoration:underline;text-underline-offset:5px}
.featured-link:hover h2{color:var(--terracotta)}
@media (min-width:900px){.featured-link{grid-template-columns:7fr 5fr;gap:clamp(36px,5vw,80px)}}
.filters{max-width:1240px;margin:0 auto;padding:0 var(--gut) 28px;display:flex;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding-top:28px}
.chip{font:inherit;font-size:.95rem;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.chip:hover{border-color:var(--terracotta)}
.chip.is-on{background:var(--terracotta);border-color:var(--terracotta);color:#fff}
.chip:focus-visible{outline:2px solid var(--terracotta);outline-offset:3px}
.cards{list-style:none;display:grid;gap:clamp(28px,4vw,48px)}
.cards-grid{max-width:1240px;margin:0 auto;padding:0 var(--gut) clamp(56px,9vh,110px)}
@media (min-width:640px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.cards{grid-template-columns:repeat(3,1fr)}}
.card a{display:block;text-decoration:none;color:inherit}
.card-cover{aspect-ratio:4/3;margin-bottom:18px}
.card-cover img{transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.card a:hover .card-cover img{transform:scale(1.05)}
.card h3,.home-blog-cards h3{font-family:var(--serif);font-weight:300;font-size:clamp(1.45rem,2.2vw,1.8rem);line-height:1.15;margin-bottom:10px}
.card a:hover h3{color:var(--terracotta)}
.card-desc{color:var(--ink-soft);font-size:1rem;margin-bottom:8px}
.card.is-hidden{display:none}
.post-meta{font-size:.85rem;color:var(--ink-soft);letter-spacing:.02em}
.blog-index-cta{max-width:1240px;margin:0 auto;padding:0 var(--gut) clamp(56px,9vh,110px)}
.blog-empty{max-width:1240px;margin:0 auto;padding:0 var(--gut) 60px;color:var(--ink-soft)}

/* ---------- artigo ---------- */
.post-head{max-width:68ch;margin:0 auto;padding:clamp(40px,8vh,96px) var(--gut) 28px;box-sizing:content-box}
.post-head .kicker a{color:inherit;text-decoration:none;display:inline-flex;min-height:44px;align-items:center}
.post-head h1{font-size:clamp(2.3rem,6vw,4.4rem);line-height:1.06;margin-bottom:20px}
.post-lead{font-family:var(--serif);font-weight:300;font-style:italic;font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:1.3;color:var(--ink-soft);margin-bottom:18px}
.post-cover-wrap{max-width:1100px;margin:0 auto clamp(36px,6vh,64px);padding:0 var(--gut);overflow:hidden}
.post-cover{aspect-ratio:16/9}
.post-cover img{transform:scale(1.08);will-change:transform}
.post-body{max-width:68ch;margin:0 auto;padding:0 var(--gut) clamp(56px,9vh,110px);box-sizing:content-box;font-size:1.1875rem;line-height:1.72}
@media (min-width:1024px){.post-body{font-size:1.25rem}}
.post-body>p,.post-body li{color:#3a302b}
.post-body p+p{margin-top:1.05em}
.post-body h2{font-size:clamp(1.75rem,3.4vw,2.5rem);margin:2.1em 0 .6em;line-height:1.12}
.post-body h3{font-size:clamp(1.35rem,2.4vw,1.75rem);margin:1.7em 0 .5em}
.post-body h4{font-family:var(--sans);font-weight:500;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:var(--terracotta);margin:1.6em 0 .4em}
.post-body ul,.post-body ol{margin:1em 0 1em 1.25em}
.post-body ul{list-style:none}
.post-body ul>li{position:relative}
.post-body ul>li::before{content:"";position:absolute;left:-1.05em;top:.62em;width:.5em;height:.32em;background:var(--sage);border-radius:0 100% 0 100%}
.post-body ol{list-style:decimal}
.post-body li+li{margin-top:.45em}
.post-body a{color:var(--terracotta);text-underline-offset:3px}
.post-body strong{font-weight:500;color:var(--ink)}
.post-body hr{border:0;height:1px;background:var(--line);margin:2.4em 0}
.post-body blockquote{border-left:2px solid var(--honey);padding:4px 0 4px 22px;margin:1.6em 0;font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.25em;line-height:1.4;color:var(--ink)}
.summary{background:var(--paper);border:1px solid var(--line);border-radius:28px 0 28px 0;padding:24px 26px;margin:0 0 2em;font-size:.95em}
.summary-label{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--terracotta);margin-bottom:10px}
.summary ul{margin-bottom:0}
.odete-quote{margin:2.2em 0;padding:clamp(28px,4vw,44px);background:var(--plum);color:var(--linen);border-radius:48px 0 48px 0}
.odete-quote blockquote{border:0;padding:0;margin:0;color:var(--linen);font-size:clamp(1.45rem,2.6vw,2rem);line-height:1.3}
.odete-quote blockquote p{color:var(--linen)}
.odete-quote figcaption{margin-top:16px;font-size:.9rem;color:var(--honey);letter-spacing:.04em}
.odete-quote figcaption a{color:var(--honey)}
.sources{margin-top:3em;padding-top:1.4em;border-top:1px solid var(--line);font-size:.92rem}
.sources h2{font-size:1.4rem;margin:0 0 .8em}
.sources li,.sources p{color:var(--ink-soft)}
.sources a{word-break:break-word}
.health-note{margin-top:2.4em;padding:16px 18px;border-left:3px solid var(--sage);background:rgba(90,105,80,.08);font-size:.92rem;color:var(--ink-soft)}
.post-cta{margin-top:2.6em;background:var(--plum);color:var(--linen);padding:clamp(28px,4vw,44px);border-radius:48px 0 48px 0}
.post-cta-title{font-family:var(--serif);font-weight:300;font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.15;margin-bottom:12px;color:var(--linen)}
.post-cta-text{color:rgba(245,238,227,.85);margin-bottom:22px;font-size:1rem}
.related{max-width:1240px;margin:0 auto;padding:clamp(48px,8vh,96px) var(--gut);border-top:1px solid var(--line)}
.related-title{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:32px}
.foot-grid-blog{grid-template-columns:1fr}

/* motion */
[data-fade]{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
[data-fade].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  [data-fade]{opacity:1;transform:none;transition:none}
  .blog-branch path{animation:none;stroke-dashoffset:0}
  .post-cover img{transform:none}
}
@media (max-width:560px){.topbar-cta{display:none}.topnav{gap:0}}
/* tabela comparativa */
.table-wrap{margin:1.8em 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.post-body table{width:100%;border-collapse:collapse;font-size:.92em;min-width:480px}
.post-body th,.post-body td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
.post-body thead th{font-family:var(--sans);font-weight:500;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--terracotta);border-bottom:2px solid var(--terracotta)}
.post-body tbody th{font-weight:500;color:var(--ink)}
.odete-quote figcaption strong{color:var(--linen);font-weight:500}
.odete-quote figcaption,.odete-quote figcaption a{color:var(--honey)}
/* tabelas no mobile: cada linha vira um card */
@media (max-width:699px){
  .table-wrap{overflow:visible}
  .post-body table{min-width:0;font-size:.95em}
  .post-body thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .post-body table,.post-body tbody,.post-body tr,.post-body tbody th,.post-body td{display:block;width:100%}
  .post-body tbody tr{background:var(--paper);border:1px solid var(--line);border-radius:20px 0 20px 0;padding:14px 16px;margin-bottom:12px}
  .post-body tbody th{border:0;padding:0 0 8px;font-family:var(--serif);font-weight:400;font-size:1.15em;color:var(--terracotta)}
  .post-body td{border:0;padding:6px 0;border-top:1px solid var(--line)}
  .post-body td[data-label]:not([data-label=""])::before{content:attr(data-label) ": ";font-weight:500;color:var(--ink)}
}
