﻿:root {
  --brand: #934b70;
  --pane-global-h: 50vh;
  --kb-bn-scale: 2;
  --book-dy: 0.025;
  --book-fs: .039;
  --book-fs-vmin: 2.5;
  --kb-fw: 500;   /* было 500 → стало на шаг толще */
  --kb-lh: 1.2;  /* было ~1.2 → чуть плотнее */
}
@supports (height: 1dvh) { :root { --pane-global-h: 50dvh; } }

html,
body {
  height: 100%;
  margin: 0;
  background: #000;
  color: #fff;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text',
               'Segoe UI', Roboto, 'Noto Sans', 'Helvetica Neue', Arial,
               'Apple Color Emoji', 'Segoe UI Emoji';
  font-weight: 500;
}

* {
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}

.wrapper {
  position: relative;
  height: 100vh;
  width: 100%;
  margin: 0 auto;
}

@media (min-width: 821px) {
  .wrapper {
    width: 33.333vw;
  }
}

.wrapper {
  --topH: var(--pane-global-h);
  --botH: var(--pane-global-h);
}

.wrapper.compact {
  --topH: 12vh;
  --botH: 88vh;
}

.topPane {
  position: relative;
  width: 100%;
  height: var(--topH);
  overflow: hidden;
  transition: height .25s linear;
}

.topPane {
  --gradA: 0;
}

.topPane {
  background: linear-gradient(0deg, #000 0%, #000 100%);
}

.topPane::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(0deg, #e592bb 0%, #000 100%);
  opacity: var(--gradA);
  will-change: opacity;
  transition: opacity .25s linear;
}

.botPane {
  position: relative;
  width: 100%;
  height: var(--botH);
  overflow: hidden;
  transition: height .25s ease;
}

.botPane.infoScroll {
  overflow: auto;
  scrollbar-width: none;
}

.botPane.infoScroll::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.logoWrap {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logoWrap > *,
.logoWrap svg,
.logoWrap canvas {
  height: calc(var(--pane-global-h) * .50) !important;
  width: auto !important;
}

.flags {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--pane-global-h) * .08);
}

.flag {
  height: calc(var(--pane-global-h) * .14);
  width: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.2);
  opacity: 1;
  transition: opacity .25s ease;
}
.flag.dim { opacity: 0; }

.katyIcon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: calc(var(--pane-global-h) * .50);
  width: auto;
  cursor: default;
  transition:
    top .25s linear,
    left .25s linear,
    transform .25s linear,
    height .25s linear;
}

.katyIcon.docked {
  left: 12.5%;
  top: calc(var(--pane-global-h) * 0.125);
  transform: translate(-50%, -50%);
  height: calc(var(--pane-global-h) * .125);
  width: auto;
  cursor: pointer;
}

.socials {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--pane-global-h) * .125);
  height: 1px;
}

.socials a {
  position: absolute;
  top: 0;
  transform: translate(-50%, -50%);
  display: inline-flex;
}

.socials img {
  height: calc(var(--pane-global-h) * .137);
  width: auto;
  display: block;
  user-select: none;
}

.socials[data-phase="a"] a[data-slot="A"] { left: 15%; }
.socials[data-phase="a"] a[data-slot="B"] { left: 50%; }
.socials[data-phase="a"] a[data-slot="C"] { left: 85%; }

.socials[data-phase="b"] a[data-slot="A"] { left: 37.5%; }
.socials[data-phase="b"] a[data-slot="B"] { left: 62.5%; }
.socials[data-phase="b"] a[data-slot="C"] { left: 87.5%; }

.socials a {
  transition: left .25s linear;
}

.bookBox {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--pane-global-h) * (0.06 - var(--book-dy)));
  height: calc(var(--pane-global-h) * .18 * var(--kb-bn-scale));
  display: flex;
  align-items: flex-end;
  opacity: 1;
  transition: opacity .25s ease;
}

.bookNow,
.bookNow:link,
.bookNow:visited,
.bookNow:hover,
.bookNow:active,
.bookNow:focus {
  text-decoration: none !important;
  -webkit-text-decoration: none !important; /* для iOS Safari */
  text-decoration-color: transparent !important; /* на всякий случай */
}

.bookBox.hide {
  opacity: 0;
  pointer-events: none;
}

.bookNow {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  background: transparent;
  border: 0;
  outline: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  color: transparent;
  -webkit-text-fill-color: transparent;
  transform-origin: 50% 100%;
  transform: scale(var(--kb-bn-scale, 1));
}

.bookNow,
.bookNow:link,
.bookNow:visited,
.bookNow:hover,
.bookNow:active,
.bookNow:focus {
  text-decoration: none !important;
  -webkit-text-decoration: none !important; /* для iOS Safari */
  text-decoration-color: transparent !important; /* на всякий случай */
}

.bookNow:focus {
  outline: 0;
}

.bookNow span {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, 'Noto Sans', 'Helvetica Neue', Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  font-weight: 900;
  line-height: .9;
  white-space: nowrap;
  background-image:
    linear-gradient(-30deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 41%, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 59%, rgba(255,255,255,0) 100%),
    linear-gradient(90deg, var(--brand), var(--brand));
  background-size: 350% 100%, 100% 100%;
  background-position: 300% 0, 0 0;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  animation: kbSheenRunHold 6.666s linear 0s infinite both;
  will-change: background-position;
}

@keyframes kbSheenRunHold {
  0%   { background-position: 300% 0, 0 0; }
  49.99% { background-position: -300% 0, 0 0; }
  50%  { background-position: -300% 0, 0 0; }
  100% { background-position: -300% 0, 0 0; }
}

.bookNow .line1 {
  font-size: calc(var(--pane-global-h) * .072);
}

.bookNow .line2 {
  font-size: calc(var(--pane-global-h) * .024);
  transform: translateX(1.6em);
}

.action {
  position: fixed;
  bottom: calc(var(--pane-global-h) * .10);
  text-decoration: none;
  color: #fff;
  font-size: calc(var(--pane-global-h) * .05 + 3px);
  opacity: 1;
  transition: opacity .25s ease;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, 'Noto Sans', 'Helvetica Neue', Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  font-weight: 500;
  z-index: 5;
}

.action.left  { left: 8vw; }
.action.right { right: 8vw; }@media (min-width: 821px) {
  .action.left  { left:  calc((100vw - 33.333vw)/2 + 1vw); }
  .action.right { right: calc((100vw - 33.333vw)/2 + 1vw); }
}

.action.hide {
  opacity: 0;
  pointer-events: none;
}

.bookAgree{
  position: fixed;
  bottom: calc(var(--pane-global-h) * .10);
  left: 50%;
  transform: translateX(-50%);
  text-decoration: none;
  color: #fff;
  font-size: calc(var(--pane-global-h) * .05 + 3px);
  font-weight: 500;
  z-index: 4;
}

.fade0 { opacity: 0; }

.fadeIn {
  animation: fadeIn .6s ease forwards;
}

@keyframes fadeIn {
  to { opacity: 1; }
}

.view {
  position: absolute;
  inset: 0;
  padding: 0;
}

.section { padding: 0; }
.infoView .section { padding-left: calc(100%*.03); padding-right: calc(100%*.03); }

.view.infoView { padding-top: calc(var(--pane-global-h)*.05); padding-bottom: calc(var(--pane-global-h)*.125); font-size: calc(var(--pane-global-h) * var(--book-fs, .05)); }

.section .title {
  margin: 0 0 calc(var(--pane-global-h) * .02);
  font-size: calc(var(--pane-global-h) * .06);
  font-weight: 500;
  color: #fff;
}

.infoView .section + .section { margin-top: calc(var(--pane-global-h) * .030); }

.infoView .section .title { white-space: pre-line; }


.section .text {
  color: var(--brand);
  font-size: calc(var(--pane-global-h) * .05);
  line-height: 1.2;
  white-space: pre-wrap;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, 'Noto Sans', 'Helvetica Neue', Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  font-weight: 500;
}

.welcome {
  position: absolute;
  inset: 0;
  padding: calc(var(--pane-global-h)*.05) calc(100%*.03) calc(var(--pane-global-h)*.24);
  overflow: auto;
  scrollbar-width: none;
}
.welcome::-webkit-scrollbar { width: 0; height: 0; }
.welcome::after { content:""; display:block; height: calc(var(--pane-global-h) * .03); }

.welcome .title { 
  margin: 0 0 calc(var(--pane-global-h)*.02);
  font-size: calc(var(--pane-global-h)*.05);
  font-weight: 500;
  color: #fff;
}
.welcome .text {
  color: var(--brand);
  font-size: calc(var(--pane-global-h)*.05);
  line-height: 1.2;
  white-space: pre-wrap;
  font-family: -apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Segoe UI',Roboto,'Noto Sans','Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji';
  font-weight: 500;
}
.welcome-details{
  color: var(--brand);
  font-size: var(--welcome-fs, 16px);
  line-height: 1.2;
  white-space: pre-wrap;
  font-family: -apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Segoe UI',Roboto,'Noto Sans','Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji';
  font-weight: 500;
}

.noselect { user-select: none; }
.hidden { display: none; }

.infoView .section .title,
.infoView .section .text {
  font-size: calc(var(--book-fs-vmin, 2.5) * 1vmin) !important;
  line-height: 1.2;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.infoView .info-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 2%;
  padding-left: 0%;
  padding-right: 0%;
  margin-top: calc(var(--pane-global-h) * .02);
}

.infoView .info-gallery .info-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
  object-fit: cover;
  cursor: zoom-in;
}

.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  transition: background-color .25s ease;
}

.lightbox.show { display: flex; }

.lb-frame {
  position: relative;
  display: inline-block;
}

.lb-frame .lb-img {
  display: block;
  width: 100vw;
  max-width: 100vw;
  max-height: 96vh;
  height: auto;
  object-fit: contain;
  cursor: zoom-out;
  user-select: none;
  transition: transform 250ms ease, opacity 250ms ease;
}

@media (min-width: 821px) {
  .lb-frame .lb-img {
    width: 33.33vw;
    max-width: 33.33vw;
  }
}

.lb-frame .lb-arrow,
.lb-frame .lb-close {
  position: absolute;
  background: transparent;
  border: 0;
  color: #fff;
  font-size: 40px;
  line-height: 1;
  padding: 12px;
  cursor: pointer;
  user-select: none;
  pointer-events: auto;
  opacity: 0;
  transition: opacity .15s ease;
}

.lightbox.show.ready .lb-frame .lb-arrow,
.lightbox.show.ready .lb-frame .lb-close {
  opacity: 1;
}

.lb-frame .lb-arrow.left,
.lb-frame .lb-arrow.right {
  position: fixed !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  height: 20vh !important;
  display: flex !important;
  align-items: center !important;
  pointer-events: auto !important;
}

.lb-frame .lb-close { right: 8px; top: 8px; font-size: 32px; padding: 8px; }

@media (max-width: 820px) {
  .lb-frame .lb-arrow.left,
  .lb-frame .lb-arrow.right {
    width: 20vw !important;
  }
  .lb-frame .lb-arrow.left {
    left: 0 !important;
    justify-content: flex-start !important;
    padding-left: 12px !important;
  }
  .lb-frame .lb-arrow.right {
    right: 0 !important;
    justify-content: flex-end !important;
    padding-right: 12px !important;
  }
}

@media (min-width: 821px) {
  .lb-frame .lb-arrow.left,
  .lb-frame .lb-arrow.right {
    width: calc(33.33vw * 0.20) !important;
  }
  .lb-frame .lb-arrow.left {
    left: calc(50vw - (33.33vw / 2)) !important;
    justify-content: flex-start !important;
    padding-left: 12px !important;
  }
  .lb-frame .lb-arrow.right {
    right: calc(50vw - (33.33vw / 2)) !important;
    justify-content: flex-end !important;
    padding-right: 12px !important;
  }
}

.view.infoView .section .title,
.view.infoView .section .text { font-size: 100% !important; }
.view.infoView .section .title {
  font-weight: 500
   !important;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, 'Noto Sans', 'Helvetica Neue', Arial, 'Apple Color Emoji', 'Segoe UI Emoji' !important;
}

.view.infoView:not(.bookView) .action {
  position: static !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  display: block;
  width: 100%;
  text-align: center;
  margin-top:    calc(var(--pane-global-h) * .125);
  margin-bottom: calc(var(--pane-global-h) * .125);
}

.infoView .faqBtn{
  display: block;
  width: 100%;
  text-align: center;
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: calc(var(--pane-global-h) * .05);
  margin-top:    calc(var(--pane-global-h) * .125);
  margin-bottom: calc(var(--pane-global-h) * .10);
}

.infoView .faqBtn:visited{ color:#fff; }

.infoView .faqSpacer{
  height: calc(var(--pane-global-h) * .27); /* Отступ с низу info */
}

.langMask{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(var(--pane-global-h) * .24);
  background: #000;
  pointer-events: none;
  z-index: 2;
}

.view.mapView{min-height:100%}
.view.mapView .mapBoxTop{height:55vh}
.view.mapView .mapBoxTop iframe{display:block;width:100%;height:100%;border:0}
.view.mapView .section .title,
.view.mapView .section .text { font-size: 113% !important; }
.view.mapView .section .title { white-space: pre-line; }
.view.mapView .section{
  padding-left: calc(100%*.03);
  padding-top: calc(100%*.02);
}

/* базовый текст, кнопки-действия и тексты разделов */

body,
.section .text,
.view.infoView .section .text,
.welcome .text,
.welcome-details,
.action{
  font-weight: var(--kb-fw) !important;
  line-height: var(--kb-lh) !important;
}

.section .title,
.view.infoView .section .title,
.welcome .title{
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

/* unify typography on the Book page */
.view.bookView .section .title { font-size: 120% !important; }
.view.bookView .section .text { font-size: 120% !important; }