/* ============================================================
   SBA Prospect Formation Alpha — shared stylesheet
   Mission KIMI-CODE-PF-ALPHA-001 (A12 accessibility foundation).
   Token layer is verbatim from selected-palette/specs/
   token-spec-and-mapping.md §1 (owner-selected palette).
   No external fonts, no network references.
   ============================================================ */

/* === SBA SELECTED PALETTE (owner decision) — semantic tokens === */
:root{
  /* brand anchors */
  --navy:#0B1F3A; --ivory:#FFF8E7; --gold:#8A6D1D; --silver-gray:#6B7280; --white:#FFFFFF;
  /* surfaces */
  --surface-page:#FFFFFF; --surface-subtle:#FCFAF5; --surface-card:#FFFFFF;
  --surface-warm:#FFF8E7; --surface-inverse:#0B1F3A;
  /* text */
  --text-primary:#1A1A2E; --text-secondary:#374151; --text-muted:#6B7280;
  --text-on-inverse:#FFFFFF; --text-on-inverse-soft:#DDE3EE; --text-on-inverse-muted:#C9D4E8;
  /* brand / structure */
  --brand:#0B1F3A;
  /* actions */
  --action-primary-bg:#0B1F3A; --action-primary-text:#FFFFFF;
  --action-primary-hover:#17325F; --action-primary-active:#071426;
  --action-secondary-bg:#FFFFFF; --action-secondary-text:#0B1F3A; --action-secondary-border:#0B1F3A;
  --action-accent-bg:#8A6D1D; --action-accent-text:#FFFFFF; --action-accent-hover:#755C17;
  /* links */
  --link:#1D4FA8; --link-hover:#17325F; --link-on-inverse:#FFFFFF;
  /* focus (luminance ring, never hue alone) */
  --focus:#0B1F3A; --focus-on-inverse:#FFF8E7;
  /* borders */
  --border:#E5E7EB; --border-strong:#6B7280; --border-on-inverse:#6B7280;
  /* selected state */
  --state-selected-bg:#0B1F3A; --state-selected-text:#FFFFFF; --state-selected-border:#0B1F3A;
  /* status (functional hues retained from incumbent; not brand accents) */
  --success-text:#0E5225; --success-bg:#F0FFF4; --success-border:#1A8C3E;
  --warning-text:#6B5310; --warning-bg:#FFF8E7; --warning-border:#8A6D1D;
  --error-text:#C0392B; --error-bg:#FDE8E8; --error-border:#C0392B;
  /* disclosure text */
  --text-disclosure:#6B7280;
  --text-disclosure-on-inverse:#C9D4E8;
  /* decorative accent (never sole carrier of meaning) */
  --accent-gold:#8A6D1D; --accent-ivory:#FFF8E7; --accent-silver:#DDE3EE;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Segoe UI',Arial,Helvetica,sans-serif;
  font-size:17px;line-height:1.6;
  color:var(--text-primary);background:var(--surface-page);
  padding-bottom:72px; /* room for the fixed help bar */
}
main{display:block;max-width:960px;margin:0 auto;padding:24px 20px 32px}
h1{font-size:1.9rem;line-height:1.25;color:var(--brand);margin:0 0 12px}
h2{font-size:1.35rem;color:var(--brand);margin:32px 0 10px}
h3{font-size:1.1rem;color:var(--brand);margin:0 0 8px}
p{margin:0 0 14px}
a{color:var(--link);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--link-hover)}
ul,ol{padding-left:24px}
li{margin-bottom:8px}

/* skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:11000;
  background:var(--surface-inverse);color:var(--text-on-inverse);
  padding:10px 18px;font-weight:700;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;color:var(--text-on-inverse)}

/* alpha provenance banner */
.alpha-banner{
  margin:0;background:var(--surface-warm);color:var(--warning-text);
  border-bottom:2px solid var(--warning-border);
  padding:10px 20px;font-size:.92rem;
}
.alpha-banner a{color:var(--warning-text)}

/* header */
.site-header{background:var(--surface-inverse);color:var(--text-on-inverse)}
.header-inner{
  max-width:960px;margin:0 auto;padding:14px 20px;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.brand{
  color:var(--text-on-inverse);text-decoration:none;font-weight:700;font-size:1.15rem;
}
.brand-tag{
  display:inline-block;vertical-align:middle;margin-left:6px;
  font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  background:var(--gold);color:var(--action-accent-text);
  padding:2px 8px;border-radius:999px;
}
.header-phone{
  margin-left:auto;color:var(--link-on-inverse);font-weight:700;
  background:var(--gold);color:var(--action-accent-text);
  padding:8px 16px;border-radius:999px;text-decoration:none;
  border:2px solid transparent;
}
.header-phone:hover{background:var(--action-accent-hover);color:var(--action-accent-text)}
.header-phone-label{font-weight:400}
.nav-toggle{
  display:none;margin-left:auto;
  background:transparent;color:var(--text-on-inverse);
  border:2px solid var(--focus-on-inverse);border-radius:8px;
  font:inherit;font-weight:700;padding:8px 16px;cursor:pointer;
}
.site-nav{max-width:960px;margin:0 auto;padding:0 20px 12px}
.site-nav ul{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;
}
.site-nav a{
  color:var(--text-on-inverse-soft);text-decoration:none;font-size:.95rem;
  padding:6px 2px;border-bottom:2px solid transparent;display:inline-block;
}
.site-nav a:hover{color:var(--text-on-inverse)}
.site-nav a[aria-current="page"]{
  color:var(--text-on-inverse);font-weight:700;border-bottom-color:var(--focus-on-inverse);
}

/* hero + lede */
.hero{padding:8px 0 4px}
.lede{font-size:1.1rem;color:var(--text-secondary);max-width:46em}

/* task cards (A01) */
.task-grid{
  list-style:none;margin:16px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;
}
.task-grid li{margin:0}
.task-card{
  display:block;height:100%;padding:18px;
  background:var(--surface-card);border:2px solid var(--border-strong);border-radius:12px;
  text-decoration:none;color:var(--text-primary);
}
.task-card:hover{border-color:var(--brand);background:var(--surface-subtle)}
.task-card-title{display:block;font-weight:700;color:var(--brand);font-size:1.08rem;margin-bottom:6px}
.task-card-desc{display:block;color:var(--text-secondary);font-size:.95rem}

/* buttons */
.btn{
  display:inline-block;padding:12px 22px;border-radius:10px;
  font-weight:700;text-decoration:none;font-size:1rem;cursor:pointer;
  border:2px solid transparent;font-family:inherit;
}
.btn-primary{background:var(--action-primary-bg);color:var(--action-primary-text);border-color:var(--action-primary-bg)}
.btn-primary:hover{background:var(--action-primary-hover);color:var(--action-primary-text);border-color:var(--action-primary-hover)}
.btn-primary:active{background:var(--action-primary-active);border-color:var(--action-primary-active)}
.btn-secondary{background:var(--action-secondary-bg);color:var(--action-secondary-text);border-color:var(--action-secondary-border)}
.btn-secondary:hover{background:var(--surface-subtle);color:var(--action-secondary-text)}
.btn-large{font-size:1.15rem;padding:14px 28px}
.btn-quiet{background:transparent;color:var(--link);border-color:var(--border-strong);font-weight:400;padding:8px 16px}
.btn-quiet:hover{background:var(--surface-subtle)}

/* option cards (human help) */
.option-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;margin-top:16px}
.option-card{background:var(--surface-subtle);border:2px solid var(--border);border-radius:12px;padding:20px}

/* forms */
.field{margin-bottom:16px}
.field label{display:block;font-weight:700;color:var(--text-primary);margin-bottom:4px}
.field input[type="text"],.field input[type="tel"],.field select{
  width:100%;max-width:420px;padding:10px 12px;font:inherit;
  border:2px solid var(--border-strong);border-radius:8px;background:var(--white);color:var(--text-primary);
}
.field-consent{
  background:var(--surface-warm);border:2px solid var(--warning-border);border-radius:10px;padding:14px;
}
.choice{display:flex;gap:10px;align-items:flex-start;font-weight:400;cursor:pointer}
.choice input{margin-top:5px;width:18px;height:18px;flex:none}
.form-done{
  margin-top:16px;background:var(--success-bg);border:2px solid var(--success-border);
  color:var(--success-text);border-radius:10px;padding:16px;
}
.form-done a{color:var(--success-text);font-weight:700}

/* navigator (progressive choices) */
.navigator{margin-top:8px}
.nav-step{
  border:2px solid var(--border-strong);border-radius:12px;padding:18px;margin:0 0 16px;
  background:var(--surface-card);
}
.nav-step legend{font-weight:700;font-size:1.1rem;color:var(--brand);padding:0 8px}
.nav-step .choice{display:flex;padding:10px 8px;border-radius:8px}
.nav-step .choice:hover{background:var(--surface-subtle)}
.nav-result{
  border:2px solid var(--brand);border-radius:12px;padding:20px;margin:16px 0;
  background:var(--surface-subtle);
}
.nav-restart{margin-top:4px}

/* learn list, check list, tradeoffs */
.learn-list li,.check-list li{margin-bottom:10px}
.tradeoff-list{padding-left:0;list-style:none;counter-reset:tradeoff}
.tradeoff-list>li{
  counter-increment:tradeoff;position:relative;margin-bottom:18px;padding:16px 16px 16px 64px;
  background:var(--surface-card);border:2px solid var(--border);border-radius:12px;
}
.tradeoff-list>li::before{
  content:counter(tradeoff);position:absolute;left:16px;top:16px;
  width:32px;height:32px;border-radius:50%;
  background:var(--brand);color:var(--text-on-inverse);
  font-weight:700;display:flex;align-items:center;justify-content:center;
}

/* guardrail boxes */
.guardrail{
  margin:28px 0;background:var(--surface-warm);
  border:2px solid var(--warning-border);border-left-width:8px;border-radius:10px;
  padding:16px 20px;
}
.guardrail-title{margin:0 0 8px;font-size:1.05rem;color:var(--warning-text)}
.guardrail p{margin:0;color:var(--text-secondary)}

/* help card (in-content human escape) */
.help-card{
  margin:32px 0;background:var(--surface-inverse);color:var(--text-on-inverse);
  border-radius:12px;padding:24px;
}
.help-card h2{color:var(--text-on-inverse);margin-top:0}
.help-card p{color:var(--text-on-inverse-soft)}
.help-card .btn-primary{background:var(--gold);border-color:var(--gold);color:var(--action-accent-text)}
.help-card .btn-primary:hover{background:var(--action-accent-hover);border-color:var(--action-accent-hover)}
.help-card .btn-secondary{background:transparent;color:var(--text-on-inverse);border-color:var(--focus-on-inverse)}
.help-card .btn-secondary:hover{color:var(--text-on-inverse);background:rgba(255,255,255,.1)}
.help-card-actions{display:flex;gap:12px;flex-wrap:wrap;margin:0}

/* consent panel (A05) */
.consent-panel{
  margin-top:40px;border-top:2px solid var(--border);padding-top:20px;
}
.consent-panel h2{margin-top:0}
.consent-choice{
  display:flex;gap:12px;align-items:flex-start;padding:12px;margin-bottom:10px;
  border:2px solid var(--border);border-radius:10px;background:var(--surface-card);
}
.consent-choice input{margin-top:5px;width:18px;height:18px;flex:none}
.consent-choice-title{font-weight:700;color:var(--brand)}
.consent-choice-desc{margin:2px 0 0;color:var(--text-secondary);font-size:.95rem}
.consent-status{margin-top:10px;color:var(--text-secondary);font-size:.95rem}

/* footer */
.site-footer{background:var(--surface-inverse);color:var(--text-disclosure-on-inverse);margin-top:40px}
.footer-inner{max-width:960px;margin:0 auto;padding:28px 20px}
.footer-inner p{font-size:.9rem}
.site-footer nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px}
.site-footer a{color:var(--text-on-inverse-soft)}
.site-footer a:hover{color:var(--text-on-inverse)}

/* fixed human-help bar (A03, always visible) */
.help-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:9000;
  display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;
  background:var(--surface-inverse);border-top:2px solid var(--gold);
  padding:10px 16px;
}
.help-bar-call{
  background:var(--gold);color:var(--action-accent-text);font-weight:700;
  padding:10px 22px;border-radius:999px;text-decoration:none;
}
.help-bar-call:hover{background:var(--action-accent-hover);color:var(--action-accent-text)}
.help-bar-more{color:var(--text-on-inverse-soft)}
.help-bar-more:hover{color:var(--text-on-inverse)}

/* focus: dual luminance ring, never hue alone (palette spec addendum B.6) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid #FFFFFF!important;outline-offset:2px;box-shadow:0 0 0 4px #0B1F3A!important;
}

/* reduced motion (palette spec addendum B.5) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto}
}

/* small screens */
@media (max-width:760px){
  body{font-size:16px;padding-bottom:96px}
  .header-inner{padding:12px 16px}
  .header-phone{display:none} /* help bar carries the phone on small screens */
  .nav-toggle{display:inline-block}
  .site-nav{display:none;padding:0 16px 14px}
  .site-nav[data-open="true"]{display:block}
  .site-nav ul{flex-direction:column;gap:2px}
  .site-nav a{padding:10px 2px}
  main{padding:18px 16px 24px}
  h1{font-size:1.55rem}
  .help-bar{padding:10px}
  .help-bar-call{width:100%;text-align:center}
  .help-bar-more{padding:8px}
}
