/* =====================================================================
   Service · Prequalification and vendor lists. Page-scoped clone layout.
   Every length is `calc(N * var(--u))`, where N is the px value at 1440
   and --u reproduces the source's viewport-driven root scale:
     >=1024  root = 100vw/90   ->  1px@1440 = 100vw/1440
     640-1023 root = 100vw/48  ->  1px@1440 = 100vw/768
     <640    root = 100vw/25.75 -> 1px@1440 = 100vw/412
   ===================================================================== */

main.p-vendor-lists{
  --u: calc(100vw / 412);
  --gap: calc(10 * var(--u));
  --pad: clamp(1rem, 3vw, 2.5rem);
  --cols: 6;
  display: block;
  position: relative;
  overflow-x: clip;
  color: var(--teal);
}
@media (min-width:640px){
  main.p-vendor-lists{ --u: calc(100vw / 768); --gap: calc(12.5 * var(--u)); }
}
@media (min-width:1024px){
  main.p-vendor-lists{ --u: calc(100vw / 1440); --gap: calc(15 * var(--u)); --cols: 12; }
}

main.p-vendor-lists section{ padding: 0 var(--pad); }

/* ---- grid utility (source .my-grid) --------------------------------- */
main.p-vendor-lists .vl-grid{
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0,1fr));
  column-gap: var(--gap);
}

/* ---- type scale ------------------------------------------------------ */
main.p-vendor-lists .page-title{
  font-family: var(--sans); font-weight:500; letter-spacing:0;
  font-size: calc(52 * var(--u)); line-height: calc(52 * var(--u));
}
main.p-vendor-lists .my-title{
  font-family: var(--sans); font-weight:500; letter-spacing:0;
  font-size: calc(80 * var(--u)); line-height: calc(75 * var(--u));
}
main.p-vendor-lists .fs-300{
  font-family: var(--sans); font-weight:400; letter-spacing:0;
  font-size: calc(160 * var(--u)); line-height: calc(160 * var(--u));
}
main.p-vendor-lists .fs-46{
  font-family: var(--sans); font-weight:400; letter-spacing:0;
  font-size: calc(46 * var(--u)); line-height: calc(46 * var(--u));
}
main.p-vendor-lists .fs-36{
  font-family: var(--sans); font-weight:400; letter-spacing:0;
  font-size: calc(36 * var(--u)); line-height: calc(36 * var(--u));
}
main.p-vendor-lists .page-text{
  font-family: var(--sans); font-weight:400; letter-spacing:0;
  font-size: calc(22 * var(--u)); line-height: calc(22 * var(--u));
}
main.p-vendor-lists .mono{
  font-family: var(--mono); font-weight:400; letter-spacing:0;
  font-size: calc(12 * var(--u)); line-height: calc(15.96 * var(--u));
  text-transform: uppercase;
}
@media (min-width:1024px){
  main.p-vendor-lists .page-title{ font-size: calc(160 * var(--u)); line-height: calc(150 * var(--u)); }
  main.p-vendor-lists .my-title { font-size: calc(160 * var(--u)); line-height: calc(150 * var(--u)); }
  main.p-vendor-lists .fs-300   { font-size: calc(300 * var(--u)); line-height: calc(300 * var(--u)); }
  main.p-vendor-lists .page-text{ font-size: calc(30 * var(--u));  line-height: calc(30 * var(--u)); }
}

main.p-vendor-lists .vl-sr{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* SplitText holders start hidden so the mask reveal has something to do */
body.gsap main.p-vendor-lists .sp{ opacity:0; }
@media (prefers-reduced-motion:reduce){
  body.gsap main.p-vendor-lists .sp{ opacity:1 !important; }
}

/* ---- eyebrow rails (house .eyebrow, source metrics) ------------------ */
main.p-vendor-lists .vl-rail{ position: relative; height: 0; }
main.p-vendor-lists .vl-rail .eyebrow{
  position: absolute; top: 0; left: 0; right: 0;
  margin: 0;
  padding-top: calc(20 * var(--u));
  border-top: 1px solid var(--teal);
  align-items: flex-start;
}
main.p-vendor-lists .eyebrow .mono{ color: var(--teal); }

/* =====================================================================
   1 · HERO
   ===================================================================== */
main.p-vendor-lists .vl-hero{ padding-top: calc(180 * var(--u)); }
@media (min-width:1024px){
  main.p-vendor-lists .vl-hero{ padding-top: calc(312 * var(--u)); }
}
main.p-vendor-lists .vl-head-a{ color: var(--teal); text-align: left; }

main.p-vendor-lists .vl-stack{
  position: relative;
  display: grid;
  grid-template-areas: "stack";
  margin: calc(32 * var(--u)) calc(-1 * var(--pad)) 0;
}
main.p-vendor-lists .vl-hero-img{
  grid-area: stack;
  overflow: hidden;
  aspect-ratio: 412 / 825;
  background: var(--teal-deep);
}
main.p-vendor-lists .vl-hero-img canvas{
  display: block; width: 100%; height: 100%;
  object-fit: cover; image-rendering: pixelated;
}

main.p-vendor-lists .vl-hero-over{
  grid-area: stack; z-index: 1;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0,1fr));
  column-gap: var(--gap);
  align-content: start;
  margin-top: calc(20 * var(--u));
  padding: 0 var(--pad) calc(60 * var(--u));
}
main.p-vendor-lists .vl-head-b{ grid-column: 1 / -1; color: var(--paper); }
main.p-vendor-lists .vl-hero-p{
  grid-column: 1 / -1;
  margin-top: calc(40 * var(--u));
  color: var(--paper);
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-hero-img{ aspect-ratio: auto; }
  main.p-vendor-lists .vl-hero-over{ padding-bottom: calc(400 * var(--u)); }
  main.p-vendor-lists .vl-head-b{ grid-column: span 9; }
  main.p-vendor-lists .vl-hero-p{ grid-column: 8 / -2; margin-top: calc(200 * var(--u)); }
}

/* stair wipes: bottom-anchored, grow left to right on scrub */
main.p-vendor-lists .vl-stairs{
  position: absolute; left: 0; right: 0; bottom: -1px;
  padding: 0 var(--pad);
  display: grid;
  grid-template-rows: repeat(3, calc(130 * var(--u)));
  pointer-events: none;
  --span9: 100%;
}
main.p-vendor-lists .vl-stairs i{
  display: block; height: 100%;
  margin-left: calc(-1 * var(--pad));
  background: var(--paper);
  width: calc(var(--frac) * var(--span9) + 2 * var(--pad));
  transform: scaleX(0);
  transform-origin: left center;
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-stairs{
    grid-template-rows: repeat(3, calc(139.98 * var(--u)));
    --span9: calc(0.75 * (100% + 15 * var(--u)) - 15 * var(--u));
  }
}

/* =====================================================================
   2 · APPROACH
   ===================================================================== */
main.p-vendor-lists .vl-approach{ padding-top: calc(24 * var(--u)); }
main.p-vendor-lists .vl-appr-grid{
  align-items: flex-start;
  margin-top: calc(50 * var(--u));
}
main.p-vendor-lists .vl-appr-h{
  grid-column: 1 / -1;
  font-weight: 400;
}
main.p-vendor-lists .vl-appr-body{
  grid-column: 1 / -1;
  margin-top: calc(28 * var(--u));
}
main.p-vendor-lists .vl-appr-item{
  border-top: 1px solid var(--teal);
  padding: calc(16 * var(--u)) 0 calc(22 * var(--u));
}
main.p-vendor-lists .vl-appr-item .mono{ color: var(--teal); display: block; }
main.p-vendor-lists .vl-appr-item p{
  margin-top: calc(10 * var(--u));
  color: var(--teal);
  font-family: var(--sans); font-weight: 400;
  font-size: calc(17 * var(--u)); line-height: 1.4;
}
main.p-vendor-lists .vl-appr-mono{
  margin: calc(24 * var(--u)) 0 calc(40 * var(--u));
}
main.p-vendor-lists .vl-appr-mono p{ color: var(--teal); }

main.p-vendor-lists .vl-carousel{
  grid-column: 1 / -1;
  position: relative;
  overflow: hidden;
  height: calc(300 * var(--u));
  border-left: 1px solid var(--teal);
}
main.p-vendor-lists .vl-track{
  position: absolute; top: 0; left: 0; width: 100%;
  display: flex; flex-direction: column;
  will-change: transform;
  animation: vlScrollUp 40s linear infinite;
}
main.p-vendor-lists .vl-logo{
  display: flex; align-items: center; justify-content: center;
  padding: calc(46 * var(--u)) 0;
}
main.p-vendor-lists .vl-logo span{
  display: block; width: calc(230 * var(--u));
  font-family: var(--sans); font-weight: 700; letter-spacing: -.01em;
  color: var(--teal); text-align: center; line-height: 1.05;
}
main.p-vendor-lists .vl-logo-1 span{ font-size: calc(40 * var(--u)); }
main.p-vendor-lists .vl-logo-2 span{ font-size: calc(30 * var(--u)); }
main.p-vendor-lists .vl-logo-3 span{ font-size: calc(24 * var(--u)); }

@keyframes vlScrollUp{ 0%{ transform: translateY(0) } 100%{ transform: translateY(-50%) } }
@media (prefers-reduced-motion:reduce){
  main.p-vendor-lists .vl-track{ animation: none; }
}

@media (min-width:1024px){
  main.p-vendor-lists .vl-appr-grid{
    grid-template-rows: minmax(calc(271.98 * var(--u)), auto) minmax(calc(269.88 * var(--u)), auto);
    margin-top: 0;   /* section height = pt-24 + 541.86, per TOPOLOGY */
  }
  main.p-vendor-lists .vl-appr-h{
    grid-column: 3 / span 4; grid-row: 1;
    margin-top: calc(164 * var(--u));
  }
  main.p-vendor-lists .vl-appr-body{
    grid-column: 3 / span 6; grid-row: 2;
    margin: calc(20 * var(--u)) 0 calc(120 * var(--u));
  }
  main.p-vendor-lists .vl-appr-mono{
    width: calc(560 * var(--u));
    margin: calc(30 * var(--u)) 0 0;
  }
  main.p-vendor-lists .vl-carousel{
    grid-column: -4 / span 3; grid-row: span 2;
    height: auto; align-self: stretch;
  }
  main.p-vendor-lists .vl-logo{ padding: calc(70 * var(--u)) 0; }
}

/* =====================================================================
   3 · NUMBERS
   ===================================================================== */
main.p-vendor-lists .vl-numbers{ padding-bottom: calc(50 * var(--u)); }
main.p-vendor-lists .vl-num-block{
  grid-column: 1 / -1;
  margin-top: calc(100 * var(--u));
}
main.p-vendor-lists .vl-num{
  position: relative; z-index: 1;
  color: var(--teal);
}
main.p-vendor-lists .vl-num-mask{ display: none; }
main.p-vendor-lists .vl-num-cap{ margin-top: calc(20 * var(--u)); }
main.p-vendor-lists .vl-num-cap p{ color: var(--teal); }

@media (min-width:1024px){
  main.p-vendor-lists .vl-numbers{ padding-bottom: 0; }
  main.p-vendor-lists .vl-num-grid{ grid-template-rows: calc(582.86 * var(--u)); }
  main.p-vendor-lists .vl-num-block{
    grid-column: 4 / -1;
    margin-top: 0;
    padding: calc(135 * var(--u)) 0 calc(96 * var(--u)) calc(118.94 * var(--u));
    border-left: 1px solid var(--teal);
  }
  main.p-vendor-lists .vl-num-mask{
    display: block; position: absolute; z-index: -1;
    top: 0; left: calc(-144 * var(--u));
    width: calc(144 * var(--u)); height: 100%;
    background: var(--paper);
  }
  main.p-vendor-lists .vl-num-cap{ width: calc(339.97 * var(--u)); }
}

/* =====================================================================
   4 · WHERE YOU REGISTER
   ===================================================================== */
main.p-vendor-lists .vl-lists{ padding-bottom: var(--pad); }
main.p-vendor-lists .vl-rule{
  border-top: 1px solid var(--teal);
  padding-top: calc(100 * var(--u));
}
main.p-vendor-lists .vl-title{
  grid-column: 1 / -1;
  text-align: left;
  font-weight: 500;
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-title-row{ grid-template-rows: calc(300 * var(--u)); }
  main.p-vendor-lists .vl-title{ grid-column: 3 / -3; }
}

/* one row per registration type */
main.p-vendor-lists .vl-rows{
  margin-top: calc(90 * var(--u));
}
main.p-vendor-lists .vl-row{
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0,1fr));
  column-gap: var(--gap);
  border-top: 1px solid var(--teal);
  padding: calc(22 * var(--u)) 0 calc(34 * var(--u));
}
main.p-vendor-lists .vl-row:last-child{ border-bottom: 1px solid var(--teal); }
main.p-vendor-lists .vl-row > *{ grid-column: 1 / -1; }
main.p-vendor-lists .vl-row-meta{
  display: flex; justify-content: space-between;
  padding-right: calc(12 * var(--u));
}
main.p-vendor-lists .vl-row-meta .mono{ color: var(--teal); }
main.p-vendor-lists .vl-row-name{ margin-top: calc(22 * var(--u)); }
main.p-vendor-lists .vl-row-name h3{ color: var(--teal); font-weight: 400; }
main.p-vendor-lists .vl-row-need{ margin-top: calc(22 * var(--u)); }
main.p-vendor-lists .vl-row-need p{
  color: var(--teal);
  font-family: var(--sans); font-weight: 400;
  font-size: calc(17 * var(--u)); line-height: 1.4;
}
main.p-vendor-lists .vl-row-cycle{ margin-top: calc(18 * var(--u)); }
main.p-vendor-lists .vl-row-cycle p{ color: var(--teal); }

/* tender data block */
main.p-vendor-lists .vl-data{
  margin-top: calc(80 * var(--u));
  row-gap: calc(36 * var(--u));
}
main.p-vendor-lists .vl-data-shot{
  grid-column: 1 / -1;
  position: relative; overflow: hidden;
  aspect-ratio: 385 / 260;
  background: var(--teal-deep);
}
main.p-vendor-lists .vl-data-shot canvas{
  display: block; width: 100%; height: 100%;
  object-fit: cover; image-rendering: pixelated;
}
main.p-vendor-lists .vl-data-figs{ grid-column: 1 / -1; }
main.p-vendor-lists .vl-fig{
  border-top: 1px solid var(--teal);
  padding: calc(16 * var(--u)) 0 calc(22 * var(--u));
}
main.p-vendor-lists .vl-fig-n{
  display: block;
  font-family: var(--sans); font-weight: 400; letter-spacing: 0;
  font-size: calc(46 * var(--u)); line-height: 1.05;
  color: var(--teal);
}
main.p-vendor-lists .vl-fig p{ margin-top: calc(10 * var(--u)); color: var(--teal); }
main.p-vendor-lists .vl-data-note{
  border-top: 1px solid var(--teal);
  padding-top: calc(16 * var(--u));
  color: var(--teal);
}

/* CTA button block */
main.p-vendor-lists .vl-btn-row{ margin-top: calc(60 * var(--u)); }
main.p-vendor-lists .vl-btn-wrap{
  grid-column: 1 / -1;
  position: relative; z-index: 1;
}
main.p-vendor-lists .vl-btn-mask{ display: none; }

@media (min-width:1024px){
  main.p-vendor-lists .vl-row{
    padding: calc(30 * var(--u)) 0 calc(44 * var(--u));
  }
  main.p-vendor-lists .vl-row-meta{
    grid-column: 1 / span 1;
    display: block;
  }
  main.p-vendor-lists .vl-row-meta .mono{ display: block; }
  main.p-vendor-lists .vl-row-name{ grid-column: 2 / span 4; margin-top: 0; }
  main.p-vendor-lists .vl-row-need{ grid-column: 6 / span 4; margin-top: 0; }
  main.p-vendor-lists .vl-row-cycle{ grid-column: 10 / -1; margin-top: 0; }

  main.p-vendor-lists .vl-data{ margin-top: calc(120 * var(--u)); }
  main.p-vendor-lists .vl-data-shot{
    grid-column: 1 / span 5;
    aspect-ratio: auto;
    align-self: stretch;
    min-height: calc(420 * var(--u));
  }
  main.p-vendor-lists .vl-data-figs{ grid-column: 7 / -1; }
  main.p-vendor-lists .vl-fig-n{ font-size: calc(64 * var(--u)); }

  main.p-vendor-lists .vl-btn-row{ margin-top: calc(100 * var(--u)); }
  main.p-vendor-lists .vl-btn-wrap{ grid-column: 5 / span 3; }
  main.p-vendor-lists .vl-btn-mask{
    display: block; position: absolute; z-index: -1;
    top: 0; bottom: 0; left: calc(-13.14 * var(--u));
    width: calc(276.11 * var(--u));
    background: var(--paper);
  }
}

/* ---- the two-span sweep button (source Button component) ------------- */
main.p-vendor-lists .vl-btn{
  display: inline-block; position: relative; overflow: hidden;
  text-align: center; text-decoration: none;
  border: 1px solid var(--teal);
}
main.p-vendor-lists .vl-btn-label,
main.p-vendor-lists .vl-btn-sweep{
  display: block;
  font-family: var(--mono); font-weight: 400;
  font-size: calc(14 * var(--u)); line-height: calc(14 * var(--u));
  letter-spacing: .02em; text-transform: uppercase;
  white-space: nowrap;
}
main.p-vendor-lists .vl-btn-sweep{
  position: absolute; inset: 0;
  transform: scaleX(.5) translateY(101%);
  transform-origin: center bottom;
}
main.p-vendor-lists .vl-btn-solid{
  width: 100%;
  background: var(--teal);
}
main.p-vendor-lists .vl-btn-solid .vl-btn-label,
main.p-vendor-lists .vl-btn-solid .vl-btn-sweep{ padding: calc(25 * var(--u)) calc(46 * var(--u)); }
main.p-vendor-lists .vl-btn-solid .vl-btn-label{ color: var(--paper); }
main.p-vendor-lists .vl-btn-solid .vl-btn-sweep{ color: var(--white); background: var(--teal-deep); }

main.p-vendor-lists .vl-btn-ghost{
  background: var(--paper);
}
main.p-vendor-lists .vl-btn-ghost .vl-btn-label,
main.p-vendor-lists .vl-btn-ghost .vl-btn-sweep{ padding: calc(21 * var(--u)); }
main.p-vendor-lists .vl-btn-ghost .vl-btn-label{ color: var(--teal); }
main.p-vendor-lists .vl-btn-ghost .vl-btn-sweep{ color: var(--paper); background: var(--teal); }

@media (min-width:1024px){
  main.p-vendor-lists .vl-btn-solid{
    width: calc(247.98 * var(--u));
    margin-left: calc(15 * var(--u));
  }
}

/* =====================================================================
   5 · CTA BANNER
   ===================================================================== */
main.p-vendor-lists .vl-cta{ padding-bottom: calc(20 * var(--u)); }
main.p-vendor-lists .vl-hr{
  border: 0; border-top: 1px solid var(--teal);
  height: 1px; overflow: hidden;
}
main.p-vendor-lists .vl-hr-b{ margin-top: calc(50 * var(--u)); }
main.p-vendor-lists .vl-cta-in{
  display: flex; flex-direction: column; align-items: center;
  margin: calc(50 * var(--u)) 0;
}
main.p-vendor-lists .vl-cta-h{
  text-align: center; color: var(--teal); font-weight: 400;
  width: 100%;
}
main.p-vendor-lists .vl-cta-in .vl-btn{ margin-top: calc(64 * var(--u)); }

@media (min-width:1024px){
  main.p-vendor-lists .vl-cta{ margin-top: calc(35 * var(--u)); padding-bottom: calc(12 * var(--u)); }
  main.p-vendor-lists .vl-cta-h{ width: 81.25vw; }
}

/* legibility: open the leading on the multi-line hero paragraph */
main.p-vendor-lists .vl-hero-p{ line-height:1.3 }

main.p-vendor-lists .page-text{ line-height:1.3 }
main.p-vendor-lists .vl-data-shot{position:relative; overflow:hidden}
main.p-vendor-lists .vl-data-shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}

/* =====================================================================
   2026-08 REBUILD — hero scrim, condensed approach, gates rail,
   document pack, register table, sourced figures
   ===================================================================== */

/* ---- hero scrim + source line --------------------------------------- */
main.p-vendor-lists .vl-hero-img{ position: relative; }
main.p-vendor-lists .vl-hero-img::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, transparent 40%, rgba(7,20,18,.55) 72%);
}
main.p-vendor-lists .vl-hero-img img{
  display:block; width:100%; height:100%; object-fit:cover;
}
@media (max-width:1023px){
  main.p-vendor-lists .vl-hero-img::after{
    background: linear-gradient(180deg, rgba(7,20,18,.6) 0%, rgba(7,20,18,.4) 38%, transparent 68%);
  }
}
main.p-vendor-lists .vl-hero-src{
  margin-top: calc(16 * var(--u));
  opacity: .75;
}

/* ---- approach, condensed -------------------------------------------- */
main.p-vendor-lists .vl-appr-item{
  border-top: 0;
  padding: 0;
}
main.p-vendor-lists .vl-appr-item p{
  font-size: calc(22 * var(--u));
  line-height: 1.45;
}
main.p-vendor-lists .vl-appr-mono{ margin: calc(34 * var(--u)) 0 0; }
main.p-vendor-lists .vl-appr-mono2{ margin: calc(14 * var(--u)) 0 calc(40 * var(--u)); }
main.p-vendor-lists .vl-appr-mono p,
main.p-vendor-lists .vl-appr-mono2 p{
  color: var(--teal);
  border-top: 1px solid var(--teal);
  padding-top: calc(12 * var(--u));
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-appr-grid{ grid-template-rows: none; }
  main.p-vendor-lists .vl-appr-h{
    grid-column: 3 / span 5; grid-row: auto;
    margin-top: calc(120 * var(--u));
  }
  main.p-vendor-lists .vl-appr-body{
    grid-column: 3 / span 6; grid-row: auto;
    margin: calc(30 * var(--u)) 0 calc(110 * var(--u));
  }
  main.p-vendor-lists .vl-appr-mono,
  main.p-vendor-lists .vl-appr-mono2{ width: calc(560 * var(--u)); }
}

/* ---- the six gates (dark pinned rail) -------------------------------- */
main.p-vendor-lists .vl-gates{
  background: var(--teal-deep);
  color: var(--paper);
  overflow: hidden;
}
main.p-vendor-lists .vl-gates .vl-rail .eyebrow{
  border-top-color: rgba(234,232,226,.35);
}
main.p-vendor-lists .vl-gates .eyebrow .mono{ color: var(--paper); }

main.p-vendor-lists .gates-pin{
  display: flex; flex-direction: column; justify-content: center;
  min-height: 100svh;
  padding: calc(70 * var(--u)) 0 calc(50 * var(--u));
}
main.p-vendor-lists .gates-h{ color: var(--paper); font-weight: 400; }
main.p-vendor-lists .gates-line{
  position: relative; height: 1px;
  background: rgba(234,232,226,.22);
  margin: calc(26 * var(--u)) 0 calc(40 * var(--u));
}
main.p-vendor-lists .gates-line i{
  position: absolute; inset: 0;
  background: var(--paper);
  transform: scaleX(0);
  transform-origin: left center;
}
main.p-vendor-lists .gates-track{
  display: flex;
  align-items: stretch;
  will-change: transform;
}
main.p-vendor-lists .gate{
  flex: 0 0 clamp(300px, 30vw, 440px);
  border-left: 1px solid rgba(234,232,226,.3);
  padding: calc(6 * var(--u)) clamp(20px, 2.2vw, 40px) calc(10 * var(--u));
}
main.p-vendor-lists .gate-n{
  display: block;
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(84px, 9.5vw, 138px);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--paper);
}
main.p-vendor-lists .gate-t{
  margin-top: calc(20 * var(--u));
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(19px, 1.6vw, 23px); line-height: 1.2;
  color: var(--paper);
}
main.p-vendor-lists .gate-do{
  margin-top: calc(12 * var(--u));
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(14px, 1.05vw, 16px); line-height: 1.45;
  color: rgba(234,232,226,.85);
  max-width: 36ch;
}
main.p-vendor-lists .gate-you{
  margin-top: calc(12 * var(--u));
  color: rgba(234,232,226,.6);
}
main.p-vendor-lists .gate-dur{ margin-top: calc(6 * var(--u)); color: rgba(234,232,226,.6); }
main.p-vendor-lists .gate-dur:empty{ display: none; }

@media (max-width:767px){
  main.p-vendor-lists .gates-pin{ min-height: 0; padding: calc(60 * var(--u)) 0 calc(40 * var(--u)); }
  main.p-vendor-lists .gates-track{ flex-direction: column; }
  main.p-vendor-lists .gate{
    flex: none; width: 100%;
    border-left: 0; border-top: 1px solid rgba(234,232,226,.3);
    padding: calc(22 * var(--u)) 0 calc(26 * var(--u));
  }
  main.p-vendor-lists .gate-n{ font-size: clamp(64px, 18vw, 84px); }
  main.p-vendor-lists .gates-line{ display: none; }
}
@media (prefers-reduced-motion:reduce){
  main.p-vendor-lists .gates-line i{ transform: scaleX(1); }
}

/* ---- the document pack ----------------------------------------------- */
main.p-vendor-lists .vl-pack{
  padding-top: calc(24 * var(--u));
  padding-bottom: calc(60 * var(--u));
}
main.p-vendor-lists .vl-pack-grid{ margin-top: calc(60 * var(--u)); row-gap: calc(30 * var(--u)); }
main.p-vendor-lists .vl-pack-lead{
  grid-column: 1 / -1;
  font-family: var(--sans); font-weight: 400;
  font-size: calc(22 * var(--u)); line-height: 1.4;
  color: var(--teal);
  max-width: 26ch;
}
main.p-vendor-lists .vl-pack-list{
  grid-column: 1 / -1;
  list-style: none; margin: 0; padding: 0;
}
main.p-vendor-lists .vl-pack-list li{
  display: flex; gap: calc(18 * var(--u));
  border-top: 1px solid var(--teal);
  padding: calc(12 * var(--u)) 0;
  color: var(--teal);
}
main.p-vendor-lists .vl-pack-list li:last-child{ border-bottom: 1px solid var(--teal); }
main.p-vendor-lists .vl-pack-list li .mono{ color: var(--teal); }
main.p-vendor-lists .vl-pack-list li span:last-child{
  font-family: var(--mono);
  font-size: calc(13 * var(--u)); line-height: calc(15.96 * var(--u));
  text-transform: uppercase; letter-spacing: .02em;
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-pack-lead{ grid-column: 3 / span 3; }
  main.p-vendor-lists .vl-pack-list{ grid-column: 7 / -1; }
}

/* ---- where you register: columned table ------------------------------- */
main.p-vendor-lists .vl-thead{
  display: none;
  border-top: 1px solid var(--teal);
  padding: calc(12 * var(--u)) 0;
}
main.p-vendor-lists .vl-thead .mono{ color: var(--teal); opacity: .65; }
main.p-vendor-lists .vl-tbl .vl-row{
  display: grid;
  grid-template-columns: 1fr;
  column-gap: var(--gap);
  row-gap: calc(14 * var(--u));
  padding: calc(22 * var(--u)) 0 calc(30 * var(--u));
}
main.p-vendor-lists .vl-c{ grid-column: auto; }
main.p-vendor-lists .vl-c h3{
  font-family: var(--sans); font-weight: 400;
  font-size: calc(24 * var(--u)); line-height: 1.15;
  color: var(--teal);
  margin-top: calc(10 * var(--u));
}
main.p-vendor-lists .vl-cn{ display: block; color: var(--teal); }
main.p-vendor-lists .vl-cl{ display: block; color: var(--teal); opacity: .55; margin-bottom: calc(5 * var(--u)); }
main.p-vendor-lists .vl-c p{
  font-family: var(--sans); font-weight: 400;
  font-size: calc(15 * var(--u)); line-height: 1.45;
  color: var(--teal);
}
main.p-vendor-lists .vl-note{
  grid-column: 1 / -1;
  border-top: 1px dashed rgba(11,92,88,.4);
  padding-top: calc(12 * var(--u));
}
main.p-vendor-lists .vl-note p{ color: var(--teal); }
main.p-vendor-lists .vl-note p + p{ margin-top: calc(8 * var(--u)); }
main.p-vendor-lists .vl-src{
  font-size: calc(10 * var(--u)) !important;
  opacity: .6;
  margin-top: calc(6 * var(--u));
}
@media (min-width:1024px){
  main.p-vendor-lists .vl-thead,
  main.p-vendor-lists .vl-tbl .vl-row{
    display: grid;
    grid-template-columns: 2fr 2.9fr 2fr 1.1fr 1.5fr;
    column-gap: var(--gap);
  }
  main.p-vendor-lists .vl-cl{ display: none; }
  main.p-vendor-lists .vl-c h3{ margin-top: calc(14 * var(--u)); font-size: calc(26 * var(--u)); }
  main.p-vendor-lists .vl-note{ grid-column: 2 / -1; margin-top: calc(10 * var(--u)); }
}

/* figures: source lines */
main.p-vendor-lists .vl-fig .vl-src{ border-top: 0; padding-top: 0; }
main.p-vendor-lists .vl-fig-n{ font-variant-numeric: tabular-nums; }

/* numbers section now carries the button row */
main.p-vendor-lists .vl-numbers{ padding-bottom: calc(80 * var(--u)); }
@media (min-width:1024px){
  main.p-vendor-lists .vl-numbers{ padding-bottom: calc(100 * var(--u)); }
}

/* thead spans the full row grid */
main.p-vendor-lists .vl-thead{ grid-column: 1 / -1; }

/* mobile: the register rows keep the list name and who routes through it;
   the file and renewal cells are desktop detail */
@media (max-width:639px){
  .vl-row > div.vl-c:nth-of-type(3), .vl-row > div.vl-c:nth-of-type(4){display:none}
  .vl-thead span:nth-of-type(3), .vl-thead span:nth-of-type(4){display:none}
}