/* Email signup card; self-contained so it works on the home page and the lesson pages. */
.signup{--pencil:#2b2b2b;--red:#d9534f;box-sizing:border-box;max-width:34rem;margin:48px 0 24px;padding:20px 22px 18px;background:#fff;color:var(--pencil);border:2px solid var(--pencil);border-radius:10px 4px 12px 4px;font:400 1rem/1.5 "PT Serif",Georgia,serif}
.signup h2{margin:0 0 12px;font:700 1.6rem/1.2 Kalam,cursive}
.signup label{display:block;margin:12px 0 4px}
.signup input[type=email]{box-sizing:border-box;width:100%;min-height:44px;padding:6px 10px;font:inherit;color:inherit;background:#fff;border:2px solid var(--pencil);border-radius:4px}
.signup .consent{display:flex;gap:10px;align-items:flex-start}
.signup .consent input{flex:none;width:24px;height:24px;margin:10px 0 0;accent-color:var(--red)}
.signup .consent label{margin:0;padding:8px 0}
.signup button{min-height:44px;margin-top:14px;padding:0 24px;font:700 1.3rem Kalam,cursive;color:#fbfbf8;background:var(--pencil);border:2px solid var(--pencil);border-radius:10px 4px 12px 4px;cursor:pointer}
.signup button:hover{background:var(--red);border-color:var(--red)}
.signup :focus-visible{outline:3px solid var(--red);outline-offset:3px}
.signup .small{margin:14px 0 0;font-size:.9rem}
.signup a{color:inherit;text-decoration-color:var(--red);text-underline-offset:3px}
.signup .hp{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (max-width:400px){.signup{padding:16px 14px}}