/* Signature Farm Payroll — redesign layer (2026-09-19). Matches the Signature family
   (Sig / WCE / Bond / Health / EOI / CertWatch / CRM): royal blue + deep navy + neon green.
   Linked LAST in signup.html, get-info.html, index.html (farmer app) and w.html (worker PWA).
   The --green* tokens were this product's primary colour; re-pointing them moves every rule
   that uses them to royal/navy. Real "good" states (SIGNED pill, success notes) are pinned back
   to green below — a status colour must not follow the brand colour.
   Rollback: remove the <link href="/redesign.css?v=N">. Bump ?v= on every edit. */
:root {
  --green: #1240ab; --green-d: #0d2a6e; --green-dd: #0b1f3a;
  --ink: #0b1f3a; --body: #33415a; --muted: #5b6b85; --line: #e3eaf6; --bg: #f3f6fb;
  --neon: #39ff14; --royal2: #1d4ed8; --soft: #eef3ff; --soft2: #dbe6ff; --soft-line: #c9d6f2;
  --shadow: 0 1px 2px rgba(11,31,58,.04), 0 8px 24px rgba(11,31,58,.07);
  --shadow-lg: 0 14px 40px rgba(11,31,58,.16);
}

/* ═════════ Sales page (signup.html) ═════════ */
.hero-veil { background: linear-gradient(110deg, rgba(13,42,110,.94) 0%, rgba(18,64,171,.8) 45%, rgba(18,64,171,.35) 100%) !important; }
.hero-veil2 { background: linear-gradient(to top, rgba(11,31,58,.55), transparent 38%) !important; }
.hero { border-bottom: 5px solid var(--neon); }
.hero h1 .hl { color: var(--neon) !important; }
.pill .dot { background: var(--neon) !important; box-shadow: 0 0 0 4px rgba(57,255,20,.22) !important; }
nav a.login { color: var(--green) !important; }
nav a.login:hover { background: var(--soft) !important; color: var(--green-dd) !important; }
.btn-primary { background: var(--neon) !important; color: var(--green-dd) !important; box-shadow: 0 6px 18px rgba(57,255,20,.32) !important; }
.btn-primary:hover { background: #5bff3d !important; box-shadow: 0 10px 26px rgba(57,255,20,.42) !important; }
.btn-light { color: var(--green) !important; }
.btn-light:hover { background: var(--soft) !important; }
.stats { background: var(--green-dd) !important; }
.eyebrow { color: var(--green) !important; }
.sec-head h2::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 4px; background: var(--neon); margin: 14px auto 0; }
.feat .ico { background: linear-gradient(180deg, var(--soft), var(--soft2)) !important; border-color: var(--soft-line) !important; }
.feat { border-top: 4px solid var(--green) !important; }
.ticks li:before { background: var(--soft) !important; color: var(--green) !important; }
.chat .out { background: var(--soft2) !important; color: var(--green-dd) !important; }
ul.checks li:before { color: #15803d !important; }
.price-card { border-top: 5px solid var(--neon) !important; }
.price-card .ribbon { background: var(--green) !important; }
.tiers .free, .tiers .free b { color: #15803d !important; }
.signup { background: linear-gradient(160deg, #0b1f3a 0%, #0d2a6e 60%, #1240ab 100%) !important; border-top: 5px solid var(--neon); }
.form-card input:focus { border-color: var(--green) !important; box-shadow: 0 0 0 4px rgba(18,64,171,.14) !important; }
.seg-btn.on, .seg-btn.active, .seg-btn[aria-pressed="true"] { border-color: var(--green) !important; background: var(--soft) !important; color: var(--green-dd) !important; }
.seg-btn.on small, .seg-btn.active small { color: var(--green) !important; }
.ok-box h3 { color: #15803d !important; }
footer { background: var(--green-dd) !important; color: #aebbd3 !important; border-top: 5px solid var(--neon); }
footer a { color: #e2e8f5 !important; }

/* ═════════ Info-packet page (get-info.html) ═════════ */
body.gi-page { background: linear-gradient(150deg, #0b1f3a 0%, #1240ab 60%, #0b1f3a 100%) !important; }
.brand .logo { background: linear-gradient(150deg, #0b1f3a, #1240ab) !important; }
.success { background: #dcfce7 !important; color: #14532d !important; border-left-color: #15803d !important; }

/* ═════════ Farmer app + worker page (styles.css) ═════════ */
button { background: linear-gradient(180deg, #1d4ed8, #1240ab); box-shadow: 0 4px 12px rgba(18,64,171,.24); }
button:hover:not(:disabled) { box-shadow: 0 8px 20px rgba(18,64,171,.34); }
button.ghost { background: #fff; color: var(--green); }
button.ghost:hover:not(:disabled) { border-color: var(--green); background: var(--soft); }
button.danger { background: #fff; }
button.sm:not(.ghost):not(.danger) { box-shadow: 0 2px 6px rgba(18,64,171,.22); }
input:focus, select:focus { box-shadow: 0 0 0 4px rgba(18,64,171,.13); }
nav.tabs a.active { background: var(--soft); color: var(--green); }
.home-card .ico, .promo .ico { background: linear-gradient(180deg, var(--soft), var(--soft2)) !important; border-color: var(--soft-line) !important; }
.promo-cta { background: linear-gradient(180deg, #1d4ed8, #1240ab) !important; box-shadow: 0 4px 12px rgba(18,64,171,.24) !important; }
.promo-cta.done { background: var(--soft) !important; color: var(--green) !important; border-color: var(--soft-line) !important; }
.wcq-note { background: var(--soft) !important; border-color: var(--soft-line) !important; }
/* statuses stay green */
.pill.signed { color: #166534 !important; border-color: #b6e6c8 !important; background: #eafaf0 !important; }

/* login screen photo wash + chips */
.login-wrap::after { background: linear-gradient(150deg, rgba(11,31,58,.93), rgba(18,64,171,.78)) !important; }
.login-logo { background: linear-gradient(180deg, var(--soft), var(--soft2)) !important; border-color: var(--soft-line) !important; }
.login-card .tag, .login-tag { color: var(--green) !important; background: var(--soft) !important; border-color: var(--soft-line) !important; }
.home-card:hover { border-color: var(--soft-line) !important; }
.promo-mark { background: linear-gradient(180deg, var(--soft), var(--soft2)) !important; border-color: var(--soft-line) !important; }
.promo-save { color: var(--green) !important; background: var(--soft) !important; border-color: var(--soft-line) !important; }
.w-brand { color: var(--green) !important; }
.brand-badge { color: var(--green) !important; background: var(--soft) !important; border-color: var(--soft-line) !important; }
/* info-packet page button (its own .btn, inline-styled green) */
body.gi-page .btn { background: var(--neon) !important; color: var(--green-dd) !important; box-shadow: 0 6px 18px rgba(57,255,20,.3) !important; }
body.gi-page .card { border-top: 5px solid var(--neon); }
/* 2026-09-19: badge logo replaces the 🌾 */
.fp-logo { display: block; width: auto; height: 100%; max-height: 52px; }
.brand .logo, .login-logo { background: none !important; border: 0 !important; box-shadow: none !important; }
nav .brand .fp-logo, .brand .fp-logo { height: 52px; }
.login-logo { width: auto !important; height: 72px !important; display: flex !important; justify-content: center; }
.login-logo .fp-logo { height: 72px; max-height: 72px; }
span.logo .fp-logo { display: inline-block; height: 34px; vertical-align: middle; margin-right: 8px; }