:root {
  --pad-left-big: 28%;
  --pad-left-small: 15%;
  --pad-right-small: 20px;
  --spacer: 30px;
  --pad-side: 4px;
  --menu-clr-white: rgba(255,255,255,1);
  --menu-clr-white-alfa: rgba(255,255,255,.5);
  --menu-clr-black: rgba(0,0,0,1);
  --menu-clr-black-alfa: rgba(0,0,0,.5);
}

body {
  -webkit-font-smoothing: antialiased !important;
}

/* ============================= */
/*            Gallery            */
/* ============================= */

.w-richtext .custom-gallery-wrapper .custom-gallery {
  width: 100%;
  height: 800px;
  margin: 60px 0;
}

/* card Flickity */
.gallery-cell {
  height: 100%;
  width: auto;   
  margin-right: 4px; /* GAP */
  user-select: none;
}

/* скрываем нативный скролл на случай fallback */
.custom-gallery::-webkit-scrollbar { display: none; }
.custom-gallery { -ms-overflow-style: none; scrollbar-width: none; }

/*---GALLERY DOTS---*/  
.custom-gallery .flickity-page-dots{
  bottom:-16px;    /* SPACER */
}

.custom-gallery .flickity-page-dots .dot{
  width:26px; 
  height:3px;
  margin:0 2px; 
  border-radius:0;
  background:#000;
  opacity:.2;
  transition:opacity .3s;
}

.custom-gallery .flickity-page-dots .dot.is-selected {
  opacity: 1;
}

/* ============================= */
/*      Rich Text with alt       */
/* ============================= */

/* WIDE */
.w-richtext > p img[alt="wide"],
.w-richtext > figure img[alt="wide"] {
  display: block;
  width: 100%;
  max-width: 3000px;
  height: auto;
}

/* VERICAL */
.w-richtext > p img[alt="vertical"],
.w-richtext > figure img[alt="vertical"] {
  height: auto;
  max-width: 3000px;
}

/* HORIZONTAL */
.w-richtext > p img[alt="horizontal"],
.w-richtext > figure img[alt="horizontal"] {
  display: block;
  height: auto;
  max-width: 3000px;
}

.rt-wrapper--wide {
  padding: 0;
}

.rt-wrapper--vertical {
  padding: 0 20% 0 var(--pad-left-big);
}

.rt-wrapper--horizontal {
  padding: 0 0 0 var(--pad-left-big);
}

figure {
  margin: 60px 0;
}

/*---PROJECT and ARTICLE---*/  
.cms_content p {
  margin: var(--spacer) 0 var(--spacer) var(--pad-left-big);
  max-width: 700px;
}

.cms_content h3 {
  margin-left: var(--pad-left-big);
}
.w-richtext figure img {
  /*padding: var(--spacer) 0 var(--spacer);*/
}

blockquote {
  font-size: var(--blockquote--size);
  line-height: var(--blockquote--line-height);
  letter-spacing: var(--blockquote--letter-spacing);
  margin: calc(var(--spacer) + 40px) 20px calc(var(--spacer) + 60px) 20px;
  max-width: 1200px;
  padding: 0;
  border: none;
}

/*-----------------------------------------------Mobile-----------------------------------------------*/  

@media (max-width: 768px) {
  .w-richtext .custom-gallery-wrapper .custom-gallery {
    width: 100%;
    height: 280px;
    margin: 40px 0;
  }
  .cms_content p {
    margin: var(--spacer) var(--pad-right-small) var(--spacer) var(--pad-left-small);
    max-width: 700px;
  }
  .rt-wrapper--vertical {
    padding: 0 0 0 var(--pad-left-small);
  }
  .rt-wrapper--horizontal {
    padding: 0 0 0 var(--pad-left-small);
  }
}

/* ============================= */
/*    Main navigation: white     */
/* ============================= */
.menu_item,
.footer_item{
  display:inline-block;
}
.label{
  display:inline-block;
  transition:color .2s ease, transform .2s ease;
  will-change:color, transform;
  color:var(--menu-clr-white-alfa);
}
.menu_item:hover .label,
.menu_item:focus .label{
  transform:translateX(16px);
  color:var(--menu-clr-white);
}

/* Стандартный активный пункт (точное совпадение страницы) */
.nav_menu .w--current .label {
  color:var(--menu-clr-white);
  transform:translateX(16px);
}

/* Родительские разделы на вложенных страницах (белый фон) */
.menu_item.section-active .label {
  color:var(--menu-clr-white);
  transform:translateX(0);
}

/* ИСПРАВЛЕННОЕ поведение при ховере на меню */
/* Убираем стили для .nav_menu:hover и используем только прямое наведение */

/* Когда НЕ наводим на активный пункт, но наводим на другие пункты */
.nav_menu .menu_item:hover ~ .w--current .label,
.nav_menu .menu_item:hover ~ .section-active .label {
  transform: translateX(0);
  color:var(--menu-clr-white-alfa);
}

/* Прямое наведение на активный пункт возвращает его стили */
.nav_menu .w--current:hover .label {
  transform: translateX(16px);
  color:var(--menu-clr-white);
}
.nav_menu .section-active:hover .label {
  transform: translateX(16px);
  color:var(--menu-clr-white);
}

/*--- home menu container white ---*/
.container_home .label,
.footer_home .label {
  color:var(--menu-clr-white);
}
/*--- footer navigation white ---*/ 
.footer_item:hover .label,
.w-nav-brand {
  color:var(--menu-clr-white);
}

/* ============================= */
/*    Main navigation: black     */
/* ============================= */ 
.container_light .label,
.container-info .label,
.footer_light .label 
{
  display:inline-block;
  transition:color .2s ease, transform .2s ease;
  will-change:color, transform;
  color:var(--menu-clr-black-alfa);
}
.container_light .menu_item:hover .label,
.container_light .menu_item:focus .label,
.container-info .menu_item:hover .label,
.container-info .menu_item:focus .label
{
  color:var(--menu-clr-black);
}

/* Стандартный активный пункт (светлый фон) */
.container_light .nav_menu .w--current .label,
.container-info .nav_menu .w--current .label 
{
  color:var(--menu-clr-black);
}

/* Родительские разделы на вложенных страницах (светлый фон) */
.container_light .menu_item.section-active .label, 
.container-info .menu_item.section-active .label
{
  color:var(--menu-clr-black);
  transform:translateX(0);
}

/* Когда НЕ наводим на активный пункт, но наводим на другие пункты */
.container_light .nav_menu .menu_item:hover ~ .w--current .label,
.container_light .nav_menu .menu_item:hover ~ .section-active .label, 
.container-info .nav_menu .menu_item:hover ~ .w--current .label,
.container-info .nav_menu .menu_item:hover ~ .section-active .label
{
  color:var(--menu-clr-black-alfa);
  transform: translateX(0);
}

/* Прямое наведение на активный пункт возвращает его стили */
.container_light .nav_menu .w--current:hover .label,
.container-info .nav_menu .w--current:hover .label
{
  color:var(--menu-clr-black);
}

.container_light .nav_menu .section-active:hover .label, 
.container-info .nav_menu .section-active:hover .label
{
  transform: translateX(16px);
  color:var(--menu-clr-black);
}

/*---footer navigation black---*/ 

.footer_light .footer_item:hover .label
{
  color:var(--menu-clr-black);
}

.container_light .w-nav-brand,
.container-info .w-nav-brand
{
  color:var(--menu-clr-black);
}

/* ============================= */
/*          Mobile menu          */
/* ============================= */

/* .menu-trigger (логотип) */
.menu-trigger {
  position: fixed;
  left: 50%;
  bottom: 23px;
  transform: translateX(-50%);
  z-index: 10;                    /* логотип над всем */
  -webkit-tap-highlight-color: transparent;
}

/* .menu-overlay (контейнер) */
.menu-overlay {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9;                     /* чуть ниже логотипа */
  display: flex;
  justify-content: center;
  align-items: flex-end;          /* прижать к низу */
  padding-bottom: 130px;          /* смещение над логотипом */
}

/* .overlay-bg (SVG-фон) */
.menu-overlay .overlay-bg {
  position: absolute;
  bottom: 20px;
  left: 50%;
  width: 93px;
  height: 76px;
  transform: translateX(-50%) scale(1);
  transform-origin: center center;
  transition: transform .45s ease 0s;  /* без delay */
  z-index: 0;                          /* фон под меню */
}

/* .menu-container (весь блок с пунктами) */
/* — базовое состояние: мгновенно спрятано */
.menu-overlay .menu-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: 0 8px;
  opacity: 0;
  transform: translateY(40px);
  pointer-events: none;
  transition:
    opacity 0.25s ease 0s,
    transform 0.25s ease 0s;          /* сразу, без delay */
  z-index: 1;                          /* над фоном, под логотипом */
}

/* === Открытое состояние === */
.menu-overlay.open {
  pointer-events: auto;
}

/* — растягиваем фон сразу при open */
.menu-overlay.open .overlay-bg {
  transform: translateX(-50%) scale(20);
}

/* — появление меню с delay ровно 0.4s */
.menu-overlay.open .menu-container {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0.4s;            /* задержка перед появлением */
}

/* Основные пункты */
.menu-main {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;            /* отступ между ссылками */
}
.menu-main a {
  font-size: 60px;
  letter-spacing: -2px;
  line-height: 40px;
  color: #000;
  text-decoration: none;
}

/* Дополнительные блоки в две колонки */
.menu-extra {
  display: flex;
  gap: 30px;
  width: 100%;
  margin-top: 3rem;
}
.menu-extra .column {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.menu-extra .column a {
  font-size: 1rem;
  color: #444;
  text-decoration: none;
}

/* Активный пункт меню */
.menu-container .w--current {
  text-decoration: underline;
}
