/* TEAM view (#team). Bento layout approved as "ForestLink Team Page (Copy)".
   Everything is scoped to #fl-team-band so it cannot affect the rest of the page. */

#fl-team-band {
  --paper: #FBFAF6;
  --card: #FFFFFF;
  --ink: #141713;
  --text: #3E4A42;
  --muted: #5A6282;
  --green: #1D7A3E;
  --lime: #D7FA5A;
  --forest: #0D1712;
  --mint: #E2F5E7;
  --line: rgba(20, 30, 25, 0.10);
  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  background: var(--paper);
  color: var(--text);
  padding: 40px 40px 80px;
}
#fl-team-band .fl-team-wrap { max-width: 1240px; margin: 0 auto; }

#fl-team-band .mono { font-family: var(--mono); }
#fl-team-band .eyebrow { font-family: var(--mono); font-size: 12.5px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--green); display: inline-flex; align-items: center; gap: 10px; }
#fl-team-band .pulse { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: fl-team-pulse 2.2s infinite; }
@keyframes fl-team-pulse { 0% { box-shadow: 0 0 0 0 rgba(215,250,90,0.6); } 70% { box-shadow: 0 0 0 10px rgba(215,250,90,0); } 100% { box-shadow: 0 0 0 0 rgba(215,250,90,0); } }
#fl-team-band .clock { font-family: var(--mono); font-size: 11.5px; font-weight: 500; color: var(--muted); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
#fl-team-band .dot { width: 12px; height: 12px; color: var(--green); flex-shrink: 0; display: inline-flex; }
#fl-team-band .dot svg { width: 100%; height: 100%; display: block; }
#fl-team-band .dot.off { color: #B7BEB6; }
#fl-team-band .c-person.dark .dot { color: var(--lime); }
#fl-team-band .c-person.dark .dot.off { color: rgba(255,255,255,0.4); }

#fl-team-band .c-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
#fl-team-band .c-tile { border-radius: 26px; padding: 26px; position: relative; overflow: hidden; min-width: 0; }
#fl-team-band .c-intro { grid-column: span 2; grid-row: span 2; background: var(--forest); color: #fff; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; min-height: 420px; }
#fl-team-band .c-intro .eyebrow { color: var(--lime); }
#fl-team-band .c-intro h1 { margin: 16px 0 0; font-size: clamp(30px, 4.4vw, 58px); line-height: 1; letter-spacing: -0.04em; font-weight: 800; text-wrap: balance; }
#fl-team-band .c-intro h1 em { font-style: normal; color: #fff; white-space: nowrap; }
#fl-team-band .c-intro h1 .c-driven { color: var(--lime); }
#fl-team-band .c-intro p { margin: 0; font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,0.72); max-width: 30em; }
#fl-team-band .c-intro canvas { position: absolute; right: -40px; bottom: -40px; width: 320px; height: 320px; opacity: 0.6; pointer-events: none; }

#fl-team-band .c-person { background: var(--card); box-shadow: 0 12px 26px -16px rgba(20,30,25,0.4); display: flex; flex-direction: column; gap: 14px; min-height: 200px; }
#fl-team-band .c-person.alt { background: var(--mint); box-shadow: none; }
#fl-team-band .c-person.dark { background: #13261C; color: #fff; box-shadow: none; }
#fl-team-band .c-big { font-size: 64px; font-weight: 800; letter-spacing: -0.06em; line-height: 0.85; color: var(--green); }
#fl-team-band .c-person.dark .c-big { color: var(--lime); }
#fl-team-band .c-person h3 { margin: 0; font-size: 19px; font-weight: 800; letter-spacing: -0.015em; color: var(--ink); line-height: 1.2; }
#fl-team-band .c-person.dark h3 { color: #fff; }
#fl-team-band .c-person .c-role { font-size: 13.5px; font-weight: 600; color: var(--green); margin-top: 2px; }
#fl-team-band .c-person.dark .c-role { color: rgba(215,250,90,0.85); }
#fl-team-band .c-meta { margin-top: auto; display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
#fl-team-band .c-meta .row { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
#fl-team-band .c-person.dark .clock, #fl-team-band .c-person.dark .c-meta { color: rgba(255,255,255,0.7); }
#fl-team-band .c-links { display: flex; gap: 6px; flex-wrap: wrap; }
#fl-team-band .c-links a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 999px; background: rgba(29,122,62,0.09); color: var(--green); font-weight: 700; font-size: 12.5px; text-decoration: none; }
#fl-team-band .c-person.dark .c-links a { background: rgba(255,255,255,0.1); color: #fff; }
#fl-team-band .c-links a:hover { background: var(--green); color: #fff; }

#fl-team-band .c-stat { background: var(--lime); color: var(--ink); display: flex; flex-direction: column; justify-content: flex-start; gap: 14px; min-height: 200px; }
#fl-team-band .c-stat .c-big { font-size: 64px; font-weight: 800; letter-spacing: -0.06em; line-height: 0.85; color: var(--forest); }
#fl-team-band .c-stat h3 { margin: 0; font-size: 19px; font-weight: 800; letter-spacing: -0.015em; color: var(--ink); line-height: 1.2; }
#fl-team-band .c-stat .c-stat-msg { margin-top: 6px; font-size: 14px; font-weight: 600; line-height: 1.35; color: var(--ink); }
#fl-team-band .c-stat .c-links { margin-top: auto; flex-direction: column; align-items: flex-start; }
#fl-team-band .c-stat .c-links a { background: rgba(20,23,19,0.1); color: var(--ink); }
#fl-team-band .c-stat .c-links a:hover { background: var(--ink); color: var(--lime); }

#fl-team-band .c-offices { background: var(--card); box-shadow: 0 12px 26px -16px rgba(20,30,25,0.4); display: flex; flex-direction: column; gap: 12px; min-height: 200px; }
#fl-team-band .c-offices .mono { font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 800; color: var(--green); white-space: nowrap; }
#fl-team-band .c-office { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
#fl-team-band .c-office b { font-size: 15px; color: var(--ink); }
#fl-team-band .c-office .clock { font-size: 13px; }

@media (max-width: 1080px) {
  #fl-team-band .c-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  #fl-team-band { padding: 28px 20px 56px; }
}
@media (max-width: 620px) {
  #fl-team-band .c-grid { grid-template-columns: minmax(0, 1fr); }
  #fl-team-band .c-intro { grid-column: auto; grid-row: auto; min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #fl-team-band .pulse { animation: none; }
}
