:root{
  --bg:#1B2320;
  --surface:#232C27;
  --surface-2:#2B3630;
  --ink:#F5F7F3;
  --muted:#9BAAA0;
  --accent:#43D67D;
  --accent-ink:#0E1512;
  --support:#5FD3D6;
  --radius-sm:8px;
  --radius-md:20px;
  --radius-pill:999px;
  --sp-sm:8px;
  --sp-md:20px;
  --sp-lg:48px;
  --sp-xl:96px;
  --font-heading:ui-sans-serif,'Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --font-body:ui-sans-serif,'Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body.ek-body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  background-image:
    linear-gradient(rgba(67,214,125,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(67,214,125,0.05) 1px, transparent 1px);
  background-size:56px 56px;
}

.ek-wrap{max-width:1080px;margin:0 auto;padding:0 var(--sp-md);}

/* Nav */
.ek-nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-md) 0;
}
.ek-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:800;font-family:var(--font-heading);font-size:18px;}
.ek-logo-dot{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent);}
.ek-back{color:var(--muted);text-decoration:none;font-size:14px;border:1px solid rgba(255,255,255,0.12);padding:8px 16px;border-radius:var(--radius-pill);transition:border-color .2s,color .2s;}
.ek-back:hover{border-color:var(--accent);color:var(--accent);}

/* Hero */
.ek-hero{padding:var(--sp-xl) 0 var(--sp-lg);position:relative;}
.ek-eyebrow{color:var(--support);font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin:0 0 var(--sp-sm);}
.ek-hero h1{
  font-family:var(--font-heading);font-weight:800;
  font-size:clamp(32px,5vw,54px);
  line-height:1.08;margin:0 0 var(--sp-md);
  max-width:16ch;
}
.ek-hero h1 em{color:var(--accent);font-style:normal;}
.ek-hero p{color:var(--muted);font-size:18px;max-width:56ch;margin:0;}

/* Layout: calculator grid */
.ek-grid{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:var(--sp-lg);
  align-items:start;padding-bottom:var(--sp-xl);
}
@media (max-width:1024px){.ek-grid{grid-template-columns:1fr;}}

.ek-card{
  background:var(--surface);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-md);
  padding:var(--sp-lg);
}

.ek-field{margin-bottom:var(--sp-md);}
.ek-field label{display:block;font-size:14px;color:var(--muted);margin-bottom:8px;}
.ek-field input[type="number"],
.ek-field select{
  width:100%;background:var(--bg);border:1px solid rgba(255,255,255,0.12);
  color:var(--ink);border-radius:var(--radius-sm);padding:12px 14px;font-size:16px;
  font-family:var(--font-body);
}
.ek-field input[type="number"]:focus,.ek-field select:focus{outline:none;border-color:var(--accent);}
.ek-row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-md);}
@media (max-width:520px){.ek-row2{grid-template-columns:1fr;}}

.ek-radio-group{display:flex;flex-wrap:wrap;gap:10px;}
.ek-radio{
  border:1px solid rgba(255,255,255,0.14);border-radius:var(--radius-pill);
  padding:9px 16px;font-size:14px;cursor:pointer;color:var(--muted);
  transition:border-color .15s, color .15s, background .15s;
}
.ek-radio input{display:none;}
.ek-radio.active{border-color:var(--accent);color:var(--ink);background:rgba(67,214,125,0.1);}

/* Result card */
.ek-result{position:sticky;top:24px;}
.ek-result-label{color:var(--muted);font-size:14px;margin-bottom:6px;}
.ek-result-value{
  font-family:var(--font-heading);font-weight:800;
  font-size:56px;line-height:1;color:var(--accent);
  text-shadow:0 0 30px rgba(67,214,125,.35);
  margin-bottom:4px;
}
.ek-result-unit{color:var(--muted);font-size:15px;margin-bottom:var(--sp-md);}
.ek-result-bar{height:8px;border-radius:var(--radius-pill);background:var(--surface-2);overflow:hidden;margin-bottom:var(--sp-md);}
.ek-result-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--support));border-radius:var(--radius-pill);transition:width .4s ease;}
.ek-result-class{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;color:var(--muted);margin-bottom:var(--sp-lg);
}
.ek-badge{width:28px;height:20px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:var(--accent-ink);}

.ek-divider{height:1px;background:rgba(255,255,255,0.08);margin:var(--sp-md) 0;}

.ek-note{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:var(--sp-lg);}

.ek-cta{
  display:inline-flex;align-items:center;justify-content:center;
  width:100%;background:var(--accent);color:var(--accent-ink);
  font-weight:700;font-size:16px;border:none;border-radius:var(--radius-pill);
  padding:16px 24px;cursor:pointer;text-decoration:none;
  box-shadow:0 8px 24px rgba(67,214,125,.28);
  transition:transform .15s ease, box-shadow .15s ease;
}
.ek-cta:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(67,214,125,.4);}

.ek-footer{color:var(--muted);font-size:13px;text-align:center;padding:var(--sp-lg) 0 var(--sp-xl);}
.ek-footer a{color:var(--muted);}