/* ═══════════════════════════════════════════════════════════════════
   Подари Песню — «Ночной салон», страницы сайта: радио, подарок, партнёр, оплата прошла, юридические документы.
   Подключается ПОСЛЕ pp2.css (токены, шапка, кнопки, плеер, радио — там). Главная и /besplatno стоят на своём внутреннем стиле.
   ═══════════════════════════════════════════════════════════════════ */

.wrap-wide{max-width:1120px}
.hdr-cta{display:inline-flex;align-items:center;flex:none;min-height:44px;padding:0 20px;border-radius:2px;background:var(--brass);color:#17110B;
  font:500 14px/1 var(--sans);white-space:nowrap;transition:background .3s var(--ease)}
@media(hover:hover){.hdr-cta:hover{background:#D8B87A}}

/* ── подвал: ссылки на документы и реквизиты (обязательны для оплаты) ── */
.footer{margin-top:56px;border-top:1px solid var(--hair);color:var(--mute);font-size:14px}
.footer .links{display:flex;flex-wrap:wrap;align-items:center;gap:0 28px;padding-top:10px}
.footer .links a{display:inline-flex;align-items:center;min-height:44px;font:500 13px/1.2 var(--sans);letter-spacing:.04em;color:var(--mute)}
@media(hover:hover){.footer .links a:hover{color:var(--champ)}}
.footer .legal{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-top:10px;padding:18px 0 44px;border-top:1px solid var(--hair);line-height:1.6}
.footer .legal .site{font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ivory);white-space:nowrap}

/* ── радио ─────────────────────────────────────────────────────────── */
.r-lead{max-width:36em}
.r-empty{padding:40px 0;color:var(--mute)}

/* ── юридические документы: только вёрстка, тексты не тронуты ─────── */
.doc{max-width:720px;margin:0 auto;padding:40px 0 8px}
.doc .back{display:inline-flex;align-items:center;min-height:44px;margin-bottom:28px;font:500 12px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--brass)}
@media(hover:hover){.doc .back:hover{color:var(--champ)}}
.doc h1{font:300 clamp(36px,6vw,56px)/1.05 var(--serif);letter-spacing:-.01em;margin:0 0 20px;text-wrap:balance}
.doc .doc-meta{padding-bottom:28px;margin-bottom:8px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.65;color:var(--mute)}
.doc h2{margin:48px 0 14px;padding-top:28px;border-top:1px solid var(--hair);font:400 clamp(26px,3.4vw,32px)/1.15 var(--serif)}
.doc h3{margin:28px 0 8px;font:600 16px/1.4 var(--sans);color:var(--ivory)}
.doc p{margin:0 0 16px;font-size:16px;line-height:1.7;color:#DDD3C0}
.doc a{color:var(--champ);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
@media(hover:hover){.doc a:hover{color:var(--ivory)}}
.doc .muted,.doc p.muted{color:var(--mute)}
.doc strong{font-weight:600;color:var(--ivory)}
.doc ul,.doc ol{margin:0 0 18px;padding-left:26px}
.doc li{margin:0 0 9px;font-size:16px;line-height:1.65;color:#DDD3C0}
.doc ul>li{list-style:disc}
.doc ol>li{list-style:decimal}
.doc li::marker{color:var(--brass)}
.doc .toc{margin:30px 0 40px;padding:22px 24px;border:1px solid var(--hair);background:rgba(241,233,216,.03)}
.doc .toc>strong{display:block;margin-bottom:14px;font:500 11.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.doc .toc ol{margin:0;padding-left:22px}
.doc .toc li{margin-bottom:8px}
.doc .toc a{color:var(--ivory);text-decoration:none}
@media(hover:hover){.doc .toc a:hover{color:var(--champ)}}
.doc .callout{margin:24px 0;padding:18px 20px;border-left:2px solid var(--brass);background:rgba(200,165,106,.07);font-size:15.5px;line-height:1.65;color:#DDD3C0}
.doc .req-table{width:100%;margin:18px 0 28px;border-collapse:collapse;font-size:15px}
.doc .req-table td{padding:13px 16px;border:1px solid var(--hair);vertical-align:top;line-height:1.55;color:#DDD3C0}
.doc .req-table tr td:first-child{width:42%;font-size:13.5px;color:var(--mute)}
.doc .step{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:22px 0;border-top:1px solid var(--hair)}
.doc .step:first-of-type{border-top:none}
.doc .step-num{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--brass);border-radius:50%;font:italic 400 22px/1 var(--serif);color:var(--brass)}
.doc .step h3{margin-top:2px}
.doc .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 8px}
.doc .contact-card{padding:24px;border:1px solid var(--hair);background:rgba(241,233,216,.035)}
.doc .contact-card h3{margin-top:0}
.doc .contact-card .ico{display:grid;place-items:center;width:42px;height:42px;margin-bottom:14px;border:1px solid var(--brass);border-radius:50%;color:var(--brass)}

/* ── оплата прошла ─────────────────────────────────────────────────── */
.done{padding:36px 0 8px}
.inv{margin-top:30px;padding-top:18px;border-top:1px solid var(--hair);font:500 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}

/* ── страница подарка: её открывает не покупатель, а тот, кому песня ── */
/* Во встроенных браузерах телеграма и ВК снизу висит своя панель, а на айфонах ещё и домашняя полоса — иначе последняя строка под ними. */
.g-wrap{max-width:600px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-right,0px)) calc(80px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px))}
.g-top{padding-bottom:0}
/* Конверт: песня не начинает играть сама. Человек должен её открыть — это и есть момент вручения. */
.g-envelope{position:relative;margin:36px 0 20px;padding:clamp(48px,11vw,80px) clamp(22px,6vw,48px);text-align:center;border:1px solid var(--line);outline:1px solid var(--hair);outline-offset:8px}
.g-for{font:500 12px/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.g-name{margin:18px 0 26px;font:300 clamp(52px,15vw,96px)/1 var(--serif);letter-spacing:-.015em;overflow-wrap:break-word;text-wrap:balance}
.g-note{max-width:26em;margin:0 auto 14px;font:italic 400 clamp(21px,5vw,26px)/1.4 var(--serif);color:var(--champ);text-wrap:pretty;white-space:pre-line}
.g-from{margin-bottom:38px;font:500 14px/1.4 var(--sans);letter-spacing:.06em;color:var(--mute)}
.g-open{min-height:64px;padding:0 38px;font-size:17px}
.g-song{display:none}
.g-song.is-on{display:block}
.g-cover{display:block;width:100%;max-width:420px;aspect-ratio:1;object-fit:cover;margin:0 auto 28px;padding:8px;border:1px solid var(--line);background:#0F0C0A}
.g-title{margin-bottom:24px;text-align:center;font:300 clamp(36px,8.5vw,52px)/1.06 var(--serif);text-wrap:balance}
.g-song audio{width:100%}
.g-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.g-actions .btn{width:auto;flex:1 1 220px}
.g-lyrics{white-space:pre-wrap;margin:34px 0 8px;padding:26px 24px 28px;border-left:1px solid var(--brass);background:rgba(241,233,216,.03);font:400 clamp(20px,5vw,22px)/1.55 var(--serif);overflow-wrap:anywhere}
.g-made{margin-top:48px;padding-top:22px;border-top:1px solid var(--hair);text-align:center;font-size:14px;line-height:1.6;color:var(--mute)}
.g-made a{color:var(--champ);text-decoration:underline;text-underline-offset:3px}
.g-err{padding:60px 0;text-align:center;color:var(--mute)}

/* ── отчёт партнёра: свой ключ, свои цифры ─────────────────────────── */
.partner{padding:28px 0 60px}
.partner .eyebrow{margin-bottom:14px}
.partner .h-poster{overflow-wrap:anywhere}
.partner h2{margin:48px 0 12px;font:400 clamp(26px,3.4vw,32px)/1.15 var(--serif)}
.partner .link{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 8px;color:inherit;text-decoration:none}
.partner .link code{font:500 16px/1.5 var(--sans);overflow-wrap:anywhere;color:var(--champ)}
.partner .link .btn{width:auto;min-height:48px}
.partner .rows{margin:0;padding:0;border-top:0}
.partner .rows div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--hair)}
.partner .rows div:last-child{border-bottom:1px solid var(--hair)}
.partner .rows dt{color:var(--mute)}
.partner .rows dd{margin:0;font-weight:500;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.partner .rows .itog dt,.partner .rows .itog dd{color:var(--ivory);font-weight:600}
.partner .rows .dolya dd{color:var(--champ);font-weight:600}
.partner .days{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.partner .days th,.partner .days td{padding:11px 0;border-top:1px solid var(--hair);text-align:right}
.partner .days th:first-child,.partner .days td:first-child{text-align:left}
.partner .days th{color:var(--mute);font-weight:500;font-size:14px}
.partner .days tr:last-child td{border-bottom:1px solid var(--hair)}
.partner .note{margin-top:28px;max-width:46em;color:var(--mute);font-size:15px;line-height:1.6}
.partner .state{margin:22px 0 0;padding:14px 16px;border-left:2px solid var(--brass);background:rgba(200,165,106,.08)}

@media(max-width:600px){
  .footer{margin-top:44px}
  .footer .links{gap:0 22px}
  .doc{padding:28px 0 8px}
  .doc .contact-grid{grid-template-columns:1fr}
  .doc .step{grid-template-columns:40px 1fr;gap:14px}
  .doc .step-num{width:40px;height:40px;font-size:20px}
  .doc .req-table td{padding:10px 12px}
  .doc .req-table tr td:first-child{width:44%}
  .doc .toc{padding:18px 18px}
  .g-envelope{margin-top:28px;outline-offset:6px}
  .partner{padding:26px 0 56px}
  .partner .rows div{gap:10px}
  .partner .days th,.partner .days td{padding:9px 0}
}