/* The Client Community sign-in page. It follows the visitor's system
   setting: navy when dark, cream when light, the site's two grounds. Every
   color is a site token from styles.css, and text meets WCAG AA on both. */

.home-body{
  --h-bg:var(--navy); --h-card:var(--card-navy); --h-ink:var(--on-navy);
  --h-ink2:var(--muted-navy); --h-ink3:var(--muted-navy); --h-line:var(--line-navy);
  --h-grid:color-mix(in srgb,var(--line-navy) 60%,var(--card-navy));
  --h-accent:var(--emerald); --h-accent-ink:var(--navy);
  --h-sting:var(--red-on-navy); --h-c5:var(--muted-navy);
  --h-ok-bg:color-mix(in srgb,var(--emerald) 7%,var(--card-navy)); --h-ok:var(--emerald);
  --h-wait-bg:color-mix(in srgb,var(--amber-on-navy) 7%,var(--card-navy)); --h-wait:var(--amber-on-navy);
  --h-alert-bg:color-mix(in srgb,var(--red-on-navy) 7%,var(--card-navy)); --h-alert:var(--red-on-navy);
  --h-tag-bg:color-mix(in srgb,var(--red-on-navy) 7%,var(--card-navy)); --h-tag:var(--red-on-navy);
  background:var(--h-bg);color:var(--h-ink);
}
@media (prefers-color-scheme:light){
  .home-body{
    --h-bg:var(--cream); --h-card:var(--card-cream); --h-ink:var(--on-cream);
    --h-ink2:var(--muted-cream); --h-ink3:var(--muted-cream); --h-line:var(--line-cream);
    --h-grid:color-mix(in srgb,var(--line-cream) 70%,var(--card-cream));
    --h-accent:var(--navy); --h-accent-ink:var(--cream);
    --h-sting:var(--amber-on-cream); --h-c5:var(--muted-cream);
    --h-ok-bg:var(--emerald-soft); --h-ok:var(--on-cream);
    --h-wait-bg:color-mix(in srgb,var(--amber-on-cream) 5%,var(--card-cream)); --h-wait:var(--amber-on-cream);
    --h-alert-bg:var(--navy); --h-alert:var(--cream);
    --h-tag-bg:color-mix(in srgb,var(--amber-on-cream) 5%,var(--card-cream)); --h-tag:var(--amber-on-cream);
  }
}

.home{padding-top:var(--nav-h)}
.home h1,.home h2,.home h3{font-family:"Manrope",system-ui,sans-serif;font-weight:700;line-height:1.15;margin:0;text-wrap:balance;color:var(--h-ink)}
.home p{margin:0}
.home a{color:var(--h-accent)}
.home :focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px}
.home-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--h-ink3)}

.home-btn{display:inline-flex;align-items:center;border-radius:999px;padding:10px 20px;text-decoration:none;font-size:15px;font-weight:700;border:1px solid var(--h-line);color:var(--h-ink)!important;background:var(--h-card)}
.home-btn:hover{border-color:var(--emerald)}
.home-btn--primary{background:var(--emerald);border-color:var(--emerald);color:var(--navy)!important}
.home-btn--primary:hover{opacity:.9}
.home-cap{font-size:14px;color:var(--h-ink2)}

/* the Client Community sign-in */
.cc-signin{min-height:calc(100vh - 120px);display:grid;place-items:center;padding:calc(var(--nav-h) + 48px) 16px 64px}
.cc-card{background:var(--h-card);border:1px solid var(--h-line);border-radius:var(--r-card);padding:28px;width:min(420px,100%);display:grid;gap:14px}
.cc-card h1{font-size:26px}
.cc-card label{font-size:13px;color:var(--h-ink2);display:grid;gap:6px}
.cc-card input{font:inherit;font-size:15px;border:1px solid var(--h-line);border-radius:10px;padding:10px 12px;background:var(--h-bg);color:var(--h-ink)}
.cc-card input::placeholder{color:var(--h-ink3)}
.cc-card input:focus-visible{outline:none;box-shadow:var(--ring);border-color:var(--emerald)}
.cc-card .home-btn{justify-content:center;cursor:pointer;font:inherit;font-weight:700}
.cc-fine{font-size:12.5px;color:var(--h-ink2)}
