/* /lesson-tour — the player mock is the centrepiece; the rest reads like notes beside it. */

.lt-head{padding:clamp(40px,7vw,88px) 0 clamp(24px,4vw,40px)}
.lt-head__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,5vw,72px);align-items:end}
.lt-head h1{margin-bottom:0;max-width:14ch}
.lt-head__lead{margin:0;color:var(--muted);font-size:1.125rem;max-width:56ch}

/* player */
.lt-player-band{padding:clamp(16px,3vw,32px) 0 clamp(48px,7vw,96px);background:linear-gradient(to bottom,transparent 0,transparent 30%,var(--bg-2) 30%,var(--bg-2) 100%)}
.lt-player{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.8fr);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.lt-screen{border-right:1px solid var(--line)}
.lt-frame{position:relative;aspect-ratio:16/9;background:#05090a;overflow:hidden}
.lt-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lt-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,20,23,.92) 0,rgba(10,20,23,.2) 45%,rgba(10,20,23,.55) 100%)}
.lt-frame__top{position:absolute;z-index:1;top:0;left:0;right:0;display:flex;justify-content:space-between;gap:16px;padding:14px 18px;
  font:500 .78rem/1.4 var(--font-mono);letter-spacing:.08em;color:var(--text)}
.lt-frame__top span:last-child{color:var(--muted-teal);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.lt-play{position:absolute;z-index:1;left:50%;top:46%;transform:translate(-50%,-50%);display:grid;place-items:center;width:72px;height:72px;border-radius:50%;
  background:rgba(10,20,23,.78);border:1px solid var(--gold);color:var(--gold);box-shadow:var(--glow)}
.lt-play svg{margin-left:4px}
.lt-frame__sub{position:absolute;z-index:1;left:18px;right:18px;bottom:14px;margin:0;max-width:60ch;font-size:.95rem;color:var(--text);
  background:rgba(10,20,23,.82);padding:8px 12px;border-radius:2px}
.lt-frame__sub span{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-right:6px}

.lt-bar{padding:16px 18px 18px}
.lt-track{position:relative;height:6px;border-radius:3px;background:var(--line-2)}
.lt-track__done{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--gold)}
.lt-track__mark{position:absolute;top:-4px;width:2px;height:14px;background:var(--text);opacity:.7;transform:translateX(-1px)}
.lt-bar__time{display:flex;justify-content:space-between;margin-top:8px;font:500 .8rem/1.4 var(--font-mono);color:var(--muted);font-variant-numeric:tabular-nums}
.lt-chapters{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.lt-chapters li{margin:0;padding:8px 10px;border:1px solid var(--line);border-radius:2px;font-size:.88rem;line-height:1.35;color:var(--muted)}
.lt-chapters li span{display:block;font:500 .78rem/1.4 var(--font-mono);color:var(--teal);font-variant-numeric:tabular-nums}
.lt-chapters li.is-now{border-color:var(--gold);color:var(--text)}
.lt-chapters li.is-now span{color:var(--gold)}

.lt-units{padding:18px}
.lt-units ol{list-style:none;padding:0;margin:12px 0 0}
.lt-units li{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:11px 0;border-top:1px solid var(--line);margin:0}
.lt-units li.is-now{border-left:2px solid var(--gold);padding-left:10px;margin-left:-12px}
.lt-units__n{grid-row:span 2;font:500 .78rem/1.6 var(--font-mono);color:var(--teal);letter-spacing:.06em}
.lt-units li.is-now .lt-units__n{color:var(--gold)}
.lt-units__t{font-size:.98rem;line-height:1.35}
.lt-units__m{font:400 .8rem/1.4 var(--font-mono);color:var(--muted);font-variant-numeric:tabular-nums}
.lt-caption{margin:14px 0 0;font-size:.92rem;color:var(--muted);max-width:72ch}

/* rhythm */
.lt-rhythm{padding:clamp(56px,8vw,104px) 0}
.lt-steps{list-style:none;padding:0;margin:clamp(20px,3vw,36px) 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line-2)}
.lt-steps li{margin:0;padding:24px clamp(14px,2vw,26px) 8px;border-left:1px solid var(--line)}
.lt-steps li:first-child{border-left:0;padding-left:0}
.lt-steps__n{display:block;font:600 2.6rem/1 var(--font-head);color:var(--gold);margin-bottom:14px;font-variant-numeric:tabular-nums}
.lt-steps p{color:var(--muted);margin:0}

/* scope table */
.lt-scope{padding:clamp(48px,7vw,88px) 0;background:var(--bg-2);border-block:1px solid var(--line)}
.lt-scope__grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(20px,5vw,64px);align-items:start}
.lt-scope__grid > div:first-child p{color:var(--muted)}
.lt-table{width:100%;border-collapse:collapse;font-size:1rem}
.lt-table th{font:500 .8rem/1.4 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:0 16px 12px 0;color:var(--teal);border-bottom:1px solid var(--line-2)}
.lt-table th:last-child{color:var(--coral)}
.lt-table td{padding:14px 16px 14px 0;border-bottom:1px solid var(--line);vertical-align:top;width:50%}
.lt-table td:last-child{color:var(--muted)}

/* honest notes */
.lt-honest{padding:clamp(56px,8vw,104px) 0}
.lt-honest__grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(20px,5vw,64px)}
.lt-honest__text{max-width:66ch}
.lt-honest__buy{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:1.6em}
.lt-price{font:500 1.5rem/1 var(--font-mono);color:var(--gold);font-variant-numeric:tabular-nums}
.lt-more{color:var(--coral)!important;text-decoration:none!important;font-weight:700}

@media (max-width:980px){
  .lt-player{grid-template-columns:1fr}
  .lt-screen{border-right:0;border-bottom:1px solid var(--line)}
  .lt-steps{grid-template-columns:1fr 1fr}
  .lt-steps li:nth-child(3){border-left:0;padding-left:0}
}
@media (max-width:760px){
  .lt-head__grid,.lt-scope__grid,.lt-honest__grid{grid-template-columns:1fr}
  .lt-chapters{grid-template-columns:1fr 1fr}
  .lt-frame{aspect-ratio:4/3}
  .lt-frame__top span:last-child{display:none}
  .lt-play{width:56px;height:56px;top:40%}
}
@media (max-width:520px){
  .lt-steps{grid-template-columns:1fr}
  .lt-steps li{border-left:0;padding-left:0;border-bottom:1px solid var(--line)}
  .lt-table,.lt-table thead,.lt-table tbody,.lt-table tr,.lt-table td{display:block;width:auto}
  .lt-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .lt-table tr{padding:10px 0;border-bottom:1px solid var(--line)}
  .lt-table td{border:0;padding:4px 0 4px 22px;position:relative}
  .lt-table td::before{position:absolute;left:0;font-family:var(--font-mono)}
  .lt-table td:first-child::before{content:"+";color:var(--gold)}
  .lt-table td:last-child::before{content:"\2212";color:var(--coral)}
}