/* Savonia 2026-11-03 – main menu (Smartwave mega menu): desktop + sticky + mobile side menu, header logo/search alignment.
   Loaded on every page after the Porto CSS (Savonia_Menu, ?v=filemtime). URLs, items and their order are unchanged.
   The top items keep their Porto/savonia-rail side padding (992–1279 / 1280–1399px compact rules stay in savonia-rail.css). */
:root {
    --sv-menu-bar: #e9f2d2;
    --sv-menu-ink: #4f6b10;      /* dark green for text on light green: 5.6:1 on --sv-green-soft */
    --sv-menu-new: #4f7a12;      /* "NEW" pill, white text 5.1:1 */
    --sv-menu-hot: #c2255c;      /* "HOT!" pill, white text 5.6:1 */
}

/* ---------- labels (HOT! / NEW): small pills, no speech-bubble tail ---------- */
.main-nav .menu span.cat-label, .fixed-header .menu span.cat-label, div.mobile-nav .sw-mobile-menu span.cat-label {
    padding: 2px 6px !important; border-radius: 999px !important; font: 700 9px/1.1 "Open Sans", Arial, sans-serif !important;
    letter-spacing: .05em; text-transform: uppercase; color: #fff !important; box-shadow: 0 0 0 2px #fff;
}
.main-nav .menu span.cat-label:before, .fixed-header .menu span.cat-label:before, div.mobile-nav .sw-mobile-menu span.cat-label:before { display: none !important; }
.main-nav .menu span.cat-label-label1, .fixed-header .menu span.cat-label-label1, div.mobile-nav .sw-mobile-menu span.cat-label-label1 { background: var(--sv-menu-new) !important; }
.main-nav .menu span.cat-label-label2, .fixed-header .menu span.cat-label-label2, div.mobile-nav .sw-mobile-menu span.cat-label-label2 { background: var(--sv-menu-hot) !important; }

/* ---------- desktop + sticky (≥992px) ---------- */
@media (min-width: 992px) {
    /* header: logo, search and icons on one centre line; search a little smaller (42px instead of 48px) */
    .header-container.type4 .header.container { align-items: center; gap: 40px; }
    .header-container.type4 .search-area { height: auto; max-width: 600px; margin: 0 auto; align-self: center; }
    .header-container.type4 .cart-area { margin-left: 0; }
    .header-container.type4 .header .form-search { height: 42px; border-radius: 21px; }
    .header-container.type4 .header #search_mini_form .form-search input#search { height: 39px; padding: 0 64px 0 20px; font-size: 14.5px; line-height: 39px; }
    .header-container.type4 .header .form-search button.button { top: 3px; right: 3px; width: 52px; height: 33px; border-radius: 17px; line-height: 33px; }
    .header-container.type4 .header .form-search button.button i { font-size: 17px; line-height: 33px; }

    /* bar */
    .main-nav .menu-wrapper { background: var(--sv-menu-bar); border-radius: 10px; }
    .main-nav ul.menu > li { margin: 0 2px -1px 0; border-radius: 8px; background: transparent !important; transition: background-color .15s ease; }
    .main-nav ul.menu > li.fl-right { margin: 0 0 -1px 2px; }
    .main-nav ul.menu > li > a { color: var(--sv-text) !important; font-weight: 600; letter-spacing: .02em; border-radius: 8px; }
    /* current category: light green + bold; hover / open: Savonia green (dark text keeps 9:1) */
    .main-nav ul.menu > li.act { background: #d6e9a3 !important; }
    .main-nav ul.menu > li.act > a { font-weight: 700; }
    .main-nav ul.menu > li:hover, .main-nav ul.menu > li.sv-open { background: var(--sv-green) !important; }
    .main-nav ul.menu > li.sv-open, html.sv-menu-js .main-nav ul.menu > li.sv-open:hover { border-radius: 8px 8px 0 0; }
    .main-nav ul.menu > li > a:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: -3px; }

    /* chevron (CSS instead of the Porto icon font): down, up when open */
    .main-nav ul.menu > li.menu-full-width > a:after, .main-nav ul.menu > li.menu-static-width > a:after, .main-nav ul.menu > li.menu-parent-item > a:after {
        content: "" !important; position: absolute; top: 50% !important; right: 14px; width: 6px; height: 6px; margin: -5px 0 0 !important;
        border: solid currentColor; border-width: 0 1.6px 1.6px 0; font-family: inherit; transform: rotate(45deg); transition: transform .18s ease;
    }
    .main-nav ul.menu > li.sv-open > a:after { margin-top: -1px !important; transform: rotate(-135deg); }

    /* panel: white card under the bar, 3px green top edge that joins the open item */
    .main-nav ul.menu > li > .nav-sublist-dropdown {
        border-top: 3px solid var(--sv-green) !important; border-radius: 0 0 14px 14px; background: #fff !important;
        box-shadow: 0 22px 40px -18px rgba(47, 47, 47, .35), 0 0 0 1px rgba(47, 47, 47, .06);
    }
    html.sv-menu-js .main-nav ul.menu > li > .nav-sublist-dropdown { display: none !important; }
    html.sv-menu-js .main-nav ul.menu > li.sv-open > .nav-sublist-dropdown { display: block !important; animation: sv-menu-in .16s ease-out; }
    .main-nav ul.menu > li > .nav-sublist-dropdown { padding: 0 !important; }
    .main-nav ul.menu > li > .nav-sublist-dropdown > .container { padding: 26px 22px 28px !important; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .mega-columns { margin: 0; display: flex; align-items: flex-start; gap: 20px; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .mega-columns > div { float: none; width: auto !important; padding: 0; }
    /* fixed-width panel (Sapun: 330px in the category settings): room for one column of names + the picture */
    .main-nav ul.menu > li.menu-static-width > .nav-sublist-dropdown { width: 560px !important; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .mega-columns:before, .main-nav ul.menu > li > .nav-sublist-dropdown .mega-columns:after { content: none; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .block1 { flex: 1 1 auto; width: auto; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .block1 > .row { margin: 0; }
    /* columns: an even grid instead of the 25% floats (same reading order) */
    .main-nav ul.menu > li > .nav-sublist-dropdown .block1 > .row > ul {
        display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 2px 16px; margin: 0; padding: 0;
    }
    .main-nav ul.menu > li > .nav-sublist-dropdown .block1 > .row > ul > li { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
    .main-nav ul.menu > li > .nav-sublist-dropdown a.level1 {
        display: flex !important; align-items: center; min-height: 40px; margin: 0 !important; padding: 8px 12px !important; border-radius: 8px;
        color: var(--sv-text) !important; font-size: 14.5px; font-weight: 500; line-height: 1.3; letter-spacing: 0; text-transform: none !important;
        transition: background-color .12s ease, color .12s ease;
    }
    .main-nav ul.menu > li > .nav-sublist-dropdown a.level1 > span { display: inline; }
    .main-nav ul.menu > li > .nav-sublist-dropdown a.level1:hover, .main-nav ul.menu > li > .nav-sublist-dropdown a.level1:focus-visible {
        background: var(--sv-green-soft); color: var(--sv-menu-ink) !important; text-decoration: none; outline: 0;
    }
    .main-nav ul.menu > li > .nav-sublist-dropdown a.level1:focus-visible { box-shadow: inset 0 0 0 2px var(--sv-menu-ink); }
    .main-nav ul.menu > li > .nav-sublist-dropdown li.act > a.level1 { background: var(--sv-green-soft); color: var(--sv-menu-ink) !important; font-weight: 700; }
    .main-nav ul.menu > li > .nav-sublist-dropdown a.level1 span.cat-label { position: relative !important; top: -1px !important; right: auto !important; left: auto !important; margin: 0 0 0 7px !important; box-shadow: none; white-space: nowrap; }
    /* category picture on the right of some panels */
    /* (the CMS gives the picture position:absolute + a fixed top tuned for the old panel): in the flow, flush in the panel's bottom-right corner */
    .main-nav ul.menu > li > .nav-sublist-dropdown .right-mega-block { flex: 0 0 auto; width: auto; align-self: flex-end; margin: 0 -22px -28px auto; }
    .main-nav ul.menu > li > .nav-sublist-dropdown .right-mega-block img {
        position: static !important; display: block; height: 120px !important; width: auto !important; z-index: auto !important; border-radius: 0 0 14px 0 !important;
    }
}
/* 992–1279px: savonia-rail.css gives the items 9px (sticky: 7px) side padding so the bar stays on one line – no room for the chevron */
@media (min-width: 992px) and (max-width: 1279px) {
    .main-nav ul.menu > li > a:after { display: none !important; }
}
/* up to 1399px the bar has no spare width (sticky: room for the cart): no extra letter spacing / item gap */
@media (min-width: 992px) and (max-width: 1399px) {
    .main-nav ul.menu > li, .main-nav ul.menu > li.fl-right { margin-left: 0; margin-right: 0; }
    .main-nav ul.menu > li > a { letter-spacing: 0; }
}
@media (min-width: 1400px) and (max-width: 1599px) {
    .header-container.type4.sticky-header .main-nav ul.menu > li, .header-container.type4.sticky-header .main-nav ul.menu > li.fl-right { margin-left: 0; margin-right: 0; }
    .header-container.type4.sticky-header .main-nav ul.menu > li > a { letter-spacing: 0; }
}
@media (min-width: 1280px) and (max-width: 1399px) {
    .header-container.type4.sticky-header .main-nav ul.menu > li > a:after { display: none !important; } /* sticky: 10px padding (round 22) */
}
@keyframes sv-menu-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* ---------- mobile side menu (<992px): light panel, 48px rows, +/− buttons ---------- */
@media (max-width: 991px) {
    .mobile-nav.side-block {
        width: 300px; max-width: 86vw; left: -300px; padding: 0 0 28px !important; background: #fff !important;
        box-shadow: 0 0 36px rgba(47, 47, 47, .22); overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    }
    body.mobile-nav-shown .mobile-nav.side-block { left: 0; }
    body.mobile-nav-shown .page { left: 300px; left: min(300px, 86vw); }
    body.mobile-nav-shown .mobile-nav-overlay { opacity: .3; }

    .sv-mnav__head {
        position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between;
        min-height: 56px; padding: 6px 8px 6px 18px; border-bottom: 3px solid var(--sv-green); background: #fff;
    }
    .sv-mnav__title { color: var(--sv-text); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .sv-mnav__close {
        display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px;
        background: var(--sv-green-soft); color: var(--sv-text); cursor: pointer;
    }
    .sv-mnav__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
    .sv-mnav__close:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: 2px; }

    .mobile-nav .menu-all-pages-container { padding: 0; }
    .mobile-nav .sw-mobile-menu { margin: 0; padding: 0; }
    .mobile-nav .sw-mobile-menu > li { position: relative; margin: 0; border-bottom: 1px solid var(--sv-line); background: #fff; }
    .mobile-nav.side-block .sw-mobile-menu li > a, .mobile-nav.side-block .sw-mobile-menu li.over > a {
        display: flex; align-items: center; gap: 8px; min-height: 48px; margin: 0 !important; padding: 12px 60px 12px 18px !important;
        background: transparent !important; color: var(--sv-text) !important; font-size: 15px; font-weight: 600; line-height: 1.35 !important;
        letter-spacing: .02em; white-space: normal !important; overflow: visible; text-overflow: clip;
    }
    .mobile-nav.side-block .sw-mobile-menu > li.over > a { color: var(--sv-menu-ink) !important; }
    .mobile-nav.side-block .sw-mobile-menu li > a:active { background: var(--sv-green-soft) !important; }
    .mobile-nav.side-block .sw-mobile-menu li > a:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: -3px; }
    .mobile-nav.side-block .sw-mobile-menu li.act > a, .mobile-nav.side-block .sw-mobile-menu li.actParent > a { color: var(--sv-menu-ink) !important; font-weight: 700; }

    /* subcategories: light green block, normal case, 44px rows */
    .mobile-nav.side-block .sw-mobile-menu > li > ul { margin: 0; padding: 4px 0 8px; background: var(--sv-green-soft) !important; }
    .mobile-nav.side-block .sw-mobile-menu > li > ul > li { margin: 0; border: 0; background: transparent !important; }
    .mobile-nav.side-block .sw-mobile-menu > li > ul > li > a {
        min-height: 44px; padding: 10px 18px 10px 30px !important; font-size: 15px; font-weight: 500; letter-spacing: 0; text-transform: none !important;
    }
    .mobile-nav.side-block .sw-mobile-menu > li > ul > li > a:before { display: none !important; }
    .mobile-nav.side-block .sw-mobile-menu > li > ul > li > a > span { display: inline-flex; align-items: center; gap: 8px; }

    /* +/− button (the Porto "open-child"), 44 × 44 */
    .mobile-nav.side-block .sw-mobile-menu li > .open-child {
        position: absolute; top: 2px; right: 8px; z-index: 1; float: none; width: 44px !important; height: 44px !important; margin: 0;
        border: 1px solid #dde9bf; border-radius: 12px; background: var(--sv-green-soft) !important; font-size: 0; cursor: pointer;
    }
    .mobile-nav.side-block .sw-mobile-menu li > .open-child:before, .mobile-nav.side-block .sw-mobile-menu li > .open-child:after {
        content: "" !important; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; margin: -1px 0 0 -8px; border-radius: 2px;
        background: var(--sv-menu-ink) !important; font-family: inherit; line-height: 0; opacity: 1; transition: transform .2s ease;
    }
    .mobile-nav.side-block .sw-mobile-menu li > .open-child:after { transform: rotate(90deg); }
    .mobile-nav.side-block .sw-mobile-menu li.over > .open-child { border-color: var(--sv-green); background: var(--sv-green) !important; }
    .mobile-nav.side-block .sw-mobile-menu li.over > .open-child:before, .mobile-nav.side-block .sw-mobile-menu li.over > .open-child:after { background: var(--sv-text) !important; }
    .mobile-nav.side-block .sw-mobile-menu li.over > .open-child:after { transform: rotate(0deg); }
    .mobile-nav.side-block .sw-mobile-menu li > .open-child:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: 2px; }

    .mobile-nav .sw-mobile-menu span.cat-label { position: static !important; right: auto !important; left: auto !important; margin: 0 !important; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
    .main-nav ul.menu > li, .main-nav ul.menu > li > a:after, .main-nav .nav-sublist-dropdown a.level1,
    .mobile-nav.side-block, .mobile-nav .open-child:before, .mobile-nav .open-child:after { transition: none !important; animation: none !important; }
}


/* ---------- top bar menus, 2026-11-03: "Ai nevoie de ajutor?" (every width) + "Contul meu" (<992px) ----------
   The header HTML is in the Lesti FPC (the same for every visitor): savonia-menu.js builds both menus in the browser and reads
   the signed-in state from the lazy top.links block (html.sv-util-js / html.sv-help-js); nothing user-specific goes into the cache.
   Since 2026-11-03 (TopBar-NoFlash) the buttons are printed by savonia/header.phtml (.sv-top, .sv-top-area) for the first paint.
   Without JS the old "Comenzi telefonice" text and the Porto "Util" stay.
   Loaded before savonia-mobile-header.css and savonia-rail.css: these selectors are one step more specific than theirs. */
.sv-help-js .header-container.type4 .top-links > .sv-help__old { display: none !important; }
.sv-help__short { display: none; }
.sv-util__btn {
    display: inline-flex; align-items: center; gap: 7px; min-height: 44px; margin: 0; padding: 0 12px 0 10px; border: 1px solid #d5dcc0;
    border-radius: 22px; background: #fff; color: var(--sv-text); font: 600 14px/1 "Open Sans", Arial, sans-serif; white-space: nowrap; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.sv-util__btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.sv-util__btn .sv-util__chev { width: 14px; height: 14px; stroke-width: 2.4; transition: transform .2s ease; }
.sv-util__btn:hover, .sv-util__btn[aria-expanded="true"] { border-color: var(--sv-green); background: var(--sv-green-soft); }
.sv-util__btn[aria-expanded="true"] .sv-util__chev { transform: rotate(180deg); }
.sv-util__btn:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: 2px; }

.sv-util__panel {
    position: absolute; top: 100%; z-index: 300; margin-top: 2px; padding: 4px 0; border-radius: 16px;
    background: #fff; box-shadow: 0 14px 40px rgba(47, 47, 47, .22); text-align: left; animation: sv-menu-in .16s ease-out;
}
.sv-util__panel[hidden] { display: none; }
.sv-util__hello { margin: 0; padding: 12px 18px; border-bottom: 1px solid var(--sv-line, #ececec); color: var(--sv-text); font-size: 15px; font-weight: 700; line-height: 1.35; }
.sv-util__list { margin: 0; padding: 4px 0; list-style: none; }
.sv-util__list + .sv-util__list { border-top: 1px solid var(--sv-line, #ececec); }
.sv-util__list li { margin: 0; padding: 0; border: 0; }
.sv-util__list li:before, .sv-util__list li:after { content: none !important; }
.sv-util__list a {
    display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 6px 18px; color: var(--sv-text) !important;
    font-size: 16px; font-weight: 600; line-height: 1.3; text-transform: none; letter-spacing: 0; text-decoration: none !important;
    -webkit-tap-highlight-color: transparent;
}
.sv-util__list a:hover, .sv-util__list a:active { background: var(--sv-green-soft); }
.sv-util__list a:focus-visible { outline: 2px solid var(--sv-menu-ink); outline-offset: -3px; }
.sv-util__list svg { flex: 0 0 24px; width: 24px; height: 24px; fill: none; stroke: var(--sv-green-dark); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sv-util__list small { display: block; color: #666; font-size: 13px; font-weight: 400; }
.sv-util__list em {
    margin-left: auto; min-width: 24px; padding: 2px 8px; border-radius: 12px; background: var(--sv-green-dark); color: #fff;
    font-size: 13px; font-style: normal; font-weight: 700; line-height: 20px; text-align: center;
}
.sv-util__list .sv-util__primary a { justify-content: center; min-height: 48px; margin: 6px 12px; border-radius: 24px; background: var(--sv-green); }
.sv-util__list .sv-util__primary svg { stroke: var(--sv-text); }
.sv-util__list .sv-util__primary a:hover, .sv-util__list .sv-util__primary a:active { background: var(--sv-green-dark); }
.sv-util__list .sv-util__out a { color: #a12a2a !important; }
.sv-util__list .sv-util__out svg { stroke: #a12a2a; }
.sv-util__list .sv-help__wa svg { stroke: #128c4a; }   /* WhatsApp green, 4.6:1 on white */

/* phones and tablets (<992px): help left, "Contul meu" right, both 44px; the menus open as a sheet under the top bar */
@media (max-width: 991px) {
    /* header row: menu | logo | cart on one centre line; the account icon stays desktop-only (the "Contul meu" menu is above) */
    .header-container.type4 .header.container > .logo {
        display: flex; align-items: center; justify-content: center; height: 44px; max-width: calc(100% - 136px); padding: 0;
    }
    .header-container.type4 .header.container .cart-area { top: 10px; right: 6px; display: flex; align-items: center; height: 44px; }
    .header-container.type4 .header.container .cart-area .mini-cart { width: 44px; }
    .header-container.type4 .header.container .cart-area .mini-cart .mybag-link { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; }

    /* .sv-top / .sv-top-area: printed by savonia/header.phtml (first paint); html.sv-*-js: older markup built by the JS */
    .header-container.type4 .top-links.container.sv-top,
    .sv-help-js .header-container.type4 .top-links.container, .sv-util-js .header-container.type4 .top-links.container {
        display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 8px;
    }
    /* the two buttons: 44px tap area, the visible pill (border + background) only 34px high (::before) */
    .sv-util__btn { position: relative; z-index: 0; min-height: 44px; padding: 0 15px; border: 0; background: transparent; }
    .sv-util__btn:before {
        content: ""; position: absolute; top: 5px; right: 0; bottom: 5px; left: 0; z-index: -1;
        border: 1px solid #d5dcc0; border-radius: 17px; background: #fff; transition: background-color .15s, border-color .15s;
    }
    .sv-util__btn:hover, .sv-util__btn[aria-expanded="true"] { background: transparent; }
    .sv-util__btn:hover:before, .sv-util__btn[aria-expanded="true"]:before { border-color: var(--sv-green); background: var(--sv-green-soft); }
    .sv-util__btn:focus-visible { outline: 0; }
    .sv-util__btn:focus-visible:before { outline: 2px solid var(--sv-menu-ink); outline-offset: 2px; }
    .header-container.type4 .top-links.sv-top:before, .header-container.type4 .top-links.sv-top:after, .header-container.type4 .top-links.sv-top > .clearer,
    .sv-help-js .header-container.type4 .top-links.container:before, .sv-help-js .header-container.type4 .top-links.container:after,
    .sv-help-js .header-container.type4 .top-links.container > .clearer,
    .sv-util-js .header-container.type4 .top-links.container:before, .sv-util-js .header-container.type4 .top-links.container:after,
    .sv-util-js .header-container.type4 .top-links.container > .clearer { display: none; }
    .sv-help-js .header-container.type4 .top-links-area { margin-left: auto; }
    .header-container.type4 .top-links-area.sv-top-area,
    .sv-util-js .header-container.type4 .top-links-area { float: none; position: static; margin: 0 0 0 auto; }
    .header-container.type4 .top-links-area.sv-top-area > .top-links-icon, .header-container.type4 .top-links-area.sv-top-area > .links,
    .sv-util-js .header-container.type4 .top-links-area > .top-links-icon, .sv-util-js .header-container.type4 .top-links-area > .links { display: none !important; }
    .header-container.type4 .top-links > .sv-help { position: static; }
    .sv-util__panel { left: 8px; right: 8px; }
}
@media (max-width: 419px) {
    .sv-help__long { display: none; }
    .sv-help__short { display: inline; }
}

/* desktop (≥992px): only the help menu, a small pill on the left of the top bar, menu under it */
@media (min-width: 992px) {
    .top-links-area > .sv-util__btn, #sv-util-panel { display: none !important; }
    /* the button overhangs its 25px float box by 1px each way, so the top bar keeps its 35px height */
    .header-container.type4 .top-links > .sv-help { position: relative; float: left; height: 25px; margin: 0; }
    .sv-help .sv-util__btn { position: relative; top: -1px; min-height: 27px; padding: 0 10px 0 8px; gap: 6px; border-color: #d9dfc7; font-size: 13px; }
    .sv-help .sv-util__btn svg { width: 17px; height: 17px; }
    .sv-help .sv-util__btn .sv-util__chev { width: 12px; height: 12px; }
    .sv-help .sv-util__panel { left: 0; width: 320px; margin-top: 6px; }
    .sv-help .sv-util__list a { min-height: 50px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .sv-util__panel, .sv-util__btn .sv-util__chev { animation: none !important; transition: none !important; } }

/* ---------- r2 2026-11-03 21:00: the bar always stays on one row. With 13 items (Lavanda) "NOU" wrapped to a 2nd row in the
   sticky header (1400–1540px, and at other widths). savonia-menu.js measures the row and adds sv-fit-1…4 to ul.menu only while
   the items would wrap (after load, resize, sticky on/off) – so a new menu item does not break it again. Without JS: unchanged.
   Selectors: 6 classes, one more than the savonia-rail.css sticky rules (5), all !important like those. ---------- */
@media (min-width: 992px) {
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-1 > li { margin-left: 0 !important; margin-right: 0 !important; }
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-1 > li > a { padding-left: 11px !important; padding-right: 11px !important; letter-spacing: 0 !important; }
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-1 > li > a:after { display: none !important; }
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-2 > li > a { padding-left: 8px !important; padding-right: 8px !important; }
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-3 > li > a { padding-left: 6px !important; padding-right: 6px !important; font-size: 13px !important; }
    .header-container.type4 .main-nav .menu-wrapper ul.menu.sv-fit-4 > li > a { padding-left: 5px !important; padding-right: 5px !important; font-size: 12px !important; }
}

/* Savonia 2026-11-04: hamburger icon without FontAwesome (font-awesome.min.css was removed by Frontend-Slim; fa-bars was its only user) */
.header-container .menu-icon .fa-bars{display:inline-block;width:30px;height:30px;font-size:0!important;vertical-align:middle;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.5h18v2.6H3zm0 5.2h18v2.6H3zm0 5.2h18v2.6H3z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.5h18v2.6H3zm0 5.2h18v2.6H3zm0 5.2h18v2.6H3z'/%3E%3C/svg%3E") center/contain no-repeat}
.header-container .menu-icon .fa-bars:before{content:none}
.header-container.type4 .menu-icon a i.fa-bars{vertical-align:top;margin-top:11px}
/* Savonia 2026-11-04 r2: homepage logo is <h1 class="logo"><a class="logo"> (block) - center the SVG inside, mobile only */
@media (max-width:991px){.header-container.type4 .header>.logo .sv-logo{margin-left:auto;margin-right:auto}}