/* Sharetru · Partner hero (2026). Theme tokens only. */
.pt26-hero { position: relative; isolation: isolate; overflow: clip; display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(2.5rem, 1.5rem + 3vw, 3.5rem);
  align-items: center; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem) clamp(2.75rem, 2rem + 3.5vw, 5rem); padding-inline: var(--st-inline);
  font-family: var(--st-font); border-bottom: 1px solid var(--st-line);
  background: radial-gradient(56rem 26rem at 88% -8%, color-mix(in srgb, var(--st-aqua) 20%, transparent), transparent 60%),
              radial-gradient(44rem 24rem at 0% 108%, color-mix(in srgb, var(--st-royal) 16%, transparent), transparent 60%), var(--st-surface); }
.pt26-hero > * { min-width: 0; }
/* two columns from 1140px: below that the figure's labels would fall under 11.5px, so it sits under the copy at full size */
@media (min-width: 1140px) { .pt26-hero { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 3.5rem; } .pt26-hero--solo { grid-template-columns: minmax(0, 1fr); } }

.pt26-hero__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.625rem; }
.pt26-hero__badge { display: inline-flex; align-items: center; padding: 0.2rem 0.625rem; border: 1px solid color-mix(in srgb, var(--st-accent) 45%, transparent);
  border-radius: var(--st-radius-chip); color: var(--st-accent-ink); font-size: 0.65625rem; letter-spacing: 0.08em; }
.pt26-hero h1 { margin: 0 0 1.5rem; font-size: var(--st-fs-display-1); line-height: var(--st-lh-display); letter-spacing: var(--st-tracking-display); font-weight: 900; color: var(--st-heading); text-wrap: balance; }
.pt26-hero__h1b { display: block; margin-top: 0.875rem; font-size: 0.56em; line-height: 1.2; letter-spacing: var(--st-tracking-heading); font-weight: 800; color: var(--st-accent-ink); }
.pt26-hero__lead { margin: 0 0 1.25rem; font-size: var(--st-fs-lead); line-height: 1.7; color: var(--st-ink-soft); max-width: var(--st-measure-lead); }
.pt26-hero__lead strong, .pt26-hero__lead b { color: var(--st-ink); font-weight: 700; }
.pt26-hero__for { margin: 0 0 1.75rem; font-size: 0.9375rem; line-height: 1.6; font-weight: 600; color: var(--st-ink); max-width: var(--st-measure-lead); }
.pt26-hero__btns { margin: 0; }
.pt26-hero__micro { margin: 1.125rem 0 0; font-size: var(--st-fs-fine); line-height: 1.6; color: var(--st-muted); }

/* the relationship figure: a wide drawing, and a tall one for phones (two svgs, one shown) */
.pt26-hero__fig { margin: 0; width: 100%; max-width: 35rem; justify-self: center; }
@media (min-width: 1140px) { .pt26-hero__fig { justify-self: end; } }
@media (max-width: 1139px) { .pt26-hero__fig { justify-self: start; } }
.pt26-hero__svg { display: block; width: 100%; height: auto; overflow: visible; }
.pt26-hero__svg--tall { display: none; }
@media (max-width: 600px) { .pt26-hero__svg--wide { display: none; } .pt26-hero__svg--tall { display: block; } }
.pt26-hero__fig figcaption { margin: 0.875rem 0 0; font-size: var(--st-fs-fine); line-height: 1.6; color: var(--st-muted); }
.pt26-hero__fig .panel { fill: var(--st-surface); stroke: var(--st-line); stroke-width: 1; filter: drop-shadow(0 1px 2px color-mix(in srgb, var(--st-shadow) 5%, transparent)) drop-shadow(0 10px 28px color-mix(in srgb, var(--st-midnight) 7%, transparent)); }
.pt26-hero__fig .div { fill: none; stroke: var(--st-line); stroke-width: 1; }
.pt26-hero__fig text { font-family: var(--st-font); }
.pt26-hero__fig .rk { font-size: 13.5px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; fill: var(--st-accent-ink); }
.pt26-hero__fig .hd { font-size: 18px; font-weight: 800; letter-spacing: -0.01em; fill: var(--st-heading); }
.pt26-hero__fig .lb { font-size: 15px; font-weight: 600; fill: var(--st-ink-soft); }
.pt26-hero__fig .lb-m { fill: var(--st-muted); }
.pt26-hero__fig .e-line { fill: none; stroke: var(--st-accent); stroke-width: 2; stroke-linecap: round; }
.pt26-hero__fig .e-buy { stroke-width: 3; }
.pt26-hero__fig .e-intro { stroke-dasharray: 5 6; }
.pt26-hero__fig .h-line { fill: var(--st-accent); }
.pt26-hero__fig .pl text { font-weight: 800; letter-spacing: -0.005em; }
.pt26-hero__fig .pl-s rect { fill: var(--st-midnight); }
.pt26-hero__fig .pl-s .lg path { fill: var(--st-white); }
.pt26-hero__fig .pl-y rect { fill: var(--st-accent); }
.pt26-hero__fig .pl-y text { fill: var(--st-white); }
.pt26-hero__fig .pl-c rect { fill: var(--st-surface); stroke: var(--st-line-strong); stroke-width: 1.5; }
.pt26-hero__fig .pl-c text { fill: var(--st-ink); }
.pt26-hero__fig .bd circle { fill: var(--st-accent); }
.pt26-hero__fig .bd text { font-size: 12px; font-weight: 800; fill: var(--st-white); }

/* the trust strip: one Midnight row */
.pt26-trust { padding: 1.375rem var(--st-inline); font-family: var(--st-font); }
.pt26-trust ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.75rem 1.75rem; }
.pt26-trust li { display: inline-flex; align-items: center; gap: 0.5rem; margin: 0; max-width: none; font-size: 0.84375rem; line-height: 1.45; font-weight: 700; color: var(--st-ink-soft); }
.pt26-trust li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--st-green); flex: none; }

/* scroll progress line on the top edge: Royal Purple → Aqua → Electric Green (the site's progress gradient) */
.pt26-hero__progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 1001; pointer-events: none;
  background: linear-gradient(90deg, var(--st-royal), var(--st-aqua), var(--st-green));
  transform-origin: 0 50%; transform: scaleX(var(--pt26-progress, 0)); }
@supports (animation-timeline: scroll()) {
  .pt26-hero__progress { animation: pt26-progress linear both; animation-timeline: scroll(root); transform: scaleX(0); }
  @keyframes pt26-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
}
@media (prefers-reduced-motion: reduce) { .pt26-hero__progress { display: none; } }
[data-motion="off"] .pt26-hero__progress { display: none; }
@media print { .pt26-hero__progress { display: none; } }
@media (max-width: 760px) { .pt26-trust ul { flex-direction: column; align-items: flex-start; gap: 0.625rem; } .pt26-trust li { align-items: baseline; } .pt26-trust li::before { transform: translateY(-1px); } }
