/* ── /partners/ : page-specific pieces on top of the shared immersive design
   (nexus.css + pages.css). Everything here uses the vilkax-tokens.css variables
   so the page follows the dark / light theme the tokens define. ─────────── */

/* Status labels (Available / Pilot / Roadmap) - same silhouette as .verdict-pill */
.pt-status{display:inline-flex;align-items:center;gap:7px;font-family:var(--vx-f-mono);font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;padding:5px 10px;border-radius:999px;border:1px solid var(--vx-line-2);color:var(--vx-text-dim);
  background:color-mix(in srgb,var(--vx-text) 4%,transparent)}
.pt-status .d{width:7px;height:7px;border-radius:50%;background:currentColor}
.pt-status.available{color:var(--vx-mint-br);border-color:var(--vx-mint-ln);background:var(--vx-mint-sf)}
.pt-status.available .d{box-shadow:0 0 8px var(--vx-mint)}
.pt-status.pilot{color:var(--vx-sev-elevated);border-color:var(--vx-sev-elevated-ln);background:var(--vx-sev-elevated-sf)}
.pt-status.roadmap{color:var(--vx-blue-br);border-color:var(--vx-blue-ln);background:var(--vx-blue-sf)}

.pt-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:22px}
.pt-legend-d{font-size:12.5px;color:var(--vx-text-dim);margin-right:14px}

/* Card header row: product number + status */
.pt-card-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pt-num{font-family:var(--vx-f-mono);font-size:11px;letter-spacing:.12em;color:var(--vx-text-faint)}
.pt-free{font-family:var(--vx-f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--vx-on-accent);
  padding:5px 11px;border-radius:999px;background:linear-gradient(135deg,var(--vx-mint),var(--vx-emerald,var(--vx-mint)))}

/* The free P1 hero card */
.pt-hero-card{position:relative;display:grid;grid-template-columns:1.5fr 1fr;gap:28px;margin-top:28px;padding:34px 32px;border-radius:24px;overflow:hidden;
  background:color-mix(in srgb,var(--vx-text) 4%,transparent);border:1px solid var(--vx-mint-ln);
  box-shadow:0 30px 70px -40px rgba(0,0,0,.7)}
.pt-hero-card::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 70% at 15% 0%,var(--vx-mint-sf),transparent 70%)}
.pt-hero-card>*{position:relative;z-index:1}
.pt-card-t{font-family:var(--vx-f-disp);font-weight:600;font-size:clamp(24px,3vw,34px);letter-spacing:-.02em;margin:16px 0 10px;color:var(--vx-text)}
.pt-card-d{font-size:15px;color:var(--vx-text-muted);line-height:1.6;max-width:66ch}
.pt-card-why{margin-top:14px;font-size:14px;color:var(--vx-text);line-height:1.55;max-width:66ch;
  padding-left:14px;border-left:2px solid var(--vx-mint-br)}
.pt-hero-card-side{display:flex;flex-direction:column;justify-content:center;gap:8px;padding:22px;border-radius:18px;
  background:color-mix(in srgb,var(--vx-text) 3%,transparent);border:1px solid var(--vx-line)}
.pt-hero-card-side .btn{align-self:flex-start;margin-top:12px}

/* "How to integrate" block inside every product card */
.pt-how-k{margin-top:14px;font-family:var(--vx-f-mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--vx-text-faint)}
.pt-how{margin-top:4px;font-family:var(--vx-f-mono);font-size:12.5px;color:var(--vx-text);line-height:1.45}
.pt-how-note{font-size:12.5px;color:var(--vx-text-dim);line-height:1.5;margin-top:4px}
.pt-grid{margin-top:16px;align-items:stretch}
.pt-grid>.tcard{height:100%}
.pt-grid .tc-t{margin-top:14px}
.pt-wide{grid-column:1 / -1}
.pt-wide-2{grid-column:1 / -1}

/* The gap: an illustrative timeline */
.pt-timeline{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:20px;
  background:color-mix(in srgb,var(--vx-text) 3%,transparent);border:1px solid var(--vx-line)}
.pt-tl-row{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;
  border:1px solid transparent}
.pt-tl-row.now{border-color:var(--vx-sev-elevated-ln);background:var(--vx-sev-elevated-sf)}
.pt-tl-t{font-family:var(--vx-f-mono);font-size:11px;color:var(--vx-text-faint)}
.pt-tl-d{font-size:13.5px;color:var(--vx-text-muted);line-height:1.45}
.pt-tl-who{font-family:var(--vx-f-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:999px;white-space:nowrap}
.pt-tl-who.dev{color:var(--vx-mint-br);background:var(--vx-mint-sf);border:1px solid var(--vx-mint-ln)}
.pt-tl-who.srv{color:var(--vx-sev-elevated);background:var(--vx-sev-elevated-sf);border:1px solid var(--vx-sev-elevated-ln)}

/* Savings calculator */
.pt-calc{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;margin-top:34px;align-items:start}
.pt-calc-form{display:flex;flex-direction:column;gap:16px;width:100%;margin:0;max-width:none}
.pt-select{width:100%}
.pt-slider-field label{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.pt-yours{font-family:var(--vx-f-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--vx-sev-elevated);
  padding:3px 8px;border-radius:999px;border:1px solid var(--vx-sev-elevated-ln);background:var(--vx-sev-elevated-sf)}
.pt-slider-row{display:flex;align-items:center;gap:14px}
.pt-slider-row input[type=range]{flex:1;accent-color:var(--hero-br);height:32px}
.pt-rate-out{font-family:var(--vx-f-mono);font-size:15px;min-width:52px;text-align:right;color:var(--vx-text)}
.pt-field-note{font-size:12.5px;color:var(--vx-text-dim);line-height:1.5}
.lead-field input[type=number]{-moz-appearance:textfield}

.pt-calc-out{position:sticky;top:96px;padding:26px 24px;border-radius:22px;
  background:color-mix(in srgb,var(--vx-text) 4%,transparent);border:1px solid var(--vx-line-2)}
.pt-out-k{font-family:var(--vx-f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--vx-text-faint)}
.pt-out-v{font-family:var(--vx-f-disp);font-weight:700;font-size:clamp(32px,4vw,50px);letter-spacing:-.02em;line-height:1.05;margin-top:10px;
  background:linear-gradient(120deg,var(--hero-br),var(--vx-blue-br));-webkit-background-clip:text;background-clip:text;color:transparent}
.pt-out-rows{display:flex;flex-direction:column;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid var(--vx-line)}
.pt-out-row{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;color:var(--vx-text-muted)}
.pt-out-row b{color:var(--vx-text);font-weight:600;font-variant-numeric:tabular-nums}
.pt-out-note{margin-top:16px;font-size:12px;color:var(--vx-text-dim);line-height:1.5;padding:10px 12px;border-radius:12px;
  border:1px dashed var(--vx-line-2)}
.pt-out-empty{margin-top:12px;font-size:12.5px;color:var(--vx-text-faint)}
.pt-calc-out[data-has-input="true"] .pt-out-empty{display:none}

/* Three steps */
.pt-steps{align-items:stretch}
.pt-steps>.tcard{height:100%}
.pt-step-n{position:absolute;top:18px;right:20px;font-family:var(--vx-f-mono);font-size:28px;font-weight:600;color:var(--vx-text-faint);opacity:.6}
.pt-step-link{margin-top:auto;padding-top:16px;font-size:13px;color:var(--hero-br);text-decoration:underline;text-underline-offset:3px}
.pt-step-link:hover{color:var(--vx-text)}

/* Trust note links */
.biz-threats-note a{color:var(--hero-br);text-decoration:underline;text-underline-offset:3px}

/* Inquiry form status: reuse .join-msg from pages.css; error/ok colours */
#pt-inq-msg{min-height:1.4em;margin-top:6px;font-size:13.5px}
#pt-inq-msg[data-ok="true"]{color:var(--vx-mint-br)}
#pt-inq-msg[data-ok="false"]{color:var(--vx-sev-critical)}

@media (max-width: 980px){
  .pt-hero-card{grid-template-columns:1fr}
  .pt-calc{grid-template-columns:1fr}
  .pt-calc-out{position:static}
}
@media (max-width: 720px){
  .pt-hero-card{padding:24px 20px}
  .pt-tl-row{grid-template-columns:52px 1fr}
  .pt-tl-who{grid-column:2;justify-self:start}
  .lead-row{grid-template-columns:1fr}
}