/* ============================================================
   FREE AGENT ($FREEAGENT) -- design tokens, locked
   reference: sports-draft press table + signing desk, not SaaS
   palette sampled off the approved avatar/banner art
   ============================================================ */
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/barlow-condensed-latin-400-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/barlow-condensed-latin-600-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/barlow-condensed-latin-700-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url("assets/fonts/barlow-condensed-latin-800-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/barlow-latin-400-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/barlow-latin-500-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/barlow-latin-600-normal.woff2") format("woff2");}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/space-mono-latin-400-normal.woff2") format("woff2");}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/space-mono-latin-700-normal.woff2") format("woff2");}

:root{
  --navy-deep:#0B1B33;
  --navy:#11315C;
  --navy-mid:#153768;
  --navy-light:#1F4578;
  --cream:#FFEDC5;
  --white-warm:#FFFFF5;
  --vest:#BE6533;
  --gold:#D9A441;
  --gold-bright:#F0CB7A;
  --red-status:#C23B32;
  --green-status:#3FAE6B;
  --ink:#0B1B33;

  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:32px; --sp-5:48px; --sp-6:64px; --sp-7:96px;

  --font-display:"Barlow Condensed", "Arial Narrow", sans-serif;
  --font-body:"Barlow", "Helvetica Neue", Arial, sans-serif;
  --font-mono:"Space Mono", "Courier New", monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  background:
    radial-gradient(1200px 700px at 50% -10%, var(--navy-light) 0%, var(--navy-mid) 42%, var(--navy-deep) 100%);
  color:var(--white-warm);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.5;
  min-height:100vh;
}

img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:0.02em;margin:0;}

/* ---------------- ticker ---------------- */
.ticker{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--sp-2);
  background:var(--navy-deep);
  border-bottom:1px solid rgba(217,164,65,0.35);
  padding:6px var(--sp-2);
  font-family:var(--font-mono);
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
}
.ticker-row{display:flex;align-items:center;gap:10px;min-width:0;}
.ticker-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--green-status);
  box-shadow:0 0 6px var(--green-status);
  flex:0 0 auto;
  animation:pulse 1.6s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){.ticker-dot{animation:none;}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.35;}}
.ticker-label{color:var(--gold);letter-spacing:0.12em;flex:0 0 auto;}
.ticker-text{
  color:var(--white-warm);
  overflow:hidden;
  text-overflow:ellipsis;
  min-width:0;
}
.ticker-count{color:rgba(255,255,245,0.55);flex:0 0 auto;}

/* ---------------- topbar ---------------- */
.topbar{
  position:sticky; top:29px; z-index:39;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap;
  gap:var(--sp-2);
  padding:var(--sp-2) var(--sp-3);
  background:rgba(11,27,51,0.92);
  border-bottom:1px solid rgba(255,237,197,0.1);
}
.brand{font-family:var(--font-display);font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:0.02em;}
.brand-ticker{color:var(--gold);font-size:15px;margin-left:8px;font-weight:600;}
.topbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

.ca-chip{
  display:flex; align-items:center; gap:8px;
  background:var(--navy-mid);
  border:1px solid rgba(217,164,65,0.5);
  padding:7px 12px;
  cursor:pointer;
  color:var(--white-warm);
  font-family:var(--font-mono);
  position:relative;
}
.ca-chip:hover{border-color:var(--gold);}
.ca-label{color:var(--gold);font-size:11px;letter-spacing:0.1em;}
.ca-value{font-size:13px;}
.ca-copied{
  position:absolute; top:-26px; right:0;
  background:var(--green-status); color:var(--navy-deep);
  font-family:var(--font-body); font-weight:600; font-size:11px;
  padding:2px 8px;
  opacity:0; transform:translateY(4px);
  transition:opacity .18s ease, transform .18s ease;
  pointer-events:none;
}
.ca-copied.show{opacity:1;transform:translateY(0);}

.btn{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 16px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:15px;
  letter-spacing:0.03em;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
}
.btn-ghost{border-color:rgba(255,237,197,0.4);background:transparent;color:var(--white-warm);}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-bright);}
.btn-gold{background:var(--gold);color:var(--navy-deep);}
.btn-gold:hover{background:var(--gold-bright);}

/* ---------------- hero ---------------- */
.hero{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:var(--sp-4);
  padding:var(--sp-5) var(--sp-3) var(--sp-4);
  max-width:1280px;
  margin:0 auto;
  align-items:start;
}
@media (max-width:920px){
  .hero{grid-template-columns:1fr;}
}

.jumbotron{cursor:pointer;outline:none;}
.jumbotron-bezel{
  position:relative;
  background:#06101f;
  padding:14px;
  border:3px solid #061022;
  box-shadow:
    inset 0 0 0 2px rgba(217,164,65,0.55),
    inset 3px 3px 0 rgba(255,255,255,0.08),
    inset -3px -3px 0 rgba(0,0,0,0.6),
    0 18px 0 -10px rgba(0,0,0,0.5);
}
.jumbotron-screen{width:100%;height:auto;display:block;}
.flashbulb{
  position:absolute; inset:14px;
  background:#fff;
  opacity:0;
  pointer-events:none;
}
.flashbulb.fire{animation:flash 420ms ease-out;}
@keyframes flash{0%{opacity:0.92;}100%{opacity:0;}}
@media (prefers-reduced-motion: reduce){
  .flashbulb.fire{animation:none;opacity:0;}
}
.confetti{
  position:absolute; inset:0;
  width:100%; height:100%;
  pointer-events:none;
}

.status-pill{
  margin-top:14px;
  display:inline-flex; align-items:center; gap:8px;
  background:var(--navy-deep);
  border:1px solid rgba(217,164,65,0.4);
  padding:7px 14px;
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:0.06em;
  font-size:15px;
}
.status-dot{width:9px;height:9px;border-radius:50%;background:var(--red-status);box-shadow:0 0 7px var(--red-status);}
.status-pill.signed .status-dot{background:var(--green-status);box-shadow:0 0 7px var(--green-status);}

.console{
  background:var(--navy-mid);
  border:1px solid rgba(217,164,65,0.3);
  padding:var(--sp-4);
}
.console-title{font-size:30px;font-weight:800;}
.console-sub{color:rgba(255,237,197,0.75);margin:8px 0 var(--sp-3);font-size:15px;}

.fee-readout{display:flex;align-items:baseline;gap:12px;margin-bottom:10px;}
.fee-label{font-family:var(--font-mono);color:var(--gold);font-size:13px;letter-spacing:0.14em;}
.fee-value{font-family:var(--font-display);font-weight:800;font-size:48px;color:var(--cream);line-height:1;}

.fee-slider{
  -webkit-appearance:none; appearance:none;
  width:100%;
  height:6px;
  background:linear-gradient(90deg,var(--gold) var(--p,16%),var(--navy-deep) var(--p,16%));
  border:1px solid rgba(217,164,65,0.55);
  height:8px;
  margin:var(--sp-2) 0 6px;
  cursor:pointer;
}
.fee-slider::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:22px; height:22px;
  background:var(--gold);
  border:2px solid var(--navy-deep);
}
.fee-slider::-moz-range-thumb{
  width:22px; height:22px;
  background:var(--gold);
  border:2px solid var(--navy-deep);
  border-radius:0;
}
.fee-flavor{
  font-size:14px;
  color:rgba(255,237,197,0.8);
  min-height:38px;
  margin:0 0 var(--sp-3);
}

.btn-hire{width:100%;justify-content:center;padding:14px;font-size:18px;}
.signings-line{
  font-family:var(--font-mono);
  font-size:12px;
  color:rgba(255,237,197,0.6);
  margin:var(--sp-2) 0 0;
  text-align:center;
}

/* ---------------- desk (banner photo band) ---------------- */
.desk{max-width:1280px;margin:0 auto;padding:0 var(--sp-3) var(--sp-5);}
.desk-photo{margin:0;border:1px solid rgba(217,164,65,0.3);}
.desk-photo img{width:100%;}
.desk-photo figcaption{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--gold);
  background:var(--navy-deep);
  padding:10px 14px;
}

/* ---------------- contract ---------------- */
.contract, .faq{max-width:1280px;margin:0 auto;padding:var(--sp-5) var(--sp-3);}
.contract h2, .faq h2{font-size:34px;font-weight:800;margin-bottom:var(--sp-3);color:var(--cream);}

.clause-list{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  margin:0;
  border-top:1px solid rgba(217,164,65,0.25);
}
@media (max-width:700px){.clause-list{grid-template-columns:1fr;}}
.clause{
  display:flex; justify-content:space-between; gap:var(--sp-2);
  padding:14px 4px;
  border-bottom:1px solid rgba(217,164,65,0.25);
}
.clause dt{font-family:var(--font-mono);color:var(--gold);font-size:13px;letter-spacing:0.05em;flex:0 0 auto;}
.clause dd{margin:0;text-align:right;color:var(--white-warm);font-size:15px;}

/* ---------------- faq ---------------- */
.faq-item{
  padding:var(--sp-2) 0;
  border-bottom:1px solid rgba(217,164,65,0.2);
}
.faq-item h3{font-family:var(--font-body);font-weight:600;font-size:17px;text-transform:none;color:var(--cream);margin-bottom:6px;}
.faq-item p{margin:0;color:rgba(255,237,197,0.78);font-size:15px;}


/* ---------------- footer ---------------- */
.site-footer{
  border-top:1px solid rgba(217,164,65,0.25);
  background:var(--navy-deep);
  padding:var(--sp-4) var(--sp-3) var(--sp-5);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-3);
}
.footer-ca{display:flex;align-items:center;gap:10px;}
.footer-links{display:flex;gap:var(--sp-3);font-family:var(--font-display);font-weight:700;letter-spacing:0.04em;text-transform:uppercase;}
.footer-links a{text-decoration:none;}
.footer-links a:hover{color:var(--gold);}
.footer-note{
  width:100%;
  font-family:var(--font-mono);
  font-size:12px;
  color:rgba(255,237,197,0.45);
  margin:0;
}

@media (max-width:420px){
  .fee-value{font-size:38px;}
  .console-title{font-size:24px;}
  .topbar{top:33px;}
}

/* ---------------- team board (review pass) ---------------- */
.board{border:1px solid rgba(217,164,65,0.3);background:var(--navy-deep);margin:0 0 var(--sp-3);}
.board-head,.board-row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px;padding:9px 14px;align-items:center;}
.board-head{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;color:var(--gold);border-bottom:1px solid rgba(217,164,65,0.3);}
.board-list{list-style:none;margin:0;padding:0;}
.board-row{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:0.02em;color:rgba(255,237,197,0.35);border-bottom:1px solid rgba(255,237,197,0.07);transition:color .2s,background .2s;}
.board-row .b-cap{font-family:var(--font-mono);font-weight:400;font-size:14px;}
.board-row .b-state{font-family:var(--font-mono);font-size:13px;letter-spacing:0.12em;justify-self:start;padding:2px 10px;border:1px solid currentColor;}
.board-row.is-in{color:var(--cream);background:rgba(217,164,65,0.07);}
.board-row.is-in .b-state{background:var(--green-status);border-color:var(--green-status);color:var(--navy-deep);}
.board-foot{margin:0;padding:9px 14px;font-family:var(--font-mono);font-size:12px;color:rgba(255,237,197,0.75);}

/* mobile: the wrapped 3-row topbar must not pin over a quarter of the screen */
@media (max-width:700px){
  .topbar{position:static;}
  .board-head,.board-row{grid-template-columns:1.2fr .8fr 1fr;padding:8px 10px;}
  .board-head span:last-child{font-size:10px;}
}