/* Signed-out pages (sign in, join, enrollment). Matches the landing page:
   Outfit, cream paper with an orange glow, navy ink, orange for the main action.
   Everything is scoped to .public-layout so member pages keep app.css as-is. */
body.public-layout{
  --pa-ink:#14212c;--pa-ink-2:#4a5761;--pa-muted:#6b6258;--pa-line:#ece2d5;--pa-field:#e2d8cb;
  --pa-orange:#e0633a;--pa-orange-hover:#cf5328;--pa-orange-text:#b4532f;--pa-cream:#fbf6ee;
  min-height:100vh;min-height:100svh;display:flex;flex-direction:column;color:var(--pa-ink);
  font:16px/1.6 Outfit,system-ui,sans-serif;background-color:var(--pa-cream);
  background-image:radial-gradient(ellipse 55% 45% at 25% 35%,rgba(239,116,75,.13),transparent 70%),radial-gradient(ellipse 40% 35% at 85% 85%,rgba(255,196,120,.13),transparent 70%);
  background-attachment:fixed}
.public-layout .workspace{flex:1;display:flex;flex-direction:column}
.public-layout :focus-visible{outline:3px solid #d65c35;outline-offset:3px}

/* Header and footer line up with the centred content column */
.public-layout{--pa-gutter:clamp(20px,5vw,64px);--pa-edge:max(var(--pa-gutter),calc((100% - 1120px)/2 + var(--pa-gutter)))}
.public-layout .public-header{height:76px;padding:0 var(--pa-edge);border-bottom:1px solid transparent}
.public-layout .public-header .helloape-mark{width:46px;height:auto}
.public-layout .public-header .helloape-wordmark{font-size:30px;letter-spacing:-1.1px}
.public-layout .public-header nav{gap:10px;font-size:15px}
.public-layout .public-header nav>a:first-child{padding:8px 14px;border-radius:999px;font-weight:500;color:var(--pa-ink)}
.public-layout .public-header nav>a:first-child:hover{background:rgba(255,255,255,.7);color:var(--pa-ink)}
.public-layout .public-header .button.small{min-height:40px;padding:0 18px;gap:8px;border-radius:999px;background:#fff;border:1px solid var(--pa-field);color:var(--pa-ink);font-size:15px;font-weight:600;box-shadow:0 1px 2px rgba(20,33,44,.06)}
.public-layout .public-header .button.small:hover{background:#fffaf4;color:var(--pa-ink)}

/* Page */
.public-layout .main-content{flex:1;width:100%;max-width:1120px;min-height:0;padding:clamp(16px,4vh,48px) var(--pa-gutter) 48px;display:flex;flex-direction:column;justify-content:center}
.public-layout .auth-layout{grid-template-columns:minmax(0,1fr) 440px;gap:clamp(32px,6vw,80px);min-height:0;align-items:center}

/* Welcome text */
.public-layout .auth-intro .eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--pa-orange-text);margin-bottom:16px}
.public-layout .auth-intro h1{font:700 clamp(40px,min(5.4vw,9vh),68px)/1.02 Outfit,system-ui,sans-serif;letter-spacing:-.04em;color:var(--pa-ink);margin-bottom:20px}
.public-layout .auth-intro h1 em{font-style:normal;font-weight:700;color:var(--pa-orange)}
.public-layout .auth-intro .lead{font-size:18px;line-height:1.6;color:var(--pa-ink-2);max-width:440px;margin:0}
.public-layout .auth-promise{margin-top:28px;font-size:14px;color:var(--pa-muted)}

/* Card */
.public-layout .card{background:#fff;border:1px solid var(--pa-line);border-radius:20px}
.public-layout .auth-card{padding:36px;box-shadow:0 1px 2px rgba(20,33,44,.04),0 24px 48px -28px rgba(20,33,44,.22)}
.public-layout .auth-card .eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--pa-muted);margin-bottom:8px}
.public-layout .auth-card h2{font:700 28px/1.2 Outfit,system-ui,sans-serif;letter-spacing:-.02em;color:var(--pa-ink);margin-bottom:20px}
.public-layout .auth-card>p:not(.eyebrow):not(.fine){color:var(--pa-ink-2);font-size:15px}
.public-layout .muted{color:var(--pa-muted);font-size:14px}

/* Fields */
.public-layout form>p{margin:0 0 16px}
.public-layout label,.public-layout .auth-card label{font-size:14px;font-weight:600;color:var(--pa-ink);margin:0 0 6px}
.public-layout input:not([type=checkbox],[type=hidden]),.public-layout textarea,.public-layout select{height:48px;padding:0 14px;font-size:16px;color:var(--pa-ink);background:#fff;border:1px solid var(--pa-field);border-radius:12px;transition:border-color .15s,box-shadow .15s}
.public-layout textarea{height:auto;padding:12px 14px}
.public-layout input:not([type=checkbox],[type=hidden]):hover{border-color:#cdbfae}
.public-layout input:not([type=checkbox],[type=hidden]):focus,.public-layout textarea:focus,.public-layout select:focus{outline:none;border-color:var(--pa-orange);box-shadow:0 0 0 3px rgba(224,99,58,.18)}
.public-layout input:-webkit-autofill{-webkit-box-shadow:0 0 0 40px #fff inset;-webkit-text-fill-color:var(--pa-ink);caret-color:var(--pa-ink)}
.public-layout input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 40px #fff inset,0 0 0 3px rgba(224,99,58,.18)}
.public-layout input::placeholder{color:#a3998d}
.public-layout .helptext{font-size:13px;color:var(--pa-muted);margin-top:4px}
.public-layout .errorlist{color:#a1361f;font-size:14px;margin:0 0 6px}
.public-layout input[type=checkbox]{accent-color:var(--pa-orange)}

/* Buttons: large bold text so white-on-orange meets WCAG large-text contrast */
.public-layout .button{border-radius:999px;background:var(--pa-orange);border-color:var(--pa-orange);color:#fff;font-size:19px;font-weight:700;min-height:52px;gap:10px;transition:background .15s,transform .15s}
.public-layout .button:hover{background:var(--pa-orange-hover);border-color:var(--pa-orange-hover);color:#fff}
.public-layout .button.full{margin-top:8px;box-shadow:0 8px 24px -10px rgba(224,99,58,.8)}
.public-layout .button.secondary{background:#fff;color:var(--pa-ink);border-color:var(--pa-field)}
.public-layout .button.secondary:hover{background:#fffaf4}

/* Notes and links */
.public-layout .form-foot{border-top:1px solid var(--pa-line);margin-top:24px;padding-top:18px;font-size:15px;color:var(--pa-muted)}
.public-layout .form-foot+.form-foot,.public-layout .fine+.form-foot{margin-top:16px}
.public-layout .form-foot a,.public-layout .auth-card a{color:var(--pa-orange-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.public-layout .form-foot a:hover,.public-layout .auth-card a:hover{color:#8f3f22}
.public-layout .fine{font-size:13px;line-height:1.6;color:var(--pa-muted);margin-top:14px}
.public-layout .notice{background:#fff6ec;border:1px solid #f1dcc6;border-radius:12px;padding:14px 18px;font-size:15px;color:var(--pa-ink)}
.public-layout .notice.error,.public-layout .form-error{color:#8f2d1a;background:#fff0eb;border:1px solid #efd3c9;border-radius:12px;padding:12px 14px;font-size:14px}

/* Footer */
.public-layout .footer{border-top:1px solid var(--pa-line);padding:18px var(--pa-edge);font-size:13px;color:var(--pa-muted);letter-spacing:0}

@media(max-width:900px){
  .public-layout .auth-layout{grid-template-columns:minmax(0,1fr) 380px}
  .public-layout .auth-card{padding:28px}
}
@media(max-width:700px){
  .public-layout .public-header{height:auto;padding:14px 20px}
  .public-layout .public-header .helloape-mark{width:38px}
  .public-layout .public-header .helloape-wordmark{font-size:25px}
  .public-layout .public-header nav{gap:4px;font-size:14px}
  .public-layout .public-header .button.small{font-size:14px;padding:0 14px;min-height:38px}
  .public-layout .main-content{padding:12px 16px 32px;justify-content:flex-start}
  .public-layout .auth-layout{grid-template-columns:1fr;gap:20px}
  .public-layout .auth-intro h1{font-size:36px;margin-bottom:10px}
  .public-layout .auth-intro h1 br{display:inline}
  .public-layout .auth-intro .lead{font-size:16px}
  .public-layout .auth-card{padding:24px 20px;border-radius:18px}
}
@media(prefers-reduced-motion:reduce){.public-layout .button,.public-layout input{transition:none}}