/* sheetmusic — нотный стан. namespace .nt */

:root{
  --paper:#fbf8f1;
  --panel:#ffffff;
  --ink:#1a1a1a;
  --red:#c02026;
  --blue:#2a4d8f;
  --text:#23211e;
  --rule:#d8d1c0;
  --hair:#e7e0cf;
  --mute:#57524a;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:'Sofia Sans Condensed','Roboto Condensed','Arial Narrow',Arial,sans-serif;
  font-size:18px;
  line-height:1.62;
  overflow-x:hidden;
}

/* ——— нотный стан на всю страницу ——— */
.ntStaff{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:repeating-linear-gradient(
    to bottom,
    var(--rule) 0 1px, transparent 1px 15px,
    var(--rule) 15px 16px, transparent 16px 30px,
    var(--rule) 30px 31px, transparent 31px 45px,
    var(--rule) 45px 46px, transparent 46px 60px,
    var(--rule) 60px 61px, transparent 61px 134px
  );
  opacity:.85;
}

.nt{position:relative;z-index:1}
.ntWrap{max-width:1060px;margin:0 auto;padding:0 20px}

.nt h1,.nt h2{
  font-family:'Piazzolla',Georgia,'Times New Roman',serif;
  font-weight:600;
  color:var(--ink);
  letter-spacing:-.01em;
}
.nt h3,.nt h4{
  font-family:'Sofia Sans Condensed','Roboto Condensed','Arial Narrow',Arial,sans-serif;
  font-weight:600;
  color:var(--ink);
}
.nt p{margin:0 0 14px}
.nt a{color:var(--blue)}

/* ——— шапка ——— */
.ntTop{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0 10px}
.ntLogo{display:flex;align-items:center;gap:11px;text-decoration:none}
.ntLogoName{
  font-family:'Piazzolla',Georgia,serif;
  font-size:23px;
  color:var(--ink);
  letter-spacing:.02em;
  line-height:1;
}
.ntLogoSub{display:block;font-family:'Sofia Sans Condensed',Arial,sans-serif;font-size:12px;letter-spacing:.24em;color:var(--mute);text-transform:uppercase}
.nt a.ntTopLink{
  background:var(--blue);
  color:#ffffff;
  text-decoration:none;
  padding:10px 18px;
  font-size:17px;
  border-radius:2px;
  letter-spacing:.02em;
  white-space:nowrap;
}
.nt a.ntTopLink:hover{background:#1e3a6d}

/* ——— панель ——— */
.ntPanel{
  background:var(--panel);
  border:1px solid var(--hair);
  border-radius:3px;
  padding:24px 26px;
  box-shadow:0 1px 2px rgba(26,26,26,.05);
}

/* ——— герой ——— */
.ntHero{margin:6px 0 10px}
.ntEyebrow{
  font-size:14px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);
  margin:0 0 10px;
}
.nt h1{font-size:clamp(29px,5.4vw,50px);line-height:1.08;margin:0 0 16px;max-width:19ch}
.ntLead{font-size:19px;color:var(--text);max-width:64ch}
.ntFacts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0 22px}
.ntFact{border-top:2px solid var(--ink);padding-top:9px}
.ntFactNum{display:block;font-family:'Piazzolla',Georgia,serif;font-size:25px;color:var(--ink);line-height:1.1}
.ntFactCap{display:block;font-size:15px;color:var(--mute);letter-spacing:.02em}
.ntCtaRow{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.nt a.ntCta{
  display:inline-block;
  background:var(--red);
  color:#ffffff;
  text-decoration:none;
  padding:15px 32px;
  font-size:20px;
  letter-spacing:.02em;
  border-radius:2px;
}
.nt a.ntCta:hover{background:#96181d}
.nt a.ntCtaAlt{
  display:inline-block;
  background:var(--panel);
  color:var(--blue);
  text-decoration:none;
  padding:14px 26px;
  font-size:18px;
  border:1.5px solid var(--blue);
  border-radius:2px;
}
.nt a.ntCtaAlt:hover{background:#eef2f9}

/* ——— такт: ключ + номер + лига ——— */
.ntSec{margin:0}
.ntBar{display:flex;align-items:center;gap:11px;margin:0 0 12px}
.ntClef{
  width:46px;height:46px;flex:0 0 46px;
  border:1.5px solid var(--blue);border-radius:50%;
  background:var(--panel);color:var(--blue);
  display:flex;align-items:center;justify-content:center;
}
.ntNum{
  border:1.5px solid var(--ink);
  background:var(--panel);
  color:var(--ink);
  font-size:15px;
  letter-spacing:.1em;
  padding:6px 10px;
  line-height:1;
}
.nt h2.ntSlur{
  position:relative;
  display:inline-block;
  font-size:clamp(23px,3.6vw,35px);
  line-height:1.16;
  margin:0 0 26px;
  padding:0 6px 16px;
  max-width:24ch;
}
.nt h2.ntSlur::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:17px;
  border:2px solid var(--red);
  border-top:0;
  border-radius:0 0 50% 50% / 0 0 100% 100%;
  opacity:.8;
}

/* ——— тактовая черта между секциями ——— */
.ntBarline{display:flex;align-items:center;justify-content:center;gap:6px;height:66px}
.ntBarline span{display:block;height:54px;background:var(--ink)}
.ntBarThin{width:2px}
.ntBarThick{width:8px}

/* ——— ступени пакета ——— */
.ntSteps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 18px}
.ntStep{border:1px solid var(--hair);border-left:4px solid var(--red);padding:14px 16px;background:#fefdf9}
.ntStepCap{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.ntStepNum{font-family:'Piazzolla',Georgia,serif;font-size:27px;color:var(--ink);line-height:1.15}
.ntStepList{margin:6px 0 0;padding:0;list-style:none;font-size:17px;color:var(--text)}
.ntStepList li{padding:2px 0;border-bottom:1px dotted var(--hair)}
.ntStepList li:last-child{border-bottom:0}

/* ——— партитура каталога ——— */
.ntScore{margin:4px 0 18px}
.ntScoreHead{display:flex;justify-content:space-between;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);border-bottom:1.5px solid var(--ink);padding-bottom:6px}
.ntScoreRow{
  display:grid;
  grid-template-columns:84px minmax(0,1fr) auto;
  gap:14px;align-items:center;
  border-bottom:1px solid var(--hair);
}
.ntPitch{position:relative;height:68px;width:84px}
.ntPitch::before{content:"";position:absolute;left:6px;right:6px;top:34px;height:1px;background:#e9e2d1}
.ntNote{
  position:absolute;left:30px;
  width:21px;height:16px;border-radius:50%;
  background:var(--ink);
  transform:rotate(-19deg);
}
.ntNote::after{
  content:"";position:absolute;right:1px;top:-25px;
  width:2px;height:27px;background:var(--ink);
  transform:rotate(19deg);
}
.ntP1{top:44px}.ntP2{top:2px}.ntP3{top:48px}.ntP4{top:22px}
.ntP5{top:34px}.ntP6{top:49px}.ntP7{top:41px}.ntP8{top:38px}
.ntP9{top:49px}.ntP10{top:26px}.ntP11{top:52px}.ntP12{top:51px}
.ntTitle{font-size:19px;color:var(--ink);line-height:1.25}
.ntTitleMech{display:block;font-size:15px;color:var(--mute)}
.ntMeta{font-size:17px;color:var(--blue);white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.ntScoreNote{font-size:16px;color:var(--mute)}

/* ——— клуб: 6 нот по восходящей ——— */
.ntClub{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;align-items:end;margin:0 0 20px}
.ntTier{border:1px solid var(--hair);background:#fefdf9;padding:12px 12px 14px;text-align:center}
.ntTierGlyph{height:46px;display:flex;align-items:flex-end;justify-content:center;color:var(--ink)}
.ntTierName{font-family:'Piazzolla',Georgia,serif;font-size:19px;color:var(--ink);margin-top:6px}
.ntTierBack{display:block;font-size:24px;color:var(--red);line-height:1.2}
.ntTierDur{display:block;font-size:14px;color:var(--mute);letter-spacing:.06em}
.ntRise1{margin-bottom:0}
.ntRise2{margin-bottom:14px}
.ntRise3{margin-bottom:28px}
.ntRise4{margin-bottom:42px}
.ntRise5{margin-bottom:56px}
.ntRise6{margin-bottom:70px}

/* ——— касса ——— */
.ntTableWrap{overflow-x:auto;margin:0 0 18px}
.ntTable{border-collapse:collapse;width:100%;min-width:470px;font-size:17px}
.ntTable th{
  text-align:left;font-weight:600;font-size:14px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mute);border-bottom:1.5px solid var(--ink);padding:8px 10px 7px;
}
.ntTable td{border-bottom:1px solid var(--hair);padding:10px;vertical-align:top}
.ntTable td:first-child{color:var(--ink)}
.ntTempo{color:var(--red);white-space:nowrap;font-variant-numeric:tabular-nums}

/* ——— врезка отзыва ——— */
.ntQuote{border-left:4px solid var(--red);background:#fdfaf1;padding:15px 18px;margin:20px 0 4px}
.ntQuoteWho{display:block;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-top:8px}

/* ——— мелочи ——— */
.ntGrid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ntList{margin:0 0 14px;padding:0;list-style:none}
.ntList li{position:relative;padding:4px 0 4px 26px;border-bottom:1px solid var(--hair)}
.ntList li::before{content:"\266A";position:absolute;left:4px;top:4px;color:var(--red)}
.ntList li:last-child{border-bottom:0}
.ntKey{font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:18px 0 8px}
.nt h3.ntKey{font-size:15px}

/* ——— FAQ ——— */
.ntFaq details{border-bottom:1px solid var(--hair);padding:12px 0}
.ntFaq summary{
  cursor:pointer;list-style:none;position:relative;padding-right:30px;
  font-size:19px;color:var(--ink);
}
.ntFaq summary::-webkit-details-marker{display:none}
.ntFaq summary::after{content:"\266B";position:absolute;right:4px;top:0;color:var(--red)}
.ntFaq details[open] summary::after{content:"\266A"}
.ntFaq details p{margin:10px 0 2px;color:var(--text)}

/* ——— автор + подвал ——— */
.ntAuthor{border:1px solid var(--hair);border-top:3px solid var(--blue);background:var(--panel);padding:20px 24px;margin:0 0 26px}
.ntAuthorCap{font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);margin:0 0 8px}
.ntAge{display:inline-block;border:1.5px solid var(--red);color:var(--red);padding:2px 9px;font-size:15px;letter-spacing:.06em;margin-right:8px}
.ntFoot{border-top:2px solid var(--ink);padding:22px 0 40px;font-size:16px;color:var(--mute);background:var(--paper)}
.ntFoot p{margin:0 0 9px}

.ntSpacer{height:14px}

/* ——— мобильный ——— */
@media (max-width:860px){
  .ntFacts{grid-template-columns:1fr 1fr}
  .ntSteps{grid-template-columns:1fr}
  .ntClub{grid-template-columns:repeat(3,1fr)}
  .ntRise1,.ntRise2,.ntRise3,.ntRise4,.ntRise5,.ntRise6{margin-bottom:0}
  .ntGrid2{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:17px}
  .ntWrap{padding:0 14px}
  .ntPanel{padding:18px 15px}
  .nt h1{max-width:100%}
  .nt h2.ntSlur{max-width:100%;padding-left:0}
  .ntTop{padding:12px 0 6px}
  .nt a.ntTopLink{padding:9px 13px;font-size:16px}
  .ntLogoName{font-size:20px}
  .ntLead{font-size:18px}
  .ntFacts{gap:10px;margin:16px 0 18px}
  .ntFactNum{font-size:22px}
  .nt a.ntCta{padding:14px 22px;font-size:18px}
  .ntScoreRow{grid-template-columns:62px minmax(0,1fr);row-gap:0;padding-bottom:10px}
  .ntPitch{width:62px;height:62px}
  .ntNote{left:20px}
  .ntMeta{grid-column:2;font-size:16px;white-space:normal}
  .ntClub{grid-template-columns:1fr 1fr}
  .ntTable{min-width:0}
  .ntTable tr:first-child{display:none}
  .ntTable tr{display:block;border-bottom:1.5px solid var(--hair);padding:10px 0}
  .ntTable td{display:block;border:0;padding:1px 0}
  .ntTable td:first-child{font-size:20px;color:var(--ink)}
  .ntTable td[data-l]::before{
    content:attr(data-l) " ";
    color:var(--mute);font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  }
  .ntBarline{height:52px}
  .ntBarline span{height:42px}
}
