/* The One to Many Kit page. Every section owns its width (a-owned), so nothing
   here carries a measure of its own. */

/* What to order: one row per job size, the order drawn as the parts that go on it. */
.k-order{list-style:none;margin:0;padding:0}
.k-order > li{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,4fr);
  gap:var(--s5);align-items:center;padding:var(--s5) 0}
.k-order > li + li{border-top:1px solid var(--hairline)}
.k-order > li:first-child{padding-top:0}
.k-order__count{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.25;margin:0;color:var(--text)}
.k-order__items{list-style:none;margin:0;padding:0;display:flex;align-items:flex-start;gap:12px}
.k-order__items > li{flex:0 1 132px;min-width:0}
.k-order__items > li.k-order__plus{flex:none;font-family:var(--display);font-weight:600;font-size:22px;
  color:var(--text-3);line-height:1;padding-top:calc(49px - .5em)}
.k-order__well{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;height:auto;
  background:var(--read);border-radius:12px;padding:10px}
.k-order__well img{width:100%;height:100%;object-fit:contain;display:block}
.k-order__qty{display:block;font-weight:600;font-size:16px;line-height:1.35;color:var(--text);margin-top:var(--s2)}
.k-order__part{display:block;font-size:14px;line-height:1.4;color:var(--text-3)}
.k-order__is{font-size:16.5px;line-height:1.5;color:var(--text-2);margin:0}
#count .a-note{margin-top:var(--s5)}

/* What each part does: four parts, two across, each beside its photo. */
.k-parts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:var(--s6)}
.k-parts > li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--s4);align-items:start;
  padding:var(--s5) 0}
.k-parts > li:nth-child(-n+2){padding-top:0}
.k-parts__well{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;
  background:var(--consult);border-radius:12px;padding:10px}
.k-parts__well img{width:100%;height:100%;object-fit:contain;display:block}
.k-parts__name{font-family:var(--display);font-weight:700;font-size:19px;line-height:1.25;margin:0;color:var(--text)}
.k-parts__part{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--knect);margin:var(--s1) 0 0}
.k-parts__job{font-size:17px;line-height:1.55;color:var(--text-2);margin:var(--s2) 0 0}

/* How far the antenna moves: the shared scale (a-scale), beside its explanation. */
.k-reach{margin-top:var(--s7)}
.k-reach .a-h3{color:var(--on-deep)}

/* The Phoenix site plan, with its measured distance set in the plan's own empty corner. */
.k-plan{position:relative;margin:0}
.k-plan img{width:100%;height:auto;display:block}
.k-plan__key{margin-top:var(--s4)}
.k-plan__fig{margin:0;color:var(--text)}
.k-plan__what{font-size:17px;line-height:1.45;color:var(--text-2);margin:var(--s2) 0 0}
.k-plan__legend{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4);
  font-size:15px;color:var(--text-2);margin:var(--s3) 0 0}
.k-plan__dot{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  border-radius:50%;background:#5dd9ef;color:var(--text);font-weight:700;font-size:13px}
.k-plan__item{display:inline-flex;align-items:center;gap:6px}
.k-plan__facts{margin-top:var(--s5);grid-template-columns:repeat(4,minmax(0,1fr))}
@media (min-width:1100px){
  .k-plan__key{position:absolute;left:42%;right:0;top:58%;bottom:0;margin:0;padding-left:var(--s5);
    display:flex;flex-direction:column;justify-content:center}
}

@media (max-width:980px){
  .k-plan__facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .k-order > li{grid-template-columns:minmax(0,1fr);gap:var(--s3)}
}
@media (max-width:900px){
  .k-parts{grid-template-columns:minmax(0,1fr)}
  .k-parts > li:nth-child(2){padding-top:var(--s5)}
}
@media (max-width:480px){
  .k-plan__facts{grid-template-columns:minmax(0,1fr)}
  .k-parts > li{grid-template-columns:104px minmax(0,1fr);gap:var(--s3)}
  .k-order__items{gap:var(--s2)}
  .k-order__items > li.k-order__plus{font-size:18px;padding-top:calc(36px - .5em)}
  .k-order__qty{font-size:15px}
}
