:root{
  --pink:#E91E63;
  --pink-dark:#C2185B;
  --red:#D32F2F;
  --gray:#ECEFF1;
  --dk:#455A64;
  --text:#2b2b2b;
  --radius:14px;
  --shadow:0 6px 18px rgba(0,0,0,.08);
  --gap:18px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

*{box-sizing:border-box}
body{margin:0;background:#fafafa;color:var(--text)}

.header{max-width:1100px;margin:24px auto 0;padding:0 16px}
.logo{font-size:28px;font-weight:800;letter-spacing:.5px}
.logo span{color:var(--pink)}
.band{margin-top:12px;background:var(--pink);color:#fff;border-radius:var(--radius);padding:14px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;box-shadow:var(--shadow)}
.band.dark{background:var(--dk)}
.porcentajes{display:flex;gap:24px;flex-wrap:wrap;font-weight:600}

.note{margin:12px 0;background:#CFD8DC;color:#1b1b1b;border-radius:var(--radius);padding:12px 18px;font-weight:700;text-align:center}

.grid{max-width:1100px;margin:24px auto;padding:0 16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--gap)}

.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid #f0f0f0}
.card .title{background:var(--pink);color:#fff;padding:14px 18px;font-size:18px;font-weight:800}
.card .body{padding:18px}
.label{font-weight:700;margin-bottom:8px}
.input{margin-top:6px}
.input input{width:100%;padding:12px 14px;border:2px solid #ECECEC;border-radius:10px;font-size:16px}
.table{margin-top:16px;border-radius:12px;overflow:hidden;border:1px solid #eee}
.table table{width:100%;border-collapse:collapse}
.table th{background:var(--pink);color:#fff;text-align:left;padding:12px 10px;font-size:13px}
.table td{padding:12px 10px;border-top:1px solid #f3f3f3}

.maximos{max-width:1100px;margin:12px auto 40px;padding:0 16px}
.maximos h2{background:var(--red);color:#fff;padding:16px 18px;border-radius:var(--radius);box-shadow:var(--shadow);margin:0 0 14px}
.maximos .tabla{background:#fff;border:1px solid #eee;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.row{display:grid;grid-template-columns:1.2fr 1fr 1fr}
.row > div{padding:14px 12px;border-top:1px solid #f3f3f3;display:flex;align-items:center}
.row.head{background:var(--red);color:#fff;border-top:none;font-weight:800}
.row input{width:100%;padding:12px;border:2px solid #FDE68A;background:#FEF9C3;border-radius:10px;font-size:15px}
.footer{max-width:1100px;margin:0 auto 60px;padding:0 16px}
.muted{color:#616161;font-size:12px}
.currency{white-space:nowrap}

/* Banner de aviso destacado */
.note-highlight{
  background: linear-gradient(90deg, #1e88e5, #42a5f5); /* azul info */
  color:#fff;
  font-weight:800;
  letter-spacing:.3px;
  border:none;
  box-shadow: 0 8px 24px rgba(30,136,229,.25);
}
.note-highlight::before{
  content:"ℹ️";
  margin-right:.6rem;
}