/* Company pages: About, Careers, Contact, Privacy, Terms.
   Loaded after motion.css on those pages only. Tokens only, no raw colors. */

/* 1. Email and phone on dark bands: tappable, in the band text style */
.w-reach { color: var(--on-band); text-decoration: underline; text-decoration-color: var(--band-line-strong); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: text-decoration-color .15s ease-out; }
.w-reach:hover { text-decoration-color: currentColor; }
.w-reach:focus-visible { outline: none; border-radius: 4px; box-shadow: var(--focus-ring-band); }
.w-contact__list a.w-reach { display: inline-flex; align-items: center; min-height: 40px; }

/* 2. Contact form: field errors, privacy note, thank-you view */
.w-field-error[hidden] { display: none; }
.w-form-error a { color: inherit; }
.w-form-note a { color: var(--ink); }
.w-sent-next { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 24px; }
@media (prefers-reduced-motion: no-preference) {
  [data-view="sent"]:not([hidden]) > * { animation: co-fade .4s cubic-bezier(.16, 1, .3, 1) both; }
  [data-view="sent"]:not([hidden]) > .w-sent-next { animation-delay: .12s; }
}
@keyframes co-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* 3. About: the two lines of work and the proof under them */
.w-lines__intro { max-width: 640px; }
.w-lines { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 24px; }
.w-line { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 40px; color: var(--ink); text-decoration: none; }
.w-line .t-body { flex: 1; }
.w-line .lm-tag { margin-bottom: 4px; }
.w-line__go { margin-top: 8px; }
.w-line__go { display: inline-flex; align-items: center; gap: 6px; font-size: 16px; line-height: 24px; font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.w-line__go .lm-icon { transition: transform .15s ease-out; }
.w-line:hover .w-line__go .lm-icon { transform: translateX(3px); }
.w-proof { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; padding-top: 24px; border-top: 1px solid var(--line-paper); }
.w-proof .t-body { max-width: 680px; }
.w-proof__lead { font-weight: 600; color: var(--ink); }

/* 4. Careers: how to apply */
.w-apply-note { max-width: 680px; }
.w-apply-note a { color: var(--ink); }

/* 5. Privacy and Terms: an "On this page" index beside a 680 px reading column */
.w-legal { display: flex; flex-direction: column; gap: 40px; }
.w-legal__body h2[id] { scroll-margin-top: calc(var(--site-header) + 24px); }
.w-legal__toc { border: 1px solid var(--line-paper); border-radius: var(--radius-lg); background: var(--surface); max-width: var(--text-max); box-sizing: border-box; }
.w-legal__sum { display: flex; align-items: center; justify-content: space-between; min-height: var(--touch-min); padding: 0 16px; font-size: 15px; line-height: 20px; font-weight: 500; color: var(--ink); cursor: pointer; list-style: none; border-radius: var(--radius-lg); }
.w-legal__sum::-webkit-details-marker { display: none; }
.w-legal__sum::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .15s ease-out; }
.w-legal__toc[open] > .w-legal__sum::after { transform: translateY(2px) rotate(-135deg); }
.w-legal__sum:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.w-legal__toc-title { display: none; }
.w-legal__list { list-style: none; margin: 0; padding: 4px 8px 12px; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 0 16px; }
.w-legal__list a { display: flex; align-items: center; min-height: var(--touch-min); padding: 0 8px; border-radius: var(--radius-md); color: var(--ink-muted); font-size: 15px; line-height: 20px; text-decoration: none; transition: color .15s ease-out, background-color .15s ease-out; }
.w-legal__list a:hover { color: var(--ink); background: var(--surface-hover); }
.w-legal__list a:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.w-legal__list a[aria-current="true"] { color: var(--ink); font-weight: 500; }

@media (min-width: 1100px) {
  .w-legal { display: grid; grid-template-columns: 232px minmax(0, var(--text-max)); gap: 80px; align-items: start; }
  .w-legal__toc { padding-left: 2px; position: sticky; top: calc(var(--site-header) + 32px); border: 0; background: none; max-height: calc(100vh - var(--site-header) - 64px); overflow-y: auto; }
  .w-legal__sum { display: none; }
  .w-legal__toc-title { display: block; margin: 0 0 8px; font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-muted); }
  .w-legal__list { display: flex; flex-direction: column; padding: 0 0 0 2px; }
  .w-legal__list a { box-sizing: border-box; min-height: 34px; padding: 6px 12px; border-left: 1px solid var(--line-paper); border-radius: 0; font-size: 14px; }
  .w-legal__list a[aria-current="true"] { border-left-color: var(--ink); background: none; }
}
@media (min-width: 1100px) and (pointer: coarse) { .w-legal__list a { min-height: var(--touch-min); } }

/* 6. Touch: inline links in body text and short text links reach 44 px */
@media (max-width: 900px), (pointer: coarse) {
  .w-form-note a, .w-apply-note a { display: inline-block; padding: 12px 0; margin: -12px 0; }
  .w-contact__list a.w-reach { min-height: var(--touch-min); }
}

/* 7. Links on the light form card inside the dark hero keep the ink color */
.w-dark .w-light .w-link { color: var(--ink); }
.w-dark .w-light .w-link:focus-visible { box-shadow: var(--focus-ring); }