/* Sano's original Hebrew family and category palette. */
.hp_cats.allCats .prod_cat.category h2 {
    font-family: 'Open Sans Hebrew', sans-serif;
    font-size: clamp(16px, 1.4vw, 21px);
    line-height: 1.16;
    font-weight: 700;
    text-wrap: balance;
    margin: 0;
    color: #37b6c8;
}
.hp_cats.allCats .category[id="1123"] h2 { color: #7db629; }
.home .hp_cats.allCats { padding-block: clamp(20px, 2.6vw, 40px); }
.home .hp_cats.allCats > .container {
    --columns: var(--desktop-columns, 6);
    --column-gap: clamp(12px, 2vw, 32px);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: clamp(22px, 2.3vw, 36px) var(--column-gap);
    width: 100%;
    max-width: 1200px;
    padding: 0 16px;
}
.home .hp_cats.allCats > .container::before,
.home .hp_cats.allCats > .container::after { display: none; }
.home .hp_cats.allCats .container > a.prod_cat {
    flex: 0 0 calc((100% + var(--column-gap)) / var(--columns) - var(--column-gap));
    min-width: 0;
    margin: 0;
    padding: 0;
    direction: inherit;
}
.home .hp_cats.allCats .inner_content { margin: 0; }
.home .hp_cats.allCats .category .inner_content .imageWarraper { height: clamp(54px, 5vw, 68px); }
.home .hp_cats.allCats .prod_cat.category h2 { padding: 9px 0 0; }
@media (max-width: 640px) {
    .home .hp_cats.allCats > .container { --columns: 3; --column-gap: 10px; }
}
.mainSlider picture, .mainSlider picture img { display: block; width: 100%; height: auto; }
.mainSlider { opacity: 1; }
.main_slider:not(.slick-initialized) > .slide:not(:first-child) { display: none; }
.hp_cats .inner_content, .site-footer a, .article-box a {
    transition: color 150ms ease, transform 180ms ease-out;
}
@media (hover: hover) {
    .hp_cats a:hover .inner_content { transform: translateY(-3px); }
    .site-footer a:hover { text-decoration: underline; text-underline-offset: .2em; }
}
.has_animate, .animateblock { transition-duration: 220ms !important; }
@keyframes sano-newsletter-arrive {
    from { opacity: 0; translate: 12px 0; }
    to { opacity: 1; translate: 0 0; }
}
#_atPopupSU { animation: sano-newsletter-arrive 180ms ease-out; }
@media (max-width: 1024px) {
    #colophon.site-footer { height: auto; padding-block-start: 28px; }
    #colophon.site-footer > .container {
        display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 24px; padding: 0 24px 24px; max-width: 100%;
    }
    #colophon.site-footer > .container::before, #colophon.site-footer > .container::after { display: none; }
    #colophon.site-footer > .container > div {
        width: auto !important; min-width: 0; margin: 0; float: none; order: 0;
        text-align: start; position: static;
    }
    #colophon .footer_logo img { max-width: 90px; }
    #colophon .footer_menu a { display: inline-block; padding-block: 5px; line-height: 1.45; }
    #colophon .footer_menu h4 { font-size: 17px; }

}
@media (max-width: 640px) {
    #colophon.site-footer > .container { grid-template-columns: repeat(2,minmax(0,1fr)); padding-inline: 16px; gap: 18px; }
    #colophon .credit { line-height: 1.5; height: auto; padding-block: 10px; }
    .entry-content img, .odot_content img, .entry-content iframe { max-inline-size: 100%; }
    .entry-content table { display: block; max-width: 100%; overflow-x: auto; }
    .mainSlider .slick-list { height: auto !important; }
    .mainSlider .slide picture img { object-fit: contain; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    .has_animate, .animateblock, .hp_cats .inner_content, #_atPopupSU, .main_slider .slick-slide {
        animation: none !important; transition-duration: 0s !important;
    }
}
.hp_cats.allCats .container a.prod_cat.category {
    opacity: 1;
    transition: transform 180ms ease-out;
    transition-delay: 0s;
}
@media (max-width: 1024px) {
    .mainSlider .slick-arrow.slick-next { inset-inline-end: 8px; inset-inline-start: auto; }
    .mainSlider .slick-arrow.slick-prev { inset-inline-start: 8px; inset-inline-end: auto; }
    .home .big_video, .home .mainSlider, .home .another_videos { overflow-x: clip; }
    .widget_shopping_cart_live_region.screen-reader-text { left: 0; }
}
@media (max-width: 767px) {
    html[lang^="en"] .mainSlider picture img, html[lang^="ar"] .mainSlider picture img {
        aspect-ratio: 3 / 1; object-fit: cover; object-position: center;
    }
}
/* Off-canvas navigation and slider tracks must stay inside the page viewport. */
@media (max-width: 1024px) {
    html, body { overflow-x: clip; }
    body { position: relative; }
}
#nav .navbar-nav li:hover, #nav .navbar-nav li:focus-within,
#nav .navbar-nav li:hover > a, #nav .navbar-nav li > a:focus-visible {
    background-color: #a6e7ee !important;
    color: #103e48 !important;
}
#nav .navbar-nav > li.about-header,
#nav .navbar-nav > li.about-header > a {
    background-color: #bb202b !important;
    color: #fff !important;
}
#nav .navbar-nav > li.about-header > a:hover,
#nav .navbar-nav > li.about-header > a:focus-visible {
    background-color: #a31925 !important;
    color: #fff !important;
}
.home .another_videos {
    height: auto;
    padding-block: clamp(24px,4vw,52px);
}
.home .videos .slick-track { display: flex; align-items: center; }
.home .videos a.video.fancybox {
    box-sizing: border-box;
    padding: 10px clamp(9px,1.5vw,24px);
    margin-inline: 0;
    height: auto;
}
.sano-video-screen {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    background: #182c34;
    aspect-ratio: 16 / 9;
}
.sano-video-screen img { width: 100%; height: 100%; object-fit: cover; }
.slick-center .sano-video-screen {
    box-shadow: 0 0 0 3px #18353e, 0 8px 18px #14323c38;
}
.slick-center .sano-video-screen::before, .slick-center .sano-video-screen::after {
    content: ""; position: absolute; pointer-events: none;
}
.slick-center .sano-video-screen::before {
    inset: 0; background: linear-gradient(155deg,#ffffff1a,transparent 45%,#0b253e52);
}
.slick-center .sano-video-screen::after {
    inset: 50% auto auto 50%; transform: translate(-50%,-50%);
    width: 48px; height: 48px; border: 1px solid #ffffffb8; border-radius: 50%;
    background: #123642c9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M8 4v16l12-8z'/%3E%3C/svg%3E") 54% center / 21px no-repeat;
}
.home .videos a.video.fancybox span { margin-top: 14px; line-height: 1.35; color: #152f3a; }

@font-face {
    font-family: 'Ella Sans';
    src: url('assets/fonts/EllaSans-Thin.woff2') format('woff2');
    font-weight: 100 200;
    font-display: swap;
}
@font-face {
    font-family: 'Ella Sans';
    src: url('assets/fonts/EllaSans-Regular.woff2') format('woff2');
    font-weight: 300 500;
    font-display: swap;
}
@font-face {
    font-family: 'Ella Sans';
    src: url('assets/fonts/EllaSans-Bold.woff2') format('woff2');
    font-weight: 600 900;
    font-display: swap;
}
html.anova body, html.anova :is(h1,h2,h3,h4,h5,h6,p,button,input,select,textarea),
html.anova #nav .navbar-nav a {
    font-family: 'Ella Sans', Arial, sans-serif !important;
}
@media (min-width: 768px) {
    #nav .navbar-nav > li > a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        line-height: 1.05;
        box-sizing: border-box;
        padding-block: 0;
    }
}
.banner .logo img {
    width: 160px;
    aspect-ratio: 160 / 156;
    height: auto;
    object-fit: contain;
}
.sano-he-mark { background: #ff0000; }
#colophon .footer_logo img {
    width: 103px;
    aspect-ratio: 103 / 101;
    object-fit: contain;
}
#colophon .credit a { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 8px; background: transparent; }
#colophon .credit img { display: block; width: 84px; height: auto; }
.sano-catalog-variants { margin-block: 18px; }
.sano-catalog-variants select { display: block; max-width: 100%; padding: .4em .65em; }
.sano-catalog-variants output { display: block; margin-block: .6em; white-space: pre-line; }

@media (min-width: 768px) and (max-width: 1565px) {
    html[lang^="en"] .banner .top .lang_style_div {
        display: inline-flex;
        margin: 0 266px 0 0;
        gap: 3px;
    }
    html[lang^="en"] .banner .more_links > a:not(.mobile) {
        box-sizing: border-box;
        width: 51px;
        padding-inline: 6px;
        text-align: center;
    }
}
@media (min-width: 1025px) and (max-width: 1275px) {
    .home .mainSlider, .home .another_videos { overflow-x: clip; }
}

@media (max-width: 767px) {
    .banner .bottom > .container {
        min-height: 65px;
    }
    .banner .bottom .container > .logo {
        left: auto;
        right: env(safe-area-inset-right, 0px);
    }
    .banner .bottom .container > .navbar-header.open_menu {
        position: absolute;
        top: 50%;
        left: max(12px, env(safe-area-inset-left, 0px));
        right: auto;
        margin: 0;
        transform: translateY(-50%);
    }
    #nav.navbar-collapse {
        left: 0;
        right: auto;
        margin-inline: 0;
        max-height: calc(100dvh - 65px);
        overflow-y: auto;
        transform: translateX(-101%);
        visibility: hidden;
        transition: transform 220ms ease, visibility 0s 220ms;
    }
    #nav.navbar-collapse.open {
        transform: translateX(0);
        visibility: visible;
        transition-delay: 0s;
    }
    #nav .more_links { position: static; margin: 8px auto; }
}

/* Utility navigation stays in document flow, including on phones. */
header.banner .sano-utility { display: block; background: #fff; padding: 0; border-bottom: 1px solid #e1edef; position: relative; z-index: 11; }
header.banner .sano-utility .sano-utility-inner {
    position: relative; display: flex; align-items: center; justify-content: flex-end;
    gap: 14px; min-height: 46px; padding-block: 3px;
}
.sano-utility-inner::before, .sano-utility-inner::after { display: none; }
html.anova header.banner .top.sano-utility .sano-languages,
.sano-utility .sano-tools { display: flex; align-items: center; gap: 2px; margin: 0; }
.sano-utility .sano-languages .lang_style {
    border-radius: 5px; line-height: 1; padding: 8px 9px; color: #155765;
    background: transparent; text-decoration: none; font-size: 16px;
}
.sano-utility .sano-languages .lang_style[aria-current] { color: #fff !important; background: #146476 !important; }
.sano-utility .sano-tools { border-inline-start: 1px solid #ccdade; padding-inline-start: 10px; }
.sano-tools > a, .sano-tools > button {
    display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; padding: 0;
    background: transparent; color: #145363; border: 0; text-decoration: none; font-size: 20px; line-height: 1;
}
.sano-tools > :is(a,button):hover, .sano-languages > a:hover { background: #d9f2f3; color: #064c59; }
#sano-search:not([hidden]) {
    position: absolute; inset-block-start: 100%; inset-inline-end: 12px; z-index: 120;
    display: flex; gap: 6px; width: min(390px, calc(100% - 24px)); padding: 8px;
    border: 1px solid #b9d5da; border-radius: 10px; background: white; box-shadow: 0 5px 20px #183a4a24;
}
#sano-search input, #sano-search button { padding: 8px 12px; line-height: 1.25; border: 1px solid #9bbfc8; border-radius: 5px; font-size: 17px; }
#sano-search input { flex: 1; width: 0; }
#sano-search button { color: white; background: #145363; }
@media (max-width: 767px) {
    header.banner .sano-utility .sano-utility-inner { justify-content: space-between; gap: 2px; min-height: 42px; padding-inline: 8px; width: 100%; }
    .sano-utility .sano-tools { padding-inline-start: 4px; }
    .sano-tools > a, .sano-tools > button { width: clamp(27px,8.2vw,38px); min-height: 36px; font-size: 18px; }
    .sano-utility .sano-languages .lang_style { padding: 8px 5px; font-size: 15px; }
}
body:not(.acc-on) :is(a,button,[tabindex]):focus:not(:focus-visible) { outline: none !important; }
body :is(a,button,[tabindex]):focus-visible { outline: 3px solid #146476 !important; outline-offset: 2px; }

#home-articles-section.sano-journal { padding: clamp(28px,5vw,70px) 0; background: #f2f7f7; text-align: start; }
#sano-journal-title { margin: 0 0 20px; color: #123d48; line-height: 1.1; font-size: clamp(29px,3.5vw,46px); }
.sano-stories { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(14px,2vw,26px); text-align: start; }
.sano-stories::before, .sano-stories::after { display: none; }
.sano-stories .sano-story { min-width: 0; margin: 0; padding: 0; overflow: hidden; background: white; border: 1px solid #d4e2e4; border-radius: 14px; }
.sano-stories a.sano-story-link { height: 100%; display: flex; flex-direction: column; color: #153b46; text-decoration: none; }
.sano-story-photo { overflow: hidden; aspect-ratio: 16 / 9; background: #e7efef; }
.sano-story-photo img { display: block; height: 100%; width: 100%; object-fit: cover; transition: transform 220ms ease-out; }
.sano-story-link:hover img { transform: scale(1.025); }
.sano-story-copy { display: flex; align-items: flex-start; flex-direction: column; flex: 1; padding: clamp(16px,2vw,25px); gap: 8px; }
.sano-story-copy h3 { font-size: clamp(21px,2vw,28px); font-weight: 700; line-height: 1.12; margin: 0; color: #143b47; }
.sano-story-copy p { margin: 0; color: #41616a; line-height: 1.4; font-size: 17px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sano-story-arrow { margin-block-start: auto; color: #087783; font: 25px/1 Arial, sans-serif; }
html[lang^="en"] .sano-story-arrow { transform: rotate(180deg); }
.sano-stories-home { grid-template-columns: minmax(0,1.24fr) repeat(2,minmax(0,1fr)); }
.sano-stories-home .sano-story:first-child { grid-row: span 2; }
.sano-stories-home .sano-story:first-child .sano-story-photo { aspect-ratio: 4 / 3; }
.sano-stories-home .sano-story:not(:first-child) .sano-story-link { display: grid; grid-template-columns: 32% 1fr; }
.sano-stories-home .sano-story:not(:first-child) .sano-story-photo { aspect-ratio: auto; height: 100%; min-height: 140px; }
.sano-stories-home .sano-story:not(:first-child) .sano-story-copy { padding: 15px; }
.sano-stories-home .sano-story:not(:first-child) h3 { font-size: clamp(18px,1.6vw,23px); }
.sano-stories-home .sano-story-link:not(:has(.sano-story-photo)) .sano-story-copy { grid-column: 1 / -1; }
@media (max-width: 1024px) {
    .sano-stories { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sano-stories-home .sano-story:first-child { grid-column: 1 / -1; grid-row: auto; }
    .sano-stories-home .sano-story:first-child .sano-story-link { display: grid; grid-template-columns: 1fr 1fr; }
    .sano-stories-home .sano-story:first-child .sano-story-photo { aspect-ratio: 2 / 1; }
}
@media (max-width: 600px) {
    .sano-stories { grid-template-columns: 1fr; }
    .sano-stories-home .sano-story:first-child .sano-story-link { display: flex; }
    .sano-stories-home .sano-story:not(:first-child) .sano-story-photo { min-height: 115px; }
}

.home .videos .slick-list { cursor: grab; touch-action: pan-y; }
.home .videos .slick-list:active { cursor: grabbing; }
.home .videos .video { user-select: none; -webkit-user-drag: none; }
.home .videos .sano-video-step {
    position: absolute; top: 40%; z-index: 3; transform: translateY(-50%); display: grid; place-items: center;
    width: 43px; height: 43px; padding: 9px; margin: 0; border-radius: 50%;
    color: #fff; background: #164957; border: 2px solid white; box-shadow: 0 3px 10px #102c3b44;
}
.home .videos .sano-video-step::before, .home .videos .sano-video-step::after { content: none; }
.home .videos .sano-video-step:hover { color: white; background: #087483; }
.home .videos .sano-video-step svg { display: block; width: 20px; height: 20px; }
.home .videos .slick-prev.sano-video-step { right: 0; left: auto; }
.home .videos .slick-next.sano-video-step { left: 0; right: auto; }
.home .videos .slick-next.sano-video-step svg { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .sano-story-photo img { transition: none; } }
header.banner .sano-utility { z-index: auto; }
header.banner .sano-utility:has(#sano-search:not([hidden])) { z-index: 110; }
.sano-tools svg { width: 21px; height: 21px; fill: currentColor; display: block; }

.home #sano-journal-title { background: transparent; padding: 0; text-align: start; height: auto; }
#home-articles-section .sano-story > .sano-story-link { display: flex; }
#home-articles-section .sano-story:not(:first-child) > .sano-story-link { display: grid; }
@media (min-width: 601px) and (max-width: 1024px) {
    #home-articles-section .sano-story:first-child > .sano-story-link { display: grid; }
}
.home .another_videos > .container { display: block; }
.home .another_videos .videos { min-width: 0; width: 100%; max-width: 100%; }
@media (max-width: 767px) {
    .home .videos .sano-video-step { display: grid !important; width: 38px; height: 38px; }
}

html[lang^="en"] .home .hp_cats.allCats .prod_cat.category h2 {
    padding-top: clamp(23px, 2vw, 31px);
}
@media (min-width: 768px) {
    html[lang^="en"] #nav .navbar-nav {
        display: grid;
        grid-template-columns: 1fr 1fr 1.1fr 1.5fr;
        width: min(100%, 1010px);
    }
    html[lang^="en"] #nav .navbar-nav::before, html[lang^="en"] #nav .navbar-nav::after { display: none; }
    html[lang^="en"] #nav .navbar-nav > li { width: auto; max-width: none; min-width: 0; }
    html[lang^="en"] #nav .navbar-nav > li > a {
        width: 100%; padding: 0 6px; font-size: clamp(16px, 1.35vw, 21px); text-wrap: balance;
    }
}
@media (max-width: 640px) {
    html[lang^="en"] .home .hp_cats.allCats > .container { --columns: 2; }
}
.home .hp_cats .inner_content:not(.sano-hover-ready):hover .imageWarraper img:not(.hover) { opacity: 1; }
@media (max-width: 400px) {
    html[lang^="en"] .home .hp_cats.allCats .container { padding-inline: 8px; --column-gap: 8px; }
    html[lang^="en"] .home .hp_cats.allCats .prod_cat.category h2 { font-size: clamp(14px, 4vw, 16px); }
}
html[lang^="en"] .home .hp_cats.allCats .imageWarraper img {
    left: 50%; right: auto; top: 50%; bottom: auto;
    margin: 0; transform: translate(-50%, -50%);
}

/* Keep all top-level links on one track beside the logo on tablet widths. */
@media (min-width: 768px) and (max-width: 1366px) {
    html:not([lang^="en"]) #nav .navbar-nav {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
        width: 100%;
        margin: 0;
    }
    html:not([lang^="en"]) #nav .navbar-nav::before,
    html:not([lang^="en"]) #nav .navbar-nav::after {
        display: none;
    }
    html:not([lang^="en"]) #nav .navbar-nav > li {
        width: auto;
        min-width: 0;
        max-width: none;
    }
    html:not([lang^="en"]) #nav .navbar-nav > li > a {
        width: 100%;
        padding: 0 4px;
        font-size: clamp(15px, 1.8vw, 21px);
        line-height: 1.1;
        text-wrap: balance;
    }
}

body > .ui-dialog.dialog__atPopupSU.sano-news-dialog {
    display: flex !important;
    flex-direction: column;
    top: auto !important;
    bottom: env(safe-area-inset-bottom, 0px) !important;
    max-width: 100%;
    max-height: calc(100vh - 8px);
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 8px);
    height: auto !important;
    background: white;
    z-index: 2147483646 !important;
}
body:has(> .sano-news-dialog) > .ui-widget-overlay {
    z-index: 2147483645 !important;
}
.sano-news-dialog > button.sano-news-close {
    flex: none;
    align-self: flex-start;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-inline: max(4px, env(safe-area-inset-right, 0px), env(safe-area-inset-left, 0px));
    padding: 0;
    border: 0;
    background: white;
    color: #145363;
    font: 32px/1 Arial, sans-serif;
    cursor: pointer;
}
.sano-news-dialog #_atPopupSU {
    min-height: 0;
    overflow-y: auto !important;
    overscroll-behavior: contain;
}
.sano-news-dialog .p-close-btn {
    display: none !important;
}
