/* Sign-in, sign-up, details and checkout pages: a form card on the marketing page hero. */
.auth{padding:56px 0 96px}
.auth .wrap{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
.auth-card{width:100%;max-width:520px;background:var(--white);border-radius:var(--r-lg);padding:36px;box-shadow:inset 0 0 0 1px var(--line)}
.auth-card p{margin:0 0 18px}
.auth-card p:last-child{margin-bottom:0}
.auth-card label{display:block;font-weight:600;color:var(--ink);font-size:15px}
.auth-card input[type="email"],.auth-card input[type="text"]{display:block;width:100%;margin-top:8px;height:48px;padding:0 14px;border:0;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--line);background:var(--white);color:var(--ink);font:400 16px/1 var(--font)}
.auth-card input[type="email"]:focus,.auth-card input[type="text"]:focus{outline:0;box-shadow:inset 0 0 0 2px var(--mid)}
.auth-card input[type="checkbox"]{margin-right:8px;accent-color:var(--mid)}
.auth-card .terms{font-weight:400;color:var(--text)}
/* Full-width labels may wrap so the card never forces sideways scroll on narrow phones. */
.auth-card .btn{width:100%;justify-content:center;white-space:normal;text-align:center;height:auto;min-height:50px;padding:12px 24px;line-height:1.3}
.auth-card .notice{background:#FFF6DB;border-radius:12px;box-shadow:inset 0 0 0 1px var(--warn);padding:12px 16px;font-size:15px}
.auth-card .lead{color:var(--text)}
.auth-aside{margin-top:20px;font-size:15px;color:var(--muted)}
@media (max-width:560px){.auth-card{padding:24px}}