/* RescueMotor — public site. Simple, fast, honest. Brand: green #00D26A on dark. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800&display=swap');

:root{
  --green:#00D26A; --green-2:#16C784; --green-ink:#04130B;
  --black:#0A0A0A; --panel:#0F1722; --panel-2:#101826;
  --line:rgba(255,255,255,.10); --txt:#F3F6FA; --muted:#9CA3AF;
  --orange:#FF8A00; --red:#FF3A44;
  --font:'Inter',system-ui,-apple-system,sans-serif; --display:'Manrope','Inter',sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:var(--font); color:var(--txt); -webkit-font-smoothing:antialiased;
  background:radial-gradient(1000px 540px at 75% -10%,rgba(0,210,106,.10),transparent 60%),var(--black);
  min-height:100vh;
}
a{color:inherit}
.wrap{max-width:760px;margin:0 auto;padding:clamp(16px,3vw,28px) clamp(14px,3vw,20px) calc(70px + env(safe-area-inset-bottom))}

/* nav */
.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;flex-wrap:wrap;row-gap:8px;
  padding:12px clamp(14px,3vw,26px);backdrop-filter:blur(14px);background:rgba(10,10,10,.6);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:17px;text-decoration:none}
.brand b{color:var(--green)}
.logo{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--green-ink);
  font-family:var(--display);font-weight:800;background:linear-gradient(135deg,var(--green),var(--green-2))}
.tabs{display:flex;gap:4px;margin-left:auto}
.tabs a{padding:8px 13px;border-radius:30px;font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;white-space:nowrap;min-height:40px;display:inline-flex;align-items:center}
.tabs a.on,.tabs a:hover{color:var(--txt);background:rgba(255,255,255,.07)}
@media (max-width:640px){
  .tabs{order:3;width:100%;margin-left:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
}

/* type */
h1{font-family:var(--display);font-weight:800;letter-spacing:-.02em;font-size:clamp(26px,6vw,40px);line-height:1.12;margin:14px 0 10px}
h2{font-family:var(--display);font-weight:800;letter-spacing:-.01em;font-size:clamp(18px,4vw,22px);margin:0 0 10px}
.lead{color:var(--muted);font-size:clamp(15px,2.4vw,17px);line-height:1.6;margin:0 0 22px}
.grad{background:linear-gradient(90deg,var(--green),var(--green-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--green-2);font-weight:700}
.muted{color:var(--muted)}

/* cards + buttons */
.card{background:linear-gradient(180deg,rgba(255,255,255,.02),transparent),var(--panel);
  border:1px solid var(--line);border-radius:18px;padding:clamp(16px,3vw,22px);margin-bottom:14px}
.tool{display:flex;gap:14px;align-items:flex-start;text-decoration:none;transition:border-color .15s,transform .12s}
.tool:hover{border-color:rgba(0,210,106,.5);transform:translateY(-1px)}
.tool .ic{width:44px;height:44px;flex-shrink:0;border-radius:12px;display:grid;place-items:center;font-size:22px;background:rgba(0,210,106,.12);border:1px solid rgba(0,210,106,.3)}
.tool h2{margin:0 0 3px;font-size:17px}
.tool p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.5}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;cursor:pointer;border:0;min-height:50px;
  font-family:var(--font);font-weight:700;font-size:15px;padding:13px 18px;border-radius:30px;text-decoration:none;
  color:var(--green-ink);background:linear-gradient(135deg,var(--green),var(--green-2));box-shadow:0 10px 26px rgba(0,210,106,.28)}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:rgba(255,255,255,.05);color:var(--txt);border:1px solid var(--line);box-shadow:none}
.btn.danger{background:linear-gradient(135deg,var(--red),#c81e26);color:#fff;box-shadow:0 10px 26px rgba(255,58,68,.3)}

/* forms */
label{display:block;font-size:12px;color:var(--muted);margin:12px 0 6px}
input,select{width:100%;font-family:var(--font);font-size:16px;min-height:46px;color:var(--txt);
  background:var(--panel-2);border:1px solid var(--line);border-radius:13px;padding:11px 13px;outline:none}
input:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(0,210,106,.15)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:480px){.row{grid-template-columns:1fr}}

/* results */
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.kv:last-child{border:0}.kv .k{color:var(--muted)}
.price{font-family:var(--display);font-weight:800;font-size:clamp(30px,8vw,42px);letter-spacing:-.03em}
.price small{font-size:14px;color:var(--muted);font-weight:600}
.pill{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:30px;font-size:12px;font-weight:700;
  background:rgba(0,210,106,.14);color:var(--green);border:1px solid rgba(0,210,106,.32)}
.note{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid var(--line);
  border-radius:13px;padding:12px 14px;margin:12px 0 0;font-size:13px;line-height:1.55;color:#E5E7EB}
.err{color:#FF7A7E;font-size:13px;margin-top:10px;min-height:16px}
.hidden{display:none !important}

/* footer */
.foot{text-align:center;color:#6B7280;font-size:12px;line-height:1.7;margin-top:26px}
.foot a{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}