/* ============================================================
   De Chateau Paradise â€” auth pages (login / register)
   File location in project: public/css/auth.css
   Load AFTER style.css (or paste at the end of style.css).
   ============================================================ */

.auth-page{
  min-height:calc(100vh - 80px);
  display:flex;align-items:center;justify-content:center;
  padding:calc(var(--space-16) + 8px) var(--space-6) var(--space-16);
  /* soft cream-to-sky wash so the card sits on something warmer than flat bg */
  background:radial-gradient(120% 90% at 50% 0%, oklch(93% 0.02 235) 0%, var(--cream) 55%);
}
.auth-card{
  width:100%;max-width:440px;background:var(--surface);
  border:1px solid var(--border);border-radius:8px;
  padding:var(--space-12);
  box-shadow:0 24px 60px -36px oklch(40% 0.06 250 / .5);
}
@media(max-width:480px){.auth-card{padding:var(--space-8) var(--space-6)}}
.auth-eyebrow{
  font-size:.6875rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold-deep);font-weight:600;margin-bottom:var(--space-3);
}
.auth-title{font-size:clamp(1.9rem,4vw,2.5rem);letter-spacing:0}
.auth-sub{color:var(--muted);margin-top:var(--space-2);margin-bottom:var(--space-8)}
.auth-form .field:last-of-type{margin-bottom:var(--space-8)}
.auth-form .opt{color:var(--faint);font-weight:400;font-size:.8125rem}
.auth-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
@media(max-width:420px){.auth-form .field-row{grid-template-columns:1fr}}
.auth-alt{text-align:center;margin-top:var(--space-6);color:var(--muted);font-size:.9375rem}
.auth-alt a{color:var(--gold-deep);font-weight:500}
.auth-alt a:hover{text-decoration:underline}
