@charset "UTF-8";
/* ==========================================================================
   One Click Accessibility (Pojo) - font-resize repair layer
   Rambam / capital-platinum
   --------------------------------------------------------------------------
   EVERY rule in this file is gated behind body[class*="pojo-a11y-resize-font-"]
   or behind a Pojo contrast-mode body class. With no accessibility option
   selected - and after Reset - this file contributes nothing.
   `html body[...]` is used throughout so the layer out-specifies any
   hand-written a11y overrides that may live in the database.
   ========================================================================== */

/* ==========================================================================
   SECTION 1 - Scale curves
   --a11y-scale       general content (headings, body copy, links)
   --a11y-scale-form  form controls, buttons, messages, cookie banner
                      (they start smallest, so they need a bigger first jump)
   --a11y-scale-tb    the accessibility toolbar itself - deliberately the
                      gentlest curve, per request: toolbar text stays a little
                      smaller than everything else.
   --a11y-ctl-h       shared height token for input / select / submit so the
                      submit button and the fields are ALWAYS the same height.
                      Redefined inside every breakpoint below.
   ========================================================================== */
:root {
    --a11y-scale: 1;
    --a11y-scale-form: 1;
    --a11y-scale-tb: 1;
}
body.pojo-a11y-resize-font-130 { --a11y-scale: 1.15; --a11y-scale-form: 1.30; --a11y-scale-tb: 1.06; }
body.pojo-a11y-resize-font-140 { --a11y-scale: 1.22; --a11y-scale-form: 1.40; --a11y-scale-tb: 1.09; }
body.pojo-a11y-resize-font-150 { --a11y-scale: 1.28; --a11y-scale-form: 1.48; --a11y-scale-tb: 1.12; }
body.pojo-a11y-resize-font-160 { --a11y-scale: 1.35; --a11y-scale-form: 1.55; --a11y-scale-tb: 1.15; }
body.pojo-a11y-resize-font-170 { --a11y-scale: 1.42; --a11y-scale-form: 1.62; --a11y-scale-tb: 1.18; }
body.pojo-a11y-resize-font-180 { --a11y-scale: 1.48; --a11y-scale-form: 1.68; --a11y-scale-tb: 1.21; }
body.pojo-a11y-resize-font-190 { --a11y-scale: 1.54; --a11y-scale-form: 1.72; --a11y-scale-tb: 1.23; }
body.pojo-a11y-resize-font-200 { --a11y-scale: 1.60; --a11y-scale-form: 1.75; --a11y-scale-tb: 1.25; }

/* ==========================================================================
   SECTION 2 - Base pin on <body>
   Measured baseline on this site: body = 16px.
   Deliberately UNSCOPED (no content root) so it replaces the plugin's own
   `body { font-size: NN% }`. calc(), never a flat px, so the toolbar popup
   and everything relying on inheritance keeps moving.
   Specificity: html body[attr] (0,1,2) beats body.pojo-a11y-resize-font-NN (0,1,1).
   ========================================================================== */
html body[class*="pojo-a11y-resize-font-"] {
    font-size: calc(16px * var(--a11y-scale)) !important;
}

/* ==========================================================================
   SECTION 3 - Kill percentage compounding inside every content root.
   Content roots audited across /, /sample-page/, the single post and the
   404 template:
       .elementor            - home (post-10) and 404 (post-180)
       .description-section  - page.php / single.php (NO Elementor wrapper)
       #lightbox             - lightbox captions (a direct child of <body>)
   The cookie banner (#cc-banner-root) is also a direct child of <body> and is
   handled separately in Section 4c.
   input / select / textarea are deliberately excluded - Section 4 owns them.
   ========================================================================== */
html body[class*="pojo-a11y-resize-font-"] .elementor :is(p, li, span, label, blockquote, legend, code, pre, dd, dt, button, small, strong, em, b, i, td, th, figcaption),
html body[class*="pojo-a11y-resize-font-"] .description-section :is(p, li, span, label, blockquote, legend, code, pre, dd, dt, button, small, strong, em, b, i, td, th, figcaption),
html body[class*="pojo-a11y-resize-font-"] #lightbox :is(p, li, span, label, blockquote, legend, code, pre, dd, dt, button, small, strong, em, b, i) {
    font-size: inherit !important;
}

/* Non-Elementor pages (page.php / single.php / 404 text) carry no theme
   heading sizes at all, so the plugin's 266% compounds. Restore the normal
   UA hierarchy, scaled. */
html body[class*="pojo-a11y-resize-font-"] .description-section h1 { font-size: calc(32px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h2 { font-size: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h3 { font-size: calc(19px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h4 { font-size: calc(16px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h5 { font-size: calc(14px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section h6 { font-size: calc(12px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section :is(h1, h2, h3, h4, h5, h6) span { font-size: inherit !important; }
html body[class*="pojo-a11y-resize-font-"] .description-section .call-btn { font-size: calc(16px * var(--a11y-scale-form)) !important; }

/* ==========================================================================
   SECTION 4 - Form controls, messages and validation.
   One rule per selector PER BREAKPOINT, mirroring the theme 1:1, in the
   theme's own source order. px / vw only - never em (CF7 nests
   p > span.wpcf7-form-control-wrap > input, and em would compound) and never
   rem (rem shrinks once the body pin is in play).
   `max(<floor>, <themeValue>)` is the readability floor: a vw-sized message
   renders ~7px on a 900px-wide tablet. Gated, so the default render is
   untouched.
   --------------------------------------------------------------------------
   EQUAL HEIGHTS: input, select and submit all take the same --a11y-ctl-h,
   with vertical padding zeroed and line-height:normal. Native form controls
   centre their text vertically inside an explicit height, so the fields and
   the submit button end up identical on every device, and the box grows with
   the font instead of clipping it.
   ========================================================================== */

/* ---- base (no media query) ---------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] {
    --a11y-ctl-h: calc(max(16px, 1.2vw) * var(--a11y-scale-form) * 1.5 + 1.6vh);
}
html body[class*="pojo-a11y-resize-font-"] .field-col label .wpcf7-form-control-wrap,
html body[class*="pojo-a11y-resize-font-"] .field-col input,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-select {
    font-size: calc(max(14px, 1vw) * var(--a11y-scale-form)) !important;
    line-height: normal !important;
}
html body[class*="pojo-a11y-resize-font-"] .submit-btn input,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-submit,
html body[class*="pojo-a11y-resize-font-"] .submit-col .global-btn {
    font-size: calc(max(16px, 1.2vw) * var(--a11y-scale-form)) !important;
    line-height: normal !important;
}
/* the shared box - this is what makes field height == submit height */
html body[class*="pojo-a11y-resize-font-"] .field-col input,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-select,
html body[class*="pojo-a11y-resize-font-"] .submit-btn input,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-submit {
    height: var(--a11y-ctl-h) !important;
    min-height: var(--a11y-ctl-h) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: normal !important;
    box-sizing: border-box !important;
}
html body[class*="pojo-a11y-resize-font-"] .submit-btn > p { height: auto !important; }
html body[class*="pojo-a11y-resize-font-"] .submit-btn input::before {
    font-size: calc(22px * var(--a11y-scale-form)) !important;
}
/* response output - theme line-height is 1.8vh (viewport-locked, never grows) */
html body[class*="pojo-a11y-resize-font-"] .wpcf7-response-output,
html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.sent .wpcf7-response-output,
html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.failed .wpcf7-response-output,
html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.aborted .wpcf7-response-output,
html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.invalid .wpcf7-response-output {
    font-size: calc(max(14px, 0.9vw) * var(--a11y-scale-form)) !important;
    line-height: 1.4 !important;
    height: auto !important;
}
/* validation tip - theme line-height is 1.5vh (viewport-locked). Forced onto
   ONE line: unitless line-height, nowrap, and the gentler --a11y-scale curve
   so the message can never outgrow the field it sits under. */
html body[class*="pojo-a11y-resize-font-"] .wpcf7-not-valid-tip,
html body[class*="pojo-a11y-resize-font-"] .checkbox-group .wpcf7-not-valid-tip {
    font-size: calc(max(12px, 0.7vw) * var(--a11y-scale)) !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    width: -moz-max-content !important;
    width: max-content !important;
    max-width: 100% !important;
    height: auto !important;
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    margin-top: 0.4em !important;
    margin-bottom: 0 !important;
}

/* ---- SECTION 4b - elements with an intentional size of their own --------- */
html body[class*="pojo-a11y-resize-font-"] .field-col label > span:first-child { font-size: calc(25px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .contact-form .form-heading         { font-size: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .field-col label input              { font-size: calc(22px * var(--a11y-scale-form)) !important; }
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label,
html body[class*="pojo-a11y-resize-font-"] .form-order form .wpcf7-list-item-label { font-size: calc(max(12px, 0.7vw) * var(--a11y-scale)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"] .simple-text p,
html body[class*="pojo-a11y-resize-font-"] .form-order form p                  { font-size: calc(max(13px, 0.77vw) * var(--a11y-scale)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"] .medium-fonts                       { font-size: calc(1.5vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .currency-sign                      { font-size: calc(1.1vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .global-btn                         { font-size: calc(24px * var(--a11y-scale-form)) !important; line-height: 1.2 !important; height: auto !important; }
html body[class*="pojo-a11y-resize-font-"] .bottom-small-text,
html body[class*="pojo-a11y-resize-font-"] .success-title,
html body[class*="pojo-a11y-resize-font-"] .success-subtitle                   { font-size: calc(max(13px, 1vw) * var(--a11y-scale)) !important; line-height: 1.4 !important; }

/* :where() carries ZERO specificity - the theme's
   `.privacy-wrapper .privacy-content :where(p,li,a,div)` and
   `.form-order form :where(p,.wpcf7-list-item-label)` would be flattened by
   Section 3. Restated explicitly here. */
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h2 { font-size: calc(1.4vw * var(--a11y-scale)) !important; line-height: 1.4 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h3 { font-size: calc(1.1vw * var(--a11y-scale)) !important; line-height: 1.4 !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content p,
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content li,
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content a,
html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content div { font-size: calc(max(13px, 0.8vw) * var(--a11y-scale)) !important; line-height: 1.6 !important; }
html body[class*="pojo-a11y-resize-font-"] .pv-links > span,
html body[class*="pojo-a11y-resize-font-"] .pv-link                             { font-size: calc(max(13px, 0.8vw) * var(--a11y-scale)) !important; line-height: 1.3 !important; }

/* ---- checkbox box + check mark ------------------------------------------
   The theme sizes the box `width:1.3vw; height:1.1em`. `1.1em` tracks the
   plugin's inflated input font-size (measured 2048px at step 200), so the box
   turns into a tall sliver while the tick - a fixed 0.8vw x 1.6vh block -
   drifts out of it. Square the box off the form curve and express the tick as
   a percentage of the box, so it is always centred inside, at every step. */
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"] {
    width: calc(max(16px, 1.3vw) * var(--a11y-scale-form)) !important;
    min-width: calc(max(16px, 1.3vw) * var(--a11y-scale-form)) !important;
    height: calc(max(16px, 1.3vw) * var(--a11y-scale-form)) !important;
    top: 0 !important;
    margin-top: 0 !important;
    border-radius: 3px !important;
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
}
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"]:checked::before {
    width: 58% !important;
    height: 58% !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 2px !important;
}
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox label {
    align-items: flex-start !important;
    padding-right: calc(max(16px, 1.3vw) * var(--a11y-scale-form) + 10px) !important;
}

/* ==========================================================================
   SECTION 4c - Cookie banner (#cc-banner-root).
   The banner is injected by JS as a direct child of <body>, OUTSIDE
   .elementor, so Section 3 cannot reach it. Audited: `.cc-btn` is
   `font-size:inherit` and `.cc-root` is a plain <div>, so both freeze at 14px,
   while `.cc-title` (an <h2>) and `.cc-body` (a <p>) run away
   (measured: title 16 -> 37.2px, body 14 -> 28px, buttons stuck at 14px).
   Generic inherit rule first, then explicit pins - each pin gets a bare AND a
   .cc-root-scoped selector, and EVERY pin is a calc() so nothing freezes.
   .cc-title / .cc-btn use the form curve on bumped baselines (16->18, 14->15)
   so the first click is a visible jump.
   Specificity note: `html body[attr] .cc-root .cc-body` is (0,3,2) and beats
   `html body[attr] .cc-root p` (0,2,3) - the class column compares first.
   ========================================================================== */
html body[class*="pojo-a11y-resize-font-"] .cc-root :is(p, li, span, label, a, div, button, strong, em, small, summary) {
    font-size: inherit !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-root,
html body[class*="pojo-a11y-resize-font-"] #cc-banner-root {
    font-size: calc(14px * var(--a11y-scale)) !important;
    line-height: 1.5 !important;
}
/* .cc-root is a shrink-to-fit fixed box capped at max-width:420px, so once the
   text grows its max-content width exceeds a phone viewport and the banner is
   drawn off the left edge (measured: 355px -> 420px on a 375px screen at step
   200, which hides the "settings" button). Keep it inside the viewport, let
   the action row wrap, and stop long Hebrew strings forcing the width. */
html body[class*="pojo-a11y-resize-font-"] .cc-root,
html body[class*="pojo-a11y-resize-font-"] #cc-banner-root,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-banner,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-modal {
    max-width: calc(100vw - 20px) !important;
    box-sizing: border-box !important;
    overflow-wrap: break-word !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-actions {
    flex-wrap: wrap !important;
}
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;
    height: auto !important;
}
html body[class*="pojo-a11y-resize-font-"] .cc-btn.cc-btn-text,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-btn.cc-btn-text {
    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-head h2,
html body[class*="pojo-a11y-resize-font-"] .cc-root .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-root .cc-modal-close       { font-size: calc(24px * var(--a11y-scale)) !important; line-height: 1 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-cat-name,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-cat-name          { font-size: calc(14px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-cat-desc,
html body[class*="pojo-a11y-resize-font-"] .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-"] .cc-required-badge,
html body[class*="pojo-a11y-resize-font-"] .cc-root .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-root .cc-cookies-list      { font-size: calc(12px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list th,
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list td,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-cookies-list th,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-cookies-list td   { font-size: calc(12px * var(--a11y-scale)) !important; line-height: 1.5 !important; }

/* ==========================================================================
   SECTION 4d - Validation-tip anchoring.
   Audited on this theme: every .wpcf7-not-valid-tip is `position:relative`
   and stays in flow - there is no fixed-px `top` to un-anchor here. The rules
   below are defensive: they restate the auto-tracking anchor explicitly (so
   they hold without :has() support) and never fall back to position:static -
   the CF7 wrap is ~30px wide and static would squeeze the message into a
   vertical column.
   ========================================================================== */
html body[class*="pojo-a11y-resize-font-"] .wpcf7-form-control-wrap > .wpcf7-not-valid-tip,
html body[class*="pojo-a11y-resize-font-"] .checkbox-group .wpcf7-form-control-wrap > .wpcf7-not-valid-tip {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    inset-inline: auto !important;
}

/* ==========================================================================
   SECTION 4e - Accessibility toolbar (#pojo-a11y-toolbar).
   The toolbar is a SIBLING of .elementor, so nothing above reaches it.
   Per request its own text rides the gentlest curve (--a11y-scale-tb), so the
   menu stays a little smaller than the page content: item text goes
   12.8px -> 16px at step 200 instead of the plugin's 25.6px.
   The toggle button and its icon are left completely alone.
   ========================================================================== */
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,
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 .pojo-a11y-toolbar-text {
    font-size: calc(12.8px * var(--a11y-scale-tb)) !important;
    line-height: 1.3 !important;
}
html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay p.pojo-a11y-toolbar-title {
    font-size: calc(15px * var(--a11y-scale-tb)) !important;
}

/* ==========================================================================
   SECTION 5 - Every theme / Elementor font-size, gated and scaled.
   Base values first, then each source @media block in the theme's own order.
   Values mirror the stylesheets 1:1; only the multiplier is added.
   Elementor buttons ride the form curve.
   ========================================================================== */

/* ---- post-10.css :: base (vw) ------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-7b2634e .elementor-heading-title,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-9c6eecd .elementor-icon-list-item > .elementor-icon-list-text,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-9c6eecd .elementor-icon-list-item > a { font-size: calc(max(12px, 0.7vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-164d0a7 .elementor-heading-title { font-size: calc(2vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-3c9ccdc .elementor-heading-title { font-size: calc(3.5vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-67bfd4e .elementor-heading-title,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-dd07fa0 .elementor-heading-title,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-4e624d3 .elementor-heading-title,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-62c7e7e .elementor-heading-title { font-size: calc(max(13px, 1vw) * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-52f0231 .elementor-heading-title,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-8a34bbc .elementor-heading-title { font-size: calc(1.5vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-e927890 .elementor-heading-title { font-size: calc(1.1vw * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-b822392 .elementor-button,
html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-88b2f20 .elementor-button,
html body[class*="pojo-a11y-resize-font-"] .elementor-180 .elementor-element.elementor-element-ebd5360 .elementor-button { font-size: calc(max(14px, 1.23vw) * var(--a11y-scale-form)) !important; line-height: 1.2 !important; }

/* headings must not be re-inflated by the plugin's `h1 span ... h6 span` rule */
html body[class*="pojo-a11y-resize-font-"] .elementor .elementor-heading-title span,
html body[class*="pojo-a11y-resize-font-"] .elementor .elementor-button .elementor-button-text,
html body[class*="pojo-a11y-resize-font-"] .elementor .elementor-icon-list-text span { font-size: inherit !important; }

/* ---- theme-responsive.css :: @media (min-width:1025px) and (max-width:1440px) */
@media (min-width: 1025px) and (max-width: 1440px) {
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label { line-height: 1.5 !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"] {
        height: calc(max(16px, 1.3vw) * var(--a11y-scale-form)) !important;
        top: 0 !important;
    }
}

/* ---- theme-responsive.css :: @media (min-width:768px) and (max-width:1080px) */
@media (min-width: 768px) and (max-width: 1080px) {
    html body[class*="pojo-a11y-resize-font-"] {
        --a11y-ctl-h: calc(max(15px, 1.5vw) * var(--a11y-scale-form) * 1.6 + 6px);
    }
    html body[class*="pojo-a11y-resize-font-"] .field-col label .wpcf7-form-control-wrap,
    html body[class*="pojo-a11y-resize-font-"] .field-col input,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-select { font-size: calc(max(14px, 1.5vw) * var(--a11y-scale-form)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .submit-btn input,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-submit { font-size: calc(max(15px, 1.5vw) * var(--a11y-scale-form)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label,
    html body[class*="pojo-a11y-resize-font-"] .simple-text p { font-size: calc(max(13px, 1vw) * var(--a11y-scale)) !important; line-height: 1.4 !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-not-valid-tip,
    html body[class*="pojo-a11y-resize-font-"] .checkbox-group .wpcf7-not-valid-tip { font-size: calc(max(12px, 1vw) * var(--a11y-scale)) !important; line-height: 1.2 !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.sent .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.failed .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.aborted .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.invalid .wpcf7-response-output { font-size: calc(max(14px, 1vw) * var(--a11y-scale-form)) !important; line-height: 1.3 !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"] {
        width: calc(15px * var(--a11y-scale-form)) !important;
        min-width: calc(15px * var(--a11y-scale-form)) !important;
        height: calc(15px * var(--a11y-scale-form)) !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox label { padding-right: calc(15px * var(--a11y-scale-form) + 10px) !important; }
}

/* ---- post-10.css / post-180.css :: @media(max-width:1024px) -------------- */
@media (max-width: 1024px) {
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-b822392 .elementor-button,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-88b2f20 .elementor-button,
    html body[class*="pojo-a11y-resize-font-"] .elementor-180 .elementor-element.elementor-element-ebd5360 .elementor-button { font-size: calc(max(14px, 2.4vw) * var(--a11y-scale-form)) !important; line-height: 1.1 !important; }
}

/* ---- post-10.css + theme-responsive.css :: @media(max-width:767px) ------- */
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"] {
        --a11y-ctl-h: calc(22px * var(--a11y-scale-form) * 1.3 + 12px);
    }
    /* Elementor headings - px on mobile where the base was vw. Both are
       emitted, or overriding one destroys the other. */
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-7b2634e .elementor-heading-title { font-size: calc(13px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-164d0a7 .elementor-heading-title,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-e927890 .elementor-heading-title { font-size: calc(25px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-3c9ccdc .elementor-heading-title { font-size: calc(43px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-67bfd4e .elementor-heading-title { font-size: calc(14px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-52f0231 .elementor-heading-title,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-8a34bbc .elementor-heading-title { font-size: calc(20px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-dd07fa0 .elementor-heading-title,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-4e624d3 .elementor-heading-title,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-62c7e7e .elementor-heading-title { font-size: calc(12px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-3548e4d .elementor-heading-title { font-size: calc(50px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-9c6eecd .elementor-icon-list-item > .elementor-icon-list-text,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-9c6eecd .elementor-icon-list-item > a { font-size: calc(14px * var(--a11y-scale)) !important; line-height: 1.5 !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-b822392 .elementor-button,
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-88b2f20 .elementor-button,
    html body[class*="pojo-a11y-resize-font-"] .elementor-180 .elementor-element.elementor-element-ebd5360 .elementor-button { font-size: calc(max(15px, 4.6vw) * var(--a11y-scale-form)) !important; line-height: 1.1 !important; }

    /* privacy modal */
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h2 { font-size: calc(18px * var(--a11y-scale)) !important; line-height: 1.25 !important; }
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h3 { font-size: calc(16px * var(--a11y-scale)) !important; line-height: 1.35 !important; }
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content p,
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content li,
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content a,
    html body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content div { font-size: calc(12px * var(--a11y-scale)) !important; line-height: 1.65 !important; }
    html body[class*="pojo-a11y-resize-font-"] .pv-link,
    html body[class*="pojo-a11y-resize-font-"] .pv-links > span { font-size: calc(14px * var(--a11y-scale)) !important; }

    /* form */
    html body[class*="pojo-a11y-resize-font-"] .field-col label .wpcf7-form-control-wrap,
    html body[class*="pojo-a11y-resize-font-"] .field-col input,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-select { font-size: calc(16px * var(--a11y-scale-form)) !important; line-height: normal !important; }
    html body[class*="pojo-a11y-resize-font-"] .submit-btn input,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-submit { font-size: calc(22px * var(--a11y-scale-form)) !important; line-height: normal !important; }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.sent .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.failed .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.aborted .wpcf7-response-output,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7 form.invalid .wpcf7-response-output { font-size: calc(14px * var(--a11y-scale-form)) !important; line-height: 1.4 !important; }
    html body[class*="pojo-a11y-resize-font-"] .form-order form p,
    html body[class*="pojo-a11y-resize-font-"] .simple-text p { font-size: calc(13px * var(--a11y-scale)) !important; line-height: 1.45 !important; }
    html body[class*="pojo-a11y-resize-font-"] .form-order form .wpcf7-list-item-label,
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label { font-size: calc(12px * var(--a11y-scale)) !important; line-height: 1.45 !important; }
    /* the theme drags the tip up with margin:-11px; as the tip grows that
       would pull it over the field above, so re-anchor it below the control. */
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-not-valid-tip,
    html body[class*="pojo-a11y-resize-font-"] .checkbox-group .wpcf7-not-valid-tip {
        font-size: calc(14px * var(--a11y-scale)) !important;
        line-height: 1.35 !important;
        margin: 2px 0 4px 0 !important;
        white-space: nowrap !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"] {
        width: calc(22px * var(--a11y-scale-form)) !important;
        min-width: calc(22px * var(--a11y-scale-form)) !important;
        height: calc(22px * var(--a11y-scale-form)) !important;
        margin-top: 0 !important;
        border-radius: 5px !important;
    }
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox label { padding-right: calc(22px * var(--a11y-scale-form) + 8px) !important; }
    html body[class*="pojo-a11y-resize-font-"] .medium-fonts   { font-size: calc(24px * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .currency-sign  { font-size: calc(20px * var(--a11y-scale)) !important; }
}

/* ---- post-10.css :: @media(min-width:2400px) ---------------------------- */
@media (min-width: 2400px) {
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-164d0a7 .elementor-heading-title { font-size: calc(1.8vw * var(--a11y-scale)) !important; }
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-3c9ccdc .elementor-heading-title { font-size: calc(3.2vw * var(--a11y-scale)) !important; }
}
/* ---- theme-responsive.css :: @media(min-width:2500px) ------------------- */
@media (min-width: 2500px) {
    html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox input[type="checkbox"] {
        height: calc(max(16px, 1.3vw) * var(--a11y-scale-form)) !important;
    }
}

/* ==========================================================================
   SECTION 6 - Contrast modes: keep the checkbox tick visible and inside the
   box. Gated on the contrast-mode body classes, not on font size, so they
   apply whether or not the text has been resized - and still contribute
   nothing when no accessibility option is selected.

   Why it breaks: the tick is `.wpcf7-checkbox input:checked::before` with
   `background-color:#fff`. Pojo's mode rules target `*` (and long element
   lists), which never match a ::before, so in Light mode the plugin paints
   the box white and leaves the tick white - an invisible tick on a white box.
   Each mode below pins box, border and tick together.
   ========================================================================== */
html body.pojo-a11y-light-background .wpcf7-checkbox input[type="checkbox"] {
    background: #fff !important;
    background-color: #fff !important;
    border: 2px solid #000 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
html body.pojo-a11y-light-background .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background: #000 !important;
    background-color: #000 !important;
}

html body.pojo-a11y-high-contrast .wpcf7-checkbox input[type="checkbox"] {
    background: #000 !important;
    background-color: #000 !important;
    border: 2px solid #fff !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
html body.pojo-a11y-high-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background: #ff0 !important;
    background-color: #ff0 !important;
}

html body.pojo-a11y-negative-contrast .wpcf7-checkbox input[type="checkbox"] {
    background: #000 !important;
    background-color: #000 !important;
    border: 2px solid #fff !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
html body.pojo-a11y-negative-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background: #ff0 !important;
    background-color: #ff0 !important;
}

/* Grayscale only applies a filter, so the tick has to survive as a luminance
   difference, not a hue difference. */
html body.pojo-a11y-grayscale .wpcf7-checkbox input[type="checkbox"] {
    background: transparent !important;
    border: 2px solid #fff !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
html body.pojo-a11y-grayscale .wpcf7-checkbox input[type="checkbox"]:checked::before {
    background: #fff !important;
    background-color: #fff !important;
}

/* In every contrast mode the tick must sit inside the box even when the text
   has NOT been resized - the theme's 0.8vw x 1.6vh tick drifts on tall
   viewports. Percentages of the box are always centred. */
html body.pojo-a11y-light-background .wpcf7-checkbox input[type="checkbox"]:checked::before,
html body.pojo-a11y-high-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before,
html body.pojo-a11y-negative-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before,
html body.pojo-a11y-grayscale .wpcf7-checkbox input[type="checkbox"]:checked::before {
    width: 58% !important;
    height: 58% !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 2px !important;
}

/* ==========================================================================
   SECTION 6b - High contrast resizes form images.

   The plugin ships a hard-coded hack aimed at Google's UI icons:

       body.pojo-a11y-high-contrast img[width="18"][height="18"]
           { height:18px !important; width:18px !important }

   It matches on the HTML width/height ATTRIBUTES, so it hits any image the
   theme scales with CSS. Two images in the contact form carry width="18"
   height="18" and get clamped to 18px in high contrast only (measured at
   1280px, high contrast vs every other mode):

       .side-logo img   (white-cp-svg-logo.svg)    30px  -> 18px   [shrinks]
       .submit-btn img  (double-left-black.png)   12.8px -> 18px   [grows]

   Restore the theme's own sizing. The plugin's selector is (0,3,2), so the
   [width][height] attribute pair is needed here to reach (0,4,3) and win -
   !important alone does not, because the class column is compared first.
   Values mirror the theme 1:1, per breakpoint. High contrast only; the other
   three modes leave both images alone.
   ========================================================================== */
html body.pojo-a11y-high-contrast .side-logo img[width][height] {
    width: 100% !important;
    height: auto !important;
}
/* NOTE on height: the theme writes `height:2.5vh` on .submit-btn img in the
   768-1080 band, but Elementor's `.elementor img { height:auto }` has equal
   specificity and loads later, so the EFFECTIVE height is auto at every
   breakpoint (verified: 12.8x12.8 at 1280, 9x9 at 900, 18x18 at 454).
   Mirror the effective value, not the source declaration - restating 2.5vh
   here stretched the arrow to 9x20. */
html body.pojo-a11y-high-contrast .submit-btn img[width][height] {
    width: 1vw !important;
    height: auto !important;
}
@media (max-width: 767px) {
    html body.pojo-a11y-high-contrast .submit-btn img[width][height] {
        width: 18px !important;
        height: auto !important;
    }
}

/* ==========================================================================
   SECTION 7 - Overflow containment.

   Two things spill outside their container once the text grows. Both were
   measured on the home page at step 200.

   (a) THE CONSENT ROW. The chain
       .checkbox-group > p > .wpcf7-form-control-wrap > .wpcf7-checkbox >
       .wpcf7-list-item > label > .wpcf7-list-item-label
       is nested flexboxes. Flex items default to `min-width:auto`, which
       refuses to shrink below the content's min-content width, so the <p>
       stayed 348.9px wide inside a 337.5px parent and the Hebrew consent text
       painted 11.4px past the left edge of the green panel. `min-width:0`
       lets the chain shrink so the text simply wraps one line earlier.

   (b) A DISPLAY HEADING THAT IS ONE LONG WORD. "imagination" at
       43px x 1.60 = 68.8px needs 439px of line but only has 360px, so it
       overflowed by 79px on both sides. A single word cannot wrap, so the
       size itself has to be bounded: min() lets it grow while the viewport
       allows, and stops exactly where the word still fits on one line
       (measured 390px -> 52.65px on one line, no overflow; at 320px the word
       already fills the line at its base size, so it holds at 43.2px).
       overflow-wrap is the safety net for any other long word, and never
       fires while the text fits.
   ========================================================================== */
html body[class*="pojo-a11y-resize-font-"] .checkbox-group > p,
html body[class*="pojo-a11y-resize-font-"] .checkbox-group .wpcf7-form-control-wrap,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox label,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label {
    min-width: 0 !important;
    max-width: 100% !important;
}
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label,
html body[class*="pojo-a11y-resize-font-"] .simple-text p,
html body[class*="pojo-a11y-resize-font-"] .wpcf7-response-output,
html body[class*="pojo-a11y-resize-font-"] .elementor .elementor-heading-title {
    overflow-wrap: break-word !important;
}
@media (max-width: 767px) {
    html body[class*="pojo-a11y-resize-font-"] .elementor-10 .elementor-element.elementor-element-3c9ccdc .elementor-heading-title {
        font-size: min(calc(43px * var(--a11y-scale)), 13.5vw) !important;
    }
}
