:root { --pf-brand:#2563eb; --pf-ink:#1d4ed8; --pf-soft:#eaf1ff; --pf-line:#e4e8ee; --pf-muted:#5a6473; }

/* Tool-page article styling (mini-guide + FAQ live in page content) */
.pf-steps { counter-reset:s; list-style:none; padding:0; display:grid; gap:12px; margin:1em 0; }
.pf-steps li { position:relative; padding-left:42px; }
.pf-steps li::before { counter-increment:s; content:counter(s); position:absolute; left:0; top:-2px; width:28px; height:28px; background:var(--pf-soft); color:var(--pf-ink); border-radius:50%; display:grid; place-items:center; font-weight:600; font-size:14px; }

.pf-faq details { border:1px solid var(--pf-line); border-radius:10px; padding:2px 16px; margin-bottom:10px; background:#fff; }
.pf-faq summary { cursor:pointer; font-weight:600; padding:13px 0; list-style:none; }
.pf-faq summary::-webkit-details-marker { display:none; }
.pf-faq summary::after { content:"+"; float:right; color:var(--pf-muted); font-weight:400; }
.pf-faq details[open] summary::after { content:"–"; }
.pf-faq p { margin:0 0 14px; color:var(--pf-muted); }

.pf-chips { display:flex; flex-wrap:wrap; gap:10px; margin:1em 0; }
.pf-chips a { display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--pf-line); border-radius:999px; padding:8px 14px; font-size:14px; font-weight:500; color:#111722; text-decoration:none; }
.pf-chips a:hover { border-color:var(--pf-brand); color:var(--pf-ink); }

/* Homepage tool grid */
.pf-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; margin:1.5em 0; }
.pf-card { position:relative; display:flex; flex-direction:column; gap:8px; background:#fff; border:1px solid var(--pf-line); border-radius:14px; padding:18px; text-decoration:none; color:#111722; transition:transform .12s, box-shadow .12s, border-color .12s; }
.pf-card.pf-soon { opacity:.72; }
.pf-badge { position:absolute; top:12px; right:12px; font-size:12px; color:var(--pf-muted); background:#eef1f5; padding:3px 9px; border-radius:999px; }
.pf-card:hover { transform:translateY(-2px); box-shadow:0 6px 24px rgba(16,24,40,.1); border-color:#d4dbe6; }
.pf-card .pf-card-ic { width:44px; height:44px; border-radius:11px; background:var(--pf-soft); color:var(--pf-ink); display:grid; place-items:center; }
.pf-card h3 { font-size:16px; margin:0; }
.pf-card p { font-size:13.5px; color:var(--pf-muted); margin:0; line-height:1.5; }

/* Hero */
.pf-hero { text-align:center; padding:8px 0 4px; }
.pf-hero .pf-sub { color:var(--pf-muted); font-size:18px; max-width:640px; margin:0 auto; }
.pf-usps { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:16px; }
.pf-usps span { background:#fff; border:1px solid var(--pf-line); border-radius:999px; padding:7px 14px; font-size:14px; font-weight:500; }

/* Homepage sections (why / how / faq) */
.pf-section { padding:2.6rem 0 0.4rem; }
.pf-section > h2 { text-align:center; font-size:24px; margin-bottom:6px; }
.pf-section-sub { text-align:center; color:var(--pf-muted); margin:0 auto 1.6rem; max-width:560px; }
.pf-features { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.pf-feature { background:#fff; border:1px solid var(--pf-line); border-radius:14px; padding:22px; }
.pf-feature-ic { display:grid; place-items:center; width:44px; height:44px; border-radius:11px; background:var(--pf-soft); color:var(--pf-ink); margin-bottom:12px; }
.pf-feature h3 { font-size:17px; margin:0 0 4px; }
.pf-feature p { font-size:14px; color:var(--pf-muted); margin:0; line-height:1.6; }
.pf-how { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.pf-how-step { text-align:center; padding:10px; }
.pf-how-num { display:inline-grid; place-items:center; width:40px; height:40px; border-radius:50%; background:var(--pf-brand); color:#fff; font-weight:600; font-size:18px; margin-bottom:10px; }
.pf-how-step h3 { font-size:17px; margin:0 0 4px; }
.pf-how-step p { font-size:14px; color:var(--pf-muted); margin:0; line-height:1.6; }

/* ---- Polish ---- */
@keyframes pf-fadeup { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
.pf-hero { animation:pf-fadeup .5s ease both; }
.pf-grid { animation:pf-fadeup .55s ease .06s both; }
.pf-section { animation:pf-fadeup .55s ease both; }
@media (prefers-reduced-motion: reduce) { .pf-hero, .pf-grid, .pf-section { animation:none; } }
.site-header { transition:box-shadow .2s ease; }
.site-header.pf-scrolled { box-shadow:0 2px 16px rgba(16,24,40,.08); }
.home .entry-title { text-align:center; font-size:40px; margin:6px 0 0; letter-spacing:-.02em; }
@media (max-width:560px) { .home .entry-title { font-size:27px; } }
.pf-usps span::before { content:"\2713"; color:#16a34a; font-weight:700; margin-right:6px; }
.pf-card-ic { transition:transform .18s ease; }
.pf-card:hover .pf-card-ic { transform:scale(1.08) rotate(-3deg); }
.pf-footer { text-align:center; line-height:1.7; }
.pf-foot-brand { font-weight:600; color:var(--pf-ink); }
.pf-foot-links { display:flex; flex-wrap:wrap; gap:6px 16px; justify-content:center; margin-top:10px; }
.pf-foot-links a { color:var(--pf-muted); font-size:14px; }
.pf-foot-links a:hover { color:var(--pf-ink); }
.pf-foot-copy { margin-top:10px; font-size:13px; color:var(--pf-muted); }
