:root{
  --bg:#f7f9fc;--surface:#fff;--surface-soft:#eef5ff;--ink:#11213a;--muted:#66758a;
  --line:#dce5ef;--brand:#1769e0;--brand-dark:#0f50b3;--ok:#0d7a50;--shadow:0 18px 50px rgba(22,39,69,.08);
  --radius:22px;--max:1080px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}
a{color:inherit}button,input,select{font:inherit}.site-header{background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}
.nav{max-width:var(--max);margin:auto;padding:16px 20px;display:flex;align-items:center;gap:18px}.brand{text-decoration:none;font-weight:850;font-size:24px;letter-spacing:-.6px}.brand-dot{color:var(--brand)}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:18px}.nav-links a{text-decoration:none;color:var(--muted);font-size:14px;font-weight:700}.nav-links a:hover{color:var(--ink)}.lang{border:1px solid var(--line);padding:7px 10px;border-radius:999px;background:#fff}
main{max-width:var(--max);margin:auto;padding:58px 20px 72px}.hero{text-align:center;max-width:760px;margin:0 auto 38px}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brand);background:var(--surface-soft);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:800;margin-bottom:16px}
h1{font-size:clamp(38px,6.7vw,66px);line-height:1.02;letter-spacing:-2.1px;margin:0 0 16px}h2{font-size:clamp(25px,4vw,34px);letter-spacing:-.8px;margin:0 0 10px}h3{margin:0 0 7px;font-size:19px}.lead{color:var(--muted);font-size:clamp(17px,2vw,20px);margin:0 auto;max-width:650px}

.section{margin-top:44px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px}.section-head p{color:var(--muted);margin:0}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tool-card{display:block;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;transition:.18s ease;min-height:154px}.tool-card:hover{transform:translateY(-2px);border-color:#b9cce6;box-shadow:var(--shadow)}.tool-card-top{display:flex;align-items:center;gap:11px;margin-bottom:14px}.tool-icon{width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:var(--surface-soft);color:var(--brand);display:grid;place-items:center}.tool-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tool-card .kicker{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--brand);font-weight:850}.tool-card p{color:var(--muted);margin:0;font-size:14px}.tool-card .arrow{display:inline-block;margin-top:16px;color:var(--brand);font-weight:850}.tool-card[hidden]{display:none}
.calc-shell{max-width:760px;margin:0 auto}.breadcrumb{font-size:14px;color:var(--muted);margin-bottom:18px}.breadcrumb a{text-decoration:none}.calc-head{text-align:center;margin-bottom:24px}.calc-head h1{font-size:clamp(34px,6vw,52px)}.calc-card{width:100%;max-width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}.form-grid{width:100%;max-width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.field{min-width:0;max-width:100%}.field label{display:block;font-size:14px;font-weight:800;margin-bottom:7px}.field small{display:block;color:var(--muted);font-size:12px;margin-top:6px}.field input,.field select{display:block;width:100%;min-width:0;max-width:100%;padding:13px 14px;border:1px solid #cbd7e5;border-radius:12px;background:#fff;color:var(--ink);min-height:50px}.field input:focus,.field select:focus{outline:3px solid var(--surface-soft);border-color:var(--brand)}
.result{margin-top:22px;background:var(--surface-soft);border-radius:17px;padding:22px;text-align:center}.result-label{display:block;color:var(--muted);font-size:13px;font-weight:800;margin-bottom:2px}.result-value{font-size:clamp(35px,7vw,54px);line-height:1.1;font-weight:900;letter-spacing:-1.6px}.result-detail{color:var(--muted);font-size:14px;margin-top:8px}.hint{margin:18px 0 0;color:var(--muted);font-size:13px;text-align:center}.simple-copy{max-width:760px;margin:26px auto 0;color:var(--muted);font-size:14px}.simple-copy strong{color:var(--ink)}
.site-footer{border-top:1px solid var(--line);background:#fff}.footer-inner{max-width:var(--max);margin:auto;padding:25px 20px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:13px}.footer-inner a{text-decoration:none}.footer-inner a:hover{color:var(--ink)}.footer-links{display:flex;gap:16px;flex-wrap:wrap}.empty-search{text-align:center;color:var(--muted);padding:28px 0;display:none}
@media(max-width:820px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.three{grid-template-columns:1fr}.nav-links a:not(.lang){display:none}}
@media(max-width:560px){main{padding:40px 16px 58px}.nav{padding:14px 16px}.tool-grid{grid-template-columns:1fr}.form-grid,.form-grid.three{grid-template-columns:minmax(0,1fr);width:100%;max-width:420px;margin-left:auto;margin-right:auto}.field{width:100%;min-width:0}.field input,.field select{width:100%;min-width:0;max-width:100%}.calc-card{padding:20px;overflow:hidden}.footer-inner{flex-direction:column}.hero{margin-bottom:30px}h1{letter-spacing:-1.5px}}


/* Rechnello 1.0.2 – iOS/Safari form sizing fix */
.field input,
.field select {
  box-sizing: border-box;
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
}

.field input[type="time"],
.field input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  font-size: 16px;
}

.field input[type="time"]::-webkit-date-and-time-value,
.field input[type="date"]::-webkit-date-and-time-value {
  min-inline-size: 0;
  text-align: center;
}

@media (max-width:560px) {
  .calc-card {
    padding-left: 20px;
    padding-right: 20px;
  }

  .calc-card .form-grid,
  .calc-card .form-grid.three {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }

  .calc-card .field {
    width: auto;
    max-width: none;
    min-width: 0;
    overflow: hidden;
  }

  .calc-card .field input,
  .calc-card .field select {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
}