/* /company, ported from the reference build's page-company.css (atlas-website/site/css/page-company.css).
   Loaded after site.base.css and site.system.css, as in the reference; the paper-alt ground itself is in
   site.system.css (_themes.css, keyed on the root's .atlas-company). Scoped to .atlas-page; the body class
   .page-company is the root's .atlas-company. Breakpoints: 900 px is 991 px, 901 px is 992 px; the 600 and 1100 px
   steps stay. Rules for classes the final markup no longer uses (.co-commit, .co-rai-head) are kept as in the
   reference.

   The Ashby job board is native markup in the Roles slot, so .roles here styles the shadow-side wrapper around
   the slot; the #roles Div itself is in the light DOM. */

/* ═══════════════════════════════════════════════════════════════
   /company — round 3 (2026-09-29)

   Loaded after _system.css, on company.html only. Every selector is
   scoped to .page-company, and every new class starts "co-", so
   nothing here can leak into another page. Tokens only: no new hue,
   ochre stays the only accent.

   Section shapes, top to bottom, so no two neighbours look alike:
     hero        headline, then the illustrated physical economy as a
                 full-bleed panorama (the page's only image)
     mission     the one dark section: a large mission line, then a
                 four-column strip of uses, commercial and development
     who we are  heading beside the standard, then the four values on
                 a map graticule: a 2x2 frame with crosshairs
     join us     the pitch beside a framed panel, "What working here
                 is like", then the Ashby slot
     RAI         heading beside the lede, then three bordered cards
     record      research record beside a list of selected honors
   ═══════════════════════════════════════════════════════════════ */

/* ── Hero: the ambition, then the panorama ─────────────────────── */
.atlas-page.atlas-company .co-hero { padding-bottom: 0; border-bottom: 0; }
.atlas-page.atlas-company .co-hero h1 { max-width: 19ch; }
.atlas-page.atlas-company .co-hero .standfirst { max-width: 60ch; }
.atlas-page .co-scene { margin-top: 64px; height: clamp(200px, 30vw, 420px); overflow: hidden;
            border-top: 1px solid var(--ink-14); border-bottom: 1px solid var(--ink-14); }
/* The drawing is ink on its own cream. Multiply lets the section ground show
   through the cream; the desaturation keeps its browns inside the palette. */
.atlas-page .co-scene img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 58%;
                mix-blend-mode: multiply; filter: saturate(0.45) brightness(1.03); }

/* ── Mission: the one dark section ─────────────────────────────── */
.atlas-page.atlas-company .co-mission { padding: 104px 0 96px; }
.atlas-page.atlas-company .co-mission h2 { font-size: clamp(34px, 4.3vw, 58px); line-height: 1.08; letter-spacing: -0.016em;
                               max-width: 21ch; }
.atlas-page.atlas-company .co-mission .lede { max-width: 60ch; margin-top: 28px; }
.atlas-page .co-uses-h { font: 500 11px/1 var(--mono); letter-spacing: 0.12em; text-transform: uppercase;
             color: var(--paper-55); margin: 72px 0 0; }
.atlas-page .co-uses { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px;
           border-top: 1px solid var(--paper-22); }
.atlas-page .co-uses li { display: flex; flex-direction: column; padding: 24px 28px 6px; border-left: 1px solid var(--paper-10); }
.atlas-page .co-uses li:first-child { padding-left: 0; border-left: 0; }
.atlas-page .co-uses .k { font: 500 11px/1 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ochre-light); }
.atlas-page .co-uses .what { font: 400 20px/1.34 var(--serif); color: var(--paper); margin: 14px 0 0; flex: 1; }
.atlas-page .co-uses .who { font: 500 13.5px/1.4 var(--sans); color: var(--paper-74); margin: 18px 0 0; }
.atlas-page.atlas-company .co-mission .cta-pair { margin-top: 44px; }

/* ── Who we are: heading beside the standard ───────────────────── */
.atlas-page .co-who-head { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: end; }
.atlas-page.atlas-company .co-who-head h2 { max-width: 17ch; }
.atlas-page.atlas-company .co-who-head .lede { margin: 0; max-width: 52ch; }
.atlas-page .co-values-intro { font: 400 clamp(22px, 2.2vw, 28px)/1.3 var(--serif); margin: 80px 0 0; }

/* The values on a graticule: four quadrants, crosshair rules, a ring where
   they meet. It reads as a map frame, which is what the company makes. */
.atlas-page .co-values { position: relative; display: grid; grid-template-columns: 1fr 1fr; margin-top: 26px;
             background: var(--paper); border: 1px solid var(--ink-20); }
.atlas-page .co-values::after { content: ""; position: absolute; left: 50%; top: 50%; width: 15px; height: 15px;
                    transform: translate(-50%, -50%); border-radius: 50%; background: var(--paper);
                    border: 1.5px solid var(--ochre); box-shadow: 0 0 0 5px var(--paper); }
.atlas-page .co-values li { padding: 44px 52px 48px; }
.atlas-page .co-values li:nth-child(odd) { border-right: 1px solid var(--ink-20); }
.atlas-page .co-values li:nth-child(-n+2) { border-bottom: 1px solid var(--ink-20); }
.atlas-page .co-values .num { display: block; font: italic 400 30px/1 var(--serif); color: var(--ochre); }
.atlas-page .co-values h3 { font: 400 clamp(25px, 2.4vw, 31px)/1.18 var(--serif); letter-spacing: -0.01em; margin: 22px 0 0; }
.atlas-page .co-values p { font-size: 16px; line-height: 1.6; color: var(--ink-70); margin: 12px 0 0; max-width: 40ch; }

/* ── Join us: pitch beside a framed panel ──────────────────────── */
.atlas-page .co-join-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 72px; align-items: start; }
.atlas-page.atlas-company .co-join h2 { max-width: 14ch; }
.atlas-page.atlas-company .co-join .lede { max-width: 44ch; }
.atlas-page .co-life { background: var(--paper-alt); border-left: 3px solid var(--ochre); padding: 36px 44px 20px; margin-top: 8px; }
.atlas-page .co-life h3 { font: 400 23px/1.25 var(--serif); margin: 0 0 12px; }
.atlas-page .co-life li { display: grid; grid-template-columns: 11ch 1fr; gap: 20px; padding: 18px 0;
              border-top: 1px solid var(--ink-14); }
.atlas-page .co-life .k { font: 500 11px/1.6 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ochre-text);
              padding-top: 3px; }
.atlas-page .co-life p { font-size: 16px; line-height: 1.55; color: var(--ink); margin: 0; }
.atlas-page.atlas-company .co-join .roles { margin-top: 56px; }

/* ── Responsible AI: heading beside the lede, three bordered cards ─ */
.atlas-page .co-rai-head { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: end; }
.atlas-page.atlas-company .co-rai-head h2 { max-width: 16ch; }
.atlas-page.atlas-company .co-rai-head .lede { margin: 0; max-width: 52ch; }
.atlas-page .co-commit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 56px; }
.atlas-page .co-commit > div { background: var(--paper); border: 1px solid var(--ink-14); border-top: 2px solid var(--ink);
                   padding: 26px 28px 30px; }
.atlas-page .co-commit .k { font: 500 11px/1 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ochre-text); }
.atlas-page .co-commit h3 { font: 500 21px/1.26 var(--serif); margin: 14px 0 0; }
.atlas-page .co-commit p { font-size: 15px; line-height: 1.62; color: var(--ink-70); margin: 10px 0 0; }
.atlas-page.atlas-company .co-rai .cta-pair { margin-top: 36px; }

/* ── Research and recognition, side by side ────────────────────── */
.atlas-page .co-record-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 88px; align-items: start; }
.atlas-page.atlas-company .co-record h2 { font-size: clamp(28px, 2.7vw, 36px); max-width: 20ch; }
.atlas-page .co-body { font: 400 18px/1.6 var(--serif); color: var(--ink-70); margin: 20px 0 0; max-width: 54ch; }
.atlas-page.atlas-company .co-record .pubs { margin-top: 32px; }
.atlas-page.atlas-company .co-record .pub { grid-template-columns: 11ch 1fr; }
.atlas-page .co-more { display: inline-block; margin-top: 26px; }
.atlas-page .co-honors ul { margin-top: 32px; border-top: 1px solid var(--ink-20); }
.atlas-page .co-honors li { padding: 16px 0 17px; border-bottom: 1px solid var(--ink-08); }
.atlas-page .co-honors .k { display: block; font: 500 11px/1.4 var(--mono); letter-spacing: 0.1em; text-transform: uppercase;
                color: var(--ochre-text); }
.atlas-page .co-honors .t { display: block; font: 400 19px/1.3 var(--serif); margin-top: 6px; }
.atlas-page .co-honors .b { display: block; font-size: 13.5px; line-height: 1.5; color: var(--ink-64); margin-top: 3px; }
.atlas-page .co-honors .b a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* ── Close ─────────────────────────────────────────────────────── */
.atlas-page.atlas-company .co-close .lede { margin-top: 16px; }

/* ── Tablet and phone ──────────────────────────────────────────── */
@media (max-width: 1100px) {
  .atlas-page .co-uses { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atlas-page .co-uses li:nth-child(3) { padding-left: 0; border-left: 0; }
  .atlas-page .co-uses li:nth-child(n+3) { border-top: 1px solid var(--paper-10); margin-top: 18px; }
}
@media (max-width: 991px) {
  .atlas-page .co-scene { margin-top: 44px; }
  .atlas-page.atlas-company .co-mission { padding: 72px 0 64px; }
  .atlas-page .co-uses-h { margin-top: 52px; }
  .atlas-page .co-who-head, .atlas-page .co-rai-head, .atlas-page .co-join-grid, .atlas-page .co-record-grid { grid-template-columns: 1fr; gap: 24px; }
  .atlas-page .co-join-grid { gap: 40px; }
  .atlas-page .co-record-grid { gap: 64px; }
  .atlas-page .co-values-intro { margin-top: 56px; }
  .atlas-page .co-values { grid-template-columns: 1fr; }
  .atlas-page .co-values::after { display: none; }
  .atlas-page .co-values li { padding: 28px 24px 30px; }
  .atlas-page .co-values li:nth-child(odd) { border-right: 0; }
  .atlas-page .co-values li:not(:last-child) { border-bottom: 1px solid var(--ink-20); }
  .atlas-page .co-commit { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; }
  .atlas-page .co-life { padding: 28px 22px 12px; }
}
@media (max-width: 600px) {
  .atlas-page .co-uses { grid-template-columns: 1fr; }
  .atlas-page .co-uses li, .atlas-page .co-uses li:nth-child(3) { padding: 20px 0 4px; border-left: 0; }
  .atlas-page .co-uses li:nth-child(n+2) { border-top: 1px solid var(--paper-10); margin-top: 16px; }
  .atlas-page .co-life li { grid-template-columns: 1fr; gap: 6px; }
  .atlas-page.atlas-company .co-record .pub { grid-template-columns: 1fr; gap: 6px; }
  .atlas-page .co-values .num { font-size: 26px; }
}

/* Round 3 panel fixes */
.atlas-page.atlas-company .co-join h2 { max-width: 20ch; }
.atlas-page.atlas-company .co-commit.single { grid-template-columns: 1fr; max-width: 760px; }

/* ═══ Round 4 (Abe's notes, 2026-09-29) ═══ */
/* Who we are: the heading stands alone (the customer lede repeated the mission section) */
.atlas-page .co-who-head { display: block; }
.atlas-page.atlas-company .co-who-head h2 { max-width: 22ch; }
/* Values: equal rows, so the ring sits exactly where the rules cross */
.atlas-page .co-values { grid-auto-rows: 1fr; }
.atlas-page .co-values::after { transform: translate(-50%, -50%); margin: 0; }
/* Responsible AI: a slim band; the full story is one click away */
.atlas-page .co-rai-band { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.6fr); gap: 64px; align-items: start; }
.atlas-page.atlas-company .co-rai-title h2 { max-width: 16ch; margin-bottom: 22px; }
.atlas-page .co-rai-points { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink-20); }
.atlas-page .co-rai-points li { padding: 16px 0 16px; border-bottom: 1px solid var(--ink-14); font-size: 15px; line-height: 1.6; color: var(--ink-70); }
.atlas-page .co-rai-points b { display: block; font: 400 20px/1.3 var(--serif); color: var(--ink); margin-bottom: 4px; }
@media (max-width: 991px) { .atlas-page .co-rai-band { grid-template-columns: 1fr; gap: 24px; } }
@media (max-width: 991px) { .atlas-page .co-values { grid-auto-rows: auto; } }

/* Round 4: the hero is its own planet-scale engraving, already cropped to a band; centre the crop */
.atlas-page .co-scene img { object-position: 50% 50%; }

/* ═══ Round 5 (Abe's notes, 2026-09-29) ═══ */
/* Hero: headline, standfirst and the planet fit one laptop screen */
@media (min-width: 992px) {
  .atlas-page.atlas-company .co-hero { padding-top: 56px; }
  .atlas-page.atlas-company .co-hero h1 { max-width: none; font-size: clamp(40px, 3.9vw, 58px); line-height: 1.08; }
  .atlas-page.atlas-company .co-hero .standfirst { max-width: 72ch; margin-top: 18px; }
  .atlas-page .co-scene { margin-top: 32px; height: clamp(200px, 24vw, 340px); }
}