/* ============================================================================
   TEAM BIO PAGE (.biomain) — Hugo QA 2026-07-31 item 4, NEW page type.
   Desktop node 1073:129547 (Main Container 1073:132808): full-width band,
   teal #15292c under a black/50 overlay, dune photo (shutterstock 421962757,
   img/v2/bio-bg.webp) bottom-anchored at 2390/1440 = 165.97% width, luminosity
   blend, opacity .36; padding 200/104; content 1232 = 664 square photo +
   104 gap + text column; photo shadow 40 40 100 rgba(0,0,0,.1).
   Text: role Roboto Flex 400 18/28 +2.16 uppercase gold; gap 32; name Bebas
   50/50 white/90; gap 56; bio Roboto Flex Light 18/30 white/90.
   Breadcrumb 32/32: 4x8 chevron + 12/22 +1.44 uppercase white/70, gap 24.
   Tablet 1073:134989 / mobile 1073:136221 stack photo-then-text (the standard
   basic-text-and-image adaptation, fluid per the Cardinal Rule).
   ============================================================================ */
.biomain {
  position: relative; overflow: hidden;
  background: #15292c;
  padding: 96px 24px 72px;
}
.biomain::before {           /* the node's black/50 overlay above the teal */
  content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.5); z-index: 0;
}
.biomain__wash {
  position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 165.97%; aspect-ratio: 2390 / 2114; z-index: 1; pointer-events: none;
  background: url('../../img/v2/bio-bg.webp') center bottom / cover no-repeat;
  mix-blend-mode: luminosity; opacity: .36;
}
.biomain__crumb {
  position: absolute; top: 32px; left: 24px; z-index: 3;
  display: inline-flex; align-items: center; gap: 24px; text-decoration: none;
  color: rgba(255,255,255,.7); font-family: "Roboto Flex", sans-serif; font-weight: 400;
  font-size: 12px; line-height: 22px; letter-spacing: 1.44px; text-transform: uppercase;
  transition: color .3s ease-in-out;
}
.biomain__crumb:hover { color: #b19f70; }
.biomain__crumbchev { width: 4px; height: 8px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.2px; }
.biomain__inner {
  position: relative; z-index: 2; box-sizing: border-box;
  max-width: 1232px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 40px; align-items: stretch;
}
.biomain__photo {
  margin: 0; width: 100%; aspect-ratio: 1 / 1;
  background-color: #0f1d1f; background-position: center; background-size: cover;
  box-shadow: 40px 40px 100px rgba(0,0,0,.1);
}
.biomain__text { display: flex; flex-direction: column; align-items: flex-start; }
.biomain__role {
  margin: 0; color: #b19f70; font-family: "Roboto Flex", sans-serif; font-weight: 400;
  font-size: 14px; line-height: 24px; letter-spacing: 1.68px; text-transform: uppercase;
  text-box-trim: trim-both; text-box-edge: cap alphabetic;
}
.biomain__name {
  margin: 24px 0 0; color: rgba(255,255,255,.9); font-family: "Bebas Neue", sans-serif;
  font-weight: 400; font-size: 40px; line-height: 40px;
  text-box-trim: trim-both; text-box-edge: cap alphabetic;
}
.biomain__body { margin-top: 40px; color: rgba(255,255,255,.9); font-family: "Roboto Flex", sans-serif;
  font-weight: 300; font-size: 16px; line-height: 28px; }
.biomain__body p { margin: 0; }
.biomain__body p + p { margin-top: 26px; }
/* the flagged placeholder line (removed with the real copy) reads as a note, not site copy */
.biomain__body .bio-placeholder { color: rgba(255,255,255,.55); font-style: italic; }

@media (min-width: 768px) {
  .biomain { padding: 128px 104px 104px; }
  .biomain__crumb { left: 32px; }
  .biomain__inner { gap: 56px; }
  .biomain__name { font-size: 50px; line-height: 50px; margin-top: 32px; }
  .biomain__role { font-size: 18px; line-height: 28px; letter-spacing: 2.16px; }
  .biomain__body { font-size: 18px; line-height: 30px; margin-top: 56px; }
}

@media (min-width: 1280px) {
  .biomain { padding: 200px 104px; }
  .biomain__inner { flex-direction: row; gap: 104px; align-items: center; }
  .biomain__photo { flex: 0 0 664px; width: 664px; }
  .biomain__text { flex: 0 1 464px; }
}

/* (.auteam__biolink lives in about-us-v2.css — the About Us page does not load this file) */
