/* VeroDeck's workforce photography and quieter motion, adapted for customers. */
:root { --page-width: min(92%, 1760px); }
html { scroll-behavior: smooth; scroll-padding-top: 112px; }
body > main, body > footer, .topbar { position: relative; z-index: 1; }
main { overflow: clip; }
nav.main { width: var(--page-width); max-width: none; padding: 8px 22px; min-height: 80px; gap: 32px; }
nav.main > .brand, .nav-right { flex-shrink: 0; }
nav.main ul a, .nav-right a { white-space: nowrap; }
nav.main a[aria-current="page"] { color: var(--accent); }
.brand-wordmark { width: 192px; height: 42px; max-width: none; object-fit: cover; object-position: center; }
.topbar { background: #171717; border-bottom: 1px solid #262626; color: #bbb; padding: 8px 16px; font-size: 12px; }
.topbar a::after { color: var(--accent); }
.btn { min-height: 46px; justify-content: center; padding: 12px 23px; border-radius: 7px; }
.btn-primary { color: #0a0a0a; text-shadow: none; font-weight: 600; box-shadow: none; }
.btn-primary:hover { background: #ff9040; box-shadow: 0 8px 28px #ff7a1a18; }
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.workforce-hero { width: var(--page-width); margin: 0 auto; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.08fr); align-items: center; gap: 12px; min-height: min(820px, calc(100svh - 132px)); padding: clamp(56px,7vw,124px) 0 clamp(24px,4vw,64px); }
.workforce-hero-copy { position: relative; z-index: 2; padding: 0 0 12px; }
.hero-kicker, .section-kicker { color: var(--accent); font-size: 11px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; line-height: 1.7; margin: 0 0 24px; }
.workforce-hero h1 { font-size: clamp(44px,4.8vw,92px); line-height: 1.03; font-weight: 600; letter-spacing: -.055em; margin: 0; max-width: 16ch; text-wrap: balance; }
.workforce-hero h1 span, .cta h2 span { color: var(--accent); }
.hero-lead { font-size: clamp(18px,1.45vw,25px); line-height: 1.5; letter-spacing: -.025em; max-width: 34ch; margin: 28px 0 14px; color: #e1e1e1; }
.hero-description { font-size: clamp(15px,1.05vw,19px); line-height: 1.75; color: #a3a3a3; max-width: 50ch; margin: 0 0 30px; }
.hero-worker { width: 126%; max-width: none; margin-left: -11%; }
.logos { margin-top: 36px; margin-bottom: 68px; }
.logo-item { color: #aaa; font-size: 14px; }
.logo-item .glyph { background: #191919; border-color: #353535; color: #c4c4c4; box-shadow: none; text-shadow: none; }
.logos-label { color: #919191; }
.logos-note { padding: 0 24px; color: #929292; }
.staffing-overview { width: var(--page-width); max-width: 1600px; margin: 0 auto clamp(56px,6vw,96px); padding-top: 24px; }
.offering-lead { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); align-items: center; gap: clamp(24px,4vw,64px); margin-bottom: clamp(28px,4vw,56px); }
.offering-lead .offering-intro { margin-bottom: 0; }
.offering-worker { max-width: 660px; justify-self: end; }
.offering-intro { max-width: 920px; margin-bottom: 34px; }
.offering-intro h2 { font-size: clamp(32px,3.2vw,56px); font-weight: 600; line-height: 1.13; letter-spacing: -.04em; margin: 0 0 20px; }
.offering-intro h2 span { color: #a3a3a3; }
.offering-intro > p { color: #a3a3a3; font-size: clamp(15px,1.15vw,19px); line-height: 1.75; max-width: 64ch; }
.offering-values { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(24px,4vw,64px); }
.offering-values article { border-top: 1px solid #393939; padding-top: 24px; }
.offering-values h3 { font-size: clamp(20px,1.6vw,28px); line-height: 1.3; letter-spacing: -.025em; font-weight: 500; margin: 0 0 16px; }
.offering-values p { font-size: clamp(14px,1vw,17px); color: #a3a3a3; line-height: 1.8; margin: 0; }
.workforce-belief { width: var(--page-width); max-width: 1760px; position: relative; margin: 0 auto; isolation: isolate; overflow: hidden; }
.belief-worker { width: 100%; margin: 0; }
.belief-copy { position: absolute; left: 4%; top: 50%; transform: translateY(-50%); width: 43%; z-index: 2; }
.belief-copy h2 { font-size: clamp(30px,3vw,54px); font-weight: 550; line-height: 1.12; letter-spacing: -.04em; margin: 0 0 25px; max-width: 19ch; }
.belief-copy h2 span { color: #a3a3a3; }
.belief-copy p:not(.section-kicker) { color: #aaa; font-size: clamp(14px,1.1vw,19px); line-height: 1.75; max-width: 47ch; margin: 0 0 16px; }
.belief-copy .section-kicker { margin-bottom: 18px; }
.section { width: var(--page-width); max-width: 1600px; padding: clamp(66px,7vw,112px) 0 16px; }
.section-title { font-size: clamp(32px,3.4vw,58px) !important; line-height: 1.1 !important; letter-spacing: -.045em !important; }
.section-sub { max-width: 54ch; line-height: 1.75; font-size: clamp(15px,1.15vw,19px); }
.workforce-engine { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: clamp(28px,5vw,80px); }
.workforce-engine .section-sub { margin-bottom: 0; }
.engine-worker { max-width: 680px; justify-self: end; }
.experience-preview { min-width: 0; padding: clamp(22px,3vw,42px); border: 1px solid #333; border-radius: 12px; background: linear-gradient(140deg,#191919,#101010); }
.preview-label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: #dedede; font-size: 12px; line-height: 1.6; }
.preview-label > span:last-child { color: #929292; margin-left: auto; font-size: 10px; }
.preview-dot { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; }
.candidate-account { margin-top: 30px; }
.preview-caption { color: #a3a3a3; font-size: 11px; }
.candidate-account p { color: #eee; font-size: clamp(18px,1.5vw,25px); line-height: 1.6; letter-spacing: -.025em; margin: 10px 0 26px; }
.experience-document { border-top: 1px solid #393939; padding-top: 24px; }
.document-heading { display: flex; align-items: flex-start; gap: 12px; }
.document-icon { color: var(--accent); font-size: 24px; line-height: 1; }
.document-heading h3 { font-size: 16px; font-weight: 500; line-height: 1.4; margin: 0; }
.document-heading p { color: #929292; font-size: 11px; line-height: 1.6; margin: 6px 0 0; }
.experience-document dl { margin: 22px 0 0 36px; }
.experience-document dl > div { margin-bottom: 13px; }
.experience-document dt { font-size: 10px; color: #999; margin-bottom: 4px; }
.experience-document dd { margin: 0; color: #ddd; font-size: 12px; line-height: 1.6; }
.preview-note { margin: 26px 0 0; color: var(--accent); font-size: 12px; }
.candidate-journey { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px 28px; padding: 0; margin: 0; list-style: none; align-self: center; }
.candidate-journey li { border-top: 1px solid #393939; padding-top: 22px; }
.journey-number { color: var(--accent); font-family: 'JetBrains Mono',monospace; font-size: 12px; }
.candidate-journey h3 { font-size: clamp(19px,1.5vw,24px); line-height: 1.3; letter-spacing: -.025em; font-weight: 500; margin: 18px 0 12px; }
.candidate-journey p { color: #a3a3a3; font-size: clamp(14px,1vw,17px); line-height: 1.8; margin: 0; }
.journey-choice { grid-column: 1 / -1; margin: -12px 0 0; font-size: 13px; line-height: 1.7; color: #a3a3a3; }
.customer-story-panel { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); align-items: center; gap: clamp(32px,4vw,64px) clamp(24px,4vw,64px); padding: clamp(32px,4.5vw,72px); background: linear-gradient(145deg,#171717,#0e0e0e); border: 1px solid #333; border-radius: 16px; }
.customer-story h2, .founder-story h2 { font-size: clamp(34px,3.5vw,60px); line-height: 1.12; letter-spacing: -.045em; font-weight: 500; margin: 0; text-wrap: balance; }
.customer-story h2 span, .founder-story h2 span { color: var(--accent); }
.customer-story .section-kicker, .founder-story .section-kicker { margin-bottom: 22px; }
.customer-story-narrative { margin-top: 26px; }
.customer-worker { max-width: 660px; justify-self: end; }
.customer-story-narrative p, .founder-story-copy > p:not(.section-kicker) { font-size: clamp(15px,1.15vw,19px); color: #aaa; line-height: 1.8; max-width: 54ch; margin: 0 0 20px; }
.customer-story-narrative p:last-child, .founder-story-copy > p:last-child { margin-bottom: 0; }
.customer-story-outcomes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); list-style: none; padding: clamp(28px,3vw,44px) 0 0; margin: 0; border-top: 1px solid #393939; }
.customer-story-outcomes li { min-width: 0; padding: 0 clamp(20px,3vw,48px); border-left: 1px solid #393939; }
.customer-story-outcomes li:first-child { padding-left: 0; border-left: 0; }
.customer-story-outcomes li:last-child { padding-right: 0; }
.customer-story-outcomes li > span { display: block; color: #aaa; font-size: 11px; line-height: 1.6; }
.customer-story-outcomes strong { display: block; color: var(--text); font-size: clamp(25px,2.8vw,46px); font-weight: 500; line-height: 1.2; letter-spacing: -.04em; margin-top: 12px; }
.customer-story-outcomes p { color: #999; font-size: clamp(12px,.95vw,15px); line-height: 1.7; max-width: 28ch; margin: 12px 0 0; }
.founder-story { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(48px,7vw,112px); align-items: center; padding-top: clamp(80px,9vw,144px); padding-bottom: clamp(28px,4vw,64px); }
.founder-visuals { min-width: 0; }
.founder-worker { width: 116%; max-width: none; margin: 0 -8%; }
.founder-portrait { width: min(66%,320px); max-width: 400px; margin: -18% 0 0; position: relative; z-index: 2; }
.founder-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 1; }
.founder-portrait figcaption { padding: 22px 0 0; text-align: center; }
.founder-portrait figcaption strong { display: block; color: #e7e7e7; font-size: 18px; font-weight: 500; letter-spacing: -.02em; }
.founder-portrait figcaption span { display: block; color: #999; font-size: 12px; margin-top: 6px; }
.founder-story-copy h2 { margin-bottom: 28px; }
.about-page .founder-story { min-height: min(820px,calc(100svh - 140px)); padding-top: clamp(56px,6vw,104px); padding-bottom: clamp(64px,7vw,112px); }
.about-page .founder-story-copy { min-width: 0; }
.about-page .founder-story h1 { font-size: clamp(44px,4.1vw,68px); line-height: 1.1; letter-spacing: -.045em; font-weight: 500; margin: 0 0 30px; text-wrap: balance; }
.about-page .founder-story h1 span { color: var(--accent); }
.about-page .about-story-actions { margin-top: 30px; }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: #ddd; font-size: 13px; line-height: 1.5; padding: 6px 0; text-decoration: underline; text-decoration-color: #666; text-underline-offset: 5px; }
.text-link:hover { color: var(--accent); text-decoration-color: var(--accent); }
.product-showcase > .section-title { max-width: 1000px; }
.product-showcase > .section-sub { max-width: 64ch; }
.product-showcase .feature-grid { grid-template-columns: minmax(0,1fr); margin-top: 48px; gap: 0; }
.product-showcase .feature { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); align-items: center; gap: clamp(32px,5vw,80px); background: transparent; border: 0; border-top: 1px solid #303030; border-radius: 0; padding: clamp(40px,5vw,80px) 0; overflow: visible; }
.product-showcase .feature:last-child { border-bottom: 1px solid #303030; }
.product-showcase .feature::before { display: none; }
.product-showcase .feature-copy { min-width: 0; max-width: 480px; }
.product-showcase .feature:nth-child(even) { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); }
.product-showcase .feature:nth-child(even) .feature-copy { grid-column: 2; grid-row: 1; }
.product-showcase .feature:nth-child(even) .mockup { grid-column: 1; grid-row: 1; }
.product-showcase .feature-label { color: var(--accent); font-size: 11px; letter-spacing: .12em; margin-bottom: 16px; }
.product-showcase .feature-title { font-size: clamp(26px,2.5vw,40px); line-height: 1.14; letter-spacing: -.035em; font-weight: 500; margin-bottom: 22px; text-wrap: balance; }
.product-showcase .feature-desc { font-size: clamp(15px,1.1vw,18px); line-height: 1.8; color: #a3a3a3; }
.product-showcase .mockup { margin: 0; width: 100%; min-width: 0; border-color: #303030; border-radius: 12px; }
.product-showcase .mockup-body { min-height: 0; padding: clamp(20px,2.6vw,40px); }
.product-showcase .pipeline-row { grid-template-columns: minmax(0,1fr) auto; }
.product-showcase .chart-wrap { max-width: 680px; margin: auto; }
.mockup, .pipeline-row .role, .role-meta { min-width: 0; }
.role-avatar { flex-shrink: 0; }
.transcript .meta { flex-wrap: wrap; }
.chart-header { flex-wrap: wrap; gap: 10px; }
.chart-wrap svg { width: 100%; height: auto; }
.cta { width: var(--page-width); max-width: 1600px; padding: clamp(48px,6vw,96px) 32px; background: radial-gradient(ellipse at 50% 150%,#ff7a1a12,transparent 70%),#101010; border: 1px solid #303030; border-radius: 12px; box-shadow: none; }
.cta h2 { font-size: clamp(36px,4vw,72px); letter-spacing: -.045em; }
.cta p { margin-top: 22px; line-height: 1.7; }
.cta .hero-ctas { justify-content: center; }
.workforce-cta { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); align-items: center; gap: clamp(20px,3vw,48px); text-align: left; padding: clamp(32px,4vw,64px); }
.workforce-cta h2 { font-size: clamp(34px,3.35vw,56px); }
.workforce-cta p { margin-left: 0; margin-right: 0; max-width: 48ch; }
.workforce-cta .hero-ctas { justify-content: flex-start; }
.cta-worker { max-width: 660px; justify-self: end; }
footer { background: #0a0a0a; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }

@media (min-width: 1920px) {
  nav.main { min-height: 100px; }
  .brand-wordmark { width: 240px; height: 50px; }
  nav.main ul, .nav-right, .btn { font-size: 17px; }
  .hero-kicker, .section-kicker { font-size: 13px; }
  .workforce-hero { min-height: min(980px, calc(100svh - 148px)); }
}
@media (max-width: 1050px) {
  nav.main { gap: 22px; padding-inline: 16px; }
  nav.main ul { gap: 18px; font-size: 13px; }
  .nav-right { gap: 14px; font-size: 13px; }
  .brand-wordmark { width: 165px; height: 37px; }
  .workforce-hero { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .hero-kicker { max-width: 33ch; }
  .hero-worker { width: 140%; margin-left: -15%; }
  .belief-copy h2 { font-size: 32px; margin-bottom: 16px; }
  .workforce-belief { min-height: 400px; }
  .belief-copy { width: 45%; left: 2%; }
  .belief-copy p:not(.section-kicker) { line-height: 1.6; font-size: 14px; }
  .workforce-engine { grid-template-columns: 1fr; gap: 18px; }
  .workforce-engine .engine-heading { max-width: 650px; }
  .engine-worker { max-width: 580px; justify-self: end; margin-top: -8px; margin-bottom: 8px; }
  .experience-preview { max-width: 750px; width: 100%; }
  .candidate-journey { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 20px; }
  .journey-choice { margin-top: 12px; }
}
@media (max-width: 900px) {
  nav.main ul { display: none; }
  .about-page .founder-story { grid-template-columns: minmax(0,1fr); min-height: 0; gap: 38px; padding-top: 52px; padding-bottom: 64px; }
  .about-page .founder-story-copy { order: -1; max-width: 680px; }
  .about-page .founder-visuals { width: 100%; max-width: 580px; justify-self: center; }
  .about-page .founder-story h1 { font-size: clamp(40px,6vw,56px); margin-bottom: 26px; }
}
@media (max-width: 760px) {
  :root { --page-width: calc(100% - 40px); }
  html { scroll-padding-top: 92px; }
  nav.main { top: 8px; margin-top: 8px; padding: 7px 12px; min-height: 65px; gap: 14px; }
  nav.main ul { display: none; }
  .brand-wordmark { width: 148px; height: 34px; }
  .nav-right { gap: 14px; }
  .nav-right .btn { padding: 10px 13px; min-height: 38px; font-size: 12px; }
  .nav-right > a:first-child { font-size: 12px; }
  .workforce-hero { grid-template-columns: 1fr; min-height: 0; padding: 46px 0 0; gap: 0; }
  .hero-kicker { max-width: none; font-size: 9px; letter-spacing: .1em; margin-bottom: 23px; }
  .workforce-hero h1 { max-width: 13ch; font-size: clamp(46px,9.5vw,70px); }
  .hero-lead { margin-top: 24px; font-size: 19px; max-width: 32ch; }
  .hero-description { max-width: 55ch; font-size: 15px; margin-bottom: 24px; }
  .hero-ctas .btn-ghost { display: inline-flex; }
  .hero-ctas .btn { font-size: 13px; padding: 12px 17px; }
  .hero-worker { width: 118%; margin: 0 0 0 -9%; }
  .logos { margin-top: 30px; margin-bottom: 62px; }
  .logos-note { font-size: 11px; line-height: 1.7; }
  .staffing-overview { padding-top: 0; }
  .offering-lead { grid-template-columns: 1fr; gap: 12px; margin-bottom: 28px; }
  .offering-worker { max-width: 520px; justify-self: end; }
  .offering-intro { margin-bottom: 28px; }
  .offering-values { grid-template-columns: 1fr; gap: 26px; }
  .offering-values article { padding-top: 22px; }
  .offering-values h3 { font-size: 23px; margin-bottom: 12px; }
  .offering-values p { font-size: 15px; }
  .workforce-belief { display: flex; flex-direction: column; }
  .belief-copy { position: relative; left: auto; top: auto; transform: none; width: 100%; padding: 0; }
  .belief-copy h2 { font-size: clamp(33px,7vw,44px); max-width: 23ch; }
  .belief-copy p:not(.section-kicker) { font-size: 15px; line-height: 1.7; max-width: 55ch; }
  .belief-worker { width: 160%; max-width: none; margin: -14px 0 0 -60%; }
  .workforce-engine { padding-top: 40px; }
  .engine-worker { max-width: 520px; margin: 0; }
  .section { padding-top: 54px; }
  .customer-story-panel { grid-template-columns: 1fr; gap: 26px; padding: 28px 24px; border-radius: 12px; }
  .customer-worker { max-width: 520px; margin-top: -10px; margin-bottom: -6px; }
  .customer-story h2, .founder-story h2 { font-size: clamp(34px,7vw,46px); }
  .customer-story .section-kicker, .founder-story .section-kicker { margin-bottom: 16px; }
  .customer-story-outcomes { gap: 24px; padding-top: 28px; }
  .customer-story-outcomes li { padding: 0; border: 0; }
  .customer-story-outcomes strong { font-size: clamp(22px,4.5vw,30px); }
  .customer-story-outcomes p { font-size: 12px; }
  .founder-story { grid-template-columns: 1fr; gap: 32px; padding-top: 64px; padding-bottom: 24px; }
  .founder-visuals { width: 100%; max-width: 580px; }
  .founder-portrait { width: min(72%,300px); margin-top: -17%; }
  .founder-story-copy h2 { margin-bottom: 24px; }
  .about-page .founder-story { padding-top: 42px; padding-bottom: 48px; gap: 26px; }
  .about-page .founder-story h1 { font-size: clamp(38px,8.5vw,52px); margin-bottom: 24px; }
  .about-page .about-story-actions { margin-top: 26px; }
  .cta { padding: 46px 22px; margin-top: 54px; }
  .workforce-cta { grid-template-columns: 1fr; gap: 18px; padding-bottom: 16px; }
  .cta-worker { max-width: 520px; }
  footer { font-size: 12px; line-height: 1.7; }
}
@media (max-width: 880px) {
  .product-showcase .feature, .product-showcase .feature:nth-child(even) { grid-template-columns: minmax(0,1fr); gap: 26px; padding: 36px 0; }
  .product-showcase .feature:nth-child(even) .feature-copy,
  .product-showcase .feature:nth-child(even) .mockup { grid-column: auto; grid-row: auto; }
  .product-showcase .feature-copy { max-width: 600px; }
  .product-showcase .feature-label { margin-bottom: 12px; }
  .product-showcase .feature-title { font-size: clamp(26px,4vw,34px); max-width: 26ch; margin-bottom: 16px; }
  .product-showcase .feature-grid { margin-top: 30px; }
  .product-showcase .mockup-body { padding: 20px; }
}
@media (max-width: 420px) {
  nav.main { width: calc(100% - 24px); gap: 8px; padding-inline: 10px; }
  .brand-wordmark { width: 126px; height: 31px; }
  .nav-right { gap: 9px; }
  .nav-right .btn { padding: 9px 10px; font-size: 11px; }
  .nav-right > a:first-child { font-size: 11px; }
  .hero-kicker { max-width: 30ch; }
  .workforce-hero h1 { font-size: clamp(41px,11.2vw,48px); }
  .hero-ctas { gap: 10px; }
  .hero-ctas .btn { padding: 11px 13px; font-size: 12px; }
  .product-showcase .mockup-body { padding: 16px 12px; }
  .product-showcase .pipeline-row { grid-template-columns: minmax(0,1fr); }
  .mockup-body { padding: 14px 12px; }
  .candidate-journey { grid-template-columns: 1fr; gap: 22px; }
  .candidate-journey h3 { margin-top: 12px; }
  .customer-story-panel { padding: 26px 20px; }
  .customer-story-outcomes { grid-template-columns: 1fr; gap: 22px; }
  .customer-story-outcomes li + li { border-top: 1px solid #303030; padding-top: 22px; }
  .customer-story-outcomes strong { font-size: 30px; margin-top: 8px; }
  .customer-story-outcomes p { margin-top: 8px; max-width: none; }
  .experience-preview { padding: 22px 18px; }
  .preview-label > span:last-child { margin-left: 14px; }
  .experience-document dl { margin-left: 0; }
  .mockup-bar { gap: 5px; padding: 10px; }
  .mockup-bar .dot { flex-shrink: 0; width: 8px; height: 8px; }
  .mockup-title { margin-left: 5px; font-size: 9px; overflow-wrap: anywhere; }
  .pipeline-row { grid-template-columns: minmax(0,1fr); gap: 10px; padding: 10px; }
  .progress-bar { width: 100%; }
  .role-meta .name { font-size: 12px; }
  .role-meta .time { font-size: 9px; line-height: 1.6; }
  .transcript { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}