
/* iQQuip GB Exercises — V31 major exercise-library update, 2026-08-21 */
.execution-basics,
.start-position-section,
.execution-pathways,
.dynamic-principles,
.exercise-library-section{
  padding:95px 7vw;
}
.execution-basics,.execution-pathways,.exercise-library-section{background:var(--paper)}
.execution-basics>header,.start-position-section>header,.execution-pathways>header,.dynamic-principles>header,.exercise-library-section>header{
  max-width:980px;margin-bottom:38px;
}
.execution-basics h2,.start-position-section h2,.execution-pathways h2,.dynamic-principles h2,.exercise-library-section h2{
  color:var(--navy);letter-spacing:-.04em;margin:16px 0;font-size:clamp(38px,4.7vw,64px);line-height:1.04;
}
.execution-basics>header>p:not(.section-number),.start-position-section>header>p:not(.section-number),.execution-pathways>header>p:not(.section-number),.dynamic-principles>header>p:not(.section-number),.exercise-library-section>header>p:not(.section-number){
  color:var(--muted);font-size:17px;line-height:1.75;max-width:900px;
}
.hand-use-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hand-use-card{display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:28px;align-items:center;background:#fff;border:1px solid #dce3e8;padding:28px;min-height:360px}
.hand-use-card figure{margin:0;display:flex;align-items:center;justify-content:center;min-height:280px;background:#eef3f6}
.hand-use-card img{display:block;max-height:300px;width:auto;max-width:100%}
.hand-use-card .hand-use-kicker,.execution-card .execution-kicker,.dynamic-card .dynamic-kicker,.exercise-index,.exercise-subtitle,.exercise-meta span,.two-hand-setup .setup-kicker{
  color:var(--blue);font-size:10px;letter-spacing:.13em;font-weight:900;text-transform:uppercase;
}
.hand-use-card h3,.execution-card h3,.dynamic-card h3,.two-hand-setup h3{color:var(--navy);font-size:24px;line-height:1.2;margin:10px 0 14px}
.hand-use-card p,.execution-card p,.dynamic-card p,.two-hand-setup p{color:var(--muted);line-height:1.7;margin:0 0 12px}
.hand-use-rule{margin-top:18px;border-left:4px solid var(--blue);background:#fff;padding:18px 22px;color:var(--navy);font-weight:800;line-height:1.55}
.start-position-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:46px;align-items:start}
.start-position-copy{color:var(--muted);line-height:1.75}
.start-position-copy strong{color:var(--navy)}
.start-position-visuals{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.start-position-visuals figure{margin:0;text-align:center;background:#fff;border:1px solid #dce3e8;padding:14px}
.start-position-visuals img{display:block;width:100%;height:auto;max-height:430px;object-fit:contain}
.start-position-visuals figcaption{margin-top:10px;color:var(--navy);font-size:13px;font-weight:800}
.start-position-guidance{grid-column:1/-1;border-left:3px solid var(--blue);background:#f7f9fb;padding:16px 18px;color:var(--muted);font-size:13px;line-height:1.65}
.start-position-guidance strong{display:block;color:var(--navy);margin-bottom:3px}
.execution-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.execution-card{background:#fff;border:1px solid #dce3e8;padding:30px}
.execution-card:first-child{border-top:4px solid var(--blue)}
.execution-card:last-child{border-top:4px solid #8ba6ba}
.execution-sequence{margin:18px 0 0;padding:16px 18px;background:#f7f9fb;color:var(--navy);font-weight:800;line-height:1.65}
.execution-shared-note{margin-top:18px;border-left:4px solid var(--red);background:#fff;padding:18px 22px;color:var(--navy);line-height:1.65}
.dynamic-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.dynamic-card{border:1px solid #dce3e8;background:#fff;padding:28px}
.dynamic-card.full{grid-column:1/-1;background:#f7f9fb}
.dynamic-core-rule{margin-top:22px;border-left:4px solid var(--red);padding:18px 22px;background:#fff7f7;color:var(--navy);font-weight:900;line-height:1.55}
.exercise-library{display:grid;gap:24px}
.exercise-detail{background:#fff;border:1px solid #dce3e8;overflow:hidden}
.exercise-detail-header{display:grid;grid-template-columns:auto 1fr;gap:18px 22px;align-items:start;padding:26px 30px 22px;border-top:4px solid var(--blue)}
.exercise-index{font-size:13px;padding-top:7px}
.exercise-detail-header h3{color:var(--navy);font-size:clamp(27px,2.6vw,38px);line-height:1.08;letter-spacing:-.03em;margin:0}
.exercise-subtitle{display:block;margin-top:8px;color:var(--muted);letter-spacing:.04em;text-transform:none;font-size:12px}
.exercise-meta{grid-column:2;display:flex;gap:8px;flex-wrap:wrap}
.exercise-meta span{background:#eef3f6;padding:7px 9px;color:var(--navy)}
.exercise-overview{padding:0 30px 24px;color:var(--muted);font-size:16px;line-height:1.72;max-width:1040px}
.exercise-overview strong{color:var(--navy)}
.exercise-instruction-grid-v31{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e2e7eb}
.exercise-instruction-grid-v31>div{padding:22px 24px;border-right:1px solid #e2e7eb;border-bottom:1px solid #e2e7eb}
.exercise-instruction-grid-v31>div:nth-child(3n){border-right:0}
.exercise-instruction-grid-v31 h4{color:var(--navy);font-size:16px;margin:0 0 11px}
.exercise-instruction-grid-v31 ul{list-style:disc outside;padding-left:18px;margin:0}
.exercise-instruction-grid-v31 li{color:var(--muted);line-height:1.55;margin:0 0 7px;font-size:14px}
.exercise-instruction-grid-v31 li::marker{color:var(--blue)}
.exercise-execution-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid #e2e7eb}
.exercise-execution-note{padding:22px 24px;background:#fbfcfd}
.exercise-execution-note+ .exercise-execution-note{border-left:1px solid #e2e7eb}
.exercise-execution-note h4{color:var(--navy);margin:0 0 9px;font-size:15px}
.exercise-execution-note p{color:var(--muted);line-height:1.6;margin:0;font-size:13px}
.exercise-execution-note strong{color:var(--navy)}
.two-hand-setup{display:grid;grid-template-columns:minmax(170px,250px) 1fr;gap:34px;align-items:center;background:#eef3f6;border:1px solid #dce3e8;padding:28px;margin:8px 0 0}
.two-hand-setup figure{margin:0;background:#fff;display:flex;justify-content:center;align-items:center;min-height:300px}
.two-hand-setup img{display:block;max-height:320px;width:auto;max-width:100%}
.two-hand-order{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin:16px 0;color:var(--navy);font-weight:800;font-size:13px}
.two-hand-order span{background:#fff;border:1px solid #dce3e8;padding:12px;text-align:center}
.two-hand-order b{color:var(--blue)}
.library-break{display:flex;align-items:center;gap:14px;margin:18px 0 2px;color:var(--navy);font-weight:900;letter-spacing:.08em;font-size:11px;text-transform:uppercase}
.library-break::before,.library-break::after{content:"";height:1px;background:#cfd9df;flex:1}
@media(max-width:1000px){
  .hand-use-grid,.execution-grid,.dynamic-grid,.start-position-grid{grid-template-columns:1fr}
  .hand-use-card{grid-template-columns:180px 1fr}
  .exercise-instruction-grid-v31{grid-template-columns:1fr 1fr}
  .exercise-instruction-grid-v31>div,.exercise-instruction-grid-v31>div:nth-child(3n){border-right:1px solid #e2e7eb}
  .exercise-instruction-grid-v31>div:nth-child(even){border-right:0}
  .dynamic-card.full{grid-column:auto}
}
@media(max-width:700px){
  .execution-basics,.start-position-section,.execution-pathways,.dynamic-principles,.exercise-library-section{padding:72px 24px}
  .hand-use-card,.two-hand-setup{grid-template-columns:1fr}
  .hand-use-card figure{min-height:250px}.hand-use-card img{max-height:260px}
  .start-position-visuals{grid-template-columns:1fr 1fr}
  .exercise-detail-header{grid-template-columns:1fr;padding:23px 22px 18px}
  .exercise-index{padding:0}.exercise-meta{grid-column:1}
  .exercise-overview{padding:0 22px 20px}
  .exercise-instruction-grid-v31,.exercise-execution-grid{grid-template-columns:1fr}
  .exercise-instruction-grid-v31>div,.exercise-instruction-grid-v31>div:nth-child(3n),.exercise-instruction-grid-v31>div:nth-child(even){border-right:0}
  .exercise-execution-note+ .exercise-execution-note{border-left:0;border-top:1px solid #e2e7eb}
  .two-hand-order{grid-template-columns:1fr}.two-hand-order b{text-align:center}
}
@media(max-width:480px){.start-position-visuals{grid-template-columns:1fr}}

/* iQQuip GB Exercises — V32 selector + readability update, 2026-08-21 */

/* Compact exercise selector: one active exercise detail panel at a time. */
.exercise-selector{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:0 0 20px;
}
.exercise-selector[data-count="5"]{grid-template-columns:repeat(5,minmax(0,1fr))}
.exercise-selector-button{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid #cfd9df;
  background:#fff;
  color:var(--navy);
  min-height:58px;
  padding:12px 13px;
  display:flex;
  align-items:center;
  gap:9px;
  text-align:left;
  font:inherit;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.exercise-selector-button:hover{border-color:var(--blue);background:#f5f8fa}
.exercise-selector-button:focus-visible{outline:3px solid rgba(0,102,204,.25);outline-offset:2px}
.exercise-selector-button.is-active{
  background:var(--navy);
  border-color:var(--navy);
  color:#fff;
}
.exercise-selector-number{
  flex:0 0 auto;
  color:var(--blue);
  font-size:10px;
  font-weight:900;
  letter-spacing:.11em;
}
.exercise-selector-button.is-active .exercise-selector-number{color:#8fd0ff}
.exercise-selector-name{font-size:13px;font-weight:850;line-height:1.25}
.exercise-detail[hidden],.two-hand-context[hidden]{display:none!important}

/* Familiarisation caution shown once before the exercise selector. */
.exercise-familiarisation-note{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:start;
  margin:24px 0 0;
  padding:16px 18px;
  background:#fff8f6;
  border-left:4px solid var(--red);
  max-width:980px;
}
.exercise-familiarisation-note strong{
  color:var(--red);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  white-space:nowrap;
}
.exercise-familiarisation-note p{
  margin:0!important;
  color:var(--navy)!important;
  font-size:14px!important;
  line-height:1.6!important;
}

/* Start / Move / Return / Focus / Avoid are separate cards rather than a table. */
.exercise-instruction-grid-v31{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding:20px 24px 24px;
  background:#f7f9fb;
  border-top:1px solid #e2e7eb;
}
.exercise-instruction-grid-v31>div,
.exercise-instruction-grid-v31>div:nth-child(3n),
.exercise-instruction-grid-v31>div:nth-child(even){
  padding:22px 24px;
  background:#fff;
  border:1px solid #dce3e8;
}

/* Give the execution notes the same breathing room without over-styling them. */
.exercise-execution-grid{
  gap:14px;
  padding:0 24px 24px;
  border-top:0;
  background:#f7f9fb;
}
.exercise-execution-note{
  border:1px solid #dce3e8;
  background:#fbfcfd;
}
.exercise-execution-note+ .exercise-execution-note{border-left:1px solid #dce3e8}

/* Two-handed context is only displayed for the selected two-handed exercises. */
.two-hand-context{display:grid;gap:12px;margin:0 0 18px}
.two-hand-context .library-break{margin:0}
.two-hand-context .two-hand-setup{margin:0}

@media(max-width:1000px){
  .exercise-selector{
    display:flex;
    overflow-x:auto;
    gap:8px;
    padding-bottom:5px;
    scrollbar-width:thin;
    -webkit-overflow-scrolling:touch;
  }
  .exercise-selector-button{flex:0 0 180px}
  .exercise-instruction-grid-v31{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .exercise-selector-button{flex-basis:168px;min-height:54px;padding:10px 12px}
  .exercise-familiarisation-note{grid-template-columns:1fr;gap:6px}
  .exercise-instruction-grid-v31{
    grid-template-columns:1fr;
    padding:16px;
    gap:12px;
  }
  .exercise-instruction-grid-v31>div,
  .exercise-instruction-grid-v31>div:nth-child(3n),
  .exercise-instruction-grid-v31>div:nth-child(even){border:1px solid #dce3e8}
  .exercise-execution-grid{grid-template-columns:1fr;padding:0 16px 18px;gap:12px}
  .exercise-execution-note+ .exercise-execution-note{border-top:1px solid #dce3e8}
}



/* iQQuip GB Exercises — V33 selector clarity + visual readability + plyometric visibility, 2026-08-21 */

/* Make the selector unmistakably interactive without adding visual clutter. */
.exercise-selector-intro{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin:32px 0 12px;
}
.exercise-selector-intro strong{
  color:var(--blue);
  font-size:11px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
  white-space:nowrap;
}
.exercise-selector-intro span{
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}

/* Keep the approved neutral-white hands, but give them stronger separation from the field. */
.hand-use-card figure{background:#e3eaee}
.hand-use-card img{max-height:330px}

/* Foot-position references should inform, not dominate the section. */
.start-position-visuals img{
  max-height:310px;
  width:100%;
  object-fit:contain;
}

/* Plyometrics is a shared dynamic principle and should be visible before individual exercises. */
.dynamic-card.plyometric{
  grid-column:1/-1;
  border-left:4px solid var(--red);
  background:#fff8f6;
}
.dynamic-card.plyometric .dynamic-kicker{color:var(--red)}
.dynamic-card.plyometric h3{max-width:760px}
.dynamic-card.plyometric p{max-width:1040px}

@media(max-width:700px){
  .exercise-selector-intro{display:block;margin-top:26px}
  .exercise-selector-intro strong{display:block;margin-bottom:5px}
  .hand-use-card img{max-height:290px}
  .start-position-visuals img{max-height:270px}
}
