/* What both Agentic Workflows pages share: the warm dark world of the page, the slim hero that holds only the top bar (page A), and the clear line that leads to the other page (the top of page B, the end of page A). */
.world-agentic { --world-background: #1a1714; --world-deep: #0f0d0b; --world-tint: #f2b544; --world-on-color: #f3efe6; --world-chip: rgb(243 239 230 / 0.1); } /* ink-raised hero, amber accents */
.agentic-hero { border: 1px solid var(--ink-line); border-top: 0; } /* a quiet edge, the hero is nearly the page colour */
.agentic-hero .case-bar a { display: inline-flex; align-items: center; min-height: 44px; } /* easy to tap */
.case-footer a { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: 4px; } /* the footer links are at least 44 px high, on both pages */
.agentic-hero-bar { border-radius: 0; } /* page A: just the bar */
.agentic-hero-bar .case-bar { padding: 10px 0; } /* a slim bar */
main > .agentic-picture { margin-top: 24px; } /* space under the bar */
.agentic-sister { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 28px 0 0; padding: 18px 22px; border: 1px solid var(--ink-line); border-radius: 18px; background: var(--ink-raised); } /* the line to the other page, a quiet tile */
.agentic-sister > span { color: var(--amber); font: 500 13px var(--mono); letter-spacing: 0.05em; text-transform: uppercase; } /* its small label */
.agentic-sister a { display: inline-flex; align-items: center; min-height: 44px; color: var(--paper); font: 700 clamp(18px, 2vw, 22px) var(--display); text-underline-offset: 4px; } /* the link itself, easy to tap */
.agentic-sister p { flex-basis: 100%; color: var(--paper-soft); font: 400 15px var(--body); } /* one plain line under it */
.agentic-sister-top { margin: 24px 0 0; } /* page B: right under the hero */
.agentic-sister-end { margin: 24px 0 8px; } /* page A: after the repo dock */