/* The tab bar shared by the agentic pages and the adoption page. */
.tabs{display:flex; gap:4px; padding:8px max(8px, calc((100% - var(--maxw)) / 2 + 8px)) 0; background:var(--accent-soft); border-bottom:1px solid #cfdcf5; overflow-x:auto}
.tabs .tab{appearance:none; border:0; background:none; font:inherit; font-size:15px; font-weight:600; color:var(--muted); padding:11px 16px 12px; cursor:pointer; border-bottom:3px solid transparent; white-space:nowrap; text-decoration:none}
.tabs .tab:hover{color:var(--ink); text-decoration:none}
.tabs .tab.on{color:var(--accent-2); border-bottom-color:var(--accent)}
.tabs--sticky{position:sticky; top:53px; z-index:29}
@media (max-width:860px){.tabs{padding:6px 8px 0}}

/* The heading block at the top of all four pages: same size, same margins, same left edge as the content below. */
.pg-head{padding:22px 0 14px; text-align:left}
.pg-head .eyebrow{font-size:11.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--accent); margin:0 0 4px}
.pg-head h1{font-size:clamp(26px,3vw,34px); line-height:1.12; letter-spacing:-.022em; font-weight:800; margin:0 0 8px; text-wrap:balance}
.pg-head .lede{font-size:16px; line-height:1.55; color:var(--ink-2); margin:0; max-width:120ch}
.pg-head .lede strong{color:var(--ink); font-weight:600}