:root{
  --blue-main:#1f4fd8;
  --blue-soft:#1bb5e9;
  --blue-dark:#0f2e6e;
  --blue-alert:#e8f2ff;
}

/* Fondo matemático */
body{
  min-height:100vh;
  background:
    radial-gradient(circle at 20% 10%, rgba(27,181,233,.08), transparent 40%),
    radial-gradient(circle at 80% 20%, rgba(31,79,216,.08), transparent 40%),
    radial-gradient(circle at 50% 90%, rgba(27,181,233,.08), transparent 40%),
    #ffffff;
  position:relative;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  opacity:.10;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='340'%3E%3Cg fill='none' stroke='%231f4fd8' stroke-width='6' opacity='.35'%3E%3Cpath d='M70 80h40M90 60v40'/%3E%3Cpath d='M210 70l36 36M246 70l-36 36'/%3E%3Cpath d='M360 78h48'/%3E%3Cpath d='M420 240h44M442 218v44'/%3E%3Cpath d='M120 250l36 36M156 250l-36 36'/%3E%3Cpath d='M300 240h54'/%3E%3C/g%3E%3Cg fill='%231f4fd8' opacity='.25'%3E%3Ctext x='60' y='170' font-size='64' font-family='Arial'%3E%CE%B1%3C/text%3E%3Ctext x='250' y='200' font-size='74' font-family='Arial'%3E%CE%A3%3C/text%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:520px 340px;
}

.wrap{ max-width:980px; margin:40px auto; padding:0 16px; }

.card-shell{
  background:#fff;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 20px 55px rgba(15,46,110,.18);
  border:1px solid rgba(15,46,110,.08);
}

/* Banner */
.hero{
  background:linear-gradient(135deg,var(--blue-dark),var(--blue-main),var(--blue-soft));
  color:#fff;
  padding:26px 18px;
  text-align:center;
}

.hero h1{
  margin:0;
  font-weight:900;
  letter-spacing:.7px;
}

.content{ padding:22px; }

.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
}

.soft-alert{
  background:var(--blue-alert);
  border:1px solid rgba(31,79,216,.25);
  color:#0f2e6e;
  border-radius:14px;
  padding:12px 14px;
  font-weight:700;
}

.form-label{ font-weight:700; }
.form-control{ border-radius:14px; padding:12px; }

.btn-brand{
  background:linear-gradient(135deg,var(--blue-dark),var(--blue-main));
  border:0;
  border-radius:14px;
  padding:14px;
  font-weight:900;
  letter-spacing:.4px;
}
.btn-brand:hover{ filter:brightness(1.05); }

.footer{
  display:flex;
  justify-content:center;
  padding:20px;
}
.footer img{
  height:56px;
  max-width:90%;
}