/* Обычный вид задают макеты разделов в main.css/home-mobile.css/pages-mobile.css.
   Состояния взаимодействия — из «Состояния кнопок.svg». */
.site .btn:not(:where(.kontur-host *, .react-ui *)) {
  font-family: var(--font-body);
  font-weight: 400;
  text-decoration: none;
  --button-surface: transparent;
}
.site .btn:not(:where(.sticky-cta, .house__more, .kontur-host *, .react-ui *)) { position: relative; }
.site .header__aside .btn:focus-visible { padding-block: 9px; }
.site .cookie-accept.btn { min-height: 36px; padding: 0; font-size: 11px; line-height: 14px; }
@media (min-width: 900px) {
  .site .cookie-accept.btn { min-height: var(--header-cta-h); padding-inline: 20px; font-size: var(--nav-font-size); line-height: var(--nav-line-height); white-space: nowrap; }
}
.site .footer__booking-link.btn { display: inline-flex; height: 24px; min-height: 0; padding: 0; font-size: 18px; line-height: 22px; }
.site [data-request-form][data-confirmed-success] .btn { min-width: min(100%, 260px); }
.site .btn:is(.is-loading, .is-success, [data-state="loading"], [data-state="success"]):not(:where(.kontur-host *, .react-ui *)) {
  padding-inline: 0; white-space: nowrap;
}
.site .place__more { border-color: transparent; }
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(:focus-visible, :active, .is-pressed, .is-loading, .is-success, [data-state="loading"], [data-state="success"], :disabled, [aria-disabled="true"]) { background-image: none; }
@media (hover: hover) and (pointer: fine) {
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(:hover, :focus-visible, :active, .is-pressed, .is-loading, .is-success, [data-state="loading"], [data-state="success"], :disabled, [aria-disabled="true"]) { background-image: none; }
}
/* Подложка для тёмного текста появляется только при взаимодействии. */
.site :is(.house__more, .about__text .btn--outline):is(:focus-visible, :active, .is-pressed, .is-loading, .is-success, [data-state="loading"], [data-state="success"]) {
  background-image: linear-gradient(var(--button-surface), var(--button-surface)), linear-gradient(#F7F0E6, #F7F0E6);
}
@media (hover: hover) and (pointer: fine) {
/* Подложка для тёмного текста появляется только при взаимодействии. */
.site :is(.house__more, .about__text .btn--outline):is(:hover, :focus-visible, :active, .is-pressed, .is-loading, .is-success, [data-state="loading"], [data-state="success"]) {
  background-image: linear-gradient(var(--button-surface), var(--button-surface)), linear-gradient(#F7F0E6, #F7F0E6);
}
}
@media (hover: hover) and (pointer: fine) {
.site .btn:not(:where(.kontur-host *, .react-ui *, :disabled, [aria-disabled="true"], .is-loading, .is-success, [data-state="loading"], [data-state="success"])):hover,
.site :where(.searchbar:hover) .btn:not(:where([aria-disabled="true"], .is-loading, .is-success)) {
  background-color: #E5D0C0; color: #494949; border-color: transparent;
  --button-surface: #E5D0C0;
}
}
@media (hover: hover) and (pointer: fine) {
/* В SVG градиент относится к обводке, заливка — терракотовая 20%. */
.site .btn:is(.btn--primary, .btn--outline):not(:where(.kontur-host *, .react-ui *, :disabled, [aria-disabled="true"], .is-loading, .is-success, [data-state="loading"], [data-state="success"])):hover::before,
.site :where(.searchbar:hover) .btn.btn--primary:not(:where([aria-disabled="true"], .is-loading, .is-success))::before {
  content: "";
  position: absolute; inset: -1px; padding: 1px; border-radius: inherit;
  background: radial-gradient(ellipse at center, rgba(255,255,255,.5), #FFFFFF);
  -webkit-mask: linear-gradient(#FFFFFF 0 0) content-box, linear-gradient(#FFFFFF 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):focus-visible,
.site .equipment__switch:focus-visible ~ .equipment__toggle.btn {
  outline: none; background-color: rgba(140,168,251,.3); color: #494949; border: 1px solid #8CA8FB;
  --button-surface: rgba(140,168,251,.3);
}
.site .btn.btn--primary:not(:where(.kontur-host *, .react-ui *)):focus-visible,
.site :where(.searchbar:focus-visible) .btn.btn--primary {
  background-color: #8CA8FB; color: #F7F0E6; border-color: transparent;
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):focus-visible::before,
.site :where(.searchbar:focus-visible) .btn::before,
.site .equipment__switch:focus-visible ~ .equipment__toggle.btn::before { content: none; }
.site .btn:not(:where(.kontur-host *, .react-ui *, :disabled, [aria-disabled="true"], .is-loading, .is-success, [data-state="loading"], [data-state="success"])):is(:active, .is-pressed) {
  background-color: var(--button-pressed-bg); color: var(--button-pressed-text); border-color: var(--button-pressed-border);
  --button-surface: var(--button-pressed-bg);
}
.site .btn.btn--primary:not(:where(.kontur-host *, .react-ui *, :disabled, [aria-disabled="true"], .is-loading, .is-success, [data-state="loading"], [data-state="success"])):is(:active, .is-pressed),
.site :where(.searchbar:active) .btn.btn--primary:not(:where([aria-disabled="true"], .is-loading, .is-success)) {
  background-color: var(--button-pressed-bg); color: var(--button-pressed-text); border-color: var(--button-pressed-border);
  --button-surface: var(--button-pressed-bg);
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(:active, .is-pressed)::before,
.site :where(.searchbar:active) .btn::before { content: none; }
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(:disabled, [aria-disabled="true"]) {
  background-color: #E0D9C9; color: #494949; border-color: transparent; pointer-events: none;
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(.is-loading, [data-state="loading"]) {
  background-color: rgba(132,127,87,.2); color: #494949; border-color: transparent; pointer-events: none;
  --button-surface: transparent;
}
.site .btn:is(.btn--outline, .btn--ghost):not(:where(.kontur-host *, .react-ui *)):is(.is-loading, [data-state="loading"]) {
  background-color: transparent; border-color: rgba(132,127,87,.3);
}
.site .btn.btn--ghost:not(:where(.kontur-host *, .react-ui *)):is(.is-loading, [data-state="loading"]) { border-color: transparent; }
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(.is-loading, [data-state="loading"])::after {
  content: ""; position: static; inset: auto; flex: none;
  box-sizing: border-box; width: 1em; height: 1em; min-height: 0;
  border: 2px solid #847F57; border-right-color: transparent; border-radius: 50%;
  animation: btn-spin .8s linear infinite;
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(.is-success, [data-state="success"]) {
  background-color: #847F57; color: #F7F0E6; border-color: transparent; pointer-events: none;
  --button-surface: transparent;
}
.site .btn:is(.btn--outline, .btn--ghost):not(:where(.kontur-host *, .react-ui *)):is(.is-success, [data-state="success"]) {
  background-color: transparent; color: #494949; border-color: #847F57;
}
.site .btn.btn--ghost:not(:where(.kontur-host *, .react-ui *)):is(.is-success, [data-state="success"]) { border-color: transparent; }
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(.is-success, [data-state="success"])::after {
  content: ""; position: static; inset: auto; display: inline-block; flex: none;
  box-sizing: border-box; width: 1.2em; height: 1.2em; min-height: 0;
  border: 0; border-radius: 0; background-color: currentColor;
  --success-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11.5' fill='none' stroke='black'/%3E%3Cpath d='m7.5 12 3 3 6-6' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask: var(--success-icon) center / contain no-repeat;
  mask: var(--success-icon) center / contain no-repeat;
  animation: none;
}
.site .btn:not(:where(.kontur-host *, .react-ui *)):is(.is-loading, .is-success, [data-state="loading"], [data-state="success"], :disabled, [aria-disabled="true"])::before { content: none; }
@media (prefers-reduced-motion: reduce) {
  .site .btn:is(.is-loading, [data-state="loading"])::after { animation: none; }
}
@media (max-width: 699px) {
  .site .cookie-accept.btn { min-height: 27px; font-size: 9px; line-height: 11px; }
  .site [data-request-form] .btn { font-size: 16px; line-height: 20px; min-height: 44px; padding: 11px 16px; }
  .site [data-request-form] .btn:is(.is-loading, .is-success) { padding-inline: 0; }
}


/* Общие состояния CTA, включая шапку, подвал и карточки акций. */
.site .btn.nearby-more,
.site .about__text .btn.btn--outline { background-color: #F7F0E6; color: #494949; border: 1px solid #9B5026; }
/* Растровые иконки содержат собственную серую подложку. В покое файл
   сохраняется; при взаимодействии blend отделяет значок от подложки. */
.site a.socials__item { transition: background-color .2s ease; }
@media (hover: hover) and (pointer: fine) {
.site a.socials__item:hover { background-color: #E5D0C0; }
}
@media (hover: hover) and (pointer: fine) {
.site a.socials__item:hover img { filter: grayscale(1) contrast(3); mix-blend-mode: multiply; }
}
.site a.socials__item:is(:active, .is-pressed) { background-color: #9B5026; }
.site a.socials__item:is(:active, .is-pressed) img { filter: none; mix-blend-mode: normal; }
.site a.socials__item:focus-visible { outline: 2px solid #9B5026; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .site a.socials__item { transition: none; } }
@media (hover: hover) and (pointer: fine) {
.site :is(.btn.nearby-more, .about__text .btn.btn--outline):hover { background-color: #E5D0C0; }
}
.site :is(.btn.nearby-more, .about__text .btn.btn--outline):focus-visible { background-color: rgba(140,168,251,.3); color: #494949; border-color: #8CA8FB; --button-surface: rgba(140,168,251,.3); }
.site :is(.btn.nearby-more, .about__text .btn.btn--outline):is(:active, .is-pressed) { background-color: var(--button-pressed-bg); color: var(--button-pressed-text); border-color: var(--button-pressed-border); --button-surface: var(--button-pressed-bg); }

/* Six shared states, independent of viewport. Type is fixed on creation. */
.site {
  --button-grey: #494949;
  --button-pale-grey: #D5CFC7;
  --button-orange: #9B5026;
  --button-light: #F7F0E6;
}
.button--type-a { --button-pressed-bg: var(--button-grey); --button-pressed-text: var(--button-light); --button-pressed-border: var(--button-grey); }
.button--type-b { --button-pressed-bg: var(--button-pale-grey); --button-pressed-text: var(--button-grey); --button-pressed-border: var(--button-grey); }
.button--type-c { --button-pressed-bg: var(--button-pale-grey); --button-pressed-text: var(--button-grey); --button-pressed-border: var(--button-pale-grey); }
.button--type-d, .button--type-e, .button--type-f { --button-pressed-bg: var(--button-orange); --button-pressed-text: var(--button-light); --button-pressed-border: var(--button-orange); }
.site [data-button-type] { box-sizing: border-box; }
/* The booking button and its label share the same pill-shaped surface. */
.site .searchbar--cta-only { border-radius: var(--radius-pill); }
.site .btn.btn--outline:not(:where(.kontur-host *, .react-ui *, .house__more)) {
  background-color: #F7F0E6;
  border-radius: var(--radius-pill);
}
.site :is(button, summary, .btn, [role="button"], .socials__item)[data-button-type]:is(:active, .is-pressed):not(:disabled, [aria-disabled="true"]) {
  background-color: var(--button-pressed-bg); background-image: none;
  color: var(--button-pressed-text); border-color: var(--button-pressed-border);
  opacity: 1; filter: none; backdrop-filter: none; mix-blend-mode: normal;
  transition-property: transform; --button-surface: var(--button-pressed-bg);
}
.site [data-button-type="b"]:is(:active, .is-pressed) { border-width: 1px; border-style: solid; }
.site [data-button-type="c"] { border: 0; }
.site [data-button-type="f"]:is(:active, .is-pressed) { border-width: 1px; border-style: solid; }
.site [data-button-type]:is(:active, .is-pressed)::before { background-image: none; opacity: 1; filter: none; mix-blend-mode: normal; }
.site [data-button-type]:focus-visible { outline: 2px solid #8CA8FB; outline-offset: 3px; }
@media (max-width: 699px) {
  .site.page-home .about__text .btn.home-about-more:not(:is(:focus-visible, :active, .is-pressed, .is-loading, .is-success, [data-state="loading"], [data-state="success"], :disabled, [aria-disabled="true"])) {
    background-color: transparent;
    color: #F7F0E6;
  }
}
@media (hover: hover) and (pointer: fine) {
  .site [data-button-type]:not(:disabled, [aria-disabled="true"]):hover { background-color: #E5D0C0; color: #494949; }
  .site .lightbox__nav[data-button-type]:hover { background-color: #9B5026; color: #F7F0E6; }
}