/* Service-site layout. Shared colors, fonts and controls stay in aweb.css. */
html { scroll-behavior: auto; }
main h1, main h2, main h3 { font-weight: 500; }
main { outline: none; }
main figure { margin: 0; }
.skip-link { position: fixed; z-index: 100; top: -8rem; left: var(--s2); padding: var(--s2); background: var(--bg); color: var(--ink); }
.skip-link:focus { top: var(--s2); }
.a-actions { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
.a-hero { padding: clamp(4rem, 8vw, 8rem) 0 var(--s5); }
.a-hero h1 { font-size: clamp(2.7rem, 1.4rem + 5.1vw, 6rem); line-height: 1.04; letter-spacing: -0.045em; max-width: 20ch; text-wrap: balance; }
.a-lede { margin-top: var(--s4); max-width: 48rem; font-size: clamp(1.25rem, 1rem + .8vw, 1.65rem); line-height: 1.5; color: var(--muted); }
.a-compatibility { margin-top: var(--s6); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); font-size: var(--step--1); color: var(--muted); }
.a-runtimes { display: flex; flex-wrap: wrap; row-gap: .6rem; list-style: none; margin: 0; padding: 0; }
.a-runtimes li { padding: 0 .75rem; border-left: 1px solid var(--line-strong); line-height: 1.2; }
.a-compatibility a { display: inline-flex; align-items: center; min-height: 32px; }
.a-screen { padding: clamp(5rem, 9vw, 9rem) 0; }
.a-screen h2 { font-size: clamp(2.1rem, 1.35rem + 2.7vw, 3.8rem); line-height: 1.12; letter-spacing: -.03em; max-width: 23ch; }
.a-intro { max-width: 49rem; }
.a-intro > p, .a-prose p { font-size: var(--step-1); color: var(--muted); line-height: 1.65; max-width: 39rem; margin-top: var(--s3); }
.a-work { background: var(--surface); }
.a-work-layout { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(3rem, 7vw, 7rem); align-items: start; }
.a-work-layout h2 { font-size: clamp(2.1rem, 1.2rem + 2.6vw, 3.4rem); max-width: 16ch; }
.a-work-layout .a-intro > p { font-size: var(--step-0); max-width: 32rem; }
.a-message { font-size: var(--step-0); line-height: 1.6; }
.a-message h3 { font-size: var(--step-1); line-height: 1.4; }
.a-message h4 { font-size: var(--step-0); font-weight: 600; line-height: 1.5; }
.a-message figcaption { font-size: var(--step--1); color: var(--muted); margin-top: var(--s3); }
.a-handoffs { list-style: none; margin: var(--s3) 0 0; padding: 0; }
.a-handoffs li { display: grid; grid-template-columns: 7rem 1fr; gap: var(--s3); padding: var(--s3) 0; border-top: 1px solid var(--line-strong); }
.a-handoffs p { color: var(--muted); }
.a-decision { margin-top: var(--s3); padding: var(--s3) var(--s4); background: var(--bg-tint); border-left: 2px solid var(--ink); }
.a-decision > p { margin-top: var(--s2); }
.a-decision .a-decision__evidence { font-size: var(--step--1); color: var(--muted); }
.a-rule h3 { font-size: var(--step--1); font-weight: 600; color: var(--muted); }
.a-rule h3 + p { margin-top: var(--s2); font-size: var(--step-1); }
.a-rule__bridge { margin: var(--s4) 0; font-size: var(--step--1); color: var(--muted); }
.a-rule__application { border-left: 2px solid var(--line-strong); padding-left: var(--s3); }
.a-organization { background: var(--surface); }
.a-two-part { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--s7); align-items: start; }
.a-prose p:first-child { margin-top: 0; }
.a-prose p + p { margin-top: var(--s4); color: var(--ink); }
.a-org { padding-top: var(--s6); }
.a-org__company { font-size: var(--step-2); text-align: center; padding-bottom: var(--s4); position: relative; }
.a-org__company::after { content: ""; position: absolute; height: var(--s3); width: 1px; background: var(--faint); bottom: 0; left: 50%; }
.a-org__teams { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); padding: var(--s4) 0 0; margin: 0; list-style: none; position: relative; }
.a-org__teams::before { content: ""; position: absolute; top: 0; left: calc(25% - var(--s4) / 4); right: calc(25% - var(--s4) / 4); border-top: 1px solid var(--faint); }
.a-org__team { border: 1px solid var(--faint); padding: var(--s4); position: relative; }
.a-org__team::before { content: ""; position: absolute; height: var(--s4); width: 1px; background: var(--faint); bottom: 100%; left: 50%; }
.a-org__team h4 { font-size: var(--step-1); font-weight: 500; }
.a-org__person { font-size: var(--step--1); color: var(--muted); margin-top: var(--s2); max-width: 24rem; }
.a-org__agents { list-style: none; border-left: 1px solid var(--faint); padding: 0 0 0 var(--s3); margin: var(--s4) 0 0; display: flex; flex-direction: column; gap: var(--s3); }
.a-org__agents li { display: flex; flex-direction: column; gap: var(--s1); position: relative; }
.a-org__agents li::before { content: ""; position: absolute; width: var(--s2); border-top: 1px solid var(--faint); top: .8rem; right: calc(100% + var(--s1)); }
.a-org__agents strong { font-size: var(--step-0); font-weight: 500; }
.a-org__agents span { font-size: var(--step--1); color: var(--muted); }
.a-org figcaption { font-size: var(--step--1); color: var(--muted); margin-top: var(--s3); }
.a-org__boundary { font-size: var(--step-1); line-height: 1.65; max-width: 41rem; margin: var(--s5) 0 0; }
.a-portability { background: var(--bg-tint); }
.a-service { background: var(--surface); }
.a-steps { margin: var(--s6) 0 0; list-style: none; padding: 0; }
.a-steps li { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--s5); border-top: 1px solid var(--line-strong); padding: var(--s4) 0; }
.a-steps h3 { font-size: var(--step-2); line-height: 1.35; max-width: 18ch; }
.a-steps p { color: var(--muted); font-size: var(--step-1); line-height: 1.6; max-width: 36rem; }
.a-service-end { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s4); margin-top: var(--s5); }
.a-fit { max-width: 38rem; font-size: var(--step-0); color: var(--muted); line-height: 1.6; }
.a-software { padding: var(--s6) 0; }
.a-software h2 { font-size: var(--step-2); line-height: 1.3; }
.a-software > .wrap > p { margin-top: var(--s2); max-width: 40rem; color: var(--muted); }
.a-stack { display: flex; flex-wrap: wrap; gap: var(--s4) var(--s6); list-style: none; padding: 0; margin: var(--s4) 0; }
.a-stack li { display: flex; flex-direction: column; gap: var(--s1); }
.a-stack a { font-size: var(--step-1); font-weight: 500; }
.a-stack span { font-size: var(--step--1); color: var(--muted); }
.a-software details { border-top: 1px solid var(--line-strong); padding-top: var(--s3); }
.a-software summary { cursor: pointer; font-weight: 500; min-height: 44px; padding: var(--s1) 0; width: fit-content; }
.a-self-setup { max-width: 46rem; padding: var(--s3) 0; }
.a-self-setup p { color: var(--muted); }
.a-links { padding-left: var(--s3); margin: var(--s3) 0; }
.a-links li { margin: var(--s2) 0; }
.a-person { display: grid; grid-template-columns: 240px 1fr; gap: var(--s6); align-items: start; }
.a-person__photo { display: block; width: 240px; height: 240px; object-fit: cover; border-radius: var(--radius-sm); }
.a-person__text p { font-size: var(--step-1); color: var(--muted); max-width: 38rem; margin-top: var(--s3); }
.a-person__text p:last-child { color: var(--ink); }
.a-close { padding: var(--s6) 0; background: var(--ink); color: var(--bg); }
.a-close h2 { font-size: clamp(2.3rem, 1.5rem + 3vw, 4rem); color: var(--bg); }
.a-close p { margin-top: var(--s3); max-width: 32rem; font-size: var(--step-1); line-height: 1.6; }
.a-close__inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s4); }
.a-close :focus-visible { outline-color: var(--bg); }
.site-footer { padding: var(--s5) 0; }
.a-footer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); }
.a-footer__links { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s3); }
.a-footer__links a { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); text-decoration: none; font-size: var(--step--1); }
.a-footer__legal { margin-left: auto; font-size: var(--step--1); color: var(--faint); }
@media (max-width: 1000px) {
  .a-work-layout { grid-template-columns: 1fr; gap: var(--s5); }
  .a-work-layout h2 { max-width: 23ch; }
  .a-work-layout .a-intro > p { max-width: 39rem; }
  .a-message { max-width: 39rem; width: 100%; }
}
@media (max-width: 820px) {
  .a-two-part { grid-template-columns: 1fr; gap: var(--s4); }
  .a-person { grid-template-columns: 160px 1fr; gap: var(--s4); }
  .a-person__photo { width: 160px; height: 160px; }
  .a-steps li { grid-template-columns: 1fr 1.3fr; }
}
@media (max-width: 560px) {
  .a-hero { padding-top: var(--s6); }
  .a-hero h1 { letter-spacing: -.035em; }
  .a-actions .btn { width: 100%; }
  .a-compatibility { gap: var(--s2); margin-top: var(--s5); }
  .a-runtimes { width: 100%; margin-left: -.75rem; }
  .a-handoffs li { grid-template-columns: 1fr; gap: var(--s1); }
  .a-decision { padding: var(--s3); }
  .a-steps li { grid-template-columns: 1fr; gap: var(--s2); }
  .a-steps h3 { max-width: none; }
  .a-org { padding-top: var(--s5); }
  .a-org__company { text-align: left; padding-left: var(--s3); }
  .a-org__company::after { left: 0; }
  .a-org__teams { grid-template-columns: 1fr; gap: var(--s3); padding: 0 0 0 var(--s3); border-left: 1px solid var(--faint); }
  .a-org__teams::before { display: none; }
  .a-org__team { padding: var(--s3); }
  .a-org__team::before { width: var(--s3); height: 1px; bottom: auto; top: var(--s4); left: auto; right: 100%; }
  .a-org__agents { margin-top: var(--s3); }
  .a-person { grid-template-columns: 1fr; }
  .a-stack { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4) var(--s2); }
  .a-footer__legal { width: 100%; margin-left: 0; }
}
