/* The partner page (/partners, 28 Oct 2026). Loaded only by that page, after app.css, so it can only add to it. Phone first
   (360 px), the theme tokens of app.css only (Daylight and Lamplight both follow), tap targets of 44 px and more, no inline
   styles. "Stamped and filed": each path is a filed card with the punched holes along the top, its mark on a gold ring like
   the ledger's rows, checks in ledger green; one stamp at most ("Received", after a sent form). */

.pp h1 { overflow-wrap: anywhere; hyphens: auto; }
.pp .ic { flex: none; }
.pp-head { max-width: 46rem; margin-bottom: clamp(24px, 4vw, 40px); }
.pp-head .lead { margin-bottom: 0; }

/* Three equal paths: stacked on phones, side by side from 900 px, the actions always at the foot of each card. */
.pp-paths { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
@media (min-width: 900px) { .pp-paths { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; } }
.pp-path { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 34px 22px 22px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r-panel); box-shadow: var(--shadow); }
.pp-path::before { content: ""; position: absolute; top: 12px; left: 22px; right: 22px; height: 8px;
  background: radial-gradient(circle, var(--paper) 2.6px, var(--line-strong) 3.1px, transparent 3.6px) 0 50% / 14px 8px repeat-x; }
.pp-path.is-chosen { border-color: var(--pen); box-shadow: inset 0 0 0 1.5px var(--pen), var(--shadow); }
.pp-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--surface); color: var(--gold-text);
  border: 2px solid var(--gold); box-shadow: 0 0 0 5px var(--surface); }
.pp-mark .ic { width: 22px; height: 22px; }
.pp-path h2 { margin: 14px 0 4px; font-size: clamp(1.3rem, 1.1rem + .8vw, 1.5rem); line-height: 1.2; overflow-wrap: anywhere; }
.pp-who { margin: 0 0 14px; font: 700 .76rem/1.4 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.pp-gets { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.pp-gets li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; color: var(--ink); }
.pp-gets .ic { width: 18px; height: 18px; margin-top: 3px; color: var(--pen); stroke-width: 2.4; }
.pp-gets span { min-width: 0; overflow-wrap: anywhere; }
.pp-note { margin: 0 0 14px; padding: 12px 14px; border-radius: 14px; background: var(--gold-soft); color: var(--ink); font-size: .92rem; line-height: 1.5; }
.pp-acts { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin: auto 0 0; padding-top: 6px; }
.pp-acts .btn { width: 100%; }
.pp-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 0; color: var(--ink); font-weight: 600;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; overflow-wrap: anywhere; }
.pp-link .ic { width: 18px; height: 18px; color: var(--pen); }
.pp-link:hover { text-decoration-thickness: 2px; }
.pp-write { color: var(--pen); }

/* The form: one column at reading width (html's scroll-padding-top already keeps the #partner-form anchor clear of the head). */
.pp-form-wrap { max-width: 680px; margin: clamp(40px, 6vw, 72px) auto 0; }
.pp-form-wrap:focus { outline: none; }
.pp-form-wrap > h2 { margin: 0 0 8px; }
.pp-form-lead { margin: 0 0 18px; color: var(--ink-2); line-height: 1.55; }
/* One track that may shrink: Turnstile's fixed 300 px widget must not widen the form past the column at 320 px (Forge S1); the
   widget alone overhangs a little there, as on /report. */
.pp-form { grid-template-columns: minmax(0, 1fr); }
.pp-form .notice { margin: 0; }
.pp-choices { grid-template-columns: 1fr; }
@media (min-width: 560px) { .pp-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pp-choices .choice span { min-height: 64px; overflow-wrap: anywhere; }
.pp-choices .choice input[aria-invalid="true"] + span { border-color: var(--red); }
.pp-form fieldset > .err { display: block; margin-top: 10px; }
.pp-form .check a { color: var(--ink); }
.pp-form .btn-lg { width: 100%; }
@media (min-width: 560px) { .pp-form .btn-lg { width: auto; } }

/* After a sent form: the stamp, the thanks, one next step for the path chosen. */
.pp-sent { padding: 26px 22px 22px; border-radius: var(--r-panel); background: var(--green-soft); color: var(--ink); }
.pp-sent .stamp { --stamp-bg: var(--green-soft); margin: 0 0 14px 4px; }
.pp-sent p { margin: 0 0 10px; line-height: 1.55; }
.pp-sent .muted { color: var(--ink-2); }
.pp-sent-lead { font-size: 1.08rem; }
.pp-sent .pp-acts { flex-direction: row; flex-wrap: wrap; margin: 6px 0 0; gap: 10px; }
.pp-sent .pp-acts .btn { width: auto; }
