:root{
  --navy-900:#0c1c30; --navy-800:#132a45; --navy-700:#1c3a5c; --navy-600:#2a4d75;
  --paper:#f4f7fb; --white:#ffffff; --gold:#c9a227; --gold-soft:#e6c25c;
  --slate:#8ea3c2; --slate-dim:#5d7291; --danger:#d9776a; --radius:10px;
}
*{box-sizing:border-box;}
h1,h2,h3,.eyebrow,.btn{ font-family:'Jost', sans-serif; font-weight:600; text-transform:uppercase; }
.merlon-rule{ height:8px; width:100%; background-image:linear-gradient(90deg, var(--gold) 50%, transparent 50%); background-size:20px 8px; background-repeat:repeat-x; opacity:0.9; }

/* Páginas tipo tarjeta: login, forgot-password, reset-password */
body.auth{
  margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--navy-900);
  background-image:
    radial-gradient(circle at 15% 8%, rgba(201,162,39,0.07), transparent 40%),
    radial-gradient(circle at 85% 92%, rgba(42,77,117,0.35), transparent 45%);
  color:var(--white); font-family:'Jost', -apple-system, sans-serif; font-weight:400; padding:24px;
}
.card{ width:100%; max-width:760px; background:var(--navy-800); border:1px solid var(--navy-600); border-radius:calc(var(--radius) * 2); overflow:hidden; box-shadow:0 60px 120px rgba(0,0,0,0.45); }
.card .body{ padding:60px 68px; text-align:center; }
.card .eyebrow{ letter-spacing:.18em; font-size:24px; color:var(--gold); font-weight:500; margin:0 0 12px; }
.card h1{ font-size:40px; letter-spacing:.04em; margin:0 0 20px; color:var(--white); }
.card .sub{ color:var(--slate); font-size:28px; line-height:1.5; margin:0 0 40px; }
.card form{ display:flex; flex-direction:column; gap:24px; text-align:left; }
.card input[type=password]{
  width:100%; padding:24px 28px; border-radius:12px; border:1px solid var(--navy-600);
  background:var(--navy-900); color:var(--white); font-size:30px; font-family:inherit; outline:none;
}
.card input[type=password]:focus{ border-color:var(--gold); }
.card .btn{
  border:none; cursor:pointer; border-radius:12px; padding:24px 36px; font-size:28px;
  letter-spacing:.09em; font-weight:600; background:var(--gold); color:var(--navy-900);
}
.card .btn:hover{ background:var(--gold-soft); }
.card .links{ margin-top:32px; display:flex; justify-content:center; }
.card .links a{ color:var(--slate); font-size:26px; text-decoration:none; border-bottom:1px solid var(--navy-600); padding-bottom:2px; }
.card .links a:hover{ color:var(--gold); border-color:var(--gold); }
