/* Inner pages. Built on the ruled grid in blocks.css: sections are 4 columns (3 where noted), cells are placed with
   --c (grid-column) and --r (grid-row), row heights come from --rows (px at 1440). Same breakpoints as the home page:
   below 1080 two columns, below 700 one. */

:root { --steel: #4c606e; --soft: #2c3339; --glow: rgba(10, 13, 16, .55); }
:root[data-theme="dark"] { --soft: #d9d5cc; --glow: rgba(244, 242, 237, .6); }

/* ---------- placement and rows */
.rows { grid-template-rows: var(--rows); }
.at { grid-column: var(--c, auto); grid-row: var(--r, auto); }
.cell.col { display: flex; flex-direction: column; }
.cell.between { justify-content: space-between; }
.cell.end { justify-content: flex-end; }
.cell.pad0 { padding: 0; }
.cell.card { background: var(--card); }
.cell.steel { background: var(--steel); color: #f4f2ed; }
.cell.e { background: var(--bg); }
.cell p, .cell h1, .cell h2, .cell h3 { margin: 0; }

/* ---------- type */
.t-word { margin: 0; font-weight: 400; font-size: calc(var(--w, 200) * var(--s)); line-height: .98; letter-spacing: -0.04em; }
.t-xl { font-size: 40px; line-height: 1.18; letter-spacing: -0.02em; font-weight: 400; }
.t-xxl { font-size: 56px; line-height: 1.14; letter-spacing: -0.025em; font-weight: 400; }
.t-lg { font-size: 32px; line-height: 1.22; letter-spacing: -0.02em; font-weight: 400; }
.t-md { font-size: 18px; line-height: 1.5; }
.t-p { font-size: 15px; line-height: 1.65; color: var(--soft); max-width: 560px; }
.dim { color: var(--muted); }
.cell.ink .t-p, .cell.steel .t-p { color: inherit; }
.cell.ink .dim, .cell.card .dim { color: inherit; opacity: .6; }
.cell.gold .t-p { color: var(--on-gold); }
.cell.gold .dim { color: var(--on-gold); opacity: .7; }
.dim-ink { opacity: .72; }
.dim-card { opacity: .6; }
.mono.dim-card { position: absolute; left: 24px; bottom: 24px; }
.cell .label { position: relative; }

/* ---------- illustrations and windows */
.cell.illo { padding: 0; }
.cell.illo > .label { position: absolute; left: 24px; top: 24px; z-index: 2; }
.cell.win { background: transparent; }

/* ---------- misc */
.cell.win > .label { position: absolute; left: 24px; top: 24px; }
.lst.deliver { grid-auto-rows: minmax(160px, auto); }
.cni-item { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; min-height: 160px; }
.cni-item .t-lg { font-size: 24px; max-width: 360px; }
.cni-item .t-p { font-size: 14px; }
.subnav { position: sticky; top: var(--hh); z-index: 20; }
@media (max-width: 1080px) { .subnav { position: relative; top: auto; } .cni-item { grid-template-columns: 1fr; } }

/* ---------- hero (960) */
.hero2 .hp-word { display: flex; align-items: flex-end; padding: 0 24px 28px; }
.hero2 .t-word { white-space: nowrap; }
.hero2.co .t-word { white-space: normal; max-width: 1000px; }
.hero2 .cell p { max-width: 312px; }
.hero2 .gold p { max-width: 312px; }
.hero2.co .ink p { max-width: 312px; }
.hero2 .cta-block, .hero2 .link { font-size: 12px; }
.link .ar svg, .cta-block .ar svg { width: 18px; height: 18px; }

/* ---------- services rows */
.rc .rc-title { display: flex; align-items: flex-end; }
.rc .cell p { max-width: 640px; }

/* ---------- cards across (services audiences, three words, etc.) */
.aud .cell { display: flex; flex-direction: column; justify-content: space-between; }
.aud .cell .t-lg { margin-top: 18px; }
.aud .cell .foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.aud .go { color: var(--gold); font-size: 22px; }
.aud .go svg, .card-post .go svg { width: 18px; height: 18px; }

/* ---------- statements */
.stmt .cell.txt { display: flex; flex-direction: column; }
.stmt .cell.txt .t-xl { max-width: 880px; }
.stmt .cell.txt .t-p { margin-top: 72px; max-width: 520px; }
.stmt .cell.txt .t-xxl { max-width: 960px; margin-top: 48px; }
.stmt .cell.txt .bot { margin-top: auto; }
.stmt.xl .cell.txt .t-xl { font-size: 40px; }

/* ---------- three words */
.words .t-lg { font-size: 36px; max-width: 312px; }
.words .w1, .words .w2 { display: flex; flex-direction: column; justify-content: space-between; }

/* ---------- list sections: rows left, big heading right (How we help, What we deliver) */
.lst .row { display: flex; justify-content: space-between; gap: 24px; align-items: stretch; }
.lst .row .txt { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.lst .row .t-p { max-width: 560px; }
.lst .row .ring { flex: none; width: 108px; height: 108px; border-radius: 50%; overflow: hidden; position: relative; align-self: center; }
.lst .row .ring canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.lst .head { position: sticky; top: var(--hh); align-self: start; min-height: 360px; }
.lst .head .t-word { --w: 120; max-width: 640px; }
.lst .row .tag { align-self: flex-end; margin-bottom: 18px; }
.lst .row.tagged { flex-direction: column; justify-content: flex-start; gap: 0; }
.lst .row.tagged .tag { align-self: flex-end; opacity: .55; }
.lst .row.tagged .t-lg { font-size: 28px; margin-top: 4px; }
.lst .row.tagged .t-p { margin-top: auto; padding-top: 28px; }

/* ---------- equestrian risks / levels / case */
.risks .cell { display: flex; align-items: flex-end; }
.levels .cell { display: flex; flex-direction: column; }
.levels .bars { display: grid; gap: 8px; }
.levels .bars i { display: block; height: 12px; border: 1px solid var(--rule); opacity: .55; }
.levels .bars i.on { background: var(--gold); border-color: var(--gold); opacity: 1; }
.levels .name { margin-top: 72px; }
.levels .t-p { margin-top: auto; }
.case .stack { display: flex; flex-direction: column; justify-content: space-between; }
.case .main { display: flex; flex-direction: column; }
.case .main .t-xxl { margin-top: 56px; font-size: 48px; max-width: 560px; }
.case .main .bot { margin-top: auto; display: grid; gap: 32px; }
.case .main .bot .t-p:last-child { opacity: .75; }

/* ---------- people */
.portrait-c { position: relative; padding: 0; }
.portrait-c img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }

/* ---------- corporate */
.steps .cell { display: flex; flex-direction: column; justify-content: space-between; }
.steps .cell .arr svg { width: 12px; height: 12px; }
.steps .cell .t-xl { margin-top: auto; padding-bottom: 28px; font-size: 44px; }
.marq { height: 120px; display: flex; align-items: center; overflow: hidden; padding: 0; }
.marq .track { display: inline-flex; align-items: center; white-space: nowrap; animation: marq 60s linear infinite; font-size: 32px; letter-spacing: -0.02em; }
.marq .sep { display: inline-block; width: 14px; height: 26px; background: currentColor; margin: 0 36px; flex: none; }
@keyframes marq { to { transform: translateX(-50%); } }
.cni .cell.txt { display: flex; flex-direction: column; gap: 22px; }
.cni .cell.txt .t-xl { max-width: 760px; }
.cni .cell.txt .t-p { max-width: 640px; }
.cni .cell.txt .t-md { max-width: 640px; }

/* ---------- about */
.ledger .cell { display: flex; flex-direction: column; justify-content: space-between; }
.ledger .fig { font-size: calc(120 * var(--s)); line-height: 1; letter-spacing: -0.04em; }
.ledger .dash { width: 44px; height: 2px; background: var(--gold); margin-top: 18px; }
.story .t-xxl { max-width: 1000px; margin-top: 56px; }
.founder2 .t-lg { margin-top: 40px; max-width: 640px; font-size: 28px; line-height: 1.32; }
.founder2 .who { margin-top: auto; }
.founder2 .who strong { display: block; font-weight: 400; font-size: 18px; }
.founder2 .t-p { margin-top: 40px; max-width: 520px; }
.three { grid-template-columns: repeat(3, 1fr); }
.three .cell { display: flex; flex-direction: column; justify-content: space-between; }
.three .cell .t-xl { margin: auto 0; max-width: 300px; }

/* ---------- contact */
.form-cell { display: flex; flex-direction: column; }
.form-cell .t-lg { font-size: 32px; max-width: 640px; }
.srg-form { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; margin-top: 56px; }
.srg-form .f { display: flex; flex-direction: column; gap: 8px; }
.srg-form .f.full { grid-column: 1 / -1; }
.srg-form label { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 11px; letter-spacing: 0; text-transform: uppercase; color: var(--muted); }
.srg-form input, .srg-form select, .srg-form textarea { font: inherit; font-size: 16px; color: inherit; background: transparent; border: 0; border-bottom: 1px solid var(--rule); border-radius: 0; padding: 10px 0; width: 100%; appearance: none; -webkit-appearance: none; }
.srg-form select { background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 10px) 50%, calc(100% - 5px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 24px; }
.srg-form select option { color: #0a0d10; }
.srg-form textarea { min-height: 120px; resize: vertical; }
.srg-form input:focus, .srg-form select:focus, .srg-form textarea:focus { outline: 0; border-bottom-color: var(--gold); }
.srg-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.srg-form button { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; background: var(--block); color: var(--block-ink); border: 0; padding: 22px 24px; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 12px; text-transform: uppercase; cursor: pointer; }
.srg-form .note { grid-column: 1 / -1; font-size: 13px; color: var(--muted); }
.srg-form .note a { color: inherit; }
.srg-form .err, .form-ok { grid-column: 1 / -1; font-size: 15px; padding: 14px 16px; border: 1px solid var(--gold); }
.direct a { display: block; margin-top: 10px; font-size: 18px; text-decoration: none; }
.direct .label { margin-bottom: 22px; }

/* ---------- insights */
.filter { display: flex; flex-wrap: nowrap; height: 72px; overflow-x: auto; scrollbar-width: none; }
.filter .cell { flex: none; display: flex; align-items: center; padding: 0 24px; white-space: nowrap; text-decoration: none; }
.filter .cell.sp { flex: 1; justify-content: flex-end; color: var(--muted); }
.filter .cell.on { background: var(--block); color: var(--block-ink); box-shadow: var(--rules), inset 0 -3px 0 var(--gold); }
.grid3 { grid-template-columns: repeat(3, 1fr); }
.card-post { display: flex; flex-direction: column; justify-content: space-between; min-height: 440px; text-decoration: none; }
.card-post .t-lg { margin-top: 18px; max-width: 360px; }
.card-post .cp-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.card-post .cp-foot .t-p { max-width: 340px; }
.card-post .go { color: var(--ink); font-size: 22px; flex: none; }
.card-post.ink .go { color: var(--gold); }
.empty-state { min-height: 440px; display: flex; flex-direction: column; justify-content: space-between; }
.pager { display: flex; height: 72px; }
.pager .cell { display: flex; align-items: center; padding: 0 24px; text-decoration: none; }
.pager .cell.sp { flex: 1; }
.pager .cell.on { background: var(--block); color: var(--block-ink); }
.featured .cell.ink { display: flex; flex-direction: column; justify-content: space-between; }
.featured .t-word { --w: 84; max-width: 1000px; letter-spacing: -0.03em; line-height: 1; }
.featured .link { align-self: flex-start; color: inherit; }

/* ---------- article */
.rail .meta { margin-top: 56px; display: grid; }
.rail .meta div { border-top: 1px solid var(--rule); padding: 12px 0 14px; }
.rail .meta span { display: block; font-size: 12px; }
.rail .meta .k { color: var(--muted); }
.rail .back { text-decoration: none; display: inline-flex; gap: 12px; }
.art-hero .t-word { --w: 80; max-width: 860px; letter-spacing: -0.03em; line-height: 1; }
.art-hero .stand { margin-top: 48px; font-size: 22px; line-height: 1.45; max-width: 640px; }
.art-img { padding: 0; position: relative; background: var(--card); }
.art-img img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; inset: 0; }
.art-img .mono { position: absolute; left: 24px; top: 24px; opacity: .6; }
.art-side { position: sticky; top: var(--hh); align-self: start; }
.art-side .toc { margin-top: 28px; display: grid; }
.art-side .toc a { border-top: 1px solid var(--rule); padding: 12px 0; text-decoration: none; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 12px; text-transform: uppercase; }
.art-side .toc a { position: relative; padding-left: 16px; color: var(--muted); transition: color .4s var(--ease); }
/* contents list: a gold bar grows down the left of the section being read (and of a hovered entry) */
.art-side .toc a::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; background: var(--gold);
                           transform: scaleY(0); transform-origin: 50% 0; transition: transform .6s var(--ease-io); }
.art-side .toc a:hover, .art-side .toc a.on { color: var(--ink); }
.art-side .toc a:hover::before { transform: scaleY(.4); }
.art-side .toc a.on::before { transform: scaleY(1); }
.art-side .share { margin-top: 40px; }
.art-side .share a { display: block; margin-top: 8px; font-size: 18px; text-decoration: none; }
.prose { font-size: 17px; line-height: 1.75; color: var(--soft); }
.prose > * { max-width: 640px; }
.prose p { margin: 0 0 1.1em; }
.prose h2 { font-size: 32px; line-height: 1.22; letter-spacing: -0.02em; font-weight: 400; color: var(--ink); margin: 1.6em 0 .6em; scroll-margin-top: calc(var(--hh) + 24px); }
.prose h3 { font-size: 22px; line-height: 1.32; font-weight: 400; color: var(--ink); margin: 1.4em 0 .5em; }
.prose h4 { font-size: 18px; font-weight: 400; color: var(--ink); margin: 1.2em 0 .4em; }
.prose a { color: var(--ink); text-underline-offset: 3px; }
.prose ul, .prose ol { padding-left: 1.2em; margin: 0 0 1.1em; }
.prose li { margin-bottom: .4em; }
.prose img, .prose figure { max-width: 100%; height: auto; margin: 1.6em 0; }
.prose figcaption { font-size: 13px; color: var(--muted); margin-top: 8px; }
.prose blockquote { margin: 1.8em 0; padding: 4px 0 4px 24px; border-left: 2px solid var(--gold); font-size: 24px; line-height: 1.38; letter-spacing: -0.01em; color: var(--ink); }
.prose table { border-collapse: collapse; width: 100%; font-size: 15px; }
.prose th, .prose td { border-bottom: 1px solid var(--rule); padding: 8px 10px 8px 0; text-align: left; }
.prose .wp-block-embed, .prose iframe { max-width: 100%; }
.prose .clause-no { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 12px; color: var(--muted); margin-right: 10px; }
.legal-wrap { padding: 72px 24px 120px; }
.legal-wrap .prose h2 { font-size: 26px; }
.author .t-lg { margin-top: 28px; }
.author .t-p { margin-top: 28px; max-width: 560px; }
.author a.more { display: flex; flex-direction: column; justify-content: space-between; }
.author a.more:hover .go { transform: translateX(4px); }
.author .go { color: var(--gold); font-size: 28px; transition: transform .4s var(--ease); }

/* ---------- capability */
.subnav { display: grid; grid-template-columns: repeat(5, 1fr); height: 72px; }
.subnav a.cell { display: flex; align-items: center; padding: 0 24px; text-decoration: none; color: var(--muted); }
.subnav a.cell b { font-weight: 400; margin-right: 16px; opacity: .8; }
.subnav a.cell.on { background: var(--gold-cell); color: var(--on-gold); }
.cap-hero .word-cell { display: flex; flex-direction: column; justify-content: space-between; }
.cap-hero .word-cell .t-word { --w: 130; }
.cap-hero .cell.ink .t-word { color: var(--block-ink); }
.cap-hero.A .word-cell { --c: 1/3; --r: 1/3; }
.covers .rail-col { position: relative; padding: 0; }
.covers .rail-col .pin { position: sticky; top: var(--hh); height: calc(100vh - var(--hh)); max-height: 700px; padding: 24px; }
.covers .rail-col .pin .illo-c { position: absolute; left: 0; right: 0; top: 120px; aspect-ratio: 1; }
.covers .rail-col .pin .illo-c canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.covers .intro .t-xl { max-width: 760px; }
.covers .intro .t-p { margin-top: 40px; max-width: 560px; }
.covers .ct { display: flex; align-items: center; }
.covers .ct .t-word { --w: 100; }
.covers .item { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.covers .item .t-lg { font-size: 24px; max-width: 320px; }
.covers .item .t-p { font-size: 13px; max-width: 420px; }

/* ---------- 404 and plain */
.plain { min-height: 40vh; }

/* ---------- below 1080: two columns */
@media (max-width: 1080px) {
  .rows { grid-template-rows: none; grid-auto-rows: minmax(220px, auto); }
  .at { grid-column: 1 / -1; grid-row: auto; }
  .at.half { grid-column: auto; }
  .hero2 .hp-word { min-height: 380px; }
  .hero2 .t-word { font-size: min(200px, 22vw); white-space: normal; }
  .cell.win, .cell.illo { min-height: 240px; }
  .t-xxl { font-size: 40px; }
  .t-xl { font-size: 32px; }
  .stmt .cell.txt .t-p { margin-top: 40px; }
  .grid3, .three, .subnav { grid-template-columns: 1fr 1fr; }
  .subnav { height: auto; grid-template-columns: 1fr 1fr 1fr; }
  .subnav a.cell { height: 56px; }
  .three .cell { min-height: 320px; }
  .lst .head { position: relative; top: auto; min-height: 0; order: -1; }
  .lst .head .t-word { --w: 72; }
  .lst .row .ring { width: 80px; height: 80px; }
  .covers .rail-col .pin { position: relative; top: auto; height: 220px; }
  .covers .rail-col .pin .illo-c { display: none; }
  .covers .item { grid-template-columns: 1fr; }
  .case .main .t-xxl { font-size: 36px; }
  .art-hero .t-word { --w: 56; }
  .featured .t-word { --w: 56; }
  .art-side { position: relative; top: auto; }
  .srg-form { grid-template-columns: 1fr; }
  .card-post { min-height: 300px; }
}
@media (max-width: 700px) {
  .grid3, .three { grid-template-columns: 1fr; }
  .subnav { grid-template-columns: 1fr 1fr; }
  .at.half { grid-column: 1 / -1; }
  .hero2 .t-word { font-size: 24vw; }
  .cell.win { display: none; }
  .hero2 .cell.win, .cell.illo { min-height: 200px; }
  .marq .track { font-size: 24px; }
  .lst .row { flex-direction: column; }
  .lst .row .ring { align-self: flex-start; }
  .filter .cell { padding: 0 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .marq .track { animation: none; }
}
