:root{--red:#B00000;--bg:#F5F5F5}
*{box-sizing:border-box}
body{margin:0;font-family:Arial;background:var(--bg);color:#222}
.hero{background:linear-gradient(rgba(120,0,0,.75),rgba(120,0,0,.75)),url('assets/img/hero.jpg') center/cover;padding:55px 18px;color:#fff}
.container{max-width:980px;margin:auto}
.logo{width:85px}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}
.stat{background:rgba(255,255,255,.12);backdrop-filter:blur(4px);padding:16px;border-radius:14px;text-align:center}
.stat b{display:block;font-size:22px}
.main{margin-top:-25px;padding:0 14px 30px}
.card{background:#fff;border-radius:20px;padding:22px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.amount{font-size:40px;font-weight:700;color:var(--red);text-align:center;margin:18px 0}
.range-wrap{padding:8px 0 20px}
input[type=range]{width:100%;-webkit-appearance:none;height:8px;background:#E5E7EB;border-radius:999px;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:var(--red);border:4px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.25)}
input[type=range]::-moz-range-thumb{width:30px;height:30px;border:none;border-radius:50%;background:var(--red)}
.scale{display:flex;justify-content:space-between;font-size:12px;color:#666}
.btn{width:100%;background:var(--red);color:#fff;border:0;padding:16px;border-radius:12px;font-size:18px;font-weight:700}
.note{margin-top:14px;text-align:center;color:#666;font-size:14px}
@media(min-width:769px){
.hero{padding:70px 30px}
.stats{grid-template-columns:repeat(2,220px)}
.amount{font-size:48px}
}