/* COMPANY v56: the company page, rebuilt from the audit. A glance card in the hero, the dates that make this urgent,
   three beliefs, an honest dated status and the team. Uses usecases.css for tags and the two-tone heads. */
.co-hero .ph-grid { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 72px; align-items: center; }
.inner .subnav + .co-hero { padding-top: 120px; }
.co-hero .page-title { max-width: 12ch; }
.gl { position: relative; z-index: 2; padding: 26px 28px 18px; border-radius: 12px; background: #fff; box-shadow: var(--shadow), 0 0 0 1px var(--line); }
.gl-h b { font-size: 17px; font-weight: 600; letter-spacing: -.015em; color: var(--ink); }
.gl dl { margin: 14px 0 0; }
.gl dl div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); font-size: 15px; line-height: 1.45; }
.gl dt { color: var(--muted); } .gl dd { margin: 0; color: var(--ink); } .gl a { color: var(--accent); }

.ctl { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); margin: 56px 0 0; padding: 0; }
.ctl li { position: relative; padding: 28px 28px 0 0; }
.ctl li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: #e4eaf5; }
.ctl li::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, #22b8ff, #2f6bff 60%, #7b5cff); transform: scaleX(0); transform-origin: 0 50%; transition: transform 1s cubic-bezier(.3, .6, .2, 1); }
.ctl li:nth-child(2)::after { transition-delay: .3s; } .ctl li:nth-child(3)::after { transition-delay: .6s; background: linear-gradient(90deg, #7b5cff, #ff5fa2); }
.ctl.in li::after { transform: scaleX(1); }
.ctl b { display: block; font-size: 30px; font-weight: 500; letter-spacing: -.03em; color: var(--ink); }
.ctl span { display: block; margin-top: 10px; max-width: 30ch; font-size: 16px; line-height: 1.55; color: var(--slate); }
.why3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 56px; }
.why3 > div { padding: 26px 28px 28px; border-radius: 12px; background: #f6f9fc; box-shadow: inset 0 0 0 1px var(--line); }
.why3 h3, .bel h3, .tmg-c h3 { font-size: 20px; line-height: 1.25; font-weight: 600; letter-spacing: -.02em; color: var(--ink); }
.why3 p, .bel p, .tmg-c p { margin-top: 10px; font-size: 15.5px; line-height: 1.6; color: var(--slate); }
.why3 a, .src a, .st a { color: var(--accent); }
.src { margin-top: 22px; font-size: 13.5px; color: var(--muted); }

.bel { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 56px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 30px 60px -40px rgba(20, 45, 110, .35); }
.bel article { padding: 34px 32px 36px; border-left: 1px solid var(--line); } .bel article:first-child { border-left: 0; }
.bel-n { display: block; margin-bottom: 26px; font: 500 13px var(--mono); color: var(--accent); }

.st { list-style: none; margin: 56px 0 0; padding: 0; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 30px 60px -40px rgba(20, 45, 110, .35); overflow: hidden; }
.st li { position: relative; display: grid; grid-template-columns: 120px 90px minmax(0, 1fr); align-items: start; gap: 20px; padding: 26px 32px; border-top: 1px solid var(--line); }
.st li:first-child { border-top: 0; }
.st li::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(180deg, #2ee6d6, #2f6bff); transform: scaleY(0); transform-origin: 50% 0; transition: transform .6s cubic-bezier(.3, .6, .2, 1); }
.st.in li.done::before { transform: scaleY(1); } .st li.done:nth-child(2)::before { transition-delay: .3s; }
.st time { padding-top: 2px; font: 500 14px var(--mono); color: var(--ink); }
.st .tg { justify-self: start; margin-top: -1px; }
.st h3 { font-size: 18px; font-weight: 600; letter-spacing: -.015em; color: var(--ink); }
.st p { margin-top: 6px; max-width: 64ch; font-size: 15.5px; line-height: 1.6; color: var(--slate); }

.tmg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 56px; }
.tmg-c { display: flex; flex-direction: column; padding: 28px 30px 26px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 24px 48px -36px rgba(20, 45, 110, .35); transition: box-shadow .25s, transform .25s; }
a.tmg-c:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(47, 107, 255, .3), 0 30px 60px -36px rgba(20, 45, 110, .45); }
.tmg-c small { font-size: 13.5px; font-weight: 500; color: var(--accent); }
.tmg-c h3 { margin-top: 10px; } .tmg-c .more { margin-top: auto; padding-top: 22px; }
.tmg-k { background: linear-gradient(160deg, #0c2357, #061536); } .tmg-k small { color: #8fb0ff; } .tmg-k h3 { color: #fff; } .tmg-k p { color: #c6d4ef; } .tmg-k .more { color: #fff; }

@media (prefers-reduced-motion: reduce) { .ctl li::after { transform: none; } .st li.done::before { transform: none; } }
@media (max-width: 960px) {
  .co-hero .ph-grid { grid-template-columns: 1fr; gap: 40px; }
  .ctl, .why3, .bel, .tmg { grid-template-columns: 1fr; } .ctl { gap: 28px; } .ctl li { padding-right: 0; }
  .bel article { border-left: 0; border-top: 1px solid var(--line); } .bel article:first-child { border-top: 0; }
  .st li { grid-template-columns: 1fr; gap: 8px; padding: 22px 22px; }
}

/* field-notes articles (v56): byline and a three-number result strip */
.byline { margin-top: 14px; font-size: 14.5px; color: var(--muted); }
.art-stats { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); margin: 28px 0; padding: 0; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 20px 40px -30px rgba(20, 45, 110, .35); }
.art-stats li { padding: 20px 22px; border-left: 1px solid var(--line); } .art-stats li:first-child { border-left: 0; }
.art-stats b { display: block; font-size: 32px; font-weight: 500; letter-spacing: -.03em; color: var(--ink); }
.art-stats span { display: block; margin-top: 6px; font-size: 14px; line-height: 1.45; color: var(--slate); }
@media (max-width: 560px) { .art-stats { grid-template-columns: 1fr; } .art-stats li { border-left: 0; border-top: 1px solid var(--line); } .art-stats li:first-child { border-top: 0; } }