/* * Behaviours that used to need JavaScript, done in CSS. * * Loaded LAST, after every other stylesheet, so these rules win without * !important except where noted. * * Every value here was measured on the rendered page — the carousel's 4/2/1 * slides and 10px gap, the menu rules, the sticky offsets. Nothing is guessed. * * Breakpoints: tablet <=1024px, mobile <=767px. */ /* --------------------------------------------------------------------------- * 1. Sticky header * * The header container .elementor-element-f12ec12 — logo, nav, search — pins to * the top of the viewport on scroll, while the promo strip above it scrolls * away. Measured on the reference rendering: position fixed, top 0, z-index 99. * * position:sticky ON THAT CONTAINER DOES NOT WORK, which is what shipped here * and why the header scrolled away instead of pinning. A sticky element is * clamped to its parent's padding box, and its parent is
, whose height * is exactly the header's own height — so there is zero distance to travel. It * was correctly computed as position:sticky and still scrolled off, measured at * top:-1467px after a 1500px scroll. No overflow ancestor involved. * * The fix is to stick the
itself, which is a child of and so has * the whole document to travel, and to offset it upwards by the height of the * promo strip. The strip slides out of view and the nav bar comes to rest at * top:0 — the same result, without script. * *
is a bare wrapper: transparent, no padding, margin, border or * background of its own (all of that lives on the two inner containers), so * making it the positioned element changes nothing but the stacking. * * The two offsets are the strip's measured height, not guesses: 33px from 768px * up, 36px below it — the mobile breakpoint. Verified at 14 viewport widths. * * Known limit: below ~345px the strip's own text wraps to two lines and grows to * 69px, leaving a sliver of it visible while pinned. Not worth a third * breakpoint — the wrap point moves whenever that copy is edited, so the media * query would silently go stale. Cosmetic, and only on viewports narrower than * an iPhone SE. * ------------------------------------------------------------------------- */ .elementor-location-header { position: sticky; top: -33px; z-index: 100; } @media (max-width: 767px) { .elementor-location-header { top: -36px; } } /* Same deal in the single-post sidebar: the "Search for apartments" widget carries * {"sticky":"top","sticky_offset":130,"sticky_parent":"yes"}, so it rides down * with the article until the sidebar column ends. */ .elementor-33185 .elementor-element-7d178ad { position: sticky; top: 130px; } /* --------------------------------------------------------------------------- * 2. Mobile menu toggle * * The nav has NO submenus — three flat items — so smartmenus was only ever * opening the burger menu. Elementor's CSS already does the animation; its JS * merely adds .elementor-active to the toggle. extract-chrome.mjs rewrites the * toggle into +