/* page components (moved from site.css: used only on this page) */
/* cta-grid */
.cta-grid{margin-top:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:64px;align-items:start}
@media (max-width:1024px){
  .cta-grid{grid-template-columns:1fr;gap:48px}
}
/* form-slot */
.form-slot{padding:32px 32px 32px;border:1px solid rgba(255,255,255,.14);border-radius:var(--r-card);
  background:rgba(255,255,255,.05)}
.form-slot .btn{width:100%;justify-content:center;margin-top:12px}
/* pcard */
.pcard__ico{width:40px;height:40px;margin-bottom:0}
.pcard__ico svg{width:20px;height:20px}
/* caps */
.caps p{font-size:14px;line-height:1.8;color:var(--body);padding-top:4px}
/* CTA with the partnership form: left-aligned two-column band */
/* ============================================================
   COLLABORATION MODELS
   ============================================================ */
.model__n{margin-bottom:24px}
.model dl{margin:24px 0 0;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:12px}
.model dt{color:var(--muted);margin-bottom:4px}
.model dd{margin:0;font-size:14px;line-height:1.8;color:var(--body)}
/* ============================================================
   CAPABILITY LIST
   ============================================================ */
.caps{border-top:1px solid var(--line-strong)}
.caps li{
  display:grid;grid-template-columns:52px 360px 1fr;gap:24px;align-items:start;padding:32px 4px;
  border-bottom:1px solid var(--line-strong)
}
.caps .num{padding-top:4px}
.caps b{font-size:16px;font-weight:700;color:var(--ink);line-height:1.8;letter-spacing:-.02em}
.caps a:hover{border-bottom-color:var(--accent)}
/* ============================================================
   PRODUCT CARDS — 3 columns × 3 rows, mirrors the mega menu
   ============================================================ */
.pcard__hd{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.pcard b{display:block;font-size:16px;font-weight:700;color:var(--ink);line-height:1.8;letter-spacing:0}
.pcard small{display:block;font-size:14px;line-height:1.8;color:var(--body)}
/* ============================================================
   GETTING STARTED — compact 4-step strip
   ============================================================ */
.gsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:gs}
.gstep{position:relative;padding:24px 24px 32px;background:var(--white);border:1px solid var(--line)}
.gstep:first-child{border-radius:var(--r-card) 0 0 var(--r-card)}
.gstep:last-child{border-radius:0 var(--r-card) var(--r-card) 0}
.gstep + .gstep{border-left:none}
.gstep::after{
  content:"";position:absolute;top:50%;right:-9px;z-index:2;width:18px;height:18px;
  transform:translateY(-50%) rotate(45deg);background:var(--white);border-top:1px solid var(--line);
  border-right:1px solid var(--line)
}
.gstep:last-child::after{display:none}
.gstep__k{display:block;color:var(--accent);margin-bottom:12px}
.gstep b{display:block;font-size:16px;font-weight:700;color:var(--ink);line-height:1.8;margin-bottom:8px}
.gstep p{font-size:14px;line-height:1.8;color:var(--body)}
/* ---------- support list ---------- */
.support li{
  position:relative;padding:24px 24px 24px 48px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-sm);font-size:16px;font-weight:600;line-height:1.8;color:var(--ink)
}
.support li::before{
  content:"";position:absolute;left:22px;top:27px;width:9px;height:9px;border-radius:var(--r-xs);
  background:var(--grad);transform:rotate(45deg)
}
/* ============================================================
   FAQ
   ============================================================ */
.contact-direct{font-size:16px;line-height:1.8;color:rgba(255,255,255,.72)}
.contact-direct b{display:block;color:var(--white);font-size:16px;font-weight:700;margin-bottom:12px}
.contact-direct a{color:var(--accent-soft);border-bottom:1px solid rgba(129,140,248,.4)}
/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .caps li{grid-template-columns:44px 300px 1fr;gap:24px}
}
@media (max-width:1024px){
  .gsteps{grid-template-columns:repeat(2,1fr)}
  .gstep{border-radius:0;border-left:1px solid var(--line)}
  .gstep:nth-child(1){border-radius:var(--r-card) 0 0 0}
  .gstep:nth-child(2){border-radius:0 var(--r-card) 0 0;border-left:none}
  .gstep:nth-child(3){border-radius:0 0 0 var(--r-card);border-top:none}
  .gstep:nth-child(4){border-radius:0 0 var(--r-card) 0;border-top:none;border-left:none}
  .gstep::after{display:none}
  .caps li{grid-template-columns:44px 1fr;gap:12px 24px}
  .caps p{grid-column:2}
}
@media (max-width:860px){
    .gsteps{grid-template-columns:1fr}
  .gstep:nth-child(1){border-radius:var(--r-card) var(--r-card) 0 0}
  .gstep:nth-child(2),.gstep:nth-child(3){border-radius:0;border-top:none}
  .gstep:nth-child(4){border-radius:0 0 var(--r-card) var(--r-card);border-top:none}
  .gstep + .gstep{border-left:1px solid var(--line)}
  /* role table becomes stacked cards */
}
@media (max-width:520px){
  .caps li{grid-template-columns:1fr;gap:8px}
  .caps p{grid-column:auto}
}
/* form CTA is left-aligned */