:root{
  --red:#e62028;
  --red-dark:#b81820;
  --bg:#f7f8fb;
  --panel:#ffffff;
  --panel-2:#f0f2f7;
  --line:#d9dce4;
  --text:#14161c;
  --muted:#5b6272;
  font-size:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Inter","Segoe UI",Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.5;
  min-height:100vh;
}
a{color:inherit}
.container{max-width:1040px;margin:0 auto;padding:0 24px}
img{max-width:100%;display:block}
h1,h2,h3{font-family:inherit}

/* Header */
.top{
  display:flex;align-items:center;justify-content:center;gap:28px;
  padding:20px 24px;flex-wrap:wrap;
  background:var(--panel);
  border-bottom:1px solid var(--line);
}
.top img{width:auto;display:block}
.top .logo-itfb,.top .logo-partner{height:36px}
.top .x{color:var(--muted);font-size:15px;font-weight:300}

/* Hero */
.hero{padding:60px 24px 0}
.hero-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:60px;align-items:start}
.eyebrow{
  display:inline-block;
  color:var(--red-dark);font-weight:700;font-size:13px;letter-spacing:.4px;text-transform:uppercase;
  margin-bottom:20px;
}
h1.hero-title{
  font-size:clamp(30px,4vw,48px);
  font-weight:800;line-height:1.08;margin:0 0 18px;letter-spacing:-0.02em;
  color:var(--text);
}
h1.hero-title .hl{color:var(--red)}
.hero-sub{color:var(--muted);font-size:17px;max-width:520px;margin:0 0 30px}

.cta{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--red);color:#fff;font-weight:700;font-size:16px;
  padding:16px 30px;border:none;cursor:pointer;text-decoration:none;
  transition:background .15s ease;
}
.cta:hover{background:var(--red-dark)}
.cta-sub{margin-top:14px;color:var(--muted);font-size:12.5px}

/* Stats ledger */
.hero-stats{border-top:2px solid var(--text);padding-top:2px}
.stat-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:16px 0;border-bottom:1px solid var(--line);
}
.stat-row .stat-lbl{color:var(--muted);font-size:13px}
.stat-row .stat-num{font-size:28px;font-weight:800;color:var(--text);white-space:nowrap}
.stat-row:first-child .stat-num{color:var(--red)}
.progress-wrap{margin-top:18px;background:var(--panel-2);border:1px solid var(--line);height:8px}
.progress-bar{height:100%;background:var(--red);width:0%;transition:width .5s ease}

/* Why section */
.why{margin:64px auto 0;max-width:1040px;padding:0 24px}
.why h2{
  font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;
  margin:0;padding-bottom:16px;border-bottom:2px solid var(--text);
}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.why-card{padding:28px 26px 8px}
.why-card{border-right:1px solid var(--line)}
.why-card:last-child{border-right:none}
.why-card .n{color:var(--red);font-weight:800;font-size:13px;margin-bottom:10px;font-variant-numeric:tabular-nums}
.why-card h3{margin:0 0 8px;font-size:16px;color:var(--text);font-weight:700}
.why-card p{margin:0;color:var(--muted);font-size:14px}

footer{margin-top:50px;padding:26px 24px;text-align:center;color:var(--muted);font-size:12.5px;border-top:1px solid var(--line)}

/* Wizard */
#wizard{display:none;min-height:100vh;padding:40px 20px 60px}
#wizard.active{display:block}
.wizard-top{max-width:640px;margin:0 auto 22px;display:flex;align-items:center;gap:14px}
.wizard-top .step-label{color:var(--muted);font-size:13px;white-space:nowrap}
.wizard-progress{flex:1;background:var(--panel-2);border:1px solid var(--line);height:6px}
.wizard-progress i{display:block;height:100%;background:var(--red);width:0%;transition:width .4s ease}

.card{
  max-width:640px;margin:0 auto;background:var(--panel);border:1px solid var(--line);
  border-top:4px solid var(--red);
  padding:34px 32px;
}
.card .section-tag{color:var(--red);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px}
.card h2{font-size:20px;margin:0 0 6px;line-height:1.35;color:var(--text)}
.card .hint{color:var(--muted);font-size:13px;margin-bottom:20px}

.options{display:flex;flex-direction:column;gap:8px}
.opt{
  display:flex;align-items:flex-start;gap:12px;background:var(--panel-2);border:1px solid var(--line);
  padding:13px 16px;cursor:pointer;transition:border-color .15s, background .15s;
  border-left:3px solid transparent;
}
.opt:hover{border-color:#b9c0d1}
.opt input{margin-top:3px;accent-color:var(--red);width:17px;height:17px;flex-shrink:0}
.opt span{font-size:14.5px;color:var(--text)}
.opt.selected{border-color:var(--line);border-left-color:var(--red);background:rgba(230,32,40,.06)}

.matrix{width:100%;border-collapse:collapse;font-size:13px}
.matrix th{color:var(--muted);font-weight:600;font-size:12px;padding:6px 4px;text-align:center}
.matrix th:first-child{text-align:left}
.matrix td{padding:10px 4px;border-top:1px solid var(--line);text-align:center;color:var(--text)}
.matrix td:first-child{text-align:left;font-size:13.5px;padding-right:10px}
.matrix input{accent-color:var(--red);width:18px;height:18px}
.matrix-wrap{overflow-x:auto}

input[type=email],input[type=text],input[type=tel]{
  width:100%;padding:13px 14px;border:1px solid var(--line);
  background:var(--panel-2);color:var(--text);font-size:15px;
}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:480px){.contact-grid{grid-template-columns:1fr}}

.nav-row{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:12px}
.btn{
  padding:13px 22px;font-weight:700;font-size:14.5px;cursor:pointer;border:none;
}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-dark)}
.btn-primary:disabled{background:#f1c3c5;color:#c98d90;cursor:not-allowed}
.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--line)}
.btn-ghost:hover{color:var(--text);border-color:#b9c0d1}

.error-msg{color:var(--red-dark);font-size:13px;margin-top:10px;display:none}

/* Result screens */
.result-card{
  max-width:600px;margin:60px auto;text-align:center;background:var(--panel);
  border:1px solid var(--line);border-top:4px solid var(--red);padding:44px 34px;
}
.result-card h2{font-size:24px;margin:0 0 10px;color:var(--text)}
.result-card p{color:var(--muted);font-size:15px}
.linkedin-box{margin-top:26px;background:var(--panel-2);border:1px solid var(--line);padding:18px;text-align:left}
.li-btn{
  display:inline-flex;align-items:center;gap:8px;background:#0a66c2;color:#fff;
  padding:11px 18px;text-decoration:none;font-weight:700;font-size:13.5px;border:none;cursor:pointer;
}
.li-btn:hover{background:#084d94}

@media (max-width:800px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
}
@media (max-width:640px){
  .why-grid{grid-template-columns:1fr}
  .why-card{border-right:none;border-bottom:1px solid var(--line)}
  .why-card:last-child{border-bottom:none}
  .card{padding:26px 20px}
  .top{gap:18px}
  .top .logo-itfb,.top .logo-partner{height:28px}
}