*{box-sizing:border-box}
:root{--navy:#071f55;--blue:#1557d6;--blue2:#2f68ff;--ink:#0b1220;--muted:#536886;--border:#cfe0ff;--panel:rgba(255,255,255,.94);--shadow:0 24px 80px rgba(7,31,85,.14)}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at 20% 12%,rgba(47,104,255,.12),transparent 32%),radial-gradient(circle at 88% 18%,rgba(7,31,85,.08),transparent 30%),linear-gradient(135deg,#f8fbff 0%,#edf5ff 100%);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(rgba(21,87,214,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(21,87,214,.05) 1px,transparent 1px);background-size:42px 42px;pointer-events:none;z-index:-2}
body:after{content:"σ     μ     z     p     x̄";position:fixed;right:-4vw;bottom:6vh;font-size:clamp(5rem,15vw,16rem);font-weight:900;letter-spacing:.08em;color:rgba(21,87,214,.045);pointer-events:none;z-index:-1}
.page-shell{width:min(1120px,calc(100% - 32px));margin:56px auto 24px}
.hero-card,.demo-card{background:var(--panel);border:1px solid rgba(207,224,255,.9);border-radius:28px;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.hero-card{text-align:center;padding:clamp(34px,5vw,70px);margin-bottom:34px}
.mini-chart svg{width:118px;height:auto}
.eyebrow{margin:0 0 14px;color:var(--blue);font-size:.78rem;font-weight:900;letter-spacing:.32em;text-transform:uppercase}
h1{margin:0;color:var(--navy);font-size:clamp(4rem,10vw,7.8rem);line-height:.92;letter-spacing:-.08em}
.title-rule{width:120px;height:6px;margin:24px auto 26px;background:var(--blue2);border-radius:999px}
.hero-card h2,.section-heading h2{margin:0;color:var(--navy);font-size:clamp(2rem,5vw,3.2rem);line-height:1.08;letter-spacing:-.045em}
.lead,.section-heading p,.problem-box p{max-width:780px;margin:22px auto 0;color:var(--muted);font-size:1.08rem;line-height:1.7}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:34px auto 0}
.feature-pill{min-height:72px;display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.72);color:var(--navy)}
.feature-pill span{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;background:#dceaff;color:var(--blue);font-weight:900}
.feature-pill strong{line-height:1.22}
.contact{margin:32px 0 0;color:var(--navy);font-weight:800}
a{color:var(--blue)}
.demo-card{padding:clamp(24px,4vw,44px)}
.section-heading{text-align:center;margin-bottom:26px}
.problem-box{border-left:6px solid var(--blue);background:#f7fbff;border-radius:18px;padding:20px 24px;margin:0 0 26px}
.problem-box h3{margin:0;color:var(--navy);font-size:1.25rem}
.problem-box p{margin:10px 0 0;max-width:none}
.data-line{font-weight:900;color:var(--navy)!important;background:#eef5ff;border-radius:12px;padding:10px 12px}
.calculator-layout{display:grid;grid-template-columns:360px 1fr;gap:24px;align-items:start}
.input-panel,.output-panel{background:#fff;border:1px solid var(--border);border-radius:22px;padding:22px}
.input-panel{position:sticky;top:18px}
.input-panel h3{margin:0 0 8px;color:var(--navy)}
label{display:block;margin:16px 0 8px;color:var(--navy);font-weight:800}
textarea,input,select{width:100%;border:1px solid #b8cbed;border-radius:12px;padding:12px 13px;font:inherit;color:var(--ink);background:#fff}
textarea{resize:vertical}.hint{margin:8px 0 0;color:var(--muted);font-size:.9rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.button-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}
button{width:100%;border:0;border-radius:14px;padding:14px 16px;background:var(--blue);color:#fff;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 10px 26px rgba(21,87,214,.22)}
button.secondary{background:#eef5ff;color:var(--navy);box-shadow:none;border:1px solid var(--border)}
button.ghost{background:#fff;color:var(--muted);box-shadow:none;border:1px solid #d9e6ff}
.progress-wrap{margin-bottom:16px}.progress-label{font-weight:900;color:var(--navy);margin-bottom:8px}
.progress-track{height:12px;background:#eef5ff;border:1px solid var(--border);border-radius:999px;overflow:hidden}
.progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--blue),var(--blue2));border-radius:999px;transition:width .25s ease}
.learning-note{background:#eef5ff;border:1px solid var(--border);color:var(--navy);border-radius:16px;padding:14px 16px;margin-bottom:16px;line-height:1.55}
.step-card{border:1px solid #d9e6ff;border-radius:18px;padding:20px;background:#fbfdff}
.step-kicker{margin:0 0 8px;color:var(--blue);font-size:.82rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.step-card h3{margin:0 0 10px;color:var(--navy);font-size:1.45rem;line-height:1.2}
.step-card p,.step-card li{color:#27384f;line-height:1.6}.purpose{font-weight:800;color:var(--blue)!important}
.formula{background:#eef5ff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;color:var(--navy)!important;font-weight:800;overflow-x:auto}
.learning-check{margin-top:12px;background:#fff7e7;border:1px solid #ffd687;color:#5b420b;border-radius:12px;padding:12px;line-height:1.55}
.solution-list{display:grid;gap:14px}
.mini-table{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.mini-table div{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff}
.mini-table span{display:block;color:var(--muted);font-size:.9rem;margin-bottom:4px}.mini-table strong{color:var(--navy)}
.final-result-panel{background:#edf8f1;border:1px solid #b9e4c6;color:#174c28;border-radius:18px;padding:18px 20px;line-height:1.55;margin-top:18px}
.final-result-panel.reject{background:#fff7e7;border-color:#ffd687;color:#6b4500}[hidden]{display:none!important}.hidden{display:none!important}
footer{width:min(1120px,calc(100% - 32px));margin:0 auto 22px;text-align:center;color:#536886;font-size:.95rem}
@media(max-width:900px){.calculator-layout{grid-template-columns:1fr}.input-panel{position:static}.feature-grid{grid-template-columns:repeat(2,1fr)}h1{font-size:clamp(3.4rem,18vw,6rem)}}
@media(max-width:560px){.page-shell{width:min(100% - 20px,1120px);margin-top:20px}.hero-card,.demo-card{border-radius:20px}.feature-grid,.form-row,.mini-table{grid-template-columns:1fr}.hero-card{padding:28px 18px}.step-card{padding:18px}.step-card h3{font-size:1.28rem}}