/* Shared hero talvo-d (split-right/live-job-cards) — Bilvo library. Scoped to .sh-talvo-d. */
/* Shared hero: talvo-d — lifted from Talvo variants #hero-d (split-story-cards): a giant stacked headline top-left under a
   small "New" news pill, lead and pills below; a tall rounded crew photo on the right carrying two white job-status cards
   in opposite corners (a booked visit with the crew's avatar, a done-state with a check). Contract tokens only (CONTRACT.md §2). */
.sh-talvo-d { position: relative; padding: var(--hero-pad-top, 120px) 0 clamp(72px, 7vw, 96px); background: var(--bg); color: var(--text); }
.sh-talvo-d .sh-in { width: min(var(--container), 100% - 2 * var(--gutter)); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); gap: 72px; align-items: stretch; }
.sh-talvo-d .sh-copy { display: flex; flex-direction: column; gap: 32px; padding-top: 24px; }
.sh-talvo-d .sh-news { align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; padding: 4px 14px 4px 4px; border-radius: var(--r-pill); background: var(--surface); font-family: var(--font); font-weight: 500; font-size: 14px; line-height: 1.7; color: var(--text); text-decoration: none; transition: color .3s; }
.sh-talvo-d .sh-news b { font-weight: 500; padding: 1px 10px; border-radius: 16px; background: var(--accent); color: var(--on-accent); }
.sh-talvo-d .sh-news svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.sh-talvo-d .sh-news:hover { color: var(--accent-ink); }
.sh-talvo-d .sh-title { margin: 0; font-family: var(--font-display); font-weight: var(--display-weight, 600); font-size: min(var(--display-size, 80px), 5.6vw); line-height: var(--display-lh, 1); letter-spacing: var(--display-tracking, -2px); color: var(--text); text-wrap: balance; }
.sh-talvo-d .sh-title em { font-style: var(--display-em, normal); }
.sh-talvo-d .sh-lead { margin: 0; max-width: 470px; font-family: var(--font); font-size: var(--lead-size, 20px); font-weight: var(--body-weight, 400); line-height: 1.7; color: var(--text-2); }
.sh-talvo-d .sh-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.sh-talvo-d .sh-frame { position: relative; height: 700px; border-radius: var(--r-hero, var(--r-lg)); overflow: hidden; }
.sh-talvo-d .sh-media { width: 100%; height: 100%; object-fit: cover; object-position: var(--sh-focus, 30% 50%); }
.sh-talvo-d .sh-story { position: absolute; display: flex; align-items: center; gap: 14px; background: var(--surface); border-radius: var(--r-sm, 16px); padding: 14px 20px 14px 14px; box-shadow: 0 10px 30px color-mix(in srgb, var(--gs-dark) 8.0%, transparent); }
.sh-talvo-d .sh-story img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.sh-talvo-d .sh-story-ic { width: 44px; height: 44px; border-radius: 50%; background: color-mix(in srgb, var(--accent) 18%, var(--surface)); color: var(--accent-ink); display: grid; place-items: center; flex: none; }
.sh-talvo-d .sh-story-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; }
.sh-talvo-d .sh-story small { display: block; font-family: var(--font); font-size: 13px; line-height: 1.5; color: var(--muted); }
.sh-talvo-d .sh-story b { display: block; font-family: var(--font); font-weight: 600; font-size: 16px; line-height: 1.5; color: var(--text); }
.sh-talvo-d .sh-story--1 { top: 32px; right: 32px; }
.sh-talvo-d .sh-story--2 { left: 32px; bottom: 32px; }
@media (max-width: 1100px) {
  .sh-talvo-d .sh-in { grid-template-columns: 1fr; gap: 56px; }
  .sh-talvo-d .sh-frame { height: 560px; }
}
@media (max-width: 760px) {
  .sh-talvo-d .sh-copy { gap: 24px; padding-top: 8px; }
  .sh-talvo-d .sh-title { font-size: var(--display-size-sm, 40px); letter-spacing: -1.2px; }
  .sh-talvo-d .sh-frame { height: 460px; }
  .sh-talvo-d .sh-story { padding: 10px 14px 10px 10px; gap: 10px; }
  .sh-talvo-d .sh-story img, .sh-talvo-d .sh-story-ic { width: 36px; height: 36px; }
  .sh-talvo-d .sh-story--1 { top: 16px; right: 16px; } .sh-talvo-d .sh-story--2 { left: 16px; bottom: 16px; }
}
