


.breadcrumbs{ margin-bottom:1.6rem; font-size:var(--fs-13); }
.breadcrumbs ol{ display:flex; flex-wrap:wrap; align-items:center; gap:.15rem .35rem; }
.breadcrumbs li{ display:flex; align-items:center; gap:.35rem; color:var(--on-dark-faint); }
.breadcrumbs li + li::before{ content:'/'; color:var(--dark-line); }
.breadcrumbs a{ color:var(--on-dark-dim); padding-block:.5rem; display:inline-block; }
.breadcrumbs a:hover{ color:var(--on-dark-strong); }
.breadcrumbs [aria-current]{ color:var(--on-dark); }


.article-hero{ padding-block:clamp(2.5rem,5vw,4rem) clamp(2.75rem,5vw,4rem); }
.article-hero .hero-inner{ max-width:800px; }

.article-hero h1{ margin-top:.2rem; overflow-wrap:break-word; }
.article-meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.55rem .9rem;
  margin-top:1.4rem; font-size:var(--fs-14); color:var(--on-dark-dim);
}
.article-meta .dot{ width:4px; height:4px; border-radius:50%; background:var(--accent); }
.article-meta time{ color:var(--on-dark); }
.article-lede{
  margin-top:1.5rem; max-width:62ch;
  font-size:var(--fs-18); line-height:1.6; color:var(--on-dark);
}


.article-body{ padding-block:clamp(2.75rem,5vw,4.25rem) clamp(3rem,6vw,4.75rem); }

.longread{ max-width:620px; margin-inline:auto; }


.article-toc{
  margin-bottom:2.6rem; padding:1.15rem 1.4rem 1.25rem;
  background:var(--plate-grad); border:1px solid var(--line-strong);
  border-left:3px solid var(--accent); border-radius:var(--radius);
  box-shadow:var(--shadow-card);
}
.article-toc .toc-head{
  font-size:var(--fs-11); font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.7rem;
}
.article-toc ol{ margin:0; padding:0; list-style:none; counter-reset:toc;
  display:flex; flex-direction:column; gap:.1rem; }
.article-toc li{ counter-increment:toc; }
.article-toc a{
  position:relative; display:block; padding:.4rem 0 .4rem 1.9rem;
  font-size:var(--fs-15); color:var(--ink-700);
}
.article-toc a::before{
  content:counter(toc,decimal-leading-zero); position:absolute; left:0; top:.4rem;
  font-family:var(--ff-display); font-weight:800; font-size:var(--fs-12); color:var(--accent-deep);
}
.article-toc a:hover{ color:var(--ink); }


.prose{ color:var(--ink-700); }
.prose > * + *{ margin-top:1.2rem; }
.prose h2{
  margin-top:2.6rem; font-size:var(--fs-h2); line-height:var(--lh-head);
  scroll-margin-top:calc(var(--header-h) + 16px);
}
.prose h2 + p, .prose h2 + h3{ margin-top:1rem; }
.prose h3{
  margin-top:1.9rem; font-family:var(--ff-display); font-weight:800; text-transform:uppercase;
  font-size:var(--fs-16); letter-spacing:.01em; color:var(--ink);
  scroll-margin-top:calc(var(--header-h) + 16px);
}
.prose h3 + p{ margin-top:.75rem; }
.prose p{ font-size:var(--fs-17); line-height:1.75; }
.prose strong, .prose b{ color:var(--ink); font-weight:700; }
.prose a{
  color:var(--ink); font-weight:600; border-bottom:2px solid var(--accent);
  padding-bottom:1px; transition:background-color var(--dur-1) var(--ease);
}
.prose a:hover{ background:var(--accent); color:var(--ink); }

.prose ul, .prose ol{ padding-left:0; display:flex; flex-direction:column; gap:.7rem; }
.prose ul li, .prose ol li{ position:relative; font-size:var(--fs-17); line-height:1.7; }

.prose ul li{ padding-left:1.6rem; }
.prose ul li::before{
  content:''; position:absolute; left:.15rem; top:.62em; width:8px; height:8px;
  background:var(--accent);
}
.prose ol{ counter-reset:li; }
.prose ol li{ padding-left:2.3rem; counter-increment:li; }
.prose ol li::before{
  content:counter(li); position:absolute; left:0; top:.05em;
  width:1.6rem; height:1.6rem; display:grid; place-items:center;
  font-family:var(--ff-display); font-weight:800; font-size:var(--fs-13); color:var(--ink);
  background:var(--accent); border-radius:var(--radius);
}
.prose li strong, .prose li b{ color:var(--ink); }


.prose blockquote{
  margin-top:1.6rem; padding:1.05rem 1.3rem; border-left:3px solid var(--accent);
  background:var(--plate-grad); border-radius:var(--radius);
  box-shadow:var(--shadow-card);
}
.prose blockquote p{ font-size:var(--fs-16); color:var(--ink-700); margin:0; }


.table-wrap{ margin-top:1.6rem; overflow-x:auto; border-radius:var(--radius); }
.prose table{
  width:100%; border-collapse:collapse; min-width:440px;
  background:var(--plate-grad); border:1px solid var(--line-strong);
  font-size:var(--fs-15);
}
.prose thead th{
  text-align:left; padding:.85rem 1.1rem; vertical-align:bottom;
  font-family:var(--ff-display); font-weight:800; font-size:var(--fs-12);
  letter-spacing:.04em; text-transform:uppercase; color:var(--ink);
  border-bottom:2px solid var(--line-strong);
}
.prose tbody td{ padding:.8rem 1.1rem; color:var(--ink-700); border-bottom:1px solid var(--line); vertical-align:top; }
.prose tbody tr:last-child td{ border-bottom:none; }
.prose tbody td:first-child{ font-weight:600; color:var(--ink); }
.prose .pending{ color:var(--faint); } 


.endcta{
  margin-top:2.6rem; padding:1.5rem 1.6rem;
  background:var(--plate-grad); border:1px solid var(--line-strong);
  border-radius:var(--radius); box-shadow:var(--shadow-card);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 1.4rem;
}
.endcta p{ font-size:var(--fs-16); color:var(--ink-700); max-width:44ch; margin:0; }
.endcta p strong{ color:var(--ink); }



.article-signature{
  max-width:700px; margin:2.75rem auto 0; padding-top:1.75rem;
  border-top:1px solid var(--line-strong);
  display:flex; gap:1.15rem; align-items:flex-start;
}


.faq-section{ padding-block:clamp(2.5rem,4.5vw,3.75rem); }
.faq-wrap{ max-width:840px; margin-inline:auto; }
.faq-wrap > h2{ margin-bottom:clamp(1.25rem,2.5vw,1.75rem); }


.link-section{ padding-block:clamp(2.75rem,5vw,4rem); }

.svc-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.2rem; }
.svc-card{ padding:1.5rem 1.4rem 1.35rem; display:flex; flex-direction:column; gap:.7rem; }
.svc-card .icon-wrap{
  width:44px; height:44px; display:grid; place-items:center; flex-shrink:0;
  border:1px solid var(--line-strong); border-radius:var(--radius);
  color:var(--ink); background:var(--paper);
}
.svc-card h3{ font-size:var(--fs-16); }
.svc-card p{ font-size:var(--fs-15); color:var(--muted); }
.svc-card .more{
  margin-top:auto; padding-top:.4rem; font-size:var(--fs-14); font-weight:600; color:var(--ink);
  display:inline-flex; align-items:center; gap:.4rem;
}
.svc-card .more::after{ content:'→'; transition:transform var(--dur-1) var(--ease); }
.svc-card:hover .more::after{ transform:translateX(4px); }



.posts-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.4rem; }
.post-card{ display:flex; flex-direction:column; padding:1.6rem 1.55rem 1.5rem; height:100%; }
.post-card .post-meta{
  display:flex; align-items:center; gap:.5rem; margin-bottom:.9rem;
  font-size:var(--fs-11); font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
}
.post-card .post-meta::before{ content:''; width:20px; height:3px; background:var(--accent); flex-shrink:0; }
.post-card h3{ font-size:var(--fs-18); line-height:1.28; color:var(--ink); }
.post-card p{ margin-top:.7rem; font-size:var(--fs-15); color:var(--muted); line-height:1.6; }
.post-card .more{
  margin-top:auto; padding-top:1rem; font-size:var(--fs-14); font-weight:700; color:var(--ink);
  display:inline-flex; align-items:center; gap:.4rem;
}
.post-card .more::after{ content:'→'; transition:transform var(--dur-1) var(--ease); }
.post-card:hover .more::after{ transform:translateX(4px); }


.prod-more a{
  font-size:var(--fs-15); font-weight:700; color:var(--ink);
  border-bottom:2px solid var(--accent); padding-bottom:.15rem;
  position:relative; display:inline-block;
}
.prod-more a::before{ content:''; position:absolute; left:-6px; right:-6px; top:-12px; bottom:-12px; }


.hub-hero .article-lede{ max-width:58ch; }


@media (max-width:600px){
  
  .article-lede{ font-size:var(--fs-17); }
  .endcta{ flex-direction:column; align-items:flex-start; }
  .endcta .btn{ width:100%; }
  .article-toc a{ font-size:var(--fs-16); }
}
