/* Start:/local/components/festonika/fest.detail/templates/.default/style.css?179131834245663*/
/* Страница фестиваля (шаг 6, docs/step6-contract.md §7). Значения — прототип app.js 755–910 и таблица
   mobile/desktop из docs/step6-research/proto.md §2; точка перелома mobile — max-width: 899.98px
   (docs/step5-contract.md §2). Токены и общие классы (.shell, .btn*, .eyebrow, .more-link) — каркаса,
   здесь они не переопределяются.

   Порядок подключения: стили компонента идут в <head> РАНЬШЕ template_styles.css (группа page перед
   группой template). При равной специфичности победил бы каркас, поэтому там, где свойства пересекаются
   с его правилами (.btn, [id]{scroll-margin-top}), селекторы здесь на ступень специфичнее (.fest …).

   Сетки auto-fit/auto-fill везде с minmax(min(Npx,100%),1fr): на 320px колонка в 300px шире
   содержимого .shell, и страница поехала бы вбок. */

.fest{
    /* основной текст на белых карточках — в каркасе такого токена нет (proto.md §2) */
    --text-body:#3E4763;
    /* высота липкой панели: ссылка 48px + нижняя граница 1px, с запасом */
    --fest-nav-h:50px;
}

/* ---------- B1. Герой и хлебные крошки ---------- */
/* Подтяг под прозрачную шапку делает общее правило каркаса для первого ребёнка .site-main — здесь его нет */
.fest-hero{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:76vh;
    min-height:76svh; /* на телефоне vh считается без адресной строки, svh — с ней */
    overflow:hidden;
    background:var(--night);
    color:var(--white);
}
.fest-hero__img{
    position:absolute;
    top:-9%;
    left:0;
    display:block;
    width:100%;
    max-width:none;
    height:118%; /* запас сверху и снизу под параллакс data-par */
    object-fit:cover;
    object-position:center 32%;
}
.fest-hero__shade{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(10,18,38,.84) 0%,rgba(10,18,38,.34) 40%,rgba(10,18,38,.86) 100%);
}
/* Снизу 76px, а не 44px прототипа: карточка ниже заходит на героя на 46px и не должна накрывать лид */
.fest-hero__inner{
    position:relative;
    flex:1 0 auto;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    width:100%;
    max-width:var(--shell);
    margin:0 auto;
    padding:110px var(--gutter) 76px;
}
/* Без JS шапка непрозрачна и героя не подтягивает — верхний отступ под неё не нужен */
html.no-js .fest-hero__inner{padding-top:48px}
/* Герой тёмный, а .section--night у него нет: синяя рамка фокуса каркаса на тёмном не видна */
.fest-hero :focus-visible{outline-color:var(--gold)}

/* Крошки светлее, чем в прототипе (#9AA6C6): они стоят в самой прозрачной части затемнения (≈40% высоты),
   и на светлом кадре мелкий приглушённый текст не читался. Тень — туда же */
.fest-crumbs{margin:0 0 16px;font-size:13px;color:var(--on-dark-soft);text-shadow:0 1px 8px rgba(10,18,38,.7)}
.fest-crumbs__list{display:flex;flex-wrap:wrap;row-gap:4px;margin:0;padding:0;list-style:none}
.fest-crumbs__sep{margin:0 .5em}
.fest-crumbs a{color:var(--on-dark-soft);text-underline-offset:3px}
.fest-crumbs a:hover{color:var(--white)}
.fest-crumbs [aria-current]{color:var(--white)}

.fest-hero__chips{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
    margin:0 0 16px;
    padding:0;
    list-style:none;
    font-size:13px;
    line-height:1.35;
}
.fest-hero__chip,
.fest-hero__status{border-radius:999px;padding:6px 13px}
.fest-hero__chip{border:1px solid rgba(255,255,255,.3)}
/* цвета статуса приходят в style по XML_ID; здесь — «открыто» на случай, если их нет */
.fest-hero__status{font-weight:600;background:#E6F7EC;color:#0F5C31}
.fest-hero__status--past{background:#F1EFEA;color:var(--text-muted)}

.fest-hero__title{
    max-width:18ch;
    margin:0 0 16px;
    font-family:var(--font-display);
    font-weight:800;
    font-size:clamp(44px,4.8vw,74px);
    line-height:1;
    letter-spacing:-.03em;
    color:var(--white);
    text-wrap:balance;
    overflow-wrap:break-word;
    hyphens:auto;
}
.fest-hero__lead{
    max-width:56ch;
    margin:0;
    font-size:20px;
    color:var(--on-dark-soft);
    text-wrap:pretty;
}

/* ---------- B2. Карточка «цена · факты · кнопки» ---------- */
.fest-key{
    position:relative;
    z-index:5;
    margin-top:-46px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:24px;
    padding:24px 26px;
    background:var(--white);
    border-radius:28px;
    box-shadow:0 20px 50px rgba(10,18,38,.14);
}
/* 0 1 auto, а не 0 0 auto прототипа: «Цена уточняется» 40px шире телефона и должна переноситься */
.fest-key__price{flex:0 1 auto;min-width:0}
.fest-key__price-value{
    margin:0;
    font-family:var(--font-display);
    font-size:40px;
    font-weight:700;
    line-height:1;
    letter-spacing:-.02em;
    overflow-wrap:break-word;
}
.fest-key__price-value--past{font-size:clamp(24px,2.2vw,30px);line-height:1.1}
/* «Цена уточняется» — не сумма: мельче, чтобы на телефоне уместиться в строку */
.fest-key__price-value--none{font-size:clamp(26px,2.4vw,32px);line-height:1.1}
.fest-key__price-note{margin:8px 0 0;max-width:34ch;font-size:13px;color:var(--muted);text-wrap:pretty}

.fest-key__facts{
    flex:1 1 200px;
    min-width:180px;
    display:grid;
    gap:6px;
    align-content:center;
    padding-left:24px;
    border-left:1px solid var(--line);
    font-size:14px;
    color:var(--text-muted);
}
.fest-key__facts p{margin:0}
.fest-key__facts b{font-weight:600;color:var(--ink)}
.fest-key__curator{display:flex;align-items:center;gap:11px;margin-top:6px}
.fest-key__avatar{flex:0 0 auto;display:block;width:40px;height:40px;border-radius:999px;object-fit:cover}

.fest-key__actions{
    flex:2 1 260px; /* вдвое жаднее колонки фактов: на широком экране три кнопки встают в одну строку */
    min-width:0;
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    align-items:center;
    gap:9px;
}
.fest .fest-key__btn{min-height:50px;padding:14px 20px;font-size:15px}
.fest .fest-key__btn--cta{padding:15px 26px}
.fest .fest-key__btn--smeta{background:var(--cream);color:var(--night);border:1.5px solid var(--night)}
.fest .fest-key__btn--smeta:hover{color:var(--blue);border-color:var(--blue)}
.fest .fest-key__btn--doc{flex-wrap:wrap;column-gap:8px;row-gap:0;background:var(--white);color:var(--blue);border:1.5px solid var(--line)}
.fest .fest-key__btn--doc:hover{color:var(--blue-hover);border-color:var(--blue)}
.fest-key__doc-meta{font-size:13px;font-weight:400;color:var(--text-muted)}
.fest-key__note{flex:1 1 100%;margin:0;text-align:right;font-size:13px;color:var(--text-muted);text-wrap:pretty}

.fest-tel,
.fest-nowrap{white-space:nowrap}

/* ---------- B3. Липкая панель якорей ---------- */
/* Одна строка с горизонтальной прокруткой (решение В18): перенос дал бы 2–3 строки липкой панели на телефоне */
.fest-nav{
    position:sticky;
    top:var(--header-h);
    z-index:30; /* ниже шапки (50): открытое бургер-меню её перекрывает */
    margin-top:34px;
    background:rgba(251,248,242,.94);
    border-bottom:1px solid var(--line);
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
}
.fest-nav__list{
    position:relative; /* offsetLeft ссылок — от списка: по нему script.js прокручивает активную ссылку в видимую часть */
    display:flex;
    gap:4px;
    margin:0;
    padding:0;
    list-style:none;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
}
.fest-nav__list::-webkit-scrollbar{display:none}
.fest-nav__item{flex:0 0 auto;scroll-snap-align:start}
.fest-nav__link{
    display:flex;
    align-items:center;
    min-height:48px;
    padding:0 13px;
    font-size:14px;
    font-weight:500;
    color:var(--text-muted);
    text-decoration:none;
    white-space:nowrap;
}
.fest-nav__link:hover{color:var(--blue)}
.fest-nav__link[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--blue)}
/* рамка внутрь: у прокручиваемого списка наружная обрезалась бы сверху и снизу */
.fest .fest-nav__link:focus-visible{outline-offset:-3px;border-radius:8px}

/* ---------- Тело страницы ---------- */
.fest-body{padding:56px 0 40px}
.fest-body__grid{display:grid;gap:64px}
.fest-body__grid > *{min-width:0}
/* Цель якоря — под шапкой и под панелью. Без панели хватает общего правила каркаса [id] (шапка + 12px) */
.fest .fest-nav ~ .fest-body .fest-section,
.fest .fest-nav ~ .fest-body .fest-memo{scroll-margin-top:calc(var(--header-h) + var(--fest-nav-h) + 12px)}

/* h2 секций — размер h3 прототипа (--fs-h3): это стиль, а не уровень заголовка */
.fest-section__title{
    margin:0 0 18px;
    font-family:var(--font-display);
    font-weight:700;
    font-size:var(--fs-h3);
    line-height:1.06;
    letter-spacing:-.02em;
    text-wrap:balance;
    overflow-wrap:break-word;
}
.fest-section__title--about{margin-bottom:16px}
.fest-section__title--tight{margin-bottom:8px}

/* Белая карточка-панель и раскрывающийся блок (памятка, вопросы, «ещё фото») */
.fest-panel{background:var(--white);border-radius:24px;padding:24px}
.fest-details{background:var(--white);border-radius:20px;padding:0 22px}
.fest-details > summary{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    min-height:44px;
    padding:16px 0;
    font-weight:600;
    list-style:none;
    cursor:pointer;
}
.fest-details > summary::-webkit-details-marker{display:none}
.fest-details > summary:focus-visible{outline-offset:2px;border-radius:6px}
.fest-details__plus{flex:0 0 auto;font-size:22px;line-height:1;color:var(--blue);transition:transform .25s var(--ease)}
.fest-details[open] > summary .fest-details__plus{transform:rotate(45deg)}
.fest-details__body{margin:0;padding:0 0 18px;font-size:15px;color:var(--text-body)}
.fest-details__body p{margin:0 0 .6em}
.fest-details__body > :last-child{margin-bottom:0}

/* Список с отметками «✓» / «—» */
.fest-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none;font-size:15px}
.fest-checks li{display:flex;gap:11px}
.fest-checks__mark{flex:0 0 auto;font-weight:700;color:var(--blue)}
.fest-checks--minus{color:var(--text-body)}
.fest-checks--minus .fest-checks__mark{font-weight:400;color:var(--text-body)}
/* «Важно из Положения» (07.10.2026): знак — синим, текст — как у остальных списков */
.fest-checks--terms .fest-checks__mark{font-weight:700;color:var(--blue)}

/* ---------- B4. Кратко о фестивале ---------- */
.fest-about{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));
    gap:36px;
    align-items:start;
}
/* Без левой колонки таблица фактов занимает свою ширину, а не растягивается на весь экран */
.fest-about--solo{grid-template-columns:minmax(0,640px)}
.fest-about__main{min-width:0}
.fest-about__text{margin:0 0 20px;font-size:17px;color:var(--text-body);text-wrap:pretty}
.fest-about__text p{margin:0 0 .8em}
.fest-about__text > :last-child{margin-bottom:0}
.fest-about__label{margin:0 0 9px;font-family:var(--font-body);font-size:13px;font-weight:500;line-height:1.4;color:var(--muted)}
* + .fest-about__label{margin-top:20px}
/* Направления — карточки, не пилюли: уточнения доходят до 300 символов (proto.md §3, B4) */
.fest-directions{
    display:grid;
    /* auto-fit: единственное направление (так у «Фонарей») занимает всю колонку, а не узкую карточку */
    grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
    gap:8px;
    margin:0;
    padding:0;
    list-style:none;
}
.fest-directions__item{padding:12px 16px;border-radius:16px;background:var(--white);font-size:14px}
.fest-directions__name{display:block;font-size:15px;font-weight:600;color:var(--ink)}
.fest-directions__sub{display:block;margin-top:2px;color:var(--text-muted);text-wrap:pretty}
/* Возрастные группы — пилюли со скруглением 14px: «Категория «Профи» (…)» переносится на две строки */
.fest-ages{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;font-size:12px;color:var(--text-body)}
.fest-ages li{padding:5px 11px;border:1px solid var(--line);border-radius:14px}
.fest-about__more{margin:12px 0 0;font-size:13px;color:var(--muted)}

.fest-facts{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-content:start;
    gap:12px 20px;
    margin:0;
    padding:24px;
    border-radius:24px;
    background:var(--white);
    font-size:15px;
}
.fest-facts dt{color:var(--muted)}
.fest-facts dd{margin:0;min-width:0;font-weight:500;overflow-wrap:anywhere}
.fest-facts__sub{display:block;font-size:14px;font-weight:400;color:var(--text-muted)}

/* ---------- B5. Стоимость участия ---------- */
.fest-cost__lead{max-width:66ch;margin:0 0 26px;color:var(--text-muted);text-wrap:pretty}
.fest-cost__lead b{font-weight:600;color:var(--ink)}
.fest-cost{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));
    gap:22px;
    align-items:start;
}
.fest-cost--solo{grid-template-columns:minmax(0,760px)}
.fest-cost__col{display:grid;gap:20px;min-width:0}
.fest-panel__title{margin:0 0 12px;font-family:var(--font-body);font-size:17px;font-weight:600;line-height:1.35}
.fest-checks + .fest-panel__title{margin-top:20px}

.fest-doc{display:flex;flex-wrap:wrap;align-items:center;gap:18px;padding:22px}
.fest-doc__icon{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:50px;
    height:62px;
    border-radius:9px;
    background:var(--blue);
    color:var(--white);
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
}
.fest-doc__text{flex:1 1 180px;min-width:0}
.fest-doc__title{margin:0;font-family:var(--font-body);font-size:16px;font-weight:600;line-height:1.35}
.fest-doc__meta{margin:2px 0 0;font-size:14px;color:var(--muted)}
.fest .fest-doc__btn{padding:12px 20px;background:var(--cream)}

/* «Из чего складывается сумма»: тёмная карточка шага 6, пока калькулятора нет (у фестиваля нет шкалы оргвзноса);
   при калькуляторе — светлая карточка под ним (.fest-price--light, ниже) */
.fest-price{
    display:grid;
    gap:15px;
    min-width:0;
    padding:26px;
    border-radius:28px;
    background:var(--night);
    color:var(--white);
}
.fest-price :focus-visible{outline-color:var(--gold)}
.fest-price__title{margin:0;font-family:var(--font-display);font-size:19px;font-weight:600;line-height:1.25}
.fest-price__list{margin:0}
.fest-price__row{padding:12px 0;border-bottom:1px solid var(--night-line-2)}
.fest-price__row:first-child{padding-top:2px}
.fest-price__row:last-child{border-bottom:0}
.fest-price__row dt{font-size:14px;color:var(--on-dark-muted)}
.fest-price__row dd{margin:4px 0 0;font-size:15px;text-wrap:pretty}
.fest-price__sum{font-family:var(--font-display);font-size:19px;font-weight:600;white-space:nowrap}
.fest-price__amount{font-weight:600;white-space:nowrap}
.fest-price__hint,
.fest-price__text{margin:0 0 6px;font-size:14px;color:var(--on-dark-soft)}
.fest-price__note{margin:6px 0 0;font-size:13px;color:var(--on-dark-muted);text-wrap:pretty}
.fest-price__actions{display:flex;flex-wrap:wrap;gap:10px}
.fest-price__actions .btn{flex:1 1 auto}
.fest-checks--dark{font-size:14px}
.fest-checks--dark .fest-checks__mark{color:var(--gold)}

/* Таблица оргвзносов. Обёртка с прокруткой — страховка: на 320px три столбца помещаются впритык,
   а горизонтальной прокрутки у страницы быть не должно */
.fest-fees-wrap{overflow-x:auto}
.fest-fees{width:100%;border-collapse:collapse;font-size:14px;line-height:1.35}
.fest-fees th,
.fest-fees td{padding:8px 10px;border-bottom:1px solid var(--night-line-2);text-align:left;vertical-align:top}
.fest-fees tr > :first-child{padding-left:0}
.fest-fees tr > :last-child{padding-right:0}
.fest-fees thead th{font-size:12px;font-weight:500;color:var(--on-dark-muted)}
.fest-fees thead th + th,
.fest-fees td{text-align:right}
.fest-fees td{font-weight:600;white-space:nowrap}
.fest-fees tbody th{font-weight:600;overflow-wrap:anywhere}
.fest-fees tbody tr:last-child > *{border-bottom:0}
.fest-fees__sub{display:block;font-size:12px;font-weight:400;color:var(--on-dark-muted)}

/* Прайс под калькулятором (шаг 7): светлая карточка во всю ширину секции. На широком экране строки
   текут в две колонки — иначе высокая таблица оргвзносов растянула бы карточку в длинную ленту */
.fest-price--light{
    margin-top:22px;
    background:var(--white);
    color:var(--ink);
    border-radius:24px;
}
.fest-cost--solo + .fest-price--light{max-width:760px}
.fest-price--light :focus-visible{outline-color:var(--blue)}
.fest-price--light .fest-price__row{border-bottom-color:var(--line);break-inside:avoid}
.fest-price--light .fest-price__row dt{color:var(--muted)}
.fest-price--light .fest-price__hint,
.fest-price--light .fest-price__text{color:var(--text-muted)}
.fest-price--light .fest-price__note{color:var(--muted)}
.fest-price--light .fest-checks--dark .fest-checks__mark{color:var(--blue)}
.fest-price--light .fest-fees th,
.fest-price--light .fest-fees td{border-bottom-color:var(--line)}
.fest-price--light .fest-fees thead th,
.fest-price--light .fest-fees__sub{color:var(--muted)}
@media (min-width:900px){
    /* 340px — самая узкая колонка, где таблица с двумя шкалами («Танцуй со мной») ещё не прокручивается */
    .fest-price--light .fest-price__list{columns:340px 2;column-gap:44px}
    .fest-price--light .fest-price__row:first-child{padding-top:12px}
    .fest-price--light .fest-price__list{margin-top:-12px}
}

/* ---------- B5, шаг 7. Калькулятор «Смета на ваш состав» ---------- */
/* Тёмная карточка прототипа (app.js 840–859) с исправлениями proto.md §7 №12–14: форматы — радиогруппа,
   степперы подписаны, медали — настоящая галочка. Без JS это обычная форма: числа — <input type="number">
   со стрелками браузера, расшифровки нет (её покажет печатная смета) */
.fest-calc{
    display:grid;
    gap:15px;
    min-width:0;
    padding:26px;
    border-radius:28px;
    background:var(--night);
    color:var(--white);
}
.fest-calc :focus-visible{outline-color:var(--gold)}
.fest-calc fieldset{min-width:0;margin:0;padding:0;border:0}
.fest-calc__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.fest-calc__title{margin:0;font-family:var(--font-display);font-size:19px;font-weight:600;line-height:1.25}
.fest-calc__intro{margin:-4px 0 0;font-size:13px;color:var(--on-dark-muted);text-wrap:pretty}
.fest-calc__fields{display:grid;gap:9px}

/* Радиокнопка-«пилюля»: сам input прозрачный поверх подписи — клик, клавиатура и диктор работают как у обычной
   радиокнопки, видно только лицо (.fest-calc__opt-face) */
.fest-calc__opt{position:relative;display:flex;min-width:0;cursor:pointer}
.fest-calc__opt > input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.fest-calc__opt-face{display:block;min-width:0;color:var(--white);transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.fest-calc__opt > input:focus-visible + .fest-calc__opt-face{outline:3px solid var(--gold);outline-offset:2px}
.fest-calc__opt > input:checked + .fest-calc__opt-face{background:var(--gold);color:var(--night);border-color:var(--gold)}

/* Формат участия: переключатель в строку заголовка; три формата на телефоне переносятся */
.fest-calc .fest-calc__formats{display:flex;flex-wrap:wrap;gap:2px;padding:3px;border-radius:22px;background:var(--night-2)}
.fest-calc__format .fest-calc__opt-face{display:flex;align-items:center;min-height:36px;padding:8px 13px;border-radius:999px;font-size:12px;font-weight:600;line-height:1.2}
.fest-calc__format > input:not(:checked) + .fest-calc__opt-face:hover{color:var(--gold)}

/* Строки состава */
.fest-calc__row{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:center;
    gap:10px 12px;
    padding:11px 15px;
    border-radius:18px;
    background:var(--night-2);
}
/* 140px: в карточке шириной 403px (экран 900px, две колонки) подпись и степпер (160px) встают в одну строку,
   как в прототипе; уже — степпер уходит под подпись, а не сжимает её до слова в строке */
.fest-calc__text{flex:1 1 140px;min-width:0}
.fest-calc__label{display:block;font-size:15px;font-weight:600;line-height:1.35}
.fest-calc__hint{display:block;font-size:12px;line-height:1.4;color:var(--on-dark-muted);text-wrap:pretty}

.fest-calc__stepper{flex:0 0 auto;display:flex;align-items:center;gap:4px;margin-left:auto}
.fest-calc__step{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    padding:0;
    border:0;
    border-radius:999px;
    background:var(--night-line-2);
    color:var(--white);
    font-size:20px;
    line-height:1;
    cursor:pointer;
    transition:background-color .2s ease,opacity .2s ease;
}
.fest-calc__step:hover{background:var(--night-border-2)}
.fest-calc__step--more{background:var(--gold);color:var(--night)}
.fest-calc__step--more:hover{background:var(--gold-hover)}
.fest-calc__step[aria-disabled="true"]{opacity:.35;cursor:default}
.fest-calc__step--more[aria-disabled="true"]:hover{background:var(--gold)}
.fest-calc__step:not(.fest-calc__step--more)[aria-disabled="true"]:hover{background:var(--night-line-2)}
/* С JS место под кнопки занято сразу (они скрыты до запуска calc.js) — строка не прыгает, когда они появятся */
html.js .fest-calc__step[hidden]{display:flex!important;visibility:hidden}

.fest-calc__num{
    width:76px;
    height:44px;
    margin:0;
    padding:0 6px;
    border:1.5px solid var(--night-border-2);
    border-radius:12px;
    background:var(--night);
    color:var(--white);
    font-family:var(--font-display);
    font-size:19px;
    font-weight:600;
    text-align:center;
}
.fest-calc__num:invalid{border-color:#FF9B9B}
/* Стрелки браузера нужны только без JS: с calc.js есть свои «−/+» */
.fest-calc--live .fest-calc__num{width:64px;-moz-appearance:textfield;appearance:textfield}
.fest-calc--live .fest-calc__num::-webkit-inner-spin-button,
.fest-calc--live .fest-calc__num::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}

/* Форма выступления — блок на каждую номинацию (calc.js добавляет блоки под первым). legend плавающий: иначе браузер
   рисует его на рамке fieldset поверх отступа */
.fest-calc__noms{display:grid;gap:9px}
.fest-calc .fest-calc__forms{display:block;padding:13px 15px}
.fest-calc__forms > legend{float:left;width:100%;padding:0}
.fest-calc__forms > .fest-calc__hint{clear:both;margin-bottom:10px}
/* У блоков второй и следующих номинаций подсказки нет — плавающий legend обтекает уже сетка форм */
.fest-calc__forms > .fest-calc__opts{clear:both}
.fest-calc__forms > legend + .fest-calc__opts{padding-top:10px}
/* Сетка, а не свободный перенос: на телефоне пилюли разной ширины ложились лесенкой по одной в строку.
   150px: подпись «от 7 человек · 10 000 ₽» помещается в одну строку — на 1440px три колонки, на 900px две */
.fest-calc__opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:6px}
.fest-calc__form .fest-calc__opt-face{
    flex:1 1 auto;
    padding:8px 12px;
    border:1px solid var(--night-border-2);
    border-radius:14px;
    background:var(--night);
    font-size:13px;
    font-weight:600;
    line-height:1.3;
    text-align:left;
}
.fest-calc__form > input:not(:checked) + .fest-calc__opt-face:hover{border-color:var(--gold)}
.fest-calc__form-title{display:block}
.fest-calc__form-sub{display:block;font-size:11px;font-weight:500;color:var(--on-dark-muted)}
/* подпись выбранной формы на золоте — тёмно-оливковая прототипа (#4A3C00, контраст 8,9:1) */
.fest-calc__form > input:checked + .fest-calc__opt-face .fest-calc__form-sub{color:#4A3C00}

/* Медали: настоящая галочка, квадрат прототипа 24×24 с золотой рамкой — её лицо */
.fest-calc .fest-calc__check{position:relative;display:block}
/* прозрачный input лежит над квадратом (z-index): клик по квадрату попадает в саму галочку, по тексту — через label */
.fest-calc__check-input{position:absolute;z-index:1;left:15px;top:13px;width:24px;height:24px;margin:0;opacity:0;cursor:pointer}
.fest-calc__check-label{display:flex;align-items:center;gap:12px;min-height:28px;cursor:pointer}
.fest-calc__box{
    position:relative;
    flex:0 0 auto;
    width:24px;
    height:24px;
    border:1.5px solid var(--gold);
    border-radius:8px;
    transition:background-color .2s ease;
}
.fest-calc__check-input:checked + .fest-calc__check-label .fest-calc__box{background:var(--gold)}
.fest-calc__check-input:checked + .fest-calc__check-label .fest-calc__box::after{
    content:"";
    position:absolute;
    left:7px;
    top:3px;
    width:6px;
    height:11px;
    border:solid var(--night);
    border-width:0 2.5px 2.5px 0;
    transform:rotate(45deg);
}
.fest-calc__check-input:focus-visible + .fest-calc__check-label .fest-calc__box{outline:3px solid var(--gold);outline-offset:2px}
.fest-calc__check-hint{margin-top:2px;padding-left:36px}

/* Расшифровка (пишет calc.js). <output> — строчный элемент, внутри только span: строки — flex */
.fest-calc__out{display:grid;font-size:15px}
.fest-calc__line{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:baseline;
    gap:2px 12px;
    padding:10px 0;
    border-bottom:1px solid var(--night-line-2);
}
.fest-calc__line-text{flex:1 1 180px;min-width:0}
.fest-calc__line-label{display:block;color:var(--on-dark-soft)}
.fest-calc__line-note{display:block;font-size:13px;color:var(--on-dark-muted)}
.fest-calc__line-sum{flex:0 0 auto;margin-left:auto;font-weight:700;white-space:nowrap}
.fest-calc__line--total{padding:16px 0 4px;border-bottom:0}
.fest-calc__line--total .fest-calc__line-label{font-weight:600;color:var(--white)}
.fest-calc__line--total .fest-calc__line-sum{
    font-family:var(--font-display);
    font-size:28px;
    font-weight:600;
    line-height:1.15;
    color:var(--gold);
}
.fest-calc__line--minor{padding:4px 0 0;border-bottom:0;font-size:14px}
.fest-calc__line--minor .fest-calc__line-label{color:var(--on-dark-muted)}
/* Итог изменился — короткая подсветка (calc.js не ставит её при «уменьшить движение») */
.fest-calc__line-sum.is-changed{animation:fest-calc-bump .45s var(--ease)}
@keyframes fest-calc-bump{0%{transform:scale(1)}35%{transform:scale(1.06)}100%{transform:scale(1)}}
.fest-calc__line--total .fest-calc__line-sum{transform-origin:right center}

.fest-calc__actions{display:grid;gap:10px}
.fest .fest-calc__btn{width:100%}
.fest-calc__note{margin:0;font-size:13px;color:var(--on-dark-muted);text-wrap:pretty}

/* Режим высокой контрастности: заливки пропадают, выбранный вариант видно по рамке */
@media (forced-colors:active){
    .fest-calc__opt > input:checked + .fest-calc__opt-face{outline:3px solid CanvasText;outline-offset:-3px}
    .fest-calc__check-input:checked + .fest-calc__check-label .fest-calc__box{background:CanvasText}
}

/* ---------- B6. Жюри ---------- */
/* auto-fill, а не auto-fit прототипа: один член жюри не растягивается в портрет на всю ширину */
.fest-jury{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr));
    gap:16px;
    margin:0;
    padding:0;
    list-style:none;
}
.fest-jury__card{margin:0}
.fest-jury__photo{
    display:flex;
    align-items:center;
    justify-content:center;
    aspect-ratio:4/5;
    overflow:hidden;
    border-radius:24px;
    background:#E8ECF7;
}
/* кадр 4:5 ядро режет по центру; сдвиг вверх — чтобы не резать головы (ТЗ §18) */
.fest-jury__img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 20%;
    transition:transform .7s var(--ease);
}
.fest-jury__card:hover .fest-jury__img{transform:scale(1.06)}
.fest-jury__initials{font-family:var(--font-display);font-size:clamp(30px,3vw,44px);font-weight:700;color:var(--night-border-2)}
.fest-jury__caption{margin-top:12px}
.fest-jury__name{display:block;font-weight:600}
.fest-jury__role{display:block;font-size:14px;color:var(--muted)}
.fest-jury__bio{margin-top:6px;font-size:14px}
/* 44px — порог цели касания, как у остальных summary страницы (proto.md §8) */
.fest-jury__bio > summary{display:inline-flex;min-height:44px;align-items:center;color:var(--blue);font-weight:600;list-style:none;cursor:pointer}
.fest-jury__bio > summary::-webkit-details-marker{display:none}
.fest-jury__bio-text{margin-top:6px;color:var(--text-body)}
.fest-jury__bio-text p{margin:0 0 .6em}

/* ---------- B7. Площадка и сцена ---------- */
.fest-venue{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));
    gap:24px;
    align-items:start;
}
.fest-venue--solo{grid-template-columns:minmax(0,760px)}
.fest-venue__gallery{min-width:0}
.fest-venue__photos{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;list-style:none}
.fest-venue__photo{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:4/3;
    border-radius:18px;
    object-fit:cover;
    object-position:center 32%;
}
.fest-venue__more{margin-top:12px}
.fest-venue__info{display:grid;gap:11px;align-content:start;min-width:0;font-size:16px}
.fest-venue__name{margin:0;font-size:19px;font-weight:600;overflow-wrap:anywhere}
.fest-venue__facts{display:grid;gap:11px;margin:0;padding:0;list-style:none}
.fest-venue__map{margin:0}

/* ---------- B8. Программа по дням и памятка ---------- */
.fest-program{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.fest-program__row{
    display:flex;
    flex-wrap:wrap;
    gap:6px 22px;
    padding:18px 22px;
    border-radius:20px;
    background:var(--white);
}
.fest-program__when{flex:0 0 160px}
.fest-program__day{display:block;font-family:var(--font-display);font-size:16px;font-weight:600;line-height:1.3}
/* подпись типа дня — синяя у всех типов, как в прототипе (app.js 879) */
.fest-program__type{display:block;font-size:12px;font-weight:600;text-transform:lowercase;color:var(--blue)}
.fest-program__text{flex:1 1 260px;min-width:0;margin:0;color:var(--text-body)}
.fest-memo{margin-top:14px}
.fest-memo__list{display:grid;gap:9px;list-style:none}
.fest-memo__list b{font-weight:600;color:var(--ink)}
.fest-section > .fest-memo:first-child,
.fest-section > h2 + .fest-memo{margin-top:0}

/* ---------- B9. Как это было ---------- */
/* Явные колонки, а не span 2 в auto-fit прототипа: там на узком экране появлялась вторая неявная
   колонка и горизонтальная прокрутка (proto.md §7, п. 15) */
.fest-past{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.fest-past__main{
    position:relative;
    display:block;
    aspect-ratio:16/9;
    overflow:hidden;
    border-radius:26px;
    background:var(--night-2);
    color:var(--white);
    text-decoration:none;
}
.fest-past__img{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 32%;
}
.fest-past__video::after{content:"";position:absolute;inset:0;background:rgba(10,18,38,.32)}
.fest-past__play{
    position:absolute;
    left:50%;
    top:50%;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:78px;
    height:78px;
    margin:-39px 0 0 -39px;
    border-radius:999px;
    background:var(--gold);
    color:var(--night);
    font-size:26px;
    transition:transform .3s var(--ease);
}
.fest-past__video:hover .fest-past__play{transform:scale(1.08)}
.fest-past__label{
    position:absolute;
    left:14px;
    bottom:14px;
    z-index:1;
    padding:6px 12px;
    border-radius:999px;
    background:rgba(10,18,38,.86);
    color:var(--white);
    font-size:12px;
}
.fest-past__video:focus-visible{outline-offset:4px}
.fest-past__side{display:grid;gap:14px;align-content:start;min-width:0}
.fest-past__thumb{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:22px;object-fit:cover}
.fest-past__more{
    display:flex;
    align-items:center;
    justify-content:center;
    aspect-ratio:16/9;
    border-radius:22px;
    background:var(--white);
    color:var(--blue);
    font-weight:600;
    text-decoration:none;
}
.fest-past__more:hover{color:var(--blue-hover)}
.fest-past__gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));
    gap:12px;
    margin:14px 0 0;
    padding:0;
    list-style:none;
}
.fest-details__body.fest-past__gallery{margin-top:0}
.fest-past__photo{display:block;width:100%;height:auto;aspect-ratio:4/3;border-radius:18px;object-fit:cover}
.fest-past__all{margin-top:12px}
.fest-past__line{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;margin:14px 0 0}
.fest-past__stats{font-weight:500;color:var(--text-muted)}

.fest-review{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px;
    margin-top:14px;
    padding:24px;
    border-radius:24px;
    background:var(--white);
}
.fest-review__avatar{flex:0 0 auto;display:block;width:60px;height:60px;border-radius:999px;object-fit:cover}
.fest-review__body{flex:1 1 280px;min-width:0;margin:0}
.fest-review__quote{margin:0 0 8px}
.fest-review__quote p{margin:0;font-family:var(--font-display);font-size:18px;font-weight:400;line-height:1.4;text-wrap:pretty}
.fest-review__meta{font-size:14px;color:var(--muted)}

.fest-materials{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));
    gap:12px;
    margin:14px 0 0;
    padding:0;
    list-style:none;
}
/* Карточка материала; ссылкой она становится, только когда у материала есть адрес (.fest-materials__link) */
.fest-materials__card{
    display:block;
    height:100%;
    padding:18px 20px;
    border-radius:20px;
    background:var(--white);
    color:var(--ink);
}
.fest-materials__link{text-decoration:none;transition:box-shadow .3s ease}
.fest-materials__link:hover{color:var(--ink);box-shadow:var(--shadow-card-hover)}
.fest-materials__tag{display:block;margin-bottom:4px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.fest-materials__title{display:block;font-weight:600}

/* ---------- B10. Частые вопросы ---------- */
.fest-faq{display:grid;gap:9px;max-width:860px}

/* ---------- B11. Финальный призыв ---------- */
.fest-final{position:relative;overflow:hidden;background:var(--night);color:var(--white)}
.fest-final__bg{position:absolute;inset:0}
.fest-final__img{
    position:absolute;
    top:-9%;
    left:0;
    display:block;
    width:100%;
    max-width:none;
    height:118%;
    object-fit:cover;
    object-position:center 32%;
}
.fest-final__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,38,.74),rgba(10,18,38,.9))}
.fest-final__inner{position:relative;max-width:var(--shell);margin:0 auto;padding:76px var(--gutter);text-align:center}
.fest-final :focus-visible{outline-color:var(--gold)}
.fest-final__title{
    max-width:20ch;
    margin:0 auto 16px;
    font-family:var(--font-display);
    font-weight:800;
    font-size:clamp(40px,4.8vw,88px);
    line-height:1;
    letter-spacing:-.03em;
    color:var(--white);
    text-wrap:balance;
    overflow-wrap:break-word;
    hyphens:auto;
}
/* В архиве заголовок — название и даты следующего выпуска или город: длинный, поэтому мельче (размер h2) */
.fest-final[data-mode="next"] .fest-final__title,
.fest-final[data-mode="nearby"] .fest-final__title,
.fest-final[data-mode="season"] .fest-final__title{font-size:var(--fs-h2);line-height:1.04}
.fest-final__text{max-width:52ch;margin:0 auto 28px;font-size:17px;color:var(--on-dark-soft);text-wrap:pretty}
.fest-final__text + .fest-final__text{margin-top:-16px}
.fest-final__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.fest-final__list{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px;
    max-width:960px;
    margin:0 auto 28px;
    padding:0;
    list-style:none;
    text-align:left;
}
.fest-final__item{flex:0 1 290px;min-width:0}
.fest-final__card{
    display:block;
    height:100%;
    padding:18px 20px;
    border:1px solid var(--night-border-2);
    border-radius:20px;
    background:var(--night-2);
    color:var(--white);
    text-decoration:none;
    transition:border-color .2s ease;
}
.fest-final__card:hover{color:var(--white);border-color:var(--gold)}
.fest-final__card-name{display:block;font-family:var(--font-display);font-size:18px;font-weight:600;line-height:1.2;overflow-wrap:break-word}
.fest-final__card-meta{display:block;margin-top:6px;font-size:14px;color:var(--on-dark-muted)}

/* ---------- ≥900px: двухколоночная раскладка «Как было» ---------- */
@media (min-width:900px){
    .fest-past--split{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
    /* Правый столбец ровно по высоте большой плитки: кадр и «+N фото» делят её пополам.
       contain:size — чтобы высоту ряда задавала только большая плитка 16:9, а не картинки справа;
       столбец затем растягивается на ряд (align-self по умолчанию stretch) */
    .fest-past--split .fest-past__side{contain:size;grid-auto-rows:minmax(0,1fr);align-content:stretch}
    .fest-past--split .fest-past__thumb,
    .fest-past--split .fest-past__more{height:100%;min-height:0;aspect-ratio:auto}
}

/* ---------- mobile: до 899px ---------- */
@media (max-width:899.98px){
    .fest-hero{min-height:74vh;min-height:74svh}
    .fest-hero__inner{padding-top:90px;padding-bottom:72px}
    .fest-hero__title{font-size:36px}
    .fest-hero__lead{font-size:17px}

    .fest-key__price-value--none{font-size:24px}
    /* колонки встают друг под друга: разделитель слева не нужен */
    .fest-key__facts{flex-basis:100%;min-width:0;padding-left:0;border-left:0}
    .fest-key__actions{flex-basis:100%;justify-content:flex-start}
    .fest .fest-key__btn{flex:1 1 auto}
    .fest .fest-key__btn--cta{flex-basis:100%}
    .fest-key__note{text-align:left}

    /* мягкое затухание у правого края намекает, что панель прокручивается */
    .fest-nav__list{
        -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
        mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
    }
    /* хвост после последней ссылки: докрученная до конца панель не прячет её в затухание */
    .fest-nav__list::after{content:"";flex:0 0 16px}

    .fest-body__grid{gap:48px}

    .fest-fees th,
    .fest-fees td{padding:8px 6px}

    /* На телефоне калькулятор — первым в секции: иначе до него листать «входит / не входит» и карточку Положения,
       а кнопка «Смета ↓» из карточки фестиваля приводит к спискам. Порядок в разметке (и для чтения без CSS) прежний */
    .fest-cost > .fest-calc{order:-1}
    /* Калькулятор на телефоне: у карточки и строк поля уже — на 360px строке состава остаётся место под степпер */
    .fest-calc{padding:22px 16px}
    .fest-calc__row{padding:11px 12px}
    .fest-calc .fest-calc__forms{padding:12px}
    .fest-calc__check-input{left:12px}
    .fest-calc__line--total .fest-calc__line-sum{font-size:24px}
    .fest-price--light{padding:22px 18px}

    /* 150px, а не 180px прототипа: на телефоне 360px (колонка .shell 320px) жюри встаёт в два столбца,
       а не в один с портретом 320×400 на каждого */
    .fest-jury{grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr))}

    /* «+N фото» на телефоне — строка-ссылка, а не пустая белая плитка 16:9 во всю ширину */
    .fest-past__more{aspect-ratio:auto;min-height:56px;padding:14px 18px}

    .fest-final__title{font-size:34px}
    .fest-final[data-mode="next"] .fest-final__title,
    .fest-final[data-mode="nearby"] .fest-final__title,
    .fest-final[data-mode="season"] .fest-final__title{font-size:var(--fs-h2)}
}

/* ---------- уже 360px ---------- */
/* Цена 40px прототипа на 320px не помещается: место под неё 228px, а «30 000 ₽» — 229px, и сумма рвалась бы
   на две строки. При 36px самая широкая пятизначная сумма — около 209px; с 360px — снова 40px.
   Только сумма: у «Цена уточняется» и плашки архива свои размеры */
@media (max-width:359.98px){
    .fest-key__price-value:not(.fest-key__price-value--none):not(.fest-key__price-value--past){font-size:36px}
}

/* «Стоимость» до выхода Положения (07.10.2026): текст и одна кнопка */
.fest-pending{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;max-width:860px}
.fest-pending__text{flex:1 1 320px;margin:0;font-size:16px;line-height:1.55;color:var(--ink);text-wrap:pretty}


/* End */
/* /local/components/festonika/fest.detail/templates/.default/style.css?179131834245663 */