/* ===== BLOG ===== */
.tf-narrow{max-width:880px;}
.tf-crumbs{display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:var(--steel); margin-bottom:18px;}
.tf-crumbs a{color:var(--tf-primary); text-decoration:none;}
.tf-crumbs a:hover{text-decoration:underline;}
.tf-crumbs .separator{margin:0 6px;}
.tf-cat{display:inline-block; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--tf-primary); background:#DCEBF8; padding:4px 10px; border-radius:20px; text-decoration:none;}

/* single */
.tf-post-hero{padding:56px 0 28px; background:linear-gradient(180deg,var(--tf-light-blue),transparent);}
.tf-post-title{font-size:clamp(30px,4.2vw,46px); line-height:1.15; margin:14px 0 18px; color:var(--ink);}
.tf-post-meta{display:flex; flex-wrap:wrap; gap:8px 22px; font-size:14px; color:var(--steel);}
.tf-post-meta span{display:inline-flex; align-items:center; gap:8px;}
.tf-post-meta img{border-radius:50%;}
.tf-post-thumb{margin-top:8px;}
.tf-post-thumb img{width:100%; height:auto; border-radius:12px; display:block; box-shadow:0 12px 32px rgba(17,33,46,.10);}
.tf-post-layout{display:block; max-width:880px; padding-top:36px; padding-bottom:20px;}
.tf-post-layout.has-toc{display:grid; grid-template-columns:230px minmax(0,1fr); gap:48px; max-width:1140px;}
.tf-toc{position:sticky; top:96px; align-self:start; font-size:13.5px; border-left:2px solid var(--line); padding-left:16px;}
.tf-toc-title{font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--steel); margin-bottom:10px;}
.tf-toc ol{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.tf-toc a{color:var(--text-soft); text-decoration:none; line-height:1.4; display:block;}
.tf-toc a:hover,.tf-toc a.on{color:var(--tf-primary); font-weight:600;}

/* prose */
.tf-prose{font-size:17px; line-height:1.8; color:#2A3A47; min-width:0;}
.tf-prose > *{margin-top:0; margin-bottom:22px;}
.tf-prose h2{font-size:28px; line-height:1.25; margin:44px 0 14px; color:var(--ink); scroll-margin-top:96px;}
.tf-prose h3{font-size:21px; line-height:1.3; margin:32px 0 10px; color:var(--ink); scroll-margin-top:96px;}
.tf-prose h4{font-size:18px; margin:24px 0 8px;}
.tf-prose a{color:var(--tf-primary); text-underline-offset:3px;}
.tf-prose ul,.tf-prose ol{padding-left:24px;}
.tf-prose li{margin-bottom:8px;}
.tf-prose li::marker{color:var(--tf-primary); font-weight:700;}
.tf-prose img{max-width:100%; height:auto; border-radius:10px;}
.tf-prose figcaption{font-size:13px; color:var(--steel); text-align:center; margin-top:8px;}
.tf-prose blockquote{margin:28px 0; padding:16px 22px; border-left:4px solid var(--tf-primary); background:var(--tf-soft-blue); font-size:18px; color:var(--ink);}
.tf-prose code{background:var(--tf-light-blue); padding:2px 6px; border-radius:4px; font-size:.9em;}
.tf-prose pre{background:#11212E; color:#E6EFF6; padding:18px; border-radius:8px; overflow-x:auto; font-size:14px;}
.tf-prose pre code{background:none; padding:0;}
.tf-prose .wp-block-table{overflow-x:auto; margin-left:0; margin-right:0;}
.tf-prose table{width:100%; border-collapse:collapse; font-size:15px;}
.tf-prose th{background:var(--tf-primary); color:#fff; text-align:left; padding:12px 14px; font-weight:600;}
.tf-prose td{padding:12px 14px; border-bottom:1px solid var(--line);}
.tf-prose tr:nth-child(even) td{background:var(--tf-soft-blue);}
.tf-prose hr{border:none; border-top:1px solid var(--line); margin:40px 0;}

/* pattern boxes */
.tf-box-label{font-family:'Space Grotesk',system-ui,sans-serif; font-size:12px !important; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin:0 0 6px !important;}
.tf-quick-answer{background:#DCEBF8; border-left:4px solid var(--tf-primary); padding:18px 22px !important; border-radius:0 8px 8px 0;}
.tf-quick-answer .tf-box-label{color:var(--tf-primary);}
.tf-quick-answer p:last-child{margin:0; font-size:17.5px; color:var(--ink);}
.tf-takeaways{background:#F1F8F3; border:1px solid #CFE8D7; padding:18px 22px !important; border-radius:8px;}
.tf-takeaways .tf-box-label{color:#2F7D50;}
.tf-takeaways ul{margin:0; padding-left:20px;}
.tf-takeaways li::marker{color:#2F9E5F;}
.tf-inline-cta{background:var(--ink); color:#fff; padding:24px 26px !important; border-radius:10px;}
.tf-inline-cta h3{color:#fff; margin:0 0 6px !important;}
.tf-inline-cta p{color:#CFE3F3; margin:0 0 14px !important;}
.tf-inline-cta .wp-block-button__link{background:var(--tf-primary); color:#fff; border-radius:4px; padding:12px 20px; font-weight:600; text-decoration:none;}
.tf-editor-note{display:none;}

/* Rank Math FAQ block */
.tf-prose .rank-math-faq-item{border:1px solid var(--line); border-radius:8px; padding:16px 20px; margin-bottom:12px; background:var(--white);}
.tf-prose .rank-math-question{font-size:18px; margin:0 0 6px !important;}
.tf-prose .rank-math-answer p{margin:0;}

/* end of post */
.tf-post-cta{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; margin:36px 0 24px; padding:28px; background:linear-gradient(135deg,var(--tf-primary),#2E8BD6); border-radius:12px; color:#fff;}
.tf-post-cta h2{color:#fff; font-size:22px; margin:0 0 6px;}
.tf-post-cta p{margin:0; color:#DCEBF8; max-width:520px;}
.tf-post-cta .btn-primary{background:#fff; color:var(--tf-primary); box-shadow:none;}
.tf-author{display:flex; gap:18px; align-items:flex-start; padding:22px; border:1px solid var(--line); border-radius:12px; background:var(--white); margin-bottom:56px;}
.tf-author img{border-radius:50%; flex-shrink:0;}
.tf-author-label{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--steel);}
.tf-author-name{font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700; font-size:18px; color:var(--ink);}
.tf-author p{margin:6px 0 0; font-size:14.5px; color:var(--text-soft);}

/* cards / listing */
.tf-related{padding:56px 0 72px; background:var(--tf-soft-blue);}
.tf-related h2{font-size:26px; margin-bottom:24px;}
.tf-post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.tf-card{display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); border-radius:12px; overflow:hidden; transition:transform .25s ease, box-shadow .25s ease;}
.tf-card:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(17,33,46,.10);}
.tf-card-img{display:block; aspect-ratio:1200/630; background:linear-gradient(135deg,var(--tf-primary),#2E8BD6); overflow:hidden;}
.tf-card-img img{width:100%; height:100%; object-fit:cover; display:block;}
.tf-card-ph{display:flex; height:100%; align-items:center; justify-content:center; color:#fff; font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700; font-size:24px; opacity:.85;}
.tf-card-body{padding:18px 20px 20px; display:flex; flex-direction:column; gap:10px; flex:1;}
.tf-card-body .tf-cat{align-self:flex-start;}
.tf-card h3{font-size:19px; line-height:1.35; margin:0;}
.tf-card h3 a{color:var(--ink); text-decoration:none;}
.tf-card h3 a:hover{color:var(--tf-primary);}
.tf-card p{margin:0; font-size:14.5px; color:var(--text-soft); flex:1;}
.tf-card-meta{font-size:12.5px; color:var(--steel);}
.tf-blog-hero{padding:56px 0 24px; background:linear-gradient(180deg,var(--tf-light-blue),transparent);}
.tf-blog-hero h1{font-size:clamp(30px,4vw,44px); margin:0 0 12px;}
.tf-blog-desc{max-width:680px; color:var(--text-soft); font-size:17px;}
.tf-cat-filter{display:flex; flex-wrap:wrap; gap:8px; margin-top:24px;}
.tf-cat-filter a{padding:8px 16px; border:1px solid var(--line); border-radius:30px; background:var(--white); color:var(--ink); font-size:14px; font-weight:500; text-decoration:none;}
.tf-cat-filter a:hover,.tf-cat-filter a.on{background:var(--tf-primary); border-color:var(--tf-primary); color:#fff;}
.tf-blog-list{padding:24px 0 80px;}
.tf-pagination{margin-top:40px;}
.tf-pagination .nav-links{display:flex; flex-wrap:wrap; gap:8px; justify-content:center;}
.tf-pagination .page-numbers{padding:8px 14px; border:1px solid var(--line); border-radius:6px; background:var(--white); color:var(--ink); text-decoration:none;}
.tf-pagination .page-numbers.current,.tf-pagination a.page-numbers:hover{background:var(--tf-primary); border-color:var(--tf-primary); color:#fff;}
.tf-pagination .screen-reader-text{position:absolute; left:-9999px;}

@media(max-width:1000px){
  .tf-post-layout.has-toc{grid-template-columns:1fr; gap:0;}
  .tf-toc{position:static; border-left:none; padding:16px 18px; background:var(--tf-soft-blue); border-radius:8px; margin-bottom:28px;}
  .tf-post-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
  .tf-post-grid{grid-template-columns:1fr;}
  .tf-prose{font-size:16.5px;}
  .tf-prose h2{font-size:24px;}
  .tf-post-cta{padding:22px;}
}
