/* Sign up widget (site/signup.js): plan cards, the add-on row, the short form. Reuses the booking form styles (.bk-grid, .bk-error). */
.signup-widget{margin-top:8px}
.signup-widget [hidden]{display:none !important}
.su-body{padding:18px 20px 22px;background:var(--win)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.su-h{font-family:var(--display);font-size:16px;margin:18px 0 10px;letter-spacing:-.01em}
.su-h .muted{font-weight:500;font-size:13px}
.su-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.su-row .su-h{margin-top:0}.su-row .billing{margin:0}
.su-plans{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.su-plan{position:relative;display:flex;flex-direction:column;gap:5px;border:1px solid var(--line);border-radius:8px;background:var(--paper-2);padding:12px 12px 12px;cursor:pointer;box-shadow:1px 1px 0 var(--hair);transition:box-shadow var(--fast),transform var(--fast) var(--ease)}
.su-plan:hover{transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--line)}
.su-plan input{position:absolute;opacity:0;width:1px;height:1px}
.su-plan:has(input:checked){background:var(--win);outline:2px solid var(--lime);outline-offset:-2px;box-shadow:2px 2px 0 var(--line)}
.su-plan:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:1px}
.su-plan.featured .su-plan-name::after{content:"most popular";font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--lime);color:var(--lime-ink);border:1px solid var(--line);border-radius:4px;padding:1px 5px;margin-left:8px;vertical-align:middle}
.su-plan-name{font-family:var(--display);font-weight:700;font-size:15px}
.su-plan .price{display:flex;align-items:baseline;gap:6px}
.su-plan .price .num{font-family:var(--display);font-weight:700;font-size:24px;line-height:1}
.su-plan .per{font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.su-plan-blurb{font-size:13px;color:var(--ink-2);line-height:1.4}
.su-early{font-family:var(--mono);font-size:10.5px;color:var(--muted);line-height:1.4;margin-top:2px}
.su-plan.byte-spot{animation:su-pulse 1.8s ease-out}
@keyframes su-pulse{0%{box-shadow:0 0 0 0 var(--lime-soft),2px 2px 0 var(--line)}60%{box-shadow:0 0 0 12px rgba(182,216,47,0),2px 2px 0 var(--line)}100%{box-shadow:2px 2px 0 var(--line)}}
.su-note{margin:10px 0 0}
.su-addon{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--hair);border-radius:8px;padding:10px 12px;background:var(--paper-2);cursor:pointer;font-size:14px}
.su-addon input{margin:3px 0 0;accent-color:var(--lime);width:16px;height:16px;flex:0 0 auto}
.su-addon:has(input:checked){border-color:var(--line);background:var(--win)}
.su-addon:has(input:disabled){opacity:.7;cursor:default}
.su-addon-price{font-family:var(--mono);font-size:12px;color:var(--muted);margin-left:4px}
.su-terms{display:flex;gap:10px;align-items:flex-start;margin:4px 0 8px;font-size:14px}
.su-terms input{margin:3px 0 0;accent-color:var(--lime);width:16px;height:16px;flex:0 0 auto}
.su-terms a{color:var(--ink)}
.su-body .bk-grid{margin-bottom:6px}
.su-body .row{margin-top:6px}
.su-body .bk-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:860px){.su-plans{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.su-plans{grid-template-columns:1fr}.su-body{padding:14px 14px 18px}}
/* standalone pages: signup.html, welcome.html, cancelled.html */
.signup-page{padding-bottom:24px}
.welcome-page{padding:48px 0 40px;max-width:66ch}
.welcome-page h1{font-size:clamp(30px,4.6vw,48px)}
.welcome-steps{list-style:none;padding:0;margin:18px 0;display:grid;gap:10px}
.welcome-steps li{border:1px solid var(--line);border-radius:8px;background:var(--win);padding:12px 14px;box-shadow:2px 2px 0 var(--hair);display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.welcome-steps .n{font:600 11px var(--mono);letter-spacing:.1em;color:var(--lime-ink);background:var(--lime);border:1px solid var(--line);border-radius:4px;padding:2px 6px;margin-top:2px}
.welcome-steps h3{margin:0 0 2px;font-size:16px}
.welcome-steps p{margin:0;font-size:14.5px;color:var(--ink-2)}
.welcome-page .row{margin-top:18px}
/* Add-on quantities (extra mailboxes, seats, hosted dashboards) */
.su-extras{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.su-extras[hidden]{display:none}
.su-extra{display:flex;flex-direction:column;gap:4px;border:1px solid var(--hair);border-radius:8px;padding:10px 12px;background:var(--paper-2);font-size:14px}
.su-extra .su-addon-price{margin-left:0}
.su-extra input{width:6em}
.su-setup{color:var(--ink-2)}
@media (max-width:560px){.su-extras{grid-template-columns:1fr}}

/* Affiliates window (site/affiliate.js): same frame and form styles as Sign up. */
.affiliate-widget .af-login{margin-top:20px;padding-top:14px;border-top:1px solid currentColor;border-top-color:color-mix(in srgb,currentColor 18%,transparent)}
.affiliate-widget .af-login .row input{flex:1;min-width:200px}
.affiliate-widget .af-msg.ok{color:#2f7d32}
.affiliate-widget select,.affiliate-widget textarea{width:100%}