
/* Method page v2 — page-specific refinement only */

.method-hero h1{
  max-width:1050px;
  font-size:clamp(4rem,7.2vw,7.5rem);
}

.method-pathways{
  margin-top:58px;
  border-top:1px solid var(--line);
}
.method-pathway{
  display:grid;
  grid-template-columns:110px 1fr;
  gap:34px;
  padding:42px 0;
  border-bottom:1px solid var(--line);
}
.method-pathway-number{
  font:500 clamp(3.2rem,5vw,5.2rem)/.9 var(--serif);
  color:#7A2E38;
}
.method-pathway-copy{
  max-width:850px;
}
.method-pathway-copy h3{
  font:500 clamp(2.3rem,3.8vw,3.9rem)/.97 var(--serif);
  letter-spacing:-.03em;
  margin:12px 0 20px;
}
.method-pathway-copy p{
  max-width:720px;
  color:var(--text);
  margin:0 0 15px;
}

.method-custom-band{
  padding:88px 0!important;
}
.method-custom-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:72px;
  align-items:start;
}
.method-custom-grid h2{
  font:500 clamp(3.3rem,5vw,5.3rem)/.96 var(--serif);
  letter-spacing:-.04em;
  margin:17px 0 0;
}
.method-custom-copy{
  border-left:1px solid rgba(246,242,233,.45);
  padding-left:42px;
}
.method-custom-copy p{
  margin:0 0 18px;
  max-width:650px;
  color:#f6f2e9;
}
.method-custom-copy strong{
  font-weight:600;
}

.method-practice-sequence{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:58px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.method-practice-step{
  padding:28px 24px 32px;
  border-right:1px solid var(--line);
  min-height:310px;
}
.method-practice-step:last-child{
  border-right:0;
}
.method-practice-step>span{
  display:block;
  font:500 1.2rem var(--serif);
  color:#7A2E38;
  margin-bottom:34px;
}
.method-practice-step h3{
  font:500 clamp(1.65rem,2.2vw,2.2rem)/1 var(--serif);
  margin:0 0 16px;
}
.method-practice-step p{
  margin:0;
  color:var(--text);
  font-size:.83rem;
}

.method-automatic{
  margin-top:58px;
  display:grid;
  grid-template-columns:1fr 80px 1fr;
  align-items:center;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.method-automatic-large{
  padding:45px 0;
}
.method-automatic-large p{
  font:500 clamp(2rem,3.3vw,3.4rem)/1.04 var(--serif);
  letter-spacing:-.025em;
  margin:0;
  max-width:470px;
}
.method-automatic-arrow{
  font:400 2rem var(--serif);
  text-align:center;
  color:#7A2E38;
}
.method-note{
  width:min(760px,100%);
  margin:34px 0 0 auto;
  padding-left:28px;
  border-left:1px solid #7A2E38;
}
.method-note p{
  margin:0;
  color:var(--text);
  font-size:.92rem;
}

.method-stage h2{
  max-width:1080px;
}

@media(max-width:900px){
  .method-custom-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .method-custom-copy{
    border-left:0;
    border-top:1px solid rgba(246,242,233,.45);
    padding:30px 0 0;
  }
  .method-practice-sequence{
    grid-template-columns:repeat(2,1fr);
  }
  .method-practice-step:nth-child(2){
    border-right:0;
  }
  .method-practice-step:nth-child(-n+2){
    border-bottom:1px solid var(--line);
  }
}

@media(max-width:700px){
  .method-pathway{
    grid-template-columns:55px 1fr;
    gap:20px;
    padding:32px 0;
  }
  .method-pathway-number{
    font-size:3rem;
  }
  .method-practice-sequence{
    grid-template-columns:1fr;
  }
  .method-practice-step{
    min-height:auto;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .method-practice-step:last-child{
    border-bottom:0;
  }
  .method-automatic{
    grid-template-columns:1fr;
  }
  .method-automatic-large{
    padding:30px 0;
  }
  .method-automatic-arrow{
    text-align:left;
    transform:rotate(90deg);
    width:max-content;
    margin:0 0 0 12px;
  }
}

/* Interactive repertoire explorer */
.method-repertoire-head,.method-lab-head{display:grid;grid-template-columns:1.35fr .65fr;gap:70px;align-items:end;margin-bottom:52px}
.method-repertoire-head h2,.method-lab-head h2{font:500 clamp(3.2rem,5.4vw,5.8rem)/.93 var(--serif);letter-spacing:-.04em;margin:14px 0 0;max-width:940px}
.method-repertoire-head>p,.method-lab-head>p{margin:0 0 7px;color:var(--text);max-width:440px}
.repertoire-explorer{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.repertoire-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
.repertoire-tab{appearance:none;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink);padding:22px 24px;text-align:left;font:500 1.05rem var(--serif);cursor:pointer;transition:background .25s,color .25s}
.repertoire-tab:last-child{border-right:0}.repertoire-tab:hover{background:rgba(122,46,56,.06)}.repertoire-tab.is-active{background:#7A2E38;color:#f6f2e9}
.repertoire-panel{padding:46px 24px 38px}.rep-route{display:grid;grid-template-columns:1fr 54px 1fr 54px 1fr;align-items:stretch}.rep-node{padding:28px 24px;border:1px solid var(--line);min-height:150px}.rep-node span{display:block;font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;color:#7A2E38;margin-bottom:22px}.rep-node strong{font:500 clamp(1.35rem,2vw,1.8rem)/1.05 var(--serif)}.rep-arrow{display:grid;place-items:center;color:#7A2E38;font:1.7rem var(--serif)}.rep-note{margin:32px 0 0 auto;max-width:760px;padding-left:25px;border-left:1px solid #7A2E38;color:var(--text);font-size:.88rem}

/* Interactive practice laboratory */
.method-lab{overflow:hidden}.practice-lab{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.practice-stage-nav{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--line)}
.practice-stage{appearance:none;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink);padding:20px 17px 18px;text-align:left;cursor:pointer;min-height:88px;transition:background .25s,color .25s}
.practice-stage:last-child{border-right:0}.practice-stage span{display:block;font:500 .65rem var(--sans);letter-spacing:.13em;color:#7A2E38;margin-bottom:8px}.practice-stage strong{font:500 1.05rem var(--serif)}.practice-stage:hover{background:rgba(122,46,56,.05)}.practice-stage.is-active{background:#7A2E38;color:#f6f2e9}.practice-stage.is-active span{color:#e6c9c1}
.practice-workspace{display:grid;grid-template-columns:1.35fr .65fr;min-height:570px}.working-score{padding:44px 42px 28px;background:var(--soft);border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}.score-svg{width:100%;height:auto;overflow:visible}.staff-lines path,.bar-lines path{stroke:var(--ink);stroke-width:1.1;fill:none;opacity:.55}.bar-lines path{opacity:.32}.notes circle{fill:var(--ink)}.notes path{stroke:var(--ink);stroke-width:3;fill:none}.notes .beam{stroke-width:8}.measure{transition:opacity .45s ease,transform .45s ease;transform-origin:center}.problem-box{fill:none;stroke:#7A2E38;stroke-width:3;opacity:0;transition:opacity .35s}.fragment-guides,.analysis-marks,.learn-mark{opacity:0;transition:opacity .4s}.fragment-guides path{stroke:#7A2E38;stroke-width:1.2;stroke-dasharray:5 6}.fragment-guides text,.analysis-marks text,.learn-mark text{fill:#7A2E38;font-family:'Cormorant Garamond',serif;font-size:18px;font-style:italic}.analysis-marks path,.learn-mark path{stroke:#7A2E38;stroke-width:2.2;fill:none}.learn-mark path{stroke-width:4}.score-caption{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);margin-top:20px;padding-top:15px;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase}.score-status{color:#7A2E38}.score-hint{color:var(--grey)}
.practice-explanation{padding:52px 42px;display:flex;align-items:center}.practice-copy span{display:block;font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:#7A2E38;margin-bottom:22px}.practice-copy h3{font:500 clamp(2rem,3.2vw,3.4rem)/.97 var(--serif);letter-spacing:-.025em;margin:0 0 24px}.practice-copy p{margin:0;color:var(--text);max-width:430px}.practice-copy.is-active{animation:methodCopyIn .38s ease both}@keyframes methodCopyIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* stage states */
.practice-lab[data-stage="understand"] .problem-box{opacity:.38}.practice-lab[data-stage="reduce"] .measure:not(.problem){opacity:.12}.practice-lab[data-stage="reduce"] .problem{transform:scale(1.08)}.practice-lab[data-stage="reduce"] .problem-box{opacity:1}.practice-lab[data-stage="step"] .measure:not(.problem){opacity:.08}.practice-lab[data-stage="step"] .problem{transform:scale(1.12)}.practice-lab[data-stage="step"] .problem-box{opacity:.35}.practice-lab[data-stage="step"] .fragment-guides{opacity:1}.practice-lab[data-stage="adjust"] .measure:not(.problem){opacity:.22}.practice-lab[data-stage="adjust"] .problem-box{opacity:.7}.practice-lab[data-stage="adjust"] .analysis-marks{opacity:1}.practice-lab[data-stage="learn"] .learn-mark{opacity:1}.practice-lab[data-stage="learn"] .problem-box{opacity:0}

@media(max-width:900px){.method-repertoire-head,.method-lab-head{grid-template-columns:1fr;gap:24px}.rep-route{grid-template-columns:1fr}.rep-arrow{height:42px;transform:rotate(90deg)}.practice-stage-nav{grid-template-columns:repeat(5,minmax(130px,1fr));overflow-x:auto}.practice-workspace{grid-template-columns:1fr}.working-score{border-right:0;border-bottom:1px solid var(--line)}.practice-explanation{min-height:330px}}
@media(max-width:700px){.repertoire-tabs{grid-template-columns:1fr}.repertoire-tab{border-right:0;border-bottom:1px solid var(--line)}.repertoire-tab:last-child{border-bottom:0}.repertoire-panel{padding:30px 0}.working-score{padding:30px 14px 20px}.practice-explanation{padding:34px 20px}.score-hint{display:none}}
/* v6.3 — real score interaction */
.rep-node em{display:block;margin-top:7px;font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:400;color:var(--grey)}
.real-score-lab .practice-stage-nav{grid-template-columns:repeat(4,1fr)}
.real-score-workspace{min-height:610px;justify-content:space-between;overflow:hidden}
.score-state{width:100%;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;animation:scoreStateIn .42s ease both}
.score-state[hidden]{display:none}
.score-state img,.score-state video{display:block;max-width:100%;max-height:520px;width:auto;height:auto;object-fit:contain}
.score-state[data-score-state="understand"] img,.score-state[data-score-state="learn"] img{width:100%;max-height:520px}
.method-demo-video{width:100%;background:transparent}
.simplify-video{transform:scale(1.04);transform-origin:center}
@keyframes scoreStateIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:900px){.real-score-lab .practice-stage-nav{grid-template-columns:repeat(4,minmax(155px,1fr))}.real-score-workspace{min-height:500px}.score-state img,.score-state video{max-height:430px}}
@media(prefers-reduced-motion:reduce){.score-state{animation:none}}
