/* =====================================================================
   PARTNERS PAGE (partners.html)
   Page-specific styles only. Tokens, buttons, the eyebrow, form fields,
   .form-message and the .reveal animation all come from site.css.
   Every section sits in the site's own .wrap, so the page shares the
   homepage's content width and gutters.
   ===================================================================== */
.pt-page {
  --pt-purple: #7c3aed;
  --pt-ink: #12182a;
  --pt-ink-2: #4e5870;
  --pt-muted: #727b96;
  --pt-line: rgba(124, 58, 237, .10);
  --pt-line-hover: rgba(124, 58, 237, .20);
  --pt-tint: rgba(124, 58, 237, .07);
  --pt-shadow: 0 10px 30px rgba(72, 48, 125, .05);
  --pt-shadow-hover: 0 14px 36px rgba(72, 48, 125, .08);
  --pt-ease: cubic-bezier(.2, .8, .2, 1);
  /* one rhythm for the gaps between sections */
  --pt-space: 56px;
  --pt-space-lg: 52px;
  position: relative;
  z-index: 2;
  color: var(--pt-ink);
}

/* in-page links (Become a Partner) land below the fixed navbar */
#partner-form { scroll-margin-top: 104px; }

/* sections carry no padding of their own; each one is spaced from the one
   before it, so the gaps are exactly the rhythm above */
.pt-section { position: relative; margin-top: var(--pt-space); }

.pt-head { max-width: 760px; margin-bottom: 28px; }

.pt-page .eyebrow { font-size: 12px; letter-spacing: .14em; }

.pt-h2 {
  margin: 12px 0 0;
  font-size: clamp(2rem, 3.1vw, 2.85rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.03em;
  color: var(--pt-ink);
}

.pt-h1 .grad,
.pt-h2 .grad {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------------------------------------------------------------------
   1. HERO
   --------------------------------------------------------------------- */
.pt-hero {
  position: relative;
  padding: 116px 0 0;
}

.pt-hero-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 47fr) minmax(0, 53fr);
  align-items: center;
  gap: clamp(24px, 3vw, 40px);
}

.pt-h1 {
  margin: 16px 0 0;
  /* capped so "Become an AttackLens" stays on one line: past 1440px the
     column stops growing (it sits in the 1440 .wrap) but vw keeps rising */
  font-size: clamp(2.4rem, 4.05vw, 3.65rem);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -.035em;
  color: var(--pt-ink);
}

.pt-sub {
  max-width: 560px;
  margin: 20px 0 28px;
  font-size: 18px;
  line-height: 1.6;
  color: var(--pt-ink-2);
}

.pt-acts { display: flex; flex-wrap: wrap; gap: 14px; }

/* three small supporting points under the CTAs — sized to their content,
   not spread across the column */
.pt-points {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 20px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}
.pt-point { display: flex; align-items: center; gap: 10px; }
/* titles stay on one line; only the small line wraps, so all three points
   fit one row at common laptop widths, Windows scrollbar included */
.pt-point b { white-space: nowrap; }
.pt-point small { max-width: 130px; }
.pt-point-ic {
  display: grid;
  place-items: center;
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--pt-line);
  box-shadow: var(--pt-shadow);
  color: var(--pt-purple);
  transition: transform .2s var(--pt-ease), border-color .2s var(--pt-ease), box-shadow .2s var(--pt-ease);
}
.pt-point-ic svg { width: 18px; height: 18px; }
.pt-point:hover .pt-point-ic {
  transform: translateY(-2px);
  border-color: var(--pt-line-hover);
  box-shadow: var(--pt-shadow-hover);
}
.pt-point b { display: block; font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--pt-ink); }
.pt-point small { display: block; margin-top: 2px; font-size: 12px; line-height: 1.35; color: var(--pt-muted); }

/* ---- hero visual: the supplied partnership image (its cards are part of
   the artwork). Edges fade softly into the white page rather than ending
   in a hard rectangle; the bottom fades a little more where the figures
   are cropped. ---- */
.pt-hero-visual { position: relative; }
.pt-hero-img {
  display: block;
  width: 100%;
  height: auto;
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%),
    linear-gradient(180deg, transparent 0, #000 3%, #000 90%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-image:
    linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%),
    linear-gradient(180deg, transparent 0, #000 3%, #000 90%, transparent 100%);
          mask-composite: intersect;
}

/* ---------------------------------------------------------------------
   2. WHY PARTNER
   --------------------------------------------------------------------- */
.pt-why { margin-top: 64px; }
.pt-why-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(24px, 5vw, 80px);
}
.pt-why-grid p {
  margin: 0;
  max-width: 580px;
  font-size: 17px;
  line-height: 1.7;
  color: var(--pt-ink-2);
}

/* ---------------------------------------------------------------------
   3. BACKED BY — continuous partner slider on a soft rail
   --------------------------------------------------------------------- */
.pt-backed { margin-top: 48px; }
.pt-backed .pt-head { margin-bottom: 22px; }

.pt-rail {
  position: relative;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(250, 248, 255, .95) 0%, rgba(255, 255, 255, .7) 100%);
  border: 1px solid var(--pt-line);
  box-shadow: inset 0 1px 0 #fff;
}

.pt-marquee {
  position: relative;
  overflow: hidden;
  padding: 20px 0 22px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}

.pt-track {
  display: flex;
  align-items: center;
  gap: 18px;
  width: max-content;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* --pt-shift (one full set, in px) and --pt-dur are set by partners.js */
.pt-track.is-moving {
  animation: pt-marquee var(--pt-dur, 34s) linear infinite;
  will-change: transform;
}
.pt-marquee:hover .pt-track,
.pt-marquee:focus-within .pt-track { animation-play-state: paused; }

@keyframes pt-marquee {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(calc(-1 * var(--pt-shift, 50%)), 0, 0); }
}

.pt-pcard {
  flex: none;
  display: flex;
  align-items: center;
  gap: 18px;
  width: 380px;
  height: 128px;
  padding: 18px 22px;
  border-radius: 20px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--pt-line);
  box-shadow: var(--pt-shadow);
  transition: transform .2s var(--pt-ease), border-color .2s var(--pt-ease), box-shadow .2s var(--pt-ease);
}
.pt-pcard:hover {
  transform: translateY(-3px);
  border-color: var(--pt-line-hover);
  box-shadow: var(--pt-shadow-hover);
}

/* the logo leads the card; it is only rendered when a real logo file is
   set in partners.js — never a stand-in icon */
/* one logo height for every partner; a wide logo may take more width, so
   square and banner-shaped marks carry similar weight */
.pt-plogo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: 84px;
  max-width: 150px;
  height: 66px;
}
/* logos are shown exactly as supplied; multiply lets a white logo background
   sit flush on the card, and a coloured one keeps soft corners */
.pt-plogo img {
  max-width: 150px;
  width: auto;
  height: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 6px;
  mix-blend-mode: multiply;
}

.pt-ptext { min-width: 0; }
.pt-pname { display: block; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--pt-ink); }
.pt-pdesc {
  display: -webkit-box;
  margin-top: 5px;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.5;
  color: var(--pt-ink-2);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* until its logo is supplied a card carries the company's name and line only */
.pt-pcard--nologo { width: 320px; }
.pt-pcard--nologo .pt-ptext { padding-left: 16px; border-left: 2px solid rgba(124, 58, 237, .28); }
.pt-pcard--nologo .pt-pname { font-size: 16px; }

/* a quiet chip after the last partner — not a card */
.pt-soon {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .75);
  border: 1px dashed rgba(124, 58, 237, .24);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--pt-muted);
  white-space: nowrap;
}
/* Be the next — links to the application form */
.pt-soon-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--pt-purple);
  font-weight: 700;
}
.pt-soon-link::after {
  content: "\2192";
  transition: transform .2s var(--pt-ease);
}
.pt-soon:hover { border-color: rgba(124, 58, 237, .45); background: #fff; }
.pt-soon:hover .pt-soon-link::after { transform: translateX(3px); }
.pt-soon::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--pt-purple);
  opacity: .5;
}

.pt-backed-caption {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 16px 0 0;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
  color: var(--pt-purple);
}
.pt-backed-caption::before,
.pt-backed-caption::after {
  content: "";
  flex: 1;
  min-width: 24px;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(124, 58, 237, .32) 0 4px, transparent 4px 9px);
}

/* ---------------------------------------------------------------------
   4. PARTNER BENEFITS
   --------------------------------------------------------------------- */
.pt-benefits { margin-top: var(--pt-space-lg); }
.pt-benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* the list item is the grid cell; the card fills it, so a row is one height */
.pt-benefits-grid > li { display: flex; }
.pt-bcard {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  min-height: 132px;
  padding: 22px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid var(--pt-line);
  box-shadow: var(--pt-shadow);
  transition: transform .2s var(--pt-ease), border-color .2s var(--pt-ease), box-shadow .2s var(--pt-ease);
}
.pt-bcard:hover {
  transform: translateY(-3px);
  border-color: var(--pt-line-hover);
  box-shadow: var(--pt-shadow-hover);
}
.pt-bcard-ic {
  display: grid;
  place-items: center;
  flex: none;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(140deg, rgba(124, 58, 237, .12), rgba(192, 38, 211, .08));
  color: var(--pt-purple);
}
.pt-bcard-ic svg { width: 22px; height: 22px; }
.pt-bcard h3 { margin: 3px 0 0; font-size: 17px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--pt-ink); }
.pt-bcard p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--pt-ink-2); }

/* ---------------------------------------------------------------------
   5. HOW PARTNERSHIP WORKS
   --------------------------------------------------------------------- */
.pt-process { margin-top: var(--pt-space-lg); }
.pt-steps {
  --pt-gap: clamp(20px, 3vw, 48px);
  --pt-node: 36px;
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--pt-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}
/* the connector runs from the centre of node 1 to the centre of node 3; the
   purple fill draws across once, when the strip scrolls into view (.in) */
.pt-steps::before,
.pt-steps::after {
  content: "";
  position: absolute;
  top: calc(var(--pt-node) / 2 - 1px);
  left: calc(var(--pt-node) / 2);
  width: calc((100% - 2 * var(--pt-gap)) * 2 / 3 + 2 * var(--pt-gap));
  height: 2px;
  border-radius: 2px;
}
.pt-steps::before { background: repeating-linear-gradient(90deg, rgba(124, 58, 237, .22) 0 5px, transparent 5px 11px); }
.pt-steps::after {
  background: var(--grad);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1.4s cubic-bezier(.22, 1, .36, 1) .35s;
}
.pt-steps.in::after { transform: scaleX(1); }

.pt-step { position: relative; }
.pt-step-num {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: var(--pt-node);
  height: var(--pt-node);
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--pt-line-hover);
  box-shadow: 0 0 0 5px #fff, var(--pt-shadow);
}
.pt-step-num span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--grad);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
.pt-step-body { display: flex; align-items: flex-start; gap: 14px; margin-top: 18px; }
.pt-step-ic {
  display: grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: var(--pt-tint);
  border: 1px solid rgba(124, 58, 237, .08);
  color: var(--pt-purple);
}
.pt-step-ic svg { width: 20px; height: 20px; }
.pt-step h3 { margin: 1px 0 0; font-size: 17px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--pt-ink); }
.pt-step p { margin: 5px 0 0; max-width: 300px; font-size: 14.5px; line-height: 1.55; color: var(--pt-ink-2); }

/* ---------------------------------------------------------------------
   6. BECOME A PARTNER — form
   --------------------------------------------------------------------- */
.pt-apply-shell {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 6fr);
  align-items: center;
  gap: clamp(24px, 3vw, 44px);
  padding: 20px 20px 20px clamp(24px, 3.4vw, 52px);
  border-radius: 28px;
  background:
    radial-gradient(70% 90% at 0% 100%, rgba(196, 181, 253, .32), transparent 60%),
    linear-gradient(135deg, #f8f4ff 0%, #fbf9ff 55%, #f5f0ff 100%);
  border: 1px solid var(--pt-line);
}

.pt-apply-copy p {
  max-width: 420px;
  margin: 16px 0 0;
  font-size: 16.5px;
  line-height: 1.65;
  color: var(--pt-ink-2);
}

/* the supplied satellite image above the three chips (desktop); below
   1025px, where the form stacks, the image is dropped */
.pt-apply-art { position: relative; }
.pt-apply-img { display: none; }

.pt-apply-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}
.pt-apply-chips li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 13px 7px 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--pt-line);
  box-shadow: var(--pt-shadow);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--pt-ink);
  white-space: nowrap;
}
.pt-apply-chips i {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--pt-tint);
  color: var(--pt-purple);
}
.pt-apply-chips svg { width: 13px; height: 13px; }

@media (min-width: 1025px) {
  .pt-apply-art { margin: 16px 0 0; }
  /* soft straight edges (as on the hero image), so the picture melts into
     the lavender panel without clipping the satellite */
  .pt-apply-img {
    display: block;
    width: min(100%, 304px);
    height: auto;
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%),
      linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
    -webkit-mask-composite: source-in;
            mask-image:
      linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%),
      linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
            mask-composite: intersect;
  }
  /* the chips sit in a row under the picture rather than on top of it */
  .pt-apply-chips { margin-top: 10px; }
}

.pt-form-card {
  position: relative;
  padding: 24px 28px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--pt-line);
  box-shadow: 0 16px 40px rgba(72, 48, 125, .07);
}

/* the form's own header row: highlighted, but not a banner */
.pt-form-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--pt-line);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: -.01em;
  color: #4c1d95;
}
.pt-form-title i {
  display: grid;
  place-items: center;
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: var(--grad);
  color: #fff;
  box-shadow: 0 8px 18px rgba(124, 58, 237, .25);
}
.pt-form-title svg { width: 19px; height: 19px; }

.pt-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}
.pt-form-grid .field { margin: 0; }
.pt-form-grid .field--full { grid-column: 1 / -1; }
.pt-form .field label { margin-bottom: 5px; }
.pt-form .field input,
.pt-form .field select {
  height: 50px;
  padding-block: 0;
}
.pt-form .field textarea { min-height: 110px; height: 110px; }
/* focusing the first invalid field must not park it under the fixed navbar */
.pt-form [name] { scroll-margin-top: 120px; }
.pt-req { color: var(--pt-purple); }

.pt-form .field select {
  -webkit-appearance: none;
          appearance: none;
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px 16px;
  cursor: pointer;
}
.pt-form .field select:invalid { color: #8a93a8; }
.pt-form .field select option { color: var(--pt-ink); }

.pt-form .field.is-invalid input,
.pt-form .field.is-invalid select,
.pt-form .field.is-invalid textarea {
  border-color: var(--crit);
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .10);
}
.pt-err {
  display: none;
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--crit);
}
.pt-form .field.is-invalid .pt-err { display: block; }

.pt-submit {
  justify-content: center;
  width: 100%;
  height: 54px;
  margin-top: 16px;
  padding-block: 0;
}
.pt-submit[disabled] { opacity: .75; cursor: progress; transform: none; }

.pt-status { align-items: flex-start; gap: 10px; line-height: 1.5; }
.pt-status.success,
.pt-status.error { display: flex; }
.pt-status svg { flex: none; width: 18px; height: 18px; margin-top: 1px; }
.pt-status a { font-weight: 700; text-decoration: underline; }

/* ---------------------------------------------------------------------
   7. FINAL CTA BAND — the site gradient, softened with light
   --------------------------------------------------------------------- */
.pt-cta { margin-top: var(--pt-space); }
.pt-cta-band {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(16px, 2.4vw, 28px);
  padding: 24px clamp(22px, 3vw, 40px);
  border-radius: 24px;
  background:
    radial-gradient(40% 120% at 100% 0%, rgba(255, 255, 255, .22), transparent 60%),
    radial-gradient(30% 140% at 0% 100%, rgba(255, 255, 255, .14), transparent 60%),
    var(--grad);
  box-shadow: 0 18px 40px rgba(124, 58, 237, .22);
  color: #fff;
}
.pt-cta-ic {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .3);
}
.pt-cta-ic svg { width: 25px; height: 25px; }
.pt-cta-label {
  margin: 0;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .85);
}
.pt-cta-title {
  margin: 6px 0 0;
  font-size: clamp(1.25rem, 1.9vw, 1.6rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: #fff;
}
.pt-cta-btn {
  background: #fff;
  color: var(--brand-ink);
  box-shadow: 0 10px 24px rgba(40, 12, 90, .22);
}
.pt-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(40, 12, 90, .3); }

.pt-page .btn:focus-visible,
.pt-page a:focus-visible {
  outline: 2px solid rgba(124, 58, 237, .6);
  outline-offset: 3px;
}
.pt-cta-btn:focus-visible { outline-color: #fff; }

/* ---------------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------------- */
@media (max-width: 1100px) {
  .pt-h1 { font-size: clamp(2.3rem, 3.85vw, 3.4rem); }
}

@media (max-width: 1024px) {
  .pt-benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-apply-shell { grid-template-columns: minmax(0, 1fr); padding: 28px; }
  .pt-apply-copy p { max-width: 620px; }
}

@media (max-width: 900px) {
  .pt-page { --pt-space: 44px; --pt-space-lg: 48px; }
  .pt-why { margin-top: var(--pt-space); }
  .pt-hero-inner { grid-template-columns: minmax(0, 1fr); }
  .pt-hero-visual { width: 100%; max-width: 640px; margin: 8px auto 0; }
  .pt-why-grid { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 16px; }
}

@media (max-width: 768px) {
  .pt-page { --pt-space: 40px; --pt-space-lg: 44px; }
  .pt-backed { margin-top: 36px; }
  .pt-hero { padding-top: 104px; }

  /* steps stack vertically; each step draws its own short connector */
  .pt-steps { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pt-steps::before,
  .pt-steps::after { display: none; }
  .pt-step { display: grid; grid-template-columns: var(--pt-node) minmax(0, 1fr); column-gap: 14px; }
  .pt-step-body { margin-top: 0; }
  .pt-step:not(:last-child)::after {
    content: "";
    position: absolute;
    left: calc(var(--pt-node) / 2 - 1px);
    top: calc(var(--pt-node) + 6px);
    bottom: -18px;
    width: 2px;
    background: repeating-linear-gradient(180deg, rgba(124, 58, 237, .3) 0 5px, transparent 5px 11px);
  }
  .pt-step p { max-width: none; }

  .pt-cta-band { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
}

@media (max-width: 640px) {
  .pt-page { --pt-space: 36px; --pt-space-lg: 40px; }
  .pt-head { margin-bottom: 22px; }
  .pt-sub { font-size: 16.5px; }
  .pt-points { flex-direction: column; gap: 12px; }
  .pt-point small { max-width: none; }
  .pt-benefits-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .pt-bcard { min-height: 0; padding: 18px; }
  .pt-apply-shell { padding: 20px 16px; border-radius: 22px; }
  .pt-form-card { padding: 20px; }
  .pt-form-grid { grid-template-columns: minmax(0, 1fr); }
  .pt-form-title { font-size: 15.5px; }

  .pt-marquee { padding: 16px 0 18px; }
  .pt-pcard { width: 292px; height: auto; min-height: 108px; gap: 14px; padding: 16px; }
  .pt-pcard--nologo { width: 248px; }
  .pt-plogo { min-width: 64px; max-width: 112px; height: 50px; }
  .pt-plogo img { max-width: 112px; }
  .pt-pname { font-size: 14px; }
  .pt-backed-caption { font-size: 10.5px; letter-spacing: .12em; gap: 10px; }

}

/* ---------------------------------------------------------------------
   REDUCED MOTION — no auto-scroll; the partner row
   becomes a normal swipeable strip
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pt-steps::after { transition: none; }
  .pt-point-ic, .pt-pcard, .pt-bcard { transition: none; }
  .pt-point:hover .pt-point-ic, .pt-pcard:hover, .pt-bcard:hover { transform: none; }

  .pt-marquee {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-mask-image: none;
            mask-image: none;
  }
  .pt-track { padding-inline: 18px; }
  .pt-track.is-moving { animation: none; }
  .pt-pcard { scroll-snap-align: start; }
}