/* =====================================================================
   12Stones - One Click Accessibility (Pojo) fixes
   ---------------------------------------------------------------------
   Font-resize rules are gated behind body[class*="pojo-a11y-resize-font-"]:
   with no resize step selected (and after Reset) nothing below the
   "FONT RESIZE" block changes the design.
   Prefix used throughout:
     html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x)
   The :not(#a11y-x) never matches anything - it only adds id-level
   specificity so these rules out-rank the plugin's own resize rules and
   any a11y overrides stored in the database.
   ===================================================================== */


/* =====================================================================
   0. ALWAYS-ON FIXES (not accessibility-mode specific)
   ===================================================================== */

/* 0a. Country flags in the Hebrew phone <select> ("🇮🇱 (+972)").
   Windows has no flag emoji glyphs, so the flag rendered as blank / "IL".
   This font only covers the flag code points (unicode-range), every other
   character keeps rendering with the theme font. */
@font-face {
    font-family: "Twemoji Country Flags";
    unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E0063, U+E0065, U+E0067, U+E006C, U+E006E, U+E0073-E0074, U+E0077, U+E007F;
    src: url("https://cdn.jsdelivr.net/npm/country-flag-emoji-polyfill@0.1.8/dist/TwemojiCountryFlags.woff2") format("woff2");
    font-display: swap;
}
.wpcf7-form select[name="country_code"],
.wpcf7-form select[name="country_code"] option {
    font-family: "Twemoji Country Flags", "helveticaneuelightext", sans-serif !important;
}
/* The select is narrow on desktop (118px at 1366px) and "🇮🇱 (+972)" didn't fit:
   in RTL the overflow is cut on the left - exactly where the flag is - so the
   flag was cropped or missing. No letter-spacing, 8px side padding, and the
   font is capped to what fits the select (text ≈ 4.5em wide + ~38px padding
   and arrow). Where 21px already fits (phones, wide screens) nothing changes. */
.wpcf7-form .country-code-wrapper {
    container-type: inline-size;
}
.wpcf7-form .country-code-wrapper select[name="country_code"] {
    letter-spacing: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: min(21px, calc((100cqi - 38px) / 4.6)) !important;
}
/* Country code + phone number joined into one box like the English form
   (flag/dial code attached to the number field): no padding between the two
   columns, same 53px height as the input, and the same light tint that the
   English form's dial-code area has. Outer edges stay aligned with the other
   fields. */
.wpcf7-form .row > .select-col {
    padding-inline-end: 0 !important;
}
.wpcf7-form .row > .select-col + [class*="col-"] {
    padding-inline-start: 0 !important;
}
.wpcf7-form .country-code-wrapper select[name="country_code"] {
    height: 53px;
    background: linear-gradient(rgba(0, 0, 0, .05), rgba(0, 0, 0, .05)), rgba(255, 255, 255, .3);
}
/* contrast modes add a 1px border to the input (+2px) - match it */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .wpcf7-form .country-code-wrapper select[name="country_code"] {
    height: 55px !important;
}
html body[class*="pojo-a11y-resize-font-"]:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .wpcf7-form .country-code-wrapper select[name="country_code"]:not(#a11y-y) {
    height: calc(29px * var(--a11y-scale-form) + 26px) !important;
}
/* Hebrew forms: validation messages used the theme's English-only font
   (helveticaneuelightext has no Hebrew letters -> browser fallback font) with
   2px letter-spacing. Use the Hebrew pages' own text font. */
html[dir="rtl"] .wpcf7-form .wpcf7-not-valid-tip,
html[dir="rtl"] .wpcf7 form .wpcf7-response-output {
    font-family: 'OpenSans-Regular', sans-serif !important;
    letter-spacing: 0 !important;
}
/* Hebrew forms: fields and their placeholders used the same English-only font
   (fallback font + 2px letter-spacing). Use the Hebrew pages' text font.
   The country-code select keeps its flag font. */
html[dir="rtl"] .wpcf7-form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), textarea),
html[dir="rtl"] .wpcf7-form :is(input, textarea)::placeholder {
    font-family: 'OpenSans-Regular', sans-serif !important;
    letter-spacing: normal !important;
}
/* Hebrew buttons ("שלח"): the theme's handwriting font (omiyagealregular) has
   no Hebrew letters -> fallback font with 3px letter-spacing. Use the Hebrew
   pages' font family; size and height stay the same. */
html[dir="rtl"] .global-btn {
    font-family: 'OpenSans-Medium', sans-serif !important;
    letter-spacing: normal !important;
}
/* Cookie banner on phones: centred (it is "cc-pos-left": pinned 20px from the
   left and touching the right edge). 10px from each side, max 420px. */
@media (max-width: 767px) {
    body #cc-banner-root.cc-root {
        left: 50% !important;
        right: auto !important;
        bottom: 10px !important;
        transform: translateX(-50%) !important;
        width: calc(100% - 20px) !important;
        max-width: 420px !important;
    }
    body #cc-banner-root.cc-root .cc-banner {
        max-width: none !important;
        width: 100% !important;
        box-sizing: border-box;
    }
}
/* Phones: country code + phone number on one row (they were stacked) */
@media (max-width: 767px) {
    .wpcf7-form .row > .select-col {
        flex: 0 0 auto !important;
        width: 40% !important;
    }
    .wpcf7-form .row > .select-col + [class*="col-"] {
        flex: 0 0 auto !important;
        width: 60% !important;
    }
}

/* 0b. Header menu (hamburger modal) was cropped on short screens:
   the link list is vertically centred inside a fixed-height row, so when it
   is taller than the screen its first items were pushed above the top edge
   (unreachable, users had to zoom the browser to 80%).
   - let the row grow and the modal body scroll
   - "safe" centring: centred when it fits, top-aligned when it doesn't
   - on short desktop/laptop screens scale the link size with the height */
#navbarModal .menu-modal-row {
    height: auto !important;
}
#navbarModal .menu-modal-row .link-col {
    align-items: safe center !important;
}
@media (min-width: 768px) and (max-height: 900px) {
    #navbarModal .menu-item > a {
        font-size: clamp(22px, 5vh, 38px) !important;
        line-height: 1.05 !important;
        padding: clamp(4px, 0.9vh, 10px) 0 !important;
    }
    #navbarModal .menu-item:last-child {
        margin-top: clamp(8px, 1.6vh, 20px);
        padding-top: clamp(8px, 1.6vh, 20px);
    }
    #navbarModal .modal-body {
        padding-top: clamp(16px, 4vh, 40px);
    }
}
@media (min-width: 768px) and (max-height: 900px) {
    html:where([dir="rtl"]) #navbarModal .menu-item > a {
        font-size: clamp(20px, 4.2vh, 28px) !important;
    }
}
/* Hebrew pages: the header menu's photo carousel is started without Owl's rtl
   option, but sits in a right-to-left page - the current photo was laid out
   ~15000px off-screen and the image column stayed empty. The carousel holds
   only images, so lay it out left-to-right. */
html[dir="rtl"] #navbarModal #myOwl {
    direction: ltr;
}

/* Small desktops: the modal content can end up 1-2px taller than the screen
   (rounding / font differences between browsers), which showed a useless
   scrollbar. Hide the bar - the menu still scrolls with wheel, keys or touch.
   Kept visible while enlarged text is on, where the menu really can be long. */
@media (min-width: 768px) {
    body:not([class*="pojo-a11y-resize-font-"]) #navbarModal,
    body:not([class*="pojo-a11y-resize-font-"]) #navbarModal .modal-body {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    body:not([class*="pojo-a11y-resize-font-"]) #navbarModal::-webkit-scrollbar,
    body:not([class*="pojo-a11y-resize-font-"]) #navbarModal .modal-body::-webkit-scrollbar {
        display: none;
        width: 0;
    }
}


/* =====================================================================
   FONT RESIZE
   ===================================================================== */

/* ---------------------------------------------------------------------
   Section 1: scale curves.
   --a11y-scale          general text
   --a11y-scale-form     forms / cookie banner (start small -> bigger first jump)
   --a11y-scale-toolbar  the accessibility toolbar itself (grows a bit less)
   --------------------------------------------------------------------- */
:root { --a11y-scale: 1; --a11y-scale-form: 1; --a11y-scale-toolbar: 1; }
body.pojo-a11y-resize-font-130 { --a11y-scale: 1.15; --a11y-scale-form: 1.30; --a11y-scale-toolbar: 1.04; }
body.pojo-a11y-resize-font-140 { --a11y-scale: 1.22; --a11y-scale-form: 1.40; --a11y-scale-toolbar: 1.06; }
body.pojo-a11y-resize-font-150 { --a11y-scale: 1.28; --a11y-scale-form: 1.48; --a11y-scale-toolbar: 1.08; }
body.pojo-a11y-resize-font-160 { --a11y-scale: 1.35; --a11y-scale-form: 1.55; --a11y-scale-toolbar: 1.10; }
body.pojo-a11y-resize-font-170 { --a11y-scale: 1.42; --a11y-scale-form: 1.62; --a11y-scale-toolbar: 1.12; }
body.pojo-a11y-resize-font-180 { --a11y-scale: 1.48; --a11y-scale-form: 1.68; --a11y-scale-toolbar: 1.14; }
body.pojo-a11y-resize-font-190 { --a11y-scale: 1.54; --a11y-scale-form: 1.72; --a11y-scale-toolbar: 1.17; }
body.pojo-a11y-resize-font-200 { --a11y-scale: 1.60; --a11y-scale-form: 1.75; --a11y-scale-toolbar: 1.20; }

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

/* ---------------------------------------------------------------------
   Section 3: stop the plugin's % sizes compounding (p > span > span ...).
   Scoped to every direct child of <body> except the accessibility toolbar.
   Form controls are handled in Section 4.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) :is(p, li, span, label, legend, blockquote, code, pre, dd, dt) {
    font-size: inherit !important;
}
/* headings without a theme size use Bootstrap's rem sizes - scale those */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h1 { font-size: calc((1.375rem + 1.5vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h2 { font-size: calc((1.325rem + 0.9vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h3 { font-size: calc((1.3rem + 0.6vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h4 { font-size: calc((1.275rem + 0.3vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h5 { font-size: calc(1.25rem * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h6 { font-size: calc(1rem * var(--a11y-scale)) !important; }
@media (min-width: 1200px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h1 { font-size: calc(2.5rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h2 { font-size: calc(2rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h3 { font-size: calc(1.75rem * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) h4 { font-size: calc(1.5rem * var(--a11y-scale)) !important; }
}

/* ---------------------------------------------------------------------
   Section 3b: accessibility toolbar - grows, but less than the page text.
   (plugin default: text + icon 12.8px -> 25.6px; now 12.8px -> ~15.4px)
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar .pojo-a11y-toolbar-item .pojo-a11y-toolbar-text,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar .pojo-a11y-toolbar-item .pojo-a11y-toolbar-icon {
    font-size: calc(12.8px * var(--a11y-scale-toolbar)) !important;
}

/* ---------------------------------------------------------------------
   Section 4: forms (Contact Form 7) on --a11y-scale-form.
   Inputs:  padding 12px top/bottom + line-height  -> 53px at 100%
   Button:  padding  6px top/bottom + line-height  -> forced to the same
            total so inputs, phone, country select and SEND stay equal
            height on every device and every step.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]), textarea, select),
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) :is(.footer-form, .lp-contact-form) select,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .iti input {
    font-size: calc(21px * var(--a11y-scale-form)) !important;
    line-height: calc(29px * var(--a11y-scale-form)) !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    box-sizing: border-box !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form textarea {
    line-height: 1.4 !important;
}
/* browsers ignore line-height on <select>: give it the inputs' exact height */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form select,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) :is(.footer-form, .lp-contact-form) select {
    height: calc(29px * var(--a11y-scale-form) + 24px) !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}
/* country-code select: enlarged, but never wider than the select (flag stays visible) */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .country-code-wrapper select[name="country_code"]:not(#a11y-x) {
    font-size: min(calc(21px * var(--a11y-scale-form)), calc((100cqi - 38px) / 4.6)) !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}
/* SEND button - same outer height as the inputs */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form :is(.global-btn, [type="submit"]) {
    font-size: calc(49px * var(--a11y-scale)) !important;
    line-height: calc(29px * var(--a11y-scale-form) + 12px) !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    height: auto !important;
    white-space: nowrap !important;
}
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form :is(.global-btn, [type="submit"]) {
    font-size: calc(38px * var(--a11y-scale)) !important;
}
/* landing page (lp-style.css >= 768px uses vw sizes) */
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .wpcf7-form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]), textarea, select),
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form select,
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .iti input {
        font-size: calc(max(14px, 1vw) * var(--a11y-scale-form)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .wpcf7-form :is(.global-btn, [type="submit"]) {
        font-size: calc(2.5vw * var(--a11y-scale)) !important;
    }
}
/* intl-tel-input: keep the flag + dial code at its normal size so the input's
   left padding (calculated once by the plugin) still clears it */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .iti .iti__selected-flag,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .iti .iti__selected-dial-code {
    font-size: 21px !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .iti .iti__country-list {
    font-size: calc(16px * var(--a11y-scale-form)) !important;
}

/* Wider fields while text is enlarged (desktop 2 per row, tablet 1 per row)
   so text and validation messages fit on one line. */
@media (min-width: 768px) and (max-width: 1199px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form > .row:not(:has(> .col-md-9)) > :is(.col-md-2, .col-md-3, .col-md-4) {
        flex: 0 0 auto !important;
        width: 100% !important;
        margin-bottom: 12px;
    }
}
@media (min-width: 1200px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form > .row:not(:has(> .col-md-9)) > :is(.col-md-2, .col-md-3, .col-md-4) {
        flex: 0 0 auto !important;
        width: 50% !important;
        margin-bottom: 12px;
    }
}

/* checkbox labels / privacy link */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox .wpcf7-list-item-label,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .pv-check-col .privacy-link {
    font-size: calc(16px * var(--a11y-scale-form)) !important;
    line-height: 1.4 !important;
}
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox .wpcf7-list-item-label {
    font-size: calc(19px * var(--a11y-scale-form)) !important;
}
@media (max-width: 767px) {
    html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox .wpcf7-list-item-label {
        font-size: calc(16px * var(--a11y-scale-form)) !important;
    }
}
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form :is(.wpcf7-checkbox .wpcf7-list-item-label, .pv-check-col .privacy-link) {
        font-size: calc(max(14px, 0.8vw) * var(--a11y-scale-form)) !important;
    }
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form :is(.wpcf7-checkbox .wpcf7-list-item-label, .pv-check-col .privacy-link) {
        font-size: calc(max(14px, 12px) * var(--a11y-scale-form)) !important;
    }
}
/* Phone field: the dial-code box (+972) takes a fixed part of the input's left
   side, so the enlarged number/placeholder ("50-234-5678" ≈ 6.9em wide) ran out
   of room and was cropped. Cap the size by the column width (container query
   units - the columns are size containers, see the validation-tip rules). */
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .iti input:not(#a11y-x) {
        font-size: min(calc(21px * var(--a11y-scale-form)), calc((100cqi - 125px) / 6.9)) !important;
    }
}
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .iti input:not(#a11y-x) {
        font-size: min(calc(21px * var(--a11y-scale-form)), calc((100cqi - 180px) / 6.9)) !important;
    }
}

/* keep the checkbox square next to a multi-line label, vertically centred on
   the label's first line: (line box - box height) / 2. Label line-height is 1.4
   (set above); box is 22px (24px on mobile, responsive.css). */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox input[type="checkbox"] {
    flex-shrink: 0 !important;
    align-self: flex-start !important;
    margin-top: calc((16px * var(--a11y-scale-form) * 1.4 - 22px) / 2 - 16px * var(--a11y-scale-form) * 0.08) !important;
}
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox input[type="checkbox"] {
    margin-top: calc((19px * var(--a11y-scale-form) * 1.4 - 22px) / 2 - 19px * var(--a11y-scale-form) * 0.08) !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox input[type="checkbox"],
    html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-checkbox input[type="checkbox"] {
        margin-top: calc((16px * var(--a11y-scale-form) * 1.4 - 24px) / 2 - 16px * var(--a11y-scale-form) * 0.08) !important;
    }
}
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form .wpcf7-checkbox input[type="checkbox"] {
        margin-top: calc((max(14px, 0.8vw) * var(--a11y-scale-form) * 1.4 - 22px) / 2 - max(14px, 0.8vw) * var(--a11y-scale-form) * 0.08) !important;
    }
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form .wpcf7-checkbox input[type="checkbox"] {
        margin-top: calc((14px * var(--a11y-scale-form) * 1.4 - 24px) / 2 - 14px * var(--a11y-scale-form) * 0.08) !important;
    }
}

/* Privacy row ("I hereby acknowledge ... agree to the" + "Privacy Policy" link):
   checkbox, label and link are side-by-side flex items, so once the enlarged
   label wraps, the link became its own two-line column. With enlarged text the
   row flows as normal text instead: the link follows "agree to the" and wraps
   with it; the checkbox sits in the first line's indent (centred as above) and
   the validation tip goes under the paragraph. Normal view is unchanged. */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col p {
    display: block !important;
    position: relative !important;
    padding-inline-start: 32px !important;
    font-size: calc(16px * var(--a11y-scale-form)) !important;
    line-height: 1.4 !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col :is(.wpcf7-form-control-wrap, .wpcf7-checkbox, .wpcf7-list-item) {
    display: inline !important;
    position: static !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col input[type="checkbox"] {
    position: absolute !important;
    inset-inline-start: 0 !important;
    margin: 0 !important;
    top: calc((16px * var(--a11y-scale-form) * 1.4 - 22px) / 2 - 16px * var(--a11y-scale-form) * 0.08) !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col .privacy-link {
    display: inline !important;
    margin-inline-start: 0.25em !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col .wpcf7-not-valid-tip {
    position: absolute !important;
    top: 100% !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    inset-inline-start: 32px !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col p {
        padding-inline-start: 37px !important;
    }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col input[type="checkbox"] {
        top: calc((16px * var(--a11y-scale-form) * 1.4 - 24px) / 2 - 16px * var(--a11y-scale-form) * 0.08) !important;
    }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col .wpcf7-not-valid-tip {
        inset-inline-start: 37px !important;
    }
}
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form .pv-check-col p {
        font-size: calc(max(14px, 0.8vw) * var(--a11y-scale-form)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-contact-form .pv-check-col input[type="checkbox"] {
        top: calc((max(14px, 0.8vw) * var(--a11y-scale-form) * 1.4 - 22px) / 2 - max(14px, 0.8vw) * var(--a11y-scale-form) * 0.08) !important;
    }
}

/* Driving Distance list: the separator line sat at a fixed 30px from the row
   bottom (made for one text line) - a wrapped place name ("Ben Gurion Airport")
   was struck through. Put the line right under the text instead, and let the
   time circle grow with its text. */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .place-name {
    align-self: flex-start !important;
    padding-bottom: 10px !important;
    line-height: 1.35 !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .place-name::after {
    bottom: 0 !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .time {
    min-width: calc(70px * var(--a11y-scale)) !important;
    min-height: calc(70px * var(--a11y-scale)) !important;
    height: calc(70px * var(--a11y-scale)) !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .time {
        min-width: calc(66px * var(--a11y-scale)) !important;
        min-height: calc(66px * var(--a11y-scale)) !important;
        height: calc(66px * var(--a11y-scale)) !important;
    }
}

/* response message under the form (unitless line-height so it grows) */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7 form .wpcf7-response-output {
    font-size: calc(max(14px, 18px) * var(--a11y-scale-form)) !important;
    line-height: 1.45 !important;
}

/* validation tips: one line, sized to fit the field's column.
   Each column becomes an inline-size container; the tip font is the scaled
   size, capped by the column width (cqi) so it never wraps or overflows. */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .row > [class*="col-"] {
    container-type: inline-size;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .wpcf7-not-valid-tip {
    font-size: min(calc(18px * var(--a11y-scale-form)), 5.4cqi) !important;
    line-height: 1.4 !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
}
/* Hebrew messages are shorter - they can use more of the column */
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .wpcf7-not-valid-tip {
    font-size: max(14px, min(calc(18px * var(--a11y-scale-form)), 6.4cqi)) !important;
}

/* ---------------------------------------------------------------------
   Section 4d: privacy checkbox tip is position:absolute (top:auto, tracks the
   label). When enlarged it spilled over the content below: reserve room.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col .wpcf7-not-valid-tip {
    top: auto !important;
    bottom: auto !important;
    left: 0 !important;
    right: auto !important;
    margin-top: 2px !important;
}
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col .wpcf7-not-valid-tip {
    left: auto !important;
    right: 0 !important;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .wpcf7-form .pv-check-col:has(.wpcf7-not-valid-tip) {
    padding-bottom: calc(18px * var(--a11y-scale-form) * 1.4 + 6px) !important;
}

/* ---------------------------------------------------------------------
   Section 4c: cookie banner (#cc-banner-root / cc-modal, outside the page).
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root :is(p, li, span, label, a) { font-size: inherit !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root { font-size: calc(14px * var(--a11y-scale)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-title,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .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-"]:not(#a11y-x) .cc-body,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .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-"]:not(#a11y-x) .cc-btn,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-btn { font-size: calc(15px * var(--a11y-scale-form)) !important; line-height: 1.3 !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-lang-toggle,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-lang-toggle { font-size: calc(12px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-modal-head h2,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-modal-head h2 { font-size: calc(18px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-modal-close,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-modal-close { font-size: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-cat-desc,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-cat-desc { font-size: calc(13px * var(--a11y-scale)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-required-badge,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-required-badge { font-size: calc(11px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-cookies-list :is(th, td),
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-root .cc-cookies-list :is(th, td) { font-size: calc(12px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-modal-wrap :is(p, li, span, label, a, div) { font-size: inherit; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .cc-modal-wrap { font-size: calc(14px * var(--a11y-scale)) !important; }

/* ---------------------------------------------------------------------
   Section 5: every font-size rule of the theme, in source order, scaled.
   (style.css -> responsive.css -> lp-style.css (landing) -> rtlstyle.css (Hebrew))
   px line-heights are scaled too so enlarged lines never overlap.
   --------------------------------------------------------------------- */

/* --- style.css --- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) p { font-size: calc(21px * var(--a11y-scale)) !important; line-height: calc(34px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .sticky-contact-btn { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(38px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-btn { font-size: calc(49px * var(--a11y-scale)) !important; line-height: calc(41px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .menu-modal .menu-item > a { font-size: calc(38px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-form-title { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(34px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-developers { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(36px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .home-banner-sec .banner-slider .slide h1.title { font-size: calc(4vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .title-area .title { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(42px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .title-area .global-btn.transparent-btn { font-size: calc(19px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .sec-title { font-size: calc(72px * var(--a11y-scale)) !important; line-height: calc(90px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .location-sec .global-content-area .sec-title { font-size: calc(90px * var(--a11y-scale)) !important; line-height: calc(110px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-title { font-size: calc(36px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .time .distance { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(20px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .time .distance span { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(20px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .place-name { font-size: calc(19px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .luxury-col-area > .title { font-size: calc(51px * var(--a11y-scale)) !important; line-height: calc(63px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area h2.title { font-size: calc(80px * var(--a11y-scale)) !important; line-height: calc(96px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area .description { font-size: calc(19px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area .desc-area > .subtitle { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .review-content .review-desc { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(42px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .review-content .review-name { font-size: calc(22px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .review-bottom-content { font-size: calc(18px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .featured-page-title { font-size: calc(49px * var(--a11y-scale)) !important; line-height: calc(60px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .content-sec .content-sec-area p.content-desc { font-size: calc(50px * var(--a11y-scale)) !important; line-height: calc(70px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .house-slide .house-name { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .house-gallery-pills .nav-item .nav-link { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .developer-content-area .title-area .title { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p a { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .lang-switcher li a { font-size: calc(16px * var(--a11y-scale)) !important; }

/* --- responsive.css --- */
@media (max-width: 767px) {
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) p { font-size: calc(16px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .title-area .title { font-size: calc(22px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .location-sec .global-content-area .sec-title,
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .sec-title { font-size: calc(56px * var(--a11y-scale)) !important; line-height: calc(56px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .title-area .global-btn.transparent-btn { font-size: calc(16px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-list .list-item .place-name { font-size: calc(16px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .distance-title { font-size: calc(28px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .luxury-col-area > .title { font-size: calc(32px * var(--a11y-scale)) !important; line-height: calc(42px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .architecture-sec .sec-title { font-size: calc(44px * var(--a11y-scale)) !important; line-height: calc(48px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .inpout-living-sec .global-content-area .sec-title { font-size: calc(46px * var(--a11y-scale)) !important; line-height: calc(46px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-form-title { font-size: calc(19px * var(--a11y-scale)) !important; line-height: calc(28px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-developers { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .copyright { font-size: calc(14px * var(--a11y-scale)) !important; line-height: calc(20px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .menu-modal .menu-item > a { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(35px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .home-banner-sec .banner-slider .slide h1.title { font-size: calc(32px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area h2.title { font-size: calc(44px * var(--a11y-scale)) !important; line-height: calc(52px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area .description { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(28px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area .desc-area > .subtitle { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .review-content .review-desc { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .featured-page-title { font-size: calc(40px * var(--a11y-scale)) !important; line-height: calc(50px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .content-sec .content-sec-area p.content-desc { font-size: calc(36px * var(--a11y-scale)) !important; line-height: calc(46px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .house-gallery-pills .nav-item .nav-link { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(28px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p,
  html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p a { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
}

/* --- lp-style.css (landing page only) --- */
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-slider .slide h1.title { font-size: calc(3.5vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-banner-wrapper .note { font-size: calc(13px * var(--a11y-scale)) !important; line-height: calc(20px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper h2.title { font-size: calc(29px * var(--a11y-scale)) !important; line-height: calc(44px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper p.desc { font-size: calc(17px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .subtitle-wrapper { font-size: calc(29px * var(--a11y-scale)) !important; line-height: calc(44px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .form-title { font-size: calc(max(14px, 0.9vw) * var(--a11y-scale-form)) !important; line-height: 1.35 !important; }
html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-footer-wrapper .lp-copyright-text { font-size: calc(16px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
@media (min-width: 1680px) {
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper h2.title,
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .subtitle-wrapper h3.subtitle { font-size: calc(1.3vw * var(--a11y-scale)) !important; }
}
@media (min-width: 768px) {
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper h2.title { font-size: calc(1.1vw * var(--a11y-scale)) !important; line-height: 1.35 !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .subtitle-wrapper h3.subtitle { font-size: calc(1.1vw * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper p.desc,
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-footer-wrapper .lp-copyright-text { font-size: calc(max(14px, 0.9vw) * var(--a11y-scale)) !important; line-height: 1.5 !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .global-btn { font-size: calc(2.5vw * var(--a11y-scale)) !important; line-height: calc(4vh * var(--a11y-scale)) !important; }
}
@media (max-width: 767px) {
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper h2.title { font-size: calc(28px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper p.desc { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(28px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .subtitle-wrapper h3.subtitle { font-size: calc(22px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-slider .slide h1.title { font-size: calc(38px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
  html body[class*="pojo-a11y-resize-font-"]:where(.page-template-template-landing):not(#a11y-x) .lp-content-wrapper .form-title { font-size: calc(19px * var(--a11y-scale-form)) !important; line-height: 1.45 !important; }
}

/* --- rtlstyle.css (Hebrew pages, loaded last by custom.js) --- */
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-btn { font-size: calc(38px * var(--a11y-scale)) !important; line-height: calc(38px * var(--a11y-scale)) !important; }
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .menu-modal .menu-item > a { font-size: calc(28px * var(--a11y-scale)) !important; line-height: calc(34px * var(--a11y-scale)) !important; }
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) p,
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .review-bottom-content,
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area .description { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p,
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .contact-details li p a { font-size: calc(22px * var(--a11y-scale)) !important; }
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-form-title { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(38px * var(--a11y-scale)) !important; }
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .house-slide .house-name,
html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .house-gallery-pills .nav-item .nav-link { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
@media (max-width: 767px) {
  html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .banner-title-area h2.title { font-size: calc(40px * var(--a11y-scale)) !important; line-height: calc(50px * var(--a11y-scale)) !important; }
  html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .menu-modal .menu-item > a { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .global-content-area .title-area .global-btn.transparent-btn { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
  html:where([dir="rtl"]) body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-form-title { font-size: calc(28px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
  /* rtlstyle.css keeps p at 20px on mobile too (it has no mobile p rule) */
}

/* the toolbar title is a <p>: keep it on the toolbar curve (after the generic p rules),
   starting from its normal size - theme p: 21px desktop / 16px mobile, Hebrew 20px */
/* capped at 23px: above that "Accessibility" no longer fits the 178px panel */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar p.pojo-a11y-toolbar-title {
    font-size: min(calc(21px * var(--a11y-scale-toolbar)), 23px) !important;
    line-height: 1.6 !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar p.pojo-a11y-toolbar-title {
        font-size: min(calc(16px * var(--a11y-scale-toolbar)), 23px) !important;
    }
}
html[dir="rtl"] body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar p.pojo-a11y-toolbar-title {
    font-size: min(calc(20px * var(--a11y-scale-toolbar)), 23px) !important;
}
/* The closed toolbar panel is parked just off-screen to the left; anything wider
   than the panel (enlarged title text) peeked out next to the toggle button.
   Clip horizontal overflow of the panel while text is enlarged. */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay {
    overflow-x: clip !important;
}

/* Header menu (hamburger) with enlarged text: its longest word ("ARCHITECTURE",
   ≈ 7.9em in this font) became wider than the link column -> sideways scroll.
   The link list becomes a size container and the link size is capped to what
   fits its width; no horizontal scroll inside the menu. */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .link-col ul.navbar-nav {
    container-type: inline-size;
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-modal .menu-item > a,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-item > a {
    font-size: min(calc(38px * var(--a11y-scale)), 12.5cqi) !important;
    line-height: 1.15 !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-item > a {
        font-size: min(calc(26px * var(--a11y-scale)), 12.5cqi) !important;
    }
}
html[dir="rtl"] body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-item > a {
    font-size: min(calc(28px * var(--a11y-scale)), 12.5cqi) !important;
}
@media (max-width: 767px) {
    html[dir="rtl"] body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-item > a {
        font-size: min(calc(24px * var(--a11y-scale)), 12.5cqi) !important;
    }
}
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal,
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .modal-body {
    overflow-x: hidden !important;
}
/* Desktop: the 35% link column only fits the normal 38px links, so with enlarged
   text the columns become 50/50 - the links can grow (38 -> ~61px at 1366px).
   The photo carousel re-measures itself (script in functions.php). */
@media (min-width: 768px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-modal-row .link-col {
        width: 50% !important;
        flex: 0 0 50% !important;
    }
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) #navbarModal .menu-modal-row .img-col {
        width: 50% !important;
        flex: 0 0 50% !important;
        overflow: hidden;
    }
}

/* Home banner slider on phones: the slide is only 240px tall and the title
   starts at 120px, so there is room for two lines above the dots. Enlarged,
   it wrapped to 3 lines and ran out of the slider - cap it at 38px. */
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .home-banner-sec .banner-slider .slide h1.title {
        font-size: min(calc(32px * var(--a11y-scale)), 38px) !important;
        line-height: 1.05 !important;
    }
}

/* Footer copyright text is the last thing on the page, so with enlarged text
   its last lines stayed under the fixed WhatsApp button / reCAPTCHA badge
   (bottom-right, ~140px tall together). Leave room so it can scroll clear. */
@media (max-width: 1199px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) .footer-sec .copyright-container {
        padding-bottom: 150px !important;
    }
}

/* ---------------------------------------------------------------------
   Section 6: nothing enlarged may be cropped / hidden.
   Long single words (e.g. "COMMUNITY") may break instead of overflowing.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) :is(h1, h2, h3, h4, h5, h6, p, li, a, .title, .sec-title, .description, .subtitle) {
    overflow-wrap: break-word;
    hyphens: manual;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) > :where(:not(#pojo-a11y-toolbar)) :is(h1, h2, .sec-title, .title) {
        overflow-wrap: anywhere;
    }
}
/* banner areas with a fixed min-height grow with their text instead of clipping it */
html body[class*="pojo-a11y-resize-font-"]:not(#a11y-x) :is(.luxury-banner-sec, .banner-title-area) {
    height: auto !important;
}


/* =====================================================================
   CONTRAST MODES
   ===================================================================== */

/* 7a. Checkbox tick visible inside the box in every mode
   (the theme draws the tick with input[type="checkbox"]:checked::after) */
body.pojo-a11y-high-contrast:not(#a11y-x) input[type="checkbox"],
body.pojo-a11y-negative-contrast:not(#a11y-x) input[type="checkbox"] {
    background: #000 !important;
    border: 1px solid #fff !important;
}
body.pojo-a11y-high-contrast:not(#a11y-x) input[type="checkbox"]:checked::after,
body.pojo-a11y-negative-contrast:not(#a11y-x) input[type="checkbox"]:checked::after {
    color: #fff !important;
    background: transparent !important;
}
body.pojo-a11y-light-background:not(#a11y-x) input[type="checkbox"] {
    background: #fff !important;
    border: 1px solid #000 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) input[type="checkbox"]:checked::after {
    color: #000 !important;
    background: transparent !important;
}
body.pojo-a11y-grayscale:not(#a11y-x) input[type="checkbox"]:checked::after {
    color: #fff !important;
}

/* 7b. Section photos stay visible (restored by the inline script in functions.php,
   which adds .a11y-bg-restored). The plugin's "background: … !important"
   shorthand reset their size/position - put those back. */
body:not(#a11y-x) .bg-img.a11y-bg-restored {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
body:not(#a11y-x) .distance-sec.a11y-bg-restored {
    background-size: cover !important;
    background-position: top center !important;
    background-repeat: no-repeat !important;
}
/* containers on top of the photo get no colour; the text itself gets a backing */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .a11y-bg-restored :is(div, section, article, header, ul, ol, figure, picture, form) {
    background: transparent !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .a11y-bg-restored :is(h1, h2, h3, h4, h5, h6, p, li, blockquote, label, .title, .sec-title, .description, .subtitle, .global-btn) {
    background: #000 !important;
    color: #fff !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .a11y-bg-restored :is(h1, h2, h3, h4, h5, h6, p, li, blockquote, label, .title, .sec-title, .description, .subtitle, .global-btn) {
    background: #fff !important;
    color: #000 !important;
}
/* Banners (every page banner, home slider, location / living sections):
   the backing hugs the text instead of running the full width of the block.
   All banner text is centred, so auto side margins keep it exactly in place.
   (Driving Distance box keeps its own layout; buttons already hug their text.) */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .home-banner-sec :is(h1, h2, h3, h4, h5, h6, p, .title, .description, .subtitle) {
    background: #000 !important;
    color: #fff !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .home-banner-sec :is(h1, h2, h3, h4, h5, h6, p, .title, .description, .subtitle) {
    background: #fff !important;
    color: #000 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) :is(.a11y-bg-restored:not(.distance-sec), .luxury-banner-sec, .home-banner-sec) :is(h1, h2, h3, h4, h5, h6, p, blockquote, .title, .sec-title, .description, .subtitle):not(.global-btn) {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* the home slider title is absolutely positioned with only width:100% - pin both
   sides so the auto margins centre the narrower box in the slide */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .home-banner-sec .banner-slider .slide h1.title {
    left: 0 !important;
    right: 0 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) :is(.a11y-bg-restored, .luxury-banner-sec, .home-banner-sec) :is(h1, h2, h3, h4, h5, h6, p, .title, .description, .subtitle):empty {
    background: transparent !important;
}
/* text children of an already-backed element don't need their own box */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .a11y-bg-restored :is(h1, h2, h3, h4, h5, h6, p, li, .title, .sec-title, .description, .subtitle) :is(span, a, strong, em, b, i, br) {
    background: transparent !important;
}

/* 7a2. High contrast: page background black (the plugin left the white
   paper texture on <body>; negative contrast already does this) */
body.pojo-a11y-high-contrast:not(#a11y-x) {
    background: #000 !important;
}

/* 7a3. Phone field (intl-tel-input) in contrast modes:
   the plugin paints the dial-code overlay (+972 ▾) solid black/white, which
   covered the left part of the input's border - make it see-through - and
   wiped the flag sprite - put the flags back. */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti :is(.iti__flag-container, .iti__selected-flag, .iti__selected-dial-code, .iti__arrow) {
    background: transparent !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag {
    background-color: #dbdbdb !important;
    background-image: url("https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/img/flags.png") !important;
    background-repeat: no-repeat !important;
    background-position: 20px 0 !important;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag {
        background-image: url("https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/img/flags@2x.png") !important;
        background-size: 5652px 15px !important;
    }
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag.iti__il { background-position: -2369px 0 !important; }
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag.iti__us { background-position: -5263px 0 !important; }
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag.iti__gb { background-position: -1775px 0 !important; }
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .iti .iti__flag.iti__ca { background-position: -834px 0 !important; }

/* Driving Distance box on top of the map: solid box, no per-line backings inside */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .distance-sec .distance-box {
    background: #000 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .distance-sec .distance-box {
    background: #fff !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .distance-sec .distance-box :is(h2, ul, li, p, div, span) {
    background: transparent !important;
}

/* Decorative shading image in the page banners (3circle-overlay.png, used by all
   page templates): the plugin puts a grey/white box behind every <img>, and the
   image's own grey gradient then lay over the text boxes. In contrast modes:
   transparent background and the decorative shading hidden (it is absolutely
   positioned, so nothing else moves). */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) :is(img.luxury-banner-content-overlay, img[src*="3circle-overlay"]) {
    background: transparent !important;
    visibility: hidden !important;
}

/* Buttons keep their default look in the contrast modes: the textured SEND
   button of the forms (the plugin replaced the texture with a flat colour)
   and the hamburger menu button, which uses the same texture. */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .global-btn:not(.transparent-btn):not(#a11y-y) {
    background: url("../images/btn-bg.webp") center center / cover no-repeat !important;
    color: #fff !important;
    border: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .hamburger-btn > img:not(#a11y-y) {
    background: url("../images/btn-bg.webp") center center / cover no-repeat !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .hamburger-btn {
    background: transparent !important;
}

/* 7c. Slider dots: no background boxes, dots clearly visible in every mode */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale):not(#a11y-x) .slick-dots {
    z-index: 5 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale):not(#a11y-x) .slick-dots,
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale):not(#a11y-x) .slick-dots li,
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale):not(#a11y-x) .slick-dots li button {
    background: transparent !important;
    border: 0 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .slick-dots li button::before {
    color: #fff !important;
    opacity: 0.6 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .slick-dots li.slick-active button::before {
    color: #ff0 !important;
    opacity: 1 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .slick-dots li button::before {
    color: #000 !important;
    opacity: 0.45 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .slick-dots li.slick-active button::before {
    color: #000 !important;
    opacity: 1 !important;
}
/* image dots (.global-slider): keep the dot images, add a ring so they read on black/white */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x) .global-slider .slick-dots li button::before {
    background-color: transparent !important;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #fff !important;
    opacity: 1 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .global-slider .slick-dots li button::before {
    background-color: transparent !important;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #000 !important;
    opacity: 1 !important;
}
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x) .global-slider .slick-dots li.slick-active button::before {
    box-shadow: 0 0 0 3px #ff0 !important;
}
body.pojo-a11y-light-background:not(#a11y-x) .global-slider .slick-dots li.slick-active button::before {
    box-shadow: 0 0 0 3px #000 !important;
}


/* =====================================================================
   PROVIDED SITE CSS (added as supplied)
   ===================================================================== */
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;
}

body #cc-floater {
    bottom: unset !important;
    top: 12.5vw !important;
    left: unset !important; /* moved to the right (both languages) */
    right: 0.2vw !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;
}

@media(max-width: 767px){
    body #cc-floater{
        bottom: unset !important;
        top: 60vw !important;
        left: unset !important;
        right: 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;
    }

    .cc-banner {
            padding: 16px !important;
    }
    .cc-pos-right {
        left: 50% !important;
        right: unset !important;
        bottom: 10px !important;
        width: 95%;
        transform: translateX(-50%);
    }
    .cc-btn{
        padding: 7px 9px !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;
}
/* Toolbar icons: vertically centred on the label text (they sat on the baseline).
   Only the icon is nudged - item height and layout stay exactly the same. */
#pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a .pojo-a11y-toolbar-icon svg {
    position: relative;
    top: -0.12em;
}
/* Accessibility toolbar on the RIGHT side (English and Hebrew). The plugin is set
   to "left"; these mirror its own right-side rules: panel parked 180px off the
   right edge, slides in to right:0, toggle button attached to the panel's left. */
body #pojo-a11y-toolbar.pojo-a11y-toolbar-left {
    left: auto !important;
    right: -180px;
    -webkit-transition: right 750ms cubic-bezier(.23, 1, .32, 1);
    transition: right 750ms cubic-bezier(.23, 1, .32, 1);
}
body #pojo-a11y-toolbar.pojo-a11y-toolbar-left.pojo-a11y-toolbar-open {
    right: 0;
}
body #pojo-a11y-toolbar.pojo-a11y-toolbar-left .pojo-a11y-toolbar-toggle {
    left: auto !important;
    right: 180px;
}
/* English (LTR) pages: icon sits left of the label - gap goes on its right */
html:not([dir="rtl"]) #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a svg {
    padding-right: 6px !important;
    padding-left: 0 !important;
}