/* Fixes on top of the Webflow stylesheet.

   Layers, bottom to top: page content → header → menu → photo viewer.
   Webflow mixed these up: the header was 99 on light pages and 9999 on dark ones, while inside the page cards, links,
   before/after labels and photos used 99–999 — so photos slid over the header, header clicks landed on cards, the dark
   header covered the open menu (999) and the photo viewer (2000). The page content is now one layer: whatever z-index
   its parts have, they stay under the header. */
body > .main, body > .footer { isolation: isolate; }
.header, .header.dark { z-index: 1000; }
.pop_up_menu { z-index: 10000; }
.w-lightbox-backdrop { z-index: 100000; }

/* Header: one height everywhere and no jumping. Webflow animated it on scroll (8→5rem on light pages, 7→4rem on dark
   ones) and pages started their content at different offsets. 5.5rem is where content starts on the dark pages.
   Light pages keep a transparent header over the first screen; site-header.js darkens it once the page is scrolled. */
.header .header_wrapper { height: 5.5rem !important; }
.header { transition: background-color .35s ease; }
.header.is-scrolled { background-color: #605c52 !important; }
/* Back at the top, Webflow's scroll animation left its dark colour inline; the light pages clear it */
.header:not(.dark):not(.is-scrolled) { background-color: transparent !important; }

/* Menu: the photo next to the menu fills the screen height at one width for every item */
.navigationimage1 { top: 0; bottom: auto; height: 100vh; height: 100dvh; width: 20vw; overflow: hidden; }
.navigationimage1 img { width: 100%; height: 100%; object-fit: cover; }

/* Hover: the photo slowly zooms in, like the project cards on the home page */
.service_img { position: relative; overflow: hidden; }
.service_img::before { content: ""; position: absolute; inset: 0; background: inherit; transition: transform .9s cubic-bezier(.2, .6, .2, 1); }
.service:hover .service_img::before { transform: scale(1.06); }
.cover_thumb img { transition: transform .9s cubic-bezier(.2, .6, .2, 1); }
.gallery_link_block:hover .cover_thumb img { transform: scale(1.06); }
.title_gallety_text { transition: opacity .3s; }
.gallery_link_block:hover .title_gallety_text { opacity: .65; }

/* Contacts: Webflow recoloured every number in the block at once; now only the one under the cursor */
.contact_block .service_text.white.gap06 { color: #fff !important; transition: color .3s; }
.contact_block a:hover .service_text, .contact_block:has(> .absolute_link:hover) .service_text { color: #c9bfae !important; }

/* Before/after slider (BeerSlider): tall portrait pairs were taller than the screen; keep them within it, centred */
.before_after_content { justify-content: center; }
.beer-slider > img, .beer-reveal > img { max-height: calc(100vh - 160px); object-fit: cover; object-position: center; }

/* Privacy policy link in the footer is hidden until there is a policy page */
[data-k="site/footer:8"], .devider_nav:has(+ [data-k="site/footer:8"]) { display: none; }

/* «Про нас» on phones: the title block kept its desktop offset and width (9.75rem + 37.5rem) and was cut off */
@media screen and (max-width: 767px) {
  .contentaboutustitletext:not(.proetuemo) { left: 1.5rem; right: 1.5rem; width: auto; bottom: 2.5rem; }
}

/* Burger: on hover (tap on phones) the three lines trade lengths, one after another; the menu's ✕ turns */
.mennu_btn { cursor: pointer; }
.mennu_btn rect { transform-box: fill-box; transform-origin: left center; transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.mennu_btn rect:nth-child(2) { transition-delay: .05s; }
.mennu_btn rect:nth-child(3) { transition-delay: .1s; }
.mennu_btn:hover rect:nth-child(1), .mennu_btn:active rect:nth-child(1) { transform: scaleX(.57); }
.mennu_btn:hover rect:nth-child(2), .mennu_btn:active rect:nth-child(2) { transform: scaleX(.8); }
.mennu_btn:hover rect:nth-child(3), .mennu_btn:active rect:nth-child(3) { transform: scaleX(1.76); }
.menuheaderinnerpopup .close { cursor: pointer; }
.menuheaderinnerpopup .close svg { transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.menuheaderinnerpopup .close:hover svg { transform: rotate(90deg); }

/* Project photo grid: every tile is filled (cropped to the centre) so wide and tall photos line up;
   the whole photo opens in the viewer. Same slow zoom on hover as the other cards. */
.lightbox-link img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .9s cubic-bezier(.2, .6, .2, 1); }
.lightbox-link:hover img { transform: scale(1.06); }
@media screen and (max-width: 991px) {
  .lightbox-link { height: auto; aspect-ratio: 3 / 2; }
}

/* Project page: no «Фотогалерея» heading above the photos — the grid speaks for itself */
.gallery_content > .gallety_subtitle { display: none; }