/* 182 West brand theme — remaps Crucible Webflow tokens to logo green + charcoal */

:root {
  /* Logo fill #355e3b — forest green */
  --182-green: #355e3b;
  --182-green-soft: #4a7a51;
  --182-green-deep: #2a4a2f;
  --182-charcoal: #0c100c;
  --182-surface: #1c241e;
  --182-surface-raised: #243028;
  --182-ink: #f5f2ea;
  --182-ink-muted: #8a9688;
  --182-cream: #e8f0e9;

  /* Crucible → 182 */
  --text--50: var(--182-ink-muted);
  --text--00: var(--182-ink);
  --text--100: var(--182-charcoal);
  --text--25: #c8d0c6;
  --text--75: var(--182-green-deep);
  --surface--50: var(--182-surface);
  --surface--100: var(--182-charcoal);
  --surface--25: var(--182-green);
  --surface--00: var(--182-cream);
  --surface--75: var(--182-green-deep);
}

html,
body,
.body {
  background-color: var(--182-surface) !important;
  color: var(--182-ink);
}

/* Landing hero — single clean oak plate (no Crucible figure / tech stack) */
.bgimage,
.bgimagescroll {
  background-image: url("./hero-oak.png") !important;
  mix-blend-mode: normal !important;
  background-position: 58% 42% !important;
  background-size: cover !important;
}

/* Hide duplicate plate — one photo only */
.bgimage {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.bgimagescroll {
  opacity: calc(var(--hero-fade, 1) * 0.96) !important;
}

/* Dark wash only — never another copy of the hero photo */
.topscrim {
  background-image: none !important;
  background-color: var(--182-surface) !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 3;
  opacity: calc(var(--hero-fade, 1) * 0.88) !important;
  mix-blend-mode: normal !important;
}

/* Kill leftover Crucible FX: p5 host, mouse field, and the Lottie person silhouette */
#canvas-container,
#canvas-container .p5Canvas,
#page-mouse-fx,
.hero-lottie,
.scrim-lottie,
.section-hero .lottie {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

/* Nav glass — full-bleed treatment lives in nav.css */
.n-nav__bg {
  background-color: rgba(28, 36, 30, 0.38) !important;
}

/* Accent surfaces that still hardcode Crucible olive */
.button,
.w-button,
.portfoliolink,
.sp-link {
  border-color: rgba(245, 242, 234, 0.35);
}

._16px-square,
.inv-item__bullet-img,
.g-dots-divider {
  filter: none;
}

/* Soft green wash on interactive chips / tags */
.a16-tag,
.a16-tags a {
  border-color: rgba(53, 94, 59, 0.45);
}

.a16-tag:hover,
.a16-tags a:hover {
  background: rgba(53, 94, 59, 0.28);
}

/* Portfolio modal panel */
.portfolio-modal__panel {
  background: var(--182-surface-raised) !important;
  border-color: rgba(53, 94, 59, 0.35) !important;
}

.portfolio-modal-backdrop {
  background: rgba(12, 16, 12, 0.72) !important;
}

/* Mobile footer bar */
.navbar-wrap.footer,
.navbar-wrap.footer.mobile {
  background: var(--182-surface) !important;
}

/* Theme color for browser chrome */
meta[name="theme-color"] {
  /* meta content set in HTML; this is a no-op for browsers */
}

/* Founder bio — same sparkle markers as sitewide Webflow `li` / deliverables */
.listteam.team-bio {
  display: block;
  width: 100%;
}

.listteam.team-bio .team-bio-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.listteam.team-bio li {
  list-style: none !important;
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--text--25);
  letter-spacing: 0.25px;
  line-height: 1.5rem;
  /* Kill global Webflow `li` background bullets — we use an explicit img */
  background-image: none !important;
}

.listteam.team-bio li::marker,
.listteam.team-bio li::before {
  content: none !important;
  display: none !important;
}

.listteam.team-bio .team-bio-marker {
  flex: none;
  width: 1rem;
  margin-top: 0.2rem;
  line-height: 0;
}

.listteam.team-bio .team-bio-marker img {
  display: block;
  width: 1rem;
  height: auto;
}

.listteam.team-bio .team-bio-text {
  flex: 1;
  min-width: 0;
}