/* ProfitLogic — shared design system (ui-ux-pro-max: Social-Proof-Focused B2B, light) */
:root{
  --primary:#0F172A; --on-primary:#FFFFFF; --secondary:#334155; --accent:#0369A1;
  --accent-hover:#075985; --bg:#F8FAFC; --fg:#020617; --muted:#E8ECF1; --border:#E2E8F0;
  --surface:#FFFFFF; --sub:#475569;
  --maxw:1080px; --r:14px;
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:32px; --sp-6:48px; --sp-8:64px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
     background:var(--bg);color:var(--fg);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--sp-3)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;
         letter-spacing:.04em;text-transform:uppercase;color:var(--accent);
         background:#E0F2FE;border:1px solid #BAE6FD;padding:6px 12px;border-radius:999px}
h1{font-size:clamp(32px,5.2vw,52px);line-height:1.1;font-weight:800;letter-spacing:-.02em;
   color:var(--primary);margin:var(--sp-3) 0 var(--sp-2);max-width:20ch}
h2{font-size:clamp(24px,3.4vw,34px);font-weight:700;letter-spacing:-.01em;color:var(--primary);line-height:1.2}
.lede{font-size:clamp(17px,2.1vw,21px);color:var(--sub);max-width:56ch}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#fff;
     font-weight:700;font-size:17px;padding:15px 28px;border-radius:12px;cursor:pointer;
     transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
     box-shadow:0 6px 20px rgba(3,105,161,.25)}
.cta:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 10px 28px rgba(3,105,161,.32)}
.cta:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.cta svg{width:18px;height:18px}
.ghost{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--accent);padding:14px 8px;cursor:pointer;transition:gap .2s ease}
.ghost:hover{gap:12px}
.micro{font-size:14px;color:#64748B;margin-top:14px}
header{padding:clamp(48px,9vw,96px) 0 var(--sp-8);text-align:center;
       background:radial-gradient(120% 80% at 50% 0%,#EFF6FF 0%,var(--bg) 60%)}
.hero-cta{display:flex;gap:14px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:var(--sp-4)}
section{padding:var(--sp-8) 0}
.section-head{text-align:center;max-width:60ch;margin:0 auto var(--sp-6)}
.section-head .lede{margin:var(--sp-2) auto 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-3)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
      padding:var(--sp-3);box-shadow:0 1px 2px rgba(2,6,23,.04)}
.card h3{font-size:18px;font-weight:700;color:var(--primary);margin:6px 0}
.card p{color:var(--sub);font-size:15px}
.stat{font-size:40px;font-weight:800;color:var(--accent);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.final{text-align:center;background:linear-gradient(180deg,#fff 0%,#EFF6FF 100%);
       border:1px solid var(--border);border-radius:20px;padding:var(--sp-8) var(--sp-3);max-width:820px;margin:0 auto}
footer{text-align:center;color:#64748B;font-size:14px;padding:var(--sp-6) 0;border-top:1px solid var(--border)}
footer a{color:var(--accent);font-weight:600}
@media (max-width:560px){ section{padding:var(--sp-6) 0} }
@media (prefers-reduced-motion:reduce){ *{transition:none!important;animation:none!important;scroll-behavior:auto!important} }