/* ============================================================
   Tool Intro Section — Shared CSS
   Used by all tool pages for the pre-tool explanatory section
   ============================================================ */

.fz-intro{background:#fff;border-bottom:1px solid var(--color-border)}

/* Problem statement */
.fz-problem{max-width:860px;margin:0 auto;padding:56px 24px 0;text-align:center}
.fz-problem-tag{display:inline-block;background:#fef2f2;color:#b91c1c;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;border-radius:4px;margin-bottom:18px}
.fz-problem h2{font-family:var(--font-heading);font-size:clamp(1.4rem,3.5vw,2.1rem);font-weight:700;color:var(--color-text);line-height:1.25;margin-bottom:16px}
.fz-problem p{font-size:1rem;color:var(--color-text-muted);line-height:1.75;max-width:640px;margin:0 auto}

/* Insight cards */
.fz-insights{max-width:960px;margin:0 auto;padding:40px 24px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:700px){.fz-insights{grid-template-columns:1fr}}
.fz-ic{border:1px solid var(--color-border);border-radius:14px;padding:28px 24px;background:#fafafa;position:relative;overflow:hidden}
.fz-ic::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--color-highlight)}
.fz-ic-num{font-family:var(--font-heading);font-size:2.6rem;font-weight:700;color:var(--color-accent);line-height:1;margin-bottom:10px}
.fz-ic-title{font-size:.92rem;font-weight:700;color:var(--color-text);margin-bottom:10px}
.fz-ic-body{font-size:.82rem;color:var(--color-text-muted);line-height:1.65}

/* How it works */
.fz-how{max-width:960px;margin:0 auto;padding:44px 24px 0}
.fz-how-label{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:20px;text-align:center}
.fz-how-steps{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.fz-how-step{flex:1;min-width:200px;max-width:260px;background:var(--color-bg-navy);border-radius:12px;padding:22px 20px;text-align:center}
.fz-how-step-num{font-family:var(--font-heading);font-size:1.6rem;font-weight:700;color:var(--color-highlight);margin-bottom:10px}
.fz-how-step-title{font-size:.88rem;font-weight:700;color:#fff;margin-bottom:6px}
.fz-how-step-sub{font-size:.76rem;color:rgba(255,255,255,.6);line-height:1.55}
.fz-how-arrow{font-size:1.4rem;color:var(--color-border);flex-shrink:0}
@media(max-width:640px){.fz-how-arrow{display:none}.fz-how-step{min-width:100%}}

/* Differentiators */
.fz-diff{max-width:960px;margin:0 auto;padding:36px 24px 0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:600px){.fz-diff{grid-template-columns:1fr}}
.fz-diff-item{display:flex;gap:14px;align-items:flex-start;padding:16px;background:#f0f4ff;border-radius:10px;border:1px solid #c7d2fe}
.fz-diff-icon{font-size:1.3rem;flex-shrink:0;margin-top:1px}
.fz-diff-text h4{font-size:.85rem;font-weight:700;color:var(--color-accent);margin-bottom:4px}
.fz-diff-text p{font-size:.78rem;color:var(--color-text-muted);line-height:1.55}

/* CTA start button */
.fz-start{max-width:860px;margin:0 auto;padding:44px 24px 52px;text-align:center}
.fz-start-btn{display:inline-block;background:var(--color-cta-primary);color:#fff;border:none;padding:16px 40px;border-radius:10px;font-family:var(--font-body);font-size:1rem;font-weight:700;cursor:pointer;transition:background .2s;letter-spacing:.02em}
.fz-start-btn:hover{background:var(--color-cta-primary-hov, #1d4ed8)}
.fz-start-meta{margin-top:14px;font-size:.78rem;color:var(--color-text-muted)}
.fz-start-meta span{margin:0 6px}