/* ---------- Button: label + arrow tile --------------------------------------
   Square throughout except the tile's top-right corner, which points the same
   way as the arrow inside it. Width is set on .btn2 and the label flexes. */
.btn2{display:inline-flex;align-items:stretch;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:transform var(--b2-dur) var(--b2-ease)}
.btn2__label{flex:1;display:flex;align-items:center;justify-content:center;height:3rem;padding:0 1.5rem;background:#fff;border:1px solid var(--hairline);border-right:0;font-family:var(--font-text);font-weight:var(--w-ui);font-size:var(--ui-size);line-height:var(--ui-lh);letter-spacing:var(--ui-track);color:var(--ink-heading);white-space:nowrap;transition:background var(--b2-dur) var(--b2-ease),color var(--b2-dur) var(--b2-ease),border-color var(--b2-dur) var(--b2-ease)}
.btn2__tile{display:grid;place-items:center;flex:none;width:3rem;height:3rem;border-radius:0 1.125rem 0 0;background:var(--accent);color:#fff;overflow:hidden;border:1px solid transparent;transition:background var(--b2-dur) var(--b2-ease),color var(--b2-dur) var(--b2-ease),border-color var(--b2-dur) var(--b2-ease)}
/* Two arrows: the resting one leaves through the rounded corner, its replacement arrives from the opposite one. */
.btn2__ico{position:relative;display:block;width:.75rem;height:.75rem}
.btn2__ico svg{position:absolute;left:0;top:0;display:block;transition:transform var(--b2-ico) var(--b2-ease)}
.btn2__ico svg+svg{transform:translate(-2rem,2rem)}
.btn2:hover .btn2__ico svg,.btn2:focus-visible .btn2__ico svg{transform:translate(2rem,-2rem)}
.btn2:hover .btn2__ico svg+svg,.btn2:focus-visible .btn2__ico svg+svg{transform:none}
.btn2:active{transform:translateY(1px)}
.btn2:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* Primary: the halves trade places on hover. */
.btn2:hover .btn2__label,.btn2:focus-visible .btn2__label{background:var(--accent);border-color:var(--accent);color:#fff}
.btn2:hover .btn2__tile,.btn2:focus-visible .btn2__tile{background:#fff;color:var(--accent)}
/* Quiet: outlined tile that fills on hover. */
.btn2--quiet .btn2__label{background:transparent}
.btn2--quiet .btn2__tile{background:transparent;color:var(--accent);border-color:var(--hairline);border-left:0}
.btn2--quiet:hover .btn2__label,.btn2--quiet:focus-visible .btn2__label{background:transparent;border-color:var(--accent);color:var(--ink-heading)}
.btn2--quiet:hover .btn2__tile,.btn2--quiet:focus-visible .btn2__tile{background:var(--accent);border-color:var(--accent);color:#fff}
/* On dark grounds */
.btn2--on-dark .btn2__label{background:transparent;border-color:rgba(255,255,255,.18);color:#fff}
.btn2--on-dark .btn2__tile{background:transparent;color:#fff;border-color:rgba(255,255,255,.18);border-left:0}
.btn2--on-dark:hover .btn2__label,.btn2--on-dark:focus-visible .btn2__label{background:transparent;border-color:rgba(255,255,255,.45);color:#fff}
.btn2--on-dark:hover .btn2__tile,.btn2--on-dark:focus-visible .btn2__tile{background:var(--accent);border-color:var(--accent);color:#fff}
.btn2--on-dark:focus-visible{outline-color:#fff}
@media (prefers-reduced-motion:reduce){
  .btn2,.btn2__label,.btn2__tile,.btn2__ico svg{transition:none}
  .btn2__ico svg+svg{display:none}
  .btn2:hover .btn2__ico svg,.btn2:focus-visible .btn2__ico svg{transform:none}
  .btn2:active{transform:none}
}

/* ---------- Small labels ---------- */
.chip{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;border-radius:.5rem;background:var(--chip-bg);font-weight:var(--w-ui);font-size:var(--cap-size);line-height:var(--cap-lh);letter-spacing:var(--eyebrow-track);color:var(--ink-eyebrow);text-transform:uppercase;white-space:nowrap}
.chip--white{background:#fff}
.eyebrow{margin:0;font-weight:var(--w-ui);font-size:var(--cap-size);line-height:var(--cap-lh);letter-spacing:var(--eyebrow-track);color:var(--ink-eyebrow);text-transform:uppercase}

/* ---------- Section header ---------- */
.sec-head{margin:0;font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--h2-size);line-height:var(--h2-lh);letter-spacing:var(--h2-track);color:var(--ink-heading);text-align:center;text-wrap:balance}
.sec-head b,.sec-head strong{font-weight:var(--w-display);color:var(--blue)}
.sec-head em{font-style:italic;color:var(--blue)}
.sec-sub{margin:1rem auto 0;max-width:40rem;font-size:var(--lead-size);line-height:var(--lead-lh);letter-spacing:var(--lead-track);color:var(--muted);text-align:center}
.sec-head--left,.sec-sub--left{text-align:left;margin-inline:0}