/* Сайт «Бис»: программка вечера и билеты, а не шаблон SaaS. Шрифты и цвета — из приложения. */
@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(fonts/unbounded-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(fonts/unbounded-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(fonts/manrope-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(fonts/manrope-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(fonts/manrope-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(fonts/manrope-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:JBM;font-weight:500;font-display:swap;src:url(fonts/jetbrains-mono-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0400-045F}
@font-face{font-family:JBM;font-weight:500;font-display:swap;src:url(fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F}

:root{--bg:#0D0C11;--paper:#F5F1E8;--ink:#16141C;--card:#17161D;--line:rgba(245,241,232,.12);--muted:#A39FAD;--coral:#FF5A36;--sun:#FFC23D;--mint:#2ED3A0;
  --display:Unbounded,system-ui,sans-serif;--ui:Manrope,system-ui,sans-serif;--mono:JBM,ui-monospace,monospace}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--paper);font:400 17px/1.55 var(--ui);min-height:100vh;
  background:radial-gradient(900px 520px at 78% -120px,rgba(255,90,54,.28),transparent 70%),radial-gradient(700px 400px at -10% 30%,rgba(255,194,61,.08),transparent 70%),var(--bg)}
a{color:var(--sun)}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
header.top{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.brand{display:flex;align-items:center;gap:12px;color:var(--paper);text-decoration:none;font:700 22px var(--display);letter-spacing:.02em}
.brand img{width:38px;height:38px}
nav a{color:var(--paper);text-decoration:none;margin-left:22px;font-weight:700;font-size:15px;opacity:.85}
nav a:hover{opacity:1;color:var(--sun)}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.08;margin:0 0 .5em}
h1{font-size:clamp(36px,6vw,68px);letter-spacing:-.01em}
h1 em{font-style:normal;color:var(--coral)}
h2{font-size:clamp(24px,3.2vw,34px)}
h3{font-size:18px}
.lead{font-size:20px;color:#DCD6CA;max-width:560px}
.muted{color:var(--muted)}
.small{font-size:14px}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:48px 0 64px}
@media (max-width:860px){.hero{grid-template-columns:1fr}}

/* программка вечера: время, точки, номер */
.setlist{background:var(--paper);color:var(--ink);border-radius:6px;padding:26px 26px 18px;transform:rotate(1.2deg);
  box-shadow:0 30px 60px rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.05);position:relative}
.setlist:before{content:'ПРОГРАММА ВЕЧЕРА';display:block;font:700 12px var(--display);letter-spacing:.18em;color:var(--coral);margin-bottom:14px}
.setlist ol{list-style:none;margin:0;padding:0}
.setlist li{display:flex;gap:12px;align-items:baseline;padding:9px 0;border-bottom:1px dashed rgba(22,20,28,.18);font-weight:700}
.setlist li:last-child{border:0}
.setlist time{font:500 14px var(--mono);color:#6B6775;min-width:46px}
.setlist span.d{flex:1;border-bottom:2px dotted rgba(22,20,28,.25);transform:translateY(-4px)}
.setlist small{font:500 12px var(--mono);color:#6B6775}

.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:8px 0 64px}
@media (max-width:860px){.facts{grid-template-columns:1fr}}
.fact{border-top:2px solid var(--coral);padding-top:14px}
.fact b{display:block;font:700 17px var(--display);margin-bottom:6px}
.fact p{margin:0;color:#CFC9BD;font-size:15px}

/* билеты тарифов */
.tickets{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin:24px 0 64px}
.ticket{position:relative;display:grid;grid-template-columns:1fr 92px;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;min-height:170px}
.ticket .main{padding:22px 20px}
.ticket .stub{border-left:2px dashed var(--line);display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;transform:rotate(180deg);
  font:700 13px var(--display);letter-spacing:.2em;color:var(--sun);background:rgba(255,194,61,.05)}
.ticket:before,.ticket:after{content:'';position:absolute;right:83px;width:18px;height:18px;border-radius:50%;background:var(--bg);border:1px solid var(--line)}
.ticket:before{top:-10px}.ticket:after{bottom:-10px}
.ticket .price{font:700 24px var(--display);color:var(--paper);margin:8px 0}
.ticket.hot{border-color:rgba(255,90,54,.55);box-shadow:0 0 0 1px rgba(255,90,54,.25),0 20px 40px rgba(255,90,54,.08)}
.ticket.hot .stub{color:var(--coral);background:rgba(255,90,54,.08)}

/* формы */
.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:28px;max-width:460px;margin:24px auto 64px}
.panel.wide{max-width:none}
label{display:block;font-weight:700;font-size:14px;margin:14px 0 6px}
input[type=email],input[type=tel],input[type=text],input[type=password],input[type=url]{width:100%;padding:13px 14px;border-radius:10px;border:1px solid var(--line);
  background:#0F0E14;color:var(--paper);font:400 16px var(--ui)}
input:focus{outline:2px solid var(--sun);outline-offset:1px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:14px;color:#CFC9BD}
.check input{margin-top:4px;accent-color:var(--coral)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:999px;border:0;cursor:pointer;
  background:var(--coral);color:#fff;font:700 15px var(--ui);text-decoration:none}
.btn:hover{background:#ff7350}
.btn.ghost{background:transparent;color:var(--paper);border:1px solid var(--line)}
.btn.sun{background:var(--sun);color:var(--ink)}
.btn.small{padding:8px 14px;font-size:13px}
form .btn{margin-top:20px}
.err{background:rgba(255,90,54,.12);border:1px solid rgba(255,90,54,.4);padding:10px 14px;border-radius:10px;font-size:15px}
.ok{background:rgba(46,211,160,.1);border:1px solid rgba(46,211,160,.35);padding:10px 14px;border-radius:10px;font-size:15px}

/* кабинет */
.cab{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:16px 0 64px}
@media (max-width:860px){.cab{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}
.access{font:700 26px var(--display);margin:6px 0}
.access.full{color:var(--mint)}.access.demo{color:var(--sun)}
.dl{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px}
.code{font:500 30px var(--mono);letter-spacing:.06em;color:var(--sun);background:#0F0E14;border:1px dashed rgba(255,194,61,.45);padding:10px 16px;border-radius:10px;display:inline-block}
.pay dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:12px 0}
.pay dt{color:var(--muted)}.pay dd{margin:0;font-weight:700}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
td form{display:inline}
td input[type=url]{padding:6px 8px;font-size:13px;width:220px}
.tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700}
.tag.pending{background:rgba(255,194,61,.15);color:var(--sun)}.tag.paid{background:rgba(46,211,160,.15);color:var(--mint)}.tag.cancelled{background:rgba(255,255,255,.08);color:var(--muted)}
footer{border-top:1px solid var(--line);padding:26px 0 40px;color:var(--muted);font-size:14px;margin-top:32px}
.inline{display:inline}
.gap{margin-top:22px}