/* ==========================================================================
   Accessibility fixes for "One Click Accessibility" (Pojo) on a vw-based theme.

   Every font rule is gated behind body[class*="pojo-a11y-resize-font-"], so
   with no resize step selected (and after Reset) the design is untouched.
   Contrast-mode rules are gated behind the plugin's own mode classes.
   The only ungated rules are the client-supplied ones at the very end.

   Content roots on this site (no Elementor):
     .lp-sec          home landing template
     .mobile-butotn   fixed mobile CTA bar (sibling of .lp-sec)
     .privacy-content privacy / accessibility-statement template
     .gold-card-banner, .breadcrums, .description-section  404.php
   ========================================================================== */


/* --------------------------------------------------------------------------
   Section 1: scale curves.
   --a11y-scale       general text / headings
   --a11y-scale-form  form controls, messages, cookie banner (start smallest,
                      need a bigger first jump)
   --a11y-scale-menu  accessibility toolbar item labels (grow a bit less than
                      the page text)
   -------------------------------------------------------------------------- */
:root { --a11y-scale: 1; --a11y-scale-form: 1; --a11y-scale-menu: 1; }
body.pojo-a11y-resize-font-130 { --a11y-scale: 1.15; --a11y-scale-form: 1.30; --a11y-scale-menu: 1.06; }
body.pojo-a11y-resize-font-140 { --a11y-scale: 1.22; --a11y-scale-form: 1.40; --a11y-scale-menu: 1.09; }
body.pojo-a11y-resize-font-150 { --a11y-scale: 1.28; --a11y-scale-form: 1.48; --a11y-scale-menu: 1.12; }
body.pojo-a11y-resize-font-160 { --a11y-scale: 1.35; --a11y-scale-form: 1.55; --a11y-scale-menu: 1.15; }
body.pojo-a11y-resize-font-170 { --a11y-scale: 1.42; --a11y-scale-form: 1.62; --a11y-scale-menu: 1.18; }
body.pojo-a11y-resize-font-180 { --a11y-scale: 1.48; --a11y-scale-form: 1.68; --a11y-scale-menu: 1.21; }
body.pojo-a11y-resize-font-190 { --a11y-scale: 1.54; --a11y-scale-form: 1.72; --a11y-scale-menu: 1.24; }
body.pojo-a11y-resize-font-200 { --a11y-scale: 1.60; --a11y-scale-form: 1.75; --a11y-scale-menu: 1.27; }


/* --------------------------------------------------------------------------
   Section 2: base pin on <body> (measured baseline 16px on every breakpoint).
   Deliberately unscoped so the toolbar keeps behaving.
   -------------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] {
    font-size: calc(16px * var(--a11y-scale)) !important;
}


/* --------------------------------------------------------------------------
   Section 3: kill % compounding inside every content root.
   Roots also carry the scaled body line-height (theme: 26px) so inheriting
   text keeps its rhythm.
   -------------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .lp-sec,
html body[class*="pojo-a11y-resize-font-"] .mobile-butotn,
html body[class*="pojo-a11y-resize-font-"] .privacy-content,
html body[class*="pojo-a11y-resize-font-"] .gold-card-banner,
html body[class*="pojo-a11y-resize-font-"] .breadcrums,
html body[class*="pojo-a11y-resize-font-"] .description-section {
    line-height: calc(26px * var(--a11y-scale)) !important;
}

/* enlarged words / &nbsp;-joined phrases must wrap instead of running out
   of narrow columns (e.g. "מהמטרו&nbsp;העתידית" in the icon pills) */
html body[class*="pojo-a11y-resize-font-"] .lp-sec,
html body[class*="pojo-a11y-resize-font-"] .mobile-butotn,
html body[class*="pojo-a11y-resize-font-"] .privacy-content,
html body[class*="pojo-a11y-resize-font-"] .cc-root,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap {
    overflow-wrap: anywhere;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .icon-list .item > .text {
    min-width: 0 !important;
}

html body[class*="pojo-a11y-resize-font-"] .lp-sec :is(p, li, span, label, blockquote, legend, code, pre, dd, dt),
html body[class*="pojo-a11y-resize-font-"] .mobile-butotn :is(p, li, span, label, blockquote, legend, code, pre, dd, dt),
html body[class*="pojo-a11y-resize-font-"] .privacy-content :is(p, li, span, label, blockquote, legend, code, pre, dd, dt),
html body[class*="pojo-a11y-resize-font-"] .gold-card-banner :is(p, li, span, label, blockquote, legend, code, pre, dd, dt),
html body[class*="pojo-a11y-resize-font-"] .breadcrums :is(p, li, span, label, blockquote, legend, code, pre, dd, dt),
html body[class*="pojo-a11y-resize-font-"] .description-section :is(p, li, span, label, blockquote, legend, code, pre, dd, dt) {
    font-size: inherit !important;
}


/* --------------------------------------------------------------------------
   Section 4: form controls + messages on --a11y-scale-form.
   Input and submit share one line-height and one explicit height per band,
   so they are always the same height while a resize step is active.
   Bands mirror the theme: base (>1020), <=1020 (padding 0), <=767.
   -------------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .field-col input,
html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .submit-btn input {
    box-sizing: border-box !important;
    padding-top: 0.7vh !important;
    padding-bottom: 0.7vh !important;
    line-height: calc(max(3.5vh, 1.8vw, 17px) * var(--a11y-scale-form)) !important;
    height: calc(max(3.5vh, 1.8vw, 17px) * var(--a11y-scale-form) + 1.4vh + 2px) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .field-col input {
    font-size: calc(max(12px, 0.9vw) * var(--a11y-scale-form)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .submit-btn input {
    font-size: calc(max(14px, 1.5vw) * var(--a11y-scale-form)) !important;
}

/* consent checkbox label (theme 0.7vw / 2vh) */
html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7-checkbox .wpcf7-list-item-label {
    font-size: calc(max(12px, 0.7vw) * var(--a11y-scale-form)) !important;
    line-height: 1.5 !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7-checkbox input[type="checkbox"] {
    font-size: inherit !important;
}

/* validation tip (theme 0.9vw / 2.5vh). Desktop tips sit in half-width
   columns (13vw - 16px), so the size is capped at 1.35vw to keep the CF7
   message ("אנא מלאו שדה זה.") on one line at every step. */
html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7-not-valid-tip {
    font-size: min(calc(max(11px, 0.9vw) * var(--a11y-scale-form)), 1.35vw) !important;
    line-height: 1.3 !important;
}

/* response output (theme: inherits 16px / 26px; invalid 13px) */
html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7 form .wpcf7-response-output {
    font-size: calc(16px * var(--a11y-scale-form)) !important;
    line-height: 1.4 !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7 form.invalid .wpcf7-response-output {
    font-size: calc(max(14px, 13px) * var(--a11y-scale-form)) !important;
}

@media (max-width: 1020px) {
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .field-col input,
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .submit-btn input {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: calc(max(3.5vh, 1.8vw, 17px) * var(--a11y-scale-form) + 2px) !important;
    }
}

@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .field-col input,
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .submit-btn input {
        padding-top: 0.8vh !important;
        padding-bottom: 0.8vh !important;
        line-height: calc(26px * var(--a11y-scale-form)) !important;
        height: calc(26px * var(--a11y-scale-form) + 1.6vh + 2px) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .field-col input {
        font-size: calc(16px * var(--a11y-scale-form)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec #contactUs .submit-btn input {
        font-size: calc(22px * var(--a11y-scale-form)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7-checkbox .wpcf7-list-item-label {
        font-size: calc(12px * var(--a11y-scale-form)) !important;
        line-height: 1.45 !important;
    }
    /* full-width columns on mobile: no cap needed */
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .wpcf7-not-valid-tip {
        font-size: calc(14px * var(--a11y-scale-form)) !important;
        line-height: 1.3 !important;
    }
}


/* --------------------------------------------------------------------------
   Section 4b: accessibility toolbar item labels — grow a bit less than the
   page text (plugin: 12.8px -> 25.6px; here: 12.8px -> ~16.3px, icons included).
   Mobile baseline is 14px (theme rule `a > *`).
   -------------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a :is(.pojo-a11y-toolbar-text, .pojo-a11y-toolbar-icon) {
    font-size: calc(12.8px * var(--a11y-scale-menu)) !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a :is(.pojo-a11y-toolbar-text, .pojo-a11y-toolbar-icon) {
        font-size: calc(14px * var(--a11y-scale-menu)) !important;
    }
}


/* --------------------------------------------------------------------------
   Section 4c: cookie banner (#cc-banner-root, outside every content root) and
   its settings modal (.cc-modal-wrap, appended straight to <body>).
   Every pin is calc(px * scale) so nothing freezes.
   -------------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .cc-root :is(p, li, span, label, a),
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap :is(p, li, span, label, a) {
    font-size: inherit !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-root {
    font-size: calc(14px * var(--a11y-scale)) !important;
    line-height: 1.5 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-banner {
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}
html body[class*="pojo-a11y-resize-font-"] .cc-title,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-title {
    font-size: calc(18px * var(--a11y-scale-form)) !important;
    line-height: 1.3 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-body,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-body {
    font-size: calc(14px * var(--a11y-scale-form)) !important;
    line-height: 1.5 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-btn,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-btn {
    font-size: calc(15px * var(--a11y-scale-form)) !important;
    line-height: 1.4 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-lang-toggle,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-lang-toggle {
    font-size: calc(12px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap {
    font-size: calc(16px * var(--a11y-scale)) !important;
    line-height: 1.5 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-modal-head h2,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-modal-head h2 {
    font-size: calc(18px * var(--a11y-scale)) !important;
    line-height: 1.3 !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-modal-close,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-modal-close {
    font-size: calc(24px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-cat-desc,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-cat-desc {
    font-size: calc(13px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-required-badge,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-required-badge {
    font-size: calc(11px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-cookies-list,
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list :is(th, td),
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-cookies-list :is(th, td) {
    font-size: calc(12px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-modal-foot .cc-btn {
    font-size: calc(15px * var(--a11y-scale-form)) !important;
}


/* --------------------------------------------------------------------------
   Section 5: every theme font-size rule for the content roots, gated and
   multiplied by --a11y-scale. Line-heights are scaled with them (the theme
   uses vh / px line-heights, which would otherwise overlap).
   Values are the EFFECTIVE theme values per band (style.css, responsive.css
   and the inline <style> in header.php, which loads last and wins).
   -------------------------------------------------------------------------- */

/* ---- home: base (> 1020px) ---- */
html body[class*="pojo-a11y-resize-font-"] .lp-sec .main-title {
    font-size: calc(2.74vw * var(--a11y-scale)) !important;
    line-height: calc(5.3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .subtitle {
    font-size: calc(2vw * var(--a11y-scale)) !important;
    line-height: calc(3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .subtitle-1 {
    font-size: calc(2vw * var(--a11y-scale)) !important;
    line-height: 1.25 !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .content-wrapper .content {
    font-size: calc(1.53vw * var(--a11y-scale)) !important;
    line-height: calc(3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .content-wrapper .content-2 {
    font-size: calc(2vw * var(--a11y-scale)) !important;
    line-height: calc(2vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content {
    font-size: calc(3vw * var(--a11y-scale)) !important;
    line-height: calc(3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content > span {
    font-size: calc(1.5vw * var(--a11y-scale)) !important;
    line-height: calc(2vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content > span.badge {
    font-size: calc(0.8vw * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .icon-box-title {
    font-size: calc(1.4vw * var(--a11y-scale)) !important;
    line-height: calc(3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .icon-list .item > .text {
    font-size: calc(0.85vw * var(--a11y-scale)) !important;
    line-height: calc(2vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .quote-desc,
html body[class*="pojo-a11y-resize-font-"] .lp-sec .reviewer-name,
html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-subtitle {
    font-size: calc(1.03vw * var(--a11y-scale)) !important;
    line-height: calc(3vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-title {
    font-size: calc(1.3vw * var(--a11y-scale)) !important;
    line-height: calc(2.4vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-bottom-text {
    font-size: calc(0.7vw * var(--a11y-scale)) !important;
    line-height: calc(1.5vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .desclimar-links,
html body[class*="pojo-a11y-resize-font-"] .lp-sec .desclimar-links > * {
    font-size: calc(0.8vw * var(--a11y-scale)) !important;
    line-height: calc(max(1.8vh, 1.25vw) * var(--a11y-scale)) !important;
}
/* desktop row is nowrap inside an overflow:hidden column -> let it wrap */
html body[class*="pojo-a11y-resize-font-"] .lp-sec .desclimar-links {
    flex-wrap: wrap !important;
}
/* side-by-side layout (>= 768px): the page stays one screen tall and only the
   text column scrolls, so the video side never shows an empty band */
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .content-wrapper {
        height: 100vh !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .banner-video {
        max-height: 100vh !important;
    }
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .notice-text {
    font-size: calc(0.7vw * var(--a11y-scale)) !important;
    line-height: calc(1.5vh * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .lp-sec .video-tag-absolute {
    font-size: calc(16px * var(--a11y-scale)) !important;
    line-height: calc(26px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .mobile-butotn a {
    font-size: calc(18px * var(--a11y-scale)) !important;
    line-height: calc(26px * var(--a11y-scale)) !important;
}

/* ---- privacy / accessibility-statement template: base ---- */
html body[class*="pojo-a11y-resize-font-"] .privacy-content .privacy-banner h1 {
    font-size: calc(50px * var(--a11y-scale)) !important;
    line-height: calc(56px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .privacy-content .breadcrumbs li {
    font-size: calc(24px * var(--a11y-scale)) !important;
    line-height: calc(24px * var(--a11y-scale)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content p {
    font-size: calc(16px * var(--a11y-scale)) !important;
    line-height: calc(28px * var(--a11y-scale)) !important;
}
/* page-content headings use Bootstrap 5.0.2 sizes (fluid below 1200px) */
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h1 { font-size: calc((1.375rem + 1.5vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h2 { font-size: calc((1.325rem + 0.9vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h3 { font-size: calc((1.3rem + 0.6vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h4 { font-size: calc((1.275rem + 0.3vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h5 { font-size: calc(1.25rem * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h6 { font-size: calc(1rem * var(--a11y-scale)) !important; line-height: 1.2 !important; }

/* ---- 404.php ---- */
html body[class*="pojo-a11y-resize-font-"] .gold-card-banner h1 { font-size: calc((1.375rem + 1.5vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h3 { font-size: calc(30px * var(--a11y-scale)) !important; line-height: 1.2 !important; }

@media (min-width: 1200px) {
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h1,
    html body[class*="pojo-a11y-resize-font-"] .gold-card-banner h1 { font-size: calc(2.5rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h2 { font-size: calc(2rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h3 { font-size: calc(1.75rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h4 { font-size: calc(1.5rem * var(--a11y-scale)) !important; }
}

/* ---- <= 1020px (responsive.css + header.php inline) ---- */
@media (max-width: 1020px) {
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .main-title {
        line-height: calc(5.5vh * var(--a11y-scale)) !important;
    }
    /* header.php: 40px / 40px !important — also wins below 767px */
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .subtitle-1 {
        font-size: calc(40px * var(--a11y-scale)) !important;
        line-height: 1.25 !important;
    }
}

/* ---- <= 767px ---- */
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .main-title {
        font-size: calc(45px * var(--a11y-scale)) !important;
        line-height: calc(56px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .subtitle {
        font-size: calc(30px * var(--a11y-scale)) !important;
        line-height: calc(35px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .content-wrapper .content {
        font-size: calc(18px * var(--a11y-scale)) !important;
        line-height: calc(24px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .content-wrapper .content-2 {
        font-size: calc(20px * var(--a11y-scale)) !important;
        line-height: calc(22px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content {
        font-size: calc(35px * var(--a11y-scale)) !important;
        line-height: calc(38px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content > span {
        font-size: calc(14px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .amount-content > span.badge {
        font-size: calc(3vw * var(--a11y-scale)) !important;
        line-height: calc(3vw * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .icon-box-title {
        font-size: calc(20px * var(--a11y-scale)) !important;
        line-height: calc(24px * var(--a11y-scale)) !important;
    }
    /* header.php: 23px (wins over responsive.css 17px); line-height 22px */
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .icon-list .item > .text {
        font-size: calc(23px * var(--a11y-scale)) !important;
        line-height: calc(22px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .quote-desc,
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .reviewer-name,
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-subtitle {
        font-size: calc(16px * var(--a11y-scale)) !important;
        line-height: calc(24px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-title {
        font-size: calc(20px * var(--a11y-scale)) !important;
        line-height: calc(24px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .form-bottom-text {
        font-size: calc(12px * var(--a11y-scale)) !important;
        line-height: calc(17px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .desclimar-links,
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .desclimar-links > * {
        font-size: calc(14px * var(--a11y-scale)) !important;
        line-height: calc(18px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .lp-sec .notice-text {
        font-size: calc(12px * var(--a11y-scale)) !important;
        line-height: calc(16px * var(--a11y-scale)) !important;
    }
    /* theme `a > *` 14px / 18px */
    html body[class*="pojo-a11y-resize-font-"] .mobile-butotn a > span {
        font-size: calc(14px * var(--a11y-scale)) !important;
        line-height: calc(18px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .privacy-banner h1 {
        font-size: calc(36px * var(--a11y-scale)) !important;
        line-height: calc(44px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h2 {
        font-size: calc(26px * var(--a11y-scale)) !important;
        line-height: calc(32px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .page-content h3 {
        font-size: calc(20px * var(--a11y-scale)) !important;
        line-height: calc(26px * var(--a11y-scale)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .privacy-content .breadcrumbs li {
        font-size: calc(18px * var(--a11y-scale)) !important;
        line-height: calc(18px * var(--a11y-scale)) !important;
    }
}
@media (max-width: 380px) {
    html body[class*="pojo-a11y-resize-font-"] .mobile-butotn a {
        font-size: calc(15px * var(--a11y-scale)) !important;
    }
}
@media (max-width: 330px) {
    html body[class*="pojo-a11y-resize-font-"] .mobile-butotn a {
        font-size: calc(13px * var(--a11y-scale)) !important;
    }
}


/* ==========================================================================
   Section 6: contrast modes (high contrast / negative contrast / light
   background). The plugin paints a solid background on every element, which
   hides the hero video, the image overlays and the privacy banner image.
   Containers over media go transparent; the text itself gets the backdrop.
   `:not(#a11y-x)` adds ID weight to beat the plugin's
   `*:not(#pojo-a11y-toolbar)` selectors.
   ========================================================================== */

/* high contrast: page background is black */
html body.pojo-a11y-high-contrast {
    background-color: #000 !important;
}

/* containers over the hero video -> transparent, media visible */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec,
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec :is(div, section, ul, li, form, fieldset, p, span, label, video, img),
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .sticker,
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) :is(.vector-image, .vector-image-mobile, img[src*="vector-shape"], img[src*="karkaot-logo"]),
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) a:has(> img[src*="karkaot-logo"]) {
    background-color: transparent !important;
}

/* privacy / accessibility-statement banner: restore its background image
   (the plugin forces background-image:none; the template sets it inline) */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .privacy-banner[style*="privacy-featured-image.webp"] {
    background-image: url("/wp-content/uploads/sites/42/2025/08/privacy-featured-image.webp") !important;
}
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .privacy-banner {
    background-color: transparent !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .privacy-banner :is(div, ul) {
    background-color: transparent !important;
}

/* gradient text (background-clip:text + transparent fill) turns invisible
   once the plugin swaps the background.
   .main-title keeps its gold gradient clipped to the glyphs (single layer —
   Chrome ignores `text` clip when mixed with a second layer), and the dark
   backdrop sits on its small wrapper .main-title-area instead. */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec .main-title {
    background-color: transparent !important;
    background-image: linear-gradient(90deg, #F0A942 0%, #ECE095 38%, #D7AA45 72%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .lp-sec .main-title-area {
    background-color: #000 !important;
}
html body.pojo-a11y-light-background:not(#a11y-x) .lp-sec .main-title-area {
    background-color: #fff !important;
}
/* .subtitle was white clipped text -> plain text */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec .subtitle {
    -webkit-text-fill-color: currentColor !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
}

/* backdrop behind the text that sits on the video / banner image */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .lp-sec :is(.subtitle, .subtitle-1, .content, .content-2, .amount-content, .icon-box-title, .form-title, .form-subtitle, .form-bottom-text, .notice-text, .video-tag-absolute, .desclimar-links, .wpcf7-list-item-label, .quote-desc, .reviewer-name):not(:empty),
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .lp-sec .icon-list .item,
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .privacy-banner :is(h1, .breadcrumbs li) {
    background-color: #000 !important;
}
html body.pojo-a11y-light-background:not(#a11y-x) .lp-sec :is(.subtitle, .subtitle-1, .content, .content-2, .amount-content, .icon-box-title, .form-title, .form-subtitle, .form-bottom-text, .notice-text, .video-tag-absolute, .desclimar-links, .wpcf7-list-item-label, .quote-desc, .reviewer-name):not(:empty),
html body.pojo-a11y-light-background:not(#a11y-x) .lp-sec .icon-list .item,
html body.pojo-a11y-light-background:not(#a11y-x) .privacy-banner :is(h1, .breadcrumbs li) {
    background-color: #fff !important;
}
/* .subtitle-1 (header.php: line-height 50px + padding-top 1rem; <=1020px:
   40px + 2rem top/bottom) -> backdrop hugs the text, spacing kept as margin */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec .subtitle-1 {
    line-height: 1.3 !important;
    padding: 0.1em 0.3em !important;
    margin-top: 1rem !important;
}
@media (max-width: 1020px) {
    html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) .lp-sec .subtitle-1 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }
}

/* centred headings: hug the text instead of painting the whole column */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-light-background):not(#a11y-x) :is(.lp-sec .main-title, .lp-sec .subtitle-1, .lp-sec .form-title, .privacy-banner h1) {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* consent checkbox: the tick is a filled square (::before) — keep it
   visible against the box in every mode */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .wpcf7-checkbox input[type="checkbox"] {
    border-color: #fff !important;
}
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast, body.pojo-a11y-grayscale) .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background-color: #fff !important;
}
html body.pojo-a11y-light-background:not(#a11y-x) .wpcf7-checkbox input[type="checkbox"] {
    border-color: #000 !important;
}
html body.pojo-a11y-light-background .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background-color: #000 !important;
}

/* submit arrow icon is a black PNG: white on the dark contrast buttons,
   black on the light one */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) .lp-sec .submit-btn img {
    -webkit-filter: brightness(0) invert(1) !important;
    filter: brightness(0) invert(1) !important;
}
html body.pojo-a11y-light-background:not(#a11y-x) .lp-sec .submit-btn img {
    -webkit-filter: brightness(0) !important;
    filter: brightness(0) !important;
}

/* every button keeps a visible border in every mode */
html :is(body.pojo-a11y-high-contrast, body.pojo-a11y-negative-contrast):not(#a11y-x) :is(.lp-sec input[type="submit"], .mobile-butotn a, .cc-root .cc-btn, .cc-modal-wrap button, #cc-floater) {
    border: 1px solid #fff !important;
}
html body.pojo-a11y-light-background:not(#a11y-x) :is(.lp-sec input[type="submit"], .mobile-butotn a, .cc-root .cc-btn, .cc-modal-wrap button, #cc-floater) {
    border: 1px solid #000 !important;
}
html body.pojo-a11y-grayscale :is(.cc-root .cc-btn, .cc-modal-wrap button, #cc-floater) {
    border: 1px solid #fff !important;
}


/* ==========================================================================
   Section 7: client-supplied rules (kept as provided; intentionally ungated).
   ========================================================================== */
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) textarea,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) select {
    border: 1px solid #000 !important;
}
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input::placeholder,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) textarea::placeholder {
    color: #000;
}

/* Remove the problematic body filter only during grayscale mode */
body.pojo-a11y-grayscale {
    -webkit-filter: none !important;
    filter: none !important;
    overflow-x: hidden !important;
}
/* Reapply grayscale to the document root */
html:has(body.pojo-a11y-grayscale) {
    -webkit-filter: grayscale(100%) !important;
    filter: grayscale(100%) !important;
}
/* Change toolbar positioning only during grayscale mode */
body.pojo-a11y-grayscale #pojo-a11y-toolbar {
    position: fixed !important;
    z-index: 99999 !important;
}

.cc-slider, body.pojo-a11y-high-contrast .cc-slider, body.pojo-a11y-grayscale .cc-slider,
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .cc-slider,
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-slider {
    background: #ababff !important;
}
body.pojo-a11y-grayscale .wpcf7-not-valid-tip {
    color: #fff;
}
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-btn {
    border: 1px solid #000 !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-slider {
    background: gray !important;
}
body.pojo-a11y-high-contrast .cc-slider {
    background: gray !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .cc-slider {
    background: gray !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .black-bg img {
    background: #000 !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .transparent-bg {
    background: transparent !important;
}
body.pojo-a11y-high-contrast .transparent-bg {
    background: transparent !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .transparent-bg {
    background: transparent !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .transparent-bg img {
    background: transparent !important;
}
body.pojo-a11y-high-contrast .transparent-bg img {
    background: transparent !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .transparent-bg img {
    background: transparent !important;
}
body.pojo-a11y-high-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before {
    color: #fff;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .wpcf7-checkbox input[type="checkbox"]:checked::before {
    color: #fff;
}

/* consent checkbox: square on every screen (theme: 1vw wide x 2.8vh tall,
   2vh tall >= 2200px -> a rectangle on desktop). Width kept as the theme's. */
.wpcf7-checkbox input[type="checkbox"] {
    width: max(18px, 1vw) !important;
    height: max(18px, 1vw) !important;
}
@media (min-width: 2200px) {
    .wpcf7-checkbox input[type="checkbox"]:checked::before {
        width: 12px;
        height: 12px;
    }
}

body #cc-floater {
    bottom: unset !important;
    top: 12.5vw !important;
    left: 0.2vw !important;
    right: unset !important;
    width: 2.5vw !important;
    height: 2.5vw !important;
    line-height: 2.5vw;
    text-align: center !important;
    z-index: 999 !important;
}
body #cc-floater svg {
    width: 1.5vw !important;
    height: 1.5vw !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
body #pojo-a11y-toolbar {
    z-index: 9999 !important;
    top: 9vw !important;
}
body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
    font-size: 1.5vw !important;
    padding: 0.6vw !important;
}
body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
    width: 1.5vw !important;
}
#pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a svg {
    padding-right: 0 !important;
    padding-left: 6px !important;
}

@media (max-width: 767px) {
    body #cc-floater {
        bottom: unset !important;
        top: 60vw !important;
        left: 2px !important;
        width: 7.5vw !important;
        height: 7.5vw !important;
        line-height: 7.5vw;
        padding: 4.5vw !important;
    }
    body #cc-floater svg {
        width: 5vw !important;
        height: 5vw !important;
    }
    body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
        font-size: 5.5vw !important;
        padding: 2vw !important;
    }
    body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
        width: 5.8vw !important;
    }
    body #pojo-a11y-toolbar {
        top: 48vw !important;
    }

    /* cookie banner centred on mobile (this site uses .cc-pos-left) */
    .cc-banner {
        padding: 16px !important;
    }
    .cc-pos-right,
    .cc-root.cc-pos-left,
    .cc-root.cc-pos-center {
        left: 50% !important;
        right: unset !important;
        bottom: 10px !important;
        width: 95%;
        transform: translateX(-50%);
    }
    .cc-root .cc-banner.cc-box {
        max-width: none;
    }
    .cc-btn {
        padding: 7px 9px !important;
    }

    /* reCAPTCHA badge sits above the fixed mobile CTA bar instead of on it
       (bar ≈ 64px tall, grows with the resize scale) */
    .grecaptcha-badge {
        bottom: calc(64px * var(--a11y-scale) + 12px) !important;
    }
    /* end of the page clears the bar AND the badge above it:
       bar 64px*scale + 12px gap + badge 60px + 12px */
    .lp-sec .content-wrapper .content-form-wrapper {
        padding-bottom: calc(64px * var(--a11y-scale) + 84px) !important;
    }

    /* label for the icon-only call button in the fixed mobile bar
       (styled like the "לפרטים נוספים" label: theme `a > *` 14px / 18px,
       weight 600, white) */
    .mobile-butotn a.mobile-whatsapp::before {
        content: "התקשרו";
        font-size: 14px;
        line-height: 18px;
        font-weight: 600;
        color: #fff;
    }
    html body[class*="pojo-a11y-resize-font-"] .mobile-butotn a.mobile-whatsapp::before {
        font-size: calc(14px * var(--a11y-scale));
        line-height: calc(18px * var(--a11y-scale));
    }
    body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background) .mobile-butotn a.mobile-whatsapp::before {
        color: inherit;
    }
}
