.pf-article-wrap { width: 100%; margin: 0; padding: 0; }
.pf-article-inner { width: 100%; overflow: hidden; color: #475569; background: #fff; }

.pf-hero {
  padding: 1.35rem 1rem;
  border: 1px solid #dbeafe;
  border-radius: 16px;
  background:
    radial-gradient(circle at 90% 5%, rgba(6, 182, 212, .12), transparent 14rem),
    linear-gradient(135deg, #eff6ff, #f8fdff);
  text-align: center;
}
.pf-hero-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  margin-bottom: .65rem;
  padding: .3rem .7rem;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: #1d4ed8;
  background: rgba(255,255,255,.8);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pf-hero-title { margin: 0 0 .5rem; color: #10213a; font-size: clamp(1.35rem, 6vw, 2rem); line-height: 1.22; letter-spacing: -.03em; }
.pf-hero-sub { max-width: 680px; margin: 0 auto .85rem; color: #64748b; font-size: .92rem; }
.pf-hero-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.pf-seo-tag { padding: .32rem .65rem; border: 1px solid #e2e8f0; border-radius: 999px; color: #475569; background: #fff; font-size: .7rem; font-weight: 700; }

.pf-block { padding: 1.15rem 0; border-bottom: 1px solid #e2e8f0; }
.pf-block:last-of-type { border-bottom: 0; }
.pf-block-head { display: flex; align-items: center; gap: .55rem; margin-bottom: .75rem; }
.pf-block-head.pf-center { justify-content: center; }
.pf-block-head span { font-size: 1.15rem; }
.pf-block-head h2 { margin: 0; color: #10213a; font-size: 1.08rem; line-height: 1.35; }
.pf-prose p { margin: 0 0 .85rem; color: #475569; font-size: .92rem; line-height: 1.75; }
.pf-prose p:last-child { margin-bottom: 0; }
.pf-prose h3 { margin: 1rem 0 .5rem; color: #10213a; font-size: 1rem; line-height: 1.35; }
.pf-prose strong, .pf-prose .pf-kw, .pf-callout strong, .pf-summary strong, .pf-when-card strong { color: #10213a; font-weight: 800; }
.pf-inline-code, .pf-prose code { padding: .14em .4em; border: 1px solid #dbeafe; border-radius: 6px; color: #1d4ed8; background: #eff6ff; font: .86em ui-monospace, "Cascadia Code", monospace; }
.pf-center { text-align: center; }
.pf-center p { max-width: 680px; margin-left: auto; margin-right: auto; }
.pf-columns { column-count: 1; }

.pf-when-grid { display: grid; grid-template-columns: 1fr; gap: .65rem; }
.pf-when-card {
  display: flex;
  gap: .7rem;
  min-width: 0;
  padding: .85rem;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
}
.pf-num { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: linear-gradient(135deg, #2563eb, #06b6d4); font-size: .76rem; font-weight: 800; }
.pf-when-card p { margin: 0; color: #64748b; font-size: .84rem; line-height: 1.55; }

.pf-faq-list { display: flex; flex-direction: column; gap: .55rem; }
.pf-faq-narrow { max-width: 720px; margin: 0 auto; }
.pf-faq { overflow: hidden; border: 1px solid #e2e8f0; border-radius: 14px; background: #fff; }
.pf-faq summary {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .75rem .85rem;
  color: #10213a;
  font-size: .86rem;
  font-weight: 750;
  list-style: none;
  cursor: pointer;
}
.pf-faq summary::-webkit-details-marker { display: none; }
.pf-faq-chevron { width: 18px; height: 18px; flex: 0 0 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E") center/contain no-repeat; transition: transform .2s; }
.pf-faq[open] { border-color: #bfdbfe; box-shadow: 0 6px 18px rgba(37, 99, 235, .06); }
.pf-faq[open] summary { color: #1d4ed8; background: #eff6ff; }
.pf-faq[open] .pf-faq-chevron { transform: rotate(180deg); }
.pf-faq-body { padding: 0 .85rem .85rem; }
.pf-faq-body p { margin: 0; color: #64748b; font-size: .85rem; line-height: 1.65; }

.pf-related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.pf-related-card { min-width: 0; display: flex; align-items: center; gap: .45rem; padding: .75rem; overflow-wrap: anywhere; border: 1px solid #e2e8f0; border-radius: 12px; color: #334155; background: #f8fafc; font-size: .8rem; font-weight: 700; }
.pf-related-card:hover { color: #1d4ed8; border-color: #93c5fd; background: #eff6ff; }

.pf-summary {
  margin-top: .25rem;
  padding: 1.1rem;
  border: 1px solid #bae6fd;
  border-radius: 16px;
  background: linear-gradient(135deg, #eff6ff, #ecfeff);
  text-align: center;
}
.pf-summary p { max-width: 680px; margin: 0 auto .65rem; color: #475569; font-size: .9rem; line-height: 1.7; }
.pf-summary p:last-child { margin-bottom: 0; }
.pf-callout { max-width: 720px; margin: 0 auto; padding: 1rem; border: 1px solid #bfdbfe; border-left: 4px solid #2563eb; border-radius: 0 14px 14px 0; background: #f8fbff; }
.pf-callout p { margin: 0 0 .65rem; color: #475569; font-size: .9rem; line-height: 1.7; }
.pf-callout p:last-child { margin-bottom: 0; }
.pf-empty-article { padding: 1.5rem .5rem; text-align: center; color: #64748b; }
.pf-empty-article p { margin: .35rem 0; }

/* CMS images — premium cards (homepage + tool articles) */
.ts-shared-article-inner figure,
.pf-article-inner figure,
.ts-shared-article-inner .art-img-card,
.pf-article-inner .art-img-card { margin: 1.15rem 0; }
.ts-shared-article-inner .art-img-center,
.pf-article-inner .art-img-center { margin-left: auto; margin-right: auto; text-align: center; max-width: 100%; }
.ts-shared-article-inner .art-img-left,
.pf-article-inner .art-img-left { margin-right: auto; text-align: left; max-width: 88%; }
.ts-shared-article-inner .art-img-right,
.pf-article-inner .art-img-right { margin-left: auto; text-align: right; max-width: 88%; }
.ts-shared-article-inner .art-img-card,
.pf-article-inner .art-img-card {
  display: inline-block;
  max-width: 100%;
  padding: .55rem;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(15, 35, 65, .08);
}
.ts-shared-article-inner .art-img-card img,
.pf-article-inner .art-img-card img,
.ts-shared-article-inner figure img,
.pf-article-inner figure img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.ts-shared-article-inner .art-img-full,
.pf-article-inner .art-img-full { width: 100%; }
.ts-shared-article-inner .art-img-hero img,
.pf-article-inner .art-img-hero img { border-radius: 16px; }
.ts-shared-article-inner figcaption,
.pf-article-inner figcaption {
  margin-top: .45rem;
  color: #64748b;
  font-size: .78rem;
  line-height: 1.45;
  text-align: center;
}
.ts-shared-article-inner figcaption:empty,
.pf-article-inner figcaption:empty { display: none; }
.ts-shared-article-inner .art-img-grid-2,
.pf-article-inner .art-img-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.ts-shared-article-inner .art-img-grid-3,
.pf-article-inner .art-img-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; }
.ts-shared-article-inner .art-img-split,
.pf-article-inner .art-img-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: linear-gradient(180deg, #f8fafc, #fff);
}
@media (min-width: 720px) {
  .ts-shared-article-inner .art-img-split,
  .pf-article-inner .art-img-split { grid-template-columns: 1fr 1fr; align-items: center; }
}

@media (min-width: 640px) {
  .pf-hero { padding: 1.75rem 1.5rem; }
  .pf-block { padding: 1.4rem 0; }
  .pf-when-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-related-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
}
@media (min-width: 760px) {
  .pf-columns { column-count: 2; column-gap: 1.75rem; }
  .pf-columns p { break-inside: avoid; }
}
