/* ============================================================
   TagguiRH — blog.css  (listagem /blog, categorias e posts)
   Depende dos tokens e componentes de base.css.
   ============================================================ */

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ============ HERO DA LISTAGEM ============ */
.blog-hero{padding:64px 0 8px;text-align:center;}
.blog-hero .wrap{position:relative;z-index:1;}
.blog-hero-in{max-width:760px;margin:0 auto;}
.blog-hero h1{font-size:clamp(2.4rem,5.2vw,4.1rem);margin:0 auto;}
.blog-hero .lead{margin:20px auto 0;}

.blog-search{display:flex;align-items:center;gap:6px;max-width:520px;margin:32px auto 0;background:var(--white);
  border:1px solid var(--line);border-radius:100px;padding:6px 6px 6px 22px;box-shadow:var(--shadow);transition:border-color .18s,box-shadow .18s;}
.blog-search:focus-within{border-color:var(--orange);box-shadow:0 0 0 4px rgba(247,107,21,.12),var(--shadow);}
.blog-search input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:15.5px;color:var(--ink);padding:10px 0;outline:none;}
.blog-search input::placeholder{color:var(--ink-3);}
.blog-search input::-webkit-search-cancel-button{cursor:pointer;}
.blog-search button{flex:none;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;background:var(--orange);color:#fff;
  display:grid;place-items:center;transition:background .18s;}
.blog-search button:hover{background:var(--orange-deep);}
.blog-search button svg{width:19px;height:19px;}

.blog-cats{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:30px auto 0;max-width:900px;}
.blog-cats a{font-family:var(--sans);font-weight:700;font-size:13px;color:var(--ink-2);background:var(--white);
  border:1px solid var(--line);border-radius:100px;padding:8px 15px;transition:color .15s,border-color .15s,background .15s;}
.blog-cats a:hover{color:var(--ink);border-color:var(--ink-3);}
.blog-cats a[aria-current="page"]{background:var(--ink);border-color:var(--ink);color:#fff;}

/* ============ LISTAGEM ============ */
.blog-list{padding:48px 0 96px;}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.post-card--featured+.post-grid{margin-top:22px;}
.post-card[hidden]{display:none;}

.post-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s;}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--peach);}
.pc-link{display:flex;flex-direction:column;height:100%;}
.pc-media{aspect-ratio:40/21;overflow:hidden;background:var(--porcelain-2);border-bottom:1px solid var(--line);}
.pc-img{width:100%;height:100%;object-fit:cover;object-position:left center;transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.post-card:hover .pc-img{transform:scale(1.03);}
.pc-body{display:flex;flex-direction:column;flex:1;padding:22px 24px 24px;}
.pc-cat{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);}
.pc-title{font-size:1.14rem;line-height:1.25;letter-spacing:-.02em;margin-top:10px;}
.pc-desc{margin-top:10px;font-size:14.5px;line-height:1.55;color:var(--ink-2);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.pc-meta{margin-top:auto;padding-top:18px;font-size:12.5px;color:var(--ink-3);}

.post-card--featured .pc-link{display:grid;grid-template-columns:1.15fr 1fr;}
.post-card--featured .pc-media{aspect-ratio:auto;min-height:100%;border-bottom:0;border-right:1px solid var(--line);}
.post-card--featured .pc-body{padding:44px 44px 40px;justify-content:center;}
.post-card--featured .pc-title{font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.1;letter-spacing:-.03em;margin-top:14px;}
.post-card--featured .pc-desc{font-size:16px;margin-top:16px;-webkit-line-clamp:4;}
.post-card--featured .pc-meta{margin-top:0;padding-top:24px;}

.blog-empty{text-align:center;color:var(--ink-2);padding:48px 0 16px;}
.blog-more{display:flex;justify-content:center;margin-top:40px;}
.blog-more[hidden]{display:none;}

/* ============ POST: HERO ============ */
.post-hero{position:relative;overflow:hidden;padding:52px 0 0;text-align:center;}
.post-hero .phero-glow{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(55% 70% at 85% 0%,rgba(255,183,101,.26),transparent 60%),radial-gradient(40% 50% at 5% 100%,rgba(247,107,21,.07),transparent 60%);}
.post-hero-in{position:relative;z-index:1;max-width:860px;}
.post-hero .crumbs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;font-family:var(--sans);font-weight:600;font-size:13px;color:var(--ink-3);}
.post-hero .crumbs a{color:var(--ink-2);}
.post-hero .crumbs a:last-child{color:var(--orange-deep);}
.post-hero .crumbs a:hover{color:var(--orange-deep);}
.post-hero h1{font-size:clamp(2rem,4.3vw,3.3rem);line-height:1.08;margin:20px auto 0;max-width:24ch;text-wrap:balance;}
.post-hero .lead{margin:20px auto 0;max-width:58ch;font-size:1.14rem;text-wrap:pretty;}
.post-byline{display:inline-flex;align-items:center;gap:12px;margin-top:28px;text-align:left;}
.post-byline img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--white);box-shadow:var(--shadow);}
.post-byline b{display:block;font-family:var(--sans);font-weight:800;font-size:14.5px;letter-spacing:-.01em;}
.post-byline span{display:block;font-size:13px;color:var(--ink-2);}

.post-cover{max-width:1080px;margin:40px auto 0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);
  aspect-ratio:40/21;background:var(--porcelain-2);}
.post-cover img{width:100%;height:100%;object-fit:cover;}

/* ============ POST: LAYOUT ============ */
.post-layout{display:grid;grid-template-columns:minmax(0,700px) 260px;justify-content:space-between;gap:56px;
  max-width:1080px;margin:56px auto 0;align-items:start;}
.post-main{min-width:0;}

.post-toc{position:sticky;top:96px;max-height:calc(100vh - 120px);overflow-y:auto;padding-bottom:8px;}
.toc-title{font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;}
.post-toc ol{list-style:none;padding:0;margin:0;border-left:1px solid var(--line);}
.post-toc li a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;font-size:13.5px;line-height:1.4;color:var(--ink-2);transition:color .15s,border-color .15s;}
.post-toc li a:hover{color:var(--ink);}
.post-toc li a.on{color:var(--orange-deep);border-left-color:var(--orange);font-weight:600;}
.toc-cta{display:block;margin-top:24px;padding:18px;border-radius:14px;background:var(--peach-soft);border:1px solid var(--peach);transition:background .15s;}
.toc-cta:hover{background:var(--peach);}
.toc-cta b{display:block;font-family:var(--sans);font-weight:800;font-size:14px;letter-spacing:-.01em;}
.toc-cta span{display:block;margin-top:4px;font-size:13px;color:var(--orange-deep);font-weight:600;}

.toc-inline{display:none;background:var(--white);border:1px solid var(--line);border-radius:14px;margin-bottom:32px;}
.toc-inline summary{cursor:pointer;list-style:none;padding:16px 20px;font-family:var(--sans);font-weight:800;font-size:15px;display:flex;justify-content:space-between;align-items:center;}
.toc-inline summary::-webkit-details-marker{display:none;}
.toc-inline summary::after{content:"+";font-size:20px;color:var(--orange-deep);transition:transform .2s;}
.toc-inline[open] summary::after{transform:rotate(45deg);}
.toc-inline ol{margin:0;padding:0 20px 18px 40px;}
.toc-inline li{padding:5px 0;font-size:14.5px;}
.toc-inline li::marker{color:var(--orange);font-family:var(--sans);font-weight:700;}
.toc-inline a{color:var(--ink-2);}

/* ============ POST: CORPO ============ */
.prose{font-size:17.5px;line-height:1.75;color:#3a2e25;}
.prose>*:first-child{margin-top:0;}
.prose p{margin:0 0 1.2em;}
.prose h2{font-size:clamp(1.45rem,2.4vw,1.8rem);line-height:1.18;letter-spacing:-.025em;margin:2.1em 0 .7em;color:var(--ink);scroll-margin-top:96px;text-wrap:balance;}
.prose h3{font-size:1.24rem;line-height:1.3;letter-spacing:-.02em;margin:1.8em 0 .55em;color:var(--ink);scroll-margin-top:96px;}
.prose h4{font-size:1.05rem;line-height:1.35;letter-spacing:-.01em;margin:1.6em 0 .5em;color:var(--ink);}
.prose strong{color:var(--ink);font-weight:600;}
.prose a{color:var(--orange-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .15s;}
.prose a:hover{color:var(--ink);}
.prose ul,.prose ol{margin:0 0 1.3em;padding-left:1.35em;}
.prose li{margin:.45em 0;padding-left:.2em;}
.prose li::marker{color:var(--orange);}
.prose ol>li::marker{font-family:var(--sans);font-weight:700;}
.prose li>ul,.prose li>ol{margin:.4em 0 .2em;}
.prose blockquote{margin:1.9em 0;padding:20px 26px;border-left:3px solid var(--orange);background:var(--peach-soft);border-radius:0 14px 14px 0;
  font-family:var(--serif);font-style:italic;font-size:1.42rem;line-height:1.42;color:var(--ink);letter-spacing:-.01em;}
.prose blockquote p{margin:0;}
/* telas do produto: largura natural até a coluna, sem passar de 560px de altura */
.prose img{width:auto;height:auto;max-width:100%;max-height:560px;margin:2em auto;border-radius:var(--radius);border:1px solid var(--line);background:var(--white);box-shadow:var(--shadow);}
.prose p>img{margin:.4em 0;}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.5em 0;}
.prose table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:15px;}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;}

/* ============ POST: FAQ / SHARE / AUTOR ============ */
.post-faq{margin-top:56px;}
.post-faq h2{font-size:clamp(1.45rem,2.4vw,1.8rem);letter-spacing:-.025em;scroll-margin-top:96px;}
.post-faq .faq{margin:16px 0 0;max-width:none;}
.post-faq .faq-a p{font-size:16px;}
.post-faq .faq-a p+p{margin-top:-10px;}
.post-faq .faq-a a{color:var(--orange-deep);text-decoration:underline;text-underline-offset:3px;}

.post-share{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:48px;padding-top:28px;border-top:1px solid var(--line);}
.post-share>span{font-family:var(--sans);font-weight:800;font-size:14px;margin-right:6px;}
.post-share a,.post-share button{height:40px;min-width:40px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--white);border:1px solid var(--line);color:var(--ink-2);cursor:pointer;font:inherit;transition:color .15s,border-color .15s,background .15s;}
.post-share a:hover,.post-share button:hover{color:var(--orange-deep);border-color:var(--orange);background:var(--peach-soft);}
.post-share svg{width:17px;height:17px;fill:currentColor;}
.post-share .copy-link{padding:0 14px;font-family:var(--sans);font-weight:700;font-size:13px;}
.post-share .copy-link svg{fill:none;}

.post-author{display:flex;gap:22px;align-items:flex-start;margin-top:40px;padding:28px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius);}
.post-author img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex:none;}
.pa-label{font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);}
.post-author h2{font-size:1.25rem;letter-spacing:-.02em;margin-top:4px;display:flex;align-items:center;gap:8px;}
.post-author h2 a{color:var(--ink-3);display:inline-flex;transition:color .15s;}
.post-author h2 a:hover{color:#0a66c2;}
.post-author h2 svg{width:17px;height:17px;}
.pa-role{font-size:13.5px;color:var(--orange-deep);font-weight:600;margin-top:2px;}
.post-author p:last-child{margin-top:10px;font-size:14.5px;line-height:1.6;color:var(--ink-2);}

/* ============ POST: CTA MÓDULO / RELACIONADOS ============ */
.post-module{padding:88px 0 0;}
.post-module .ctaband-card{background:linear-gradient(135deg,var(--peach-soft),var(--porcelain-2));}
.post-module h3{margin-top:14px;}
.pm-actions{display:flex;gap:12px;flex-wrap:wrap;}

.post-related{padding:80px 0 96px;}
.pr-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:28px;}
.pr-head h2{font-size:clamp(1.7rem,3vw,2.3rem);}
.pr-head a{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--orange-deep);}
.pr-head a:hover{color:var(--ink);}

/* ============ RESPONSIVO ============ */
@media(max-width:1080px){
  .post-layout{grid-template-columns:minmax(0,1fr);max-width:720px;}
  .post-toc{display:none;}
  .toc-inline{display:block;}
}
@media(max-width:960px){
  .post-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .post-card--featured .pc-link{grid-template-columns:1fr;}
  .post-card--featured .pc-media{aspect-ratio:40/21;border-right:0;border-bottom:1px solid var(--line);}
  .post-card--featured .pc-body{padding:28px;}
}
@media(max-width:560px){
  .blog-hero{padding-top:44px;}
  .post-grid{grid-template-columns:minmax(0,1fr);}
  .post-hero{padding-top:36px;}
  .post-cover{margin-top:28px;border-radius:var(--radius);}
  .post-layout{margin-top:36px;}
  .prose{font-size:16.5px;}
  .prose blockquote{font-size:1.2rem;padding:16px 18px;}
  .post-author{flex-direction:column;gap:14px;padding:22px;}
  .post-module{padding-top:64px;}
  .post-related{padding:64px 0 72px;}
}