/* ===========================================================================
   Markerless Gait Analysis — /markerless-gait-analysis/
   GENERATED from gait-vision/final/final.html — do not hand-edit.
   Regenerate: python3 deploy/build-template.py

   Divi's parent style.css AND its customizer-generated CSS both still load
   under the child theme, so the defensive declarations on .rts-gait remain
   necessary — in particular the explicit `color` on every heading class, which
   exists because Divi's customizer sets h1..h6{color:#1E9DCC} at 2.95:1.
   =========================================================================== */
/* ══════════════════════════════════════════════════════════════════════════
   Markerless Gait Analysis — /markerless-gait-analysis/
   Shares the --rp-* token set with /3d-scanning/ so the two pages are one
   system. Everything is scoped under .rts-gait.

   THREE DEFENCES CARRIED OVER FROM THE PEER PAGE (all were real bugs there):
   1. Divi's CUSTOMIZER stylesheet sets h1..h6{color:#1E9DCC} — 2.95:1, below
      AA. Every heading class must declare `color` explicitly or it loses by
      inheritance. The local theme simulation does not contain this rule.
   2. `.gv-cta a{color:#fff}` out-orders `.gv-btn-solid` at equal specificity
      and renders the primary button white-on-white. `.gv-cta a.gv-btn-solid`
      is required.
   3. White on --rp-aqua (#3DCBB1) measures 2.02:1. The gradient is decorative
      only and never carries text.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --rp-deep:#1E6F94; --rp-mid:#2E9BB8; --rp-aqua:#3DCBB1;
  --rp-ink:#0F2A3A;  --rp-ink2:#5A7383; --rp-ink3:#9AAEBC;
  --rp-page:#F7F9FB; --rp-card:#FFFFFF; --rp-divider:#E4EBF0;
  --rp-gradient:linear-gradient(135deg,#1E6F94 0%,#2E9BB8 50%,#3DCBB1 100%);
  --rp-font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --rp-font-display:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --rp-s1:4px; --rp-s2:8px; --rp-s3:12px; --rp-s4:16px; --rp-s6:24px;
  --rp-s8:32px; --rp-s12:48px; --rp-s16:64px; --rp-s20:80px;
  --rp-r-sm:8px; --rp-r-md:16px; --rp-r-lg:24px; --rp-r-pill:9999px;
  --rp-shadow:0 4px 16px rgba(15,42,58,.06);
  --rp-maxw:1180px;
}

/* ── base ────────────────────────────────────────────────────────────── */
.rts-gait{
  font-family:var(--rp-font-body); color:var(--rp-ink);
  background:var(--rp-page); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.rts-gait *{box-sizing:border-box;}
.rts-gait p{margin:0 0 var(--rp-s4);}
.rts-gait img{max-width:100%; height:auto; display:block;}
.rts-gait a{color:var(--rp-deep); text-decoration:underline; text-underline-offset:2px;}
.rts-gait a:hover{color:var(--rp-mid);}
.rts-gait a:focus-visible,.rts-gait .gv-btn:focus-visible,.rts-gait .gv-zoom:focus-visible{
  outline:3px solid var(--rp-mid); outline-offset:3px; border-radius:var(--rp-r-sm);
}
.rts-gait .gv-wrap{max-width:var(--rp-maxw); margin:0 auto; padding:0 var(--rp-s6);}
.rts-gait .gv-band{padding:var(--rp-s20) 0;}
.rts-gait .gv-band--tint{background:var(--rp-card); border-block:1px solid var(--rp-divider);}

/* ── type — every heading pins `color` (defence 1) ───────────────────── */
.rts-gait .gv-h1{
  font-family:var(--rp-font-display); font-weight:700; font-size:clamp(34px,4.6vw,56px);
  line-height:1.08; letter-spacing:-.02em; color:var(--rp-ink); margin:0 0 var(--rp-s6);
}
.rts-gait .gv-h2{
  font-family:var(--rp-font-display); font-weight:700; font-size:clamp(26px,3vw,36px);
  line-height:1.18; letter-spacing:-.01em; color:var(--rp-ink); margin:0 0 var(--rp-s4);
}
.rts-gait .gv-h3{
  font-family:var(--rp-font-display); font-weight:700; font-size:19px; line-height:1.3;
  color:var(--rp-ink); margin:0 0 var(--rp-s1);
}
.rts-gait .gv-eyebrow{
  font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  /* --rp-mid (#2E9BB8) measures 3.06:1 here and fails AA — 13px bold is not
     "large text". --rp-deep is 5.30:1. Same reason the peer page pins heading colours. */
  color:var(--rp-deep); margin:0 0 var(--rp-s3);
}
.rts-gait .gv-lead{font-size:20px; line-height:1.55; color:var(--rp-ink2); max-width:62ch;}
.rts-gait .gv-sub{color:var(--rp-ink2);}

/* ── buttons ─────────────────────────────────────────────────────────── */
.rts-gait .gv-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--rp-s2);
  min-height:52px; padding:0 var(--rp-s8); border-radius:var(--rp-r-pill);
  font-family:var(--rp-font-display); font-weight:700; font-size:17px;
  text-decoration:none; border:2px solid var(--rp-deep);
  background:var(--rp-deep); color:#fff; cursor:pointer; transition:background .15s ease;
}
.rts-gait .gv-btn:hover{background:#17576f; border-color:#17576f; color:#fff; text-decoration:none;}
.rts-gait .gv-btn-ghost{background:transparent; color:var(--rp-deep);}
.rts-gait .gv-btn-ghost:hover{background:rgba(30,111,148,.08); color:var(--rp-deep);}
.rts-gait .gv-btn-solid{background:#fff; color:var(--rp-deep); border-color:#fff;}
.rts-gait .gv-btn-solid:hover{background:#E9F3F7; border-color:#E9F3F7;}
.rts-gait .gv-btns{display:flex; flex-wrap:wrap; gap:var(--rp-s3);}

/* ── 01 hero ─────────────────────────────────────────────────────────── */
.rts-gait .gv-hero{padding:var(--rp-s20) 0 var(--rp-s16);}
.rts-gait .gv-hero-grid{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:var(--rp-s16); align-items:center;
}
.rts-gait .gv-hero-rule{
  width:72px; height:6px; border-radius:var(--rp-r-pill);
  background:var(--rp-gradient); margin:0 0 var(--rp-s6);   /* decorative only (defence 3) */
}
.rts-gait .gv-hero-img{border-radius:var(--rp-r-lg); overflow:hidden; box-shadow:var(--rp-shadow);}

/* ── 02 chain ────────────────────────────────────────────────────────── */
.rts-gait .gv-split{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--rp-s16); align-items:start;}
.rts-gait .gv-chain{list-style:none; margin:0; padding:0;}
.rts-gait .gv-chain li{
  padding:var(--rp-s4) 0 var(--rp-s4) var(--rp-s8);
  border-left:2px solid var(--rp-divider); position:relative;
}
.rts-gait .gv-chain li::before{
  content:""; position:absolute; left:-7px; top:24px; width:12px; height:12px;
  border-radius:50%; background:var(--rp-mid); border:3px solid var(--rp-page);
}
.rts-gait .gv-band--tint .gv-chain li::before{border-color:var(--rp-card);}
.rts-gait .gv-chain p{margin:0; color:var(--rp-ink2); font-size:16px;}
.rts-gait .gv-figcap{font-size:14px; color:var(--rp-ink2); margin-top:var(--rp-s3);}
.rts-gait .gv-xlink{
  margin-top:var(--rp-s12); padding-top:var(--rp-s6);
  border-top:1px solid var(--rp-divider); font-size:17px;
}

/* ── 03 metrics ──────────────────────────────────────────────────────── */
.rts-gait .gv-metrics{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--rp-s3); margin-top:var(--rp-s12);
}
.rts-gait .gv-metric{
  background:var(--rp-card); border:1px solid var(--rp-divider);
  border-radius:var(--rp-r-md); padding:var(--rp-s6);
}
.rts-gait .gv-band--tint .gv-metric{background:var(--rp-page);}
.rts-gait .gv-metric p{margin:0; font-size:16px; color:var(--rp-ink2);}
.rts-gait .gv-count{
  margin-top:var(--rp-s3); padding:var(--rp-s6) var(--rp-s8);
  border-radius:var(--rp-r-md); background:var(--rp-deep); color:#fff;
  display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--rp-s3);
}
.rts-gait .gv-count b{font-family:var(--rp-font-display); font-size:22px; color:#fff;}
.rts-gait .gv-count span{color:rgba(255,255,255,.88); font-size:16px;}

/* ── 05 tests ────────────────────────────────────────────────────────── */
.rts-gait .gv-tests{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,2fr); gap:var(--rp-s12); align-items:start;}
.rts-gait .gv-testlist{list-style:none; margin:0; padding:0;}
.rts-gait .gv-testlist li{
  padding:var(--rp-s3) 0; border-bottom:1px solid var(--rp-divider);
  font-weight:600; font-size:17px;
}
.rts-gait .gv-testlist li:last-child{border-bottom:0;}
.rts-gait .gv-testlist em{display:block; font-style:normal; font-weight:400; font-size:15px; color:var(--rp-ink2);}

/* ── zoomable figure (shared by 02 / 05 / 06) ────────────────────────── */
.rts-gait .gv-zoom{
  display:block; width:100%; padding:0; border:1px solid var(--rp-divider);
  text-decoration:none;   /* it is an <a>, for the no-JS fallback */
  border-radius:var(--rp-r-md); overflow:hidden; background:var(--rp-card);
  cursor:zoom-in; box-shadow:var(--rp-shadow);
}
.rts-gait .gv-report-fig{margin:var(--rp-s12) 0 0;}
.rts-gait .gv-caps{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--rp-s6); margin-top:var(--rp-s6);
}
/* The full 3-column report spread is legible only in the lightbox. Inline we show
   the single-column render at a readable size with the captions beside it. */
.rts-gait .gv-report-split{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--rp-s16); align-items:start;
}
.rts-gait .gv-report-split .gv-caps{
  display:block; margin-top:0;
}
.rts-gait .gv-report-split .gv-caps p{
  margin:0 0 var(--rp-s6); padding-top:var(--rp-s3); border-top:2px solid var(--rp-mid);
}
/* --rp-ink3 fails AA for text (tokens.md says so; I used it anyway and the probe
   caught it). --rp-ink2 is 4.72:1 on the tinted band. */
.rts-gait .gv-caps-note{
  border-top:0 !important; color:var(--rp-ink2) !important; font-size:15px;
}
@media (max-width:1000px){ .rts-gait .gv-report-split{grid-template-columns:1fr; gap:var(--rp-s8);} }
.rts-gait .gv-caps p{margin:0; font-size:16px; color:var(--rp-ink2); padding-top:var(--rp-s3); border-top:2px solid var(--rp-mid);}

/* ── 07 partners ─────────────────────────────────────────────────────── */
.rts-gait .gv-partners{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--rp-s6); margin-top:var(--rp-s8);}
.rts-gait .gv-partner{
  display:flex; align-items:center; gap:var(--rp-s6);
  padding:var(--rp-s6); background:var(--rp-card);
  border:1px solid var(--rp-divider); border-radius:var(--rp-r-md);
  text-decoration:none; color:inherit; transition:border-color .15s ease;
}
.rts-gait .gv-partner:hover{border-color:var(--rp-mid); text-decoration:none; color:inherit;}
.rts-gait .gv-partner img{width:72px; height:72px; border-radius:var(--rp-r-md); flex:0 0 auto;}
.rts-gait .gv-partner picture{flex:0 0 auto;}
/* min-width:0 — without it the flex text child refuses to shrink and overflows at 390px */
.rts-gait .gv-partner > span{min-width:0; flex:1 1 auto;}
.rts-gait .gv-partner p{margin:0; font-size:15px; color:var(--rp-ink2);}

/* ── 08 white-label / 09 pricing ─────────────────────────────────────── */
.rts-gait .gv-wl{
  padding:var(--rp-s6) 0; border-top:1px solid var(--rp-divider);
  border-bottom:1px solid var(--rp-divider); font-size:16px; color:var(--rp-ink2);
}
.rts-gait .gv-price{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:var(--rp-s12); align-items:center;}

/* ── 10 CTA — full-bleed (the child theme escapes Divi's 1080px cap) ─── */
/* Full bleed comes from STRUCTURE, not 100vw. The child-theme template has no
   Divi .container, so a plain block section already spans the viewport; .gv-wrap
   inside supplies the measure. The 100vw + negative-margin trick was tried first
   and overflowed at every width, because 100vw includes the scrollbar. */
.rts-gait .gv-cta{
  margin-top:var(--rp-s20); padding:var(--rp-s20) 0;
  background:var(--rp-deep);                 /* solid, 5.59:1 — never the gradient (defence 3) */
  position:relative; overflow:hidden;
}
.rts-gait .gv-cta::before{content:""; position:absolute; inset:0 0 auto 0; height:10px; background:var(--rp-gradient);}
.rts-gait .gv-cta .gv-h2{color:#fff !important;}   /* must beat Divi's h1-h6 customizer rule */
.rts-gait .gv-cta p{color:rgba(255,255,255,.92); max-width:58ch;}
.rts-gait .gv-cta a{color:#fff;}
/* must out-specify `.gv-cta a` above, or the solid button renders white-on-white (defence 2) */
.rts-gait .gv-cta a.gv-btn-solid{color:var(--rp-deep);}
.rts-gait .gv-cta a.gv-btn-ghost{color:#fff; border-color:rgba(255,255,255,.7); background:transparent;}
.rts-gait .gv-cta a.gv-btn-ghost:hover{background:rgba(255,255,255,.14); border-color:#fff; color:#fff;}

/* ── lightbox ────────────────────────────────────────────────────────── */
.gv-lb[hidden]{display:none;}
.gv-lb{
  position:fixed; inset:0; z-index:99999; background:rgba(15,42,58,.92);
  display:flex; align-items:center; justify-content:center; padding:2vh 2vw;
}
.gv-lb-inner{max-width:100%; max-height:96vh; overflow:auto; -webkit-overflow-scrolling:touch;}
.gv-lb img{max-width:100%; height:auto; border-radius:8px; background:#fff;}
.gv-lb-close{
  position:absolute; top:12px; right:12px; width:48px; height:48px;
  border-radius:50%; border:2px solid rgba(255,255,255,.6); background:rgba(0,0,0,.35);
  color:#fff; font-size:26px; line-height:1; cursor:pointer;
}
.gv-lb-close:focus-visible{outline:3px solid #fff; outline-offset:2px;}
body.gv-lb-open{overflow:hidden;}

/* ── responsive ──────────────────────────────────────────────────────── */
@media (max-width:1000px){
  .rts-gait .gv-hero-grid,.rts-gait .gv-split,.rts-gait .gv-tests,.rts-gait .gv-price{
    grid-template-columns:1fr; gap:var(--rp-s12);
  }
  .rts-gait .gv-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:760px){
  .rts-gait{font-size:16px;}
  .rts-gait .gv-band,.rts-gait .gv-hero{padding:var(--rp-s12) 0;}
  .rts-gait .gv-metrics,.rts-gait .gv-caps,.rts-gait .gv-partners{grid-template-columns:1fr;}
  .rts-gait .gv-wrap{padding:0 var(--rp-s4);}
  .rts-gait .gv-btn{width:100%;}
}
@media (prefers-reduced-motion:reduce){
  .rts-gait *{transition:none !important; animation:none !important; scroll-behavior:auto !important;}
}
@media print{
  .rts-gait{background:#fff; font-size:11pt;}
  .rts-gait .gv-cta{background:#fff; margin:0; left:auto; right:auto; width:auto; max-width:none;}
  .rts-gait .gv-cta .gv-h2,.rts-gait .gv-cta p,.rts-gait .gv-cta a{color:#000 !important;}
  .rts-gait .gv-count{background:#fff; color:#000; border:1px solid #000;}
  .rts-gait .gv-count b,.rts-gait .gv-count span{color:#000;}
  .rts-gait .gv-btn{border:1px solid #000; color:#000 !important; background:#fff;}
  .rts-gait .gv-zoom{cursor:default; box-shadow:none;}
  .gv-lb{display:none !important;}
}