/* AVATAR site: the shared style of the new sections (DECISIONS ИН66, ИН70). In Tilda it lives in «Настройки сайта →
   Вставка кода → Пользовательские CSS-стили»; this file is the source. Every rule sits under .av, so the old pages,
   which have no such class, stay as they are. Palette Б (dark), type 1: headings Unbounded, text Onest — both
   from Google Fonts, linked by each new page's first block. */
.av {
  --av-bg: #0A0C2B; --av-card: #161A45; --av-line: #2A2F66; --av-ink: #FFFFFF; --av-soft: #D5D9F5; --av-mute: #AAB0E0;
  --av-sky: #3AB7FF; --av-raise: #1C2152;
  --av-grad: linear-gradient(60deg, #9E00FF 0%, #AD00FF 34%, #FF00E5 59%, #FF7A00 79%);   /* the site's «Забронировать» */
  --av-head: Unbounded, "Trebuchet MS", sans-serif;
  --av-text: Onest, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: var(--av-bg); color: var(--av-ink); font: 400 18px/1.5 var(--av-text);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: left;
}
.av *, .av *::before, .av *::after { box-sizing: border-box; }
/* the resets weigh nothing (:where), so every class below wins over them */
.av :where(h1, h2, h3, p, ul, li, figure) { margin: 0; padding: 0; font-weight: inherit; }
.av :where(ul) { list-style: none; }
.av :where(a) { color: inherit; text-decoration: none; }
.av :where(img, video, iframe, svg) { display: block; max-width: 100%; }
.av :where(img) { height: auto; }
.av :where(picture) { display: contents; }   /* a phone's own, smaller copy of a photo (ИН77): the img lays out as before */
.av :where(button) { margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.av[hidden], .av [hidden] { display: none !important; }

/* a section: the same rhythm everywhere; an anchor stops below the fixed header */
.av-section { padding: 96px 0; scroll-margin-top: 72px; }
.av-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.av-h2 { font: 700 48px/1.05 var(--av-head); text-transform: uppercase; }
.av-lead { margin-top: 14px; max-width: 720px; color: var(--av-mute); font-size: 18px; }
.av-h3 { margin: 48px 0 18px; font: 700 20px/1.2 var(--av-head); text-transform: uppercase; }
.av-h3 small { display: block; margin-top: 6px; font: 400 16px/1.4 var(--av-text); text-transform: none; color: var(--av-mute); }
.av-h3 + .av-lead { margin: -4px 0 22px; color: var(--av-soft); }

/* cards */
.av-grid { display: grid; gap: 20px; }
.av-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.av-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.av-card { display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--av-line); border-radius: 20px; background: var(--av-card); }
.av-card-t { font: 700 22px/1.15 var(--av-head); text-transform: uppercase; }
.av-card-s { margin-top: 6px; color: var(--av-mute); font-size: 16px; }

/* a price card: one row per day type, the price on the right */
.av-rows { margin: 20px 0 22px; }
.av-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 0; border-top: 1px solid var(--av-line); }
.av-row:last-child { border-bottom: 1px solid var(--av-line); }
.av-row span { color: var(--av-mute); font-size: 16px; }
.av-row b { font: 700 24px/1 var(--av-head); white-space: nowrap; }
.av-list { margin-bottom: 24px; }
.av-list li { position: relative; padding-left: 20px; color: var(--av-soft); font-size: 16px; line-height: 1.45; }
.av-list li + li { margin-top: 8px; }
.av-list li::before { content: ""; position: absolute; left: 2px; top: .5em; width: 8px; height: 8px; border-radius: 50%; background: var(--av-grad); }

/* the one button style */
.av-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 28px; border-radius: 999px;
          background: var(--av-grad); color: #fff; font: 600 15px/1 var(--av-text); letter-spacing: .04em; text-transform: uppercase;
          transition: transform .15s, box-shadow .15s, background-color .15s; }
.av-card .av-btn { margin-top: auto; align-self: flex-start; }
.av-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 26px -12px rgba(255, 0, 229, .7); }
.av-btn:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; }
/* the second button beside it: an outline; the quiet one: a dim pill */
.av-btn-line { background: transparent; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .85); }
.av-btn-line:hover { background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 2px #fff; }
.av-btn-ghost { background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px var(--av-line); letter-spacing: 0; text-transform: none; }
.av-btn-ghost:hover { background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px #4A50A0; }
.av-link { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 600; font-size: 16px;
           border-bottom: 1px solid rgba(255, 255, 255, .35); padding-bottom: 2px; transition: border-color .15s; }
.av-link:hover { border-bottom-color: #fff; }
.av-link:focus-visible, .av-nav a:focus-visible, .av-foot a:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; border-radius: 4px; }

/* the small print under a group of cards */
/* a tariff card (ИН75): what the price pays for, then the price, then the button; the price stands at the card's foot, so
   the prices of one row are on one line */
.av-tcard .av-list { margin: 14px 0 0; }
.av-price { margin-top: auto; padding-top: 22px; }
.av-price-cap { margin-bottom: 8px; color: var(--av-mute); font-size: 14px; }
.av-price .av-rows { margin: 0 0 22px; }
.av-tcard .av-btn { margin-top: 0; }
.av-notes { margin-top: 28px; display: grid; gap: 10px; }
.av-notes li { position: relative; padding-left: 20px; color: var(--av-mute); font-size: 16px; line-height: 1.45; }
.av-notes li::before { content: ""; position: absolute; left: 3px; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--av-mute); }

/* labels on a game: age, players */
.av-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.av-tags span { padding: 5px 11px; border: 1px solid rgba(173, 0, 255, .45); border-radius: 999px; background: rgba(158, 0, 255, .16);
                color: #fff; font-size: 14px; line-height: 1.3; white-space: nowrap; }

/* three price cards in a row need 1 200 px: narrower, they go one under another; on a tablet each lies across — the name
   and the button on the left, the prices on the right; on a phone each card is as the others */
@media (max-width: 1199px) {
  .av-grid-3 { grid-template-columns: 1fr; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .av-grid-3 .av-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 28px; align-items: start; }
  .av-grid-3 .av-card .av-price { grid-column: 2; grid-row: 1 / span 3; margin: 0; padding: 0; }
  .av-grid-3 .av-card .av-price .av-rows { margin: 0; }
  .av-grid-3 .av-card .av-btn { grid-column: 1; justify-self: start; margin-top: 20px; }
}
@media (max-width: 767px) {
  .av-section { padding: 64px 0; scroll-margin-top: 60px; }
  .av-wrap { padding: 0 16px; }
  .av-h2 { font-size: min(32px, calc((100vw - 32px) / 12.6)); }   /* «ДОПОЛНИТЕЛЬНО», the longest word, is 12.1 em wide */
  .av-lead { font-size: 16px; }
  .av-h3 { margin-top: 36px; font-size: 18px; }
  .av-grid-2 { grid-template-columns: 1fr; }
  .av-card { padding: 22px; }
  .av-card .av-btn { align-self: stretch; }
  .av-row b { font-size: 22px; }
}
/* the narrowest phones: the price goes under its days */
@media (max-width: 374px) {
  .av-row { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* ---------- the header: fixed over the page, its block keeps the place ---------- */
.av-head-space { height: 72px; }
.av-head { position: fixed; top: 0; left: 0; right: 0; z-index: 990; background: rgba(10, 12, 43, .9);
           -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.av-head.is-scrolled, .av-head.is-open { border-bottom-color: var(--av-line); }
.av-head-in { display: flex; align-items: center; gap: 28px; height: 72px; }
.av-logo { font: 700 18px/1 var(--av-head); letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.av-nav { display: flex; gap: 22px; margin-right: auto; }
.av-nav a { color: var(--av-soft); font-size: 15px; font-weight: 600; white-space: nowrap; transition: color .15s; }
.av-nav a:hover { color: #fff; }
.av-head-tel { font-size: 15px; font-weight: 600; white-space: nowrap; }
.av-social { display: flex; gap: 10px; }
.av-social a { display: block; width: 34px; height: 34px; color: var(--av-soft); transition: color .15s, transform .15s; }
.av-social a:hover { color: #fff; transform: translateY(-1px); }
.av-social a:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; border-radius: 50%; }
.av-social svg { width: 100%; height: 100%; }
.av-head .av-btn { min-height: 44px; padding: 0 22px; font-size: 14px; }
.av-burger { display: none; position: relative; width: 44px; height: 44px; margin-right: -10px; }
.av-burger span, .av-burger span::before, .av-burger span::after { position: absolute; left: 11px; width: 22px; height: 2px; border-radius: 2px;
                                                                     background: #fff; transition: transform .2s, background-color .2s; }
.av-burger span { top: 21px; }
.av-burger span::before, .av-burger span::after { content: ""; left: 0; }
.av-burger span::before { top: -7px; }
.av-burger span::after { top: 7px; }
.av-head.is-open .av-burger span { background: transparent; }
.av-head.is-open .av-burger span::before { transform: translateY(7px) rotate(45deg); }
.av-head.is-open .av-burger span::after { transform: translateY(-7px) rotate(-45deg); }
.av-burger:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 0; border-radius: 8px; }
.av-menu { max-height: calc(100vh - 60px); overflow-y: auto; padding: 4px 0 24px; border-top: 1px solid var(--av-line); background: var(--av-bg); }
.av-menu nav a { display: block; padding: 16px 0; border-bottom: 1px solid var(--av-line); font: 700 18px/1.2 var(--av-head); text-transform: uppercase; }
.av-menu-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; }
.av-menu-foot .av-head-tel { font-size: 18px; }
.av-menu .av-btn { width: 100%; margin-top: 20px; min-height: 48px; }
@media (max-width: 1199px) {
  .av-social, .av-head-in > .av-head-tel { display: none; }
}
@media (max-width: 1023px) {
  .av-nav, .av-head-in > .av-btn { display: none; }
  .av-head-in { justify-content: space-between; }
  .av-burger { display: block; }
  .av-menu .av-social { display: flex; }
}
@media (max-width: 767px) {
  .av-head-space, .av-head-in { height: 60px; }
  .av-logo { font-size: 16px; }
  .av-menu .av-btn { width: calc(100% - 68px); }   /* clear of Nika's circles on a short phone */
}

/* ---------- the first screen: the arena's video on a computer, its photo on a phone ---------- */
.av-hero { position: relative; display: flex; align-items: flex-end; min-height: 560px; height: calc(100vh - 72px);
           height: min(calc(100svh - 72px), 900px); overflow: hidden; isolation: isolate; }
.av-hero-media { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; }
.av-hero-media img, .av-hero-media video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.av-hero-media video { opacity: 0; transition: opacity .8s; }
.av-hero-media video.is-on { opacity: 1; }
.av-hero-media::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(90deg, rgba(10, 12, 43, .9) 0%, rgba(10, 12, 43, .55) 42%, rgba(10, 12, 43, 0) 72%),
              linear-gradient(0deg, var(--av-bg) 0%, rgba(10, 12, 43, 0) 30%); }
.av-hero-in { width: 100%; padding-bottom: 88px; }
.av-kicker { color: var(--av-soft); font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: .12em; text-transform: uppercase; }
.av-hero-t { margin-top: 16px; font: 700 clamp(40px, 6.4vw, 92px)/.95 var(--av-head); text-transform: uppercase; }
.av-hero-lead { max-width: 560px; margin-top: 22px; color: var(--av-soft); font-size: 20px; line-height: 1.45; }
.av-hero-addr { display: flex; align-items: center; gap: 8px; margin-top: 14px; color: var(--av-mute); font-size: 16px; }
.av-hero-addr svg { flex: none; width: 18px; height: 18px; }
.av-hero-btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
@media (max-width: 767px) {
  .av-hero { min-height: 520px; height: min(calc(100svh - 60px), 720px); }
  .av-hero-media::after { background: linear-gradient(0deg, var(--av-bg) 0%, rgba(10, 12, 43, .82) 40%, rgba(10, 12, 43, .2) 78%, rgba(10, 12, 43, .35) 100%); }
  .av-hero-in { padding-right: 84px; padding-bottom: 44px; }   /* the column of Nika's circles (fixed, 60 px + 16 px off the edge) stays free */
  .av-kicker { font-size: 13px; }
  .av-hero-lead { margin-top: 16px; font-size: 17px; }
  .av-hero-addr { font-size: 15px; }
  .av-hero-btns { margin-top: 26px; }
  .av-hero-btns .av-btn { flex: 1 1 100%; }
}

/* ---------- «Наши плюсы»: the site's four 3D cards; each figure stands out of its card as before ---------- */
.av-plus { overflow: hidden; }
.av-plus-top { display: flex; align-items: center; gap: 36px; }
.av-plus-deco { flex: 0 1 560px; min-width: 0; }
.av-plus-grid { display: grid; grid-template-columns: minmax(0, 2.102fr) minmax(0, 1fr); gap: 20px; margin-top: 64px; }
.av-plus-col { display: grid; gap: 20px; align-content: start; }
.av-pcard { position: relative; display: block; transition: transform .2s; }
.av-pcard:hover { transform: translateY(-3px); }
.av-pcard:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 4px; border-radius: 24px; }
.av-pcard-w { aspect-ratio: 708 / 186; }
.av-pcard-n1 { aspect-ratio: 456 / 247; }
.av-pcard-n2 { aspect-ratio: 458 / 257; }
.av-pcard-clip { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; }
.av-pcard-bg { width: 100%; height: 100%; object-fit: cover; }
.av-pcard-obj { position: absolute; max-width: none; object-fit: cover; pointer-events: none; }
.av-obj-boy { left: 46.75%; top: -23.66%; width: 57.63%; height: 108.06%; }
.av-obj-vr { left: 49.15%; top: 18.82%; width: 51.97%; height: 119.35%; }
.av-obj-party { left: 60.31%; top: -56.68%; width: 47.37%; height: 159.92%; }
.av-obj-map { left: 84.72%; top: -2.72%; width: 20.96%; height: 102.33%; }
.av-pcard-t { position: absolute; left: 4.4%; bottom: 15%; max-width: 44%; font-size: 20px; font-weight: 600; line-height: 1.2;
              text-shadow: 0 1px 14px rgba(40, 0, 80, .4); }
.av-pcard-n1 .av-pcard-t, .av-pcard-n2 .av-pcard-t { left: 6.4%; max-width: 52%; }
@media (max-width: 1199px) {
  .av-pcard-t { font-size: 17px; }
}
/* a tablet: the two small cards side by side on top (the pinata rises into the heading's row, as on a computer), the wide
   ones across under them; a phone: the old page's phone layout — four equal cards (its 320 × 115), its order and the
   figures where its Zero block put them (in % of a card) */
@media (max-width: 1023px) {
  .av-plus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; margin-top: 110px; }
  .av-plus-col { display: contents; }
  .av-pcard-w { grid-column: 1 / -1; }
  .av-pcard-n1, .av-pcard-n2 { order: -1; }
}
@media (max-width: 767px) {
  .av-plus-deco { display: none; }
  .av-plus-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 44px; }
  .av-pcard-w, .av-pcard-n1, .av-pcard-n2 { grid-column: auto; aspect-ratio: 320 / 115; }
  .av-pcard-clip { border-radius: 12.5% / 34.8%; }      /* its 40 px on 320 × 115 */
  .av-pcard-bg { position: absolute; top: 0; left: 0; height: auto; max-width: none; }
  .av-pc-boy .av-pcard-bg { left: -32.4%; width: 139.97%; }
  .av-pc-map .av-pcard-bg { top: -49.1%; width: 100%; }
  .av-pc-party .av-pcard-bg { width: 100%; }
  .av-pc-vr .av-pcard-bg { left: -28.13%; width: 129.02%; }
  .av-pcard-w { order: 1; }
  .av-pcard-n2 { order: 2; }
  .av-pcard-n1 { order: 3; }
  .av-pcard-w + .av-pcard-w { order: 4; }
  .av-obj-boy { left: 46.9%; top: -20%; width: 53.1%; height: 100.9%; }
  .av-obj-map { left: 84.7%; top: -35.7%; width: 20.6%; height: 135.7%; }
  .av-obj-party { left: 61.3%; top: -49.6%; width: 45.6%; height: 149.6%; }
  .av-obj-vr { left: 37.2%; top: 29.6%; width: 65.3%; height: 104.3%; }
  .av-pcard-t, .av-pcard-n1 .av-pcard-t, .av-pcard-n2 .av-pcard-t { left: 6.25%; bottom: 14%; max-width: 46%; font-size: 15px; }
}

/* ---------- «Наша арена»: three numbers and the photos ---------- */
.av-arena-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 56px; align-items: center; }
.av-stats { display: grid; gap: 30px; margin-top: 44px; }
.av-stats b { display: block; font: 700 40px/1 var(--av-head); white-space: nowrap; }
.av-stats i { font: 700 1.3em/0 "Trebuchet MS", system-ui, sans-serif; font-style: normal; vertical-align: -.06em; }
.av-stats span { display: block; margin-top: 8px; color: var(--av-mute); font-size: 16px; line-height: 1.35; }
.av-slider { position: relative; }
.av-slides { display: flex; aspect-ratio: 3 / 2; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: 24px; scrollbar-width: none;
             -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.av-slides::-webkit-scrollbar { display: none; }
.av-slides:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; }
.av-slide { flex: 0 0 100%; scroll-snap-align: start; }
.av-slide img { width: 100%; height: 100%; object-fit: cover; }
.av-sl-btn { position: absolute; top: 50%; display: grid; place-items: center; width: 48px; height: 48px; margin-top: -24px; border-radius: 50%;
             background: rgba(10, 12, 43, .72); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25); transition: background-color .15s; }
.av-sl-btn:hover { background: rgba(10, 12, 43, .92); }
.av-sl-btn:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; }
.av-sl-btn svg { width: 20px; height: 20px; }
.av-sl-prev { left: 16px; }
.av-sl-next { right: 16px; }
.av-sl-dots { position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; }
.av-sl-dots button { display: grid; place-items: center; width: 28px; height: 28px; }
.av-sl-dots button::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .55); transition: width .2s, background-color .2s; }
.av-sl-dots button.is-on::before { width: 22px; background: #fff; }
@media (max-width: 1023px) {
  .av-arena-in { grid-template-columns: 1fr; gap: 36px; }
  .av-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 32px; }
  .av-stats b { font-size: 32px; }
}
@media (max-width: 767px) {
  .av-stats { grid-template-columns: 1fr; gap: 14px; margin-top: 26px; }
  .av-stats li { display: flex; align-items: baseline; gap: 14px; }
  .av-stats b { flex: none; min-width: 6.4em; font-size: 22px; }
  .av-stats span { margin-top: 0; font-size: 15px; }
  .av-slides { aspect-ratio: 4 / 3; border-radius: 18px; }
  .av-sl-btn { display: none; }
}

/* ---------- «Наши игры»: a grid of cards; a card opens the game's window ---------- */
.av-games { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
.av-game-btn { display: flex; flex-direction: column; width: 100%; height: 100%; overflow: hidden; border: 1px solid var(--av-line);
               border-radius: 20px; background: var(--av-card); text-align: left; transition: transform .2s, border-color .2s, box-shadow .2s; }
.av-game-btn:hover { transform: translateY(-3px); border-color: #7A3CFF; box-shadow: 0 18px 40px -20px rgba(158, 0, 255, .8); }
.av-game-btn:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; }
.av-game-pic { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #05061A; }
.av-game-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.av-game-btn:hover .av-game-pic img { transform: scale(1.04); }
.av-game-play { position: absolute; right: 12px; bottom: 12px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
                background: rgba(10, 12, 43, .75); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }
.av-game-play svg { width: 16px; height: 16px; margin-left: 2px; }
.av-game-body { display: block; padding: 18px 20px 22px; }
.av-game-t { display: block; font: 700 20px/1.15 var(--av-head); text-transform: uppercase; }
.av-game-body .av-tags { margin-top: 12px; }
@media (max-width: 1023px) {
  .av-games { gap: 16px; }
  .av-game-body { padding: 14px 16px 18px; }
  .av-game-t { font-size: 17px; }
}
@media (max-width: 767px) {
  .av-games { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
  .av-games > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .av-game-btn { border-radius: 16px; }
  .av-game-body { padding: 12px 12px 14px; }
  .av-game-t { font-size: 14px; }
  .av-game-body .av-tags { gap: 5px; margin-top: 8px; }
  .av-game-body .av-tags span { padding: 3px 8px; font-size: 12px; white-space: normal; }   /* «тактический шутер» on a 320 px phone */
  .av-game-play { right: 8px; bottom: 8px; width: 32px; height: 32px; }
  .av-game-play svg { width: 12px; height: 12px; }
}

/* the game's window: the video or a screenshot on the stage, all five under it; the text and the button beside */
.av-modal { position: fixed; top: 0; left: 0; z-index: 999991; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0;
            padding: 24px; border: 0; background: rgba(5, 6, 24, .84); overflow-y: auto; overscroll-behavior: contain; }
.av-modal[open] { display: flex; }
.av-modal::backdrop { background: transparent; }
.av-gm { position: relative; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 32px; width: min(1120px, 100%);
         margin: auto; padding: 28px; border: 1px solid var(--av-line); border-radius: 24px; background: var(--av-card);
         box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7); }
.av-gm-stage { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 16px; background: #05061A center / cover no-repeat; }
.av-gm-stage iframe, .av-gm-stage img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; object-fit: contain; }
.av-gm-thumbs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.av-gm-thumbs button { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 10px; background: #05061A; opacity: .6;
                       outline: 2px solid transparent; outline-offset: 2px; transition: opacity .15s, outline-color .15s; }
.av-gm-thumbs button:hover { opacity: .9; }
.av-gm-thumbs button[aria-current="true"] { opacity: 1; outline-color: #AD00FF; }
.av-gm-thumbs button:focus-visible { opacity: 1; outline-color: var(--av-sky); }
.av-gm-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.av-gm-thumbs .av-game-play { right: 50%; bottom: 50%; width: 30px; height: 30px; margin: 0 -15px -15px 0; }
.av-gm-thumbs .av-game-play svg { width: 11px; height: 11px; }
.av-gm-x { position: absolute; top: 16px; right: 16px; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
           background: rgba(255, 255, 255, .08); transition: background-color .15s; }
.av-gm-x:hover { background: rgba(255, 255, 255, .16); }
.av-gm-x:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; }
.av-gm-x svg { width: 18px; height: 18px; }
.av-gm-text { display: flex; flex-direction: column; padding-top: 6px; }
.av-gm-t { padding-right: 52px; font: 700 30px/1.1 var(--av-head); text-transform: uppercase; }
.av-gm-t:focus { outline: none; }
.av-gm-text .av-tags { margin-top: 16px; }
.av-gm-desc { margin: 20px 0 28px; color: var(--av-soft); font-size: 17px; line-height: 1.55; }
.av-gm-text .av-btn { margin-top: auto; align-self: flex-start; }
html.av-lock, html.av-lock body { overflow: hidden; }
@media (max-width: 899px) {
  .av-modal { padding: 0; }
  .av-gm { grid-template-columns: 1fr; align-content: start; gap: 20px; width: 100%; min-height: 100%; margin: 0; padding: 68px 16px 28px; border: 0; border-radius: 0; }
  .av-gm-x { top: 12px; right: 12px; }
  .av-gm-thumbs { gap: 6px; }
  .av-gm-thumbs button { border-radius: 8px; }
  .av-gm-t { padding-right: 0; font-size: 24px; }
  .av-gm-desc { margin: 16px 0 24px; font-size: 16px; }
  .av-gm-text .av-btn { align-self: stretch; }
}

/* ---------- «Мероприятия»: three photos, each to its page ---------- */
.av-events { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
.av-event { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 20px; isolation: isolate; }
.av-event img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.av-event::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
                   background: linear-gradient(0deg, rgba(10, 12, 43, .92) 0%, rgba(10, 12, 43, .2) 50%, rgba(10, 12, 43, 0) 100%); }
.av-event:hover img { transform: scale(1.05); }
.av-event:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; }
.av-event-t { position: absolute; left: 22px; right: 18px; bottom: 18px; z-index: 1; display: flex; align-items: center; justify-content: space-between;
              gap: 12px; font: 700 22px/1.15 var(--av-head); text-transform: uppercase; }
.av-event-go { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--av-grad); }
.av-event-go svg { width: 18px; height: 18px; }
@media (max-width: 1023px) {
  .av-event-t { font-size: 18px; }
  .av-event-go { width: 38px; height: 38px; }
}
@media (max-width: 767px) {
  .av-events { grid-template-columns: 1fr; gap: 14px; margin-top: 28px; }
  .av-event { aspect-ratio: 16 / 9; border-radius: 18px; }
  .av-event-t { left: 18px; bottom: 14px; font-size: 20px; }
}

/* ---------- «Дополнительно»: two pictured extras and the rest as price rows ---------- */
.av-extras { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 40px; }
.av-xcard { padding: 0; overflow: hidden; }
.av-xcard-pic { aspect-ratio: 3 / 2; }
.av-xcard-pic img { width: 100%; height: 100%; object-fit: cover; }
.av-xcard-body { display: flex; flex: 1; flex-direction: column; padding: 22px 24px 26px; }
.av-xcard p { margin-top: 12px; color: var(--av-soft); font-size: 16px; line-height: 1.5; }
.av-xprice { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: auto; padding-top: 20px; }
.av-xprice b { font: 700 24px/1 var(--av-head); white-space: nowrap; }
.av-xprice span { color: var(--av-mute); font-size: 15px; }
.av-xcard .av-xnote, .av-xnote { margin-top: 10px; color: var(--av-mute); font-size: 14px; line-height: 1.45; }
.av-xlist .av-rows { margin-bottom: 0; }
.av-xlist .av-row b { font-size: 20px; }
@media (max-width: 1199px) {
  .av-extras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .av-xlist { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .av-extras { grid-template-columns: 1fr; margin-top: 28px; }
  .av-xcard-body { padding: 20px 22px 24px; }
}

/* ---------- «Подарочные сертификаты» ---------- */
.av-cert-in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.av-cert-pic { position: relative; aspect-ratio: 760 / 520; }
.av-cert-pic img { position: absolute; width: 84%; filter: drop-shadow(0 28px 34px rgba(0, 0, 0, .55)); }
.av-cert-back { left: 0; top: 4%; transform: rotate(-9deg); opacity: .8; }
.av-cert-front { right: 0; bottom: 4%; transform: rotate(4deg); }
.av-cert-text .av-list { margin: 26px 0 30px; }
.av-cert-tel { display: block; margin-top: 6px; font: 700 26px/1.2 var(--av-head); white-space: nowrap; }
.av-cert-tel:hover { color: var(--av-soft); }
.av-cert-tel:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; border-radius: 4px; }
.av-cert-ask { color: var(--av-mute); font-size: 16px; }
@media (max-width: 1199px) {
  .av-cert-in { grid-template-columns: 1fr; gap: 40px; }
  .av-cert-pic { max-width: 560px; }
}
@media (max-width: 767px) {
  .av-cert-tel { font-size: 22px; }
}

/* ---------- «Отзывы»: Yandex's widget in the site's frame ---------- */
.av-rev-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: 56px; align-items: start; }
.av-rev-text .av-link { margin-top: 26px; }
.av-rev-char { width: 300px; margin-top: 40px; }
.av-rev-frame { height: 720px; overflow: hidden; border: 1px solid var(--av-line); border-radius: 20px; background: #fff; }
.av-rev-frame iframe { width: 100%; height: 100%; border: 0; }
@media (max-width: 1023px) {
  .av-rev-in { grid-template-columns: 1fr; gap: 32px; }
  .av-rev-char { display: none; }
  .av-rev-frame { max-width: 640px; }
}
@media (max-width: 767px) {
  .av-rev-frame { height: 600px; border-radius: 18px; }
}

/* ---------- «Как нас найти»: the map and the contacts ---------- */
.av-ct-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.av-ct-char { position: relative; z-index: 1; width: 230px; margin: -80px 24px -64px 0; }
.av-ct { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 24px; margin-top: 40px; }
.av-ct-map { position: relative; min-height: 480px; overflow: hidden; border-radius: 20px; background: #E8E4DC; }
.av-ct-row + .av-ct-row { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--av-line); }
.av-ct-row > span { display: block; color: var(--av-mute); font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.av-ct-row > b, .av-ct-row > a { display: block; margin-top: 6px; font: 700 20px/1.3 var(--av-head); }
.av-ct-row > a:hover { color: var(--av-soft); }
.av-ct-row > a:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 3px; border-radius: 4px; }
.av-ct-row small { display: block; margin-top: 6px; color: var(--av-soft); font-size: 15px; line-height: 1.45; }
.av-ct-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.av-ct-btns .av-btn { min-height: 44px; padding: 0 18px; font-size: 15px; }
.av-ct-card .av-link { margin-top: 22px; align-self: flex-start; }
@media (max-width: 1023px) {
  .av-ct { grid-template-columns: 1fr; }
  .av-ct-map { min-height: 380px; }
}
@media (max-width: 767px) {
  .av-ct-char { width: 120px; margin: -36px 0 -34px 0; }
  .av-ct { margin-top: 28px; }
  .av-ct-map { min-height: 320px; border-radius: 18px; }
  .av-ct-row > b, .av-ct-row > a { font-size: 18px; }
  .av-ct-btns .av-btn { flex: 1 1 100%; }
}

/* the party pages /birthday, /graduation, /corporative (ИН66, ИН75): written by site/avatar/party/build.py */
.av-hero-sub { height: min(calc(100vh - 72px), 760px); }
.av-hero-sub .av-hero-t { font-size: clamp(34px, 5.6vw, 80px); }
.av-hero-tags { margin-top: 20px; }
.av-hero-tags span { background: rgba(10, 12, 43, .55); }
/* a party photo is busier than the home's: a darker veil on the text's side */
.av-hero-sub .av-hero-media::after { background: linear-gradient(90deg, rgba(10, 12, 43, .92) 0%, rgba(10, 12, 43, .72) 42%, rgba(10, 12, 43, .2) 78%),
                                     linear-gradient(0deg, var(--av-bg) 0%, rgba(10, 12, 43, 0) 30%); }
/* how a party goes: four numbered cards */
.av-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 40px; padding: 0; list-style: none;
             counter-reset: av-step; }
.av-step { padding: 26px 24px 28px; border: 1px solid var(--av-line); border-radius: 20px; background: var(--av-card); }
.av-step::before { counter-increment: av-step; content: counter(av-step); display: grid; place-items: center; width: 44px; height: 44px;
                   border-radius: 50%; background: var(--av-grad); font: 700 18px/1 var(--av-head); }
.av-step h3 { margin-top: 18px; font: 700 18px/1.25 var(--av-head); text-transform: uppercase; }
.av-step p { margin-top: 10px; color: var(--av-soft); font-size: 16px; line-height: 1.5; }
/* one tariff across the row: what it is on the left, the price on the right */
@media (min-width: 768px) {
  .av-tcard-wide { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 28px; align-items: start; }
  .av-tcard-wide .av-price { grid-column: 2; grid-row: 1 / span 3; margin: 0; padding: 0; }
  .av-tcard-wide .av-price .av-rows { margin: 0; }
  .av-tcard-wide .av-btn { grid-column: 1; justify-self: start; margin-top: 20px; }
}
/* discounts */
.av-deals { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin-top: 28px; }
.av-deal { display: flex; align-items: center; gap: 20px; padding: 22px 24px; border: 1px solid rgba(173, 0, 255, .45); border-radius: 20px;
           background: rgba(158, 0, 255, .1); }
.av-deal b { flex: none; font: 700 34px/1 var(--av-head); white-space: nowrap; }
.av-deal span { color: var(--av-soft); font-size: 16px; line-height: 1.45; }
.av-deal strong { display: block; margin-bottom: 2px; color: var(--av-ink); font-weight: 600; }
/* photos, questions */
.av-gallery .av-slider { max-width: 900px; margin-top: 40px; }
.av-gallery .av-slides { aspect-ratio: 16 / 10; }
.av-faq { max-width: 880px; margin-top: 36px; border-top: 1px solid var(--av-line); }
.av-faq details { border-bottom: 1px solid var(--av-line); }
.av-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; cursor: pointer; list-style: none;
                  font-size: 19px; font-weight: 600; line-height: 1.35; }
.av-faq summary::-webkit-details-marker { display: none; }
.av-faq summary::after { content: ""; flex: none; width: 12px; height: 12px; margin-right: 4px; border: solid var(--av-mute); border-width: 0 2px 2px 0;
                         transform: translateY(-3px) rotate(45deg); transition: transform .2s; }
.av-faq details[open] summary::after { transform: translateY(3px) rotate(-135deg); }
.av-faq summary:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; }
.av-faq p { max-width: 760px; padding-bottom: 22px; color: var(--av-soft); font-size: 17px; }
@media (max-width: 1199px) {
  .av-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  /* a phone: the photo is a band above the text, cut to where the page says its people stand (ИН82) */
  .av-hero-sub { display: block; height: auto; min-height: 0; }
  .av-hero-sub .av-hero-media { position: relative; z-index: 0; aspect-ratio: 16 / 9; max-height: 50vh; }
  .av-hero-sub .av-hero-media img { object-position: var(--av-hero-pos, 50% 50%); }
  .av-hero-sub .av-hero-in { position: relative; margin-top: -24px; }
  .av-hero-sub .av-hero-t { font-size: min(34px, calc((100vw - 116px) / 7.4)); }   /* «КОРПОРАТИВ», the longest word; the circles' lane stays free */
  .av-steps { grid-template-columns: 1fr; gap: 14px; margin-top: 28px; }
  .av-hero-sub .av-hero-media::after { background: linear-gradient(0deg, var(--av-bg) 0%, rgba(10, 12, 43, 0) 30%); }
  .av-step { padding: 22px; }
  .av-deal { padding: 18px 20px; gap: 16px; }
  .av-deal b { font-size: 28px; }
  .av-gallery .av-slider { margin-top: 28px; }
  .av-gallery .av-slides { aspect-ratio: 4 / 3; }
  .av-faq summary { padding: 18px 0; font-size: 17px; }
  .av-faq p { font-size: 16px; }
}

/* the document pages /pravila, /privacy, /soglasie, /oferta (ИН66): their old text in the site's type */
.av-doc { padding-top: 64px; }
.av-doc-t { max-width: 920px; font: 700 clamp(24px, 3.4vw, 44px)/1.12 var(--av-head); text-transform: uppercase; }
.av-doc-body { max-width: 820px; margin-top: 36px; color: var(--av-soft); font-size: 17px; line-height: 1.6; overflow-wrap: anywhere; }
.av-doc-body h2 { margin: 44px 0 14px; color: var(--av-ink); font: 700 20px/1.3 var(--av-head); text-transform: uppercase; }
.av-doc-body h3 { margin: 30px 0 8px; color: var(--av-ink); font-size: 20px; font-weight: 600; line-height: 1.35; }
.av-doc-body :is(h2, h3):first-child { margin-top: 0; }
.av-doc-body p + p, .av-doc-body p + ul, .av-doc-body ul + p { margin-top: 12px; }
.av-doc-body ul { padding-left: 22px; list-style: disc; }
.av-doc-body li + li { margin-top: 10px; }
.av-doc-body li::marker { color: var(--av-mute); }
.av-doc-body strong { color: var(--av-ink); font-weight: 600; }
.av-doc-body a { color: var(--av-sky); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
  .av-doc { padding-top: 40px; }
  .av-doc-body { margin-top: 26px; font-size: 16px; }
  .av-doc-body h2 { margin-top: 36px; font-size: 17px; }
  .av-doc-body h3 { font-size: 18px; }
}

/* ---------- the footer, the cookie notice, «наверх» ---------- */
.av-foot { padding: 56px 0 40px; border-top: 1px solid var(--av-line); background: #070920; }
.av-foot-in { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
.av-foot p { margin-top: 14px; color: var(--av-mute); font-size: 15px; }
.av-foot-tel { display: inline-block; margin-top: 8px; font-size: 17px; font-weight: 600; }
.av-foot-nav, .av-foot-soc { display: grid; gap: 10px; align-content: start; font-size: 15px; }
.av-foot-nav a, .av-foot-soc a { color: var(--av-soft); transition: color .15s; }
.av-foot-nav a:hover, .av-foot-soc a:hover, .av-foot-tel:hover { color: #fff; }
.av-foot-copy { margin-top: 40px; color: var(--av-mute); font-size: 14px; }
@media (max-width: 767px) {
  .av-foot { padding: 44px 0 108px; }    /* the last line clears Nika's circles */
  .av-foot-in { grid-template-columns: 1fr; gap: 28px; }
}
/* the cookie notice: as Tilda's was — once agreed on any page of the site, it is gone here too (the same key) */
.av-cookie { position: fixed; left: 20px; bottom: 20px; z-index: 100001; display: flex; align-items: center; gap: 14px; max-width: 420px;
             padding: 12px 12px 12px 18px; border: 1px solid var(--av-line); border-radius: 16px; background: var(--av-raise);
             box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .8); color: var(--av-soft); font-size: 14px; line-height: 1.4; }
.av-cookie button { flex: none; min-height: 40px; padding: 0 18px; border-radius: 999px; background: #fff; color: var(--av-bg); font-size: 14px; font-weight: 600; }
.av-cookie button:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; }
@media (max-width: 767px) {
  .av-cookie { left: 0; right: 0; bottom: 0; max-width: none; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) 16px;
               border-width: 1px 0 0; border-radius: 16px 16px 0 0; font-size: 12px; line-height: 1.35; }
  .av-cookie button { min-height: 34px; padding: 0 14px; }
}
/* «наверх» (ИН65): on a computer right above Nika's circle; up to 960 px — in the bottom-left corner */
.av-top { position: fixed; right: 32px; bottom: 102px; z-index: 990; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
          background: var(--av-raise); box-shadow: inset 0 0 0 1px var(--av-line), 0 10px 24px -12px rgba(0, 0, 0, .8);
          opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, background-color .15s; }
.av-top.is-on { opacity: 1; visibility: visible; }
.av-top:hover { background: #262C66; }
.av-top:focus-visible { outline: 3px solid var(--av-sky); outline-offset: 2px; }
.av-top svg { width: 20px; height: 20px; }
/* «назад» (ИН76): after a jump to a place on this page the round button widens into «Назад» and steps back there */
.av-top .av-top-back, .av-top span { display: none; }
.av-top.is-back { grid-auto-flow: column; gap: 8px; width: auto; padding: 0 18px 0 14px; border-radius: 999px; opacity: 1; visibility: visible; }
.av-top.is-back .av-top-up { display: none; }
.av-top.is-back .av-top-back, .av-top.is-back span { display: block; }
.av-top span { font-size: 15px; font-weight: 600; line-height: 1; }
@media (max-width: 960px) {
  .av-top { left: 16px; right: auto; bottom: 16px; }
  html.av-cookie-on .av-top { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  html:has(.av-head) { scroll-behavior: smooth; }
}